:root{--text:#6b6375;--text-h:#08060d;--bg:#fff;--panel-bg:#1a1a1a;--border:#e5e4e7;--sans:system-ui, "Segoe UI", Roboto, sans-serif;font:16px/145% var(--sans);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--text:#9ca3af;--text-h:#f3f4f6;--bg:#16171d;--border:#2e303a}}html,body,#root{height:100%;margin:0}body{overflow:hidden}.app{box-sizing:border-box;flex-direction:column;gap:6px;max-width:1280px;height:100svh;margin:0 auto;padding:10px 20px 14px;display:flex;overflow:hidden}.app-header{text-align:center;flex:none}.app-header h1{color:var(--text-h);margin:0;font-size:22px}.app-header p{margin:2px 0 0;font-size:12.5px}.stage{flex-direction:column;flex:auto;gap:6px;min-height:0;display:flex;overflow:hidden}.app-footer{text-align:center;color:var(--text);opacity:.7;flex:none;padding-top:4px;font-size:11px}.hidden-video,.hidden-canvas{display:none}.gesture-menu{background:var(--panel-bg);border-radius:10px;flex:none;grid-template-columns:repeat(auto-fit,minmax(88px,1fr));gap:4px;padding:6px;display:grid}.gesture-card{text-align:center;color:#ddd;border-top:3px solid #0000;border-radius:4px;padding:4px 4px 6px}.finger-glyph{justify-content:center;gap:4px;height:14px;margin-bottom:3px;display:flex}.finger-dot{border-radius:50%;align-self:center;width:7px;height:7px}.finger-dot.filled{background:#fff}.finger-dot.hollow{border:2px solid #fff;width:9px;height:9px}.gesture-label{color:#fff;font-size:11px;font-weight:600}.gesture-action{color:#aaa;font-size:9.5px}.gesture-hand{letter-spacing:.5px;opacity:.9;margin-top:3px;font-size:8px}.main-row{flex:auto;gap:10px;min-height:0;display:flex;overflow:hidden}.board-area{flex:auto;justify-content:center;align-items:center;min-width:0;min-height:0;display:flex;overflow:hidden}.board-wrap{background:#000;border-radius:12px;flex:none;position:relative;overflow:hidden}.board-canvas{width:100%;height:100%;display:block}.overlay-canvas{pointer-events:none;position:absolute;inset:0}.color-picker{box-sizing:border-box;touch-action:none;background:#282828d9;height:100%;position:absolute;top:0;right:0}.palette-preview{border:2px solid #fff;border-radius:4px;position:absolute}.wheel{cursor:crosshair;background:conic-gradient(from 90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red);border-radius:50%;position:absolute}.wheel:after{content:"";background:radial-gradient(circle,#fff 0%,#fff0 70%);border-radius:50%;position:absolute;inset:0}.wheel-puck{pointer-events:none;border:2px solid #fff;border-radius:50%;width:10px;height:10px;margin:-5px 0 0 -5px;position:absolute;box-shadow:0 0 0 1px #0009}.slider-track{cursor:pointer;border-radius:5px;position:absolute;box-shadow:inset 0 0 0 1px #fff3}.slider-label{color:#0000008c;text-shadow:0 1px 1px #ffffff59;pointer-events:none;font-size:9px;font-weight:700;position:absolute;top:50%;left:4px;transform:translateY(-50%)}.slider-thumb{pointer-events:none;background:#fff;border-radius:3px;width:8px;height:130%;position:absolute;top:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 1px #0009}.hud{color:#fff;pointer-events:none;background:#0000008c;border-radius:6px;flex-direction:column;gap:2px;padding:5px 9px;font-family:ui-monospace,Consolas,monospace;font-size:11px;display:flex;position:absolute;top:8px;left:8px}.flash-toast{color:#fff;background:#000000bf;border-radius:20px;padding:6px 14px;font-size:13px;position:absolute;bottom:14px;left:50%;transform:translate(-50%)}.loading-overlay{color:#fff;text-align:center;background:#000000b3;justify-content:center;align-items:center;padding:16px;font-size:14px;display:flex;position:absolute;inset:0}.loading-overlay.error{color:#ff8080}.shots-panel{background:var(--panel-bg);box-sizing:border-box;border-radius:10px;flex-direction:column;flex:0 0 160px;min-height:0;padding:8px;display:flex}.shots-panel-title{color:#ddd;text-transform:uppercase;letter-spacing:.4px;flex:none;margin-bottom:6px;font-size:11px;font-weight:600}.shots-empty{color:#999;margin:0;font-size:11.5px;line-height:1.4}.shots-list{flex-direction:column;flex:auto;gap:8px;min-height:0;padding-right:2px;display:flex;overflow-y:auto}.shot-thumb{cursor:pointer;background:#000;border:1px solid #ffffff26;border-radius:6px;width:100%;padding:0;display:block;position:relative;overflow:hidden}.shot-thumb:hover{border-color:#ffffff73}.shot-thumb img{width:100%;display:block}.shot-thumb-time{color:#fff;background:#0000008c;border-radius:3px;padding:1px 4px;font-size:9px;position:absolute;bottom:3px;right:4px}.shot-modal-backdrop{box-sizing:border-box;z-index:50;background:#000000bf;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.shot-modal{background:#111;border-radius:12px;flex-direction:column;gap:10px;max-width:90vw;max-height:90vh;padding:12px;display:flex}.shot-modal img{object-fit:contain;border-radius:6px;max-width:100%;max-height:75vh;display:block}.shot-modal-actions{justify-content:flex-end;gap:8px;display:flex}.shot-modal-actions button{font:inherit;color:#fff;cursor:pointer;background:#222;border:1px solid #ffffff40;border-radius:8px;padding:7px 14px}.shot-modal-actions button:hover{border-color:#fff9}.controls{color:var(--text-h);flex-wrap:wrap;flex:none;justify-content:center;align-items:center;gap:14px;font-size:13px;display:flex}.controls select{font:inherit}.controls button{font:inherit;border:1px solid var(--border);background:var(--bg);color:var(--text-h);cursor:pointer;border-radius:8px;padding:7px 14px}.controls button:hover{border-color:#aaa}