/* 色トークン。意味のある色だけ定義する（DESIGN.md 原則 2）。 */
:root {
  color-scheme: light dark;
  --bg: #ffffff;
  --fg: #1a1a1a;
  --muted: #6b6b6b;
  --line: #e2e2e2;
  --accent: #2b5fd9;
  --accent-fg: #ffffff;
  --status-red: #c62828;
  /* 状態の点は背景と 3:1 以上（ライト・ダークとも。tests/test_tokens.py が測る） */
  --status-yellow: #b07a00;
  --status-green: #2e7d32;
  --status-gray: #808080;
  --radius: 12px;
  --tap: 44px;
  /* 押せる部品の枠。背景との差 3:1 以上（WCAG の非テキスト）。--line は飾りの区切り線 */
  --control-line: #8a8a8a;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #121212;
    --fg: #ececec;
    --muted: #a0a0a0;
    --line: #2a2a2a;
    --accent: #7aa2ff;
    --accent-fg: #0b1430;
    --control-line: #6b6b6b;
  }
}