:root{--accent: #0d9db8;--accent-2: #0b8aa3;--accent-soft: #e7f6f9;--ink: #1c2d36;--muted: #5c7380;--line: #d5e4ea;--bg: #ffffff;--panel: #f4fafb;--danger: #e11d48;--shadow: 0 18px 50px rgba(15, 40, 50, .16);--radius: 16px;font-family:Inter,system-ui,sans-serif;color:var(--ink);background:var(--bg)}:root[data-theme=light]{color-scheme:light}:root[data-theme=dark]{color-scheme:dark;--accent: #2ec4d6;--accent-2: #7ddce8;--accent-soft: #16343b;--ink: #e8f1f4;--muted: #8aa3ad;--line: #2a3e46;--bg: #0e1619;--panel: #152226;--danger: #fb7185;--shadow: 0 18px 50px rgba(0, 0, 0, .5)}*{box-sizing:border-box}html,body,#root,#cine-root{margin:0;height:100%}#cine-root{position:fixed;inset:0;z-index:0;overflow:auto;background:var(--bg,#fff)}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}img{max-width:100%}.btn{border:1px solid transparent;background:var(--accent);color:#fff;border-radius:10px;padding:10px 18px;font-weight:600;transition:background .15s,box-shadow .15s,transform .1s}.btn:hover{background:var(--accent-2)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-ghost{background:#fff;color:var(--ink);border-color:var(--line)}.btn-ghost:hover{background:var(--panel)}.btn-soft{background:var(--accent-soft);color:var(--accent-2)}.btn-danger{background:var(--danger);color:#fff}.icon-btn{width:36px;height:36px;border:0;background:transparent;border-radius:8px;display:grid;place-items:center;color:var(--ink)}.icon-btn:hover{background:var(--accent-soft)}.icon-btn.danger{color:var(--danger)}.home{min-height:100%;display:flex;flex-direction:column;align-items:center;padding:56px 20px 80px}.brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:22px;margin-bottom:36px;letter-spacing:-.03em}.brand svg{width:32px;height:32px}.home-actions{display:flex;flex-direction:column;align-items:center;gap:12px;margin-bottom:36px}.home-actions .btn{min-width:220px;padding:12px 22px;font-size:16px}.recents{width:min(720px,100%);border:1px solid var(--line);border-radius:18px;overflow:hidden}.recents h2{margin:0;padding:16px 20px 12px;font-size:12px;letter-spacing:.12em;color:var(--muted);font-weight:700;border-bottom:1px solid var(--line)}.recent{display:grid;grid-template-columns:1fr auto;gap:12px;padding:16px 20px;border-bottom:1px solid var(--line);align-items:center}.recent:last-child{border-bottom:0}.recent:hover{background:#f8fcfd}.recent button.link{background:none;border:0;padding:0;text-align:left}.recent .name{font-weight:700;font-size:16px}.recent .meta{color:var(--muted);font-size:13px;margin-top:2px}.recent .ops{display:flex;gap:2px}.empty-recents{padding:28px 20px;color:var(--muted);text-align:center}.backdrop{position:fixed;inset:0;background:#08101673;display:grid;place-items:center;z-index:40;padding:20px}.modal{width:min(460px,100%);background:var(--bg);color:var(--ink);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.modal.wide{width:min(560px,100%)}.modal h3{margin:0;padding:20px 22px 8px;font-size:20px}.modal .body{padding:4px 22px 18px;color:var(--muted)}.modal .body p{margin:0 0 10px;line-height:1.45}.modal-foot{background:var(--accent-soft);padding:14px 18px;display:flex;justify-content:flex-end;gap:10px}label.field{display:block;margin:12px 0;font-weight:600;color:var(--ink);font-size:14px}label.field input,label.field select,label.field textarea{display:block;width:100%;margin-top:6px;border:1.5px solid var(--accent);border-radius:10px;padding:10px 12px;outline:none;background:var(--panel);color:var(--ink);font-weight:500;color-scheme:inherit}label.field select option{background:var(--bg);color:var(--ink)}.radios{display:flex;gap:18px;margin-top:8px;font-weight:500}.radios label{display:flex;align-items:center;gap:6px;white-space:nowrap}.drop{margin-top:8px;border:1.5px dashed #9ec9d4;border-radius:12px;padding:28px 16px;text-align:center;color:var(--muted);background:#fbfdfe}.drop strong{color:var(--accent)}.drop.has-file{border-style:solid;color:var(--ink)}.editor{height:100%;display:grid;grid-template-rows:52px 100px minmax(0,1fr) auto;background:#fff}.topbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 12px;border-bottom:1px solid var(--line);gap:12px}.topbar .left,.topbar .right{display:flex;align-items:center;gap:8px}.topbar .right{justify-content:flex-end}.topbar .title{display:flex;align-items:center;gap:8px;font-weight:600;color:var(--ink)}.topbar .title input{border:0;background:transparent;font-weight:600;min-width:180px;text-align:center}.logo-btn{display:flex;align-items:center;gap:8px;border:0;background:none;font-weight:700}.export-btn{padding:8px 16px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 400px;min-height:0;overflow:hidden}.stage{display:grid;grid-template-rows:minmax(0,1fr) auto auto auto auto auto;min-width:0;min-height:0;overflow:hidden}.stage>*{min-width:0}.themes{display:flex;align-items:stretch;gap:10px;padding:10px 14px;overflow-x:auto;overflow-y:hidden;border-bottom:1px solid #f0f4f6;min-width:0}.theme-card{flex:0 0 132px;height:80px;border:2px solid transparent;border-radius:10px;overflow:hidden;position:relative;background:#111;padding:0}.theme-card img,.theme-card .swatch{width:100%;height:100%;object-fit:cover;display:block}.theme-card .swatch{background:linear-gradient(#111,#333)}.theme-card span{position:absolute;left:8px;bottom:6px;color:#fff;font-size:12px;font-weight:600;text-shadow:0 1px 4px #000}.theme-card.active{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.preview-wrap{display:grid;place-items:center;padding:12px 18px 8px;min-height:0}.preview-frame{width:min(100%,920px);aspect-ratio:16 / 9;background:#0b0d12;border-radius:4px;overflow:hidden;position:relative;box-shadow:0 8px 30px #0000001f}.preview-frame.portrait{aspect-ratio:9 / 16;height:100%;width:auto;max-height:100%}.preview-frame canvas{width:100%;height:100%;display:block}.audio-row{display:flex;align-items:center;gap:8px;padding:0 16px 8px;flex-wrap:wrap}.audio-name{font-size:13px;color:var(--muted);margin-right:auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ov-add{padding:6px 10px;font-size:12px}.ov-timeline{border-top:1px solid var(--line);background:#f7fbfc}.ov-timeline-head{display:flex;align-items:center;justify-content:space-between;padding:6px 14px 4px;font-weight:600;font-size:13px;gap:8px}.ov-timeline-head .ops{display:flex;gap:6px}.ov-fold{display:inline-flex;align-items:center;gap:6px;border:0;background:none;padding:2px 0;font-weight:700;color:inherit}.ov-fold:hover{color:var(--accent-2)}.ov-chevron{display:inline-block;font-size:12px;line-height:1;transform:rotate(0);transition:transform .15s ease}.ov-chevron.open{transform:rotate(90deg)}.ov-count{font-size:11px;font-weight:600;color:var(--muted);background:var(--accent-soft);border-radius:999px;padding:1px 7px}.ov-timeline.closed{padding-bottom:4px}.ov-track{position:relative;margin:0 14px 8px;background:#fff;border:1px solid var(--line);border-radius:8px;overflow:hidden;min-height:56px}.ov-clip{position:absolute;height:26px;border-radius:5px;display:flex;align-items:center;padding:0 8px;font-size:11px;font-weight:600;color:#0b3a44;background:#c7eef5;border:1px solid #7ec9d6;cursor:grab;overflow:hidden;box-sizing:border-box;-webkit-user-select:none;user-select:none}.ov-clip.image{background:#fdecc8;border-color:#e0b45a;color:#5c3d08}.ov-clip.on{outline:2px solid var(--accent);z-index:2}.ov-clip-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;pointer-events:none}.ov-clip-edge{position:absolute;top:0;bottom:0;width:8px;cursor:ew-resize}.ov-clip-edge.start{left:0}.ov-clip-edge.end{right:0}.ov-playhead{position:absolute;top:0;bottom:0;width:2px;background:var(--accent);z-index:3;pointer-events:none}.ov-stage{position:absolute;inset:0;z-index:2}.ov-stage.playing{pointer-events:none}.ov-box{position:absolute;box-sizing:border-box;border:1px dashed transparent;cursor:move}.ov-box.on{border:1.5px solid #fff;box-shadow:0 0 0 1px var(--accent),0 8px 24px #00000040}.ov-handle{position:absolute;width:9px;height:9px;background:#fff;border:1.5px solid var(--accent);border-radius:1px;z-index:2}.ov-handle.n{top:-5px;left:50%;transform:translate(-50%);cursor:ns-resize}.ov-handle.s{bottom:-5px;left:50%;transform:translate(-50%);cursor:ns-resize}.ov-handle.e{right:-5px;top:50%;transform:translateY(-50%);cursor:ew-resize}.ov-handle.w{left:-5px;top:50%;transform:translateY(-50%);cursor:ew-resize}.ov-handle.ne{top:-5px;right:-5px;cursor:nesw-resize}.ov-handle.nw{top:-5px;left:-5px;cursor:nwse-resize}.ov-handle.se{bottom:-5px;right:-5px;cursor:nwse-resize}.ov-handle.sw{bottom:-5px;left:-5px;cursor:nesw-resize}.ov-menu{position:absolute;left:50%;top:calc(100% + 10px);transform:translate(-50%);width:248px;background:#101c22f0;color:#eef6f8;border-radius:12px;padding:10px 12px 8px;box-shadow:0 16px 40px #0006;z-index:6;font-size:12px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.ov-box.menu-up .ov-menu{top:auto;bottom:calc(100% + 10px)}.ov-menu-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.ov-menu-top .icon-btn{color:#f8b4c0}.ov-text{width:100%;margin-bottom:8px;border:1px solid #3d5560;background:#0f1c22;color:#fff;border-radius:7px;padding:6px 8px}.ov-row{display:grid;grid-template-columns:54px 1fr auto;gap:6px;align-items:center;margin:5px 0;font-weight:600;color:#c5d5dc}.ov-row select,.ov-row input[type=number]{border:1px solid #3d5560;background:#0f1c22;color:#fff;border-radius:6px;padding:4px 6px;min-width:0}.ov-row input[type=number]{width:58px}.ov-row input[type=range]{width:100%}.ov-row input[type=color]{width:36px;height:22px;padding:0;border:0;background:none}.ov-hint{margin:8px 0 2px;font-size:11px;color:#8aa3ad;font-weight:500}@media(max-width:900px){.ov-menu{width:220px}}.hidden-media{position:absolute;width:8px;height:8px;opacity:.01;pointer-events:none;left:0;top:0}.hint-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:6px 18px 4px;color:var(--muted);font-size:13px}.hint-row span{flex:1;min-width:0}.hint-row .btn{flex-shrink:0;display:inline-flex;align-items:center;gap:6px}.hint-row a{color:var(--accent)}.waveform-wrap{padding:0 16px 4px}.waveform-wrap canvas{width:100%;height:64px;display:block;cursor:pointer}.transport{display:flex;align-items:center;gap:8px;padding:6px 16px 12px}.transport .time{font-variant-numeric:tabular-nums;color:var(--muted);font-size:13px;min-width:92px}.seek{flex:1;appearance:none;height:4px;background:var(--line);border-radius:99px}.seek::-webkit-slider-thumb{appearance:none;width:14px;height:14px;border-radius:50%;background:var(--accent);border:2px solid #fff;box-shadow:0 0 0 1px var(--accent)}.lyrics-panel{border-left:1px solid var(--line);display:grid;grid-template-rows:46px minmax(0,1fr);min-height:0;min-width:0;background:#fff;z-index:3}.lyrics-head{display:flex;align-items:center;justify-content:space-between;padding:0 8px 0 14px;border-bottom:1px solid var(--line);font-weight:600}.lyrics-head .ops{display:flex}.timeline{position:relative;overflow:auto;min-height:0}.timeline-inner{position:relative;min-height:100%}.t-mark{position:absolute;right:8px;font-size:11px;color:#9bb0ba;transform:translateY(-50%)}.lyric-block{position:absolute;left:8px;right:42px;font-size:13px;padding:14px 10px 16px;border-left:3px solid var(--accent);background:#f3fbfd;border-radius:6px;cursor:grab;overflow:hidden;-webkit-user-select:none;user-select:none;display:flex;flex-direction:column;justify-content:center;box-sizing:border-box}.lyric-block:active{cursor:grabbing}.lyric-block .lyric-del{position:absolute;top:2px;right:2px;width:26px;height:26px;opacity:.35}.lyric-block:hover .lyric-del,.lyric-block.active .lyric-del{opacity:1}.untimed-list{list-style:none;padding:0;margin:8px 0 16px}.untimed-list li{display:flex;align-items:center;gap:6px;padding:4px 0;border-bottom:1px solid var(--line)}.untimed-list li span{flex:1;min-width:0}.lyric-block.active{background:#d7f1f6;font-weight:600;z-index:2;box-shadow:0 2px 10px #0d9db82e}.lyric-block .lyric-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lyric-block .t-start,.lyric-block .t-end{position:absolute;font-size:10px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--accent-2);line-height:1;pointer-events:none}.lyric-block .t-start{top:4px;left:8px}.lyric-block .t-end{bottom:4px;right:8px;color:var(--muted)}.lyric-block .edge{position:absolute;left:0;right:0;height:10px;cursor:ns-resize;z-index:1}.lyric-block .edge.start{top:0}.lyric-block .edge.end{bottom:0}.playhead{position:absolute;left:0;right:0;height:2px;background:var(--accent);z-index:2;pointer-events:none}.untimed{padding:16px;color:var(--muted);font-size:13px}.untimed ul{padding-left:16px;margin:8px 0 16px}.untimed li{margin:4px 0;color:var(--ink)}.site-foot{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:8px 12px;padding:6px 12px;line-height:1.45;font-size:12px;color:var(--muted);border-top:1px solid var(--line);text-align:center}.site-foot a{color:var(--accent-2);font-weight:600;text-decoration:none}.site-foot a:hover{text-decoration:underline}.foot-sep{opacity:.55}.timing-list{max-height:360px;overflow:auto;border:1px solid var(--line);border-radius:12px;margin:8px 0 12px}.timing-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--line);color:#9aa8b0}.timing-row:last-child{border-bottom:0}.timing-row.done{color:var(--ink)}.timing-row.now{background:#e7f6fb;color:var(--ink);font-weight:600}.timing-row .times{margin-left:auto;font-variant-numeric:tabular-nums;font-size:13px;color:var(--muted);white-space:nowrap}.hint-center{text-align:center;color:var(--accent-2);font-weight:500;padding:8px 0 4px}input[type=range]{accent-color:var(--accent)}.drawer{position:absolute;top:152px;right:0;bottom:28px;width:min(340px,100%);background:#fff;border-left:1px solid var(--line);box-shadow:var(--shadow);z-index:20;overflow:auto;padding:16px 18px 32px}.drawer h3{margin:0 0 12px}.drawer h4{margin:18px 0 8px;font-size:12px;letter-spacing:.08em;color:var(--muted);text-transform:uppercase}.toggle{display:flex;align-items:center;justify-content:space-between;padding:8px 0;font-size:14px}.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.choice{border:1px solid var(--line);background:#fff;border-radius:10px;padding:8px 10px;text-align:left;font-size:13px}.choice.on{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-2);font-weight:600}.export-progress{height:8px;background:var(--line);border-radius:99px;overflow:hidden;margin:12px 0}.export-progress>div{height:100%;background:var(--accent)}.busy-screen{position:fixed;inset:0;background:#ffffffb8;display:grid;place-items:center;z-index:50;font-weight:600}.kbd{display:inline-block;border:1px solid var(--line);background:#fff;border-radius:6px;padding:1px 6px;font-size:12px;font-weight:600}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%);background:var(--ink);color:#fff;padding:10px 16px;border-radius:10px;z-index:60}.orient-toggle{display:flex;gap:6px;margin-right:8px}.orient-toggle .choice{padding:6px 10px;font-size:12px}.orient-toggle .orient-icon{display:grid;place-items:center;padding:6px 8px;min-width:40px}.orient-choice{display:flex;align-items:center;gap:8px;justify-content:center}.media-well{position:fixed;left:0;top:0;width:360px;height:360px;overflow:hidden;opacity:.02;pointer-events:none;z-index:0}.media-well img{max-width:none;width:auto;height:auto}.ov-menu.portal{position:fixed;z-index:80;transform:none;left:0;top:auto}.ov-lane-label{position:absolute;left:6px;font-size:10px;font-weight:700;color:var(--muted);line-height:26px;width:36px}.ov-layer-hint{font-size:11px;font-weight:500;color:var(--muted);margin-left:8px;margin-right:auto}.ov-box-tag{position:absolute;left:8px;top:6px;font-size:11px;font-weight:700;color:#fff;text-shadow:0 1px 4px #000;pointer-events:none}.ov-box.lyrics-box.on{border-style:dashed}:root[data-theme=dark] .editor,:root[data-theme=dark] .home,:root[data-theme=dark] .lyrics-panel,:root[data-theme=dark] .modal,:root[data-theme=dark] .drawer,:root[data-theme=dark] .recents{background:var(--bg);color:var(--ink)}:root[data-theme=dark] .topbar,:root[data-theme=dark] .themes,:root[data-theme=dark] .ov-timeline,:root[data-theme=dark] .ov-track,:root[data-theme=dark] .btn-ghost,:root[data-theme=dark] .choice{background:var(--panel);color:var(--ink);border-color:var(--line)}:root[data-theme=dark] .lyric-block{background:#1a333a;color:var(--ink)}:root[data-theme=dark] .lyric-block.active{background:#1e4c56}:root[data-theme=dark] .site-foot{color:var(--muted);border-color:var(--line)}:root[data-theme=dark] .modal-foot{background:var(--accent-soft)}:root[data-theme=dark] .modal-foot .btn-ghost{background:var(--panel);color:var(--ink);border-color:var(--line)}:root[data-theme=dark] .drop{background:var(--panel);color:var(--muted);border-color:var(--line)}@media(max-width:900px){.workspace{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) 280px}.lyrics-panel{border-left:0;border-top:1px solid var(--line)}.stage{grid-template-rows:minmax(180px,1fr) auto auto auto auto auto}.theme-card{flex-basis:110px;height:68px}.editor{grid-template-rows:52px 88px minmax(0,1fr) 28px}}
.home-shell{min-height:100%;display:grid;grid-template-columns:minmax(320px,400px) minmax(0,1fr);align-items:stretch}.home-shell>.home{min-width:0;width:100%}.mixtape{position:sticky;top:0;height:100vh;height:100dvh;min-width:0;background:#120e0c;border-right:1px solid var(--line)}.mixtape-frame{display:block;width:100%;height:100%;border:0;background:#1a1412}.home-credit{margin-top:28px;max-width:520px;text-align:center;color:var(--muted);font-size:13px;line-height:1.5;font-weight:500}.home-credit a{color:var(--accent-2);font-weight:650;text-decoration:none}.home-credit a:hover{text-decoration:underline}@media (max-width:980px){.home-shell{grid-template-columns:1fr}.mixtape{position:relative;height:min(720px,68dvh);border-right:0;border-bottom:1px solid var(--line)}}