/* ════════════════════════════════════════════════════════════════════
   VYAN · motion-core (the still-marketing concern)
   Apple-feel dynamics: things press like hardware, settle like springs.
   The marketing surface stays quiet: one scripted moment per page, spent
   on a mechanism the operator actuates, never on a viewport reveal.
   The fade-up engine is RETIRED (Brief B.3): content rests visible.
   App-only celebration primitives live in motion-app.css.
   ════════════════════════════════════════════════════════════════════ */

/* ── Pressables: everything tappable gives under the thumb ───────── */
.btn, .btn-gold, .tlink, .fchip, .b-opt, .nav-it, .catalog-row, .route, .route-card,
.tier .btn, .mod-row, .preset-row, .actuator, .vrow.clickable, .act, .dispo, .thr, .fm-press {
  transition: transform var(--m-fast) var(--ease-spring),
              border-color var(--m-fast) var(--ease),
              background var(--m-fast) var(--ease),
              box-shadow var(--m-fast) var(--ease),
              color var(--m-fast) var(--ease);
}
.btn:active, .btn-gold:active, .fchip:active, .b-opt:active, .act:active,
.dispo:active, .mod-row:active, .nav-it:active, .thr:active, .fm-press:active {
  transform: scale(.965);
}
.btn-gold:hover { transform: translateY(-1px); }
.btn-gold:active { transform: scale(.97); }

/* ── System-wide press detent (Brief B.3) ─────────────────────────
   Every actionable element gets a real :active translateY plus a 1px
   ember underglow visible ONLY while pressed. The cheapest "this is
   built" signal. The box-shadow is a hairline, never a resting halo. */
.tlink:active, .catalog-row:active, .route-card:active,
.preset-row:active, .actuator:active, .vrow.clickable:active {
  transform: translateY(1px);
  box-shadow: 0 1px 0 0 var(--ember);
}

/* ── The physical detent, generalized (Elevation Spec §D4-B) ──────
   Extends the down-state to the rest of the interactive family so tapping
   anything feels physical: a firm 90ms --m-press down, --e-press shadow,
   no overshoot. .btn already carries this in app.css; these are its kin
   (rows, tool tiles, segmented keys, kanban cards). Neutral energy, no gold. */
.rrow[role="button"]:active, .rrow.clickable:active,
.tl-card:active, .seg-b:active, .kb-card:active {
  transform: translateY(1px);
  box-shadow: var(--e-press);
  transition: transform var(--m-press) var(--ease-press),
              box-shadow var(--m-press) var(--ease-press);
}

/* ── The "did" success settle (Elevation Spec §D4) ────────────────
   A brief functional-green confirm on task-complete (accept a rec, advance
   a state). Functional green, never ember; token-driven; self-clearing to
   transparent. Applied as a transient class removed after the redraw. */
@keyframes didSettle {
  0%   { background: var(--tint-green); }
  100% { background: transparent; }
}
.rrow.did, .kb-card.did { animation: didSettle 520ms var(--ease-exit); }

/* ── Entrances: app views arrive, they don't just appear ─────────── */
@keyframes riseIn {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: none; }
}
.view > * { animation: riseIn var(--m-enter) var(--ease-exit) backwards; }
.view > *:nth-child(1) { animation-delay: 0ms; }
.view > *:nth-child(2) { animation-delay: 40ms; }
.view > *:nth-child(3) { animation-delay: 80ms; }
.view > *:nth-child(4) { animation-delay: 120ms; }
.view > *:nth-child(5) { animation-delay: 160ms; }
.view > *:nth-child(n+6) { animation-delay: 200ms; }

/* ── View continuity settle (Elevation Spec §D4-A) ────────────────
   draw() toggles .view-in on the view container so a route change rises
   and settles like hardware rather than blinking in. 200ms expo-out, 6px,
   no bounce. Composes with the per-child stagger above as a group lift. */
.view.view-in { animation: viewIn var(--m-base) var(--ease-exit); }
@keyframes viewIn {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: none; }
}

/* NOTE · the marketing fade-up engine (.rise translateY) is retired.
   Marketing content rests visible (opacity 1). One scripted moment per
   page animates a mechanism via a transient class removed by setTimeout
   (the Glass Roof law), never a scroll reveal. The legacy .reveal alias
   in base.css stays inert for any old markup. */

/* ── Toasts: spring in from the right, settle precisely ──────────── */
@keyframes toastIn {
  0%   { opacity: 0; transform: translateX(18px) scale(.97); }
  60%  { opacity: 1; transform: translateX(-3px) scale(1.005); }
  100% { opacity: 1; transform: none; }
}
.toast { animation: toastIn 320ms var(--ease-exit); }

/* ── The drawer and sheet: slide with weight ─────────────────────── */
@keyframes sheetUp {
  from { transform: translateY(18px); opacity: 0; }
  to   { transform: none; opacity: 1; }
}
.sheet { animation: sheetUp 280ms var(--ease-exit); }
@keyframes drawerIn {
  from { transform: translateX(24px); opacity: 0; }
  to   { transform: none; opacity: 1; }
}
.drawer { animation: drawerIn 280ms var(--ease-exit); }

/* ── Count-up numbers get a soft settle ──────────────────────────── */
.counting { transition: opacity 120ms var(--ease); }

/* ── Respect the human ─────────────────────────────────────────────
   Motion never removes information or reward, only movement. View entrance
   and the did-settle rest visible (opacity 1, no residual tint); press
   detents drop to none, state carried by color. Nothing is gated on an
   animation firing (the Glass Roof law). */
@media (prefers-reduced-motion: reduce) {
  .view > *, .view.view-in, .toast, .sheet, .drawer,
  .rrow.did, .kb-card.did { animation: none !important; }
  .btn:active, .btn-gold:active, .fchip:active, .b-opt:active, .act:active,
  .dispo:active, .mod-row:active, .nav-it:active, .thr:active, .fm-press:active { transform: none; }
  .tlink:active, .catalog-row:active, .route-card:active,
  .preset-row:active, .actuator:active, .vrow.clickable:active { transform: none; box-shadow: none; }
  .rrow[role="button"]:active, .rrow.clickable:active,
  .tl-card:active, .seg-b:active, .kb-card:active { transform: none; box-shadow: none; }
}
