/* ME — living soul fragments for the Dread Raven.
   Vector facets only: no generated pictures, canvas, WebGL, or new network assets.
   Song names remain the only visible labels. */
#music-overlay .song-room-list {
  --crystal-width:160px;
  width:min(690px,100%);
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(7px,2.3vw,22px);
  padding:7px 0 8px;
  align-items:center;
}
#music-overlay .song-room-list .energy-element {
  position:relative;
  display:flex;align-items:center;justify-content:center;
  gap:2px;isolation:isolate;
  min-height:clamp(180px,26svh,240px);
  padding:5px 3px 12px;
  border:0;
  border-radius:0;
  background:none;
  box-shadow:none;
  overflow:visible;
  color:var(--element-color);
  transition:transform .27s cubic-bezier(.19,.85,.25,1),opacity .23s ease;
}
#music-overlay .song-room-list .energy-element[data-track="925444"]{
  border:0;border-radius:0;background:none;box-shadow:none;
}
#music-overlay .song-room-list .energy-element::before{
  content:"";
  position:absolute;inset:15% 2% 22%;z-index:-1;
  border:0;border-radius:50%;clip-path:none;
  background:radial-gradient(ellipse at 50% 53%,var(--element-shadow),transparent 68%);
  opacity:.65;filter:blur(18px);
  transform:scale(.95);
  pointer-events:none;
  animation:soul-halo-breathe 7s ease-in-out infinite alternate;
}
#music-overlay .song-room-list .energy-element::after{
  content:"";position:absolute;z-index:-1;
  inset:auto 16% 28px;
  height:16px;border:0;border-radius:50%;
  background:radial-gradient(ellipse at center,var(--element-shadow),transparent 72%);
  box-shadow:none;
  opacity:.42;filter:blur(6px);
  pointer-events:none;
}
#music-overlay .song-room-list .energy-element .element-visual{
  width:100%;height:auto;
  min-height:clamp(134px,19svh,198px);
  flex:1;
  overflow:visible;
  perspective:460px;
}
#music-overlay .song-room-list .energy-element .element-crystal{
  position:relative;
  width:clamp(126px,37vw,181px);
  height:clamp(145px,39vw,189px);
  max-width:96%;
  display:grid;place-items:center;
  animation:soul-gem-float var(--soul-drift,6.8s) ease-in-out infinite alternate;
  transform-origin:50% 58%;
  filter:drop-shadow(0 0 10px var(--element-shadow))
         drop-shadow(0 0 23px var(--element-shadow));
}
#music-overlay .song-room-list .energy-element[data-track="925444"] .element-crystal {
  animation-duration:8.2s;
  animation-delay:-3.1s;
}
#music-overlay .song-room-list .energy-element .soul-gem-svg{
  display:block;width:100%;height:100%;overflow:visible;
  transform-origin:50% 48%;
  animation:soul-gem-lean var(--soul-lean,9.2s) ease-in-out infinite alternate;
}
#music-overlay .song-room-list .energy-element[data-track="925444"] .soul-gem-svg{
  animation-delay:-3s;animation-duration:11s;
}
#music-overlay .song-room-list .soul-facet,
#music-overlay .song-room-list .soul-heart-facet{
  stroke:var(--element-secondary);
  stroke-opacity:.2;
  stroke-width:.38;
  vector-effect:non-scaling-stroke;
}
#music-overlay .song-room-list .soul-extrusion{
  filter:drop-shadow(0 6px 6px rgba(0,0,0,.45));
}
#music-overlay .song-room-list .soul-central-fire{
  transform-origin:50% 50%;
  transform-box:fill-box;
  animation:soul-heartbeat var(--soul-heart,5.6s) ease-in-out infinite;
}
#music-overlay .song-room-list .soul-refractions{
  animation:soul-facet-light 7.1s ease-in-out infinite alternate;
}
#music-overlay .song-room-list .soul-light-sweep{
  opacity:.4;
  animation:soul-ray-shift 8.5s ease-in-out infinite alternate;
}
#music-overlay .song-room-list .energy-element[data-track="925444"] .soul-light-sweep{
  animation-delay:-3.5s;animation-duration:10.3s;
}
#music-overlay .song-room-list .soul-light-thread,
#music-overlay .song-room-list .soul-internal-fracture,
#music-overlay .song-room-list .soul-cleavage{
  stroke-linecap:round;stroke-linejoin:round;fill:none;
}
#music-overlay .song-room-list .soul-flash-point{
  animation:soul-glint 4.8s ease-in-out infinite;
}
#music-overlay .song-room-list .energy-element[data-track="925444"] .soul-flash-point{
  animation-delay:-1.9s;animation-duration:6.2s;
}
#music-overlay .song-room-list .element-orbit {
  width:91%;max-width:181px;opacity:.36;
  border-color:color-mix(in srgb,var(--element-color) 34%,transparent);
}
#music-overlay .song-room-list .element-orbit-outer{
  border-style:dotted;animation-duration:35s;opacity:.33;
}
#music-overlay .song-room-list .element-orbit-inner{
  width:82%;opacity:.32;animation-duration:9s;
}
#music-overlay .song-room-list .energy-element strong{
  flex:0 0 auto;z-index:3;
  min-height:27px;
  margin:0;
  padding:0 4px;
  font:400 clamp(11px,2.85vw,15px)/1.4 var(--pixel);
  color:#fff4fd;
  text-shadow:0 0 8px var(--element-shadow),0 0 20px var(--element-shadow);
  letter-spacing:.045em;
  text-align:center;
}
#music-overlay .song-room-list .energy-element[data-track="925444"] strong{color:#e4fdff}
#music-overlay .song-room-list .energy-element:hover,
#music-overlay .song-room-list .energy-element:focus-visible {
  outline:0;border:0;background:none;box-shadow:none;
  transform:translateY(-5px) scale(1.025);
}
#music-overlay .song-room-list .energy-element:hover .element-crystal,
#music-overlay .song-room-list .energy-element:focus-visible .element-crystal{
  filter:drop-shadow(0 0 16px var(--element-shadow))
         drop-shadow(0 0 26px var(--element-color));
}
#music-overlay .song-room-list .energy-element:focus-visible .element-visual {
  outline:1px solid color-mix(in srgb,var(--element-color) 45%,transparent);
  outline-offset:1px;border-radius:50%;
}
#music-overlay .song-room-list .energy-element.is-selected{
  border:0;background:none;box-shadow:none;
}
#music-overlay .song-room-list .energy-element.is-selected .element-crystal{
  filter:drop-shadow(0 0 15px var(--element-shadow))
         drop-shadow(0 0 22px var(--element-shadow));
}
#music-overlay .song-room.is-feeding .energy-element.is-feeding {
  border:0;box-shadow:none;
}
#music-overlay .song-room .song-element-echo{
  width:clamp(118px,35vw,176px);height:clamp(136px,39vw,184px);
  filter:drop-shadow(0 0 14px var(--feeding-hue,#d6adff));
}
#music-overlay .song-room .song-element-echo .soul-gem-svg{
  width:100%;height:100%;
}
#music-overlay .song-room .song-element-echo .soul-central-fire{
  opacity:.95;
}
#music-overlay .song-room-list.many-elements{
  grid-template-columns:repeat(3,minmax(0,1fr));
  --crystal-width:125px;
}
#music-overlay .song-room-list.many-elements .energy-element{
  min-height:162px;
}
#music-overlay .song-room-list.many-elements .element-crystal{
  width:clamp(94px,24vw,137px);
  height:clamp(112px,26vw,151px);
}
#music-overlay .song-room-list.dense-elements{
  grid-template-columns:repeat(4,minmax(0,1fr));
}
#music-overlay .song-room-list.dense-elements .element-crystal{
  width:clamp(76px,20vw,109px);
  height:clamp(88px,22vw,119px);
}
#music-overlay .song-room-list.dense-elements .energy-element{
  min-height:127px;
}
@keyframes soul-gem-float{
  0%{transform:translate3d(0,-4px,0)}
  100%{transform:translate3d(0,5px,0)}
}
@keyframes soul-gem-lean{
  0%{transform:rotate(-3deg) scale(.98)}
  100%{transform:rotate(3deg) scale(1.01)}
}
@keyframes soul-heartbeat{
  0%,100%{opacity:.38;transform:scale(.87)}
  48%{opacity:.94;transform:scale(1.21)}
}
@keyframes soul-facet-light{0%{opacity:.34}100%{opacity:1}}
@keyframes soul-ray-shift{
  0%{opacity:.17;transform:translate3d(-10px,8px,0)}
  100%{opacity:.76;transform:translate3d(9px,-8px,0)}
}
@keyframes soul-glint{
  0%,18%,100%{opacity:.15;transform:scale(.8)}
  42%{opacity:1;transform:scale(1.55)}
}
@keyframes soul-halo-breathe{0%{opacity:.3;transform:scale(.85)}100%{opacity:.76;transform:scale(1.08)}}
@media (max-width:440px){
  #music-overlay .song-room-list .energy-element{
    min-height:clamp(180px,25svh,229px);padding:4px 1px 10px;
  }
  #music-overlay .song-room-list .element-visual{min-height:140px}
  #music-overlay .song-room-list .element-crystal{
    width:clamp(124px,37vw,157px);
    height:clamp(139px,41vw,170px);
  }
  #music-overlay .song-room-list.many-elements .element-crystal{
    width:clamp(84px,25vw,108px);height:clamp(94px,28vw,122px);
  }
  #music-overlay .song-room-list.dense-elements .element-crystal{
    width:clamp(67px,20vw,91px);height:clamp(79px,22vw,102px);
  }
}
@media(max-height:660px){
  #music-overlay .song-room-list .energy-element{min-height:156px;padding-bottom:6px}
  #music-overlay .song-room-list .element-visual{min-height:118px}
  #music-overlay .song-room-list .element-crystal{width:118px;height:128px}
}
@media(prefers-reduced-motion:reduce){
  #music-overlay .song-room-list .element-crystal,
  #music-overlay .song-room-list .soul-gem-svg,
  #music-overlay .song-room-list .soul-central-fire,
  #music-overlay .song-room-list .soul-refractions,
  #music-overlay .song-room-list .soul-light-sweep,
  #music-overlay .song-room-list .soul-flash-point,
  #music-overlay .song-room-list .energy-element::before{animation:none!important}
}

