/* ============================================================
   MEMDEX "Animations off" mode (W2)

   Everything here is keyed off html.no-motion, which js/motion-boot.js
   sets before first paint (manual navbar toggle, or the OS
   prefers-reduced-motion preference when the user hasn't chosen).

   Strategy: one blanket rule stops ALL CSS animation and transition
   site-wide — future pages inherit it for free — followed by targeted
   fixes for the few places where a frozen animation needs a deliberate
   static look (spinners, skeletons, MD1 background layers).

   JS-driven animations can't be stopped from CSS; those scripts ask
   window.MEMDEX_MOTION.reduced() instead.
   ============================================================ */

/* ── Blanket kill ──
   Durations go to ~0 rather than animation:none so that entrance
   animations still complete (content ends visible, not stuck at
   opacity:0) and any JS waiting on animationend/transitionend still
   gets its event. Matches the approach of the existing site-wide
   prefers-reduced-motion rule in effects.css. */
html.no-motion *,
html.no-motion *::before,
html.no-motion *::after {
    animation-duration: 0.01ms !important;
    animation-delay: 0s !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    transition-delay: 0s !important;
}

html.no-motion {
    scroll-behavior: auto !important;
}

/* ── Hover motion ──
   Transitions are already instant; also remove the movement itself so
   cards/buttons don't jump on hover. */
html.no-motion .hover-lift:hover,
html.no-motion .hover-scale:hover,
html.no-motion .glass-card:hover,
html.no-motion .glass-card-subtle:hover,
html.no-motion .glass-card-strong:hover {
    transform: none;
}

/* ── Spinners → static indicators ──
   With the spin killed, the ring freezes with its accent-colored top
   arc — that partial ring IS the static "loading" indicator. Soften it
   slightly so it reads as a state, not a stuck animation. */
html.no-motion .animate-spin,
html.no-motion .chart-loading-spinner {
    animation: none !important;
    opacity: 0.8;
}

/* ── Skeleton loaders → flat placeholders ──
   The shimmer gradient frozen mid-sweep looks broken; flatten it. */
html.no-motion .skeleton,
html.no-motion .skeleton-text,
html.no-motion .skeleton-circle,
html.no-motion .skeleton-card {
    animation: none !important;
    background: var(--bg-subtle);
}

/* ── MD1 app background layers ──
   Freeze the grid backdrop in its resting (un-dimmed) state: the
   scroll-dim effect is scroll-linked motion, so it stays off entirely. */
html.no-motion .obs-bg-grid,
html.no-motion .obs-bg-grid.dimmed {
    opacity: 1;
    filter: none;
}

/* Scan beams on active layer cards / sub-tabs end offscreen once their
   keyframes are killed, but hide them explicitly so no frozen streak
   can linger at any viewport size. */
html.no-motion .obs-layer-card.layer-active::before,
html.no-motion .obs-layer-card.layer-active::after {
    display: none;
}

/* ── Landing phone mockup ──
   The scroll parallax tilts the phone from 65° (flat, its CSS starting
   pose) to upright as it scrolls into view. With animations off that
   never runs, so rest the phone in its finished, upright pose.
   !important so a stale inline transform from a pre-toggle scroll can't
   leave it mid-tilt. */
html.no-motion .landing-phone-mockup-img {
    transform: none !important;
}

/* ── Decorative ambient motion ──
   Frozen float/glow blobs are harmless, but pulse glows read better
   settled at their resting shadow. */
html.no-motion .animate-pulse-glow {
    animation: none !important;
}
