:root{color-scheme:dark;--ink:#142022;--panel:rgba(20,29,31,.9);--line:rgba(221,234,222,.17);--amber:#e6b451;--text:#f2f1e6;--muted:#acb8b3;--mono:Bahnschrift,'DIN Alternate',Consolas,monospace;font-family:'Segoe UI','Microsoft YaHei',sans-serif;color:var(--text);font-size:14px}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#647578}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;border:0;cursor:pointer;color:inherit;background:transparent}button:focus-visible{outline:2px solid var(--amber);outline-offset:5px}button:disabled{opacity:.4;cursor:default}[hidden]{display:none!important}#viewport{display:block;width:100%;height:100%;outline:none;touch-action:none}.screen-grain{position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 180px rgba(15,27,27,.09)}
.brand-bar{position:absolute;top:0;left:0;right:0;height:83px;padding:25px 36px;display:flex;justify-content:space-between;align-items:center;pointer-events:none;z-index:3}.brand{display:flex;gap:12px;align-items:center;color:var(--ink);text-decoration:none}.brand>svg{color:#243131}.brand>span{font:700 24px/1 var(--mono);letter-spacing:3px}.brand small{display:block;font:9px/1.3 var(--mono);letter-spacing:2px;margin-top:6px}.site-mark{display:flex;align-items:center;gap:10px;color:#344440;font:10px var(--mono);letter-spacing:1.1px}.site-mark>i,.panel-heading i{width:5px;height:5px;background:#667e67;display:inline-block}.site-mark .divider{opacity:.35;margin:0 7px}
.intro{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(222,227,216,.98) 0%,rgba(222,227,216,.96) 20%,rgba(216,222,211,.83) 32%,rgba(215,222,211,.25) 43%,transparent 56%);color:var(--ink)}.intro-copy{position:absolute;left:6.3%;top:50%;transform:translateY(-46%);width:410px;pointer-events:auto}.eyebrow{font:11px var(--mono);letter-spacing:2px;display:flex;align-items:center;gap:10px;margin:0 0 24px}.eyebrow>span{display:inline-block;width:20px;height:2px;background:#926622}.intro h1{font:500 clamp(46px,4.2vw,70px)/1 var(--mono);letter-spacing:-1.9px;margin:0 0 22px;white-space:nowrap}.intro h1 b{font-weight:700}.intro h1 em{font:11px var(--mono);letter-spacing:1px;vertical-align:top;margin:9px 0 0 7px;display:inline-block;border-top:1px solid;padding-top:5px}.intro h2{font-size:34px;line-height:1.4;letter-spacing:3px;font-weight:500;margin:0 0 20px}.intro-description{color:#50605b;font-size:13px;line-height:1.9;letter-spacing:.7px;margin:0 0 25px}.machine-specs{display:flex;gap:28px;margin:0 0 30px;padding-top:20px;border-top:1px solid rgba(35,49,42,.19);width:max-content}.machine-specs>div{display:flex;flex-direction:column;gap:8px}.machine-specs strong{font:26px/1 var(--mono);letter-spacing:-.5px}.machine-specs small{font:10px var(--mono);margin-left:4px;letter-spacing:0}.machine-specs span{font-size:10px;letter-spacing:1px;color:#63726b}.primary-button{background:var(--amber);color:#172222;display:flex;justify-content:space-between;align-items:center;gap:50px;width:278px;padding:17px 21px;font-size:14px;font-weight:600;letter-spacing:1px;border-radius:2px;box-shadow:0 3px 0 rgba(91,73,27,.18);transition:background .15s,transform .15s}.primary-button:hover{background:#f6c96b;transform:translateY(-1px)}.primary-button>span{font-size:23px;font-weight:400;line-height:1}.text-button{font-size:12px;letter-spacing:1px;padding:17px 0;display:flex;justify-content:space-between;width:278px;color:#44584f}.text-button:hover{color:#000}.text-button span{font-size:20px;line-height:.6}.intro-note{font-size:10px;letter-spacing:.6px;color:#64746b;display:flex;align-items:center;gap:7px;margin:14px 0 0}.tiny-square{width:4px;height:4px;background:currentColor;display:inline-block}.intro-caption{position:absolute;bottom:105px;right:5%;font:10px var(--mono);letter-spacing:2px;text-align:right;color:#283936}.intro-caption>span{font-size:14px;letter-spacing:1px}.intro-caption>i{display:inline-block;width:27px;height:1px;background:currentColor;vertical-align:middle;margin:0 12px;opacity:.5}.intro-caption small{display:block;margin-top:10px;font:10px 'Microsoft YaHei',sans-serif;letter-spacing:2px;opacity:.65}.intro-footer{position:absolute;bottom:25px;left:36px;right:36px;display:flex;justify-content:space-between;border-top:1px solid rgba(55,67,56,.19);padding-top:15px;font:10px var(--mono);letter-spacing:1.6px;color:#475c50}.intro-footer i{display:inline-block;width:4px;height:4px;margin:0 8px;background:#64806f}
.loading-screen{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;background:#dce1d6;color:var(--ink);z-index:4}.loading-glyph{font:700 92px/.9 var(--mono);position:relative;letter-spacing:-4px;margin-bottom:27px}.loading-glyph span{font:11px var(--mono);letter-spacing:2px;position:absolute;top:0;right:-31px}.loading-screen p{font-size:12px;letter-spacing:2px}.loading-screen small{font-size:10px;color:#708172;margin-top:15px}.loading-track{width:220px;height:2px;background:#b3bfaf}.loading-track>div{height:100%;width:4%;background:#976d2d;transition:width .3s}
#hud{position:absolute;inset:0;pointer-events:none}.panel{background:var(--panel);border:1px solid rgba(241,245,232,.12);box-shadow:0 6px 28px rgba(17,27,21,.1);border-radius:3px;backdrop-filter:blur(12px)}.telemetry{position:absolute;top:94px;left:34px;width:267px;padding:15px 17px 13px}.telemetry-top{display:flex;align-items:center;gap:7px;font:10px var(--mono);letter-spacing:1px;color:#c7d6c3}.engine-dot{width:6px;height:6px;border-radius:50%;background:#89847b}.engine-dot.running{background:#9dc297;box-shadow:0 0 8px rgba(168,222,159,.18)}.telemetry-top button{pointer-events:auto;margin:-6px -6px -6px auto;font:17px var(--mono);opacity:.75;display:flex;align-items:center;gap:7px;padding:5px}.telemetry-top button:hover{color:var(--amber);opacity:1}.telemetry-values{display:flex;align-items:baseline;justify-content:space-between;margin-top:15px}.telemetry-values>div{display:flex;flex-direction:column;gap:6px}.telemetry-values strong{font:24px/1 var(--mono);font-variant-numeric:tabular-nums;letter-spacing:.1px}.telemetry-values .speed-value strong{font-size:39px}.telemetry-values small{font:9px var(--mono);letter-spacing:1px;color:var(--muted)}.rpm-track{height:2px;background:#3c4848;margin:15px 0 11px}.rpm-track>div{height:100%;width:0;background:#cabb80;transition:width .2s}.telemetry-label{font:9px var(--mono);display:flex;justify-content:space-between;color:#92a29a;letter-spacing:1px}.task{position:absolute;right:34px;top:94px;width:286px;padding:17px 18px 0}.panel-heading{display:flex;justify-content:space-between;font-size:10px;letter-spacing:1px;color:var(--muted);gap:10px}.panel-heading span{display:flex;align-items:center;gap:7px}.panel-heading strong{color:#d1c998;font:10px var(--mono);letter-spacing:1px}.panel-heading i{background:var(--amber)}.task h3{font-size:15px;font-weight:500;margin:18px 0 10px;letter-spacing:.3px}.task p{font-size:10px;line-height:1.6;color:var(--muted);margin:0 0 20px}.task-track{height:2px;background:#3b4742;margin:0 -18px}.task-track>div{height:100%;width:14%;background:var(--amber);transition:width .3s}.view-controls{position:absolute;top:258px;left:34px;display:flex;gap:5px;pointer-events:auto}.view-controls button{display:flex;align-items:center;gap:7px;background:var(--panel);border:1px solid rgba(240,243,230,.12);height:35px;padding:0 10px;border-radius:3px;font-size:11px;color:#d7ded3}.view-controls button:hover,.view-controls button[aria-pressed=true]{color:var(--amber);border-color:#bda670}.view-controls svg{height:15px;width:15px;stroke:currentColor;fill:none;stroke-width:1.3}.view-controls kbd{margin-left:5px}kbd{display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(198,211,196,.29);border-bottom-width:2px;border-radius:3px;min-width:20px;height:21px;padding:1px 4px;font:10px var(--mono);color:#dae0d4;line-height:1}.telemetry kbd{height:17px;min-width:16px;font-size:9px;opacity:.6}
.drive-footer{position:absolute;bottom:0;left:0;right:0;padding:0 35px 24px;background:linear-gradient(0deg,rgba(12,21,23,.85),rgba(12,21,23,.4) 60%,transparent);pointer-events:none}.footer-top{display:flex;justify-content:space-between;padding:20px 0 14px;color:#e0e5d6;font-size:10px;letter-spacing:.7px;text-shadow:0 1px 4px #152328}.footer-top>span:last-child{font:9px var(--mono);letter-spacing:1.5px;color:#c4d0bc}.footer-top b{font-weight:400;margin-left:20px;letter-spacing:.5px;opacity:.6}.footer-top .tiny-square{margin-right:6px;background:#a2b989}.key-guide{display:flex;align-items:center;gap:28px;border-top:1px solid var(--line);padding-top:15px}.key-guide>span{display:flex;align-items:center;gap:4px;font-size:11px;letter-spacing:.3px;color:#c6cfc2}.key-guide kbd:last-of-type{margin-right:5px}.key-guide .guide-menu{margin-left:auto}.joint-readout{position:absolute;right:35px;bottom:118px;display:flex;gap:18px;font-size:10px;color:#e0e4d8;text-shadow:0 1px 5px #132223}.joint-readout span{display:flex;gap:9px}.joint-readout b{font:12px var(--mono);min-width:32px;color:#f2d699;font-weight:400}.status-message{position:absolute;left:50%;bottom:145px;transform:translateX(-50%) translateY(4px);background:rgba(26,34,33,.91);border-left:2px solid var(--amber);padding:12px 22px;color:#f2d390;letter-spacing:1px;font-size:12px;opacity:0;transition:opacity .15s,transform .15s}.status-message.visible{opacity:1;transform:translateX(-50%) translateY(0)}#reticle{position:absolute;left:50%;top:50%;display:none;width:9px;height:9px;border:1px solid rgba(246,243,209,.6);border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 2px rgba(18,29,30,.5)}.pointer-locked #reticle{display:block}.stick-panel{position:absolute;left:34px;bottom:127px;padding:14px;width:272px;pointer-events:auto}.stick-pads{display:flex;justify-content:space-between;margin-top:13px;gap:14px}.stick-pads>div>span{font-size:9px;letter-spacing:.4px;color:var(--muted)}.stick-pad{position:relative;margin-top:9px;width:111px;height:111px;border:1px solid #5b675c;border-radius:50%;touch-action:none;cursor:grab;background:linear-gradient(90deg,transparent 49.5%,rgba(163,181,153,.14) 49.5%,rgba(163,181,153,.14) 50.5%,transparent 50.5%),linear-gradient(0deg,transparent 49.5%,rgba(163,181,153,.14) 49.5%,rgba(163,181,153,.14) 50.5%,transparent 50.5%)}.stick-pad i{position:absolute;width:17px;height:17px;left:calc(50% - 8.5px);top:calc(50% - 8.5px);border-radius:50%;background:var(--amber);box-shadow:0 2px 5px #101b1d;border:2px solid #f5d797;pointer-events:none}.stick-pad small{position:absolute;font-size:8px;color:#acb7a5;pointer-events:none}.stick-pad .north{left:50%;top:5px;transform:translateX(-50%)}.stick-pad .south{left:50%;bottom:5px;transform:translateX(-50%)}.stick-pad .west{left:4px;top:calc(50% - 5px)}.stick-pad .east{right:4px;top:calc(50% - 5px)}
.modal-shade{position:absolute;inset:0;z-index:10;display:flex;align-items:center;justify-content:center;background:rgba(11,20,23,.52);backdrop-filter:blur(8px)}.modal{background:#1b282a;border:1px solid #526058;padding:42px 45px;border-radius:4px;box-shadow:0 24px 90px rgba(4,12,13,.3);max-width:90vw}.modal .eyebrow{color:#c3ad7e;font-size:10px;margin-bottom:17px}.modal h2{font-size:28px;font-weight:400;letter-spacing:1px;margin:0 0 20px}.modal p{font-size:13px;line-height:1.9;color:#b4c0b7}.pause-modal{width:386px}.pause-modal .primary-button{margin-top:30px;width:100%}.pause-modal>small{display:block;text-align:center;margin-top:18px;font-size:10px;color:#748e87}.help-modal{width:735px;padding:35px 38px}.help-heading{display:flex;justify-content:space-between;align-items:flex-start}.close-button{font:30px/1 var(--mono);padding:0 0 15px 15px;color:#a8b9ad}.close-button:hover{color:var(--amber)}.help-columns{display:grid;grid-template-columns:1fr 1fr;gap:42px;margin-top:8px}.help-columns h3{font-size:12px;font-weight:500;letter-spacing:1px;color:#e4d09b;margin:13px 0 16px}.help-columns p{font-size:12px;margin:9px 0;display:flex;align-items:center;gap:16px}.help-columns kbd{min-width:66px;height:26px;font-size:11px}.help-columns .muted{font-size:10px;margin-top:20px;line-height:1.9;display:block;color:#8fa79b}.help-note{border-top:1px solid #41524c;font-size:11px;line-height:1.9;color:#c5ceb9;margin-top:24px;padding-top:20px}.modal .scope-note{font-size:10px;color:#7f968b;margin-top:16px}.modal .muted{color:#92a79d}
@media(min-width:1700px){.intro-copy{width:450px}.intro h2{font-size:40px}.intro-description{font-size:14px}.machine-specs{gap:37px}.primary-button,.text-button{width:308px}.intro-copy .eyebrow{margin-bottom:30px}}
@media(max-height:760px){.intro-copy{transform:translateY(-42%)}.intro h1{font-size:49px;margin-bottom:15px}.intro h2{font-size:28px;margin-bottom:13px}.eyebrow{margin-bottom:18px}.intro-description{margin-bottom:17px}.machine-specs{margin-bottom:20px;padding-top:16px}.intro-note{margin-top:4px}.intro-caption{bottom:82px}.brand-bar{height:69px;padding-top:18px}.telemetry,.task{top:78px}.view-controls{top:244px}.help-modal{padding:25px 32px}.help-columns{gap:30px}.help-columns p{margin:5px 0}.help-note{margin-top:14px}}
@media(max-width:1050px){.brand-bar{padding-left:24px;padding-right:24px}.site-mark{font-size:8px}.intro-copy{left:5%;width:330px}.intro h1{font-size:48px}.intro h2{font-size:29px}.intro-caption{right:3%;font-size:8px}.intro-caption>span{font-size:12px}.machine-specs{gap:22px}.telemetry{left:24px;width:241px}.view-controls{left:24px}.task{right:24px;width:262px}.key-guide{gap:13px}.key-guide>span{font-size:10px}.drive-footer{padding-left:24px;padding-right:24px}.joint-readout{right:24px}.stick-panel{left:24px}}
@media(max-width:720px){.site-mark{display:none}.intro{background:linear-gradient(90deg,rgba(221,226,213,.98),rgba(221,226,213,.8) 65%,rgba(221,226,213,.12))}.intro-copy{left:7%}.intro-caption{display:none}.task{width:210px;padding:13px 13px 0}.task-track{margin:0 -13px}.task h3{font-size:12px}.task p{font-size:9px}.telemetry{width:213px;padding:13px}.telemetry-values .speed-value strong{font-size:31px}.telemetry-values strong{font-size:21px}.view-controls{top:239px}.key-guide{flex-wrap:wrap;gap:8px 12px}.key-guide .guide-menu{margin-left:0}.drive-footer{padding-bottom:15px}.footer-top>span:last-child{display:none}.joint-readout{bottom:125px;gap:10px}.joint-readout span{font-size:9px;gap:4px}.help-columns{gap:18px}.help-modal{padding:24px;max-height:92vh;overflow:auto}.help-columns p{font-size:10px;gap:8px}.help-columns kbd{min-width:52px}.modal h2{font-size:24px}}