/* One quarter smaller, without shrinking the keyboard/touch activation surface.
   The open-air specimen becomes a growing collection rather than large tiles. */
#music-overlay .song-room-list .energy-element {
  min-height:clamp(149px,22svh,198px);
  padding:3px 3px 9px;
}
#music-overlay .song-room-list .energy-element .element-visual {
  min-height:112px;
}
#music-overlay .song-room-list .energy-element .element-crystal {
  width:clamp(95px,27.75vw,136px);
  height:clamp(109px,29.25vw,142px);
}
#music-overlay .song-room-list.many-elements .element-crystal{
  width:clamp(71px,18vw,103px);
  height:clamp(84px,19.5vw,113px);
}
#music-overlay .song-room-list.dense-elements .element-crystal{
  width:clamp(58px,15vw,82px);
  height:clamp(66px,16.5vw,89px);
}

/* Same full-fidelity song gem in the initial awakening and in-room feeding.
   Its gradient IDs differ per instance; geometry stays song-identical. */
.jukebox-sleeve{
  width:clamp(95px,27.75vw,136px);
  height:clamp(109px,29.25vw,142px);
  filter:drop-shadow(0 0 12px var(--element-shadow,rgba(148,96,255,.38)));
}
.jukebox-sleeve::before{
  background:radial-gradient(ellipse at 50% 50%,var(--element-shadow,rgba(148,96,255,.38)),transparent 72%);
}
.jukebox-sleeve .jukebox-transfer-crystal .soul-gem-svg{
  width:100%;height:100%;overflow:visible;
  filter:drop-shadow(0 0 6px var(--element-shadow,rgba(148,96,255,.38)));
  animation:none;
}
.jukebox-sleeve .soul-central-fire,
#music-overlay .song-room .song-element-echo .soul-central-fire{
  transform-origin:50% 50%;transform-box:fill-box;
  animation:soul-heartbeat 5.6s ease-in-out infinite;
}
.jukebox-sleeve .soul-light-sweep,
#music-overlay .song-room .song-element-echo .soul-light-sweep{
  animation:soul-ray-shift 8.5s ease-in-out infinite alternate;
}
.jukebox-sleeve .soul-refractions,
#music-overlay .song-room .song-element-echo .soul-refractions{
  animation:soul-facet-light 7.1s ease-in-out infinite alternate;
}
#music-overlay .song-room .song-element-echo{
  width:clamp(95px,27.75vw,136px);
  height:clamp(109px,29.25vw,142px);
}
@media(max-width:440px){
  #music-overlay .song-room-list .energy-element{
    min-height:clamp(148px,22svh,185px);
    padding:3px 1px 8px;
  }
  #music-overlay .song-room-list .element-visual{min-height:105px}
  #music-overlay .song-room-list .element-crystal,
  .jukebox-sleeve,
  #music-overlay .song-room .song-element-echo{
    width:clamp(93px,27.75vw,118px);
    height:clamp(104px,30.75vw,128px);
  }
  #music-overlay .song-room-list.many-elements .element-crystal{
    width:clamp(63px,18.75vw,81px);
    height:clamp(71px,21vw,92px);
  }
  #music-overlay .song-room-list.dense-elements .element-crystal{
    width:clamp(50px,15vw,68px);
    height:clamp(59px,16.5vw,76px);
  }
}
@media(max-height:660px){
  #music-overlay .song-room-list .energy-element{min-height:127px;padding-bottom:6px}
  #music-overlay .song-room-list .element-visual{min-height:94px}
  #music-overlay .song-room-list .element-crystal,
  .jukebox-sleeve,
  #music-overlay .song-room .song-element-echo{width:89px;height:96px}
}
@media(prefers-reduced-motion:reduce){
  .jukebox-sleeve .soul-central-fire,
  .jukebox-sleeve .soul-light-sweep,
  .jukebox-sleeve .soul-refractions,
  #music-overlay .song-room .song-element-echo .soul-central-fire,
  #music-overlay .song-room .song-element-echo .soul-light-sweep,
  #music-overlay .song-room .song-element-echo .soul-refractions{animation:none!important}
}

