:root{color-scheme:dark;--ink:#e7ecdf;--muted:#b5c1a9;--line:#657257;--panel:#242b20ed;--lime:#d8e7b7}
*{box-sizing:border-box}body{margin:0;background:#171818;color:var(--ink);font:14px Arial,Helvetica,sans-serif;overflow:hidden}button,meter{font:inherit}button{cursor:pointer;transition:background .15s,color .15s}button:focus-visible{outline:2px solid #e1f5ff;outline-offset:4px}[hidden]{display:none!important}.arena{height:100svh;min-height:740px;position:relative;isolation:isolate;overflow:hidden}.scene{position:absolute;inset:0;width:100%;height:100%;background:#202120}.vignette{position:absolute;inset:0;box-shadow:inset 0 0 160px #0006;pointer-events:none}
.top{position:absolute;left:42px;right:42px;top:31px;display:flex;justify-content:space-between;align-items:center;gap:15px}.brand{font-size:21px;font-weight:900;letter-spacing:3px;white-space:nowrap}.brand i{font-style:normal;color:#f34c40;margin:0 7px}.preview{font-size:12px;letter-spacing:1.5px;color:#c0c8b9;border:1px solid #5d605d;padding:8px 11px;margin-left:22px;vertical-align:middle;display:inline-block}.topright{display:flex;align-items:center;gap:12px}.text-button{border:1px solid #68705f;background:#20241dcc;color:#e8ecdf;padding:10px 13px;font-size:12px;touch-action:manipulation}.reset{color:#e8e9e1;background:#2225229c;border:1px solid #68705f;border-radius:50%;width:42px;height:42px;font-size:23px;touch-action:manipulation}
.stages{position:absolute;left:44px;top:125px;pointer-events:none}.eyebrow{font-size:12px;letter-spacing:2px;color:#c1cbb7;margin-bottom:14px}.stage-title{font-size:clamp(38px,4.5vw,64px);line-height:1;font-weight:800;letter-spacing:-3px;margin:0}.stage-title span{color:#f34d40}.stage-note{color:#c5ccbe;font-size:14px;line-height:1.65;margin-top:17px;width:290px;max-width:32vw}.run-badge{font-size:12px;color:#bfccb0;letter-spacing:1px;margin-top:22px;max-width:340px;line-height:1.5}
.telemetry{position:absolute;left:44px;top:350px;border-left:1px solid #68715d;padding-left:16px;pointer-events:none;min-width:150px}.telemetry small{font-size:12px;letter-spacing:1.5px;color:#bbc8ac;display:block;margin-bottom:5px}.telemetry b{font-size:26px;letter-spacing:-1px;font-weight:400;font-variant-numeric:tabular-nums}.telemetry em{font-size:12px;font-style:normal;color:#b8c3ad;letter-spacing:0;margin-left:6px}.telemetry .line{height:1px;background:#4d5940;margin:10px 0}.fuel-label{display:flex;justify-content:space-between;gap:18px;align-items:baseline;margin-top:16px;font-size:12px}.fuel-label small{margin:0}meter{width:150px;height:12px;accent-color:var(--lime)}meter::-webkit-meter-bar{background:#3b4232;border:0}meter::-webkit-meter-optimum-value{background:var(--lime)}
.bottom{position:absolute;bottom:40px;left:43px;display:flex;gap:280px;align-items:stretch}.controls{display:flex}.panel{background:linear-gradient(125deg,#292c27ee,#20231fe8);border:1px solid #5c625270;box-shadow:0 12px 35px #0003;backdrop-filter:blur(18px);padding:17px 19px}.panel-label{font-size:12px;color:#c6d1bb;letter-spacing:1px;display:flex;justify-content:space-between;gap:15px;align-items:center}.key{font-size:12px;letter-spacing:0;border:1px solid #737b65;border-radius:3px;padding:1px 4px;color:#d3d9c7;white-space:nowrap}.drive{width:300px;display:flex;flex-direction:column;justify-content:center}.ground-buttons{display:flex;gap:8px;margin-top:16px}.ground-buttons button{flex:1;min-height:48px;padding:12px 8px;font-size:13px;font-weight:700;white-space:nowrap;background:#343f2c;color:#e6efdb;border:1px solid #738563;touch-action:none;user-select:none}.ground-buttons .drive-button{background:var(--lime);color:#252d1e;border-color:var(--lime)}.vac-status{display:flex;justify-content:space-between;gap:10px;font-size:12px;color:#c4d1b7;margin:15px 0 8px}.drive meter{width:100%;height:10px}
.flight{text-align:center;width:320px}.flight>.panel-label{margin-bottom:12px}.flight-controls{display:flex;gap:15px;align-items:center;justify-content:space-between}.pad{display:grid;grid-template-columns:39px 39px 39px;grid-template-rows:34px 34px 34px;gap:4px;justify-content:center;flex-shrink:0}.pad button{color:#e3eadb;background:#41473a;border:1px solid #707b60;font-size:19px;touch-action:none;user-select:none}.pad button:first-child{font-size:14px;grid-column:2}.pad button:nth-child(2){grid-column:1;grid-row:2}.pad button:nth-child(3){grid-column:3;grid-row:2}.pad button:nth-child(4){grid-column:2;grid-row:3}.pad .core{grid-column:2;grid-row:2;color:#b1c6b4;font-size:17px;padding-top:6px}.pitch-controls{font-size:12px;color:#c7d3b9;line-height:1.8;min-width:130px}.pitch-controls>div{display:flex;gap:5px;margin:4px 0 7px}.pitch-controls button{font-size:12px;background:#333d2b;color:#e5ecd9;border:1px solid #637055;padding:7px 8px;touch-action:none;user-select:none}button[data-hold].active{background:#e0edca!important;color:#222a1c!important}.pitch-controls #assist{width:100%;font-size:12px;padding:6px;touch-action:manipulation}.pitch-controls #assist[aria-pressed=false]{color:#b9bfaf;background:#252b20}.flight small{color:#bdc9b2;font-size:12px;display:block;margin-top:11px}.legend{position:absolute;bottom:12px;left:45px;right:45px;display:flex;justify-content:space-between;gap:15px;color:#b9c5ad;font-size:12px;letter-spacing:.4px}
.result{position:absolute;top:43%;left:50%;transform:translate(-50%,-30%);background:#20261df2;border:1px solid #77876a;padding:26px 30px;width:390px;max-width:90vw;box-shadow:0 15px 60px #0006;backdrop-filter:blur(18px)}.result>span{color:#c5dbb0;font-size:12px;letter-spacing:2px}.result h2{font-size:34px;letter-spacing:-1px;margin:11px 0}.result p{font-size:14px;line-height:1.7;color:#d0d7c7}.result button{width:100%;padding:13px;background:var(--lime);color:#252d1e;border:0;font-size:14px;text-align:left;font-weight:bold}.result button span{float:right;font-weight:normal}
dialog{background:#242c20;color:#e9eddf;border:1px solid #7b8c6b;width:580px;max-width:calc(100% - 32px);padding:30px;box-shadow:0 20px 80px #0009}dialog::backdrop{background:#0009}dialog h2{font-size:28px;letter-spacing:-1px}dialog p{font-size:14px;line-height:1.7;color:#c8d3bd}dialog dl{display:grid;grid-template-columns:130px 1fr;gap:13px;font-size:14px;line-height:1.5}dialog dt{color:#dcebbd}dialog dd{margin:0}dialog button{background:var(--lime);color:#252d1e;border:0;padding:11px 20px;font-size:14px}#closeHelp{float:right;background:none;color:#e9eddf;font-size:28px;padding:0 3px}
@media(max-width:1100px) and (min-width:701px){.top{left:25px;right:25px}.preview{margin-left:12px}.stages{left:25px}.stage-title{font-size:46px}.telemetry{left:25px;top:330px}.bottom{left:25px;gap:80px}.drive{width:280px}.legend{left:25px;right:25px}}
@media(max-width:700px){body{overflow:auto}.arena{height:100svh;min-height:820px}.scene{height:69%;top:65px}.top{top:17px;left:16px;right:16px;gap:8px;align-items:flex-start}.top>div:first-child{display:flex;flex-wrap:wrap;max-width:48%;gap:5px}.brand{font-size:15px;letter-spacing:1px}.preview{font-size:12px;letter-spacing:.5px;border:0;padding:0;margin:0;color:#c1cdb4}.topright{gap:5px;flex-wrap:wrap;max-width:49%;justify-content:flex-end}.text-button{padding:7px;font-size:12px}.reset{height:30px;width:30px;font-size:20px}.stages{top:95px;left:17px;right:17px}.eyebrow{font-size:12px;letter-spacing:1px;margin-bottom:7px}.stage-title{font-size:29px;letter-spacing:-1px}.stage-note{font-size:14px;line-height:1.5;max-width:230px;width:230px;margin-top:7px}.run-badge{font-size:12px;margin-top:9px;max-width:230px}.telemetry{left:auto;top:210px;right:16px;border:0;padding:0;min-width:0;text-align:right}.telemetry b{font-size:20px}.telemetry small{font-size:12px;letter-spacing:.5px;margin-bottom:3px}.telemetry .line{margin:7px 0}.fuel-label{margin-top:9px;font-size:12px;gap:8px}.fuel-label small{font-size:12px}.telemetry meter{width:88px}.bottom{bottom:42px;left:12px;right:12px;gap:8px;align-items:stretch}.controls{flex:1;min-width:0}.panel{padding:10px}.drive{width:100%}.panel-label{font-size:12px;letter-spacing:.5px;gap:6px}.ground-buttons{flex-direction:column;gap:8px;margin-top:13px}.ground-buttons button{min-height:46px;font-size:12px;padding:10px 5px}.vac-status{font-size:12px;line-height:1.5;gap:6px;flex-wrap:wrap;margin:12px 0 5px}.flight{width:178px;flex-shrink:0}.flight>.panel-label{font-size:12px;margin-bottom:9px}.flight .key{display:none}.flight-controls{display:block}.pad{grid-template-columns:36px 36px 36px;grid-template-rows:33px 33px 33px;gap:3px}.pitch-controls{min-width:0;margin-top:7px;font-size:12px}.pitch-controls>span{display:none}.pitch-controls>div{justify-content:center;margin:0 0 5px}.pitch-controls button{padding:6px 11px}.pitch-controls #assist{font-size:12px;padding:5px}.flight small{display:none}.legend{left:15px;right:15px;bottom:12px;font-size:12px;letter-spacing:0}.legend span:first-child{font-size:0}.legend span:first-child:before{content:'Space Drive · ↑ Suction · ↓ Lift · ? Controls';font-size:12px}.legend span:last-child{display:none}.result{top:38%;padding:20px;width:340px}.result h2{font-size:28px}.result p{font-size:14px}dialog{padding:22px}dialog dl{grid-template-columns:95px 1fr;gap:12px}.scene text{font-size:14px}}
@media(prefers-reduced-motion:reduce){button{transition:none}}
@media(max-width:700px){.scene{top:205px;height:45%}.scene text{display:none}.pad button:first-child{padding:0;font-size:13px;white-space:nowrap}}

button[data-hold]{position:relative}button[data-hold].active{box-shadow:0 0 0 2px #d5e8bc55,inset 0 -3px 0 #89a56c}.pad button[data-hold=up]{font-size:18px;line-height:17px;padding:0}.lift-label{display:block;font-size:12px;line-height:13px}.pad button[data-hold=down]{font-size:14px}
.ground-buttons .drive-button{background:#343f2c;color:#e6efdb;border-color:#738563}

.scene{touch-action:none;outline:none;cursor:grab}.scene:active{cursor:grabbing}.scene:focus-visible{outline:1px solid #d8e7b7;outline-offset:-2px}.render-error{position:absolute;top:45%;left:30%;right:15%;padding:24px;background:#242b20;border:1px solid #a2b08c}.legend{pointer-events:none}
@media(max-width:700px){.scene{top:205px;height:45%}.render-error{left:20px;right:20px;font-size:14px}}
