/* Gelli Belle Dreamland · Update 09 — one muted continuous, accessible night sky */
:root{
  --night-radio:5%;--night-scapes:16%;--night-dream:28%;--night-garden:39%;
  --night-silk:50%;--night-hour:61%;--night-breathing:72%;--night-solos:82%;--night-routine:91%;--night-end:98%;
  --night-moon-x:0px;--night-moon-y:0px;--night-stars-y:0px;--night-stars-alt-y:0px;
}
html{background:#151029}
body{
  position:relative;
  background:linear-gradient(180deg,
    #151029 0%,
    #211736 var(--night-radio),
    #212644 var(--night-scapes),
    #262b53 var(--night-dream),
    #42627d var(--night-garden),
    #69395f var(--night-silk),
    #294f93 var(--night-hour),
    #2b7071 var(--night-breathing),
    #294783 var(--night-solos),
    #172950 var(--night-routine),
    #101a34 var(--night-end),
    #0c142b 100%) !important;
  background-repeat:no-repeat !important;
  color:#f3f1fd;
}
/* Eliminate all per-section solid panels. Cards remain translucent and readable. */
body .dl-radio-section,
body .dreamscape-section,
body .music-worlds-header,
body .dl-music-realm,
body .tone-frequency,
body .tone-rnb,
body .tone-classical,
body .tone-jazz,
body .tone-ambient,
body .tone-solos,
body .rituals-section,
body .chest-section,
body .narrative-section,
body .story-section,
body .calm-section,
body .dl-footer{background:transparent !important}
body .dl-radio-section{padding-bottom:56px}
body .dreamscape-section{padding-top:85px}
body .music-worlds-header{padding-top:90px;padding-bottom:72px}
body .dl-music-realm{padding-top:92px;padding-bottom:92px}
body .dl-footer{border-top:1px solid rgba(221,232,255,.12)}
/* Soft visual accents are allowed, but must not create band edges. */
body .dl-section::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.38}
body .tone-rnb::before{background:radial-gradient(ellipse 47% 60% at 78% 42%,rgba(190,102,161,.17),transparent 72%)}
body .tone-classical::before{background:radial-gradient(ellipse 57% 65% at 36% 40%,rgba(159,198,220,.19),transparent 75%)}
body .tone-jazz::before{background:radial-gradient(ellipse 50% 60% at 72% 50%,rgba(89,132,220,.14),transparent 72%)}
body .tone-ambient::before{background:radial-gradient(ellipse 52% 70% at 44% 45%,rgba(132,220,196,.13),transparent 72%)}
body .tone-solos::before{background:radial-gradient(ellipse 50% 60% at 70% 48%,rgba(112,141,235,.14),transparent 72%)}
/* The same fixed star field and glowing moon subtly drift as the visitor scrolls. */
body .sky-layer{position:fixed;inset:0;z-index:0;height:100vh;min-height:0;background:none;overflow:hidden;pointer-events:none;contain:paint}
body .sky-stars{position:absolute;inset:-100px;opacity:.5;transform:translate3d(0,var(--night-stars-y),0);animation:night-stars-breathe 15s ease-in-out infinite alternate;background-image:
  radial-gradient(1.2px 1.2px at 9% 12%,rgba(247,244,255,.76) 95%,transparent),
  radial-gradient(1.8px 1.8px at 23% 27%,rgba(224,216,255,.72) 90%,transparent),
  radial-gradient(1px 1px at 60% 9%,rgba(245,238,255,.65) 90%,transparent),
  radial-gradient(1.5px 1.5px at 89% 20%,rgba(230,222,252,.7) 90%,transparent),
  radial-gradient(1px 1px at 80% 40%,rgba(249,239,251,.5) 90%,transparent),
  radial-gradient(1.4px 1.4px at 47% 28%,rgba(230,239,255,.6) 90%,transparent);
  background-size:340px 360px;
}
body .sky-stars-secondary{position:absolute;inset:-80px;background-image:
  radial-gradient(1px 1px at 11% 35%,rgba(245,232,255,.57) 95%,transparent),
  radial-gradient(1.2px 1.2px at 34% 13%,rgba(252,248,255,.51) 95%,transparent),
  radial-gradient(1.1px 1.1px at 76% 51%,rgba(234,245,255,.48) 95%,transparent),
  radial-gradient(1.6px 1.6px at 67% 74%,rgba(241,226,253,.54) 95%,transparent),
  radial-gradient(.9px .9px at 94% 69%,rgba(247,248,255,.5) 95%,transparent);
  background-size:410px 460px;opacity:.35;
  transform:translate3d(0,var(--night-stars-alt-y),0);
  animation:night-stars-secondary 19s ease-in-out infinite alternate;
}
body .sky-haze{position:absolute;inset:0;background:radial-gradient(ellipse at 55% 42%,rgba(190,168,238,.065),transparent 69%)}
body .sky-moon{position:absolute;top:14vh;right:3%;width:clamp(92px,9vw,145px);aspect-ratio:1;border-radius:50%;opacity:.50;
  transform:translate3d(var(--night-moon-x),var(--night-moon-y),0);
  background:radial-gradient(circle at 34% 29%,#f8ebda 0%,#e5e0f1 48%,#b6b2d4 78%,#827ea7 100%);
  box-shadow:0 0 40px rgba(232,225,255,.19),0 0 105px rgba(212,204,249,.13),0 0 200px rgba(213,204,247,.07);
}
body .sky-moon::after{content:"";position:absolute;inset:-90%;border-radius:50%;background:radial-gradient(circle,rgba(223,213,250,.13),transparent 70%);z-index:-1}
body .dl-radio-cosmos .moon-core,body .dl-radio-cosmos .moon-halo{display:none}
@keyframes night-stars-breathe{0%{opacity:.3}100%{opacity:.57}}
@keyframes night-stars-secondary{0%{opacity:.21}100%{opacity:.43}}
/* Compact radio controls and still preserve Larry ON AIR and Susie drops by. */
body .radio-studio{border-color:rgba(235,220,255,.2);background:linear-gradient(140deg,rgba(70,55,99,.31),rgba(14,19,48,.53));box-shadow:0 24px 85px rgba(6,12,35,.24)}
body .radio-art{background:radial-gradient(ellipse at 42% 42%,rgba(142,133,186,.18),transparent 69%)}
body .radio-console{min-height:0;padding-bottom:28px;background:linear-gradient(145deg,rgba(32,28,64,.56),rgba(17,22,51,.64))}
body .radio-console .console-caption{margin-top:28px}
body .radio-console .visualizer{margin-top:25px}
body .radio-console .radio-controls{margin:22px 0}
body .radio-console-footer{display:grid;grid-template-columns:minmax(120px,1fr) auto auto;align-items:center;gap:13px}
body .radio-console-footer #radio-status{min-width:0;font-size:10px}
body .radio-inline-timer{display:flex;align-items:center;gap:7px;min-width:0;color:#e5d9fa}
body .radio-inline-timer label{font-size:10px;white-space:nowrap}
body .radio-inline-timer select{color:#f7f0ff;background:rgba(61,56,92,.72);border:1px solid rgba(241,226,255,.26);border-radius:999px;font-size:11px;padding:7px 10px}
body .radio-inline-timer #timer-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* Combine the mood and recommendation into one lightweight panel. */
body .radio-personalization{max-width:890px;margin:25px auto 0;padding:26px 24px 16px;display:flex;flex-direction:column;justify-content:center;gap:17px;align-items:center;text-align:center;border:1px solid rgba(228,218,253,.18);border-bottom:0;border-radius:28px 28px 0 0;background:rgba(24,24,55,.28)}
body .radio-personalization h3{font-size:clamp(24px,2.6vw,33px);margin:0;line-height:1.25}
body .mood-options{width:100%;max-width:none;justify-content:center;gap:9px;margin:0}
body .mood-options button{min-width:115px;padding:11px 18px;background:rgba(255,255,255,.065)}
body .dl-tonights-pick{max-width:890px;margin:0 auto !important;padding:15px 23px 22px !important;border:1px solid rgba(228,218,253,.18) !important;border-top:0 !important;border-radius:0 0 28px 28px !important;background:rgba(24,24,55,.28) !important;box-shadow:none !important;min-height:0 !important}
body .dl-tonights-pick small{letter-spacing:.15em}
body .dl-tonights-pick strong{font-size:clamp(16px,2vw,23px)}
body .dl-tonights-pick button{padding:11px 17px}
@media(max-width:950px){
  body .radio-console-footer{grid-template-columns:1fr auto;row-gap:13px}
  body .radio-console-footer #radio-status{grid-column:1 / -1}
}
@media(max-width:780px){
  body .dl-radio-section{padding-bottom:45px}
  body .dreamscape-section{padding-top:72px}
  body .radio-console{padding-bottom:23px}
  body .radio-personalization{max-width:640px;margin-top:20px;padding:24px 15px 15px;gap:15px}
  body .mood-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
  body .mood-options button{min-width:0;font-size:11px;padding:10px 5px}
  body .sky-moon{right:-6%;top:18vh;opacity:.32}
}
@media(max-width:480px){
  body .radio-console-footer{display:grid;grid-template-columns:1fr 1fr}
  body .radio-console-footer #radio-status{grid-column:1/-1}
  body .radio-console-footer .volume-group input{width:62px}
  body .mood-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  body .mood-options button{font-size:12px;padding:12px}
  body .dl-tonights-pick{padding:16px !important}
}
@media(prefers-reduced-motion:reduce){
  body .sky-stars,body .sky-stars-secondary{animation:none!important}
  body .sky-moon,body .sky-stars,body .sky-stars-secondary{transform:none!important}
}

/* GB-PLAYLIST-FINITE-17C: background gradient continues smoothly through Moonlight Garden, Silk Road, and Hour Blue. */

/* GB-NIGHT-SKY-18 — seamless sky, midnight-blue top, muted gallery colors. */
html{background:#0a1730 !important}
body{
  background:linear-gradient(180deg,
    #0b1934 0%,
    #142747 var(--night-radio),
    #1e3152 var(--night-scapes),
    #2c345b var(--night-dream),
    #405b78 var(--night-garden),
    #644465 var(--night-silk),
    #2b4b83 var(--night-hour),
    #2d7374 var(--night-breathing),
    #304b81 var(--night-solos),
    #1a3155 var(--night-routine),
    #101e3f var(--night-end),
    #0b1731 100%) !important;
  background-repeat:no-repeat!important;
  background-size:100% 100%!important;
}
body .dl-section,body .dl-radio-section,body .dreamscape-section,
body .dl-music-realm,body .rituals-section,body .chest-section,
body .music-worlds-header,body .dl-footer{background-color:transparent!important;background-image:none!important}
body .dl-section::before{opacity:.19}
body .radio-studio{background:linear-gradient(140deg,rgba(32,52,85,.35),rgba(12,25,53,.59))}
body .radio-console{background:linear-gradient(145deg,rgba(21,38,73,.58),rgba(15,30,61,.67))}
body .radio-personalization,body .dl-tonights-pick{background:rgba(16,34,68,.28)!important}