/* Dread Raven: three existing specimens share one mobile row.
   Shrink the gems ~35%; keep the full-size hit surfaces and original orbit/feeding behavior. */
#music-overlay .song-room-list.three-elements{
  width:min(540px,100%);
  grid-template-columns:repeat(3,minmax(0,1fr));
  column-gap:clamp(5px,1.8vw,13px);
  row-gap:0;
  padding:7px 0 8px;
  align-items:start;
}
#music-overlay .song-room-list.three-elements .energy-element{
  min-height:clamp(116px,17svh,151px);
  padding:4px 0 9px;
  gap:4px;
  justify-content:flex-start;
}
#music-overlay .song-room-list.three-elements .element-visual{
  width:100%;
  flex:0 0 auto;
  min-height:clamp(78px,11svh,105px);
  height:clamp(78px,11svh,105px);
}
#music-overlay .song-room-list.three-elements .element-crystal{
  width:clamp(59px,18vw,89px);
  height:clamp(65px,20vw,93px);
  max-width:95%;
}
#music-overlay .song-room-list.three-elements .energy-element strong{
  width:100%;
  min-height:30px;
  margin:0;
  padding:0 2px;
  font:400 clamp(7px,1.85vw,10px)/1.4 var(--pixel);
  letter-spacing:0;
  text-align:center;
  white-space:normal;
  overflow-wrap:normal;
  word-break:normal;
}
/* ME's exact lowercase capitalization is intentional. */
/* Silkscreen draws this label like capitals even with lowercase text.
   Pixelify Sans has distinct lowercase glyphs and keeps the pixel aesthetic. */
