/**
 * CELLOGRAM Design System v4.0 — Global Reference Edition
 * Auto-generated by Style Dictionary. DO NOT EDIT BY HAND.
 *
 * Source of truth: packages/tokens/source/**/*.json
 * Rebuild:         pnpm --filter @cellogram/tokens build
 *
 * Scope auto-flip:
 *   :root                                                          → light (default)
 *   [data-slide-theme="dark"], .scene-dark                         → dark override
 *   [data-slide-theme="light"], .scene-light, .detail-light,       → light re-declared
 *     nav.nav-light                                                  (for nested-flip safety)
 *
 * Lang override:
 *   html[lang="en|ja|zh-Hans"]                                      → typography i18n
 *   (ko is :root default)
 */

:root {
  --mauve-50: #FBFAFA;
  --mauve-100: #F4F1F0;
  --mauve-200: #ECE7E5;
  --mauve-300: #E0D8D6;
  --mauve-400: #C4B5B7;
  --mauve-500: #947F82;
  --mauve-600: #6F5D60;
  --mauve-700: #4A4042;
  --mauve-800: #312729;
  --mauve-900: #0A0A09;
  --gray-50: #FAFAFA;
  --gray-100: #F4F4F4;
  --gray-200: #E5E5E5;
  --gray-300: #D4D4D4;
  --gray-400: #A3A3A3;
  --gray-500: #737373;
  --gray-600: #525252;
  --gray-700: #404040;
  --gray-800: #262626;
  --gray-900: #171717;
  --color-brand: #947F82;
  --color-brand-deep: #6F5D60;
  --color-brand-tint: rgba(148,127,130,0.08);
  --color-brand-light: #C4B5B7;
  --color-brand-glow: rgba(148,127,130,0.18);
  --surface-canvas: #FBFAFA;
  --surface-1: #F4F1F0;
  --surface-2: #ECE7E5;
  --surface-3: #E0D8D6;
  --surface-sunk: #D4CDC9;
  --surface-dark-0: #0A0A09;
  --surface-dark-1: #1A1718;
  --surface-dark-2: #261F21;
  --surface-dark-3: #312729;
  --text-primary: #1F1A1B;
  --text-secondary: #4A4042;
  --text-tertiary: #6B6263;
  --text-disabled: #9C9091;
  --text-inverse: #F5F0EE;
  --text-inverse-mid: rgba(245,240,238,0.85);
  --text-inverse-soft: rgba(245,240,238,0.6);
  --border-subtle: #EDE6E4;
  --border-default: #8E7E81;
  --border-strong: #6F5D60;
  --border-brand: var(--color-brand-light);
  --state-hover-background: rgba(148,127,130,0.08);
  --state-hover-shadow: 0 8px 24px rgba(148,127,130,0.18);
  --state-hover-transform: translateY(-1px);
  --state-active-transform: translateY(1px);
  --state-focus-shadow: 0 0 0 3px rgba(196,181,183,0.4);
  --state-focus-visible-shadow: 0 0 0 3px rgba(196,181,183,0.4);
  --state-focus-visible-outline: none;
  --state-disabled-opacity: 0.5;
  --state-disabled-cursor: not-allowed;
  --state-disabled-description: Common 6 — applies to Button + Input;
  --state-loading-cursor: progress;
  --state-loading-opacity: 0.7;
  --state-error-border: #C84A4A;
  --state-error-text: #C84A4A;
  --state-error-bg: rgba(200,74,74,0.05);
  --state-success-border: #4A8B6F;
  --state-success-text: #4A8B6F;
  --state-success-bg: rgba(74,139,111,0.05);
  --state-input-border-default: #8E7E81;
  --state-input-border-hover: #6F5D60;
  --state-input-border-focus: #947F82;
  --state-input-border-error: #C84A4A;
  --state-input-border-success: #4A8B6F;
  --state-input-bg-default: #FBFAFA;
  --state-input-bg-error: rgba(200,74,74,0.05);
  --state-input-bg-success: rgba(74,139,111,0.05);
  --state-input-label-error: #C84A4A;
  --state-input-label-success: #4A8B6F;
  --display: 'Outfit', 'Pretendard', sans-serif;
  --body: 'Outfit', 'Pretendard', sans-serif;
  --en: 'Outfit', sans-serif;
  --ko: 'Pretendard', 'Outfit', sans-serif;
  --fs-display: clamp(56px, 9vh, 172px);
  --fs-hero: var(--fs-display);
  --fs-h1: clamp(40px, 7vh, 128px);
  --fs-h2: clamp(32px, 5.5vh, 92px);
  --fs-h3: clamp(22px, 3.5vh, 52px);
  --fs-body-lg: clamp(20px, 2.04vh, 30px);
  --fs-body: clamp(16px, 1.67vh, 24px);
  --fs-sm: clamp(13px, 1.3vh, 20px);
  --fs-tag: clamp(12px, 1.2vh, 18px);
  --fs-quote: clamp(18px, 2.2vh, 28px);
  --lh-display: 1.05;
  --lh-tight: 1.1;
  --lh-heading: 1.25;
  --lh-body: 1.85;
  --lh-tight-body: 1.6;
  --lh-small: 1.5;
  --ls-display: -0.034em;
  --ls-heading: -0.022em;
  --ls-body: -0.011em;
  --ls-small: -0.005em;
  --ls-tight: -0.034em;
  --ls-normal: 0;
  --ls-loose: 0.02em;
  --ls-label: 0.18em;
  --fw-display: 200;
  --fw-h1: 300;
  --fw-h2: 400;
  --fw-h3: 500;
  --fw-body-lg: 400;
  --fw-body: 400;
  --fw-small: 500;
  --fw-tag: 600;
  --fw-strong: 700;
  --fw-display-strong: 800;
  --ko-tracking-display: -0.034em;
  --ko-tracking-heading: -0.022em;
  --ko-tracking-body: -0.011em;
  --ko-tracking-small: -0.005em;
  --typography-korean-font-weight-hero: 200;
  --typography-korean-font-weight-h1: 300;
  --typography-korean-font-weight-h2-h3: 500;
  --typography-korean-font-weight-body: 400;
  --typography-korean-font-weight-small: 500;
  --typography-korean-font-weight-tag-kicker: 600;
  --typography-korean-line-height-ko-hero: 1.05;
  --typography-korean-line-height-ko-heading: 1.25;
  --typography-korean-line-height-ko-body: 1.65;
  --typography-korean-line-height-ko-small: 1.5;
  --ls-tight: -0.034em;
  --ls-normal: -0.011em;
  --lh-body: 1.85;
  --lh-small: 1.5;
  --ls-body: -0.011em;
  --ls-small: -0.005em;
  --ease-slow-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-ease-in-out: ease-in-out;
  --duration-hover-micro: 0.18s;
  --duration-hover-default: 0.25s;
  --duration-hover-long: 0.3s;
  --duration-entry-fast: 0.6s;
  --duration-entry-default: 1.2s;
  --duration-breathe-loop: 7s;
  --duration-halo-pulse: 8s;
  --bp-phone-xs: 480px;
  --bp-phone-sm: 600px;
  --bp-phone-md: 640px;
  --bp-mobile: 768px;
  --bp-tablet-max: 1280px;
  --bp-container-2k-low: 2000px;
  --bp-fhd-to-2k: 2560px;
  --bp-twok-to-4k: 2800px;
  --bp-fourk: 3600px;
  --bp-fourk-min: 3840px;
  --bp-ultra: 4100px;
  --radius-none: 0;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-2xl: 24px;
  --radius-pill: 9999px;
  --shadow-sm: 0 1px 2px rgba(31,26,27,0.05);
  --shadow-md: 0 4px 12px rgba(31,26,27,0.08);
  --shadow-lg: 0 12px 32px rgba(31,26,27,0.12);
  --shadow-xl: 0 24px 64px rgba(31,26,27,0.16);
  --shadow-mauve: 0 8px 24px rgba(148,127,130,0.18);
  --shadow-focus: 0 0 0 3px rgba(196,181,183,0.4);
  --space-0: 0;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-14: 56px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;
  --space-30: 120px;
  --space-40: 160px;
  --slide-pad-y: clamp(48px, 6vh, 120px);
  --slide-pad-x: clamp(32px, 4vw, 140px);
  --slide-gap-lg: clamp(24px, 3vh, 56px);
  --slide-gap-md: clamp(16px, 2vh, 32px);
  --slide-gap-sm: clamp(8px, 1vh, 16px);
  --z-base: 0;
  --z-raised: 10;
  --z-dropdown: 1000;
  --z-modal: 2000;
  --z-toast: 3000;
}

