/* Livehouse: compact music library on the left, lyrics viewport on the right. */
#livehouse-panel { width:min(1280px,calc(100vw - 24px)); height:min(92dvh,860px); max-width:none; max-height:none; padding:0; border:0; border-radius:28px; background:transparent; overflow:hidden; color:#211b4e; box-shadow:0 24px 80px #24143d55; }
#livehouse-panel::backdrop { background:#26144266; backdrop-filter:blur(4px); }
#livehouse-panel[open] { display:grid; }
.livehouse-dialog-card { position:relative; min-width:0; min-height:0; height:100%; overflow:hidden; border-radius:28px; background:#fff8ef; }
.livehouse-dialog-head { position:absolute; inset:10px 10px auto auto; z-index:10; display:flex; pointer-events:none; }
.livehouse-dialog-head h2 { position:absolute; width:1px; height:1px; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); }
.livehouse-dialog-head .icon-button { pointer-events:auto; width:44px; height:44px; border:2px solid #e2d3e4; border-radius:14px; background:#fffdf9ee; color:#50305d; font-size:1.5rem; line-height:1; cursor:pointer; box-shadow:0 4px 14px #32194d22; }
#livehouse-content { height:100%; min-height:0; overflow:hidden; font-family:inherit; }
.livehouse-shell { --cream:#fff8ef; --pink:#ef4f91; --rose:#ff7bb4; --lav:#9386ed; --ink:#211b4e; --muted:#756d8d; height:100%; min-height:0; display:grid; grid-template-rows:86px minmax(0,1fr); position:relative; isolation:isolate; overflow:hidden; background:var(--cream); border-radius:28px; }
.livehouse-header { position:relative; z-index:3; min-width:0; background:#fffaf6; border-bottom:1px solid #ead9ec; }
.livehouse-hero { height:64px; box-sizing:border-box; display:flex; align-items:center; padding:8px 72px 8px clamp(18px,3vw,36px); background:linear-gradient(90deg,#fff8ef 0%,#fff8efea 46%,#fff8ef45 100%),url('./assets/livehouse/livehouse-hero-v1.png') right 38%/auto 100% no-repeat; }
.livehouse-hero-copy { display:flex; align-items:center; gap:14px; min-width:0; }
.livehouse-hero h2 { margin:0; color:var(--ink); font-size:clamp(1.35rem,2.7vw,2rem); line-height:1.15; letter-spacing:.04em; white-space:nowrap; }
.livehouse-eyebrow,.livehouse-lede { display:none; }
.livehouse-hero-actions { display:flex; gap:8px; margin:0; }
.livehouse-button,.livehouse-play,.livehouse-round-button,.livehouse-version-switch button { min-height:44px; border:0; cursor:pointer; font:inherit; font-weight:800; }
.livehouse-button { padding:9px 15px; border-radius:999px; }
.livehouse-button-secondary { background:#ef4f91; color:#fff; box-shadow:0 5px 14px #ea559455; }
.livehouse-button-ghost { background:#fff; color:var(--ink); border:2px solid #dfd6ee; }
.livehouse-controls { position:absolute; top:64px; left:0; right:0; z-index:5; height:22px; box-sizing:border-box; padding:3px clamp(18px,3vw,36px); background:#fffaf6; }
.livehouse-hint { margin:0; overflow:visible; color:var(--muted); font-size:.72rem; line-height:1.5; white-space:nowrap; text-overflow:ellipsis; }
.livehouse-hint[data-error="true"] { position:relative; z-index:2; color:#b83261; font-weight:850; white-space:normal; line-height:1.25; }
.livehouse-workspace { min-height:0; display:grid; grid-template-columns:minmax(280px,34%) minmax(0,1fr); gap:12px; padding:12px clamp(14px,2.4vw,30px) 14px; background:linear-gradient(135deg,#fff8ef 0%,#fffdfb 55%,#f9f4ff 100%); }
.livehouse-pane-switch { display:none; }
.livehouse-selection-pane,.livehouse-lyrics-pane { min-width:0; min-height:0; border:1px solid #ead9ec; border-radius:20px; background:#fffdfbf2; box-shadow:0 8px 24px #4b346012; }
.livehouse-selection-pane { display:flex; flex-direction:column; overflow:hidden; }
.livehouse-selection-list { min-height:0; overflow-y:auto; padding:12px; scrollbar-gutter:stable; overscroll-behavior:contain; scrollbar-color:#b8a9d9 #f1e8f1; }
.livehouse-selection-list::-webkit-scrollbar,.livehouse-lyrics-pane > .livehouse-list::-webkit-scrollbar { width:10px; }
.livehouse-selection-list::-webkit-scrollbar-thumb,.livehouse-lyrics-pane > .livehouse-list::-webkit-scrollbar-thumb { background:#b8a9d9; border:2px solid #f1e8f1; border-radius:10px; }
.livehouse-section + .livehouse-section { margin-top:18px; }
.livehouse-section-heading { display:flex; align-items:end; justify-content:space-between; gap:12px; margin-bottom:8px; }
.livehouse-section-heading h3 { margin:0; font-size:1rem; }
.livehouse-section-heading p { display:none; }
.livehouse-kicker { margin:0 0 2px; color:#b83261; font-size:.68rem; letter-spacing:.1em; font-weight:850; }
.livehouse-track-grid { display:grid; grid-template-columns:1fr; gap:8px; }
.livehouse-card { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:9px; min-height:72px; padding:9px; border:2px solid transparent; border-radius:14px; background:#fff; box-shadow:0 5px 14px #4b346010; transition:border-color .18s,box-shadow .18s,transform .18s; }
.livehouse-card:hover { transform:translateY(-1px); box-shadow:0 8px 18px #4b34601b; }
.livehouse-card.is-active { border-color:var(--rose); box-shadow:0 0 0 3px #ff84b42a,0 8px 18px #4b34601b; }
.livehouse-card.is-locked .livehouse-card-art { opacity:.72; }
.livehouse-card.is-locked .livehouse-card-art { filter:grayscale(.45); }
.livehouse-card p.livehouse-lock-message,.livehouse-card p.livehouse-version-hint { color:#665477 !important; font-weight:700; white-space:normal; overflow:visible; text-overflow:clip; line-height:1.35; }
.livehouse-version-hint { margin-top:3px !important; }
.livehouse-title-button:disabled,.livehouse-play:disabled,.livehouse-version-switch button:disabled { cursor:not-allowed; opacity:.6; }
.livehouse-card-art,.livehouse-player-art { display:block; object-fit:cover; flex:0 0 auto; }
.livehouse-card-art { width:44px; height:44px; border-radius:11px; background:linear-gradient(135deg,#d7cffd,#fca6c8); }
.livehouse-card-copy { min-width:0; }
.livehouse-card h4,.livehouse-title-heading { margin:0; font-size:.9rem; line-height:1.3; }
.livehouse-card p { margin:2px 0 4px; overflow:hidden; color:var(--muted); font-size:.72rem; white-space:nowrap; text-overflow:ellipsis; }
.livehouse-title-button { display:block; max-width:100%; margin:0; padding:0; overflow:hidden; border:0; background:transparent; color:inherit; text-align:left; cursor:pointer; font:inherit; }
.livehouse-title-heading { display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-weight:850; }
.livehouse-card-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:4px; }
.livehouse-card-actions .livehouse-lyrics-button { display:none; }
.livehouse-play { display:flex; align-items:center; gap:5px; min-height:36px; padding:6px 9px; border-radius:999px; background:#6254b7; color:#fff; font-size:.76rem; white-space:nowrap; }
.livehouse-card.is-active .livehouse-play { background:var(--pink); }
.livehouse-version-switch { display:flex; flex-wrap:wrap; gap:4px; }
.livehouse-version-switch button { min-height:36px; padding:6px 9px; border-radius:999px; background:#f0edff; color:#554f7d; font-size:.75rem; }
.livehouse-version-switch button.is-selected { background:var(--lav); color:#fff; }
.livehouse-badge { display:inline-block; padding:2px 6px; border-radius:999px; background:#ff4f96; color:#fff; font-size:.65rem; }
.livehouse-player { display:grid; grid-template-columns:minmax(0,1fr); gap:8px; flex:0 0 auto; padding:12px; border-top:1px solid #ead9ec; background:#fffafdf7; box-shadow:0 -8px 20px #4b34600d; }
.livehouse-player-main { display:flex; align-items:center; gap:8px; min-width:0; }
.livehouse-player-main > div { min-width:0; }
.livehouse-player-art,.livehouse-player-mark { width:36px; height:36px; border-radius:11px; }
.livehouse-player-art { background:linear-gradient(135deg,#d7cffd,#fca6c8); }
.livehouse-player-mark { display:grid; place-items:center; background:var(--pink); color:#fff; font-size:1.2rem; }
.livehouse-player-main strong { display:block; overflow:hidden; font-size:.88rem; white-space:nowrap; text-overflow:ellipsis; }
.livehouse-player-meta { display:block; color:var(--muted); font-size:.7rem; }
.livehouse-player-version { display:flex; gap:4px; margin-top:4px; }
.livehouse-player-version button { min-height:36px; padding:6px 9px; border:1px solid #dfd6ee; border-radius:999px; background:#f0edff; color:#554f7d; font:inherit; font-size:.75rem; font-weight:800; cursor:pointer; }
.livehouse-player-version button.is-selected { background:var(--lav); color:#fff; }
.livehouse-player-controls { display:flex; align-items:center; gap:8px; min-width:0; }
.livehouse-round-button { width:42px; height:42px; flex:0 0 42px; border-radius:50%; background:var(--pink); color:#fff; font-size:1.1rem; }
.livehouse-round-button:disabled { opacity:.45; cursor:not-allowed; }
.livehouse-range-label { display:flex; align-items:center; gap:5px; min-width:0; flex:1; color:var(--muted); font-size:.7rem; }
.livehouse-range-label input { min-width:40px; flex:1; accent-color:var(--pink); }
.livehouse-volume { display:flex; align-items:center; gap:5px; color:var(--muted); }
.livehouse-volume input { width:64px; accent-color:var(--lav); }
.livehouse-player-actions { display:flex; gap:6px; }
.livehouse-player-actions .livehouse-button { min-height:36px; padding:6px 9px; font-size:.76rem; }
.livehouse-lyrics-pane { overflow:hidden; }
.livehouse-lyrics-pane > .livehouse-list { height:100%; min-height:0; overflow-y:auto; padding:16px clamp(18px,3vw,42px) 28px; scrollbar-gutter:stable; overscroll-behavior:contain; scrollbar-color:#b8a9d9 #f1e8f1; }
.livehouse-lyrics-view { padding:0 0 28px; }
.livehouse-lyrics-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:10px; }
.livehouse-lyrics-head h2 { margin:0 0 4px; font-size:clamp(1.25rem,2.3vw,1.9rem); }
.livehouse-lyrics-timing { margin:0; color:var(--muted); font-size:.76rem; }
.livehouse-lyrics-toolbar { position:sticky; top:0; z-index:2; display:flex; justify-content:flex-end; padding:2px 0 8px; background:#fffdfbf2; }
.livehouse-lyrics-actions [data-lyrics-play],.livehouse-lyrics-actions [data-lyrics-back] { display:none; }
.livehouse-lyrics-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:5px; }
.livehouse-lyrics-actions .livehouse-button { min-height:44px; padding:8px 12px; }
.livehouse-lyrics-section + .livehouse-lyrics-section { margin-top:24px; }
.livehouse-lyrics-section h3 { margin:0 0 8px; color:var(--muted); font-size:.86rem; }
.livehouse-lyrics-line { margin:0; padding:7px 10px; border-radius:10px; color:#4e486f; line-height:1.65; transition:color .15s,background-color .15s; }
.livehouse-lyrics-line.is-read { color:#958ea8; }
.livehouse-lyrics-line.is-current { background:#ffe1ed; color:#b83261; box-shadow:inset 4px 0 var(--pink); font-weight:850; }
.livehouse-lyrics-line.is-note { color:#8c789d; font-size:.9em; font-style:italic; background:#ffffff7a; }
.livehouse-lyrics-line.has-stanza-gap { margin-bottom:14px; }
.livehouse-lyrics-empty { min-height:100%; display:grid; place-content:center; gap:8px; padding:24px; color:var(--muted); text-align:center; }
.livehouse-lyrics-empty strong { color:#503d68; font-size:1.05rem; }
.livehouse-lyrics-empty span { font-size:.85rem; }
.livehouse-shell [data-livehouse-effects] { position:absolute; inset:0; z-index:4; overflow:hidden; pointer-events:none; contain:layout paint; }
.livehouse-shell [data-livehouse-effects="off"],.livehouse-shell [data-effect-mode="off"] { display:none; }
.livehouse-shell [data-livehouse-character] { position:absolute; top:5px; left:calc(49% + var(--livehouse-character-index, 0) * 11%); width:54px; height:54px; border-radius:50%; background-image:url('./assets/mascot-cast/dopa-main-atlas.png'); background-size:200% 200%; background-position:0 0; background-repeat:no-repeat; filter:drop-shadow(0 4px 5px #57386b44); opacity:0; transform:translateY(5px) scale(calc(.78 + var(--livehouse-energy, 0) * .14)); transition:opacity .2s,filter .2s; }
.livehouse-shell [data-livehouse-character][data-effect-frame="1"] { background-position:100% 0; }
.livehouse-shell [data-livehouse-character][data-effect-frame="2"] { background-position:0 100%; }
.livehouse-shell [data-livehouse-character][data-effect-frame="3"] { background-position:100% 100%; }
.livehouse-shell [data-livehouse-effects][data-effect-mode="on"][data-effect-running="true"] [data-livehouse-character] { opacity:.72; }
.livehouse-shell [data-livehouse-effects][data-effect-mode="on"][data-effect-running="true"][data-livehouse-mood="chorus"] [data-livehouse-character],.livehouse-shell [data-livehouse-effects][data-effect-mode="on"][data-effect-running="true"][data-livehouse-mood="finale"] [data-livehouse-character] { opacity:.96; }
.livehouse-shell [data-livehouse-effects][data-effect-running="false"] [data-livehouse-character],.livehouse-shell [data-livehouse-effects][data-effect-mode="off"] [data-livehouse-character] { opacity:0; animation:none !important; }
.livehouse-shell [data-livehouse-effects][data-effect-running="true"].is-effect-pulse [data-livehouse-character] { animation:livehouse-character-pulse .18s ease-out both; }
.livehouse-shell [data-livehouse-particles] { position:absolute; inset:0; pointer-events:none; }
.livehouse-shell [data-livehouse-particles]::before,.livehouse-shell [data-livehouse-particles]::after { content:""; position:absolute; width:10px; height:10px; color:#f5bf45; opacity:0; text-shadow:0 0 10px #fff0a8; }
.livehouse-shell [data-livehouse-effects][data-effect-running="true"][data-livehouse-mood="chorus"] [data-livehouse-particles]::before { left:44%; top:8px; opacity:.9; content:"★"; animation:livehouse-particle-twinkle 1.3s ease-in-out infinite; }
.livehouse-shell [data-livehouse-effects][data-effect-running="true"][data-livehouse-mood="chorus"] [data-livehouse-particles]::after { left:78%; top:38px; color:#f398c1; opacity:.85; content:"♥"; animation:livehouse-particle-twinkle 1.1s ease-in-out .2s infinite; }
.livehouse-shell [data-livehouse-effects][data-effect-running="true"][data-livehouse-mood="finale"] [data-livehouse-particles]::before { left:52%; top:9px; color:#f5bf45; opacity:1; content:"✦"; animation:livehouse-particle-twinkle .9s ease-in-out infinite; }
.livehouse-shell [data-livehouse-effects][data-effect-running="true"][data-livehouse-mood="finale"] [data-livehouse-particles]::after { left:70%; top:32px; color:#9ddce0; opacity:1; content:"★"; animation:livehouse-particle-twinkle 1s ease-in-out .15s infinite; }
.livehouse-shell [data-livehouse-effects][data-effect-running="true"] .livehouse-performance-particle { position:absolute; left:50%; top:34px; width:18px; height:18px; background:url('./assets/cheer-props/cheer_props_atlas.png') 33.333% 0 / 400% 800% no-repeat; opacity:0; pointer-events:none; animation:livehouse-performance-particle .76s ease-out both; }
.livehouse-shell [data-livehouse-effects][data-effect-mode="on"][data-effect-running="true"]::before { content:""; position:absolute; left:44%; top:0; width:38%; height:72px; border-radius:50%; background:radial-gradient(ellipse at center,#f398c17d 0%,#9ddce044 42%,transparent 75%); opacity:calc(.18 + var(--livehouse-energy, 0) * .5); filter:blur(5px); pointer-events:none; }
.livehouse-shell [data-livehouse-effects-toggle] { position:absolute; top:10px; right:60px; z-index:6; width:40px; min-width:40px; height:40px; min-height:40px; padding:0; border:1px solid #ead0e1; border-radius:50%; background:#fffaf6dd; color:#b83261; font:inherit; font-size:.78rem; font-weight:850; cursor:pointer; }
.livehouse-shell [data-livehouse-effects-toggle][aria-pressed="false"] { border-color:#b9adbf; background:#f1edf3dd; color:#766a80; filter:grayscale(.35); }
.livehouse-shell [data-livehouse-effects-toggle]:focus-visible { outline:3px solid #f1b82f; outline-offset:3px; }
@keyframes livehouse-character-pulse { 0% { transform:translateY(5px) scale(calc(.78 + var(--livehouse-energy, 0) * .14)) rotate(-2deg); } 45% { transform:translateY(calc(-3px - var(--livehouse-energy, 0) * 7px)) scale(calc(.8 + var(--livehouse-energy, 0) * .16)) rotate(2deg); } 100% { transform:translateY(5px) scale(calc(.78 + var(--livehouse-energy, 0) * .14)) rotate(-2deg); } }
@keyframes livehouse-particle-twinkle { 0%,100% { transform:scale(.65) rotate(-10deg); filter:brightness(.95); } 50% { transform:scale(1.22) rotate(12deg); filter:brightness(1.2); } }
@keyframes livehouse-performance-particle { 0% { opacity:0; transform:translateY(8px) scale(.55) rotate(-10deg); } 22% { opacity:.95; } 100% { opacity:0; transform:translateY(-28px) scale(1.1) rotate(18deg); } }
.livehouse-button:focus-visible,.livehouse-play:focus-visible,.livehouse-round-button:focus-visible,.livehouse-version-switch button:focus-visible,.livehouse-title-button:focus-visible,.livehouse-pane-tab:focus-visible,.livehouse-lyrics-actions .livehouse-button:focus-visible,.livehouse-shell input:focus-visible { outline:3px solid #f1b82f; outline-offset:3px; }
@media (max-width:760px) {
  #livehouse-panel { width:calc(100vw - 12px); height:min(96dvh,900px); border-radius:20px; }
  .livehouse-dialog-card,.livehouse-shell { border-radius:20px; }
  .livehouse-shell { grid-template-rows:76px minmax(0,1fr); }
  .livehouse-hero { height:56px; padding:7px 58px 7px 16px; background-position:82% 60%; background-size:auto 100%; }
  .livehouse-hero h2 { font-size:1.55rem; }
  .livehouse-shell [data-livehouse-character] { left:auto; right:8px; top:auto; bottom:44px; width:38px; height:38px; }
  .livehouse-shell [data-livehouse-character] ~ [data-livehouse-character] { display:none; }
  .livehouse-player { padding-right:48px; }
  .livehouse-shell [data-livehouse-particles]::before { left:58%; top:5px; }
  .livehouse-shell [data-livehouse-particles]::after { left:78%; top:27px; }
  .livehouse-shell [data-livehouse-effects-toggle] { top:9px; right:58px; width:34px; min-width:34px; height:34px; min-height:34px; font-size:0; }
  .livehouse-shell [data-livehouse-effects-toggle]::before { content:"✦"; font-size:1rem; }
  .livehouse-shell [data-livehouse-effects][data-effect-mode="on"][data-effect-running="true"]::before { left:auto; right:2px; top:auto; bottom:32px; width:70px; height:70px; border-radius:50%; }
  .livehouse-shell [data-livehouse-effects][data-effect-running="true"][data-livehouse-mood="chorus"] [data-livehouse-particles]::before,.livehouse-shell [data-livehouse-effects][data-effect-running="true"][data-livehouse-mood="finale"] [data-livehouse-particles]::before { left:auto; right:8px; top:auto; bottom:36px; }
  .livehouse-shell [data-livehouse-effects][data-effect-running="true"][data-livehouse-mood="chorus"] [data-livehouse-particles]::after,.livehouse-shell [data-livehouse-effects][data-effect-running="true"][data-livehouse-mood="finale"] [data-livehouse-particles]::after { left:auto; right:16px; top:auto; bottom:58px; }
  .livehouse-shell [data-livehouse-effects][data-effect-running="true"] .livehouse-performance-particle { left:auto; right:12px; top:auto; bottom:44px; }
  .livehouse-controls { top:56px; height:20px; padding:2px 16px; }
  .livehouse-workspace { grid-template-columns:minmax(0,1fr); grid-template-rows:40px minmax(0,1fr) auto; gap:8px; padding:8px 10px 10px; }
  .livehouse-pane-switch { display:grid; grid-template-columns:1fr 1fr; gap:4px; min-height:40px; padding:3px; border:1px solid #ead9ec; border-radius:13px; background:#fff; }
  .livehouse-pane-tab { min-height:34px; border:0; border-radius:10px; background:transparent; color:#62547f; font:inherit; font-size:.8rem; font-weight:850; cursor:pointer; }
  .livehouse-pane-tab.is-selected { background:#ef7eaa; color:#fff; }
  .livehouse-selection-pane { display:contents; }
  .livehouse-selection-list { grid-column:1; grid-row:2; padding:8px; }
  .livehouse-lyrics-pane { grid-column:1; grid-row:2; }
  .livehouse-shell[data-livehouse-pane="lyrics"] .livehouse-selection-list,.livehouse-shell[data-livehouse-pane="selection"] .livehouse-lyrics-pane { display:none; }
  .livehouse-player { grid-column:1; grid-row:3; border:1px solid #ead9ec; border-radius:16px; padding:8px 56px 8px 8px; }
  .livehouse-player-actions { display:flex; }
  .livehouse-player-actions .livehouse-button-secondary { display:none; }
  .livehouse-lyrics-pane > .livehouse-list { padding:12px 13px 18px; }
  .livehouse-lyrics-toolbar { justify-content:flex-start; }
  .livehouse-lyrics-actions { justify-content:flex-start; }
}
@media (max-width:380px) {
  .livehouse-hero { padding-right:56px; }
  .livehouse-hero-copy { gap:8px; }
  .livehouse-hero h2 { font-size:1.25rem; }
  .livehouse-shell [data-livehouse-effects-toggle] { right:55px; width:32px; min-width:32px; height:32px; min-height:32px; }
  .livehouse-hero-actions .livehouse-button { min-height:40px; padding:7px 10px; font-size:.82rem; }
  .livehouse-card { grid-template-columns:auto minmax(0,1fr) auto; }
  .livehouse-card-actions { grid-column:auto; justify-content:flex-end; }
  .livehouse-card-actions .livehouse-play { width:42px; min-height:42px; padding:0; justify-content:center; }
  .livehouse-card-actions .livehouse-play span { display:none; }
  .livehouse-title-heading { display:-webkit-box; overflow:hidden; white-space:normal; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
  .livehouse-player-controls { gap:6px; }
  .livehouse-volume input { width:52px; }
}
@media (max-width:760px) and (max-height:500px) {
  .livehouse-shell { grid-template-rows:68px minmax(0,1fr); }
  .livehouse-hero { height:50px; }
  .livehouse-controls { top:50px; height:18px; }
  .livehouse-workspace { grid-template-rows:36px minmax(0,1fr) auto; padding-top:5px; gap:5px; }
  .livehouse-pane-switch { min-height:36px; }
  .livehouse-pane-tab { min-height:30px; }
  .livehouse-selection-list { padding-top:5px; }
  .livehouse-card { min-height:60px; padding:6px 8px; }
  .livehouse-card-art { width:40px; height:40px; }
  .livehouse-player { padding:6px 48px 6px 8px; }
  .livehouse-player-main .livehouse-player-art,.livehouse-player-main .livehouse-player-mark { width:32px; height:32px; }
  .livehouse-round-button { width:38px; height:38px; flex-basis:38px; }
}
/* Short landscape phones have enough width for the two-pane reading layout. */
@media (min-width:600px) and (max-width:760px) and (max-height:500px) {
  .livehouse-shell { grid-template-rows:68px minmax(0,1fr); }
  .livehouse-hero { height:50px; padding:7px 58px 7px 18px; }
  .livehouse-hero h2 { font-size:1.45rem; }
  .livehouse-controls { top:50px; height:18px; padding:2px 18px; }
  .livehouse-workspace { grid-template-columns:minmax(220px,34%) minmax(0,1fr); grid-template-rows:minmax(0,1fr); gap:8px; padding:8px 10px 10px; }
  .livehouse-pane-switch { display:none; }
  .livehouse-selection-pane { display:flex; grid-column:1; grid-row:1; }
  .livehouse-lyrics-pane { display:block; grid-column:2; grid-row:1; }
  .livehouse-shell[data-livehouse-pane="lyrics"] .livehouse-selection-list,
  .livehouse-shell[data-livehouse-pane="selection"] .livehouse-lyrics-pane { display:block; }
  .livehouse-selection-list { padding:6px; }
  .livehouse-selection-list .livehouse-section + .livehouse-section { margin-top:8px; }
  .livehouse-selection-list .livehouse-card { min-height:54px; padding:5px 6px; gap:6px; }
  .livehouse-selection-list .livehouse-card-art { width:34px; height:34px; border-radius:8px; }
  .livehouse-selection-list .livehouse-card p { display:none; }
  .livehouse-selection-list .livehouse-title-heading { font-size:.78rem; }
  .livehouse-selection-list .livehouse-play { width:38px; min-height:38px; padding:0; justify-content:center; }
  .livehouse-selection-list .livehouse-play span { display:none; }
  .livehouse-selection-list .livehouse-version-switch { display:none; }
  .livehouse-player { grid-template-columns:minmax(0,1fr); gap:6px; padding:6px 48px 6px 6px; }
  .livehouse-player-main .livehouse-player-art, .livehouse-player-main .livehouse-player-mark { width:30px; height:30px; border-radius:9px; }
  .livehouse-player-main .livehouse-kicker, .livehouse-player-meta { display:none; }
  .livehouse-player-main strong { display:block; max-width:100%; overflow:hidden; font-size:.76rem; white-space:nowrap; text-overflow:ellipsis; }
  .livehouse-player-version { flex-wrap:nowrap; }
  .livehouse-player-version button { min-height:34px; padding:5px 8px; font-size:.7rem; white-space:nowrap; }
  .livehouse-player-controls { display:grid; grid-template-columns:38px minmax(0,1fr); gap:5px; }
  .livehouse-player-controls .livehouse-range-label { grid-column:2; grid-row:1; }
  .livehouse-round-button { width:38px; height:38px; flex-basis:38px; }
  .livehouse-volume { grid-column:2; grid-row:2; justify-self:end; }
  .livehouse-volume input { width:48px; }
  .livehouse-player-actions { display:none; }
  .livehouse-lyrics-pane > .livehouse-list { padding:10px 14px 16px; }
  .livehouse-lyrics-toolbar { justify-content:flex-start; }
  .livehouse-lyrics-actions { justify-content:flex-start; }
}
@media (min-width:600px) and (max-width:760px) and (max-height:500px) {
  .livehouse-shell [data-livehouse-character] { left:48%; right:auto; top:4px; bottom:auto; width:40px; height:40px; }
  .livehouse-shell [data-livehouse-effects][data-effect-running="true"][data-livehouse-mood="chorus"] [data-livehouse-particles]::before,.livehouse-shell [data-livehouse-effects][data-effect-running="true"][data-livehouse-mood="finale"] [data-livehouse-particles]::before { left:57%; right:auto; top:5px; bottom:auto; }
  .livehouse-shell [data-livehouse-effects][data-effect-running="true"][data-livehouse-mood="chorus"] [data-livehouse-particles]::after,.livehouse-shell [data-livehouse-effects][data-effect-running="true"][data-livehouse-mood="finale"] [data-livehouse-particles]::after { left:67%; right:auto; top:25px; bottom:auto; }
  .livehouse-shell [data-livehouse-effects][data-effect-running="true"] .livehouse-performance-particle { left:62%; right:auto; top:30px; bottom:auto; }
  .livehouse-player { padding-right:8px; }
  .livehouse-shell [data-livehouse-effects][data-effect-mode="on"][data-effect-running="true"]::before { left:42%; right:auto; top:0; bottom:auto; width:32%; height:58px; }
}
@media (prefers-reduced-motion:reduce) { .livehouse-shell [data-livehouse-effects] [data-livehouse-character],.livehouse-shell [data-livehouse-effects] [data-livehouse-particles]::before,.livehouse-shell [data-livehouse-effects] [data-livehouse-particles]::after { animation:none !important; transition:none !important; } .livehouse-shell [data-livehouse-effects] [data-livehouse-character] { transform:translateY(5px) scale(.8) rotate(0deg) !important; } }
@media (prefers-reduced-motion:reduce) { .livehouse-shell [data-livehouse-effects][data-effect-mode="on"][data-effect-running="true"]::before { opacity:.22; filter:blur(4px); } }
@media (prefers-reduced-motion:reduce) { .livehouse-shell * { transition-duration:.01ms !important; animation-duration:.01ms !important; scroll-behavior:auto !important; } }