:root {
  --bg: #0b1d1e;
  --surface: #163e44;
  --gold: #d6bd84;
  --jade: #5e8c7a;
  --text: #f4f0e8;
  --muted: #afa99c;

  --bg-deep: #061313;
  --surface-soft: rgba(22, 62, 68, 0.48);
  --surface-glass: rgba(244, 240, 232, 0.055);
  --line: rgba(244, 240, 232, 0.13);
  --line-gold: rgba(214, 189, 132, 0.28);
  --text-soft: rgba(244, 240, 232, 0.76);

  --font-sans: Inter, -apple-system, BlinkMacSystemFont, "SF Pro Display",
    "SF Pro Text", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei",
    "Noto Sans CJK SC", sans-serif;
  --font-serif: "Songti SC", "STSong", "Noto Serif CJK SC", serif;

  --space-1: 0.5rem;
  --space-2: 0.75rem;
  --space-3: 1rem;
  --space-4: 1.5rem;
  --space-5: 2rem;
  --space-6: 3rem;
  --space-7: 4.5rem;
  --space-8: 7rem;
  --space-9: 10rem;

  --radius-sm: 0.75rem;
  --radius-md: 1.25rem;
  --radius-lg: 2rem;
  --radius-pill: 999px;

  --page-gutter: clamp(1.25rem, 5vw, 5rem);
  --content-width: 80rem;
  --reading-width: 43rem;
  --header-height: 4.5rem;

  /* Experience 01-05 share one ultra-wide composition scale. */
  --experience-ultrawide-stage-max: 110rem;
  --experience-ultrawide-stage-gutter: 5rem;
  --experience-ultrawide-visual-max: 70rem;
  --experience-ultrawide-copy-max: 25rem;
  --experience-ultrawide-gap: 5rem;
  --experience-ultrawide-asset-max-height: 80svh;

  /* Site-wide visual scale */
  --type-hero: clamp(3.5rem, 7vw, 6.5rem);
  --type-section: clamp(2.5rem, 3.4vw, 3rem);
  --type-feature: clamp(1.375rem, 2vw, 1.75rem);
  --type-body: clamp(0.9375rem, 1.15vw, 1.125rem);
  --type-caption: clamp(0.8125rem, 0.9vw, 0.875rem);
  --line-body: 1.68;
  --section-space-normal: clamp(6rem, 10vw, 10rem);
  --section-space-cinematic: clamp(7rem, 12vw, 11rem);

  /* Philosophy 01-04 share one role-based scale and rhythm. */
  --philosophy-chapter-size: clamp(1.375rem, 1.8vw, 1.625rem);
  --philosophy-title-size: clamp(1.75rem, 2.4vw, 2.125rem);
  --philosophy-body-size: var(--type-body);
  --philosophy-quote-size: clamp(1.125rem, 1.5vw, 1.375rem);
  --philosophy-note-size: clamp(0.875rem, 1vw, 1rem);
  --philosophy-gap-chapter-title: clamp(2.25rem, 3vw, 2.75rem);
  --philosophy-gap-title-body: clamp(1.75rem, 2.4vw, 2.25rem);
  --philosophy-gap-body-quote: clamp(2.25rem, 3vw, 2.75rem);
  --philosophy-gap-quote-quote: clamp(2.25rem, 3vw, 3rem);
  --philosophy-gap-quote-note: clamp(0.875rem, 1.1vw, 1.125rem);

  --display-hero-size: var(--type-hero);
  --display-section-size: var(--type-section);
  --display-subsection-size: var(--type-feature);
  --display-chapter-size: var(--philosophy-chapter-size);
  --display-hero-line-height: 1.02;
  --display-section-line-height: 1.06;
  --display-subsection-line-height: 1.12;
  --display-letter-spacing: -0.035em;
  --display-hero-width: 13em;
  --display-section-width: 15em;
  --display-wide-width: 18em;
  --display-subsection-width: 22em;

  --ease-calm: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-soft: cubic-bezier(0.33, 1, 0.68, 1);
  --duration-fast: 600ms;
  --duration-base: 850ms;
  --duration-slow: 1200ms;
}

html[lang="en"] {
  --display-hero-line-height: 1.04;
  --display-section-line-height: 1.08;
  --display-subsection-line-height: 1.14;
  --display-letter-spacing: -0.038em;
  --display-hero-width: 24ch;
  --display-section-width: 26ch;
  --display-wide-width: 30ch;
  --display-subsection-width: 30ch;
}

html[lang="ja"] {
  --display-section-line-height: 1.09;
  --display-subsection-line-height: 1.15;
  --display-letter-spacing: -0.025em;
  --display-hero-width: 15em;
  --display-section-width: 17em;
  --display-wide-width: 19em;
  --display-subsection-width: 22em;
}

html[lang="ko"] {
  --display-hero-line-height: 1.08;
  --display-section-line-height: 1.1;
  --display-subsection-line-height: 1.16;
  --display-letter-spacing: -0.025em;
  --display-hero-width: 18em;
  --display-section-width: 19em;
  --display-wide-width: 22em;
  --display-subsection-width: 24em;
}
