body{background:var(--bg);color:var(--text);font-family:var(--font-ui);margin:0;line-height:1.6}.wrap{flex-direction:column;gap:22px;max-width:1080px;margin:0 auto;padding:40px 24px 90px;display:flex}.head{flex-direction:column;gap:6px;display:flex}h1{font-family:var(--font-display);letter-spacing:-.03em;font-weight:900;font-size:var(--step-3);color:var(--text-strong);margin:0}.sub{color:var(--text-quiet);max-width:64ch;margin:0}.mono{font-family:var(--font-mono)}.drop{border:2px dashed var(--border);border-radius:var(--r-lg);background:var(--bg-raised);text-align:center;cursor:pointer;flex-direction:column;gap:5px;padding:34px 24px;transition:border-color .15s,background .15s;display:flex}.drop:hover,.drop.over,.drop:focus-visible{border-color:var(--accent);background:var(--accent-wash);outline:none}.drop strong{font-family:var(--font-display);font-size:var(--step-1);color:var(--text-strong)}.drop span{color:var(--text-quiet);font-size:var(--step--1)}.status{color:var(--text-quiet);font-size:var(--step--1);margin:0}.working{background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--r-md);align-items:center;gap:16px;padding:14px 18px;display:flex}.pulse{flex:none;align-items:flex-end;gap:3px;height:26px;display:flex}.pulse i{background:var(--spectrum);transform-origin:bottom;background-size:20px 100%;border-radius:2px;width:4px;height:100%;animation:1.05s ease-in-out infinite bounce;display:block}.pulse i:first-child{animation-delay:0s}.pulse i:nth-child(2){animation-delay:.12s}.pulse i:nth-child(3){animation-delay:.24s}.pulse i:nth-child(4){animation-delay:.36s}.pulse i:nth-child(5){animation-delay:.48s}@keyframes bounce{0%,to{opacity:.55;transform:scaleY(.28)}50%{opacity:1;transform:scaleY(1)}}.workText{flex-direction:column;gap:2px;min-width:0;display:flex}.workText p{margin:0}#statusText{color:var(--text-strong);font-size:.88rem}.sub2{color:var(--text-quiet);font-size:.76rem}.working.done .pulse i{opacity:.5;animation:none;transform:scaleY(.3)}.working.done #statusText{color:var(--ok)}.errorBox{border:1px solid var(--error);border-radius:var(--r-md);background:#ff4d4d14;flex-direction:column;gap:6px;padding:14px 18px;display:flex}.errorBox p{margin:0}#errorText{color:var(--error);font-size:.9rem}.errHint{color:var(--text-quiet);font-size:.78rem}@media (prefers-reduced-motion:reduce){.pulse i{animation-duration:2.4s}}.stage{flex-direction:column;gap:14px;display:flex}canvas{aspect-ratio:16/9;border-radius:var(--r-md);border:1px solid var(--border);background:#000;width:100%;display:block}.controls{align-items:center;gap:14px;display:flex}.play{font-family:var(--font-ui);color:var(--cta-text);background:var(--cta-bg);border-radius:var(--r-pill);cursor:pointer;border:0;min-width:94px;padding:9px 24px;font-size:.92rem;font-weight:600}.play:hover{background:var(--accent-hot)}.scrub{accent-color:var(--accent);flex:1}.time{color:var(--text-timecode);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:.82rem}.looks{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;display:grid}.look{text-align:left;background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--r-md);cursor:pointer;font-family:var(--font-ui);color:var(--text-quiet);flex-direction:column;gap:3px;padding:11px 13px;display:flex}.look:hover{border-color:var(--ink-500)}.look.on{border-color:var(--accent);background:var(--accent-wash)}.look b{font-family:var(--font-display);color:var(--text-strong);font-size:.98rem}.look span{font-size:.76rem;line-height:1.45}.reason{color:var(--spec-3);font-size:.84rem;font-family:var(--font-mono);min-height:1.4em;margin:0}.export{border-top:1px solid var(--border);flex-wrap:wrap;align-items:center;gap:18px;padding-top:4px;display:flex}.export .play{margin-top:14px}.unlock{color:var(--text-quiet);cursor:pointer;align-items:center;gap:8px;margin-top:14px;font-size:.86rem;display:flex}.unlock input{accent-color:var(--accent);width:16px;height:16px}.play:disabled{opacity:.5;cursor:default}.ghost{font-family:var(--font-ui);color:var(--text-quiet);border:1px solid var(--border);border-radius:var(--r-pill);cursor:pointer;background:0 0;margin-top:14px;padding:8px 18px;font-size:.86rem;font-weight:500}.ghost:hover{border-color:var(--accent);color:var(--text-strong)}.exportStatus{flex-direction:column;gap:8px;display:flex}.bar{background:var(--ink-700);border-radius:var(--r-pill);height:6px;overflow:hidden}.fill{background:var(--spectrum);width:0;height:100%;transition:width .2s ease-out}@media (prefers-reduced-motion:reduce){.fill{transition:none}}:focus-visible{outline:2px solid var(--accent);outline-offset:3px}