/* 平坦化した配信物。編集しない。正本は _cf_ds/cf-tokens.css ／ _shindan_sd/shindan-sd.css ／ _shindan_sd/bridge/joseikin.css。
   直したい時はその3つを直して build_shindan_bridge_20260731.py を回す。 */
/* ===== 層1 トークン正本 ===== */
/* ============================================================================
   cf-tokens.css — クロスフェイス デザイントークン 正本 v0.1（LP・portal 共通）
   2026-07-29

   ★方針 2026-07-29＝型化して、LP・portal のデザインを統一する。
   ★ここが**色と寸法の唯一の出どころ**。LP側 `robot-lp-sd.css` と portal側 `portal-sd.css` は
     どちらも先頭で本ファイルを @import し、**自前の :root を持たない**。

   ─────────────────────────────────────────────────────────────────────────
   なぜ抜き出したか（2026-07-29 実測）
     抜き出す前、同じトークンが2ファイルに二重定義されていた。共通23個のうち：
       🔴 --line   … LP `#E1E5EC` ／ portal `#E2E7F0`   ＝**ズレていた**
       🔴 --cf-accent … 旧portalが `#103070`(紺) を当てていた（LPは `#60A0B0` 青緑）
     二重定義は必ずズレる。**実際にズレていたのが証拠**なので、定義箇所を1つにした。

   統一で動かした値（記録）
     --line : LP `#E1E5EC` → **`#E2E7F0`**（portal 側に寄せた）
              理由＝殻 `@crossface/app-shell` が `--color-cf-line` として**参照する契約**を
              既に持っており、そちらが下流を持つため。LPの見た目の差は 1階調で実質不可視。
     --cf-accent : 「accent」が紺・青緑・金のCTAで3つの意味に割れていたため
              **青緑 `#60A0B0` に固定**。紺は `--cf-primary`、CTAの金は `--cf-gold`。
              🔴 **今後 `accent` を新しい名前として使わない。**

   構成
     §1 ブランド ／ §2 士業色 ／ §3 状態 ／ §4 面と文字 ／ §5 影
     §6 字（portal主体・LPも参照可） ／ §7 かたち ／ §8 寸法（殻の骨格）
     §9 ダーク（portalのみ実効。LPは data-theme を出さないので当たらない）
     §10 互換エイリアス（殻 shell.css が参照する13個＋各アプリの旧名）
   ============================================================================ */

:root {
  /* ── §1 ブランド ── */
  --cf-primary:      #103070;
  --cf-primary-dark: #0B2350;
  --cf-secondary:    #3050A0;
  --cf-light:        #EAF0FB;
  --cf-accent:       #60A0B0;   /* 青緑。★紺ではない */
  --cf-gold:         #F5B400;   /* 主CTA */
  --cf-gold-dark:    #DD9D00;
  --cf-gold-ink:     #3A2A00;
  --self-blue:       #103070;   /* セルフ導線（LP由来・値は primary と同じ） */

  /* ── §2 士業色（監修バッジ等でのみ使う。面の基調にしない＝ブランドシステム v0.1 §4）── */
  --shaho-green:   #2E9E50;
  --gyosei-violet: #5E4B8B;
  --shiho-red:     #B5392E;
  --nin-amber:     #B5852A;
  --benri-plum:    #A8327D;

  /* ── §3 状態 ── */
  --ok:    #1D9E75;
  --warn:  #BA7517;
  --error: #A32D2D;
  --info:  #378ADD;

  /* ── §4 面と文字 ── */
  --text:       #1A1A1A;
  --text-sub:   #5F5E5A;
  --text-faint: #8B909C;
  --bg-base:    #FFFFFF;
  --bg-subtle:  #F4F6FA;
  --surface:    #FFFFFF;   /* カード等の紙面。ダークで反転する */
  --line:       #E2E7F0;   /* ★統一値。LPの旧 #E1E5EC はここへ寄せた */
  --line-soft:  #EEF1F6;

  /* ── §5 影 ── */
  --shadow:    0 2px 8px rgba(16,48,112,.08);
  --shadow-lg: 0 12px 32px rgba(16,48,112,.14);

  /* ── §6 字 ── */
  --font-jp: var(--font-noto-sans-jp), "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", Meiryo, sans-serif;
  --text-xs:  12px;
  --text-sm:  14px;
  --text-base:16px;
  --text-lg:  18px;
  --text-xl:  20px;
  --text-2xl: 24px;
  --text-3xl: 32px;
  --fw-body:  400;
  --fw-label: 500;
  --fw-bold:  700;
  --fw-heavy: 800;
  --lh-heading: 1.35;
  --lh-body:    1.75;
  --lh-note:    1.6;

  /* ── §7 かたち ── */
  --radius-sm:   7px;
  --radius:      9px;
  --radius-card: 14px;
  --focus: 0 0 0 3px rgba(48,80,160,.28);

  /* ── §8 寸法（殻の骨格） ── */
  --appbar-h:  60px;
  --leftnav-w: 232px;
}

