:root{color-scheme:dark;--cyan:#65e8ff;--aqua:#2db6db;--muted:#8296ad;--white:#f0f9ff;--card:rgba(8,20,36,.9);--line:rgba(119,176,213,.17);font-family:Inter,"Segoe UI",Arial,sans-serif}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#050c17;color:var(--white);font-size:12px}button,input{font:inherit}button{cursor:pointer}#viewport{position:fixed;inset:0;display:block;width:100%;height:100%;touch-action:none;cursor:grab}#viewport:active{cursor:grabbing}.noise-overlay{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 47% 46%,transparent 32%,rgba(2,8,19,.55) 97%),linear-gradient(90deg,rgba(4,15,30,.65),transparent 27%,transparent 70%,rgba(2,12,22,.58));z-index:1}.noise-overlay:after{content:"";position:absolute;inset:0;opacity:.045;background:repeating-linear-gradient(0deg,#fff 0,#fff 1px,transparent 1px,transparent 4px)}.reticle{position:absolute;inset:0;pointer-events:none;z-index:1}.reticle i{position:absolute;width:17px;height:17px;border-color:rgba(98,223,255,.35);border-style:solid}.reticle i:first-child{top:118px;left:372px;border-width:1px 0 0 1px}.reticle i:nth-child(2){top:118px;right:318px;border-width:1px 1px 0 0}.reticle i:nth-child(3){bottom:82px;left:372px;border-width:0 0 1px 1px}.reticle i:nth-child(4){bottom:82px;right:318px;border-width:0 1px 1px 0}.app{position:relative;z-index:2;pointer-events:none;height:100%}.app button,.app input,.panel,.inspector,.help-modal{pointer-events:auto}.topbar{height:74px;background:linear-gradient(90deg,rgba(4,14,27,.97),rgba(5,16,28,.72));border-bottom:1px solid var(--line);padding:0 27px;display:flex;align-items:center;justify-content:space-between;position:relative}.brand{display:flex;align-items:center;gap:12px;min-width:260px}.brand-mark{border:1px solid #31849e;width:34px;height:34px;display:grid;place-items:center;color:var(--cyan);font-size:27px;transform:rotate(45deg);box-shadow:0 0 20px #1d809228 inset}.brand-mark span{transform:rotate(-45deg)}.brand strong{font-size:14px;letter-spacing:2.3px;font-weight:800}.brand strong span{color:var(--cyan)}.brand small{font-size:8px;letter-spacing:2.3px;display:block;color:#70849b;margin-top:6px}.app-title{position:absolute;left:50%;transform:translateX(-50%);text-align:center}.eyebrow{font-size:9px;letter-spacing:1.9px;font-weight:700;color:#63abc5}.app-title strong{display:block;font-size:18px;letter-spacing:3px;margin-top:5px;font-weight:780;white-space:nowrap}.app-title em{font-style:normal;color:var(--cyan);font-weight:300}.rev{position:absolute;top:20px;left:calc(100% + 17px);color:#5f7387;font-size:8px;white-space:nowrap}.top-actions{display:flex;align-items:center;gap:10px}.live{display:flex;align-items:center;gap:9px;color:#79c6d4;font-size:9px;letter-spacing:1.4px;margin-right:14px}.live b{display:inline-block;width:6px;height:6px;border-radius:50%;background:#67ffce;box-shadow:0 0 12px #5ef5b7}.icon-btn{background:#0c2034;border:1px solid #27435a;color:#b5c7d9;width:32px;height:32px;border-radius:5px;font-size:17px}.icon-btn:hover{border-color:var(--cyan);color:var(--cyan)}.panel{position:absolute;top:90px;bottom:86px;background:var(--card);border:1px solid var(--line);box-shadow:0 8px 35px #0003;backdrop-filter:blur(14px)}.controls{left:17px;width:322px;overflow:auto;scrollbar-width:thin;scrollbar-color:#31526a transparent;padding:18px 20px}.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.section-heading h1{font-size:35px;line-height:1;letter-spacing:5px;margin:10px 0 7px;font-weight:750}.section-heading p{color:#90acc0;font-size:9px;letter-spacing:1.4px;margin:0}.status-indicator{font-size:8px;color:#53e6c9;background:#103d41;padding:7px;border:1px solid #265d65;letter-spacing:1px}.schematic{height:107px;display:flex;align-items:center;gap:20px;background:linear-gradient(115deg,#12283a,#091928);border:1px solid #23415c;padding:12px;margin-bottom:20px;position:relative;overflow:hidden}.schematic:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0,transparent 20px,#5aa4be09 21px);pointer-events:none}.schematic-disc{width:83px;height:83px;position:relative;flex:none}.orbit{position:absolute;left:50%;top:50%;border:1px solid #3ab4db;border-radius:50%;transform:translate(-50%,-50%)}.orbit-a{width:80px;height:80px;border-style:dashed;animation:rot 26s linear infinite}.orbit-b{width:56px;height:56px;border-color:#5092d8;border-width:2px;animation:rot 8s linear infinite reverse}.orbit-c{width:38px;height:38px;border-color:#92a4c6;border-style:dotted}.core-dot{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:12px;height:12px;border-radius:50%;background:#7ff3ff;box-shadow:0 0 12px #37c8f5}.angle{position:absolute;background:#5ae1ee;width:5px;height:5px;border-radius:50%;box-shadow:0 0 8px #5ae1ee}.a1{top:2px;left:37px}.a2{bottom:16px;left:3px}.a3{right:5px;top:16px}@keyframes rot{to{transform:translate(-50%,-50%) rotate(360deg)}}.schematic-copy{display:flex;flex-direction:column;gap:7px;color:#92a9be;font-size:9px}.schematic-copy strong{color:#cfecf7;font-size:10px;letter-spacing:1.2px;margin-bottom:4px}.section-label{display:flex;align-items:center;gap:10px;font-weight:720;letter-spacing:1.3px;font-size:9px;color:#cfdeed;padding:8px 0 14px;border-top:1px solid #254056}.section-label span{background:#14384b;color:var(--cyan);padding:5px;font-size:9px}.section-label b{margin-left:auto;color:#547e91;font-size:8px;font-weight:500}.slider-field{margin-bottom:13px}.slider-field>div:first-child{display:flex;justify-content:space-between;align-items:center}.slider-field label{color:#b8cedc;font-size:11px}.slider-field output{font-variant-numeric:tabular-nums;color:#67dfff;font-weight:700;font-size:11px}.slider-field input{width:100%;margin:11px 0 4px;accent-color:#4ac4e7;cursor:pointer;height:3px;display:block}.range-ends{display:flex;justify-content:space-between;color:#587385;font-size:8px;letter-spacing:.6px}.slider-field.compact{margin-bottom:20px}.toggles{display:grid;grid-template-columns:1fr;gap:10px;margin:0 0 16px}.toggle{display:flex;align-items:center;gap:10px;font-size:11px;color:#afc8d8;cursor:pointer}.toggle input{position:absolute;opacity:0}.switch{height:16px;width:29px;display:inline-block;border-radius:15px;border:1px solid #41647b;background:#24364c;position:relative}.switch:after{content:"";position:absolute;top:2px;left:2px;width:10px;height:10px;border-radius:50%;background:#60778a;transition:transform .15s}.toggle input:checked+.switch{background:#13647a;border-color:#40b8d9}.toggle input:checked+.switch:after{transform:translateX(13px);background:#7beaff}.control-actions{display:flex;gap:8px;margin-bottom:10px}.primary-btn,.secondary-btn,.emergency{height:37px;border-radius:3px;font-size:10px;letter-spacing:1px;font-weight:750}.primary-btn{flex:1;background:linear-gradient(90deg,#279aba,#5ac9df);color:#041a29;border:0}.primary-btn span{font-size:13px;margin-right:5px}.secondary-btn{width:97px;color:#bedbe7;border:1px solid #3d647b;background:#142c3c}.emergency{display:flex;justify-content:space-between;align-items:center;padding:0 13px;width:100%;background:#2b1c24;border:1px solid #944e56;color:#f5b8b4}.emergency:hover{background:#46232c}.tiny-arrow{font-size:16px}.telemetry{right:17px;width:283px;padding:18px 17px;display:flex;flex-direction:column;gap:0;overflow:auto;scrollbar-width:thin}.telemetry-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:19px}.dot-3{color:#658ea0;letter-spacing:2px}.data-heading{font-size:10px;color:#9fb9cf;letter-spacing:1.6px}.data-heading small{color:#456779;font-size:8px}.big-value{font-size:50px;line-height:1.2;letter-spacing:-1px;color:#efffff;font-weight:650;font-variant-numeric:tabular-nums;margin:5px 0 4px;text-shadow:0 0 21px #4ccee133}.big-value sup{color:#5ce1ea;font-size:18px;vertical-align:top;margin:12px 0 0 4px;display:inline-block}.signal-chart{background:linear-gradient(#0c2534,#0b1c2b);border:1px solid #1d4056;margin:0 0 17px;padding:4px 8px 7px}.signal-chart canvas{width:100%;height:97px;display:block}.chart-bottom{border-top:1px solid #254154;padding-top:7px;display:flex;justify-content:space-between;font-size:8px;letter-spacing:.6px;color:#7199aa}.chart-bottom b{color:#54d5a8;font-size:8px;letter-spacing:1px}.readings>div{display:flex;align-items:center;justify-content:space-between;min-height:37px;border-top:1px solid #20394b}.readings span{font-size:9px;color:#859fb4;letter-spacing:.5px}.readings strong{font-size:13px;letter-spacing:.5px;font-variant-numeric:tabular-nums}.readings strong small{font-size:8px;font-weight:500;color:#7f98a7}.diagnostic-box{padding:12px;background:#0b2431;border:1px solid #1d4456;margin-top:18px}.diag-head{font-size:9px;letter-spacing:1px;color:#77cde0}.progress{height:4px;background:#153a4c;margin:12px 0 9px}.progress i{display:block;height:100%;width:64%;background:linear-gradient(90deg,#257d9d,#6cf8df);box-shadow:0 0 7px #3bf5e799}.diag-copy{display:flex;justify-content:space-between;color:#7da0b3;font-size:8px;letter-spacing:1px}.diag-copy strong{color:#77f3cb}.export-btn{min-height:39px;margin-top:auto;background:transparent;border:1px solid #2f6078;color:#7ecfe4;font-size:9px;font-weight:700;letter-spacing:1.2px}.export-btn span{float:right;margin-right:8px;color:#5c7e91}.view-hud{position:absolute;left:365px;top:97px;font-size:10px;color:#91b8c8;letter-spacing:1px}.view-hud .cross{color:#58d3ed;margin-right:5px;font-size:17px}.delimiter{color:#407386;margin:0 7px}.view-hud .hint{display:block;margin:8px 0 0 29px;color:#557f93;font-size:8px}.view-hud .hint b{margin:0 7px;color:#2a6378}.bottom-bar{position:absolute;bottom:14px;left:17px;right:17px;height:54px;border:1px solid #29465c;background:rgba(7,20,34,.9);display:flex;align-items:center;justify-content:space-between;padding:6px 11px;gap:12px}.camera-controls{display:flex;gap:4px}.camera-controls button{background:#13283a;border:1px solid transparent;color:#6c8da1;min-width:111px;height:34px;padding:0 12px;text-align:left;font-size:9px}.camera-controls button span{font-weight:750;color:#a6bdcc;margin-left:6px;letter-spacing:.6px}.camera-controls button.selected,.camera-controls button:hover{background:#173c53;color:#74e1f2;border-color:#2d819a}.camera-controls button.selected span{color:#d9f8ff}.scene-stats{display:flex;gap:18px;align-items:center;font-size:8px;letter-spacing:.9px;color:#64879b}.scene-stats strong{display:block;color:#c0d5e2;font-size:12px;margin-top:4px}.scene-stats button{background:#224d64;border:1px solid #3a849e;color:#bcf8ff;padding:11px 14px;font-size:10px}.scene-stats button b{font-size:9px;margin-left:5px}.inspector{position:absolute;left:50%;bottom:98px;transform:translateX(-50%);background:rgba(6,22,38,.97);width:min(420px,90vw);padding:20px 23px;border:1px solid #297994;box-shadow:0 0 60px #0008}.inspector h2{letter-spacing:1.6px;font-size:19px}.inspector p{color:#98b9c9;line-height:1.6;font-size:12px}.inspect-foot{font-size:8px;color:#60899d;letter-spacing:1px}#closeInspector,#closeHelp{position:absolute;top:10px;right:13px;font-size:22px;border:0;background:none;color:#81bdca}.hidden{display:none!important}.help-modal{position:absolute;inset:0;background:#020915c9;display:grid;place-items:center}.help-body{position:relative;width:min(410px,95vw);padding:27px 30px;background:#0b2232;border:1px solid #36778c;box-shadow:0 0 100px #000}.help-body h2{letter-spacing:2px;margin:10px 0 20px}.shortcut{display:flex;align-items:center;gap:19px;padding:9px 0;border-bottom:1px solid #224053;color:#c0d6df}.shortcut kbd{background:#183a50;padding:5px 9px;color:#76dfed;min-width:75px;text-align:center;font:600 10px monospace}.help-body p{color:#658b9c;line-height:1.7;font-size:10px;margin-top:19px}.fatal{position:absolute;inset:0;background:#060d1b;display:flex;justify-content:center;align-items:center;flex-direction:column;text-align:center;padding:30px}.fatal h2{letter-spacing:3px}.fatal p{color:#8ca6bb}
@media(max-height:820px){.controls{padding:12px 17px}.section-heading{margin-bottom:11px}.section-heading h1{font-size:28px}.schematic{height:85px;margin-bottom:12px}.schematic-disc{transform:scale(.8);margin-left:-8px;margin-right:-8px}.section-label{padding:6px 0 9px}.slider-field{margin-bottom:8px}.slider-field input{margin:8px 0 4px}.toggles{gap:6px}.telemetry-head{margin-bottom:12px}.big-value{font-size:42px}.signal-chart canvas{height:76px}.diagnostic-box{margin-top:9px}}
@media(max-width:1150px){.telemetry{width:246px}.controls{width:290px}.view-hud{left:323px}.camera-controls button{min-width:90px}.scene-stats{gap:7px}}
@media(max-width:840px){.topbar{height:60px;padding:0 15px}.brand{min-width:180px}.brand small,.rev,.live{display:none}.app-title{left:auto;right:120px;transform:none}.app-title strong{font-size:12px}.app-title .eyebrow{font-size:7px}.panel{top:70px;bottom:75px}.controls{left:7px;width:265px}.telemetry{right:7px;width:210px}.view-hud{left:285px;top:82px}.view-hud .hint{display:none}.bottom-bar{left:7px;right:7px;bottom:7px}.camera-controls button{min-width:auto;padding:0 7px}.camera-controls button span{display:none}.scene-stats>span{display:none}.reticle{display:none}}
@media(max-width:640px){body{overflow:hidden}.topbar{height:54px}.brand{min-width:auto}.brand strong{font-size:11px}.brand-mark{width:25px;height:25px;font-size:18px}.app-title{display:none}.top-actions{gap:4px}.controls{top:auto;bottom:61px;left:6px;width:calc(100% - 12px);max-height:37vh;padding:11px 15px}.section-heading{margin-bottom:8px}.section-heading h1{font-size:22px;margin:4px 0}.schematic{display:none}.slider-field{margin-bottom:8px}.slider-field .range-ends{display:none}.slider-field input{margin:7px 0}.section-label{padding:6px 0}.toggles{grid-template-columns:1fr 1fr 1fr;gap:5px}.toggle{font-size:9px}.toggle .switch{flex:none}.control-actions{margin-bottom:6px}.telemetry{top:64px;left:7px;right:auto;width:184px;height:auto;bottom:auto;padding:9px 11px;opacity:.95}.telemetry-head{margin-bottom:5px}.data-heading{font-size:8px}.big-value{font-size:31px;margin:1px 0}.big-value sup{font-size:12px;margin:6px}.signal-chart,.readings,.diagnostic-box,.export-btn{display:none}.view-hud{left:auto;right:8px;top:68px;font-size:8px}.view-hud .cross{font-size:12px}.bottom-bar{bottom:5px;height:48px}.scene-stats button b{display:none}.camera-controls button{height:32px;padding:0 9px}.controls .slider-field.compact{margin-bottom:9px}}
