:root{color-scheme:dark;--bg:#11151c;--panel:#1a2029;--panel-hi:#202834;--line:#333c49;--text:#f6f7f9;--muted:#adb7c6;--accent:#d5f46c;--ink:#1c2710;--warn:#f4ce82;font-family:Inter,"Avenir Next",Avenir,system-ui,sans-serif;font-size:16px;line-height:1.5;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}[hidden]{display:none!important}a{color:inherit;text-underline-offset:4px}button,input,select{font:inherit}button,.button{border:1px solid var(--line);border-radius:8px;background:var(--panel-hi);color:var(--text);padding:12px 20px;min-height:48px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:16px;font-weight:600;text-decoration:none;transition:background .15s,transform .15s}button:hover,.button:hover{background:#303d4c}button:active{transform:translateY(1px)}button:disabled{opacity:.4;cursor:not-allowed;transform:none}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--accent);outline-offset:4px}input,select{width:100%;background:#10161e;color:var(--text);border:1px solid #536171;border-radius:8px;padding:12px 16px;min-height:48px}input::placeholder{color:#94a0b0}label{display:block;font-size:.875rem;font-weight:600;margin:16px 0 8px}input[type=checkbox]{width:20px;min-height:20px;margin:0;accent-color:var(--accent)}h1,h2,h3,p{margin:0}h1{font-size:clamp(2.5rem,5vw,5rem);line-height:1.06;font-weight:650;letter-spacing:-.045em}h2{font-size:1.25rem;line-height:1.3;letter-spacing:-.02em;font-weight:650}p{margin:16px 0}.muted{color:var(--muted)}.small{font-size:.875rem}.eyebrow{font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}.primary{background:var(--accent);border-color:var(--accent);color:var(--ink)}.primary:hover{background:#e4ff92}.primary span{margin-left:auto}.wide{width:100%;margin-top:16px;justify-content:space-between}.subtle{background:transparent}.text-button{border:0;background:transparent;padding:8px;min-width:40px;color:var(--muted);font-size:.875rem}.icon-button{padding:8px 16px;font-size:1.5rem}.danger{color:#ffb4b1}.loading{padding:40px;color:var(--muted)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.topbar{min-height:96px;border-bottom:1px solid var(--line);padding:24px 40px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{font-size:1.75rem;letter-spacing:-.06em;font-weight:750;display:flex;align-items:center;gap:8px;text-decoration:none;white-space:nowrap}.brand-dot{background:var(--accent);color:var(--ink);font-weight:800;font-size:1rem;letter-spacing:-.06em;width:32px;height:32px;display:grid;place-items:center;border-radius:50%;margin-right:8px}.brand-period{color:var(--accent);margin-left:-8px}.home{max-width:1320px;margin:0 auto;padding:72px 48px 64px;display:grid;grid-template-columns:1.2fr 1fr;gap:96px}.home-intro{padding-top:24px}.home-intro h1{font-size:clamp(3.5rem,6vw,6rem);margin:32px 0;line-height:1.04}.home-intro em{font-style:normal;color:var(--accent)}.home-intro>p{font-size:1.25rem;color:var(--muted)}.home-note{border-top:1px solid var(--line);margin-top:48px;padding-top:24px;line-height:2.2;color:var(--muted);font-size:.875rem}.home-note span{font-variant-numeric:tabular-nums;color:var(--accent);margin-right:16px}.entry-panel{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:32px;align-self:start}.entry-heading h2{font-size:1.75rem;margin:8px 0 24px}.entry-divider{height:1px;background:var(--line);margin:32px 0}.entry-panel>.eyebrow+h2{margin-top:8px}.entry-panel .primary{min-height:56px}.join-code-form,.inline-form,.search-form{display:flex;align-items:center;gap:8px;margin-top:16px}.join-code-form input{letter-spacing:.2em;text-transform:uppercase;min-width:0}.join-code-form button{white-space:nowrap}.recent{display:flex;justify-content:space-between;gap:16px;padding:8px 0;font-size:.875rem}.recent span{color:var(--muted)}#recent-rooms{margin-top:24px}footer{padding:24px 48px;color:var(--muted);font-size:.875rem;border-top:1px solid var(--line)}.room-heading{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}.room-heading strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.connection{color:var(--accent);font-size:.75rem}.connection:before{content:'●';margin-right:8px;font-size:.65rem}.connection.offline{color:var(--warn)}.top-actions{display:flex;align-items:center;gap:16px}.code-pill{color:var(--muted);font-variant-numeric:tabular-nums;letter-spacing:.12em;font-size:.75rem;border:1px solid var(--line);padding:8px 16px;border-radius:32px;white-space:nowrap}.host-layout{max-width:1800px;margin:auto;padding:32px 40px 64px;display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:32px}.stage-column{min-width:0}.stage-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.stage{background:#0b0f15;min-height:400px;border:1px solid var(--line);border-radius:16px;overflow:hidden;display:flex;align-items:stretch}.intro{padding:56px 40px;min-height:432px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;width:100%}.intro h1{max-width:960px;margin:24px 0 8px;font-size:clamp(2.8rem,5vw,5.5rem);overflow-wrap:anywhere;color:var(--accent)}.intro p{font-size:1.25rem;max-width:640px;overflow-wrap:anywhere}.intro>.eyebrow{color:var(--muted)}#video-area{width:100%;aspect-ratio:16/9;min-height:270px;position:relative;align-self:center}#video-area iframe{display:block;width:100%;height:100%;min-height:270px;border:0;position:absolute;inset:0}.current-caption{padding:16px 0;font-size:1.1rem;overflow-wrap:anywhere}.transport{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:16px}.transport button{flex-shrink:0}.check{display:flex;align-items:center;gap:8px;font-size:.875rem;margin:8px;color:var(--muted);font-weight:400;cursor:pointer}.check:first-of-type{margin-left:auto}.section-title{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}.upcoming-panel{margin-top:40px}.upcoming{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.upcoming li{display:flex;gap:16px;align-items:center;padding:16px;background:var(--panel);border:1px solid var(--line);border-radius:8px;min-width:0}.upcoming li:first-child{border-color:#778c46}.upcoming li>div{display:flex;flex-direction:column;min-width:0}.upcoming strong,.upcoming li>div>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.upcoming li>div>span{font-size:.875rem;color:var(--muted)}.order{font-size:.875rem;font-variant-numeric:tabular-nums;color:var(--muted);min-width:24px}.next-pill{font-size:.65rem;letter-spacing:.1em;font-weight:750;color:var(--accent);margin-left:auto}.qr-panel{border:1px solid var(--line);border-radius:16px;background:var(--panel);padding:24px;text-align:center}.qr-panel h2{font-size:1.5rem;margin:8px 0 24px}.qr-panel img{display:block;margin:auto;max-width:100%;height:auto;background:white;border-radius:8px;min-height:160px}.qr-panel p{font-size:.875rem;color:var(--muted)}.qr-panel a{font-size:.875rem}.room-code{display:block;font-size:1.5rem;letter-spacing:.2em;color:var(--accent);margin:24px 0 0;font-variant-numeric:tabular-nums}.people-panel{margin-top:32px}.count{min-width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:var(--panel-hi);color:var(--muted);font-size:.75rem;padding:0 4px}.person{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}.avatar{height:40px;width:40px;border-radius:50%;background:var(--panel-hi);color:var(--accent);display:grid;place-items:center;flex-shrink:0}.person>div{display:flex;flex-direction:column;min-width:0;flex:1}.person strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.875rem}.inline-form input{min-width:0;font-size:.875rem}.inline-form button{padding:8px 16px}.song-desk,.saved-panel{border-top:1px solid var(--line);padding-top:32px;min-width:0}.song-desk{max-width:100%}.song-desk form#add-song{margin-top:24px}.song-desk .wide{max-width:100%}.search-form input{min-width:0}.search-form button{white-space:nowrap}.song-row,.favorite,.search-result{display:flex;align-items:center;gap:16px;padding:16px 0;border-bottom:1px solid var(--line)}.song-row>div:not(.row-actions),.favorite>div,.search-result>div{flex:1;min-width:0;display:flex;flex-direction:column}.song-row strong,.favorite strong,.search-result strong{font-size:.95rem;overflow-wrap:anywhere}.row-actions{display:flex;gap:4px}.row-actions button{padding:8px;min-width:40px;min-height:40px}.queue-title{margin-top:32px}.empty{color:var(--muted);padding:24px 0;font-size:.875rem}.favorite{gap:8px}.favorite button{padding:8px 12px}.help{margin-top:32px;font-size:.875rem;color:var(--muted)}.help p{line-height:1.65}.history-panel{margin-top:24px;color:var(--muted);font-size:.875rem}.history-panel p{padding:8px 0;border-bottom:1px solid var(--line)}summary{cursor:pointer;min-height:40px;padding:8px 0}#close-room{margin-top:24px}.warning{border:1px solid #76603c;background:#2b251b;color:#f8d89b;border-radius:8px;padding:16px;font-size:.875rem;margin:16px 0}.warning a{font-weight:700;display:inline-block;margin-top:8px}.topbar+.warning{margin:16px 40px}.demo-player{height:100%;min-height:400px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px;text-align:center}.demo-time{font-size:6rem;font-variant-numeric:tabular-nums;font-weight:600;color:var(--accent);letter-spacing:-.04em}.demo-player progress{width:min(320px,100%);height:8px;accent-color:var(--accent)}.guest-layout{max-width:1040px;padding:40px;margin:auto;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:32px}.guest-welcome{grid-column:1/-1;padding:16px 0 32px;border-bottom:1px solid var(--line)}.guest-welcome h1{font-size:clamp(2.5rem,5vw,4rem);margin:16px 0;overflow-wrap:anywhere}.guest-welcome>p{font-size:1.125rem;color:var(--accent)}.guest-now{font-size:.875rem;color:var(--muted);margin:24px 0;overflow-wrap:anywhere}.guest-welcome .subtle{padding:8px 16px;font-size:.875rem}.guest-layout .song-desk,.guest-layout .saved-panel{border:0;padding-top:0}.guest-layout .section-title{align-items:start}.guest-layout .saved-panel>.section-title{flex-direction:column;gap:4px}.join-panel,.closed{max-width:600px;margin:0 auto;padding:72px 40px}.join-panel h1{margin:24px 0}.join-panel>p,.closed>p{color:var(--muted);font-size:1.125rem}.join-panel form{margin-top:32px}.back-link{display:inline-block;margin-top:32px;font-size:.875rem;color:var(--muted)}.closed h1{margin-top:24px}.closed .button{margin-top:24px}#toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--text);color:var(--bg);padding:16px 24px;border:1px solid #ddd;border-radius:8px;max-width:min(640px,calc(100vw - 32px));z-index:100;font-size:.95rem;box-shadow:0 8px 40px #0008}
@media(min-width:1500px){.stage{min-height:560px}.intro{min-height:560px}.host-layout{grid-template-columns:minmax(0,1fr) 360px}.qr-panel img{width:240px;height:240px}}
@media(max-width:1100px){.host-layout{padding:24px;grid-template-columns:minmax(0,1fr) 272px;gap:24px}.topbar{padding:24px}.home{gap:48px;padding:48px 32px}.intro{padding:40px 24px;min-height:360px}.stage{min-height:360px}.check:first-of-type{margin-left:8px}.upcoming{grid-template-columns:1fr}.qr-panel{padding:24px 16px}.qr-panel>.eyebrow{font-size:.65rem}.qr-panel img{width:192px;height:192px}.row-actions{gap:0}.song-row{gap:8px}}
@media(max-width:760px){.topbar{padding:16px;min-height:80px;gap:16px;flex-wrap:wrap}.topbar>.muted{display:none}.brand{font-size:1.5rem}.brand-dot{width:24px;height:24px;font-size:.875rem;margin-right:0}.room-heading{order:3;width:100%;flex-basis:100%;flex-direction:row;justify-content:space-between}.room-heading strong{font-size:.875rem;max-width:65%}.top-actions{margin-left:auto}.code-pill{padding:8px;font-size:.65rem}.home{display:flex;flex-direction:column;gap:32px;padding:24px 24px 40px}.home-intro{padding-top:8px}.home-intro h1{font-size:3.5rem;margin:24px 0}.home-intro>p{font-size:1.125rem}.home-note{display:none}.entry-panel{padding:24px;width:100%}.entry-heading h2{font-size:1.5rem}.host-layout{display:flex;flex-direction:column;padding:24px 16px;gap:32px}.stage{min-height:240px}.intro{min-height:280px;padding:32px 24px}.intro h1{font-size:2.5rem}.intro p{font-size:1rem}.stage-top{gap:16px}.stage-top .eyebrow{font-size:.65rem}.transport button{flex:1;font-size:.875rem;padding:12px}.transport .check{margin:8px 4px;font-size:.75rem}.upcoming-panel{margin-top:32px}.section-title{gap:8px}.section-title h2{font-size:1.125rem}.section-title .small{font-size:.75rem}.room-sidebar{display:grid;grid-template-columns:1fr;gap:24px}.qr-panel{padding:24px}.people-panel{margin-top:0}.guest-layout{display:flex;flex-direction:column;padding:24px 20px;gap:40px}.guest-welcome{padding:8px 0 24px}.guest-welcome .eyebrow{font-size:.65rem}.guest-welcome h1{font-size:2.5rem}.guest-layout .saved-panel{border-top:1px solid var(--line);padding-top:24px}.guest-layout .saved-panel>.section-title{gap:8px}.join-panel,.closed{padding:48px 24px}.join-panel h1,.closed h1{font-size:3rem}.song-row{gap:8px}.row-actions button{min-width:36px}.search-form button{padding:12px 16px}footer{padding:24px}.demo-player{min-height:270px;padding:24px}.demo-time{font-size:4rem}.demo-player>p{font-size:.875rem;margin:8px 0}.topbar+.warning{margin:16px}.empty{padding:16px 0}#video-area,#video-area iframe{min-height:200px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
.search-status{color:var(--muted);margin:20px 0 16px}.search-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.video-card{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--panel);min-width:0;align-self:start}.video-card.is-preferred{border-color:var(--accent)}.video-cover{position:relative;aspect-ratio:16/9;background:#0b0f15}.video-cover img{display:block;width:100%;height:100%;object-fit:cover}.video-duration{position:absolute;right:8px;bottom:8px;background:#000d;color:#fff;padding:2px 6px;border-radius:4px;font-size:.75rem}.preferred-label{position:absolute;top:12px;left:12px;background:var(--accent);color:var(--ink);padding:4px 8px;font-size:.65rem;letter-spacing:.06em;font-weight:800;border-radius:4px}.video-info{padding:16px}.video-info h3{font-size:1rem;line-height:1.4;overflow-wrap:anywhere}.video-info>p{font-size:.75rem;color:var(--muted);margin:8px 0 16px;min-height:36px}.video-actions{display:flex;flex-wrap:wrap;gap:8px}.video-actions button{flex:1;padding:10px 12px;font-size:.8rem;white-space:nowrap;gap:8px}.preference-button[aria-pressed=true]{color:var(--accent);border-color:#778c46}.video-options{margin-top:12px;font-size:.75rem;color:var(--muted)}.video-options summary{min-height:36px}.video-options button{font-size:.75rem;width:100%;padding:10px;margin-bottom:8px;text-align:left;justify-content:start;font-weight:500}.video-options a{display:inline-block;padding:8px 0}#manual-song{border-top:1px solid var(--line);margin-top:24px;padding-top:12px}#manual-song>summary{font-size:.875rem;color:var(--muted)}#hidden-results{margin-top:20px;color:var(--muted);font-size:.875rem}.hidden-video{display:flex;gap:16px;align-items:center;justify-content:space-between;padding:16px 0;border-bottom:1px solid var(--line)}.hidden-video>div{display:flex;flex-direction:column;min-width:0}.hidden-video strong{overflow-wrap:anywhere;font-size:.875rem}.hidden-video button{font-size:.75rem;padding:8px 12px}.guest-layout{max-width:1240px;grid-template-columns:minmax(0,2fr) minmax(240px,1fr)}
@media(max-width:1100px){.search-grid{grid-template-columns:1fr}.video-actions button{flex-basis:auto}.guest-layout{grid-template-columns:minmax(0,1.5fr) minmax(230px,1fr)}}
@media(max-width:760px){.search-grid{grid-template-columns:1fr}.video-info{padding:16px}.video-actions button{min-height:48px}.video-options summary{min-height:44px}.video-info>p{min-height:0}.hidden-video{gap:12px}}
/* The stage keeps its own information strip outside the embedded video. */
.stage{position:relative;display:grid;place-items:center;aspect-ratio:16/9;min-height:320px;background:#000}
#video-area{width:100%;height:100%;min-height:0;aspect-ratio:auto;position:absolute;inset:0}
#video-area iframe{min-height:0}
#video-fade{position:absolute;inset:0;background:#000;pointer-events:none;opacity:1;z-index:1}
.intro{position:absolute;inset:0;z-index:2;background:#000;min-height:0;padding:32px;overflow:auto}
.intro h1{font-size:clamp(2rem,4.5vw,5.5rem)}
.stage-dock{display:flex;align-items:center;gap:20px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px;margin-top:12px;min-width:0}
.stage-dock>img{flex-shrink:0;background:white;border-radius:6px;width:88px;height:88px}
.stage-dock-copy{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}
.stage-dock-copy strong{font-size:clamp(1.1rem,2.2vw,2rem);line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stage-dock-copy>span:last-child{color:var(--muted);font-size:.875rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stage-dock-actions{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.stage-dock-actions button{font-size:.75rem;padding:6px 12px;min-height:36px}
#exit-stage{display:none}
.stage-mode{overflow:hidden}
.stage-mode .topbar,.stage-mode .host-layout> :not(.stage-column),.stage-mode .stage-column> :not(.stage):not(.stage-dock):not(#claim-panel):not(.stage-roster):not(.stage-invite):not(.stage-tools):not(.stage-access){display:none}
.stage-mode .stage-column{position:fixed;inset:0;z-index:50;background:#000;display:grid;grid-template-rows:minmax(0,1fr) auto;gap:0;padding:0;overflow:hidden}
.stage-mode .stage{aspect-ratio:auto;min-height:0;border:0;border-radius:0;width:100%;height:100%}
.stage-mode .stage-dock{margin:0;border:0;border-top:1px solid var(--line);border-radius:0;padding:12px 24px}
.stage-mode #exit-stage{display:inline-flex}
.stage-mode #claim-panel:not([hidden]){position:absolute;top:12px;left:24px;right:24px;z-index:5}
.stage-mode .intro{padding:24px}
.remote-controls{grid-column:1/-1;border:1px solid var(--line);background:var(--panel);border-radius:12px;padding:24px}
.remote-transport{display:flex;gap:8px}.remote-transport>button{flex:1}
.master-controls{margin-top:16px;font-size:.875rem}.master-controls>summary{color:var(--muted)}
.master-buttons{display:flex;gap:8px;flex-wrap:wrap}.master-buttons button{font-size:.8rem;flex:1;padding:10px}
.jump-controls{display:flex;gap:8px}.jump-controls select{min-width:0;flex:1}.jump-controls button{font-size:.875rem;white-space:nowrap}
.person{flex-wrap:wrap}.person .moderator-toggle{margin-left:52px;margin-top:-8px;padding:0;min-height:32px}.moderator-toggle[aria-pressed=true]{color:var(--accent)}
.song-metadata{font-size:.75rem;color:var(--muted)}.song-row:has(details[open]){align-items:start}.song-row:has(details[open]) .row-actions{flex-direction:column}
.metadata-list{font-size:.875rem;overflow-wrap:anywhere}.metadata-list dt{color:var(--muted);font-size:.75rem;margin-top:8px}.metadata-list dd{margin:0;color:var(--text)}
.rename-song input{font-size:.875rem;padding:8px}.rename-song button{font-size:.75rem;margin-top:8px;min-height:40px;padding:8px 12px}
@media(max-width:760px){.stage{min-height:280px}.stage-dock{padding:12px;gap:12px;flex-wrap:wrap}.stage-dock>img{width:72px;height:72px}.stage-dock-actions{width:100%;flex-direction:row;align-items:center;justify-content:space-between}.stage-dock-actions>.small{font-size:.65rem}.stage-dock-actions button{min-height:44px;padding:6px 8px}.stage-mode .stage-dock{padding:8px 12px}.stage-mode .stage-dock>img{width:64px;height:64px}.stage-mode .stage-dock-copy{flex-basis:calc(100% - 88px)}.stage-mode .stage-dock-actions{margin-top:0}.stage-mode .intro h1{font-size:clamp(1.5rem,7vw,3rem)}.stage-mode .intro p{font-size:.875rem;margin:8px 0}.remote-controls{padding:20px}.master-buttons{flex-direction:column}.jump-controls{flex-wrap:wrap}.jump-controls>select{flex-basis:100%}.jump-controls button{width:100%}}
@media(max-height:500px) and (orientation:landscape){.stage-mode .stage-dock{padding:6px 16px;flex-wrap:nowrap}.stage-mode .stage-dock>img{width:64px;height:64px}.stage-mode .stage-dock-copy{flex-basis:auto}.stage-mode .stage-dock-actions{width:auto;flex-direction:row}.stage-mode .stage-dock-actions>.small{display:none}.stage-mode .intro h1{font-size:2rem;margin:8px 0}.stage-mode .intro p{margin:4px 0;font-size:.875rem}}
.song-timeline{width:100%;min-width:0;margin-top:12px}.timeline-times{display:flex;align-items:center;gap:12px;justify-content:space-between;color:var(--muted);font-size:.75rem;font-variant-numeric:tabular-nums}.timeline-caption{flex:1;text-align:center}.timeline-times>span:not(.timeline-caption){min-width:42px}.timeline-duration{text-align:right}.song-timeline input[type=range]{display:block;appearance:none;-webkit-appearance:none;width:100%;min-height:44px;height:44px;margin:0;padding:0;border:0;background:transparent;accent-color:var(--accent);cursor:pointer;touch-action:pan-y}.song-timeline input[type=range]::-webkit-slider-runnable-track{height:6px;background:#596577;border-radius:9px}.song-timeline input[type=range]::-moz-range-track{height:6px;background:#596577;border-radius:9px}.song-timeline input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:var(--accent);border:2px solid var(--panel);margin-top:-7px}.song-timeline input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--accent);border:2px solid var(--panel)}.song-timeline input:disabled{opacity:.45;cursor:default}.timeline-note{margin:0;font-size:.75rem}.stage-dock-copy #dock-title{color:var(--muted);font-size:.875rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stage-dock .song-timeline{margin-top:6px}.stage-dock .timeline-caption{display:none}.stage-dock .timeline-note{font-size:.65rem}.stage-mode .stage-dock .timeline-note{display:none}.guest-welcome .song-timeline{margin:20px 0 16px}
@media(max-width:760px){.stage-dock .timeline-note{display:none}.stage-dock .song-timeline{margin-top:4px}.stage-dock .timeline-times{font-size:.65rem}}
.turn-recovery{border-top:1px solid var(--line);margin-top:24px;padding-top:24px}.turn-recovery .master-buttons{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:8px}.turn-recovery .warning{overflow-wrap:anywhere}
/* Permanent groups and account dialogs share the control's compact layout. */
.profile-actions,.group-actions,.pagination{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.profile-actions{font-size:.875rem}.my-groups{grid-column:1/-1;min-width:0}.my-groups .section-title{flex-wrap:wrap}#groups-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:24px}.group-card{border:1px solid var(--line);border-radius:16px;padding:24px;background:var(--panel);min-width:0}.group-card h3{font-size:1.5rem;margin-top:12px;overflow-wrap:anywhere}.group-card p{color:var(--muted)}.group-actions .button,.group-actions button{flex:1}.group-tools{display:flex;flex-direction:column;align-items:stretch;gap:8px;margin-bottom:32px}.group-tools .button,.group-tools button{font-size:.875rem}.invite-form button{margin-top:12px}.account-dialog,.group-dialog{color:var(--text);background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:32px;width:calc(100% - 32px);max-width:480px;max-height:calc(100dvh - 32px);overflow:auto}.group-dialog{max-width:760px}.account-dialog::backdrop,.group-dialog::backdrop{background:#000b}.account-dialog h2,.group-dialog h2{font-size:1.75rem;padding-right:24px;margin:8px 0 24px}.account-dialog input{margin-top:8px}.dialog-close{position:absolute;right:12px;top:12px;min-width:44px;min-height:44px;padding:4px;background:transparent;border:0;font-size:1.5rem}.form-error{color:#ffb4b1;font-size:.875rem;overflow-wrap:anywhere}.account-switch{width:100%;margin-top:12px}.session-row{display:flex;flex-direction:column;align-items:flex-start;text-align:left;width:100%;gap:4px;margin-bottom:12px}.session-row span{font-size:.875rem;color:var(--muted)}.pagination{margin-top:24px}.performance,.member-row{border-bottom:1px solid var(--line);padding:20px 0}.performance>strong,.performance>span,.member-row>div>span{display:block}.performance strong{overflow-wrap:anywhere}.performance>span{margin-top:4px}.performance details{font-size:.875rem;margin-top:8px}.member-row{display:flex;flex-direction:column;gap:12px}.member-actions{display:flex;gap:8px;flex-wrap:wrap}.member-actions button{font-size:.8rem;padding:8px 12px}.invitation-image{display:block;margin:auto;max-width:100%;height:auto;border-radius:8px}#qr-status{display:block;margin-top:16px}.closed .saved-panel{border:0;max-width:420px;margin:32px auto 0}.closed .group-actions{justify-content:center;max-width:680px;margin:24px auto}.closed .group-actions button{flex:0 1 auto}.group-dialog h3{margin-top:24px}
@media(max-width:760px){.profile-actions{justify-content:flex-end;gap:0;max-width:180px}.profile-actions button{font-size:.75rem;padding:8px}.account-dialog,.group-dialog{padding:24px}.group-actions{flex-direction:column;align-items:stretch}.member-actions button{flex:1}.my-groups{grid-column:auto}}
.search-list{border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-top:12px;background:var(--panel)}
.search-list>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;height:48px;min-height:48px;padding:0 12px;font-size:.875rem;font-weight:600;list-style:none}
.search-list>summary::-webkit-details-marker{display:none}
.search-collapse-label{color:var(--accent);font-size:.75rem;font-weight:500}
.search-list[open] .when-closed,.search-list:not([open]) .when-open{display:none}
.search-scroll{max-height:calc(50vh - 50px);max-height:calc(50dvh - 50px);overflow-y:auto;overscroll-behavior-y:contain;scrollbar-gutter:stable;padding:0 8px 8px;scroll-padding:8px}
.search-list .search-grid{grid-template-columns:minmax(0,1fr);gap:8px}
.search-list .video-card{display:grid;grid-template-columns:104px minmax(0,1fr);gap:6px 12px;padding:12px;border-radius:8px}
.search-list .video-cover{grid-column:1;grid-row:1 / span 2;align-self:start;border-radius:6px;overflow:hidden}
.search-list .video-info{display:contents}
.search-list .video-info h3{grid-column:2;margin:0;font-size:.875rem;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.search-list .video-info>p{grid-column:2;min-height:0;margin:0;font-size:.7rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.search-list .video-actions{grid-column:1 / -1;display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:4px}
.search-list .video-actions button{min-height:44px;font-size:.75rem;padding:8px;white-space:normal}
.search-list .video-options{grid-column:1 / -1;margin:0}
.search-list .video-options summary{min-height:36px;padding:8px 0;font-size:.75rem}
.search-list .preferred-label{top:4px;left:4px;font-size:.55rem;padding:3px 4px;letter-spacing:0}
.search-list .video-duration{right:4px;bottom:4px;font-size:.65rem;padding:1px 4px}
.screen-controls{margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.screen-controls>button{width:100%}.screen-controls>p{margin:8px 0 0}
.screen-controls>button.subtle{margin-top:12px}
@media(max-width:480px){.search-list .video-card{grid-template-columns:88px minmax(0,1fr);gap:6px 8px;padding:10px}.search-scroll{padding:0 6px 6px}}
.intro.over-video{background:#0006;text-shadow:0 2px 16px #000,0 1px 4px #000;animation:applause-arrives .65s ease-out both}
@keyframes applause-arrives{from{opacity:0}to{opacity:1}}
/* Compact stage chrome. Frost the backing surface, never the scannable code. */
.glass{background:rgba(19,25,34,.76);border:1px solid #ffffff24;box-shadow:0 8px 32px #0003;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.stage-column{position:relative}
.stage-roster{display:flex;flex-direction:column;align-items:flex-start;gap:6px;border-radius:20px;padding:12px 16px;margin-top:12px;max-width:100%;width:max-content}
.stage-avatars{display:flex;align-items:center;max-width:100%;padding-right:4px;overflow-x:auto;scrollbar-width:none;min-height:64px}
.round-avatar{display:grid;place-items:center;position:relative;flex:0 0 40px;width:40px;height:40px;margin-left:-20px;border-radius:50%;border:2px solid #222b35;background:hsl(var(--avatar-hue) 32% 28%);color:#fff;font-size:16px;font-weight:650;animation:round-arrive .45s ease both}
.round-avatar.is-singer{width:60px;height:60px;flex-basis:60px;margin-left:0;margin-right:24px;border:2px solid var(--accent);font-size:26px;box-shadow:0 0 0 4px #d8fa6514}
.round-avatar.is-singer + .round-avatar{margin-left:0;width:44px;height:44px;flex-basis:44px}
.stage-roster-copy{display:grid;gap:3px;max-width:100%}.stage-roster-copy strong{font-size:16px;overflow-wrap:anywhere}.stage-roster-copy .eyebrow{font-size:9px}.stage-roster-copy .small{font-size:11px}
.stage-invite{position:absolute;right:20px;bottom:90px;z-index:8;display:flex;align-items:center;flex-direction:column;gap:10px;padding:16px;border-radius:20px;text-align:center}
.stage-invite img{width:160px;height:160px;border-radius:8px;background:white}.stage-invite strong{font-size:22px;letter-spacing:.15em}.stage-invite .small{font-size:11px;line-height:1.5}
.stage-dock{position:relative;display:block;padding:12px 16px 4px;margin-top:12px;border-radius:12px;min-height:60px}
.stage-dock-copy{position:absolute;left:16px;right:150px;top:12px;display:block}.stage-dock-copy #dock-title{display:block;color:#fff;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stage-dock .song-timeline{margin:0}.stage-dock .timeline-times{height:20px;justify-content:flex-end;gap:6px}.stage-dock .timeline-position:after{content:' /';margin-left:6px}.stage-dock .timeline-times>span{min-width:0}.stage-dock .timeline-caption,.stage-dock .timeline-note{display:none}.stage-dock .song-timeline input[type=range]{height:28px;min-height:28px}.stage-dock .song-timeline input[type=range]::-webkit-slider-runnable-track{height:3px}.stage-dock .song-timeline input[type=range]::-webkit-slider-thumb{height:10px;width:10px;margin-top:-3.5px;border:0}
.stage-tools{display:flex;flex-wrap:wrap;gap:6px;padding:8px;border-radius:16px;margin-top:12px}.stage-tools button{min-height:40px;padding:8px 12px;font-size:12px;background:transparent;border-color:transparent}.stage-tools button:hover{background:#ffffff18}
.stage-mode .stage-column{display:block}
.stage-mode .stage-column>.stage-roster,.stage-mode .stage-column>.stage-tools{display:flex}
.stage-mode .stage-column>.stage-invite:not([hidden]){display:flex}
.stage-mode .stage-roster{position:absolute;top:16px;right:20px;z-index:4;margin:0;max-width:calc(100% - 40px)}
.stage-mode .stage-dock{position:absolute;bottom:0;left:0;right:0;padding:12px 24px 4px;min-height:60px;border:0;border-top:1px solid #ffffff14;background:#131922b8;z-index:4}
.stage-mode .stage-dock-copy{left:24px;right:150px;top:12px}
.stage-mode .stage-tools{position:absolute;left:16px;top:50%;transform:translate(-12px,-50%);flex-direction:column;margin:0;z-index:10;opacity:0;visibility:hidden;transition:opacity .3s,transform .3s,visibility .3s}
.stage-mode .controls-awake .stage-tools,.stage-mode .stage-tools:focus-within,.stage-mode .stage-tools:hover{opacity:1;visibility:visible;transform:translate(0,-50%)}
.stage-mode .stage-column:not(.controls-awake){cursor:none}.stage-mode .stage-tools{cursor:auto}
.stage-mode .layout-fit{display:grid;grid-template-rows:160px minmax(0,1fr) 64px}
.stage-mode .layout-fit .stage{grid-row:2;min-height:0}.stage-mode .layout-fit .stage-dock{grid-row:3;position:relative}.stage-mode .layout-fit .stage-roster{top:8px;padding:8px 16px}.stage-mode .layout-fit .stage-invite{bottom:80px}
@keyframes round-arrive{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:translateX(0)}}
@media(prefers-reduced-motion:reduce){.round-avatar{animation:none}.stage-mode .stage-tools{transition:none}}
@media(max-width:760px){.stage-mode .stage-roster{right:10px;top:10px;max-width:calc(100% - 20px)}.stage-roster-copy .small{max-width:80vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.stage-mode .stage-dock{padding:12px 12px 4px}.stage-mode .stage-dock-copy{left:12px;right:120px}.stage-invite{right:12px;bottom:76px}.stage-invite img{width:128px;height:128px}.stage-mode .stage-tools{left:8px;max-height:calc(100% - 24px);overflow:auto}.stage-mode .layout-fit{grid-template-rows:160px minmax(0,1fr) 60px}}
/* Receive the first pointer movement even when a cross-origin video fills the stage. */
.stage-mode .stage-column:not(.controls-awake) .stage:after{content:'';position:absolute;inset:0;z-index:3}

/* A compact two-line roster and one right-hand control cluster. */
.stage-roster,.stage-mode .layout-fit .stage-roster{padding:8px 10px;gap:4px;border-radius:12px}
.stage-avatars{min-height:34px;padding-right:2px}
.round-avatar{width:22px;height:22px;flex-basis:22px;margin-left:-12px;font-size:10px;border-width:1px}
.round-avatar.is-singer{width:32px;height:32px;flex-basis:32px;margin-right:12px;font-size:14px;box-shadow:none}
.round-avatar.is-singer + .round-avatar{width:24px;height:24px;flex-basis:24px}
.stage-roster-copy{display:flex;align-items:baseline;gap:6px;white-space:nowrap;min-width:0;width:100%;line-height:16px}
.stage-roster-copy strong{font-size:12px;overflow:hidden;text-overflow:ellipsis;min-width:0;max-width:40%;flex-shrink:0}
.stage-roster-copy .small{font-size:10px;min-width:0;overflow:hidden;text-overflow:ellipsis}.stage-roster-copy .small:before{content:'· ';}
.stage-access{display:flex;flex-direction:column;align-items:flex-end;gap:8px;margin-top:12px}
.stage-access .stage-invite{position:static}.stage-access .stage-tools{margin:0}
.stage-mode .stage-column>.stage-access{display:flex;position:absolute;right:20px;bottom:80px;z-index:10;max-height:calc(100% - 168px);max-width:calc(100% - 40px);margin:0;pointer-events:none}
.stage-mode .stage-access .stage-invite,.stage-mode .stage-access .stage-tools{pointer-events:auto;position:static;flex-shrink:0}
.stage-mode .stage-access .stage-tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:224px;gap:2px;padding:6px;transform:translateY(6px);overflow:auto;max-width:100%;max-height:none}
.stage-mode .controls-awake .stage-access .stage-tools,.stage-mode .stage-access .stage-tools:focus-within,.stage-mode .stage-access .stage-tools:hover{transform:translateY(0)}
.stage-access .stage-tools button{gap:4px;padding:6px 8px;min-height:36px;font-size:12px;white-space:nowrap}.stage-access #stage-play{color:var(--accent)}
.stage-mode .layout-fit{grid-template-rows:84px minmax(0,1fr) 64px}
@media(max-width:760px){.stage-mode .stage-column>.stage-access{right:10px;bottom:72px;max-width:calc(100% - 20px)}.stage-mode .layout-fit{grid-template-rows:84px minmax(0,1fr) 60px}}
@media(max-height:580px){.stage-mode .stage-column>.stage-access{max-height:calc(100% - 150px);overflow-y:auto}.stage-access .stage-invite img{width:96px;height:96px}.stage-access .stage-invite{padding:10px;gap:4px}.stage-access .stage-invite .small{display:none}}
/* Phone workspace: one panel at a time, no promotional sections. */
.compact-topbar{height:56px;min-height:56px;padding:8px 16px;gap:12px;position:relative;background:var(--bg)}
.compact-brand{font-size:15px;font-weight:700;text-decoration:none;white-space:nowrap;letter-spacing:-.03em}
.profile-avatar{width:34px;height:34px;min-height:34px;padding:0;border-radius:50%;background:#2c3941;color:var(--accent);margin-left:auto;flex-shrink:0;font-size:13px}
.compact-session{font-size:12px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted)}
.compact-home #app{max-width:720px;margin:auto}.compact-home-main{display:block;max-width:720px;margin:auto;padding:16px;min-height:0}.home-greeting{font-size:16px;margin:0 0 16px;font-weight:500}
.home-tabs{display:flex;gap:8px;margin-bottom:20px;border-bottom:1px solid var(--line)}.home-tabs button{flex:1;border:0;border-radius:0;background:transparent;min-height:44px;font-size:14px;padding:8px}.home-tabs button[aria-pressed=true]{box-shadow:inset 0 -2px var(--accent);color:var(--accent)}
.home-entry-actions{display:flex;gap:8px;margin-bottom:24px}.home-entry-actions button{flex:1;font-size:13px;gap:8px;padding:10px;min-height:44px}
.compact-home .entry-panel{padding:16px;margin-bottom:20px}.compact-home .my-groups{grid-column:auto;margin:0;padding:0;border:0}.compact-home h2{font-size:15px}.compact-home .section-title{margin-bottom:8px}.compact-home #groups-list{display:block}.compact-group{display:flex;align-items:center;padding:12px 0;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;gap:8px;margin:0}.group-open{flex:1;min-width:0;text-decoration:none;display:flex;flex-direction:column;gap:4px}.group-open strong{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.group-open .small{font-size:12px}
.compact-icon{height:44px;min-height:44px;width:44px;min-width:44px;display:inline-flex;align-items:center;justify-content:center;padding:0;gap:0;border-radius:10px;font-size:20px;text-decoration:none}.compact-icon svg{display:block}.compact-icon[aria-pressed=true]{border-color:var(--accent);color:var(--accent);background:#d8fa6512}
.phone-view{height:100dvh;overflow:hidden}.phone-view #app{height:100%;display:flex;flex-direction:column;max-width:820px;margin:0 auto}.phone-view #network-warning{flex-shrink:0;margin:0;padding:8px 16px;font-size:12px;border-radius:0}.phone-view .compact-topbar{flex-shrink:0}
.phone-view .phone-layout{flex:1;min-height:0;display:grid;grid-template-rows:minmax(0,1fr) auto;grid-template-columns:minmax(0,1fr);padding:0;margin:0;gap:0;max-width:none;width:100%;overflow:hidden}
.phone-tabs{grid-row:2;display:flex;gap:0;padding:0 8px max(4px,env(safe-area-inset-bottom));background:var(--bg);border-top:1px solid var(--line);z-index:2}.phone-tabs button{flex:1;min-width:0;font-size:12px;font-weight:600;min-height:50px;padding:8px 4px;border:0;background:transparent;border-radius:0}.phone-tabs button[aria-selected=true]{color:var(--accent);box-shadow:inset 0 2px var(--accent)}
.phone-panel{grid-row:1;grid-column:1;padding:16px;overflow-y:auto;min-width:0;min-height:0;overscroll-behavior:contain;scrollbar-width:thin}.phone-panel[hidden]{display:none!important}
.round-now{display:flex;flex-direction:column;gap:6px;padding:0 0 16px;border-bottom:1px solid var(--line);margin-bottom:16px}.round-now strong{font-size:17px;line-height:1.4}.round-now .small{font-size:12px}.compact-section-title{font-size:13px;color:var(--muted);margin:0 0 8px}
.compact-song-list{list-style:none;padding:0;margin:0}.compact-song-list li{display:flex;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line);font-size:13px}.compact-song-list li>div{display:flex;flex-direction:column;gap:4px;min-width:0}.compact-song-list strong{font-weight:550;overflow-wrap:anywhere}.compact-song-list li>div>span{color:var(--muted);font-size:12px}.round-history{margin-top:16px;font-size:12px}.round-history p{line-height:1.6;font-size:12px;margin:8px 0}
.phone-view .guest-welcome{padding:0;border:0;grid-column:auto}.phone-view .guest-now{font-size:16px;line-height:1.4;margin:0 0 12px;color:var(--text);font-weight:600}.phone-view .guest-welcome .song-timeline{margin:0}.phone-view .timeline-times{font-size:11px}.phone-view .timeline-caption,.phone-view .timeline-note{display:none}.phone-view .song-timeline input[type=range]{height:36px;min-height:36px}
.phone-view .remote-controls{padding:0;border:0;border-radius:0;background:transparent}.phone-transport{display:flex;justify-content:space-between;gap:8px;margin:4px 0 8px}.phone-more{font-size:13px}.phone-more:not([open]){height:0;margin:0}.phone-more .turn-recovery{margin:12px 0;padding:12px}.phone-more h2{font-size:15px}.phone-more p{font-size:12px}.phone-master{display:flex;gap:8px;flex-wrap:wrap}.phone-master button{font-size:12px;padding:8px;min-height:40px}.phone-instruction-link{font-size:11px;padding:4px 0;min-height:32px}.phone-current-list{display:block;font-size:13px;margin-top:12px;width:100%;min-height:40px;padding:8px}
.phone-view .song-desk{padding:0;border:0}.phone-view .search-form{margin:0;gap:8px;position:sticky;top:-16px;background:var(--bg);padding:0 0 8px;z-index:1}.phone-view input,.phone-view select{font-size:14px;padding:10px 12px;min-height:44px}.phone-view .search-form button{min-height:44px;padding:8px 12px;font-size:13px}.phone-view #search-note{display:none}.phone-view .search-grid{display:block}.phone-view .search-scroll{max-height:none;overflow:visible}.phone-view .search-result{padding:12px 0;gap:10px}.phone-view .search-result h3{font-size:14px}.phone-view .search-result button{font-size:12px;padding:6px 10px;min-height:36px}.phone-view #manual-song{margin-top:12px;font-size:12px}.phone-view #manual-song form{margin-top:8px}.phone-view .queue-title{margin:0 0 4px}.phone-view .queue-title h2{font-size:15px}.phone-view .song-row{gap:8px;padding:10px 0}.phone-view .song-row .order{min-width:16px}.phone-view .song-row strong{font-size:13px}.phone-view .song-row .small{font-size:11px}.phone-view .row-actions{gap:0}.phone-view .row-actions button{min-width:32px;min-height:36px;padding:4px}.song-title-button{min-height:32px;font-size:13px;padding:0;border:0;background:transparent;text-align:left;justify-content:flex-start;font-weight:600;line-height:1.4}.phone-favorites{margin-top:12px;font-size:13px}.phone-add-song{margin-top:12px;width:100%;min-height:40px;font-size:13px}.phone-view .empty,.compact-home .empty{padding:16px 0;font-size:13px;margin:0}.phone-view .favorite{gap:6px;font-size:12px}.phone-view .favorite button{padding:4px;min-width:36px;min-height:36px}
.control-instructions{display:grid;grid-template-columns:32px 1fr;gap:16px 12px;font-size:13px;align-items:center}.control-instructions dt{font-size:20px}.control-instructions dd{margin:0;line-height:1.5}.compact-dialog h2{font-size:18px}.compact-dialog .dialog-content{margin-top:20px}.compact-dialog .group-tools{display:flex;flex-direction:column;margin:12px 0;gap:8px}.compact-dialog .group-tools a,.compact-dialog .group-tools button,.compact-dialog #away{font-size:13px;min-height:40px;padding:8px 12px}.phone-view .phone-control-queue{margin-top:16px}.phone-control-queue button{display:block;width:100%;text-align:left;justify-content:flex-start;padding:10px 0;border:0;border-bottom:1px solid var(--line);background:transparent;font-size:13px;min-height:40px}
.phone-view .song-row>div:not(.row-actions)>.small{display:none}.phone-view .song-metadata>summary{min-height:24px;padding:2px 0;font-size:11px}.phone-view .song-row{padding:6px 0}.phone-view .search-status{margin:8px 0;font-size:12px}.phone-view .search-list .video-card{margin-bottom:8px}.phone-view .search-scroll{padding:0}

/* Entry choices remain visible on small installed screens. */
.home-entry-actions{flex-wrap:wrap}.home-entry-actions button{flex:1 1 150px}.favorite>.warning{font-size:.8rem}.turn-recovery .warning{font-weight:600}

.phone-view .song-row>div:not(.row-actions)>.blocked-label{display:block;color:#ffb4b1}
/* Shared recommendations and assisted moderation stay compact on phones. */
#song-target { padding: 12px 0; }
#song-target .check { margin-top: 10px; font-size: .85rem; }
#moderator-register { margin: 16px 0; padding: 12px; border: 1px solid var(--line, #ddd); border-radius: 12px; }
#shared-recommendations { margin-top: 20px; }
#shared-songs { max-height: 45dvh; overflow-y: auto; overscroll-behavior: contain; }
#shared-songs .song-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
#shared-songs .song-row > div { min-width: 0; flex: 1; overflow-wrap: anywhere; }
#shared-songs button { flex-shrink: 0; max-width: 48%; }
.phone-view .phone-layout.has-moderation { grid-template-rows: auto minmax(0,1fr) auto; }
.phone-layout.has-moderation > #song-target { grid-row: 1; grid-column: 1; padding: 8px 16px; border-bottom: 1px solid var(--line); }
.phone-layout.has-moderation > .phone-panel { grid-row: 2; }
.phone-layout.has-moderation > .phone-tabs { grid-row: 3; }
.phone-layout #song-target label { font-size: 12px; margin-bottom: 4px; }
.phone-layout #song-target .check { margin-top: 6px; }

.stage.direct-playback #intro { display:none!important; }
.stage.direct-playback #video-fade { opacity:0!important; }
.stage.direct-playback #video-area { z-index:3; }
.stage.direct-playback #video-area iframe { pointer-events:auto; }
#player-error button { margin:8px 8px 0 0; }
.stage.direct-playback::after { display:none!important; }
.stage.direct-playback { cursor:auto; }
.stage-mode #player-error:not([hidden]) { display:block!important; position:absolute; left:16px; right:16px; bottom:76px; z-index:15; max-height:32dvh; overflow:auto; background:var(--panel); margin:0; cursor:auto; }
.stage-mode .stage-column:has(.direct-playback) #player-error { max-height:22dvh; }

.song-audio-dialog { width: min(720px, calc(100vw - 24px)); max-height: 90dvh; overflow-y: auto; }
.audio-import-form { display: grid; gap: 8px; margin-block: 20px 10px; }
.audio-import-form .inline-form { display: flex; gap: 8px; flex-wrap: wrap; }
.audio-import-form input { min-width: 160px; flex: 1; }
.audio-notice { min-height: 1.5em; overflow-wrap: anywhere; }
.audio-jobs { display: grid; gap: 12px; margin-top: 20px; }
.audio-job { padding: 14px; border: 1px solid var(--line, #374151); border-radius: 12px; display: grid; gap: 10px; }
.audio-job strong, .audio-job a, .audio-job-state { display: block; overflow-wrap: anywhere; }
.audio-job-state { margin-top: 8px; font-size: .85rem; }
.audio-job-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.audio-preview { padding: 16px; border: 1px solid var(--line, #374151); border-radius: 12px; margin-top: 16px; }
.audio-preview strong { display: block; overflow-wrap: anywhere; }
.audio-preview audio { display: block; width: 100%; margin-block: 12px; }
#prepare-song-audio { margin-bottom: 16px; }
