/* Light remains available; dark uses the same purple accents as the stage. */
:root[data-theme=light]{color-scheme:light}
:root:is([data-theme=dark],[data-theme=colorful]){color-scheme:dark;color:#f3eff8;background:#121016;--purple:#b9a2ff;--muted:#b2aabb;--line:#39313f}
:root:is([data-theme=dark],[data-theme=colorful]) .topbar{background:#19151f}
:root:is([data-theme=dark],[data-theme=colorful]) .brand-logo{filter:brightness(0) invert(1)}
:root:is([data-theme=dark],[data-theme=colorful]) :is(.queue-panel,.discovery,dialog){background:#1c1823;color:#f3eff8;box-shadow:none}
:root:is([data-theme=dark],[data-theme=colorful]) :is(.edition,.version,footer p,.song-info small,.queue-item .position,.playlist-card span){color:#b2aabb}
:root:is([data-theme=dark],[data-theme=colorful]) :is(.source,.queue-footer){background:#211b29;color:#cfc5dc}
:root:is([data-theme=dark],[data-theme=colorful]) :is(.secondary,.row-actions button){background:#211b29;border-color:#4a3e56;color:#e0d6ed}
:root:is([data-theme=dark],[data-theme=colorful]) :is(.secondary:hover:enabled,.row-actions button:hover:enabled){background:#352942}
:root:is([data-theme=dark],[data-theme=colorful]) :is(.primary,.add-button){background:#6847cf;color:#fff}
:root:is([data-theme=dark],[data-theme=colorful]) :is(.primary:hover:enabled,.add-button:hover){background:#7959df}
:root:is([data-theme=dark],[data-theme=colorful]) input{background:#15111c;border-color:#50425f;color:#f3eff8}
:root:is([data-theme=dark],[data-theme=colorful]) input::placeholder{color:#ada2bb}
:root:is([data-theme=dark],[data-theme=colorful]) :is(summary,.stage-note strong){color:#d1c4e0}
:root:is([data-theme=dark],[data-theme=colorful]) summary span{color:#b2aabb}
:root:is([data-theme=dark],[data-theme=colorful]) :is(.count,.queue-empty>span,.setup-guide code){background:#2c223a;color:#cdb8ff}
:root:is([data-theme=dark],[data-theme=colorful]) .queue-item{border-color:var(--line)}
:root:is([data-theme=dark],[data-theme=colorful]) .result-info a{color:#f0e9f8}
:root:is([data-theme=dark],[data-theme=colorful]) .result-info a:hover{color:var(--purple)}
:root:is([data-theme=dark],[data-theme=colorful]) .result-card img{background:#30283a}
:root:is([data-theme=dark],[data-theme=colorful]) .playlist-card{background:#241d2e;color:#eee6f6}
:root:is([data-theme=dark],[data-theme=colorful]) .playlist-card:hover{background:#332640}
:root:is([data-theme=dark],[data-theme=colorful]) .discovery-status{color:#d0bddf}
:root:is([data-theme=dark],[data-theme=colorful]) :is(.search-feedback,.message){background:#2a2037;border-color:#59426e;color:#e1cdef}
:root:is([data-theme=dark],[data-theme=colorful]) .search-feedback[data-state=error]{background:#371c29;border-color:#82435d;color:#ffb5c8}
:root:is([data-theme=dark],[data-theme=colorful]) .form-message.error{color:#ffb5c8}
:root:is([data-theme=dark],[data-theme=colorful]) .yt-label{color:#ff8790}
:root:is([data-theme=dark],[data-theme=colorful]) .version > span:last-child{border-color:#63507e}
:root:is([data-theme=dark],[data-theme=colorful]) dialog{border-color:#4a3e56}
:root:is([data-theme=dark],[data-theme=colorful]) dialog::backdrop{background:#050308b8}
#theme-toggle{white-space:nowrap;flex-shrink:0}
@media(max-width:1250px){.topbar .edition{display:none}}
@media(max-width:790px){.topbar{height:auto;min-height:78px;flex-wrap:wrap;padding-top:10px;padding-bottom:10px;gap:10px}.topbar .source{display:none}.topbar #settings-open{font-size:13px;padding:9px 11px}}
:root:is([data-theme=dark],[data-theme=colorful]) .language-flag:hover{background:#352942}
:root:is([data-theme=dark],[data-theme=colorful]) .language-flag[aria-pressed=true]{background:#39294e;border-color:#b9a2ff;box-shadow:inset 0 0 0 1px #b9a2ff}
:root:is([data-theme=dark],[data-theme=colorful]) :is(.party-panel,.favorites-panel,.guest-card){background:#1c1823}
:root:is([data-theme=dark],[data-theme=colorful]) :is(.singer-fields select,.guest-duet select){background:#15111c;border-color:#50425f;color:#f3eff8}
:root:is([data-theme=dark],[data-theme=colorful]) .turn-card{background:#2c203d;border-color:#715499}

/* Colorful: turquoise, coral and yellow accents over blue-grey surfaces. */
:root[data-theme=colorful]{color-scheme:dark;background:#252e3c;color:#fff;--purple:#70d6df;--muted:#c0cddd;--line:#536278;--surface:#303c4e}
:root[data-theme=colorful] .topbar{background:#344155;border-bottom:3px solid #46bbca}
:root[data-theme=colorful] :is(.queue-panel,.discovery,.party-panel,.favorites-panel,.guest-card,.party-drawer,.faq-list details,dialog,#guest-tabs,.guest-language .language-picker){background:#303c4e;color:#fff}
:root[data-theme=colorful] :is(.primary,.add-button){background:#fc593e;color:#23140f}
:root[data-theme=colorful] :is(.primary:hover:enabled,.add-button:hover){background:#ff806b;color:#23140f}
:root[data-theme=colorful] :is(.secondary,.row-actions button,.source,.queue-footer){background:#39485d;border-color:#667c98;color:#f0f8ff}
:root[data-theme=colorful] :is(.secondary:hover:enabled,.row-actions button:hover:enabled,.playlist-card:hover){background:#465b75}
:root[data-theme=colorful] :is(input,select,.scene-settings-fields select,.scene-settings-fields select option){background:#202b3a;color:#fff;border-color:#71849e}
:root[data-theme=colorful] :is(input::placeholder,.edition,.version,footer p,.song-info small,.queue-item .position,.playlist-card span,summary span){color:#c0cddd}
:root[data-theme=colorful] :is(summary,.stage-note strong){color:#f0f8ff}
:root[data-theme=colorful] :is(.count,.queue-empty>span,.setup-guide code){background:#46bbca;color:#102d34}
:root[data-theme=colorful] :is(.playlist-card,.turn-card){background:#374960;color:#fff;border-color:#70d6df}
:root[data-theme=colorful] .eyebrow{color:#ffea05}
:root[data-theme=colorful] .language-flag[aria-pressed=true]{background:#3b5263;border-color:#70d6df;box-shadow:inset 0 0 0 1px #70d6df}
:root[data-theme=colorful] .empty-player{background:linear-gradient(135deg,#304c64,#343348)}
:root[data-theme=colorful] :is(.empty-symbol,.screen-tag){color:#70d6df}
:root[data-theme=colorful] :is(.search-feedback,.message){background:#344b5b;border-color:#70d6df;color:#eefcff}
:root[data-theme=colorful] .search-feedback[data-state=error]{background:#4e2831;border-color:#ff806b;color:#ffe6e3}
:root[data-theme=colorful] :is(button,a,input,select,summary):focus-visible{outline:3px solid #ffea05;outline-offset:3px}

/* Three icon positions with a sliding thumb and native range interaction. */
.theme-slider{--theme-position:2;position:relative;isolation:isolate;width:102px;height:36px;flex:0 0 102px;border-radius:999px;background:#e7e1ef;box-shadow:inset 0 0 0 1px #c7bdd7}
.theme-slider-thumb{position:absolute;left:3px;top:3px;width:30px;height:30px;border-radius:50%;background:#fff;box-shadow:0 2px 8px #15082640;transform:translateX(calc(var(--theme-position)*34px));transition:transform .22s ease;pointer-events:none}
.theme-slider-icons{position:absolute;inset:0;display:grid;grid-template-columns:repeat(3,1fr);align-items:center;text-align:center;font-size:21px;line-height:1;pointer-events:none}
#theme-toggle[type=range]{position:absolute;inset:-4px 0;width:100%;height:44px;min-height:44px;margin:0;padding:0;border:0;opacity:.001;cursor:pointer;appearance:none;-webkit-appearance:none;touch-action:pan-y}
#theme-toggle[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:34px;height:44px;border:0}
#theme-toggle[type=range]::-moz-range-thumb{width:34px;height:44px;border:0}
.theme-slider:focus-within{outline:3px solid var(--purple);outline-offset:4px}
:root[data-theme=dark] .theme-slider{background:#524074;box-shadow:inset 0 0 0 1px #9881ba}
:root[data-theme=colorful] .theme-slider{background:linear-gradient(110deg,#29dce4,#8866ef 48%,#ff699c);box-shadow:inset 0 0 0 1px #ffffff70,0 0 20px #bb4bff40}
@media(prefers-reduced-motion:reduce){.theme-slider-thumb{transition:none}}
/* Saturated color flows stay outside the video and behind opaque text surfaces. */
:root[data-theme=colorful]{background:#21103d;--purple:#7aeeef;--muted:#ded1ee;--line:#8971b4;--surface:#352052}
:root[data-theme=colorful] body:not(.scene-body){min-height:100vh;background:radial-gradient(ellipse at 0 12%,#007f967d,transparent 52%),radial-gradient(ellipse at 100% 40%,#e72b9266,transparent 55%),linear-gradient(145deg,#102e51 0%,#442074 45%,#63244f 78%,#1d5267 100%);background-attachment:fixed}
:root[data-theme=colorful] .topbar{background:linear-gradient(110deg,#12617a 0%,#59328f 48%,#a42e71 100%);border-bottom:3px solid #6eeef0;box-shadow:0 5px 30px #11072655}
:root[data-theme=colorful] :is(.queue-panel,.discovery,.party-panel,.favorites-panel,.guest-card,.legal-content){background:linear-gradient(135deg,#173f58 0%,#382253 55%,#532249 100%);border-color:#987abd;box-shadow:0 12px 35px #11072645}
:root[data-theme=colorful] :is(.party-drawer,dialog,.guest-language .language-picker,#guest-tabs){background:linear-gradient(130deg,#193c54,#3b2457);color:#fff}
:root[data-theme=colorful] .faq-list details{background:linear-gradient(110deg,#203f59,#442554)}
:root[data-theme=colorful] :is(.primary,.add-button){background:linear-gradient(115deg,#ffd45f 0%,#ff9977 55%,#ff83b6 100%);color:#2b1139;border-color:#ffc7aa;box-shadow:0 3px 12px #ef62952b}
:root[data-theme=colorful] :is(.primary:hover:enabled,.add-button:hover){background:linear-gradient(115deg,#ffe28b,#ffb091,#ff9ecb);color:#2b1139}
:root[data-theme=colorful] :is(.secondary,.row-actions button){background:linear-gradient(120deg,#23516a,#503067);border-color:#a490c5;color:#fff}
:root[data-theme=colorful] :is(.source,.queue-footer){background:linear-gradient(110deg,#223e59,#4b285d);color:#eee7ff}
:root[data-theme=colorful] :is(.count,.queue-empty>span,.setup-guide code){background:linear-gradient(115deg,#66f1dc,#97d8ff);color:#17233a}
:root[data-theme=colorful] :is(.playlist-card,.turn-card){background:linear-gradient(125deg,#205366,#553073);color:#fff}
:root[data-theme=colorful] .empty-player{background:radial-gradient(ellipse at 15% 20%,#00c2bc55,transparent 60%),radial-gradient(ellipse at 90% 75%,#fa438a55,transparent 60%),linear-gradient(130deg,#163952,#512366)}
:root[data-theme=colorful] :is(input,select,.scene-settings-fields select,.scene-settings-fields select option){background:#201b35;color:#fff;border-color:#aa91ce}
:root[data-theme=colorful] :is(input::placeholder,.edition,.version,footer p,.song-info small,.queue-item .position,.playlist-card span,summary span){color:#ded1ee}
:root[data-theme=colorful] .site-footer{border-top:2px solid #a97adc}

.theme-slider-icons{font-size:16px;color:#776786}
.theme-slider-icons>span{display:grid;place-items:center}
.theme-slider-icons svg{width:18px;height:18px;display:block}
:root:is([data-theme=dark],[data-theme=colorful]) .theme-slider-icons{color:#e8deef}
:root[data-theme=light] .theme-slider-icons>span:nth-child(1),:root[data-theme=dark] .theme-slider-icons>span:nth-child(2),:root[data-theme=colorful] .theme-slider-icons>span:nth-child(3){color:#534360}
:root[data-theme=colorful] .theme-slider{background:linear-gradient(110deg,#427c88,#7b63a0 50%,#a96689);box-shadow:inset 0 0 0 1px #c6b3dc80}
.music-notes{display:none;pointer-events:none;position:fixed;inset:0;overflow:hidden;z-index:0;user-select:none}
:root[data-theme=colorful] .music-notes{display:block}
.music-notes span{position:absolute;font-family:Georgia,serif;font-size:clamp(44px,6vw,86px);line-height:1;color:#a0ffff;opacity:.14;transform:rotate(-15deg)}
.music-notes span:nth-child(1){left:1%;top:23%}
.music-notes span:nth-child(2){right:1%;top:46%;color:#ffd092;transform:rotate(16deg)}
.music-notes span:nth-child(3){left:2%;top:76%;color:#ffc1df;transform:rotate(12deg)}
.music-notes span:nth-child(4){right:3%;top:85%;font-size:46px}
@media(max-width:600px){.music-notes span{font-size:42px;opacity:.09}.music-notes span:nth-child(3),.music-notes span:nth-child(4){display:none}}
