/* ============================================================
   記事ページ（manuscript/ の原稿）の版面
   ------------------------------------------------------------
   色と書体は shared/design.css から受け取る。ここは配置だけ。
   hanbunkansei/ の各ページと同じ幅・同じ余白に合わせてある。
   ============================================================ */

*{box-sizing:border-box}

:root{
  --fg:var(--ink); --dim:var(--ink-faint); --rule2:var(--rule-soft);
  /* 枠と扉は shared/page.css。幅だけこちらから渡す（左右の余白は body 側） */
  --page-w:42rem; --page-pad:0;
}

body{
  background:var(--bg); color:var(--fg);
  font-family:var(--serif);
  font-size:16px; line-height:1.9; margin:0; padding:0 1.2rem 6rem;
  font-feature-settings:"palt"; -webkit-text-size-adjust:100%;
}
.wrap{max-width:var(--page-w); margin:0 auto;}
a{color:inherit;}
a:hover{color:var(--accent-mid);}
:focus-visible{outline:2px solid var(--mark); outline-offset:2px;}

/* .sitebar / .sitefoot / header.page は shared/page.css が持つ */

/* ---- 本文 ---- */
article{margin:2.6rem 0 0;}
article h2{
  font-size:1.32rem; font-weight:400; letter-spacing:.03em;
  margin:3.2rem 0 1.1rem; padding-top:1.6rem; border-top:1px solid var(--rule);
}
article h3{
  font-size:1.14rem; font-weight:400; letter-spacing:.03em;
  margin:2.4rem 0 .8rem; color:var(--accent-ink);
}
article p{margin:0 0 1.5rem;}
/* 本文中のリンク。文字色は本文と同じにして、下線だけ機能色にする。
   段落の中で色文字が続くと本文が騒がしくなるため（DESIGN.md §6-2）。 */
article a{
  color:var(--ink);
  text-decoration:underline;
  text-decoration-color:var(--mark);
  text-underline-offset:.2em;
  text-decoration-thickness:1px;
}
article a:hover{color:var(--mark); text-decoration-thickness:1.5px;}
article strong{font-weight:600;}
article code{
  font-family:var(--ui); font-size:.85em;
  background:var(--bg-2); padding:.1rem .3rem; border-radius:2px;
}
article ul,article ol{margin:0 0 1.5rem; padding-left:1.4rem;}
article li{margin:0 0 .5rem;}
hr.rule{border:0; border-top:1px solid var(--rule); margin:3rem 0;}

/* ---- 名前＋説明の並び（道案内のリンク集など） ---- */
dl.entries{margin:0 0 2rem;}
dl.entries dt{
  font-size:1.06rem; font-weight:400; letter-spacing:.02em; line-height:1.7;
  margin:1.8rem 0 .5rem; padding-left:.8rem;
  border-left:2px solid var(--accent-pale);
}
dl.entries dt:first-child{margin-top:0;}
dl.entries dd{margin:0; padding-left:.8rem; color:var(--ink-soft); font-size:.95rem;}

/* ---- 引用（当時の資料） ---- */
blockquote{
  margin:0 0 1.6rem; padding:1rem 1.1rem; background:var(--bg-2);
  border-left:2px solid var(--accent-pale); font-size:.95rem;
}
blockquote p{margin:0 0 .8rem;}
blockquote p:last-child{margin:0;}
blockquote .cite{
  font-family:var(--ui); font-size:.8rem; letter-spacing:.06em;
  color:var(--dim); margin-top:.8rem; line-height:1.7;
}

/* ---- 表 ---- */
.table-scroll{overflow-x:auto; margin:0 0 1.6rem; -webkit-overflow-scrolling:touch;}
table{border-collapse:collapse; width:100%; font-family:var(--ui); font-size:.88rem;}
th,td{
  border-bottom:1px solid var(--rule-soft); padding:.5rem .7rem;
  text-align:left; vertical-align:top; line-height:1.7;
}
thead th{
  border-bottom:1px solid var(--rule); color:var(--dim);
  font-weight:600; letter-spacing:.03em; white-space:nowrap;
}
td.num,th.num{text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap;}

/* ---- 図版 ---- */
figure.fig{margin:0 0 2rem;}
figure.fig img{max-width:100%; height:auto; display:block;}
figure.fig figcaption{
  font-family:var(--ui); font-size:.8rem; letter-spacing:.06em;
  color:var(--dim); margin-top:.6rem;
}

