:root{--bg-color: #0b0e14;--card-bg: #151a24;--text-main: #f0f3f8;--text-dim: #8b9bb4;--accent-blue: #388bfd;--accent-green: #2ea043;--accent-red: #f85149;--accent-yellow: #d29922;--border-color: #273142;--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif}*{box-sizing:border-box;margin:0;padding:0;user-select:none;-webkit-user-select:none}html,body,#app{width:100vw;height:100vh;overflow:hidden;background-color:var(--bg-color);font-family:var(--font-family);color:var(--text-main);position:relative}#projection-canvas{width:100%;height:100%;object-fit:contain;display:block;background-color:#000;touch-action:none}.hud-container{position:absolute;top:16px;left:16px;display:flex;flex-direction:column;gap:8px;pointer-events:none;z-index:100}.hud-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.hud-badge{background:#151a24d9;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--border-color);padding:6px 12px;border-radius:6px;font-size:11px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--text-dim);transition:all .2s ease}.hud-badge.status-connected{border-color:var(--accent-green);color:#56d364}.hud-badge.status-warning{border-color:var(--accent-yellow);color:#e3b341}.hud-badge.status-disconnected{border-color:var(--accent-red);color:#ff7b72}.metrics-row{background:#0b0e14bf;padding:4px 10px;border-radius:6px;border:1px solid rgba(39,49,66,.6);font-size:12px;color:var(--text-dim)}.hud-metric strong{color:var(--text-main);font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}.btn-unpair{margin-left:8px;padding:2px 10px;background:transparent;border:1px solid var(--accent-red);border-radius:4px;color:#ff7b72;font-size:11px;font-weight:600;cursor:pointer;text-transform:uppercase;letter-spacing:.04em}.btn-unpair.hidden{display:none}.btn-unpair:hover{background:#f8514926}.modal-overlay{position:absolute;inset:0;background:#000c;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:center;z-index:200;transition:opacity .2s ease}.modal-overlay.hidden{opacity:0;pointer-events:none}.modal-card{background:var(--card-bg);border:1px solid var(--border-color);border-radius:14px;padding:32px;width:90%;max-width:480px;box-shadow:0 20px 40px #0009;text-align:center}.modal-header h2{font-size:24px;font-weight:700;margin-bottom:8px}.modal-header p{color:var(--text-dim);font-size:14px;line-height:1.5;margin-bottom:24px}.code-inputs{display:flex;gap:10px;justify-content:center;margin-bottom:20px}.code-digit{width:48px;height:60px;background:#0d1117;border:2px solid var(--border-color);border-radius:8px;color:var(--text-main);font-size:28px;font-weight:700;text-align:center;font-family:ui-monospace,monospace}.code-digit:focus{border-color:var(--accent-blue);outline:none}.pairing-error-message{color:var(--accent-red);font-size:13px;margin-bottom:16px}.pairing-error-message.hidden{display:none}.btn-primary{width:100%;padding:14px 20px;background:var(--accent-blue);border:none;border-radius:8px;color:#fff;font-size:16px;font-weight:600;cursor:pointer;transition:background .2s ease}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-primary:not(:disabled):hover{background:#2a75d9}.diagnostic-drawer{position:absolute;bottom:0;right:16px;width:420px;max-width:calc(100vw - 32px);background:#151a24f2;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--border-color);border-bottom:none;border-radius:8px 8px 0 0;z-index:150;transition:transform .3s cubic-bezier(.16,1,.3,1)}.diagnostic-drawer.collapsed{transform:translateY(calc(100% - 36px))}.drawer-header{height:36px;padding:0 14px;display:flex;align-items:center;justify-content:space-between;cursor:pointer;font-size:12px;font-weight:600;color:var(--text-dim)}.drawer-header h3{font-size:12px}.toggle-icon{font-size:10px;transition:transform .3s ease}.diagnostic-drawer.collapsed .toggle-icon{transform:rotate(180deg)}.drawer-content{max-height:240px;overflow-y:auto;padding:12px;font-family:ui-monospace,SFMono-Regular,monospace;font-size:11px;color:#c9d1d9;border-top:1px solid var(--border-color)}