@charset "UTF-8";
/* =============================================================================
   StyleDoc — カラーテーマ（色トークンだけを設定。形には一切触れない）
   使い方: body など .page の祖先に .tc-xxxx を付ける。
   ★このコメントに HTML のタグをそのまま書かないこと。この CSS は文書の中へ丸ごと
     埋め込まれるので、生成HTMLをタグで検索するスクリプトがここに誤ヒットして壊れる。
   注意   : 派生トークン（--fs-borderColor=--line, --illustBubble-bgColor=--accent-soft 等）
            は core.css の **.page** で var() 参照している（:root では**テーマが効かず固まる**ため）。
            ここで --line/--accent-soft を変えれば自動追従する。
            イラスト面（--illustList-bgColor/fontColor）はダークでも明色維持＝あえて据え置く。
   ============================================================================= */

/* --- グラフの系列色（--chart-1〜8）＝**カラーテーマに追従しない固定色** ---------------
   情報/警告パネルの意味色と同じ考え方で、19テーマのどれで開いても同じ系列色になる。
   理由: 系列色は「隣り合う色が見分けられること」が仕事で、テーマの1色から機械的に
   作ると色覚特性（P型/D型/T型）で潰れる組み合わせが必ず出る。この8色は
   **隣接ペアの CVD 差 ΔE 9.1 以上・通常色覚 19.6 以上**（OKLab×100）を満たす順序で並べてある
   ＝この並び順のまま 1→8 の順に使うこと（並べ替え・自動生成をしない）。
   9系列目以降は色を増やさず「その他」にまとめる。
   ★明るいテーマ（面＝#ffffff）で検証。ダークは下の .tc-night / .tc-noir で差し替える。
   ★明るい面では 3 と 4 と 5 のコントラストが 3:1 未満なので、**必ず値ラベルか凡例を出す**
     （色だけで意味を運ばせない）。3種のグラフはいずれも既定で名前と値を出している。 */
:root{
  --chart-1:#2a78d6; --chart-2:#eb6834; --chart-3:#1baf7a; --chart-4:#eda100;
  --chart-5:#e87ba4; --chart-6:#008300; --chart-7:#4a3aa7; --chart-8:#e34948;
}
/* ダークテーマ（面＝#1b212b / #20222a）向けに同じ8色を踏み直したもの。別配色ではない。
   こちらは8色すべて 3:1 以上を満たす。 */
.tc-night,.tc-noir{
  --chart-1:#3987e5; --chart-2:#d95926; --chart-3:#199e70; --chart-4:#c98500;
  --chart-5:#d55181; --chart-6:#008300; --chart-7:#9085e9; --chart-8:#e66767;
}

/* --- 暗い紙のテーマ向けの「意味色」の差し替え -----------------------------------
   注記パネル（.callout.is-info / .is-note）の地とカレンダーの土日は、**テーマに追従しない
   固定色**として :root に置いてある（意味はアイコンと位置が担うので色をテーマに委ねない、
   という設計）。ところが暗い紙のテーマでは、地が明るいグレーのままなのに文字だけが
   テーマの明色（--ink-base）へ戻るため、**明るい地に明るい文字**になって読めなくなる
   （実測 1.02。core.css の :root のコメントが「暗紙テーマ時は --co-* を反転セットで
   上書きする想定」と書いていた、その上書きがこれ）。
   ★ここで差し替えるのは**地と土日の文字色だけ**。明るい17テーマには一切影響しない。 */
.tc-night,.tc-noir{
  --co-info-bg:#2b303a; --co-info-ink:#c9cfd9; --co-info-bar:#4b5361;
  --co-note-bg:#343a45; --co-note-ink:#d5dbe4; --co-note-bar:#5b6472;
  /* 土日＝暗い地に載る明るい赤／青（既定の #c0392b / #2b6cb0 は濃い面で 3:1 未満） */
  --cal-sun:#f08a80; --cal-sat:#8ab6e8;
}

/* --- 素の色の控え（--*-base）--------------------------------------------------
   濃い面（ページヘッダー・表紙・強調パネル・警告パネル・濃色レイヤー・帯見出し枠）は
   `--ink` / `--muted` / `--line` / `--accent-ink` を**白系へ入れ替える**（parts.css の L 節）。
   その中に置かれた「自分で明るい面を塗るパーツ」は、この控えを読んで**元の色へ戻す**。
   ★テーマごとに値を書き写さず var() で控えるので、テーマの色を変えれば自動で追従する。
   ★この宣言は各テーマ定義より前でも後でもよい。var() は**カスケードで決まったあとの値**を
     写すので、同じ要素の `--ink` がどこで決まっていても正しく控えられる。 */
