/* ============================================================
   Web Ventures — Homepage Intro wrapper (Assembly · Homepage Cut)
   Integrated homepage layer (root /). Everything intro-related
   lives in this file + js/intro.js; the hero stack is untouched.
   ============================================================ */

/* The intro layer exists in the DOM but is only displayed when the
   inline head gate arms it (html.intro-pending). No JS / gate-off /
   reduced-motion / already-seen => display:none, hero stands alone. */
#wv-intro{
  position:fixed; inset:0; z-index:200;
  background:#050607;
  display:none; overflow:hidden;
}
html.intro-pending #wv-intro{display:block}
#wv-intro.is-leaving{opacity:0; transition:opacity .45s ease}
#wv-intro.is-gone{display:none !important}
#wv-intro .wv-intro-gl{position:absolute; inset:0}
#wv-intro .wv-intro-gl canvas{display:block; width:100%; height:100%}
#wv-intro .wv-intro-vignette{
  position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(ellipse 90% 75% at 50% 44%, transparent 55%, rgba(0,0,0,.55) 100%);
}

/* SKIP — visible from frame one (the layer itself is only rendered
   when armed, and the button is plain DOM, not canvas-dependent). */
#wvIntroSkip{
  position:absolute; z-index:5;
  right:calc(16px + env(safe-area-inset-right));
  bottom:calc(16px + env(safe-area-inset-bottom));
  font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:.18em;
  color:#EEF1F5; background:rgba(5,6,7,.35); border:1px solid rgba(255,255,255,.12);
  border-radius:999px; min-height:44px; padding:0 22px; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
  -webkit-tap-highlight-color:transparent;
}
#wvIntroSkip:hover,#wvIntroSkip:focus-visible{
  border-color:#A8C8FF; background:rgba(168,200,255,.07); outline:none;
}

/* REPLAY — small, unobtrusive affordance on the settled hero. */
#introReplay{
  position:absolute; z-index:6;
  right:18px; bottom:18px;
  font-family:"IBM Plex Mono",monospace; font-size:10px; letter-spacing:.16em;
  color:#C7CDD6; background:rgba(5,6,7,.45); border:1px solid rgba(255,255,255,.12);
  border-radius:999px; min-height:36px; padding:0 16px; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
  backdrop-filter:blur(6px);
  -webkit-tap-highlight-color:transparent;
}
#introReplay:hover,#introReplay:focus-visible{
  border-color:#A8C8FF; color:#fff; outline:none;
}
#introReplay[hidden]{display:none !important}