/* =========================================================
   色のトークン（サイト共通）
   ブランド・UIガイドライン v1.1 に合わせる。styles.css・lp.css・events.css が先頭で読み込む。
   download/ は <link> で読む。
   - 色は必ずここの変数で使い、ページや CSS に色の値を直書きしない
   - トークン名はガイドライン（アプリの ThemeProvider のキー）に合わせる。CSS なのでケバブケースにしている
   - ダークモードは未対応（ダークの地の色が未決定。#113 第2段階）
   ========================================================= */

:root {
  /* ── ガイドラインのトークン ── */
  --brand:           #E95420;  /* 線・印・ドットなど文字以外 */
  --primary:         #CC4A1C;  /* 白文字を載せる塗り：主要な CTA・番号・選択中。白文字で 4.60:1 */
  --on-primary:      #FFFFFF;  /* primary の上の文字 */
  --accent-text:     #BF4519;  /* オレンジの文字：本文のリンク・ラベル・強調。白の上 5.15:1 */
  --accent-surface:  #FFF4EC;  /* 淡いオレンジの面 */
  --link:            #0066CC;  /* 青のリンク（必要な箇所だけ。いまは未使用） */
  --background:      #F5F5F5;  /* カードを並べる節の地 */
  --surface:         #FFFFFF;  /* カード・白い面・記事の地 */
  --input-bg:        #F0F0F0;  /* チップ・表の見出し・囲み */
  --text:            #1A1A1A;  /* 見出し・本文の強い文字 */
  --text-secondary:  #666666;  /* 補足 */
  --text-muted:      #999999;  /* 弱い補足。重要な情報には使わない */
  --border:          #E5E5E5;  /* 区切り線・カードの枠 */
  --danger:          #DC2626;  /* エラー・削除（いまは未使用） */

  /* ── LP の例外（ガイドラインに無い。理由つき） ── */
  --text-body:       #3D3D3D;  /* 下層の本文・表・FAQ の文字。長文で見出し（--text）との強弱を付けるため（#113 判断1） */
  --inverse-surface: #1A1A1A;  /* 下層のフッターの黒い地 */
  --inverse-surface-top: #131313; /* TOP の課題の節・フッターの黒い地。TOP の構成の一部 */
  --text-on-inverse: #FFFFFF;  /* 黒い地の上の文字（ダークの text と同じ値） */
  --inverse-text-secondary: #AAAAAA; /* 黒い地の上の補足（ダークの textSecondary と同じ値） */
  --inverse-border:  #3A3A3C;  /* 黒い地の上の区切り（ダークの border と同じ値） */
  --accent-text-on-inverse: #F27449; /* 黒い地の上のオレンジの文字（ダークの accentText と同じ値） */
  --device-bezel:    #1C1C21;  /* TOP の端末の枠（画面写真の額縁。色の役割ではない） */
  /* 大会カレンダーの土日のマス。曜日を見分けるための面で、平日（白）・月の外（--input-bg）と区別する */
  --surface-weekend: var(--background);
  --surface-weekend-head: var(--input-bg);

  /* ── 寄せた値の別名（新しく書くときは上のトークンを使う） ── */
  --page-background: var(--surface);   /* 下層・大会カレンダーの body の地。記事は白い地で読む */
  --text-top:        var(--text);      /* TOP の文字 */
  --border-subtle:   var(--border);
  --border-strong:   var(--border);
  --border-warm:     var(--border);
  --border-warm-subtle: var(--border);
  --surface-subtle:  var(--input-bg);
  --surface-subtle-2: var(--input-bg);
  --surface-warm:    var(--input-bg);
  --accent-surface-soft: var(--accent-surface);
  --footer-line:     var(--inverse-border);
  --footer-copy:     var(--inverse-text-secondary);
  --footer-link:     var(--inverse-text-secondary);
  --footer-link-hover: var(--text-on-inverse);
  --footer-nav:      var(--inverse-text-secondary);
  --accent-text-top: var(--accent-text); /* TOP のオレンジの文字 */
  /* TOP の方眼の線。TOP だけの例外：ノートの雰囲気（Friendly）を残すため、白と #F5F5F5 の地の上にうっすら重ねる（#113）。
     下層ページでは使わない */
  --top-grid-line:   rgba(26, 26, 26, 0.045);
}
