:root{--bg:#05060c;--glass:#0e101c9e;--glass-strong:#0e101ce6;--line:#ffffff1f;--text:#eef0f7;--muted:#a3a8bd;--accent:#8ab4ff;--ok:#4ade80;--warn:#fbbf24;--demo:#f0abfc;--manual:#7dd3fc;--radius:14px;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);--safe-right:env(safe-area-inset-right,0px);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:var(--text);background:var(--bg);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}html,body,#root{background:var(--bg);overscroll-behavior:none;height:100%;margin:0;overflow:hidden}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.app{touch-action:manipulation;position:fixed;inset:0;overflow:hidden}.stage{position:absolute;inset:0}.visual-canvas{width:100%;height:100%;display:block}.camera-feed{object-fit:cover;opacity:0;background:#000;width:100%;height:100%;transition:opacity .4s;position:absolute;inset:0}.camera-feed.visible{opacity:1}.camera-feed.mirrored{transform:scaleX(-1)}.top-bar{top:calc(10px + var(--safe-top));left:calc(12px + var(--safe-left));right:calc(12px + var(--safe-right));pointer-events:none;justify-content:space-between;align-items:center;gap:8px;transition:opacity .35s;display:flex;position:absolute}.top-bar>*{pointer-events:auto}.top-actions{align-items:center;gap:6px;display:flex}.source-badge{background:var(--glass);border:1px solid var(--line);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:999px;align-items:center;gap:8px;min-width:0;max-width:min(60vw,420px);padding:7px 12px;font-size:13px;display:inline-flex}.source-badge .label{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.source-badge .dot{background:var(--muted);border-radius:50%;flex:none;width:8px;height:8px}.source-badge.mic .dot,.source-badge.file .dot{background:var(--ok);box-shadow:0 0 8px var(--ok)}.source-badge.demo .dot{background:var(--demo)}.source-badge.manual .dot{background:var(--manual)}.offline-pill{border:1px solid var(--line);background:var(--glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);white-space:nowrap;border-radius:999px;padding:7px 12px;font-size:12px}.offline-pill.ok{color:var(--ok)}.offline-pill.pending,.offline-pill.warn{color:var(--warn)}.offline-pill.idle{color:var(--muted)}.net-off{color:var(--warn)}.icon-btn{border:1px solid var(--line);background:var(--glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;place-items:center;min-width:40px;height:40px;padding:0 8px;font-size:18px;display:inline-grid}.icon-btn:hover{background:#282c46bf}.notices{top:calc(60px + var(--safe-top));z-index:3;flex-direction:column;gap:8px;width:min(560px,100% - 24px);display:flex;position:absolute;left:50%;transform:translate(-50%)}.notice{border-radius:var(--radius);background:var(--glass-strong);border:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 12px;padding:10px 14px;font-size:14px;display:flex}.notice.warn{border-color:#fbbf2473}.notice.subtle{background:var(--glass);color:var(--muted);font-size:13px}.notice button,.btn{border:1px solid var(--line);white-space:nowrap;background:#8ab4ff29;border-radius:10px;padding:7px 12px}.notice-actions{flex-wrap:wrap;gap:6px;display:flex}.welcome{border:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);text-align:center;background:#080a148c;border-radius:20px;width:min(620px,100% - 24px);max-height:calc(100% - 220px);padding:22px;position:absolute;top:50%;left:50%;overflow-y:auto;transform:translate(-50%,-55%)}.welcome h1{letter-spacing:.01em;margin:0 0 4px;font-size:clamp(22px,4vw,30px);font-weight:650}.welcome p{color:var(--muted);margin:0 0 16px}.welcome .privacy{margin:14px 0 0;font-size:13px}.welcome-grid{grid-template-columns:repeat(4,1fr);gap:10px;display:grid}.big-choice{border-radius:var(--radius);border:1px solid var(--line);background:#ffffff0d;flex-direction:column;align-items:center;gap:6px;padding:16px 8px;transition:background .2s,transform .2s;display:flex}.big-choice:hover{background:#8ab4ff24;transform:translateY(-1px)}.big-choice svg{width:26px;height:26px}.big-choice span{color:var(--muted);font-size:12px}.dock{left:50%;bottom:calc(12px + var(--safe-bottom));background:var(--glass);border:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:18px;flex-direction:column;gap:8px;width:min(980px,100% - 24px);padding:10px;transition:opacity .35s,transform .35s;display:flex;position:absolute;transform:translate(-50%)}.dock-row{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.spacer{flex:1}.chip{border:1px solid var(--line);white-space:nowrap;background:#ffffff0a;border-radius:12px;align-items:center;gap:6px;height:40px;padding:0 12px;font-size:14px;display:inline-flex}.chip.on{background:#8ab4ff38;border-color:#8ab4ff8c}.chip.stop{color:#fca5a5}.chip:disabled{opacity:.6}.scene-picker{scrollbar-width:none;scroll-snap-type:x proximity;background:#00000040;border-radius:13px;flex:100%;align-items:center;gap:4px;min-width:0;padding:3px;display:flex;overflow-x:auto}.scene-picker::-webkit-scrollbar{display:none}.scene-sep{background:var(--line);flex:none;width:1px;height:22px;margin:0 4px}.scene-btn{scroll-snap-align:start;height:36px;color:var(--muted);white-space:nowrap;text-overflow:ellipsis;background:0 0;border:0;border-radius:10px;flex:1 0 auto;justify-content:center;align-items:center;gap:6px;min-width:0;padding:0 10px;font-size:13px;display:inline-flex;overflow:hidden}.scene-btn.analyzer:not(.active){color:#8f95ab}.scene-btn.active{color:var(--text);background:#ffffff1f}.scene-swatch{border-radius:50%;flex:none;width:12px;height:12px}.scene-swatch.prismatic-flow{background:linear-gradient(135deg,#3a6df0,#8a5cf6,#4fd1c5)}.scene-swatch.spectral-garden{background:linear-gradient(135deg,#2bb673,#a3e635)}.scene-swatch.resonance-halo{background:radial-gradient(circle,#0000 35%,#7dd3fc 40%,#c4b5fd 70%)}.scene-swatch.spectrum-bars{background:linear-gradient(90deg,#2563eb 0 22%,#0000 22% 39%,#22d3ee 39% 61%,#0000 61% 78%,#e0f2fe 78%);border-radius:2px}.scene-swatch.oscilloscope{background:radial-gradient(circle,#4ade80 30%,#16a34a 60%,#0000 62%)}.scene-swatch.level-meters{background:linear-gradient(0deg,#0ea5e9 0 45%,#a78bfa 45% 80%,#f87171 80%);border-radius:2px}.scene-swatch.spectrogram{background:linear-gradient(#fef9c3,#0d9488,#1e3a8a);border-radius:2px}.scene-swatch.radial-spectrum{background:conic-gradient(#6366f1,#38bdf8,#f5f3ff,#38bdf8,#6366f1)}.intensity{color:var(--muted);align-items:center;gap:8px;margin-right:auto;padding:0 4px;font-size:13px;display:inline-flex}.intensity input{width:120px;accent-color:var(--accent)}.bpm-control{align-items:center;gap:4px;display:inline-flex}.bpm-value{text-align:center;font-variant-numeric:tabular-nums;min-width:36px}.ui-hidden .dock,.ui-hidden .top-bar,.ui-hidden .notices .subtle{opacity:0;pointer-events:none}.ui-hidden .top-bar>*,.ui-hidden .dock *{pointer-events:none}.ui-hidden .dock{transform:translate(-50%,12px)}.ui-hidden{cursor:none}.panel-backdrop{z-index:10;background:#00000059;position:absolute;inset:0}.panel{width:min(400px,100%);padding:calc(16px + var(--safe-top)) calc(18px + var(--safe-right)) calc(24px + var(--safe-bottom)) 18px;background:var(--glass-strong);border-left:1px solid var(--line);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);position:absolute;top:0;bottom:0;right:0;overflow-y:auto}.panel-head{justify-content:space-between;align-items:center;display:flex}.panel h2{margin:0;font-size:20px}.panel h3{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:20px 0 8px;font-size:13px}.panel .hint{color:var(--muted);margin:8px 0;font-size:13px;line-height:1.45}.segmented{background:#0000004d;border-radius:12px;gap:4px;padding:3px;display:flex}.segmented button{height:36px;color:var(--muted);background:0 0;border:0;border-radius:9px;flex:1}.segmented button.active{color:var(--text);background:#ffffff1f}.toggle{border-bottom:1px solid var(--line);cursor:pointer;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;display:flex}.toggle span{flex-direction:column;gap:2px;display:flex}.toggle small{color:var(--muted);font-size:12px}.toggle input{width:20px;height:20px;accent-color:var(--accent);flex:none}.offline-state{font-size:14px;line-height:1.45}.progress{background:#ffffff1a;border-radius:3px;height:6px;overflow:hidden}.progress div{background:var(--accent);height:100%;transition:width .15s}.panel-actions{flex-wrap:wrap;gap:8px;margin:10px 0;display:flex}.sheet-backdrop{z-index:10;position:absolute;inset:0}.sheet{left:50%;bottom:calc(12px + var(--safe-bottom));background:var(--glass-strong);border:1px solid var(--line);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-radius:18px;width:min(720px,100% - 24px);max-height:min(62%,560px);padding:14px 16px 10px;position:absolute;overflow-y:auto;transform:translate(-50%)}.sheet .panel-head{gap:10px}.sheet h2{margin:0 auto 0 0;font-size:18px}.sheet .hint{color:var(--muted);margin:8px 0 2px;font-size:12px}.master-toggle{color:var(--muted);cursor:pointer;align-items:center;gap:8px;font-size:13px;display:inline-flex}.master-toggle input,.effect-name input{width:18px;height:18px;accent-color:var(--accent);flex:none}.preset-row{flex-wrap:wrap;gap:6px;margin:12px 0 10px;display:flex}.preset-row .chip{height:34px;font-size:13px}.effect-list{grid-template-columns:1fr 1fr;gap:2px 18px;display:grid}.effect-list.bypassed{opacity:.5}.effect-row{border-bottom:1px solid var(--line);flex-direction:column;gap:6px;min-width:0;padding:8px 0;display:flex}.effect-name{cursor:pointer;align-items:center;gap:10px;display:flex}.effect-name span{flex-direction:column;min-width:0;display:flex}.effect-name small{color:var(--muted);font-size:12px}.effect-row input[type=range]{width:100%;accent-color:var(--accent)}.effect-row:not(.on) input[type=range],.effect-row:not(.on) .segmented{opacity:.45}.segmented.small button{height:28px;font-size:12px}.milkdrop-row{flex-wrap:nowrap}.preset-name{border:1px solid var(--line);text-align:left;background:#00000040;border-radius:12px;flex-direction:column;flex:auto;justify-content:center;align-items:flex-start;min-width:0;height:40px;padding:0 12px;display:flex}.preset-name .name,.preset-pick .name{white-space:nowrap;text-overflow:ellipsis;max-width:100%;font-size:13px;overflow:hidden}.preset-name small,.preset-pick small{max-width:100%;color:var(--muted);white-space:nowrap;text-overflow:ellipsis;font-size:11px;overflow:hidden}.icon-btn.fav{color:var(--muted)}.icon-btn.fav.on{color:#fde047}.browser-tools{flex-wrap:wrap;align-items:center;gap:10px 16px;margin:10px 0;display:flex}.browser-tools input[type=search]{border:1px solid var(--line);height:36px;color:var(--text);font:inherit;background:#0000004d;border-radius:10px;flex:220px;padding:0 12px;font-size:14px}.preset-list{grid-template-columns:1fr 1fr;gap:4px 12px;margin:0;padding:0;list-style:none;display:grid}.preset-list li{align-items:center;gap:6px;min-width:0;display:flex}.preset-list li.empty{color:var(--muted);grid-column:1/-1;padding:12px 0;font-size:13px}.preset-pick{text-align:left;background:0 0;border:1px solid #0000;border-radius:10px;flex-direction:column;flex:auto;align-items:flex-start;min-width:0;padding:6px 10px;display:flex}.preset-pick:hover{background:#ffffff0f}.preset-list li.current .preset-pick{background:#8ab4ff2e;border-color:#8ab4ff73}.scene-btn.get{color:var(--accent);flex:none}.scene-swatch.milkdrop{background:conic-gradient(#f0abfc,#8ab4ff,#fde047,#4ade80,#f0abfc)}.top-left{flex-direction:column;align-items:flex-start;gap:6px;min-width:0;display:flex}.song-pill{background:var(--glass);border:1px solid var(--line);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);pointer-events:auto;border-radius:999px;align-items:center;gap:8px;max-width:min(70vw,520px);padding:6px 8px 6px 12px;font-size:13px;display:inline-flex}.song-pill .label{white-space:nowrap;text-overflow:ellipsis;min-width:0;overflow:hidden}.song-pill small{color:var(--muted)}.song-pill .note{color:var(--ok)}.song-pill.setlist .note{color:var(--manual)}.song-pill.listening{color:var(--muted);font-size:12px}.pill-btn{border:1px solid var(--line);background:#ffffff0f;border-radius:999px;flex:none;padding:3px 9px;font-size:12px}.lyrics{left:50%;bottom:calc(190px + var(--safe-bottom));text-align:center;pointer-events:none;z-index:2;text-shadow:0 2px 12px #000000d9,0 0 2px #000000e6;width:min(900px,100% - 24px);transition:bottom .35s;position:absolute;transform:translate(-50%)}.ui-hidden .lyrics{bottom:calc(40px + var(--safe-bottom))}.lyrics p{margin:.25em 0}.lyrics .current{font-size:1.6em;font-weight:650}.lyrics .prev,.lyrics .next,.lyrics-hint{color:#eef0f799;font-size:1em}.lyrics-s{font-size:14px}.lyrics-m{font-size:18px}.lyrics-l{font-size:24px}.lyrics-nudge{color:var(--muted);pointer-events:auto;text-shadow:none;align-items:center;gap:8px;margin-top:6px;font-size:12px;display:inline-flex}.lyrics-nudge button{border:1px solid var(--line);background:var(--glass);border-radius:8px;padding:3px 8px;font-size:12px}.lyrics.plain{left:auto;right:calc(12px + var(--safe-right));top:calc(64px + var(--safe-top));text-align:left;pointer-events:auto;border-radius:var(--radius);border:1px solid var(--line);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#080a148c;flex-direction:column;width:min(340px,100% - 24px);max-height:45%;padding:10px 12px;display:flex;bottom:auto;transform:none}.lyrics-head{color:var(--muted);margin-bottom:6px;font-size:12px}.lyrics-scroll{white-space:pre-line;line-height:1.45;overflow-y:auto}.library-panel{width:min(560px,100%)}.panel h4{margin:14px 0 4px;font-size:13px}.panel .hint.small{font-size:12px}.warn-text{color:var(--warn)!important}.tabs{margin-top:18px}.song-list{margin:8px 0 0;padding:0;list-style:none}.song-list>li{border-bottom:1px solid var(--line)}.song-list>li.playing .song-row .name{color:var(--ok)}.song-row{text-align:left;background:0 0;border:0;flex-direction:column;align-items:flex-start;gap:2px;width:100%;padding:10px 4px;display:flex}.song-row small{color:var(--muted);font-size:12px}.song-editor{padding:4px 4px 12px}.field-row{grid-template-columns:1fr 1fr;gap:8px;display:grid}.field-row label{color:var(--muted);flex-direction:column;gap:4px;font-size:12px;display:flex}.field-row input,.text-input,.cue-list input{border:1px solid var(--line);height:34px;color:var(--text);font:inherit;background:#0000004d;border-radius:9px;min-width:0;padding:0 10px;font-size:14px}.text-input{flex:160px}select.text-input{width:100%;margin:6px 0}.cue-list,.setlist-songs{flex-direction:column;gap:6px;margin:8px 0;padding:0;list-style:none;display:flex}.cue-list li,.setlist-songs li{align-items:center;gap:6px;min-width:0;display:flex}.cue-list .cue-time{flex:none;width:76px}.cue-list .cue-label{flex:none;width:110px}.cue-list small{min-width:0;color:var(--muted);white-space:nowrap;text-overflow:ellipsis;flex:1;font-size:11px;overflow:hidden}.setlist-songs li span{white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:0;font-size:13px;overflow:hidden}.btn.danger{color:#fca5a5}.btn:disabled{opacity:.5}.setlist-row{flex-wrap:nowrap}.preset-name.static{cursor:default}.diagnostics{left:calc(12px + var(--safe-left));top:calc(60px + var(--safe-top));pointer-events:none;z-index:2;background:#0009;border-radius:10px;padding:8px 10px;font-size:11px;position:absolute}.diagnostics pre{white-space:pre;margin:0 0 6px;font-family:ui-monospace,Consolas,monospace}@media (max-width:720px){.welcome-grid{grid-template-columns:repeat(2,1fr)}.hide-sm{display:none}.intensity input{width:90px}.intensity span,.chip:not(.keep-label) span{display:none}.chip{padding:0 10px}.scene-picker{flex-basis:100%}.scene-btn{padding:0 6px;font-size:12px}.scene-swatch{display:none}.effect-list,.preset-list{grid-template-columns:1fr}.hide-xs{display:none}.lyrics{bottom:calc(230px + var(--safe-bottom))}.song-pill{max-width:62vw}.notices{top:calc(58px + var(--safe-top))}.source-badge{max-width:52vw}}@media (max-height:500px){.welcome{top:calc(52px + var(--safe-top));max-height:calc(100% - 170px);padding:12px;transform:translate(-50%)}.welcome h1,.welcome>p:not(.privacy){display:none}.welcome-grid{grid-template-columns:repeat(4,1fr)}.big-choice{padding:8px 4px}.big-choice span{display:none}.dock{gap:4px;padding:6px}.scene-picker{flex:1 1 0}.intensity{margin-right:0}.sheet{max-height:calc(100% - 24px)}}@media (prefers-reduced-motion:reduce){*{transition:none!important}}
