:root {
  --font-sans: "Yu Gothic","Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;
  --font-serif: "Yu Mincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  --bg: #f5f4ef;
  --surface: #fff;
  --surface-sub: #ecebe4;
  --text: #202522;
  --muted: #67706b;
  --accent: #27483d;
  --accent-2: #7d8f87;
  --line: #c9cdc7;
  --line-strong: #7e8882;
  --warning: #9a352d;
  --on-accent: #fff;
  --container: 1180px;
  --reading: 720px;
  --wide: 1420px;
  --gutter: clamp(20px,4vw,64px);
  --section: clamp(72px,9vw,144px);
  --header: 76px;
  --step--1: clamp(.78rem,.74rem + .15vw,.88rem);
  --step-0: clamp(.98rem,.93rem + .22vw,1.08rem);
  --step-1: clamp(1.15rem,1.04rem + .55vw,1.48rem);
  --step-2: clamp(1.48rem,1.23rem + 1.15vw,2.2rem);
  --step-3: clamp(2rem,1.55rem + 2.2vw,3.45rem);
  --step-4: clamp(2.65rem,1.75rem + 4.2vw,5.7rem);
  --lh-tight: 1.28;
  --lh-body: 1.9;
  --tracking: .04em;
  --radius-sm: 2px;
  --radius: 8px;
  --radius-lg: 16px;
  --shadow: 0 24px 70px rgba(28,35,31,.1);
  --fast: 180ms;
  --normal: 360ms;
  --z-header: 100;
  --z-modal: 1000;
}

.theme-creative {
  --bg: #f7f7f4;
  --surface: #fff;
  --surface-sub: #e9ecea;
  --text: #171c1a;
  --muted: #626a66;
  --accent: #183d4a;
  --accent-2: #6a858f;
  --line: #cbd0ce;
}

.theme-support {
  --bg: #1a1d1b;
  --surface: #232724;
  --surface-sub: #2b302d;
  --text: #f1eee6;
  --muted: #b7b9b4;
  --accent: #9bb8aa;
  --accent-2: #718b7e;
  --line: #454b47;
  --line-strong: #737b76;
  --warning: #d4776d;
  --on-accent: #142019;
  --shadow: 0 28px 80px rgba(0,0,0,.28);
}

.theme-policy {
  --bg: #f7f6f1;
  --surface: #fff;
  --surface-sub: #eceae3;
  --text: #252925;
  --muted: #6d716d;
  --accent: #3f5149;
  --line: #cbcfc9;
}