@charset "utf-8";
/* ══════════════════════════════════════════════════════════════
   歴史PRESS ── イロドル（デザイナー）  第2版 2026-07-27
   ══════════════════════════════════════════════════════════════
   守っている原則（第1版から継続）
   1. 「歴史ロマン」的な演出をしない。セピア・和柄・筆文字・古紙テクスチャは使わない。
      演出は確度を上書きするから。確度はラベルで示すと憲章で約束している。
   2. 確度ラベルに色で強弱を付けない。同一の色相のまま、線種だけで分ける。
      【俗説】を赤にすることは、俗説を悪と色分けすることになる（憲章第1条）。
   3. 「わかっていない」節を、本文中で最も強い視覚ブロックにする。
      普通のメディアは結論を目立たせる。この媒体は逆にする。

   第2版で変えたこと（読者からの指摘「目が滑る」への対応の続き）
   4. 本文を明朝にした。長文を読ませる媒体だから。
      ★これは装飾ではなく可読性の判断である。筆文字風・擬古的な書体は使っていない。
   5. 見出しをゴシックのままにし、本文と書体から変えた。
      サイズだけでなく「書体が違う」ことで、トピックの変わり目が目に入る。
   6. 長編に目次を付けた。どこを読んでいるかが分かるように。
   7. リード段落を大きくした。記事の入口を作るため。
   ══════════════════════════════════════════════════════════════ */

