/* NINE CAP TCG — Radius, borders, shadows, motion */

:root {
  /* Corner radii — slightly soft, card-game card corners are rounded */
  --radius-xs:   4px;
  --radius-sm:   8px;
  --radius-md:   12px;
  --radius-lg:   16px;
  --radius-xl:   22px;
  --radius-2xl:  28px;
  --radius-pill: 999px;
  --radius-card: 14px; /* product/card surfaces */

  /* Borders */
  --border-width: 1px;
  --border-hair:  1px solid var(--border-subtle);
  --border-line:  1px solid var(--border-default);

  /* Shadows — warm, low-spread, dark-bg friendly. No bluish shadows. */
  --shadow-sm:  0 1px 2px rgba(0,0,0,0.4);
  --shadow-md:  0 6px 18px rgba(0,0,0,0.42);
  --shadow-lg:  0 18px 44px rgba(0,0,0,0.52);
  --shadow-xl:  0 32px 80px rgba(0,0,0,0.6);

  /* Glow — lavender accent (hover/active hero moments) */
  --glow-accent: 0 0 0 1px var(--accent-ring), 0 8px 30px rgba(218,189,219,0.22);
  --glow-rare:   0 0 0 1px rgba(227,178,102,0.5), 0 8px 30px rgba(227,178,102,0.22);

  /* Inner highlight for premium card tops */
  --inner-top: inset 0 1px 0 rgba(255,255,255,0.06); /* @kind shadow */

  /* Motion — snappy, slight overshoot for hype interactions */
  --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 */
  --ease-pop:    cubic-bezier(0.34, 1.56, 0.64, 1); /* @kind other */
  --dur-fast:   120ms; /* @kind other */
  --dur-base:   200ms; /* @kind other */
  --dur-slow:   340ms; /* @kind other */
}