/* The film and its quiet welcome are desktop-only; the ordinary site is the fallback. */
.hero-video{display:none}
@media (min-width:850px){
  .hero-video{display:block;position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:57% center;opacity:0;pointer-events:none;transition:opacity .65s ease}
  .hero-video.is-visible{opacity:1}
  .hero.intro-complete .hero-image{background-image:url('/assets/galaxy-intro-end.webp');background-position:57% center;animation:none;transform:none}
  .hero-shade,.site-header,.hero-content,.hero-bottom{transition:opacity .85s ease}
  html.intro-pending .site-header,html.intro-playing .site-header,html.intro-welcome .site-header,
  html.intro-pending .hero-content,html.intro-playing .hero-content,html.intro-welcome .hero-content,
  html.intro-pending .hero-bottom,html.intro-playing .hero-bottom,html.intro-welcome .hero-bottom{opacity:0;visibility:hidden;pointer-events:none}
  html.intro-pending .hero-shade,html.intro-playing .hero-shade,html.intro-welcome .hero-shade{opacity:0}
}
.intro-skip,.intro-enter{display:none;position:absolute;z-index:5;align-items:center;justify-content:center;gap:20px;border:1px solid rgba(206,235,250,.58);background:rgba(4,20,35,.78);color:#f3faff;font:inherit;font-weight:700;cursor:pointer;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.intro-skip{top:32px;right:max(32px,calc((100vw - 1400px)/2));min-height:48px;padding:0 18px;border-radius:12px;font-size:14px}
.intro-enter{bottom:8%;left:50%;transform:translateX(-50%);min-height:62px;min-width:190px;padding:0 25px;border-radius:999px;font-size:17px;letter-spacing:.02em;box-shadow:0 0 0 1px rgba(118,210,250,.12),0 9px 35px rgba(0,0,0,.5),0 0 35px rgba(63,165,222,.25);animation:welcome-appear 1.1s both}
.intro-enter span,.intro-skip span{font-size:20px;color:#a6e4ff;transition:transform .25s ease}
.intro-enter:hover,.intro-enter:focus-visible,.intro-skip:hover,.intro-skip:focus-visible{background:rgba(17,64,87,.95);border-color:#c8efff}
.intro-enter:hover span,.intro-enter:focus-visible span{transform:translateX(5px)}
html.intro-pending .intro-skip,html.intro-playing .intro-skip,html.intro-welcome .intro-enter{display:inline-flex}
@keyframes welcome-appear{from{opacity:0;transform:translate(-50%,12px)}to{opacity:1;transform:translate(-50%,0)}}
@media(prefers-reduced-motion:reduce){.hero-video,.intro-skip,.intro-enter{display:none!important}.hero-shade,.site-header,.hero-content,.hero-bottom{transition:none!important}}