/* ME / BEY-RECORD. High-fidelity centerpiece inside an intentionally pixelated world. */
/* Entrance: no clipped little blocks fighting the central monitor. */
.studio-telemetry{display:none!important}
.room-prompt{
  width:max-content;max-width:min(90vw,320px);padding:8px 13px;
  white-space:normal;text-align:center;line-height:1.5;
  font-size:clamp(8px,1vw,11px);letter-spacing:.045em;
  background:rgba(8,7,23,.76);
  border:1px solid rgba(149,226,255,.39);
  border-radius:8px;box-shadow:0 5px 17px #05051569,0 0 15px #d36bf51c;
  color:#e8faff;text-shadow:0 0 8px #6ddcff66;
  backdrop-filter:blur(8px)
}
.room-prompt:before{content:"◇ ";color:#a5ffde}
/* Sculptural Beyblade / vinyl hybrid. All geometry drawn as vector DOM, never raster or pixel art. */
.disc-stage{
  isolation:isolate;
  width:min(360px,76vw);max-width:100%;margin:10px auto 13px;
  background:none;filter:none;overflow:visible;
}
.disc-stage:before{
  content:"";position:absolute;inset:2%;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,transparent 56%,rgba(149,100,253,.14) 57%,transparent 74%),
    repeating-conic-gradient(from 0deg,#63efff82 0 1deg,transparent 1deg 30deg);
  -webkit-mask:radial-gradient(circle,transparent 0 44%,#000 45% 46%,transparent 47% 49%,#000 50% 51%,transparent 52%);
  mask:radial-gradient(circle,transparent 0 44%,#000 45% 46%,transparent 47% 49%,#000 50% 51%,transparent 52%);
  filter:drop-shadow(0 0 10px #4eeaffb0);opacity:.75;
  animation:bey-ring 3.6s linear infinite;
  animation-play-state:paused
}
.disc-stage:after{
  content:"";position:absolute;inset:4%;pointer-events:none;border-radius:50%;
  border:1px solid rgba(113,239,255,.3);
  background:none;box-shadow:inset 0 0 27px #864df711,0 0 38px #a95eea2b;
}
.disc-stage .disc.bey-disc{
  display:block;position:relative;z-index:1;width:96%;height:96%;aspect-ratio:1;
  border:0;border-radius:0;background:none;box-shadow:none;overflow:visible;
  filter:drop-shadow(0 10px 6px rgba(0,0,0,.78)) drop-shadow(0 0 18px rgba(176,68,255,.36));
  transform-origin:50% 50%;will-change:transform;
  /* Keep the same animation alive while paused so the armature never snaps to zero. */
  animation:disc-spin 7.2s linear infinite;
  animation-play-state:paused
}
.disc-stage .disc.bey-disc::before,.disc-stage .disc.bey-disc::after{content:none!important;display:none!important}
.bey-disc .bey-engine{display:block;width:100%;height:100%;object-fit:contain;
  image-rendering:auto;mix-blend-mode:normal;
  transform:translateZ(0);backface-visibility:hidden}
.disc-stage.is-playing .disc.bey-disc{animation-play-state:running}
.disc-stage.is-playing:before{animation-play-state:running}
@keyframes bey-ring{to{transform:rotate(-360deg)}}
@media(max-width:720px){
  .disc-stage{width:min(320px,76vw);margin:5px auto 10px}
  .room-prompt{bottom:clamp(150px,21vh,215px);max-width:85vw;font-size:8px;padding:6px 10px}
}
@media(max-width:385px){
  .disc-stage{width:min(292px,78vw)}
  .room-prompt{max-width:76vw}
}
@media(prefers-reduced-motion:reduce){
  .disc-stage .disc.bey-disc,.disc-stage:before{animation:none!important}
}

/* Original Muse artwork replaces the SVG sculpt; no extra rings compete with its engraving. */
.disc-stage:before,.disc-stage:after{display:none}
.disc-stage .disc.bey-disc{width:100%;height:100%;filter:drop-shadow(0 0 20px rgba(140,69,236,.23))}


/* Dread Raven / emerald-eye ignition. Pure CSS light, original pixels untouched.
   Pupil centers were measured on the original 1600x1600 art.
   These two layers are children of the spinning disc, not the stationary stage. */
.disc.bey-disc .bey-eye-glow {
  position:absolute;
  z-index:3;
  display:block;
  top:48.06%;
  left:43.44%;
  width:8.1%;
  height:5.6%;
  border-radius:50%;
  pointer-events:none;
  user-select:none;
  transform:translate(-50%,-50%) rotate(-13deg);
  transform-origin:50% 50%;
  background:radial-gradient(ellipse at center,
    rgba(241,255,238,.85) 0%,rgba(153,255,211,.8) 10%,
    rgba(26,255,151,.64) 25%,rgba(0,238,140,.28) 55%,
    rgba(0,226,148,0) 82%);
  filter:blur(2.5px) drop-shadow(0 0 5px rgba(0,255,169,.7));
  mix-blend-mode:screen;
  opacity:0;
  animation:none;
  transition:opacity 650ms ease,filter 650ms ease;
  will-change:opacity;
}
.disc.bey-disc .bey-eye-right {
  left:56.56%;
  transform:translate(-50%,-50%) rotate(13deg);
}
.disc.bey-disc .bey-eye-glow::after {
  content:"";
  position:absolute;
  inset:23% 29%;
  border-radius:50%;
  background:radial-gradient(ellipse at center,
    rgba(243,255,247,.97) 0%,rgba(130,255,190,.8) 19%,
    rgba(8,250,149,.34) 66%,transparent 90%);
  filter:blur(.7px);
}
/* Ignite as the record flies into place: dark -> sharp emerald flash -> settle. */
.now-playing.is-loading .disc.bey-disc .bey-eye-glow {
  animation:bey-eyes-ignite 1700ms ease-out both;
}
/* Active eyes breathe, always registered to the spinning head. */
.now-playing.is-seated .disc-stage.is-playing .disc.bey-disc .bey-eye-glow {
  opacity:.8;
  animation:bey-eyes-breathe 2900ms ease-in-out infinite;
}
/* Paused pupils only hold a trace of emerald; dormant is entirely unlit. */
.now-playing.is-seated .disc-stage:not(.is-playing) .disc.bey-disc .bey-eye-glow {
  animation:none;
  opacity:.1;
}
.now-playing.is-dormant .disc.bey-disc .bey-eye-glow {
  animation:none;
  opacity:0;
}
@keyframes bey-eyes-ignite {
  0%,14% {opacity:0;filter:blur(4px)}
  37% {opacity:.22;filter:blur(3px) drop-shadow(0 0 4px #1aff9a)}
  59% {opacity:.95;filter:blur(1.7px) drop-shadow(0 0 13px #00ff95)}
  74% {opacity:1;filter:blur(1.3px) drop-shadow(0 0 19px #16ffad)}
  88% {opacity:.84;filter:blur(2px) drop-shadow(0 0 11px #00ff96)}
  100% {opacity:.7;filter:blur(2.5px) drop-shadow(0 0 7px #10ffab)}
}
@keyframes bey-eyes-breathe {
  0%,100% {opacity:.6;filter:blur(2.8px) drop-shadow(0 0 6px rgba(0,255,149,.68))}
  50% {opacity:.94;filter:blur(1.9px) drop-shadow(0 0 13px rgba(24,255,175,.95))}
}
@media(prefers-reduced-motion:reduce) {
  .now-playing.is-loading .disc.bey-disc .bey-eye-glow,
  .now-playing.is-seated .disc-stage.is-playing .disc.bey-disc .bey-eye-glow {
    animation:none;
    filter:blur(2.7px);
    opacity:.73;
  }
  .now-playing.is-dormant .disc.bey-disc .bey-eye-glow {opacity:0}
}