/* ============================================================
   selector.css — transparent persona hit-zones over the
   full-bleed hero art. (The original character-image plate /
   label / visor system was replaced by HeroArt + the AAA HUD
   plates in hud.css, so only the hit-zones remain here.)
   ============================================================ */
.panels {
  position: absolute;
  inset: 0;
  display: flex;
  z-index: 6;
}
.panel {
  position: relative;
  flex: 1 1 50%;
  cursor: pointer;
}
.panel--mihai {
  z-index: 6;
}
.panel--codezero {
  z-index: 5;
}

/* === polish 2026-06-12 === */
/* keyboard focus ring for the persona hit zones. the panels are full-bleed
   halves, so the 3px offset runs inward (negative) to keep the whole ring
   on-screen; an outward offset would push 3 of 4 edges past the viewport.
   outline only: zero layout impact. */
.panel:focus-visible {
  outline: 2px solid var(--warm-500, #e8a868);
  outline-offset: -3px;
}
.panel--codezero:focus-visible {
  outline-color: var(--acid-500, #c6f135);
}

/* === art-pass 2026-06-12: cross-document view transition === */
/* Replaces the inter-page seam with a single dissolve. The selector exit
   fade still runs; the transition snapshots that faded frame and hands it
   to the destination boot frame. Unsupported browsers keep todays exact
   behavior (fade, then load). */
@view-transition {
  navigation: auto;
}
::view-transition-old(root),
::view-transition-new(root) {
  animation-duration: 0.45s;
  animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
}
@media (prefers-reduced-motion: reduce) {
  ::view-transition-group(*),
  ::view-transition-old(*),
  ::view-transition-new(*) {
    animation: none !important;
  }
}
