/* ============================================================
   Yieldz — Shadows, glows, motion, blur
   Dark UI → shadows are deep + soft; elevation also uses a subtle
   top hairline of light. The brand glow is reserved for the accent.
   ============================================================ */

:root {
  /* Shadows (for dark surfaces) */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 6px 20px rgba(0, 0, 0, 0.45);
  --shadow-lg: 0 18px 48px rgba(0, 0, 0, 0.55);
  --shadow-card: 0 2px 4px rgba(0, 0, 0, 0.3), 0 12px 32px rgba(0, 0, 0, 0.4);

  /* Brand glow — hover on primary, focus rings, active tokens */
  --glow-brand: 0 0 0 1px var(--brand-500), 0 8px 28px var(--brand-glow);
  --glow-soft: 0 0 24px var(--brand-glow);

  /* Inset hairline of light on top edge of raised surfaces */
  --edge-light: inset 0 1px 0 rgba(255, 255, 255, 0.04); /* @kind shadow */

  /* Focus ring */
  --ring: 0 0 0 3px rgba(138, 212, 232, 0.35);

  /* Blur (glass panels / overlays) */
  --blur-sm: blur(8px);   /* @kind other */
  --blur-md: blur(16px);  /* @kind other */
  --blur-lg: blur(28px);  /* @kind other */

  /* Motion — calm, trustworthy; short eases, no bounce on UI */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);   /* @kind other */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1); /* @kind other */
  --dur-fast: 120ms;  /* @kind other */
  --dur-base: 200ms;  /* @kind other */
  --dur-slow: 360ms;  /* @kind other */
  --transition-base: all var(--dur-base) var(--ease-out);
}