:root{--fg:#1a1d21;--sub:#5f6772;--line:#e3e6ea;--acc:#0b6e4f;--bg:#fff;--soft:#f6f8f9;
/* ★文字サイズは 4 段しか無い★（BOSS 2026-08-10 で命名。2026-08-09 に 31 種類 → 3 段へ
   畳んだものの、段に名前が無かったので「これはどの段か」を人が毎回判断していた）。
   読者にとって大きさは【その文の役割】の合図なので、種類が増えるほど合図として働かない。
     H1 = ページの題（1 ページに 1 つ）
     H2 = 節の見出し
     P1 = 本文 — 項目名・値・短い要約（要約はここで太字にする）
     P2 = 細部 — 長い説明の地の文（灰色）・タグ・注記・出典・方式タブの中身すべて
   ★素の値を書かない★: font-size には必ずこの 4 変数のどれかを使う（考卷が見張る）。
   ★単位は rem に統一★: px を混ぜると、利用者が既定の文字サイズを変えたときに
   段の【相対関係が反転】する（大きくしたのに注記だけ据え置き、など）。 */
--fz-h1:1.35rem;--fz-h2:1.05rem;--fz-p1:1rem;--fz-p2:.8rem;
/* ★LOGO の箱の中だけは 4 段の外を使ってよい★（BOSS 2026-08-12「LOGO内特殊」）— 箱は 72px の
   固定枠で、入る字数が文字ごとに違うため、段を 1 つに決めると必ずどこかが溢れるか小さすぎる。
   ★それでも素の値は書かない★: 段に名前（lgs1〜lgs4）を付け、rem で、大小の順序を固定する。
   どの段になるかは logoStep() が【一番長い行の幅】から決める（描画側で目分量にしない）。 */
--fz-lgs1:.8rem;--fz-lgs2:.68rem;--fz-lgs3:.58rem;--fz-lgs4:.5rem}
/* ★OS による字の自動拡大を止める（BOSS 2026-08-20 iPhone 報告）★ — 既定値 auto の下では、
   iOS Safari は【視口よりはるかに広い塊】の中の字を独自に大きくする。能力表 .captbl は
   min-width:640px かつ nowrap なので 375px の画面では 1261px の塊になり（確認済み）、
   出典リンク .ev-src だけが P2 を超えて描かれていた。隣の札 .ctag は padding を持つ
   小箱として扱われ拡大を免れるため、★同じ行の中で大小が食い違う★という形で出る。
   上の 4 段（H1/H2/P1/P2）が字の大きさの唯一の答えであることを、OS に対しても宣言する。
   ★100% は【自動拡大だけ】を止める値★ — 利用者自身の文字拡大・ピンチ操作は従来どおり
   効く（none は操作そのものを殺すので使わない）。 */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
*{box-sizing:border-box}body{margin:0;font-family:"Hiragino Sans","Noto Sans JP",system-ui,sans-serif;color:var(--fg);background:var(--bg);line-height:1.65}
header{border-bottom:1px solid var(--line);padding:14px 20px;display:flex;gap:12px;align-items:baseline}
/* ★サイト名は折らない★（BOSS 実機 2026-08-14・iPhone）— 「IT連携マッ／プ」と割れていた。
   名前は読者の視覚記憶そのもので、途中で折れると別の語に見える（LOGO_TEXT_CSS と同じ理屈）。
   ★折ってよいのは右の灰色の説明文だけ★ — こちらは文章なので、どこで折れても意味は変わらない。
   flex の子は既定で min-width:auto ではなく縮むので、名前側に flex:none を明示する。 */
header a{color:var(--fg);text-decoration:none;font-weight:700;white-space:nowrap;flex:none}
header .sub{color:var(--sub);font-size:var(--fz-p2);min-width:0}
main{max-width:1060px;margin:0 auto;padding:24px 20px;display:grid;grid-template-columns:1fr 380px;gap:28px}
/* ★#599: main の子は grid item — 既定 min-width:auto が中身の min-content を主張し、幅を宣言した表
   （captbl-ev の width:Nem 等）が section→track を押し広げて【頁全体】が横に伸びる（1280px 視口で
   document 1392px を確認、.cap-scroll は自分も広がるので滑らない）。min-width:0 で track が容器に
   収まり、scroll は .cap-scroll / .pf-scroll の層に戻る。#homeboard（2026-08-03）と同族同方。
   ★この注釈は <style> ごと全頁に出荷される★ — #562 の禁語（じっそく 等）をここに書くと語彙の
   考卷が全頁赤になる（2026-08-19 に一度やった）。 */
main>*{min-width:0}
@media(max-width:840px){main{grid-template-columns:1fr}}
h1{font-size:var(--fz-h1);margin:.2em 0}h2{font-size:var(--fz-h2);border-left:3px solid var(--acc);padding-left:8px}
/* ★h3 を明示する★（2026-08-09 実機）— 指定しないとブラウザ既定の 1.17em が効き、
   h3(18.7px) が h2(16.8px) より【大きく】なっていた。見出しは階層の合図なので、
   下位が上位より大きいのは合図としてこわれている。本文と同じ 1rem＋太字で下位を示す。 */
