:root {
  /* Corner radii */
  --radius-card: 16px;
  --radius-input: 10px;
  --radius-button: 10px;
  --radius-pill: 999px;

  /* Soft, warm, low-opacity shadows (brown-based, never black) */
  --shadow-input: 0 1px 2px rgba(74, 58, 34, 0.06);
  --shadow-card: 0 6px 20px rgba(90, 68, 34, 0.10), 0 1px 3px rgba(90, 68, 34, 0.06);
  --shadow-card-hover: 0 12px 32px rgba(90, 68, 34, 0.14), 0 2px 6px rgba(90, 68, 34, 0.08);
  --shadow-pop: 0 16px 44px rgba(74, 58, 34, 0.18);

  /* Focus ring — teal, calm */
  --ring-accent: 0 0 0 3px rgba(14, 122, 108, 0.22);

  /* Motion */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1); /* @kind other */
  --dur-fast: 120ms; /* @kind other */
  --dur-base: 200ms; /* @kind other */
  --dur-slow: 320ms; /* @kind other */

  /* Paper grain — subtle tactile noise, apply as overlay at ~4% */
  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E"); /* @kind other */
}