.hero-beat { transition: opacity .7s var(--ease-out), transform .9s var(--ease-out), filter .8s var(--ease-out), clip-path .9s var(--ease-out); }
.day-phase,
.heart-beat,
.workout-session { transition: opacity .65s var(--ease-out), transform .85s var(--ease-out), filter .75s var(--ease-out); }
.day-balance span { transition: width .85s var(--ease-out), opacity .6s ease; }
.phase-dots span { transition: opacity .45s ease; }
.sleep-segment { transition: opacity .35s ease, filter .35s ease, transform .5s var(--ease-out); }
.sleep-segment.is-current { opacity: 1; filter: saturate(1.25) brightness(1.15); transform: scaleY(1.12); }
.dawn-copy { opacity: clamp(0, calc((var(--p, 0) - .22) * 2.2), 1); transform: translateY(calc((1 - var(--p, 0)) * 2rem)); }
.closing-copy { opacity: clamp(.15, calc(var(--closing-p, 0) * 1.4), 1); }
.scroll-cue span { animation: cue 1.8s var(--ease-smooth) infinite; }
@keyframes cue {
  0% { transform: scaleY(0); transform-origin: top; }
  45% { transform: scaleY(1); transform-origin: top; }
  55% { transform: scaleY(1); transform-origin: bottom; }
  100% { transform: scaleY(0); transform-origin: bottom; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
  .scene--hero { height: auto; }
  .scene__stage { position: relative; min-height: auto; }
  .hero-stage { min-height: 100svh; }
  .hero-beats { position: relative; top: auto; right: auto; width: auto; margin: 58svh 0 5rem; min-height: 0; text-align: left; }
  .hero-beat { position: static; opacity: 1; transform: none; filter: none; clip-path: none; margin-top: 2rem; }
  .trace--live { stroke-dashoffset: 0; }
  .scroll-cue { display: none; }
  .scene--days,
  .scene--distance,
  .scene--heart,
  .scene--workout,
  .scene--sleep,
  .scene--dawn { height: auto; }
  .days-stage,
  .distance-stage,
  .heart-stage,
  .workout-stage,
  .sleep-stage,
  .dawn-stage { min-height: 100svh; }
  .days-stage,
  .heart-stage,
  .workout-stage { min-height: auto; }
  .chapter-copy--days,
  .day-phases,
  .heart-beats,
  .workout-sessions,
  .workout-total { position: relative; inset: auto; }
  .chapter-copy--days { margin-bottom: clamp(5rem, 12svh, 10rem); }
  .day-phases,
  .heart-beats,
  .workout-sessions {
    width: auto;
    min-height: 0;
    text-align: left;
  }
  .day-phases,
  .heart-beats { display: grid; gap: clamp(2rem, 7svh, 5rem); }
  .day-phase,
  .heart-beat,
  .workout-session {
    position: relative;
    inset: auto;
    display: block;
    opacity: 1;
    transform: none;
    filter: none;
    pointer-events: auto;
  }
  .day-phase,
  .heart-beat { padding-top: 1.25rem; border-top: 1px solid var(--hairline); }
  .day-balance,
  .phase-dots { display: none; }
  .heart-stage { padding-bottom: clamp(7rem, 14svh, 12rem); }
  .heart-beats { margin: clamp(35rem, 63svh, 47rem) 0 9rem; }
  .heart-beat strong { font-size: clamp(2.8rem, 6vw, 5.6rem); }
  .workout-sessions { display: grid; gap: clamp(7rem, 16svh, 12rem); }
  .workout-session { padding-bottom: 1rem; }
  .workout-total { margin-top: 6rem; text-align: right; }
  .sleep-track { transform: translate3d(0, 0, 0); width: 100%; }
  .sleep-viewport { overflow: hidden; }
  .sleep-cursor { display: none; }
  .dawn-copy,
  .closing-copy { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) and (max-width: 720px) {
  .day-pair { grid-template-columns: 1fr; gap: 1.6rem; }
  .day-pair p:last-child { text-align: left; }
  .day-pair strong { font-size: clamp(3.2rem, 18vw, 5rem); }
  .heart-beats { margin-top: clamp(31rem, 67svh, 40rem); }
  .workout-time { grid-template-columns: 1fr; }
}
