/* Controlled motion contract.
   Motion is limited to one navigation sequence: header → metrics → content.
   The class is applied by app-shell only when the user uses the topbar nav. */
:root {
  --rst-motion-fast: 140ms;
  --rst-motion-ui: 190ms;
  --rst-motion-smooth: cubic-bezier(.2,.8,.2,1);
}

@keyframes rst-nav-enter {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes rst-nav-line {
  from { width: 0; opacity: 0; }
  to   { width: 74px; opacity: 1; }
}

body.is-nav-transitioning .page.active .rs-module-header .rs-page-title {
  animation: rst-nav-enter .24s var(--rst-motion-smooth) both;
}

body.is-nav-transitioning .page.active .rs-module-header .rs-page-subtitle {
  animation: rst-nav-enter .24s var(--rst-motion-smooth) both;
  animation-delay: 70ms;
}

body.is-nav-transitioning .page.active .rs-module-header .rs-module-header__copy::after {
  animation: rst-nav-line .24s var(--rst-motion-smooth) both;
  animation-delay: 130ms;
}

body.is-nav-transitioning .page.active .rs-metrics-row .rs-metric-card {
  animation: rst-nav-enter .28s var(--rst-motion-smooth) both;
}

body.is-nav-transitioning .page.active .rs-metrics-row .rs-metric-card:nth-child(1) { animation-delay: 260ms; }
body.is-nav-transitioning .page.active .rs-metrics-row .rs-metric-card:nth-child(2) { animation-delay: 320ms; }
body.is-nav-transitioning .page.active .rs-metrics-row .rs-metric-card:nth-child(3) { animation-delay: 380ms; }
body.is-nav-transitioning .page.active .rs-metrics-row .rs-metric-card:nth-child(4) { animation-delay: 440ms; }

body.is-nav-transitioning .page.active :is(.rs-page-board,.rs-weekly-board,.rs-workbench-grid) {
  animation: rst-nav-enter .30s var(--rst-motion-smooth) both;
  animation-delay: 520ms;
}

@media (prefers-reduced-motion: reduce) {
  body.is-nav-transitioning .page.active :is(
    .rs-module-header .rs-page-title,
    .rs-module-header .rs-page-subtitle,
    .rs-module-header .rs-module-header__copy::after,
    .rs-metrics-row .rs-metric-card,
    .rs-page-board,
    .rs-weekly-board,
    .rs-workbench-grid
  ) {
    animation-duration: .001ms;
    animation-delay: 0ms;
  }
}