:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#0b0d10;--fg:#e6e8eb;--muted:#8a929a;--accent:#62d9ff;--panel:#ffffff0a;--border:#ffffff14;--bar-bg:#ffffff0f}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--fg);margin:0;padding:0;font-family:ui-sans-serif,system-ui,-apple-system,Helvetica Neue,sans-serif}#app{justify-content:center;align-items:stretch;gap:16px;height:100%;padding:16px;display:flex}.stage{aspect-ratio:16/9;background:#000;border-radius:12px;flex:1;min-width:0;max-height:calc(100vh - 32px);position:relative;overflow:hidden;box-shadow:0 10px 30px #0006}#video,#overlay{object-fit:contain;width:100%;height:100%;position:absolute;inset:0}#overlay{pointer-events:none}#hud{background:var(--panel);border:1px solid var(--border);border-radius:10px;flex-direction:column;align-self:flex-start;gap:12px;min-width:260px;max-width:320px;max-height:calc(100vh - 32px);padding:12px 14px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;display:flex;overflow-y:auto}.hud-header{letter-spacing:.05em;color:var(--fg);border-bottom:1px solid var(--border);padding-bottom:6px;font-size:13px;font-weight:600}.hud-section{flex-direction:column;gap:6px;display:flex}.hud-section-title{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:11px}.hud-row{justify-content:space-between;align-items:center;gap:10px;display:flex}.label{color:var(--muted)}#hud-fps,#hud-infer,#hud-nodes,#hud-res{color:var(--accent);font-variant-numeric:tabular-nums}.histogram{background:var(--bar-bg);border-radius:4px;align-items:flex-end;gap:1px;height:48px;padding:4px;display:flex}.hist-bar{height:calc(var(--h,0) * 100%);background:linear-gradient(#ff5477,#62d9ff);border-radius:1px;flex:1;min-height:1px;transition:height 80ms linear}.hud-axis{color:var(--muted);justify-content:space-between;font-size:10px;display:flex}.nodebars{background:var(--bar-bg);border-radius:4px;grid-template-columns:repeat(11,1fr);gap:2px;height:28px;padding:4px;display:grid}.node-bar{height:calc(var(--v,0) * 100%);background:linear-gradient(#62d9ff,#ff5477);border-radius:1px;align-self:end;min-height:1px;transition:height .1s linear}.angles{flex-direction:column;gap:4px;display:flex}.angle-row{grid-template-columns:72px 44px 1fr;align-items:center;gap:6px;font-size:11px;display:grid}.angle-dot{vertical-align:middle;background:currentColor;border-radius:50%;width:6px;height:6px;margin-right:4px;display:inline-block}.angle-label{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.angle-value{color:var(--fg);font-variant-numeric:tabular-nums;text-align:right}.angle-value.stale{color:var(--muted);opacity:.5}.angle-spark{background:var(--bar-bg);border-radius:2px;width:100%;height:18px}.source-tabs{background:var(--bar-bg);border-radius:6px;grid-template-columns:1fr 1fr;gap:4px;padding:3px;display:grid}.source-tabs-3{grid-template-columns:1fr 1fr 1fr}.screen-panel{flex-direction:column;gap:8px;padding-top:4px;display:flex}.screen-panel input[type=text]{color:var(--fg);border:1px solid var(--border);background:#ffffff0f;border-radius:4px;padding:6px 8px;font-family:inherit;font-size:11px}.screen-panel input[type=text]:focus{border-color:var(--accent);outline:none}.screen-hint{color:var(--muted);font-size:10px;line-height:1.4}.screen-hint code{color:var(--fg);background:#ffffff14;border-radius:3px;padding:0 4px}.yt-embed-toggle{color:var(--muted);cursor:pointer;align-items:center;gap:4px;font-size:11px;display:inline-flex}.source-tab{cursor:pointer;color:var(--muted);border-radius:4px;justify-content:center;align-items:center;padding:6px 8px;transition:background .1s,color .1s;display:flex}.source-tab input{display:none}.source-tab:has(input:checked){color:var(--accent);background:#62d9ff26}.file-panel{flex-direction:column;gap:8px;padding-top:4px;display:flex}.file-panel input[type=file]{color:var(--muted);font-size:11px}.file-name{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;font-size:11px;overflow:hidden}.file-row{gap:10px}.btn{color:var(--accent);cursor:pointer;background:#62d9ff1f;border:1px solid #62d9ff4d;border-radius:4px;padding:4px 12px;font-family:inherit;font-size:11px}.btn:hover:not(:disabled){background:#62d9ff33}.btn:disabled{opacity:.4;cursor:not-allowed}.btn.recording{color:#ff8690;background:#ff505a33;border-color:#ff505a99;animation:1.2s ease-in-out infinite rec-pulse}@keyframes rec-pulse{0%,to{box-shadow:0 0 #ff505a00}50%{box-shadow:0 0 0 4px #ff505a4d}}.court-canvas{border:1px solid var(--border);background:#00000059;border-radius:4px;width:100%;height:auto;margin-top:4px;display:block}.stage.calibrating{cursor:crosshair}.controls{border-top:1px solid var(--border);padding-top:10px}.controls input[type=range]{flex:1;min-width:0}.slider-val{color:var(--accent);font-variant-numeric:tabular-nums;text-align:right;min-width:32px}@media (max-width:860px){#app{flex-direction:column}#hud{align-self:stretch;max-width:none}}