:root{--bg:#090d0c;--panel:#101615;--panel2:#141b19;--line:#27312e;--muted:#77827f;--text:#e7ecea;--lime:#b8f34a;--amber:#ffbd4a;--red:#ff5a57;--mono:"DM Mono",monospace;--sans:"Manrope",sans-serif}*{box-sizing:border-box}html,body,#app{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:var(--sans)}body{overflow-x:hidden}.topbar{height:74px;display:flex;align-items:center;justify-content:space-between;padding:0 28px;border-bottom:1px solid var(--line);background:#0c1110}.brand{display:flex;align-items:center;gap:13px}.brand-mark{width:36px;height:36px;border:1px solid #719a2b;position:relative;transform:rotate(45deg)}.brand-mark:before,.brand-mark:after{content:"";position:absolute;background:var(--lime)}.brand-mark:before{width:18px;height:2px;left:8px;top:16px}.brand-mark:after{height:18px;width:2px;top:8px;left:16px}.brand-mark span{position:absolute;width:7px;height:7px;background:var(--bg);border:2px solid var(--lime);left:13px;top:13px;border-radius:50%}.brand h1{font-size:15px;letter-spacing:.08em;text-transform:uppercase;margin:0}.brand p{font:10px var(--mono);color:var(--muted);margin:3px 0 0;text-transform:uppercase;letter-spacing:.08em}.sim-actions{display:flex;align-items:center;gap:10px}.status{font:10px var(--mono);letter-spacing:.08em;color:#aab3b0;margin-right:10px}.status i,.badge i{display:inline-block;width:6px;height:6px;background:var(--lime);border-radius:50%;margin-right:8px;box-shadow:0 0 8px var(--lime)}button{font-family:var(--sans);cursor:pointer}.icon-btn,.primary-btn{height:36px;border:1px solid #35413e;background:#151b1a;color:#e8edeb}.icon-btn{width:38px;font-size:20px}.primary-btn{padding:0 17px;font-weight:700;font-size:12px}.primary-btn span{color:var(--lime);margin-right:7px}.icon-btn:hover,.primary-btn:hover{border-color:#66736f}main{display:grid;grid-template-columns:280px minmax(0,1fr);min-height:calc(100vh - 102px)}.controls-panel{background:#0d1211;border-right:1px solid var(--line);padding:24px 22px}.controls-panel section{padding-bottom:27px;margin-bottom:25px;border-bottom:1px solid var(--line)}.controls-panel section:last-child{border:0}.section-title{display:flex;align-items:center;gap:10px;margin-bottom:20px}.section-title span{font:9px var(--mono);color:var(--lime);border:1px solid #536c29;padding:3px 4px}.section-title h2{font-size:11px;text-transform:uppercase;letter-spacing:.12em;margin:0}.field-label{font:9px var(--mono);color:var(--muted);display:block;text-transform:uppercase;margin-bottom:7px}.select-wrap{position:relative}.select-wrap:after{content:"⌄";position:absolute;right:12px;top:7px;color:var(--lime);pointer-events:none}.select-wrap select{appearance:none;width:100%;height:38px;background:#151c1a;color:var(--text);border:1px solid #303b38;padding:0 11px;font:11px var(--mono)}.manual-hint{margin-top:8px;color:var(--muted);font:9px var(--mono)}.manual-hint b{color:var(--lime)}.hidden{display:none}.control-row>div{margin-top:19px}.control-row label{font-size:10px;color:#adb6b3;display:flex;justify-content:space-between}.control-row output{font:10px var(--mono);color:var(--text)}input[type=range]{appearance:none;width:100%;height:2px;background:#3a4542;margin-top:13px;display:block}input[type=range]::-webkit-slider-thumb{appearance:none;width:12px;height:12px;border-radius:50%;background:var(--lime);border:3px solid #1e2b18;box-shadow:0 0 0 1px #7ba733}.limits-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:22px}.limits-grid label{background:#141a19;border:1px solid #27302e;padding:9px}.limits-grid span{font:8px var(--mono);text-transform:uppercase;color:var(--muted);display:block}.limits-grid strong{font:9px var(--mono);font-weight:400;display:block;margin-top:5px}.tips p{font-size:9px;color:#87918e;line-height:1.6;margin:8px 0}.tips b{color:#cfd5d3}.dot{display:inline-block;width:5px;height:5px;border-radius:50%;margin-right:7px}.green{background:var(--lime)}.amber{background:var(--amber)}.red{background:var(--red)}.workspace{padding:18px;min-width:0}.view-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:12px}.viewport-card{background:var(--panel);border:1px solid var(--line);min-width:0}.card-head{height:57px;padding:0 15px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.card-head span{font:8px var(--mono);color:var(--lime);letter-spacing:.12em}.card-head h3{font-size:11px;margin:3px 0 0}.legend{font:8px var(--mono);color:var(--muted)}.legend i{display:inline-block;width:18px;border-top:1px dashed var(--lime);vertical-align:middle;margin-right:7px}.badge{font:9px var(--mono);padding:6px 9px;border:1px solid #547029;color:var(--lime)}.badge.trailing{color:var(--amber);border-color:#745b2c}.badge.trailing i{background:var(--amber);box-shadow:0 0 8px var(--amber)}.badge.lost{color:var(--red);border-color:#713b38}.badge.lost i{background:var(--red);box-shadow:0 0 8px var(--red)}.canvas-wrap{height:min(54vh,530px);min-height:360px;position:relative;overflow:hidden;background:#0b100f}canvas{display:block;width:100%;height:100%}.orientation{position:absolute;right:14px;top:14px;width:29px;height:29px;border:1px solid #384541;border-radius:50%;display:grid;place-items:center;font:8px var(--mono);color:var(--lime)}.orientation:before{content:"";position:absolute;top:-6px;border:3px solid transparent;border-bottom:5px solid var(--lime)}.view-help{position:absolute;bottom:12px;left:14px;color:#69736f;font:8px var(--mono)}.camera-wrap{background:radial-gradient(circle,#17201d,#080b0a)}.camera-wrap:after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.018) 0,rgba(255,255,255,.018) 1px,transparent 1px,transparent 3px);mix-blend-mode:screen}.reticle{position:absolute;left:50%;top:50%;width:82px;height:82px;transform:translate(-50%,-50%);opacity:.7}.reticle span{position:absolute;width:18px;height:18px;border-color:#dcf0e7bf;border-style:solid}.r-tl{left:0;top:0;border-width:1px 0 0 1px}.r-tr{right:0;top:0;border-width:1px 1px 0 0}.r-bl{left:0;bottom:0;border-width:0 0 1px 1px}.r-br{right:0;bottom:0;border-width:0 1px 1px 0}.reticle i{position:absolute;width:5px;height:5px;border:1px solid white;border-radius:50%;left:39px;top:39px}.feed-meta{position:absolute;left:13px;right:13px;display:flex;justify-content:space-between;color:#c8d5d0;font:8px var(--mono);text-shadow:0 1px 2px #000}.feed-meta.top{top:12px}.feed-meta.bottom{bottom:12px}.offscreen-arrow{display:none;position:absolute;color:var(--red);font-size:17px;left:50%;top:15%;transform-origin:center}.metrics{display:grid;grid-template-columns:1.12fr repeat(4,1fr);margin-top:12px;border:1px solid var(--line);background:var(--panel)}.metric{min-width:0;min-height:105px;padding:16px;border-right:1px solid var(--line);position:relative}.metric:last-child{border:0}.metric.primary:before{content:"";position:absolute;left:-1px;top:16px;bottom:16px;width:2px;background:var(--lime)}.metric label{display:block;color:var(--muted);font:8px var(--mono);text-transform:uppercase;letter-spacing:.08em}.metric strong{display:block;font:500 22px var(--mono);margin-top:8px;color:#e9eeec}.metric strong span{font-size:10px;color:#838e8a;margin-left:3px}.metric small{font:7px var(--mono);color:#626d69}.meter{height:2px;background:#313b38;margin-top:10px}.meter i{height:100%;width:0;display:block;background:var(--amber);transition:width .1s}.meter.quality i{background:var(--lime)}footer{height:28px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:0 28px;color:#56605d;font:7px var(--mono);letter-spacing:.08em}@media(max-width:1050px){main{grid-template-columns:235px 1fr}.controls-panel{padding:20px 16px}.view-grid{grid-template-columns:1fr}.canvas-wrap{height:390px}.metrics{grid-template-columns:repeat(3,1fr)}.metric:nth-child(3){border-right:0}.metric:nth-child(n+4){border-top:1px solid var(--line)}}@media(max-width:720px){.status{display:none}.topbar{padding:0 15px}main{display:block}.controls-panel{border-right:0}.workspace{padding:10px}.metrics{grid-template-columns:1fr 1fr}.metric{border-bottom:1px solid var(--line)}footer{padding:0 12px}.canvas-wrap{min-height:300px;height:55vh}}.canvas-wrap,.camera-wrap{background:linear-gradient(#315a6a,#a7bbb3 62%,#334a42 63%)}.brand h1{font-size:17px}.brand p,.status{font-size:11px}.primary-btn{font-size:13px}main{grid-template-columns:310px minmax(0,1fr)}.controls-panel{padding:27px 24px}.section-title h2{font-size:13px}.section-title span{font-size:10px}.field-label{font-size:11px}.select-wrap select{font-size:13px;height:42px}.select-wrap:after{top:9px}.manual-hint{font-size:11px;line-height:1.6}.control-row label{font-size:12px}.control-row output{font-size:12px}.limits-grid span{font-size:10px}.limits-grid strong{font-size:11px}.tips p{font-size:11px;line-height:1.65}.card-head{height:64px;padding-inline:18px}.card-head span{font-size:10px}.card-head h3{font-size:14px}.legend{font-size:10px}.badge{font-size:11px;padding:7px 10px}.orientation{font-size:10px;width:33px;height:33px}.view-help{font-size:10px}.feed-meta{font-size:11px}.metric{min-height:118px;padding:18px}.metric label{font-size:10px}.metric strong{font-size:26px;margin-top:10px}.metric strong span{font-size:12px}.metric small{font-size:9px;line-height:1.5}footer{font-size:9px;height:32px}@media(max-width:1150px){main{grid-template-columns:260px minmax(0,1fr)}.controls-panel{padding-inline:18px}.metrics{grid-template-columns:repeat(3,1fr)}.metric:nth-child(3){border-right:0}.metric:nth-child(n+4){border-top:1px solid var(--line)}}@media(max-width:720px){main{display:block}.brand h1{font-size:15px}.brand p{font-size:10px}.controls-panel{padding:23px 20px}.metrics{grid-template-columns:1fr 1fr}footer{font-size:8px}}.metrics{grid-template-columns:repeat(4,minmax(0,1fr))}.metric:nth-child(4){border-right:0}.metric:nth-child(n+5){border-top:1px solid var(--line)}.metric:nth-child(8){border-right:0}.budget-meter{margin-top:8px}.budget-meter i{background:var(--lime)}.metric.budget.warning .budget-meter i{background:var(--amber)}.metric.budget.critical .budget-meter i{background:var(--red)}@media(max-width:1150px){.metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.metric{border-top:0;border-right:1px solid var(--line)}.metric:nth-child(3n){border-right:0}.metric:nth-child(n+4){border-top:1px solid var(--line)}}@media(max-width:720px){.metrics{grid-template-columns:1fr 1fr}.metric:nth-child(3n){border-right:1px solid var(--line)}.metric:nth-child(2n){border-right:0}.metric:nth-child(n+3){border-top:1px solid var(--line)}}
