/* A living CRT: art drifts separately from static captions and native links. */
.metal-slide {
  --art-glow:#ff9b393d;
  --mote-color:#ffc486;
  --mote-x:-46px;
  --mote-y:8px;
}
.necro-slide {
  --art-glow:#9cfa5733;
  --mote-color:#cbff96;
  --mote-x:12px;
  --mote-y:-39px;
}
.art-motion {
  position:absolute;
  inset:0;
  transform-origin:40% 40%;
  animation:art-drift 8s ease-in-out infinite alternate;
  will-change:transform;
  pointer-events:none;
}
.necro-slide .art-motion { animation-name:art-haunt; animation-duration:10s; }
@keyframes art-drift {
  from { transform:translate(-.4%,.3%) scale(1.015); }
  to { transform:translate(.45%,-.6%) scale(1.04); }
}
@keyframes art-haunt {
  from { transform:translate(.35%,.4%) scale(1.025); }
  to { transform:translate(-.4%,-.7%) scale(1.05); }
}
.art-atmosphere { position:absolute; inset:0 0 30%; overflow:hidden; pointer-events:none; }
.art-atmosphere:before {
  content:'';
  position:absolute;
  inset:-15%;
  background:radial-gradient(ellipse at 72% 40%,var(--art-glow),transparent 62%);
  animation:art-glow 5.6s ease-in-out infinite alternate;
  pointer-events:none;
}
@keyframes art-glow {
  from { opacity:.24; transform:translate(-2%,3%) scale(.95); }
  to { opacity:.72; transform:translate(2%,-3%) scale(1.08); }
}
.art-atmosphere i {
  position:absolute;
  left:20%;
  top:68%;
  width:2px;
  height:2px;
  border-radius:50%;
  background:var(--mote-color);
  box-shadow:0 0 5px 1px var(--mote-color);
  opacity:0;
  animation:art-mote 5.3s linear infinite;
  animation-delay:-2.4s;
}
.art-atmosphere i:nth-child(2) { left:34%; top:31%; animation-duration:6.7s; animation-delay:-4.1s; }
.art-atmosphere i:nth-child(3) { left:54%; top:78%; animation-duration:4.9s; animation-delay:-.8s; }
.art-atmosphere i:nth-child(4) { left:72%; top:22%; animation-duration:7.1s; animation-delay:-5.8s; }
.art-atmosphere i:nth-child(5) { left:81%; top:55%; animation-duration:5.8s; animation-delay:-3.2s; }
.art-atmosphere i:nth-child(6) { left:88%; top:65%; animation-duration:6.2s; animation-delay:-1.5s; }
@keyframes art-mote {
  0% { transform:translate(0,0); opacity:0; }
  20% { opacity:.65; }
  75% { opacity:.4; }
  100% { transform:translate(var(--mote-x),var(--mote-y)); opacity:0; }
}
/* One dim tracking band, not a full-screen flash. Most of its cycle is quiet. */
.crt-interference {
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  opacity:0;
  background:linear-gradient(transparent 41%,#eee5d21c 43%,#ef9b9f20 46%,#1118 47%,#eee5d22b 48%,transparent 51%);
  animation:crt-idle-roll 9.4s linear 1.4s infinite;
}
.crt-interference:after {
  content:'';
  position:absolute;
  inset:44% 0 51%;
  background:repeating-linear-gradient(0deg,#eee5d225 0 1px,transparent 1px 3px);
  transform:translateX(-1%);
}
@keyframes crt-idle-roll {
  0% { opacity:0; transform:translateY(-100%); }
  1% { opacity:.7; }
  8% { opacity:.7; transform:translateY(100%); }
  9%,100% { opacity:0; transform:translateY(100%); }
}
.arcade-machine[data-effect] .crt-interference,
.phone-landscape .crt-interference { visibility:hidden; }
/* Offscreen cartridges and background tabs do no ambient animation work. */
.game-slide[aria-hidden='true'] .art-motion,
.game-slide[aria-hidden='true'] .art-atmosphere:before,
.game-slide[aria-hidden='true'] .art-atmosphere i,
.arcade-machine:not(.reel-ready) .art-motion,
.arcade-machine:not(.reel-ready) .art-atmosphere:before,
.arcade-machine:not(.reel-ready) .art-atmosphere i,
.ambient-paused .art-motion,.ambient-paused .art-atmosphere:before,.ambient-paused .art-atmosphere i,.ambient-paused .crt-interference,
.phone-landscape .art-motion,.phone-landscape .art-atmosphere:before,.phone-landscape .art-atmosphere i,.phone-landscape .crt-interference { animation-play-state:paused; }
.game-slide[aria-hidden='true'] .art-motion { will-change:auto; }
@media (max-width:767px) {
  .art-motion { transform-origin:50% 35%; }
  .art-atmosphere i { width:1.5px; height:1.5px; }
}
