/* ============================================================
   Room scenes — inline SVG plates + their little machinery
   Every moving part is a class here, so prefers-reduced-motion
   (tokens.css) stills the whole archive at once.
   ============================================================ */
.scene{
  position:relative; max-width:60ch; margin:0 0 26px;
  border:1px solid var(--line); border-radius:var(--r); overflow:hidden;
  background:#0a1215;
  box-shadow:0 18px 40px -28px #000;
  animation:sceneIn .7s ease both;
}
@keyframes sceneIn{from{opacity:0; transform:scale(.985)}to{opacity:1; transform:none}}
.scene svg{display:block; width:100%; height:auto}
/* grain + vignette over the plate */
.scene::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(120% 120% at 50% 20%, transparent 45%, rgba(0,0,0,.55) 100%);
}
.scene .caption{
  position:absolute; left:10px; bottom:8px; z-index:2;
  font-family:var(--mono); font-size:9px; letter-spacing:.24em; color:rgba(231,223,209,.42);
}

/* ---------- shared scene motions ---------- */
.sc .swing{transform-box:fill-box; transform-origin:50% 0; animation:swing 6.5s ease-in-out infinite}
@keyframes swing{0%,100%{transform:rotate(-2.6deg)}50%{transform:rotate(2.6deg)}}

.sc .swing-slow{transform-box:fill-box; transform-origin:50% 0; animation:swing 11s ease-in-out infinite}

.sc .flick{animation:flick 3.4s infinite}
@keyframes flick{0%,100%{opacity:1}38%{opacity:.5}41%{opacity:.95}66%{opacity:.62}69%{opacity:1}84%{opacity:.8}}

.sc .dying{animation:dying 4.2s infinite}
@keyframes dying{0%,100%{opacity:.95}20%{opacity:.15}23%{opacity:.9}55%{opacity:.35}58%{opacity:.85}}

.sc .glint{animation:glint 4s ease-in-out infinite}
@keyframes glint{0%,100%{opacity:.18; transform:translateX(-46px)}50%{opacity:.85; transform:translateX(46px)}}

.sc .sweep{animation:sweep 8s ease-in-out infinite}
@keyframes sweep{0%,100%{transform:translateX(-64px)}50%{transform:translateX(64px)}}

.sc .spin{transform-box:fill-box; transform-origin:50% 50%; animation:scspin 22s linear infinite}
@keyframes scspin{to{transform:rotate(360deg)}}
.sc .spin-back{transform-box:fill-box; transform-origin:50% 50%; animation:scspin 34s linear infinite reverse}

.sc .rock{transform-box:fill-box; transform-origin:50% 50%; animation:rock 5s ease-in-out infinite}
@keyframes rock{0%,100%{transform:rotate(-3.5deg)}50%{transform:rotate(3.5deg)}}

.sc .float{animation:scfloat 6s ease-in-out infinite}
@keyframes scfloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}

.sc .pulse{animation:scpulse 3.6s ease-in-out infinite}
@keyframes scpulse{0%,100%{opacity:.45}50%{opacity:1}}

.sc .drip{animation:drip 3.2s linear infinite}
@keyframes drip{
  0%{transform:translateY(0); opacity:0}
  8%{opacity:1}
  72%{transform:translateY(30px); opacity:1}
  84%{transform:translateY(34px); opacity:0}
  100%{opacity:0}
}
.sc .ripple{transform-box:fill-box; transform-origin:50% 50%; animation:ripple 3.2s ease-out infinite}
@keyframes ripple{0%,60%{transform:scale(.3); opacity:0}72%{opacity:.7}100%{transform:scale(1.5); opacity:0}}

.sc .dash{stroke-dasharray:5 7; animation:dashrun 2.4s linear infinite}
@keyframes dashrun{to{stroke-dashoffset:-48}}

.sc .rise{animation:rise 7s linear infinite}
@keyframes rise{0%{transform:translateY(6px); opacity:0}20%{opacity:.8}100%{transform:translateY(-34px); opacity:0}}

.sc .flap{transform-box:fill-box; transform-origin:50% 100%; animation:flap 2.8s ease-in-out infinite}
@keyframes flap{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.7)}}

.sc .d1{animation-delay:.5s}
.sc .d2{animation-delay:1.1s}
.sc .d3{animation-delay:1.9s}
.sc .d4{animation-delay:2.6s}