/* gauge.css — river gauge + river state pages (2026-10 design), on top of home.css */
.g-main{padding-top:28px;padding-bottom:40px;max-width:980px}
.crumbs{display:flex;gap:8px;align-items:center;font-size:14px;color:var(--dim);margin-bottom:18px;flex-wrap:wrap}
.crumbs a:hover{color:var(--ink)}
.crumbs span{opacity:.5}

.g-hero{position:relative;border-radius:28px;padding:34px 34px 28px;overflow:hidden;
  background:radial-gradient(700px 300px at 85% 0%,color-mix(in srgb,var(--c) 22%,transparent),transparent 70%),linear-gradient(160deg,#0f1a2e,#0a1120);
  border:1px solid color-mix(in srgb,var(--c) 35%,rgba(255,255,255,.08))}
.g-hero h1{font-size:clamp(30px,4.6vw,48px);line-height:1.05;letter-spacing:-.02em;margin:0 0 6px;max-width:none;text-align:left}
.g-where{color:var(--dim);font-size:16px}
.g-read{display:grid;grid-template-columns:1.3fr 1fr 1.2fr;gap:14px;margin-top:26px}
.g-read>div{background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:18px;padding:16px 18px}
.g-read span{display:block;color:var(--dim);font-size:13px;font-weight:600;margin-bottom:4px}
.g-read b{font-size:22px;font-weight:800;color:var(--ink)}
.g-read .g-now b{font-size:clamp(34px,5vw,46px);line-height:1.05}
.g-read .g-ts{font-size:15px;font-weight:600;color:var(--dim)}
.g-levels{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin-top:14px}
.g-level{border-radius:14px;padding:10px 14px;background:color-mix(in srgb,var(--c) 10%,transparent);border:1px solid color-mix(in srgb,var(--c) 35%,transparent)}
.g-level span{display:block;font-size:12px;font-weight:700;color:var(--c);letter-spacing:.03em}
.g-level b{font-size:20px}
.g-level small{display:block;color:var(--dim);font-size:12px}

.g-card{margin-top:22px;border-radius:24px;padding:26px 28px;background:var(--card);border:1px solid var(--line)}
.g-card h2{font-size:22px;font-weight:800;letter-spacing:-.01em;margin-bottom:14px}
.g-muted{color:var(--dim)}
.g-card a{color:#7dd3fc}
.g-chart{background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:16px;padding:14px}
#chart-status{color:var(--dim);font-size:13px;text-align:center;margin-top:8px}
.g-list{list-style:none;display:flex;flex-direction:column;gap:12px}
.g-list li{display:flex;gap:14px;align-items:flex-start}
.g-list p{color:#c8d3e8;font-size:15px}
.g-pill{flex:none;min-width:70px;text-align:center;font-weight:800;font-size:14px;padding:4px 10px;border-radius:999px;color:var(--c);background:color-mix(in srgb,var(--c) 12%,transparent);border:1px solid color-mix(in srgb,var(--c) 40%,transparent)}
.g-table{overflow-x:auto}
.g-table table{width:100%;border-collapse:collapse;font-size:15px}
.g-table th{text-align:left;color:var(--dim);font-weight:600;padding:8px 10px;border-bottom:1px solid var(--line)}
.g-table td{padding:9px 10px;border-bottom:1px solid rgba(255,255,255,.04);color:#c8d3e8}
.g-flow{display:flex;gap:10px;align-items:baseline;margin-bottom:8px}
.g-flow span{color:var(--dim);font-size:13px;font-weight:700;min-width:90px}
.g-chips{margin-top:12px}
.g-chips a{color:var(--ink)!important}

.g-cta{margin-top:22px;border-radius:28px;padding:34px;display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center;
  background:radial-gradient(500px 300px at 90% 50%,rgba(20,184,166,.18),transparent 70%),linear-gradient(160deg,#0b2730,#0a1520);border:1px solid rgba(45,212,191,.25)}
.g-cta h2{font-size:clamp(26px,3.4vw,36px);font-weight:800;line-height:1.1;margin-bottom:10px}
.g-cta p{color:#b5c6d8;margin-bottom:20px;max-width:460px}
.g-cta .ph{width:200px;padding:7px;border-radius:30px;--glow:rgba(45,212,191,.25)}
.g-cta .ph .scr{border-radius:24px}
.g-back{margin:26px 0 10px;color:var(--dim);font-size:15px}
.g-back a{color:#7dd3fc}

/* state page */
.s-river{margin-top:22px}
.s-river h3{font-size:15px;font-weight:800;color:#7dd3fc;margin:0 0 8px 4px}
.s-list{border-radius:16px;overflow:hidden;border:1px solid var(--line);background:var(--card)}
.s-list a{display:flex;justify-content:space-between;gap:14px;padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.04);font-size:15px}
.s-list a:last-child{border-bottom:0}
.s-list a:hover{background:rgba(45,212,191,.07)}
.s-list small{color:var(--dim);white-space:nowrap}

@media (max-width:760px){
  .g-hero{padding:24px 20px}
  .g-read{grid-template-columns:1fr 1fr}
  .g-read .g-now{grid-column:1/-1}
  .g-card{padding:20px}
  .g-cta{grid-template-columns:1fr;padding:24px}
  .g-cta .ph{display:none}
  .g-list li{flex-direction:column;gap:6px}
  .s-list a{flex-direction:column;gap:2px}
}