/* ==========================================================================
   SHAPE & ELEVATION TOKENS — Tendy 田地故事
   Radii: pills for interactive, soft rounding for surfaces.
   Borders: three tokenised weights so hairlines never drift.
   Shadows: green-tinted, always soft, layered — never a hard grey drop.
   ========================================================================== */
:root{
  /* ---- Radius ---- */
  --r-tag: 8px;       /* small square-ish tags */
  --r-input: 12px;    /* inputs, selects */
  --r-card: 16px;     /* cards, large inputs */
  --r-card-lg: 24px;  /* hero media, promo panels */
  --r-pill: 999px;    /* buttons, chips, badges */

  /* ---- Border weights ---- */
  --bw-hair: 1px;     /* card hairlines, dividers */
  --bw: 1.5px;        /* inputs, chips, outline buttons */
  --bw-2: 2px;        /* focus rings, emphasis */

  /* ---- Elevation (green-tinted, two-layer for depth) ---- */
  --shadow-sm: 0 1px 2px rgba(31,61,43,.06), 0 1px 3px rgba(31,61,43,.05);
  --shadow-md: 0 2px 6px rgba(31,61,43,.05), 0 10px 24px -6px rgba(31,61,43,.14);
  --shadow-lg: 0 4px 10px rgba(31,61,43,.06), 0 24px 52px -12px rgba(31,61,43,.20);

  /* ---- Focus ring (used by every interactive component) ---- */
  --ring-w: 2.5px;
  --ring-offset: 2px;
}