/* Gelli Belle Dreamland V95.6 — Corrections #22–25.
   A single uninterrupted sky, closer playlist rhythm, balanced portraits. */

/* Across desktop and mobile, the background is ONE gradient over the entire body.
   No section owns a rectangular background. This also avoids dynamic gradient
   positions snapping during expansion, resize or playback controls changing height. */
html body{
  background-image:linear-gradient(180deg,
    #0d1935 0%,
    #192b4a 13%,
    #273958 24%,
    #344064 35%,
    #3b456b 47%,
    #3a4b72 59%,
    #354b71 72%,
    #303e63 83%,
    #292f52 92%,
    #1b2745 100%)!important;
  background-color:#0d1935!important;
  background-repeat:no-repeat!important;
  background-size:100% 100%!important;
}
/* Legacy section gradients, decorative ::before layers and old coming-soon
   panels are made fully transparent to avoid the hard lines seen in screenshots. */
body .dl-radio-section,body .dreamscape-section,body .music-worlds-header,
body .dl-music-realm,body .tone-frequency,body .tone-classical,body .tone-rnb,
body .tone-jazz,body .tone-ambient,body .tone-solos,body .rituals-section,
body .gb975-narrative,body .chest-section,body .dl-footer,
body #dreamscapes,body #music-worlds,body #frequencies,
body #calm-with-friends,body #bedtime-stories{
  background:transparent!important;
  background-image:none!important;
  background-color:transparent!important;
}
/* Low-intensity lighting stays inside each region and gently vanishes before
   edges; star field and moon are the same fixed layer throughout. */
body .dl-section::before{opacity:.12!important}
body .gb975-narrative::before{opacity:.17!important}
body .sky-layer{background:transparent!important}

/* Reduce the unused 200+px vertical spaces from Dreamscape cards to the
   music catalog introduction, and from catalog pills to first playlist. */
body #dreamscapes{padding-bottom:clamp(24px,3.2vw,47px)!important}
body #music-worlds{padding-top:clamp(33px,3.4vw,50px)!important;padding-bottom:clamp(22px,3vw,42px)!important}
body #frequencies{padding-top:clamp(40px,4.4vw,64px)!important}
@media(max-width:780px){
  body #dreamscapes{padding-bottom:23px!important}
  body #music-worlds{padding-top:30px!important;padding-bottom:26px!important}
  body #frequencies{padding-top:40px!important}
}

/* Calm With Friends: preserve the exact provided Susie image, enlarge the
   character inside her portrait, and blend the originally white backdrop with
   pastel mint. No permanent changes to the source image are made. */
.gb975-calm .gb975-susie-arch{
  isolation:isolate;
  background:#cae9da;
  overflow:hidden;
}
.gb975-calm .gb975-susie-arch>img{
  object-fit:cover;
  object-position:50% 58%;
  transform:translateY(-4%) scale(1.24);
  transform-origin:50% 62%;
  mix-blend-mode:multiply;
}
/* Sleepy Stories: use the SAME tall rounded-arch shape as Calm With Friends. */
.gb975-stories .gb975-story-orb{
  width:min(100%,465px);
  height:clamp(405px,43vw,585px);
  aspect-ratio:auto;
  border-radius:46% 46% 23% 23%/34% 34% 17% 17%;
  overflow:hidden;
  isolation:isolate;
  box-shadow:0 35px 95px rgba(5,13,37,.46),0 0 0 15px rgba(224,213,255,.055),0 0 0 44px rgba(227,206,255,.025);
}
.gb975-stories .gb975-story-orb>img{
  width:100%;height:100%;object-fit:cover;object-position:44% center;
  filter:brightness(.96) saturate(.98);
}
.gb975-stories .gb975-story-orb::after{
  inset:auto 0 0;height:39%;
  background:linear-gradient(180deg,rgba(11,18,40,0),rgba(10,17,42,.84));
}
.gb975-stories .gb975-story-orb figcaption{
  position:absolute;z-index:3;
  left:5%;right:5%;bottom:19px;
  width:90%;max-width:90%;margin:0 auto;padding:10px 6px 5px;
  font:italic 500 clamp(17px,1.7vw,23px)/1.3 'Fraunces',Georgia,serif;
  color:#fff6ef;text-wrap:balance;white-space:normal;text-align:center;
  text-shadow:0 2px 8px #070f26,0 0 20px #070f26;
}
@media(max-width:780px){
  .gb975-stories .gb975-story-orb{width:min(84%,380px);height:clamp(355px,70vw,520px)}
  .gb975-calm .gb975-susie-arch>img{transform:translateY(-3%) scale(1.21)}
}
@media(max-width:480px){
  .gb975-stories .gb975-story-orb{width:min(84%,380px);height:clamp(355px,80vw,445px)}
  .gb975-stories .gb975-story-orb figcaption{font-size:16px;bottom:15px}
}