/* ============================================================
   In Fact Press — Design tokens
   **確度は色で示さない。線種で示す。**
   色に価値の含意を持たせないため（サイトデザイン規約）。
   【否定済】を赤にすることは、否定を「悪」と色分けすることである。
   ============================================================ */
:root, :root[data-theme="light"]{
  color-scheme: light;
  --plane:#f4f4f1;
  --surface:#fcfcfb;
  --surface-2:#f0efec;
  --ink:#0b0b0b;
  --ink-2:#52514e;
  --ink-3:#898781;
  --rule:#e1e0d9;
  --rule-strong:#c3c2b7;
  --brand:#2a78d6;
  --brand-ink:#184f95;
  --header-bg:#0b0b0b;
  --header-ink:#fcfcfb;

  --warn:#d03b3b;
}
:root[data-theme="dark"]{
  color-scheme: dark;
  --plane:#0d0d0d;
  --surface:#16161a;
  --surface-2:#232327;
  --ink:#ffffff;
  --ink-2:#c3c2b7;
  --ink-3:#898781;
  --rule:#2c2c2a;
  --rule-strong:#383835;
  --brand:#3987e5;
  --brand-ink:#86b6ef;
  --header-bg:#000;
  --header-ink:#fcfcfb;

  --warn:#e66767;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--plane); color:var(--ink);
  font-family:"Hiragino Kaku Gothic ProN","Noto Sans JP",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:16px; line-height:1.8; -webkit-font-smoothing:antialiased;
}
.mono{font-family:ui-monospace,"SF Mono","Roboto Mono",Menlo,monospace}
a{color:inherit}
h1,h2,h3,h4{line-height:1.35; margin:0; font-weight:700; letter-spacing:.01em}

