/* FACT デザインシステム v5 — トークン（CSS変数）
 *
 * FACT から書き出したものです。**正は FACT の resources/views/layouts/fact.blade.php**。
 * このファイルを直しても FACT は変わりません。FACT 側の変更は、書き出し直して受け取ってください。
 *
 * 書き出し元：FACT コミット 3f73c5c（2026-10-20）
 * 書き出し　：php scripts/export_design_system.php
 */

:root{
    /* --- 文字の大きさ：6段だけ（Apple「種類は最小限に」）------------------
       下限は 14px。デジタル庁のテキストスタイル一覧に14px未満が無いため。
       読ませる文章は 16px（デジタル庁「基本的に16 CSS px以上」）。
       14px は表・ラベル・メタなど密度が要る場所に限る（同システムの Dns/Oln 相当）。 */
    --t-display:32px;   /* ページ見出し */
    --t-title:24px;     /* 大きな数値・セクション見出し */
    --t-head:20px;      /* カード見出し */
    --t-lead:18px;      /* 強調した本文 */
    --t-body:16px;      /* 本文（標準） */
    --t-dense:14px;     /* 表・ラベル・メタ（下限） */
    --lh-tight:1.35; --lh-normal:1.55; --lh-read:1.75;

    /* --- 余白：デジタル庁の基準単位 8 CSS px の倍数だけ ------------------- */
    --s0:4px;  /* 半単位。アイコンと文字の間などに限る */
    --s1:8px; --s2:16px; --s3:24px; --s4:32px; --s5:48px; --s6:64px;

    /* --- 角の形状：2値だけ（v4は14種類あった）--------------------------- */
    --radius:8px;       /* カード・入力・ボタン */
    --radius-sm:4px;    /* タグ・小さな要素 */
    --radius-pill:999px;

    /* --- 面（色調差で区切る。紫みを抜いた中立グレー）---------------------- */
    --ground:#F5F6F7;       /* 地 */
    --surface:#FFFFFF;      /* 面 */
    --surface-2:#F0F1F3;    /* 面の一段下（入力欄の地・ホバー） */
    --surface-3:#E6E8EB;

    /* --- 線 ---
       --line は行間の区切りなど**装飾**（WCAG 1.4.11 の対象外）。
       --line-strong は入力枠など**部品の識別に必要**な線で、白地に 3.21:1。 */
    --line:#E1E3E6;
    --line-strong:#8B9097;

    /* --- 文字色（すべて白地で 4.5:1 以上。実測値をコメントに書く）--------- */
    --ink:#1F2024;      /* 16.27:1  本文・見出し */
    --ink-2:#45484E;    /*  9.17:1  補助の文章 */
    --ink-3:#5E6269;    /*  6.13:1  メタ・ラベル（v4は #A4A4BA で 2.44:1 だった） */

    /* --- アクセント＝「操作できるもの」専用。見出しや飾りには使わない ------ */
    --accent:#3457D5;      /* 6.05:1  ブランド色はv4から変えていない */
    --accent-d:#27409E;    /* 9.08:1  ホバー・押下 */
    --accent-soft:#EBEFFB; /* 淡い塗り。この上の --accent は 5.27:1 */

    /* --- セマンティック：意味が決まっている色（色相はv4から変えず、
           アクセシビリティのために明度だけ下げた。デジタル庁の指針どおり）--- */
    --pos:#1C7A58;  --pos-soft:#E7F3EE;   /* 達成・黒字   5.28:1 / 淡色上 4.64:1 */
    --neg:#C0243A;  --neg-soft:#FBECEE;   /* 未達・赤字   5.91:1 / 淡色上 5.16:1 */
    --warn:#8A5A06; --warn-soft:#FBF2E3;  /* 注意        5.92:1 / 淡色上 5.33:1 */

    /* v4からの別名（既存画面が参照しているので残す。色は上の3つに寄せた） */
    --pink:var(--neg); --pink-soft:var(--neg-soft);
    --green:var(--pos); --green-soft:var(--pos-soft);
    --amber:var(--warn); --amber-soft:var(--warn-soft);
    --sky:var(--accent); --sky-soft:var(--accent-soft);
    --accent-2:var(--accent-d); --prussian:var(--accent); --prussian-2:var(--accent-d);
    --brass:var(--ink-3); --g-blue:var(--accent); --g-warm:var(--neg); --g-green:var(--pos);

    /* --- エレベーション（Material 3）-----------------------------------
       **既定は影ではなく線**。--shadow / --shadow-sm は既存画面の149箇所から
       参照されているので、値を「1pxの輪郭」に置き換える。
       box-shadow はレイアウトに影響しないので、置き換えてもズレない。
       本物の影は2つだけ：浮いているもの（--shadow-over）と操作中（--shadow-act）。 */
    --shadow-sm:0 0 0 1px var(--line);
    --shadow:0 0 0 1px var(--line);
    --shadow-lg:0 0 0 1px var(--line-strong);
    --shadow-over:0 4px 16px rgba(20,22,26,.14), 0 0 0 1px var(--line);  /* +3 オーバーレイ */
    --shadow-act:0 2px 6px rgba(20,22,26,.12), 0 0 0 1px var(--line-strong); /* +4 操作中 */

    --side:272px; --topbar:72px;
    --sans:"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic","YuGothic","Meiryo",system-ui,-apple-system,sans-serif;
    --mono:"SF Mono","SFMono-Regular","Menlo","Consolas","Liberation Mono",monospace;
  }

