/*
 * tokens.css — 見た目の値をここに集約する。
 *
 * ★ 60代と小学生が同じ画面を見る前提で決めた値 (AGENTS.md ルール19)。
 *   個別の画面でこれより小さい文字・狭いタップ領域を作らないこと。
 *   tests/ の検査がこの値を読んで見張る。
 */

:root {
  /* --- 文字の大きさ ---------------------------------------------------- */
  /* ルートを 18px にする (ブラウザ既定の 16px より1段大きい)。
     端末の「文字を大きく」設定に追従させたいので px 固定ではなく % で指定する。 */
  font-size: 112.5%; /* = 18px */

  --fs-title: 1.55rem; /* 約28px */
  --fs-head: 1.25rem; /* 約22px */
  --fs-body: 1rem; /* 約18px */
  --fs-caption: 0.9rem; /* 約16px。★これより小さい文字を作らない */

  --lh-body: 1.7; /* 日本語は行間を広めに取らないと読みにくい */

  /* --- 触れる大きさ ---------------------------------------------------- */
  /* 一般的な指針は 44px だが、家族には手の震えがある人も含まれるので 56px にする。 */
  --tap-min: 56px;

  /* --- 余白 ------------------------------------------------------------ */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;

  --radius: 12px;
  --border: 2px;

  /* --- 色 --------------------------------------------------------------
     背景と本文の組み合わせはすべてコントラスト比 4.5:1 以上。
     ★ ダークモードは v1 では作らない。1テーマに集中して可読性を上げる方が
       価値が高く、「昨日と色が違う」という混乱も生まない。 */
  --c-bg: #f7f5f1; /* 生成りの紙の色。真っ白より目が疲れにくい */
  --c-surface: #ffffff;
  --c-ink: #1f1c18; /* 本文。#f7f5f1 との比 15.4:1 */
  --c-ink-weak: #55504a; /* 補足。#f7f5f1 との比 7.4:1 */
  --c-line: #d8d2c8;

  --c-accent: #1a5c3a; /* 押せるもの。白抜き文字との比 7.0:1 */
  --c-accent-ink: #ffffff;
  --c-urgent: #8c1d1d; /* いそぐこと。白抜き文字との比 8.6:1 */

  /* --- ○△× の色 -------------------------------------------------------
     ★ 色だけで区別させない。base.css で形 (記号) と模様 (斜線・点) も付ける。
       色覚特性のある人と、屋外で画面が見えにくい状況の両方に効く。 */
  --c-ok: #1a5c3a; /* ○ だいじょうぶ */
  --c-maybe: #8a5b00; /* △ たぶん */
  --c-ng: #8c1d1d; /* × むずかしい */
  --c-unknown: #6b665f; /* 未回答。「まだ 返事まち」 */
}