/* Water from ice: this stop's own drawings (05-17 sections.water). Shared looks are in living/explain.css. */
.dig { display: grid; grid-template-columns: minmax(0, 420px) minmax(0, 1fr); gap: 30px; align-items: start; }
.dig > svg { width: 100%; height: auto; touch-action: none; user-select: none; border-radius: 16px; background: #1A1418; cursor: ns-resize; }
.dig .handle { cursor: grab; }
.dig .handle:focus-visible { outline: none; }
.dig .handle:focus-visible circle.hit { stroke: #FFE2C8; stroke-width: 3; }
.readout { position: sticky; top: 90px; display: grid; gap: 14px; }
.readout .depth { display: flex; align-items: baseline; gap: 10px; }
.layers { display: grid; gap: 10px; }
.layer { display: grid; grid-template-columns: 14px minmax(0, 1fr); gap: 4px 12px; padding: 14px 16px; border-radius: 14px; border: 1px solid var(--rule); background: #FBF8F3; transition: border-color 0.35s, background 0.35s, transform 0.35s; }
.layer i { grid-row: span 2; width: 14px; height: 14px; margin-top: 3px; border-radius: 4px; }
.layer b { font: 700 18px/1.1 var(--wum-display); text-transform: uppercase; }
.layer span { font-size: 14px; line-height: 1.45; color: var(--muted); }
.layer.on { border-color: var(--ink); background: #fff; transform: translateX(4px); }
.wellnote { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border-radius: 14px; background: #E7F0F8; color: #18344F; font-size: 14.5px; line-height: 1.45; opacity: 0.35; transition: opacity 0.5s; }
.wellnote.on { opacity: 1; }
.wellnote .ico { font-size: 22px; color: var(--ice); margin-top: 1px; }
.edots canvas { width: 100%; height: auto; aspect-ratio: 3 / 1; display: block; }
.ekey { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-top: 12px; font-size: 14px; }
.ekey span { display: inline-flex; align-items: center; gap: 8px; }
.ekey i { width: 12px; height: 12px; border-radius: 50%; }
.ekey i.lift { background: #7CC8FF; } .ekey i.melt { background: #FF946B; }
@media (max-width: 960px) {
  .dig { grid-template-columns: minmax(0, 1fr); }
  .readout { position: static; }
}