:root{color-scheme:dark;--bg:#0a151c;--pane:#101d24;--card:#162830;--edge:#293b42;--ink:#e3e8df;--muted:#88999b;--gold:#d5ad71;--teal:#45a99d;--rust:#c9755d;--font:'Segoe UI',Inter,system-ui,-apple-system,sans-serif}
*{box-sizing:border-box}body{margin:0;background:#081319;font-family:var(--font);color:var(--ink);font-size:13px}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:2px solid #e7c78f;outline-offset:3px}a{color:inherit} .shell{height:100dvh;min-height:650px;display:flex;flex-direction:column;overflow:hidden}
.masthead{height:70px;min-height:70px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;background:#0b171d;border-bottom:1px solid #26373d;gap:15px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}.brand-mark{position:relative;display:grid;place-items:center;font-weight:900;font-size:25px;color:#e3c48a;background:#17262a;border:1px solid #8a785b;width:39px;height:39px;letter-spacing:-3px}.brand-stripe{position:absolute;width:20px;height:2px;bottom:5px;right:4px;background:#4aa399;transform:rotate(-23deg)}
.brand-word{font-weight:850;letter-spacing:4px;font-size:18px}.brand-word small{display:block;font-size:8px;letter-spacing:1.5px;color:#8c9e9d;margin-top:2px;font-weight:700}.mast-center{display:flex;gap:15px;align-items:center}.tiny-label{font-size:10px;font-weight:700;letter-spacing:1.5px;color:#a1aeaa}.rule{height:15px;border-left:1px solid #415054}.head-right{display:flex;align-items:center;gap:12px;font-size:10px;color:#aebbb7;letter-spacing:1px;font-weight:700}.status-dot,.small-status-dot{width:7px;height:7px;background:#72c9a3;box-shadow:0 0 10px #66d6b073;border-radius:100%}.icon-btn{border:1px solid #38505a;background:#15232b;color:#dbe7dd;border-radius:5px;min-width:32px;min-height:32px;font-size:19px}
.layout{flex:1;min-height:0;display:grid;grid-template-columns:310px minmax(250px,1fr) 302px}.panel{background:var(--pane);overflow-y:auto;min-height:0;scrollbar-width:thin;scrollbar-color:#3b5357 transparent}.panel-left{border-right:1px solid #26383f;padding:24px 23px 22px}.panel-right{border-left:1px solid #26383f;padding:26px 22px 14px;background:#0f1c23}.eyebrow{display:flex;align-items:center;gap:8px;font-size:9px;color:var(--gold);font-weight:750;letter-spacing:1.1px;white-space:nowrap}.gold-dash{display:inline-block;width:17px;border-top:2px solid var(--gold)}.edition{margin-left:auto;color:#85958f;font-size:8px}
h1{margin:21px 0 11px;font-size:39px;line-height:.98;font-weight:800;letter-spacing:1.5px;color:#f0eee3}h1 span{display:block;color:var(--gold);font-size:15px;letter-spacing:3.1px;margin-top:8px;font-weight:700}.intro{font-size:12px;color:#9baca9;line-height:1.65;margin:0 0 20px}.intro em{font-style:normal;color:#e4c99d}.pane-divider{height:1px;background:#2d4249;margin:20px 0}.pane-divider.slim{margin:17px 0}.section-label{display:flex;align-items:center;gap:9px;font-size:10px;letter-spacing:1.3px;color:#c4d2cb;font-weight:800;margin-bottom:16px;white-space:nowrap}.section-label>span:first-child{color:#d0a967}.dotline{flex:1;border-top:1px dashed #3a4d51;margin-left:2px}.transport{display:flex;gap:8px}.play{flex:1;min-width:0;border:0;color:#172324;background:#dab784;border-radius:4px;padding:12px 10px;font-size:11px;letter-spacing:1.3px;font-weight:850;transition:background .15s}.play:hover{background:#f0cd94}.play #playGlyph{margin-right:7px;font-size:12px}.reset{min-width:40px}.statusline{display:flex;align-items:center;gap:7px;font-size:9px;letter-spacing:.6px;color:#809b95;margin-top:11px;font-weight:700}.statusline strong{margin-left:auto;color:#c5b9a4;font-variant-numeric:tabular-nums}.small-circle{display:inline-block;background:#8b8571;width:6px;height:6px;border-radius:50%}.small-circle.on{background:#71c7ae;box-shadow:0 0 8px #71c7ae}
.control-section{margin-top:20px}.control-top{display:flex;align-items:center;justify-content:space-between;gap:7px;margin-bottom:11px}.control-top label{font-size:10px;font-weight:750;letter-spacing:1px;color:#c4d4d2}.control-top .pl{display:block;color:#758e8f;font-size:9px;font-weight:450;letter-spacing:0;margin-top:3px}.control-top output{color:#dcb982;font-variant-numeric:tabular-nums;font-size:11px;font-weight:800;white-space:nowrap}.range-legend{display:flex;justify-content:space-between;color:#72898a;font-size:8px;margin-top:3px;letter-spacing:1px}input[type=range]{width:100%;margin:4px 0;height:5px;appearance:none;border-radius:6px;background:linear-gradient(90deg,#d6ac75 var(--percent,50%),#3b5056 var(--percent,50%));cursor:pointer}input[type=range]::-webkit-slider-thumb{appearance:none;width:14px;height:14px;border-radius:50%;background:#efe3cc;border:3px solid #c6975e;box-shadow:0 0 0 3px #101d24}input[type=range]::-moz-range-thumb{width:9px;height:9px;border-radius:50%;background:#efe3cc;border:3px solid #c6975e}
.direction-pair{display:grid;grid-template-columns:1fr 1fr;gap:6px}.direction-pair button{color:#a4b4ae;padding:10px 4px;background:#152630;border:1px solid #31464e;border-radius:3px;font-size:15px}.direction-pair button span{font-size:9px;font-weight:700;letter-spacing:.5px;margin-left:5px}.direction-pair button.selected{border-color:#d4aa70;background:#273633;color:#efcf99}.ship{margin-top:12px}.ship-swatch{display:inline-block;width:7px;height:7px;margin-right:7px;border-radius:2px}.ship-swatch.a{background:#c9755d}.ship-swatch.b{background:#52b7b0}.load-note{color:#789396;font-size:10px;line-height:1.6;margin:12px 0 2px}.scenario-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.scenario-grid button{padding:10px 4px;border:1px solid #3a5158;background:#172a32;color:#afc4bd;font-size:9px;font-weight:700;letter-spacing:.5px;border-radius:3px}.scenario-grid button:hover{background:#233b42;border-color:#bf9e6a}.scenario-grid button:last-child{grid-column:span 2}.identity-foot{border-top:1px solid #263e42;margin-top:22px;padding-top:14px;font-size:9px;color:#859f9d}.identity-foot strong{display:block;color:#c5b082;letter-spacing:1px;font-size:10px;margin-bottom:5px}.identity-foot span{line-height:1.6}
.viewport{position:relative;min-width:0;min-height:0;overflow:hidden;background:#a8bbb9}#stage{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab}#stage:active{cursor:grabbing}.viewport::before{content:"";position:absolute;pointer-events:none;z-index:2;inset:0;background:linear-gradient(180deg,#07182155,transparent 27%,transparent 76%,#09171ea1 100%)}.viewport-top{pointer-events:none;z-index:3;position:absolute;top:22px;left:26px;right:26px;display:flex;align-items:flex-start;gap:15px}.scene-index{font-size:21px;color:#e1ded0;font-weight:800;letter-spacing:1px}.scene-index span{font-size:13px;color:#c8d6cc99}.viewport-title{border-left:1px solid #d9dccb88;padding-left:15px}.viewport-title strong{display:block;font-size:12px;color:#f8f6e9;letter-spacing:2px}.viewport-title small{font-size:8px;letter-spacing:1.45px;color:#e2e6df}.webgl-chip{margin-left:auto;background:#193134ac;padding:8px 10px;border:1px solid #cce1d355;font-size:9px;font-weight:750;color:#ddf2e4;letter-spacing:.4px}.callout{pointer-events:none;position:absolute;z-index:2;display:flex;gap:10px;color:#fff;text-shadow:0 1px 8px #152a2c;align-items:center}.callout strong{display:block;font-size:11px;letter-spacing:1.1px}.callout small{display:block;font-size:8px;letter-spacing:1px;color:#e3e5d5;margin-top:4px}.callout .line-dot{width:8px;height:8px;border:2px solid #f3d3a4;border-radius:50%;box-shadow:0 0 0 6px #e4bc7b44}.callout.machine{left:15%;top:27%}.callout.rail{right:9%;top:57%}.viewport-footer{z-index:3;position:absolute;bottom:56px;left:26px;right:26px;display:flex;align-items:center;gap:10px}.camera-tools{display:flex;gap:5px;padding:5px;background:#13272bc9;border:1px solid #67817e88;backdrop-filter:blur(8px)}.camera-tools button{background:transparent;border:0;color:#bfcdc5;letter-spacing:.5px;padding:8px 9px;font-size:12px}.camera-tools button span{font-size:9px;font-weight:750;margin-left:4px}.camera-tools button.active{background:#d0b282;color:#1e3030}.camera-aux{margin-left:auto;display:flex;gap:6px}.camera-aux button{background:#1a3033be;border:1px solid #8ba69f66;color:#e6f2e8;font-size:20px;width:32px;height:32px}.nav-hint{pointer-events:none;position:absolute;bottom:22px;left:27px;color:#f0eeddc9;font-size:9px;letter-spacing:1px;z-index:3}.nav-hint span{padding:0 7px;color:#c9aa6a}.gl-error{position:absolute;inset:30% 10%;z-index:10;color:#fff;background:#5d292b;padding:30px;line-height:1.6;border:1px solid #d98b77;font-size:15px}
.right-heading{justify-content:space-between}.right-heading .small-status-dot{margin-right:-4px}.realtime{margin-left:auto;color:#8eb4a3;border:1px solid #476159;padding:5px 7px;font-size:8px;letter-spacing:1px}.big-readout{padding:17px 16px 13px;background:#172b31;border:1px solid #2f484a;margin-bottom:13px}.readout-head{display:flex;justify-content:space-between;color:#9db1ad;font-size:9px;letter-spacing:1px}.readout-head span{color:#d2b784;font-size:8px}.number{font-weight:750;display:flex;align-items:baseline;gap:9px;font-size:46px;line-height:1.3;letter-spacing:-2px;font-variant-numeric:tabular-nums}.number small{font-size:14px;letter-spacing:0;color:#b2c1b7;font-weight:450}.speedbar{background:#31494e;height:3px;overflow:hidden;margin:8px 0 4px}.speedbar div{width:0;background:#d0aa72;height:100%;transition:width .1s}.stats-two{display:grid;grid-template-columns:1fr 1fr;gap:10px}.stats-two>div{padding:11px 10px;background:#15242c;border:1px solid #2c3d43;min-width:0}.stats-two>div>span{display:block;color:#8b9e9b;font-size:8px;letter-spacing:.5px;white-space:nowrap}.stats-two strong{display:block;font-size:22px;font-weight:700;margin-top:7px;font-variant-numeric:tabular-nums;white-space:nowrap}.stats-two strong small{font-size:10px;color:#9eb0ac}.chart-wrap{margin:0 0 24px}.chart-wrap canvas{width:100%;height:122px;display:block;border:1px solid #2c4248;background:#102128}.chart-foot{display:flex;justify-content:space-between;font-size:8px;color:#7f9b9c;margin-top:6px;letter-spacing:.8px}.legend-line{color:#dab884}.mids{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:-5px}.mids>div{padding:7px 0}.mids small{color:#8ba3a0;font-size:8px;letter-spacing:.4px}.mids strong{display:block;margin-top:7px;font-size:20px}.mids strong span{font-size:11px;color:#9bb2ab}.rail-progress{margin-top:9px}.markers,.progress-key{display:flex;justify-content:space-between;color:#829995;font-size:9px}.trackline{height:6px;background:#49615d;position:relative;margin:12px 5px 13px}.trackline::before{content:"";position:absolute;inset:-3px 0;border-left:2px solid #a9b7a7;border-right:2px solid #a9b7a7}.progress-pin{position:absolute;top:50%;width:11px;height:11px;border:2px solid #f3f3d9;transform:translate(-50%,-50%);background:#bf755b;transition:left .08s}.progress-pin.b{background:#2fbaad}.progress-key span:first-child{color:#ce8a71}.progress-key span:last-child{color:#52baad}.knowledge{border-left:2px solid #bf9c67;padding-left:13px;margin-top:0}.knowledge-title{font-size:10px;letter-spacing:1px;color:#e8d4b0;font-weight:750}.knowledge p{font-size:11px;line-height:1.65;color:#acbcb7}.knowledge p.explain{color:#829b98;font-size:10px}.knowledge a{color:#d4b984;text-decoration:none;font-size:9px;letter-spacing:.4px;font-weight:750}.knowledge a:hover{text-decoration:underline}.system-footer{margin-top:22px;color:#647f80;font-size:8px;line-height:1.6;letter-spacing:.5px}.system-footer span{color:#adbeaa;margin-left:6px}
dialog{border:1px solid #597379;max-width:570px;width:calc(100% - 40px);background:#122329;color:#dce7df;box-shadow:0 20px 100px #000b;padding:0}dialog::backdrop{background:#031015b0;backdrop-filter:blur(4px)}.dialog-body{padding:25px 30px}.modal-head{display:flex;justify-content:space-between;letter-spacing:1.6px;font-size:10px;color:#d5b780;font-weight:750}.modal-head button{background:none;border:0;color:#e5d4b2;font-size:20px}.dialog-body h2{font-size:25px;letter-spacing:.2px}.dialog-body p{color:#aebebb;line-height:1.6}.key-grid{display:grid;grid-template-columns:125px 1fr;gap:8px;border-top:1px solid #31464c;border-bottom:1px solid #31464c;padding:16px 0}.key-grid span{color:#d5bb8e}.key-grid strong{font-weight:500}.dialog-body .disclaimer{border-left:2px solid #cd8a65;padding-left:12px}.dialog-body #gotIt{width:100%;padding:13px;background:#d8b481;border:0;font-size:11px;font-weight:850;letter-spacing:1px;color:#112024}
@media(max-width:1240px){.layout{grid-template-columns:278px minmax(300px,1fr) 274px}.panel-left{padding:20px 17px}.panel-right{padding:21px 16px}.callout{display:none}.camera-tools button span{display:none}}@media(max-width:950px){.shell{height:auto;min-height:100dvh;overflow:visible}.masthead{padding:0 14px}.mast-center{display:none}.layout{grid-template-columns:270px 1fr;grid-template-rows:minmax(490px,68dvh) auto}.panel-left{grid-row:1/3}.viewport{grid-column:2}.panel-right{grid-column:2;border-left:0;border-top:1px solid #2d474b;overflow:visible}.panel-left{overflow:visible}.panel-right{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 16px}.panel-right>.pane-divider,.panel-right>.section-label,.panel-right>.system-footer{grid-column:1/-1}.knowledge{grid-column:1/-1}.chart-wrap{margin:0}.big-readout{margin:0}.system-footer{padding-bottom:12px}}@media(max-width:650px){.layout{display:flex;flex-direction:column}.viewport{height:60dvh;min-height:420px;order:1}.panel-left{order:2;padding:22px}.panel-right{order:3;display:block;padding:22px}.masthead{height:58px;min-height:58px}.brand-word{font-size:15px}.brand-word small{font-size:7px}.head-right{font-size:0;gap:8px}.head-right .icon-btn{font-size:17px}.viewport-footer{left:13px;right:13px;bottom:42px}.viewport-top{top:12px;left:14px;right:14px}.webgl-chip{font-size:7px;padding:6px}.scene-index{font-size:16px}.viewport-title strong{font-size:9px}.viewport-title small{font-size:7px}.nav-hint{font-size:7px;left:14px;bottom:14px}.camera-tools button{padding:8px}.camera-aux button{width:30px;height:30px}.intro{max-width:500px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}