/*
 * デザイントークン。source of truth は docs/DESIGN.md (Stripe 風デザインシステム) の YAML。
 * 値を変えるときは必ず DESIGN.md と突き合わせること。
 */
:root {
  /* --- colors --- */
  --color-primary: #533afd;            /* CTA 専用。本文色に使わない */
  --color-primary-deep: #4434d4;
  --color-primary-press: #2e2b8c;
  --color-primary-soft: #665efd;
  --color-primary-subdued: #b9b9f9;
  --color-brand-dark: #1c1e54;
  --ink: #0d253d;
  --ink-secondary: #273951;
  --ink-mute: #64748d;
  --ink-mute-2: #61718a;
  --on-primary: #ffffff;
  --canvas: #ffffff;
  --canvas-soft: #f6f9fc;
  --canvas-cream: #f5e9d4;
  --hairline: #e3e8ee;
  --hairline-input: #a8c3de;
  --ruby: #ea2261;
  --magenta: #f96bee;
  --lemon: #9b6829;

  /* semantic (DESIGN.md に無い派生トークン。derived) */
  --status-online: #1ea672;
  --status-offline: var(--ink-mute);
  --danger: var(--ruby);

  /* --- rounded --- */
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-pill: 9999px;

  /* --- spacing --- */
  --space-xxs: 2px;
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 12px;
  --space-lg: 16px;
  --space-xl: 24px;
  --space-xxl: 32px;
  --space-huge: 64px;

  /* --- elevation --- */
  --shadow-1: 0 1px 3px rgba(0, 55, 112, 0.08);
  --shadow-2: 0 8px 24px rgba(0, 55, 112, 0.08), 0 2px 6px rgba(0, 55, 112, 0.04);

  /*
   * フォント: Sohne は非公開のため DESIGN.md が正規代替と明記する Inter を欧文に、
   * 和文はシステムフォントに落とす (Inter に和文グリフは無い)。
   */
  --font-sans: Inter, "SF Pro Display", system-ui, -apple-system, "Hiragino Sans", "Noto Sans JP", sans-serif;
}