:root{--bg: #06080c;--bg-2: #0a0e15;--panel: #0e131c;--panel-2: #131a26;--line: #1d2635;--ink: #eef2f8;--muted: #8c97aa;--dim: #5b6678;--amber: #ffb03a;--red: #ff3346;--cool: #cfe0ff;--rain: #4cc3ff;--hail: #ff4fd8;--warn: #a855f7;--alt: rgba(255, 243, 176, .8);--altc: #ffe27a;--kneeband: rgba(255, 255, 255, .05);--traffic: rgba(165, 180, 210, .42);--brand: var(--amber);--brand-ink: #ffc56b;--flow: #35d29a;--cyan: var(--rain);--radius: 18px;--mono: "JetBrains Mono", ui-monospace, "Cascadia Code", "Consolas", monospace;--sans: "Instrument Sans", "Segoe UI", system-ui, -apple-system, sans-serif;--display: "Big Shoulders Display", "Arial Narrow", Impact, sans-serif;--tabbar-height: 64px;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);--safe-right: env(safe-area-inset-right, 0px);color-scheme:dark}*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}h1,h2,h3{font-family:var(--display);font-weight:900;text-transform:uppercase;letter-spacing:.005em;line-height:.95;margin:0 0 8px}h1{font-size:clamp(34px,9vw,56px)}p{margin:0 0 8px;color:var(--muted)}a{color:var(--brand-ink)}button{font-family:var(--sans)}.app-shell{min-height:100dvh;display:flex;flex-direction:column;background:var(--bg);padding-top:var(--safe-top);padding-left:var(--safe-left);padding-right:var(--safe-right)}.app-main{flex:1;padding-block:16px calc(var(--tabbar-height) + var(--safe-bottom) + 16px);padding-inline:clamp(16px,4vw,40px)}.tabbar{position:fixed;left:0;right:0;bottom:0;display:flex;justify-content:space-around;align-items:stretch;height:calc(var(--tabbar-height) + var(--safe-bottom));padding-bottom:var(--safe-bottom);background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--line);z-index:10}.tab{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:var(--muted);text-decoration:none;min-height:44px;font-size:11px;font-weight:600;font-family:var(--sans)}.tab svg{width:22px;height:22px}.tab.active,.tab[aria-current=page]{color:var(--amber)}.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:16px;margin-bottom:12px}.eyebrow{font-family:var(--mono);font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}.btn{font-family:var(--sans);font-weight:700;font-size:14px;min-height:44px;border-radius:14px;border:1px solid var(--line);background:var(--panel-2);color:var(--ink);padding:10px 18px;cursor:pointer}.btn.primary{background:var(--amber);border-color:var(--amber);color:#140b00;box-shadow:0 10px 30px #ff8c1e40}.map-tag{font:600 11.5px var(--sans);color:var(--ink);background:#070c18db;border:1px solid var(--line);border-radius:6px;padding:2px 6px;white-space:nowrap;pointer-events:none}.map-tag.danger{border-color:var(--amber);color:var(--amber)}.map-tag.tick{font-weight:500;color:var(--muted)}.seg-pop{font:13px var(--sans);color:#0e1320;display:grid;gap:3px}.seg-pop strong{font-size:14px}.seg-pop span{color:#5a6380;margin-right:6px}.range{width:100%;margin:6px 0 2px;-webkit-appearance:none;appearance:none;height:44px;background:transparent}.range::-webkit-slider-runnable-track{height:6px;border-radius:6px;background:linear-gradient(90deg,var(--cool),var(--amber),var(--red))}.range::-moz-range-track{height:6px;border-radius:6px;background:linear-gradient(90deg,var(--cool),var(--amber),var(--red))}.range::-webkit-slider-thumb{-webkit-appearance:none;width:30px;height:30px;margin-top:-12px;border-radius:50%;background:var(--ink);border:4px solid var(--bg);box-shadow:0 0 0 2px var(--ink)}.range::-moz-range-thumb{width:24px;height:24px;border-radius:50%;background:var(--ink);border:4px solid var(--bg)}.say{font-size:14.5px;color:var(--ink);min-height:44px;margin:4px 0 0}.notes{list-style:none;padding:0;margin:10px 0 0;display:grid;gap:8px}.notes li{position:relative;padding-left:28px;font-size:14px;color:var(--muted)}.notes li b{color:var(--ink)}.notes li b.best{color:var(--amber)}.notes li b.alt{color:var(--altc)}.notes li b.later{color:var(--red)}.notes .sw{position:absolute;left:0;top:3px;width:18px;height:14px;border-radius:4px}.notes .sw.best{background:var(--amber)}.notes .sw.knee{background:var(--kneeband);border:1px solid var(--muted)}.notes .sw.alt{background:var(--alt);border:1px solid var(--altc)}.notes .sw.later{background:var(--red)}.notes .sw.hatch{background:repeating-linear-gradient(45deg,var(--traffic) 0 2px,transparent 2px 5px);border:1px solid var(--line)}.tag{display:inline-flex;align-items:center;padding:6px 10px;border:1px solid var(--line);border-radius:99px;font:700 10px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);text-align:right}.state{display:flex;gap:14px;align-items:flex-start;flex-direction:column;min-height:320px}.state.error{flex-direction:row;border-color:var(--amber)}.state-icon{width:32px;height:32px;flex:none;color:var(--amber)}.state-title{font:900 24px/1.05 var(--display);text-transform:uppercase;margin-bottom:6px}.skeleton{width:100%;flex:1;min-height:220px;border-radius:12px;background:linear-gradient(90deg,var(--panel-2),var(--line),var(--panel-2));background-size:200% 100%;animation:shimmer 1.4s linear infinite}@keyframes shimmer{to{background-position:-200% 0}}@media(prefers-reduced-motion:reduce){.skeleton{animation:none}}.maplibregl-ctrl-attrib{background:#06080cc7!important;color:var(--muted)}.maplibregl-ctrl-attrib a{color:var(--muted)!important}.maplibregl-ctrl-group{background:var(--panel)!important}.maplibregl-ctrl-group button .maplibregl-ctrl-icon{filter:invert(1)}.flood-pin{width:28px;height:28px;border-radius:50%;border:2px solid currentColor;background:#070c18db;display:grid;place-items:center;padding:0;cursor:pointer}.flood-pin svg{width:16px;height:16px}.flood-pin.watch{color:var(--amber)}.flood-pin.danger{color:var(--red)}.flood-pin.warned{color:#bf5af2}.maplibregl-marker.map-tag{z-index:3}.maplibregl-marker.flood-pin{z-index:2}