/* デザインの決まり（DADS準拠の骨格＋自分色）
   - 文字: Noto Sans JP / Noto Sans Mono。本文16px以上、14pxは補足のみ（14px未満は使わない）
   - 行高: 本文1.75、見出し1.4〜1.5
   - 余白: 8px基準（8 / 16 / 24 / 40 / 64 / 104）
   - 色: 深い青・黄色マーカー。赤で強調しない
   正本: docs/LP構成とデザイン構成_20261017.md §4 */
:root {
  --font: "Noto Sans JP", "Hiragino Sans", system-ui, sans-serif;
  --mono: "Noto Sans Mono", ui-monospace, monospace;

  --fs-h1: clamp(32px, 4.3vw, 60px);
  --fs-h2: clamp(28px, 3.2vw, 40px);
  --fs-h3: clamp(22px, 2.2vw, 26px);
  --fs-strong: clamp(20px, 2vw, 24px);
  --fs-lead: 18px;
  --fs-body: 16px;
  --fs-note: 14px;

  --lh-head: 1.45;
  --lh-body: 1.75;

  --sp-1: 8px;
  --sp-2: 16px;
  --sp-3: 24px;
  --sp-5: 40px;
  --sp-8: 64px;
  --sp-13: 104px;

  --radius: 6px;

  /* 色の役割（固定） */
  --key: #1d3b8f;        /* キーカラー */
  --key-strong: #12275f; /* 濃い青 */
  --key-soft: #e9eef9;   /* 薄い青：貯まっている場所 */
  --paper: #ffffff;
  --paper-2: #f0f3f8;    /* 薄い面：セクション背景・行見出し */
  --mark: #ffd84d;       /* 黄色：マーカー・AI・到達点 */
  --mark-soft: #fff4c2;
  --ink: #172238;        /* 本文 */
  --ink-2: #505969;      /* 補足 */
  --ng: #60708d;         /* うまくいっていない状態・戻りの破線 */
  --line: #d5d9e1;       /* 罫線 */
  --on-key-sub: #e5ecff; /* 青面の上の補足 */
  --line-green: #06c755; /* LINE（白地のときだけ） */

  --focus: #ffd84d;
  --error: #b3261e;      /* フォームのエラー文のみ */
  --ok: #1d7a4a;
}