/* Layout: chart-room console. Alert strip, then map beside a storm card, then town lookup, hazards, sources. */
:root{
  --bg:#eef2f4; --surface:#ffffff; --ink:#14212b; --muted:#566673; --line:#d3dce2;
  --water:#cfe0ea; --land:#f3efe4; --border:#b9b2a0; --accent:#0d5c7a;
  --hu:#d22d3d; --hw:#f08ca0; --ts:#2b62d9; --tw:#e8c547; --ssw:#b13bc0; --ssa:#c9a2e4; --cone:rgba(20,33,43,.10); --coneline:rgba(20,33,43,.55);
  --warnbg:#fde8ea; --warnink:#7d1320;
  --display:"Barlow Condensed","Arial Narrow",system-ui,sans-serif;
  --body:"Public Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#0f171d; --surface:#16212a; --ink:#e6edf1; --muted:#9aabb7; --line:#2a3945;
  --water:#13283a; --land:#25303a; --border:#45525d; --accent:#5cb8d8;
  --hu:#ff5a69; --hw:#ff9fb3; --ts:#6b9bff; --tw:#f0d060; --ssw:#d670e2; --ssa:#9c7cc0; --cone:rgba(230,237,241,.10); --coneline:rgba(230,237,241,.55);
  --warnbg:#3a1419; --warnink:#ffc9cf; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0f171d; --surface:#16212a; --ink:#e6edf1; --muted:#9aabb7; --line:#2a3945;
  --water:#13283a; --land:#25303a; --border:#45525d; --accent:#5cb8d8;
  --hu:#ff5a69; --hw:#ff9fb3; --ts:#6b9bff; --tw:#f0d060; --ssw:#d670e2; --ssa:#9c7cc0; --cone:rgba(230,237,241,.10); --coneline:rgba(230,237,241,.55);
  --warnbg:#3a1419; --warnink:#ffc9cf; color-scheme:dark}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font:15px/1.5 var(--body);margin:0}
.wrap{max-width:1240px;margin:0 auto;padding-inline:20px;padding-block:0 40px}
a{color:var(--accent)}
a:focus-visible,select:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
h1,h2,h3{font-family:var(--display);font-weight:700;letter-spacing:.01em;text-wrap:balance;margin:0;line-height:1.05}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
.eyebrow{font:600 12px/1 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}

header.top{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:end;justify-content:space-between;padding-block:22px 14px;border-bottom:1px solid var(--line)}
.brand{display:flex;gap:12px;align-items:center}
.brand h1{font-size:34px;text-transform:uppercase}
.brand svg{flex:none}
.stamp{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;color:var(--muted);font-size:13px}
.chip{display:inline-block;border:1px solid var(--line);border-radius:3px;padding:2px 8px;font:600 11px/1.6 var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}

.alert{margin-block:18px;background:var(--warnbg);color:var(--warnink);border-left:6px solid var(--hu);padding:14px 18px;display:grid;gap:4px}
.alert strong{font-family:var(--display);font-size:24px;text-transform:uppercase;letter-spacing:.02em}
.alert p{margin:0;max-width:80ch}

.main{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:20px;align-items:start}
@media (max-width:900px){.main{grid-template-columns:1fr}}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:4px}
.mapbox{padding:10px;min-width:0}
.mapbox svg{display:block;width:100%;height:auto;max-width:100%}
.legend{display:flex;flex-wrap:wrap;gap:6px 16px;padding:10px 6px 2px;font-size:12.5px;color:var(--muted)}
.legend span{display:inline-flex;gap:6px;align-items:center}
.sw{width:22px;height:5px;border-radius:2px;display:inline-block}

