:root{--bg-main: #0a0d14;--bg-header: #0e131d;--bg-panel: #111724;--bg-card: #161e2e;--bg-card-hover: #1b263b;--bg-input: #0a0e17;--bg-input-focus: #0f1726;--border-subtle: #1c2738;--border-medium: #27374f;--border-accent: #00e5ff;--accent-cyan: #00e5ff;--accent-magenta: #ff007f;--accent-amber: #ff9e00;--accent-green: #39ff14;--accent-purple: #9d4edd;--accent-blue: #0070f3;--text-primary: #e6edf3;--text-secondary: #8b9bb4;--text-muted: #53647c;--text-highlight: #00f3ff;--font-ui: "Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono: "JetBrains Mono", monospace;--header-height: 54px;--footer-height: 34px;--left-sidebar-width: 320px;--right-sidebar-width: 380px}*{box-sizing:border-box;margin:0;padding:0}body.dark-theme{background-color:var(--bg-main);color:var(--text-primary);font-family:var(--font-ui);font-size:13px;line-height:1.4;overflow:hidden;-webkit-user-select:none;user-select:none;-webkit-font-smoothing:antialiased}.app-layout{display:flex;flex-direction:column;height:100vh;width:100vw;overflow:hidden}.app-header{height:var(--header-height);background-color:var(--bg-header);border-bottom:1px solid var(--border-subtle);display:flex;align-items:center;justify-content:space-between;padding:0 16px;z-index:20}.header-left{display:flex;align-items:center;gap:20px}.brand-logo{display:flex;align-items:center;gap:10px}.hex-icon{width:28px;height:28px;color:var(--accent-cyan);filter:drop-shadow(0 0 6px rgba(0,229,255,.5))}.brand-text{display:flex;flex-direction:column}.brand-name{font-weight:800;font-size:15px;letter-spacing:1.5px;color:#fff;background:linear-gradient(135deg,#fff 30%,#00e5ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.brand-sub{font-family:var(--font-mono);font-size:9px;letter-spacing:1px;color:var(--text-secondary)}.project-pill{display:flex;align-items:center;gap:8px;background:#00e5ff14;border:1px solid rgba(0,229,255,.25);padding:4px 12px;border-radius:20px}.pill-dot{width:6px;height:6px;border-radius:50%;background-color:var(--accent-green);box-shadow:0 0 6px var(--accent-green)}.pill-title{font-family:var(--font-mono);font-size:11px;color:var(--text-primary)}.action-btn-group{display:flex;align-items:center;gap:8px}.top-action-btn{display:flex;align-items:center;gap:6px;background:var(--bg-card);border:1px solid var(--border-medium);color:var(--text-primary);padding:6px 14px;border-radius:6px;font-family:var(--font-ui);font-size:12px;font-weight:600;cursor:pointer;transition:all .15s ease}.top-action-btn:hover{background:var(--bg-card-hover);border-color:var(--accent-cyan);color:#fff;box-shadow:0 0 10px #00e5ff33}.top-action-btn.btn-gizmos-toggle{border-color:#00e5ff66;background:#00e5ff14;color:var(--accent-cyan)}.top-action-btn.btn-gizmos-toggle.active{background:#00e5ff26;border-color:var(--accent-cyan);color:#fff;box-shadow:0 0 12px #00e5ff59}.top-action-btn.btn-gizmos-toggle.active .gizmos-indicator{color:var(--accent-green);text-shadow:0 0 6px var(--accent-green)}.top-action-btn.btn-gizmos-toggle.inactive{background:var(--bg-card);border-color:var(--border-subtle);color:var(--text-muted);opacity:.75}.top-action-btn.btn-gizmos-toggle.inactive .gizmos-indicator{color:var(--text-muted);text-shadow:none}.gizmos-indicator{font-size:10px;margin-right:2px}.top-action-btn.btn-sim{background:linear-gradient(135deg,#00b4d8,#0077b6);border-color:#0096c7;color:#fff;box-shadow:0 0 12px #00b4d859}.top-action-btn.btn-sim:hover{background:linear-gradient(135deg,#00e5ff,#0096c7);box-shadow:0 0 16px #00e5ff80}.top-action-btn.btn-danger-outline:hover{border-color:#f36;color:#f36;box-shadow:0 0 10px #ff336640}.app-main{flex:1;display:flex;height:calc(100vh - var(--header-height) - var(--footer-height));overflow:hidden}.sidebar{background-color:var(--bg-panel);border-color:var(--border-subtle);display:flex;flex-direction:column;z-index:10}.left-sidebar{width:var(--left-sidebar-width);border-right:1px solid var(--border-subtle)}.right-sidebar{width:var(--right-sidebar-width);border-left:1px solid var(--border-subtle)}.panel-scroll-container{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:14px}.panel-scroll-container::-webkit-scrollbar,.table-scroll-wrap::-webkit-scrollbar{width:5px;height:5px}.panel-scroll-container::-webkit-scrollbar-thumb,.table-scroll-wrap::-webkit-scrollbar-thumb{background:var(--border-medium);border-radius:4px}.panel-scroll-container::-webkit-scrollbar-thumb:hover,.table-scroll-wrap::-webkit-scrollbar-thumb:hover{background:var(--accent-cyan)}.viewport-center{flex:1;position:relative;background-color:#080a0f;overflow:hidden}.three-container{width:100%;height:100%}.three-container canvas{display:block;width:100%!important;height:100%!important;outline:none}.viewport-hud-top-left{position:absolute;top:14px;left:16px;display:flex;flex-direction:column;gap:6px;pointer-events:none}.hud-tag{display:flex;align-items:center;gap:8px;background:#0a101ad9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(0,229,255,.4);padding:4px 10px;border-radius:4px;font-family:var(--font-mono);font-size:11px;font-weight:700;color:var(--accent-cyan);letter-spacing:1px}.hud-dot{width:6px;height:6px;border-radius:50%;background-color:var(--accent-cyan);box-shadow:0 0 6px var(--accent-cyan)}.hud-chip{background:#101826bf;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border:1px solid var(--border-subtle);padding:3px 8px;border-radius:4px;font-family:var(--font-mono);font-size:10px;color:var(--text-secondary)}.viewport-hud-bottom-right{position:absolute;bottom:12px;right:16px;pointer-events:none}.view-controls-hint{background:#0a101acc;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border:1px solid var(--border-subtle);border-radius:4px;padding:6px 10px;display:flex;gap:14px;font-family:var(--font-mono);font-size:10px;color:var(--text-muted)}.app-toast{position:absolute;bottom:20px;left:50%;transform:translate(-50%) translateY(50px);background:#0c131ff2;border:1px solid var(--accent-cyan);box-shadow:0 4px 20px #00e5ff59;color:#fff;padding:10px 20px;border-radius:6px;font-family:var(--font-mono);font-size:12px;opacity:0;transition:all .3s cubic-bezier(.16,1,.3,1);pointer-events:none;z-index:50}.app-toast.show{opacity:1;transform:translate(-50%) translateY(0)}.right-tabs-header{display:flex;background:var(--bg-header);border-bottom:1px solid var(--border-subtle)}.right-tab-btn{flex:1;background:transparent;border:none;border-bottom:2px solid transparent;color:var(--text-secondary);padding:12px 6px;font-family:var(--font-ui);font-size:12px;font-weight:600;cursor:pointer;transition:all .15s ease}.right-tab-btn:hover{color:var(--text-primary);background:#ffffff05}.right-tab-btn.active{color:var(--accent-cyan);border-bottom-color:var(--accent-cyan);background:#00e5ff0d}.right-tab-pane{display:none;flex-direction:column;gap:14px}.right-tab-pane.active{display:flex}.panel-section{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:8px;padding:14px;display:flex;flex-direction:column;gap:12px}.section-header{display:flex;align-items:center;justify-content:space-between}.section-title{font-family:var(--font-mono);font-size:11px;font-weight:700;letter-spacing:1px;color:var(--text-secondary);display:flex;align-items:center;gap:6px}.device-list{display:flex;flex-direction:column;gap:6px}.device-item{display:flex;align-items:center;justify-content:space-between;background:var(--bg-input);border:1px solid var(--border-subtle);padding:8px 12px;border-radius:6px;cursor:pointer;transition:all .15s ease}.device-item:hover{background:var(--bg-card-hover);border-color:var(--border-medium)}.device-item.active{background:#00e5ff14;border-color:var(--accent-cyan);box-shadow:0 0 10px #00e5ff26}.device-info{display:flex;align-items:center;gap:8px}.status-dot{width:8px;height:8px;border-radius:50%}.status-online{background-color:var(--accent-green);box-shadow:0 0 6px var(--accent-green)}.status-offline{background-color:#555e6d}.status-sensor{background-color:var(--accent-cyan);box-shadow:0 0 6px var(--accent-cyan)}.device-name{font-weight:600;font-size:12px;color:var(--text-primary)}.device-tag{font-family:var(--font-mono);font-size:10px;font-weight:700;padding:2px 6px;border-radius:4px;border:1px solid}.sensor-tag{border-color:var(--accent-cyan);color:var(--accent-cyan)}.gizmo-mode-toggle{display:flex;background:var(--bg-input);border:1px solid var(--border-subtle);border-radius:6px;padding:3px;gap:4px}.gizmo-btn{flex:1;background:transparent;border:none;color:var(--text-secondary);font-family:var(--font-ui);font-size:11px;font-weight:600;padding:6px 0;border-radius:4px;cursor:pointer;transition:all .15s ease;display:flex;align-items:center;justify-content:center;gap:6px}.gizmo-btn:hover{color:var(--text-primary)}.gizmo-btn.active{background:var(--accent-cyan);color:#000;font-weight:700}.input-block{display:flex;flex-direction:column;gap:6px}.input-label{font-family:var(--font-mono);font-size:10px;font-weight:600;color:var(--text-secondary);letter-spacing:.5px}.coord-inputs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.coord-field{display:flex;align-items:center;background:var(--bg-input);border:1px solid var(--border-subtle);border-radius:4px;overflow:hidden}.coord-field:focus-within{border-color:var(--accent-cyan)}.axis-badge{font-family:var(--font-mono);font-size:10px;font-weight:700;padding:6px 8px;background:#ffffff0d}.axis-x{color:#f36}.axis-y{color:#39ff14}.axis-z{color:#00e5ff}.coord-field input{width:100%;background:transparent;border:none;color:var(--text-primary);font-family:var(--font-mono);font-size:11px;padding:6px;text-align:right;outline:none}.slider-header{display:flex;justify-content:space-between;align-items:center}.slider-value{font-family:var(--font-mono);font-size:11px;font-weight:700;color:var(--accent-cyan)}input[type=range]{-webkit-appearance:none;width:100%;height:4px;border-radius:2px;background:var(--border-medium);outline:none;margin:6px 0}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--accent-cyan);cursor:pointer;box-shadow:0 0 8px var(--accent-cyan);transition:transform .1s}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.2)}.switch-toggle{position:relative;display:inline-block;width:34px;height:18px}.switch-toggle input{opacity:0;width:0;height:0}.slider.round{position:absolute;cursor:pointer;inset:0;background-color:var(--border-medium);transition:.2s;border-radius:18px}.slider.round:before{position:absolute;content:"";height:12px;width:12px;left:3px;bottom:3px;background-color:#fff;transition:.2s;border-radius:50%}input:checked+.slider.round{background-color:var(--accent-green)}input:checked+.slider.round:before{transform:translate(16px)}.tech-btn{background:var(--bg-card-hover);border:1px solid var(--border-medium);color:var(--text-primary);font-family:var(--font-ui);font-size:12px;font-weight:600;padding:8px 14px;border-radius:6px;cursor:pointer;transition:all .15s ease}.tech-btn:hover{border-color:var(--accent-cyan);color:#fff}.tech-btn.primary-btn{background:linear-gradient(135deg,#00b4d8,#0077b6);border-color:#00e5ff;color:#fff;font-weight:700;box-shadow:0 0 14px #00e5ff4d}.tech-btn.primary-btn:hover{background:linear-gradient(135deg,#00e5ff,#0096c7);box-shadow:0 0 20px #00e5ff8c}.tech-btn.mini-btn{padding:2px 8px;font-size:10px}.tech-btn.full-width{width:100%;padding:10px}.calibrating-pulse{animation:pulseGlow 1s infinite alternate}@keyframes pulseGlow{0%{box-shadow:0 0 10px #00e5ff66}to{box-shadow:0 0 24px #00e5ffe6}}.mode-selector-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.mode-btn{background:var(--bg-input);border:1px solid var(--border-subtle);border-radius:6px;padding:8px 4px;display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;transition:all .15s ease}.mode-btn .mode-icon{font-size:14px}.mode-btn .mode-label{font-family:var(--font-mono);font-size:10px;color:var(--text-secondary)}.mode-btn:hover{border-color:var(--border-medium)}.mode-btn.active{background:#00e5ff1f;border-color:var(--accent-cyan)}.mode-btn.active .mode-label{color:var(--accent-cyan);font-weight:700}.corner-grid-title{font-family:var(--font-mono);font-size:10px;color:var(--text-secondary);margin-top:6px}.corners-2x2-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.corner-box{background:var(--bg-input);border:1px solid var(--border-subtle);border-radius:6px;padding:8px;display:flex;flex-direction:column;gap:4px}.corner-label{font-family:var(--font-mono);font-size:10px;font-weight:700;color:var(--accent-cyan)}.corner-inputs{display:grid;grid-template-columns:auto 1fr auto 1fr;align-items:center;gap:4px;font-family:var(--font-mono);font-size:10px;color:var(--text-muted)}.corner-inputs input{width:100%;background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:3px;color:var(--text-primary);font-family:var(--font-mono);font-size:10px;padding:2px 4px;outline:none}.corner-inputs input:focus{border-color:var(--accent-cyan)}.pattern-chips-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.pattern-chip{background:var(--bg-input);border:1px solid var(--border-subtle);color:var(--text-secondary);font-family:var(--font-mono);font-size:10px;padding:6px;border-radius:4px;cursor:pointer;transition:all .15s ease}.pattern-chip:hover{border-color:var(--border-medium);color:var(--text-primary)}.pattern-chip.active{background:#00e5ff26;border-color:var(--accent-cyan);color:var(--accent-cyan);font-weight:700}.content-sub-header{font-family:var(--font-mono);font-size:10px;font-weight:700;color:var(--text-secondary);letter-spacing:.5px}.pattern-chip.video-chip{background:#7928ca26;border-color:#9d4edd66;color:#e0aaff}.pattern-chip.video-chip:hover{border-color:var(--accent-purple);color:#fff;box-shadow:0 0 8px #9d4edd4d}.pattern-chip.video-chip.active{background:#9d4edd4d;border-color:#c77dff;color:#fff;font-weight:700;box-shadow:0 0 12px #c77dff80}.custom-file-upload{display:flex;align-items:center;justify-content:center;background:var(--bg-input);border:1px dashed var(--border-medium);border-radius:6px;padding:8px 4px;text-align:center;font-size:11px;color:var(--text-secondary);cursor:pointer;transition:all .15s ease}.custom-file-upload:hover{border-color:var(--accent-cyan);color:var(--accent-cyan)}.custom-file-upload.video-upload:hover{border-color:var(--accent-magenta);color:var(--accent-magenta)}.custom-file-upload input[type=file]{display:none}.calibration-hero-card{display:flex;flex-direction:column;gap:12px}.hero-desc{font-size:11px;color:var(--text-secondary);line-height:1.5}.metric-cards-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.metric-card{background:var(--bg-input);border:1px solid var(--border-subtle);border-radius:6px;padding:8px 10px;display:flex;flex-direction:column;gap:4px}.metric-card.full-col{grid-column:span 2}.metric-label{font-family:var(--font-mono);font-size:9px;font-weight:700;color:var(--text-muted);letter-spacing:.5px}.metric-value{font-family:var(--font-mono);font-size:14px;font-weight:700;color:#fff}.metric-value.font-highlight{color:var(--accent-cyan)}.metric-value .unit{font-size:10px;color:var(--text-secondary)}.metric-badge{font-family:var(--font-mono);font-size:11px;font-weight:700;padding:2px 6px;border-radius:4px;display:inline-block;width:fit-content}.badge-success{background:#39ff1426;border:1px solid var(--accent-green);color:var(--accent-green)}.badge-error{background:#ff336626;border:1px solid #ff3366;color:#f36}.coverage-bar-container{height:6px;background:var(--bg-card);border-radius:3px;overflow:hidden;margin-top:4px}.coverage-bar-fill{height:100%;background:linear-gradient(90deg,#00e5ff,#39ff14);border-radius:3px;transition:width .4s ease}.coverage-text{font-family:var(--font-mono);font-size:10px;color:var(--text-secondary);margin-top:2px}.mapping-table-section{display:flex;flex-direction:column;gap:6px}.table-title{font-family:var(--font-mono);font-size:10px;font-weight:700;color:var(--text-secondary)}.table-scroll-wrap{max-height:180px;overflow-y:auto;border:1px solid var(--border-subtle);border-radius:4px}.tech-table{width:100%;border-collapse:collapse;font-family:var(--font-mono);font-size:10px}.tech-table th{background:var(--bg-header);color:var(--text-secondary);padding:6px 8px;text-align:left;position:sticky;top:0;border-bottom:1px solid var(--border-subtle)}.tech-table td{padding:5px 8px;border-bottom:1px solid rgba(255,255,255,.03);color:var(--text-primary)}.tech-table tbody tr:hover{background:#00e5ff0d}.scene-info-grid{display:flex;flex-direction:column;gap:8px}.info-row{display:flex;justify-content:space-between;align-items:center;font-size:12px}.info-label{color:var(--text-secondary)}.info-val{font-family:var(--font-mono);font-weight:600}.info-val.highlight{color:var(--accent-cyan)}.info-val.sensor-ok{color:var(--accent-green)}.fps-badge{background:#00e5ff26;border:1px solid var(--accent-cyan);color:var(--accent-cyan);padding:2px 6px;border-radius:4px}.overlap-bars-list{display:flex;flex-direction:column;gap:10px}.overlap-item{display:flex;flex-direction:column;gap:4px}.overlap-header{display:flex;justify-content:space-between;font-family:var(--font-mono);font-size:10px;color:var(--text-secondary)}.overlap-val{color:var(--text-primary);font-weight:700}.overlap-bar{height:6px;background:var(--bg-input);border-radius:3px;overflow:hidden}.overlap-fill{height:100%;border-radius:3px;transition:width .3s ease}.overlap-fill.p1-p2{background:linear-gradient(90deg,#00e5ff,#ff9e00)}.overlap-fill.p2-p3{background:linear-gradient(90deg,#ff9e00,#ff007f)}.overlap-fill.p1-p3{background:linear-gradient(90deg,#00e5ff,#ff007f)}.app-footer{height:var(--footer-height);background-color:var(--bg-header);border-top:1px solid var(--border-subtle);display:flex;align-items:center;justify-content:space-between;padding:0 16px;font-family:var(--font-mono);font-size:11px;color:var(--text-secondary);z-index:20}.status-left,.status-right{display:flex;align-items:center;gap:10px}.status-indicator{width:6px;height:6px;border-radius:50%;background-color:var(--accent-green);box-shadow:0 0 6px var(--accent-green)}.status-separator{color:var(--border-medium)}.highlight{color:var(--accent-cyan)}