/* ============================================================
   Taste Skill — Elevation
   Shadows are ultra-diffuse, warm-tinted (never pure black),
   and low opacity (< 0.12). Elevation communicates real
   hierarchy only. The inner "highlight" + inset ring give
   double-bezel cards their machined, tactile edge.
   Shadow hue = warm ink rgba(46, 38, 26, a).
   ============================================================ */
:root {
  --shadow-xs:
    0 1px 2px rgba(46, 38, 26, 0.05);
  --shadow-sm:
    0 1px 2px rgba(46, 38, 26, 0.04),
    0 2px 6px rgba(46, 38, 26, 0.05);
  --shadow-md:
    0 2px 6px rgba(46, 38, 26, 0.05),
    0 8px 24px rgba(46, 38, 26, 0.07);
  --shadow-lg:
    0 6px 16px rgba(46, 38, 26, 0.06),
    0 22px 54px rgba(46, 38, 26, 0.10);
  --shadow-xl:
    0 12px 28px rgba(46, 38, 26, 0.08),
    0 36px 90px rgba(46, 38, 26, 0.12);

  /* Tactile edge detail */
  --highlight-top: inset 0 1px 0 rgba(255, 255, 255, 0.7); /* @kind shadow */
  --ring-inset: inset 0 0 0 1px rgba(23, 19, 14, 0.06); /* @kind shadow */
  --ring-inset-strong: inset 0 0 0 1px rgba(23, 19, 14, 0.12); /* @kind shadow */

  /* Focus */
  --shadow-focus: 0 0 0 3px var(--focus-halo);
}

[data-theme="dark"] {
  --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4), 0 2px 6px rgba(0, 0, 0, 0.35);
  --shadow-md: 0 2px 6px rgba(0, 0, 0, 0.4), 0 8px 24px rgba(0, 0, 0, 0.5);
  --shadow-lg: 0 6px 16px rgba(0, 0, 0, 0.45), 0 22px 54px rgba(0, 0, 0, 0.6);
  --shadow-xl: 0 12px 28px rgba(0, 0, 0, 0.5), 0 36px 90px rgba(0, 0, 0, 0.65);
  --highlight-top: inset 0 1px 0 rgba(255, 255, 255, 0.06); /* @kind shadow */
  --ring-inset: inset 0 0 0 1px rgba(244, 240, 232, 0.05);
  --ring-inset-strong: inset 0 0 0 1px rgba(244, 240, 232, 0.10);
}