/* Trailway Growth — Effects
   Corners are barely rounded (2–4px) — engineered, not soft.
   Shadows are rare and low; this thing doesn't glow.
   Two signature devices: the curved slant cut and the straight grid. */

:root {
  /* ---- Corner radii ---- */
  --radius-sm:  2px;   /* chips, small fields, image corners */
  --radius:     3px;   /* the default — buttons, cards, inputs, panels */
  --radius-lg:  4px;   /* raised cards, dialogs */
  --radius-full: 999px;

  /* ---- Borders ---- */
  --border-w-hair:  1px;    /* card hairlines */
  --border-w-field: 1.5px;  /* inputs, outline buttons */
  --accent-bar:     4px;    /* card left-edge accent */

  /* ---- Shadows (sparse, soft, cool stone) ---- */
  --shadow-none: none;
  --shadow-card: 0 1px 2px rgba(58, 76, 69, .06);
  --shadow-raised: 0 4px 30px rgba(58, 76, 69, .12);  /* floating panels, dialogs */
  --ring-focus:  0 0 0 3px rgba(70, 117, 111, .12);   /* focused field halo */

  /* ---- Motion ---- */
  --ease: cubic-bezier(.4, 0, .2, 1); /* @kind other */
  --dur-fast: 120ms; /* @kind other */
  --dur:      180ms; /* @kind other */
  --dur-slow: 280ms; /* @kind other */

  /* ---- The straight grid (paint over moss/dark imagery) ---- */
  --grid-line: var(--tw-bone-16);
  --grid-overlay-default:
    repeating-linear-gradient(0deg,  transparent 0, transparent 47px, var(--tw-bone-16) 47px, var(--tw-bone-16) 48px),
    repeating-linear-gradient(90deg, transparent 0, transparent 47px, var(--tw-bone-16) 47px, var(--tw-bone-16) 48px);
}