:root{--blue-50:#edf7ff;--blue-100:#e0f0ff;--blue-500:#0060fd;--blue-600:#004fe5;--blue-700:#0046ca;--neutral-50:#f9fafb;--neutral-200:#e8ecf3;--neutral-300:#d8dee9;--neutral-600:#8394ae;--neutral-700:#566681;--neutral-900:#1f242e;--surface:#fff;--text:var(--neutral-900);--text-secondary:var(--neutral-700);--border:var(--neutral-200);--canvas:var(--neutral-50);--code-bg:var(--neutral-50)}body{background:var(--canvas);color:var(--text);margin:0;font:400 14px/20px Inter,system-ui,sans-serif}header{max-width:1120px;margin:0 auto;padding:32px 16px 8px}h1{margin:0 0 4px;font:600 24px/32px Poppins,system-ui,sans-serif}h2{margin:0 0 8px;font:600 16px/24px Poppins,system-ui,sans-serif}h3{color:var(--text-secondary);margin:12px 0 8px;font:600 12px/16px Inter,system-ui,sans-serif}header p,.hint{color:var(--text-secondary);margin:0}main{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:20px;max-width:1120px;margin:0 auto;padding:16px;display:grid}@media (width<=860px){main{grid-template-columns:minmax(0,1fr)}}.stage-panel{gap:12px;display:grid;position:sticky;top:16px}@media (width<=860px){.stage-panel{position:static}}.stage{aspect-ratio:360/262;background:var(--surface);border:1px solid var(--border);border-radius:16px;overflow:hidden}.stage-actions,.row{flex-wrap:wrap;gap:8px;display:flex}.row{margin-top:8px}.row .input{flex:1;min-width:140px}video{background:var(--surface);border:1px solid var(--border);border-radius:16px;width:100%}.controls{gap:16px;min-width:0;display:grid}.card{background:var(--surface);border:1px solid var(--border);border-radius:16px;min-width:0;padding:20px}.chips{flex-wrap:wrap;gap:8px;display:flex}.chip{border:1px solid var(--neutral-300);background:var(--surface);color:var(--text-secondary);cursor:pointer;border-radius:999px;padding:6px 12px;font:600 12px/16px Inter,system-ui,sans-serif;transition:background .14s,color .14s,border-color .14s}.chip:hover{background:var(--blue-50)}.chip[aria-pressed=true]{background:var(--blue-50);border-color:var(--blue-500);color:var(--blue-500)}.btn{background:var(--blue-500);color:#fff;cursor:pointer;border:0;border-radius:999px;height:40px;padding:0 20px;font:600 14px/20px Inter,system-ui,sans-serif;transition:background .14s}.btn:hover{background:var(--blue-600)}.btn:active{background:var(--blue-700)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-secondary{background:var(--blue-50);color:var(--blue-500)}.btn-secondary:hover{background:var(--blue-100)}.input{box-sizing:border-box;border:1px solid var(--neutral-300);background:var(--surface);width:100%;color:var(--text);resize:vertical;border-radius:12px;padding:10px 14px;font:400 14px/20px Inter,system-ui,sans-serif}.input:focus{border-color:var(--blue-500);box-shadow:0 0 0 3px var(--blue-100);outline:none}.cues{background:var(--code-bg);border:1px solid var(--border);white-space:pre-wrap;word-break:break-word;border-radius:12px;margin:12px 0 0;padding:12px;font:12px/18px ui-monospace,SFMono-Regular,Menlo,monospace;overflow-x:auto}