
*{box-sizing:border-box} html{-webkit-text-size-adjust:100%}
body{margin:0;color:var(--ink);font-family:'Overpass',system-ui,sans-serif;line-height:1.5;
 background-color:var(--bg2);
 background-image:
  repeating-linear-gradient(0deg,rgba(var(--edge),.05) 0 1px,transparent 1px 78px),
  repeating-linear-gradient(90deg,rgba(var(--edge),.05) 0 1px,transparent 1px 78px),
  radial-gradient(150% 100% at 50% -8%,rgba(var(--edge),.20),transparent 60%),
  linear-gradient(180deg,var(--bg1),var(--bg2) 72%);
 background-attachment:fixed}
a{color:var(--acc);text-decoration:none} a:hover{text-decoration:underline}
.mono{font-family:'JetBrains Mono',ui-monospace,monospace}
.wrap{max-width:1000px;margin:0 auto;padding:1.2rem 1.15rem 4rem}
.crumbs{font-family:'JetBrains Mono',monospace;font-size:.74rem;letter-spacing:.03em;color:var(--dim);margin:.2rem 0 1.2rem}
.crumbs a{color:var(--dim)} .crumbs b{color:var(--ink)} .crumbs span{opacity:.5;margin:0 .4rem}
.shield{display:inline-flex;align-items:center;gap:.4rem;border:3px solid #fff;border-radius:10px;padding:.3rem .7rem;
 font-family:'Overpass';font-weight:900;letter-spacing:.01em;color:#fff;background:var(--g1);font-size:.95rem}
.shield .s2{color:var(--dim)}
.eyebrow{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:.7rem;letter-spacing:.18em;
 text-transform:uppercase;color:var(--dim);margin:1.1rem 0 .3rem}
h1{font-family:'Overpass';font-weight:900;letter-spacing:-.02em;font-size:clamp(2.2rem,7vw,3.8rem);margin:.1rem 0;line-height:1.02}
h1 .st{color:var(--acc)}
.sub{color:var(--dim);font-family:'JetBrains Mono',monospace;font-size:.82rem}
/* guide-sign hero */
.sign{border:4px solid #fff;border-radius:16px;background:var(--g1);padding:1.3rem 1.5rem;margin:1.3rem 0 1.6rem;
 box-shadow:0 10px 40px rgba(0,0,0,.4)}
.sign.dry{background:#5a4712;border-color:var(--dry)}
.sign .kick{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
.sign .big{font-family:'Overpass';font-weight:900;font-size:clamp(1.9rem,5.5vw,3rem);line-height:1.03;margin:.25rem 0;color:#fff}
.sign .val{font-family:'Overpass';font-weight:900;font-size:clamp(2.8rem,9vw,4.6rem);line-height:.9;color:#fff}
.sign .val .u{font-size:.32em;color:var(--dim);vertical-align:super;margin-left:.05em}
.rule{display:flex;align-items:center;gap:.9rem;margin:2.1rem 0 1rem}
.rule h2{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:.9rem;letter-spacing:.03em;text-transform:uppercase;white-space:nowrap;margin:0}
.rule .ln{flex:1;height:2px;background:rgba(var(--edge),.4)}
.mmrow{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem} @media(max-width:720px){.mmrow{grid-template-columns:1fr 1fr}}
.mm{border:3px solid #fff;border-radius:12px;background:var(--g1);padding:.9rem .8rem;text-align:center}
.mm.dry{border-color:var(--dry);background:#4c3c10}
.mmlab{font-family:'JetBrains Mono',monospace;font-size:.64rem;letter-spacing:.08em;color:var(--dim);font-weight:700}
.mmval{font-family:'Overpass';font-weight:900;font-size:1.9rem;color:#fff;line-height:1;margin:.3rem 0}
.mmval .u{font-size:.4em;color:var(--dim);vertical-align:super}
.mmsub{font-family:'JetBrains Mono',monospace;font-size:.64rem;color:var(--dim);line-height:1.4}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:1rem} @media(max-width:640px){.grid2{grid-template-columns:1fr}}
.card{border:2px solid rgba(var(--edge),.5);border-radius:12px;background:rgba(255,255,255,.04);padding:1.1rem 1.2rem}
.card h3{margin:0 0 .5rem;font-family:'JetBrains Mono',monospace;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
.stat{font-family:'Overpass';font-weight:900;font-size:1.9rem;color:#fff;line-height:1}
.stat .u{font-size:.42em;color:var(--dim);vertical-align:super}
.statline{font-family:'JetBrains Mono',monospace;font-size:.76rem;color:var(--dim);margin-top:.4rem}
/* board */
.board{border:2px solid rgba(var(--edge),.4);border-radius:14px;overflow:hidden;margin-top:.5rem}
.row{display:flex;align-items:center;gap:.9rem;padding:.8rem 1.1rem;color:inherit;text-decoration:none;
 border-bottom:1px solid rgba(var(--edge),.16)}
.row:nth-child(odd){background:rgba(255,255,255,.03)} .row:last-child{border-bottom:0}
.row:hover{background:rgba(var(--edge),.14);text-decoration:none}
.row .rk{font-family:'JetBrains Mono',monospace;color:var(--dim);font-size:.8rem;width:2.2rem}
.row .city{flex:1;font-weight:700} .row .city .st{color:var(--dim);font-weight:400;font-size:.85em}
.row .chip{font-family:'JetBrains Mono',monospace;font-size:.72rem;font-weight:700;padding:.28rem .6rem;border-radius:7px;
 background:rgba(var(--edge),.16);border:1px solid rgba(var(--edge),.4);white-space:nowrap}
.row .chip.dry{background:rgba(244,194,80,.14);border-color:rgba(244,194,80,.5);color:var(--dry)}
.row .chip.wet{background:rgba(89,192,255,.14);border-color:rgba(89,192,255,.5);color:var(--wet)}
.row .val{font-family:'Overpass';font-weight:900;font-size:1.15rem;width:4.4rem;text-align:right}
.rtoggle{display:flex;flex-wrap:wrap;gap:.4rem;margin:.5rem 0 1rem}
.rtoggle button{font-family:'JetBrains Mono',monospace;font-size:.78rem;font-weight:700;padding:.4rem .65rem;
 border-radius:7px;border:1px solid rgba(var(--edge),.3);background:rgba(var(--edge),.08);color:var(--ink);cursor:pointer}
.rtoggle button.on{background:var(--acc);color:#04241a;border-color:var(--acc)}
.rtoggle button:hover{background:rgba(var(--edge),.2)}
.mapwrap img{width:100%;height:auto;display:block;border-radius:12px;border:2px solid rgba(var(--edge),.3)}
.sharecard img{width:100%;max-width:300px;height:auto;display:block;margin:0 auto;border-radius:14px;border:2px solid rgba(var(--edge),.4)}
.sharebtns{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center;margin-top:.7rem}
.sharebtns a,.sharebtns button{font-family:'JetBrains Mono',monospace;font-size:.82rem;font-weight:700;padding:.55rem .95rem;
 border-radius:10px;border:1px solid rgba(var(--edge),.4);background:rgba(var(--edge),.1);color:var(--ink);cursor:pointer;text-decoration:none}
.sharebtns a:hover,.sharebtns button:hover{background:rgba(var(--edge),.2);text-decoration:none}
.sharebtns .primary{background:var(--acc);color:#04241a;border-color:var(--acc)}
.statebar{display:flex;flex-wrap:wrap;gap:.4rem;margin:.6rem 0 1.2rem}
.statebar a{font-family:'JetBrains Mono',monospace;font-size:.8rem;padding:.35rem .6rem;border-radius:7px;
 background:rgba(var(--edge),.1);border:1px solid rgba(var(--edge),.3);color:var(--ink);display:flex;gap:.4rem}
.statebar a .d{color:var(--dim)}
.foot{margin-top:3rem;padding-top:1.2rem;border-top:2px solid rgba(var(--edge),.35);color:var(--dim);
 font-family:'JetBrains Mono',monospace;font-size:.74rem;line-height:1.8}
/* MUTCD diamond warning signs — yellow (rain/watch), red (drought/severe) */
.warn{display:flex;align-items:center;gap:1.1rem;border-radius:14px;padding:1rem 1.2rem;margin:1.2rem 0;
 border:3px solid var(--warn);background:rgba(247,201,72,.10)}
.warn.red{border-color:var(--danger);background:rgba(226,59,46,.12)}
.diamond{width:66px;height:66px;flex:none;background:var(--warn);border:3px solid #1c1500;border-radius:9px;
 transform:rotate(45deg);display:grid;place-items:center;box-shadow:0 4px 14px rgba(0,0,0,.4)}
.warn.red .diamond{background:var(--danger);border-color:#2a0a06}
.diamond b{transform:rotate(-45deg);font-family:'Overpass';font-weight:900;font-size:1.7rem;color:#1c1500;line-height:1}
.diamond .dg{transform:rotate(-45deg);width:32px;height:32px} .diamond .dg path{fill:#1c1500}
.warn.red .diamond b{color:#fff} .warn.red .diamond .dg path{fill:#fff}
.warn .wtxt{flex:1}
.warn .wkick{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:.72rem;letter-spacing:.14em;
 text-transform:uppercase;color:var(--warn)}
.warn.red .wkick{color:var(--danger)}
.warn .wbig{font-family:'Overpass';font-weight:900;font-size:clamp(1.2rem,3.4vw,1.7rem);color:#fff;line-height:1.1;margin:.15rem 0}
.warn .wsub{font-family:'JetBrains Mono',monospace;font-size:.74rem;color:var(--dim)}
.warn .wval{font-family:'Overpass';font-weight:900;font-size:clamp(1.8rem,5vw,2.6rem);color:#fff;text-align:right}
.warn .wval .u{font-size:.4em;color:var(--dim);vertical-align:super}
/* map-first hero band — mimics hottestsince, green guide-sign palette */
.hero{background:linear-gradient(160deg,var(--g2),var(--g1) 58%,var(--g0));border-bottom:2px solid rgba(var(--edge),.45);
 margin:-1.2rem -1.15rem 2.4rem;padding:2.9rem 1.2rem 3.1rem;text-align:center}
.hero .shield{margin-bottom:1.1rem}
.hero .eyebrow{display:flex;justify-content:center;color:#e6f7ee;margin:0 0 .3rem}
.hero h1{font-size:clamp(2.6rem,8vw,4.2rem);margin:.15rem 0}
.hero .tag{font-family:'Overpass';font-weight:900;font-size:clamp(1.2rem,3.2vw,1.7rem);color:#fff;margin:.9rem 0 0}
.hero .sub{color:rgba(255,255,255,.82);max-width:56ch;margin:.85rem auto 0}
.xlink{display:inline-flex;align-items:center;gap:.5rem;margin-top:1.5rem;padding:.5rem .95rem;border-radius:999px;
 border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.08);color:#fff;
 font-family:'JetBrains Mono',monospace;font-size:.8rem;font-weight:700}
.xlink:hover{background:rgba(255,255,255,.16);text-decoration:none} .xlink b{color:var(--acc)}
/* map figure (hottestsince treatment: rounded, shadow, caption) */
.maps{display:grid;grid-template-columns:1fr;gap:1.2rem;justify-items:center}
.maps figure{margin:0;border-radius:12px;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.45);
 background:var(--g1);border:2px solid rgba(var(--edge),.3);max-width:100%}
/* regional zooms are capped at 1000px on the long side — natural size, never upscaled past that */
.maps img{max-width:100%;height:auto;display:block}
.maps figcaption{padding:.7rem 1rem;color:var(--dim);font-size:.82rem;font-family:'JetBrains Mono',monospace}
