/* IMA: Borders, radii, shadows, motion, glass (v2)
   Softer, rounder, spatial. Corners round up (pill CTAs, generous cards).
   Motion is intentional AND organic: spring/bounce allowed on micro-interactions
   and the living IMA symbol. Shadows are cool and low. */

:root {
  /* Radii: v2 rounder scale */
  --radius-none: 0;
  --radius-xs: 2px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-2xl: 24px;
  --radius-card: 22px;    /* app content cards (history, memory) */
  --radius-sheet: 30px;   /* bottom-sheet top corners */
  --radius-field: 20px;   /* pill glass fields */
  --radius-pill: 999px;
  --radius-blob: 42% 58% 62% 38% / 50% 44% 56% 50%; /* the magnet drop */

  /* Borders */
  --bw-hair: 1px;
  --bw-rule: 1.5px;
  --bw-bold: 2px;

  /* Shadows: cool, low */
  --shadow-xs: 0 1px 2px rgba(16, 19, 25, 0.06);
  --shadow-sm: 0 2px 8px rgba(16, 19, 25, 0.08);
  --shadow-md: 0 8px 24px rgba(16, 19, 25, 0.10);
  --shadow-lg: 0 20px 56px rgba(16, 19, 25, 0.16);
  --shadow-xl: 0 32px 80px rgba(16, 19, 25, 0.22);
  --shadow-focus: 0 0 0 3px color-mix(in srgb, var(--focus-ring) 30%, transparent);
  --shadow-brand: 0 10px 30px rgba(31, 33, 118, 0.28); /* under gradient CTAs */

  /* Lifted-glass shadows: soft, negative-spread (the floating-glass feel).
     Pair with --glass-hi for the liquid-glass rim light. */
  --shadow-glass-sm: 0 6px 16px -10px rgba(16, 19, 25, 0.40);
  --shadow-glass-md: 0 12px 28px -14px rgba(16, 19, 25, 0.50);
  --shadow-glass-lg: 0 18px 40px -16px rgba(16, 19, 25, 0.50);
  --shadow-glass-xl: 0 24px 50px -20px rgba(16, 19, 25, 0.55);

  /* Glass */
  --glass-blur: blur(24px) saturate(180%); /* @kind other */
  --glass-blur-md: blur(18px) saturate(180%); /* @kind other */
  --glass-blur-sm: blur(14px) saturate(160%); /* @kind other */
  --glass-hi: inset 0 1px 1px rgba(255, 255, 255, 0.90); /* @kind other */ /* liquid-glass top rim light */
  /* One-line recipes: box-shadow: var(--glass-elev-N). Border 1px var(--glass-line). */
  --glass-elev-1: inset 0 1px 1px rgba(255, 255, 255, 0.90), 0 6px 16px -10px rgba(16, 19, 25, 0.40); /* @kind other */
  --glass-elev-2: inset 0 1px 2px rgba(255, 255, 255, 0.95), 0 14px 30px -12px rgba(16, 19, 25, 0.50); /* @kind other */
  --glass-elev-3: inset 0 1px 2px rgba(255, 255, 255, 0.95), 0 24px 50px -20px rgba(16, 19, 25, 0.55); /* @kind other */

  /* Motion: intentional & organic. Spring allowed on micro-interactions. */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1); /* @kind other */ /* elements entering */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1); /* @kind other */ /* state transitions */
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1); /* @kind other */ /* micro-interactions, bounce */

  --dur-instant: 80ms; /* @kind other */ /* press, tap */
  --dur-fast: 160ms; /* @kind other */ /* hover, toggle */
  --dur-base: 280ms; /* @kind other */ /* components */
  --dur-slow: 480ms; /* @kind other */ /* modals, pages */
  --dur-very-slow: 700ms; /* @kind other */ /* onboarding, symbol */
}