:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#e4f1f6;background:#071923;font-synthesis:none}*{box-sizing:border-box}html,body,#app{margin:0;width:100%;height:100%;overflow:hidden}button,input{font:inherit}button{cursor:pointer}#viewport,canvas{position:absolute;inset:0;width:100%;height:100%;display:block}#app{position:relative;background:radial-gradient(circle at 65% 40%,#123b47,#071923 75%)}#viewport{z-index:0}.topbar{position:absolute;z-index:5;top:0;left:0;right:0;display:flex;align-items:center;gap:16px;padding:20px 29px;pointer-events:none;background:linear-gradient(180deg,rgba(4,20,27,.95),rgba(4,20,27,0));min-width:0}.brand-mark{height:54px;width:54px;background:#bdf47e;color:#08202a;font-size:23px;font-weight:900;letter-spacing:-2px;display:flex;align-items:center;justify-content:center;border-radius:9px;flex-shrink:0}.brand-mark span{font-size:10px;letter-spacing:0;align-self:center;margin-top:15px}.identity{min-width:0}.eyebrow{font-size:10px;color:#93b4c0;letter-spacing:2px;font-weight:800}.identity h1{font-weight:900;letter-spacing:.8px;margin:2px 0 0;font-size:clamp(18px,2vw,29px);white-space:nowrap}.identity h1 span{color:#bdf47e}.subhead{color:#b4d0d8;font-size:12px;margin-top:4px}.top-right{margin-left:auto;align-items:center;display:flex;gap:10px;font-size:10px;font-weight:900;letter-spacing:1.8px;white-space:nowrap;color:#bde7d1}.live-dot{width:8px;height:8px;border-radius:50%;background:#bdf47e;box-shadow:0 0 16px #bdf47e}.panel{z-index:5;position:absolute;top:116px;left:20px;bottom:108px;width:310px;max-width:calc(100vw - 40px);border:1px solid rgba(171,228,228,.16);border-radius:14px;background:linear-gradient(145deg,rgba(8,34,44,.93),rgba(5,23,31,.88));backdrop-filter:blur(17px);box-shadow:0 18px 55px rgba(0,0,0,.25);overflow:hidden}.panel-scroll{padding:18px 18px 24px;height:100%;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#375965 transparent}.section-heading{display:flex;align-items:center;gap:11px;font-size:10px;letter-spacing:1.7px;color:#bdf47e;font-weight:900;margin:0 0 15px;white-space:nowrap}.section-heading:not(:first-child){margin-top:22px}.section-heading .rule{height:1px;background:#355460;flex:1}.control{margin-bottom:19px}.control label{display:flex;align-items:baseline;justify-content:space-between;font-size:12px;color:#e0f0f0;font-weight:600}.control output{font-size:14px;color:#bdf47e;font-weight:850;font-variant-numeric:tabular-nums}input[type="range"]{margin:12px 0 1px;width:100%;accent-color:#bdf47e;cursor:pointer}.range-ends{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1px;color:#73929d}.toggle-row{margin:12px 0;display:flex;justify-content:space-between;align-items:center;gap:9px;cursor:pointer}.toggle-row strong{font-size:12px;display:block;font-weight:700;color:#e0f0f0}.toggle-row small{font-size:10px;display:block;margin-top:3px;color:#84a7b0}.toggle-row input{position:absolute;opacity:0;width:1px;height:1px}.switch{height:20px;width:36px;background:#36515c;border-radius:50px;position:relative;flex-shrink:0;transition:.2s}.switch:before{content:"";position:absolute;width:14px;height:14px;border-radius:50%;background:#d3e0e4;left:3px;top:3px;transition:.2s}.toggle-row input:checked+.switch{background:#91c75d}.toggle-row input:checked+.switch:before{transform:translateX(16px);background:#102517}.toggle-row input:focus-visible+.switch{outline:2px solid #fff}.camera-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.camera,.actions button{background:#123642;color:#bdd5dc;border:1px solid #315664;border-radius:5px;padding:10px 6px;font-size:10px;letter-spacing:.7px;font-weight:850;transition:background .18s,border-color .18s}.camera:hover,.actions button:hover{background:#235767}.camera.active{background:#274936;color:#c9ff8a;border-color:#8bbb5b}.actions{display:flex;gap:6px;flex-wrap:wrap}.actions button{padding:10px 9px}.actions button.primary{flex:1;background:#bdf47e;border-color:#bdf47e;color:#102525}.hint{color:#87abb2;line-height:1.7;font-size:10px;margin:17px 0 0}.hint kbd{border:1px solid #55717c;border-radius:3px;padding:0 4px}.telemetry{position:absolute;z-index:4;left:20px;right:20px;bottom:17px;display:flex;gap:1px;overflow:hidden;border:1px solid rgba(132,185,196,.17);border-radius:11px;backdrop-filter:blur(15px);background:rgba(5,23,31,.9)}.stat{flex:1;padding:13px 17px;border-right:1px solid #25434e;min-width:0}.stat:last-child{border-right:0}.stat span{display:block;font-size:9px;letter-spacing:1.4px;font-weight:850;color:#84a6b0}.stat b{display:block;margin-top:5px;font-size:clamp(13px,1.4vw,20px);white-space:nowrap;font-variant-numeric:tabular-nums}.scale-caption{z-index:2;position:absolute;right:27px;bottom:103px;font-size:9px;letter-spacing:1.5px;color:rgba(195,224,229,.65)}.callout{position:absolute;z-index:2;top:125px;right:27px;font-size:11px;color:#e8f6f3;letter-spacing:2px;padding:10px 13px;border:1px solid rgba(180,236,223,.24);border-radius:4px;background:rgba(5,29,37,.58);pointer-events:none}#unsupported:not([hidden]){position:absolute;inset:0;z-index:10;background:#071923;display:grid;place-items:center;text-align:center;padding:20px;color:#fff}@media(max-width:900px){.top-right{display:none}.panel{top:105px;bottom:95px;width:265px}.telemetry .stat:first-child{display:none}.stat{padding:10px}.stat span{font-size:8px}.callout{right:12px}.topbar{padding:15px}.scale-caption{display:none}}@media(max-width:640px){.panel{left:8px;bottom:90px;top:auto;width:calc(100vw - 16px);height:220px}.panel-scroll{padding:14px}.topbar{gap:10px}.brand-mark{height:43px;width:43px;font-size:18px}.identity h1{font-size:17px}.identity .eyebrow{font-size:8px;letter-spacing:1px}.subhead{font-size:10px}.telemetry{left:8px;right:8px;bottom:8px}.stat{padding:8px 5px}.stat b{font-size:12px}.stat span{font-size:7px;letter-spacing:.3px}.callout{top:86px;right:8px;font-size:9px;padding:7px}}
