@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--ink:#233c3c;--muted:#788783;--line:#e3e8e3;--accent:#286958;--paper:#fbfcf8}*{box-sizing:border-box}body{margin:0;font:13px 'DM Sans',sans-serif;color:var(--ink);background:#1b3434}button,input,select{font:inherit}button,a,input,select,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #cbab56;outline-offset:3px}button{color:inherit}a{color:var(--accent)}.topbar{height:86px;background:var(--paper);display:flex;align-items:center;padding:0 30px;gap:38px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink);font:800 18px Manrope,sans-serif;letter-spacing:2px;white-space:nowrap}.brand small{display:block;font:500 9px 'DM Sans',sans-serif;letter-spacing:2.7px;margin-top:5px}.brand-icon{font-size:47px;line-height:1;color:var(--accent)}.region{font-size:10px;letter-spacing:1.7px;color:var(--muted)}.region span{margin:0 12px;color:#c6cdc6}.header-right{margin-left:auto;display:flex;align-items:center;gap:22px}.status{font-size:11px;background:#eef0e7;padding:7px 11px;border-radius:20px;white-space:nowrap}.status:before{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;background:#b79a5e;margin-right:7px}time{font-size:12px;font-variant-numeric:tabular-nums;white-space:nowrap}.button{border:1px solid #d7dfd6;background:transparent;border-radius:6px;padding:10px 13px;font-weight:600;font-size:12px}.button:hover{background:#e7eee7}.button span{margin-left:17px}.primary{background:var(--accent);color:white;border-color:var(--accent)}.primary:hover{background:#205445}.full{width:100%;margin-top:12px}main{height:calc(100dvh - 122px);min-height:660px;position:relative;overflow:hidden;background:#162e2e;touch-action:none}#scene{position:absolute;transform-origin:0 0;will-change:transform;width:1770px;height:768px}#basin-image{width:100%;height:100%;display:block;user-select:none}#markers{position:absolute;inset:0}.map-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#102d2d55,transparent 35%,transparent 80%,#112a2a88)}.map-heading{position:absolute;left:30px;top:28px;color:white;pointer-events:none}.eyebrow{font-size:9px;letter-spacing:2px;font-weight:700}.map-heading .eyebrow{color:#e1dcad}h1{font:600 27px Manrope,sans-serif;letter-spacing:-.8px;margin:8px 0}h1+p{font-size:12px;color:#d4dfd5;margin:0}.left-stack,.right-stack{position:absolute;display:flex;flex-direction:column;gap:14px;max-height:calc(100% - 175px);overflow:auto;scrollbar-width:thin;touch-action:pan-y}.left-stack{left:30px;top:141px;width:278px}.right-stack{right:30px;top:28px;width:280px;max-height:calc(100% - 110px)}.panel{border:1px solid #ffffff65;border-radius:10px;background:#fbfcf8f5;box-shadow:0 5px 22px #001c2520;overflow:hidden;backdrop-filter:blur(16px)}.panel-heading{background:none;border:0;width:100%;display:flex;align-items:center;justify-content:space-between;padding:16px 18px;font-weight:700;text-align:left;font-size:12px}.section-icon{color:#648273;font-size:18px;vertical-align:middle;margin-right:9px}.collapse{font-size:18px;font-weight:400;color:#83918a}.panel-body{padding:0 18px 16px;border-top:1px solid var(--line)}.total{display:flex;gap:17px;align-items:center;padding:16px 0}.total>strong{font:500 49px Manrope,sans-serif;line-height:1}.total div{font-size:12px}.total small{display:block;margin-top:6px;color:var(--muted);font-size:10px}.ship-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px 8px}.ship-grid>div{font-size:10px;color:#63746c}.ship-grid strong{display:block;font:500 22px Manrope,sans-serif;color:var(--ink);margin:5px 0 0 12px}.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#92a297;margin-right:6px}.fishing{background:#449780}.commercial{background:#bf9c54}.shipping{background:#688ea9}.leisure{background:#a68caa}.footnote{font-size:10px;line-height:1.6;color:var(--muted);margin:14px 0 0}.group-label{color:#859188;margin:15px 0 9px}.layer-row{display:flex;align-items:center;justify-content:space-between;padding:8px 0;gap:8px;cursor:pointer}.layer-row span:first-child{display:flex;align-items:center;gap:10px;font-size:11px}.layer-symbol{color:#6b897c;width:14px;text-align:center}.layer-row input{appearance:none;width:28px;height:16px;background:#d9dfd6;border-radius:20px;position:relative;margin:0;cursor:pointer;flex-shrink:0}.layer-row input:before{content:'';position:absolute;width:12px;height:12px;border-radius:50%;background:white;top:2px;left:2px;box-shadow:0 1px 3px #0002}.layer-row input:checked{background:#377963}.layer-row input:checked:before{left:14px}.layer-key{display:flex;gap:20px;border-top:1px solid var(--line);margin-top:8px;padding-top:12px;font-size:9px;color:#859188}.section-subtitle{font-size:8px;letter-spacing:1px;display:flex;justify-content:space-between;margin-top:17px;color:#7c8a81}.section-subtitle span{font-size:7px;letter-spacing:.5px;color:#9a976c}.water-level{margin-top:18px}.water-level>strong{font:500 46px Manrope,sans-serif}.water-level>span{margin-left:8px;color:#8a978c;font-size:17px}.water-level p{font-size:10px;color:#78867e;margin:4px 0 18px}.empty-chart{height:71px;position:relative}.empty-chart svg{width:100%;height:50px;fill:none;stroke:#dee4db;stroke-dasharray:3 4}.empty-chart>span{position:absolute;inset:15px 0 auto;text-align:center;font-size:10px;color:#879282;background:#fafbf7b8;padding:5px}.metric-grid{display:grid;grid-template-columns:1fr 1fr;gap:19px 12px;border-top:1px solid var(--line);padding-top:16px;font-size:10px;color:#7b8981}.metric-grid strong{display:block;font:600 20px Manrope,sans-serif;color:var(--ink);margin-top:7px}.metric-grid small{font-size:11px;font-weight:400;color:#7b8981}.volume{margin-top:17px}.volume strong{font:500 33px Manrope,sans-serif}.volume span{color:#829087;margin-left:7px}.volume+p{font-size:10px;color:#849087}details{border-top:1px solid var(--line);padding-top:12px;margin-top:16px;font-size:10px;color:#75877c;line-height:1.7}summary{cursor:pointer}.map-tools{position:absolute;right:30px;bottom:23px;display:flex;align-items:center;gap:12px}.compass{color:white;font-size:9px;display:flex;align-items:center;gap:8px}.compass span{font-size:25px}.zoom-controls{display:flex;align-items:center;background:var(--paper);border-radius:7px;padding:3px;box-shadow:0 3px 18px #0002}.zoom-controls button{background:transparent;border:0;font-size:20px;width:34px;height:33px}.zoom-controls button:hover{background:#e5ece2;border-radius:4px}.zoom-controls output{font-size:10px;min-width:40px;text-align:center}.map-caption{position:absolute;bottom:31px;left:30px;color:#e4ece0;font-size:9px;letter-spacing:1px;display:flex;align-items:center;gap:9px}.live-dot{width:6px;height:6px;border-radius:50%;background:#c4d5ad}.map-caption>span:nth-child(2){opacity:.4}footer{height:36px;display:flex;justify-content:space-between;align-items:center;padding:0 30px;background:var(--paper);font-size:9px;color:#819084;gap:12px}footer>span:first-child{display:flex;align-items:center}.footer-divider{margin:0 12px;color:#c6cec0}footer button{border:0;background:none;font-size:9px;color:#5f7667}dialog{border:1px solid #dfe6dd;border-radius:14px;background:var(--paper);color:var(--ink);width:520px;max-width:calc(100% - 28px);max-height:85dvh;padding:25px;box-shadow:0 30px 100px #0005;line-height:1.6}dialog::backdrop{background:#102c2c99;backdrop-filter:blur(5px)}.dialog-top{display:flex;align-items:center;justify-content:space-between;gap:15px}h2{font:600 23px Manrope,sans-serif;margin:5px 0 12px;letter-spacing:-.6px}.icon-button{background:none;border:0;font-size:26px}dialog p{color:#728177;font-size:12px}dialog label{display:block;font-weight:600;font-size:11px;margin:17px 0 6px}input:not([type=checkbox]),select{border:1px solid #d9e0d7;padding:11px;border-radius:5px;background:white;color:var(--ink);min-width:0;width:100%}.input-row{display:flex;gap:8px}.text-button{background:none;border:0;text-decoration:underline;font-size:11px;margin-top:12px;padding:0}.source-links{display:flex;flex-direction:column;gap:8px;font-size:11px;margin-top:20px}hr{border:0;border-top:1px solid var(--line);margin:24px 0}#notice{position:absolute;bottom:77px;left:50%;transform:translateX(-50%);background:#fcfdf6;color:#335343;padding:12px 20px;border-radius:8px;box-shadow:0 4px 24px #0004;font-size:12px;max-width:90%;z-index:5}#pin-popup{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);padding:18px;width:270px;z-index:6}#pin-popup h3{margin:0 0 10px}#pin-popup p{font-size:11px;line-height:1.6;white-space:pre-line}#pin-popup button{margin-right:8px}.marker{position:absolute;transform:translate(-50%,-50%) scale(var(--marker-scale,1));background:#fff8da;border:2px solid white;width:24px;height:24px;border-radius:50%;box-shadow:0 2px 8px #0006;font-size:12px;color:#17473c;display:grid;place-items:center;padding:0}.marker.signal{background:#5bddba77;border:2px dashed #bcffdd;width:35px;height:35px}.marker[data-layer=ships]{background:#d5f8ef}.marker:hover{outline:3px solid #f5d990}main.placing{cursor:crosshair}[hidden]{display:none!important}@media(min-width:1500px){.left-stack{width:295px}.right-stack{width:295px}.map-heading{top:34px}h1{font-size:31px}.left-stack{top:156px}.layer-row{padding:10px 0}}@media(max-width:1100px){.region{display:none}.topbar{gap:16px}.header-right{gap:12px}.map-heading h1{font-size:23px}.left-stack{width:255px;left:20px}.right-stack{width:255px;right:20px}.map-heading{left:20px}footer>span:nth-child(2){display:none}}@media(max-width:700px){.topbar{height:72px;padding:0 15px}.brand{font-size:13px;letter-spacing:1.2px}.brand small{font-size:7px;letter-spacing:1.4px}.brand-icon{font-size:34px}.header-right time,.header-right .status{display:none}.header-right .button{font-size:10px;padding:8px}.header-right .button span{display:none}main{height:calc(100dvh - 104px);min-height:780px}.map-heading{top:20px;left:16px}.map-heading h1{font-size:21px}.left-stack{top:115px;left:14px;width:calc(50% - 21px);max-height:calc(100% - 195px)}.right-stack{top:115px;right:14px;width:calc(50% - 21px);max-height:calc(100% - 195px)}.panel-heading{padding:12px 10px;font-size:10px;gap:5px}.section-icon{display:none}.panel-body{padding:0 10px 12px}.total{gap:9px}.total>strong{font-size:33px}.total div{font-size:9px}.total small{font-size:8px}.ship-grid{grid-template-columns:1fr;gap:8px}.ship-grid>div{display:flex;align-items:center;font-size:9px}.ship-grid strong{margin:0 0 0 auto;font-size:17px}.section-subtitle{display:block;line-height:1.8}.section-subtitle span{display:block}.water-level>strong{font-size:34px}.metric-grid{grid-template-columns:1fr;gap:11px}.metric-grid strong{font-size:17px;margin-top:3px}.layer-row span:first-child{font-size:9px;gap:3px}.layer-key{display:none}.group-label{font-size:8px;letter-spacing:.8px}.footnote{font-size:8px}.full{font-size:9px;padding:9px 4px}.map-caption{left:16px;bottom:60px;font-size:7px;letter-spacing:.5px}.map-tools{right:14px;bottom:12px}.compass{display:none}footer{height:32px;padding:0 14px;font-size:8px}.empty-chart>span{font-size:8px}.volume+p,details{font-size:9px}}

.left-stack>.panel,.right-stack>.panel{flex-shrink:0}.left-stack{max-height:calc(100% - 215px)}@media(max-width:700px){.left-stack{max-height:calc(100% - 195px)}}