/* ---------- site header ---------- */
.site-head{background:var(--header-bg); color:var(--header-ink)}
.head-in{max-width:1180px; margin:0 auto; padding:0 24px}
.head-top{display:flex; align-items:center; gap:20px; padding:18px 0 14px}
.wordmark{display:flex; align-items:baseline; gap:10px; text-decoration:none}
.wordmark .wm{
  font-weight:800; font-size:22px; letter-spacing:.14em; line-height:1;
}
.wordmark .wm .fact{
  background:var(--header-ink); color:var(--header-bg); padding:3px 6px; margin:0 1px;
}
.wordmark .tag{font-size:10px; letter-spacing:.22em; color:#9a9a94}
.head-top .spacer{flex:1}
.head-date{font-size:11px; letter-spacing:.1em; color:#9a9a94}
.site-nav{display:flex; gap:2px; overflow-x:auto; scrollbar-width:none}
.site-nav::-webkit-scrollbar{display:none}
.site-nav a{
  text-decoration:none; color:#c9c9c3; font-size:13px; font-weight:600;
  padding:9px 14px; white-space:nowrap; border-bottom:2px solid transparent; transition:.12s;
}
.site-nav a:hover{color:#fff}
.site-nav a[aria-current="page"]{color:#fff; border-bottom-color:var(--brand)}
.site-nav .n-count{font-size:10px; color:#8f8f89; margin-left:5px}

/* ---------- layout ---------- */
.wrap{max-width:1180px; margin:0 auto; padding:32px 24px 80px}
.wrap-narrow{max-width:760px}
.grid{display:grid; grid-template-columns:1fr 320px; gap:48px; align-items:start}
@media (max-width:900px){.grid{grid-template-columns:1fr; gap:32px}}

.sect-head{
  display:flex; align-items:baseline; gap:12px;
  border-bottom:2px solid var(--ink); padding-bottom:8px; margin:0 0 20px;
}
.sect-head h2{font-size:15px; letter-spacing:.08em}
.sect-head .sub{font-size:11px; color:var(--ink-3); letter-spacing:.04em}
.sect-head .spacer{flex:1}

/* ---------- hero / stat tiles ---------- */
.hero{
  background:var(--surface); border:1px solid var(--rule); border-radius:4px;
  padding:26px 28px; margin-bottom:28px;
}
.hero .kicker{font-size:11px; letter-spacing:.16em; color:var(--ink-3); margin-bottom:6px}
.hero h1{font-size:26px; margin-bottom:6px}
.hero .note{font-size:13px; color:var(--ink-2); margin:0}
.tiles{display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:1px; background:var(--rule); margin-top:22px; border:1px solid var(--rule)}
.tile{background:var(--surface); padding:14px 16px}
.tile .t-l{font-size:11px; color:var(--ink-3); letter-spacing:.04em; display:flex; align-items:center; gap:5px}
.tile .t-v{font-size:30px; font-weight:800; letter-spacing:-.02em; line-height:1.2; margin-top:2px}
.tile .t-n{font-size:11px; color:var(--ink-3)}
.tile.is-product{background:linear-gradient(180deg,var(--surface),var(--surface))}
.tile.is-product .t-v{color:var(--brand-ink)}
.tile .t-l .dot{width:7px;height:7px;border-radius:50%;background:var(--brand)}

/* ---------- 確度は「線種」で示す ----------
   6つのラベルは単色の墨で描き、**線の向きと密度だけ**で区別する。
   色を使えば、どれかが「良い」どれかが「悪い」に見える。確度は良し悪しではない。 */
:root{ --conf-ink:var(--ink-2); --conf-bg:var(--surface-2); --pat-size:auto; }
:root[data-theme="dark"]{ --conf-ink:var(--ink-2); --conf-bg:var(--surface-2); }

.c-primary{--pat:linear-gradient(var(--conf-ink),var(--conf-ink))}                                   /* ベタ＝原典に到達した */
.c-multi  {--pat:repeating-linear-gradient(0deg,var(--conf-ink) 0 1px,transparent 1px 3px)}           /* 細い横線の重なり＝複数が一致 */
.c-party  {--pat:repeating-linear-gradient(45deg,var(--conf-ink) 0 2px,transparent 2px 5px)}          /* 斜線 */
.c-est    {--pat:repeating-linear-gradient(90deg,var(--conf-ink) 0 1px,transparent 1px 4px)}          /* 縦の点線 */
.c-press  {--pat:radial-gradient(var(--conf-ink) 0.7px,transparent 0.8px); --pat-size:3px 3px}                            /* 点の粒＝根拠が薄い */
.c-denied {--pat:repeating-linear-gradient(45deg,var(--conf-ink) 0 1px,transparent 1px 4px),
                 repeating-linear-gradient(-45deg,var(--conf-ink) 0 1px,transparent 1px 4px)}         /* 交差＝打ち消し */

.chip{
  display:inline-flex; align-items:center; gap:5px; vertical-align:middle;
  font-size:10.5px; font-weight:700; letter-spacing:.02em; line-height:1;
  padding:3px 6px 3px 5px; border-radius:3px; white-space:nowrap;
  border:1px solid var(--rule-strong); background:var(--surface-2); color:var(--ink-2);
}
.chip .sw{
  width:14px; height:8px; border-radius:1px; display:inline-block;
  background-color:var(--conf-bg); background-image:var(--pat); background-size:var(--pat-size);
  border:1px solid var(--rule-strong);
}

/* ---------- confidence micro bar (stacked) ---------- */
.cbar{display:flex; height:8px; border-radius:3px; overflow:hidden; background:var(--conf-bg); gap:2px}
.cbar span{display:block; height:100%; background-color:var(--conf-bg); background-image:var(--pat); background-size:var(--pat-size)}
.cbar.lg{height:14px; border-radius:4px; gap:2px}
.legend{display:flex; flex-wrap:wrap; gap:12px; margin-top:10px; font-size:11px; color:var(--ink-2)}
.legend i{
  width:14px; height:9px; border-radius:1px; display:inline-block; margin-right:5px; vertical-align:-1px;
  background-color:var(--conf-bg); background-image:var(--pat); background-size:var(--pat-size); border:1px solid var(--rule-strong);
}
.legend b{font-variant-numeric:tabular-nums; color:var(--ink); margin-left:3px}

/* ---------- article list ---------- */
.alist{border-top:1px solid var(--rule)}
.arow{
  display:grid; grid-template-columns:88px 1fr 150px; gap:18px;
  padding:16px 4px; border-bottom:1px solid var(--rule); text-decoration:none;
  transition:background .12s; cursor:pointer;
}
.arow:hover{background:var(--surface)}
@media (max-width:720px){.arow{grid-template-columns:1fr; gap:8px}}
.arow .meta{font-size:11px; color:var(--ink-3); letter-spacing:.04em}
.badge{
  display:inline-block; font-size:10px; font-weight:800; letter-spacing:.1em;
  padding:2px 6px; border-radius:2px; background:var(--ink); color:var(--surface);
}
.badge.b-diff{background:var(--brand)} .badge.b-trace{background:#4a3aa7; color:#fff}
.badge.b-num{background:#1baf7a; color:#08261b} .badge.b-issue{background:#eda100; color:#241800}
.badge.b-brief{background:var(--surface-2); color:var(--ink-2); border:1px solid var(--rule-strong)}
.arow h3{font-size:17px; margin-bottom:5px; letter-spacing:0}
.arow .lead{font-size:13px; color:var(--ink-2); line-height:1.7; margin:0}
.arow .rail{font-size:10.5px; color:var(--ink-3)}
.arow .rail .cbar{margin-bottom:6px}
.arow .trig{display:flex; align-items:center; gap:5px; margin-top:5px}
.arow .trig::before{content:""; width:6px; height:6px; border-radius:50%; background:var(--ink-3)}

/* ---------- article body ---------- */
.abody{font-size:16.5px; line-height:2.05}
.abody p{margin:0 0 1.35em}
.a-head{border-bottom:2px solid var(--ink); padding-bottom:18px; margin-bottom:24px}
.a-head .kick{display:flex; gap:10px; align-items:center; margin-bottom:12px; font-size:11px; color:var(--ink-3)}
.a-head h1{font-size:31px; letter-spacing:-.01em; line-height:1.42}
@media (max-width:600px){.a-head h1{font-size:24px}}
.a-lead{
  font-size:15px; line-height:1.95; color:var(--ink); background:var(--surface);
  border-left:3px solid var(--ink); padding:16px 18px; margin:20px 0 8px;
}
.a-lead .lbl{font-size:10px; letter-spacing:.14em; color:var(--ink-3); display:block; margin-bottom:6px}
.a-meta{display:flex; flex-wrap:wrap; gap:16px; font-size:11.5px; color:var(--ink-3); padding:12px 0}
.sup{
  font-size:11px; vertical-align:super; color:var(--brand-ink); font-weight:700;
  text-decoration:none; padding:0 1px;
}
h2.a-h2{font-size:19px; margin:38px 0 14px; padding-left:11px; border-left:4px solid var(--ink)}

.block{border:1px solid var(--rule); background:var(--surface); border-radius:4px; padding:18px 20px; margin:26px 0}
.block > .bt{
  font-size:11px; font-weight:800; letter-spacing:.12em; color:var(--ink-3);
  display:flex; align-items:center; gap:8px; margin-bottom:12px;
}
.block > .bt::after{content:""; flex:1; height:1px; background:var(--rule)}
.block.is-product{border-color:var(--ink); border-width:1px; box-shadow:0 0 0 3px var(--surface-2)}
.block.is-product > .bt{color:var(--ink)}
.block ul{margin:0; padding-left:1.2em}
.block li{margin-bottom:.5em; font-size:14.5px; line-height:1.85}
.block li:last-child{margin-bottom:0}
.block .small{font-size:12.5px; color:var(--ink-2); margin:10px 0 0}

table.t{width:100%; border-collapse:collapse; font-size:13px}
table.t th,table.t td{border:1px solid var(--rule); padding:9px 11px; text-align:left; vertical-align:top; line-height:1.65}
table.t th{background:var(--surface-2); font-size:11px; letter-spacing:.05em; color:var(--ink-2); font-weight:700; white-space:nowrap}
table.t td.num{font-variant-numeric:tabular-nums; white-space:nowrap}
.tscroll{overflow-x:auto; -webkit-overflow-scrolling:touch}

.srcs{list-style:none; padding:0; margin:0; counter-reset:s}
.srcs li{
  counter-increment:s; font-size:12.5px; color:var(--ink-2); line-height:1.75;
  padding:9px 0 9px 30px; border-bottom:1px dashed var(--rule); position:relative;
}
.srcs li::before{
  content:counter(s); position:absolute; left:0; top:9px; font-size:10px; font-weight:800;
  color:var(--ink-3); border:1px solid var(--rule-strong); border-radius:3px; padding:1px 5px;
}
.srcs li:last-child{border-bottom:0}

.nextread{display:grid; grid-template-columns:1fr 1fr; gap:12px}
@media (max-width:600px){.nextread{grid-template-columns:1fr}}
.nextread a{
  text-decoration:none; border:1px solid var(--rule); background:var(--surface); border-radius:4px;
  padding:13px 15px; display:block; transition:.12s;
}
.nextread a:hover{border-color:var(--ink)}
.nextread .nl{font-size:10px; letter-spacing:.1em; color:var(--ink-3)}
.nextread .nt{font-size:14px; font-weight:700; line-height:1.6; margin-top:4px}

/* ---------- side rail ---------- */
.rail-card{background:var(--surface); border:1px solid var(--rule); border-radius:4px; padding:16px 18px; margin-bottom:20px}
.rail-card h4{font-size:11px; letter-spacing:.12em; color:var(--ink-3); margin-bottom:12px}
.rail-card .item{font-size:13px; line-height:1.7; padding:9px 0; border-bottom:1px dashed var(--rule)}
.rail-card .item:last-child{border-bottom:0; padding-bottom:0}
.rail-card .item a{text-decoration:none; font-weight:600}
.rail-card .item a:hover{color:var(--brand-ink)}
.rail-card .k{font-size:10.5px; color:var(--ink-3); display:block}

/* ---------- pills / filters ---------- */
.pills{display:flex; flex-wrap:wrap; gap:7px; margin-bottom:18px}
.pill{
  font-size:11.5px; padding:5px 11px; border-radius:999px; border:1px solid var(--rule-strong);
  color:var(--ink-2); background:var(--surface); cursor:pointer; font-family:inherit;
}
.pill[aria-pressed="true"]{background:var(--ink); color:var(--surface); border-color:var(--ink)}
.pill .n{font-variant-numeric:tabular-nums; opacity:.7; margin-left:5px}

/* ---------- form ---------- */
.form-row{margin-bottom:16px}
.form-row label{display:block; font-size:12px; font-weight:700; margin-bottom:5px}
.form-row .hint{font-size:11.5px; color:var(--ink-3); margin:0 0 7px; line-height:1.7}
.form-row input,.form-row select,.form-row textarea{
  width:100%; font:inherit; font-size:14px; padding:9px 11px; border-radius:3px;
  border:1px solid var(--rule-strong); background:var(--surface); color:var(--ink);
}
.form-row textarea{min-height:120px; line-height:1.8; resize:vertical}
.btn{
  font:inherit; font-size:14px; font-weight:700; padding:11px 22px; border-radius:3px;
  background:var(--ink); color:var(--surface); border:0; cursor:pointer;
}
.callout{border-left:3px solid var(--warn); background:var(--surface); padding:13px 16px; font-size:13px; line-height:1.8; margin:18px 0}

.foot{border-top:1px solid var(--rule); margin-top:60px; padding:28px 0 60px; font-size:12px; color:var(--ink-3)}
.foot .fl{display:flex; flex-wrap:wrap; gap:18px; margin-bottom:14px}
.foot a{color:var(--ink-2)}
.tabtable{display:none}
.tabtable.on{display:block; margin-top:14px}
.nw{white-space:nowrap}
.linkish{background:none;border:0;padding:0;font:inherit;color:var(--brand-ink);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.swatchrow{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px}
.swatch{border:1px solid var(--rule); border-radius:4px; overflow:hidden; background:var(--surface)}
.swatch .sc{height:44px}
.swatch .sm{padding:8px 10px; font-size:11px; line-height:1.6}