/* Sea chart + marine weather: dark bridge-instrument look */
:root{--bg:#06151f;--panel:#0a2233;--panel2:#0d2b40;--bl:rgba(79,227,255,.22);--cy:#4fe3ff;--am:#ffb347;--gr:#5dffb0;--rd:#ff5a5a;--mono:ui-monospace,'Cascadia Mono',Consolas,'SFMono-Regular',Menlo,monospace}
.wxstrip{display:flex;flex-wrap:wrap;gap:10px 22px;align-items:center;justify-content:center;margin-top:30px;padding:16px 24px;border:1px solid var(--bl);border-radius:12px;background:rgba(6,21,31,.55);font:600 .9rem/1.2 var(--mono);color:#e3f6ff}
.wxstrip .wxs-t{color:var(--am);text-transform:uppercase;letter-spacing:.14em;font-size:.76rem}
.wxstrip a{color:var(--cy);text-decoration:none;border-bottom:1px solid var(--cy)}
.wxstrip[data-c=g] .wxs-v:last-of-type::before,.wxstrip[data-c=a] .wxs-v:last-of-type::before,.wxstrip[data-c=r] .wxs-v:last-of-type::before{content:"";display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:8px;background:var(--gr);box-shadow:0 0 10px var(--gr)}
.wxstrip[data-c=a] .wxs-v:last-of-type::before{background:var(--am);box-shadow:0 0 10px var(--am)}
.wxstrip[data-c=r] .wxs-v:last-of-type::before{background:var(--rd);box-shadow:0 0 10px var(--rd)}

/* ---------- instrument panel (weather) ---------- */
.bridge{background:radial-gradient(1200px 500px at 70% -10%,#0f3a55,transparent 60%),var(--bg);color:#d8f1fb;border-radius:18px;padding:clamp(16px,3vw,34px);border:1px solid var(--bl);box-shadow:0 30px 70px -30px rgba(0,20,40,.8);font-family:var(--mono);position:relative;overflow:hidden}
.bridge::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(79,227,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(79,227,255,.05) 1px,transparent 1px);background-size:56px 56px;pointer-events:none}
.bridge>*{position:relative}
.bw-k{display:block;font:700 .68rem/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--cy);margin-bottom:10px}
.bw-load{padding:60px 10px;text-align:center;color:var(--cy);letter-spacing:.12em;text-transform:uppercase;font-size:.85rem}
.bw-top{display:grid;grid-template-columns:1.4fr 1fr;gap:16px;margin-bottom:16px}
.bw-verdict{display:flex;gap:18px;align-items:center;background:var(--panel);border:1px solid var(--bl);border-radius:14px;padding:22px 24px}
.bw-verdict strong{display:block;font:700 1.7rem/1.1 var(--sans);color:#fff;letter-spacing:-.02em}
.bw-verdict p{margin:6px 0 0;font:400 .9rem/1.5 var(--sans);color:#b9d9e6}
.bw-lamp{width:54px;height:54px;border-radius:50%;flex:none;background:var(--gr);box-shadow:0 0 0 6px rgba(93,255,176,.18),0 0 34px var(--gr);animation:lamp 2.4s infinite}
.v-a .bw-lamp{background:var(--am);box-shadow:0 0 0 6px rgba(255,179,71,.2),0 0 34px var(--am)}
.v-r .bw-lamp{background:var(--rd);box-shadow:0 0 0 6px rgba(255,90,90,.2),0 0 34px var(--rd)}
@keyframes lamp{50%{opacity:.55}}
.bw-time{background:var(--panel);border:1px solid var(--bl);border-radius:14px;padding:22px 24px}
.bw-time strong{display:block;font:600 1.05rem/1.3 var(--sans);color:#fff;margin-bottom:6px}
.bw-time span:last-child{font-size:.82rem;color:#8fd9ec}
.bw-grid{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:16px;margin-bottom:16px}
.bw-card{background:var(--panel);border:1px solid var(--bl);border-radius:14px;padding:20px 22px}
.bw-rose svg,.bw-g svg{width:100%;max-width:260px;margin:0 auto;display:block}
.bw-g{text-align:center}
.bw-g p{margin:6px 0 0;font:600 .88rem/1.3 var(--sans);color:#fff}
.bw-leg{display:flex;flex-direction:column;gap:5px;margin-top:12px;font-size:.78rem}
.bw-leg .lw{color:var(--am)}.bw-leg .lv{color:var(--gr)}
.bw-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px}
.bw-t{background:var(--panel2);border:1px solid var(--bl);border-radius:12px;padding:16px 18px}
.bw-t strong{display:block;font:700 1.8rem/1.05 var(--mono);color:#fff;margin:2px 0 8px}
.bw-t span:last-child{font:400 .8rem/1.4 var(--sans);color:#9ccbdc}
.bw-out{margin-bottom:16px}
.bw-oh{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:center;margin-bottom:6px}
.bw-oh .bw-k{margin:0}
.bw-key{font-size:.74rem;color:#9ccbdc;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.bw-key i{display:inline-block;width:18px;height:4px;border-radius:2px;margin:0 4px 0 12px}
.bw-key .kw{background:var(--am)}.bw-key .kh{background:var(--cy)}.bw-key .kr{background:rgba(143,217,236,.6)}
.bw-out svg{width:100%;height:auto;display:block}
.bw-two{display:grid;grid-template-columns:1.2fr 1fr;gap:16px}
.bw-plain{font:400 1.02rem/1.75 var(--sans);color:#e3f6ff;margin:0}
.bw-mil dl{display:grid;grid-template-columns:auto 1fr;gap:8px 16px;margin:0 0 14px;font-size:.82rem}
.bw-mil dt{color:var(--am);text-transform:uppercase;letter-spacing:.1em}
.bw-mil dd{margin:0;color:#e3f6ff}
.bw-raw{display:block;background:#04101a;border:1px solid var(--bl);border-radius:8px;padding:10px 12px;font:400 .76rem/1.5 var(--mono);color:var(--gr);overflow-wrap:anywhere}
.bw-note{margin-top:16px;font:400 .78rem/1.6 var(--sans);color:#8fb7c8}
.bw-note a{color:var(--cy)}

/* ---------- sea chart ---------- */
.chart{background:var(--bg);border-radius:18px;overflow:hidden;border:1px solid var(--bl);box-shadow:0 30px 70px -30px rgba(0,20,40,.8);color:#d8f1fb;font-family:var(--mono)}
.ch-bar{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:12px 18px;background:linear-gradient(90deg,#0a2a40,#0a1e30);border-bottom:1px solid var(--bl);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;flex-wrap:wrap}
.ch-bar b{color:var(--am);border:1px solid var(--am);border-radius:3px;padding:3px 7px;margin-right:10px;font-size:.7rem}
.ch-bar span:last-child{color:#8fd9ec}
.ch-tools{display:flex;gap:8px;flex-wrap:wrap;padding:12px 16px;background:#08202f;border-bottom:1px solid var(--bl)}
.ch-tools button{font:600 .72rem/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#bfe9f7;background:#0c2a3d;border:1px solid var(--bl);border-radius:6px;padding:10px 12px;cursor:pointer;min-height:38px;display:inline-flex;gap:8px;align-items:center}
.ch-tools button[aria-pressed=true]{background:var(--cy);color:#04202c;border-color:var(--cy)}
.ch-tools button i{width:10px;height:10px;display:inline-block;border-radius:2px;background:currentColor}
.ch-map{height:clamp(460px,64vh,720px);position:relative;background:#041019}
.ch-map .leaflet-tile-pane{filter:saturate(.8) contrast(1.08) brightness(.82) hue-rotate(-4deg)}
.ch-map.sat .leaflet-tile-pane{filter:saturate(.7) contrast(1.1) brightness(.78) sepia(.1)}
.ch-map .leaflet-container{background:#041019;font-family:var(--mono)}
.ch-map img.leaflet-tile{max-width:none!important}
.ch-map::after{content:"";position:absolute;inset:0;z-index:450;pointer-events:none;background:radial-gradient(ellipse at center,transparent 58%,rgba(2,10,16,.6))}
.leaflet-control-zoom a{background:#0a2a40!important;color:var(--cy)!important;border-color:var(--bl)!important}
.leaflet-control-attribution{background:rgba(4,16,25,.85)!important;color:#8fd9ec!important;font-size:10px!important}
.leaflet-control-attribution a{color:var(--cy)!important}
.ch-compass{position:absolute;top:12px;right:12px;z-index:500;width:50px;height:50px;border-radius:50%;border:2px solid var(--cy);background:rgba(6,21,31,.85);display:grid;place-items:center;color:var(--cy);font:700 .8rem/1 var(--mono);pointer-events:none}
.ch-compass::before{content:"";position:absolute;top:4px;width:0;height:0;border:5px solid transparent;border-bottom:12px solid var(--am);border-top:0}
.ch-hud{position:absolute;left:12px;bottom:34px;z-index:500;background:rgba(6,21,31,.9);border:1px solid var(--bl);border-radius:8px;padding:9px 12px;font:600 .72rem/1.55 var(--mono);color:#e3f6ff;pointer-events:none;min-width:210px}
.ch-hud b{color:var(--am);font-weight:600}
.ch-foot{display:flex;justify-content:space-between;gap:14px;align-items:center;flex-wrap:wrap;padding:14px 18px;background:#08202f;border-top:1px solid var(--bl);font-size:.74rem;color:#8fd9ec}
.ch-foot a{color:var(--cy)}
.ch-legend{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:8px 18px;padding:16px 18px;background:#06151f;border-top:1px solid var(--bl);font-size:.76rem;color:#cfefff}
.ch-legend span{display:flex;align-items:center;gap:9px}
.ch-legend svg{width:18px;height:18px;flex:none}
.ch-note{padding:30px;text-align:center;color:#9ccbdc;font:400 .92rem/1.6 var(--sans)}
/* markers */
.kw-mk{background:none;border:0}
.kw-lbl{font:700 10.5px/1.2 var(--mono);letter-spacing:.06em;color:#e8fbff;text-shadow:0 0 3px #000,0 0 3px #000,1px 1px 2px #000;white-space:nowrap;pointer-events:none}
.kw-lbl.am{color:var(--am)}.kw-lbl.gr{color:var(--gr)}.kw-lbl.rd{color:#ff8d8d}
.kw-home{position:relative;width:44px;height:44px}
.kw-home .ring{position:absolute;inset:0;border:2px solid var(--am);border-radius:50%;animation:kwping 2.4s infinite}
.kw-home .x1,.kw-home .x2{position:absolute;background:var(--am)}
.kw-home .x1{left:50%;top:-6px;bottom:-6px;width:2px;margin-left:-1px}.kw-home .x2{top:50%;left:-6px;right:-6px;height:2px;margin-top:-1px}
.kw-home .dot{position:absolute;left:50%;top:50%;width:18px;height:18px;margin:-9px;border-radius:50%;background:#0a2a40;border:2px solid var(--am);box-shadow:0 0 14px var(--am)}
@keyframes kwping{0%{transform:scale(.55);opacity:1}100%{transform:scale(1.6);opacity:0}}
.sweep{position:absolute;inset:0;pointer-events:none}
@media (max-width:1023px){
  .bw-top,.bw-grid,.bw-two{grid-template-columns:1fr}
  .bw-tiles{grid-template-columns:1fr 1fr}
  .ch-hud{display:none}
}
@media (max-width:560px){.bw-tiles{grid-template-columns:1fr}.bw-verdict strong{font-size:1.35rem}.ch-map{height:460px}}

/* ---- chart v2: exact 10 x 5 NM frame, contact list ---- */
.ch-main{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(290px,.6fr);align-items:stretch}
.ch-mapcol{position:relative;min-width:0}
.ch-map{height:auto!important;aspect-ratio:10/12.2;min-height:520px}
.ch-list{position:relative;background:#07192a;border-left:1px solid var(--bl);overflow:hidden;min-height:420px}
.cl-h{display:flex;justify-content:space-between;gap:10px;padding:14px 16px 4px;font:700 .72rem/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--am)}
.cl-h span:last-child{color:#8fd9ec}
.cl-s{margin:0;padding:4px 16px 10px;font:400 .72rem/1.4 var(--mono);color:#8fb7c8}
.cl-o{list-style:none;margin:0;padding:0;position:absolute;left:0;right:0;bottom:0;top:78px;overflow:auto;border-top:1px solid var(--bl)}
.cl-o li{border-bottom:1px solid rgba(79,227,255,.12)}
.cl-o button{display:grid;grid-template-columns:26px 1fr auto;gap:10px;align-items:center;width:100%;text-align:left;background:none;border:0;color:#d8f1fb;padding:9px 14px;cursor:pointer;font-family:var(--mono);min-height:46px}
.cl-o button:hover,.cl-o button:focus-visible{background:#0c2a3d}
.cl-o button.off{opacity:.55}
.cl-o .ci svg{width:20px;height:20px;display:block}
.cl-o .cn b{display:block;font:600 .8rem/1.25 var(--sans);color:#fff}
.cl-o .cn i{display:block;font:normal .68rem/1.3 var(--mono);color:#8fb7c8}
.cl-o .cr{font:600 .74rem/1.35 var(--mono);color:var(--am);text-align:right;white-space:nowrap}
.kw-base{position:absolute;left:30px;top:6px;background:rgba(6,21,31,.93);border:1px solid #ffb347;border-radius:3px;padding:4px 8px;white-space:nowrap}
.ch-map:not(.zhi) .kw-lbl.lz{display:none}
@media (max-width:1023px){.ch-main{grid-template-columns:1fr}.ch-map{min-height:0;aspect-ratio:1/1.15}.ch-list{height:460px;border-left:0;border-top:1px solid var(--bl)}}

/* night-chart tint (base map only; seamark tiles and symbols sit above it) */
.ch-map .leaflet-tile-pane{filter:brightness(.6) saturate(.95) contrast(1.18) hue-rotate(-6deg)!important}
.ch-map.sat .leaflet-tile-pane{filter:brightness(.72) saturate(.8) contrast(1.1)!important}
.kw-lbl.rd{color:#ffb0a0}
.ch-map::after{background:radial-gradient(ellipse at center,transparent 62%,rgba(2,10,16,.5))}