/*
 * MEV 2.0 — Global First Touch — FINAL CANDIDATE, DRAFT ONLY.
 * True 100svh in-flow first block. No rail, no replay control, no auto-dismiss.
 */

.mev-first-touch{
  --mev-noir:#000000;
  --mev-beige-01:#F9F9EF;
  position:relative;
  width:100%;
  min-height:100svh;
  display:none;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:#F9F9EF;
  color:#000000;
}
html.mev-first-touch-play .mev-first-touch{display:flex}
html.mev-first-touch-skip .mev-first-touch{display:none}

.mev-first-touch__stage{
  position:relative;
  width:100%;
  height:100svh;
  display:flex;
  align-items:center;
  justify-content:center;
}
.mev-first-touch__stage>*{position:absolute}

/* Six-state decelerating M sequence: M1 → M2 → M3 → M1 → M2 → M3. */
.mev-first-touch__state{
  width:min(78vw,calc(78svh * 1080 / 1430));
  height:auto;
  aspect-ratio:1080 / 1430;
  opacity:0;
  transition:opacity 120ms ease;
}
.mev-first-touch__state.is-on{opacity:1}
.mev-first-touch__state svg{display:block;width:100%;height:100%}

/* Final resolution: M and text launch together; M settles first, text completes later. */
.mev-first-touch__resolve-m,
.mev-first-touch__resolve{
  width:min(84vw,calc(64svh * 1950 / 1100));
  opacity:0;
  pointer-events:none;
}
.mev-first-touch__resolve-m{
  z-index:2;
  clip-path:inset(0 58% 0 0);
  transition:opacity 560ms cubic-bezier(.25,.1,.25,1);
}
.mev-first-touch__resolve{
  z-index:1;
  clip-path:inset(0 0 0 41.5%);
  transition:opacity 1300ms linear;
}
.mev-first-touch__resolve-m.is-on,
.mev-first-touch__resolve.is-on{opacity:1}
.mev-first-touch__resolve-m svg,
.mev-first-touch__resolve svg{display:block;width:100%;height:auto}

/* While First Touch owns the first viewport, the requested page hero below is already settled. */
html.mev-first-touch-play .mev-hero__state{opacity:0!important}
html.mev-first-touch-play .mev-hero__resolve{opacity:1!important;transition:none!important}

/* Final physical-scroll affordance: enlarged ↓, two discreet opacity shimmers, then static. */
.mev-first-touch__cue{
  position:absolute;
  z-index:3;
  left:50%;
  bottom:30px;
  transform:translateX(-50%);
  display:flex;
  align-items:center;
  justify-content:center;
  width:52px;
  height:52px;
  padding:0;
  border:0;
  margin:0;
  background:transparent;
  color:#000000;
  font-family:"General Sans",-apple-system,"Helvetica Neue",Arial,sans-serif;
  font-size:28px;
  font-weight:400;
  line-height:1;
  cursor:pointer;
  opacity:0;
  pointer-events:none;
  transition:opacity 180ms ease;
}
.mev-first-touch.is-resolved .mev-first-touch__cue{
  opacity:1;
  pointer-events:auto;
  animation:mev-ft-arrow-shimmer 2.6s ease-in-out 2;
}
.mev-first-touch__cue:hover,
.mev-first-touch__cue:focus-visible{
  animation:none;
  opacity:1;
}
.mev-first-touch__cue:focus-visible{outline:1px solid currentColor;outline-offset:5px}
@keyframes mev-ft-arrow-shimmer{
  0%,100%{opacity:.68}
  34%{opacity:.94}
  48%{opacity:.74}
  62%{opacity:.88}
}

/* Final mobile balance: official text geometry untouched; M enlarged 20% only on mobile.
   The M artwork scales around its official right/base point inside the 1950×1100 SVG. */
@media (max-width:768px){
  .mev-first-touch__resolve{transform:none}
  .mev-first-touch__resolve-m{clip-path:inset(-24% 58% -8% -20%)}
  .mev-first-touch__resolve-m svg{overflow:visible}
  .mev-first-touch__resolve-m use{
    transform-box:view-box;
    transform-origin:735.41px 1022.22px;
    transform:scale(1.20);
  }
}

/* System dark mode: same geometry/timing; black surface, red retained, beige text.
   M-state black rectangle becomes transparent into the black surface. */
/* 2026-09-10 — SYSTEM DARK PALETTE DORMANT / NOT ACTIVE. Code retained for possible future reactivation. */
@media (prefers-color-scheme:dark) and (max-width:0px){
  body.mev-ft-theme-system .mev-first-touch{
    --mev-noir:#F9F9EF;
    --mev-beige-01:#000000;
    background:#000000;
    color:#F9F9EF;
  }
  body.mev-ft-theme-system .mev-first-touch__cue{color:#F9F9EF}
  body.mev-ft-theme-system .mev-first-touch__state{
    --mev-noir:transparent;
    --mev-beige-01:#F9F9EF;
  }
}

/* Reduced motion: retain the same final composition, immediately and statically. */
@media (prefers-reduced-motion:reduce){
  html.mev-first-touch-play .mev-first-touch{display:flex!important}
  html.mev-first-touch-skip .mev-first-touch{display:none!important}
  .mev-first-touch__state{opacity:0!important;transition:none!important}
  .mev-first-touch__resolve-m,
  .mev-first-touch__resolve{
    opacity:1!important;
    transition:none!important;
  }
  .mev-first-touch__cue{transition:none!important;animation:none!important}
}
html.mev-first-touch-reduced .mev-first-touch__state{opacity:0!important;transition:none!important}
html.mev-first-touch-reduced .mev-first-touch__resolve-m,
html.mev-first-touch-reduced .mev-first-touch__resolve{
  opacity:1!important;
  transition:none!important;
}
html.mev-first-touch-reduced .mev-first-touch__cue{transition:none!important;animation:none!important}