/* ============================================================
   Superhairpieces — Elevation
   Soft, low-contrast layered shadows (cool ink tint).
   Light comes from above.
   ============================================================ */

:root {
  /* Resting / raised surface — cards, dropdowns */
  --shadow-sm:
    0px 2px 4px -2px rgba(21, 24, 40, 0.08),
    0px 4px 8px -2px rgba(21, 24, 40, 0.04);

  /* Overlay — modals, popovers, floating panels */
  --shadow-lg:
    0px 8px 8px -4px rgba(21, 24, 40, 0.04),
    0px 20px 24px -4px rgba(21, 24, 40, 0.08);

  /* Button — gentle ambient halo + drop */
  --shadow-button:
    0px 0px 6.5px 4px rgba(0, 0, 0, 0.07),
    0px 4px 8px -2px rgba(0, 0, 0, 0.04);

  /* Focus ring (brand) */
  --focus-ring:        0 0 0 4px rgba(43, 43, 43, 0.16);
  --focus-ring-error:  0 0 0 4px rgba(199, 58, 58, 0.18);
  --focus-ring-info:   0 0 0 4px rgba(26, 116, 168, 0.18);

  /* Motion */
  --ease-standard: cubic-bezier(0.2, 0, 0, 1); /* @kind other */
  --ease-emphasis: cubic-bezier(0.3, 0, 0, 1); /* @kind other */
  --duration-fast: 120ms; /* @kind other */
  --duration-base: 200ms; /* @kind other */
}