/* tier0-exempt: claude-systemizer | dodam-food-system v1.0 2026-05-07 */
/* ============================================================
   Dodam Food System — Design Tokens
   위탁급식·아동급식·도시락배달 / 평택 모곡동 / HACCP 자율 인증
   Source: design-system/DESIGN.md v1.0
   ============================================================ */

:root {
  /* ---------- COLOR / Primary — Deep Natural Green ---------- */
  --color-primary-50:  oklch(0.972 0.018 145.00);
  --color-primary-100: oklch(0.945 0.034 145.00);
  --color-primary-200: oklch(0.890 0.062 145.00);
  --color-primary-300: oklch(0.815 0.090 145.00);
  --color-primary-400: oklch(0.715 0.115 145.00);
  --color-primary-500: oklch(0.620 0.135 145.00);
  --color-primary-600: oklch(0.550 0.135 145.00);
  --color-primary-700: oklch(0.475 0.120 145.00);
  --color-primary-800: oklch(0.395 0.100 145.00);
  --color-primary-900: oklch(0.310 0.075 145.00);
  --color-primary-950: oklch(0.220 0.050 145.00);

  /* ---------- COLOR / Neutral — Cool Slate ---------- */
  --color-neutral-50:  oklch(0.985 0.004 220.00);
  --color-neutral-100: oklch(0.965 0.006 220.00);
  --color-neutral-200: oklch(0.920 0.010 220.00);
  --color-neutral-300: oklch(0.855 0.014 220.00);
  --color-neutral-400: oklch(0.730 0.018 220.00);
  --color-neutral-500: oklch(0.595 0.020 220.00);
  --color-neutral-600: oklch(0.490 0.022 220.00);
  --color-neutral-700: oklch(0.395 0.020 220.00);
  --color-neutral-800: oklch(0.295 0.018 220.00);
  --color-neutral-900: oklch(0.205 0.014 220.00);
  --color-neutral-950: oklch(0.130 0.010 220.00);

  /* ---------- COLOR / Accent — Warm Cream ---------- */
  --color-accent-50:  oklch(0.985 0.012 75.00);
  --color-accent-100: oklch(0.960 0.024 75.00);
  --color-accent-200: oklch(0.910 0.045 75.00);
  --color-accent-300: oklch(0.840 0.072 75.00);
  --color-accent-400: oklch(0.760 0.095 75.00);
  --color-accent-500: oklch(0.680 0.110 75.00);
  --color-accent-600: oklch(0.595 0.105 75.00);
  --color-accent-700: oklch(0.500 0.090 75.00);
  --color-accent-800: oklch(0.400 0.072 75.00);
  --color-accent-900: oklch(0.305 0.052 75.00);
  --color-accent-950: oklch(0.215 0.034 75.00);

  /* ---------- COLOR / Semantic ---------- */
  --color-bg:              var(--color-neutral-50);
  --color-surface:         #ffffff;
  --color-surface-warm:    var(--color-accent-50);
  --color-text:            var(--color-neutral-900);
  --color-text-body:       var(--color-neutral-700);
  --color-text-meta:       var(--color-neutral-500);
  --color-text-on-primary: #ffffff;
  --color-brand:           var(--color-primary-600);
  --color-brand-strong:    var(--color-primary-700);
  --color-accent:          var(--color-accent-500);
  --color-accent-strong:   var(--color-accent-700);
  --color-divider:         var(--color-neutral-200);
  --color-border:          var(--color-neutral-300);
  --color-success:         var(--color-primary-600);
  --color-warning:         var(--color-accent-500);
  --color-error:           oklch(0.55 0.18 27);

  /* ---------- TYPOGRAPHY / Family ---------- */
  --font-sans: "Pretendard Variable", Pretendard, "Apple SD Gothic Neo", "Malgun Gothic",
               -apple-system, BlinkMacSystemFont, system-ui, "Segoe UI", "Noto Sans KR", sans-serif;
  --font-en:   "Inter", -apple-system, BlinkMacSystemFont, system-ui, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", "SF Mono", Consolas, "Pretendard Variable", Pretendard, "Apple SD Gothic Neo", "Malgun Gothic", ui-monospace, monospace;

  /* ---------- TYPOGRAPHY / Scale (ratio 1.25) ---------- */
  --text-xs:   0.72rem;     /* 11.5px */
  --text-sm:   0.875rem;    /* 14px */
  --text-base: 1rem;        /* 16px */
  --text-lg:   1.125rem;    /* 18px */
  --text-xl:   1.25rem;     /* 20px */
  --text-2xl:  1.5rem;      /* 24px */
  --text-3xl:  1.875rem;    /* 30px */
  --text-4xl:  2.375rem;    /* 38px */
  --text-5xl:  3rem;        /* 48px */
  --text-6xl:  3.75rem;     /* 60px */
  --text-7xl:  4.75rem;     /* 76px */

  /* ---------- TYPOGRAPHY / Line-height ---------- */
  --leading-tight:    1.1;
  --leading-snug:     1.25;
  --leading-normal:   1.45;
  --leading-relaxed:  1.6;
  --leading-loose:    1.8;

  /* ---------- TYPOGRAPHY / Weight ---------- */
  --font-light:      300;
  --font-regular:    400;
  --font-medium:     500;
  --font-semibold:   600;
  --font-bold:       700;
  --font-extrabold:  800;

  /* ---------- TYPOGRAPHY / Letter-spacing ---------- */
  --tracking-tight:   -0.025em;
  --tracking-snug:    -0.015em;
  --tracking-normal:  0;
  --tracking-wide:    0.01em;

  /* ---------- SPACING / 8pt grid ---------- */
  --space-0:   0;
  --space-1:   0.25rem;     /* 4 */
  --space-2:   0.5rem;      /* 8 */
  --space-3:   0.75rem;     /* 12 */
  --space-4:   1rem;        /* 16 */
  --space-5:   1.25rem;     /* 20 */
  --space-6:   1.5rem;      /* 24 */
  --space-8:   2rem;        /* 32 */
  --space-10:  2.5rem;      /* 40 */
  --space-12:  3rem;        /* 48 */
  --space-16:  4rem;        /* 64 */
  --space-20:  5rem;        /* 80 */
  --space-24:  6rem;        /* 96 */
  --space-32:  8rem;        /* 128 */
  --space-40:  10rem;       /* 160 */
  --space-48:  12rem;       /* 192 */

  /* ---------- LAYOUT ---------- */
  --container-max:    1200px;
  --deck-w:           1280px;
  --deck-h:           720px;
  --deck-pad:         var(--space-16); /* 64 inner pad */

  /* ---------- RADIUS ---------- */
  --radius-none: 0;
  --radius-xs:   2px;
  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   12px;
  --radius-xl:   16px;
  --radius-2xl:  24px;
  --radius-full: 9999px;

  /* ---------- SHADOW ---------- */
  --shadow-none: none;
  --shadow-xs:   0 1px 2px oklch(0.2 0 0 / 0.05);
  --shadow-sm:   0 2px 4px oklch(0.2 0 0 / 0.06), 0 1px 2px oklch(0.2 0 0 / 0.04);
  --shadow-md:   0 4px 8px oklch(0.2 0 0 / 0.08), 0 2px 4px oklch(0.2 0 0 / 0.04);
  --shadow-lg:   0 10px 16px oklch(0.2 0 0 / 0.10), 0 4px 6px oklch(0.2 0 0 / 0.05);
  --shadow-xl:   0 20px 28px oklch(0.2 0 0 / 0.12), 0 8px 10px oklch(0.2 0 0 / 0.06);

  /* ---------- MOTION ---------- */
  --duration-fast: 120ms;
  --duration-base: 200ms;
  --duration-slow: 320ms;
  --ease-standard:    cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out:         cubic-bezier(0, 0, 0.2, 1);
  --ease-in:          cubic-bezier(0.4, 0, 1, 1);
  --ease-emphasized:  cubic-bezier(0.2, 0, 0, 1);

  /* ---------- Z-INDEX ---------- */
  --z-base:    0;
  --z-card:    10;
  --z-overlay: 100;
  --z-modal:   500;
  --z-toast:   1000;
}

/* ---------- Tailwind v4 @theme block (for utility class generation) ---------- */
@theme {
  --color-brand-primary:   var(--color-primary-600);
  --color-brand-secondary: var(--color-primary-700);
  --color-brand-accent:    var(--color-accent-500);
  --font-family-sans:      var(--font-sans);
  --font-family-en:        var(--font-en);
  --font-family-mono:      var(--font-mono);
  --spacing-base:          var(--space-4);
  --radius-default:        var(--radius-md);
  --shadow-default:        var(--shadow-sm);
}

/* ---------- Base reset (minimal, deck-friendly) ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { font-size: 16px; }
body {
  margin: 0;
  font-family: var(--font-sans);
  font-size: var(--text-base);
  line-height: var(--leading-relaxed);
  color: var(--color-text-body);
  background: var(--color-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
h1, h2, h3, h4, h5, h6 {
  margin: 0;
  color: var(--color-text);
  font-weight: var(--font-bold);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-snug);
}
p { margin: 0; }
a { color: var(--color-brand); text-decoration: none; transition: color var(--duration-fast) var(--ease-standard); }
a:hover { color: var(--color-brand-strong); }
table { border-collapse: collapse; width: 100%; }
.tnum, .num { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