/* ── §9 ダーク ──
   portal は既に対応しているので壊さない。
   ★セレクタリストの中に @media は書けない（書くとスタイルシート全体の解析が落ちる）。
     同じ中身を2ブロックに分けて宣言する。
   🔴 2026-07-29夜 訂正＝直下の @media ブロックは「LPは data-theme を出さないので当たらない」という
     旧コメントの想定に反し、**LPにも実際に当たる**（実測確認：shindan-robot.jp を
     prefers-color-scheme:dark で開くと --bg-subtle が #161C27 に解決し、data-theme='light' を
     どこにも持たない）。LP側の `.sd-stat b` 等が `--cf-primary`（ダークで無変更のまま #103070）を
     この暗転した --bg-subtle の上に置くとコントラスト比 1.37:1 まで落ちて視認できない。
     ∴ LP側は `_robot_lp_sd/robot-lp-sd.css` で明示的にこの@mediaを打ち消している
     （§9相当の値をLP側で再宣言・同じ詳細度で後勝ち）。cf-tokens.css自体はportalの挙動を
     壊さないためここでは変更していない。 */
:root[data-theme='dark'] {
  --text:       #F2F4F8;
  --text-sub:   #B9BFCB;
  --text-faint: #868D9B;
  --bg-base:    #10141C;
  --bg-subtle:  #161C27;
  --surface:    #1B2230;
  --line:       #2C3546;
  --line-soft:  #232B3A;
  --cf-light:   #1B2740;
  --shadow:     0 2px 8px rgba(0,0,0,.34);
  --shadow-lg:  0 12px 32px rgba(0,0,0,.46);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) {
    color-scheme: dark;
    --text:       #F2F4F8;
    --text-sub:   #B9BFCB;
    --text-faint: #868D9B;
    --bg-base:    #10141C;
    --bg-subtle:  #161C27;
    --surface:    #1B2230;
    --line:       #2C3546;
    --line-soft:  #232B3A;
    --cf-light:   #1B2740;
    --shadow:     0 2px 8px rgba(0,0,0,.34);
    --shadow-lg:  0 12px 32px rgba(0,0,0,.46);
  }
}

/* ── §10 互換エイリアス ──
   殻 `shell.css` が var() で参照する13個は**全部ここで賄える**（shell.css 自身は定義0）。
   各アプリは globals.css の該当定義を**消すだけ**で載る（置換は要らない）。 */
:root {
  /* 殻が参照する13個 */
  --color-cf:       var(--cf-primary);
  --color-cf-bg:    var(--bg-subtle);
  --color-cf-ink:   var(--text);
  --color-cf-line:  var(--line);
  --color-cf-sub:   var(--text-sub);
  --color-cf-tint:  var(--cf-light);
  --wl-accent:      var(--shaho-green);   /* 白ラベル＝社労士緑 */
  --wl-accent-bg:   #E8F3EC;
  /* --focus --fw-label --lh-note --radius-card --text-sm --text-xs は上に同名で在る */

  /* アプリ側の旧名 */
  --color-cf-2:      var(--cf-secondary);
  --color-cf-accent: var(--cf-accent);
  --color-cf-body:   var(--text-sub);
  --color-cf-err:    var(--error);
  --color-cf-ok:     var(--ok);
  --cf-ink:          var(--text);
  --cf-muted:        var(--text-sub);
  --cf-bg-soft:      var(--bg-subtle);
  --cf-line:         var(--line);         /* 旧 #e4e7ec → 正本へ */
  --cf-radius:       var(--radius-sm);
  --leading-body:    var(--lh-body);
  --leading-heading: var(--lh-heading);
}

