@font-face{font-family:Inter;src:url('/static/fonts/Inter-roman.var.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:JetBrains Mono;src:url('/static/fonts/JetBrainsMono-Variable.woff2') format('woff2');font-style:normal;font-weight:100 800;font-display:swap}

:root{
  --font:Inter,Arial,sans-serif;--mono:"JetBrains Mono","Courier New",monospace;
  --bg:#f4f4f0;--panel:#fff;--panel-2:#f5f5f1;--ink:#101110;--muted:#6d706b;--line:#c8cbc4;
  --sea:#1259ff;--sea-soft:rgba(18,89,255,.09);--high:#ff4d19;--low:#008b7c;--obs:#8d42e8;
  --shadow:none;--radius:0;--page:1640px;color-scheme:light;font-family:var(--font);font-synthesis:none;
}
html[data-theme="dark"]{
  --bg:#0d0f12;--panel:#15181d;--panel-2:#1b1f25;--ink:#f4f4ef;--muted:#9b9e99;--line:#454950;
  --sea:#5d82ff;--sea-soft:rgba(93,130,255,.14);--high:#ff7047;--low:#35c8ad;--obs:#b17aff;
  color-scheme:dark;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-size:14px;line-height:1.5;min-width:320px;transition:background .2s,color .2s}
button,input,select{font:inherit}button,a,select,input{outline-color:var(--sea)}a{color:inherit}.skip-link{position:fixed;left:16px;top:-60px;z-index:1000;background:var(--sea);color:#fff;padding:10px 14px}.skip-link:focus{top:16px}

.topbar{height:68px;display:grid;grid-template-columns:minmax(220px,1fr) minmax(280px,420px) minmax(340px,1fr);align-items:center;gap:28px;padding:0 max(24px,calc((100vw - var(--page))/2));border-bottom:2px solid var(--ink);background:color-mix(in srgb,var(--panel) 94%,transparent);backdrop-filter:blur(18px);position:sticky;top:0;z-index:500}
.brand{display:inline-flex;align-items:center;gap:11px;text-decoration:none;width:max-content}.brand-mark{width:36px;height:36px;stroke:var(--sea);fill:none;stroke-width:2}.brand strong{display:block;font-size:18px;line-height:1.1;letter-spacing:-.03em}.brand small{display:block;color:var(--muted);font-family:var(--mono);font-size:9px;letter-spacing:.09em;text-transform:uppercase;margin-top:4px}
.location-control{display:flex;align-items:center;gap:12px}.location-control>label,.theme-switcher>span{font-family:var(--mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}.select-wrap{position:relative;flex:1}.select-wrap svg{position:absolute;left:13px;top:50%;width:16px;transform:translateY(-50%);fill:none;stroke:var(--sea);stroke-width:1.8;pointer-events:none}.select-wrap select{appearance:none;width:100%;height:42px;border:1px solid var(--ink);border-radius:10px;background:var(--panel);color:var(--ink);padding:0 38px;font-weight:650}.select-wrap::after{content:"⌄";position:absolute;right:14px;top:8px;color:var(--muted);pointer-events:none}
.theme-switcher{justify-self:end;display:flex;align-items:center;gap:11px}.theme-options{display:flex;border:1px solid var(--ink);padding:3px;border-radius:12px;background:var(--panel)}.theme-option{border:0;background:transparent;color:var(--muted);height:32px;padding:0 12px;border-radius:8px;cursor:pointer;font-size:12px;display:flex;align-items:center;gap:7px}.theme-option i{width:9px;height:9px;border-radius:50%;background:#fff;border:1px solid #8b8e8a}.theme-option[data-theme="dark"] i{background:#181b20;border-color:#74777d}.theme-option.is-active{color:#fff;background:var(--sea);font-weight:650}.theme-option.is-active i{border-color:rgba(255,255,255,.6)}

.app-shell{max-width:var(--page);margin:0 auto;padding:28px 24px 30px;display:grid;grid-template-columns:minmax(290px,360px) minmax(0,1fr);grid-template-areas:"summary prediction" ". extremes";align-items:start;gap:18px}.panel{background:var(--panel);border:1px solid var(--ink);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;min-width:0;width:100%}.summary{grid-area:summary;padding:26px 22px;border-top:6px solid var(--sea);position:sticky;top:96px}.prediction{grid-area:prediction;padding:24px 26px;border-top:6px solid var(--ink)}.extremes{grid-area:extremes;padding:22px 24px;border-top:6px solid var(--low)}
.summary-head,.section-head{display:flex;align-items:center;justify-content:space-between}.eyebrow,.place-kicker{font-family:var(--mono);font-size:9px;letter-spacing:.11em;text-transform:uppercase;color:var(--sea);font-weight:700;margin:0}.summary-head{align-items:flex-start}.place-kicker{display:none}.summary h1{font-size:28px;line-height:1.1;margin:0;letter-spacing:-.045em}.summary h1 small{display:block;color:var(--muted);font-size:11px;letter-spacing:0;font-weight:500;margin-top:8px}.quality-badge{border:1px solid var(--line);padding:4px 8px;border-radius:999px;font-family:var(--mono);font-size:9px;color:var(--muted);text-transform:uppercase;white-space:nowrap}
.level-block{padding:27px 0 22px;border-bottom:1px solid var(--line)}.level-value{display:flex;align-items:baseline;gap:12px;font-variant-numeric:tabular-nums}.level-value>span:first-child{font:650 clamp(44px,4.2vw,62px)/1 var(--mono);letter-spacing:-.07em;color:var(--sea)}#trend{font-size:12px;font-weight:650;color:var(--muted);letter-spacing:0}.level-block p{margin:8px 0 0;color:var(--muted);font-size:11px}
.next-events{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:18px 0 0}.next-event{background:var(--panel-2);border:1px solid var(--ink);padding:12px;border-radius:10px}.next-event .event-type{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}.next-event .event-type i{width:7px;height:7px;border-radius:50%;background:var(--high)}.next-event.L .event-type i{background:var(--low)}.next-event strong{display:block;font:650 16px var(--mono);margin-top:6px}.next-event small{display:block;color:var(--muted);font-size:10px;margin-top:2px}

.section-head{align-items:flex-start}.section-head h2{font-size:22px;line-height:1.15;letter-spacing:-.035em;margin:5px 0 0}.export-button{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--ink);border:1px solid var(--line);height:38px;padding:0 12px;border-radius:9px;font-size:11px;font-weight:650}.export-button:hover{border-color:var(--sea);color:var(--sea)}.export-button svg{width:15px;fill:none;stroke:currentColor;stroke-width:1.8}
.control-deck{display:flex;align-items:end;gap:10px;margin:23px 0 17px;padding:12px;background:var(--panel-2);border:1px solid var(--ink);border-radius:12px}.field{display:flex;flex-direction:column;gap:6px;color:var(--muted);font-family:var(--mono);font-size:8px;letter-spacing:.07em;text-transform:uppercase}.field input{height:35px;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--ink);padding:0 9px;font-family:var(--mono);font-size:11px;color-scheme:inherit}.seg{display:flex}.seg button{height:35px;min-width:54px;padding:0 10px;border:1px solid var(--line);border-right:0;background:var(--panel);color:var(--muted);cursor:pointer;font-size:11px}.seg button:first-child{border-radius:8px 0 0 8px}.seg button:last-child{border-radius:0 8px 8px 0;border-right:1px solid var(--line)}.seg button.on{background:var(--sea);border-color:var(--sea);color:#fff;font-weight:750}
.chart-legend{display:flex;justify-content:flex-end;gap:16px;color:var(--muted);font-size:9px}.chart-legend span{display:flex;align-items:center;gap:6px}.chart-legend i{width:15px;height:2px;background:var(--sea)}.chart-legend i.high{width:7px;height:7px;border-radius:50%;background:var(--high)}.chart-legend i.low{width:7px;height:7px;border-radius:50%;background:var(--low)}.chartbox{position:relative;height:440px;margin-top:8px}

.section-note{color:var(--muted);font:9px var(--mono);margin:4px 0}.tide-table{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:9px;margin-top:17px}.day{border:1px solid var(--ink);border-radius:10px;padding:12px;background:var(--panel-2)}.day h3{font-size:10px;font-weight:650;color:var(--muted);margin:0 0 9px;text-transform:capitalize}.row{display:flex;align-items:center;justify-content:space-between;font:500 11px var(--mono);padding:5px 0;border-top:1px solid var(--line)}.row:first-of-type{border:0}.row .H,.row .L{display:flex;align-items:center;gap:6px;color:var(--ink)}.row .H::before,.row .L::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--high)}.row .L::before{background:var(--low)}
footer{max-width:var(--page);margin:0 auto;padding:4px 24px 35px;display:flex;justify-content:space-between;color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.04em}footer p{margin:0}

@media (max-width:1100px){.topbar{grid-template-columns:180px minmax(240px,1fr) auto;padding:0 18px;gap:16px}.theme-switcher>span{display:none}.theme-option{padding:0 9px}.app-shell{padding:18px;grid-template-columns:300px minmax(0,1fr)}.prediction{padding:20px}.chartbox{height:400px}.control-deck{flex-wrap:wrap}}
@media (max-width:760px){body{font-size:13px}.topbar{height:auto;min-height:66px;position:relative;grid-template-columns:1fr auto;padding:12px 16px;gap:12px}.brand-mark{width:30px;height:30px}.brand small{display:none}.location-control{grid-column:1/-1;grid-row:2}.location-control>label{display:none}.theme-switcher{grid-column:2;grid-row:1}.theme-options{padding:2px;gap:2px}.theme-option{padding:0 8px;justify-content:center;font-size:10px}.theme-option i{width:9px;height:9px}.theme-option.is-active{background:var(--sea)}.app-shell{display:flex;flex-direction:column;padding:12px;gap:12px}.summary{order:1;position:static;padding:18px}.prediction{order:2;padding:18px 14px}.extremes{order:3;padding:18px 14px}.summary h1{font-size:24px}.level-block{padding:19px 0 16px}.level-value>span:first-child{font-size:48px}.control-deck{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0 14px;padding:10px}.field:first-child{grid-column:1/-1}.field input{width:100%}.seg button{flex:1;min-width:0}.chart-legend{justify-content:flex-start;overflow:auto}.chartbox{height:340px;margin-left:-6px;margin-right:-4px}.tide-table{display:flex;width:100%;max-width:100%;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:4px}.day{min-width:190px;scroll-snap-align:start}footer{display:block;padding:5px 16px 28px}footer p{margin-top:8px;line-height:1.5}.export-button span{display:none}.export-button{width:38px;padding:0;justify-content:center}}
@media (max-width:420px){.next-events{grid-template-columns:1fr}.control-deck{grid-template-columns:1fr}.field:first-child{grid-column:auto}.section-head h2{font-size:20px}.chartbox{height:310px}}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}