.water-search{align-items:end;gap:var(--space-3);margin-bottom:var(--space-6);padding:var(--space-5);border:1px solid var(--border);border-radius:var(--radius-lg);background:linear-gradient(135deg, color-mix(in srgb, var(--surface-2) 88%, var(--brand-cyan)), var(--surface-1) 58%);box-shadow:var(--shadow-1);grid-template-columns:minmax(0,1fr) auto auto;display:grid}.water-search label{color:var(--cyan-text);grid-column:1/-1}.water-search input{background:color-mix(in srgb, var(--surface-1) 92%, transparent)}.water-list,.water-grid{gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr));display:grid}.water-list{margin-top:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(min(100%,22rem),1fr))}.water-section{margin-block:var(--space-8);padding-top:var(--space-5);border-top:1px solid var(--border)}.water-section>h2{align-items:center;gap:var(--space-3);margin-bottom:var(--space-5);font-size:clamp(1.25rem,1.1rem + .8vw,1.65rem);display:flex}.water-section>h2:before{border:2px solid var(--brand-cyan);content:"";border-radius:50%;width:.45rem;height:.45rem}.water-section>.tool-link{margin-bottom:var(--space-3)}.water-reading,.water-forecast,.water-alert{padding:var(--space-5);border:1px solid var(--border);border-radius:var(--radius);background:var(--surface-1);box-shadow:var(--shadow-1);min-width:0;position:relative}.water-reading{border-top:3px solid color-mix(in srgb, var(--brand-cyan) 65%, var(--border))}.water-reading h3,.water-forecast h3{margin-bottom:var(--space-2);font-size:var(--text-base)}.water-value{margin-top:var(--space-4);margin-bottom:var(--space-2);font-family:var(--font-mono);letter-spacing:-.045em;color:var(--ink);font-size:clamp(1.65rem,1.3rem + 1.5vw,2.4rem);font-weight:750;line-height:1.1}.water-note,.water-source,.water-meta{color:var(--ink-muted);font-size:var(--text-sm);overflow-wrap:anywhere;line-height:1.5}.water-note{margin-bottom:var(--space-3)}.water-source{margin:var(--space-4) 0 0;padding-top:var(--space-3);border-top:1px solid var(--border);font-size:var(--text-xs)}.water-source a{font-weight:700}.water-meta{align-items:center;gap:var(--space-2);margin:0 0 var(--space-5);padding:var(--space-3) var(--space-4);border-left:3px solid var(--brand-cyan);background:color-mix(in srgb, var(--surface-2) 80%, transparent);flex-wrap:wrap;display:flex}.water-badge{border:1px solid var(--border-strong);border-radius:var(--radius-pill);background:var(--surface-3);width:fit-content;min-height:1.6rem;color:var(--ink);font-size:var(--text-xs);letter-spacing:.055em;text-transform:uppercase;white-space:nowrap;align-items:center;padding:.2em .55em;font-weight:750;line-height:1.1;display:inline-flex}.water-badge--current,.water-badge[class~=water-badge--Live]{border-color:color-mix(in srgb, var(--ok) 65%, var(--border));background:var(--ok-bg)}.water-badge--stale,.water-badge--delayed{border-color:var(--warn);background:var(--warn-bg)}.water-badge--unavailable,.water-badge[class~=water-badge--Offline]{border-color:color-mix(in srgb, var(--danger) 60%, var(--border));background:var(--danger-bg)}.water-alert{margin-bottom:var(--space-4);border-left:4px solid var(--danger);background:linear-gradient(90deg, color-mix(in srgb, var(--danger-bg) 72%, var(--surface-1)), var(--surface-1) 42%)}.water-alert h3{color:var(--danger)}.water-alert p:not(.water-source){max-width:none}.water-forecast{overflow:hidden}.water-forecast>h3{margin-right:var(--space-2);display:inline-block}.water-forecast>.water-badge{vertical-align:text-bottom}.water-period{margin-top:var(--space-4);padding:var(--space-4) 0 0 var(--space-4);border-top:1px solid var(--border);border-left:2px solid color-mix(in srgb, var(--brand-violet) 55%, var(--border))}.water-period h4{margin-bottom:var(--space-2);font-size:var(--text-base)}.water-period p:last-child{margin-bottom:0}.water-actions{gap:var(--space-3);margin-block:var(--space-5);padding-bottom:var(--space-5);border-bottom:1px solid var(--border);flex-wrap:wrap;display:flex}.water-actions .btn{flex:0 auto}.water-table{border-collapse:separate;border-spacing:0;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-1);width:100%;overflow:hidden}.water-table th,.water-table td{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border);text-align:left;overflow-wrap:anywhere}.water-table th{background:var(--surface-2);color:var(--ink-muted);font-size:var(--text-xs);letter-spacing:var(--tracking-wide);text-transform:uppercase}.water-table tbody tr:last-child td{border-bottom:0}.water-table tbody tr:nth-child(2n){background:color-mix(in srgb, var(--surface-2) 55%, transparent)}.water-detail{margin-top:var(--space-5)}.water-detail>h2{margin-bottom:var(--space-2)}.water-section details{padding:var(--space-3) var(--space-4);border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-2)}.water-section summary{min-height:2.75rem;padding:var(--space-2) 0;cursor:pointer;color:var(--cyan-text);font-weight:700}.water-section details[open] summary{margin-bottom:var(--space-3);border-bottom:1px solid var(--border)}@media (width<=650px){.water-search{padding:var(--space-4);grid-template-columns:1fr}.water-search .btn{width:100%}.water-section{margin-block:var(--space-6)}.water-reading,.water-forecast,.water-alert{padding:var(--space-4)}.water-table{display:block;overflow-x:auto}.water-table th,.water-table td{padding:var(--space-2) var(--space-3);font-size:var(--text-sm)}}
