/* 새로디 디자인 토큰 — 새로디_비주얼아이덴티티.md 기반
 * 코럴 #FF6A3D · 잉크 네이비 #1E2A44 · 소프트 앰버 #FFC46B · 아이보리 #FAF7F2
 */
:root {
  /* ── 색 ─────────────────────────────────────── */
  --color-paper:       oklch(97.3% 0.008 80);   /* 아이보리 배경 */
  --color-paper-2:     oklch(94.8% 0.012 80);   /* 한 단계 올라간 면 */
  --color-paper-3:     oklch(92% 0.015 80);     /* 두 단계 (태그·칩) */
  --color-ink:         oklch(27% 0.055 262);    /* 잉크 네이비 — 본문·헤딩 */
  --color-ink-2:       oklch(38% 0.045 262);    /* 보조 텍스트 */
  --color-muted:       oklch(48% 0.03 262);     /* 흐린 텍스트 */
  --color-rule:        oklch(86% 0.015 80);     /* 구분선 */
  --color-rule-2:      oklch(90.5% 0.012 80);   /* 옅은 구분선 */
  --color-accent:      oklch(69% 0.19 35);      /* 새로디 코럴 */
  --color-accent-deep: oklch(62% 0.185 35);     /* 코럴 호버 · 큰 글자용 */
  --color-accent-text: oklch(50% 0.17 35);      /* 코럴 텍스트 — 작은 글자 대비 4.5:1 이상 */
  --color-accent-soft: oklch(85% 0.1 75);       /* 소프트 앰버 — ::selection 등 잔여 */
  --color-accent-ink:  oklch(97.3% 0.008 80);   /* 코럴(주황) 버튼 위 텍스트 = 아이보리 (브랜드 규칙) */
  --color-focus:       oklch(58% 0.2 35);       /* 포커스 링 */

  /* ── 딥씨(심해) 존 — 하단부 반전 ────────────── */
  --color-deep:        oklch(21% 0.05 262);     /* 심해 네이비 — 딥씨 존 배경(풀블리드) */
  --color-deep-2:      oklch(26% 0.055 262);    /* 딥씨 위 한 단계 밝은 면(카드) */
  --color-teal:        oklch(58% 0.06 220);     /* 바다 청록 #2E7D8C — 물결·저채도 서브 */
  /* 딥씨 위 텍스트 (아이보리 반전) */
  --color-on-deep:     color-mix(in oklch, var(--color-paper) 90%, var(--color-ink));
  --color-on-deep-2:   color-mix(in oklch, var(--color-paper) 72%, var(--color-ink));  /* 보조 */
  --color-on-deep-3:   color-mix(in oklch, var(--color-paper) 55%, var(--color-ink));  /* 흐린 */
  --color-deep-rule:   color-mix(in oklch, var(--color-paper) 22%, transparent);       /* 딥씨 구분선 */

  /* ── 글꼴 ───────────────────────────────────── */
  /* 브랜드 지침: Pretendard 하나로 통일, 굵기 대비로 위계 (세리프 금지) */
  --font-display: "Pretendard Variable", Pretendard, "Apple SD Gothic Neo", sans-serif;
  --font-body:    "Pretendard Variable", Pretendard, "Apple SD Gothic Neo", sans-serif;

  /* ── 타입 스케일 (1.25 장3도) ───────────────── */
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-md:   1.25rem;
  --text-lg:   1.5625rem;
  --text-xl:   1.9531rem;
  --text-2xl:  2.4414rem;
  --text-display:   clamp(2.3rem, 4.2vw + 1rem, 4.5rem);
  --text-display-s: clamp(1.85rem, 2.8vw + 0.9rem, 3rem);

  /* ── 간격 (4pt) ─────────────────────────────── */
  --space-2xs: 0.25rem;
  --space-xs:  0.5rem;
  --space-sm:  0.75rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2.5rem;
  --space-2xl: 4rem;
  --space-3xl: 6rem;
  --space-4xl: 9rem;
  --space-section: clamp(5rem, 10vw, 8.5rem);   /* 편집형 섹션 상하 여백 */

  /* ── 모서리·선 ──────────────────────────────── */
  --radius-sm: 8px;
  --radius-md: 12px;       /* playful 상한 */
  --radius-pill: 999px;
  --rule-hair: 1px;
  --shadow-pill: 0 8px 24px -14px oklch(27% 0.055 262 / 0.20);

  /* ── 글래스(진주 표면) ──────────────────────── */
  --blur-glass: 10px;
  --color-glass-surface: color-mix(in oklch, var(--color-paper) 90%, transparent);
  --shadow-glass: 0 24px 48px -28px oklch(27% 0.055 262 / 0.28),
                  0 2px 8px -2px oklch(27% 0.055 262 / 0.07);

  /* ── 모션 ───────────────────────────────────── */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:     cubic-bezier(0.7, 0, 0.84, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-micro: 120ms;
  --dur-short: 220ms;
  --dur-long:  420ms;

  /* ── z 레벨 ─────────────────────────────────── */
  --z-base: 1;
  --z-raised: 10;
  --z-sticky: 200;
}