*{box-sizing:border-box}html,body{margin:0;padding:0}:root{--ink: #eef4fb;--ink-dim: rgba(238, 244, 251, .64);--ink-faint: rgba(238, 244, 251, .4);--glass: rgba(9, 20, 38, .46);--glass-strong: rgba(9, 20, 38, .64);--glass-border: rgba(255, 255, 255, .14);--good: #7de3a5;--caution: #ffd166;--danger: #ff8177;--radius: 18px}body{font-family:Segoe UI Variable Display,Segoe UI,system-ui,-apple-system,Helvetica Neue,sans-serif;color:var(--ink);background:#0a1526;-webkit-font-smoothing:antialiased;overflow-x:hidden}a{color:inherit}::selection{background:#79c4ff59}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#ffffff29;border-radius:6px}.scene-canvas{position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100vh;display:block;z-index:0}.shell{position:relative;z-index:1;min-height:100vh;display:flex;flex-direction:column}.topbar{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;padding:22px clamp(16px,3.5vw,44px) 0}.topbar-id h1{margin:0;font-size:clamp(22px,2.6vw,32px);font-weight:600;letter-spacing:-.01em;text-shadow:0 2px 16px rgba(0,0,0,.35)}.topbar-meta{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap}.chip{font-size:12px;letter-spacing:.06em;padding:4px 11px;border-radius:999px;background:var(--glass);border:1px solid var(--glass-border);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);white-space:nowrap}.chip.subtle{color:var(--ink-dim)}.topbar-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.ghost-btn{font:inherit;font-size:13px;color:var(--ink);background:var(--glass);border:1px solid var(--glass-border);padding:8px 14px;border-radius:999px;cursor:pointer;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:background .15s;text-decoration:none;display:inline-block}.ghost-btn:hover{background:#2236549e}.unit-toggle{display:flex;border-radius:999px;overflow:hidden;border:1px solid var(--glass-border);background:var(--glass);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.unit-toggle button{font:inherit;font-size:12.5px;padding:8px 13px;background:transparent;color:var(--ink-dim);border:0;cursor:pointer}.unit-toggle button.on{background:#ffffff29;color:var(--ink)}.station-form{display:flex;gap:8px}.station-form input{font:inherit;font-size:13px;padding:8px 14px;border-radius:999px;border:1px solid var(--glass-border);background:#0914269e;color:var(--ink);width:175px;outline:none}.station-form input:focus{border-color:#ffffff6b}.station-form input::placeholder{color:var(--ink-faint)}.hero{display:flex;flex-direction:column;justify-content:flex-end;gap:14px;min-height:calc(100svh - 118px);padding:24px clamp(16px,3.5vw,44px) clamp(20px,5vh,56px)}.hero-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.badge{display:inline-flex;align-items:center;gap:9px;font-size:14px;font-weight:600;letter-spacing:.02em;padding:8px 15px;border-radius:999px;background:var(--glass-strong);border:1px solid var(--glass-border);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.badge-dot{width:8px;height:8px;border-radius:50%;flex:none}.tone-good .badge-dot{background:var(--good);box-shadow:0 0 10px var(--good)}.tone-caution .badge-dot{background:var(--caution);box-shadow:0 0 10px var(--caution)}.tone-danger .badge-dot{background:var(--danger);box-shadow:0 0 10px var(--danger)}.tone-caution{border-color:#ffd16666}.tone-danger{border-color:#ff817780}.tone-demo{color:var(--ink-dim);border-style:dashed;font-weight:400;text-transform:uppercase;font-size:11.5px;letter-spacing:.12em}.obs-age{font-size:13px;color:var(--ink-dim);text-shadow:0 1px 10px rgba(0,0,0,.45)}.obs-age.stale{color:var(--caution)}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px}.card{background:linear-gradient(155deg,#0d1a2fa8,#0a14266b);border:1px solid var(--glass-border);border-radius:var(--radius);padding:16px 20px 18px;backdrop-filter:blur(18px) saturate(150%);-webkit-backdrop-filter:blur(18px) saturate(150%);box-shadow:0 10px 34px #02081259}.card-label{margin:0 0 8px;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-dim);font-weight:600}.card-label-strong{color:var(--ink);margin-left:6px;letter-spacing:.06em}.card-flex{display:flex;justify-content:space-between;align-items:center;gap:12px}.big{margin:0;font-size:clamp(42px,4.4vw,60px);font-weight:200;line-height:1.04;letter-spacing:-.015em;font-variant-numeric:tabular-nums;text-shadow:0 2px 18px rgba(0,0,0,.28)}.big.med{font-size:clamp(28px,2.8vw,38px);display:flex;align-items:baseline;gap:6px}.unit{font-size:.38em;font-weight:400;color:var(--ink-dim);letter-spacing:0}.sub{margin:7px 0 0;font-size:13.5px;color:var(--ink-dim)}.sub-dim{color:var(--ink-faint)}.temp-rows{display:flex;flex-direction:column;gap:7px}.temp-tag{font-size:11px;text-transform:uppercase;letter-spacing:.13em;color:var(--ink-faint);margin-left:5px}.trend-arrow.rising{color:var(--good)}.trend-arrow.falling{color:var(--caution)}.cards.loading .big{opacity:.35}.error-card{max-width:480px}.error-card p{margin:0 0 12px}.compass{flex:none}.compass-ring{fill:#07101e66;stroke:#ffffff61;stroke-width:1}.tick{stroke:#fff6;stroke-width:1}.tick.major{stroke:#ffffffa8;stroke-width:1.5}.compass-cardinal{fill:#ffffffad;font-size:10px;letter-spacing:.05em}.needle-tail{stroke:#ffffffb8;stroke-width:2;stroke-linecap:round}.needle-head{fill:#79c4ff}.needle-hub{fill:#fff6}.alerts{display:flex;flex-direction:column;gap:8px}.alert{border-radius:12px;border:1px solid rgba(255,129,119,.5);background:#6e161057;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);padding:4px 15px}.alert summary{display:flex;gap:12px;align-items:baseline;cursor:pointer;padding:9px 0;list-style:none;flex-wrap:wrap}.alert summary::-webkit-details-marker{display:none}.alert-event{font-weight:700;font-size:14px;white-space:nowrap}.alert-headline{font-size:13px;color:var(--ink-dim)}.alert p{white-space:pre-line;font-size:13px;line-height:1.55;color:#eef4fbdb;margin:4px 0 10px}.alert.sev-moderate,.alert.sev-minor{border-color:#ffd16673;background:#70520e4d}.deck{margin-top:6vh;background:linear-gradient(180deg,#040a1400,#040a14a8 90px,#030811ed 300px,#030811f7);padding:34px 0 8px}.deck-inner{max-width:1240px;margin:0 auto;padding:0 clamp(16px,3.5vw,44px)}.section{margin:8px 0 28px}.section-title{font-size:12.5px;font-weight:600;text-transform:uppercase;letter-spacing:.16em;color:var(--ink-dim);margin:0 0 12px}.section-note{color:var(--ink-faint);text-transform:none;letter-spacing:.04em;font-weight:400}.card.pad{padding:18px 22px}.trends{display:grid;grid-template-columns:repeat(auto-fit,minmax(235px,1fr));gap:12px}.trend{text-align:left;cursor:pointer;font:inherit;color:inherit;transition:transform .16s,box-shadow .16s}.trend:hover{transform:translateY(-2px)}.trend-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px}.trend-now{font-size:20px;font-weight:300;font-variant-numeric:tabular-nums;white-space:nowrap}.trend-unit{font-size:12px;color:var(--ink-dim)}.spark{width:100%;height:58px;margin-top:8px;display:block}.spark-line{fill:none;stroke-width:1.8;vector-effect:non-scaling-stroke;stroke-linejoin:round;stroke-linecap:round}.trend-range{display:flex;justify-content:space-between;font-size:11.5px;color:var(--ink-faint);margin-top:5px}.trend-hint{opacity:0;transition:opacity .15s}.trend:hover .trend-hint{opacity:1}.two-col{display:grid;grid-template-columns:1.25fr 1fr;gap:12px;align-items:start}.cam-wrap{display:block;width:100%;border:1px solid var(--glass-border);border-radius:var(--radius);overflow:hidden;padding:0;background:#09142680;cursor:zoom-in}.cam-img{display:block;width:100%;height:auto}.cam-overlay{cursor:zoom-out;overflow:auto;display:flex;align-items:center}.cam-full{max-width:none;max-height:80vh;margin:auto;display:block;border-radius:8px}.notice{background:#ffbf5724;border:1px solid rgba(255,191,87,.4);color:#ffd88f;padding:9px 13px;border-radius:10px;font-size:13.5px;margin:0 0 12px}.synopsis{color:var(--ink-dim);font-size:14px;line-height:1.55;margin:2px 0 16px}.fc-list{display:flex;flex-direction:column;gap:13px}.fc-period h4{margin:0 0 3px;font-size:13.5px;font-weight:600;letter-spacing:.02em}.fc-period p{margin:0;font-size:13.5px;line-height:1.5;color:#eef4fbd1}.fc-period .fc-detail{color:var(--ink-faint);font-size:12.5px;margin-top:2px}.fine{font-size:11.5px;color:var(--ink-faint);margin:14px 0 0}.tide-next{margin:0 0 6px;font-size:14.5px;color:var(--ink-dim)}.tide-next strong{color:var(--ink);font-weight:600}.tide-svg{width:100%;height:auto;margin-top:4px}.tide-area{fill:#5fe0b71f}.tide-line{fill:none;stroke:#5fe0b7;stroke-width:2;vector-effect:non-scaling-stroke}.tide-mark{fill:#cfe9df}.tide-mark-label{fill:var(--ink-dim);font-size:11px}.tide-mark-height{fill:var(--ink-faint);font-size:10.5px}.now-line{stroke:#fff6;stroke-dasharray:3 4}.now-label{fill:var(--ink-dim);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase}.now-dot{fill:#fff}.about{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}.about dl{display:flex;gap:28px;margin:0;flex-wrap:wrap}.about-row dt{font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--ink-faint);margin-bottom:3px}.about-row dd{margin:0;font-size:14px}.footer{padding:4px 0 28px;color:var(--ink-faint);font-size:12.5px}.footer p{margin:4px 0}.footer a{color:var(--ink-dim)}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:#02060dad;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;padding:20px}.overlay-panel{position:relative;width:min(1020px,100%);background:linear-gradient(160deg,#0d1a2ff0,#08101ef5);border:1px solid var(--glass-border);border-radius:22px;padding:20px 24px;box-shadow:0 30px 80px #00000080;max-height:92vh;overflow:auto}.overlay-head{display:flex;gap:14px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;margin-bottom:8px}.overlay-head h3{margin:0;font-size:19px;font-weight:600}.overlay-sub{display:flex;gap:14px;margin:7px 0 0;font-size:12.5px;color:var(--ink-dim)}.legend-item{display:inline-flex;align-items:center;gap:6px}.legend-swatch{width:14px;height:3px;border-radius:2px;display:inline-block}.range-btns{display:flex;border:1px solid var(--glass-border);border-radius:999px;overflow:hidden;margin-left:auto}.range-btns button{font:inherit;font-size:12.5px;background:transparent;color:var(--ink-dim);border:0;padding:7px 15px;cursor:pointer}.range-btns button.on{background:#ffffff24;color:var(--ink)}.close-btn{padding:6px 11px}.chart-wrap{position:relative}.chart{width:100%;height:auto;display:block;cursor:crosshair}.grid-line{stroke:#ffffff14}.axis-label{fill:var(--ink-faint);font-size:11.5px}.chart-line{fill:none;stroke-width:2;vector-effect:non-scaling-stroke;stroke-linejoin:round}.crosshair{stroke:#ffffff59;stroke-dasharray:2 3}.chart-tip{position:absolute;top:10px;transform:translate(-50%);background:#050b16f0;border:1px solid var(--glass-border);border-radius:10px;padding:8px 12px;pointer-events:none;font-size:12px;white-space:nowrap;z-index:2}.chart-tip p{margin:2px 0}.tip-time{color:var(--ink-dim)}.chart-stats{display:flex;gap:18px;font-size:12.5px;color:var(--ink-dim);margin-top:10px;flex-wrap:wrap}.chart-stats strong{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}.placeholder-line{height:12px;border-radius:6px;background:linear-gradient(90deg,#ffffff12,#ffffff29,#ffffff12);background-size:200% 100%;animation:shimmer 1.6s infinite;margin:10px 0}.placeholder-line.w60{width:60%}.placeholder-line.w80{width:80%}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.kiosk .big{font-size:clamp(54px,6.2vw,90px)}.kiosk .big.med{font-size:clamp(34px,3.4vw,52px)}.kiosk .trend-hint,.kiosk .footer,.kiosk .about{display:none}@media (max-width: 900px){.two-col{grid-template-columns:1fr}}@media (max-width: 640px){.topbar{padding-top:16px}.hero{min-height:calc(100svh - 170px)}.compass{width:76px;height:76px}.big{font-size:40px}.about{flex-direction:column;align-items:flex-start}.about dl{gap:18px}}@supports not (backdrop-filter: blur(4px)){.card,.chip,.ghost-btn,.unit-toggle,.badge,.alert{background:#091426e6}}@media (prefers-reduced-motion: reduce){*{transition:none!important;animation-duration:.01ms!important}}