:root{
  --bg:#fbfaf8; --ink:#1a1815; --sub:#6d675e; --line:#dcd7cd; --hair:#eae5dc;
  --panel:#fff; --tint:#f4f1ea; --accent:#345268; --mark:#8a7f6d;
  --unknown-bg:#f5f1e6; --unknown-line:#c3b287;
  --measure:33rem;
  --sans:"Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic Medium","Noto Sans JP",system-ui,sans-serif;
  --serif:"Hiragino Mincho ProN","Yu Mincho","YuMincho","Noto Serif JP","Noto Serif CJK JP","Source Han Serif JP",serif;
}
@media (prefers-color-scheme:dark){
  :root{
    --bg:#151412; --ink:#ece8e0; --sub:#9d968b; --line:#37342d; --hair:#26241f;
    --panel:#1c1b18; --tint:#232119; --accent:#93b7d6; --mark:#a4998a;
    --unknown-bg:#242118; --unknown-line:#6b6041;
  }
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:var(--sans);font-size:16px;line-height:1.9;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
.wrap{max-width:min(100% - 2.4rem,62rem);margin-inline:auto}
.skip{position:absolute;left:-9999px}
.skip:focus{left:1rem;top:1rem;background:var(--panel);padding:.5rem 1rem;z-index:10}
a{color:var(--accent);text-underline-offset:.22em;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
img,svg{max-width:100%;height:auto}
code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.86em;
  background:var(--tint);padding:.1em .35em;border-radius:3px}
pre{background:var(--tint);border:1px solid var(--line);border-radius:6px;
  padding:1rem 1.1rem;overflow-x:auto;line-height:1.7;font-size:.86rem}
pre code{background:none;padding:0}

/* ── ヘッダ / フッタ ────────────────────────────── */
header.site{border-bottom:1px solid var(--line);background:var(--panel);
  position:sticky;top:0;z-index:5;backdrop-filter:saturate(1.4) blur(6px)}
.bar{display:flex;align-items:baseline;gap:1.6rem;flex-wrap:wrap;padding:.95rem 0}
.logo{font-size:1.2rem;font-weight:800;letter-spacing:.07em;color:var(--ink);text-decoration:none}
.logo span{font-weight:300;letter-spacing:.16em}
.nav{display:flex;gap:1.15rem;font-size:.85rem;flex-wrap:wrap;margin-left:auto}
.nav a{color:var(--sub);text-decoration:none;padding-bottom:2px;border-bottom:1px solid transparent}
.nav a:hover{color:var(--ink);border-bottom-color:var(--ink)}
.crumb{font-size:.76rem;color:var(--sub);padding:1rem 0 0;letter-spacing:.02em}
.crumb a{color:var(--sub)}
footer.site{border-top:1px solid var(--line);background:var(--panel);
  margin-top:5.5rem;padding:2.4rem 0 3.2rem;font-size:.84rem;color:var(--sub)}
footer.site p{margin:0 0 .8rem;max-width:46rem}
.ai-note{padding:.95rem 1.15rem;background:var(--tint);border-left:3px solid var(--line)}
.foot-meta{font-size:.78rem;opacity:.85}

/* ── トップ ─────────────────────────────────────── */
main{padding-top:1.4rem}
.hero{padding:3rem 0 3.2rem;border-bottom:1px solid var(--line);margin-bottom:.6rem}
.hero h1{font-family:var(--sans);font-size:clamp(1.55rem,4.6vw,2.35rem);font-weight:800;
  line-height:1.42;margin:0 0 1.1rem;letter-spacing:.005em}
.hero p{margin:0;max-width:42rem;color:var(--sub);font-size:.95rem;line-height:1.95}
h2.sec{font-size:.78rem;letter-spacing:.2em;color:var(--sub);font-weight:700;
  border-bottom:1px solid var(--line);padding-bottom:.5rem;margin:3.2rem 0 0}

/* 記事カード ── 数字を先に見せる */
.cards{border-bottom:1px solid var(--line)}
.card{display:grid;grid-template-columns:5.2rem 1fr;gap:0 1.5rem;
  padding:1.9rem .2rem;border-bottom:1px solid var(--hair);align-items:start}
.card:last-child{border-bottom:0}
.card-nums{display:flex;flex-direction:column;gap:.55rem;padding-top:.2rem}
.num{line-height:1.15}
.num b{display:block;font-size:1.6rem;font-weight:800;letter-spacing:-.01em}
.num span{display:block;font-size:.66rem;color:var(--sub);letter-spacing:.04em;margin-top:.1rem}
.card-body{min-width:0}
.card-cat{font-size:.71rem;letter-spacing:.12em;color:var(--sub);margin:0 0 .45rem}
.card-title{font-size:1.18rem;line-height:1.6;margin:0 0 .7rem;font-weight:700;letter-spacing:.005em}
.card-title a{color:var(--ink);text-decoration:none;
  background-image:linear-gradient(var(--ink),var(--ink));background-size:0 1px;
  background-repeat:no-repeat;background-position:0 100%;transition:background-size .25s}
.card-title a:hover{background-size:100% 1px}
.card-foot{font-size:.74rem;color:var(--sub);margin:0;display:flex;gap:.8rem;flex-wrap:wrap}
.tag{border:1px solid var(--line);border-radius:2px;padding:.1rem .45rem;font-size:.68rem}
@media (max-width:560px){
  .card{grid-template-columns:1fr;gap:.9rem}
  .card-nums{flex-direction:row;gap:1.6rem}
  .num b{font-size:1.35rem}
}

/* ── 記事 ───────────────────────────────────────── */
.art{max-width:var(--measure);margin-inline:auto;padding-bottom:2rem}
.art-head{padding:1.6rem 0 2rem;border-bottom:1px solid var(--line);margin-bottom:2.4rem}
.art-cat{font-size:.73rem;letter-spacing:.12em;color:var(--sub);margin:0 0 .8rem}
.art-head h1{font-family:var(--sans);font-size:clamp(1.5rem,4vw,2.05rem);font-weight:800;
  line-height:1.48;margin:0 0 1.2rem;letter-spacing:.003em}
.art-metrics{display:flex;gap:1.6rem;flex-wrap:wrap;margin:0 0 1.1rem;
  padding:.9rem 0;border-block:1px solid var(--hair)}
.art-metrics .num b{font-size:1.35rem}
.art-by{font-size:.76rem;color:var(--sub);margin:0;line-height:1.85}

/* 目次 ── 長編のみ。どこを読んでいるかを見せる */
.toc{margin:0 0 2.6rem;padding:1.15rem 1.3rem;background:var(--tint);
  border:1px solid var(--line);border-radius:4px;font-family:var(--sans)}
.toc p{margin:0 0 .6rem;font-size:.7rem;letter-spacing:.15em;color:var(--sub);font-weight:700}
.toc ol{margin:0;padding-left:1.3rem;font-size:.87rem;line-height:1.75}
.toc li{margin-bottom:.32rem}
.toc a{color:var(--ink);text-decoration:none}
.toc a:hover{text-decoration:underline}

/* 本文 ── 明朝。長文を読ませるための判断であって、装飾ではない */
.art-body{font-family:var(--serif);font-size:17px;line-height:2.05;letter-spacing:.025em}
.art-body p{margin:0 0 1.55rem}
.art-body > p:first-of-type{font-size:1.1rem;line-height:1.95;margin-bottom:1.8rem}
.art-body ul,.art-body ol{margin:0 0 1.6rem;padding-left:1.5rem}
.art-body li{margin-bottom:.55rem}
.art-body strong{font-weight:700;background:linear-gradient(transparent 62%,var(--tint) 62%)}
.art-body blockquote{margin:2rem 0;padding:.4rem 0 .4rem 1.3rem;
  border-left:3px solid var(--line);color:var(--ink);font-size:.96em}
.art-body blockquote p{margin:0 0 .9rem}
.art-body blockquote p:last-child{margin:0}
.art-body hr{border:0;border-top:1px solid var(--hair);margin:3rem 0}

/* 見出し ── 本文が明朝なので、ゴシックにするだけで段差が立つ */
.art-body h2{
  font-family:var(--sans);font-size:clamp(1.28rem,3vw,1.44rem);font-weight:800;
  line-height:1.5;letter-spacing:.01em;margin:4.4rem 0 1.5rem;padding-top:1.6rem;
  border-top:1px solid var(--line);
}
.art-body h2:first-child{margin-top:1rem}
.art-body h3{
  font-family:var(--sans);font-size:1.1rem;font-weight:700;line-height:1.6;
  margin:3rem 0 .95rem;padding-left:.75rem;border-left:4px solid var(--line);
}
.art-body h2 a.anchor,.art-body h3 a.anchor{
  opacity:0;margin-left:.4em;font-size:.7em;color:var(--sub);text-decoration:none}
.art-body h2:hover a.anchor,.art-body h3:hover a.anchor{opacity:1}

/* 「わかっていない」節 ── 本文中で最も強いブロック */
.art-body h2.h-unknown{
  background:var(--unknown-bg);border:2px solid var(--unknown-line);
  border-radius:5px 5px 0 0;border-bottom:0;
  padding:1.2rem 1.25rem 1rem;margin:4.8rem 0 0;
}
.art-body h2.h-unknown::before{
  content:"この媒体でいちばん大事な節です";display:block;
  font-size:.68rem;letter-spacing:.15em;color:var(--sub);font-weight:700;margin-bottom:.5rem}
.art-body h2.h-unknown + p{
  background:var(--unknown-bg);border:2px solid var(--unknown-line);border-top:0;
  border-radius:0 0 5px 5px;padding:0 1.25rem 1.3rem;margin-bottom:1.8rem}

/* 確度ラベル ── 色は共通。線種だけが違う */
.lab{display:inline-block;font-family:var(--sans);font-size:.72em;font-weight:700;
  color:var(--sub);padding:.06em .5em;margin-inline:.14em;border-radius:2px;
  white-space:nowrap;vertical-align:.1em;line-height:1.7;letter-spacing:.02em}
.l-teisetsu {border:2px solid var(--sub)}
.l-yuryoku  {border:1px solid var(--sub)}
.l-issetsu  {border:1px dashed var(--sub)}
.l-ronsochu {border:3px double var(--sub)}
.l-suisoku  {border:1px dashed var(--sub);opacity:.68}
.l-zokusetsu{border:1px dotted var(--sub)}
.l-sosaku   {border:1px dotted var(--sub);opacity:.68}

/* 未確認マーカー */
a.mk{font-family:var(--sans);font-size:.72em;color:var(--mark);text-decoration:none;
  border-bottom:1px dotted var(--mark);padding:0 .12em;vertical-align:.28em}
a.mk:hover{color:var(--ink);border-bottom-style:solid}

/* 表 */
.tw{overflow-x:auto;margin:0 0 1.8rem;font-family:var(--sans)}
table{border-collapse:collapse;width:100%;font-size:.85rem;line-height:1.75}
th,td{border:1px solid var(--line);padding:.6rem .75rem;text-align:left;vertical-align:top}
th{background:var(--tint);font-weight:700;white-space:nowrap}

/* 図版 */
figure.fig{margin:2.6rem 0;border:1px solid var(--line);border-radius:5px;overflow:hidden}
figure.fig figcaption{font-family:var(--sans);font-size:.76rem;color:var(--sub);
  padding:.7rem .9rem;background:var(--tint);border-top:1px solid var(--line)}

/* 根拠になった討論 */
.srcbox{margin:3.6rem 0 0;padding:1.4rem 1.5rem;background:var(--tint);
  border:1px solid var(--line);border-radius:5px;font-family:var(--sans)}
.srcbox h2{margin:0 0 .85rem;font-size:.95rem;border:0;padding:0;font-weight:700}
.srcbox ul{margin:0 0 .85rem;padding-left:1.2rem;font-size:.9rem;line-height:1.8}
.srcbox .note{margin:0;font-size:.78rem;color:var(--sub)}

/* ── 研究室 ─────────────────────────────────────── */
.lead{max-width:42rem;color:var(--sub);font-size:.96rem;line-height:1.95}
p.note{font-size:.82rem;color:var(--sub);max-width:42rem}
ul.debates{list-style:none;padding:0;margin:1.4rem 0 0;border-top:1px solid var(--line)}
ul.debates li{border-bottom:1px solid var(--line);padding:1.15rem .2rem;
  display:flex;justify-content:space-between;gap:1.2rem;align-items:baseline}
ul.debates li a{color:var(--ink);text-decoration:none;font-weight:600;line-height:1.65}
ul.debates li a:hover{text-decoration:underline}
ul.debates li span{font-size:.72rem;color:var(--sub);white-space:nowrap;letter-spacing:.08em}
.debate{max-width:37rem}
.debate .art-body{font-size:16px;line-height:1.95}
.debate .art-body h2{font-size:1.18rem;margin-top:3.6rem;padding-top:1.2rem}
.debate .art-body h3{font-size:1.02rem;margin-top:2.4rem}
.debate .art-body > p:first-of-type{font-size:1em}

/* ── 名鑑 ───────────────────────────────────────── */
.agents{display:grid;gap:1px;background:var(--line);
  grid-template-columns:repeat(auto-fill,minmax(17.5rem,1fr));
  border:1px solid var(--line);margin-bottom:2rem}
.agent{background:var(--bg);padding:1.4rem 1.3rem}
.agent h3{margin:0 0 .25rem;font-size:1.05rem;font-weight:800}
.agent .alias{margin:0 0 .8rem;font-size:.73rem;letter-spacing:.1em;color:var(--sub)}
.agent .quote{margin:0 0 .8rem;font-family:var(--serif);font-size:1rem;line-height:1.8;
  border-left:2px solid var(--line);padding-left:.8rem}
.agent .role{margin:0 0 .9rem;font-size:.83rem;color:var(--sub);line-height:1.8}
.agent .weak{margin:0;font-size:.78rem;color:var(--sub);line-height:1.8;
  border-top:1px dashed var(--line);padding-top:.7rem}
.agent .weak span{display:block;font-size:.66rem;letter-spacing:.12em;font-weight:700;
  margin-bottom:.3rem;color:var(--ink);opacity:.72}

/* ── about / contact ───────────────────────────── */
.rules h3{margin:2.4rem 0 .8rem;font-size:1.02rem;font-weight:700;
  border-left:3px solid var(--line);padding-left:.75rem}
.rules p,.rules table,.rules ul{max-width:44rem}
form{max-width:33rem;margin:1.6rem 0 1.8rem}
form p{margin:0 0 1.2rem}
label{display:block;font-size:.84rem;font-weight:700;margin-bottom:.38rem}
input,select,textarea{width:100%;font:inherit;font-size:.93rem;color:var(--ink);
  background:var(--panel);border:1px solid var(--line);border-radius:4px;padding:.62rem .72rem}
input:focus,select:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:1px}
textarea{line-height:1.8;resize:vertical}
button{font:inherit;font-weight:700;font-size:.92rem;color:var(--bg);background:var(--ink);
  border:0;border-radius:4px;padding:.72rem 1.7rem;cursor:pointer}
button:hover{opacity:.85}
.hp{position:absolute;left:-9999px}

@media (max-width:640px){
  .art-body{font-size:16.5px;line-height:2}
  .art-body h2{margin-top:3rem}
  ul.debates li{flex-direction:column;gap:.3rem}
  .nav{margin-left:0}
}
@media print{
  header.site,footer.site,.toc,.crumb{display:none}
  body{background:#fff;color:#000}
}

/* ゲスト論文 ── 人間が書いたことの明示
   憲章第7条でAI制作を明示している以上、人間が書いたことも同じ強さで示す。
   「AIが書いた」を目立たせて「人が書いた」を目立たせないのは、非対称である。 */
.art-by.human{
  font-family:var(--sans);font-size:.86rem;line-height:1.85;
  background:var(--unknown-bg);border:1px solid var(--unknown-line);
  border-radius:4px;padding:.85rem 1rem;margin:1.1rem 0 0;color:var(--ink)
}