h3{font-size:var(--fz-p1)}
/* 既定の等幅フォントは 13px に落ちる（UA 既定）— 3 段の外に 4 つ目の大きさを作らせない */
pre,code,kbd,samp{font-size:var(--fz-p1)}
table{border-collapse:collapse;width:100%}td,th{border-bottom:1px solid var(--line);padding:7px 8px;text-align:left;vertical-align:top}
.badge{display:inline-block;padding:1px 8px;border-radius:9px;font-size:var(--fz-p2);background:var(--soft);border:1px solid var(--line)}
.src{color:var(--sub);font-size:var(--fz-p2);margin-top:14px}
.miss{font-size:var(--fz-p2);color:var(--sub);background:var(--soft);border:1px solid var(--line);border-radius:8px;padding:8px 10px;margin:6px 0 2px}
.mverd{list-style:none;padding:0;margin:8px 0 0}.mverd>li{margin:0 0 6px}.mverd>li.src{margin-top:0}
details>summary{cursor:pointer;font-size:var(--fz-p2);color:var(--acc);margin-top:4px}
.search{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:8px;font-size:var(--fz-p1);margin-bottom:10px}
.cat-block h2{margin:14px 0 6px}.tags{display:flex;flex-wrap:wrap;gap:6px}
.tag{display:inline-block;padding:4px 11px;border:1px solid var(--line);border-radius:15px;text-decoration:none;color:var(--fg);font-size:var(--fz-p2);background:var(--soft)}
.tag:hover{border-color:var(--acc);color:var(--acc)}
.hit{display:block;padding:9px 10px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--fg)}
.hit:hover{background:var(--soft)}.hit .cat{color:var(--sub);font-size:var(--fz-p2);margin-left:8px}
.chat{border:1px solid var(--line);border-radius:12px;display:flex;flex-direction:column;height:520px;position:sticky;top:16px}
.chat h3{margin:0;padding:10px 14px;border-bottom:1px solid var(--line);font-size:var(--fz-p1);display:flex;justify-content:space-between;align-items:center;gap:8px}
.eph{font-size:var(--fz-p2);color:var(--sub);font-weight:400;display:flex;align-items:center;gap:4px;cursor:pointer;white-space:nowrap}
.eph input{margin:0;cursor:pointer}
.log{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:10px}
.msg{max-width:88%;padding:8px 11px;border-radius:10px;white-space:pre-wrap;font-size:var(--fz-p2)}
.me{align-self:flex-end;background:var(--acc);color:#fff}.ai{align-self:flex-start;background:var(--soft)}
.ai.notice{border-left:3px solid var(--acc)}
.ai.think{color:var(--sub);font-size:var(--fz-p2);border-left:2px dashed var(--line);background:transparent;max-height:120px;overflow-y:auto}
.ai.think.done{max-height:44px;opacity:.7}
.ipt{display:flex;gap:8px;padding:10px;border-top:1px solid var(--line)}
.ipt textarea{flex:1;resize:none;border:1px solid var(--line);border-radius:8px;padding:8px;font-family:inherit;font-size:var(--fz-p2);height:44px}
.ipt button{border:0;background:var(--acc);color:#fff;border-radius:8px;padding:0 16px;font-size:var(--fz-p2);cursor:pointer}
.ipt button:disabled{opacity:.5}
#reset{border:1px solid var(--line);background:transparent;color:var(--sub);border-radius:8px;padding:2px 8px;font-size:var(--fz-p2);cursor:pointer;white-space:nowrap}
.choices{display:flex;flex-wrap:wrap;gap:6px;align-self:flex-start}
.choice{border:1px solid var(--acc);background:transparent;color:var(--acc);border-radius:16px;padding:5px 12px;font-size:var(--fz-p2);cursor:pointer}
.choice:hover{background:var(--acc);color:#fff}
/* #654 §7 v2.1 — HINT FAB（右下）: hover=mini / click=full。旧 chat aside+pill を置換。
   ★mini の高さ=内容の高さ（固定 height を与えない — clip 事故を踏まない, #654 [D:clip]）★ */
#hintfab{position:fixed;right:18px;bottom:18px;z-index:49;width:52px;height:52px;border:0;border-radius:50%;background:var(--acc);color:#fff;font-size:var(--fz-h1);cursor:pointer;box-shadow:0 6px 20px rgba(11,110,79,.35);display:flex;align-items:center;justify-content:center}
#hintfab.hid{display:none}
.hmini{display:none;position:fixed;right:18px;bottom:80px;z-index:50;width:min(340px,calc(100vw - 36px));background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 40px rgba(0,0,0,.18);overflow:hidden}
.hmini.show{display:block}
.hfull{display:none;position:fixed;right:18px;bottom:18px;z-index:51;width:min(400px,calc(100vw - 36px));height:min(600px,82vh);background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 16px 50px rgba(0,0,0,.22);flex-direction:column;overflow:hidden}
.hfull.show{display:flex}
.hhead{display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid var(--line);font-weight:700;font-size:var(--fz-p1)}
.hhead .sp{flex:1}
.hhead button{border:1px solid var(--line);background:transparent;color:var(--sub);border-radius:7px;padding:3px 9px;font-size:var(--fz-p2);cursor:pointer;white-space:nowrap}
/* ★状態の色相はここ 1 度だけ★（#670 A・BOSS 2026-09-03「bar が黄ならタグも同じ黄」）— strip の
   タグ（.hax）と 12 マス bar（.stb）が同じ変数を引く。値を二か所に書くと必ず割れる（以前は
   タグ＝濃色 6 種・bar＝淡色 6 種・一覧の bar＝また別の 6 種、の三本立てだった）。 */
.hstrip,.stb{--st-ok:#19a974;--st-busy:#f0b429;--st-partial:#f2711c;--st-down:#d63b3b;--st-maint:#8069d6;--st-unk:#cfd3d8}
/* ★大きい字は【頁の面】だけ★（#670 D → BOSS 2026-09-04 で範囲を訂正）— strip の部品は
   status 頁と面2（chat overlay）で同一だが、器の大きさが違う: 頁は本文の一部、面2 は 340px の
   小窓。#670 D は「一段大きく」を部品の既定に書いてしまったので、小窓でもタグが大きくなり、
   サービス側 が次の行へ折れた（BOSS 実機）。⟹ ★既定は小さい方（P2・面2 の元の姿）で、
   拡大は .st-axis（頁の面）に着せる★。同じ部品に二つの器があるときは、器の側が寸法を持つ。 */
.hstrip{display:flex;align-items:center;gap:4px;padding:8px 10px;font-size:var(--fz-p2);flex-wrap:wrap}
.hax{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:12px;cursor:default;font-weight:700}
.haxi{cursor:default}   /* #3258: 軸アイコンはタグの外・素の文字色（状態色はタグだけが運ぶ） */
.hax.s-ok{background:var(--st-ok);color:#fff}.hax.s-warn{background:var(--st-partial);color:var(--fg)}.hax.s-down{background:var(--st-down);color:#fff}.hax.s-maint{background:var(--st-maint);color:#fff}.hax.s-unk{background:var(--st-unk);color:var(--fg)}.hax.s-busy{background:var(--st-busy);color:var(--fg)}
.hsep{color:var(--line);font-weight:400}
/* BOSS 2026-09-03: bar rides the strip row（サービス側 の右・[回線テスト] の左）— 幅が足りなければ
   .hbarwrap ごと次の行へ折れ、[回線テスト] はその行の右端に残る（hstrip は flex-wrap）。
   #670 C: bar は一覧の各行と同じ部品（固定 9px × 12）なので wrap は伸縮しない。 */
.hbarwrap{display:inline-flex;align-items:center;gap:6px}
.hbarlabel{font-size:var(--fz-p2);color:var(--sub);white-space:nowrap}
/* #662: [回線テスト]・3 行の軸詳細・テスト結果（strip と同居、全部 P2）。
   #670 E: [回線テスト] は緑地（ヒント FAB と同じ --acc — 新しい色を作らない） */
.hnettest{margin-left:auto;border:1px solid var(--acc);background:var(--acc);color:#fff;border-radius:12px;padding:2px 10px;font-size:var(--fz-p2);cursor:pointer;white-space:nowrap}
.hnettest:hover{opacity:.88}.hnettest:disabled{opacity:.6;cursor:default}
.haxlines{padding:0 10px 4px}.haxline{font-size:var(--fz-p2);color:var(--fg);white-space:pre-wrap}
.hnetres{padding:2px 10px 6px;font-size:var(--fz-p2);color:var(--sub)}
.hnetres a{color:var(--acc)}
.st-axis .hstrip{padding-left:0;padding-right:0;font-size:var(--fz-p1)}
.st-hintline{font-size:var(--fz-p2)}
.st-hintline button{border:1px solid var(--line);background:transparent;color:var(--acc);border-radius:12px;padding:2px 10px;font-size:var(--fz-p2);cursor:pointer}
.hbar{display:inline-flex}
/* ★12 マス bar（.stb）の唯一の CSS★（#670 C）— markup は shared/statusBar.ts の stbHtml() 一本。
   一覧の各行・/status/<slug> の strip・面2 の strip・7 日／14 時間の壁が全部これを着る。
   上下 2 段（BOSS 2026-08-29）: 上段＝我々の観測（class の色）、下段＝ベンダー申告（--vs）か
   告知台帳の窓（.dual＝紫）。状態の色相は上の変数だけ — ここに値は書かない。 */
.stb{display:inline-flex;gap:2px;vertical-align:middle}
.stb i{display:inline-block;width:9px;height:18px;border-radius:2px;background-color:var(--st-unk)}
.stb-ok{background-color:var(--st-ok)!important}.stb-busy{background-color:var(--st-busy)!important}
.stb-partial{background-color:var(--st-partial)!important}.stb-down{background-color:var(--st-down)!important}
.stb-maint{background-color:var(--st-maint)!important}.stb-unk{background-color:var(--st-unk)!important}
.stb-none{background:transparent!important;box-shadow:inset 0 0 0 1px var(--line)}
.stb i.dual{background-image:linear-gradient(to bottom,transparent 0 50%,var(--st-maint) 50% 100%)}
.stb i.vrow{background-image:linear-gradient(to bottom,transparent 0 50%,var(--vs) 50% 100%)}
.hcard{padding:6px 12px 12px;font-size:var(--fz-p2);color:var(--fg);white-space:pre-wrap}
.hfull .log{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:10px}
.hfoot{padding:6px 12px;font-size:var(--fz-p2);color:var(--sub);border-top:1px solid var(--line);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.hfoot .sp{flex:1}
.hfoot button{border:0;background:transparent;color:var(--acc);text-decoration:underline;cursor:pointer;font:inherit;padding:0}
.hresolve{display:flex;gap:8px;align-self:flex-start;margin-top:2px}
.hthumbs{display:flex;gap:6px;align-self:flex-start;margin-top:2px;flex-wrap:wrap;align-items:center}
.hthumbs span{font-size:var(--fz-p2);color:var(--sub)}
.hthumbs button{border:1px solid var(--line);background:transparent;border-radius:14px;padding:2px 10px;cursor:pointer;font-size:var(--fz-p2)}
.hthumbs button:hover{border-color:var(--acc);color:var(--acc)}
.hthumbs button:disabled{opacity:.6;cursor:default}
.hresolve button{border:1px solid var(--line);background:transparent;border-radius:14px;padding:3px 14px;cursor:pointer;font-size:var(--fz-p2)}
.hresolve button:hover{border-color:var(--acc);color:var(--acc)}
.foot{grid-column:1/-1;color:var(--sub);font-size:var(--fz-p2);border-top:1px solid var(--line);padding-top:12px;margin-top:8px}


:root{--sa:#1a5fb4;--sb:#7b2d8e}
main{grid-template-columns:1fr}
.tag.live{border-color:var(--acc);box-shadow:0 0 0 1px var(--acc) inset;font-weight:700}
.legend{color:var(--sub);font-size:var(--fz-p2);margin:8px 0 16px}
/* 対のページの見出しは、そのまま各システムの個票への入口 (BOSS 2026-08-05) */
.h1sys{color:inherit;text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:4px}
/* ★方式の図は「線の形」を読ませる★ (BOSS 手描き 2026-08-05): 説明文は線に載せず脇の凡例へ。
   狭い画面では図の下に回り込む。 */
.flowwrap{margin:10px 0}
/* ★方式の図の線も既定で静止★ — この図は対のページ（MAP_CSS だけ）に出るので、規則もここに置く。
   HOME_CSS に書くと、盤面のあるページでしか動かない図になる。 */
.flowwrap.live .flowmap path[stroke-dasharray]{animation:bdash 40s linear infinite}
@keyframes bdash{to{stroke-dashoffset:-1000}}
.flowwrap .flowmap{display:block;width:100%;height:auto}
/* ★同じ図を画面幅で出し分ける★ (BOSS 2026-08-05) — 狭い画面で横組みを縮めると、ロゴも文字も
   線も一緒に小さくなって何も読めない。二枚出して CSS で切り替える（JS のリサイズ再描画は
   ちらつくし、印刷や JS 無効でどちらも出ない事故がある）。★中身の定義は一つ★で、違うのは座標だけ。 */
.flowwrap .flow-v{display:none}
.flowwrap .flow-v{max-width:400px;margin:0 auto}
@media(max-width:700px){
  .flowwrap .flow-h{display:none}
  .flowwrap .flow-v{display:block}
}
.flowkey{flex:1 1 240px;min-width:220px;list-style:none;padding:0;margin:0;font-size:var(--fz-p2)}
.flowkey li{display:flex;align-items:baseline;gap:7px;margin:7px 0;flex-wrap:wrap}
/* ★連携ツールの表も個票と同じ読み方★ (#535): ①② が既定、③④ は行ごとのボタンで開く。
   以前は長い価格原文が全行ぶん既定で居座り、要点が読めなかった。 */
.conntbl td.conn-a{width:30%}
.conntbl td.conn-b{color:var(--sub)}
.conntbl .conn-c{display:none;border-top:1px dashed var(--line);margin-top:8px;padding-top:8px}
.conntbl tr.rexp .conn-c{display:block}
.conntbl .pf-rexp{display:inline-block;border:1px solid var(--line);background:transparent;color:var(--acc);
  border-radius:7px;padding:1px 9px;font-size:var(--fz-p2);cursor:pointer;margin-top:6px}
.conntbl .ctags{margin-top:6px}
.fk-dot{width:16px;height:6px;border-radius:3px;flex:none;transform:translateY(-2px)}
.fk-sub{color:var(--sub);font-size:var(--fz-p2);flex:1 1 100%;margin-left:23px}
.h1sys:hover{text-decoration-color:var(--acc)}
/* #535 到達範囲のまとめ。数字は資産から。読み飛ばされない程度に地の文より少しだけ強い箱。 */
.reach{border-left:3px solid #2f6fb5;background:var(--soft);border-radius:0 8px 8px 0;
  padding:10px 14px;margin:10px 0;font-size:var(--fz-p2);line-height:1.8}
.flowmap{width:100%;max-width:760px;display:block;margin:6px auto}
.flowmap text{font-family:inherit}
.band{cursor:pointer}
.mrow th{white-space:nowrap}
.method td,.method th{}
.method .own{background:#f2faf7}
.ownchip{display:inline-block;border:1px solid var(--sub);color:var(--sub);border-radius:9px;padding:0 7px;font-size:var(--fz-p2);margin-left:6px}
.pairtbl th.colh{background:var(--soft)}
.pairtbl td{width:42%}
.pairtbl th{width:16%}
.sidefacts{color:var(--sub);font-size:var(--fz-p2)}
.fieldtag{display:inline-block;background:var(--soft);border:1px solid var(--line);border-radius:14px;padding:2px 10px;margin:2px 3px;font-size:var(--fz-p2);white-space:nowrap}
.fieldtag.shared{border-color:var(--acc);color:var(--acc);background:#f2faf7}
.fieldtag.more{border-style:dashed;color:var(--sub)}
.taggroup{margin:6px 0 14px;line-height:2}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.gated{border:1px dashed var(--line);border-radius:9px;padding:8px 12px;color:var(--sub);font-size:var(--fz-p2);margin-top:8px}
.bizgrp td,.bizgrp th{vertical-align:top}
.bizgrp .hint{color:var(--sub);font-size:var(--fz-p2);font-weight:400;margin-top:3px;line-height:1.5}
.bizgrp .zero{color:var(--sub)}
/* two systems, two colours — used for the column heads, the per-side unit names and the chips
   (BOSS 2026-08-02). Green stays reserved for「両方にある」so the three states never blur. */
.sysA{color:var(--sa)}
.sysB{color:var(--sb)}
.fieldtag.onlyA{border-color:var(--sa);color:var(--sa);background:#f3f7fd}
.fieldtag.onlyB{border-color:var(--sb);color:var(--sb);background:#faf4fd}
.bizgrp details{display:inline-block;margin-left:4px}
.bizgrp summary{cursor:pointer;color:var(--acc);font-size:var(--fz-p2)}
.mblock{border:1px solid var(--line);border-radius:10px;padding:10px 14px;margin:10px 0}
.mblock h3{margin:0 0 2px}
.mblock h4{margin:8px 0 2px;font-size:var(--fz-p1)}
.mblock-na{background:var(--soft)}
.mblock summary{cursor:pointer;color:var(--acc);font-size:var(--fz-p2);margin-top:6px}
.pf-est{color:#8a5a00;background:#fff8e6;border:1px solid #f0dca8;border-radius:8px;padding:5px 9px}
.scopebox{border:1px solid var(--line);border-radius:10px;background:var(--soft);padding:9px 13px;margin:8px 0;font-size:var(--fz-p2)}
.ctxtbl td,.ctxtbl th{}
.ctxtbl td:first-child{white-space:nowrap;font-weight:700}
.rawtags{margin:10px 0}
.rawtags>summary{cursor:pointer;color:var(--sub);font-size:var(--fz-p2)}
/* ★［その他］［連携の詳細と出典］の折りたたみ★ — 押すまで開かない、が JS を要らない形
   （静的配信でもそのまま動く）。見た目は他の details と同じ規則で 1 か所に置く。 */
.foldbox{margin:10px 0;border:1px solid var(--line);border-radius:10px;padding:8px 12px;background:var(--soft)}
.foldbox>summary{cursor:pointer;color:var(--acc);font-size:var(--fz-p2);font-weight:700}
.foldbox[open]>summary{margin-bottom:8px}
.scope-ok{color:var(--acc);font-weight:700}
.itemsnote{font-size:var(--fz-p2);color:var(--sub);line-height:1.7;margin-top:4px;max-width:44em}
.ambig{color:#8a5a00;background:#fff8e6;border:1px solid #f0dca8;border-radius:8px;padding:4px 8px;font-size:var(--fz-p2);margin-top:4px}
.method details summary{cursor:pointer;color:var(--acc);font-size:var(--fz-p2)}
/* ★線の語彙（色・点・凡例）は【線のモデル】側に置く★ (BOSS 実機 2026-08-06)。
   これらは HOME_CSS（盤の版面）の中に在ったため、盤を持たないページ（/lines）では規則が配られず、
   ★方式のタグが白文字・透明背景で消え、凡例も素のテキストになった★。
   同じ方式が表と盤で違う見え方をするのが一番まずいので、色は LINE_COLOR 一箇所から派生させ、
   その規則も盤と表の両方が読む場所に置く。 */
.ldots{display:flex;gap:6px;justify-content:center;margin-top:5px;min-height:9px}
.ldot{width:20px;height:7px;border-radius:4px;border:0;padding:0;cursor:pointer;position:relative;
  transition:transform .15s,box-shadow .15s}
.ldot::after{content:'';position:absolute;left:-5px;right:-5px;top:-9px;bottom:-9px}
.ldot:hover{transform:scaleY(1.6)}
.ldot.on{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--fg)}
.ldot-api{background:#c0392b}.m-api{background:#c0392b}.ldot-csv{background:#b5850b}.m-csv{background:#b5850b}.ldot-fill{background:#0b6e4f}.m-fill{background:#0b6e4f}.ldot-unknown{background:#7c8592}.m-unknown{background:#7c8592}
/* ★1 色 1 行★（BOSS 2026-08-09 実機）— 横並びだと、色によって説明が本文の隣に来たり
   次の行に落ちたりして、どの説明がどの色のものか読者が数えることになる。凡例は
   「色 → 何をすることになるか」の対応表なので、対応が目で追える形（縦一列）が正しい。 */
/* Long explanatory prose is P2 grey — the four-step rule (BOSS 2026-08-10). */
ul.lede{margin:6px 0 10px;padding-left:1.2em;color:var(--sub);font-size:var(--fz-p2)}
ul.lede li{margin:3px 0}
.linekey{display:flex;flex-direction:column;gap:8px;align-items:flex-start;color:var(--sub);font-size:var(--fz-p2);margin:6px 0}
/* ★色の名前ではなく「あなたが何をすることになるか」を凡例に書く★ (BOSS 2026-08-05) */
/* ★One legend entry = ONE line★ (BOSS 2026-08-10): colour, label and explanation sit on the
   same row. As a block the hint wrapped under its label, which made four entries read as
   eight rows and buried the colours. It still wraps on a narrow screen — that is the point
   of letting the line break naturally instead of forcing a break. */
.linekey>span{font-weight:600}
/* Once label and hint share a row, 8px of space alone is a weak boundary in Japanese
   (no word gaps to lean on) — the weight difference is what separates them. */
.linekey .lhint{margin-left:8px;font-size:var(--fz-p2);font-weight:400;opacity:.8}
.linekey .ldot{cursor:default;display:inline-block;vertical-align:middle}
/* 絞り込みの操作列も盤専用ではない（表でも同じ形で使う） */
.boardctl{display:flex;gap:10px;align-items:center;margin:10px 0 0;flex-wrap:wrap}
.boardctl .search{flex:1;min-width:14em;margin:0}
.dim{color:var(--sub);font-size:var(--fz-p2)}

.pftbl th{width:12em;white-space:nowrap;vertical-align:top}
.pftbl td{}
.pf-note{color:var(--sub);font-size:var(--fz-p2);margin:2px 0 0 4px}
.pf-sep{height:6px}
.pf-src{font-size:var(--fz-p2);margin-left:4px}
/* ★事実の隣に見える出所の 1 行★（#495・BOSS 2026-08-18）:
     ［誰が×どう得たか］ 出典（短） (調査日) ほか N 件 ［詳細・原文を読む］
   ★大きさは全画面 P2 で固定★ — 頁ごとに出典の目立ち方が違うと、同じ資料が別の格に見える。
   ★色は部品ごとに持つ★（この器では指定しない）— 器に色を置くと、この中で開く .pf-c の
   本文までその色を継いでしまう（開いた原文が灰色になる）。 */
/* ★頁の頭の「この頁は何でできているか」★（#495）— 題のすぐ下・P2・地の色より薄く。
   本文と同じ大きさで出すと宣言が本文に見え、消すと機械が拾えない。 */
.srcdecl{font-size:var(--fz-p2);color:var(--sub);margin:2px 0 14px;max-width:52em}
.ev-line{font-size:var(--fz-p2);margin-top:6px;line-height:1.9;display:flex;flex-wrap:wrap;align-items:center;gap:2px 6px}
.ev-line>*{vertical-align:middle}
/* ★札は［詳細・原文を読む］と同じ背丈★（BOSS 2026-08-18: 標籤太大→改小）— .ctag 素の
   padding(3px 11px)/radius(14px) は札を釦より大きく見せていた。行の中だけ釦と同尺に。 */
.ev-line .ctag{padding:1px 7px;border-radius:7px}
/* 日付は箱ではなく括弧の素の文字 (2026-08-10) — 器の中では daytag の箱装いを剥がす */
.ev-line .daytag{background:transparent;border:0;padding:0;color:var(--sub)}
.ev-day{color:var(--sub);white-space:nowrap}
.ev-src{margin:0;overflow-wrap:anywhere}
.ev-rest{color:var(--sub);white-space:nowrap}
.ev-line .pf-more,.ev-line .cp-det{margin-left:2px}
/* 開く箱（.pf-c）は flex の行に混ざらず、次の行の全幅へ落ちる */
.ev-line .pf-c{flex:1 1 100%}
/* 地の文の中の URL — 押せることが分かる程度に控えめ（P2 の中なので大きさは継ぐ） */
.pf-inline{overflow-wrap:anywhere}
.pf-kind{display:inline-block;border:1px solid var(--line);border-radius:8px;padding:0 6px;font-size:var(--fz-p2);color:var(--sub);vertical-align:middle;margin-left:4px}
/* ★［system］タグ = 灰色の小さな字（doc 93 §7.5.1-8 v6.2）★ — 合併 view で「どの製品の話か」を
   名指す印。★値そのものより弱く見えなければならない★（値の一部に見えたら、それは名指しでは
   なく値の変更になる）ので、地の色より薄い灰・小さめ・枠は細く。 */
.systag{display:inline-block;border:1px solid var(--line);background:var(--soft);border-radius:7px;
  padding:0 5px;font-size:var(--fz-p2);font-weight:400;color:var(--sub);vertical-align:middle;margin-left:4px;white-space:nowrap}
.pf-kind.pf-measured{border-color:var(--acc);color:var(--acc)}
.pf-kind.pf-editorial{border-style:dashed}
.pf-info{cursor:help;position:relative;margin-left:4px}
.pf-info .pf-pop{display:none;position:absolute;left:1.4em;top:-4px;z-index:40;width:min(340px,72vw);background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 8px 28px rgba(0,0,0,.13);padding:8px 11px;font-size:var(--fz-p2);color:var(--fg);white-space:normal}
.pf-info:hover .pf-pop,.pf-info:focus .pf-pop{display:block}
.pf-state{display:inline-block;border-radius:8px;padding:0 7px;font-size:var(--fz-p2);font-weight:700;vertical-align:middle}
/* 印は /method へ飛ぶ。押せることは分かるが、色は状態の色のまま（下線は hover のみ） */
a.pf-state{text-decoration:none;cursor:help}
a.pf-state:hover{text-decoration:underline}
.pf-closed{background:#fdf0e6;border:1px solid #e8c39b;color:#8a4b12}
.pf-todo{background:var(--soft);border:1px solid var(--line);color:var(--sub)}
.openness{border:1px solid var(--line);border-radius:10px;padding:9px 12px;margin:8px 0 14px;background:var(--soft)}
/* 尽調の要約 — 頁の最上部。meta description と同じ文（dueDiligence が唯一の出どころ） */
.pf-axis{font-size:var(--fz-h2);margin:22px 0 2px;padding-bottom:4px;border-bottom:2px solid var(--line)}
.pf-why{margin:0 0 8px;color:var(--sub);font-size:var(--fz-p2);line-height:1.6}
.pf-of{display:inline-block;margin-right:6px;padding:0 6px;border-radius:5px;background:var(--face);
  color:var(--sub);font-size:var(--fz-p2);vertical-align:1px}
.pf-sub .pf-lbl{font-weight:400}
.ddlead{margin:2px 0 10px;color:var(--sub);font-size:var(--fz-p2);line-height:1.7}
/* #701 稼働の一言 — 題の直下の 1 行。★生の px を書かない★（font-scale の門）ので既存の段を使う。 */
.upl{margin:2px 0 10px;color:var(--sub);font-size:var(--fz-p2);line-height:1.7}
.upl a{color:inherit}
/* ★#690 (1) 結論ブロック★ — BOSS「薄い緑の block」。中の数は必ず数えたもの（page-connect.ts）。 */
.pconc{background:#f2f8f5;border:1px solid #cfe6da;border-left:3px solid var(--acc);border-radius:8px;padding:10px 14px;margin:4px 0 14px}
.pconc-head{margin:0 0 6px;font-weight:700}
.pconc-row{margin:4px 0;line-height:1.8}
/* ★系統頁の結論に足した「読者が先に知りたい 3 つ」★（#719・BOSS 2026-09-09）— 連携の行とは
   性質が違う（方式ではなく前提）ので、点線で分けて P2 に落とす。★別の箱は作らない★ —
   同じ結論の中に在ることが、この 3 つも結論の一部だという意味になる。 */
.pconc-facts{margin-top:8px;padding-top:8px;border-top:1px dashed #cfe6da;font-size:var(--fz-p2);color:var(--sub)}
.pconc-facts b{color:var(--fg)}
/* ★#690 (6)★ チップと本文の上下中央揃え — inline-flex は既定で baseline 揃えなので、
   padding と border のぶんチップだけ下がって見える（BOSS 実機 2026-09-05）。 */
.pconc-head .pconc-tag,.pconc-row .pconc-tag{vertical-align:middle}
.pconc-link{vertical-align:middle}
.pconc-tag{display:inline-flex;align-items:center;vertical-align:middle;line-height:1.4;gap:5px;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:2px 10px;font-size:var(--fz-p2);font-weight:700;color:var(--fg);cursor:pointer}
.pconc-tag:hover{border-color:var(--acc)}
.pconc-link{color:var(--acc);text-decoration:underline;text-underline-offset:2px} .alias{color:var(--sub);font-size:var(--fz-p2);margin:2px 0 8px}
.openness .op-line{font-size:var(--fz-p2);margin:3px 0}
.openness .hint{color:var(--sub);font-size:var(--fz-p2);margin-top:6px;line-height:1.6}
/* ★技術寄りの行は、別表に切り出さず同じ軸の中に置き、札で示す★（BOSS 2026-08-26）—
   「業務ワークフロー円滑度の項目なら、その中に書けばよい」。札は控えめに（読み飛ばせるように）。 */
.pf-deepof{opacity:.75}
.pf-ofrow{display:block;margin-bottom:3px}
/* 訂正履歴 — ★#650（BOSS 2026-08-31）で折り畳みに変更★ — タイトルと件数は常時可視、
   中身はクリックで開く。記録を消さない不変量は不変（旧「畳まない」はこの裁定で上書き）。 */
.corrfold{margin:18px 0}
.corrfold>summary{cursor:pointer;list-style:none}
.corrfold>summary::-webkit-details-marker{display:none}
.corrfold .corr-h2{display:inline-block;margin:0}
.corrfold>summary .corr-h2::after{content:' ▸';color:var(--sub);font-weight:400}
.corrfold[open]>summary .corr-h2::after{content:' ▾'}
.crtbl th{width:auto;white-space:nowrap}
.crtbl td{vertical-align:top}
.crtbl .cr-d{white-space:nowrap;color:var(--sub);font-variant-numeric:tabular-nums}
.crtbl .cr-c code{font-size:var(--fz-p2);color:var(--sub)}
.crtbl .cr-why{color:var(--sub);font-size:var(--fz-p2);margin-top:3px}
/* #543 線の一覧 — ★1 行は 2 行分の高さに収める★（BOSS 2026-08-06）。
   長い出典は clamp して隠すが、★DOM からは消さない★（選択・検索・読み上げでは全文が残り、
   title で全文が出る）。表そのものは横スクロールしてよい。 */
.lsum{margin:8px 0;font-size:var(--fz-p2)}
.crsum{margin:8px 0;font-size:var(--fz-p2);color:var(--fg)}
/* 盤で線を選んだときに下へ出る、その分の根拠 */
#linesbox{margin:10px 0 0}
.lfhead{font-size:var(--fz-p2);margin:10px 0 4px;color:var(--fg)}
.lft{font-size:var(--fz-p2)}
#lt{table-layout:auto}
#lt td,#lt th{vertical-align:top}
/* システム名・日付は 1〜2 行で足りるので詰める */
#lt .lsys{min-width:7em;max-width:11em}
#lt .lmet{width:1%;white-space:nowrap}
#lt .lday{width:1%;white-space:nowrap}
#lt .lprodc{min-width:11em;max-width:16em}
#lt .lsrc{min-width:20em;max-width:34em}
/* ★1 マスの中は 1 行ずつ★ — 資料・出典は「1 行目＝出典(URL)／2 行目＝補足」なので、
   それぞれ 1 行に締めて、行全体が 2 行に収まるようにする（BOSS 2026-08-06）。
   全文は title と DOM に残る（選択・検索・読み上げでは切れない）。 */
.lclamp1{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;line-clamp:1}
.lprod{margin-top:3px;font-size:var(--fz-p2);color:var(--sub)}
.lm{font-size:var(--fz-p2);white-space:nowrap}
.lsrc1{font-size:var(--fz-p2)}
.lnote{color:var(--sub);font-size:var(--fz-p2);margin-top:2px}
/* 方式は盤と同じ色（LINE_COLOR から生成） */
.mtag{display:inline-block;padding:2px 10px;border-radius:12px;font-size:var(--fz-p2);font-weight:700;color:#fff;white-space:nowrap}
/* 調査日は灰のタグ */
.daytag{display:inline-block;padding:2px 8px;border-radius:10px;font-size:var(--fz-p2);background:var(--soft);color:var(--sub);border:1px solid var(--line);font-variant-numeric:tabular-nums;white-space:nowrap}

.pftbl tr[id]{scroll-margin-top:60px}
/* .pf-citebtn の見た目は MAP_CSS（全頁）— 見出しの釦は個票以外にも出るため。 */
a.pf-kind{text-decoration:none}
a.pf-kind:hover{background:var(--acc);color:#fff}
/* ── #534 three-column layout: A=項目+① / B=②(+⑤) / C=③④ behind 詳細表示 ── */
.pf-scroll{overflow-x:auto}
.pf5 thead th{font-size:var(--fz-p2);color:var(--sub);white-space:nowrap;background:var(--soft)}
.pf-colnote{display:inline-block;margin-left:6px;font-weight:400;border:1px solid var(--line);border-radius:8px;padding:0 6px;font-size:var(--fz-p2)}
.pf5 td{vertical-align:top}
/* ★A 列は狭く★ (BOSS 2026-08-04): 項目名とタグだけの列に幅を与えても情報密度は上がらない。
   残りを②（2 列時）／②③④（3 列時）に回す。表全体の約 1/6。 */
.pf5 td.pf-a,.pf5 th:first-child{width:16%}
/* ②③④ read as supporting text — one unified grey voice (BOSS 2026-08-04); ① stays black */
.pf5 td.pf-b,.pf5 td.pf-c{color:var(--sub)}
.pf-lbl{font-weight:700}
/* ★[引用] は行に触れたときだけ出す★ (BOSS 2026-08-05) — 既定で全行に出ていると、読む前に
   ボタンが目に入る。hover / focus は CSS、触る端末の click は .hot（スクロールで解除）。 */
.pftbl .pf-citebtn{opacity:0;pointer-events:none;transition:opacity .12s}
/* ★#4349（BOSS 実機 2026-09-06）: 触る端末で 1 回目のタップが hover に食われる★
   iOS Safari は「hover の規則を持つ要素」への 1 回目のタップを ★hover の適用★ に使い、
   click は 2 回目に回す。だから phone では 1 回目で [引用] が出るだけ・2 回目で展開になる。
   ⟹ hover の規則を (hover: hover) の中に閉じ込め、★触る端末には hover の規則を存在させない★。
   触る端末の道は今までどおり .hot（同じタップの click で付く）と :focus-within。
   ★UA は見ない・CSS はこの 1 か所・cellFold の咽喉は触らない★。 */
@media (hover:hover){
  .pftbl tr:hover .pf-citebtn{opacity:1;pointer-events:auto}
}
.pftbl tr:focus-within .pf-citebtn,.pftbl tr.hot .pf-citebtn{opacity:1;pointer-events:auto}
.pf-states{margin:4px 0 0}
/* ★③④ は②のマスの中に、そのマスのボタンで開く★ (BOSS 2026-08-05) — 列ではなくなったので
   横スクロールも不要になった。 */
.pf-c{display:none;border-top:1px dashed var(--line);margin-top:7px;padding-top:7px}
/* ★#690 (8)★ 一言だけの初期表示 — ★通常の字体★（太字・大きい字にしない）。
   釦に見えすぎないよう枠は持たせず、押せることは下線と手の形で示す。 */
.pf-lead-btn{display:block;width:100%;text-align:left;border:0;background:transparent;padding:0;
font:inherit;font-weight:400;color:var(--fg);cursor:pointer;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--line)}
.pf-lead-btn:hover{text-decoration-color:var(--acc)}
.pf-fold{display:none;margin-top:6px}
.pf-fold.open{display:block}
/* ★#697（BOSS 実機 2026-09-06）— 幅で 2 段。判定は ★この 1 か所だけ★（UA を見ない）。
   閾 768px = iPhone 縦(390) は折り／iPad 縦(768) は展開、という BOSS の 2 段そのもの。

   ★HTML は 1 種類のまま★（両方描いて片方を隠す形にしない）— 二重に描くと同じ内容が
   DOM に 2 つ在ることになり、読み上げも検索も 2 度拾う。#690 の考卷が見ている
   .pf-lead-btn / .pf-fold の形も変えずに済む。切り替えは ★見え方だけ★。

   ・system 頁（.pf5 = 五層の個票表）: PC/tablet では ★折らずに展開★ —
     一言だけだと内容が薄い、という BOSS の指摘。.open の有無に関わらず開いた形にするので、
     鍵盤で釦に触れても閉じない（JS は .open を付け外しするだけ）。
   ・connect 頁（#pfwrap の pairtbl）は ★両幅とも折りたたみのまま★ — 目的が違う（接続方式の一覧）。
     .pf5 を持たないので、上の規則は当たらない。 */
@media (min-width:768px){
  .pf5 .pf-fold,.pf5 .pf-fold.open{display:block}
  /* 展開形では一言は「押す物」ではない ⟹ 下線と手の形を外し、押しても何も起きないことを見た目と一致させる */
  .pf5 .pf-lead-btn{pointer-events:none;text-decoration:none;cursor:default;font-weight:700}
}
/* connect 頁 phone: ★B 列を A 列と同じ幅にし、表だけを横に流す★（BOSS 実機 — 今は B 列が
   潰れて 1 行 3〜4 文字で縦に伸びる）。★頁本体は横に伸ばさない★ ので overflow は表の親に置く。 */
@media (max-width:767px){
  #pfwrap{overflow-x:auto}
  #pfwrap .pairtbl{table-layout:fixed;min-width:640px}
  #pfwrap .pairtbl th.colh{width:40%}
}
tr.cellopen .pf-c,.pf-c.open{display:block}
.pf-more{border:1px solid var(--line);background:transparent;color:var(--acc);border-radius:7px;
  padding:1px 9px;font-size:var(--fz-p2);cursor:pointer;margin-top:6px}
.pf-more:hover{background:var(--soft)}
.pf-dim{color:var(--sub)}
/* ②の冒頭＝要点。★灰色の地の文に対して、ここだけ黒の太字★（重要度の差を字面で出す） */
/* ★The correction log is detail — P2 throughout★ (BOSS 2026-08-10). It matters that it
   exists and can be read, not that it competes with the facts above it. */
.corr-body{font-size:var(--fz-p2)}
.pf-lead{margin:3px 0;font-weight:700;color:var(--fg)}
/* ★長い地の文は P2 の灰色／短い要約（pf-lead）は P1 の太字★（BOSS 2026-08-10）—
   同じマスの中で「まず読む 1 行」と「読まなくてもよい詳細」を字面で分ける。 */
.pf-ed,.pf-refline{font-size:var(--fz-p2);color:var(--sub)}
.pf-ed{margin:2px 0}
.pf-refline{margin:3px 0}
.pf-vnote{border:1px solid #2563eb55;background:#eaf1fd;border-radius:8px;padding:6px 9px;margin:6px 0;font-size:var(--fz-p2)}
.pf-vnote-tag{font-weight:700;color:#123c78;font-size:var(--fz-p2);margin-right:4px}
.pf-vnote-by{color:var(--sub);font-size:var(--fz-p2)}
.pf-mlink{font-size:var(--fz-p2);display:inline-block;margin:1px 0 4px}
/* ★開いた③④の末尾に「調査日」を 1 回★（doc 95 §3.5.2.2-2）— 札が要求する「URL ＋ 日付」の
   日付側。行ごとに繰り返すと同じ値が並んで出典が埋もれるので、塊に 1 つ。 */
.pf-refon{margin-top:6px;font-size:var(--fz-p2);color:var(--sub)}
/* 塊の見出しに付く出所の札 = ［誰が × どう得たか］＋ その数え方への道（provenance.originChipBlock）。
   2 つで 1 つの意味なので、間を詰めて 1 かたまりに見せる。 */
.pf-originblk{display:inline-flex;align-items:center;gap:6px;vertical-align:middle;margin-left:6px}
.pf-originblk .pf-mlink{margin:0}
@media(max-width:700px){
  .pf5 thead{display:none}
  .pf5 td.pf-b>.pf-dim{display:none}          /* a bare — is noise when stacked */
  /* ★スマホでは 1 列目も full-width★ (BOSS 2026-08-05) — PC の 1/6 をそのまま持ち込むと
     タグが 1 文字ずつ折り返して読めなくなる（「FISC 基準のデータセンター」が縦に潰れた）。 */
  .pf5 td.pf-a,.pf5 td.pf-b{display:block;width:auto}
}
.pf-qbtn{border:1px solid var(--acc);background:transparent;color:var(--acc);border-radius:8px;padding:2px 10px;font-size:var(--fz-p2);cursor:pointer}
.pf-qbtn:hover{background:var(--acc);color:#fff}
.pf-qbtn:disabled{opacity:.5;cursor:default}
.pf-qsrc{color:var(--sub);font-size:var(--fz-p2);margin-left:8px}
/* ★対のページ: 1 項目 × 横に 2 製品★ — 各セルの中で ①② を縦積みし、【詳細表示】で③④が
   同じセルの中に開く。個票と並べ方だけが違い、中身は同じ cellParts が作っている。 */
.pctbl td.pc{vertical-align:top;color:var(--sub)}
.pctbl td.pc .pf-lead{color:var(--fg)}
/* ★④原文は【詳細】であって主役ではない★（BOSS 2026-08-14）— 開いた先に出る補足なので、
   本文と同じ大きさ・同じ濃さで並ぶと、読むべき②の要点より目立ってしまう。P2・灰にそろえる
   （四段の文字尺度どおり: 見出し / 本文 / P2 灰 の 3 種類しか使わない）。 */
blockquote.pf-q{margin:6px 0 6px 4px;padding:6px 10px;border-left:3px solid var(--line);background:var(--soft);
  border-radius:0 8px 8px 0;font-size:var(--fz-p2);color:var(--sub)}
blockquote.pf-q .pf-src{display:block;margin-top:2px}
/* #549 外から触れる業務オブジェクト表（capabilityBlock）。●=仕様に記載 ◯=第三者から — の 4 記号は
   doc 91 §8.2 の 3 値＋等級の画面語。色は意味に紐づく（緑=強い根拠・黄=第三者・赤=明記された不可・灰=不明） */
/* ★表は幅いっぱいに使い、余った幅は【項目】の列に渡す★（BOSS 2026-08-09 実機）。
   以前は table 自身が display:block + overflow-x:auto のスクロール容器を兼ねていた。この形だと
   表は中身の最小幅までしか広がらない（block なので width:100% が効かない）ので、記号の列が
   間延びする一方で、いちばん読みたい【項目（日本(英文)）】が狭いまま折り返されていた。
   ⟹ スクロールは外側の .cap-scroll に持たせ、table は width:100% の table のままにする。
   これで「余白は項目列へ」「狭い画面では表だけが滑る」の両方が成り立つ。 */
.cap-scroll{overflow-x:auto;margin:10px 0;-webkit-overflow-scrolling:touch}
/* ★min-width:max-content は付けない★ — 折り返し可の列（対象・項目）まで「折り返さない幅」を
   主張してしまい、画面が広くても常に横スクロールになる。width:100% だけにすると、
   nowrap の記号列が最小幅を決め、余りが折り返す 2 列に配られる。記号列だけで画面を
   超えたときに初めて .cap-scroll が滑る — それが狙いどおりの挙動。 */
/* ★狭い画面では潰さず、表だけを滑らせる★（BOSS 2026-08-09）— 確認 375px で表が 335px に
   縮み、いちばん読みたい【項目】列が 134px しか無かった。下限を【固定値】で置くと、
   広い画面では width:100% が勝ち、狭い画面では .cap-scroll が横に滑る。
   ★max-content は使わない★ — あれは中身次第で青天井になり、広い画面でも常に滑ってしまう。 */
.captbl{border-collapse:collapse;margin:0;width:100%;min-width:640px}
.captbl th,.captbl td{border:1px solid var(--line);padding:4px 9px;text-align:center;white-space:nowrap}
/* ★伸びるのは 対象 と 項目 の 2 列だけ★ — 記号や向きの列は中身の幅で足りる。 */
.captbl td.cp-obj{text-align:left;white-space:normal;overflow-wrap:anywhere;width:22%}
.captbl td.cp-flds{width:52%}
/* ★出典の列は【1 行の流れ】★（BOSS 2026-08-18 差し戻し: 5 段積みは見苦しく mobile 不可）—
   ［札］リンク (日付) ［詳細…］ を折り返さず 1 行に並べ、幅が足りない分は .cap-scroll が
   横に滑る（PC/mobile とも row は 1 行、表ごと横 scroll）。リンクは ≤15 字に短縮済みなので
   行は青天井にならない。 */
.captbl td.cp-ev{text-align:left;white-space:nowrap}
/* ★Notion 型の横 scroll = 列幅を宣言した固定レイアウト★（BOSS 2026-08-18 指定）。
   auto layout は %-列（項目）と nowrap の出典列が制約環を作り、表が指定幅に cap された
   ままセルが表箱の外へはみ出て scroll の届かない領域に消えた（実機 375px で確認）。
   列幅の宣言は capability.ts の colgroup が唯一の源；ここは layout の宣言と、
   %-指定の解除（colgroup が全列を握るので % は残すと二重指定）だけ。 */
.captbl-ev{table-layout:fixed;width:auto;min-width:100%}
.captbl-ev td.cp-obj,.captbl-ev td.cp-flds{width:auto}
/* 表の中の出所行は素の inline 流（flex は table layout と組ませない — 同日実機） */
.captbl td.cp-ev .ev-line{margin:0;display:block;white-space:nowrap}
.captbl td.cp-ev .ev-line>*{margin-right:6px}
.captbl td.cp-ev .ev-src{overflow-wrap:normal}
.captbl td.cp-sf{color:var(--sub)}
/* ★記号は全部太字・白地で読める色★（BOSS 2026-08-09 実機）— ●◯✕？ は表の主役。
   旧の配色（淡緑 #7ee2a8・淡黄 #e6d17a・淡赤 #e88）は暗い背景を前提にした値で、
   白地では薄すぎた。★？の紫は「意味の色」の体系から外れていた★ので灰へ戻す:
     ● 緑 = ベンダーの公開仕様に記載 ／ ◯ 黄（琥珀）= 第三者の公開情報から
     ✕ 赤 = できないと明記 ／ ？ 灰 = 調査したが記載を見つけられず ／ 空欄 = 一次資料が未確認
   黄は白地で純黄だと見えないので、読める濃さの琥珀にしている（色名ではなく可読性を取る）。 */
.cp-v,.cp-t,.cp-no,.cp-na,.cp-q{font-weight:700}
.cp-v{color:#0b6e4f}
.cp-t{color:#a86a00}
.cp-no{color:#b3261e}
.cp-na{color:var(--sub)}
.cp-items{color:var(--sub);font-size:var(--fz-p2);margin-left:4px}
.cp-q{color:var(--sub)}
/* 記号の凡例（表の下）でも同じ太さで見せる — 表と凡例で見た目が違うと対応が取れない */
.caplegend b{font-weight:700}
.captbl .cp-blank{background:transparent}
.captbl td.cp-flds{text-align:left;white-space:normal;overflow-wrap:anywhere;color:var(--sub);font-size:var(--fz-p2)}
.cp-en{color:var(--sub);font-size:var(--fz-p2);margin-left:1px}
.cp-det{font:inherit;font-size:var(--fz-p2);padding:2px 8px;border:1px solid var(--line);border-radius:6px;background:var(--soft);color:var(--fg);cursor:pointer;white-space:nowrap}
.cp-det:hover{border-color:var(--fg)}
/* ★詳細行は表の横幅を広げない★（BOSS 2026-08-07 差し戻し: 展開すると横に伸びた）。
   colspan セルの中身が nowrap を継承して表全体を引き伸ばしていた — 中で折り返す。 */
.cp-detrow td{text-align:left;background:var(--soft);white-space:normal}
.cpd{padding:6px 4px;max-width:56em;overflow-wrap:anywhere}
.cpd a{overflow-wrap:anywhere}
.cpd-op{margin:4px 0}
.cpd-op ul{margin:2px 0 6px 18px;padding:0}
.cpd-flds{margin:4px 0;line-height:1.9}
/* タブ（API連携/ファイル連携/画面連携）— 連携マップの線の色と同じ点を持つ。中身は選ばれた時だけ取得 */
/* ★方式タブ（API/CSV/画面連携）の中身は全部 P2★（BOSS 2026-08-10）— ここは
   細部の置き場（項目対照・連携ツール・内訳）なので、本文と同じ大きさで並べると節見出しと
   細部の区別が付かなくなる。親 1 箇所で決める（表やチップに個別指定を散らさない）。 */
#captabbody{font-size:var(--fz-p2)}
/* ★本物のタブ（#650 / BOSS 2026-08-31）★ — 丸薬型の釦から、パネルに接続したタブへ。
   選択中タブは背景がパネルと同じ白になり、下辺がパネルと繋がって見える。 */
.captabs{display:flex;gap:4px;align-items:flex-end;flex-wrap:wrap;margin:18px 0 0;border-bottom:2px solid var(--line)}
.captabs .ct{font:inherit;font-size:var(--fz-p2);padding:7px 14px;border:1px solid var(--line);border-bottom:none;border-radius:9px 9px 0 0;background:var(--soft);color:var(--sub);cursor:pointer;display:inline-flex;align-items:center;gap:6px;margin-bottom:-2px}
.captabs .ct.on{background:var(--bg);color:var(--fg);border-color:var(--line);border-bottom:2px solid var(--bg);font-weight:700}
#captabbody,.captabbody{border:1px solid var(--line);border-top:none;border-radius:0 0 10px 10px;padding:10px 12px;margin-bottom:14px}
#captabbody[hidden],.captabbody[hidden]{display:none}
.captabs .ctdot{width:9px;height:9px;border-radius:50%;display:inline-block}
.captabs .cthint{color:var(--sub);font-size:var(--fz-p2);flex-basis:100%;order:99;margin:6px 0 6px}
/* 方式差分 block（各タブの下・BOSS 手描き設計）と 対ページ 3 列表の空欄セル */
.sdiff{border:1px solid var(--line);border-radius:10px;padding:8px 12px;margin:10px 0;background:var(--soft)}
.sdiff h3{margin:2px 0 6px;font-size:var(--fz-p1)}
.bizgrp td.bg-none{color:var(--sub)}
.bizgrp details.bg-only{margin-top:4px;font-size:var(--fz-p2)}
/* ★対応づかなかった欄 = 灰色の小さな字★（BOSS 2026-08-08: tag だと対応した項目と同じ重みに見える） */
.bg-rest{margin-top:6px;color:var(--sub);font-size:var(--fz-p2);line-height:1.7}
.bg-rest-t{display:block;color:var(--sub);font-weight:600;font-size:var(--fz-p2);margin-bottom:1px}
.bg-more{color:var(--sub);opacity:.75}
/* 対応づけの段: 名前が同じ=実線／意味で判定=破線／要確認=?印 */
.pm-vocab{border-style:dashed}
/* ★推測段 = 点線＋淡色★（五律・五: 推測と確認を必ず描き分ける） */
.pm-guess{border-style:dotted;opacity:.72}
.pm-guess-inline{border-bottom:1px dotted var(--sub)}
.pm-arrow{color:var(--sub);font-weight:400}
.pm-q{color:#b45309;font-weight:700;margin-left:2px}
.pm-brk{color:var(--sub);font-size:var(--fz-p2);margin:2px 0 4px}

#bandtip{display:none;position:absolute;z-index:60;max-width:440px;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 8px 28px rgba(0,0,0,.13);padding:10px 12px;pointer-events:none}
/* chat → floating panel, collapsed to a pill by default (left side goes full screen) */
.chat{display:none;position:fixed;top:14px;right:14px;width:min(380px,calc(100vw - 28px));height:min(560px,78vh);z-index:50;background:#fff;box-shadow:0 12px 40px rgba(0,0,0,.18)}
.chat.open{display:flex}
#chatpill{position:fixed;top:14px;right:14px;z-index:49;border:0;background:var(--acc);color:#fff;border-radius:22px;padding:10px 18px;font-size:var(--fz-p2);font-weight:700;cursor:pointer;box-shadow:0 6px 20px rgba(11,110,79,.35)}
#chatpill.hid{display:none}
#chatmin{border:1px solid var(--line);background:transparent;color:var(--sub);border-radius:7px;padding:0 9px;font-size:var(--fz-p2);cursor:pointer}
@media(max-width:700px){.cols{grid-template-columns:1fr}.pairtbl td{width:38%}section{overflow-x:hidden}table{display:block;overflow-x:auto}
/* BOSS mobile ruling 2026-08-01 (IMG_2084/2085):
   ① label+single-value tables (.pftbl): the row label becomes its OWN line above the value —
     no more half-width value column on a phone.
   ② many-text-column tables (.method/.bizgrp): columns get a floor width and the TABLE scrolls
     horizontally — never a one-character-per-line column. */
.pftbl{display:table;width:100%}
.pftbl tr{display:block;padding:9px 0;border-bottom:1px solid var(--line)}
.pftbl th,.pftbl td{display:block;width:auto;border:0;padding:0}
.pftbl th{white-space:normal;color:var(--sub);margin-bottom:3px}
.method th,.method td{min-width:7em}
.method th:last-child,.method td:last-child{min-width:17em}
.bizgrp th,.bizgrp td{min-width:8em}
.bizgrp th:first-child,.bizgrp td:first-child{min-width:11em}}
.ctags{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 4px}
.pf-tags{margin:5px 0 0}
/* ★札は 1 行で読み切れること★（BOSS 2026-09-09「标签文字不能太长，必须一行内能显示完不用换行」）—
   表の列 A は幅が自動なので PC では札の器が 147px まで縮み、★88 頁中 78 頁・332 個の札が
   折り返していた★（皮肉なことに携帯では列が全幅になるので折り返さない＝PC だけの症状）。
   nowrap にすると列 A が必要なだけ広がり（163→268px）、表の総幅は変わらず横スクロールも出ない
   （375 / 768 / 1440 で確認: 折り返し 0・溢れ 0・横スクロール無し）。
   ★文言を短くするのとは別の問題★ — こちらは「入れ物が狭くて 1 語が 2 行に割れる」ほうで、
   1 か所で全頁に効く。長すぎる文言そのものは別途データ側で短くする。

   ★原文を保つ札は尾を切って出す★（BOSS 2026-09-09「如果有需要保持原文的 tag，那么就将 tag
   设为不换行，尾部截断显示」）— 製品名・認証名・分類名（Dynamics 365 Customer Voice /
   ISMAP クラウドサービスリスト / マーケティングオートメーション …）は ★短くすると名前が壊れる★
   ので言い換えない。代わりに器の側で上限を持ち、超えた分だけ「…」にする。
   上限の決め方（今日の最長に合わせない）:
     ・100% … 器（列 A の枡）を絶対に越えない ⟹ どの画面幅でも横に溢れない。
       携帯では列 A が全幅になる（375px で枡 335px）ので、これが実質の天井。
     ・20em … 札の字数の上限。★札は分類の語であって文ではない★という規律を長さで表す
       （20 字を越えたら、それは②③④に置くべき文）。em なので字の大きさが変われば一緒に動く。
   切れた字は title 属性で残す（profile.ts:294）— 原文そのものは同じ行の③④に必ず在る。
   ★この注記は CSS としてそのまま頁に配られる★ — 読者向けの禁句（門 roles-model ⑧）は書けない。
   ★この注釈にバッククォートを書かないこと★ — この CSS は template literal の中に住んでいるので、
   バッククォート 1 個で文字列が閉じ、頁が丸ごと構文エラーになる（2026-09-09 に実際にやった）。 */
/* ★釦は札と【同じ規則】が箱を決める★（2026-09-09 dev 実機）— 別の規則で同じ値を書いたら、
   釦だけ 25px・札は 27px になった（flex の行に 1 つだけ背の低い箱が混じる）。数字を写し直すのでは
   なく規則を共有する — 片方を直せば両方動く。差分（点線・色・cursor）だけを次の規則で足す。 */
.pf-tags .ctag,.pf-tags .pf-tagmore{font-size:var(--fz-p2);padding:2px 8px;font-weight:600;
  white-space:nowrap;max-width:min(100%,20em);overflow:hidden;text-overflow:ellipsis}
/* ★札が多い行は先頭 5 個だけ★（BOSS 2026-09-09「tag > 5 时，只显示 5个」）—
   ★何個目から畳むかはここに書かない★。畳む札には profile.ts が pf-tagx の印を付けて出すので、
   CSS は「印の付いた札を隠す」としか言わない（同じ数が二か所に住むと、片方を直した日に割れる）。 */
.pf-tags:not(.open) .pf-tagx{display:none}
.pf-tags .pf-tagmore{display:inline-block;line-height:inherit;font-family:inherit;
  border:1px dashed var(--line);border-radius:14px;background:transparent;color:var(--sub);cursor:pointer}
.pf-tags .pf-tagmore:hover{background:var(--soft);color:var(--acc)}
.pftbl th{width:34%;min-width:11em}
@media(max-width:700px){.pftbl th{width:auto;min-width:0}}
.ctag{display:inline-block;padding:3px 11px;border-radius:14px;font-size:var(--fz-p2);font-weight:600;border:1px solid transparent}
/* ★出所の札は押せる★（doc 95 §3.5.2）— 押すと /method（測り方の索引）へ。見た目は他の
   チップと同じで、下線だけ消す（リンクに見せると本文の一部と読まれる）。 */
.pf-origin{text-decoration:none;font-size:var(--fz-p2)}
.pf-origin:hover{filter:brightness(.94)}
.ct-ok{background:#e7f5ee;color:#0b6e4f;border-color:#bfe3d1}
.ct-warn{background:#fdf3e0;color:#8a5a06;border-color:#f0d9ab}
/* usage-form classification hues — equal weight, no quality gradient (doc 90 §1.5) */
.ct-u1{background:#eef2fb;color:#1a4f9c;border-color:#cddbf3}
.ct-u2{background:#f1eefb;color:#4c3a9c;border-color:#d9d1f3}
.ct-u3{background:#eef6f8;color:#20606e;border-color:#cfe5ea}
.ct-na{background:var(--soft);color:var(--sub);border-color:var(--line)}
.ct-cat{background:#eef2fb;color:#1a4f9c;border-color:#cddbf3}
.ct-note{background:#fff;color:var(--sub);border-color:var(--line);font-weight:400}
.ct-meas{background:#0b6e4f;color:#fff;border-color:#0b6e4f;cursor:help}
a.mlink{text-decoration:none}
#homeboard.radial{position:relative;width:100%;min-width:0;columns:auto;height:0;padding-bottom:104%;margin:14px 0 4px;
  background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden}
@media(min-width:700px){#homeboard.radial{padding-bottom:60%}}
#homeboard.radial .tpage{display:contents}
#homeboard.radial .tile{position:absolute;transform:translate(-50%,-50%);z-index:2}
#homeboard.radial .tile .logo{width:56px;height:56px;border-radius:14px}
/* radial の箱は 56px（通常 72px）— 同じ段のままでは溢れるので、段ごとに 0.75 倍に読み替える。
   ★段の名前は同じ★（lgs1 が一番大きい）ので、決め方（logoStep）は 1 つのまま。 */
#homeboard.radial .tile .logo .txt{padding:2px}
#homeboard.radial .tile .logo .txt.lgs1{font-size:calc(var(--fz-lgs1)*.75)}
#homeboard.radial .tile .logo .txt.lgs2{font-size:calc(var(--fz-lgs2)*.75)}
#homeboard.radial .tile .logo .txt.lgs3{font-size:calc(var(--fz-lgs3)*.75)}
#homeboard.radial .tile .logo .txt.lgs4{font-size:calc(var(--fz-lgs4)*.75)}
#homeboard.radial .tile .logo img{width:34px;height:34px}
#homeboard.radial .tile .logo img.lg{width:42px;height:42px}
/* ★連携マップでは箱の下の名前を出さない★（BOSS 2026-08-12）— 箱の中に名前が入っている図では、
   同じ名前が上下に二度出るだけで、線と線の間を狭くしていた。名前は hover の title と、
   クリックした先のページが持つ。 */
#homeboard.radial .tile .tname{display:none}
/* ★中心の箱は TOP のタイルと同じ見え方★（BOSS 2026-08-12「包括文字大小」）— 中心だけ
   別の大きさだと、同じ物が場所によって違う顔になる。周りの箱だけを小さく（.75）する。 */
#homeboard.radial .tile.rc .logo{width:72px;height:72px;border-color:var(--acc);box-shadow:0 6px 20px rgba(11,110,79,.22)}
#homeboard.radial .tile.rc .logo .txt{padding:3px}
#homeboard.radial .tile.rc .logo .txt.lgs1{font-size:var(--fz-lgs1)}
#homeboard.radial .tile.rc .logo .txt.lgs2{font-size:var(--fz-lgs2)}
#homeboard.radial .tile.rc .logo .txt.lgs3{font-size:var(--fz-lgs3)}
#homeboard.radial .tile.rc .logo .txt.lgs4{font-size:var(--fz-lgs4)}
/* ★点は箱のすぐ下★ — 名前を消した分、点が箱から離れて宙に浮いていた。 */
/* ★点は箱の下に、重ならずに並ぶ★（BOSS 2026-08-12 実機）
   選んでいる点には ★4px の輪★ が付く（.ldot.on の box-shadow）。この輪は幅にも高さにも
   効くので、間隔 4px・上の余白 4px では【隣の輪と重なり、上は箱に触る】— 実機で中心の
   4 点が一塊に見えていたのはこれ。⟹ ★輪 4px ＋ 輪どうしの隙間 4px ＋ 輪 4px = 間隔 12px★
   （8px にしたら確認で隙間 0px＝ちょうど接していた。輪の分を両側から引くのを忘れていた）。
   上の余白も 8px（輪の 4px を引いて、箱から 4px 離れる）。
   横は 4 点 ＋ 両端の輪（16×4 + 12×3 + 4×2 = 108px）が収まるよう、箱の枠を 76 → 112px に。
   ★JS は確認した箱の大きさで並べる★ので、隣との間隔は自動で追随する。 */
#homeboard.radial .tile{width:112px}
#homeboard.radial .tile .ldots{margin-top:8px;gap:12px}
#homeboard.radial .tile .ldot{width:16px;height:6px}
#boardlines path.hit{stroke-width:16;fill:none;stroke:transparent;pointer-events:stroke;cursor:pointer}
.vmail{font-size:var(--fz-h2);font-weight:700;background:var(--soft);border:1px solid var(--line);border-radius:10px;padding:10px 14px;display:inline-block}
/* ★引用の釦は全頁に出る★（行・見出し・頁の題）— 見た目の宣言はここ 1 か所。
   個票の【行】の釦だけは、触れたときに出す（PROFILE_RULES の .pftbl .pf-citebtn）。 */
/* ★［引用］も灰の札にそろえる★（BOSS 2026-08-14）— 出所の札と同じ「押せるが主役ではない」
   一群なので、見た目も同じ（灰の地・灰の枠・P2）。押せることは hover で伝える。 */
/* ★［訂正依頼］も同じ灰の一群★（BOSS 2026-08-15）— ［引用］の右に並ぶので、姿が違うと
   「押していいのはどちらか」を読者に考えさせる。押せることは hover で伝える、も同じ。
   釦ではなく <a> なのは、行き先の在る移動だから（中クリックで別タブに開ける）。 */
.pf-citebtn,.pf-fixbtn{border:1px solid var(--line);background:var(--soft);color:var(--sub);border-radius:7px;
  padding:0 6px;font-size:var(--fz-p2);cursor:pointer;vertical-align:middle}
.pf-citebtn:hover,.pf-fixbtn:hover{border-color:var(--sub);color:var(--fg)}
.pf-fixbtn{margin-left:6px;text-decoration:none;display:inline-block;line-height:1.6}
/* 見出しの釦は見出しより弱く — 押せることは分かるが、題を読む邪魔をしない大きさ。 */
.pf-citehd{margin-left:10px;font-weight:400;opacity:.55;position:relative;top:-1px}
h1 .pf-citehd,h2 .pf-citehd,h3 .pf-citehd{vertical-align:middle}
.pf-citehd:hover{opacity:1}


.homewrap h1{margin-bottom:6px}
/* ★board view: 1/2/3/4 columns — but the tiles NEVER widen the page★ (BOSS 2026-08-03).
   min-width:0 on the grid item is the whole fix for「横屏变成了整页滚动」: a grid/flex item
   defaults to min-width:auto, so an overflowing row pushes the DOCUMENT wider instead of
   scrolling inside its own block. Every breakpoint keeps in-block horizontal scroll. */
/* ★multi-column（grid ではなく columns）★ — grid だと行内の一番高いブロックに合わせて
   下に大きな空白ができる（BOSS 2026-08-03「上下 block 之间不要有太大的空白」）。columns なら
   ブロックが詰めて流れる。列数はブレークポイントで 1/2/3/4。 */
/* ★width:0 + min-width:100% is load-bearing★ — measured on dev at 1280px: without it the
   document scrolled to 6484px and each card was 2110px wide. A multi-column box in normal
   flow contributes its CONTENT's min-content width to the enclosing grid item (main is a
   grid), and .tiles is a scroll container whose min-content is the sum of its tiles —
   overflow:hidden does NOT cap that (verified: still 6484). Preferred width 0 does. */
/* ★詰めて並べる（列優先）★ — 2026-08-05 に一度 grid（行優先）にしたが、実機で戻した。
   件数が 3〜19 件とばらつくため、行の高さが一番高いカードに揃い、下部に大きな白が出る
   （BOSS 実見: 「ビジネスチャット 3 件」の箱が「グループウェア 7 件」の高さに引き伸ばされた）。
   ★読む順序（行優先）より、詰まっていること（列優先）を優先する★ という BOSS の裁定。
   行優先で詰めるには masonry が要るが、CSS の masonry はまだ広く使えず、JS 実装は
   並べ替えのちらつきを持ち込む — 入れるならそれ自体を一つの課題として扱う。 */
/* ★中身の量で幅が決まる★（BOSS 2026-08-09 実機）— スマホでも PC でも規則は一つ:
   「1 行に収まらない分類は 1 行を占有して内部を横スクロール／少ない分類どうしは同居する」。
   列数を決め打ちする columns/grid ではこれが書けない（件数 1 の分類も 9 の分類も同じ幅になる）。
   ★flex-wrap ＋ 件数から算出した flex-basis★ でそのまま表現できる:
     --n = そのタイル数 → 欲しい幅 = n × 110px（タイル 96 + 間隔 14）＋ 箱の内側 32px
     min-width を min(100%, その幅) にすると、
       ・広い分類は縮まずに折り返す ⟹ 自分の行を占有し、収まらない分は .tiles が横スクロール
       ・狭い分類は縮んで隣に並ぶ ⟹ 同じ行に同居
   これは JS を使わずに「量に応じた折返し」を書ける唯一の形（columns では中身の量が幅に効かない）。 */
/* ★width:0 + min-width:100% は flex では使えない★（2026-08-09 実機で判明）— あれは
   multi-column 箱が「中身の min-content」を grid item に持ち込むのを止めるための書き方だった。
   flex にすると、子の min-width:min(100%,…) の 100% が親の幅を参照し、親の幅は子から決まる
   ⟹ 循環して潰れる（確認: 盤面 31px・各行 31px・文書が横スクロール）。
   flex では親に【確定した幅】を与えるのが正解: main は grid-template-columns:1fr なので
   width:100% が確定値になり、min-width:0 で子が親を押し広げるのを止める。 */
/* ★盤は格子★（BOSS 2026-08-10 実機）— flex で折り返すと、最後の段に余った箱が伸びて
   1 段目と幅が違ってしまう（確認: 1 段目 332px / 2 段目 504px ⟹ 同じ 3 列なのにタイルの
   大きさが段で変わる）。auto-fill の格子なら、何段目でも列幅は同じ。画面幅に応じて
   1 / 2 / 3 列になり、左から右・上から下に並ぶ。 */
#homeboard{position:relative;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:12px;margin:10px 0;width:100%;min-width:0;align-items:start}
/* ★分類の箱の幅は【中身の件数】ではなく【1 ページ＝3 列】で決まる★（BOSS 2026-08-10）。
   前の版は件数に比例して幅を主張させ、多い分類は 1 行を占有して中で横スクロールしていた。
   スクロール条は「どこまで続くのか」が見えず、端末によって見える枚数も変わる。iOS の
   ホーム画面と同じで【1 ページの形が固定】なら、どの画面でも同じ数え方ができる。
   ⟹ 箱は常に 3 列分の幅を欲しがり、画面幅に応じて 1 / 2 / 3 箱が左から順に並ぶ。 */
.catrow{background:#fff;border:1px solid var(--line);border-radius:16px;padding:12px 14px;
  min-width:0;max-width:100%;margin:0;transition:border-color .2s,box-shadow .2s}
.catrow h2{margin:0 0 8px;font-size:var(--fz-h2);display:flex;align-items:center;gap:8px}
.catrow h2 .colcount{color:var(--sub);font-size:var(--fz-p2);font-weight:400}
/* 非全件: ページを横に並べて 1 ページ単位で止める（scroll-snap）。1 ページ＝3 列×3 行（BOSS 2026-09-04）。 */
.tiles{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;min-width:0;
  scrollbar-width:none;-ms-overflow-style:none}
.tiles::-webkit-scrollbar{display:none}
.tpage{flex:0 0 100%;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;
  align-content:start;scroll-snap-align:start;padding:4px 2px 6px;min-width:0}
/* ページ位置の丸 — ★1 ページの分類にも 1 つ出す★（BOSS 2026-09-08）: 出さないと箱の高さが 21px ずれる。 */
/* ★Dots: bigger, lower, and easy to hit★ (BOSS 2026-08-10 実機). 6px was a target the
   thumb misses; the visible dot is now 9px and carries an invisible ±7px pad, so the tap
   area is ~23px without making the row look heavy. */
.tdots{display:flex;gap:10px;justify-content:center;padding:8px 0 4px}
.tdots b{position:relative;width:9px;height:9px;border-radius:50%;background:var(--line);
  cursor:pointer;transition:background .2s}
.tdots b::after{content:'';position:absolute;inset:-7px}
.tdots b.on{background:var(--sub)}
/* 全件表示: ★ページの区切りだけを消す★ — .tpage を display:contents にすると、中のタイルが
   そのまま .tiles の格子に流れ込む。ページ分割は HTML に在るのに、見た目は 3 列の連続した
   格子になる ⟹ 同じ markup で 2 つの見せ方を持てる（並び順も HTML のまま変わらない）。 */
#homeboard.wrapall .tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;
  overflow-x:visible;padding:4px 2px 2px}
#homeboard.wrapall .tpage{display:contents}
#homeboard.wrapall .tdots{display:none}
/* ★空の枠★ — 3 行に満たないページを 3 行ぶんの高さに保つ（箱の高さを揃える・BOSS 2026-09-08）。
   タイルと同じ中身を持たせて visibility で隠すので、名前の折り返しに関係なく 1 行ぶんの高さが出る。
   全件表示では区切りが消えて格子が連続するので、穴が空かないよう出さない。 */
.tpad{visibility:hidden;min-width:0;text-align:center}
#homeboard.wrapall .tpad{display:none}
.tile{width:auto;min-width:0;text-decoration:none;color:var(--fg);text-align:center;position:relative;z-index:2}
.logo{width:72px;height:72px;margin:0 auto;border-radius:18px;border:1px solid var(--line);background:#fff;
  display:flex;align-items:center;justify-content:center;overflow:hidden;transition:all .25s cubic-bezier(.4,0,.2,1);
  box-shadow:0 1px 3px rgba(0,0,0,.06)}
.logo img{width:44px;height:44px;object-fit:contain}
.logo img.lg{width:56px;height:56px;border-radius:12px}
.logo .ini{font-weight:800;font-size:var(--fz-h2);color:#fff;width:100%;height:100%;display:flex;align-items:center;justify-content:center}
/* ★文字の LOGO（.logo .txt と段 lgs1〜4）は、ここには書かない★ — 定義は LOGO_TEXT_CSS ただ一つで、
   この束の末尾で差し込む TOOLBOX_CSS が抱えて運んでくる（同じ規則が二か所に在ると、必ず片方だけ古くなる）。
   ★届いていることは考卷が見張る★（logo-text.test.ts「文字 LOGO の見た目は、それを出す全ての頁に届く」）—
   定義が在ることと、その頁に届いていることは別だから。 */
/* ★LOGO は押せるが、リンクの見た目はしない★（BOSS 2026-08-12「不显示下划线、点击也不会変色」）—
   既定のままだと <a> が UA の青＋下線になる（確認: rgb(0,0,238) / underline）。 */
.tile .tlink,.tile .tlink:link,.tile .tlink:visited,.tile .tlink:hover,.tile .tlink:active,
.bi-tool,.bi-tool:link,.bi-tool:visited,.bi-tool:hover,.bi-tool:active{
  text-decoration:none;color:var(--fg)}
.lv2note{background:#fff8e6;border:1px solid #e6d08a;border-radius:10px;padding:8px 12px;font-size:var(--fz-p2);margin:8px 0}
/* 名前は最大 2 行、超えたら省略 (BOSS 2026-08-03) — 行数固定なので tile の高さが揃う */
/* ★LOGO の上の「XX自治体」★ — 数字は注記の段・灰色（数の意味は title の但し書きが言う） */
.muni-list{margin:8px 0;padding-left:1.2em}
.muni-list li{margin:4px 0}
/* ★LOGO の中の「29 / 自治体」★（BOSS 2026-08-10）— 数字を大きく、単位を下に小さく 2 行。
   数の意味（GビズID 対応の窓口であって導入総数ではない）は title の但し書きが言う。 */
/* ★色も太さも他の箱の中の文字と同じ★（BOSS 2026-08-10「不要搞特殊」）— 色は指定せず
   タイルから継承し、太さは .logo .txt と同じ 700。違うのは数字の段だけ（見出しの段を借りる）。 */
.tile .muni-in{display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.15;
  font-size:var(--fz-p2);font-weight:700}
.tile .muni-in b{font-size:var(--fz-h1);font-weight:700}
/* ★下の名前は最大 2 行★。折る場所は <wbr>（括弧の前・空白）が教える — 「ジョブカン（人事・」で
   折れていたのを直すため、既定の break-word ではなく keep-all にして <wbr> を優先させる。 */
/* ★空枠も同じ規則を共有する★（BOSS 2026-09-08「全 category の block design を統一・唯一の咽喉」）—
   別に高さを書くと数字が 2 か所に増える。共有する前は空枠だけの行が 26px 低く、
   ローコードの箱だけ 377px（他は 403px）になっていた。
   ★この束は頁に そのまま差し込まれる★ ので、注記に読者向けの禁句を書くと頁ごと赤くなる
   （vocab-562 が咬んだ。コードの注記も、ここでは配られる文字である）。 */
.tile .tname,.tpad .tname{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  font-size:var(--fz-p2);line-height:1.3;margin-top:5px;word-break:keep-all;overflow-wrap:anywhere;
  font-weight:600;height:2.6em}
/* ★項目まで確認済み＝フルカラー／未確認＝グレー★ (BOSS 2026-08-03: バッジは付けない、色で語る) */
/* ★一つの面に二つの意味を載せない★ (doc 90 §1.5.1・実機 2026-08-05)。箱の背景は【第三類＝
   どの層の道具か】を表す。項目まで確認できたかどうかを同じ面で薄めると、同じカテゴリの中で箱の色が
   まだらになり、色が何を言っているのか読めなくなる（BOSS 実見: 会計・税務の中で 4 枚だけ色が付いた）。
   ⟹ 確認の差はロゴ画像と文字が担う（L1 はロゴが無いので、名前の色と箱の中の文字色で表す）。 */
.tile.gray .logo img{filter:grayscale(1);opacity:.55}
.tile.gray .logo .txt,.tile.gray .logo .ini{color:var(--sub)}
.tile.gray .tname{color:var(--sub)}
.tile.hl .logo{transform:scale(1.08);border-color:#1a5fb4;box-shadow:0 10px 25px -5px rgba(26,95,180,.35)}
.tile.conn .logo{border-color:rgba(26,95,180,.7);box-shadow:0 4px 12px rgba(26,95,180,.18)}
.tile.off{display:none}
.catrow.off{display:none}
.catrow.lit{border-color:rgba(26,95,180,.55);box-shadow:0 4px 18px rgba(26,95,180,.14)}
/* 接続点: 赤=API / 黄=CSV / 緑=画面転記 / 灰=方式の記載なし。★横長のバーにして押しやすく★
   (BOSS 2026-08-03「圆点改为横向短线，面积稍大点更好点击」) — ::after が実際の当たり判定。 */
.tgl{border:1px solid var(--line);background:#fff;border-radius:999px;padding:8px 15px;font-size:var(--fz-p2);
  cursor:pointer;white-space:nowrap;color:var(--fg)}
.tgl[aria-pressed="true"]{background:#0b6e4f;color:#fff;border-color:#0b6e4f}
/* ★線はロゴの「後ろ」を通す★ (BOSS: 连线在背后显示，不遮挡logo)。.catrow は position:static の
   ままなので、その白い背景は positioned な svg(z1) より下に描かれ、tile(z2) はその上に来る。 */
#boardlines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1}
/* ★線は細く、太さは 3 段階＝確認した項目一致数★ (BOSS 2026-08-03「連線多也不显得乱」)。
   未確認の組み合わせは最も細い — 太さは「多いほど太い」であって「良い」ではない。 */
/* ★線は既定で静止★ (BOSS 2026-08-05): 常時アニメーションは、読んでいない図のためにずっと
   描画コストを払い続ける。図の上に来たとき（hover / click）だけ流し、離れるかスクロールで止める。 */
#boardlines path.core{fill:none;stroke-linecap:round;stroke-dasharray:9 9}
#homeboard.live #boardlines path.core{animation:bdash 18s linear infinite}
#boardlines path.core.w1{stroke-width:1}#boardlines path.core.w2{stroke-width:1.9}#boardlines path.core.w3{stroke-width:3}
#boardlines path.glow{fill:none;stroke-linecap:round;opacity:.13}
#boardlines path.glow.w1{stroke-width:3.5}#boardlines path.glow.w2{stroke-width:5}#boardlines path.glow.w3{stroke-width:7}
@keyframes bdash{to{stroke-dashoffset:-1000}}
/* 下部オーバーレイ＝文字ではなく「その方式を実現できるツールのロゴ」(BOSS 2026-08-03) */
#boardinfo{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);background:#fff;border:1px solid var(--line);
  border-radius:14px;box-shadow:0 12px 34px rgba(0,0,0,.16);padding:9px 12px;z-index:60;max-width:min(620px,94vw)}
.logo .txt,.bi-tool .txt{font-weight:700;line-height:1.2;padding:3px;text-align:center;
  word-break:keep-all;overflow-wrap:anywhere;color:inherit}
.logo .txt.lgs1,.bi-tool .txt.lgs1{font-size:var(--fz-lgs1)}
.logo .txt.lgs2,.bi-tool .txt.lgs2{font-size:var(--fz-lgs2)}
.logo .txt.lgs3,.bi-tool .txt.lgs3{font-size:var(--fz-lgs3)}
.logo .txt.lgs4,.bi-tool .txt.lgs4{font-size:var(--fz-lgs4)}
.bi-tools{display:flex;gap:10px;align-items:center;overflow-x:auto;scrollbar-width:thin}
/* ★A tool square IS a system tile★ (BOSS 2026-08-10) — same 72px box, same 18px radius, same
   text style as .logo/.logo .txt above. Two different sizes of the same object made the row
   read as a different species of thing. The name is centred on BOTH axes: a -webkit-box is
   block-level, so it sits at the top of a flex parent unless it is told to centre itself. */
.bi-tool{flex:none;width:72px;height:72px;border-radius:18px;border:1px solid var(--line);background:#fff;
  display:flex;align-items:center;justify-content:center;overflow:hidden;
  color:var(--fg);text-decoration:none;transition:border-color .2s,box-shadow .2s}
.bi-tool:hover{border-color:var(--acc);box-shadow:0 4px 14px rgba(11,110,79,.18)}
/* #630 ★当社製品は、名前だけの面でも当社製品と分かる★（doc 85 の明記ルール）。四角は 72px しか
   無いので隅に小さく置く。★overflow:hidden の箱なので絶対配置の基準を作る★（position を足さないと
   .ownmark が箱の外＝頁の左上へ飛ぶ）。色は表の .ownchip と同じ acc で、面が違っても同じ印に見える。 */
.bi-tool{position:relative}
/* ★大きさは 4 段の変数から採る★ — 生の px を書くと font-scale の門が咬む（実際に咬まれた）。
   小さくしたいなら scale の外に出るのではなく、いちばん小さい段（p2）を使う。 */
.bi-tool .ownmark{position:absolute;right:0;bottom:0;background:var(--sub);color:#fff;
  font-size:var(--fz-p2);line-height:1.3;padding:0 4px;border-radius:8px 0 17px 0;letter-spacing:.02em}
.bi-tool img{width:44px;height:44px;object-fit:contain}
.bi-tool img.lg{width:56px;height:56px;border-radius:12px}



/* 分類の入口（すべて／iPaaS／RPA）— 現在地は太字で、押せないことが形で分かる。 */
.kindnav{margin:6px 0 10px;font-size:var(--fz-p2);color:var(--sub)}
.kindnav strong{color:var(--fg)}
.lst{width:100%;border-collapse:collapse;font-size:var(--fz-p2);table-layout:fixed;min-width:72em}
.lst th,.lst td{border-bottom:1px solid var(--line);padding:6px 8px;vertical-align:top;text-align:left;
  overflow-wrap:anywhere}
.lst thead th{position:sticky;top:0;background:var(--bg);font-size:var(--fz-p2);color:var(--sub);white-space:nowrap;z-index:2}
.lst td.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
/* ★3 行まで★ — 表の 1 行の高さは、いちばん行数の多いマスで決まる */
.lst .clamp{display:-webkit-box;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.lst .site{display:inline-block;border:1px solid var(--line);border-radius:8px;padding:1px 8px;white-space:nowrap;font-size:var(--fz-p2)}
.lst .lv2 .nm{padding-left:1.1em}.lst .lv3 .nm{padding-left:2.4em}
.lst tr.brandrow td{background:var(--soft);font-weight:700}
.lst .dim{color:var(--sub)}
.lst-scroll{overflow-x:auto}
/* 列幅（合計が min-width と一致する）。名前と釦は固定、説明と価格に残りを配る */
.lst-tool col:nth-child(1){width:13em}
.lst-tool col:nth-child(2){width:13em}
.lst-tool col:nth-child(3){width:7em}
.lst-tool col:nth-child(4){width:22em}
.lst-tool col:nth-child(5){width:11em}
.lst-tool col:nth-child(6){width:6em}
.lst-sys col:nth-child(1){width:16em}
.lst-sys col:nth-child(2){width:11em}
.lst-sys col:nth-child(3){width:26em}
.lst-sys col:nth-child(4){width:13em}
.lst-sys col:nth-child(5){width:6em}

.qblk{border:1px solid var(--line);border-radius:10px;background:var(--soft);margin:10px 0}
.qblk>summary{cursor:pointer;padding:11px 14px;list-style:none}
.qblk>summary::-webkit-details-marker{display:none}
.qblk>summary h2{display:inline;margin:0;font-size:var(--fz-h2)}
.qblk>summary::before{content:"＋ ";color:var(--sub);font-weight:700}
.qblk[open]>summary::before{content:"− "}
.qblk[open]>summary{border-bottom:1px solid var(--line)}
.qbody{padding:4px 14px 12px;font-size:var(--fz-p2)}
.qbody>h2{display:none}

.st-badge{display:inline-block;padding:2px 10px;border-radius:999px;font-weight:700;font-size:var(--fz-p2);white-space:nowrap}
.st-ok{background:#e6f6ee;color:#0a7a4b}.st-warn{background:#fff3e0;color:#b25e00}
.st-down{background:#fdecea;color:#c62828}.st-maint{background:#e8eaf6;color:#4a5ac0}
.st-unk{background:#f0f1f3;color:#666}
/* ★Fixed-width name column★ — the name may wrap, but the bars must still line up
   down the page, so the column width cannot depend on the name's length. */
.st-row{display:grid;gap:6px 12px;align-items:center;padding:10px 12px;
  grid-template-columns:auto 15em auto auto auto minmax(0,1fr)}
.st-row .sys{font-weight:700;line-height:1.35;color:var(--link,#1b6ac9);text-decoration:underline}
.st-src{font-size:.82em;color:var(--sub);min-width:0}
.st-fav{cursor:pointer;border:1px solid var(--line);background:var(--bg,#fff);border-radius:8px;
  font-size:1.15em;line-height:1;width:34px;height:34px;padding:0;color:#b9820a;
  display:inline-flex;align-items:center;justify-content:center}
.st-open-t{cursor:pointer}
.st-notice{margin-left:6px;padding:1px 7px;border:1px solid var(--line);border-radius:9px;
 font-size:var(--fz-p2);color:var(--sub);text-decoration:none;white-space:nowrap}
.st-notice:hover{background:var(--soft);color:var(--fg)}
.st-fav:hover{background:var(--soft)}.st-fav:focus-visible{outline:2px solid #f0b429;outline-offset:2px}
.st-fav[aria-pressed="true"]{background:#fff8e6;border-color:#f0b429}
.st-seo{color:var(--sub);font-size:.88em;margin:2px 0 10px}
/* #670 G/H: 免責は黄地の 1 ブロック、説明は灰地の 1 ブロック（同じ形・小さい字 P2）。
   12 マス bar（.stb）の CSS は consult.ts の頁 <style> に 1 度だけ（面2 も同じ部品を着る）。 */
.st-note{background:var(--soft);border:1px solid var(--line);border-radius:10px;padding:10px 14px;font-size:var(--fz-p2)}
.st-disc{background:#fff8e6;border-color:#f0b429}
.st-limit{border-left:3px solid var(--line)}
.st-disc .st-vl{font-size:var(--fz-p1);font-weight:700}
.st-foot{margin-top:28px;padding-top:14px;border-top:1px solid var(--line);font-size:.85em;color:var(--sub)}
.st-foot h2{font-size:1.02em;margin:14px 0 6px}
.st-busy{background:#5c4a12;color:#f0b429}.st-busyline{color:#f0b429;font-weight:600;margin:.3em 0}.st-tls li{margin:.2em 0}.st-tls-ok{color:var(--mut,#8b949e)}.st-tls-warn{color:#f0b429;font-weight:600}.st-tls-bad{color:#f85149;font-weight:700}
.st-l0{margin:.4em 0;padding:.35em .6em;border:1px solid #2e3b4a;border-radius:8px}
.st-vendor-first{font-size:var(--fz-p2);padding:.35em .6em;border-left:3px solid var(--acc);background:var(--soft)}
.st-obsmeta{font-size:var(--fz-p2);color:var(--sub)}.st-concl{margin:.5em 0;padding:.5em .7em;border-left:3px solid #4a90d9;background:rgba(74,144,217,.08)}
.st-leg{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:.82em;color:var(--sub);margin:0 0 8px}
.st-leg span{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.st-leg .stb i{width:8px;height:14px}
.st-legd{margin:6px 0 0}.st-legd dt{font-weight:700;display:flex;align-items:center;gap:6px;margin-top:8px}
.st-legd dd{margin:2px 0 0 22px;color:var(--sub)}
.st-legd .stb i{width:8px;height:14px}
.st-med{font-variant-numeric:tabular-nums;color:var(--sub);font-size:.85em;min-width:5.5em;text-align:right;white-space:nowrap}
/* BOSS 2026-09-08: the two walls sit side by side at full width and stack only when the column is
   narrower than both. Label column = widest label (grid max-content), not a fixed em — the old 5.2em
   plus 28px gap made 7-day + 14-hour = 698px, wider than the 684px left column, so they wrapped. */
.walls{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:flex-start}
/* The heading and the caption must not set the wall's width (the 14-hour caption alone was 495px and
   pushed the second wall under the first): width:0 keeps them out of the intrinsic size, min-width:100%
   then stretches them to the grid's width, so long captions wrap instead of widening. */
.wall>h2,.wall>p{width:0;min-width:100%}
.wall h2{margin:0 0 6px}.wall-b{display:grid;grid-template-columns:max-content max-content;column-gap:4px;row-gap:3px;align-items:center}
.wall-r{display:contents}
.wall-l{font-size:.8em;color:var(--sub);font-variant-numeric:tabular-nums;white-space:nowrap}
.wall-ax{display:inline-flex;gap:2px}
.wall-ax i{display:inline-block;width:9px;font-size:.62em;color:var(--sub);font-style:normal;text-align:left;overflow:visible;white-space:nowrap}
.st-scroll{overflow-x:auto}
/* ★行そのもの★ — grid は summary の中に閉じているので、開いても行の並びは動かない。
   詳細は details 直下の普通のブロックなので、行と同じ全幅で出る（BOSS 2026-08-29）。 */
.st-item{border-bottom:1px solid var(--line)}
.st-item>summary{list-style:none;cursor:pointer}
.st-item>summary::-webkit-details-marker{display:none}
.st-open{color:var(--link,#1b6ac9);font-size:.95em;display:flex;flex-wrap:wrap;gap:4px 8px;align-items:baseline;min-width:0}
.st-open::before{content:'▸ ';color:var(--sub)}.st-item[open] .st-open::before{content:'▾ '}
.st-det-b{margin:0 0 10px;padding:10px 14px;background:var(--soft);border:1px solid var(--line);border-radius:8px;line-height:1.8}
.st-det-h{font-weight:700;margin:8px 0 2px}.st-det-h:first-child{margin-top:0}
.st-det-p{color:var(--sub);margin-top:8px}
.st-det-m{margin:2px 0 6px}
.st-det-jd{color:var(--sub);font-size:.88em}
.st-ctl{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:10px 0}
.st-search{flex:1 1 18em;min-width:12em;padding:7px 12px;font:inherit;font-size:.95em;
  border:1px solid var(--line);border-radius:8px;background:var(--bg,#fff);color:inherit}
.st-cat{margin:14px 0 0}.st-cat>h3{font-size:1.02em;margin:0 0 2px;padding:6px 12px;
  background:var(--soft);border-radius:8px}
.st-cnt{color:var(--sub);font-weight:400;font-size:.85em;margin-left:8px}
.st-suit{font-size:.86em;color:var(--sub);margin:8px 0 0;padding:0 12px}
#st-mine{margin-bottom:10px}
.st-btn{cursor:pointer;border:1px solid var(--line);background:var(--soft);border-radius:8px;padding:6px 14px;font:inherit;font-size:.9em}
.st-btn:hover{background:var(--bg,#fff)}
.st-clamp{display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.st-clamp.open{display:block}
.st-btn-s{padding:2px 10px;font-size:.82em;margin-top:4px}
.st-interp{margin:0 0 4px;font-size:.92em}
.st-interp-t{color:var(--sub);font-size:.86em;margin-left:6px}
.st-q{margin:0;font-size:.92em;color:var(--sub);border-left:3px solid var(--line);padding:2px 0 2px 8px;max-width:34em}
/* #700 (2): 2 列（左＝本体・右＝パネル）。★phone は 1 列で上下★ — 下の 760px の段で戻す。 */
.st-cols{display:grid;grid-template-columns:minmax(0,1fr) 20em;gap:16px;align-items:start}
.st-main{min-width:0}
.st-side{display:flex;flex-direction:column;gap:12px;min-width:0}
.st-card{border:1px solid var(--line);border-radius:8px;padding:10px 12px}
.st-card h2{margin:0 0 4px}
.st-sub{margin:6px 0 8px}
.st-sub input{max-width:22em}
.st-hp{position:absolute;left:-9999px}   /* 蜜壺 — 人には見えない */
.st-sub-msg{margin:6px 0 0}
.st-mchip{color:#4a5ac0;text-decoration:none;border:1px solid #d7dbf5;background:#f2f3fb;border-radius:6px;padding:1px 7px;white-space:nowrap}
.st-mchip:hover{background:#e8eaf6}
table.st-t{border-collapse:collapse;width:100%;min-width:34em}table.st-t td,table.st-t th{padding:7px 10px;border-bottom:1px solid var(--line);text-align:left;font-size:.92em}
/* ★Phone★: name on its own line, bars on their own line, the rest below. */
@media(max-width:760px){
  .st-row{grid-template-columns:auto minmax(0,1fr);gap:8px 10px}
  .st-row .sys{grid-column:2}
  .stb,.st-open{grid-column:1/-1}
  .st-med,.st-badge{grid-column:auto}
  .st-med{min-width:0;text-align:left}
  /* #700 (2): ★phone は 1 列で上下★（左が上・右が下）— BOSS の指定どおり。 */
  .st-cols{grid-template-columns:minmax(0,1fr)}
}


.pftbl th{width:12em;white-space:nowrap;vertical-align:top}
.pftbl td{}
.pf-note{color:var(--sub);font-size:var(--fz-p2);margin:2px 0 0 4px}
.pf-sep{height:6px}
.pf-src{font-size:var(--fz-p2);margin-left:4px}
/* ★事実の隣に見える出所の 1 行★（#495・BOSS 2026-08-18）:
     ［誰が×どう得たか］ 出典（短） (調査日) ほか N 件 ［詳細・原文を読む］
   ★大きさは全画面 P2 で固定★ — 頁ごとに出典の目立ち方が違うと、同じ資料が別の格に見える。
   ★色は部品ごとに持つ★（この器では指定しない）— 器に色を置くと、この中で開く .pf-c の
   本文までその色を継いでしまう（開いた原文が灰色になる）。 */
/* ★頁の頭の「この頁は何でできているか」★（#495）— 題のすぐ下・P2・地の色より薄く。
   本文と同じ大きさで出すと宣言が本文に見え、消すと機械が拾えない。 */
.srcdecl{font-size:var(--fz-p2);color:var(--sub);margin:2px 0 14px;max-width:52em}
.ev-line{font-size:var(--fz-p2);margin-top:6px;line-height:1.9;display:flex;flex-wrap:wrap;align-items:center;gap:2px 6px}
.ev-line>*{vertical-align:middle}
/* ★札は［詳細・原文を読む］と同じ背丈★（BOSS 2026-08-18: 標籤太大→改小）— .ctag 素の
   padding(3px 11px)/radius(14px) は札を釦より大きく見せていた。行の中だけ釦と同尺に。 */
.ev-line .ctag{padding:1px 7px;border-radius:7px}
/* 日付は箱ではなく括弧の素の文字 (2026-08-10) — 器の中では daytag の箱装いを剥がす */
.ev-line .daytag{background:transparent;border:0;padding:0;color:var(--sub)}
.ev-day{color:var(--sub);white-space:nowrap}
.ev-src{margin:0;overflow-wrap:anywhere}
.ev-rest{color:var(--sub);white-space:nowrap}
.ev-line .pf-more,.ev-line .cp-det{margin-left:2px}
/* 開く箱（.pf-c）は flex の行に混ざらず、次の行の全幅へ落ちる */
.ev-line .pf-c{flex:1 1 100%}
/* 地の文の中の URL — 押せることが分かる程度に控えめ（P2 の中なので大きさは継ぐ） */
.pf-inline{overflow-wrap:anywhere}
.pf-kind{display:inline-block;border:1px solid var(--line);border-radius:8px;padding:0 6px;font-size:var(--fz-p2);color:var(--sub);vertical-align:middle;margin-left:4px}
/* ★［system］タグ = 灰色の小さな字（doc 93 §7.5.1-8 v6.2）★ — 合併 view で「どの製品の話か」を
   名指す印。★値そのものより弱く見えなければならない★（値の一部に見えたら、それは名指しでは
   なく値の変更になる）ので、地の色より薄い灰・小さめ・枠は細く。 */
.systag{display:inline-block;border:1px solid var(--line);background:var(--soft);border-radius:7px;
  padding:0 5px;font-size:var(--fz-p2);font-weight:400;color:var(--sub);vertical-align:middle;margin-left:4px;white-space:nowrap}
.pf-kind.pf-measured{border-color:var(--acc);color:var(--acc)}
.pf-kind.pf-editorial{border-style:dashed}
.pf-info{cursor:help;position:relative;margin-left:4px}
.pf-info .pf-pop{display:none;position:absolute;left:1.4em;top:-4px;z-index:40;width:min(340px,72vw);background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 8px 28px rgba(0,0,0,.13);padding:8px 11px;font-size:var(--fz-p2);color:var(--fg);white-space:normal}
.pf-info:hover .pf-pop,.pf-info:focus .pf-pop{display:block}
.pf-state{display:inline-block;border-radius:8px;padding:0 7px;font-size:var(--fz-p2);font-weight:700;vertical-align:middle}
/* 印は /method へ飛ぶ。押せることは分かるが、色は状態の色のまま（下線は hover のみ） */
a.pf-state{text-decoration:none;cursor:help}
a.pf-state:hover{text-decoration:underline}
.pf-closed{background:#fdf0e6;border:1px solid #e8c39b;color:#8a4b12}
.pf-todo{background:var(--soft);border:1px solid var(--line);color:var(--sub)}
.openness{border:1px solid var(--line);border-radius:10px;padding:9px 12px;margin:8px 0 14px;background:var(--soft)}
/* 尽調の要約 — 頁の最上部。meta description と同じ文（dueDiligence が唯一の出どころ） */
.pf-axis{font-size:var(--fz-h2);margin:22px 0 2px;padding-bottom:4px;border-bottom:2px solid var(--line)}
.pf-why{margin:0 0 8px;color:var(--sub);font-size:var(--fz-p2);line-height:1.6}
.pf-of{display:inline-block;margin-right:6px;padding:0 6px;border-radius:5px;background:var(--face);
  color:var(--sub);font-size:var(--fz-p2);vertical-align:1px}
.pf-sub .pf-lbl{font-weight:400}
.ddlead{margin:2px 0 10px;color:var(--sub);font-size:var(--fz-p2);line-height:1.7}
/* #701 稼働の一言 — 題の直下の 1 行。★生の px を書かない★（font-scale の門）ので既存の段を使う。 */
.upl{margin:2px 0 10px;color:var(--sub);font-size:var(--fz-p2);line-height:1.7}
.upl a{color:inherit}
/* ★#690 (1) 結論ブロック★ — BOSS「薄い緑の block」。中の数は必ず数えたもの（page-connect.ts）。 */
.pconc{background:#f2f8f5;border:1px solid #cfe6da;border-left:3px solid var(--acc);border-radius:8px;padding:10px 14px;margin:4px 0 14px}
.pconc-head{margin:0 0 6px;font-weight:700}
.pconc-row{margin:4px 0;line-height:1.8}
/* ★系統頁の結論に足した「読者が先に知りたい 3 つ」★（#719・BOSS 2026-09-09）— 連携の行とは
   性質が違う（方式ではなく前提）ので、点線で分けて P2 に落とす。★別の箱は作らない★ —
   同じ結論の中に在ることが、この 3 つも結論の一部だという意味になる。 */
.pconc-facts{margin-top:8px;padding-top:8px;border-top:1px dashed #cfe6da;font-size:var(--fz-p2);color:var(--sub)}
.pconc-facts b{color:var(--fg)}
/* ★#690 (6)★ チップと本文の上下中央揃え — inline-flex は既定で baseline 揃えなので、
   padding と border のぶんチップだけ下がって見える（BOSS 実機 2026-09-05）。 */
.pconc-head .pconc-tag,.pconc-row .pconc-tag{vertical-align:middle}
.pconc-link{vertical-align:middle}
.pconc-tag{display:inline-flex;align-items:center;vertical-align:middle;line-height:1.4;gap:5px;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:2px 10px;font-size:var(--fz-p2);font-weight:700;color:var(--fg);cursor:pointer}
.pconc-tag:hover{border-color:var(--acc)}
.pconc-link{color:var(--acc);text-decoration:underline;text-underline-offset:2px} .alias{color:var(--sub);font-size:var(--fz-p2);margin:2px 0 8px}
.openness .op-line{font-size:var(--fz-p2);margin:3px 0}
.openness .hint{color:var(--sub);font-size:var(--fz-p2);margin-top:6px;line-height:1.6}
/* ★技術寄りの行は、別表に切り出さず同じ軸の中に置き、札で示す★（BOSS 2026-08-26）—
   「業務ワークフロー円滑度の項目なら、その中に書けばよい」。札は控えめに（読み飛ばせるように）。 */
.pf-deepof{opacity:.75}
.pf-ofrow{display:block;margin-bottom:3px}
/* 訂正履歴 — ★#650（BOSS 2026-08-31）で折り畳みに変更★ — タイトルと件数は常時可視、
   中身はクリックで開く。記録を消さない不変量は不変（旧「畳まない」はこの裁定で上書き）。 */
.corrfold{margin:18px 0}
.corrfold>summary{cursor:pointer;list-style:none}
.corrfold>summary::-webkit-details-marker{display:none}
.corrfold .corr-h2{display:inline-block;margin:0}
.corrfold>summary .corr-h2::after{content:' ▸';color:var(--sub);font-weight:400}
.corrfold[open]>summary .corr-h2::after{content:' ▾'}
.crtbl th{width:auto;white-space:nowrap}
.crtbl td{vertical-align:top}
.crtbl .cr-d{white-space:nowrap;color:var(--sub);font-variant-numeric:tabular-nums}
.crtbl .cr-c code{font-size:var(--fz-p2);color:var(--sub)}
.crtbl .cr-why{color:var(--sub);font-size:var(--fz-p2);margin-top:3px}
/* #543 線の一覧 — ★1 行は 2 行分の高さに収める★（BOSS 2026-08-06）。
   長い出典は clamp して隠すが、★DOM からは消さない★（選択・検索・読み上げでは全文が残り、
   title で全文が出る）。表そのものは横スクロールしてよい。 */
.lsum{margin:8px 0;font-size:var(--fz-p2)}
.crsum{margin:8px 0;font-size:var(--fz-p2);color:var(--fg)}
/* 盤で線を選んだときに下へ出る、その分の根拠 */
#linesbox{margin:10px 0 0}
.lfhead{font-size:var(--fz-p2);margin:10px 0 4px;color:var(--fg)}
.lft{font-size:var(--fz-p2)}
#lt{table-layout:auto}
#lt td,#lt th{vertical-align:top}
/* システム名・日付は 1〜2 行で足りるので詰める */
#lt .lsys{min-width:7em;max-width:11em}
#lt .lmet{width:1%;white-space:nowrap}
#lt .lday{width:1%;white-space:nowrap}
#lt .lprodc{min-width:11em;max-width:16em}
#lt .lsrc{min-width:20em;max-width:34em}
/* ★1 マスの中は 1 行ずつ★ — 資料・出典は「1 行目＝出典(URL)／2 行目＝補足」なので、
   それぞれ 1 行に締めて、行全体が 2 行に収まるようにする（BOSS 2026-08-06）。
   全文は title と DOM に残る（選択・検索・読み上げでは切れない）。 */
.lclamp1{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;line-clamp:1}
.lprod{margin-top:3px;font-size:var(--fz-p2);color:var(--sub)}
.lm{font-size:var(--fz-p2);white-space:nowrap}
.lsrc1{font-size:var(--fz-p2)}
.lnote{color:var(--sub);font-size:var(--fz-p2);margin-top:2px}
/* 方式は盤と同じ色（LINE_COLOR から生成） */
.mtag{display:inline-block;padding:2px 10px;border-radius:12px;font-size:var(--fz-p2);font-weight:700;color:#fff;white-space:nowrap}
/* 調査日は灰のタグ */
.daytag{display:inline-block;padding:2px 8px;border-radius:10px;font-size:var(--fz-p2);background:var(--soft);color:var(--sub);border:1px solid var(--line);font-variant-numeric:tabular-nums;white-space:nowrap}

.pftbl tr[id]{scroll-margin-top:60px}
/* .pf-citebtn の見た目は MAP_CSS（全頁）— 見出しの釦は個票以外にも出るため。 */
a.pf-kind{text-decoration:none}
a.pf-kind:hover{background:var(--acc);color:#fff}
/* ── #534 three-column layout: A=項目+① / B=②(+⑤) / C=③④ behind 詳細表示 ── */
.pf-scroll{overflow-x:auto}
.pf5 thead th{font-size:var(--fz-p2);color:var(--sub);white-space:nowrap;background:var(--soft)}
.pf-colnote{display:inline-block;margin-left:6px;font-weight:400;border:1px solid var(--line);border-radius:8px;padding:0 6px;font-size:var(--fz-p2)}
.pf5 td{vertical-align:top}
/* ★A 列は狭く★ (BOSS 2026-08-04): 項目名とタグだけの列に幅を与えても情報密度は上がらない。
   残りを②（2 列時）／②③④（3 列時）に回す。表全体の約 1/6。 */
.pf5 td.pf-a,.pf5 th:first-child{width:16%}
/* ②③④ read as supporting text — one unified grey voice (BOSS 2026-08-04); ① stays black */
.pf5 td.pf-b,.pf5 td.pf-c{color:var(--sub)}
.pf-lbl{font-weight:700}
/* ★[引用] は行に触れたときだけ出す★ (BOSS 2026-08-05) — 既定で全行に出ていると、読む前に
   ボタンが目に入る。hover / focus は CSS、触る端末の click は .hot（スクロールで解除）。 */
.pftbl .pf-citebtn{opacity:0;pointer-events:none;transition:opacity .12s}
/* ★#4349（BOSS 実機 2026-09-06）: 触る端末で 1 回目のタップが hover に食われる★
   iOS Safari は「hover の規則を持つ要素」への 1 回目のタップを ★hover の適用★ に使い、
   click は 2 回目に回す。だから phone では 1 回目で [引用] が出るだけ・2 回目で展開になる。
   ⟹ hover の規則を (hover: hover) の中に閉じ込め、★触る端末には hover の規則を存在させない★。
   触る端末の道は今までどおり .hot（同じタップの click で付く）と :focus-within。
   ★UA は見ない・CSS はこの 1 か所・cellFold の咽喉は触らない★。 */
@media (hover:hover){
  .pftbl tr:hover .pf-citebtn{opacity:1;pointer-events:auto}
}
.pftbl tr:focus-within .pf-citebtn,.pftbl tr.hot .pf-citebtn{opacity:1;pointer-events:auto}
.pf-states{margin:4px 0 0}
/* ★③④ は②のマスの中に、そのマスのボタンで開く★ (BOSS 2026-08-05) — 列ではなくなったので
   横スクロールも不要になった。 */
.pf-c{display:none;border-top:1px dashed var(--line);margin-top:7px;padding-top:7px}
/* ★#690 (8)★ 一言だけの初期表示 — ★通常の字体★（太字・大きい字にしない）。
   釦に見えすぎないよう枠は持たせず、押せることは下線と手の形で示す。 */
.pf-lead-btn{display:block;width:100%;text-align:left;border:0;background:transparent;padding:0;
font:inherit;font-weight:400;color:var(--fg);cursor:pointer;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--line)}
.pf-lead-btn:hover{text-decoration-color:var(--acc)}
.pf-fold{display:none;margin-top:6px}
.pf-fold.open{display:block}
/* ★#697（BOSS 実機 2026-09-06）— 幅で 2 段。判定は ★この 1 か所だけ★（UA を見ない）。
   閾 768px = iPhone 縦(390) は折り／iPad 縦(768) は展開、という BOSS の 2 段そのもの。

   ★HTML は 1 種類のまま★（両方描いて片方を隠す形にしない）— 二重に描くと同じ内容が
   DOM に 2 つ在ることになり、読み上げも検索も 2 度拾う。#690 の考卷が見ている
   .pf-lead-btn / .pf-fold の形も変えずに済む。切り替えは ★見え方だけ★。

   ・system 頁（.pf5 = 五層の個票表）: PC/tablet では ★折らずに展開★ —
     一言だけだと内容が薄い、という BOSS の指摘。.open の有無に関わらず開いた形にするので、
     鍵盤で釦に触れても閉じない（JS は .open を付け外しするだけ）。
   ・connect 頁（#pfwrap の pairtbl）は ★両幅とも折りたたみのまま★ — 目的が違う（接続方式の一覧）。
     .pf5 を持たないので、上の規則は当たらない。 */
@media (min-width:768px){
  .pf5 .pf-fold,.pf5 .pf-fold.open{display:block}
  /* 展開形では一言は「押す物」ではない ⟹ 下線と手の形を外し、押しても何も起きないことを見た目と一致させる */
  .pf5 .pf-lead-btn{pointer-events:none;text-decoration:none;cursor:default;font-weight:700}
}
/* connect 頁 phone: ★B 列を A 列と同じ幅にし、表だけを横に流す★（BOSS 実機 — 今は B 列が
   潰れて 1 行 3〜4 文字で縦に伸びる）。★頁本体は横に伸ばさない★ ので overflow は表の親に置く。 */
@media (max-width:767px){
  #pfwrap{overflow-x:auto}
  #pfwrap .pairtbl{table-layout:fixed;min-width:640px}
  #pfwrap .pairtbl th.colh{width:40%}
}
tr.cellopen .pf-c,.pf-c.open{display:block}
.pf-more{border:1px solid var(--line);background:transparent;color:var(--acc);border-radius:7px;
  padding:1px 9px;font-size:var(--fz-p2);cursor:pointer;margin-top:6px}
.pf-more:hover{background:var(--soft)}
.pf-dim{color:var(--sub)}
/* ②の冒頭＝要点。★灰色の地の文に対して、ここだけ黒の太字★（重要度の差を字面で出す） */
/* ★The correction log is detail — P2 throughout★ (BOSS 2026-08-10). It matters that it
   exists and can be read, not that it competes with the facts above it. */
.corr-body{font-size:var(--fz-p2)}
.pf-lead{margin:3px 0;font-weight:700;color:var(--fg)}
/* ★長い地の文は P2 の灰色／短い要約（pf-lead）は P1 の太字★（BOSS 2026-08-10）—
   同じマスの中で「まず読む 1 行」と「読まなくてもよい詳細」を字面で分ける。 */
.pf-ed,.pf-refline{font-size:var(--fz-p2);color:var(--sub)}
.pf-ed{margin:2px 0}
.pf-refline{margin:3px 0}
.pf-vnote{border:1px solid #2563eb55;background:#eaf1fd;border-radius:8px;padding:6px 9px;margin:6px 0;font-size:var(--fz-p2)}
.pf-vnote-tag{font-weight:700;color:#123c78;font-size:var(--fz-p2);margin-right:4px}
.pf-vnote-by{color:var(--sub);font-size:var(--fz-p2)}
.pf-mlink{font-size:var(--fz-p2);display:inline-block;margin:1px 0 4px}
/* ★開いた③④の末尾に「調査日」を 1 回★（doc 95 §3.5.2.2-2）— 札が要求する「URL ＋ 日付」の
   日付側。行ごとに繰り返すと同じ値が並んで出典が埋もれるので、塊に 1 つ。 */
.pf-refon{margin-top:6px;font-size:var(--fz-p2);color:var(--sub)}
/* 塊の見出しに付く出所の札 = ［誰が × どう得たか］＋ その数え方への道（provenance.originChipBlock）。
   2 つで 1 つの意味なので、間を詰めて 1 かたまりに見せる。 */
.pf-originblk{display:inline-flex;align-items:center;gap:6px;vertical-align:middle;margin-left:6px}
.pf-originblk .pf-mlink{margin:0}
@media(max-width:700px){
  .pf5 thead{display:none}
  .pf5 td.pf-b>.pf-dim{display:none}          /* a bare — is noise when stacked */
  /* ★スマホでは 1 列目も full-width★ (BOSS 2026-08-05) — PC の 1/6 をそのまま持ち込むと
     タグが 1 文字ずつ折り返して読めなくなる（「FISC 基準のデータセンター」が縦に潰れた）。 */
  .pf5 td.pf-a,.pf5 td.pf-b{display:block;width:auto}
}
.pf-qbtn{border:1px solid var(--acc);background:transparent;color:var(--acc);border-radius:8px;padding:2px 10px;font-size:var(--fz-p2);cursor:pointer}
.pf-qbtn:hover{background:var(--acc);color:#fff}
.pf-qbtn:disabled{opacity:.5;cursor:default}
.pf-qsrc{color:var(--sub);font-size:var(--fz-p2);margin-left:8px}
/* ★対のページ: 1 項目 × 横に 2 製品★ — 各セルの中で ①② を縦積みし、【詳細表示】で③④が
   同じセルの中に開く。個票と並べ方だけが違い、中身は同じ cellParts が作っている。 */
.pctbl td.pc{vertical-align:top;color:var(--sub)}
.pctbl td.pc .pf-lead{color:var(--fg)}
/* ★④原文は【詳細】であって主役ではない★（BOSS 2026-08-14）— 開いた先に出る補足なので、
   本文と同じ大きさ・同じ濃さで並ぶと、読むべき②の要点より目立ってしまう。P2・灰にそろえる
   （四段の文字尺度どおり: 見出し / 本文 / P2 灰 の 3 種類しか使わない）。 */
blockquote.pf-q{margin:6px 0 6px 4px;padding:6px 10px;border-left:3px solid var(--line);background:var(--soft);
  border-radius:0 8px 8px 0;font-size:var(--fz-p2);color:var(--sub)}
blockquote.pf-q .pf-src{display:block;margin-top:2px}
/* #549 外から触れる業務オブジェクト表（capabilityBlock）。●=仕様に記載 ◯=第三者から — の 4 記号は
   doc 91 §8.2 の 3 値＋等級の画面語。色は意味に紐づく（緑=強い根拠・黄=第三者・赤=明記された不可・灰=不明） */
/* ★表は幅いっぱいに使い、余った幅は【項目】の列に渡す★（BOSS 2026-08-09 実機）。
   以前は table 自身が display:block + overflow-x:auto のスクロール容器を兼ねていた。この形だと
   表は中身の最小幅までしか広がらない（block なので width:100% が効かない）ので、記号の列が
   間延びする一方で、いちばん読みたい【項目（日本(英文)）】が狭いまま折り返されていた。
   ⟹ スクロールは外側の .cap-scroll に持たせ、table は width:100% の table のままにする。
   これで「余白は項目列へ」「狭い画面では表だけが滑る」の両方が成り立つ。 */
.cap-scroll{overflow-x:auto;margin:10px 0;-webkit-overflow-scrolling:touch}
/* ★min-width:max-content は付けない★ — 折り返し可の列（対象・項目）まで「折り返さない幅」を
   主張してしまい、画面が広くても常に横スクロールになる。width:100% だけにすると、
   nowrap の記号列が最小幅を決め、余りが折り返す 2 列に配られる。記号列だけで画面を
   超えたときに初めて .cap-scroll が滑る — それが狙いどおりの挙動。 */
/* ★狭い画面では潰さず、表だけを滑らせる★（BOSS 2026-08-09）— 確認 375px で表が 335px に
   縮み、いちばん読みたい【項目】列が 134px しか無かった。下限を【固定値】で置くと、
   広い画面では width:100% が勝ち、狭い画面では .cap-scroll が横に滑る。
   ★max-content は使わない★ — あれは中身次第で青天井になり、広い画面でも常に滑ってしまう。 */
.captbl{border-collapse:collapse;margin:0;width:100%;min-width:640px}
.captbl th,.captbl td{border:1px solid var(--line);padding:4px 9px;text-align:center;white-space:nowrap}
/* ★伸びるのは 対象 と 項目 の 2 列だけ★ — 記号や向きの列は中身の幅で足りる。 */
.captbl td.cp-obj{text-align:left;white-space:normal;overflow-wrap:anywhere;width:22%}
.captbl td.cp-flds{width:52%}
/* ★出典の列は【1 行の流れ】★（BOSS 2026-08-18 差し戻し: 5 段積みは見苦しく mobile 不可）—
   ［札］リンク (日付) ［詳細…］ を折り返さず 1 行に並べ、幅が足りない分は .cap-scroll が
   横に滑る（PC/mobile とも row は 1 行、表ごと横 scroll）。リンクは ≤15 字に短縮済みなので
   行は青天井にならない。 */
.captbl td.cp-ev{text-align:left;white-space:nowrap}
/* ★Notion 型の横 scroll = 列幅を宣言した固定レイアウト★（BOSS 2026-08-18 指定）。
   auto layout は %-列（項目）と nowrap の出典列が制約環を作り、表が指定幅に cap された
   ままセルが表箱の外へはみ出て scroll の届かない領域に消えた（実機 375px で確認）。
   列幅の宣言は capability.ts の colgroup が唯一の源；ここは layout の宣言と、
   %-指定の解除（colgroup が全列を握るので % は残すと二重指定）だけ。 */
.captbl-ev{table-layout:fixed;width:auto;min-width:100%}
.captbl-ev td.cp-obj,.captbl-ev td.cp-flds{width:auto}
/* 表の中の出所行は素の inline 流（flex は table layout と組ませない — 同日実機） */
.captbl td.cp-ev .ev-line{margin:0;display:block;white-space:nowrap}
.captbl td.cp-ev .ev-line>*{margin-right:6px}
.captbl td.cp-ev .ev-src{overflow-wrap:normal}
.captbl td.cp-sf{color:var(--sub)}
/* ★記号は全部太字・白地で読める色★（BOSS 2026-08-09 実機）— ●◯✕？ は表の主役。
   旧の配色（淡緑 #7ee2a8・淡黄 #e6d17a・淡赤 #e88）は暗い背景を前提にした値で、
   白地では薄すぎた。★？の紫は「意味の色」の体系から外れていた★ので灰へ戻す:
     ● 緑 = ベンダーの公開仕様に記載 ／ ◯ 黄（琥珀）= 第三者の公開情報から
     ✕ 赤 = できないと明記 ／ ？ 灰 = 調査したが記載を見つけられず ／ 空欄 = 一次資料が未確認
   黄は白地で純黄だと見えないので、読める濃さの琥珀にしている（色名ではなく可読性を取る）。 */
.cp-v,.cp-t,.cp-no,.cp-na,.cp-q{font-weight:700}
.cp-v{color:#0b6e4f}
.cp-t{color:#a86a00}
.cp-no{color:#b3261e}
.cp-na{color:var(--sub)}
.cp-items{color:var(--sub);font-size:var(--fz-p2);margin-left:4px}
.cp-q{color:var(--sub)}
/* 記号の凡例（表の下）でも同じ太さで見せる — 表と凡例で見た目が違うと対応が取れない */
.caplegend b{font-weight:700}
.captbl .cp-blank{background:transparent}
.captbl td.cp-flds{text-align:left;white-space:normal;overflow-wrap:anywhere;color:var(--sub);font-size:var(--fz-p2)}
.cp-en{color:var(--sub);font-size:var(--fz-p2);margin-left:1px}
.cp-det{font:inherit;font-size:var(--fz-p2);padding:2px 8px;border:1px solid var(--line);border-radius:6px;background:var(--soft);color:var(--fg);cursor:pointer;white-space:nowrap}
.cp-det:hover{border-color:var(--fg)}
/* ★詳細行は表の横幅を広げない★（BOSS 2026-08-07 差し戻し: 展開すると横に伸びた）。
   colspan セルの中身が nowrap を継承して表全体を引き伸ばしていた — 中で折り返す。 */
.cp-detrow td{text-align:left;background:var(--soft);white-space:normal}
.cpd{padding:6px 4px;max-width:56em;overflow-wrap:anywhere}
.cpd a{overflow-wrap:anywhere}
.cpd-op{margin:4px 0}
.cpd-op ul{margin:2px 0 6px 18px;padding:0}
.cpd-flds{margin:4px 0;line-height:1.9}
/* タブ（API連携/ファイル連携/画面連携）— 連携マップの線の色と同じ点を持つ。中身は選ばれた時だけ取得 */
/* ★方式タブ（API/CSV/画面連携）の中身は全部 P2★（BOSS 2026-08-10）— ここは
   細部の置き場（項目対照・連携ツール・内訳）なので、本文と同じ大きさで並べると節見出しと
   細部の区別が付かなくなる。親 1 箇所で決める（表やチップに個別指定を散らさない）。 */
#captabbody{font-size:var(--fz-p2)}
/* ★本物のタブ（#650 / BOSS 2026-08-31）★ — 丸薬型の釦から、パネルに接続したタブへ。
   選択中タブは背景がパネルと同じ白になり、下辺がパネルと繋がって見える。 */
.captabs{display:flex;gap:4px;align-items:flex-end;flex-wrap:wrap;margin:18px 0 0;border-bottom:2px solid var(--line)}
.captabs .ct{font:inherit;font-size:var(--fz-p2);padding:7px 14px;border:1px solid var(--line);border-bottom:none;border-radius:9px 9px 0 0;background:var(--soft);color:var(--sub);cursor:pointer;display:inline-flex;align-items:center;gap:6px;margin-bottom:-2px}
.captabs .ct.on{background:var(--bg);color:var(--fg);border-color:var(--line);border-bottom:2px solid var(--bg);font-weight:700}
#captabbody,.captabbody{border:1px solid var(--line);border-top:none;border-radius:0 0 10px 10px;padding:10px 12px;margin-bottom:14px}
#captabbody[hidden],.captabbody[hidden]{display:none}
.captabs .ctdot{width:9px;height:9px;border-radius:50%;display:inline-block}
.captabs .cthint{color:var(--sub);font-size:var(--fz-p2);flex-basis:100%;order:99;margin:6px 0 6px}
/* 方式差分 block（各タブの下・BOSS 手描き設計）と 対ページ 3 列表の空欄セル */
.sdiff{border:1px solid var(--line);border-radius:10px;padding:8px 12px;margin:10px 0;background:var(--soft)}
.sdiff h3{margin:2px 0 6px;font-size:var(--fz-p1)}
.bizgrp td.bg-none{color:var(--sub)}
.bizgrp details.bg-only{margin-top:4px;font-size:var(--fz-p2)}
/* ★対応づかなかった欄 = 灰色の小さな字★（BOSS 2026-08-08: tag だと対応した項目と同じ重みに見える） */
.bg-rest{margin-top:6px;color:var(--sub);font-size:var(--fz-p2);line-height:1.7}
.bg-rest-t{display:block;color:var(--sub);font-weight:600;font-size:var(--fz-p2);margin-bottom:1px}
.bg-more{color:var(--sub);opacity:.75}
/* 対応づけの段: 名前が同じ=実線／意味で判定=破線／要確認=?印 */
.pm-vocab{border-style:dashed}
/* ★推測段 = 点線＋淡色★（五律・五: 推測と確認を必ず描き分ける） */
.pm-guess{border-style:dotted;opacity:.72}
.pm-guess-inline{border-bottom:1px dotted var(--sub)}
.pm-arrow{color:var(--sub);font-weight:400}
.pm-q{color:#b45309;font-weight:700;margin-left:2px}
.pm-brk{color:var(--sub);font-size:var(--fz-p2);margin:2px 0 4px}


.kmark,.kmark-blank{vertical-align:-2px;flex:0 0 auto;display:inline-block}
.kmk{display:inline-flex;align-items:center;gap:6px}


.bp-badge{font-size:var(--fz-p2);color:var(--sub);border:1px solid var(--line);border-radius:8px;padding:1px 6px;margin-left:6px}
.bp-dim{opacity:.5}
.bp-sec{margin:14px 0}
.taggroup{display:flex;flex-wrap:wrap;gap:6px}


.nf{border:1px solid var(--line);border-radius:10px;padding:14px 16px;background:var(--soft);margin:0 0 10px}
.nf label{display:block;font-size:var(--fz-p2);color:var(--sub);margin:10px 0 3px}
.nf input[type=text],.nf input[type=url],.nf textarea,.nf select{width:100%;box-sizing:border-box;
  border:1px solid var(--line);border-radius:8px;padding:7px 9px;font-size:var(--fz-p1);
  font-family:inherit;background:var(--bg);color:var(--fg)}
.nf textarea{min-height:110px;resize:vertical}
.nf .row{display:flex;gap:10px;flex-wrap:wrap}
.nf .row>div{flex:1 1 220px;min-width:0}
.nf .chk{display:flex;align-items:flex-start;gap:7px;margin-top:10px;font-size:var(--fz-p2);color:var(--sub)}
.nf .chk input{margin-top:3px}
.nf button[type=submit]{margin-top:12px;border:0;background:var(--acc);color:#fff;border-radius:8px;
  padding:9px 20px;font-size:var(--fz-p1);cursor:pointer}
.nf button[type=submit]:disabled{opacity:.5;cursor:default}
.nf .note{font-size:var(--fz-p2);color:var(--sub);margin:6px 0 0}
.nf .said{font-size:var(--fz-p1);margin-top:12px}
/* ★間違いはその場で、赤い小さな字で★ — 送信してから叱らない（直す材料を先に渡す） */
.nf .nf-err{color:#b3261e;font-size:var(--fz-p2);margin:3px 0 0}
.nf .req{color:#b3261e;font-weight:700}
.nf .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
/* 2 枚のタブ。押されている方だけ地の色を持つ（どちらの約束の下に居るかが一目で分かる） */
.nf-tabs{display:flex;gap:6px;margin:10px 0 0}
.nf-tab{border:1px solid var(--line);border-bottom:0;background:var(--bg);color:var(--sub);
  border-radius:9px 9px 0 0;padding:7px 16px;font-size:var(--fz-p1);font-family:inherit;cursor:pointer}
.nf-tab[aria-selected=true]{background:var(--soft);color:var(--fg);font-weight:700}
.nf-lead{font-size:var(--fz-p2);color:var(--sub);background:var(--soft);
  border:1px solid var(--line);border-bottom:0;margin:0;padding:12px 16px 0}
.nf-files{list-style:none;padding:0;margin:6px 0 0;font-size:var(--fz-p2);color:var(--sub)}
.nf-files li{padding:2px 0}
.nf-files li.bad{color:#b3261e}
/* ★確認・完了の面★ — フォームと同じ枠に見えるように、同じ角丸・同じ余白で組む。 */
.nf-panel{border:1px solid var(--line);border-radius:10px;padding:16px 18px;margin:14px 0;background:var(--soft)}
.nf-panel h3{margin:0 0 10px;font-size:var(--fz-h2)}
.nf-panel dl{margin:0;display:grid;grid-template-columns:9em 1fr;gap:6px 12px;font-size:var(--fz-p2)}
.nf-panel dt{color:var(--sub)}
.nf-panel dd{margin:0;white-space:pre-wrap;word-break:break-word}
#nf-srcs{display:grid;gap:6px}
.nf-panel dd.imp{font-weight:700}
.nf-acts{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.nf-acts button{padding:9px 16px;border-radius:8px;border:1px solid var(--line);
  background:var(--bg);color:var(--fg);font-size:var(--fz-p2);cursor:pointer}
.nf-acts button.primary{background:var(--acc);border-color:var(--acc);color:#fff;font-weight:700}
.nf-acts button[disabled]{opacity:.55;cursor:default}