/* ===== 層2/3 診断面デザインシステム ===== */
/* ============================================================================
   shindan-sd.css — 診断面 共通デザインシステム v0.2（正本）
   2026-07-31 ★方針＝全ての診断メニューでデザインを統一・型化する。
              CF-IDを必要とする診断は portal.shindan-robot.jp の型に合わせる。
              配色は基本的に青で統一する。

   対象6面＝補助金診断／助成金診断／商圏調査／採用診断／役員報酬シミュレーション／
            個人事業と法人化の比較

   ── なぜ要るのか（2026-07-31 本番CSSを実測した結果）────────────────────────
   6面のあいだに **共通する色が1色も無い**。共通するCSS変数名も **0個**。
   総ユニーク変数は64個。ブランド色 #103070 を持っているのは法人化だけで、
   役員報酬はCSS変数を1つも使っていない。接頭辞は hjk / srj+srp / shk / sy / yk / hk の6系統。
   一方で **骨格は6面とも同じ**＝ヒーロー → フォーム → 結果 → 次の一歩。
   ∴ 違うのは接頭辞と値だけで、構造は既に揃っている。型に落とせる。

   ── v0.1 → v0.2 の訂正（🔴 私の誤り）────────────────────────────────
   v0.1 は本文 13px で書いていた。**これはタイポグラフィ正本
   `01_design_docs/DESIGN_TYPOGRAPHY_TOKENS_v1_0.md` 違反**である。
   同書 §2 は本文 16px を「**和文下限・iOS input zoom回避に16px必須＝非交渉**」と明記する。
   🔴 診断面は**フォームを持つ**ので、13px の input は iOS で触るたびに画面が拡大する。
   ∴ v0.2 で全面的に canon へ寄せた:
     スケール 12 / 14 / 16 / 18 / 20 / 24 / 32 のみ
     行間 本文1.75・見出し1.35・注記1.6
     ウェイト 400（本文）/ 500（ラベル）/ 700（強調）のみ。**800・900 は使わない**
     字間 本文0

   ── 3層（portal-sd.css と同じ組み。移行は「足すだけ／消すだけ」で済む形にする）──
   層1 トークン ＝ 持たない。`_cf_ds/cf-tokens.css` が唯一の出どころ。
   層2 互換エイリアス ＝ 各面の既存変数名を層1へ写す。
   層3 部品 ＝ `dg-` 接頭辞。LPは `sd-`、portalは `ps-` が既に使っているので割った。

   🔴 このファイルは :root を持たない。二重定義は必ずズレる。
   🔴 `var(--cf-*)` は必ず既定値つきで書く。トークンが届かない置き方をすると
      `.dg-hero` の紺が消えて【白地に白】が出る（2026-07-31 に実際に出した・比1.05）。
   ============================================================================ */

/* ============================================================================
   層2 互換エイリアス — 各面の既存変数名 → 正本

   🔴 2026-07-31 訂正。**ここに並んでいた7つのうち6つは実在しない変数名だった。**
      本番CSSを grep した実測（陽性対照 `--sr-green` 90件・`--hk-navy` 23件）:
        --sy-primary   11件 🟢 実在
        --hjk-primary   0件 🔴  --shk-primary  0件 🔴  --hk-primary   0件 🔴
        --srp-primary   0件 🔴  --srj-primary  0件 🔴  --yk-primary   0件 🔴
      **面の変数名を確かめずに接頭辞から推測して書いた**もので、定義しても誰も読まない。
      実在する名前は 法人化＝`--hk-navy`/`--hk-navy-d`、SR2面＝`--sr-*`（サイト共通）。
      商圏・補助金は primary 系の変数を**そもそも持たない**（色を直に書いている）。

   ∴ 実在するものだけ残す。**各面固有の写し替えは、その面の bridge/*.css で行う**
      （houjinka が既にその形＝`--hk-line` `--hk-bg` などを bridge 側で写している）。
   ============================================================================ */
