@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{--bg:#07131e;--panel:#0c1b27;--line:#20313e;--mint:#8be5c5;--muted:#829ba8;--text:#e7eff3;--amber:#e8bd75}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:'DM Sans',Arial,sans-serif;font-size:13px}button,input,select{font:inherit}button,a,input,select,summary{outline-offset:4px}button{cursor:pointer;color:inherit;border:1px solid var(--line);background:transparent;border-radius:7px}button:hover{border-color:#52756c;background:#17352f}button:disabled{opacity:.4;cursor:wait}a{color:var(--mint)}header{height:86px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 30px;gap:24px;background:#091620}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;color:var(--text)}.brand img{width:43px;height:43px}.brand b{font-family:Manrope,Arial,sans-serif;font-size:17px;font-weight:800;letter-spacing:2px;white-space:nowrap}.brand em{font-style:normal;font-weight:400;color:var(--mint)}.brand small{display:block;font-size:8px;letter-spacing:3.3px;margin-top:6px;color:#869ca6}nav{display:flex;gap:25px;height:100%;align-items:center}.nav{height:100%;border:0;border-radius:0;color:var(--muted);font-size:12px;padding:0 3px}.nav.active{color:var(--mint);border-bottom:2px solid var(--mint)}.topright{display:flex;align-items:center;gap:20px;font-size:10px;letter-spacing:1px}.devbadge{border:1px solid #32443a;color:#acc4b7;border-radius:5px;padding:7px 9px;font-size:8px;letter-spacing:1.2px}#clock{font-family:monospace;color:var(--muted)}main{display:grid;grid-template-columns:324px minmax(0,1fr)}.planner{padding:30px 26px 18px;border-right:1px solid var(--line);background:linear-gradient(150deg,#0f222c,#0b1924 45%)}.eyebrow{font-size:9px;font-weight:700;letter-spacing:2px;color:var(--mint)}h1{font-family:Manrope,Arial,sans-serif;font-size:31px;line-height:1.26;letter-spacing:-1.2px;font-weight:500;margin:14px 0 11px}h1 span{color:var(--mint)}.intro{font-size:12px;color:var(--muted);margin:0 0 30px}.sectionlabel{display:flex;align-items:center;gap:10px;font-size:9px;letter-spacing:1.5px;color:#b0c0c9;font-weight:600;margin:24px 0 18px}.sectionlabel>span{border:1px solid #2c414c;padding:3px;font-size:8px;color:#70928e;border-radius:3px}.sectionlabel button{margin-left:auto;font-size:20px;width:26px;height:25px;line-height:20px}label{display:block;font-size:10px;color:#b4c4cc;margin-bottom:13px;letter-spacing:.1px}input,select{width:100%;display:block;background:#0a1722;border:1px solid #2a3e49;color:var(--text);padding:11px;border-radius:6px;min-width:0;margin-top:7px;color-scheme:dark}input:focus,select:focus{border-color:var(--mint);outline:1px solid #8be5c544}input::placeholder{color:#617d8b;font-size:11px}.portinput{position:relative;margin-bottom:19px}.portinput label{display:flex;align-items:center;gap:9px;margin-bottom:6px}.portinput input{font-size:13px;padding:13px 12px;margin:0 0 6px}.portinput small{font-size:9px;color:var(--muted);display:block;line-height:1.4}.letter{font-size:9px;line-height:16px;font-style:normal;color:var(--mint);height:18px;width:18px;text-align:center;border:1px solid #3d645d;border-radius:50%}.letter.arrival{border-color:#8c7846;color:#e6c786}.suggestions{display:none;position:absolute;z-index:20;background:#122735;border:1px solid #34515e;border-radius:6px;left:0;right:0;top:66px;box-shadow:0 15px 30px #0009;max-height:290px;overflow:auto}.suggestions.open{display:block}.suggestions button{display:block;text-align:left;width:100%;border:0;border-radius:0;padding:12px;border-bottom:1px solid #243b47}.suggestions button strong{font-size:12px;font-weight:500}.suggestions button small{margin-top:4px;font-size:9px}.suggestions button:focus{background:#235544}.suggestions p{padding:10px}.pair{display:grid;grid-template-columns:1fr 1fr;gap:13px}.pair label{margin-bottom:7px}.unitfield{position:relative}.unitfield input{font-size:16px;padding-right:36px}.unitfield span{position:absolute;right:12px;top:14px;font-size:11px;color:#75929e}.depthreq{border:1px solid #263e3e;background:#122b2d;padding:10px 12px;border-radius:5px;display:flex;justify-content:space-between;align-items:center;margin-top:5px;color:#a7c6bd;font-size:10px}.depthreq strong{font-size:13px;color:var(--mint)}.advanced{margin:13px 0 0;border-bottom:1px solid var(--line);padding-bottom:15px}.advanced summary{list-style:none;font-size:10px;color:#8fa9b5;cursor:pointer;display:flex;justify-content:space-between}.advanced[open] summary{margin-bottom:15px}.advanced p{font-size:10px;line-height:1.6;color:#91a5af}.check{display:flex;gap:8px;align-items:center;margin:10px 0}.check input{width:auto;margin:0;accent-color:var(--mint)}.primary{width:100%;background:var(--mint);color:#0c2c25;padding:14px 15px;display:flex;justify-content:space-between;font-weight:700;border:0;margin-top:19px;font-size:12px;box-shadow:0 5px 25px #80e7bd15}.primary:hover{background:#acf3da;color:#0c2c25}.primary span{font-size:17px}.sidefoot{font-size:8px;color:var(--muted);display:flex;align-items:center;gap:5px;margin-top:20px}.sidefoot button{margin-left:auto;font-size:8px;padding:4px 6px}.statusdot{width:4px;height:4px;background:var(--mint);display:inline-block;border-radius:50%}#formError{color:#f5b2a6;font-size:11px;line-height:1.6;margin-top:10px}.workspace{min-width:0}.mapstage{height:620px;position:relative;overflow:hidden;background:radial-gradient(ellipse at 56% 52%,#102934,#07131e 68%)}#globe{width:100%;height:100%;display:block;cursor:grab;touch-action:none}#globe:active{cursor:grabbing}.mapheading{position:absolute;top:30px;left:32px;z-index:2;pointer-events:none}.mapheading .eyebrow{color:#86a7b0;font-size:8px}h2{font-family:Manrope,Arial,sans-serif;font-size:24px;font-weight:500;margin:11px 0 7px;letter-spacing:-.7px}.mapheading>span{font-size:10px;color:var(--muted)}.viewtoggle{display:flex;position:absolute;right:30px;top:30px;z-index:2;border:1px solid var(--line);padding:3px;border-radius:7px;background:#0a1a25}.viewtoggle button{border:0;border-radius:4px;font-size:10px;padding:7px 12px;color:#8ca2af}.viewtoggle button.active{background:#224039;color:var(--mint)}.maptools{position:absolute;right:30px;top:150px;display:flex;flex-direction:column;border:1px solid #2a4149;border-radius:6px;overflow:hidden;background:#0c1d27d9}.maptools button{border:0;border-bottom:1px solid #2a4149;border-radius:0;font-size:21px;width:35px;height:36px;color:#a6c4c8}.maptools button:last-child{border:0}.maplayers{position:absolute;top:100px;right:30px;display:flex;gap:15px}.maplayers label{display:flex;align-items:center;font-size:9px;color:#9eb5bc;gap:4px}.maplayers input{margin:0;width:10px;height:10px;accent-color:var(--mint)}.globelegend{position:absolute;left:32px;bottom:42px;display:flex;gap:13px;font-size:8px;color:#8da5ae;background:#06131cb0;padding:8px;border-radius:3px}.globelegend i{display:inline-block;width:8px;height:8px;margin-right:4px;border:1px solid #59727d}.mapcredit{position:absolute;left:32px;bottom:20px;color:#637f8d;font-size:8px}.mapcorner{position:absolute;bottom:28px;right:30px;text-align:center;color:#769c9d}.mapcorner b{font-size:9px;letter-spacing:2px}.mapcorner div{font-size:35px;line-height:40px;font-weight:300}.mapcorner small{font-size:7px;letter-spacing:2px}.maptooltip{position:absolute;background:#112b37f5;pointer-events:none;border:1px solid #3e635f;border-radius:6px;padding:12px;z-index:4;font-size:11px;max-width:260px;box-shadow:0 10px 30px #0005}.maptooltip small{display:block;color:#8fabba;margin-top:6px;font-size:9px;line-height:1.5}.loading{position:absolute;inset:0;background:#081722d9;display:flex;align-items:center;justify-content:center;gap:12px;color:var(--mint);font-size:13px}.loading span{width:16px;height:16px;border:2px solid #25443b;border-top-color:var(--mint);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.results{display:grid;grid-template-columns:1fr 1fr 1.35fr 1.35fr;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#0b1b26}.metric{padding:23px 24px;border-right:1px solid var(--line);min-width:0}.metric:last-child{border:0}.metric>small{font-size:8px;color:#89a2ad;letter-spacing:1.4px}.metric>div{margin:13px 0 8px;white-space:nowrap}.metric strong{font-family:Manrope,Arial,sans-serif;font-size:29px;font-weight:500;letter-spacing:-1px}.metric>div>span{font-size:10px;color:var(--mint);margin-left:7px}.metric p{font-size:9px;color:#7f9aa6;margin:0;line-height:1.5}.metric .arrivaldate{font-size:17px;letter-spacing:-.4px}.reviewstrip{margin:23px 28px;padding:14px 16px;border:1px solid #4a4434;border-radius:6px;background:#24261e66;display:flex;align-items:center;justify-content:space-between;gap:16px}.reviewstrip>div{display:flex;gap:12px;align-items:center}.reviewicon{border:1px solid #a88a50;border-radius:50%;color:var(--amber);font-size:11px;width:20px;height:20px;line-height:18px;text-align:center;flex-shrink:0}.reviewstrip p{margin:0;font-size:10px}.reviewstrip b{font-weight:500;color:#d9bc85}.reviewstrip p>span{display:block;color:#a09b89;margin-top:5px;font-size:9px;line-height:1.5}.reviewstrip button{border:0;font-size:9px;color:var(--amber);white-space:nowrap;padding:6px}.reviewstrip button>span{margin-left:6px}.waypoints{margin:28px}.tablehead{display:flex;justify-content:space-between;align-items:center;gap:12px}.tablehead .eyebrow{font-size:7px;color:#759698}h3{font-family:Manrope,Arial,sans-serif;font-weight:500;font-size:18px;letter-spacing:-.5px;margin:9px 0 18px}h3 span{font-size:9px;font-family:'DM Sans',Arial,sans-serif;background:#203a3a;color:var(--mint);border-radius:4px;padding:3px 6px;margin-left:6px;vertical-align:middle}.tableactions{display:flex;gap:7px}.tableactions button{padding:8px 11px;font-size:9px;color:#b5cdc9}.tablewrap{max-height:330px;overflow:auto;border:1px solid var(--line);border-radius:6px}table{border-collapse:collapse;white-space:nowrap;width:100%;text-align:left;font-size:10px}thead{position:sticky;top:0;z-index:1;background:#12232e}th{font-size:8px;color:#879fa9;letter-spacing:.6px;font-weight:500;padding:12px 14px}td{padding:13px 14px;border-top:1px solid #182c38;color:#9ab0bb}td:first-child{color:var(--mint);font-size:10px}td:nth-child(2){font-family:monospace;font-size:10px;color:#bacbd0}tr:hover td{background:#122733}td .depthtag{font-size:8px;border:1px solid #3d433d;color:#b7ad85;padding:3px 6px;border-radius:4px}.tablefooter{display:flex;justify-content:space-between;gap:12px;font-size:8px;color:#5e7c89;margin-top:12px;line-height:1.5}.tablefooter span:last-child{letter-spacing:1px;white-space:nowrap}.empty{text-align:center;height:100px;color:#7598a1}footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:35px 28px 0;padding:20px 0;border-top:1px solid var(--line);font-size:8px;color:#607d89}footer>span{letter-spacing:2px}footer p{font-style:italic;font-size:10px}footer button{border:0;font-size:9px;color:#7faaa9}dialog{background:#0d202d;border:1px solid #38535c;border-radius:14px;color:var(--text);max-width:760px;width:calc(100% - 30px);padding:28px;box-shadow:0 30px 100px #0008;max-height:90vh}dialog::backdrop{background:#020b13c9;backdrop-filter:blur(5px)}.modalhead{display:flex;justify-content:space-between;align-items:center}.modalhead button{font-size:26px;line-height:25px;border:0;padding:0 4px;color:#94adba}#modalBody h2{font-size:25px;margin:18px 0}#modalBody p,#modalBody li{font-size:12px;line-height:1.8;color:#a6bec9}#modalBody ul{padding-left:18px}.sourcecard{border:1px solid #2b434f;border-radius:7px;padding:14px 17px;margin:12px 0}.sourcecard h4{margin:0 0 7px;font-size:13px;font-weight:600;color:#dce9ee}.sourcecard p{margin:0}.sourcecard a{display:inline-block;font-size:11px;margin-top:8px}.sourcecard.blocked{border-color:#8c5348;background:#42252166}.sourcecard.blocked h4{color:#efb5a4}.sourcecard.warning{border-color:#665332}.portgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.portgrid>div{background:#112b37;border-radius:5px;padding:12px;font-size:12px}.portgrid small{display:block;color:#8eabba;font-size:9px;margin-bottom:7px}.directorylist{max-height:50vh;overflow:auto;margin-top:15px}.directorylist button{width:100%;text-align:left;padding:13px;margin-bottom:7px;display:flex;justify-content:space-between;gap:10px}.directorylist small{color:#89a3b0;font-size:10px}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%) translateY(120px);opacity:0;transition:.25s;background:#173d34;color:#c4f5df;border:1px solid #609d83;padding:13px 20px;border-radius:8px;z-index:50;font-size:12px;max-width:90%;text-align:center}#toast.show{transform:translateX(-50%) translateY(0);opacity:1}.portActions{display:flex;gap:10px;margin-top:15px}.portActions button{padding:10px 15px;background:#244b40}.errorload{line-height:1.6;padding:40px;color:#efbfac}::selection{background:#3e715d;color:#fff}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-thumb{background:#31505a;border-radius:5px}
@media(min-width:1550px){main{grid-template-columns:350px minmax(0,1fr)}.planner{padding:36px}.mapstage{height:700px}.metric{padding:28px 30px}.metric strong{font-size:34px}.metric .arrivaldate{font-size:20px}h1{font-size:34px}}
@media(max-width:1150px){header{padding:0 20px}.topright{display:none}nav{gap:20px}.results{grid-template-columns:1fr 1fr}.metric{border-bottom:1px solid var(--line)}.mapstage{height:570px}.mapheading h2{font-size:19px}.mapheading .eyebrow{font-size:7px}.viewtoggle{top:112px;left:32px;right:auto}.maplayers{top:75px;right:20px;flex-direction:column;gap:0}.globelegend{max-width:280px;flex-wrap:wrap;gap:8px}.tablehead{align-items:flex-start;flex-direction:column}.tableactions{margin-bottom:16px}.tablefooter span:last-child{display:none}}
@media(max-width:760px){header{height:73px;padding:0 16px;gap:12px}.brand b{font-size:13px;letter-spacing:1px}.brand small{font-size:6px;letter-spacing:2px}.brand img{width:35px;height:35px}nav{gap:4px}.nav{font-size:10px;padding:0 6px}#portsTab{display:none}#sourcesBtn{max-width:75px}main{display:flex;flex-direction:column}.planner{padding:25px 22px;border-right:0;border-bottom:1px solid var(--line)}h1{font-size:27px;line-height:1.25}h1 br{display:none}.intro{margin-bottom:20px}.planner form{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}.sectionlabel,.advanced,.depthreq,.primary,#formError{grid-column:1/-1}.sectionlabel{margin:20px 0 15px}.sectionlabel:first-child{margin-top:4px}.portinput{grid-column:1/-1}.pair{grid-column:1/-1}.planner form>label:nth-of-type(1){grid-column:1/-1}.mapstage{height:560px}.mapheading{top:25px;left:22px}.mapheading h2{font-size:20px}.mapheading>span{font-size:9px}.maplayers{top:85px;right:22px}.viewtoggle{top:113px;left:22px}.maptools{right:20px;top:175px}.globelegend{left:16px;bottom:43px;font-size:7px;max-width:270px}.mapcredit{left:22px;font-size:7px;max-width:250px;line-height:1.4}.mapcorner{right:20px}.metric{padding:20px 18px}.metric strong{font-size:26px}.metric .arrivaldate{font-size:15px}.metric>small{font-size:7px;letter-spacing:.8px}.reviewstrip{margin:18px;align-items:flex-start;padding:13px}.reviewstrip button{font-size:8px;max-width:65px;white-space:normal}.waypoints{margin:25px 18px}.tablehead{gap:0}.tableactions button{padding:8px 10px;font-size:9px}footer{margin:25px 18px 0}footer p{display:none}.portgrid{grid-template-columns:1fr 1fr}dialog{padding:22px}.sidefoot{font-size:9px}.sidefoot button{font-size:9px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

@media(max-width:760px){#planTab{display:none}#portsTab{display:block;font-size:9px}#sourcesBtn{font-size:9px;max-width:65px}.workspace{display:contents}.mapstage{order:-1;height:470px}.planner{order:0}.results{order:1}.reviewstrip{order:2}.waypoints{order:3}footer{order:4}}
/* Development 02: real port imagery, chart layers and blinking port catalogue. */
[hidden]{display:none!important}.mapstage{isolation:isolate}#detailMap{position:absolute;inset:0;z-index:1;background:#c8dfdf}#portLights{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:6}.mapheading{z-index:12;max-width:56%}.viewtoggle{z-index:15}.maptools{z-index:15;top:155px}.maptools button{height:34px;font-size:18px}.maplayers{z-index:15}.maptooltip{z-index:30}.mapcredit{z-index:13;max-width:75%;line-height:1.4;bottom:18px}.globelegend{z-index:12}.mapcorner{z-index:12}.detail-active .mapheading{background:#071b25ed;padding:12px 16px;border:1px solid #31505c;border-radius:9px;top:22px;left:22px}.detail-active .mapheading h2{font-size:20px;margin:8px 0}.detail-active .mapheading>span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:400px}.detail-active .maplayers{background:#071b25e8;border:1px solid #2e4d55;padding:9px 10px 0;border-radius:5px;top:104px}.detail-active .maplayers label:not(:first-child){display:none}.detail-active .globelegend,.detail-active .mapcorner{display:none}.detail-active .mapcredit{background:#071b25db;color:#adcad0;padding:5px 8px;left:20px;bottom:28px;max-width:65%;border-radius:4px;font-size:8px}.portlightkey{position:absolute;left:32px;top:107px;display:flex;align-items:center;gap:7px;color:#ff9aa6;font-size:8px;letter-spacing:1px;z-index:14}.portlightkey>i{background:#ff354b;border-radius:50%;width:5px;height:5px;box-shadow:0 0 7px 2px #ff354baa;animation:portPulse 1.4s steps(1) infinite}.portlightkey label{display:flex;gap:4px;margin:0 0 0 7px;font-size:8px;color:#95b1ba;align-items:center}.portlightkey input{width:10px;height:10px;margin:0;accent-color:#ff5769}.detail-active .portlightkey{top:126px;left:24px;background:#071b25e8;border:1px solid #2e4d55;padding:7px 9px;border-radius:5px}.detailinfo{position:absolute;bottom:86px;left:24px;z-index:12;background:#081c29eb;border:1px solid #4b6570;border-radius:9px;padding:17px 20px;box-shadow:0 10px 25px #0005;max-width:330px;min-width:240px}.detailinfo .eyebrow{font-size:8px;color:#ff9eaa;letter-spacing:1.3px}.detailinfo h3{font-size:20px;margin:7px 0 5px;letter-spacing:-.3px}.detailinfo p{font-size:10px;color:#a4bdc8;margin:0 0 13px}.detailinfo>div{display:grid;grid-template-columns:1fr auto;gap:7px 15px;border-top:1px solid #39515d;padding-top:11px;font-size:10px}.detailinfo>div span{color:#9ab3bf}.detailinfo>div b{color:#d7e9f0;font-weight:500}.detailinfo>small{display:block;font-size:8px;color:#8daab6;margin-top:12px}.mapstatus{position:absolute;top:156px;left:24px;max-width:420px;padding:7px 10px;border-radius:5px;background:#092533e8;color:#bed6df;font-size:9px;line-height:1.5;z-index:12;pointer-events:none}.mapstatus[data-tone=error],.mapstatus[data-tone=warning]{background:#402c18ef;color:#f0d39f}.chartoptions{position:absolute;right:24px;bottom:82px;z-index:13;width:250px;background:#071b25ee;border:1px solid #48646b;padding:12px;border-radius:7px}.chartoptions label{font-size:8px;margin:0;color:#aac6ca;letter-spacing:1px}.chartoptions select{font-size:10px;padding:8px;margin-top:7px}.chartoptions small{display:block;margin-top:7px;font-size:8px;line-height:1.5;color:#96b1b8}.selected-port-pin{background:none!important;border:0!important;position:relative}.selected-port-pin>span{display:block;width:28px;height:28px;border:2px solid #ffdbdf;background:#e51d3d;border-radius:50%;color:white;text-align:center;line-height:24px;font-size:12px;font-weight:bold;box-shadow:0 0 0 7px #ff3b5340,0 0 24px #ff364e;animation:portPulse 1.4s steps(1) infinite}.selected-port-label.leaflet-tooltip{background:#071c2df2;color:#fff;border:1px solid #99b0ba;font-family:Manrope,Arial,sans-serif;font-size:11px;padding:5px 9px;border-radius:4px;box-shadow:0 4px 12px #0004}.selected-port-label.leaflet-tooltip:before{border-right-color:#99b0ba}.leaflet-control-attribution{font-size:8px!important;max-width:100%;background:#eff6f0dd!important;color:#28404c!important}.leaflet-control-attribution a{color:#155b76!important}.leaflet-control-scale{margin-bottom:53px!important;margin-left:24px!important}.leaflet-control-scale-line{border-color:#c9e9ec!important;color:#ecffff!important;background:#08293bbf!important;text-shadow:none!important;font-size:9px!important}.nautical .leaflet-control-scale-line{background:#ffffffdf!important;border-color:#28556e!important;color:#28556e!important}.leaflet-container{font-family:'DM Sans',Arial,sans-serif}.pause-pulse .selected-port-pin>span,.pause-pulse .portlightkey>i{animation:none}.mapstage:fullscreen,.mapstage.expandedmap{height:100dvh!important;width:100vw!important;max-width:none!important;position:fixed;inset:0;z-index:10000;background:#07131e}.mapstage:fullscreen .maptools,.mapstage.expandedmap .maptools{top:170px}.mapstage:fullscreen .mapheading,.mapstage.expandedmap .mapheading{top:30px}@keyframes portPulse{0%,55%{opacity:1}56%,100%{opacity:.35}}@media(prefers-reduced-motion:reduce){.selected-port-pin>span,.portlightkey>i{animation:none}}
@media(max-width:1150px){.viewtoggle{top:112px}.portlightkey{top:156px;left:32px}.detail-active .viewtoggle{top:119px;left:22px}.detail-active .portlightkey{top:163px}.detail-active .maplayers{top:203px;right:22px}.mapstatus{top:197px;max-width:65%}.detailinfo{min-width:205px;padding:13px;max-width:270px}.chartoptions{width:205px}.detail-active .mapheading{max-width:calc(100% - 44px)}}
@media(max-width:760px){.mapstage{height:610px}.viewtoggle{left:20px;right:auto;top:112px;padding:3px}.viewtoggle button{padding:8px 10px;font-size:9px}.mapheading{max-width:calc(100% - 40px)}.mapheading h2{max-width:320px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mapheading>span{display:block;font-size:8px;max-width:270px;line-height:1.5}.maplayers{top:158px;right:20px;gap:0}.portlightkey{top:157px;left:22px;font-size:7px}.portlightkey label{font-size:7px}.maptools{top:222px;right:18px}.maptools button{width:33px;height:32px}.detail-active .mapheading{left:15px;right:15px;top:18px;padding:10px 12px;max-width:calc(100% - 30px)}.detail-active .mapheading h2{font-size:17px;max-width:300px}.detail-active .mapheading .eyebrow{font-size:6px}.detail-active .viewtoggle{top:118px;left:16px}.detail-active .portlightkey{top:160px;left:17px}.detail-active .maplayers{top:158px;right:17px;padding:7px 6px 0;font-size:7px}.detail-active .maplayers label{font-size:7px}.mapstatus{left:17px;top:199px;max-width:calc(100% - 83px);font-size:8px}.detailinfo{left:17px;bottom:96px;min-width:190px;max-width:235px;padding:12px}.detailinfo h3{font-size:16px}.detailinfo>div{gap:6px 10px;font-size:9px;padding-top:9px}.detailinfo>small{font-size:7px;max-width:190px}.detail-active .mapcredit{left:17px;bottom:29px;font-size:7px;max-width:80%;padding:4px 6px}.chartoptions{right:17px;bottom:93px;width:200px}.detail-active:has(#chartOptions:not([hidden])) .detailinfo{display:none}.leaflet-control-scale{margin-left:17px!important;margin-bottom:54px!important}.leaflet-control-attribution{font-size:6px!important}.mapstage:fullscreen .maptools,.mapstage.expandedmap .maptools{top:230px}.globelegend{bottom:48px}.mapcredit{bottom:20px}.mapcorner{bottom:40px}}

/* Development 03: chart availability and enforced route withholding. */
button:disabled{cursor:not-allowed}.not-route-ready{font-size:9px;color:#ffc0ad;letter-spacing:1px}.chart-workspace{margin:28px;border:1px solid #385052;border-radius:12px;padding:24px;background:linear-gradient(120deg,#102b32,#0b1a27)}.chart-workspace-head{display:flex;justify-content:space-between;gap:16px;align-items:start}.chart-workspace-head h3{font-size:23px;margin:8px 0}.chart-workspace-head p{color:#a0b8c1;line-height:1.6;font-size:11px;max-width:540px;margin:8px 0 20px}.chart-workspace-head button,.chart-preview-row button{padding:11px 14px;color:var(--mint);font-size:11px;white-space:nowrap}.chart-requirements{display:grid;grid-template-columns:1fr 1fr;gap:16px}.chart-port-card{border:1px solid #38515b;border-radius:8px;padding:18px;background:#091d29}.chart-card-top{display:flex;justify-content:space-between;gap:8px;align-items:center}.chart-card-top>span{font-size:11px;color:#d9e9ed}.chart-card-top>b{font-size:7px;color:#efbc9f;border:1px solid #78503e;border-radius:3px;padding:4px 6px;white-space:nowrap;letter-spacing:.7px}.chart-port-card h4{font-size:14px;margin:16px 0 7px}.chart-port-card p{font-size:11px;color:#e8bd75;line-height:1.5}.chart-port-card ul{padding:0;list-style:none;font-size:10px;line-height:1.8;color:#a5bfc8}.chart-port-card code{display:inline-block;color:#c2e8dc;min-width:85px;font-size:10px}.chart-port-card small{display:block;font-size:10px;color:#8da6b1;line-height:1.6}.chart-port-card a{display:inline-block;margin-top:13px;font-size:11px}.chart-preview-row{display:flex;justify-content:space-between;gap:15px;align-items:center;margin-top:20px;padding-top:18px;border-top:1px solid #2c4852}.chart-preview-row b{font-size:12px;font-weight:500}.chart-preview-row p{font-size:10px;color:#91aab4;line-height:1.5;margin-bottom:0}.chartoptions strong{display:block;font-size:12px;margin:9px 0;color:#dbe8eb}.chartoptions button{padding:8px;margin-top:10px;font-size:10px;color:var(--mint)}#detailMap.nautical{background:repeating-linear-gradient(0deg,#0f2734 0px,#0f2734 39px,#183542 40px)}.chart-empty{position:absolute;z-index:11;top:46%;left:8%;max-width:480px;width:65%;padding:24px;background:#0a1e2af7;border:1px solid #826346;border-radius:10px;box-shadow:0 14px 40px #0005;pointer-events:none}.chart-empty .eyebrow{color:#eac79a}.chart-empty h3{margin:10px 0;font-size:23px;line-height:1.25}.chart-empty p{font-size:12px;line-height:1.7;color:#b2c4cd;margin:0}.detail-active:has(#chartEmpty:not([hidden])) #portLights{opacity:.3}.mapheading>span{color:#efc298}.detail-active .mapheading>span{color:#efc298}.mapstage:has(.nautical:not([hidden])) .selected-port-label{display:none}#formError{padding:10px;border-radius:5px}#formError:not(:empty){background:#412a2466;border:1px solid #7a4d3e}.chart-workspace{order:3}
@media(max-width:1150px){.chart-requirements{grid-template-columns:1fr}.chart-workspace-head{flex-direction:column}.chart-workspace-head button{margin-bottom:15px}.chart-preview-row{align-items:start;flex-direction:column}.chart-card-top>b{font-size:8px}}
@media(max-width:760px){.chart-workspace{margin:20px 18px;padding:18px;order:3}.waypoints{order:4}footer{order:5}.chart-workspace-head h3{font-size:21px}.chart-workspace-head p{font-size:12px}.chart-port-card{padding:16px}.chart-empty{top:42%;left:17px;width:calc(100% - 88px);max-width:none;padding:17px}.chart-empty h3{font-size:19px}.chart-empty p{font-size:10px}.chartoptions{bottom:75px}.mapstage{height:690px}.chartoptions small{font-size:9px}.mapstatus{font-size:9px}.chart-card-top{flex-wrap:wrap}.chart-port-card small{font-size:11px}.chart-port-card p{font-size:12px}}

.cmap-connection{display:flex;justify-content:space-between;gap:22px;padding:19px;border:1px solid #42666d;background:#12313b;border-radius:8px;margin-bottom:20px}.cmap-connection h4{font-size:16px;margin:9px 0}.cmap-connection p{font-size:11px;color:#bdd0d5;line-height:1.6;margin:0;max-width:490px}.cmap-actions{display:flex;flex-direction:column;justify-content:center;gap:12px;min-width:220px}.cmap-actions a{font-size:11px;line-height:1.5}.map-area{position:absolute;z-index:12;left:24px;top:195px;padding:7px 10px;background:#0a2331ed;color:#c6e7e7;font-size:9px;border:1px solid #395461;border-radius:5px;max-width:65%}.release-link{font-size:9px;text-decoration:none}@media(max-width:1150px){.cmap-connection{flex-direction:column}.map-area{top:242px;font-size:8px}}@media(max-width:760px){.map-area{top:243px;left:17px;font-size:8px;max-width:calc(100% - 85px)}.chart-empty{top:46%}.cmap-connection p{font-size:12px}.cmap-actions a{font-size:12px}footer{flex-wrap:wrap}}
/* DEV4: chart references, supported AIS display and navigator-distance worksheet. */
.viewtoggle{top:112px;left:24px;right:auto;max-width:calc(100% - 48px);flex-wrap:wrap}.viewtoggle button{padding:8px 10px}.mapheading{max-width:calc(100% - 48px)}.maplayers,.detail-active .maplayers{top:163px;right:24px}.portlightkey,.detail-active .portlightkey{top:166px}.mapstatus{top:207px;max-width:calc(100% - 105px)}.map-area{top:247px}.maptools{top:220px}.mapstage{min-height:720px}.chartoptions{bottom:80px;width:255px}.chartoptions .check{display:flex;margin:10px 0;font-size:10px}.chartoptions .check input{width:13px;height:13px}.chartoptions small{font-size:10px}.chart-empty{top:44%;max-width:380px;width:48%}#referenceMap{position:absolute;inset:0;z-index:1;background:#132a38}.reference-note{position:absolute;left:24px;bottom:75px;padding:12px 15px;max-width:440px;background:#3a3020ed;color:#ffdfac;border:1px solid #927142;border-radius:7px;z-index:12;font-size:11px;line-height:1.6}.reference-pin{border-radius:50%;background:#e72c4b;border:2px solid #fff;width:28px;height:28px;text-align:center;line-height:24px;color:white;font-weight:bold}.reference-query{color:#172d3d;font-size:11px;max-width:260px;max-height:240px;overflow:auto}.reference-query p{margin:5px 0}.reference-query small{color:#803e21}.reference-active .maplibregl-ctrl-attrib{font-size:9px}.reference-active .maplibregl-ctrl-scale{margin-bottom:45px}.traffic-panel,.worksheet{margin:28px;padding:24px;border:1px solid #2d4c5b;border-radius:12px;background:#0d2230;scroll-margin-top:20px}.panel-title{display:flex;justify-content:space-between;gap:20px}.panel-title h3{font-size:23px;margin:10px 0}.panel-title p{font-size:12px;line-height:1.6;color:#a4bbc6;margin:8px 0 18px}.source-badge{align-self:flex-start;white-space:nowrap;color:#8be5c5;border:1px solid #3f6c65;border-radius:5px;padding:7px;font-size:8px;letter-spacing:1px}.source-badge.amber{color:#e8bd75;border-color:#796240}.traffic-toolbar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}.traffic-toolbar button{padding:9px 13px;font-size:11px}.traffic-toolbar .active{background:#225146;border-color:#83cbb0;color:#b5f3da}.traffic-context{display:flex;justify-content:space-between;gap:15px;font-size:11px;padding:12px 0}.traffic-context span{color:#98b0bd;font-size:10px}.traffic-window{position:relative;height:530px;border:1px solid #385360;border-radius:8px;overflow:hidden;background:radial-gradient(ellipse at center,#183e48,#091925)}#trafficFrame{border:0;width:100%;height:100%;background:#102b39}#trafficPlaceholder{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:25px}#trafficPlaceholder h4{font-size:19px;font-weight:500;margin:16px 0}#trafficPlaceholder p{line-height:1.7;color:#9db7c3;font-size:12px}#trafficPlaceholder .primary{width:auto;gap:45px}.radar-icon{font-size:72px;color:#8be5c5;font-weight:200}.traffic-foot{display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:11px;line-height:1.6}.traffic-foot p{color:#abc1cb;max-width:650px}.traffic-foot a{white-space:nowrap}.operating-note{display:block;color:#a8b8bd;font-size:10px;line-height:1.7}.worksheet-controls{display:flex;align-items:center;gap:20px}.worksheet-controls label{width:260px;max-width:100%;font-size:12px}.worksheet-controls button{padding:12px 18px;background:#2b5049;color:#c4f0e0}.worksheet-results{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;border:1px solid #3b5b61;padding:20px;border-radius:6px}.worksheet-results small{display:block;font-size:8px;color:#94b0bf;letter-spacing:1px}.worksheet-results b{display:block;font-size:15px;line-height:1.5;font-weight:500;color:#c4f0e0;margin-top:10px}#worksheetError{color:#ffd2b5}#worksheetBasis{font-size:11px;color:#9bb7c5;line-height:1.6}.traffic-panel{order:3}.worksheet{order:4}.chart-workspace{order:5}.waypoints{order:6}footer{order:7}
@media(max-width:760px){.viewtoggle,.detail-active .viewtoggle{left:15px;right:15px;top:112px;max-width:none;flex-wrap:wrap}.viewtoggle button{font-size:9px;padding:9px 8px}.portlightkey,.detail-active .portlightkey{top:194px;left:16px}.maplayers,.detail-active .maplayers{top:192px;right:16px}.mapstatus{top:232px;left:16px;font-size:10px;max-width:calc(100% - 85px)}.map-area{top:287px;left:16px;max-width:calc(100% - 85px)}.maptools{top:244px;right:15px}.mapstage{height:800px}.chartoptions{right:16px;bottom:72px;width:230px;padding:12px}.chart-empty{top:42%;left:16px;width:calc(100% - 88px);max-width:none;padding:14px}.chart-empty h3{font-size:16px}.chart-empty p{font-size:10px}.reference-note{left:16px;right:16px;bottom:80px;max-width:none;font-size:10px}.traffic-panel,.worksheet{margin:18px;padding:18px}.panel-title{display:block}.panel-title h3{font-size:21px}.source-badge{display:inline-block;margin-bottom:14px}.traffic-context,.traffic-foot{flex-direction:column;align-items:start;gap:8px}.traffic-window{height:520px}.traffic-context span{line-height:1.6}.worksheet-controls{flex-direction:column;align-items:stretch;gap:4px}.worksheet-controls label{width:100%}.worksheet-controls button{margin-bottom:12px}.worksheet-results{grid-template-columns:1fr;gap:18px}.operating-note{font-size:11px}.mapstage:fullscreen .viewtoggle,.mapstage.expandedmap .viewtoggle{top:122px}.mapstage:fullscreen .maptools,.mapstage.expandedmap .maptools{top:250px}}
.world-options{position:absolute;right:24px;bottom:80px;z-index:13;width:245px;background:#071b25f2;border:1px solid #48646b;padding:14px;border-radius:8px;box-shadow:0 8px 25px #0003}.world-options>label{font-size:8px;margin:0;color:#aac6ca;letter-spacing:1px}.world-options select{font-size:11px}.world-options .check{display:flex;margin:13px 0;font-size:10px;letter-spacing:0}.world-options .check input{width:13px;height:13px}.world-options>span{display:block;font-size:10px;color:#b9d6da;font-family:monospace}.world-options button{padding:7px 10px;margin:12px 0;font-size:10px}.world-options>small{display:block;font-size:10px;line-height:1.5;color:#b9c8ce}.reference-note{max-width:calc(100% - 310px);font-size:10px;bottom:90px}.reference-query{max-width:240px}.global-source-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px}.global-source-grid article{padding:20px;background:#12313b;border:1px solid #42666d;border-radius:7px}.global-source-grid article>span{font-size:8px;color:#e8bd75;letter-spacing:1px}.global-source-grid h4{font-size:16px;font-weight:500;margin:12px 0}.global-source-grid p{font-size:12px;color:#b9cdd6;line-height:1.6}.global-source-grid a{font-size:11px}@media(max-width:760px){.world-options{right:16px;bottom:82px;width:235px;padding:12px}.reference-note{max-width:calc(100% - 32px);bottom:340px;font-size:10px;padding:10px}.global-source-grid{grid-template-columns:1fr}}
.reference-active .world-options{right:80px}.reference-active .reference-note{max-width:calc(100% - 370px)}@media(max-width:760px){.reference-active .world-options{left:16px;right:70px;width:auto;max-width:280px}.reference-active .reference-note{max-width:none;left:16px;right:16px;bottom:355px}.reference-active .mapcredit{max-width:calc(100% - 35px)}}
.world-options summary{font-size:12px;color:#c8f0e4;cursor:pointer;padding:2px 0;list-style:disclosure-closed}.world-options[open] summary{margin-bottom:14px;list-style:disclosure-open}@media(max-width:760px){.world-options summary{font-size:12px}.reference-active:has(#worldOptions:not([open])) .reference-note{bottom:145px}.world-options>label,.world-options>small{font-size:10px}.reference-active .world-options{max-width:280px}}
.grid-depth-label{color:#102b43;font:italic 13px Georgia,serif;text-align:center;white-space:nowrap;text-shadow:-1px -1px 2px #fff,1px 1px 2px #fff,0 0 4px #fff}.grid-depth-label span{background:#ffffff75;border-radius:3px;padding:1px 3px}.world-options #loadWorldDepths{background:#20483e;border-color:#4d9e86;color:#d7fff0;font-size:11px;margin:12px 0 8px}.world-options #depthStatus{display:block;line-height:1.5;color:#a8c8c2;font-size:10px;margin-bottom:10px}.reference-active .reference-note{max-width:calc(100% - 400px)}@media(max-width:760px){.reference-active .reference-note{max-width:none}.reference-active:has(#worldOptions[open]) .reference-note{display:none}}
.reference-active:has(.leaflet-popup) .mapstatus{visibility:hidden}

/* DEV5: reference object inspection and global position / vessel lookup. */
.aid-panel{order:3;margin:28px;padding:24px;border:1px solid #345867;border-radius:12px;background:linear-gradient(120deg,#102b35,#0c202e)}
.aid-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.aid-toolbar button,.vessel-lookup button{padding:11px 14px;font-size:11px;color:#c4f1df}.aid-toolbar #aidLoad{background:#21493f}.aid-toolbar select{width:auto;margin:0;font-size:11px;min-height:36px}.aid-toolbar label{font-size:10px;margin:0;color:#9ab8c7}
#aidStatus{font-size:11px;line-height:1.6;color:#bdd2db;margin:18px 0}.aid-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;max-height:220px;overflow:auto;margin:12px 0}.aid-list:empty{display:none}.aid-list button{text-align:left;padding:12px;min-width:0;background:#112c3a}.aid-list b{display:block;font-size:11px;overflow-wrap:anywhere}.aid-list span{display:block;color:#91b3c3;font-size:10px;margin-top:5px}
.aid-marker{background:transparent;border:0}.aid-marker span{display:flex;align-items:center;justify-content:center;width:26px;height:26px;color:#084d84;background:#ebfdffa6;border:1px solid #1d6f9c;border-radius:50%;font-size:24px;box-shadow:0 1px 4px #0005}.aid-marker:focus{outline:3px solid #e2af38;outline-offset:2px}.aid-popup{max-height:290px;overflow:auto;color:#173342;font-size:11px}.aid-popup .eyebrow{font-size:8px;color:#38606a}.aid-popup h3{font-size:15px;margin:9px 0}.aid-popup h4{font-size:12px;margin:12px 0 4px}.aid-popup dl{display:grid;grid-template-columns:95px 1fr;gap:5px;margin:9px 0}.aid-popup dt{color:#5b727c}.aid-popup dd{margin:0;overflow-wrap:anywhere}.aid-popup .aid-caution{font-size:10px;color:#82572b;line-height:1.5}
.vessel-lookup{display:flex;flex-wrap:wrap;gap:12px;align-items:center;padding:15px;border:1px solid #33505f;border-radius:7px;margin:15px 0}.vessel-lookup>label:first-child{width:245px;max-width:100%;font-size:11px;margin:0}.vessel-lookup input{margin:6px 0 0}.vessel-lookup .check{display:flex;align-items:center;font-size:11px;margin:0;gap:7px}.vessel-lookup .check input{width:15px;height:15px;margin:0}#vesselError{width:100%;font-size:11px;color:#ffcbab}#vesselError:empty{display:none}#positionError{color:#ffcbab;font-size:12px}.reference-active .mapstatus{pointer-events:none}.reference-active:has(.leaflet-popup) .world-options{visibility:hidden}
@media(max-width:760px){.aid-panel{margin:18px;padding:18px}.aid-list{grid-template-columns:repeat(2,minmax(0,1fr))}.aid-toolbar button{font-size:11px}.aid-marker span{width:30px;height:30px}.vessel-lookup{align-items:stretch}.vessel-lookup>label:first-child{width:100%}.vessel-lookup button{flex:1}.aid-popup{max-height:230px}.maptools button{min-height:32px}}

.reference-active:has(.leaflet-popup) :is(.mapheading,.viewtoggle,.portlightkey,.maplayers,.reference-note){visibility:hidden}.aid-marker span{width:16px;height:16px;margin:5px;font-size:16px;border-color:#166e94;background:#ebfdffb0;box-shadow:0 1px 3px #0004}@media(max-width:760px){.aid-marker span{width:18px;height:18px;margin:4px;font-size:17px}}

/* DEV6 — chart-first workspace, with persistent A/B search. */
:root{--a:#55e0c0;--b:#ffbd70;--chrome:#0b1d28}
html,body{height:100%;overflow:hidden}body{height:100dvh;display:grid;grid-template-rows:54px auto minmax(0,1fr) 60px;font-size:14px;background:var(--chrome)}
[hidden],#legacyControls{display:none!important}
.chart-header{height:54px;padding:0 20px;border-bottom:1px solid #29414d;gap:12px}.chart-header .brand{gap:9px}.chart-header .brand img{width:30px;height:30px}.chart-header .brand b{font:700 14px Arial,sans-serif;letter-spacing:1px}.chart-header .brand em{font-weight:400}.header-actions{display:flex;align-items:center;gap:18px}.header-actions #clock{font-size:11px}.header-actions button{height:38px;padding:0 12px;font-size:13px}
.endpointbar{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:16px;align-items:center;padding:12px 20px;background:#102733;border-bottom:1px solid #395360;z-index:25;position:relative}.endpointbar .portinput{margin:0;min-width:0}.endpointbar .portinput label{font-size:11px;font-weight:700;color:#cbe2e9;letter-spacing:.7px;margin-bottom:6px}.endpointbar .letter{border:0;background:var(--a);color:#063b33;font-size:12px;width:22px;height:22px;line-height:22px;font-weight:800;border-radius:5px}.endpointbar .letter.arrival{background:var(--b);color:#52310c}.endpointbar .portinput input{height:44px;margin:0;background:#071b26;font-size:16px;border:1px solid #54717d;padding:0 12px;border-radius:7px}.endpointbar .portinput:first-child input{border-left:3px solid var(--a)}.endpointbar .portinput:nth-child(2) input{border-left:3px solid var(--b)}.endpointbar .portinput>small{display:none}.endpoint-actions{display:flex;align-items:center;gap:8px;padding-top:27px}.endpoint-actions button{height:44px;padding:0 16px;font-size:12px;background:#153b43;border-color:#456d71;white-space:nowrap}#swapBtn{font-size:23px;width:44px;padding:0}.suggestions{top:74px;z-index:100;max-height:min(400px,50dvh);background:#102a39;border-color:#73929f;box-shadow:0 12px 32px #0006}.suggestions button{min-height:56px;padding:12px 14px}.suggestions button strong{font-size:14px}.suggestions button small{font-size:11px}.suggestions button:hover{background:#254f5c}
main.chart-main{display:block;min-height:0;position:relative;overflow:hidden}.workspace{height:100%;display:block;min-height:0}.mapstage{height:100%!important;min-height:0!important;width:100%;isolation:isolate;overflow:hidden}.mapstage:fullscreen,.mapstage.expandedmap{height:100dvh!important;min-height:100dvh!important}.mapheading,.maplayers,.portlightkey,.reference-note,.mapcredit,.mapstatus,.globelegend,.mapcorner,.detailinfo,.map-area{display:none!important}.maptools,.detail-active .maptools{top:16px;right:16px;gap:0;background:#102733ed;border:1px solid #6c8996;border-radius:10px;overflow:hidden;z-index:15;box-shadow:0 3px 10px #0003}.maptools button{width:44px;height:42px;min-height:42px;border:0;border-bottom:1px solid #33505e;border-radius:0;font-size:22px;background:transparent;color:#e8f6f7}.maptools button:last-child{border-bottom:0}.maptools #pointABtn{color:var(--a);font-weight:800}.maptools #pointBBtn{color:var(--b);font-weight:800}.maptools #fitBtn{font-size:13px;font-weight:700}.maptools #positionBtn{display:none}.maptools #fullscreenBtn{font-size:19px}.maptools button:hover{background:#315765}.loading{font-size:13px}.loading[style*="none"]{display:none}
.reference-pin{width:36px;height:36px!important;line-height:30px;background:var(--a);color:#053d33;border:3px solid white;border-radius:8px;font-size:20px;font-weight:800;box-shadow:0 0 0 3px #103b4980,0 3px 9px #0008}.reference-pin.point-b{background:var(--b);color:#51320c}.endpoint-label{background:#0a2634f2;color:#fff;border:1px solid #547482;border-radius:5px;font:600 12px Arial,sans-serif;padding:6px 9px;box-shadow:0 2px 5px #0004}.endpoint-label:before{display:none}.reference-query{font-size:12px;line-height:1.4;min-width:150px;max-width:220px;max-height:none}.reference-query b{font-size:23px;color:#143749;display:block;padding-right:8px}.reference-query p{margin:8px 0 4px;font-family:monospace;font-size:11px;color:#526d7b}.reference-query small{color:#6d7f89;font-size:10px}.leaflet-popup-content{margin:14px 18px}.leaflet-popup-content-wrapper{border-radius:10px}.leaflet-popup-close-button{font-size:23px!important;width:30px!important;height:30px!important}.grid-depth-label{font-size:12px;text-shadow:0 0 3px white}.grid-depth-label span{background:#ffffff80;padding:0 2px}.leaflet-control-attribution{font-size:8px!important;max-width:100%;background:#ffffffce!important}.leaflet-control-scale{margin-bottom:5px!important}.leaflet-control-scale-line{font-size:10px}.leaflet-bottom.leaflet-right{max-width:85%}
.chart-dock{height:60px;display:flex;align-items:stretch;justify-content:center;gap:6px;background:#0b1d28;border-top:1px solid #365460;padding:4px 12px;z-index:26}.chart-dock button{display:flex;align-items:center;justify-content:center;gap:8px;min-width:110px;padding:8px 18px;border:0;border-radius:6px;font-size:12px;color:#bfd4de}.chart-dock button>span{font-size:22px;color:#86d5c6}.chart-dock button:hover,.chart-dock button.active{background:#1b3b46;color:white}
.tool-dialog{padding:0;max-width:670px;width:calc(100% - 36px);max-height:86dvh;overflow:auto;border:1px solid #567685;background:#102733;border-radius:16px;color:#dcebf0}.tool-dialog::backdrop{background:#03101c80;backdrop-filter:blur(2px)}.sheet-header{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;padding:14px 20px;background:#102733;border-bottom:1px solid #36525f}.sheet-header h2{font-size:20px;margin:0;letter-spacing:0}.sheet-header button{height:38px;width:38px;font-size:27px}.tool-section{padding:20px}.tool-section .world-options{position:static!important;width:100%!important;max-width:none!important;margin:0 0 20px;padding:0;background:transparent;border:0;box-shadow:none;visibility:visible!important}.tool-section .world-options summary{display:none}.tool-section .world-options>label:first-of-type{font-size:12px;letter-spacing:0}.tool-section .world-options .check,.tool-section>.check{font-size:14px;padding:6px 0;min-height:36px;margin:10px 0}.tool-section input[type=checkbox]{width:18px;height:18px;accent-color:#68d5be}.tool-section select{font-size:14px;padding:12px}.tool-section .world-options button{font-size:13px;min-height:42px;padding:10px 15px}.tool-section .world-options #depthStatus{font-size:11px;color:#afc6cf}.tool-section .viewtoggle{position:static!important;max-width:none!important;display:flex;margin:16px 0;border-color:#45616f;padding:4px;visibility:visible!important}.tool-section .viewtoggle button{flex:1;font-size:13px;min-height:40px}.tool-section #globeBtn,.tool-section #chartBtn,.tool-section #trafficBtn{display:none}.tool-section #worldOverview{display:none}.secondary{display:inline-flex;align-items:center;justify-content:center;padding:10px 15px;min-height:42px;font-size:13px;border:1px solid #456875;border-radius:7px;background:#153843;color:#d1ebe8;text-decoration:none;margin:5px 5px 0 0}.tool-section .aid-panel,.tool-section .traffic-panel,.tool-section .worksheet{margin:0;border:0;background:none;padding:0}.tool-section .panel-title h3{display:none}.tool-section .panel-title .eyebrow,.tool-section .source-badge{display:none}.tool-section .panel-title p{margin:0 0 18px;font-size:13px}.tool-section .aid-toolbar button,.tool-section .traffic-toolbar button{font-size:12px;min-height:42px}.tool-section .aid-list{max-height:38dvh;grid-template-columns:repeat(2,minmax(0,1fr))}.tool-section .aid-list button{min-height:54px}.tool-section .aid-list b{font-size:12px}.tool-section .planner{padding:0;background:none;border:0}.tool-section .planner form{display:block}.tool-section .planner label{font-size:12px}.tool-section .planner .sectionlabel{margin:20px 0 14px;font-size:11px}.tool-section .sectionlabel>span{display:none}.tool-section .vessel-details{border:1px solid #3c5966;border-radius:7px;padding:12px;margin-bottom:20px}.tool-section .vessel-details summary{font-size:13px;cursor:pointer}.tool-section .vessel-details .advanced p{font-size:11px}.tool-section .sidefoot{font-size:10px;margin:16px 0}.tool-section .sidefoot button{font-size:12px;padding:8px}.tool-section .primary{min-height:44px;font-size:14px}.tool-section .worksheet{padding-top:25px;margin-top:20px;border-top:1px solid #3c5966}.tool-section .worksheet-controls{gap:12px}.tool-section .worksheet-controls label{width:100%}.tool-section .worksheet-controls button{font-size:12px;min-height:44px;white-space:nowrap}.tool-section .traffic-context{font-size:12px}.tool-section .traffic-window{height:min(52dvh,460px)}.tool-section .traffic-foot{font-size:11px}.tool-section .vessel-lookup{padding:12px}.voyage-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}.tool-section #calculate{display:none}.portActions button{min-height:44px;flex:1;font-size:14px}.portActions button:first-child{background:#245c50;color:#aaf6df}.portActions button:last-child{background:#60452b;color:#ffdaaa}.portgrid small{font-size:10px}.portgrid>div{font-size:13px}#toast{bottom:76px}.position-link{font-size:12px}
@media(max-width:760px){body{grid-template-rows:50px auto minmax(0,1fr) 64px}.chart-header{height:50px;padding:0 12px}.chart-header .brand b{font-size:12px;letter-spacing:.5px}.chart-header .brand img{width:25px;height:25px}.header-actions{gap:6px}.header-actions #clock{display:none}.header-actions button{font-size:13px;padding:0 10px;height:36px}.endpointbar{padding:10px 12px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:7px 10px}.endpointbar .portinput label{font-size:9px;letter-spacing:0;gap:5px;margin-bottom:5px}.endpointbar .letter{width:20px;height:20px;line-height:20px;font-size:11px}.endpointbar .portinput input{font-size:16px;height:42px;padding:0 8px}.endpointbar input::placeholder{font-size:12px}.endpoint-actions{grid-column:1/-1;justify-content:flex-end;padding:0;gap:7px;position:absolute;right:12px;bottom:-42px;pointer-events:auto}.endpoint-actions button{height:32px;font-size:11px;padding:0 11px;background:#102f3eea;border-color:#78919d;box-shadow:0 2px 8px #0002}.endpoint-actions #swapBtn{width:34px;font-size:21px;padding:0}.suggestions{top:67px;left:0;min-width:calc(100vw - 24px);max-height:48dvh}.endpointbar .portinput:nth-child(2) .suggestions{left:auto;right:0}.suggestions button{min-height:56px}.suggestions button small{font-size:11px}.maptools,.detail-active .maptools{top:55px;right:12px}.maptools button{width:42px;height:42px;min-height:42px}.maptools #fullscreenBtn{display:none}.maptools #fitBtn{display:none}.chart-dock{height:64px;gap:2px;padding:3px 7px max(4px,env(safe-area-inset-bottom));justify-content:space-around}.chart-dock button{min-width:0;width:20%;gap:2px;flex-direction:column;font-size:10px;padding:3px}.chart-dock button>span{font-size:21px}.tool-dialog{width:100%;max-width:none;max-height:82dvh;top:auto;bottom:0;left:0;right:0;margin:0;border-radius:18px 18px 0 0;border-bottom:0}.sheet-header{padding:12px 16px}.tool-section{padding:16px 16px max(24px,env(safe-area-inset-bottom))}.tool-section .worksheet-controls{display:block}.tool-section .worksheet-controls button{width:100%}.tool-section .traffic-window{height:48dvh}.tool-section .traffic-toolbar{gap:6px}.tool-section .traffic-toolbar button{font-size:11px;padding:8px}.tool-section .traffic-foot{gap:8px}.reference-pin{font-size:20px}.endpoint-label{font-size:11px;max-width:180px;overflow:hidden;text-overflow:ellipsis}.leaflet-control-attribution{font-size:7px!important}.leaflet-bottom.leaflet-right{max-width:80%}.reference-query b{font-size:22px}.grid-depth-label{font-size:12px}dialog:not(.tool-dialog){padding:20px}#modalBody h2{font-size:23px}}
.port-record{margin-top:22px;border-top:1px solid #365460;padding-top:16px}.port-record summary{cursor:pointer;font-size:13px;margin-bottom:12px}
@media(max-width:760px){.endpointbar{grid-template-columns:1fr}.endpointbar .portinput{grid-column:1}.endpointbar .portinput label{font-size:11px}.endpointbar input::placeholder{font-size:14px}.chart-dock button{font-size:11px}}

@media(max-width:760px){.endpoint-actions{bottom:-50px}.endpoint-actions button{height:40px;font-size:12px}.endpoint-actions #swapBtn{width:40px}.maptools,.detail-active .maptools{top:64px}.maptools button{width:44px;height:44px;min-height:44px}}
/* DEV7: the phone's main task stays visible below the chart. */
body{grid-template-rows:54px auto minmax(0,1fr) auto 60px}
.quick-voyage{background:#112c37;border-top:1px solid #4d737c;padding:10px 20px;display:flex;gap:24px;align-items:center;z-index:26;min-width:0}
.quick-metrics{display:grid;grid-template-columns:1fr .7fr 1.7fr;gap:18px;flex:1;min-width:0}.quick-metrics>div{min-width:0}.quick-metrics small{display:block;font-size:10px;color:#a9c3cc;letter-spacing:.5px;margin-bottom:5px}.quick-metrics b{font-size:14px;line-height:1.35;display:block;overflow-wrap:anywhere}.quick-voyage .primary{width:220px;min-height:46px;font-size:15px;margin:0;background:#78e8c7;color:#0b302c;justify-content:space-between}.chart-dock button{min-height:44px}
.depth-chip{position:absolute;left:10px;bottom:31px;z-index:14;max-width:calc(100% - 20px);padding:6px 9px;border-radius:6px;background:#082735ed;color:#e2f6f8;font-size:11px;border:1px solid #72909c;pointer-events:none}
.waypoint-map-mode{position:absolute;left:10px;top:10px;right:80px;z-index:18;background:#fff4db;color:#4e3309;border:1px solid #c9a864;padding:9px;border-radius:8px;display:flex;gap:8px;align-items:center;font-size:12px}.waypoint-map-mode button{margin-left:auto;background:#60400b;color:white;min-height:40px;min-width:52px}.waypoint-picking{cursor:crosshair}.worksheet-pin{background:#ffff00;border:2px solid #171900;border-radius:50%;color:#111500;text-align:center;line-height:24px;font-weight:bold;font-size:12px;box-shadow:0 2px 4px #0004}
.sheet-intro{font-size:13px;color:#c6dce4;line-height:1.5;margin:0 0 16px}.tool-section input,.tool-section select{font-size:16px;min-height:46px}.tool-section label{font-size:12px}.calculator-primary{margin:14px 0}.calculator-primary input{font-size:21px!important}.departure-pair{grid-template-columns:1.6fr .8fr;margin:16px 0}.tool-section #departure{width:100%;max-width:100%;min-width:0}.tool-section .vessel-details{margin-top:18px;margin-bottom:10px}.time-basis-note,.waypoint-source{font-size:12px;color:#b4cdd5;line-height:1.5}.calculator-action{position:sticky;bottom:-1px;background:#102733;padding:10px 0;z-index:3;border-top:1px solid #3f616d}.calculator-action .primary{margin:0;min-height:48px;font-size:16px}.arrival-output{padding:16px;background:#0b382f;border:1px solid #60b99f;border-radius:10px;margin-bottom:20px;scroll-margin-top:80px}.arrival-output small{font-size:10px;letter-spacing:.4px;color:#bce8d9;display:block}.arrival-highlight strong{display:block;font-size:21px;line-height:1.45;margin:7px 0 18px;color:#c4ffe4}.arrival-output .worksheet-results{display:grid;grid-template-columns:1fr;gap:14px}.arrival-output .worksheet-results b{font-size:15px}.arrival-output p{font-size:11px;line-height:1.6;margin-bottom:0;color:#c5e1d8}.tool-section #worksheetError,.tool-section #waypointError{color:#ffc1ac;font-size:13px;line-height:1.5;scroll-margin-top:80px}#waypointDistanceValue{display:block;font-size:20px;margin:13px 0;color:#8be5c5}#editWaypointLink{padding:5px 0;border:0;font-size:12px;color:#a2ecdb}
.waypoint-summary{display:flex;justify-content:space-between;padding:14px;background:#173f49;border:1px solid #4c7b87;border-radius:8px}.waypoint-summary strong{color:#9bf0d4}.waypoint-toolbar{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0 20px}.waypoint-toolbar button{min-height:44px;font-size:13px;padding:8px;background:#183b49;border-color:#547985}#waypointForm{border:1px solid #3d616e;padding:14px;border-radius:8px;scroll-margin-top:80px}#waypointForm .primary{margin-top:12px;min-height:44px}#waypointForm input::placeholder{font-size:13px}.waypoint-import{margin:20px 0;padding:12px;border:1px solid #3d616e;border-radius:8px}.waypoint-import summary{cursor:pointer;font-size:14px;min-height:28px}.waypoint-import p{font-size:12px;line-height:1.5}.waypoint-import textarea{font:14px monospace;color:#e7f4f9;background:#0a1f2b;border:1px solid #567480;border-radius:6px;resize:vertical;padding:10px;width:100%}.file-label{margin:15px 0}.file-label input{font-size:12px!important}#waypointDepthStatus{font-size:12px;color:#b9dbe7;line-height:1.5}.waypoint-cards{display:grid;gap:12px}.waypoint-card{border:1px solid #476975;border-radius:9px;background:#0b202c;padding:14px}.waypoint-card-title{display:flex;align-items:center;justify-content:space-between;gap:6px}.waypoint-card-title b{font-size:14px;overflow-wrap:anywhere}.waypoint-card-title span{color:#ffd99d;font-size:12px;margin-right:4px}.waypoint-card button{font-size:12px;min-height:40px;padding:8px 12px;border-color:#4b6873}.waypoint-coordinates{font:12px monospace;color:#c3dae3;line-height:1.5}.waypoint-card dl{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin:16px 0}.waypoint-card dt{font-size:10px;color:#91b3c0}.waypoint-card dd{margin:3px 0 0;font-size:15px}.waypoint-eta{font-size:12px;line-height:1.5;color:#b3e8d7}.waypoint-card-actions{display:flex;gap:8px;justify-content:flex-end}.waypoint-card-actions button:first-child{margin-right:auto}.waypoint-empty{padding:24px 14px;border:1px dashed #587583;border-radius:8px;font-size:14px;line-height:1.6;color:#b2cbd6}.more-actions{display:flex;gap:8px;margin-bottom:20px}
@media(max-width:760px){body{grid-template-rows:46px auto minmax(0,1fr) auto 60px}.chart-header{height:46px}.endpointbar{padding:8px 12px;gap:7px}.endpointbar .portinput label{margin-bottom:4px}.endpointbar .portinput input{height:40px}.quick-voyage{padding:8px 12px;display:block}.quick-metrics{gap:10px;grid-template-columns:1fr .65fr 1.5fr;margin-bottom:8px}.quick-metrics small{font-size:9px;margin-bottom:3px}.quick-metrics b{font-size:12px;line-height:1.3}.quick-voyage .primary{width:100%;min-height:44px;padding:10px 14px}.chart-dock{height:60px;padding:3px 4px}.chart-dock button{font-size:10px!important}.chart-dock button>span{font-size:22px}.tool-dialog{max-height:92dvh}.tool-section{padding:16px 14px max(20px,env(safe-area-inset-bottom))}.tool-section select{font-size:16px}.sheet-header h2{font-size:19px}.departure-pair{grid-template-columns:1fr}.depth-chip{font-size:10px;bottom:32px}.arrival-highlight strong{font-size:20px}.maptools,.detail-active .maptools{top:60px}.endpoint-actions{bottom:-46px}.worksheet-pin{font-size:12px}.waypoint-map-mode{top:51px;right:70px}.waypoint-toolbar button{font-size:12px}}
@media(max-height:620px) and (max-width:760px){.endpointbar{grid-template-columns:1fr 1fr}.endpointbar .portinput{grid-column:auto}.endpointbar .portinput label{font-size:10px}.quick-metrics{margin-bottom:5px}.quick-voyage{padding:6px 12px}.chart-dock button>span{display:none}}
.calculator-action{top:66px;bottom:auto;margin:0 0 14px;padding:8px 0;border-top:0}.arrival-output{scroll-margin-top:135px}@media(max-width:760px){.calculator-action{top:62px}}
/* DEV8: generated distance is the primary voyage input. */
#generateRouteBtn{background:#397e6b;color:#edfff8;font-weight:700}.route-brief{border:1px solid #5b9c8b;background:#143d39;border-radius:8px;padding:13px;margin:0 0 12px;font-size:13px;line-height:1.55}.route-brief b{font-size:22px;color:#a4ffe0}.route-brief span{color:#c2e1db}.route-tools{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:15px}.route-tools button{min-height:44px;padding:9px;font-size:12px;border-color:#54807e;background:#173a41}.route-review{border:1px solid #6b6d52;padding:12px;border-radius:8px;margin:12px 0 18px;font-size:12px;line-height:1.5}.route-review summary{cursor:pointer;color:#f4d69b;min-height:30px}.route-review-card{padding:10px 0;border-top:1px solid #4b615d}.route-review-card p{margin:7px 0;color:#c2d4d8}.route-review-card.blocked{border-left:3px solid #eba97e;padding-left:10px}#routeReviewCount{font-size:11px}.route-map-label{position:absolute;left:10px;top:12px;z-index:14;max-width:calc(100% - 90px);font-size:12px;line-height:1.4;background:#0c302fef;border:1px solid #7cbca9;color:#dbfff1;padding:8px 10px;border-radius:7px;pointer-events:none}#generateFromWaypoints{margin:0 0 14px;min-height:44px}.waypoint-summary{margin-top:10px}#waypointSourceLabel{margin:0 0 10px;color:#b2e8d7;font-weight:600}.tool-section #waypointDistanceValue{font-size:25px;margin:9px 0}.waypoint-card dd{font-variant-numeric:tabular-nums}@media(max-width:760px){.route-map-label{top:54px;max-width:calc(100% - 82px);font-size:11px}.maptools,.detail-active .maptools{top:102px}.waypoint-map-mode{top:96px}#generateRouteBtn{font-size:12px}.calculator-primary{gap:12px}.tool-section #waypointDistanceValue{font-size:24px}.route-review summary{font-size:12px}}
/* DEV9: a map-first workspace inspired by the supplied Balangay reference. */
:root{--bg:#0c1225;--panel:#111a31;--line:#31435c;--mint:#8be5d3;--muted:#a1b4c9;--text:#eef4ff}
.chart-header{background:#0d1429;border-color:#2b3750;padding:0 20px}.chart-header .brand b{letter-spacing:1px}.chart-header .brand em{color:#9ec9f5}.header-actions{gap:8px}.header-actions button{width:42px;height:42px;padding:8px;border:1px solid transparent;background:transparent;border-radius:12px;font-size:24px}.header-actions button:hover{background:#25324d;border-color:#5b7197}.header-actions #sourcesBtn{width:42px;font-size:22px}.header-actions #sourcesBtn span{display:none}svg{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.header-actions svg,.round-control svg{width:25px;height:25px;display:block;margin:auto}
.endpointbar{background:#131e34;border-color:#344963;padding:11px 20px}.endpointbar .portinput input{background:#0c162a;border-color:#435571;border-radius:10px}.endpointbar .portinput label{color:#b7c8df}.endpointbar .letter{border:0;background:#7de0c5;color:#102a2a}.endpointbar .letter.arrival{background:#ffc77d;color:#382908}.endpoint-actions button{border-radius:10px}.endpoint-actions #generateRouteBtn{background:#8be5d3;border-color:#8be5d3;color:#123530}
.chart-commandbar{position:absolute;top:14px;left:16px;right:16px;z-index:22;display:flex;gap:10px;pointer-events:none;max-width:640px}.chart-commandbar>*{pointer-events:auto}.chart-search{position:relative;flex:1;min-width:0;border:1px solid #8098bc75;border-radius:30px;background:#111a35f5;box-shadow:0 5px 20px #06102630;display:flex;align-items:center;padding:0 16px;gap:10px;height:52px;color:#acbed8}.chart-search>svg{width:22px;height:22px;flex-shrink:0}.chart-search input{background:transparent;border:0;margin:0;padding:10px 0;box-shadow:none;outline-offset:0;font-size:16px;color:#f4f7ff}.chart-search input::placeholder{font-size:15px;color:#aabbd2}.round-control{height:52px;width:52px;flex-shrink:0;border-radius:50%;background:#111a35f5;color:#c8d7ee;border:1px solid #8098bc75;box-shadow:0 5px 20px #06102630}.round-control:hover{background:#243654;border-color:#9ecbf1}.round-control[aria-pressed=true]{background:#8be5d3;color:#102f2c;border-color:#bdf8e8}.round-control[aria-pressed=true] .lock-shackle{d:path('M8 10V6a4 4 0 0 1 8 0v4')}.route-locked .endpointbar{box-shadow:inset 0 -2px #8be5d3}.route-locked .endpointbar input{opacity:.75}
.map-port-results{position:absolute;top:61px;left:0;right:0;min-width:260px;max-height:min(50dvh,410px);overflow:auto;background:#121f37;border:1px solid #647b9b;border-radius:16px;box-shadow:0 15px 40px #0006;color:#edf5ff;padding:5px}.map-port-results button{display:block;width:100%;text-align:left;border:0;border-radius:10px;padding:12px;min-height:54px}.map-port-results button:focus,.map-port-results button:hover{background:#243f58}.map-port-results b{font-size:14px;display:block}.map-port-results small{color:#acc2da;font-size:11px;display:block;margin-top:5px}.map-port-results p{padding:10px;line-height:1.5}
.route-check-badge{position:absolute;left:18px;top:78px;z-index:15;background:#14263beF;border:1px solid #7892aa;border-radius:20px;padding:8px 13px;font-size:11px;font-weight:600;box-shadow:0 3px 10px #0002;color:#d8e9ff;max-width:calc(100% - 90px)}.route-check-badge[data-state=screened]{background:#123b38ef;color:#a5efda;border-color:#5c9c92}.route-check-badge[data-state=busy]{color:#ffe0a4}.route-map-label{top:121px;left:18px;font-size:11px;max-width:calc(100% - 95px);background:#14263beF;border-color:#7892aa;color:#e8f4ff;border-radius:10px}.maptools,.detail-active .maptools{right:16px;top:130px;border:0;background:transparent;gap:8px;overflow:visible}.maptools button{border:1px solid #8098bc75!important;border-radius:50%;background:#111a35f5;color:#d0dff4;width:46px;height:46px;box-shadow:0 3px 12px #0002;font-size:20px}.maptools #pointABtn,.maptools #pointBBtn{font-size:15px;font-weight:700}.maptools #fullscreenBtn{display:block}.depth-chip{background:#11243deF;border-color:#7892aa;border-radius:12px;padding:7px 10px;color:#e2efff}.waypoint-map-mode{top:119px;left:16px;right:80px}
.quick-voyage{background:#111e33;border-color:#465b74}.quick-voyage .primary{background:#8be5d3;border-radius:12px}.quick-metrics small{color:#a2bad2}.chart-dock{background:#0d1429;border-color:#35445b}.chart-dock button{border-radius:12px}.chart-dock button.active{background:#254555;color:#b2f4e5}.tool-dialog,.sheet-header{background:#101d31}.tool-dialog{border-color:#526985}.tool-section .viewtoggle{background:transparent}.tool-section .calculator-action{background:#101d31}.tool-section .planner{background:transparent}.tool-section input,.tool-section select,dialog input,dialog textarea{background:#0b172a;border-color:#465c79;color:#eef4ff}.tool-section{color:#e3efff}.sheet-header{border-color:#344b66}.tool-section .secondary,.transfer-actions .secondary{min-height:44px}.bunker-basis{padding:12px 14px;border:1px solid #496786;border-radius:10px;background:#172d46;font-size:13px}.bunker-output{border:1px solid #5f9d94;border-radius:14px;padding:18px;background:#123632;margin:18px 0}.bunker-output>p{line-height:1.6;color:#c2ddd8}.bunker-total small{font-size:10px;letter-spacing:.7px;color:#abd9cd;display:block}.bunker-total strong{display:block;font-size:36px;font-weight:600;color:#bbffe6;margin:10px 0 20px}.bunker-total strong span{font-size:20px}.bunker-output dl{display:grid;gap:14px;margin:0}.bunker-output dl div{display:flex;justify-content:space-between;gap:14px;font-size:13px}.bunker-output dt{color:#b2cfc8}.bunker-output dd{margin:0;font-variant-numeric:tabular-nums;font-weight:600}.paste-voyage{margin:20px 0}.paste-voyage summary{padding:10px 0;cursor:pointer}.paste-voyage textarea{width:100%;padding:12px;border-radius:8px;margin:10px 0}.transfer-actions{display:grid;gap:12px}#voyageImportError{color:#ffc5a9}
:root[data-palette=dusk] #referenceMap .leaflet-tile-pane,:root[data-palette=dusk] #detailMap .leaflet-tile-pane{filter:brightness(.68) saturate(.78)}
:root[data-palette=night] #referenceMap .leaflet-tile-pane,:root[data-palette=night] #detailMap .leaflet-tile-pane{filter:brightness(.36) saturate(.65)}
:root[data-palette=night]{--text:#cad8ee;--mint:#8cc5bd}:root[data-palette=night] .chart-header,:root[data-palette=night] .chart-dock{background:#070c19}:root[data-palette=night] .endpointbar,:root[data-palette=night] .quick-voyage{background:#0c1526}
@media(min-width:761px){.chart-dock button{min-width:100px}.mapstage{min-height:260px}}
@media(max-width:760px){body{grid-template-rows:52px auto minmax(0,1fr) auto 60px}.chart-header{height:52px;padding:0 12px;gap:8px}.chart-header .brand{gap:7px}.chart-header .brand b{font-size:11px;letter-spacing:.2px}.chart-header .brand img{width:25px;height:25px}.header-actions{gap:0}.header-actions button,.header-actions #sourcesBtn{height:36px;width:34px;padding:6px;font-size:23px}.header-actions svg{width:23px;height:23px}.header-actions #sourcesBtn{font-size:19px}.endpointbar{grid-template-columns:1fr 1fr;padding:8px 12px;gap:7px 10px}.endpointbar .portinput{grid-column:auto}.endpointbar .portinput label{font-size:10px;white-space:nowrap;gap:5px}.endpointbar .portinput input{height:40px;font-size:15px;padding:0 10px}.endpointbar input::placeholder{font-size:12px}.endpoint-actions{position:static;grid-column:1/-1;justify-content:flex-end;padding:0;gap:8px}.endpoint-actions button{height:34px;font-size:11px;box-shadow:none}.endpoint-actions #swapBtn{height:34px;width:38px}.endpoint-actions #generateRouteBtn{height:34px;padding:0 15px}.chart-commandbar{top:10px;left:12px;right:12px;gap:8px}.chart-search{height:46px;padding:0 13px;gap:7px}.chart-search input,.chart-search input::placeholder{font-size:14px}.chart-search>svg{width:20px}.round-control{height:46px;width:46px}.round-control svg{width:23px}.map-port-results{top:54px;min-width:calc(100vw - 24px)}.route-check-badge{top:66px;left:12px;padding:7px 11px;font-size:10px}.route-map-label{top:auto;bottom:65px;left:12px;font-size:10px;max-width:calc(100% - 80px);padding:6px 9px}.maptools,.detail-active .maptools{top:112px;right:12px;gap:6px}.maptools button{width:42px;height:42px;min-height:42px}.maptools #pointABtn,.maptools #pointBBtn{display:none}.maptools #fitBtn{display:block;font-size:12px}.maptools #fullscreenBtn{display:block}.waypoint-map-mode{top:104px;font-size:11px}.chart-dock button{width:16.666%;font-size:10px!important;padding:3px 2px}.chart-dock button>span{font-size:20px}.quick-voyage{padding:9px 12px}.quick-metrics{grid-template-columns:1fr .6fr 1.5fr}.quick-voyage .primary{min-height:42px;font-size:14px}.bunker-output dl div{font-size:12px}.depth-chip{font-size:9px;max-width:calc(100% - 24px);left:12px}.suggestions{z-index:40}.endpointbar .suggestions{max-height:45dvh}}
@media(max-width:370px){.chart-header .brand b{font-size:10px}.chart-header .brand img{width:21px;height:21px}.header-actions button,.header-actions #sourcesBtn{width:30px}.endpointbar .portinput label{font-size:9px}}
@media(max-height:650px) and (max-width:760px){.maptools,.detail-active .maptools{top:108px;flex-direction:row}.maptools button{height:36px;width:36px;min-height:36px}.maptools #fitBtn{display:none}.route-map-label{display:none}.quick-voyage{padding:6px 12px}.chart-dock button>span{display:none}}
@media(max-width:760px){.maptools,.detail-active .maptools{display:grid;grid-template-columns:42px 42px;gap:6px}.maptools #pointABtn,.maptools #pointBBtn{display:block}}
@media(max-height:650px) and (max-width:760px){.maptools,.detail-active .maptools{grid-template-columns:36px 36px 36px}.maptools #fitBtn{display:block}}

/* Route audit: neutral/amber is deliberately distinct from clearance approval. */
.route-check-badge[data-state="blocked"]{background:#8f172b;color:#fff;border:2px solid #ff7c87}
.route-audit{margin:16px 0;padding:14px;border:1px solid #b4823e;border-radius:12px}
.route-audit summary{font-weight:700;cursor:pointer}.route-audit>p{line-height:1.5}
#routeAuditList{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:10px;max-height:460px;overflow:auto;margin-top:14px}
.audit-leg{padding:12px;border:1px solid #7e8b9f;border-radius:9px}.audit-leg>div{display:flex;justify-content:space-between;gap:12px}.audit-leg p{margin:8px 0;font-size:13px}.audit-leg strong,.audit-leg small{display:block}.audit-leg small{margin:7px 0;line-height:1.4}.audit-leg.conflict{border:2px solid #ef6670;background:#70223433}.audit-leg.near{border-color:#d39d4e}.audit-leg button{width:100%;margin-top:6px}
.grid-depth-label span{white-space:nowrap}
.rejected-leg-pin{background:#a41d32;color:white;border:2px solid white;border-radius:50%;font-size:26px;font-weight:800;text-align:center;line-height:27px;box-shadow:0 0 0 3px #a41d3266}

/* DEV13: required vessel inputs and a complete, collapsible ledger below the chart. */
body{height:auto;min-height:100dvh;overflow-y:auto;grid-template-rows:54px auto minmax(360px,calc(100dvh - 400px)) auto auto 60px}
.endpointbar{grid-template-columns:1.4fr 1.4fr .8fr .8fr;align-items:end}.required-vessel-field{font-size:11px;color:#c3d5e9}.required-vessel-field input{height:44px;min-width:0;width:100%;font-size:16px}.required-vessel-field .unitfield{margin-top:7px}.voyage-input-hint{grid-column:1/-1;font-size:11px;color:#b7cde3;margin:0}.endpoint-actions{grid-column:1/-1;position:static;justify-content:flex-end}.endpointbar .portinput small{display:block;font-size:10px;line-height:1.3;max-height:30px;overflow:hidden}.endpointbar button:disabled{opacity:.45;cursor:not-allowed}
.waypoint-ledger{background:#101d31;color:#e5effb;border-top:1px solid #435977;min-width:0;padding:14px 20px}.ledger-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.ledger-heading b{font-size:16px}.ledger-heading small{display:block;font-size:11px;color:#abc5d6;margin-top:5px}.ledger-heading button{min-height:40px;border:1px solid #5e8197;border-radius:8px;padding:8px 12px}.waypoint-ledger p{font-size:11px;line-height:1.5;color:#adc6df}.ledger-scroll{max-height:380px;overflow:auto;border:1px solid #46617d;border-radius:9px;margin-top:12px}.waypoint-ledger table{border-collapse:collapse;width:100%;min-width:1080px;font-variant-numeric:tabular-nums}.waypoint-ledger th{position:sticky;top:0;background:#192e47;color:#b8d3e6;text-align:left;font-size:10px;padding:12px 9px;z-index:2;white-space:nowrap}.waypoint-ledger td{padding:11px 9px;border-top:1px solid #314962;font-size:12px;line-height:1.5;vertical-align:top}.waypoint-ledger td small{display:block;font-size:10px;color:#a8c1d8}.waypoint-ledger td button{min-width:34px;min-height:34px;background:#234b58;color:#a9f1e1;border-radius:6px}.waypoint-ledger tr.conflict{background:#69233955}.leg-course-label{background:#102d43ee;border:1px solid #d1eaff;border-radius:4px;padding:2px 5px;color:#fff;font:600 10px/14px Arial,sans-serif;white-space:nowrap;width:max-content!important;box-shadow:0 1px 3px #0005}.leg-course-label.blocked{background:#842033ee}.leg-course-label.pending{background:#594b2dee}
@media(max-width:760px){body{grid-template-rows:52px auto minmax(340px,52dvh) auto auto 60px}.endpointbar{grid-template-columns:1fr 1fr}.required-vessel-field .unitfield{margin-top:5px}.required-vessel-field input{height:38px;font-size:16px}.waypoint-ledger{padding:12px}.ledger-heading b{font-size:14px}.ledger-heading button{font-size:11px}.ledger-scroll{max-height:330px}.voyage-input-hint{font-size:10px}.mapstage{min-height:340px}.chart-dock{position:sticky;bottom:0;z-index:28}.leg-course-label{font-size:9px}}

.coverage-summary{grid-column:1/-1;text-align:left;padding:7px 10px;font-size:12px;border:1px solid var(--line,#718b9d);border-radius:7px;color:inherit;background:transparent}.leg-course-label{pointer-events:none}.waypoint-ledger{min-width:0}.ledger-scroll{max-width:100%}

.chartoptions{left:12px;right:auto;bottom:110px;width:210px}.chartoptions summary{font-size:11px;cursor:pointer;color:#dbe8eb}.chartoptions:not([open]){padding:10px}.chartoptions[open]{max-height:260px;overflow:auto}

/* DEV14 — phone training workspace, one page scroll. */
body.training-app{display:block;height:auto;min-height:100dvh;overflow-y:auto;padding-bottom:72px}
.training-banner{padding:8px 18px;display:flex;gap:14px;justify-content:space-between;background:#193c43;color:#bceade;font-size:11px;letter-spacing:.4px}
.section-nav{height:48px;display:flex;gap:6px;padding:4px 12px;background:var(--panel);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:34}
.section-nav button{flex:1;min-height:40px;font-size:13px;border:0}
#planSection,#chartSection,#waypointsSection{scroll-margin-top:55px}
.training-app .endpointbar{position:relative}
.training-app .chart-main{display:block;height:auto;min-height:0}
.training-app .mapstage{height:60dvh!important;min-height:380px!important;max-height:720px}
.chart-toolbar{padding:12px 18px;background:var(--panel);display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px;border-top:1px solid var(--line)}
.chart-toolbar>div{flex:1;min-width:190px}.chart-toolbar label{margin:0;font-size:11px}.chart-toolbar select{margin-top:4px;min-height:44px;font-size:16px}.chart-toolbar button{min-height:46px;padding:8px 14px;font-size:13px}.chart-toolbar p{width:100%;margin:0;font-size:12px;line-height:1.5;color:var(--muted)}

.training-app #routeCheckBadge{position:static;display:none}.training-app #routeMapLabel{display:none!important}.training-app .chart-commandbar{top:10px}.training-app .maptools{top:78px;right:12px}
.training-app .leg-course-label.training{background:#fff8df;color:#1d4b60;border-color:#486b69;box-shadow:0 1px 3px #0002}
.training-app .depth-conflict-warning{color:var(--amber);background:transparent;border-color:#6d6042}.training-app .route-check-badge[data-state=training]{color:var(--text);background:#24464e}
.training-app .chart-dock{position:fixed;bottom:0;left:0;right:0;z-index:40;height:68px;border-top:1px solid #49616e;background:#0c1b27f5}
.training-app .ledger-scroll{max-height:none;overflow-x:auto;overflow-y:visible}.training-app #routeAuditList,.training-app #enteredWaypointList{max-height:none;overflow:visible}
.training-app .tool-dialog{overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch}.training-app .sheet-header button{min-height:44px;min-width:44px}
.waypoint-navigator{display:grid;grid-template-columns:44px minmax(0,1fr) 44px auto auto;gap:8px;align-items:end;padding:12px 18px;background:var(--panel);border-top:1px solid var(--line)}
.waypoint-navigator label{margin:0;font-size:11px}.waypoint-navigator select{font-size:16px;min-height:44px;margin-top:4px}.waypoint-navigator button{min-height:44px;padding:8px}.vlcc-preset{font-size:12px;min-height:44px;padding:8px 12px}.waypoint-mobile-cards{display:none}
.training-depth{padding:14px;border:1px solid var(--line);border-radius:10px;margin:16px 0}.training-depth h3{margin:0 0 8px}.training-depth p{font-size:12px;line-height:1.6}.training-depth output{display:block;line-height:1.7;padding:10px;background:#193c43;border-radius:7px}
@media(max-width:760px){
 .training-banner{padding:8px 12px;font-size:9px;gap:6px}.training-banner b{white-space:nowrap}
 .training-app .endpointbar{padding:12px;gap:10px}.training-app .endpointbar .portinput input,.training-app input,.training-app select{font-size:16px;min-height:44px}.training-app input[type=checkbox]{min-height:20px}
 .training-app .endpoint-actions{position:static;grid-column:1/-1;display:flex}.training-app .endpoint-actions button{height:46px}.training-app #generateRouteBtn{flex:1}.training-app .coverage-summary{font-size:11px;padding:5px;min-height:30px}
 .training-app .mapstage{height:52dvh!important;min-height:350px!important}.training-app .maptools{width:96px;gap:6px}.training-app .maptools button{width:44px;height:44px;min-height:44px}.training-app #mapPortSearch{font-size:16px}
 .chart-toolbar{padding:10px 12px}.chart-toolbar p{font-size:11px}.chart-toolbar button{padding:8px;font-size:12px}
 .waypoint-navigator{padding:12px;grid-template-columns:44px minmax(0,1fr) 44px}.waypoint-navigator #zoomWaypoint{grid-column:1/3}.waypoint-navigator #fitTrainingRoute{grid-column:3;min-width:44px;font-size:11px}
 .training-app .waypoint-ledger{padding:16px 12px}.training-app .ledger-scroll{display:block}.waypoint-mobile-cards{display:none}.mobile-wp{padding:14px;margin:10px 0;border:1px solid var(--line);border-radius:10px;background:var(--panel)}.mobile-wp>div{display:flex;justify-content:space-between;align-items:center;gap:8px}.mobile-wp>div b{font-size:14px}.mobile-wp button{min-width:60px;min-height:44px;background:#193c43}.mobile-wp p{font-size:12px;color:var(--muted);line-height:1.6;margin:6px 0}.mobile-wp dl{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}.mobile-wp dt{font-size:10px;color:var(--muted);margin-bottom:4px}.mobile-wp dd{margin:0;font-size:13px}.mobile-wp .wp-times{font-size:11px;border-top:1px solid var(--line);padding-top:8px}
 .training-app .quick-voyage{padding:14px 12px}.training-app .chart-dock button{min-height:54px}.training-app .tool-dialog{max-height:88dvh}
}

.training-app .workspace{height:auto}.training-app .mapstage:fullscreen,.training-app .mapstage.expandedmap{height:100dvh!important;max-height:none;min-height:100dvh!important}.training-app .section-nav{isolation:isolate}

html.training-root{height:auto;min-height:100%;overflow-x:hidden;overflow-y:auto}
.training-app{overflow:visible!important}.training-app .mapstage{scroll-margin-top:55px}.training-app #toast{bottom:82px}
.training-app .waypoint-navigator button:disabled{cursor:default}.training-app .waypoint-ledger tr.conflict td{color:inherit;background:transparent}
.training-app .chart-dock{padding-bottom:env(safe-area-inset-bottom);height:calc(68px + env(safe-area-inset-bottom))}
body.training-app{padding-bottom:calc(80px + env(safe-area-inset-bottom))}
@media(max-width:760px){.training-app .maptools{display:grid;grid-template-columns:44px 44px;flex-direction:unset}.training-app .chart-commandbar{right:12px}.training-app .chart-search{min-width:0;flex:1}.training-app .mapcorner{bottom:33px}}

.chart-review-link{display:inline-flex;align-items:center;padding:.7rem .8rem;border:1px solid #4b6d80;border-radius:10px;color:#95eadb;text-decoration:none;white-space:nowrap}

.route-detail-controls{position:absolute;left:12px;right:12px;bottom:62px;z-index:650;display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 12px;background:#102c3a;color:#fff;border:1px solid #63cbd1;border-radius:9px;box-shadow:0 4px 14px #0005}.route-detail-controls[hidden]{display:none}.route-detail-controls span{flex:1 1 180px;font-size:12px}.route-detail-controls button{min-height:38px;padding:7px 12px;border-radius:5px}#editProposedRoute{margin-top:8px;min-height:42px;width:100%}