/* generated from design-system/project/tokens.json */
:root, [data-theme="noir"] {
  --surface: #0c0b0a;
  --surface-raised: #15130f;
  --surface-sunken: #070605;
  --blush: #221b17;
  --line: #cab27f2e;
  --line-strong: #cab27f66;
  --ink: #f3ede1;
  --ink-muted: #b3a893;
  --ink-faint: #8c8373;
  --accent-ink: #d9c18e;
  --gold: #cab27f;
  --gold-bright: #e5be7d;
  --gold-deep: #967d4f;
  --charcoal: #595a56;
  --action: #cab27f;
  --on-action: #0c0b0a;
  --action-hover: #e2ca93;
  --focus: #e5be7d;
  --scrim: #0c0b0ab3;
  --shadow-glow: 0 0 80px #cab27f29;
  --shadow-lift: 0 40px 80px -40px #000000e6;
  --focus-ring: 0 0 0 2px #0c0b0a, 0 0 0 4px #e5be7d;
}
[data-theme="ivory"] {
  --surface: #f8f3e8;
  --surface-raised: #fffcf5;
  --surface-sunken: #efe7d7;
  --blush: #e7dad0;
  --line: #16130f1f;
  --line-strong: #16130f47;
  --ink: #16130f;
  --ink-muted: #5c5345;
  --ink-faint: #6b6152;
  --accent-ink: #7a5c2c;
  --gold: #cab27f;
  --gold-bright: #d9b36f;
  --gold-deep: #8a6f40;
  --action: #16130f;
  --on-action: #f8f3e8;
  --action-hover: #2c2721;
  --focus: #16130f;
  --shadow-glow: 0 24px 60px -24px #8a6f4059;
  --shadow-lift: 0 40px 80px -40px #16130f59;
  --focus-ring: 0 0 0 2px #f8f3e8, 0 0 0 4px #16130f;
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 144px;
  --space-11: 200px;
  --radius-none: 0px;
  --radius-hair: 2px;
  --radius-arch: 999px;
  --radius-full: 9999px;
  --ease-bloom: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-silk: cubic-bezier(0.65, 0, 0.35, 1);
  --duration-quick: 240ms;
  --duration-calm: 700ms;
  --duration-bloom: 1400ms;
  --font-display: "Cormorant Garamond", "Noto Serif KR", serif;
  --font-serif: "Noto Serif KR", "Cormorant Garamond", serif;
  --font-sans: Jost, "Noto Sans KR", system-ui, sans-serif;
  --font-body: "Noto Sans KR", Jost, system-ui, sans-serif;
}
.display-xl { font-family: var(--font-display); font-size: 112px; line-height: 0.92; font-weight: 300; letter-spacing: -0.015em; }
.display-l { font-family: var(--font-display); font-size: 76px; line-height: 0.98; font-weight: 300; letter-spacing: -0.01em; }
.display-m { font-family: var(--font-display); font-size: 44px; line-height: 1.1; font-weight: 300; font-style: italic; }
.numeral { font-family: var(--font-display); font-size: 56px; line-height: 1; font-weight: 300; font-style: italic; }
.latin-accent { font-family: var(--font-display); font-size: 22px; line-height: 1.35; font-weight: 400; font-style: italic; }
.headline-l { font-family: var(--font-serif); font-size: 54px; line-height: 1.3; font-weight: 300; letter-spacing: -0.03em; }
.headline-m { font-family: var(--font-serif); font-size: 38px; line-height: 1.4; font-weight: 300; letter-spacing: -0.02em; }
.title { font-family: var(--font-serif); font-size: 25px; line-height: 1.5; font-weight: 400; letter-spacing: -0.01em; }
.lead { font-family: var(--font-body); font-size: 18px; line-height: 1.95; font-weight: 300; }
.body-copy { font-family: var(--font-body); font-size: 16px; line-height: 1.85; font-weight: 400; }
.body-small { font-family: var(--font-body); font-size: 14px; line-height: 1.8; font-weight: 400; }
.caption { font-family: var(--font-body); font-size: 12.5px; line-height: 1.6; font-weight: 400; letter-spacing: 0.02em; }
.eyebrow { font-family: var(--font-sans); font-size: 11.5px; line-height: 1.4; font-weight: 500; letter-spacing: 0.32em; }
.button-label { font-family: var(--font-sans); font-size: 12px; line-height: 1; font-weight: 500; letter-spacing: 0.22em; }
.nav-label { font-family: var(--font-sans); font-size: 12.5px; line-height: 1; font-weight: 400; letter-spacing: 0.2em; }
