/* ============================================================
   STATE RIVER MONITOR — light app-shell (shared by every state on
   GoFishThatRiver and GoFloatThatRiver; edit tools/shared/style.css and
   run tools/sync-shared.py — never a state's own copy)
   Plus Jakarta Sans + IBM Plex Mono · collapsible sidebar
   ============================================================ */

/* tokens live in /system.css — loaded before this file on every page */
*{box-sizing:border-box}
body{margin:0;background:#FFFFFF;min-height:100vh;
  font-family:var(--sans);-webkit-font-smoothing:antialiased;color:var(--ink)}
a{color:var(--link);text-decoration:none}
::selection{background:#cfe6f7}
button{font-family:var(--sans)}

.page{max-width:1440px;margin:0 auto;padding:18px 18px 40px}
.app{background:#fff;border-radius:22px;display:grid;grid-template-columns:236px minmax(0,1fr);overflow:hidden;
  box-shadow:0 30px 80px -44px rgba(30,40,60,.35);min-height:840px;transition:grid-template-columns var(--dur-2) var(--ease);min-width:0}
.app.collapsed{grid-template-columns:78px minmax(0,1fr)}

/* overflow guards — prevent any grid/flex child from blowing out the layout (iOS Safari especially) */
.content{overflow-x:clip}
.detail-grid > *, .dash-grid > *, .duo > *, .th-legend > *, .stat-strip > *,
.card, .card-sm, .river-row > *{min-width:0 !important;max-width:100% !important}
select{max-width:100%}

/* ================= SIDEBAR ================= */
.sidebar{padding:26px 18px 18px;display:flex;flex-direction:column;border-right:1px solid var(--line);min-width:0}
.app.collapsed .sidebar{padding:26px 14px 18px}
.brand{display:flex;align-items:center;gap:11px;padding:0 8px 0 6px;margin-bottom:28px;cursor:pointer}
.brand-mark{width:34px;height:34px;border-radius:10px;object-fit:cover;flex:none}
.brand-name{font:800 var(--fs-13)/1.15 var(--sans);letter-spacing:.2px;color:var(--ink);white-space:nowrap}
.app.collapsed .brand-name{display:none}
.app.collapsed .brand{justify-content:center;padding:0}

.nav{display:flex;flex-direction:column;gap:4px}
.nav-item{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:var(--r-md);color:var(--mut-2);
  font:600 var(--fs-14) var(--sans);cursor:pointer;border:0;background:transparent;text-align:left;white-space:nowrap}
.nav-item:hover{background:var(--pale);color:var(--ink)}
.nav-item.active{background:var(--ink);color:#fff}
.nav-item svg{flex:none}
.app.collapsed .nav-item{justify-content:center;padding:11px 0}
.app.collapsed .nav-label{display:none}

.cta-card{margin-top:22px;padding:16px;border-radius:var(--r-lg);background:linear-gradient(145deg,var(--ink),var(--ink-2));color:#fff;cursor:pointer}
.cta-card .t{font:700 var(--fs-13) var(--sans)}
.cta-card .s{font:500 var(--fs-12)/1.5 var(--sans);color:#aab2bc;margin-top:5px}
.cta-card .l{margin-top:12px;font:700 var(--fs-13) var(--sans);color:#8ec5ff}
.app.collapsed .cta-card{display:none}

/* the other site, one quiet link — no animation, no rotating copy */
.xsite-link{display:flex;align-items:center;gap:8px;margin-top:10px;padding:10px 12px;border-radius:var(--r-md);
  background:var(--pale);color:var(--ink);font:600 var(--fs-13) var(--sans);text-decoration:none}
.xsite-link:hover{background:#dde7f1}
.xsite-link b{margin-left:auto;color:var(--link);white-space:nowrap;font-weight:700}
.app.collapsed .xsite-link{display:none}

.sb-foot{margin-top:auto;padding-top:22px}
.sb-user{display:flex;align-items:center;gap:11px;padding:12px;border-radius:var(--r-lg);background:var(--pale)}
.sb-avatar{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--link),var(--green));color:#fff;
  font:700 var(--fs-13) var(--sans);display:flex;align-items:center;justify-content:center;flex:none}
.sb-user .n{font:700 var(--fs-13) var(--sans);color:var(--ink)}
.sb-user .e{font:500 var(--fs-12) var(--sans);color:var(--mut-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.app.collapsed .sb-user{padding:6px;justify-content:center}
.app.collapsed .sb-user > div{display:none}
.sb-toggle{margin-top:12px;border:1px solid var(--line-2);background:#fff;color:var(--mut-2);border-radius:var(--r-md);
  padding:9px;font:700 var(--fs-12) var(--sans);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px}
.sb-toggle:hover{background:var(--pale);color:var(--ink)}

/* mobile */
.hamburger{display:none;position:fixed;top:14px;left:14px;z-index:1200;width:44px;height:44px;border-radius:14px;
  border:1px solid var(--line-2);background:#fff;cursor:pointer;box-shadow:0 4px 14px -6px rgba(0,0,0,.25);
  font-size:var(--fs-18);color:var(--ink)}
@media (max-width:900px){
  .page{padding:10px 8px 24px}
  .app{display:block;min-height:auto;border-radius:var(--r-lg)}
  .sidebar{position:fixed;z-index:1100;top:0;bottom:0;left:-300px;width:270px;background:#fff;transition:left var(--dur-2) var(--ease);
    box-shadow:20px 0 60px -30px rgba(0,0,0,.35)}
  .sidebar.open{left:0}
  .hamburger{display:block}
  .content{padding-top:64px !important}
}

/* ================= CONTENT ================= */
.content{padding:28px 30px 36px;min-width:0}
@media (max-width:900px){.content{padding:28px 16px 30px}}
.view-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:22px;gap:14px;flex-wrap:wrap}
.view-head h1{margin:0;font:800 var(--fs-30)/1.05 var(--sans);letter-spacing:-.7px;color:var(--ink)}
.view-head .sub{margin:7px 0 0;font:500 var(--fs-14) var(--sans);color:var(--mut)}
.head-actions{display:flex;align-items:center;gap:10px}
.fine{font:500 var(--fs-12)/1.5 var(--sans);color:var(--mut-3)}
.prose{font:500 var(--fs-14)/1.7 var(--sans);color:var(--mut-3);margin:10px 0 0}

/* the answer first: three counts and the best bet, one row */
.stat-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:16px}
.mini-stat{display:flex;align-items:center;gap:12px;border-radius:var(--r-lg);padding:13px 15px;min-height:64px}
.mini-stat.safe{background:var(--card-safe)} .mini-stat.caution{background:var(--card-caution)} .mini-stat.stayout{background:var(--card-stayout)}
.mini-stat.best{background:var(--pale);cursor:pointer}
.mini-stat.best:hover{background:#dde7f1}
.mini-stat.best .ms-lbl b{display:block;color:var(--link);font-size:var(--fs-13);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini-stat .ms-num{font:800 var(--fs-30)/1 var(--sans);letter-spacing:-1px;color:var(--ink)}
.mini-stat .ms-lbl{font:700 var(--fs-13)/1.3 var(--sans);color:var(--ink);min-width:0}
.mini-stat .ms-lbl span{font:500 var(--fs-11) var(--sans);color:var(--mut-2)}
.craft-bar{margin-bottom:14px}
@media (max-width:720px){
  .stat-strip{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .stat-strip .best{grid-column:1 / -1}
  .mini-stat{flex-direction:column;align-items:flex-start;gap:4px;padding:11px 12px;min-height:0}
  .mini-stat .ms-num{font-size:var(--fs-24)}
  .mini-stat .ms-lbl{font-size:var(--fs-12)}
  .mini-stat .ms-lbl span{display:none}
  .map-foot-r .fine{display:none}
}
.show-all{display:block;width:100%;margin-top:10px}

/* per-gauge chips on river rows */
.g-chips{display:flex;gap:5px;flex-wrap:wrap;margin-top:7px}
.g-chip{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line-2);border-radius:var(--r-pill);
  padding:3px 9px;font:600 var(--fs-11) var(--mono);color:var(--mut-2);background:#fff;white-space:nowrap}
.g-chip i{width:7px;height:7px;border-radius:50%;flex:none}

/* banner eta + notes */
.cb-eta{margin-top:6px;font:600 var(--fs-13) var(--sans);color:var(--ink);text-align:right}
.cb-eta b{color:var(--safe)}
.cb-age{text-align:right}
.est{display:block;font:600 var(--fs-11)/1.4 var(--sans);color:var(--amber-text);margin-top:4px;text-align:right}
.gc-meta .est{display:inline;margin-left:4px;text-align:left}
.note-line{display:flex;flex-direction:column;gap:6px;margin:-8px 0 18px;padding:12px 16px;border-radius:var(--r-md);
  background:#f7f9fb;border:1px solid var(--line);font:500 var(--fs-13)/1.55 var(--sans);color:var(--ink)}
.note-line b{font-weight:700}

/* public access rows */
.access-row{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--pale)}
.access-row:first-of-type{border-top:0}
.a-name{font:700 var(--fs-13) var(--sans);color:var(--ink)}
.a-note{font:500 var(--fs-12)/1.5 var(--sans);color:var(--mut-3)}
.a-dir{font:700 var(--fs-12) var(--sans);color:var(--link);white-space:nowrap;border:1px solid var(--line-2);
  border-radius:var(--r-pill);padding:7px 11px}
.a-dir:hover{border-color:var(--link)}

.sec-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.sec-head h2{margin:0;font:800 var(--fs-20) var(--sans);letter-spacing:-.3px;color:var(--ink)}
.sec-link{font:700 var(--fs-13) var(--sans);color:var(--link);cursor:pointer;background:none;border:0}
.tier-head{margin:30px 0 14px;padding-top:22px;border-top:1px solid var(--line)}
.tier-head h2{margin:0;font:800 var(--fs-18) var(--sans);letter-spacing:-.2px;color:var(--ink)}

/* ================= MAPS (one look for every map) ================= */
.map-card{margin-bottom:22px}
.map-box{position:relative;border-radius:18px;overflow:hidden;background:#eef2f6;border:1px solid var(--line-2)}
.map-box .leaflet-container{background:#eef2f6;font-family:var(--sans)}
#map-main{height:400px}
.gauge-map{height:340px}
@media (max-width:720px){#map-main{height:270px}.gauge-map{height:260px}}
.map-foot{display:flex;justify-content:space-between;align-items:center;gap:10px 18px;flex-wrap:wrap;margin-top:10px}
.map-foot-r{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.map-legend{display:flex;gap:6px 14px;flex-wrap:wrap;font:600 var(--fs-12) var(--sans);color:var(--mut-2);margin-top:10px}
.map-foot .map-legend{margin-top:0}
.map-legend i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px;vertical-align:-1px;border:1.5px solid #fff;box-shadow:0 0 0 1px rgba(0,0,0,.12)}
.map-hint{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);z-index:800;background:rgba(1,33,65,.82);color:#fff;
  font:600 var(--fs-12)/1.4 var(--sans);padding:6px 12px;border-radius:var(--r-pill);pointer-events:none;transition:opacity .4s;white-space:nowrap;max-width:92%;overflow:hidden;text-overflow:ellipsis}
.map-hint.fade{opacity:0}
.rail-toggle{font:600 var(--fs-12) var(--sans);color:var(--mut-2);display:flex;gap:6px;align-items:center;cursor:pointer}
.rail-toggle input{accent-color:var(--ink)}
.leaflet-popup-content-wrapper,.leaflet-popup-tip{background:#fff;color:var(--ink);border-radius:var(--r-md)}
.leaflet-popup-content{font:500 var(--fs-13)/1.5 var(--sans);margin:12px 16px}
.leaflet-popup-content a{font-weight:700}
.gm-pin{display:flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);box-shadow:var(--sh-1);border:2px solid #fff}
.gm-pin b{transform:rotate(45deg);font:700 var(--fs-11) var(--sans);color:#fff}
.gm-acc{display:flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:6px;background:var(--ink);color:#fff;font:800 var(--fs-11) var(--sans);border:2px solid #fff;box-shadow:0 1px 3px rgba(0,0,0,.35)}
.gm-hazard{width:22px;height:22px;border-radius:50%;background:var(--red-text);color:#fff;font:800 var(--fs-14)/22px var(--sans);text-align:center;border:2px solid #fff;box-shadow:var(--sh-1)}
.gm-community{outline:2px dashed #fff;outline-offset:-5px}
.gmap-card{margin-bottom:16px}
.acc-filter{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:10px 0 0}
.acc-f-lbl{font:700 var(--fs-12) var(--sans);color:var(--mut-3);margin-right:2px}
.acc-chip{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:var(--r-pill);border:1px solid var(--line-2);background:#fff;font:600 var(--fs-12) var(--sans);color:#374151;cursor:pointer}
.acc-chip i{width:9px;height:9px;border-radius:50%;background:var(--c,var(--ink))}
.acc-chip.off{opacity:.4;text-decoration:line-through}

/* ================= RIVER LIST ================= */
.river-tools{display:flex;flex-direction:column;gap:10px;margin:0 0 4px}
.river-search{display:flex;align-items:center;gap:10px}
.river-search input[type=search]{flex:1;min-width:0;background:#fff;color:var(--ink);
  border:1px solid var(--line-2);border-radius:var(--r-md);padding:11px 14px;font:500 var(--fs-14) var(--sans)}
.river-search input[type=search]:focus{outline:2px solid #b9dcf2;border-color:var(--link)}
.river-search .rq-count{font:600 var(--fs-12) var(--mono);color:var(--mut-2);white-space:nowrap}
.river-rows{margin-top:6px}
.river-row{display:grid;grid-template-columns:auto 1.6fr 1fr 1.2fr auto;align-items:center;gap:16px;
  padding:15px 8px;border-bottom:1px solid #f2f4f6;cursor:pointer}
.river-row:hover{background:#fafbfc}
.rr-thumb{width:44px;height:44px;border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;flex:none}
.rr-thumb i{width:12px;height:12px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px rgba(0,0,0,.1)}
.rr-name{font:700 var(--fs-15) var(--sans);color:var(--ink)}
.rr-sub{font:500 var(--fs-12) var(--sans);color:var(--mut-3)}
.rr-status{display:flex;align-items:center;gap:8px;font:600 var(--fs-13) var(--sans)}
.rr-status i{width:9px;height:9px;border-radius:50%}
.rr-meta{font:600 var(--fs-13) var(--mono);color:var(--mut-2)}
.rr-cfs{justify-self:end;text-align:right}
.rr-cfs b{font:800 var(--fs-18) var(--sans);color:var(--ink)}
.rr-cfs span{font:600 var(--fs-11) var(--sans);color:var(--mut-3)}
@media (max-width:720px){
  .river-row{grid-template-columns:auto minmax(0,1fr) auto;gap:6px 12px;align-items:center}
  .river-row > .rr-thumb{grid-column:1;grid-row:1 / span 2}
  .river-row > div:not([class]){grid-column:2;grid-row:1}
  .rr-status{display:flex;grid-column:2;grid-row:2;font-size:var(--fs-13)}
  .rr-meta{display:none}
  .rr-cfs{grid-column:3;grid-row:1 / span 2}
}

/* pills / chips */
.pill-row{display:flex;gap:6px;background:var(--pale);padding:4px;border-radius:var(--r-md);flex-wrap:wrap}
.pill-row.scroll{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-bottom:10px}
.pill-row.scroll::-webkit-scrollbar{display:none}
.pill{font:600 var(--fs-13) var(--sans);color:var(--mut);padding:9px 15px;border-radius:9px;cursor:pointer;border:0;background:transparent;white-space:nowrap}
.pill:hover{color:var(--ink)}
.pill.active{font-weight:700;color:var(--ink);background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.06)}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{font:600 var(--fs-13) var(--sans);border:1px solid var(--line-2);background:#fff;color:var(--mut-2);
  border-radius:var(--r-pill);padding:8px 15px;cursor:pointer}
.chip:hover{color:var(--ink);border-color:#d5dae0}
.chip.active{background:var(--ink);border-color:var(--ink);color:#fff}

/* ================= DETAIL ================= */
.back-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:12px}
.back-link{display:flex;align-items:center;gap:9px;font:700 var(--fs-13) var(--sans);color:var(--mut-2);cursor:pointer;background:none;border:0}
.back-link:hover{color:var(--ink)}
.back-link .bx{width:34px;height:34px;border-radius:11px;border:1px solid var(--line-2);display:flex;align-items:center;justify-content:center;font-size:var(--fs-16)}

.cond-banner{border-radius:22px;padding:24px 26px;display:flex;justify-content:space-between;align-items:center;
  flex-wrap:wrap;gap:20px;margin-bottom:22px}
.cb-status{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.cb-status i{width:11px;height:11px;border-radius:50%}
.cb-status span{font:700 var(--fs-12) var(--sans);letter-spacing:.4px;text-transform:uppercase}
.cond-banner h1{margin:0;font:800 var(--fs-38)/1 var(--sans);letter-spacing:-1px;color:var(--ink)}
.cb-sub{margin:9px 0 0;font:500 var(--fs-14) var(--sans);color:var(--mut-3)}
.cb-cfs{display:flex;align-items:baseline;gap:8px;justify-content:flex-end}
.cb-cfs b{font:800 var(--fs-52)/1 var(--sans);letter-spacing:-1.5px;color:var(--ink)}
.cb-cfs span{font:700 var(--fs-15) var(--mono);color:var(--mut)}
.cb-trend{margin-top:8px;font:600 var(--fs-13) var(--sans);text-align:right}
.m-xsite{display:none;align-items:center;gap:11px;margin:0 0 18px;padding:12px 15px;border-radius:var(--r-md);background:var(--pale);color:var(--ink);text-decoration:none;font:500 var(--fs-13)/1.4 var(--sans)}
.m-xsite b{font-weight:800}.m-xsite .mx-ico{font-size:var(--fs-20);line-height:1}.m-xsite .mx-go{margin-left:auto;font:800 var(--fs-12) var(--sans);color:var(--link);white-space:nowrap}
@media (max-width:900px){.m-xsite{display:flex}}

.detail-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:20px;align-items:start}
@media (max-width:1150px){.detail-grid{grid-template-columns:minmax(0,1fr) 290px}}
@media (max-width:980px){.detail-grid{grid-template-columns:1fr}}

.card{border:1px solid var(--line);border-radius:22px;padding:22px 24px;background:#fff}
.card-sm{border:1px solid var(--line);border-radius:18px;padding:18px 20px;background:#fff}
.card-title{font:800 var(--fs-16) var(--sans);color:var(--ink)}
.card-sub{font:500 var(--fs-13)/1.5 var(--sans);color:var(--mut-3);margin-top:2px}
.card-h{font:800 var(--fs-14) var(--sans);color:var(--ink);margin-bottom:14px}
.card-sm .t{font:700 var(--fs-13) var(--sans);color:var(--ink)}
.card-sm .b{font:500 var(--fs-14)/1.65 var(--sans);color:var(--mut-3)}
details.fold{margin-top:10px}
details.fold summary{cursor:pointer;font:700 var(--fs-13) var(--sans);color:var(--link);list-style:none}
details.fold summary::-webkit-details-marker{display:none}
details.fold summary::before{content:'▸ '}
details.fold[open] summary::before{content:'▾ '}
details.fold .b{margin-top:8px}
details.fold-card summary{cursor:pointer;list-style:none;margin-bottom:0}
details.fold-card summary::-webkit-details-marker{display:none}
details.fold-card summary::before{content:'▸ ';color:var(--link)}
details.fold-card[open] summary::before{content:'▾ ';color:var(--link)}
details.fold-card[open] summary{margin-bottom:12px}

/* chart */
.chart-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;flex-wrap:wrap;gap:10px}
.range-pills{display:flex;gap:5px;background:var(--pale);padding:4px;border-radius:10px}
.range-pill{font:600 var(--fs-12) var(--sans);color:var(--mut);padding:6px 11px;border-radius:7px;cursor:pointer;border:0;background:transparent}
.range-pill.active{font-weight:700;color:var(--ink);background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.06)}
.chart-zone{position:relative;height:230px;cursor:crosshair}
.chart-bands{position:absolute;inset:0;display:flex;flex-direction:column;border-radius:var(--r-md);overflow:hidden}
.chart-svg{position:absolute;inset:0;width:100%;height:100%}
.chart-dot{position:absolute;right:0;transform:translate(50%,-50%)}
.chart-dot i{display:block;width:13px;height:13px;border-radius:50%;border:3px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.2)}
.chart-tag{position:absolute;right:16px;background:var(--ink);color:#fff;font:700 var(--fs-11) var(--mono);padding:5px 9px;border-radius:var(--r-sm)}
.chart-x{display:flex;justify-content:space-between;margin-top:12px;font:500 var(--fs-11) var(--mono);color:var(--mut)}
.chart-scrub{position:absolute;inset:0;pointer-events:none}
.cs-line{position:absolute;top:0;bottom:0;width:0;border-left:1.5px dashed rgba(11,27,43,.35)}
.cs-dot{position:absolute;width:11px;height:11px;border-radius:50%;border:2.5px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.25);transform:translate(-50%,-50%)}
.cs-tip{position:absolute;background:var(--ink);color:#fff;font:700 var(--fs-11) var(--mono);padding:4px 8px;border-radius:7px;white-space:nowrap;transform:translateY(-50%);z-index:3}

.th-legend{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:16px}
@media (max-width:720px){.th-legend{grid-template-columns:1fr 1fr}}
.th-cell{border:1px solid var(--line);border-radius:14px;padding:12px 14px;background:#fff}
.th-cell.hi{border-color:var(--ink)}
.th-cell .r{display:flex;align-items:center;gap:6px}
.th-cell .r i{width:8px;height:8px;border-radius:50%}
.th-cell .r b{font:700 var(--fs-12) var(--sans);color:var(--ink)}
.th-cell .v{font:600 var(--fs-12) var(--mono);color:var(--mut-2);margin-top:6px}

/* right rail detail */
.kv{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--pale)}
.kv:last-of-type{border-bottom:0}
.kv .k{font:500 var(--fs-13) var(--sans);color:var(--mut)}
.kv .v{font:600 var(--fs-13) var(--mono);color:var(--ink);text-align:right}
.nearby-item{display:flex;align-items:center;gap:11px;padding:10px 0;border-top:1px solid var(--pale);cursor:pointer}
.nearby-item:hover{opacity:.7}
.nearby-item .dot{width:9px;height:9px;border-radius:50%;flex:none}
.nearby-item .n{font:700 var(--fs-13) var(--sans);color:var(--ink)}
.nearby-item .s{font:500 var(--fs-12) var(--sans);color:var(--mut-3)}
.nearby-item .v{font:700 var(--fs-13) var(--mono);color:var(--mut-2);margin-left:auto}

/* gear / monetization */
.gear-row{display:flex;justify-content:space-between;align-items:center;gap:12px;border:1px solid var(--line);
  border-radius:14px;padding:12px 15px;margin-bottom:8px;text-decoration:none;background:#fff}
a.gear-row:hover{border-color:var(--link)}
.gear-name{font:600 var(--fs-14) var(--sans);color:var(--ink)}
.gear-buy{font:700 var(--fs-11) var(--sans);letter-spacing:.06em;color:#fff;background:var(--ink);padding:6px 12px;
  border-radius:var(--r-pill);white-space:nowrap}
a.gear-row:hover .gear-buy{background:var(--link)}
.gear-disclosure{font:500 var(--fs-11)/1.6 var(--sans);color:var(--mut-3);margin-top:8px}

.sponsor-card{border:1px solid var(--line);border-left:4px solid var(--link);border-radius:18px;padding:16px 18px;position:relative;background:#fff}
.sponsor-tag{font:700 9.5px var(--sans);letter-spacing:.12em;color:#0d4d85;background:#dbe8f3;padding:3px 9px;border-radius:99px}
.sponsor-name{display:block;font:800 var(--fs-15) var(--sans);color:var(--ink);margin-top:8px}
.sponsor-name:hover{color:var(--link)}
.sponsor-blurb{margin:5px 0 0;font:500 var(--fs-13)/1.6 var(--sans);color:var(--mut-3)}
.sponsor-open{display:block;text-align:center;border:1px dashed #d5dae0;border-radius:14px;
  font:600 var(--fs-12) var(--sans);color:var(--mut-2);padding:12px;text-decoration:none}
.sponsor-open:hover{border-color:var(--link);color:var(--link)}

/* org lists */
.org-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:8px}
.org-list.single{grid-template-columns:1fr}
.org-row{display:flex;justify-content:space-between;align-items:center;gap:10px;border:1px solid var(--line);
  border-radius:14px;background:#fff;padding:12px 15px;text-decoration:none}
.org-row:hover{border-color:var(--link)}
.org-name{font:700 var(--fs-13) var(--sans);color:var(--ink)}
.org-row:hover .org-name{color:var(--link)}
.org-type{font:600 var(--fs-10) var(--mono);letter-spacing:.08em;color:var(--mut-3);white-space:nowrap;text-transform:uppercase}

/* species / craft guide */
.sg-item{border:1px solid var(--line);border-radius:var(--r-lg);margin-bottom:8px;background:#fff;overflow:hidden}
.sg-item summary{cursor:pointer;padding:14px 18px;list-style:none;font:700 var(--fs-14) var(--sans);color:var(--ink)}
.sg-item summary::-webkit-details-marker{display:none}
.sg-item summary::before{content:'▸ ';color:var(--link)}
.sg-item[open] summary::before{content:'▾ '}
.sg-item[open] summary{border-bottom:1px solid var(--line)}
.sg-body{padding:14px 18px}
.sg-row{margin-bottom:12px}
.sg-row:last-child{margin-bottom:0}
.sg-label{display:block;font:700 var(--fs-11) var(--sans);letter-spacing:.14em;color:var(--link);margin-bottom:3px;text-transform:uppercase}
.sg-row p{margin:0;font:500 var(--fs-14)/1.6 var(--sans);color:var(--mut-3)}

/* forms (report) */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 14px;margin-bottom:12px}
@media (max-width:720px){.form-grid{grid-template-columns:1fr}}
.f-span2{grid-column:1 / -1}
.f-label{display:block;font:700 var(--fs-11) var(--sans);letter-spacing:.08em;color:var(--mut-2);text-transform:uppercase;margin-bottom:5px}
input[type=text],input[type=email],textarea,select{width:100%;background:#fff;color:var(--ink);
  border:1px solid var(--line-2);border-radius:var(--r-md);padding:11px 13px;font:500 var(--fs-14) var(--sans)}
input:focus,textarea:focus,select:focus{outline:2px solid #b9dcf2;border-color:var(--link)}
textarea{resize:vertical}
.form-status{font:600 var(--fs-13) var(--sans);color:var(--mut-2)}
.form-status.ok{color:var(--safe)} .form-status.err{color:var(--red-text)}
.kind-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:2px}
.kind-opt{display:flex;align-items:center;gap:7px;font:600 var(--fs-13) var(--sans);color:var(--ink);border:1px solid var(--line-2);border-radius:var(--r-pill);padding:8px 13px;cursor:pointer;background:#fff}
.kind-opt input{accent-color:var(--link);margin:0}
.kind-opt.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.kind-opt.on input{accent-color:#fff}
.if-photo{font:500 var(--fs-13) var(--sans);max-width:100%}
.if-photo::file-selector-button{font:700 var(--fs-12) var(--sans);color:var(--ink);background:#fff;border:1px solid var(--line-2);border-radius:10px;padding:8px 12px;margin-right:10px;cursor:pointer}
.if-photo-txt{font:600 var(--fs-12) var(--mono);color:var(--mut-3);margin-left:8px}
.pin-field{margin-top:2px}
.pin-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px}
.if-pin-txt{font:500 var(--fs-12) var(--sans);color:var(--mut-3)}
.if-pinmap{height:220px;border:1px solid var(--line-2);border-radius:var(--r-md);overflow:hidden;background:#eef2f6}
.if-pinmap .leaflet-container{height:100%;cursor:crosshair}

/* community intel */
.intel-list{margin-top:8px}
.intel-item{border:1px solid var(--line);border-left:3px solid var(--link);border-radius:var(--r-md);padding:12px 14px;margin-bottom:8px;background:#fff}
.intel-item.hazard{border-left-color:var(--red-text);background:#fffaf9}
.intel-head{display:flex;justify-content:space-between;gap:10px;align-items:baseline;flex-wrap:wrap}
.intel-when{font:600 var(--fs-11) var(--mono);color:var(--mut-2);white-space:nowrap}
.intel-where{font:700 var(--fs-13) var(--sans);color:var(--ink)}
.intel-msg{font:500 var(--fs-13)/1.6 var(--sans);color:#41546a;margin-top:6px;white-space:pre-wrap}
.intel-tag{display:inline-block;font:700 9.5px var(--sans);letter-spacing:.08em;text-transform:uppercase;padding:3px 8px;border-radius:var(--r-pill);background:var(--grey-soft);color:var(--mut-3);margin-top:8px}
.intel-tag.hazard{background:var(--red-card);color:var(--red-text)}
.intel-pin{font:700 var(--fs-12) var(--sans);color:var(--link);margin-left:8px}
.intel-verified{color:var(--mut-2);font-size:var(--fs-11)}
.intel-photo{display:block;max-width:100%;max-height:240px;border-radius:10px;margin-top:8px;object-fit:cover}
.a-thumb img{width:56px;height:42px;object-fit:cover;border-radius:var(--r-sm);display:block;margin-left:8px}
.intel-rss{font:700 var(--fs-11) var(--sans);color:var(--link);text-decoration:none;border:1px solid var(--line-2);border-radius:var(--r-pill);padding:2px 8px;margin-left:4px;white-space:nowrap}
button.gc-name{display:block;width:100%;background:none;border:0;cursor:pointer;text-align:inherit}
button.gc-name:focus-visible,.wxm-timeline:focus-visible,.wxm-carousel:focus-visible{outline:2px solid var(--link);outline-offset:2px}

/* weather + rain, one card */
.wxm{font-family:var(--sans)}
.wxm-current{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.wxm-temp{font:800 var(--fs-42)/1 var(--sans);letter-spacing:-1px;color:var(--ink)}
.wxm-temp small{font:700 var(--fs-14) var(--mono);color:var(--mut)}
.wxm-cond{font:700 var(--fs-11) var(--sans);letter-spacing:.14em;color:var(--link);margin-top:5px}
.wxm-emoji{font-size:2.2rem}
.wxm-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.wx-pill{border:1px solid var(--line-2);border-radius:var(--r-pill);padding:7px 13px;font:600 var(--fs-12) var(--mono);color:var(--mut-2);background:#fff}
.wxm-tlabel{font:700 var(--fs-11) var(--sans);letter-spacing:.16em;color:var(--mut-3);margin-bottom:8px}
.wxm-timeline{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;scrollbar-width:none}
.wxm-timeline::-webkit-scrollbar{display:none}
.wxm-tcard{min-width:74px;border:1px solid var(--line);border-radius:14px;padding:10px 8px;text-align:center;background:#fff;flex:0 0 auto}
.wxm-tt{font:600 var(--fs-11) var(--sans);color:var(--mut-3)}
.wxm-ti{font-size:1.3rem;margin:4px 0}
.wxm-td{font:700 var(--fs-14) var(--sans);color:var(--ink)}
.wxm-tw{font:500 var(--fs-11) var(--mono);color:var(--mut-3);margin-top:3px}
.wxm-acc{border:1px solid var(--line);border-radius:var(--r-lg);margin-top:10px;background:#fff;overflow:hidden}
.wxm-acc summary{cursor:pointer;padding:12px 16px;list-style:none;font:700 var(--fs-13) var(--sans);color:var(--ink)}
.wxm-acc summary::-webkit-details-marker{display:none}
.wxm-acc summary::before{content:'▸ ';color:var(--link)}
.wxm-acc[open] summary::before{content:'▾ '}
.wxm-days,.wxm-pgrid,.wxm-shead,.wxm-carousel{padding:0 16px 12px}
.wxm-day{display:grid;grid-template-columns:1fr auto;gap:2px 12px;border:1px solid var(--line);border-radius:var(--r-md);padding:10px 13px;margin-bottom:6px;font:500 var(--fs-12) var(--sans);color:var(--mut-2)}
.wxm-dn{font:700 var(--fs-14) var(--sans);color:var(--ink)}
.wxm-dt{text-align:right;color:var(--ink);font-weight:600}
.wxm-dp{text-align:right}
.wxm-pgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding-top:2px}
.wxm-pcell{border:1px solid var(--line);border-radius:var(--r-md);padding:11px 13px}
.wxm-pl{display:block;font:700 9.5px var(--sans);letter-spacing:.14em;color:var(--mut-3);margin-bottom:4px}
.wxm-pv{font:800 var(--fs-20) var(--sans);color:var(--ink)}
.wxm-pv small{font:600 var(--fs-11) var(--mono);color:var(--mut-3)}
.wxm-shead{display:flex;justify-content:space-between;align-items:center;font:700 var(--fs-10) var(--sans);letter-spacing:.16em;color:var(--mut-3);padding-top:12px;padding-bottom:8px}
.wxm-nav button{background:#fff;border:1px solid var(--line-2);border-radius:var(--r-sm);color:var(--ink);width:28px;height:24px;cursor:pointer;font-size:.9rem;line-height:1}
.wxm-nav button:hover{border-color:var(--link);color:var(--link)}
.wxm-carousel{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.wxm-carousel::-webkit-scrollbar{display:none}
.wxm-shift{min-width:230px;flex:0 0 auto;scroll-snap-align:start;border:1px solid var(--line);border-radius:14px;padding:13px 14px;text-align:center;background:#fff}
.wxm-st{font:700 var(--fs-11) var(--mono);color:var(--ink)}
.wxm-sd{font:600 9.5px var(--sans);letter-spacing:.14em;color:var(--mut-3);margin:8px 0 4px}
.wxm-sv{font:800 var(--fs-24) var(--sans)}
.wxm-sv span{font:600 var(--fs-11) var(--mono)}
.wxm-sn{font:500 var(--fs-11)/1.6 var(--sans);color:var(--mut-2);margin-top:8px;border:1px dashed var(--line-2);border-radius:10px;padding:7px 8px}
.trend-up{color:var(--stayout)} .trend-down{color:var(--safe)} .trend-flat{color:var(--mut)}
.rain-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;border-top:1px solid var(--line);padding-top:12px}
.rc-h{font:700 var(--fs-12) var(--sans);color:var(--ink);margin-bottom:6px;display:flex;align-items:center;gap:6px}
.rain-bar{flex:1;height:7px;border-radius:4px;background:var(--grey-soft);overflow:hidden}
.rain-bar i{display:block;height:100%;border-radius:4px}
.rain-note{font:500 var(--fs-12)/1.5 var(--sans);color:var(--mut-3);margin-top:10px}
.rain-big{font:700 var(--fs-24) var(--mono);margin:4px 0 6px} .rain-big span{font-size:var(--fs-12);color:var(--mut-3);margin-left:2px}
@media(max-width:640px){.rain-grid{grid-template-columns:1fr}}

/* stale / age / alerts */
.stale-badge{display:inline-block;background:#fdf1dc;color:#8a5a00;border:1px solid #ecd9ae;border-radius:7px;padding:2px 8px;font:700 var(--fs-11) var(--sans);letter-spacing:.03em;margin-top:5px}
.age-note{display:inline-block;color:var(--mut);font:600 var(--fs-11) var(--sans);margin-top:5px}
.gc-meta .stale-badge{margin-top:2px}
.flood-alert-wrap:empty{display:none}
.flood-alert{display:flex;gap:12px;align-items:flex-start;margin:0 0 18px;padding:13px 16px;border:1px solid #f0dede;border-left:5px solid #c0392b;border-radius:var(--r-md);background:#fdecea}
.flood-alert .fa-ico{font-size:var(--fs-20);line-height:1.15;flex:none}
.flood-alert .fa-title{font:800 var(--fs-14) var(--sans);margin-bottom:3px}
.flood-alert .fa-text{font:500 var(--fs-13)/1.5 var(--sans);color:#374151}
.flood-alert .fa-link{display:inline-block;margin-top:6px;font:700 var(--fs-12) var(--sans);color:#0d3b6b;text-decoration:none}

/* text status helpers */
.c-safe{color:var(--green)} .c-caution{color:var(--amber-text)} .c-limited{color:var(--orange-text)}
.c-stayout{color:var(--red-text)} .c-unknown{color:var(--mut-3)}

/* footer */
.colophon{margin-top:34px;padding-top:20px;border-top:1px solid var(--line);font:500 var(--fs-12)/1.8 var(--sans);color:var(--mut-3);text-align:center}
.loading{padding:50px;text-align:center;font:600 var(--fs-12) var(--mono);color:var(--mut-3)}

/* ---------- per-gauge go/no-go cards (river detail) ---------- */
.gauge-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:10px}
.gc{border:1px solid var(--line);border-radius:var(--r-lg);background:#fff;overflow:hidden;cursor:pointer;
  text-align:center;padding:0 0 12px;display:flex;flex-direction:column;gap:4px;min-width:0;transition:box-shadow .12s}
.gc:hover{box-shadow:var(--sh-2)}
.gc.active{outline:2px solid var(--ink);outline-offset:-2px}
.gc-banner{display:block;color:#fff;font:800 var(--fs-10) var(--sans);letter-spacing:.08em;padding:6px 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gc-name{font:700 var(--fs-13) var(--sans);color:var(--ink);margin-top:8px;padding:0 8px}
.gc-cfs{font:800 var(--fs-30)/1.05 var(--sans);letter-spacing:-1px;color:var(--ink)}
.gc-cfs small{font:600 var(--fs-11) var(--mono);color:var(--mut)}
.gc-meta{font:500 var(--fs-11) var(--mono);color:var(--mut-2)}
.gc-extra{font:600 var(--fs-11) var(--mono);color:var(--mut-2);min-height:14px;padding:0 6px}
.gc-usgs{font:700 var(--fs-11) var(--sans);color:var(--safe);margin-top:4px}

/* ===== BACK-TO-HOME LINK (national root) ===== */
.home-link{display:flex;align-items:center;gap:10px;margin:-14px 0 18px;padding:9px 14px;border-radius:var(--r-md);
  font:600 var(--fs-11)/1 var(--sans);letter-spacing:.4px;text-transform:uppercase;color:var(--mut-2);
  text-decoration:none;transition:background .15s ease,color .15s ease}
.home-link:hover{background:var(--pale);color:var(--ink)}
.home-link .hl-ico{font-size:var(--fs-15);line-height:1;flex:none}
.app.collapsed .home-link{justify-content:center;padding:9px 0;margin:-8px 0 14px}

/* ---- Field Report live pulse chip ---- */
.sb-user{cursor:pointer;border-radius:var(--r-md);transition:background .15s}
.sb-user:hover,.sb-user:focus-visible{background:#e7edf3;outline:none}
#fr-ring.live{font:800 var(--fs-11)/1 var(--mono);color:var(--ink);letter-spacing:0}

/* ---- accessibility ---- */
.river-row:focus-visible,.nearby-item:focus-visible,.mini-stat.best:focus-visible,
.gc:focus-visible,.brand:focus-visible,.cta-card:focus-visible,
.sg-item summary:focus-visible,.wxm-acc summary:focus-visible{
  outline:3px solid var(--link);outline-offset:-3px;border-radius:var(--r-md)}
h2.card-title,h3.card-h{margin:0;font-family:var(--sans)}
h2.card-title{font:800 var(--fs-16) var(--sans);color:var(--ink)}
h3.card-h{font:800 var(--fs-14) var(--sans);color:var(--ink);margin-bottom:14px}
.skip-link{position:absolute;left:-9999px;top:0;z-index:2000;background:var(--ink);color:#fff;
  padding:12px 18px;border-radius:0 0 12px 0;font:700 var(--fs-14) var(--sans);text-decoration:none}
.skip-link:focus{left:0}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* static river index + FAQ kept in the DOM for crawlers — shown once, on the rivers view */
.seo-static{margin-top:28px;border-top:1px solid var(--line);padding-top:8px}
.seo-static > summary{cursor:pointer;padding:14px 2px;font:700 var(--fs-14) var(--sans);color:var(--ink)}
.seo-static > summary:focus-visible{outline:3px solid var(--link);outline-offset:2px}
.content.is-detail .seo-static,.content.is-detail .seo-faq,
.content.is-report .seo-static,.content.is-report .seo-faq,
.content.is-learn .seo-static,.content.is-learn .seo-faq{display:none}

/* ---------- usability pass (merged from main, 2026-09-06) ---------- */
.crumbs{display:flex;align-items:center;gap:6px;font:600 var(--fs-12) var(--sans);color:var(--mut-2);margin-bottom:var(--sp-2);flex-wrap:wrap}
.crumbs a,.crumbs button{background:none;border:0;padding:0;font:inherit;color:var(--link);cursor:pointer;text-decoration:none}
.crumbs a:hover,.crumbs button:hover{text-decoration:underline}
.crumbs b{color:var(--ink)}
.cfs-help{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;border:1px solid var(--line-2);background:var(--paper);color:var(--mut-2);font:700 var(--fs-11) var(--sans);cursor:pointer;margin-left:6px;align-self:center}
.cfs-help:hover,.cfs-help:focus-visible{color:var(--ink);border-color:var(--ink)}
.nearby-strip{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap;margin:-8px 0 18px;padding:var(--sp-2) var(--sp-3);border:1px solid var(--line-2);border-radius:var(--r-md);background:var(--paper);font:600 var(--fs-12) var(--sans);color:var(--mut-2)}
.ns-item{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line-2);border-radius:var(--r-pill);padding:6px 11px;background:var(--paper);color:var(--ink);font:600 var(--fs-12) var(--sans);cursor:pointer}
.ns-item i{width:8px;height:8px;border-radius:50%;display:inline-block}
.ns-item:hover{background:var(--pale)}
.if-more{border:1px dashed var(--line-2);border-radius:var(--r-md);padding:4px 12px}
.if-more summary{cursor:pointer;font:600 var(--fs-12) var(--sans);color:var(--mut-2);padding:8px 0;list-style:none;display:flex;align-items:center;gap:8px}
.if-more summary::-webkit-details-marker{display:none}
.if-more summary::before{content:"+";display:inline-flex;width:18px;height:18px;border-radius:50%;border:1px solid var(--line-2);align-items:center;justify-content:center;font-weight:800}
.if-more[open] summary::before{content:"–"}
.if-more[open] summary{margin-bottom:var(--sp-2)}
.if-river-other{margin-top:6px}
.pin-modal{position:fixed;inset:0;z-index:2000;background:rgba(1,33,65,.55);display:flex;align-items:center;justify-content:center;padding:var(--sp-4)}
.pm-box{background:var(--paper);border-radius:var(--r-lg);width:min(720px,100%);box-shadow:var(--sh-3);display:flex;flex-direction:column;overflow:hidden}
.pm-head,.pm-foot{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);font:600 var(--fs-13) var(--sans)}
.pm-map{height:min(60vh,460px)}
.pm-map .leaflet-container{height:100%;cursor:crosshair}
.pm-txt{font:600 var(--fs-12) var(--mono);color:var(--mut-2)}
@media (max-width:760px){
  .g-chips{display:none}
  .nav-item{min-height:44px}
  .pill,.chip,.range-pill,.acc-chip,.kind-opt{min-height:40px}
  .btn--sm{height:40px}
  .crumbs{font-size:var(--fs-11)}
}

/* ---------- map filters + expand (2026-09-06) ---------- */
.map-legend--filter{gap:6px 8px}
.lg{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line-2);border-radius:var(--r-pill);padding:5px 10px;background:var(--paper);color:var(--mut-2);font:600 var(--fs-12) var(--sans);cursor:pointer;min-height:32px}
.lg i{margin-right:0}
.lg .lg-n{font:600 var(--fs-11) var(--mono);color:var(--mut-3);margin-left:2px}
.lg:hover{border-color:var(--ink);color:var(--ink)}
.lg.active{background:var(--ink);border-color:var(--ink);color:#fff}
.lg.active .lg-n{color:#cfe6f7}
button.mini-stat{border:2px solid transparent;text-align:left;cursor:pointer;font:inherit;width:100%}
button.mini-stat:hover{border-color:rgba(1,33,65,.25)}
button.mini-stat.active{border-color:var(--ink)}
button.mini-stat:focus-visible{outline:3px solid var(--link);outline-offset:2px}
.map-expand{position:absolute;top:10px;right:10px;z-index:800;border:1px solid var(--line-2);background:var(--paper);color:var(--ink);font:700 var(--fs-12) var(--sans);padding:7px 11px;border-radius:var(--r-md);cursor:pointer;box-shadow:var(--sh-2)}
.map-expand:hover{background:var(--pale)}
.pm-box.pm-wide{width:min(1100px,100%)}
.pm-map--tall{height:min(78vh,760px)}
.pm-foot .map-legend{margin-top:0}
.pm-acc-swatch{display:inline-block;width:12px;height:12px;border-radius:4px;background:var(--ink);margin-right:6px;vertical-align:-1px}
@media (max-width:720px){.pin-modal{padding:8px}.pm-map--tall{height:70vh}}
.map-base{position:absolute;top:10px;left:52px;z-index:800;display:flex;gap:2px;background:var(--paper);border:1px solid var(--line-2);border-radius:var(--r-md);padding:2px;box-shadow:var(--sh-2)}
.map-base button{border:0;background:transparent;font:700 var(--fs-11) var(--sans);color:var(--mut-2);padding:6px 9px;border-radius:var(--r-sm);cursor:pointer;min-height:28px}
.map-base button:hover{color:var(--ink)}
.map-base button.active{background:var(--ink);color:#fff}
.pm-map .map-base{top:10px;left:52px}

/* phones: the river list is the answer — it comes before the map (which stays one flick down).
   #main carries is-<view>, so this only touches the Rivers view. */
@media (max-width:760px){
  .is-rivers #view{display:flex;flex-direction:column}
  .is-rivers #view > .map-card{order:5}
  .is-rivers #view > .colophon{order:9}
}

/* ---------- forecast on the chart + banner ---------- */
.chart-future{position:absolute;top:0;bottom:0;border-left:1.5px dashed rgba(1,33,65,.35);pointer-events:none}
.chart-future span{position:absolute;top:6px;left:6px;font:700 var(--fs-10) var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--mut-2);background:rgba(255,255,255,.8);padding:2px 6px;border-radius:var(--r-sm)}
.chart-dot{transform:translate(-50%,-50%)}
.cb-fc{margin-top:6px;font:600 var(--fs-13)/1.45 var(--sans);color:var(--ink);text-align:right;max-width:340px;margin-left:auto}
.cb-fc:empty{display:none}
.cb-fc b{color:var(--link)}

/* ---------- overlays + 3D ---------- */
.ov-chips{margin-top:8px}
.ov-chip .ov-n{font:600 var(--fs-10) var(--mono);color:var(--mut-3);margin-left:2px}
.pm-actions{display:flex;gap:8px;align-items:center}
.pm-foot{flex-wrap:wrap;align-items:flex-start;flex-direction:column;gap:6px}
.pm-foot .ov-chips{margin-top:0}
.pm-map.is-3d{background:#0b1b2b}
.map-base--3d{top:10px;right:10px;left:auto}
.maplibregl-popup-content{font:500 var(--fs-13)/1.5 var(--sans);color:var(--ink);border-radius:var(--r-md);padding:10px 14px}
.maplibregl-ctrl-group{border-radius:var(--r-sm)}

/* ---------- still there / gone on community reports ---------- */
.vouch{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:10px;padding-top:10px;border-top:1px dashed var(--line-2)}
.vouch-q{font:600 var(--fs-12) var(--sans);color:var(--mut-2)}
.vouch-n{font:600 var(--fs-11) var(--mono);color:var(--mut-3);margin-left:2px}
.vouch-msg{font:500 var(--fs-12)/1.4 var(--sans);color:var(--mut-2);flex:1 1 100%}
.vouch-msg:empty{display:none}
.intel-item.is-gone{opacity:.55}

/* ---------- lettered access points: list badge matches the map pin ---------- */
.a-letter{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:6px;background:var(--ink);color:#fff;font:800 var(--fs-11) var(--sans);margin-right:10px;margin-top:1px}
.gm-acc{font-size:11px;letter-spacing:-.02em}
.river-casing,.river-line{pointer-events:none}

/* ---------- gauge numbers: the card and the map pin share a number ---------- */
.gc-num{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;margin-right:8px;border-radius:9px;background:rgba(255,255,255,.92);color:var(--ink);font:800 var(--fs-11) var(--sans);vertical-align:middle}
.pm-gauge-swatch{display:inline-block;width:11px;height:11px;background:var(--ink);margin:0 8px 0 2px;border-radius:50% 50% 50% 0;transform:rotate(-45deg)}

/* share row under the go/no-go banner: the link previews as the live card */
.share-row{display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap;margin:10px 0 0;font:500 var(--fs-12)/1.5 var(--sans);color:var(--mut-2)}
.share-row .inline-link{font:600 var(--fs-12) var(--sans)}
.share-row span{flex:1 1 220px;min-width:0}