.tc-slate,.tc-ocean,.tc-forest,.tc-plum,.tc-amber,.tc-night,.tc-freshlime,.tc-graphite,.tc-sage,
.tc-sand,.tc-mono,.tc-sakura,.tc-powder,.tc-mint,.tc-lavender,.tc-apricot,.tc-midnight,
.tc-bordeaux,.tc-noir,.tc-onyxmint,.tc-onyxred{
  --ink-base:var(--ink); --muted-base:var(--muted); --line-base:var(--line);
  --accent-ink-base:var(--accent-ink);
}

/* スレート（既定・汎用） */
.tc-slate{
  --bg:#eef1f5; --surface:#ffffff; --surface-2:#f7f9fc; --ink:#26303b; --muted:#647082; --line:#e3e8ef;
  --accent:#3a6ea5; --accent-ink:#2a527c; --accent-soft:#e9f0f8;
  --header-bg:linear-gradient(135deg,#2f4a6b 0%,#3a6ea5 100%); --header-ink:#fff; --header-sub:#cdddef;
  --table-head-bg:#2f4a6b; --table-head-ink:#fff; --table-stripe:#f5f8fc;
}
/* オーシャン（青・IT/企業） */
.tc-ocean{
  --bg:#eaf1f7; --surface:#ffffff; --surface-2:#f3f8fc; --ink:#1f2a35; --muted:#5d6b7a; --line:#d9e6f1;
  --accent:#1f6fb2; --accent-ink:#155a92; --accent-soft:#e3f0fa;
  --header-bg:linear-gradient(135deg,#0f4c81 0%,#1f6fb2 100%); --header-ink:#fff; --header-sub:#c7e0f3;
  --table-head-bg:#10588f; --table-head-ink:#fff; --table-stripe:#eef6fc;
}
/* フォレスト（緑・環境/医療） */
.tc-forest{
  --bg:#ecf3ee; --surface:#ffffff; --surface-2:#f2f8f4; --ink:#21302a; --muted:#5b6d63; --line:#dde9e1;
  --accent:#2f8f5b; --accent-ink:#226c45; --accent-soft:#e6f4ec;
  --header-bg:linear-gradient(135deg,#1f6e44 0%,#2f8f5b 100%); --header-ink:#fff; --header-sub:#c6e6d3;
  --table-head-bg:#246c44; --table-head-ink:#fff; --table-stripe:#eff7f2;
}
/* プラム（紫・高級/制作） */
.tc-plum{
  --bg:#f5f2f5; --surface:#ffffff; --surface-2:#faf9fa; --ink:#342d34; --muted:#716c71; --line:#e3dfe4;
  --accent:#8d5d8e; --accent-ink:#6e496f; --accent-soft:#f4eff4; --on-accent:#ffffff;
  --header-bg:linear-gradient(135deg,#573a57 0%,#8d5d8e 100%); --header-ink:#ffffff; --header-sub:#ddcedd;
  /* 表の見出し行は白文字なので、地は 4.5:1 に届く濃さにする（#9d73a0 では 3.89 だった） */
  --table-head-bg:#8e6891; --table-head-ink:#ffffff; --table-stripe:#f9f7f9;
}
/* アンバー（暖色・飲食/小売） */
.tc-amber{
  --bg:#fafaf4; --surface:#ffffff; --surface-2:#fefdf8; --ink:#3d3924; --muted:#737062; --line:#e4e1d0;
  --accent:#e3cb54; --accent-ink:#867316; --accent-soft:#fffbe5; --on-accent:#3d3924; --tone-acc:#867316;
  --header-bg:linear-gradient(135deg,#d0b844 0%,#e3cb54 100%); --header-ink:#3d3924; --header-sub:#645b2d;
  --table-head-bg:#f0e8c3; --table-head-ink:#3d3924; --table-stripe:#fefcf6; --table-head-line:var(--line);
}
/* ナイト（ダーク・テック） — イラスト面は明色のまま維持 */
.tc-night{
  --bg:#0f141b; --surface:#1b212b; --surface-2:#222b37; --ink:#e7ecf3; --muted:#9aa6b6; --line:#33404f;
  --accent:#3fb6e8; --accent-ink:#8ad4f3; --accent-soft:#1e2c3a; --on-accent:var(--bg);
  /* 濃いアクセント面は**明るい色**（暗い紙なので）＝白文字だと 1.64。濃い文字を載せる */
  --on-accent-fill:#0f141b;
  --header-bg:linear-gradient(135deg,#0e1620 0%,#22384c 100%); --header-ink:#fff; --header-sub:#9fc4dd;
  --table-head-bg:#27394c; --table-head-ink:#eaf2fb; --table-stripe:#1f2733;
}
/* フレッシュライム（鮮やかな黄緑・ビビッド）
   ★2026-08-19: ユーザー提供の配色へ差し替え（カスタムテーマ生成器で主色 #7ccf0c から作ったもの）。
     旧版との違い＝地と面の緑みが強くなり（--bg / --surface-2）、**表頭が「淡い地＋濃い文字」**に
     変わった（旧は帯と同じ濃い黄緑地）。淡い表頭なので罫線を出す（--table-head-line）。 */
.tc-freshlime{
  --bg:#e3e7df; --surface:#ffffff; --surface-2:#e4fbc6; --ink:#323e23; --muted:#68705c; --line:#dae4cb;
  --accent:#7ccf0c; --accent-ink:#4c7f07; --accent-soft:#f5fbed; --on-accent:var(--ink-base);
  /* 主色が明るすぎて入れ子の階層濃淡が出ない（隣接段差 1.056）ので、濃いほうの同系色で梯子を作る */
  --tone-acc:#4c7f07;
  /* 帯は明るい黄緑なので白文字では 1.95 しか出ない。文字と補助文字をまとめて濃色にする
     （実測＝見出し 5.83〜7.38・補助 4.34〜5.49。旧配色の補助は 3.68 だったので改善） */
  --header-bg:linear-gradient(135deg,#7ccf0c 0%,#8be811 100%); --header-ink:#323e23; --header-sub:#3d541f;
  /* 表頭は淡い地＋濃い文字（実測 9.56）。淡いので白い紙との境が消えないよう罫線を出す。 */
  --table-head-bg:#d2f8a0; --table-head-ink:#323e23; --table-stripe:#f8fdf3; --table-head-line:var(--line);
}

/* ===== 落ち着いた・穏やか系（低彩度） ===== */
/* グラファイト（無彩色・実務/技術資料/議事録） */
.tc-graphite{
  --bg:#f1f2f4; --surface:#ffffff; --surface-2:#f6f7f8; --ink:#242830; --muted:#697079; --line:#e2e4e8;
  --accent:#4b5561; --accent-ink:#353d47; --accent-soft:#ecedf0;
  --header-bg:linear-gradient(135deg,#2c313a 0%,#4b5561 100%); --header-ink:#fff; --header-sub:#c9cdd4;
  --table-head-bg:#39404a; --table-head-ink:#fff; --table-stripe:#f3f4f6;
}
/* セージ（くすみ緑・穏やか・ウェルネス/教育） */
.tc-sage{
  --bg:#eef1ea; --surface:#ffffff; --surface-2:#f3f6ef; --ink:#282d26; --muted:#67705d; --line:#e0e5d7;
  --accent:#6e8d5c; --accent-ink:#546e46; --accent-soft:#e9f0dd;
  --header-bg:linear-gradient(135deg,#526b44 0%,#617c51 100%); --header-ink:#fff; --header-sub:#d2e0c0;
  --table-head-bg:#526b44; --table-head-ink:#fff; --table-stripe:#eff3e9;
}
/* サンド（ベージュ・温かみ・提案書/ブランド資料） */
.tc-sand{
  --bg:#f5f4f2; --surface:#ffffff; --surface-2:#fbfaf8; --ink:#35312c; --muted:#726f6b; --line:#e1ddd9;
  --accent:#9e7f57; --accent-ink:#7b6344; --accent-soft:#f5f2ee; --on-accent:#ffffff;
  --header-bg:linear-gradient(135deg,#614f37 0%,#9e7f57 100%); --header-ink:#ffffff; --header-sub:#f6f3f0;
  --table-head-bg:#876f4f; --table-head-ink:#ffffff; --table-stripe:#faf9f7;
}

/* ===== 完全モノクロ（白黒・罫線主体。帳票の「完全モノクロ」用＝表頭も無彩色の明色） ===== */
/* モノクロ（無彩色・罫線＋黒文字。見積/請求の白黒帳票、契約書・FAX/白黒印刷向け） */
.tc-mono{
  --bg:#e8e8e8; --surface:#ffffff; --surface-2:#f4f4f4; --ink:#141414; --muted:#616161; --line:#8f8f8f;
  --accent:#1a1a1a; --accent-ink:#000000; --accent-soft:#ededed;
  --header-bg:linear-gradient(135deg,#333333 0%,#111111 100%); --header-ink:#fff; --header-sub:#cccccc;
  --table-head-bg:#efefef; --table-head-ink:#111111; --table-stripe:#f4f4f4; --table-head-line:var(--line);
}

/* ===== やわらかい・パステル淡色（帯を明るく＋濃色文字＝軽やか。既存の濃帯＋白文字とは別設計） ===== */
/* サクラ（淡ピンク・親しみ/案内/美容） */
.tc-sakura{
  --bg:#fffafd; --surface:#ffffff; --surface-2:#fffeff; --ink:#72375e; --muted:#8e5f7e; --line:#e8dae3;
  --accent:#ffe5f6; --accent-ink:#b33d89; --accent-soft:#fff5fc; --on-accent:#72375e; --tone-acc:#b33d89;
  --header-bg:linear-gradient(135deg,#fbd8ef 0%,#ffe5f6 100%); --header-ink:#72375e; --header-sub:#9b678a;
  --table-head-bg:#fef3fa; --table-head-ink:#72375e; --table-stripe:#fffeff; --table-head-line:var(--line);
}
/* パウダーブルー（淡青・清潔/医療/教育/IT） */
.tc-powder{
  --bg:#eef4f9; --surface:#ffffff; --surface-2:#f5f9fc; --ink:#323c46; --muted:#6e7c8a; --line:#dce7f1;
  --accent:#5f9fd0; --accent-ink:#3d7cb2; --accent-soft:#e3eff9; --on-accent:var(--ink-base);
  /* 濃いアクセント面（A の玉・仕様表の分類・ガントのバー）は白文字が 4.45 でわずかに届かない＝一段濃くする */
  --accent-fill:#356d9e;
  --header-bg:linear-gradient(135deg,#d0e4f5 0%,#b7d5ee 100%); --header-ink:#2e4d66; --header-sub:#5d7d95;
  --table-head-bg:#c2dbef; --table-head-ink:#2e4d66; --table-stripe:#eff6fc; --table-head-line:var(--line);
}
/* ミント（淡緑・清涼/ヘルスケア/食/サステナ） */
.tc-mint{
  --bg:#edf6f1; --surface:#ffffff; --surface-2:#f4faf7; --ink:#31403a; --muted:#6b7f77; --line:#daebe4;
  --accent:#4fb794; --accent-ink:#379073; --accent-soft:#def3ea; --on-accent:var(--ink-base);
  /* 同上（白文字が 3.89 だったため） */
  --accent-fill:#2b7660;
  --header-bg:linear-gradient(135deg,#c7ecdc 0%,#abe0cb 100%); --header-ink:#2a5749; --header-sub:#5a8578;
  --table-head-bg:#bde6d4; --table-head-ink:#2a5749; --table-stripe:#eef8f3; --table-head-line:var(--line);
}
/* ラベンダー（淡紫・上品/穏やか/クリエイティブ） */
.tc-lavender{
  --bg:#f2f1f6; --surface:#ffffff; --surface-2:#fdfcfe; --ink:#352e47; --muted:#726d7e; --line:#e0dee6;
  /* 見出し・リンクは**淡いアクセント地(#ede7fd)の上**でも 4.5:1 を確保する
     （指定の #7860c0 では 4.12 だった。地の色味は指定どおり維持し、文字側を寄せる） */
  --accent:#c7bde5; --accent-ink:#6f59b1; --accent-soft:#ede7fd; --on-accent:#352e47; --tone-acc:#6f59b1;
  --header-bg:linear-gradient(135deg,#cfc5ec 0%,#c7bde5 100%); --header-ink:#352e47; --header-sub:#655d7b;
  --table-head-bg:#f0ecf9; --table-head-ink:#352e47; --table-stripe:#fcfcfe; --table-head-line:var(--line);
}
/* アプリコット（淡橙・フレンドリー/案内/イベント/飲食） */
.tc-apricot{
  --bg:#f9f3ee; --surface:#ffffff; --surface-2:#fff8f5; --ink:#604d3e; --muted:#7d6d61; --line:#e7dfd8;
  /* 見出し・リンクは**沈んだ面(#fff8f5)と淡いアクセント地(#fff4f0)の両方**で 4.5:1 を確保する
     （指定の #bb570b では 4.46／4.34 だった。淡いアクセント地の色味は指定どおり維持し、文字側を寄せる） */
  --accent:#fbd7bc; --accent-ink:#b4540b; --accent-soft:#fff4f0; --on-accent:#604d3e; --tone-acc:#b4540b;
  --header-bg:linear-gradient(135deg,#fad8be 0%,#fbd7bc 100%); --header-ink:#604d3e; --header-sub:#8a7260;
  --table-head-bg:#ffeadb; --table-head-ink:#604d3e; --table-stripe:#fffdfc; --table-head-line:var(--line);
}

/* ===== 高級感・重厚（提案書・ブランド・格式のある資料向け） ===== */
/* ミッドナイト（濃紺・信頼/格調・金融/法務/コンサル。少量カラー帳票の推奨） */
.tc-midnight{
  --bg:#eceef4; --surface:#ffffff; --surface-2:#f3f5fa; --ink:#1b2130; --muted:#586278; --line:#d9deeb;
  --accent:#2e4372; --accent-ink:#22335c; --accent-soft:#e5e9f5;
  --header-bg:linear-gradient(135deg,#141b33 0%,#2e4372 100%); --header-ink:#fff; --header-sub:#c1cae4;
  --table-head-bg:#1d2a4e; --table-head-ink:#fff; --table-stripe:#eef1f9;
}
/* ボルドー（ワイン・エレガント/ホスピタリティ/記念） */
.tc-bordeaux{
  --bg:#f4edee; --surface:#ffffff; --surface-2:#faf4f5; --ink:#2d232a; --muted:#6e5d64; --line:#e9dbde;
  --accent:#8a3a4d; --accent-ink:#6d2c3c; --accent-soft:#f2e3e7;
  --header-bg:linear-gradient(135deg,#57202d 0%,#8a3a4d 100%); --header-ink:#fff; --header-sub:#e5c3cc;
  --table-head-bg:#57202d; --table-head-ink:#fff; --table-stripe:#f7eff1;
}
/* ノワール＆ゴールド（漆黒×金・ダーク。招待状/プレミアム/表彰。イラスト面は明色維持） */
.tc-noir{
  --bg:#16130e; --surface:#221e16; --surface-2:#2f2a1e; --ink:#eeece7; --muted:#918e87; --line:#574f3d;
  --accent:#45330c; --accent-ink:#b99531; --accent-soft:#352c18; --on-accent:#ffffff; --tone-acc:#c08e21;
  /* 同上（金色の面に白文字だと 2.84 だった） */
  --on-accent-fill:#16130e;
  --header-bg:linear-gradient(135deg,#3f2f0e 0%,#45330c 100%); --header-ink:#ffffff; --header-sub:#aba392;
  --table-head-bg:#2e2614; --table-head-ink:#ffffff; --table-stripe:#29251a; --table-head-line:var(--line);
}

/* --- 黒基調＋差し色1色（オニキス系） ------------------------------------------
   面と文字は**無彩色**（白い紙・黒に近い見出し・グレーの罫線）でそろえ、**主色だけ**が
   バッジ・玉・リンク下線などの「差し色」として出る。技術資料や仕様書のように
   色数を絞りたい文書向け。★見出し・リンク（--accent-ink）は主色ではなく**黒**＝
   本文と地続きの見え方になる（主色は「印」としてだけ使う）。
   ★主色が紙に近いと入れ子の濃淡が潰れるので --tone-acc を黒へ逃がす（19テーマと同じ扱い）。
   ★A の玉・仕様表の分類・ガントのバーは --accent-fill（濃いアクセント面）で塗る＝
     見出しの黒とは切り離してあるので、**主色系の濃い色**にできる。 --- */
/* オニキス ミント（黒＋淡緑） */
.tc-onyxmint{
  --bg:#ededed; --surface:#ffffff; --surface-2:#f6f6f6; --ink:#303030; --muted:#6e6e6e; --line:#e0e0e0;
  --accent:#b2e1d6; --accent-ink:#141414; --accent-soft:#e3f2ef; --on-accent:#000000; --tone-acc:#141414;
  --accent-fill:#2f6f60; --on-accent-fill:#ffffff;
  --header-bg:linear-gradient(135deg,#101010 0%,#1a1a1a 100%); --header-ink:#ffffff; --header-sub:#989898;
  --table-head-bg:#b5b5b5; --table-head-ink:#303030; --table-stripe:#f4f4f4; --table-head-line:var(--line);
}
/* オニキス レッド（黒＋赤） */
.tc-onyxred{
  --bg:#ededed; --surface:#ffffff; --surface-2:#f6f6f6; --ink:#303030; --muted:#6e6e6e; --line:#e0e0e0;
  --accent:#c24242; --accent-ink:#141414; --accent-soft:#fbe0e0; --on-accent:#ffffff; --tone-acc:#141414;
  --accent-fill:#8e2f2f; --on-accent-fill:#ffffff;
  --header-bg:linear-gradient(135deg,#101010 0%,#1a1a1a 100%); --header-ink:#ffffff; --header-sub:#989898;
  --table-head-bg:#b5b5b5; --table-head-ink:#303030; --table-stripe:#f4f4f4; --table-head-line:var(--line);
}