/* ==========================================================================
   DriverLanding — Motion
   Canonical source. Requires tokens.css.

   D6B: one file, every animation. Shared primitives and the shimmer family
   are written out below; each app's set-pieces move in wholesale (see the
   MIGRATION QUEUE at the bottom) so there is exactly one namespace and
   @keyframes shine stops being defined in three files with two behaviors.
   ========================================================================== */

:root {
  /* Duration */
  --dur-fast: 150ms;      /* hover, focus, toggle */
  --dur-mid: 250ms;       /* dropdowns, tabs, inline expand */
  --dur-slow: 400ms;      /* modals, page-level transitions */

  /* Easing */
  --ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);      /* default for UI */
  --ease-in-out: cubic-bezier(0.65, 0.05, 0.36, 1);   /* things that return */
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);   /* confirmations only */

  /* ---- Shimmer family -----------------------------------------------------
     Two gradients, one keyframe, two speeds. Both gradients pass a white
     highlight through a brand color; the difference is which brand color,
     and that difference is meaningful:

       --shimmer-gold  headline emphasis. The gold-to-sky tail is the house
                       voice — it is the DriverLanding sweep.
       --shimmer-sky   the Blueprint wordmark, and nothing else. This is a
                       product mark, not a decoration. Do not apply it to
                       arbitrary text.

     Speed is a function of surface, not taste: text sweeps at 5s, non-text
     surfaces at 16s. An accent bar that sweeps as fast as a headline is a
     distraction on something people are reading — the Business-Card footer
     bar already got this right at 16s and that ratio is now the rule.
     -------------------------------------------------------------------- */
  --shimmer-gold: linear-gradient(90deg,
    var(--yellow-500) 0%,
    var(--yellow-500) 35%,
    #FFFFFF 45%,
    var(--yellow-500) 55%,
    var(--sky-500) 80%,
    var(--yellow-500) 100%);

  --shimmer-sky: linear-gradient(90deg,
    var(--sky-500) 0%,
    var(--sky-500) 40%,
    #FFFFFF 50%,
    var(--sky-500) 70%,
    var(--sky-500) 100%);

  --shimmer-dur-text: 5s;
  --shimmer-dur-surface: 16s;
}

/* --------------------------------------------------------------------------
   SHARED PRIMITIVES
   -------------------------------------------------------------------------- */

/* One direction, one name. Replaces @keyframes shimmer (Home, Business-Card),
   @keyframes shine (Home, Launchpad) and Blueprint's one-sided variant, which
   between them swept two different ways at the same 5s. Left-to-right wins:
   it is what .text-shimmer already does across five pages. */
@keyframes dl-shimmer {
  from { background-position: -200% center; }
  to   { background-position: 200% center; }
}

@keyframes dl-fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes dl-pulse {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0.55; }
}

@keyframes dl-spin {
  to { transform: rotate(360deg); }
}

/* --------------------------------------------------------------------------
   SHIMMER UTILITIES

   Structured fallback-first, which fixes two real bugs in the current code:

     1. .text-shimmer sets -webkit-text-fill-color: transparent but only
        -webkit-background-clip (no unprefixed property). Where the clip
        does not apply, transparent fill still does — invisible text. The
        @supports guard below means the transparent fill is never set unless
        the clip is actually supported.

     2. .logo-blueprint sits OUTSIDE Home's prefers-reduced-motion block, so
        it animates for users who asked it not to, while .text-shimmer 30
        lines above it respects the preference. Both respect it now.

   Base rule = readable solid color. The gradient treatment is layered on
   only when the browser can clip it AND the user has not asked for less
   motion, so every failure mode lands on legible text.
   -------------------------------------------------------------------------- */
.text-shimmer,
.logo-blueprint {
  font-weight: 700;
  display: inline-block;
}

.text-shimmer { color: var(--yellow-500); }
.logo-blueprint { color: var(--sky-500); }

@supports ((background-clip: text) or (-webkit-background-clip: text)) {
  @media (prefers-reduced-motion: no-preference) {
    .text-shimmer,
    .logo-blueprint {
      background-size: 200% auto;
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
      animation: dl-shimmer var(--shimmer-dur-text) linear infinite;
    }
    .text-shimmer  { background-image: var(--shimmer-gold); }
    .logo-blueprint { background-image: var(--shimmer-sky); }
  }
}

/* Non-text surfaces: the same gradient run across a bar or rule rather than
   clipped to glyphs. Used on the Business-Card footer bar. Slower on purpose. */
.surface-shimmer {
  background-image: var(--shimmer-gold);
  background-size: 200% auto;
}

@media (prefers-reduced-motion: no-preference) {
  .surface-shimmer {
    animation: dl-shimmer var(--shimmer-dur-surface) linear infinite;
  }
}

.surface-shimmer--sky { background-image: var(--shimmer-sky); }

/* --------------------------------------------------------------------------
   GLOBAL REDUCED-MOTION BACKSTOP
   Anything that slips through the guards above still stops here.
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* --------------------------------------------------------------------------
   MIGRATION QUEUE — D6B
   These are the remaining keyframes found in the three stylesheets. Moving
   them here is mechanical (copy the block, prefix the name with dl-, update
   the call sites) but it has NOT been done yet — they still live in their
   app stylesheets. Delete each line as it lands.

   From launchpad.css:
     banner-shimmer      -> folds into .surface-shimmer, likely deletable
     glisten             -> folds into dl-shimmer, likely deletable
     cand-spin, spin     -> both fold into dl-spin
     fadeIn              -> folds into dl-fade-in
     liveDotPulse, icon-pulse-glimmer, pulse-ring, commentJustAdded

   From Home style.css:
     shimmer, shine      -> replaced by dl-shimmer (done, remove from source)
     breathe, glowPulse, textPulse, dataTick
     dashFlow, orbitalRotate, rotateRadar   (starfield/hero set-pieces)

   From Blueprint index.css:
     shine               -> replaced by dl-shimmer (done, remove from source)
     gradient-shift
     coreRumble, fieldFlash, baseRotate3d           (launch sequence)
     actionExhaustZoom, actionZoomOff,
     originalExhaustSlide, originalLaunch           (launch sequence)
     flowDots, flowStatic, flowThick                (flow diagram)
   -------------------------------------------------------------------------- */