/* ---- 棒グラフ（ビルド時にデータから作る） ---- */
figure.chart{margin:0 0 2.4rem;}
.bars{font-family:var(--ui); font-size:.8rem; color:var(--dim);}
.bar-row{display:grid; grid-template-columns:5.5rem 1fr 3.6rem;
  align-items:center; gap:.6rem; margin:0 0 .35rem;}
.bar-label{white-space:nowrap; letter-spacing:.04em;}
.bar-track{background:var(--track); height:.7rem;}
.bar-fill{background:var(--accent); height:100%;}
.bar-val{text-align:right; font-variant-numeric:tabular-nums; color:var(--ink-soft);}

@media (max-width:480px){
  .bar-row{grid-template-columns:4.6rem 1fr 3.2rem; gap:.45rem; font-size:.7rem;}
}

/* ---- 未処理の目印（ビルドが拾えなかった図版など。公開前に消す） ---- */
.todo{
  font-family:var(--ui); font-size:.8rem; letter-spacing:.06em;
  color:var(--dim); border:1px dashed var(--rule);
  padding:.5rem .7rem; margin:0 0 1.5rem;
}

/* ---- 記事の末尾に置く本（原稿の [asin:...]） ---- */
.books{margin:4rem 0 0; padding-top:1.8rem; border-top:1px solid var(--rule);}
.books__head{
  font-family:var(--ui); font-size:.82rem; font-weight:400; letter-spacing:.08em;
  color:var(--dim); margin:0 0 1.2rem; border:0; padding:0;
}
a.book{
  display:flex; gap:1rem; align-items:flex-start;
  text-decoration:none; color:inherit;
  padding:.9rem 1rem; margin:0 0 .8rem;
  border:1px solid var(--rule); background:var(--card);
}
a.book:hover{background:var(--bg-2);}
.book__cover{
  flex:0 0 auto; width:76px; height:auto; display:block;
  background:var(--bg-2);
}
.book__text{display:block; min-width:0;}
.book__title{
  display:block; font-size:1rem; line-height:1.7; letter-spacing:.02em;
  color:var(--link);
}
.book__author{
  display:block; margin-top:.3rem;
  font-family:var(--ui); font-size:.82rem; color:var(--ink-soft);
}
.book__go{
  display:block; margin-top:.5rem;
  font-family:var(--ui); font-size:.76rem; letter-spacing:.06em; color:var(--dim);
}
.books__note{
  font-family:var(--ui); font-size:.74rem; letter-spacing:.05em;
  color:var(--dim); margin:.9rem 0 0;
}

@media (max-width:480px){
  a.book{gap:.8rem; padding:.8rem;}
  .book__cover{width:64px;}
  .book__title{font-size:.95rem;}
}

/* ---- フッター ---- */
footer.page{
  margin:4.5rem 0 0; padding-top:1.6rem; border-top:1px solid var(--rule);
  font-family:var(--ui); font-size:.82rem; letter-spacing:.06em; color:var(--dim);
  line-height:2;
}
footer.page a{text-decoration:none;}
footer.page .method{display:block; margin-bottom:.6rem;}

@media (max-width:480px){
  body{font-size:15.5px; padding:0 1rem 4rem;}
  /* 太さで差を付けられない分、見出しの段差は狭い画面でも保つ（扉は page.css 側） */
  article h2{font-size:1.24rem;}
  article h3{font-size:1.08rem;}
}

/* 行まるごとがリンク1本（書名など）。段落より詰めて並べる */
article p.linkline{margin:0 0 .5rem;}
article p.linkline + p:not(.linkline){margin-top:1.2rem;}

/* ---- 別ページへ送るカード ---- */
a.pagecard{
  display:block; text-decoration:none; margin:0 0 1.8rem;
  padding:1rem 1.1rem; border:1px solid var(--rule); background:var(--card);
}
a.pagecard:hover{background:var(--mark-wash);}
.pagecard__title{
  display:block; font-size:1.06rem; font-weight:400; letter-spacing:.03em;
  color:var(--ink);
  text-decoration:underline; text-decoration-color:var(--mark);
  text-underline-offset:5px; text-decoration-thickness:1px;
}
a.pagecard:hover .pagecard__title{color:var(--mark); text-decoration-thickness:1.5px;}
.pagecard__desc{
  display:block; margin-top:.3rem; font-family:var(--ui);
  font-size:.86rem; color:var(--ink-soft); line-height:1.8;
}