#music-overlay .song-room-list .energy-element[data-track="a-bradley-girl"] strong{
  font-family:'Pixelify Sans','Space Grotesk',sans-serif;
  font-weight:500;
  /* 1.09 times the existing three-crystal clamp; keep the artist's lowercase. */
  font-size:clamp(7.63px,2.0165vw,10.9px);
  text-transform:none;
}
#music-overlay .song-list .track-row[data-track="a-bradley-girl"] strong{
  font-family:'Pixelify Sans','Space Grotesk',sans-serif;
  font-weight:500;
  text-transform:none;
}
#music-overlay .player-deck .track-title[data-track="a-bradley-girl"]{
  font-family:'Pixelify Sans','Space Grotesk',sans-serif;
  font-weight:500;
  text-transform:none;
}

/* New cavern song picker: retire the former giant Raven portrait and circuit wallpaper.
   Keep the actual crystal buttons, labels and their animations untouched. */
#music-overlay .song-room .song-energy-reactor.raven-awakened{visibility:hidden!important;pointer-events:none!important}
#music-overlay .song-room .song-energy-circuits{display:none!important}
#music-overlay .song-room::before,#music-overlay .song-room::after{display:none!important}

/* Approved cavern artwork: a single eye-light anchored to the dragon's eye.
   The old foreground creature stays retired; the gems remain clickable. */
