* { box-sizing: border-box; }
:root {
  --bg:#070914; --text:#f7f2e8; --muted:rgba(247,242,232,.62);
  --gold:#e7c77b; --gold2:#a98236; --accent-rgb:231,199,123; --glass:rgba(255,255,255,.075);
  --line:rgba(255,255,255,.15); --shadow:0 30px 90px rgba(0,0,0,.45);
}
body.light {
  --bg:#eee9df; --text:#211c14; --muted:rgba(33,28,20,.62);
  --glass:rgba(255,255,255,.48); --line:rgba(50,40,20,.16);
}

/* Crystal accent themes: keep the dark/glass architecture, recolour the highlights rather than the whole site. */
body[data-accent="purple"]{--gold:#c58cff;--gold2:#7440a9;--accent-rgb:197,140,255}
body[data-accent="blue"]{--gold:#72b8ff;--gold2:#2865a8;--accent-rgb:114,184,255}
body[data-accent="red"]{--gold:#ff7180;--gold2:#a62f43;--accent-rgb:255,113,128}
body[data-accent="green"]{--gold:#72e09b;--gold2:#2d8d58;--accent-rgb:114,224,155}
body[data-accent="turquoise"]{--gold:#55e6e0;--gold2:#218c93;--accent-rgb:85,230,224}
.crystal-themes{display:flex;justify-content:center;gap:9px;flex-wrap:wrap;margin:12px 0 4px}
.crystal-swatch{position:relative;width:25px;height:25px;padding:0;border-radius:8px;cursor:pointer;border:1px solid rgba(255,255,255,.28);background:linear-gradient(145deg,var(--swatch-bright),var(--swatch-dark));box-shadow:0 0 0 1px rgba(255,255,255,.04),0 5px 14px rgba(0,0,0,.28);overflow:hidden}
.crystal-swatch::before{content:"";position:absolute;inset:-35%;background:linear-gradient(115deg,transparent 36%,rgba(255,255,255,.78) 48%,transparent 59%);transform:translateX(-75%) rotate(8deg);animation:crystalShimmer 3.8s ease-in-out infinite}
.crystal-swatch::after{content:"";position:absolute;inset:2px;border-radius:6px;border:1px solid rgba(255,255,255,.22);box-shadow:inset 0 0 10px rgba(255,255,255,.18)}
.crystal-swatch.gold{--swatch-bright:#ffe9a5;--swatch-dark:#9b7126}.crystal-swatch.purple{--swatch-bright:#e4baff;--swatch-dark:#6b2fa3}.crystal-swatch.blue{--swatch-bright:#b6ddff;--swatch-dark:#2361aa}.crystal-swatch.red{--swatch-bright:#ffb0b8;--swatch-dark:#a52d42}.crystal-swatch.green{--swatch-bright:#b6f5c9;--swatch-dark:#23804f}.crystal-swatch.turquoise{--swatch-bright:#b6fffb;--swatch-dark:#167f86}
.crystal-swatch[aria-current="true"]{transform:translateY(-1px);box-shadow:0 0 0 2px rgba(var(--accent-rgb),.28),0 0 18px rgba(var(--accent-rgb),.28)}
@keyframes crystalShimmer{0%,45%{transform:translateX(-80%) rotate(8deg);opacity:0}55%{opacity:.9}75%,100%{transform:translateX(85%) rotate(8deg);opacity:0}}
body[data-accent]:not([data-accent="gold"]) .player-card,body[data-accent]:not([data-accent="gold"]) .playlist-card,body[data-accent]:not([data-accent="gold"]) .video-card,body[data-accent]:not([data-accent="gold"]) .live-room-card,body[data-accent]:not([data-accent="gold"]) .queue-card,body[data-accent]:not([data-accent="gold"]) .mog-card{position:relative;overflow:hidden}
body[data-accent]:not([data-accent="gold"]) .player-card::after,body[data-accent]:not([data-accent="gold"]) .playlist-card::after,body[data-accent]:not([data-accent="gold"]) .video-card::after,body[data-accent]:not([data-accent="gold"]) .live-room-card::after,body[data-accent]:not([data-accent="gold"]) .queue-card::after,body[data-accent]:not([data-accent="gold"]) .mog-card::after{content:"";position:absolute;inset:-60% -20%;pointer-events:none;background:linear-gradient(112deg,transparent 43%,rgba(255,255,255,.055) 49%,rgba(255,255,255,.12) 51%,transparent 57%);transform:translateX(-65%);animation:crystalPanelShimmer 8s ease-in-out infinite;z-index:0}
@keyframes crystalPanelShimmer{0%,48%{transform:translateX(-65%)}72%,100%{transform:translateX(65%)}}
.crystal-themes button:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
html,body { margin:0; min-height:100%; }
body {
  min-height:100vh; overflow-x:hidden; color:var(--text);
  --art-color: rgba(var(--accent-rgb),.48); --art-hue: 42; --art-sat: 52%; --art-light: 58%;
  font-family:Georgia,"Times New Roman",serif;
  background:
    radial-gradient(circle at 50% 18%, hsl(var(--art-hue) var(--art-sat) var(--art-light) / .20), transparent 31rem),
    radial-gradient(circle at 12% 78%, hsl(calc(var(--art-hue) + 28) var(--art-sat) var(--art-light) / .13), transparent 28rem),
    radial-gradient(circle at 88% 72%, hsl(calc(var(--art-hue) - 24) var(--art-sat) var(--art-light) / .11), transparent 30rem),
    var(--bg);
  transition:background 1.1s ease,color .3s;
}
button { font:inherit; }
.ambient { position:fixed; inset:auto; width:28rem;height:28rem;border-radius:50%;filter:blur(100px);opacity:.15;pointer-events:none;z-index:-1; }
.ambient-a { top:15%;left:-18rem;background:#d3a43e; }
.ambient-b { right:-15rem;bottom:-10rem;background:#7658a9; }
.site-shell { width:min(1100px,calc(100% - 28px));margin:auto;padding:28px 0 30px;position:relative; }
.site-header { text-align:center;margin:0 0 26px; }
.eyebrow { color:#f6e5b1;letter-spacing:.22em;font-size:.78rem;font-weight:700;text-shadow:0 0 14px rgba(var(--accent-rgb),.42);position:relative;z-index:4; }
.logo-stage { position:relative;width:min(100%,1080px);margin:2px auto 0;isolation:isolate; }
.logo-aura { position:absolute;inset:7% 9% 4%;z-index:-2;border-radius:50%;background:
  radial-gradient(ellipse at 50% 42%,rgba(255,221,125,.34),transparent 35%),
  radial-gradient(ellipse at 50% 54%,rgba(229,183,67,.22),transparent 62%),
  radial-gradient(ellipse at 50% 50%,rgba(48,90,180,.18),transparent 76%);filter:blur(25px);animation:logoBreath 5.5s ease-in-out infinite; }
.logo-stage::before,.logo-stage::after { content:"";position:absolute;z-index:-1;pointer-events:none;border-radius:50%; }
.logo-stage::before { inset:2% 14% 8%;background:conic-gradient(from 210deg,transparent 0 8%,rgba(255,222,130,.25) 10%,transparent 13% 28%,rgba(255,232,160,.18) 30%,transparent 34% 55%,rgba(255,215,105,.22) 58%,transparent 62% 100%);filter:blur(13px);animation:logoSpin 18s linear infinite; }
.logo-stage::after { inset:10% 20%;background:radial-gradient(circle,rgba(255,226,139,.2) 0 1px,transparent 2px) 0 0/44px 38px,radial-gradient(circle,rgba(255,255,255,.24) 0 1px,transparent 2px) 17px 21px/61px 53px;opacity:.7;animation:starDrift 7s ease-in-out infinite; }
.site-logo { position:relative;display:block;width:100%;height:auto;max-height:390px;object-fit:contain;filter:drop-shadow(0 0 18px rgba(255,208,91,.22)) drop-shadow(0 18px 34px rgba(0,0,0,.22));animation:logoGlow 4.5s ease-in-out infinite; }
.logo-sparkles { position:absolute;inset:8% 4% 8%;z-index:3;pointer-events:none;color:#fff2bb;text-shadow:0 0 8px #ffd96b,0 0 18px rgba(255,197,67,.7); }
.logo-sparkles span { position:absolute;font-size:clamp(.5rem,1vw,1rem);animation:logoTwinkle 2.8s ease-in-out infinite; }
.logo-sparkles span:nth-child(1){left:10%;top:36%;animation-delay:.1s}.logo-sparkles span:nth-child(2){left:20%;top:61%;animation-delay:1.2s}.logo-sparkles span:nth-child(3){left:34%;top:18%;animation-delay:.7s}.logo-sparkles span:nth-child(4){left:50%;top:8%;animation-delay:1.8s}.logo-sparkles span:nth-child(5){right:32%;top:28%;animation-delay:.45s}.logo-sparkles span:nth-child(6){right:20%;top:62%;animation-delay:1.4s}.logo-sparkles span:nth-child(7){right:10%;top:37%;animation-delay:2.1s}.logo-sparkles span:nth-child(8){right:25%;top:17%;animation-delay:.9s}.logo-sparkles span:nth-child(9){left:48%;bottom:8%;animation-delay:1.7s}
@keyframes logoBreath { 50%{opacity:.62;transform:scale(1.035)} }
@keyframes logoSpin { to{transform:rotate(360deg)} }
@keyframes starDrift { 50%{transform:translateY(-5px);opacity:.9} }
@keyframes logoGlow { 50%{filter:drop-shadow(0 0 25px rgba(255,208,91,.36)) drop-shadow(0 18px 34px rgba(0,0,0,.22))} }
@keyframes logoTwinkle { 0%,100%{opacity:.2;transform:scale(.65)} 45%{opacity:1;transform:scale(1.25)} 60%{opacity:.45;transform:scale(.85)} }
.player-card,.playlist-card,.video-card {
  background:linear-gradient(145deg,rgba(255,255,255,.105),rgba(255,255,255,.035));
  border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);
  backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
}
.player-card { display:grid;grid-template-columns:minmax(330px,46%) 1fr;gap:20px;padding:20px; }
.artwork-wrap { position:relative; }
.art-wave { position:absolute; top:14%; bottom:14%; width:58px; z-index:2; pointer-events:none; opacity:.82; filter:drop-shadow(0 0 10px var(--art-color, rgba(var(--accent-rgb),.45))); }
.art-wave-left { left:-38px; }
.art-wave-right { right:-38px; }
.artwork-wrap:after { content:"";position:absolute;inset:8%;z-index:0;border-radius:22px;background:var(--art-glow,rgba(var(--accent-rgb),.3));filter:blur(42px);opacity:.65; }
.artwork-wrap img { position:relative;z-index:1;display:block;width:100%;aspect-ratio:1;object-fit:cover;border-radius:18px;box-shadow:0 22px 60px rgba(0,0,0,.45); }
.song-info { display:flex;justify-content:space-between;align-items:center;gap:12px;padding:13px 2px 8px; }
.song-info h2 { margin:0 0 4px;font-size:1.4rem; }
.song-info p { margin:0;color:var(--muted);font-size:.95rem; }
.heart-button {
  position:relative;width:44px;height:44px;flex:0 0 44px;background:none;border:0;color:var(--gold);font-size:1.9rem;cursor:pointer;
}
.heart-outline,.heart-solid,.heart-gem { position:absolute;inset:0;display:grid;place-items:center;line-height:1; }
.heart-outline { opacity:1;transition:opacity .18s; }
.heart-solid { color:#e32636;opacity:0;transform:scale(.7);text-shadow:0 0 14px rgba(227,38,54,.35); }
.heart-gem { color:#d7192f;font-size:1.35rem;opacity:0;transform:translateY(8px) scale(.35) rotate(-18deg);filter:drop-shadow(0 0 7px rgba(255,55,75,.65));text-shadow:inset 1px 1px 0 #ffb0b8; }
.heart-button.heart-pop .heart-outline { opacity:0; }
.heart-button.heart-pop .heart-gem { animation:ruby-pop .78s cubic-bezier(.22,.8,.28,1) forwards; }
.heart-button.heart-pop .heart-solid { animation:heart-land .78s .18s cubic-bezier(.2,.8,.25,1) forwards; }
@keyframes ruby-pop {
  0% { opacity:0;transform:translateY(8px) scale(.35) rotate(-18deg); }
  25% { opacity:1;transform:translateY(-10px) scale(1.05) rotate(10deg); }
  48% { opacity:1;transform:translateY(-25px) scale(1.15) rotate(-5deg); }
  100% { opacity:0;transform:translateY(14px) scale(.25) rotate(18deg); }
}
@keyframes heart-land {
  0% { opacity:0;transform:translateY(-8px) scale(.55); }
  55% { opacity:1;transform:translateY(2px) scale(1.18); }
  72% { transform:translateY(0) scale(.92); }
  100% { opacity:1;transform:translateY(0) scale(1); }
}
.heart-button[aria-pressed="true"] .heart-outline { opacity:0; }
.heart-button[aria-pressed="true"] .heart-solid { opacity:1;transform:scale(1); }
.progress-row { display:grid;grid-template-columns:40px 1fr 40px;align-items:center;gap:10px;color:var(--muted);font-size:.72rem; }
input[type=range] { width:100%;accent-color:var(--gold);cursor:pointer; }
.controls { display:flex;justify-content:center;align-items:center;gap:14px;padding-top:10px; }
.control-button,.play-button { border:1px solid rgba(var(--accent-rgb),.25);background:rgba(255,255,255,.04);color:var(--text);cursor:pointer;border-radius:50%; }
.control-button { width:44px;height:44px; }
.play-button { width:60px;height:60px;background:linear-gradient(145deg,#f2d990,#9e742a);color:#171208;border:0;box-shadow:0 0 28px rgba(var(--accent-rgb),.22); }
.lyrics-side { min-width:0;min-height:100%;border:1px solid rgba(255,255,255,.1);border-radius:18px;padding:20px;background:rgba(0,0,0,.08); }
.lyrics-heading { color:var(--gold);font-size:.75rem;letter-spacing:.14em;margin-bottom:12px; }
.lyrics-panel { height:100%;min-height:360px;max-height:470px;overflow:auto;padding:8px 12px 8px 6px;scroll-behavior:smooth; }
.lyric-line { margin:0;padding:9px 0;color:rgba(247,242,232,.35);line-height:1.5;font-size:1.04rem;transition:.35s; }
.lyric-line.active { color:#fff0b9;transform:translateX(5px);text-shadow:0 0 20px rgba(var(--accent-rgb),.22); }
.lyric-line.active:before { content:"";display:inline-block;width:3px;height:1em;margin-right:8px;vertical-align:-.15em;background:var(--gold);box-shadow:0 0 12px var(--gold); }
.mode-buttons { display:flex;justify-content:center;align-items:center;gap:10px;flex-wrap:wrap;margin:18px auto 14px; }
.playlist-toggle,.stream-toggle { margin:0; }
.playlist-toggle { display:block;margin:18px auto 14px;border:1px solid rgba(var(--accent-rgb),.45);border-radius:999px;padding:10px 28px;background:linear-gradient(90deg,rgba(var(--accent-rgb),.08),rgba(125,66,166,.13));color:var(--text);letter-spacing:.08em;cursor:pointer; }
.stream-toggle { border:1px solid rgba(var(--accent-rgb),.38);border-radius:999px;padding:10px 24px;background:rgba(255,255,255,.035);color:var(--text);letter-spacing:.08em;cursor:pointer; }
.stream-toggle.active { background:rgba(var(--accent-rgb),.14);box-shadow:0 0 24px rgba(var(--accent-rgb),.14);color:var(--gold); }
.stream-toggle[hidden] { display:none; }
.playlist-toggle:disabled { opacity:.45;cursor:not-allowed; }
.playlist-card { padding:18px 20px; }
.video-card { display:none; padding:18px 20px; margin-top:14px; }
.video-card.open { display:block; }
.video-list { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:16px; }
.video-item { min-width:0; padding:10px; border:1px solid rgba(255,255,255,.1); border-radius:16px; background:rgba(0,0,0,.08); }
.video-item video { display:block; width:100%; aspect-ratio:16/9; object-fit:contain; background:#000; border-radius:11px; }
.video-item h3 { margin:10px 3px 2px; font-size:.95rem; font-weight:500; }
.video-empty { color:var(--muted); text-align:center; padding:28px 12px; }
.video-empty code { color:var(--gold); }
.playlist-item { cursor:grab; }
.playlist-item.dragging { opacity:.45; }
.playlist-item.drag-over { border-color:var(--gold); background:rgba(var(--accent-rgb),.12); }
.track-main { min-width:0; display:grid; grid-template-columns:1.2fr 1fr; gap:14px; align-items:center; border:0; padding:0; background:none; color:inherit; text-align:left; cursor:pointer; }
.track-download { color:var(--gold); font-size:1.25rem; border:0; background:none; padding:7px 9px; min-width:30px; cursor:pointer; border-radius:8px; line-height:1; }
.track-download:hover,.track-download:focus-visible { background:rgba(var(--accent-rgb),.12); color:#fff0b9; outline:none; }
.section-search{display:flex;gap:9px;align-items:center;margin:0 0 14px}
.section-search input{flex:1;min-width:0;border:1px solid rgba(var(--accent-rgb),.22);border-radius:999px;padding:10px 15px;background:rgba(0,0,0,.16);color:var(--text);outline:none}
.section-search input:focus{border-color:rgba(var(--accent-rgb),.58);box-shadow:0 0 20px rgba(var(--accent-rgb),.08)}
.section-search button{border:1px solid rgba(var(--accent-rgb),.28);border-radius:999px;padding:10px 14px;background:rgba(255,255,255,.035);color:var(--text);cursor:pointer;white-space:nowrap}
.section-search button:hover,.section-search button[aria-pressed="true"]{border-color:rgba(var(--accent-rgb),.55);color:var(--gold);background:rgba(var(--accent-rgb),.09)}
.video-queue{margin:0 0 16px;padding:12px 14px;border:1px solid rgba(var(--accent-rgb),.14);border-radius:15px;background:rgba(0,0,0,.08)}
.video-queue .playlist-heading{margin-bottom:7px}
.video-queue-item{display:grid;grid-template-columns:28px 1fr 32px;gap:10px;align-items:center;padding:8px 6px;border-top:1px solid rgba(255,255,255,.06)}
.video-queue-item:first-child{border-top:0}
.video-queue-item span{color:var(--gold);font-size:.78rem}
.video-queue-item strong{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.86rem}
.video-queue-item button{border:0;background:none;color:var(--muted);font-size:1.1rem;cursor:pointer}
.video-card-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:7px}
.video-card-actions button{border:1px solid rgba(var(--accent-rgb),.2);border-radius:999px;padding:7px 11px;background:rgba(255,255,255,.025);color:var(--text);cursor:pointer;font-size:.72rem;letter-spacing:.04em}
.video-card-actions button:hover{border-color:rgba(var(--accent-rgb),.5);color:var(--gold)}
.playlist-heading { display:flex;justify-content:space-between;align-items:center;margin-bottom:10px; }
.playlist-heading h2 { margin:0;font-size:1.05rem;letter-spacing:.12em; }
.playlist-heading span { color:var(--muted);font-size:.72rem;letter-spacing:.1em; }
.playlist-item { width:100%;display:grid;grid-template-columns:52px 1.2fr 1fr 55px 40px;align-items:center;gap:14px;padding:9px 8px;border:1px solid transparent;border-radius:13px;background:transparent;color:var(--text);text-align:left;cursor:pointer; }
.playlist-item.active { background:rgba(var(--accent-rgb),.09);border-color:rgba(var(--accent-rgb),.4); }
.playlist-item img { width:52px;height:52px;object-fit:cover;border-radius:9px; }
.track-info { display:flex;flex-direction:column;gap:4px;min-width:0; }
.track-info strong { white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.track-info small,.track-album,.track-time,.track-download { color:var(--muted);font-size:.75rem; }
.track-album { white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.track-actions { display:flex;justify-content:flex-end;align-items:center; }
.track-menu { color:var(--gold);font-size:1rem;letter-spacing:.12em;border:0;background:none;padding:7px 5px;min-width:28px;cursor:pointer;border-radius:8px;line-height:1; }
.track-menu:hover,.track-menu:focus-visible { background:rgba(var(--accent-rgb),.12);color:#fff0b9;outline:none; }
.watermark { display:none; text-align:center;margin:26px 0 4px;font-family:"URW Chancery L","Brush Script MT",cursive;font-size:clamp(2.3rem,6vw,4.5rem);font-style:italic;color:rgba(255,255,255,.075);user-select:none; }
footer { text-align:center;color:var(--gold);font-size:.78rem;letter-spacing:.08em;padding-bottom:6px; }
footer span { filter:drop-shadow(0 0 6px rgba(255,80,80,.25)); }
.menu-button,.theme-button { position:fixed;z-index:20;top:18px;width:52px;height:52px;border-radius:16px;border:1px solid rgba(var(--accent-rgb),.32);background:rgba(10,11,22,.62);backdrop-filter:blur(18px);color:var(--gold);font-size:1.45rem;cursor:pointer; }
.menu-button { left:18px; }
.theme-button { right:18px;border-radius:50%; }
.side-panel { position:fixed;z-index:30;top:18px;left:18px;width:min(300px,calc(100vw - 36px));height:calc(100vh - 36px);padding:28px 24px;background:rgba(11,12,23,.86);border:1px solid rgba(255,255,255,.18);border-radius:20px;box-shadow:0 30px 80px rgba(0,0,0,.5);backdrop-filter:blur(28px);transform:translateX(-115%);transition:transform .35s; }
.side-panel.open { transform:translateX(0); }
.close-button { position:absolute;top:12px;right:16px;border:0;background:none;color:var(--gold);font-size:2rem;cursor:pointer; }
.side-title { color:var(--gold);font-size:1rem;letter-spacing:.12em;line-height:1.35; }
.side-rule { height:1px;background:rgba(255,255,255,.12);margin:22px 0; }
.side-label { color:var(--gold);font-size:.7rem;letter-spacing:.13em; }
.side-link { display:flex;flex-direction:column;gap:3px;color:var(--text);text-decoration:none;margin:16px 0;font-size:.9rem; }
.side-link span { color:var(--muted);font-size:.78rem; }
.theme-switch { display:flex;align-items:center;justify-content:center;gap:18px;margin:20px auto 8px;background:none;border:0;color:var(--gold);font-size:1.25rem;cursor:pointer; }
.theme-switch i { width:52px;height:27px;border-radius:999px;border:1px solid rgba(var(--accent-rgb),.45);background:rgba(255,255,255,.08);position:relative; }
.theme-switch i:after { content:"";position:absolute;top:3px;left:4px;width:19px;height:19px;border-radius:50%;background:var(--gold);box-shadow:0 0 12px rgba(var(--accent-rgb),.5);transition:.3s; }
body.light .theme-switch i:after { left:27px; }
.side-panel small { display:block;text-align:center;color:var(--muted); }
.backdrop { position:fixed;inset:0;z-index:25;background:rgba(0,0,0,.38);opacity:0;pointer-events:none;transition:.3s; }
.backdrop.show { opacity:1;pointer-events:auto; }

@media (max-width:820px) {
  .site-shell { padding-top:78px; }
  .player-card { grid-template-columns:1fr; }
  .lyrics-panel { height:280px;min-height:0;max-height:none; }
  .playlist-item { grid-template-columns:52px 1fr 55px 34px; }
  .track-main { grid-template-columns:1fr; }
  .track-album { display:none; }
}
@media (max-width:520px) {
  .site-shell { width:calc(100% - 18px); }
  .site-header { margin-bottom:18px; }
  .eyebrow { font-size:.72rem; }
  .site-logo { max-height:250px; }
  .eyebrow { font-size:.68rem;letter-spacing:.16em; }
  .player-card { padding:13px;border-radius:20px; }
  .lyrics-side { padding:14px; }
  .lyrics-panel { height:240px; }
  .controls { gap:9px; }
  .control-button { width:40px;height:40px; }
  .play-button { width:54px;height:54px; }
  .playlist-card { padding:14px; }
  .track-time { display:none; }
  .playlist-item { grid-template-columns:48px 1fr 30px;gap:10px; }
  .track-main { grid-template-columns:1fr; }
  .playlist-item img { width:48px;height:48px; }
  .video-card { padding:14px; }
  .watermark { margin-top:20px; }
}

/* V15 radio/live-room additions. The original V10 player/lyrics styling is preserved. */
.mode-buttons{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-items:center}
.playlist-toggle.active{background:rgba(var(--accent-rgb),.13);color:var(--gold)}
.radio-status{text-align:center;color:var(--gold);font-size:.7rem;letter-spacing:.13em;margin:10px auto 14px}
.live-room-card{margin:18px 0 14px;padding:18px 20px;background:linear-gradient(145deg,rgba(255,255,255,.105),rgba(255,255,255,.035));border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);backdrop-filter:blur(24px)}
.live-room-stage{position:relative;aspect-ratio:16/9;min-height:240px;border-radius:18px;overflow:hidden;background:#05060c;border:1px solid rgba(var(--accent-rgb),.16)}
.live-room-stage img,.live-room-stage iframe{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:cover}
.live-room-stage iframe.audio-only{width:2px;height:2px;left:auto;top:auto;opacity:.01}
.live-room-actions{display:flex;justify-content:space-between;gap:12px;padding:12px 2px}.live-room-actions label{color:var(--muted);font-size:.75rem;letter-spacing:.08em}.live-room-actions a{color:var(--gold);text-decoration:none;font-size:.72rem;letter-spacing:.1em}
@media(max-width:520px){.live-room-card{padding:14px}.live-room-stage{min-height:190px}.mode-buttons{gap:7px}.playlist-toggle,.stream-toggle{padding:9px 12px}}

/* Community + navigation polish */
body.modal-open{overflow:hidden}
.side-action{display:block;width:100%;margin:12px 0;padding:12px 14px;border:1px solid rgba(var(--accent-rgb),.35);border-radius:13px;background:rgba(255,255,255,.045);color:var(--text);text-align:left;cursor:pointer;letter-spacing:.06em;font-size:.78rem}
.side-action:hover{background:rgba(var(--accent-rgb),.1);border-color:rgba(var(--accent-rgb),.6);color:var(--gold)}
.side-action.support{color:var(--gold)}
.community-mini-count{text-align:center;color:var(--muted);font-size:.72rem;margin:6px 0 14px}
.community-mini-count span{color:var(--gold);font-size:1rem}
.community-modal{position:fixed;inset:0;z-index:60;display:grid;place-items:center;padding:20px;background:rgba(0,0,0,.68);backdrop-filter:blur(12px)}
.community-modal[hidden]{display:none}
.community-dialog{position:relative;width:min(520px,100%);max-height:min(92vh,760px);overflow:auto;padding:30px 28px 24px;text-align:center;border:1px solid rgba(var(--accent-rgb),.38);border-radius:26px;background:linear-gradient(145deg,rgba(35,29,20,.97),rgba(12,13,24,.97));box-shadow:0 30px 100px rgba(0,0,0,.6)}
.community-close{position:absolute;right:15px;top:10px;border:0;background:none;color:var(--gold);font-size:2rem;cursor:pointer}
.community-crest{width:54px;height:54px;margin:0 auto 12px;display:grid;place-items:center;border:1px solid rgba(var(--accent-rgb),.55);border-radius:50%;color:var(--gold);font-size:1.5rem;box-shadow:0 0 30px rgba(var(--accent-rgb),.13)}
.community-dialog h2{margin:8px 0;color:#fff3cb;letter-spacing:.08em;font-size:clamp(1.35rem,5vw,2rem)}
.community-intro{margin:0 auto 20px;max-width:420px;color:var(--muted);line-height:1.55;font-size:.9rem}
#community-form{display:grid;gap:12px;text-align:left}
#community-form label{display:grid;gap:6px;color:#ead8a8;font-size:.78rem;letter-spacing:.07em}
#community-form label span{color:var(--muted);font-size:.68rem;letter-spacing:0}
#community-form input{width:100%;padding:12px 13px;border-radius:11px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.055);color:var(--text);outline:none}
#community-form input:focus{border-color:rgba(var(--accent-rgb),.65);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.08)}
.community-submit{margin-top:4px;padding:13px;border:0;border-radius:999px;background:linear-gradient(145deg,#f2d990,#9e742a);color:#171208;font-weight:700;letter-spacing:.08em;cursor:pointer}
.community-submit:disabled{opacity:.6;cursor:wait}
.community-status{min-height:1.3em;margin:2px 0;text-align:center;color:var(--gold);font-size:.8rem}
.community-foot{margin-top:16px;color:var(--muted);font-size:.72rem;letter-spacing:.05em}.community-foot strong{color:var(--gold);font-size:1rem}
.live-dot{display:inline-block;font-size:.72em;color:#e74a4a;animation:live-blink 1.2s ease-in-out infinite;text-shadow:0 0 10px rgba(231,74,74,.65)}
@keyframes live-blink{0%,100%{opacity:.35;transform:scale(.85)}50%{opacity:1;transform:scale(1.12)}}
.radio-status:before{content:'●';display:inline-block;margin-right:7px;color:var(--gold);animation:live-blink 1.4s ease-in-out infinite}
.video-download{display:inline-block;margin:4px 3px 2px;padding:8px 11px;border:1px solid rgba(var(--accent-rgb),.3);border-radius:999px;color:var(--gold);text-decoration:none;font-size:.68rem;letter-spacing:.08em}
.video-download:hover{background:rgba(var(--accent-rgb),.1);border-color:rgba(var(--accent-rgb),.6);color:#fff0b9}
.live-room-button.active{background:rgba(var(--accent-rgb),.13);color:var(--gold)}
@media(max-width:520px){.community-dialog{padding:28px 18px 20px}.side-action{font-size:.75rem}}


/* FINAL LIGHT THEME FIX — keep every surface and lyric readable */
body.light {
  --bg:#f2eee5; --text:#2b251c; --muted:rgba(43,37,28,.68);
  --glass:rgba(255,255,255,.66); --line:rgba(80,61,24,.18);
  --shadow:0 24px 70px rgba(76,58,24,.16);
  background:
    radial-gradient(circle at 50% 20%, rgba(211,164,62,.16), transparent 28rem),
    radial-gradient(circle at 85% 70%, rgba(130,91,185,.10), transparent 30rem), var(--bg);
}
body.light .eyebrow { color:#8b6728;text-shadow:0 0 12px rgba(180,133,43,.18); }
body.light .logo-aura { opacity:.72; }
body.light .player-card,
body.light .playlist-card,
body.light .video-card,
body.light .live-room-card { background:linear-gradient(145deg,rgba(255,255,255,.80),rgba(255,250,238,.58)); border-color:rgba(93,68,24,.18); }
body.light .lyrics-side { background:rgba(255,255,255,.48); border-color:rgba(93,68,24,.15); }
body.light .lyric-line { color:rgba(43,37,28,.42); }
body.light .lyric-line.active { color:#6b4b16; text-shadow:0 0 18px rgba(171,126,35,.18); }
body.light .control-button,
body.light .stream-toggle,
body.light .playlist-toggle { background:rgba(255,255,255,.58); color:var(--text); }
body.light .track-main,
body.light .playlist-item { color:var(--text); }
body.light .playlist-item.active { background:rgba(var(--accent-rgb),.18); }
body.light .video-item { background:rgba(255,255,255,.48); border-color:rgba(93,68,24,.14); }
body.light .menu-button,
body.light .theme-button { background:rgba(255,255,255,.78); color:#8a621d; border-color:rgba(93,68,24,.22); }
body.light .side-panel { background:rgba(250,247,239,.94); border-color:rgba(93,68,24,.18); }
body.light .side-rule { background:rgba(93,68,24,.14); }
body.light .side-action { background:rgba(255,255,255,.60); }
body.light .community-dialog { background:linear-gradient(145deg,rgba(255,252,243,.98),rgba(239,232,216,.98)); border-color:rgba(126,91,29,.25); }
body.light .community-dialog h2 { color:#4a3820; }
body.light #community-form input { background:rgba(255,255,255,.72); color:#2b251c; border-color:rgba(93,68,24,.18); }
body.light .live-room-stage iframe { background:#ddd6c8; }
body.light .video-download { background:rgba(255,255,255,.45); }
.main-community-button { display:block; margin:10px auto 18px; padding:12px 22px; border:1px solid rgba(var(--accent-rgb),.48); border-radius:999px; background:linear-gradient(145deg,rgba(var(--accent-rgb),.16),rgba(120,77,170,.10)); color:var(--gold); box-shadow:0 8px 28px rgba(0,0,0,.08); cursor:pointer; letter-spacing:.06em; }
.main-community-button span { color:var(--muted); font-size:.72em; margin-left:6px; letter-spacing:.02em; }
.main-community-button:hover { background:rgba(var(--accent-rgb),.18); border-color:rgba(var(--accent-rgb),.72); }
.video-download { cursor:pointer; background:transparent; font-family:inherit; }
.video-download:disabled { opacity:.55; cursor:wait; }
@media(max-width:520px){ .main-community-button { width:calc(100% - 18px); } .main-community-button span { display:block; margin:4px 0 0; } }

/* V18 additions: background media controls, radio EPG, queue, MOG and video options */
.volume-row{display:grid;grid-template-columns:34px 1fr;align-items:center;gap:9px;margin:7px auto 0;width:min(420px,92%);color:var(--muted);font-size:.65rem;letter-spacing:.12em}
.player-options{display:flex;justify-content:center;margin-top:6px}
.player-options button,.video-options label{border:1px solid rgba(var(--accent-rgb),.28);background:rgba(255,255,255,.035);color:var(--muted);border-radius:999px;padding:6px 11px;font-size:.65rem;letter-spacing:.08em;cursor:pointer}
.player-options button.active{color:var(--gold);background:rgba(var(--accent-rgb),.12);border-color:rgba(var(--accent-rgb),.5)}
.queue-card,.mog-card{margin-top:14px;padding:18px 20px;background:linear-gradient(145deg,rgba(255,255,255,.105),rgba(255,255,255,.035));border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
.queue-card[hidden],.mog-card[hidden]{display:none}
.queue-item{display:grid;grid-template-columns:30px 1.2fr 1fr 30px;gap:10px;align-items:center;padding:9px 8px;border-radius:11px;border:1px solid transparent}
.queue-item:hover{background:rgba(var(--accent-rgb),.07)}
.queue-item>span{color:var(--gold);font-size:.75rem}.queue-item strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.queue-item small{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.queue-item button{border:0;background:none;color:var(--muted);font-size:1.1rem;cursor:pointer}.queue-empty{color:var(--muted);text-align:center;padding:12px}
.track-popup{z-index:90;min-width:220px;padding:6px;border:1px solid rgba(var(--accent-rgb),.35);border-radius:13px;background:rgba(18,16,13,.97);box-shadow:0 18px 50px rgba(0,0,0,.5);backdrop-filter:blur(18px)}
.track-popup button{display:block;width:100%;padding:10px 12px;border:0;border-radius:9px;background:none;color:var(--text);text-align:left;font-size:.72rem;letter-spacing:.05em;cursor:pointer}.track-popup button:hover{background:rgba(var(--accent-rgb),.12);color:var(--gold)}
.radio-clock{display:flex;justify-content:space-between;align-items:center;margin:0 0 9px;padding:8px 10px;border-bottom:1px solid rgba(var(--accent-rgb),.15);color:var(--muted);font-size:.66rem;letter-spacing:.08em}.radio-clock span{color:var(--gold);font-size:.9rem}
.radio-epg-item{display:grid;grid-template-columns:78px 1fr;gap:12px;align-items:center;padding:9px 8px;border-radius:10px;border-left:2px solid transparent;transition:.2s}.radio-epg-item.current{background:rgba(var(--accent-rgb),.1);border-left-color:var(--gold);box-shadow:inset 0 0 18px rgba(var(--accent-rgb),.035)}.epg-time{display:flex;flex-direction:column;gap:2px}.epg-time strong{color:var(--gold);font-size:.78rem}.epg-time span{color:var(--muted);font-size:.65rem}.epg-name{display:flex;flex-direction:column;gap:3px;min-width:0}.epg-name strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.86rem}.epg-name small{color:var(--muted);font-size:.65rem}
.video-options{display:flex;justify-content:flex-end;margin:-2px 0 10px}.video-options input{accent-color:var(--gold)}.video-title-row{display:flex;align-items:center;justify-content:space-between;gap:8px}.video-title-row h3{margin:10px 3px 2px}.video-loop{border:1px solid rgba(var(--accent-rgb),.24);border-radius:50%;width:30px;height:30px;background:transparent;color:var(--muted);cursor:pointer}.video-loop.active{color:var(--gold);border-color:rgba(var(--accent-rgb),.55);background:rgba(var(--accent-rgb),.1)}
.mog-card{border-color:rgba(var(--accent-rgb),.3)}
.mog-plaque{position:relative;overflow:hidden;text-align:center;padding:24px 20px 22px;margin-bottom:18px;border:1px solid rgba(var(--accent-rgb),.52);border-radius:20px;background:radial-gradient(circle at 50% 20%,rgba(var(--accent-rgb),.16),transparent 42%),linear-gradient(145deg,rgba(var(--accent-rgb),.09),rgba(255,255,255,.025));box-shadow:inset 0 0 50px rgba(var(--accent-rgb),.045),0 14px 45px rgba(0,0,0,.16)}
.mog-plaque:before,.mog-plaque:after{content:'✦';position:absolute;top:50%;transform:translateY(-50%);color:var(--gold);opacity:.7;font-size:1rem}.mog-plaque:before{left:18%}.mog-plaque:after{right:18%}.mog-ornament{width:44px;height:44px;margin:0 auto 8px;display:grid;place-items:center;border:1px solid rgba(var(--accent-rgb),.55);border-radius:50%;color:var(--gold);box-shadow:0 0 25px rgba(var(--accent-rgb),.14)}.mog-kicker{color:var(--gold);font-size:.62rem;letter-spacing:.2em}.mog-plaque h2{margin:6px 0;font-size:clamp(1.5rem,4vw,2.25rem);letter-spacing:.15em;color:#fff3c8;text-shadow:0 2px 14px rgba(var(--accent-rgb),.2)}.mog-plaque p{margin:0 auto;color:var(--muted);max-width:620px;font-size:.78rem;line-height:1.55}.mog-item{display:grid;grid-template-columns:1fr 38px;gap:8px;align-items:center;padding:7px;border:1px solid transparent;border-radius:13px}.mog-item:hover{background:rgba(var(--accent-rgb),.07);border-color:rgba(var(--accent-rgb),.15)}.mog-main{display:grid;grid-template-columns:38px 1fr;gap:10px;align-items:center;text-align:left;border:0;background:none;color:var(--text);cursor:pointer;min-width:0}.mog-main>span:last-child{display:flex;flex-direction:column;gap:3px;min-width:0}.mog-main strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mog-main small{color:var(--muted);font-size:.68rem}.mog-play{width:32px;height:32px;display:grid;place-items:center;border:1px solid rgba(var(--accent-rgb),.35);border-radius:50%;color:var(--gold);font-size:.7rem}.mog-download{border:1px solid rgba(var(--accent-rgb),.2);background:transparent;color:var(--muted);border-radius:50%;width:32px;height:32px;cursor:pointer}.mog-download:hover{color:var(--gold);border-color:rgba(var(--accent-rgb),.5)}
body.light .queue-card,body.light .mog-card{background:linear-gradient(145deg,rgba(255,255,255,.8),rgba(255,250,238,.58));border-color:rgba(93,68,24,.18)}
body.light .track-popup{background:rgba(255,252,243,.98);border-color:rgba(126,91,29,.25)}
body.light .track-popup button{color:#2b251c}
body.light .mog-plaque{background:radial-gradient(circle at 50% 20%,rgba(var(--accent-rgb),.22),transparent 42%),linear-gradient(145deg,rgba(255,255,255,.66),rgba(255,248,230,.55));}.mog-plaque h2{color:#5b431b}
@media(max-width:520px){.queue-item{grid-template-columns:25px 1fr 28px}.queue-item small{display:none}.radio-epg-item{grid-template-columns:68px 1fr}.mog-plaque:before{left:7%}.mog-plaque:after{right:7%}.mog-card,.queue-card{padding:14px}.track-popup{min-width:205px}}
.mog-plaque{display:block;width:100%;color:inherit;font:inherit;cursor:pointer}.mog-plaque:hover{border-color:rgba(var(--accent-rgb),.78);box-shadow:inset 0 0 65px rgba(var(--accent-rgb),.07),0 16px 55px rgba(0,0,0,.2)}


/* V19: album-art ambience + reactive wave visualizers */
body::before { content:""; position:fixed; inset:-12%; pointer-events:none; z-index:-2; background:radial-gradient(circle at 50% 36%, hsl(var(--art-hue) var(--art-sat) var(--art-light) / .07), transparent 42%); animation:art-breathe 7s ease-in-out infinite; transform:scale(1); }
@keyframes art-breathe { 0%,100%{opacity:.65;transform:scale(1)} 50%{opacity:1;transform:scale(1.045)} }
.controls .control-button, .controls .play-button { box-shadow:0 0 0 1px hsl(var(--art-hue) var(--art-sat) 58% / .10), 0 0 24px hsl(var(--art-hue) var(--art-sat) 58% / .09); }
.controls .control-button:hover { background:hsl(var(--art-hue) var(--art-sat) 55% / .12); border-color:hsl(var(--art-hue) var(--art-sat) 65% / .45); }
.controls .play-button { background:linear-gradient(145deg, hsl(var(--art-hue) var(--art-sat) 82%), #9e742a); }
.player-card, .playlist-card, .video-card, .live-room-card, .queue-card, .mog-card { box-shadow:0 30px 90px rgba(0,0,0,.38), 0 0 80px hsl(var(--art-hue) var(--art-sat) var(--art-light) / .045); }
body.light { --bg:#f3eee5; }
body.light { background:
  radial-gradient(circle at 50% 18%, hsl(var(--art-hue) var(--art-sat) 72% / .20), transparent 31rem),
  radial-gradient(circle at 12% 78%, hsl(calc(var(--art-hue) + 24) var(--art-sat) 76% / .14), transparent 28rem),
  radial-gradient(circle at 88% 72%, hsl(calc(var(--art-hue) - 20) var(--art-sat) 78% / .12), transparent 30rem), var(--bg); }
body.light .lyric-line { color:rgba(33,28,20,.42); }
body.light .lyric-line.active { color:#5a431d; text-shadow:0 0 18px hsl(var(--art-hue) var(--art-sat) 55% / .18); }
body.light .lyrics-side { background:rgba(255,255,255,.42); }
body.light .controls .control-button { color:#342a1c; background:hsl(var(--art-hue) var(--art-sat) 70% / .12); }
.mog-card { margin:14px 0; }
.main-community-button { margin:14px auto 4px; }
@media(max-width:760px){ .art-wave{width:38px;top:18%;bottom:18%;opacity:.62}.art-wave-left{left:-22px}.art-wave-right{right:-22px} }
@media(max-width:520px){ .art-wave{display:none} }
/* Keep the live YouTube player mounted and stable when video is hidden. */
.live-room-stage.live-audio-mode { background-size:cover; background-position:center; }
.live-room-stage.live-audio-mode iframe { opacity:.01; pointer-events:none; }
.live-room-stage.live-audio-mode::after { content:""; position:absolute; inset:0; background:var(--live-thumb, linear-gradient(145deg,#090b14,#1a1620)); background-size:cover; background-position:center; pointer-events:none; }
.live-room-stage.live-audio-mode::before { content:"LIVE • AUDIO MODE"; position:absolute; z-index:3; left:16px; bottom:14px; padding:7px 11px; border:1px solid rgba(var(--accent-rgb),.35); border-radius:999px; background:rgba(5,6,12,.68); color:var(--gold); font-size:.65rem; letter-spacing:.12em; }


/* V20 refinements: MOG as a doorway, queue above playlist, stronger poster ambience, and coffee support modal */
.mog-card{margin:14px 0;padding:0;background:transparent;border:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
.mog-plaque{margin-bottom:0}
.mog-plaque-hint{display:inline-block;margin-top:12px;padding:6px 11px;border:1px solid rgba(var(--accent-rgb),.28);border-radius:999px;color:var(--gold);font-size:.62rem;letter-spacing:.13em;background:rgba(var(--accent-rgb),.06)}
.mog-list-card{margin-top:12px;padding:18px 20px;background:linear-gradient(145deg,rgba(255,255,255,.105),rgba(255,255,255,.035));border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
.mog-list-card[hidden]{display:none}
.mog-item{grid-template-columns:1fr auto}
.mog-actions{display:flex;align-items:center;gap:7px}
.mog-queue,.mog-download{border:1px solid rgba(var(--accent-rgb),.22);background:transparent;color:var(--muted);border-radius:50%;width:32px;height:32px;cursor:pointer}
.mog-queue:hover,.mog-download:hover{color:var(--gold);border-color:rgba(var(--accent-rgb),.55);background:rgba(var(--accent-rgb),.08)}
body.light .mog-list-card{background:linear-gradient(145deg,rgba(255,255,255,.8),rgba(255,250,238,.58));border-color:rgba(93,68,24,.18)}
body{background:
  radial-gradient(circle at 50% 18%,hsl(var(--art-hue) var(--art-sat) var(--art-light) / .30),transparent 34rem),
  radial-gradient(circle at 8% 72%,hsl(calc(var(--art-hue) + 32) var(--art-sat) 58% / .18),transparent 30rem),
  radial-gradient(circle at 92% 70%,hsl(calc(var(--art-hue) - 28) var(--art-sat) 60% / .16),transparent 32rem),var(--bg);}
body::before{background:radial-gradient(circle at 50% 38%,hsl(var(--art-hue) var(--art-sat) var(--art-light) / .14),transparent 48%)}
.lyrics-side{border-color:hsl(var(--art-hue) var(--art-sat) 58% / .24);box-shadow:inset 0 0 70px hsl(var(--art-hue) var(--art-sat) 55% / .055)}
.lyrics-heading{color:hsl(var(--art-hue) var(--art-sat) 70%);text-shadow:0 0 18px hsl(var(--art-hue) var(--art-sat) 58% / .3)}
.lyric-line{color:hsl(var(--art-hue) 38% 72% / .46)}
.lyric-line.active{color:var(--art-contrast);text-shadow:0 0 24px hsl(var(--art-hue) var(--art-sat) 58% / .38)}
.lyric-line.active:before{background:var(--art-contrast);box-shadow:0 0 15px var(--art-color)}
body.light .lyric-line{color:hsl(var(--art-hue) 45% 32% / .56)}
body.light .lyric-line.active{color:hsl(var(--art-hue) 72% 30%);text-shadow:0 0 18px hsl(var(--art-hue) var(--art-sat) 48% / .24)}
body.light .lyrics-heading{color:hsl(var(--art-hue) 72% 34%)}
.queue-card{margin-top:14px}
.support-modal{position:fixed;inset:0;z-index:70;display:grid;place-items:center;padding:20px;background:rgba(0,0,0,.68);backdrop-filter:blur(12px)}
.support-modal[hidden]{display:none}
.support-dialog{position:relative;width:min(470px,100%);padding:30px 26px 24px;text-align:center;border:1px solid rgba(var(--accent-rgb),.46);border-radius:28px;background:radial-gradient(circle at 50% 0%,rgba(var(--accent-rgb),.14),transparent 42%),linear-gradient(145deg,rgba(35,29,20,.98),rgba(12,13,24,.98));box-shadow:0 30px 100px rgba(0,0,0,.65),0 0 70px rgba(var(--accent-rgb),.08)}
.support-close{position:absolute;right:14px;top:8px;border:0;background:none;color:var(--gold);font-size:2rem;cursor:pointer}
.support-icons{display:flex;justify-content:center;gap:13px;margin-bottom:11px;font-size:1.45rem}.support-icons span{width:42px;height:42px;display:grid;place-items:center;border:1px solid rgba(var(--accent-rgb),.32);border-radius:50%;background:rgba(var(--accent-rgb),.055)}
.support-dialog h2{margin:7px 0 10px;color:#fff3cb;letter-spacing:.1em;font-size:clamp(1.45rem,5vw,2rem)}
.support-dialog p{margin:0 auto 18px;max-width:390px;color:var(--muted);line-height:1.6;font-size:.9rem}
.support-number-label{color:var(--gold);font-size:.65rem;letter-spacing:.17em}.support-number{margin:7px 0 16px;font-size:clamp(1.25rem,5vw,1.65rem);letter-spacing:.08em;color:#fff8e6;text-shadow:0 0 18px rgba(var(--accent-rgb),.18)}
.support-actions{display:flex;justify-content:center;gap:9px;flex-wrap:wrap}.support-call,.support-copy{padding:11px 14px;border-radius:999px;border:1px solid rgba(var(--accent-rgb),.34);font:inherit;font-size:.7rem;letter-spacing:.06em;text-decoration:none;cursor:pointer}.support-call{background:linear-gradient(145deg,#f2d990,#9e742a);color:#171208}.support-copy{background:rgba(255,255,255,.045);color:var(--gold)}
.support-thanks{margin-top:15px;color:var(--muted);font-size:.72rem}.side-action.support{font:inherit;cursor:pointer;text-align:center}.side-action.support small{color:var(--muted)}
body.light .support-dialog{background:radial-gradient(circle at 50% 0%,rgba(var(--accent-rgb),.2),transparent 42%),linear-gradient(145deg,rgba(255,252,243,.99),rgba(239,232,216,.99));border-color:rgba(126,91,29,.25)}
body.light .support-dialog h2,body.light .support-number{color:#4a3820}
@media(max-width:520px){.mog-list-card{padding:14px}.support-dialog{padding:28px 18px 22px}.support-actions>*{width:100%}}

/* V21: dedicated M.O.G. mode, royal poster, blinking player badge and private notes */
.mog-card{margin:14px 0;padding:18px 20px;background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.025));border:1px solid rgba(var(--accent-rgb),.24);border-radius:24px;box-shadow:var(--shadow),0 0 65px rgba(var(--accent-rgb),.035);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
.mog-card[hidden]{display:none}.mog-section-head{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:14px;padding:4px 2px 2px}.mog-section-head h2{margin:4px 0 5px;color:#fff2c5;font-size:clamp(1.35rem,4vw,2rem);letter-spacing:.12em}.mog-section-head p{margin:0;color:var(--muted);font-size:.75rem}.mog-kicker{color:var(--gold);font-size:.6rem;letter-spacing:.2em}.mog-section-live{flex:none;color:var(--gold);font-size:.61rem;letter-spacing:.13em;padding:8px 11px;border:1px solid rgba(var(--accent-rgb),.28);border-radius:999px;background:rgba(var(--accent-rgb),.055)}
.mog-list-card{margin-top:0;padding:14px 16px;background:rgba(0,0,0,.11);border:1px solid var(--line);border-radius:19px;box-shadow:inset 0 0 45px rgba(var(--accent-rgb),.025);backdrop-filter:none;-webkit-backdrop-filter:none}.mog-item{grid-template-columns:1fr auto}.mog-main{padding:8px 4px}.mog-play{font-size:.7rem}.mog-download{width:34px;height:34px}
.mog-notes{height:auto;max-height:none;display:flex;flex-direction:column;min-height:0;overflow:hidden;box-sizing:border-box}.mog-notes[hidden]{display:none}.notes-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:4px 0 12px;border-bottom:1px solid hsl(var(--art-hue) var(--art-sat) 58% / .18)}.notes-head strong{display:block;color:hsl(var(--art-hue) var(--art-sat) 70%);font-size:.76rem;letter-spacing:.14em}.notes-head small{display:block;margin-top:4px;color:var(--muted);font-size:.64rem}.notes-head>span{color:var(--gold);font-size:.58rem;letter-spacing:.1em;white-space:nowrap}.notes-toolbar{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:10px 0}.notes-toolbar select,.notes-toolbar input,.notes-toolbar button,.notes-actions button{height:31px;border:1px solid hsl(var(--art-hue) var(--art-sat) 58% / .22);border-radius:8px;background:rgba(255,255,255,.045);color:var(--text);font:inherit;font-size:.68rem}.notes-toolbar select{padding:0 7px;max-width:150px}.notes-toolbar input[type=color]{width:36px;padding:3px;cursor:pointer}.notes-toolbar button{min-width:31px;padding:0 8px;cursor:pointer}.notes-toolbar button:hover,.notes-actions button:hover{border-color:hsl(var(--art-hue) var(--art-sat) 65% / .48);background:hsl(var(--art-hue) var(--art-sat) 55% / .08);color:var(--gold)}.notes-editor{flex:1 1 0;min-height:0;overflow-y:auto;overflow-x:hidden;padding:16px;border:1px solid hsl(var(--art-hue) var(--art-sat) 58% / .2);border-radius:14px;background:rgba(3,5,12,.24);outline:none;color:var(--text);font-family:Georgia,serif;font-size:1rem;line-height:1.7;box-shadow:inset 0 0 35px rgba(0,0,0,.12)}.notes-editor:empty:before{content:attr(data-placeholder);color:var(--muted);pointer-events:none}.notes-editor:focus{border-color:hsl(var(--art-hue) var(--art-sat) 65% / .46);box-shadow:inset 0 0 35px rgba(0,0,0,.12),0 0 25px hsl(var(--art-hue) var(--art-sat) 58% / .06)}.notes-actions{display:flex;justify-content:flex-end;gap:7px;padding-top:10px;flex:0 0 auto;min-height:31px}.notes-actions button{padding:0 10px;cursor:pointer;letter-spacing:.07em}.notes-actions button:first-child{background:linear-gradient(145deg,#f1d78e,#a77b2b);color:#1b1408;border-color:rgba(255,235,164,.45)}
body.light .mog-card{background:linear-gradient(145deg,rgba(255,255,255,.78),rgba(255,250,238,.58));border-color:rgba(93,68,24,.18)}body.light .mog-section-head h2{color:#5b431b}body.light .notes-editor{background:rgba(255,255,255,.52)}body.light .notes-toolbar select,body.light .notes-toolbar button,body.light .notes-actions button{color:#342a1c;background:rgba(255,255,255,.65)}
@media(max-width:760px){.mog-notes{height:auto;max-height:none;min-height:0}.notes-editor{min-height:240px}.mog-section-head{align-items:flex-start;flex-direction:column}.mog-section-live{align-self:flex-start}}
@media(max-width:520px){.mog-card{padding:14px}.notes-toolbar select{max-width:120px}.notes-actions{justify-content:stretch}.notes-actions button{flex:1}.notes-head>span{display:none}}


/* V23 audio safety: every mode is mutually exclusive. */
[hidden], .playlist-card[hidden], .video-card[hidden], .live-room-card[hidden], .queue-card[hidden], .mog-card[hidden] { display:none !important; }

/* The side waves remain decorative rather than depending on WebAudio/CORS. */
.art-wave {
  background: linear-gradient(to bottom, transparent 0%, var(--art-color) 18%, transparent 35%, var(--art-color) 52%, transparent 70%, var(--art-color) 88%, transparent 100%);
  opacity:.42;
  border-radius:50%;
  filter: blur(.2px) drop-shadow(0 0 8px var(--art-color));
  animation: artWavePulse 1.8s ease-in-out infinite;
}
.art-wave-right { animation-delay:-.9s; }
@keyframes artWavePulse {
  0%,100% { transform:scaleY(.72) scaleX(.78); opacity:.25; }
  50% { transform:scaleY(1.05) scaleX(1); opacity:.72; }
}

/* Keep the artwork-derived lyric colour while giving it a reliable contrast floor. */
.lyric-line {
  color:hsl(var(--art-hue) 48% 76% / .72);
  text-shadow:0 1px 8px rgba(0,0,0,.38);
}
.lyric-line.active {
  color:hsl(var(--art-hue) 78% 88%);
  font-weight:600;
  text-shadow:0 0 14px hsl(var(--art-hue) var(--art-sat) 70% / .38), 0 1px 5px rgba(0,0,0,.6);
}
body.light .lyric-line { color:hsl(var(--art-hue) 42% 34% / .78); text-shadow:0 1px 5px rgba(255,255,255,.45); }
body.light .lyric-line.active { color:hsl(var(--art-hue) 68% 25%); text-shadow:0 0 14px hsl(var(--art-hue) var(--art-sat) 48% / .22); }


/* FINAL UPDATE: compact custom crest logo — keep the regal ambience, lose the poster look. */
.logo-stage { width:min(100%, 760px); margin:4px auto 0; }
.site-logo { max-height:230px; }
body.light .eyebrow { color:#6d5222; text-shadow:0 0 12px rgba(145,101,25,.18); }
body.light .logo-aura { opacity:.72; }
body.light .logo-stage::before { opacity:.8; }
body.light .logo-stage::after { opacity:.42; }
@media(max-width:760px){ .logo-stage { width:min(100%, 650px); } .site-logo { max-height:185px; } }
@media(max-width:520px){ .logo-stage { width:min(100%, 560px); } .site-logo { max-height:145px; } }

/* FINAL UPDATE: Live Room audio-only console sits over the working YouTube thumbnail. */
.live-audio-console { position:absolute; z-index:8; left:14px; right:14px; bottom:14px; padding:12px 14px 10px; border:1px solid rgba(var(--accent-rgb),.42); border-radius:17px; background:linear-gradient(145deg,rgba(5,7,17,.88),rgba(16,14,20,.72)); box-shadow:0 18px 48px rgba(0,0,0,.45),0 0 34px rgba(var(--accent-rgb),.08); backdrop-filter:blur(13px); -webkit-backdrop-filter:blur(13px); color:#fff5d7; }
.live-audio-console[hidden] { display:none !important; }
.live-audio-controls { display:grid; grid-template-columns:42px 44px 42px 42px 1fr 42px; align-items:center; gap:8px; }
.live-audio-controls button { width:42px; height:36px; border:1px solid rgba(var(--accent-rgb),.3); border-radius:10px; background:rgba(255,255,255,.055); color:#f9e7ac; cursor:pointer; font-size:.72rem; }
.live-audio-controls button:hover { border-color:rgba(var(--accent-rgb),.7); background:rgba(var(--accent-rgb),.12); }
.live-audio-controls .live-audio-play { width:44px; height:44px; border-radius:50%; background:linear-gradient(145deg,#f2d990,#9e742a); color:#171208; border-color:rgba(255,236,161,.55); box-shadow:0 0 22px rgba(var(--accent-rgb),.2); }
.live-audio-controls span { color:rgba(255,245,215,.78); font:600 .66rem/1 Georgia,serif; text-align:center; font-variant-numeric:tabular-nums; }
.live-audio-controls input[type=range] { min-width:0; }
.live-audio-visual { display:flex; align-items:flex-end; justify-content:center; gap:4px; height:26px; margin-bottom:8px; opacity:.82; }
.live-audio-visual i { display:block; width:3px; height:7px; border-radius:99px; background:linear-gradient(to top,#9e742a,#fff0ad); box-shadow:0 0 8px rgba(var(--accent-rgb),.38); animation:liveBars 1.05s ease-in-out infinite; transform-origin:bottom; }
.live-audio-visual i:nth-child(2){height:13px;animation-delay:-.7s}.live-audio-visual i:nth-child(3){height:19px;animation-delay:-.4s}.live-audio-visual i:nth-child(4){height:10px;animation-delay:-.85s}.live-audio-visual i:nth-child(5){height:22px;animation-delay:-.25s}.live-audio-visual i:nth-child(6){height:15px;animation-delay:-.6s}.live-audio-visual i:nth-child(7){height:24px;animation-delay:-.1s}.live-audio-visual i:nth-child(8){height:12px;animation-delay:-.5s}.live-audio-visual i:nth-child(9){height:20px;animation-delay:-.8s}.live-audio-visual i:nth-child(10){height:14px;animation-delay:-.35s}.live-audio-visual i:nth-child(11){height:22px;animation-delay:-.65s}.live-audio-visual i:nth-child(12){height:9px;animation-delay:-.2s}
.live-audio-console:not(.playing) .live-audio-visual i { animation-play-state:paused; opacity:.48; }
@keyframes liveBars { 0%,100%{transform:scaleY(.42)} 50%{transform:scaleY(1)} }
.live-audio-caption { margin-top:8px; color:rgba(255,245,215,.62); font-size:.58rem; letter-spacing:.15em; text-align:center; }
.live-audio-dot { color:#ff5b61; text-shadow:0 0 9px rgba(255,91,97,.7); }
body.light .live-audio-console { background:linear-gradient(145deg,rgba(36,31,23,.9),rgba(62,51,33,.78)); border-color:rgba(255,224,142,.52); }
@media(max-width:620px){ .live-audio-console{left:8px;right:8px;bottom:8px;padding:9px 9px 8px}.live-audio-controls{grid-template-columns:36px 40px 36px 34px 1fr 34px;gap:5px}.live-audio-controls button{width:36px;height:32px;font-size:.64rem}.live-audio-controls .live-audio-play{width:40px;height:40px}.live-audio-controls span{font-size:.58rem}.live-audio-visual{height:20px;margin-bottom:5px}.live-audio-caption{font-size:.5rem}}

/* Keep M.O.G. queue action visible in both themes. */
body.light .mog-queue, body.light .mog-download { color:#6d5222; border-color:rgba(109,82,34,.25); }
body.light .mog-queue:hover, body.light .mog-download:hover { color:#5a3e12; border-color:rgba(109,82,34,.55); background:rgba(var(--accent-rgb),.12); }

/* V25 — restrained night-sky sparkle atmosphere */
.site-shell::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.32;background:
  radial-gradient(circle at 8% 18%,rgba(255,236,170,.65) 0 1px,transparent 2px),
  radial-gradient(circle at 17% 73%,rgba(255,255,255,.45) 0 1px,transparent 2px),
  radial-gradient(circle at 29% 31%,rgba(255,220,130,.5) 0 1px,transparent 2px),
  radial-gradient(circle at 42% 86%,rgba(255,255,255,.38) 0 1px,transparent 2px),
  radial-gradient(circle at 57% 17%,rgba(255,224,143,.48) 0 1px,transparent 2px),
  radial-gradient(circle at 68% 64%,rgba(255,255,255,.42) 0 1px,transparent 2px),
  radial-gradient(circle at 81% 27%,rgba(255,225,145,.52) 0 1px,transparent 2px),
  radial-gradient(circle at 93% 78%,rgba(255,255,255,.36) 0 1px,transparent 2px);
  animation:cornerStars 11s ease-in-out infinite alternate;}
.site-shell>*{position:relative;z-index:1}
@keyframes cornerStars{0%{opacity:.2;transform:translateY(0)}50%{opacity:.42}100%{opacity:.28;transform:translateY(-5px)}}

/* V25 — compact, readable brand mark */
.logo-stage{width:min(100%,760px);margin:5px auto 0}
.site-logo{width:100%;max-height:230px;object-fit:contain;filter:drop-shadow(0 0 16px rgba(255,208,91,.28)) drop-shadow(0 10px 22px rgba(0,0,0,.28));}
body.light .site-logo{filter:drop-shadow(0 0 13px rgba(161,112,28,.22)) drop-shadow(0 5px 12px rgba(64,47,20,.22));}

/* V25 — LIVE markers belong only to RADIO and LIVE ROOM audio mode */
.radio-live-badge,.live-room-live-badge{position:absolute;z-index:5;display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border:1px solid rgba(255,225,160,.48);border-radius:999px;background:rgba(5,7,15,.78);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:#fff2cc;font-size:.61rem;letter-spacing:.14em;box-shadow:0 0 20px rgba(255,72,72,.08),0 8px 24px rgba(0,0,0,.25);animation:liveBadgePulse 1.35s ease-in-out infinite}
.radio-live-badge{top:12px;right:12px}
.live-room-live-badge{top:14px;right:14px}
.radio-live-badge[hidden],.live-room-live-badge[hidden]{display:none!important}
.radio-live-badge i,.live-room-live-badge i{font-style:normal;color:#ff525a;text-shadow:0 0 10px rgba(255,82,90,.9);animation:liveBadgeDot .9s ease-in-out infinite}
@keyframes liveBadgePulse{50%{opacity:.58;transform:translateY(-1px)}}
@keyframes liveBadgeDot{50%{opacity:.25}}
body.light .radio-live-badge,body.light .live-room-live-badge{background:rgba(32,25,15,.84);color:#fff3cf;border-color:rgba(161,112,28,.5)}
@media(max-width:760px){.logo-stage{width:min(100%,650px)}.site-logo{max-height:190px}}
@media(max-width:520px){.logo-stage{width:min(100%,560px)}.site-logo{max-height:145px}.radio-live-badge{top:9px;right:9px}.live-room-live-badge{top:10px;right:10px}}

/* Video main player — added only above the existing video selector. */
.video-main-player{margin:0 0 18px;padding:12px;border:1px solid rgba(var(--accent-rgb),.18);border-radius:18px;background:rgba(0,0,0,.14)}
.video-main-player video{display:block;width:100%;max-height:70vh;aspect-ratio:16/9;object-fit:contain;background:#000;border-radius:13px}
.video-main-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:10px}
.video-main-controls button{border:1px solid rgba(var(--accent-rgb),.28);background:rgba(255,255,255,.035);color:var(--muted);border-radius:999px;padding:7px 11px;font-size:.68rem;letter-spacing:.07em;cursor:pointer}
.video-main-controls button:hover{color:var(--gold);border-color:rgba(var(--accent-rgb),.5)}
.video-main-volume{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:.65rem;letter-spacing:.08em;margin-left:auto}
.video-main-volume input{width:110px;accent-color:var(--gold)}
.video-main-title{margin:9px 3px 1px;color:var(--text);font-size:.98rem;letter-spacing:.04em}


/* V29: VIDEO PLAYER ONLY. No DOM movement; the proven main player is statically in the upper player area. */
.player-card:has(> .video-main-player:not([hidden])){display:block;}
.player-card:has(> .video-main-player:not([hidden])) > .player-left,
.player-card:has(> .video-main-player:not([hidden])) > .lyrics-side{display:none;}
.player-card:has(> .video-main-player:not([hidden])) > .video-main-player{display:block;width:100%;margin:0;padding:12px;box-sizing:border-box;}
.player-card:has(> .video-main-player:not([hidden])) > .video-main-player video{width:100%;max-height:70vh;aspect-ratio:16/9;object-fit:contain;}


/* V30: restore the subtle mini-galaxy starfield. */
.corner-starfield{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;display:block!important}
.corner-star{position:absolute;width:var(--size);height:var(--size);border-radius:50%;background:#fff5c7;box-shadow:0 0 7px rgba(255,229,153,.85),0 0 15px rgba(255,255,255,.35);opacity:.18;animation:cornerStarTwinkle var(--d) ease-in-out var(--delay) infinite}
.corner-star:nth-child(3n){background:#dbe8ff;box-shadow:0 0 8px rgba(184,210,255,.75)}
.corner-star:nth-child(5n){width:2.8px;height:2.8px}
@keyframes cornerStarTwinkle{0%,100%{opacity:.12;transform:scale(.55)}35%{opacity:.8;transform:scale(1)}52%{opacity:.25;transform:scale(.72)}70%{opacity:.95;transform:scale(1.18)}}
#video-card[hidden]{display:none!important}

.lyrics-side:has(.mog-notes:not([hidden])){display:flex;flex-direction:column;min-height:0;height:100%;box-sizing:border-box}
.lyrics-side:has(.mog-notes:not([hidden])) .mog-notes{flex:1 1 auto;min-height:0}
@media(max-width:760px){.lyrics-side:has(.mog-notes:not([hidden])) .mog-notes{flex:1 1 auto;min-height:0}}

/* Saved M.O.G. notes library */
.saved-notes-modal{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:20px;background:rgba(0,0,0,.72);backdrop-filter:blur(12px)}
.saved-notes-modal[hidden]{display:none}
.saved-notes-dialog{position:relative;width:min(620px,100%);max-height:min(86vh,720px);overflow:auto;padding:30px 28px 24px;border:1px solid rgba(var(--accent-rgb),.38);border-radius:26px;background:linear-gradient(145deg,rgba(35,29,20,.98),rgba(12,13,24,.98));box-shadow:0 30px 100px rgba(0,0,0,.65)}
.saved-notes-close{position:absolute;right:15px;top:10px;border:0;background:none;color:var(--gold);font-size:2rem;cursor:pointer}
.saved-notes-dialog h2{margin:8px 0;color:#fff3cb;letter-spacing:.08em;font-size:clamp(1.35rem,5vw,2rem)}
.saved-notes-intro{margin:0 0 18px;color:var(--muted);line-height:1.55;font-size:.82rem}
.saved-notes-list{display:grid;gap:9px}
.saved-note-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 14px;border:1px solid rgba(var(--accent-rgb),.18);border-radius:13px;background:rgba(255,255,255,.035)}
.saved-note-item strong{display:block;color:var(--text);font-size:.8rem}.saved-note-item small{display:block;margin-top:4px;color:var(--muted);font-size:.65rem}
.saved-note-item>div:last-child{display:flex;gap:6px;flex:none}.saved-note-item button{height:31px;padding:0 10px;border:1px solid rgba(var(--accent-rgb),.25);border-radius:8px;background:rgba(255,255,255,.045);color:var(--text);font:inherit;font-size:.65rem;letter-spacing:.06em;cursor:pointer}.saved-note-item button:hover{border-color:rgba(var(--accent-rgb),.6);color:var(--gold)}
.saved-note-item button:last-child{min-width:31px;color:var(--muted)}
.saved-notes-empty{text-align:center;padding:28px 12px;color:var(--muted);font-size:.78rem}
@media(max-width:520px){.saved-notes-dialog{padding:28px 18px 20px}.saved-note-item{align-items:flex-start}.saved-note-item>div:last-child{flex-direction:column}}

/* V35: isolated M.O.G. Bible reader */
.mog-tools-tabs{display:flex;gap:8px;padding:0 0 12px;border-bottom:1px solid hsl(var(--art-hue) var(--art-sat) 58% / .18);margin-bottom:12px}
.mog-tool-tab{border:1px solid hsl(var(--art-hue) var(--art-sat) 58% / .22);border-radius:10px;padding:9px 14px;background:rgba(255,255,255,.04);color:var(--muted);font:inherit;font-size:.68rem;letter-spacing:.09em;cursor:pointer}
.mog-tool-tab.active{color:#1b1408;background:linear-gradient(145deg,#f1d78e,#a77b2b);border-color:rgba(255,235,164,.45)}
.mog-tool-panel[hidden]{display:none!important}
.mog-tool-panel{min-height:0;flex:1;display:flex;flex-direction:column;overflow:hidden}.bible-panel{min-height:0;display:flex;flex-direction:column;overflow:hidden}
.bible-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:4px 0 12px;border-bottom:1px solid hsl(var(--art-hue) var(--art-sat) 58% / .18)}
.bible-head strong{display:block;color:hsl(var(--art-hue) var(--art-sat) 70%);font-size:.76rem;letter-spacing:.14em}.bible-head small{display:block;margin-top:4px;color:var(--muted);font-size:.64rem}.bible-head>span{color:var(--gold);font-size:.58rem;letter-spacing:.1em;white-space:nowrap}
.bible-search-row,.bible-reference-row{display:grid;gap:7px;padding:10px 0}.bible-search-row{grid-template-columns:auto 1fr auto}.bible-reference-row{grid-template-columns:auto 1fr 1fr 1fr}
.bible-search-row select,.bible-search-row input,.bible-search-row button,.bible-reference-row select,.bible-bookmarks-bar button,.bible-result-actions button,.bible-bookmark-item button{height:34px;border:1px solid hsl(var(--art-hue) var(--art-sat) 58% / .22);border-radius:8px;background:rgba(255,255,255,.045);color:var(--text);font:inherit;font-size:.68rem;padding:0 9px}
.bible-search-row input{min-width:0}.bible-search-row button,.bible-bookmarks-bar button,.bible-result-actions button,.bible-bookmark-item button{cursor:pointer}.bible-search-row button:hover,.bible-bookmarks-bar button:hover,.bible-result-actions button:hover,.bible-bookmark-item button:hover{border-color:hsl(var(--art-hue) var(--art-sat) 65% / .48);color:var(--gold)}
.bible-bookmarks-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:2px 0 10px}.bible-bookmarks-bar strong{font-size:.62rem;letter-spacing:.13em;color:var(--muted)}
.bible-results{flex:1;min-height:0;overflow:auto;padding-right:2px}.bible-empty{padding:28px 12px;text-align:center;color:var(--muted);font-size:.78rem}.bible-empty code{color:var(--gold)}.bible-result-title{font-size:.63rem;letter-spacing:.14em;color:var(--muted);padding:3px 0 8px}.bible-result{padding:13px 14px;margin-bottom:9px;border:1px solid hsl(var(--art-hue) var(--art-sat) 58% / .18);border-radius:13px;background:rgba(255,255,255,.035)}.bible-result.highlighted{border-color:rgba(var(--accent-rgb),.65);background:linear-gradient(145deg,rgba(var(--accent-rgb),.16),rgba(255,255,255,.035));box-shadow:0 0 20px rgba(var(--accent-rgb),.08)}
.bible-reference{display:flex;align-items:center;justify-content:space-between;gap:10px}.bible-reference strong{font-size:.84rem;color:var(--gold)}.bible-reference span,.bible-bookmark-item span{font-size:.58rem;letter-spacing:.08em;color:var(--muted)}.bible-text{padding:8px 0 5px;font-family:Georgia,serif;font-size:.95rem;line-height:1.65}.bible-result-actions{display:flex;justify-content:flex-end;gap:7px}.bible-result-actions button{height:29px;font-size:.59rem}.bible-bookmark-item{display:flex;justify-content:space-between;gap:12px;padding:12px 14px;margin-bottom:8px;border:1px solid hsl(var(--art-hue) var(--art-sat) 58% / .18);border-radius:13px;background:rgba(255,255,255,.035)}.bible-bookmark-item strong{display:block;color:var(--gold);font-size:.82rem}.bible-bookmark-item p{margin:5px 0 0;font-family:Georgia,serif;font-size:.84rem;line-height:1.5}.bible-bookmark-item>div:last-child{display:flex;gap:5px;align-items:flex-start}.bible-bookmark-item button{height:29px;font-size:.59rem}.bible-bookmark-item button[data-remove]{width:29px;padding:0}
body.light .bible-search-row select,body.light .bible-search-row input,body.light .bible-search-row button,body.light .bible-reference-row select,body.light .bible-bookmarks-bar button,body.light .bible-result-actions button,body.light .bible-bookmark-item button{color:#342a1c;background:rgba(255,255,255,.65)}
@media(max-width:760px){.bible-panel{min-height:0;height:100%}.bible-results{min-height:0}}
@media(max-width:520px){.mog-tools-tabs{gap:5px}.mog-tool-tab{flex:1;padding:8px 7px}.bible-bookmark-item{flex-direction:column}.bible-bookmark-item>div:last-child{justify-content:flex-end}}

.bible-attribution{padding:9px 0 0;color:var(--muted);font-size:.56rem;line-height:1.5;border-top:1px solid hsl(var(--art-hue) var(--art-sat) 58% / .12);margin-top:8px}.bible-attribution a{color:var(--gold);text-decoration:none}.bible-attribution a:hover{text-decoration:underline}
.bible-search-row{grid-template-columns:auto 1fr auto}
@media(max-width:900px){.bible-reference-row{grid-template-columns:1fr 1fr}.bible-search-row input{min-width:0}}
@media(max-width:520px){.bible-search-row,.bible-reference-row{grid-template-columns:1fr}.bible-search-row input,.bible-search-row button{grid-column:auto}}

/* M.O.G. note-selection tools: compact popup for selected text only. */
.notes-selection-popup{position:fixed;z-index:10000;display:flex;align-items:center;gap:5px;padding:6px;border:1px solid hsl(var(--art-hue) var(--art-sat) 65% / .28);border-radius:10px;background:rgba(12,15,24,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 10px 28px rgba(0,0,0,.28)}
.notes-selection-popup[hidden]{display:none}
.notes-selection-popup select,.notes-selection-popup button,.notes-selection-popup input{height:29px;border:1px solid hsl(var(--art-hue) var(--art-sat) 65% / .25);border-radius:7px;background:rgba(255,255,255,.055);color:var(--text);font:inherit;font-size:.67rem}
.notes-selection-popup select{max-width:120px;padding:0 6px}.notes-selection-popup button{min-width:29px;padding:0 8px;cursor:pointer}.notes-selection-popup input[type=color]{width:32px;padding:3px;cursor:pointer}.notes-selection-popup button:hover,.notes-selection-popup select:hover,.notes-selection-popup input:hover{border-color:hsl(var(--art-hue) var(--art-sat) 70% / .5);color:var(--gold)}

body.light .notes-selection-popup{background:rgba(255,255,255,.92);border-color:rgba(93,68,24,.2)}
body.light .notes-selection-popup select,body.light .notes-selection-popup button,body.light .notes-selection-popup input{color:#342a1c;background:rgba(255,255,255,.72)}

/* Keep content above the decorative crystal sheen. */
.player-card > *, .playlist-card > *, .video-card > *, .live-room-card > *, .queue-card > *, .mog-card > *{position:relative;z-index:1}
body[data-accent="purple"] .play-button,body[data-accent="blue"] .play-button,body[data-accent="red"] .play-button,body[data-accent="green"] .play-button,body[data-accent="turquoise"] .play-button{background:linear-gradient(145deg,var(--gold),var(--gold2));box-shadow:0 0 28px rgba(var(--accent-rgb),.22)}

/* Make Notes and Bible share the exact same full-height M.O.G. window. */
.lyrics-side:has(.mog-notes:not([hidden])) .mog-tool-panel{height:100%;min-height:0}
.lyrics-side:has(.mog-notes:not([hidden])) .bible-panel{height:100%;min-height:0}
body[data-accent="purple"] .mog-section-head h2,body[data-accent="blue"] .mog-section-head h2,body[data-accent="red"] .mog-section-head h2,body[data-accent="green"] .mog-section-head h2,body[data-accent="turquoise"] .mog-section-head h2{color:var(--gold)}

/* 2026-10-07 polish: crystal themes use the selected accent throughout. */
body[data-accent]:not([data-accent="gold"]) .eyebrow,
body[data-accent]:not([data-accent="gold"]) .lyrics-heading,
body[data-accent]:not([data-accent="gold"]) .mog-section-head h2,
body[data-accent]:not([data-accent="gold"]) .mog-kicker,
body[data-accent]:not([data-accent="gold"]) .mog-section-live,
body[data-accent]:not([data-accent="gold"]) .mog-plaque h2,
body[data-accent]:not([data-accent="gold"]) .notes-head>span,
body[data-accent]:not([data-accent="gold"]) .bible-head>span,
body[data-accent]:not([data-accent="gold"]) .bible-reference strong,
body[data-accent]:not([data-accent="gold"]) .saved-notes-close,
body[data-accent]:not([data-accent="gold"]) .saved-notes-dialog h2,
body[data-accent]:not([data-accent="gold"]) .bible-result-title,
body[data-accent]:not([data-accent="gold"]) .radio-live-badge,
body[data-accent]:not([data-accent="gold"]) .live-room-live-badge,
body[data-accent]:not([data-accent="gold"]) .bible-attribution a{color:var(--gold)}
body[data-accent]:not([data-accent="gold"]) .play-button,
body[data-accent]:not([data-accent="gold"]) .community-submit,
body[data-accent]:not([data-accent="gold"]) .support-call,
body[data-accent]:not([data-accent="gold"]) .live-audio-controls .live-audio-play,
body[data-accent]:not([data-accent="gold"]) .notes-actions button:first-child,
body[data-accent]:not([data-accent="gold"]) .mog-tool-tab.active{background:linear-gradient(145deg,var(--gold),var(--gold2));color:#171208;border-color:rgba(var(--accent-rgb),.55)}
body[data-accent]:not([data-accent="gold"]) .lyric-line.active,
body[data-accent]:not([data-accent="gold"]) .track-download:hover,
body[data-accent]:not([data-accent="gold"]) .track-download:focus-visible,
body[data-accent]:not([data-accent="gold"]) .track-menu:hover,
body[data-accent]:not([data-accent="gold"]) .track-menu:focus-visible,
body[data-accent]:not([data-accent="gold"]) .video-download:hover,
body[data-accent]:not([data-accent="gold"]) .live-audio-controls button{color:var(--gold)}
body[data-accent]:not([data-accent="gold"]) .logo-sparkles{color:var(--gold);text-shadow:0 0 8px var(--gold),0 0 18px rgba(var(--accent-rgb),.7)}
body[data-accent]:not([data-accent="gold"]) .corner-star{background:var(--gold);box-shadow:0 0 7px rgba(var(--accent-rgb),.65),0 0 15px rgba(255,255,255,.28)}

/* Replace the sharp panel light streak with very subtle, slow flowing accent wisps. */
body[data-accent]:not([data-accent="gold"]) .player-card::after,
body[data-accent]:not([data-accent="gold"]) .playlist-card::after,
body[data-accent]:not([data-accent="gold"]) .video-card::after,
body[data-accent]:not([data-accent="gold"]) .live-room-card::after,
body[data-accent]:not([data-accent="gold"]) .queue-card::after,
body[data-accent]:not([data-accent="gold"]) .mog-card::after{
  inset:-20% -10%;
  background:
    radial-gradient(ellipse 34% 12% at 12% 70%,rgba(var(--accent-rgb),.10),transparent 72%),
    radial-gradient(ellipse 30% 10% at 70% 28%,rgba(var(--accent-rgb),.075),transparent 72%),
    radial-gradient(ellipse 26% 9% at 42% 82%,rgba(var(--accent-rgb),.055),transparent 72%);
  filter:blur(8px);
  transform:translate3d(-7%,0,0) rotate(-4deg) scale(1.12);
  animation:crystalWispFlow 18s ease-in-out infinite alternate;
}
@keyframes crystalWispFlow{
  0%{transform:translate3d(-8%,2%,0) rotate(-4deg) scale(1.12);opacity:.42}
  50%{transform:translate3d(4%,-2%,0) rotate(2deg) scale(1.16);opacity:.68}
  100%{transform:translate3d(9%,3%,0) rotate(-2deg) scale(1.1);opacity:.42}
}

/* Notes and Bible occupy the same bounded M.O.G. window. */
.lyrics-side:has(.mog-notes:not([hidden])) .mog-notes{height:100%;max-height:none;min-height:0}
.lyrics-side:has(.mog-notes:not([hidden])) .mog-tool-panel{height:100%;min-height:0}
.lyrics-side:has(.mog-notes:not([hidden])) .bible-panel{height:100%;min-height:0}

/* 2026-10-07: user-named M.O.G. notes */
.notes-head > div{min-width:0;flex:1}
#notes-title{display:block;width:min(100%,420px);margin-top:7px;height:32px;padding:0 10px;border:1px solid rgba(var(--accent-rgb),.24);border-radius:9px;background:rgba(255,255,255,.035);color:var(--text);font:inherit;font-size:.72rem;letter-spacing:.04em;outline:none}
#notes-title::placeholder{color:var(--muted);opacity:.85}
#notes-title:focus{border-color:rgba(var(--accent-rgb),.58);box-shadow:0 0 18px rgba(var(--accent-rgb),.08)}

/* Keep Bible inside the same bounded M.O.G. window as Notes. */
.lyrics-side:has(.mog-notes:not([hidden])){height:100%;min-height:0;overflow:hidden}
.lyrics-side:has(.mog-notes:not([hidden])) .mog-notes{height:100%;max-height:100%;min-height:0;overflow:hidden}
.lyrics-side:has(.mog-notes:not([hidden])) .mog-tool-panel{height:100%;min-height:0;max-height:100%;overflow:hidden}
.lyrics-side:has(.mog-notes:not([hidden])) .bible-panel{height:100%;min-height:0;max-height:100%;overflow:hidden}
.lyrics-side:has(.mog-notes:not([hidden])) .bible-results{min-height:0;overflow-y:auto;overflow-x:hidden}

/* Crystal river wisps: two slow, diagonal, layered light currents. No animated blur/filter. */
body[data-accent]:not([data-accent="gold"]) .player-card::before,
body[data-accent]:not([data-accent="gold"]) .playlist-card::before,
body[data-accent]:not([data-accent="gold"]) .video-card::before,
body[data-accent]:not([data-accent="gold"]) .live-room-card::before,
body[data-accent]:not([data-accent="gold"]) .queue-card::before,
body[data-accent]:not([data-accent="gold"]) .mog-card::before{
  content:"";position:absolute;inset:-25% -18%;pointer-events:none;z-index:0;
  background:
    radial-gradient(ellipse 58% 7% at 18% 78%,rgba(var(--accent-rgb),.16) 0%,rgba(var(--accent-rgb),.09) 34%,transparent 72%),
    radial-gradient(ellipse 44% 5% at 63% 34%,rgba(255,255,255,.065) 0%,rgba(var(--accent-rgb),.08) 32%,transparent 72%);
  transform:translate3d(-9%,5%,0) rotate(-7deg) scale(1.08);
  opacity:.62;mix-blend-mode:screen;will-change:transform,opacity;
  animation:crystalRiverWispA 22s ease-in-out infinite alternate;
}
body[data-accent]:not([data-accent="gold"]) .player-card::after,
body[data-accent]:not([data-accent="gold"]) .playlist-card::after,
body[data-accent]:not([data-accent="gold"]) .video-card::after,
body[data-accent]:not([data-accent="gold"]) .live-room-card::after,
body[data-accent]:not([data-accent="gold"]) .queue-card::after,
body[data-accent]:not([data-accent="gold"]) .mog-card::after{
  content:"";position:absolute;inset:-28% -16%;pointer-events:none;z-index:0;
  background:
    radial-gradient(ellipse 48% 5% at 10% 54%,rgba(var(--accent-rgb),.10) 0%,transparent 70%),
    radial-gradient(ellipse 62% 6% at 76% 68%,rgba(var(--accent-rgb),.12) 0%,rgba(255,255,255,.035) 38%,transparent 74%),
    radial-gradient(ellipse 35% 4% at 48% 18%,rgba(var(--accent-rgb),.07) 0%,transparent 72%);
  transform:translate3d(8%,-3%,0) rotate(-9deg) scale(1.12);
  opacity:.5;mix-blend-mode:screen;will-change:transform,opacity;
  animation:crystalRiverWispB 27s ease-in-out infinite alternate;
}
@keyframes crystalRiverWispA{
  0%{transform:translate3d(-10%,5%,0) rotate(-7deg) scale(1.08);opacity:.38}
  50%{transform:translate3d(1%,-1%,0) rotate(-2deg) scale(1.12);opacity:.64}
  100%{transform:translate3d(10%,4%,0) rotate(-6deg) scale(1.09);opacity:.42}
}
@keyframes crystalRiverWispB{
  0%{transform:translate3d(9%,-3%,0) rotate(-9deg) scale(1.12);opacity:.28}
  50%{transform:translate3d(-2%,3%,0) rotate(-5deg) scale(1.16);opacity:.52}
  100%{transform:translate3d(-10%,-1%,0) rotate(-8deg) scale(1.1);opacity:.3}
}
@media(prefers-reduced-motion:reduce){
  body[data-accent]:not([data-accent="gold"]) .player-card::before,
  body[data-accent]:not([data-accent="gold"]) .playlist-card::before,
  body[data-accent]:not([data-accent="gold"]) .video-card::before,
  body[data-accent]:not([data-accent="gold"]) .live-room-card::before,
  body[data-accent]:not([data-accent="gold"]) .queue-card::before,
  body[data-accent]:not([data-accent="gold"]) .mog-card::before,
  body[data-accent]:not([data-accent="gold"]) .player-card::after,
  body[data-accent]:not([data-accent="gold"]) .playlist-card::after,
  body[data-accent]:not([data-accent="gold"]) .video-card::after,
  body[data-accent]:not([data-accent="gold"]) .live-room-card::after,
  body[data-accent]:not([data-accent="gold"]) .queue-card::after,
  body[data-accent]:not([data-accent="gold"]) .mog-card::after{animation:none}
}
/* The river wisps also follow the gold theme; remove the previous blur-based streak entirely. */
body[data-accent] .player-card::before,
body[data-accent] .playlist-card::before,
body[data-accent] .video-card::before,
body[data-accent] .live-room-card::before,
body[data-accent] .queue-card::before,
body[data-accent] .mog-card::before,
body[data-accent] .player-card::after,
body[data-accent] .playlist-card::after,
body[data-accent] .video-card::after,
body[data-accent] .live-room-card::after,
body[data-accent] .queue-card::after,
body[data-accent] .mog-card::after{filter:none}

/* 2026-10-11 gemstone finish: small faceted highlights, low-cost gradients, no blur filters. */
body[data-accent] .play-button,
body[data-accent] .menu-button,
body[data-accent] .theme-button,
body[data-accent] .section-search button,
body[data-accent] .video-card-actions button,
body[data-accent] .mog-tool-tab,
body[data-accent] .notes-actions button,
body[data-accent] .saved-notes-dialog button,
body[data-accent] .bible-panel button,
body[data-accent] .bible-panel select,
body[data-accent] .bible-panel input,
body[data-accent] .notes-head input,
body[data-accent] .notes-actions select {
  border-color:rgba(var(--accent-rgb),.48);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),inset 0 -1px 0 rgba(0,0,0,.28),0 0 0 1px rgba(var(--accent-rgb),.045);
  transition:border-color .22s ease,box-shadow .22s ease,background-color .22s ease,color .22s ease;
}
body[data-accent] .play-button,
body[data-accent] .section-search button,
body[data-accent] .video-card-actions button,
body[data-accent] .mog-tool-tab,
body[data-accent] .notes-actions button,
body[data-accent] .saved-notes-dialog button,
body[data-accent] .bible-panel button {
  background-image:linear-gradient(145deg,rgba(255,255,255,.13),transparent 42%,rgba(0,0,0,.13));
  text-shadow:0 1px 0 rgba(255,255,255,.12);
}
body[data-accent] .play-button:hover,
body[data-accent] .menu-button:hover,
body[data-accent] .theme-button:hover,
body[data-accent] .section-search button:hover,
body[data-accent] .video-card-actions button:hover,
body[data-accent] .mog-tool-tab:hover,
body[data-accent] .notes-actions button:hover,
body[data-accent] .saved-notes-dialog button:hover,
body[data-accent] .bible-panel button:hover {
  border-color:rgba(var(--accent-rgb),.82);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3),inset 0 -1px 0 rgba(0,0,0,.2),0 0 13px rgba(var(--accent-rgb),.16);
}
body[data-accent] select,
body[data-accent] input:not([type="checkbox"]):not([type="range"]):not([type="color"]),
body[data-accent] textarea {
  accent-color:var(--gold);
}
body[data-accent] .lyrics-heading,
body[data-accent] .playlist-heading h2,
body[data-accent] .mog-section-head h2,
body[data-accent] .notes-head>div>span,
body[data-accent] .bible-head>span {
  text-shadow:0 0 1px rgba(255,255,255,.22),0 0 12px rgba(var(--accent-rgb),.18);
}
@media(prefers-reduced-motion:reduce){
  body[data-accent] .play-button,
  body[data-accent] .menu-button,
  body[data-accent] .theme-button,
  body[data-accent] .section-search button,
  body[data-accent] .video-card-actions button,
  body[data-accent] .mog-tool-tab,
  body[data-accent] .notes-actions button,
  body[data-accent] .saved-notes-dialog button,
  body[data-accent] .bible-panel button{transition:none}
}

/* V20: queue duration / repeat controls; additive styling only */
.queue-time-tools{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:8px 0 12px;padding:9px 11px;border:1px solid rgba(var(--accent-rgb),.16);border-radius:12px;background:rgba(0,0,0,.06)}
.queue-time-readout{color:var(--muted);font-size:.68rem;letter-spacing:.045em;line-height:1.5}
.queue-repeat-button{border:1px solid rgba(var(--accent-rgb),.28);border-radius:999px;padding:7px 11px;background:rgba(255,255,255,.035);color:var(--muted);font-size:.65rem;letter-spacing:.06em;cursor:pointer;white-space:nowrap}
.queue-repeat-button:hover,.queue-repeat-button.active{border-color:rgba(var(--accent-rgb),.55);color:var(--gold);background:rgba(var(--accent-rgb),.09)}
.queue-item:not(:has(button:hover)){cursor:pointer}
.video-queue-item:hover{background:rgba(var(--accent-rgb),.055)}
@media(max-width:520px){.queue-time-tools{align-items:flex-start}.queue-time-readout{width:100%;font-size:.64rem}.queue-repeat-button{max-width:100%}}
.mog-queue-panel{margin-top:16px;padding:12px;border:1px solid rgba(var(--accent-rgb),.16);border-radius:15px;background:rgba(0,0,0,.055)}
.mog-queue-panel[hidden]{display:none!important}
.mog-queue-heading{display:flex;flex-direction:column;gap:4px;margin-bottom:8px}
.mog-queue-heading strong{font-size:.72rem;letter-spacing:.12em;color:var(--gold)}
.mog-queue-heading span{font-size:.68rem;color:var(--muted)}
.mog-queue-item{display:grid;grid-template-columns:24px minmax(0,1fr) 28px;gap:8px;align-items:center;padding:7px 4px;border-top:1px solid rgba(255,255,255,.055)}
.mog-queue-item>span{font-size:.72rem;color:var(--gold)}
.mog-queue-play{display:flex;flex-direction:column;min-width:0;gap:3px;text-align:left;border:0;background:transparent;color:var(--text);cursor:pointer}
.mog-queue-play strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.82rem}
.mog-queue-play small{font-size:.66rem;color:var(--muted)}
.mog-queue-remove{border:0;background:transparent;color:var(--muted);font-size:1.1rem;cursor:pointer}


/* Isolated Personal Audio Bible beta styles */
.audio-bible-beta-panel{margin:18px 0 24px;padding:clamp(14px,2.2vw,24px);border:1px solid var(--line,rgba(255,255,255,.14));border-radius:24px;background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(0,0,0,.10));box-shadow:var(--shadow,0 14px 42px rgba(0,0,0,.16));backdrop-filter:blur(20px);color:var(--text,#f5f0e7)}
.audio-bible-beta-panel[hidden]{display:none!important}
.audio-bible-beta-toggle.active{background:rgba(var(--accent-rgb),.16);color:var(--gold,#e8ca83);box-shadow:0 0 22px rgba(var(--accent-rgb),.12)}
.audio-bible-beta-hero{display:flex;align-items:center;gap:18px;padding:4px 0 18px;border-bottom:1px solid var(--line,rgba(255,255,255,.14))}
.audio-bible-beta-cover{width:84px;min-width:84px;filter:drop-shadow(0 8px 12px rgba(0,0,0,.22))}.audio-bible-beta-cover svg{display:block;width:100%;height:auto}
.audio-bible-beta-eyebrow{margin:0 0 6px;color:var(--gold,#e8ca83);font-size:.67rem;letter-spacing:.15em;font-weight:700}
.audio-bible-beta-intro h2{margin:0 0 6px;font-size:clamp(1.35rem,3vw,1.9rem)}.audio-bible-beta-intro p:last-child{margin:0;color:var(--muted,#aaa5a0);line-height:1.55}
.audio-bible-beta-toolbar{display:grid;grid-template-columns:minmax(130px,.7fr) minmax(180px,1.3fr);gap:12px;margin:18px 0 12px}
.audio-bible-beta-toolbar label,.audio-bible-beta-sleep-row label,.audio-bible-beta-text-head label{display:flex;flex-direction:column;gap:6px;font-size:.76rem;color:var(--muted,#aaa5a0)}
.audio-bible-beta-panel input,.audio-bible-beta-panel select{width:100%;min-width:0;padding:10px 11px;border:1px solid var(--line,rgba(255,255,255,.17));border-radius:10px;background:rgba(0,0,0,.16);color:var(--text,#f5f0e7);font:inherit}
.audio-bible-beta-panel select option{background:#17151b;color:#f5f0e7}
.audio-bible-beta-status{margin:10px 0 16px;color:var(--gold,#e8ca83);font-size:.8rem;line-height:1.5}
.audio-bible-beta-layout{display:grid;grid-template-columns:minmax(160px,.65fr) minmax(0,1.65fr);gap:16px;align-items:start}
.audio-bible-beta-book-column,.audio-bible-beta-now,.audio-bible-beta-text-card{min-width:0;padding:15px;border:1px solid var(--line,rgba(255,255,255,.13));border-radius:17px;background:rgba(0,0,0,.075)}
.audio-bible-beta-book-column h3,.audio-bible-beta-now h3,.audio-bible-beta-text-card h3{margin:0 0 10px;font-size:1rem}
.audio-bible-beta-books{display:grid;gap:6px;max-height:360px;overflow:auto;padding-right:3px}
.audio-bible-beta-book-button{width:100%;text-align:left;padding:9px 10px;border:1px solid transparent;border-radius:9px;background:rgba(255,255,255,.035);color:var(--text,#f5f0e7);cursor:pointer;font:inherit;font-size:.84rem}
.audio-bible-beta-book-button:hover,.audio-bible-beta-book-button[aria-current=true]{border-color:rgba(var(--accent-rgb),.45);background:rgba(var(--accent-rgb),.12);color:var(--gold,#e8ca83)}
.audio-bible-beta-main{display:grid;gap:14px;min-width:0}.audio-bible-beta-muted{color:var(--muted,#aaa5a0);font-size:.84rem;line-height:1.55}
#audio-bible-beta-audio{display:block;width:100%;margin:14px 0 10px}
.audio-bible-beta-player-buttons{display:flex;gap:8px;flex-wrap:wrap}.audio-bible-beta-player-buttons button{border:1px solid var(--line,rgba(255,255,255,.16));border-radius:999px;padding:8px 12px;background:rgba(255,255,255,.045);color:var(--text,#f5f0e7);cursor:pointer;font:inherit;font-size:.78rem}
.audio-bible-beta-sleep-row{display:grid;grid-template-columns:minmax(90px,.5fr) minmax(130px,1fr) minmax(80px,.8fr);gap:10px;align-items:end;margin-top:14px}.audio-bible-beta-sleep-row span{font-size:.75rem;color:var(--gold,#e8ca83);padding-bottom:10px}
.audio-bible-beta-text-head{display:flex;justify-content:space-between;align-items:end;gap:12px;margin-bottom:12px}.audio-bible-beta-text-head h3{margin-bottom:0}.audio-bible-beta-text-controls{display:flex;gap:8px;align-items:end;flex-wrap:wrap}.audio-bible-beta-text-head label{min-width:100px;max-width:190px}.audio-bible-beta-text{max-height:450px;overflow:auto;padding:4px 6px 4px 2px;line-height:1.8;font-size:.95rem;overflow-wrap:anywhere}.audio-bible-beta-text h4{margin:10px 0;color:var(--gold,#e8ca83);font-size:.88rem;letter-spacing:.05em}.audio-bible-beta-verse-flow{margin:0;white-space:pre-wrap}.audio-bible-beta-verse{display:inline}.audio-bible-beta-verse sup{margin-right:3px;color:var(--gold,#e8ca83);font-size:.67em;font-weight:700}
@media(max-width:680px){.audio-bible-beta-text-head{align-items:flex-start;flex-direction:column}.audio-bible-beta-text-controls{width:100%}.audio-bible-beta-text-controls label{flex:1;min-width:120px}.audio-bible-beta-layout{grid-template-columns:1fr}.audio-bible-beta-books{grid-template-columns:repeat(2,minmax(0,1fr));max-height:240px}.audio-bible-beta-toolbar{grid-template-columns:1fr 1fr}.audio-bible-beta-sleep-row{grid-template-columns:1fr 1fr}.audio-bible-beta-sleep-row span{grid-column:1/-1;padding:0}.audio-bible-beta-cover{width:68px;min-width:68px}}
@media(max-width:420px){.audio-bible-beta-toolbar{grid-template-columns:1fr}.audio-bible-beta-hero{align-items:flex-start}.audio-bible-beta-books{grid-template-columns:1fr}.audio-bible-beta-panel{padding:12px}.audio-bible-beta-book-column,.audio-bible-beta-now,.audio-bible-beta-text-card{padding:12px}}


/* Independent Live Room community comments; isolated from the YouTube player. */
.live-comments-panel{margin:20px 0 2px;padding:clamp(14px,2.5vw,22px);border:1px solid rgba(var(--accent-rgb),.30);border-radius:20px;background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.025));box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 12px 34px rgba(0,0,0,.16);color:var(--text);}
.live-comments-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}
.live-comments-title{margin:0;color:var(--gold);font-size:clamp(.85rem,2vw,1rem);letter-spacing:.13em;text-shadow:0 0 14px rgba(var(--accent-rgb),.25)}
.live-comments-subtitle{margin:5px 0 0;color:var(--muted);font-size:.78rem;line-height:1.5}
.live-comments-refresh,.live-comments-post,.live-comment-action{border:1px solid rgba(var(--accent-rgb),.38);border-radius:999px;background:linear-gradient(145deg,rgba(255,255,255,.12),rgba(var(--accent-rgb),.10));color:var(--text);padding:9px 13px;cursor:pointer;font:inherit;font-size:.75rem;box-shadow:inset 0 1px 0 rgba(255,255,255,.15);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.live-comments-refresh:hover,.live-comments-post:hover,.live-comment-action:hover{transform:translateY(-1px);box-shadow:0 0 16px rgba(var(--accent-rgb),.17),inset 0 1px 0 rgba(255,255,255,.2)}
.live-comments-refresh:disabled,.live-comments-post:disabled,.live-comment-action:disabled{opacity:.6;cursor:wait;transform:none}
.live-comments-status{min-height:1.2em;margin:10px 0 12px;color:var(--muted);font-size:.76rem;line-height:1.5}
.live-comments-status.is-error{color:#ffb6a9}
.live-comments-form,.live-comment-reply-form{display:grid;gap:9px;margin:0 0 18px}
.live-comments-name,.live-comments-message{box-sizing:border-box;width:100%;min-width:0;border:1px solid rgba(var(--accent-rgb),.26);border-radius:12px;background:rgba(0,0,0,.19);color:var(--text);padding:11px 12px;font:inherit;font-size:.86rem;outline:none}
.live-comments-name:focus,.live-comments-message:focus{border-color:rgba(var(--accent-rgb),.7);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.10)}
.live-comments-message{resize:vertical;min-height:70px;line-height:1.5}
.live-comments-name::placeholder,.live-comments-message::placeholder{color:var(--muted);opacity:.85}
.live-comments-form-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.live-comments-hint{color:var(--muted);font-size:.7rem}
.live-comments-post{justify-self:start;color:var(--gold);font-weight:700}
.live-comments-list{display:grid;gap:11px}
.live-comments-empty{margin:4px 0;color:var(--muted);font-size:.83rem;text-align:center;padding:20px 10px;border:1px dashed rgba(var(--accent-rgb),.24);border-radius:14px}
.live-comment{min-width:0;padding:13px;border:1px solid rgba(var(--accent-rgb),.19);border-radius:14px;background:rgba(0,0,0,.12)}
.live-comment-topline{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.live-comment-name{color:var(--gold);font-size:.83rem;font-weight:750;overflow-wrap:anywhere}
.live-comment-date{color:var(--muted);font-size:.65rem}
.live-comment-body{margin:8px 0 10px;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.55;font-size:.86rem}
.live-comment-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.live-comment-action{padding:6px 10px;font-size:.7rem;background:rgba(255,255,255,.035)}
.live-comment-action.is-liked{color:var(--gold);border-color:rgba(var(--accent-rgb),.62);box-shadow:inset 0 0 10px rgba(var(--accent-rgb),.12)}
.live-comment-replies{display:grid;gap:8px;margin:12px 0 0 12px;padding-left:12px;border-left:2px solid rgba(var(--accent-rgb),.27)}
.live-comment-reply{background:rgba(255,255,255,.025);padding:11px}
.live-comment-reply-form{margin:12px 0 0;padding:12px;border-radius:12px;background:rgba(0,0,0,.13)}
body.light .live-comments-panel{background:linear-gradient(145deg,rgba(255,255,255,.85),rgba(255,250,238,.55))}
body.light .live-comments-name,body.light .live-comments-message,body.light .live-comment{background:rgba(255,255,255,.65)}
@media(max-width:520px){.live-comments-panel{padding:13px;border-radius:16px}.live-comments-heading{align-items:flex-start}.live-comments-refresh{padding:8px 10px;white-space:nowrap}.live-comment-replies{margin-left:5px;padding-left:8px}.live-comment{padding:11px}}

.live-comment-hide{border-color:rgba(255,115,115,.42);color:#ffb6a9}

/* Audio Bible read-along controls, verse actions and accessible contrast. */
.audio-bible-beta-playback-options{display:flex;justify-content:flex-end;margin:8px 0 0}
.audio-bible-beta-playback-options label{display:flex;flex-direction:column;gap:5px;color:var(--muted);font-size:.75rem;min-width:130px}
.audio-bible-beta-text-head label{min-width:105px}
.audio-bible-beta-help{margin:0 0 10px;color:var(--muted);font-size:.75rem;line-height:1.5}
.audio-bible-beta-text{font-size:1rem;line-height:1.8}
.audio-bible-beta-verse-list{display:grid;gap:7px}
.audio-bible-beta-verse-row{padding:9px 10px;border:1px solid rgba(var(--accent-rgb),.12);border-radius:10px;background:rgba(255,255,255,.018)}
.audio-bible-beta-verse{margin:0;white-space:pre-wrap;line-height:1.85;overflow-wrap:anywhere}
.audio-bible-beta-verse sup{margin-right:4px;color:var(--gold);font-size:.7em;font-weight:700}
.audio-bible-beta-verse.is-highlighted{background:rgba(var(--accent-rgb),.19);box-shadow:inset 3px 0 0 var(--gold);border-radius:4px;padding:3px 5px}
.audio-bible-beta-verse-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:7px}
.audio-bible-beta-verse-action{padding:5px 9px;border:1px solid rgba(var(--accent-rgb),.45);border-radius:999px;background:linear-gradient(145deg,rgba(255,255,255,.10),rgba(var(--accent-rgb),.07));color:var(--text,#f5f0e7);font:inherit;font-size:.68rem;font-weight:700;cursor:pointer}
.audio-bible-beta-verse-action:hover,.audio-bible-beta-verse-action:focus-visible{background:rgba(var(--accent-rgb),.16);color:var(--text,#f5f0e7);border-color:rgba(var(--accent-rgb),.75);outline:2px solid rgba(var(--accent-rgb),.5);outline-offset:2px}
/* Restore the original theme-responsive section selector styling. */
@media(max-width:680px){.audio-bible-beta-playback-options{justify-content:stretch}.audio-bible-beta-playback-options label{width:100%}.audio-bible-beta-verse-actions{gap:5px}.audio-bible-beta-verse-action{padding:6px 8px}}

/* Gold theme: keep primary controls visibly gold without changing section selectors. */
body[data-accent="gold"] .controls .play-button,
body[data-accent="gold"] .play-button{background:linear-gradient(145deg,#f2d990,#9e742a);color:#171208;border-color:rgba(255,235,164,.45)}
body[data-accent="gold"] .notes-actions button:first-child,
body[data-accent="gold"] .mog-tool-tab.active{background:linear-gradient(145deg,#f1d78e,#a77b2b);color:#1b1408;border-color:rgba(255,235,164,.45)}

/* Audio Bible skip and bookmark controls; inherit the active theme. */
.audio-bible-beta-skip-buttons button,.audio-bible-beta-bookmark-actions button{border:1px solid rgba(var(--accent-rgb),.38);border-radius:999px;padding:8px 12px;background:linear-gradient(145deg,rgba(255,255,255,.10),rgba(var(--accent-rgb),.06));color:var(--text,#f5f0e7);cursor:pointer;font:inherit;font-size:.76rem;transition:border-color .15s ease,background .15s ease,transform .15s ease}
.audio-bible-beta-skip-buttons button:hover,.audio-bible-beta-bookmark-actions button:hover{border-color:rgba(var(--accent-rgb),.72);background:rgba(var(--accent-rgb),.14)}
.audio-bible-beta-bookmark-tools{margin-top:12px}
.audio-bible-beta-bookmark-actions{display:flex;gap:7px;flex-wrap:wrap}
.audio-bible-beta-bookmarks{display:grid;gap:7px;margin-top:10px;padding:10px;border:1px solid rgba(var(--accent-rgb),.22);border-radius:12px;background:rgba(0,0,0,.09)}
.audio-bible-beta-bookmarks[hidden]{display:none!important}
.audio-bible-beta-bookmarks-heading{margin:3px 0;color:var(--gold,#e8ca83);font-size:.75rem;font-weight:750}
.audio-bible-beta-bookmark-item{display:flex;flex-direction:column;align-items:flex-start;gap:4px;width:100%;padding:10px 11px;border:1px solid rgba(var(--accent-rgb),.22);border-radius:9px;background:rgba(255,255,255,.035);color:var(--text,#f5f0e7);text-align:left;cursor:pointer;font:inherit}
.audio-bible-beta-bookmark-item strong{font-size:.78rem;line-height:1.4}
.audio-bible-beta-bookmark-item span{color:var(--muted,#aaa5a0);font-size:.69rem;line-height:1.45;overflow-wrap:anywhere}
.audio-bible-beta-bookmark-item:hover,.audio-bible-beta-bookmark-item.is-recent{border-color:rgba(var(--accent-rgb),.55);background:rgba(var(--accent-rgb),.10)}
@media(max-width:520px){.audio-bible-beta-bookmark-actions button,.audio-bible-beta-skip-buttons button{padding:8px 10px;font-size:.72rem}.audio-bible-beta-bookmarks{padding:8px}}