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)}.unlock{gap:8px;display:grid}.unlockState{font-size:var(--step--1);color:var(--text-quiet);margin:0}.unlockState b{color:var(--text-strong)}.buyRow{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.linkish{color:var(--text-quiet);font-family:var(--font-ui);font-size:var(--step--2);cursor:pointer;background:0 0;border:0;padding:4px 2px;text-decoration:underline}.linkish:hover{color:var(--text-strong)}.dropActions{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;margin-top:14px;display:flex}.syncPanel{background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--r-md);margin-top:14px;padding:14px 16px}.syncHead{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:12px;display:flex}.syncHead h2{font-family:var(--font-display);font-size:var(--step-0);margin:0}.syncFit{color:var(--text-quiet);font-size:var(--step--2);margin:0}.syncHint{color:var(--text-quiet);font-size:var(--step--1);margin:6px 0 10px}.syncHint kbd{background:var(--bg);border:1px solid var(--border);font-family:var(--font-mono);border-radius:4px;padding:1px 5px;font-size:.9em}.syncRuler{border:1px solid var(--border);border-radius:var(--r-sm) var(--r-sm) 0 0;background:var(--bg);cursor:pointer;border-bottom:none;width:100%;height:20px;display:block}.syncScroll{overscroll-behavior:contain;border:1px solid var(--border);border-radius:0 0 var(--r-sm) var(--r-sm);background:var(--bg);max-height:320px;overflow-y:auto}.syncStrip{touch-action:none;width:100%;display:block}.syncControls{flex-wrap:wrap;align-items:center;gap:10px;margin-top:10px;display:flex}.exportNote{color:var(--text-quiet);font-size:var(--step--2);margin:6px 0 0}.tapNow{color:var(--text-quiet);font-size:var(--step--2)}.tapDeck{border:1px solid var(--accent);border-radius:var(--r-md);background:var(--accent-wash);align-items:center;gap:16px;margin-top:12px;padding:14px;display:flex}.tapHit{border-radius:var(--r-md);background:var(--accent);color:#fff;min-width:120px;font-family:var(--font-display);font-size:var(--step-1);cursor:pointer;border:none;flex-direction:column;flex:none;align-items:center;gap:2px;padding:16px 20px;font-weight:700;display:flex}.tapHit small{font-family:var(--font-mono);font-size:var(--step--2);opacity:.85;font-weight:400}.tapHit:active{transform:translateY(1px)}.tapGuide{flex-direction:column;gap:4px;display:flex}.tapLine{font-size:var(--step--1);margin:0}.tapLine.sub2{color:var(--text-quiet);font-size:var(--step--2)}.tapLine kbd{background:var(--bg);border:1px solid var(--border);font-family:var(--font-mono);border-radius:4px;padding:1px 5px;font-size:.9em}.syncPanel.isTapping .syncScroll{pointer-events:none;opacity:.92}.modes{grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px;display:grid}.mode{text-align:left;border:1px solid var(--border);border-radius:var(--r-md);background:var(--bg-raised);color:var(--text-quiet);font-family:var(--font-ui);cursor:pointer;flex-direction:column;align-items:flex-start;gap:2px;padding:14px 16px;transition:border-color .15s,background .15s,color .15s;display:flex}.mode b{font-family:var(--font-display);font-size:var(--step-0);color:var(--text-strong)}.mode span{font-size:var(--step--2)}.mode:hover{border-color:var(--text-quiet)}.mode.on{border-color:var(--accent);background:var(--accent-wash)}.mode.on span{color:var(--accent)}.mode:focus-visible{outline:2px solid var(--accent);outline-offset:3px}@media (width<=520px){.modes{grid-template-columns:1fr}}.does li{color:var(--text);font-size:var(--step--1);padding-left:22px;position:relative}.head .sub2{color:var(--text-quiet);font-size:var(--step--1);max-width:62ch;margin:0}.does{gap:7px;margin:12px 0 14px;padding:0;list-style:none;display:grid}.does li{font-size:var(--step--1);padding-left:22px;position:relative}.does li:before{content:"";background:var(--accent);border-radius:2px;width:7px;height:7px;position:absolute;top:.6em;left:3px}.head .sub2{max-width:60ch;color:var(--text-quiet);font-size:var(--step--2);margin:0}.status{color:var(--text-quiet);font-size:var(--step--1);margin:0}.lyricsPanel{background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--r-md);padding:12px 16px}.lyricsPanel summary{cursor:pointer;color:var(--text-strong);font-weight:600;font-size:var(--step--1)}.lyricsPanel summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:var(--r-sm)}.lyricsHint{color:var(--text-quiet);font-size:var(--step--1);margin:10px 0 8px}.lyricsPanel textarea{box-sizing:border-box;resize:vertical;background:var(--bg);width:100%;color:var(--text);border:1px solid var(--border);border-radius:var(--r-sm);font:inherit;font-size:var(--step--1);padding:10px 12px;line-height:1.5}.lyricsPanel.taken>summary:after{content:" — using these";color:var(--accent);font-weight:600}.lyricsPanel textarea[readonly]{opacity:.65}.lyricsPanel textarea:focus-visible{border-color:var(--accent);outline:none}.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}
