:root{--u: 1px;--bg: #0b1016;--panel: #141c26;--panel-2: #1a2432;--line: #27354a;--fg: #f3f6fa;--muted: #9fb3c8;--accent: #2dd4bf;--green: #22c55e;--amber: #f59e0b;--red: #ef4444;--orange: #f97316;--yellow: #facc15;--blue: #4cc9f0;--font: "Inter", "Segoe UI", Roboto, "Helvetica Neue", system-ui, Arial, sans-serif;--text: calc(28 * var(--u));--text-lg: calc(36 * var(--u));--head: calc(72 * var(--u));--head-xl: calc(120 * var(--u))}.panel{background:var(--panel);border:2px solid var(--line);border-radius:calc(10 * var(--u));padding:calc(8 * var(--u)) calc(18 * var(--u)) calc(8 * var(--u));display:flex;flex-direction:column;min-height:0;min-width:0;width:100%;overflow:hidden}.panel-body>*{min-width:0}.panel-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:calc(4 * var(--u))}.panel-head h2{font-size:calc(22 * var(--u));letter-spacing:.08em;color:var(--muted);font-weight:700;white-space:nowrap}.panel-body{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:space-evenly;gap:calc(4 * var(--u))}.badge{font-size:calc(22 * var(--u));font-weight:800;padding:calc(4 * var(--u)) calc(12 * var(--u));border-radius:calc(8 * var(--u));letter-spacing:.04em}.badge-stale{background:var(--amber);color:#111}.badge-error{background:var(--red);color:#fff}.placeholder{color:var(--muted);font-size:calc(28 * var(--u));border:2px dashed var(--line);border-radius:calc(8 * var(--u));padding:calc(12 * var(--u));text-align:center;overflow:hidden}.bottom-strip .placeholder{font-size:calc(24 * var(--u));padding:calc(8 * var(--u))}.muted{color:var(--muted)}.small{font-size:.6em;color:var(--muted)}.est{font-size:calc(18 * var(--u));color:var(--amber);font-weight:700;vertical-align:middle;border:1px solid var(--amber);border-radius:calc(6 * var(--u));padding:0 calc(6 * var(--u))}.headline{font-size:var(--head);font-weight:800;line-height:1;letter-spacing:-.02em}.headline .unit{font-size:.42em;font-weight:600;color:var(--muted);margin-left:calc(6 * var(--u))}.headline.small-head{font-size:calc(60 * var(--u))}.sub{font-size:calc(30 * var(--u));color:var(--fg)}.sub.gust b{color:var(--amber);font-size:1.15em}.k{font-size:calc(22 * var(--u));letter-spacing:.08em;color:var(--muted);font-weight:700}.v{font-size:calc(40 * var(--u));font-weight:700}.v.big{font-size:calc(50 * var(--u));font-weight:800}.kv-grid{display:grid;grid-template-columns:1fr 1fr;gap:calc(6 * var(--u)) calc(20 * var(--u))}.kv-grid.three{grid-template-columns:1fr 1fr 1fr}.kv-grid.four{grid-template-columns:1fr 1fr 1fr 1.25fr}.kv-grid.four .v{font-size:calc(30 * var(--u));white-space:nowrap}.kv-grid.four .k{font-size:calc(20 * var(--u));white-space:nowrap}.chip{background:var(--panel-2);border:1px solid var(--line);border-radius:calc(8 * var(--u));padding:calc(2 * var(--u)) calc(12 * var(--u));font-size:calc(24 * var(--u));font-weight:700}.warnbar{height:calc(76 * var(--u));border-radius:calc(10 * var(--u));padding:calc(6 * var(--u)) calc(24 * var(--u));display:flex;flex-direction:column;justify-content:center;gap:calc(4 * var(--u));color:#111;font-weight:700}.warnbar.level-yellow{background:var(--yellow)}.warnbar.level-orange{background:var(--orange)}.warnbar.level-red{background:var(--red);color:#fff}.warnbar.level-advisory{background:#cbd5e1}.warn-main{display:flex;gap:calc(20 * var(--u));align-items:baseline;white-space:nowrap;overflow:hidden}.warn-level{font-size:calc(32 * var(--u));font-weight:900;letter-spacing:.06em}.warn-type{font-size:calc(32 * var(--u));font-weight:900}.warn-text{font-size:calc(28 * var(--u));font-weight:600;overflow:hidden;text-overflow:ellipsis}.warn-others{display:flex;gap:calc(10 * var(--u))}.warn-chip{font-size:calc(20 * var(--u));padding:calc(1 * var(--u)) calc(10 * var(--u));border-radius:calc(6 * var(--u));background:#00000040}.warn-chip.level-red{background:var(--red);color:#fff}.warn-chip.level-orange{background:var(--orange);color:#111}.warn-chip.level-yellow{background:var(--yellow);color:#111}.wind-row{display:flex;align-items:center;gap:calc(22 * var(--u))}.wind-arrow{width:calc(var(--arrow, 120) * var(--u));height:calc(var(--arrow, 120) * var(--u));flex:none}.wind-arrow .compass-ring{fill:var(--panel-2);stroke:var(--line);stroke-width:3}.wind-arrow .compass-n{fill:var(--muted);font-size:14px;font-weight:800;text-anchor:middle}.wind-arrow .arrow-head{fill:var(--accent)}.obs-row{font-size:calc(22 * var(--u));color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.obs-row b{color:var(--fg)}.vis-good{color:var(--green)}.vis-moderate{color:var(--fg)}.vis-poor,.vis-very-poor{color:var(--amber)}.vis-fog{color:var(--red)}.hours{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:calc(6 * var(--u));height:100%;min-width:0}.hour{background:var(--panel-2);border-radius:calc(8 * var(--u));padding:calc(6 * var(--u)) calc(2 * var(--u));min-width:0;overflow:hidden;text-align:center;display:flex;flex-direction:column;justify-content:space-evenly}.h-time{font-size:calc(22 * var(--u));color:var(--muted);font-weight:700}.h-wind{font-size:calc(38 * var(--u));font-weight:800}.h-gust{font-size:calc(24 * var(--u));color:var(--amber);font-weight:700}.h-dir{font-size:calc(26 * var(--u));font-weight:700}.h-rain{font-size:calc(24 * var(--u));color:var(--muted)}.h-rain.wet{color:var(--blue);font-weight:800}.tide-row{display:flex;justify-content:space-between;gap:calc(12 * var(--u))}.tide-main{flex:1;min-width:0}.tide-next{flex:none}.tide-row .sub{font-size:calc(24 * var(--u));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tide-next{text-align:right}.tide-curve{width:100%;height:calc(64 * var(--u));flex:none}.tide-curve .curve{fill:none;stroke:var(--blue);stroke-width:4}.tide-curve .now-line{stroke:var(--fg);stroke-width:3;stroke-dasharray:6 6}.tide-curve .obs-dot{fill:var(--amber);stroke:#fff;stroke-width:2}.tide-curve .ev{fill:var(--fg);font-size:16px;font-weight:700;text-anchor:middle}.tide-curve .ev.muted{fill:var(--muted);text-anchor:start}.tide-foot{display:flex;gap:calc(16 * var(--u));align-items:center;font-size:calc(22 * var(--u));white-space:nowrap;overflow:hidden}.sea-block{padding:calc(2 * var(--u)) 0}.sea-block+.sea-block{border-top:1px solid var(--line)}.sea-src{font-size:calc(22 * var(--u));color:var(--muted);font-weight:700;letter-spacing:.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sea-vals{display:flex;gap:calc(26 * var(--u));align-items:baseline}.sea-block.primary .v{font-size:calc(34 * var(--u))}.sea-block.primary .v.big{font-size:calc(44 * var(--u))}.sea-block.primary .k{font-size:calc(20 * var(--u))}.sea-block.offshore{font-size:calc(22 * var(--u));color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sea-block.offshore b{color:var(--fg);font-size:calc(26 * var(--u))}.gale{background:var(--red);color:#fff;font-size:calc(18 * var(--u));font-weight:800;padding:0 calc(8 * var(--u));border-radius:calc(6 * var(--u));vertical-align:middle}.day-main{display:flex;flex-direction:column;gap:calc(4 * var(--u))}.day-main.dark .headline{color:var(--muted)}.moon{font-size:calc(24 * var(--u))}.incident{height:100%;background:#2a0f12;border:3px solid var(--red);border-radius:calc(10 * var(--u));padding:calc(12 * var(--u)) calc(28 * var(--u));display:grid;grid-template-columns:1fr calc(560 * var(--u));gap:calc(20 * var(--u));overflow:hidden}.inc-left{min-width:0;min-height:0;display:flex;flex-direction:column;gap:calc(6 * var(--u))}.inc-text{font-size:calc(42 * var(--u));font-weight:800;line-height:1.12;overflow:hidden;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}.inc-loc{font-size:calc(26 * var(--u));color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.inc-right{text-align:right;display:flex;flex-direction:column;justify-content:center}.elapsed{font-size:var(--head-xl);font-weight:900;color:var(--red);line-height:1;letter-spacing:.02em}.muster-row{display:flex;gap:calc(24 * var(--u));align-items:center;min-height:0}.muster-count{text-align:center;min-width:calc(150 * var(--u))}.muster-count.ok .headline{color:var(--green)}.muster-count.short .headline{color:var(--amber)}.roles{display:grid;grid-template-columns:repeat(3,1fr);gap:calc(8 * var(--u));flex:1;min-width:0}.panel.large .roles{grid-template-columns:repeat(5,1fr)}.role{background:var(--panel-2);border-radius:calc(8 * var(--u));padding:calc(5 * var(--u)) calc(12 * var(--u));min-width:0;border-left:6px solid var(--line);overflow:hidden}.role.filled{border-left-color:var(--green)}.role.open{border-left-color:var(--amber)}.role-name{font-size:calc(18 * var(--u));color:var(--muted);font-weight:700;letter-spacing:.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.role-who{font-size:calc(26 * var(--u));font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.panel.large .role{padding:calc(8 * var(--u)) calc(14 * var(--u))}.panel.large .role-who{font-size:calc(30 * var(--u))}.responders{display:flex;gap:calc(10 * var(--u));flex-wrap:wrap}.resp{background:var(--panel-2);border-radius:calc(8 * var(--u));padding:calc(4 * var(--u)) calc(14 * var(--u));font-size:calc(28 * var(--u));font-weight:700;border-left:6px solid var(--green)}.webcam-img{width:100%;height:100%;object-fit:cover;border-radius:calc(8 * var(--u))}.dots{display:grid;grid-template-columns:1fr 1fr;gap:calc(1 * var(--u)) calc(14 * var(--u))}.dot-row{display:flex;align-items:center;gap:calc(8 * var(--u));font-size:calc(18 * var(--u));line-height:1.15}.dot{width:calc(14 * var(--u));height:calc(14 * var(--u));border-radius:50%;flex:none;background:var(--line)}.dot-ok{background:var(--green)}.dot-stale{background:var(--amber)}.dot-error{background:var(--red)}.dot-stub,.dot-disabled{background:var(--line);border:2px solid var(--muted)}.dot-starting{background:var(--blue)}.dot-name{flex:1;white-space:nowrap}.dot-time{font-size:calc(18 * var(--u))}.map-label{font-weight:800;white-space:nowrap;text-shadow:0 0 calc(4 * var(--u)) #000,0 0 calc(8 * var(--u)) #000;pointer-events:none}.map-label-station{font-size:calc(24 * var(--u));color:#fff}.map-label-incident{font-size:calc(28 * var(--u));color:#fff;background:var(--red);padding:calc(2 * var(--u)) calc(12 * var(--u));border-radius:calc(6 * var(--u));text-shadow:none}.map-label-ring{font-size:calc(20 * var(--u));color:var(--muted)}.maplibregl-ctrl-attrib{font-size:calc(14 * var(--u))!important;background:#0b1016b3!important;color:var(--muted)!important}.maplibregl-ctrl-attrib a{color:var(--muted)!important}.panel.compact .headline{font-size:calc(64 * var(--u))}.panel.compact .v.big{font-size:calc(44 * var(--u))}.panel.compact .panel-body{justify-content:center}.sub .gust b{color:var(--amber)}.saf-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:calc(18 * var(--u));min-height:0}.saf-grid.large{grid-template-columns:1.1fr 1fr 1.2fr}.saf-col{min-width:0}.saf-col .v.big{font-size:calc(46 * var(--u));white-space:nowrap}.saf-col .v.red{color:var(--red)}.saf-col .v.amber{color:var(--amber)}.saf-text{font-size:calc(22 * var(--u));color:var(--muted);line-height:1.2;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}.panel.large .saf-text{font-size:calc(24 * var(--u));-webkit-line-clamp:2}.saf-area{overflow:hidden;text-overflow:ellipsis;min-width:0}.saf-foot{display:flex;gap:calc(12 * var(--u));align-items:center;font-size:calc(20 * var(--u));white-space:nowrap;overflow:hidden}.chip.red{background:var(--red);color:#fff;border-color:var(--red);font-size:calc(18 * var(--u))}.chip.amber{background:var(--amber);color:#111;border-color:var(--amber);font-size:calc(18 * var(--u))}:root{--u: min(calc(100vw / 1920), calc(100vh / 1080))}*{box-sizing:border-box;margin:0;padding:0}html,body{width:100vw;height:100vh;overflow:hidden;background:var(--bg);color:var(--fg);font-family:var(--font);font-size:var(--text);line-height:1.15;font-variant-numeric:tabular-nums}body{cursor:none}#app{display:grid;width:100%;height:100%;gap:calc(14 * var(--u));padding:calc(14 * var(--u))}body[data-mode=standby] #app{grid-template-columns:calc(490 * var(--u)) 1fr calc(490 * var(--u));grid-template-rows:calc(72 * var(--u)) 0 1fr calc(184 * var(--u));grid-template-areas:"top top top" "warn warn warn" "left map right" "bottom bottom bottom"}body[data-mode=standby].has-warning #app{grid-template-rows:calc(72 * var(--u)) calc(76 * var(--u)) 1fr calc(184 * var(--u))}body[data-mode=callout] #app{grid-template-columns:1fr calc(600 * var(--u));grid-template-rows:calc(72 * var(--u)) calc(236 * var(--u)) 1fr calc(206 * var(--u));grid-template-areas:"top top" "incident incident" "map right" "bottom bottom"}#slot-topbar{grid-area:top}.area-warn{grid-area:warn;overflow:hidden}.area-left{grid-area:left;display:grid;grid-template-rows:1fr calc(250 * var(--u));gap:calc(14 * var(--u));min-height:0}.area-map{grid-area:map;position:relative;border-radius:calc(10 * var(--u));overflow:hidden;background:#0e1620;border:2px solid var(--line)}.area-right{grid-area:right;display:grid;grid-auto-rows:minmax(0,1fr);gap:calc(14 * var(--u));min-height:0}body[data-mode=standby] .area-right{grid-template-rows:1.3fr 1fr .95fr}body[data-mode=callout] .area-right{grid-template-rows:1fr 1fr .85fr}.area-incident{grid-area:incident}.area-bottom{grid-area:bottom;min-height:0}.bottom-strip{display:grid;grid-template-columns:1.6fr .6fr .9fr .9fr;gap:calc(14 * var(--u))}.area-left>div,.area-right>div,.bottom-strip>div,.area-bottom>section{min-height:0;min-width:0;display:flex}.area-left>div>section,.area-right>div>section,.bottom-strip>div>section{flex:1}#map{position:absolute;inset:0}.topbar{height:calc(72 * var(--u));display:grid;grid-template-columns:calc(420 * var(--u)) 1fr calc(420 * var(--u));align-items:center;background:var(--panel);border:2px solid var(--line);border-radius:calc(10 * var(--u));padding:0 calc(24 * var(--u))}.clock{font-size:calc(60 * var(--u));font-weight:800;letter-spacing:.02em}.station{text-align:center;display:flex;justify-content:center;align-items:center;gap:calc(24 * var(--u))}.station-name{font-size:calc(36 * var(--u));font-weight:800;letter-spacing:.04em}.mode-tag{font-size:calc(26 * var(--u));font-weight:800;padding:calc(4 * var(--u)) calc(16 * var(--u));border-radius:calc(8 * var(--u));letter-spacing:.1em}.mode-standby{background:var(--panel-2);color:var(--green);border:2px solid var(--green)}.mode-callout{background:var(--red);color:#fff;animation:pulse 1.2s ease-in-out infinite}.conn{font-size:calc(24 * var(--u));color:var(--amber);font-weight:700}.date{text-align:right;font-size:calc(34 * var(--u));font-weight:700;line-height:1.05}.weekday{font-size:calc(22 * var(--u));color:var(--muted)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.55}}body[data-connected=false] .panel{opacity:.85}.map-label-team{font-size:calc(22 * var(--u));color:#fff;background:var(--team, #9fb3c8);padding:calc(2 * var(--u)) calc(10 * var(--u));border-radius:calc(6 * var(--u));text-shadow:none}.map-label-target{font-size:calc(20 * var(--u));color:var(--team, #9fb3c8)}.map-label-target.done{opacity:.5;text-decoration:line-through}
