/* ============================================================
   Web Ventures — Homepage Intro wrapper (Assembly · Homepage Cut)
   Integrated homepage layer (root /) — ONE-SURFACE edition
   (flicker fix, 2026-10-17): the intro renders inside the hero's
   own canvas (see js/intro.js / WVHeroStage in js/hero.js); this
   layer is a transparent overlay carrying only the vignette and
   the SKIP button. The previous edition's fatal flaw lived here:
   the layer's display:block existed only under html.intro-pending,
   which finish() removed in the same task that armed the fade —
   the layer snapped to display:none and the "crossfade" never ran.
   ============================================================ */

/* 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:transparent;
  display:none; overflow:hidden;
}
html.intro-pending #wv-intro{display:block}
/* While leaving, the layer must STAY displayed or the fade cannot
   run — this rule is what the previous edition lacked. It outranks
   the base display:none on its own, independent of intro-pending. */
#wv-intro.is-leaving{display:block; opacity:0; transition:opacity .45s ease}
#wv-intro.is-gone{display:none !important}
#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%);
  /* opacity is driven per-frame by js/intro.js (fades out across
     the resolve window, so by the time the layer leaves, the
     vignette is already gone and nothing brightens). */
}

/* While the intro is armed, the hero canvas stays hidden until the
   prelude's first frame has rendered (html.intro-live, set by
   js/intro.js), so the visitor never sees the held phase-0 hero or
   an empty frame before the intro. The head watchdog removes
   intro-pending on any failure, which restores the canvas. The nav
   and hero copy stay covered for exactly the intro's duration —
   the same relationship the old opaque layer produced. */
html.intro-pending #hero-canvas{visibility:hidden}
html.intro-pending.intro-live #hero-canvas{visibility:visible}
/* Hero cleanup (2026-11-09): the hero message is visible immediately —
   .hero-in is no longer held for the intro. Only the nav stays covered
   for the intro's duration. */
html.intro-pending header.nav{visibility:hidden}

/* 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:#8CF0FF; background:rgba(140,240,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:#8CF0FF; color:#fff; outline:none;
}
#introReplay[hidden]{display:none !important}