/* ================================================
   WORFLOGY — Design System Tokens (eduContextOn)
   ================================================ */

/* ── Fonts ── */
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@400;600;700;900&family=DM+Serif+Display:ital@0;1&family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;1,9..40,400&family=Outfit:wght@400;600;800&display=swap');
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable.min.css');

/* ── Tokens ── */
:root {
  /* Core Palette */
  --ink:         #1A1F36;   /* Ink Navy – 깊은 사유, 주요 배경/텍스트 */
  --coral:       #E8613A;   /* Living Coral – 소통, 포인트 */
  --coral-light: #FDF0EC;   /* Coral tint */
  --sand:        #F5F0E8;   /* Warm Sand – 아날로그 감성 배경 */
  --sand-dark:   #EDE7DA;   /* Sand 구분선 */

  /* Text */
  --text:        #1C1C1E;   /* Deep Charcoal */
  --text-muted:  #6B7280;   /* Stone Gray */
  --text-light:  #9CA3AF;

  /* Surface */
  --bg:          #FAFAF8;   /* Off-White */
  --surface:     #FFFFFF;
  --surface-sand: var(--sand);

  /* Border */
  --border:      rgba(26, 31, 54, 0.10);
  --border-sand: var(--sand-dark);

  /* Aliases (기존 코드 호환) */
  --primary:       var(--ink);
  --primary-hover: #252B47;
  --primary-light: var(--sand);
  --accent:        var(--coral);
  --accent-light:  var(--coral-light);

  /* Glass (하위 호환용, 실질 사용 최소화) */
  --glass-bg:     rgba(255,255,255,0.85);
  --glass-border: var(--border);

  /* Layout */
  --sidebar-w: 240px;

  /* Radius */
  --r-xs: 3px;
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 18px;

  /* Shadow – Depth Card 시스템 */
  --shadow-sm: 0 1px 3px rgba(26,31,54,0.06), 0 1px 2px rgba(26,31,54,0.04);
  --shadow-md: 0 4px 16px rgba(26,31,54,0.10), 0 2px 6px rgba(26,31,54,0.06);
  --shadow-lg: 0 12px 40px rgba(26,31,54,0.12), 0 4px 12px rgba(26,31,54,0.08);
  --shadow-coral: 0 8px 32px rgba(232,97,58,0.18);

  /* Typography Family & Motion */
  --font-serif-ko: 'Noto Serif KR', 'Pretendard Variable', serif;
  --font-serif-en: 'DM Serif Display', serif;
  --font-sans-en:  'Outfit', 'DM Sans', 'Pretendard Variable', -apple-system, sans-serif;
  --font-body:     'Pretendard Variable', 'DM Sans', -apple-system, sans-serif;
  --t: 0.22s ease;
  --t-slow: 0.38s ease;

  /* Typography Scale - Desktop (Default) */
  --fs-h1: 60px;
  --lh-h1: 1.2;
  --ls-h1: -2px;
  --fw-h1: 700;

  --fs-h2: 42px;
  --lh-h2: 1.3;
  --ls-h2: -0.5px;
  --fw-h2: 700;

  --fs-h3: 38px;
  --lh-h3: 1.3;
  --ls-h3: -1px;
  --fw-h3: 700;

  --fs-h4: 16px;
  --lh-h4: 1.4;
  --ls-h4: -0.3px;
  --fw-h4: 600;

  --fs-body: 16px;
  --lh-body: 1.65;
  --ls-body: normal;
  --fw-body: 400;

  --fs-body-sub: 17px;
  --lh-body-sub: 1.85;
  --ls-body-sub: normal;
  --fw-body-sub: 400;

  --fs-body-min: 13px;
  --lh-body-min: 1.7;
  --ls-body-min: normal;
  --fw-body-min: 400;

  --fs-label: 12px;
  --lh-label: 1.35;
  --ls-label: 0.5px;
  --fw-label: 400;

  --fs-ui: 14.5px;
  --lh-ui: normal;
  --ls-ui: 0.2px;
  --fw-ui: 600;

  /* Additional components typography */
  --fs-badge: 11.5px;
  --fs-feat-num: 32px;
}