:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Arial,sans-serif;color:#eaf3f3;background:#07151d;font-size:13px;--panel:#0b1b25;--panel2:#0e222d;--muted:#7995a2;--line:rgba(169,212,222,.12);--aqua:#57e1d3;--gold:#e8ba79;--red:#ef8779}*{box-sizing:border-box}html,body,#app{height:100%;margin:0;overflow:hidden}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:2px solid var(--aqua);outline-offset:2px}.topbar{height:69px;display:flex;align-items:center;justify-content:space-between;padding:0 24px;gap:20px;background:#07141cd9;border-bottom:1px solid var(--line);position:relative;z-index:5}.brand{display:flex;align-items:center;gap:11px;min-width:260px}.brand-icon{width:39px;height:39px;background:rgba(53,179,163,.1);border:1px solid #28665f;border-radius:8px;display:grid;place-items:center}.brand strong{display:block;letter-spacing:.18em;font-size:15px;font-weight:850}.brand small{color:#87a4ae;font-size:8px;letter-spacing:.21em;display:block;margin-top:3px}.mission-tag{font-size:10px;letter-spacing:.14em;font-weight:800;color:#c4e0e0}.tag-secondary{color:#829daa;font-weight:500}.pulse-dot,.status-led{width:7px;height:7px;border-radius:50%;background:#62dfba;display:inline-block;box-shadow:0 0 12px #42ecb7;margin-right:9px}.top-actions{display:flex;align-items:center;gap:15px}.top-clock{font:12px ui-monospace,monospace;color:#94b0b9}.state-pill{background:#12322f;color:#81ead6;border:1px solid #1f6054;border-radius:4px;padding:6px 9px;font-size:9px;letter-spacing:.09em;font-weight:750}.iconbtn{width:28px;height:28px;border:1px solid #29434d;background:#102530;color:#bed4dc;border-radius:5px;font-size:16px}.shell{display:grid;grid-template-columns:294px minmax(0,1fr) 320px;height:calc(100% - 69px)}.panel{background:linear-gradient(155deg,#0b1d27,#081923);min-height:0;overflow:auto;scrollbar-width:thin;scrollbar-color:#214652 transparent}.left{padding:21px 20px 17px;border-right:1px solid var(--line);display:flex;flex-direction:column}.right{padding:20px 17px 15px;border-left:1px solid var(--line);display:flex;flex-direction:column;gap:0}.eyebrow{font-size:9px;font-weight:800;letter-spacing:.17em;color:#6ddacc;display:flex;gap:8px;justify-content:space-between}.eyebrow span{color:#718c99}.panel h2{font-size:20px;margin:9px 0 5px;letter-spacing:-.045em;font-weight:760}.muted{color:#829ca8;line-height:1.6;font-size:11px;margin:0 0 14px}.mission-tabs{display:flex;padding:4px;background:#0a151e;border:1px solid var(--line);border-radius:7px;gap:3px;margin:3px 0 17px}.mission-tabs button{flex:1;padding:9px 0;border:0;background:transparent;color:#718d9c;border-radius:4px;font-size:10px;font-weight:750;letter-spacing:.1em}.mission-tabs button.selected{background:#1a4545;color:#75f2df;box-shadow:inset 0 0 0 1px #246961}.section-heading{font-size:9px;font-weight:820;letter-spacing:.13em;color:#9bb5bf;display:flex;align-items:center;justify-content:space-between;margin:15px 0 11px}.section-heading>span{color:#5c8791;font-size:9px}.small-badge{background:#1c3337;color:#83d8cc!important;border-radius:4px;padding:3px 6px}.vessel-card{display:flex;align-items:center;gap:10px;background:#102732;border:1px solid var(--line);border-radius:6px;padding:10px 8px}.ship-mini{width:41px;height:38px;background:#1d3b45;border-radius:4px;display:grid;place-items:center;font-size:22px;filter:saturate(.7)}.vessel-card b{display:block;font-size:10px;letter-spacing:.06em}.vessel-card span{font-size:9px;color:#819faa}.signal-bars{margin-left:auto;color:#68e8c5!important;font-size:16px!important}.control{display:block;margin:9px 0 15px}.control>span:first-child{display:flex;justify-content:space-between;color:#aac0c8;font-size:11px}.control output{color:#dff1ef;font-family:ui-monospace,monospace;font-size:11px;font-weight:700}input[type=range]{-webkit-appearance:none;appearance:none;width:100%;background:linear-gradient(to right,#61cbbf,#32636c);height:3px;border-radius:20px;outline:0;display:block;margin:13px 0 10px;cursor:pointer}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:13px;height:13px;border-radius:50%;background:#d4f9f1;border:3px solid #208577;box-shadow:0 0 0 2px #163b41}.range-ends{display:flex!important;justify-content:space-between;color:#5b7d8c!important}.range-ends i{font-style:normal;font-size:8px;letter-spacing:.06em}.sub-heading{font-size:9px;letter-spacing:.12em;color:#809fab;font-weight:800;margin:4px 0 12px}.compact-controls{display:grid;grid-template-columns:1fr 1fr;gap:14px}.compact-controls label{font-size:10px;color:#a9bcc5}.compact-controls label span{float:right;color:#d9eeec;font-family:monospace;font-size:9px}.action-group{margin-top:11px}.primary{width:100%;background:#60e1cf;border:1px solid #8cfce9;color:#092b2d;font-size:10px;letter-spacing:.1em;font-weight:900;padding:14px 10px;border-radius:6px;box-shadow:0 3px 25px #2bceb424}.primary:hover{background:#9cfff1}.split{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:8px}.secondary{border:1px solid #2a515c;background:#142e39;color:#c0dedf;border-radius:5px;padding:11px 4px;font-weight:750;font-size:9px;letter-spacing:.045em}.secondary:hover{border-color:#5cbbb2}.secondary.danger{color:#e6b6a5}.bottom-left{margin-top:auto;padding-top:17px}.rates{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}.rates button{background:#102732;border:1px solid #24434d;color:#86a8b1;border-radius:4px;padding:8px;font-size:10px;font-weight:700}.rates button.selected{color:#79e2d1;border-color:#388d82;background:#18433f}.foot{display:flex;align-items:center;border-top:1px solid var(--line);margin-top:20px;padding-top:12px;font-size:8px;letter-spacing:.05em;color:#7da3a6;font-weight:750}.foot>span:last-child{margin-left:auto;color:#6f8a94}.viewport{min-width:0;position:relative;overflow:hidden;background:radial-gradient(ellipse at 55% 45%,#1b5c6a 0%,#0b3347 47%,#061723 100%)}#ocean{display:block;width:100%;height:100%;cursor:grab;position:absolute;inset:0}#overlay{pointer-events:none;position:absolute;inset:0;width:100%;height:100%}.viewport-gradient{pointer-events:none;position:absolute;inset:0;background:linear-gradient(to bottom,rgba(4,17,26,.52),transparent 32%,transparent 70%,rgba(4,19,27,.76));}.view-top{position:absolute;top:28px;left:31px;right:30px;display:flex;justify-content:space-between;gap:10px;pointer-events:none}.view-top .eyebrow{justify-content:flex-start}.live-tick{color:#73f6d8!important}.view-title{font-size:23px;letter-spacing:-.035em;font-weight:850;margin-top:7px;text-shadow:0 1px 10px #051821}.view-title em{font-style:normal;color:#78e9d4}.coords{font:10px ui-monospace,monospace;color:#bbced0;margin-top:6px;letter-spacing:.05em}.view-pills{display:flex;align-items:flex-start;gap:6px}.view-pills span{background:#0c2937a6;border:1px solid #3c66729c;padding:8px 9px;border-radius:4px;color:#aad4dc;white-space:nowrap;font-size:9px;font-weight:700;letter-spacing:.08em}.view-bottom{position:absolute;bottom:22px;left:27px;right:27px;display:flex;align-items:end;justify-content:space-between;gap:12px;pointer-events:none}.depth-hud{display:flex;align-items:center;gap:9px;background:#102c3cbb;border-left:2px solid #6be3d6;padding:10px 13px}.depth-hud .chevron{font-size:24px;color:#77e8d5}.depth-hud small{font-size:8px;display:block;color:#91b6c0;letter-spacing:.12em}.depth-hud strong{display:block;font-size:21px;letter-spacing:-.04em;margin-top:3px}.depth-hud strong i{font-style:normal;font-size:11px;color:#9fb3ba}.view-hints{font-size:9px;letter-spacing:.09em;color:#bfd7d9;opacity:.85;padding-bottom:8px}.view-hints span{color:#5ccbbf}.view-buttons{display:flex;gap:4px;pointer-events:auto}.view-buttons button{background:#0b2632d9;border:1px solid #3a5a66;color:#9dbdc6;padding:9px 9px;font-size:9px;font-weight:750;letter-spacing:.06em}.view-buttons button:first-child{border-radius:4px 0 0 4px}.view-buttons button:last-child{border-radius:0 4px 4px 0}.view-buttons button.selected{background:#225958;color:#9affe8;border-color:#55b3a9}.right-header{margin-bottom:9px}.right-header h2{margin:6px 0 4px}.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:8px 0 5px}.stat{background:#112732;border:1px solid #1c3a44;border-radius:6px;padding:12px 10px 10px;min-width:0}.stat label{display:block;color:#85a7b3;font-size:8px;font-weight:800;letter-spacing:.08em}.stat strong{font:700 23px ui-monospace,SFMono-Regular,monospace;display:block;letter-spacing:-.07em;margin:8px 0 4px;white-space:nowrap}.stat strong small{font-size:12px;letter-spacing:0;color:#c0d8da}.stat>span{font-size:8px;letter-spacing:.07em;color:#879fa7;font-weight:750}.stat .positive{color:#6ee5ba}.chart{width:100%;height:112px;display:block;border-radius:4px;background:#0d2330;border:1px solid #1e3c48}.chart.bathy{height:119px}.route-progress{margin-bottom:7px}.progress-track{height:6px;background:#1d3b45;border-radius:6px;overflow:hidden}.progress-track>span{display:block;height:100%;width:46%;background:linear-gradient(90deg,#258b9a,#74edcf);border-radius:6px}.progress-meta{display:flex;justify-content:space-between;margin-top:8px;font-size:8px;color:#658f9d;font-weight:700}.mini-rows{background:#0c202a;border:1px solid #1b3440;border-radius:5px;padding:6px 11px}.mini-rows>div{display:flex;justify-content:space-between;padding:8px 1px;border-bottom:1px solid var(--line);font-size:10px;color:#8eaab4}.mini-rows>div:last-child{border-bottom:0}.mini-rows strong{color:#c8e1de;font:700 10px ui-monospace,monospace}.textbtn{border:0;background:none;color:#539d9c;font-size:8px;font-weight:750}.log{min-height:55px;max-height:120px;overflow:auto;color:#b8c9ce;font-family:ui-monospace,monospace;font-size:9px;scrollbar-width:thin}.log-item{display:flex;gap:6px;border-bottom:1px solid #18333d;padding:7px 2px;line-height:1.45}.log-item time{color:#628f9d;white-space:nowrap}.log-item.warn span{color:#edb67f}.log-item.bad span{color:#eb8c86}.right-foot{margin-top:auto;padding-top:10px}.mapkey{display:flex;align-items:center;justify-content:space-between;gap:3px;font-size:8px;color:#8eacb5}.mapkey i{display:inline-block;width:11px;height:3px;vertical-align:middle;margin-right:3px;background:#58dece}.mapkey .key-ship{background:#edb67d}.mapkey .key-trench{background:#4177a4}.reset{width:100%;margin-top:12px;color:#8db8be;background:transparent;border:1px solid #294653;border-radius:4px;padding:10px;font-size:9px;font-weight:750;letter-spacing:.09em}.reset:hover{border-color:#6dd8c8}.notification{position:absolute;top:105px;left:50%;transform:translateX(-50%) translateY(-15px);padding:10px 17px;background:#123e44e8;border:1px solid #4ac3bb;color:#d2f3ec;border-radius:6px;opacity:0;transition:opacity .2s,transform .2s;pointer-events:none;font-size:11px;font-weight:700;max-width:75%;text-align:center}.notification.visible{opacity:1;transform:translateX(-50%) translateY(0)}.modal{position:fixed;inset:0;background:#030f18c7;z-index:20;display:grid;place-items:center}.modal[hidden]{display:none}.modal-card{width:min(480px,92vw);background:#102c38;border:1px solid #387875;border-radius:10px;padding:30px;box-shadow:0 25px 90px #0009;position:relative}.modal-card h2{margin-top:0}.modal-card p{color:#abc7cb;line-height:1.7}.modal-close{position:absolute;right:13px;top:13px;background:transparent;color:#bad4dc;border:0;font-size:16px}kbd{background:#1f4855;border:1px solid #476976;border-radius:3px;padding:2px 5px}.viewport canvas{touch-action:none}@media(max-width:1400px){.shell{grid-template-columns:270px minmax(0,1fr) 290px}.left{padding:17px 15px}.right{padding:17px 12px}.view-hints{display:none}}@media(max-width:1030px){.shell{grid-template-columns:220px minmax(0,1fr)}.right{display:none}.left{padding:16px 12px}.mission-tag{display:none}.view-pills span:nth-child(2){display:none}}@media(max-width:670px){.topbar{padding:0 12px;height:57px}.shell{height:calc(100% - 57px);grid-template-columns:1fr}.left{position:absolute;z-index:7;bottom:0;left:0;right:0;height:153px;overflow:auto;border-right:0;border-top:1px solid var(--line);display:block;padding:9px 13px}.left>.eyebrow,.left>h2,.left>.muted,.left>.section-heading,.vessel-card,.left>.control,.compact-controls,.left>.sub-heading,.bottom-left{display:none}.mission-tabs{margin:0 0 8px}.action-group{margin:0}.top-clock{display:none}.brand{min-width:0}.brand small{font-size:7px}.state-pill{font-size:8px}.view-top{top:20px;left:18px;right:18px}.view-title{font-size:19px}.view-bottom{left:13px;right:13px;bottom:166px}.view-buttons button{font-size:8px;padding:7px}.depth-hud{padding:7px}.depth-hud strong{font-size:17px}.view-pills{display:none}}