/* Screenshot calibration 2026-10-20: eye center matches image anchor.
   Tighten the footprint to the visible iris, not the surrounding skull. */
#music-overlay .song-room .song-dragon-eye{
  position:absolute;left:23.8%;top:65%;z-index:2;
  width:clamp(9px,2.5vw,16px);height:clamp(7px,1.85vw,12px);
  transform:translate(-50%,-50%) rotate(-12deg);
  border-radius:50%;pointer-events:none;
  background:radial-gradient(ellipse,rgba(236,255,255,.94) 0%,rgba(114,202,255,.82) 32%,rgba(129,79,255,.45) 65%,transparent 88%);
  box-shadow:0 0 5px 1px rgba(96,205,255,.45),0 0 10px 2px rgba(135,82,255,.2);
  opacity:.7;mix-blend-mode:screen;
  animation:dragon-eye-idle 3.8s ease-in-out infinite alternate;
}
#music-overlay .song-room .song-dragon-eye::after{
  content:"";position:absolute;inset:-30%;border-radius:50%;
  background:radial-gradient(ellipse,rgba(107,224,255,.25),rgba(135,63,255,.09) 45%,transparent 72%);
  filter:blur(2px);
}
#music-overlay .song-room.is-feeding .song-dragon-eye{
  opacity:1;animation:dragon-eye-receive .82s ease-out both;
  box-shadow:0 0 7px 2px var(--feeding-hue,#74ffbe),0 0 16px 4px rgba(137,65,255,.4);
}
@keyframes dragon-eye-idle{from{opacity:.34;filter:brightness(.8)}to{opacity:.83;filter:brightness(1.25)}}
@keyframes dragon-eye-receive{0%{opacity:.35;filter:brightness(.7)}55%{opacity:1;filter:brightness(2.9)}100%{opacity:1;filter:brightness(1.7)}}
@media(prefers-reduced-motion:reduce){
  #music-overlay .song-room .song-dragon-eye{animation:none;opacity:.8}
}

/* Reception happens when the flying crystal reaches the dragon's eye. */
#music-overlay .song-room.dragon-eye-impact .song-dragon-eye{
  opacity:1!important;
  animation:dragon-eye-impact .48s ease-out both!important;
}
@keyframes dragon-eye-impact{
  0%{filter:brightness(1);transform:translate(-50%,-50%) rotate(-12deg) scale(1)}
  45%{filter:brightness(2.6);transform:translate(-50%,-50%) rotate(-12deg) scale(1.3)}
  100%{filter:brightness(1.6);transform:translate(-50%,-50%) rotate(-12deg) scale(1)}
}


/* Stationary jewel pulse only; preserve jewel while the eye wakes. */
#music-overlay .song-room.is-feeding .energy-element.is-feeding .element-crystal{
  opacity:1!important;
  animation:gem-eye-activation 1s ease-in-out both!important;
  filter:drop-shadow(0 0 13px var(--feeding-hue,#a7f6ff)) drop-shadow(0 0 27px var(--feeding-hue,#a7f6ff));
}
@keyframes gem-eye-activation{
  0%,100%{transform:scale(1);filter:brightness(1.1)}
  45%{transform:scale(1.11);filter:brightness(2.2)}
}
#music-overlay .song-room.dragon-eye-impact .song-dragon-eye{
  animation:dragon-eye-impact 1.05s ease-in-out both!important;
}

/* Emergency production rollback: hide inaccurate eye glow entirely. */
#music-overlay .song-room .song-dragon-eye,#music-overlay .song-room .song-dragon-eye::after{display:none!important;visibility:hidden!important;opacity:0!important;animation:none!important;box-shadow:none!important}