.dg-root{
  --sy-primary:  var(--cf-primary,#103070);   /* 採用＝実在を確認済（11件） */
}

/* ============================================================================
   層3 部品 — 数値はすべて canon（DESIGN_TYPOGRAPHY_TOKENS_v1_0）
   ============================================================================ */

.dg-root{
  font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",sans-serif;
  font-size:16px; line-height:1.75; font-weight:400; letter-spacing:0;
  color:var(--cf-body,#333A45); background:var(--cf-page,#F7F9FC);
  -webkit-font-smoothing:antialiased;
}
.dg-wrap{max-width:960px;margin:0 auto;padding:0 20px}

/* ── ヒーロー ─────────────────────────────────────────────
   🔴 紺の上に白いカードを置かない。地が紺の節では中の文字色を必ず自前で持たせる。 */
.dg-hero{background:var(--cf-primary,#103070);color:#fff;padding:40px 0 34px}
.dg-hero .dg-eyebrow{font-size:14px;font-weight:500;color:#CFE0FF;line-height:1.6;margin:0 0 8px}
/* 大見出しだけ clamp で縮めてよい（canon §3）。本文は縮めない。 */
.dg-hero h1{font-size:clamp(24px,5vw,32px);font-weight:700;line-height:1.35;margin:0 0 10px;color:#fff;letter-spacing:-.01em}
.dg-hero p{font-size:16px;line-height:1.75;margin:0;color:#DCE6F7;max-width:60ch}
.dg-hero .dg-sv{display:inline-block;margin-top:14px;font-size:14px;line-height:1.6;color:#fff;
  background:rgba(255,255,255,.20);border-radius:14px;padding:3px 12px}

/* ── フォーム ───────────────────────────────────────────
   🔴 input の font-size は 16px から下げない。下げると iOS で画面が拡大する。 */
.dg-form-card{background:#fff;border:1px solid var(--cf-line,#E2E7F0);border-radius:14px;
  padding:22px 24px;margin:-20px auto 24px;max-width:960px;position:relative}
.dg-field{margin-bottom:16px}
.dg-field > label{display:block;font-size:14px;font-weight:500;color:var(--cf-ink,#1A1A1A);line-height:1.6;margin-bottom:6px}
.dg-field .dg-help{font-size:12px;line-height:1.6;color:var(--cf-muted,#5F6B7A);margin-top:5px}
.dg-field input,.dg-field select,.dg-field textarea{
  width:100%;font-family:inherit;font-size:16px;line-height:1.75;font-weight:400;color:var(--cf-ink,#1A1A1A);
  background:#fff;border:1px solid var(--cf-line,#E2E7F0);border-radius:10px;padding:10px 12px}
.dg-field input:focus-visible,.dg-field select:focus-visible,
.dg-actions button:focus-visible,.dg-actions a:focus-visible{
  outline:none;box-shadow:0 0 0 3px rgba(48,80,160,.28)}
.dg-actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:18px}

/* ── ボタン ───────────────────────────────────────────── */
.dg-btn{display:inline-block;border-radius:10px;padding:10px 20px;font-size:16px;line-height:1.6;
  font-weight:500;border:1px solid transparent;font-family:inherit;cursor:pointer;
  white-space:nowrap;text-decoration:none}
.dg-btn-p{background:var(--cf-secondary,#3050A0);color:#fff}
.dg-btn-p:hover{background:var(--cf-primary,#103070);text-decoration:none}
.dg-btn-s{background:#fff;color:var(--cf-secondary,#3050A0);border-color:var(--cf-line,#E2E7F0)}
.dg-btn-s:hover{background:#EAF0FB;text-decoration:none}
.dg-btn.dg-sm{font-size:14px;padding:8px 16px}

/* ── 結果 ─────────────────────────────────────────── */
.dg-result{background:#fff;border:1px solid var(--cf-line,#E2E7F0);border-radius:14px;padding:22px 24px;margin-bottom:20px}
.dg-result > h2{font-size:20px;font-weight:700;color:var(--cf-ink,#1A1A1A);line-height:1.35;margin:0 0 14px}
.dg-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin-bottom:18px}
.dg-metric{border:1px solid var(--cf-line,#E2E7F0);border-radius:12px;padding:14px 16px;background:#FBFCFE}
.dg-metric .k{font-size:14px;line-height:1.6;color:var(--cf-muted,#5F6B7A);margin-bottom:4px}
.dg-metric .v{font-size:24px;font-weight:700;color:var(--cf-primary,#103070);line-height:1.35;font-variant-numeric:tabular-nums}
.dg-metric .u{font-size:14px;color:var(--cf-muted,#5F6B7A);margin-left:4px;font-weight:400}
/* 結論カード。左辺のトーン帯は法人化比較で採ったかたち */
.dg-verdict{border:1px solid var(--cf-line,#E2E7F0);border-left:4px solid var(--cf-secondary,#3050A0);
  border-radius:12px;padding:16px 18px;background:#FBFCFE}
.dg-verdict h3{font-size:18px;font-weight:700;color:var(--cf-ink,#1A1A1A);line-height:1.35;margin:0 0 6px}
.dg-verdict p{margin:0;font-size:16px;line-height:1.75}

/* ── 次の一歩 ───────────────────────────────────────── */
.dg-next{margin-bottom:20px}
.dg-next > h2{font-size:14px;font-weight:500;color:var(--cf-muted,#5F6B7A);line-height:1.6;margin:0 0 8px}
.dg-next-list{background:#fff;border:1px solid var(--cf-line,#E2E7F0);border-radius:14px;overflow:hidden}
.dg-next-item{display:flex;align-items:center;gap:16px;padding:15px 18px;border-top:1px solid var(--cf-line,#E2E7F0)}
.dg-next-item:first-child{border-top:none}
.dg-next-item .m{flex:1;min-width:0}
.dg-next-item .nm{font-size:16px;font-weight:500;color:var(--cf-ink,#1A1A1A);line-height:1.6}
.dg-next-item .ds{font-size:14px;color:var(--cf-body,#333A45);line-height:1.6}

/* ── 状態タグ。portal と同じ語彙・同じ色 ───────────────────
   ★方針＝prep と locked を同じ灰色で描かない。
      灰は「作っていない」だけに使い、開く先があるものは青で立てる。 */
.dg-tag{display:inline-block;font-size:12px;font-weight:500;line-height:1.6;border-radius:10px;
  padding:1px 9px;margin-left:9px;white-space:nowrap;vertical-align:1px}
.dg-tag-save{background:#EAF0FB;color:var(--cf-primary,#103070)}
.dg-prep{font-size:14px;line-height:1.6;color:#556070;border:1px solid var(--cf-line,#E2E7F0);
  border-radius:10px;padding:8px 16px;background:#EDEFF3;white-space:nowrap;display:inline-block}
/* 🔴 白抜きの灰ピルを作らない。2026-07-31、4ロボLPで白文字 on 灰 ＝ 比 2.57 が本番に出ていた。 */

/* ── CF-IDの帯。portal.shindan-robot.jp の型に合わせる（方針）──────────── */
.dg-cfid{background:#EAF0FB;border:1px solid #D3E0F5;border-radius:14px;padding:18px 20px;margin-bottom:20px}
.dg-cfid h2{font-size:18px;font-weight:700;color:var(--cf-primary,#103070);line-height:1.35;margin:0 0 6px}
.dg-cfid p{margin:0;font-size:16px;line-height:1.75;color:var(--cf-body,#333A45)}
.dg-cfid ul{margin:10px 0 0;padding-left:1.2em;font-size:16px;line-height:1.75;color:var(--cf-body,#333A45)}
.dg-cfid li{margin-bottom:2px}

/* ── 注記と法務フッター ──────────────────────────────────
   🔴 助成金診断と役員報酬シミュレーションには法務フッターが無い（2026-07-31 実測）。
      型に入れて塞ぐ。 */
.dg-note{font-size:12px;color:var(--cf-muted,#5F6B7A);line-height:1.6;margin:16px 0 0}
.dg-legal{background:var(--cf-primary-dark,#0C2350);color:#C9D4DF;margin-top:36px;padding:28px 20px}
.dg-legal .in{max-width:960px;margin:0 auto;text-align:center}
.dg-legal .ent{color:#fff;font-weight:500;font-size:16px;line-height:1.6;margin-bottom:6px}
.dg-legal nav{margin:12px 0;display:flex;gap:18px;justify-content:center;flex-wrap:wrap;font-size:14px;line-height:1.6}
.dg-legal a{color:#9FB3C6;text-decoration:none}
.dg-legal a:hover{color:#fff;text-decoration:underline}
.dg-legal .disc{max-width:720px;margin:12px auto 0;font-size:12px;color:#8092A4;line-height:1.6}

/* ── 狭い画面 ───────────────────────────────────────────
   🔴 本文は 16px のまま。縮めてよいのは大見出しだけ（canon §3）。 */
@media(max-width:640px){
  .dg-wrap{padding:0 14px}
  .dg-hero{padding:30px 0 26px}
  .dg-form-card{padding:18px 16px;margin:-16px 14px 20px}
  .dg-result{padding:18px 16px}
  .dg-next-item{flex-wrap:wrap;gap:10px}
  .dg-tag{margin-left:0;margin-top:4px}
}

/* ── ダークモード ───────────────────────────────────────
   🔴 診断面は data-theme を出さない。cf-tokens.css の
      @media(prefers-color-scheme:dark) がそのまま当たると地だけ暗転して
      文字色が追随せず読めなくなる（2026-07-29 に4ロボLPで実際に起きた）。
      ∴ ライト値を再宣言して条件付き上書きを無効化する。値は変えていない。 */
@media (prefers-color-scheme: dark){
  .dg-root{
    --cf-page:#F7F9FC; --cf-line:#E2E7F0; --cf-ink:#1A1A1A;
    --cf-body:#333A45; --cf-muted:#5F6B7A; --cf-bg-soft:#F4F6FA;
    color:#333A45; background:#F7F9FC;
  }
}

/* ===== 橋渡し層（joseikin） ===== */
/* ============================================================================
   bridge/joseikin.css — 助成金診断を診断面デザインシステムへ寄せる橋渡し層（5本目）
   2026-07-31 ★方針＝全ての診断メニューでデザインを統一・型化する。

   🔴 クラス名は変えない。既存セレクタへ値を流し込む。HTMLは `<link>` 1行だけ増える。
   🔴 セレクタは本番の HTML/CSS/JS の実在一覧から取った。ビルダーが実在照合で止める。

   ★色は SR緑のまま（2026-07-31 裁定）。
     この面は `sr.crossface.co.jp` に在り、`sr_services_common/sr-common.css` を
     **SRサイト全体と共有**している。ここだけ CF青にすると同じサイトの他ページから浮く。
     ∴ 寄せるのは**型の中身**（タイポグラフィ・余白・影・入力欄・コントラスト）だけ。
     🔴 正本 `shindan-sd.css` 層2 の `--srj-primary` / `--srp-primary` は
        **実在しない変数名**だった（本番CSSを grep して 0件・対照 `--sr-green` は 89件）。
        推測で書かれた別名なので、この面では使わない。層2側は別途訂正する。

   ── 実測した逸脱（本番・1280幅・結果表示まで）──────────────────────────
     canon外サイズ  8件 ＝ .srp-h2 @31 ×5 ／ .srp-hero-title @45 ／ small @13 ×2
     canon外ウェイト 237件 ＝ w800 ×231（card-meta-icon 141・card-theme 40・card-title 40 ほか）
                              w600 ×5（.srp-btn）／ w900 ×1（strong）
     影 57件 ＝ .srj-form-card / .srj-form-summary / .srj-card / .srj-step / .srj-pain li / .srj-faq details
     入力欄 13.33px ×1（`#srjKw`）🔴 iOS で触るたび画面が拡大する
     低コントラスト 84件（16種）＝テーマ色が淡色地・白抜きの両方で 4.5:1 を割る
   ============================================================================ */

/* ============================================================================
   ① コントラスト — 色相は SR/テーマのまま、明度だけ落として 4.5:1 を満たす
   白地でも淡色地でも、白抜きでも成り立つ値を計算して置いた（比は白地での実測）。
   🔴 4色（b/g/h/jgrants）は元から基準を満たすので**触っていない**。
   ============================================================================ */
body{
  --srj-theme-a: #2B68D6;   /* 元 #2D6CDF  4.86 → 5.19 */
  --srj-theme-c: #BF4300;   /* 元 #E65100  3.79 → 5.22 */
  --srj-theme-d: #996000;   /* 元 #FFA000  2.04 → 5.21 ← 最も低かった */
  --srj-theme-e: #317C34;   /* 元 #388E3C  4.12 → 5.20 */
  --srj-theme-f: #007984;   /* 元 #00838F  4.52 → 5.19 */
  --rc:          #2D70B3;   /* 元 #378ADD  3.59 → 5.16 */
  --sr-green-light: #177B5B;/* 元 #1D9E75  3.39 → 5.21（主ボタンの白抜き） */
}
/* 🔴 変数を経由せず**直値で色を持っている**規則。body の上書きでは届かないので個別に当てる。
      面の側が `.srj-disclaimer .srj-disclaimer-src`（0,2,0）で書いているので、
      こちらも同じ形にしないと負ける（[[css-parent-element-selector-beats-new-single-class]]）。 */
.srj-disclaimer .srj-disclaimer-src{ color:#727780 }        /* 元 #9CA3AF  2.54 → 4.50 */
.srj-badge-sme{ color:#C54500; border-color:#C54500 }       /* 元 #E65100 on #FFF3E0  3.46 → 4.53 */
.srj-badge-accept{ background:#38863B; border-color:#38863B }/* 白文字で 3.30 → 4.52 */
/* .srj-badge-industry（#C2185B on #FCE4EC＝4.88）と .srj-badge-both（var 経由）は
   元から基準を満たすので触っていない。 */

/* 🔴 `--rc` を**要素側で直値**に固定している箇所は body の上書きが届かない（実測）:
      `.srj-step-1 { --rc:#378ADD }`（joseikin.css:441）
      白抜きバッジ 3.59 ／ 金額 3.59 の両方がこれ由来。同じ形で後から書いて勝つ。 */
.srj-step-1{ --rc:#2D70B3 }   /* 元 #378ADD  3.59 → 5.16 */

/* ============================================================================
   ② タイポグラフィを canon へ
   スケール 12/14/16/18/20/24/32・ウェイト 400/500/700 のみ
   🔴 本文16pxは非交渉（iOS の input zoom 回避）。モバイルでも縮めない。
   ============================================================================ */
/* 🔴 特異度を実測して合わせた。競合は2本あり、単一クラスでは**どちらにも負ける**：
      `.srj-hero .srp-hero-title`（0,2,0・joseikin.css:47）
      `section.srp-hero .srp-hero-title`（0,2,1・sr-common.css:167）
   ∴ こちらは (0,2,2) で書く。 */
section.srp-hero h1.srp-hero-title{
  font-size:clamp(24px,5vw,32px); font-weight:700; line-height:1.35; letter-spacing:-.01em }
.srp-h2{ font-size:20px; font-weight:700; line-height:1.35 }
/* 🔴 入れ物は推測せず祖先チェーンを実測した＝`h3.srj-results-h3 > small > span` */
h3.srj-results-h3 small, h3.srj-results-h3 small span{ font-size:12px; line-height:1.6; font-weight:400 }

/* ウェイト 800/900 → 700 */
.srj-form-label, .srj-form-h2, .srj-form-submit,
.srj-step-badge, .srj-step-title, .srj-step-cost,
.srj-card-title, .srj-card-theme, .srj-card-meta-icon,
.srj-results-h3, strong{ font-weight:700 }
/* .srp-btn は 600 だった。型のボタンは 700。 */
.srp-btn{ font-weight:700 }

/* ============================================================================
   ③ 入力欄 — 16px 未満を作らない
   🔴 `#srjKw` が 13.33px だった。iOS はこれを触ると画面を拡大する。
   ============================================================================ */
.srj-form-card input, .srj-form-card select, .srj-form-card textarea,
.srj-results-sort select, #srjKw{ font-size:16px; line-height:1.75 }

/* ============================================================================
   ④ 絵文字撤去の後始末 — 空になった入れ物を畳む（2026-07-31・ボス指示）
   他4面と同じ方式＝**文字だけ空にして要素は残す**（JSの構造を触らない）。
   🔴 畳まないと余白だけが残ることを実測で確認:
        .srj-card-meta-row は `display:flex; gap:6px`  → 空でも **6px の隙間**
        .srj-state-icon    は `margin-bottom:8px`      → 空でも **8px**
        .srj-step-icon     は `margin-bottom:4px`      → 空でも **4px**
   ============================================================================ */
.srj-card-meta-icon:empty, .srj-state-icon:empty, .srj-step-icon:empty{ display:none }

/* ============================================================================
   ⑤ jGrants 補助金の節（2026-07-31 結線）— 新設した2要素だけ型に載せる
   面のCSSには `.sec-jgrants` `.is-jgrants` の色（#1565C0）が**最初から在った**ので
   色は触らない。器の文字だけ canon に合わせる。
   ============================================================================ */
.srj-jg-lead{ font-size:16px; line-height:1.75; color:var(--cf-body,#333A45); margin:0 0 14px }
.srj-jg-attr{ font-size:12px; line-height:1.6; color:var(--cf-muted,#5F6B7A); margin:14px 0 0 }

/* ============================================================================
   ⑤ 面（カード・枠）を型へ — 影は型が持たない
   🔴 `li` `details` を裸で書くと広すぎる。実測した親は `.srj-pain` と `.srj-faq`。
   ============================================================================ */
.srj-form-card, .srj-form-summary, .srj-card, .srj-step,
.srj-pain li, .srj-faq details{
  box-shadow:none;
  border:1px solid var(--cf-line,#E2E7F0);
  border-radius:12px;
}