.storm{padding:18px 20px;display:grid;gap:16px;min-width:0}
.storm .name{display:flex;gap:12px;align-items:baseline;flex-wrap:wrap}
.storm h2{font-size:40px;text-transform:uppercase}
.cat{font:700 13px/1 var(--body);letter-spacing:.06em;text-transform:uppercase;background:var(--hu);color:#fff;padding:5px 8px;border-radius:3px}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:12px 18px}
.stat .v{font:700 30px/1 var(--display)}
.stat .v small{font:500 14px var(--body);color:var(--muted);margin-left:4px}
.stat .k{font-size:12.5px;color:var(--muted)}
table{border-collapse:collapse;width:100%;font-size:13.5px}
th{font:600 11px/1.3 var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-align:left;padding:6px 8px 6px 0;border-bottom:1px solid var(--line)}
td{padding:7px 8px 7px 0;border-bottom:1px solid var(--line);vertical-align:top}
td.num{font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.tbl{overflow-x:auto}
.links{display:flex;flex-wrap:wrap;gap:8px}
.btn{display:inline-block;text-decoration:none;border:1px solid var(--line);border-radius:3px;padding:7px 11px;font:600 13px var(--body);color:var(--ink);background:var(--bg)}
.btn:hover{border-color:var(--accent);color:var(--accent)}

section.block{margin-top:28px}
section.block > h2{font-size:28px;text-transform:uppercase;margin-bottom:12px}
.town{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:20px;padding:18px 20px}
@media (max-width:760px){.town{grid-template-columns:1fr}}
label{display:block;font-weight:600;margin-bottom:6px}
select{width:100%;font:500 16px var(--body);padding:10px;border:1px solid var(--line);border-radius:3px;background:var(--bg);color:var(--ink)}
.result{display:grid;gap:10px;min-width:0}
.result h3{font-size:30px}
.tags{display:flex;flex-wrap:wrap;gap:6px}
.tag{font:700 12px/1 var(--body);letter-spacing:.05em;text-transform:uppercase;padding:6px 8px;border-radius:3px;color:#fff}
.tag.hu{background:var(--hu)}.tag.ts{background:var(--ts)}.tag.ssw{background:var(--ssw)}.tag.ssa{background:var(--ssa);color:#24112f}.tag.none{background:var(--line);color:var(--ink)}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px 18px}
.facts div b{display:block;font:700 22px/1.1 var(--display)}
.facts div span{font-size:12.5px;color:var(--muted)}
.note{font-size:13px;color:var(--muted);margin:0;max-width:70ch}

.ww{display:grid;gap:0}
.ww .row{display:grid;grid-template-columns:200px minmax(0,1fr);gap:12px;padding:12px 20px;border-bottom:1px solid var(--line);align-items:center}
.ww .row:last-child{border-bottom:0}
@media (max-width:600px){.ww .row{grid-template-columns:1fr;gap:4px}}
.ww .lab{display:flex;gap:10px;align-items:center;font-weight:700}
.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
@media (max-width:860px){.two{grid-template-columns:1fr}}
.pad{padding:16px 20px}
.bar{display:inline-block;height:8px;background:var(--ssw);border-radius:2px;vertical-align:middle;margin-right:8px}

.src{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
@media (max-width:900px){.src{grid-template-columns:1fr}}
.src .panel{padding:16px 20px}
.src h3{font-size:20px;text-transform:uppercase;margin-bottom:8px}
.src ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.src li a{font-weight:600}
.src li span{display:block;font-size:12.5px;color:var(--muted)}

.ad{border:1px dashed var(--border);border-radius:4px;padding:16px 20px;display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center;justify-content:space-between;color:var(--muted);font-size:13.5px;margin-top:20px}
.ad b{color:var(--ink);font-family:var(--display);font-size:20px;text-transform:uppercase}
.other{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
@media (max-width:700px){.other{grid-template-columns:1fr}}
.other .panel{padding:14px 18px;display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap}
footer{margin-top:36px;padding-top:16px;border-top:1px solid var(--line);font-size:12.5px;color:var(--muted);display:grid;gap:6px}
footer p{margin:0;max-width:90ch}

.spag{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:20px;align-items:start}
@media (max-width:900px){.spag{grid-template-columns:1fr}}
.legend .grp{display:inline-flex;gap:6px;align-items:center;cursor:pointer;color:var(--ink);font-weight:500}
.legend .grp input{accent-color:var(--accent);margin:0}
.dot{width:10px;height:10px;border-radius:50%;display:inline-block}

.comm{display:grid;grid-template-columns:minmax(0,360px) minmax(0,1fr);gap:20px;align-items:start}
@media (max-width:820px){.comm{grid-template-columns:1fr}}
.askform{display:grid;gap:14px}
.kinds{display:flex;flex-wrap:wrap;gap:8px}
.kinds label{margin:0;display:inline-flex;gap:6px;align-items:center;font-weight:600;border:1px solid var(--line);border-radius:3px;padding:6px 10px;cursor:pointer;background:var(--bg)}
.kinds label:has(input:checked){border-color:var(--accent);color:var(--accent)}
.kinds input{accent-color:var(--accent);margin:0}
textarea{width:100%;font:15px/1.45 var(--body);padding:10px;border:1px solid var(--line);border-radius:3px;background:var(--bg);color:var(--ink);resize:vertical}
textarea:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.formrow{display:flex;justify-content:flex-end;margin-top:4px}
button.primary{font:700 15px var(--body);letter-spacing:.02em;background:var(--accent);color:var(--surface);border:0;border-radius:3px;padding:11px 16px;cursor:pointer}
button.primary:disabled{opacity:.5;cursor:default}
.feed{display:grid;gap:12px;min-width:0}
.post{padding:14px 18px;display:grid;gap:8px;min-width:0}
.post .meta{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;font-size:12.5px;color:var(--muted)}
.post .kind{font:700 11px/1 var(--body);letter-spacing:.08em;text-transform:uppercase;padding:4px 7px;border-radius:3px;border:1px solid currentColor}
.post .kind.question{color:var(--accent)}.post .kind.concern{color:var(--hu)}.post .kind.idea{color:var(--ssw)}
.post .body{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
.ai{border-left:3px solid var(--accent);background:var(--bg);padding:10px 12px;display:grid;gap:4px}
.ai .lab{font:600 11px/1.3 var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.ai p{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
.linkbtn{background:none;border:0;padding:0;font:600 12.5px var(--body);color:var(--accent);cursor:pointer;text-decoration:underline}
.empty{color:var(--muted)}

/* map */
.m-water{fill:var(--water)} .m-land{fill:var(--land);stroke:var(--border);stroke-width:.8}
.m-state{fill:none;stroke:var(--border);stroke-width:.6;stroke-dasharray:3 2}
.m-border{fill:none;stroke:var(--border);stroke-width:.9}
.m-grid{stroke:var(--ink);stroke-opacity:.08;stroke-width:.6}
.m-gridlab{fill:var(--muted);font:500 10px var(--mono)}
.m-cone{fill:var(--cone);stroke:var(--coneline);stroke-width:1;stroke-dasharray:4 3}
.m-track{fill:none;stroke:var(--ink);stroke-width:1.6}
.m-past{fill:none;stroke:var(--ink);stroke-width:1.4;stroke-dasharray:2 3;opacity:.7}
.m-ts{fill:var(--ts);fill-opacity:.13;stroke:var(--ts);stroke-opacity:.6;stroke-width:1}
.m-hu{fill:var(--hu);fill-opacity:.25;stroke:var(--hu);stroke-width:1}
.m-lab{fill:var(--ink);font:600 11px var(--body);paint-order:stroke;stroke:var(--surface);stroke-width:3px;stroke-linejoin:round}
.m-city{fill:var(--surface);stroke:var(--ink);stroke-width:1.2}
.m-city.sel{fill:var(--accent);stroke:var(--accent)}
.m-citylab{fill:var(--muted);font:500 10.5px var(--body);paint-order:stroke;stroke:var(--surface);stroke-width:3px}
.m-citylab.sel{fill:var(--ink);font-weight:700}
.m-reach{stroke:var(--accent);stroke-width:1.4;stroke-dasharray:3 3}
@media (prefers-reduced-motion:no-preference){.pulse{animation:pulse 2.4s ease-out infinite;transform-origin:center;transform-box:fill-box}
@keyframes pulse{0%{opacity:.55;transform:scale(.6)}100%{opacity:0;transform:scale(2.2)}}}

.stale{margin-top:16px;background:#fff4d6;color:#5c4200;border-left:6px solid #e0a800;padding:12px 16px;font-weight:600}
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.tabs button{font:600 14px var(--body);padding:8px 12px;border:1px solid var(--line);border-radius:3px;background:var(--surface);color:var(--ink);cursor:pointer}
.tabs button[aria-pressed="true"]{border-color:var(--accent);color:var(--accent)}
.sw.cone{background:var(--cone);border:1px dashed var(--coneline);height:10px}
.side{display:grid;gap:14px;min-width:0}
.lead{margin:6px 0 0;font-size:16px}
.hz{display:grid;gap:12px}
.hz p{margin:0}
.ww .areas{display:grid;gap:2px}
.stamp b{color:var(--ink)}
.alerts{display:grid;gap:8px}
.nwsalert{border-left:4px solid var(--hu);padding:6px 10px;background:var(--bg)}
.nwsalert b{display:block}
.nwsalert span{font-size:12.5px;color:var(--muted)}
.none-active{padding:20px}
[hidden]{display:none!important}
a.brand{text-decoration:none;color:inherit}
a.brand:hover h1{color:var(--accent)}
@media (prefers-color-scheme:dark){.stale{background:#3a2e08;color:#ffe08a}}