:root {
  --color-ink: #111318;
  --color-ink-soft: #343840;
  --color-muted: #6f7580;
  --color-primary: #ffb31a;
  --color-primary-strong: #f28a00;
  --color-primary-soft: #fff0c8;
  --color-blue: #53b9df;
  --color-blue-soft: #eaf8fc;
  --color-surface: #ffffff;
  --color-cream: #fff9ef;
  --color-cream-deep: #f8eddc;
  --color-navy: #122033;
  --color-line: #e8e3d9;
  --color-line-strong: #d7d0c3;

  /* Existing-name compatibility during the staged redesign. */
  --color-text-primary: var(--color-ink);
  --color-text-secondary: var(--color-muted);
  --color-background: var(--color-surface);
  --color-secondary: var(--color-cream);
  --color-border: var(--color-line);
  --color-accent: var(--color-primary-strong);
  --color-bg-dark: var(--color-navy);

  --font-sans: 'Noto Sans JP', -apple-system, BlinkMacSystemFont, 'Hiragino Sans', 'Yu Gothic', Meiryo, sans-serif;
  --font-display: var(--font-sans);
  --font-jp: var(--font-sans);
  --font-en: 'Inter', var(--font-sans);

  --text-xs: clamp(.8125rem, .78rem + .12vw, .875rem);
  --text-sm: clamp(.9375rem, .91rem + .12vw, 1rem);
  --text-base: clamp(1rem, .96rem + .16vw, 1.0625rem);
  --text-lg: clamp(1.125rem, 1.04rem + .3vw, 1.25rem);
  --text-xl: clamp(1.25rem, 1.1rem + .55vw, 1.5rem);
  --text-2xl: clamp(1.5rem, 1.25rem + .9vw, 2rem);
  --text-3xl: clamp(2rem, 1.55rem + 1.55vw, 2.75rem);
  --text-4xl: clamp(2.5rem, 1.8rem + 2.5vw, 4rem);
  --text-5xl: clamp(3rem, 2rem + 3.6vw, 5.25rem);

  --container-wide: 1440px;
  --container-main: 1200px;
  --container-reading: 760px;
  --container-narrow: 640px;
  --content-width: var(--container-main);

  --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: 80px;
  --space-10: 96px;
  --space-11: 120px;
  --space-12: 144px;

  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-xl: 36px;
  --radius-pill: 999px;
  --radius-card: var(--radius-md);

  --shadow-soft: 0 8px 24px rgba(18, 32, 51, .06);
  --shadow-card: 0 14px 36px rgba(18, 32, 51, .09);
  --shadow-floating: 0 22px 56px rgba(18, 32, 51, .14);

  --motion-fast: 180ms;
  --motion-base: 650ms;
  --motion-slow: 850ms;
  --ease-standard: cubic-bezier(.2, .7, .2, 1);
  --focus-ring: 0 0 0 4px rgba(83, 185, 223, .34);
}