  /* ═══════════════════════════════════════════════
     デザイントークン：サイト全体で使う色・フォントの設定
     ここを変えるとサイト全体の配色やフォントがまとめて変わります
     （このファイルは index.html で style.css より先に読み込まれ、
       ここで付けた名前を style.css や app.js が参照します）
     ═══════════════════════════════════════════════ */
  :root {
    --paper: #FBFAF8;      /* 紙（ページ全体の背景）の色 */
    --card: #FFFFFF;       /* カード（記事一覧の白い枠）の色 */
    --ink: #121614;        /* 基本の文字色（墨色） */
    --ink-2: #1E1F1A;      /* 文字色の別調子（見出しなど） */
    --ink-soft: #64685E;   /* 薄めの文字色（日付・補足など） */
    --green: #233D38;      /* 基調の緑（タブの下線・リンクなど） */
    --green-2: #2F4D44;    /* 緑の明るい調子 */
    --tint: #EDEDE6;       /* うっすら色を敷く背景 */
    --line: #E0E4E2;       /* 罫線の色 */
    --line-2: #D1D6CF;     /* 罫線の色（濃いめ） */
    --navy: #1B293A;       /* 紺色（アクセント） */
    --tag: #A85237;        /* タグ・えんじ色のアクセント */
    --warn: #A0473A;       /* 注意・増加（▲）を表す赤茶 */
    --gold: #B08D49;       /* 金茶色（体脂肪率のグラフなど） */
    --logo: "EB Garamond", serif;       /* 英字ロゴ用の書体 */
    /* iOS/Macにはヒラギノがシステムフォントとして必ず入っているので先頭に書く。
       ヒラギノを持たない環境（Windowsなど）ではブラウザがその名前を無視して
       次の候補に進むので、そこでUD Pフォントに切り替わる。
       ＝画面幅で分岐させる必要はなく、常にこの並び順にしておけば
       「iOS/Macはヒラギノ、それ以外はUD P」が自動的に実現する。
       （以前は画面幅640px以下だけヒラギノを指定していたが、Macやタブレットの
       横向きなど640pxを超える画面では対象外になってしまい、UD Pフォントが
       インストールされていないiOS/MacではさらにOS標準の別書体に
       フォールバックしてしまっていた。） */
    --mincho: "Hiragino Mincho ProN", "Hiragino Mincho Pro", "BIZ UDPMincho", serif;
    --gothic: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "BIZ UDPGothic", sans-serif;
    --util: var(--gothic);
  }
