/* ===== Green Accent Design System — tokens ===== */
:root {
  /* Neutral base */
  --bg:           #f5f7fa;   /* page background (light grey)  */
  --card:         #ffffff;   /* card / panel surface (white)  */
  --surface:      #f8fafb;   /* subtle grey surface           */
  --border:       #e5e7eb;   /* neutral grey border           */

  /* Green accent */
  --accent:       #22c55e;   /* primary CTA      (green-500)  */
  --accent-hover: #16a34a;   /* CTA hover        (green-600)  */
  --accent-light: #dcfce7;   /* light green tint (green-100)  */

  /* Text */
  --text:         #111827;   /* body text (near-black)        */
  --muted:        #6b7280;   /* secondary text (grey)         */
  --link:         #16a34a;   /* link color (green)            */

  /* Semantic */
  --error:        #dc2626;
  --error-bg:     #fee2e2;

  /* Shadow (neutral) */
  --shadow:       0 4px 12px rgba(0, 0, 0, 0.08);
  --shadow-sm:    0 1px 4px  rgba(0, 0, 0, 0.05);
  --shadow-lg:    0 8px 24px rgba(0, 0, 0, 0.12);

  /* Border radius */
  --radius:       12px;
  --radius-sm:    6px;
  --radius-lg:    16px;
  --radius-pill:  9999px;

  /* Typography */
  --font:         system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans JP", sans-serif;
  --font-mono:    ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}