/* Physical details for the street. All movement is driven by the orbit's single clock. */
.cinema-lantern-part { display: none; }
body.on-login #scene .cinema-lantern {
  width: calc(43px * var(--s));
  height: calc(43px * var(--s));
  background: none;
  border-radius: 0;
  box-shadow: none;
  perspective: 420px;
  transform-style: preserve-3d;
  transform-origin: 50% calc(-1 * var(--y));
  transform: rotateZ(0deg);
}
body.on-login #scene .cinema-lantern::before,
body.on-login #scene .cinema-lantern::after { content: none; }
body.on-login #scene .cinema-lantern:first-child,
body.on-login #scene .cinema-lantern:last-child {
  top: 45px;
  width: calc(130px * var(--s));
  height: calc(130px * var(--s));
}
body.on-login #scene .cinema-lantern:first-child { left: 2.2%; }
body.on-login #scene .cinema-lantern:last-child { left: auto; right: 2.2%; }
body.on-login #scene .cinema-lantern-part { display: block; position: absolute; pointer-events: none; }
body.on-login #scene .cinema-lantern-thread {
  width: 1px; height: var(--y); bottom: 100%; left: calc(50% - .5px);
  background: linear-gradient(#21161b00, #755c456e 22%, #bb947880);
}
body.on-login #scene .cinema-lantern-aura {
  inset: -85% -130%;
  background: radial-gradient(ellipse, #ffad5838, #ee693526 23%, #dd3e3812 47%, transparent 70%);
  opacity: .78;
  transform: translateZ(-8px);
}
body.on-login #scene .cinema-lantern-body {
  inset: 0;
  transform-style: preserve-3d;
  transform: rotateY(0deg);
}
body.on-login #scene .cinema-lantern-paper {
  inset: 0;
  /* Source artwork is unchanged; match the 31–130px lantern to screen density. */
  background: url('/landing-art/lantern-cinema-v156-160w-v216.webp') center / contain no-repeat;
  background-image: image-set(url('/landing-art/lantern-cinema-v156-160w-v216.webp') 1x, url('/landing-art/lantern-cinema-v156-320w-v216.webp') 2x, url('/landing-art/lantern-cinema-v156-480w-v216.webp') 3x, url('/landing-art/lantern-cinema-v156.webp') 4x);
}
body.on-login #scene .cinema-lantern-flame {
  inset: 20% 23%;
  border-radius: 50%;
  background: radial-gradient(ellipse, #ffe2a35c, #ffc67632 28%, transparent 68%);
  mix-blend-mode: screen;
  opacity: .78;
}
body.on-login #scene .cinema-lantern-tassel {
  left: 43%; top: 94%; width: 14%; height: 40%;
  transform-origin: 50% 0;
  transform: rotateZ(0deg);
  background: linear-gradient(#a86732 0 12%, transparent 12% 30%, #ae4935 30% 36%, transparent 36%),
    repeating-linear-gradient(90deg, #9d453696 0 1px, #d2824738 1px 2px, transparent 2px 3px);
  clip-path: polygon(44% 0, 57% 0, 60% 28%, 87% 40%, 100% 100%, 0 100%, 14% 40%, 40% 28%);
}
body.on-login #scene .landing-cinema-image {
  transform: scale(1.035);
  transform-origin: 48% 56%;
}
body.on-login #scene .fog {
  transform: none;
}
body.on-login #scene.is-street-alive :is(.cinema-lantern, .cinema-lantern-body, .cinema-lantern-tassel, .landing-cinema-image, .fog) { will-change: transform; }
body.on-login #scene.is-street-alive :is(.cinema-lantern-aura, .cinema-lantern-flame) { will-change: opacity; }
@media (max-width: 760px) {
  body.on-login #scene .cinema-lantern { width: calc(31px * var(--s)); height: calc(31px * var(--s)); }
  body.on-login #scene .cinema-lantern:first-child,
  body.on-login #scene .cinema-lantern:last-child { top: 79px; width: calc(38px * var(--s)); height: calc(38px * var(--s)); }
  body.on-login #scene .cinema-lantern:first-child { left: 2%; }
  body.on-login #scene .cinema-lantern:last-child { right: 2%; }
}
@media (prefers-reduced-motion: reduce) {
  body.on-login #scene .cinema-lantern,
  body.on-login #scene .cinema-lantern-body,
  body.on-login #scene .cinema-lantern-tassel { transform: none; }
  body.on-login #scene .landing-cinema-image { transform: scale(1.035); }
  body.on-login #scene .fog { transform: none; }
}