/* ============================================================
   나눔글꼴 — Color tokens
   A warm, humanist palette. "나눔" (sharing) green anchors the
   system; warm paper + ink neutrals carry the editorial type
   specimens. Green heritage nods to the Naver Nanum project.
   ============================================================ */

:root {
  /* ---- Brand green scale (나눔 green) ---- */
  --green-50:  #e9f9f0;
  --green-100: #c8f0d9;
  --green-200: #93e2b4;
  --green-300: #57cf8b;
  --green-400: #1fbf69;
  --green-500: #03c75a; /* signature */
  --green-600: #02a64b;
  --green-700: #04823c;
  --green-800: #0a5f2e;
  --green-900: #0c3f21;

  /* ---- Warm neutral scale (ink + paper) ---- */
  --neutral-0:   #ffffff;
  --neutral-25:  #fbfaf7; /* paper */
  --neutral-50:  #f6f4ee;
  --neutral-100: #ece9e1;
  --neutral-200: #ddd9cd;
  --neutral-300: #c4bfb1;
  --neutral-400: #9b9587;
  --neutral-500: #726d61;
  --neutral-600: #514d44;
  --neutral-700: #393630;
  --neutral-800: #24221e;
  --neutral-900: #161512; /* ink */

  /* ---- Accent (warm clay, for highlights / proofs) ---- */
  --clay-100: #fbe6da;
  --clay-300: #f0a987;
  --clay-500: #d9663a;
  --clay-700: #a8492560;

  /* ---- Functional ---- */
  --red-500:    #d64545;
  --amber-500:  #d99b1f;
  --blue-500:   #2d6fdb;

  /* ============================================================
     Semantic aliases
     ============================================================ */

  /* Surfaces */
  --surface-page:    var(--neutral-25);
  --surface-card:    var(--neutral-0);
  --surface-sunken:  var(--neutral-50);
  --surface-inverse: var(--neutral-900);
  --surface-brand:   var(--green-500);
  --surface-brand-soft: var(--green-50);

  /* Text */
  --text-strong:   var(--neutral-900);
  --text-body:     var(--neutral-700);
  --text-muted:    var(--neutral-500);
  --text-faint:    var(--neutral-400);
  --text-inverse:  var(--neutral-25);
  --text-brand:    var(--green-700);
  --text-on-brand: var(--neutral-0);

  /* Lines & borders */
  --border-subtle: var(--neutral-200);
  --border-default: var(--neutral-300);
  --border-strong: var(--neutral-900);
  --border-brand:  var(--green-500);

  /* Interactive */
  --action-bg:        var(--green-500);
  --action-bg-hover:  var(--green-600);
  --action-bg-active: var(--green-700);
  --focus-ring:       var(--green-400);
}
