:root{color-scheme:dark;--bg:#101f20;--bg2:#162829;--pane:#192c2d;--line:rgba(218,222,193,.13);--ink:#f0f0df;--muted:#9eafa8;--gold:#eec778;--lime:#d9e99e;--on:#b9edbf;font-family:Inter,"Segoe UI",system-ui,-apple-system,sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink)}button,select{font:inherit}button{cursor:pointer}button:focus-visible,select:focus-visible,canvas:focus-visible{outline:2px solid var(--gold);outline-offset:3px}.app-shell{display:flex;width:100%;height:100dvh;min-height:560px;overflow:hidden}.sidebar{width:380px;min-width:340px;background:linear-gradient(155deg,#1d3233,#101c1e 85%);display:flex;flex-direction:column;border-right:1px solid #34504a;z-index:3;box-shadow:12px 0 35px #15222350}.brand-head{padding:23px 26px 21px;display:flex;align-items:center;gap:17px;border-bottom:1px solid var(--line)}.symbol{height:43px;width:43px;display:grid;place-content:center;border:1px solid #82977d;color:#eaf0d6;letter-spacing:-3px;font-weight:800;font-size:24px;transform:rotate(-2deg)}.symbol span{color:var(--gold)}.supra,.eyebrow,.edition,.section-index,.metric-label,.graph-footer,.annotation-tag{font-size:9px;letter-spacing:1.6px;font-weight:700;color:#a1baa9}.product-mark{font-size:21px;letter-spacing:1.6px;font-weight:850;margin-top:2px}.product-mark span{font-weight:450;color:var(--gold)}.sidebar-scroll{overflow:auto;min-height:0;flex:1;padding:0 24px 28px;scrollbar-width:thin;scrollbar-color:#47605b transparent}.edition{padding-top:23px;display:flex;align-items:center;gap:9px;color:#c2d6bd}.edition-no{margin-left:auto;color:#728a82}.live-pip,.location-dot{width:7px;height:7px;background:#c3e7a7;border-radius:50%;display:inline-block;box-shadow:0 0 12px #a7e6a088}.introduction{padding:26px 0 29px}.introduction h1{font-family:Georgia,"Times New Roman",serif;font-size:39px;font-weight:400;letter-spacing:-1.3px;line-height:1.07;margin:15px 0 14px}.introduction h1 em{color:var(--gold);font-style:italic}.introduction p{line-height:1.63;color:var(--muted);font-size:12px;margin:0;max-width:310px}.panel{padding:17px 0 18px;border-top:1px solid var(--line)}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.section-header h2{font-size:13px;margin:0;font-weight:650;letter-spacing:.15px}.section-header #mode-pill{font-size:9px;letter-spacing:.8px;background:#344f45;color:#d3efc5;padding:6px 8px;border-radius:3px}.metric-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.metric{border:1px solid #334744;background:#ffffff04;padding:13px 12px 11px;min-width:0}.metric-label{letter-spacing:.5px;text-transform:uppercase;font-size:9px;color:#a9bab1}.metric-value{font-weight:550;font-size:26px;margin:6px 0 3px;letter-spacing:-.8px;white-space:nowrap;font-variant-numeric:tabular-nums}.metric-value small{font-size:12px;color:var(--gold);font-weight:550;margin-left:4px}.metric-annotation{font-size:10px;color:#81968f}.section-index{font-size:9px;color:#8b9e92}.control-row{display:flex;justify-content:space-between;gap:12px;align-items:center;min-height:62px;border-bottom:1px solid #2d403c}.control-row strong,.automation strong{font-size:12px;font-weight:640}.control-row small,.automation small{display:block;margin-top:5px;color:var(--muted);font-size:10px}.toggle{white-space:nowrap;background:transparent;color:var(--gold);border:1px solid #82704f;padding:9px 9px;font-size:9px;font-weight:700;letter-spacing:.35px;border-radius:3px;min-width:99px;transition:background .2s}.toggle:hover{background:#665b3c35}.toggle.active{color:#a8dfbc;border-color:#5f9479;background:#315c4530}.boat-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:14px}.outline-action{border:1px solid #495d55;padding:11px 3px;background:#28403b55;color:#d7e1d7;font-size:10px}.outline-action:hover{background:#385249}.automation{margin-top:16px;display:flex;gap:8px;justify-content:space-between;align-items:center;padding:16px 11px;background:linear-gradient(130deg,#e1bc75,#bd9553);color:#172623}.automation small{color:#48503f}.auto-button{background:#233b32;color:#e8eedb;font-size:10px;font-weight:800;padding:11px;border:0;white-space:nowrap}.auto-button span{font-size:13px;margin-left:4px}.auto-button:hover{background:#405e48}.graph-panel{padding-bottom:9px}.graph-panel canvas{display:block;width:100%;height:104px}.graph-footer{display:flex;justify-content:space-between;color:#8ca69a;font-weight:450;font-size:9px;letter-spacing:0}.log{margin-top:16px;border-left:2px solid var(--gold);padding:2px 0 3px 14px}.log p{font-size:12px;margin:9px 0;color:#d3ddcf;line-height:1.4}.log #status{font-size:10px;color:#8aa69b}.footer-controls{min-height:70px;padding:12px 24px;display:flex;align-items:center;gap:7px;border-top:1px solid var(--line);background:#102021}.transport{height:34px;min-width:34px;border:1px solid #4c615b;color:#d5ddce;background:transparent;font-size:20px;line-height:1}.transport:hover,.guide-button:hover{background:#2e4941}.footer-controls label{font-size:9px;letter-spacing:.8px;font-weight:700;color:#97afa4;display:flex;align-items:center;gap:6px;margin-left:8px}.footer-controls select{background:#233a36;border:1px solid #445a51;color:#eef2df;padding:8px 3px;font-size:11px}.guide-button{margin-left:auto;font-size:10px;white-space:nowrap;letter-spacing:.5px;background:none;color:var(--gold);padding:10px 5px;border:0}.stage{flex:1;position:relative;min-width:0;min-height:0;background:#b7c5ba;overflow:hidden}.stage canvas#scene{height:100%;width:100%;display:block;touch-action:none;cursor:grab}.stage canvas#scene:active{cursor:grabbing}.viewport-top,.viewport-bottom{position:absolute;left:31px;right:30px;display:flex;align-items:center;justify-content:space-between;pointer-events:none}.viewport-top{top:30px}.viewport-bottom{bottom:27px;align-items:end}.location-pill{font-size:10px;letter-spacing:1px;font-weight:800;background:#1c3132e9;color:#eef0e6;border:1px solid #63766e;padding:12px 15px;display:flex;align-items:center;gap:9px;box-shadow:0 7px 22px #0002}.location-pill span:last-child{color:#bac4b0;font-weight:400;margin-left:5px}.view-tools{display:flex;gap:6px;pointer-events:auto}.view-tools button{font-size:9px;letter-spacing:.6px;color:#f6f4e7;background:#203639d9;border:1px solid #536a63;padding:12px 13px}.view-tools button:hover{background:#39514b}.annotation{color:#f9f9eb;text-shadow:0 1px 6px #17201f98;max-width:550px}.annotation-tag{display:inline-block;background:#ddba78;color:#23352e;padding:7px 10px;font-size:9px;letter-spacing:1.15px}.annotation-title{font-size:21px;letter-spacing:2.2px;font-weight:780;margin:13px 0 7px}.annotation-title span,.annotation-desc span{color:var(--gold);margin:0 5px}.annotation-desc{font-size:11px;letter-spacing:.25px;color:#f0f1e6}.compass{text-align:center;color:#fff}.compass>span{font-size:9px;letter-spacing:1px}.compass-rosette{font-size:39px;line-height:1.3;text-shadow:0 0 5px #243a32}.compass small{font-size:8px;letter-spacing:.9px}.scene-alert{position:absolute;top:95px;left:50%;transform:translate(-50%,-10px);background:#263b36e5;border:1px solid #8f7650;color:#f4edd5;letter-spacing:.2px;font-size:12px;padding:12px 15px;max-width:350px;text-align:center;transition:opacity .25s,transform .25s;opacity:0;pointer-events:none}.scene-alert.show{opacity:1;transform:translate(-50%,0)}dialog{background:#1b302f;color:#e7ede1;border:1px solid #70847a;width:min(560px,calc(100vw - 32px));max-height:85vh;overflow:auto;padding:25px;box-shadow:0 25px 90px #0008}dialog::backdrop{background:#0b1c1ec7;backdrop-filter:blur(5px)}.modal-head{display:flex;justify-content:space-between;align-items:start}.modal-head h2{font:normal 31px Georgia,serif;margin:12px 0 16px}.close-modal{color:#f9ecd2;border:1px solid #59695c;background:none;width:33px;height:33px;font-size:23px}dialog ol{padding-left:22px}dialog li{font-size:13px;margin:14px 0;line-height:1.6;color:#c7d3ca}dialog li strong{color:#f5e9c9}dialog p{font-size:12px;line-height:1.7;color:#b5c6bb}.modal-foot{padding-top:15px;border-top:1px solid #465b51;color:#eccf99;font-size:11px}
@media(max-width:1000px){.sidebar{width:340px;min-width:320px}.sidebar-scroll{padding-left:19px;padding-right:19px}.brand-head{padding-left:19px}.annotation-title{font-size:16px}.annotation-desc{font-size:10px}}
@media(max-width:740px){.app-shell{flex-direction:column;overflow:auto;height:auto;min-height:100dvh}.sidebar{width:100%;min-width:0;order:2;flex:none}.sidebar-scroll{overflow:visible}.stage{height:55vh;min-height:390px;order:1;flex:none}.brand-head{padding:14px 17px}.edition{padding-top:14px}.introduction{padding:18px 0}.introduction h1{font-size:31px}.viewport-top{top:13px;left:12px;right:12px}.viewport-bottom{bottom:14px;left:13px;right:13px}.view-tools button{padding:9px 7px;font-size:8px}.location-pill{padding:9px;font-size:8px}.annotation-title{font-size:13px;letter-spacing:1.2px}.annotation-desc{max-width:290px;line-height:1.4}.compass{display:none}.footer-controls{position:sticky;bottom:0;z-index:4}}
