:root{--paper:#fcfbf7;--paper-2:#f3f0e7;--tint:#dceaf2;--tint-2:#c4dcea;--buff:#e6dbbe;--ink:#0e2a3f;--ink-2:#3d5d72;--ink-3:#70899a;--rule:#cbd8e0;--mag:#c1046b;--mag-wash:#faeaf2;--amber:#a96200;--red:#9e1c16;--green:#1c6b58;--sans:"IBM Plex Sans", system-ui, sans-serif;--mono:"IBM Plex Mono", ui-monospace, monospace;--display:"Fraunces", Georgia, serif;--top:56px;--left:300px;--right:330px;--bottom:92px}*{box-sizing:border-box}html,body,#root{width:100%;height:100%;color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;background:#123a52;margin:0;font-size:14px;overflow:hidden}button,select,input{font:inherit;color:inherit}button{cursor:pointer;background:0 0;border:0;padding:0}.app{width:100%;height:100%;position:relative}.canvas-wrap{position:absolute;inset:0}.canvas-wrap canvas{outline:none;display:block}.lbl{font-family:var(--mono);letter-spacing:.14em;white-space:nowrap;color:var(--ink);pointer-events:none;-webkit-user-select:none;user-select:none;background:#fcfbf7eb;border-radius:2px;padding:3px 7px;font-size:10.5px;font-weight:600;box-shadow:0 1px #0e2a3f2e}.lbl span{color:var(--mag);margin-left:8px}.lbl-mag{color:var(--mag);border-left:3px solid var(--mag)}.lbl-muted{color:var(--ink-3);background:#fcfbf7b8}.zl{font-family:var(--mono);letter-spacing:.1em;color:#fcfbf78c;pointer-events:none;-webkit-user-select:none;user-select:none;white-space:nowrap;font-size:9.5px;font-weight:600}.zl-on{color:#fff;background:var(--mag);border-radius:2px;padding:2px 5px}.zl span{opacity:.9;margin-left:6px}.topbar{height:var(--top);background:var(--paper);border-bottom:1px solid var(--rule);z-index:20;align-items:center;gap:14px;padding:0 16px;display:flex;position:absolute;top:0;left:0;right:0}.wordmark{font-family:var(--display);letter-spacing:.01em;white-space:nowrap;align-items:baseline;gap:10px;font-size:22px;font-weight:700;display:flex}.wordmark small{font-family:var(--mono);letter-spacing:.16em;color:var(--ink-3);font-size:10px;font-weight:600}.wordmark .ar{color:var(--mag);font-family:Noto Naskh Arabic,serif;font-size:18px;font-weight:700}.spacer{flex:1}.clock{font-family:var(--mono);letter-spacing:.06em;min-width:72px;font-size:20px;font-weight:600}.clock small{letter-spacing:.16em;color:var(--ink-3);font-size:9.5px;display:block}.tide{font-family:var(--mono);letter-spacing:.1em;color:var(--ink-2);white-space:nowrap;align-items:center;gap:8px;font-size:11px;display:flex}.tide b{color:var(--ink)}.tide .arrow{background:var(--ink-2);width:36px;height:2px;transition:transform .6s;display:inline-block;position:relative}.tide .arrow:after{content:"";border:5px solid #0000;border-left:7px solid var(--ink-2);position:absolute;top:-4px;right:-1px}.transport{align-items:center;gap:6px;display:flex}.btn{font-family:var(--mono);letter-spacing:.12em;border:1px solid var(--rule);background:var(--paper);color:var(--ink);white-space:nowrap;border-radius:3px;padding:8px 12px;font-size:11px;font-weight:600;transition:background .15s,border-color .15s}.btn:hover{background:var(--paper-2)}.btn.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}.btn.mag{background:var(--mag);color:#fff;border-color:var(--mag)}.btn.mag:hover{background:#a3035a}.btn.play{min-width:86px}.speeds{border:1px solid var(--rule);border-radius:3px;display:flex;overflow:hidden}.speeds button{font-family:var(--mono);border-right:1px solid var(--rule);background:var(--paper);padding:8px 9px;font-size:11px;font-weight:600}.speeds button:last-child{border-right:0}.speeds button.on{background:var(--ink);color:var(--paper)}.panel{top:var(--top);bottom:var(--bottom);width:var(--left);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-right:1px solid var(--rule);z-index:15;scrollbar-width:thin;background:#fcfbf7f5;padding:14px 16px 24px;position:absolute;overflow-y:auto}.panel.right{width:var(--right);border-right:0;border-left:1px solid var(--rule);left:auto;right:0}.panel h3{font-family:var(--mono);letter-spacing:.18em;color:var(--ink-3);text-transform:uppercase;margin:18px 0 8px;font-size:10px;font-weight:600}.panel h3:first-child{margin-top:4px}.scen{text-align:left;border:1px solid var(--rule);background:var(--paper);border-radius:3px;width:100%;margin-bottom:6px;padding:9px 10px;display:block}.scen b{font-family:var(--display);font-size:14px;font-weight:600;display:block}.scen small{color:var(--ink-2);margin-top:2px;font-size:12px;line-height:1.35;display:block}.scen.on{border-color:var(--mag);background:var(--mag-wash)}.row{justify-content:space-between;align-items:center;gap:8px;margin:6px 0;display:flex}.row label{color:var(--ink-2);font-size:12.5px}.row .val{font-family:var(--mono);text-align:right;min-width:64px;font-size:11px;font-weight:600}input[type=range]{width:100%;accent-color:var(--mag)}.chips{flex-wrap:wrap;gap:6px;display:flex}.chip{font-family:var(--mono);letter-spacing:.1em;border:1px solid var(--rule);background:var(--paper);border-radius:3px;padding:6px 9px;font-size:10.5px;font-weight:600}.chip.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}.chip.mag.on{background:var(--mag);border-color:var(--mag)}.kpis{grid-template-columns:1fr 1fr;gap:8px;display:grid}.kpi{border:1px solid var(--rule);background:var(--paper);border-radius:3px;padding:10px 10px 8px}.kpi.wide{grid-column:1/-1}.kpi.mag{border-color:var(--mag);background:var(--mag-wash)}.kpi .n{font-family:var(--display);letter-spacing:-.01em;font-variant-numeric:tabular-nums;font-size:28px;font-weight:700;line-height:1}.kpi.mag .n{color:var(--mag)}.kpi .n small{font-family:var(--mono);color:var(--ink-3);letter-spacing:.08em;margin-left:4px;font-size:11px;font-weight:600}.kpi .l{font-family:var(--mono);letter-spacing:.16em;color:var(--ink-3);text-transform:uppercase;margin-top:6px;font-size:9.5px}.kpi .sub{color:var(--ink-2);margin-top:4px;font-size:12px}.kpi .sub b{color:var(--red)}.ladder{grid-template-columns:repeat(16,1fr);align-items:end;gap:3px;height:54px;display:grid}.ladder .z{background:var(--rule);border-radius:1px;min-height:6px;transition:height .3s,background .3s;position:relative}.ladder .z.on{background:var(--mag)}.ladder-lbl{font-family:var(--mono);color:var(--ink-3);text-align:center;grid-template-columns:repeat(16,1fr);gap:3px;margin-top:3px;font-size:8px;display:grid}.power{align-items:baseline;gap:10px;display:flex}.bar{background:var(--rule);border-radius:2px;height:8px;margin-top:6px;overflow:hidden}.bar i{background:var(--mag);height:100%;transition:width .3s;display:block}.bar.ink i{background:var(--ink-2)}.cmp{font-family:var(--mono);color:var(--ink-2);justify-content:space-between;margin-top:4px;font-size:10.5px;display:flex}.log{border-top:1px solid var(--rule);max-height:260px;font-size:12px;line-height:1.4;overflow-y:auto}.log .e{border-bottom:1px solid var(--paper-2);grid-template-columns:44px 1fr;gap:8px;padding:6px 0;display:grid}.log .t{font-family:var(--mono);color:var(--ink-3);padding-top:2px;font-size:10.5px;font-weight:600}.log .k-sonar{color:var(--mag)}.log .k-controller{color:var(--ink)}.log .k-zone{color:var(--ink-2)}.log .k-boat{color:var(--green)}.log .k-alarm,.log .k-fail{color:var(--red);font-weight:600}.log .k-info{color:var(--ink-3)}.timeline{height:var(--bottom);background:var(--paper);border-top:1px solid var(--rule);z-index:20;grid-template-columns:80px 1fr;gap:0;display:grid;position:absolute;bottom:0;left:0;right:0}.timeline .legend{font-family:var(--mono);letter-spacing:.14em;color:var(--ink-3);border-right:1px solid var(--rule);flex-direction:column;justify-content:space-between;padding:10px 12px;font-size:9.5px;display:flex}.timeline svg{cursor:crosshair;width:100%;height:100%;display:block}.tour{left:50%;bottom:calc(var(--bottom) + 18px);background:var(--paper);border:1px solid var(--rule);border-left:4px solid var(--mag);z-index:30;border-radius:4px;width:min(640px,100% - 32px);padding:16px 18px 14px;position:absolute;transform:translate(-50%);box-shadow:0 10px 40px #0e2a3f59}.tour h2{font-family:var(--display);margin:0 0 6px;font-size:22px;font-weight:700}.tour p{color:var(--ink-2);margin:0;font-size:14.5px;line-height:1.5}.tour .nav{align-items:center;gap:8px;margin-top:12px;display:flex}.tour .dots{gap:5px;margin:0 auto;display:flex}.tour .dots i{background:var(--rule);border-radius:50%;width:7px;height:7px}.tour .dots i.on{background:var(--mag)}.busy{z-index:60;color:var(--paper);font-family:var(--mono);letter-spacing:.16em;background:#0e2a3f8c;place-items:center;font-size:12px;display:grid;position:absolute;inset:0}.modal-bg{z-index:50;background:#0e2a3f8c;place-items:center;padding:20px;display:grid;position:absolute;inset:0}.modal{background:var(--paper);border-radius:4px;width:min(900px,100%);max-height:calc(100% - 40px);padding:24px 28px 28px;overflow-y:auto}.modal h2{font-family:var(--display);margin:0 0 4px;font-size:26px;font-weight:700}.modal .lead{color:var(--ink-2);margin:0 0 16px;line-height:1.5}.modal table{border-collapse:collapse;width:100%;font-size:13px}.modal th{text-align:left;font-family:var(--mono);letter-spacing:.14em;color:var(--ink-3);border-bottom:1px solid var(--ink);padding:8px 6px;font-size:10px}.modal td{border-bottom:1px solid var(--paper-2);vertical-align:top;padding:8px 6px;line-height:1.4}.modal td.m{font-family:var(--mono);white-space:nowrap;font-size:12px}.modal .eq{font-family:var(--mono);background:var(--paper-2);border-radius:3px;margin:10px 0 16px;padding:12px 14px;font-size:15px}.dayend{top:calc(var(--top) + 16px);background:var(--ink);color:var(--paper);font-family:var(--mono);letter-spacing:.12em;z-index:25;border-radius:3px;align-items:center;gap:12px;padding:10px 16px;font-size:11px;display:flex;position:absolute;left:50%;transform:translate(-50%)}.mobile-tabs{display:none}@media (max-width:900px){:root{--top:52px;--bottom:76px}.topbar{gap:8px;padding:0 10px}.wordmark{font-size:18px}.wordmark small,.tide,.hide-m{display:none}.clock{min-width:54px;font-size:16px}.panel{width:100%;bottom:var(--bottom);top:var(--top);padding-bottom:80px}.panel.right{width:100%}.mobile-tabs{bottom:calc(var(--bottom) + 10px);z-index:26;gap:6px;display:flex;position:absolute;left:10px}.tour{bottom:calc(var(--bottom) + 10px);padding:12px 14px}.tour h2{font-size:18px}.tour p{font-size:13.5px}.timeline{grid-template-columns:56px 1fr}}.show-m{display:none}@media (max-width:900px){.show-m{display:inline-block}}.short{display:none}@media (max-width:900px){.full{display:none}.short{display:inline}.clock small{display:none}.btn{padding:7px 9px}.btn.play{min-width:0}.wordmark .ar{display:none}}.splash{z-index:70;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#0e2a3f9e;place-items:center;padding:20px;display:grid;position:absolute;inset:0}.splash-card{background:var(--paper);border-top:6px solid var(--mag);width:min(720px,100%);padding:34px 38px 26px;box-shadow:0 30px 80px #0e2a3f80}.splash-kicker{font-family:var(--mono);letter-spacing:.18em;color:var(--mag);text-transform:uppercase;font-size:11px;font-weight:600}.splash-card h1{font-family:var(--display);letter-spacing:-.01em;margin:10px 0 14px;font-size:64px;font-weight:700;line-height:1}.splash-card h1 .ar{color:var(--mag);vertical-align:middle;margin-left:10px;font-family:Noto Naskh Arabic,serif;font-size:34px}.splash-lead{color:var(--ink-2);margin:0 0 22px;font-size:17px;line-height:1.5}.splash-actions{flex-wrap:wrap;gap:10px;display:flex}.splash-foot{font-family:var(--mono);letter-spacing:.12em;color:var(--ink-3);text-transform:uppercase;margin-top:18px;font-size:10.5px}@media (max-width:900px){.splash-card h1{font-size:44px}.splash-lead{font-size:15px}}.margins{grid-template-columns:repeat(16,1fr);gap:3px;margin-top:4px;display:grid}.margins i{background:var(--rule);border-radius:1px;height:4px;display:block}.margins i.ok{background:var(--green)}.margins i.thin{background:var(--amber)}.margins i.bad{background:var(--red)}@media (max-width:1180px){.wordmark small{display:none}}.topbar{overflow:hidden}a.btn{align-items:center;text-decoration:none;display:inline-flex}