[data-slide-theme="dark"], .scene-dark {
  --surface-1: #1A1718;
  --surface-2: #261F21;
  --surface-3: #312729;
  --surface-canvas: #0A0A09;
  --text-primary: #F5F0EE;
  --text-secondary: rgba(245,240,238,0.85);
  --text-tertiary: rgba(245,240,238,0.6);
  --border-subtle: rgba(245,240,238,0.06);
  --border-default: rgba(245,240,238,0.12);
  --border-strong: rgba(245,240,238,0.24);
}

[data-slide-theme="light"], .scene-light, .detail-light, nav.nav-light {
  --color-brand: #947F82;
  --color-brand-deep: #6F5D60;
  --color-brand-tint: rgba(148,127,130,0.08);
  --color-brand-light: #C4B5B7;
  --color-brand-glow: rgba(148,127,130,0.18);
  --surface-canvas: #FBFAFA;
  --surface-1: #F4F1F0;
  --surface-2: #ECE7E5;
  --surface-3: #E0D8D6;
  --surface-sunk: #D4CDC9;
  --surface-dark-0: #0A0A09;
  --surface-dark-1: #1A1718;
  --surface-dark-2: #261F21;
  --surface-dark-3: #312729;
  --text-primary: #1F1A1B;
  --text-secondary: #4A4042;
  --text-tertiary: #6B6263;
  --text-disabled: #9C9091;
  --text-inverse: #F5F0EE;
  --text-inverse-mid: rgba(245,240,238,0.85);
  --text-inverse-soft: rgba(245,240,238,0.6);
  --border-subtle: #EDE6E4;
  --border-default: #8E7E81;
  --border-strong: #6F5D60;
  --border-brand: var(--color-brand-light);
}

html[lang="en"] {
  --lh-body: 1.7;
  --lh-small: 1.5;
  --ls-body: 0;
  --ls-small: 0;
}

html[lang="ja"] {
  --ff-body: 'Noto Sans JP', 'Outfit', sans-serif;
  --lh-body: 2;
  --lh-small: 1.6;
  --ls-body: 0.02em;
  --ls-small: 0.02em;
}

html[lang="zh-Hans"] {
  --ff-body: 'Noto Sans SC', 'Outfit', sans-serif;
  --lh-body: 1.85;
  --lh-small: 1.5;
  --ls-body: 0;
  --ls-small: 0;
}

/* Bundle stats:
 *   :root           190 tokens
 *   .scene-dark     10 tokens
 *   .scene-light    25 tokens (re-declared)
 *   html[lang=en     ] 4 tokens
 *   html[lang=ja     ] 5 tokens
 *   html[lang=zh-Hans] 5 tokens
 */
