/* ============================================================
   4 You Design — Effects Tokens
   ============================================================ */

:root {
  /* ── Border Radius ── */
  --radius-none:  0px;
  --radius-sm:    4px;
  --radius-md:    8px;
  --radius-lg:    12px;
  --radius-xl:    16px;
  --radius-2xl:   24px;
  --radius-3xl:   32px;
  --radius-full:  9999px;

  /* ── Box Shadows ── */
  --shadow-xs:    0 1px 2px 0 rgba(17,24,39,.05);
  --shadow-sm:    0 1px 3px 0 rgba(17,24,39,.10), 0 1px 2px -1px rgba(17,24,39,.10);
  --shadow-md:    0 4px 6px -1px rgba(17,24,39,.10), 0 2px 4px -2px rgba(17,24,39,.10);
  --shadow-lg:    0 10px 15px -3px rgba(17,24,39,.10), 0 4px 6px -4px rgba(17,24,39,.10);
  --shadow-xl:    0 20px 25px -5px rgba(17,24,39,.10), 0 8px 10px -6px rgba(17,24,39,.10);
  --shadow-2xl:   0 25px 50px -12px rgba(17,24,39,.25);

  /* Brand-tinted shadows */
  --shadow-brand:  0 8px 24px -4px rgba(27,36,112,.28);
  --shadow-accent: 0 8px 24px -4px rgba(239,82,21,.28);
  --shadow-inner:  inset 0 2px 4px 0 rgba(17,24,39,.06);

  /* ── Transitions ── */
  --transition-fast:   all 0.15s ease; /* @kind other */
  --transition-base:   all 0.25s ease; /* @kind other */
  --transition-slow:   all 0.40s ease; /* @kind other */
  --transition-bounce: all 0.35s cubic-bezier(0.34,1.56,0.64,1); /* @kind other */

  /* ── Z-Index ── */
  --z-below:    -1; /* @kind other */
  --z-base:      0; /* @kind other */
  --z-raised:    1; /* @kind other */
  --z-dropdown: 100; /* @kind other */
  --z-sticky:   200; /* @kind other */
  --z-overlay:  300; /* @kind other */
  --z-modal:    400; /* @kind other */
  --z-toast:    500; /* @kind other */
}