/* ==========================================================================
   読解ノート(detail)専用の追加スタイル
   基本のデザイン言語(明朝体 / 生成り #fdfdfa / 藍 #1a4a7a / ヘアライン罫線)は
   ../../css/style.css をそのまま継承し、ここでは記事アーカイブ用の差分だけを定義する。
   ========================================================================== */

/* ---- 目次 ---- */
.notes-toc { list-style: none; padding: 0; margin: 0 0 2rem; }
.notes-toc > li {
  border-bottom: 1px solid var(--line-faint);
  padding: .75rem 0 .75rem 2.4em;
  position: relative;
  font-size: .98rem;
}
.notes-toc > li:last-child { border-bottom: none; }
.notes-toc > li .no {
  position: absolute; left: 0; top: .75rem;
  font-family: Georgia, "Times New Roman", serif;
  font-style: italic; color: var(--line); font-size: 1.05rem;
  width: 1.8em; text-align: center;
}
.notes-toc a { text-decoration: none; }
.notes-toc a:hover { text-decoration: underline; }
.notes-toc .date { font-size: .76rem; color: var(--meta); margin-left: .8em; white-space: nowrap; }
.notes-toc li.todo { color: var(--meta); }
.notes-toc li.todo .no { color: var(--line-soft); }
.todo-mark {
  font-size: .7rem; letter-spacing: .12em; color: var(--meta-light);
  border: 1px solid var(--line-soft); border-radius: 2px;
  padding: .05em .55em; margin-left: .7em; vertical-align: .12em; white-space: nowrap;
}

/* ---- 未公開の章立て(入れ子アウトライン) ---- */
.outline { color: var(--meta); font-size: .92rem; margin: 0 0 1.4rem; padding-left: 1.5em; }
.outline ul { list-style: circle; margin: .2em 0 .5em; padding-left: 1.3em; font-size: .88rem; }
.outline > li { margin: .35em 0; }
.part-label {
  font-size: 1.02rem; font-weight: 600; letter-spacing: .05em;
  margin: 2.2em 0 .3em; padding-bottom: .2em;
  border-bottom: 1px dotted var(--line-soft);
}
.part-label .pages { font-size: .76rem; color: var(--meta); font-weight: 400; margin-left: .8em; }

/* ---- 記事本文 ---- */
article.note { padding: 2.6rem 0 1rem; }
article.note .crumb { font-size: .78rem; color: var(--meta); margin-bottom: 1.6rem; }
article.note h1.title {
  font-size: clamp(1.35rem, 4vw, 1.7rem); line-height: 1.6;
  font-weight: 600; margin: 0 0 .4rem; letter-spacing: .04em;
}
article.note .note-meta {
  font-size: .8rem; color: var(--meta); margin: 0 0 2.2rem;
  border-bottom: 1px solid var(--line-faint); padding-bottom: 1rem;
}
article.note h2 {
  font-size: 1.12rem; font-weight: 600; letter-spacing: .08em;
  border-bottom: 1px solid var(--line-soft); padding-bottom: .3em;
  margin: 2.4em 0 1em;
}
article.note p { margin: 0 0 1.1em; }
article.note strong { font-weight: 600; }

/* ---- 底本・凡例 ---- */
.source-note {
  font-size: .86rem; color: var(--ink-soft);
  border: 1px dashed var(--line); border-radius: 2px;
  padding: .9rem 1.2rem; margin: 1.6rem 0;
}
.source-note .exp-label {
  font-size: .72rem; letter-spacing: .2em; color: var(--gold);
  display: block; margin-bottom: .25em;
}
.source-note p { margin: 0 0 .5em; }
.source-note p:last-child { margin-bottom: 0; }

/* ---- 前後ナビ ---- */
.note-nav {
  display: flex; gap: 1.2rem; justify-content: space-between;
  border-top: 1px solid var(--line-faint);
  margin-top: 3rem; padding-top: 1.2rem;
  font-size: .9rem;
}
.note-nav a { text-decoration: none; }
.note-nav a:hover { text-decoration: underline; }
.note-nav .nav-label { display: block; font-size: .72rem; letter-spacing: .2em; color: var(--gold); }
.note-nav .prev { text-align: left; }
.note-nav .next { text-align: right; margin-left: auto; }

@media (max-width: 480px) {
  .note-nav { flex-direction: column; gap: .9rem; }
  .note-nav .next { text-align: left; margin-left: 0; }
}

/* ---- 記事本文の内部要素（移設記事のマークアップに対応） ---- */
.notes-toc.plain > li { padding-left: 0; }
article.note h3 { font-size: 1.02rem; font-weight: 600; margin: 1.9em 0 .5em; letter-spacing: .04em; }
.note-body ul, .note-body ol { margin: 0 0 1.2em; padding-left: 1.6em; }
.note-body li { margin: .25em 0; }
.note-body ul ul, .note-body ol ol, .note-body ul ol, .note-body ol ul { margin: .2em 0 .4em; }
.note-body blockquote p:last-child { margin-bottom: 0; }
.note-body .marker {
  display: inline-block;
  font-size: .74rem; letter-spacing: .08em;
  border: 1px solid var(--gold); border-radius: 2px;
  color: var(--gold); background: #fbf6e8;
  padding: .05em .55em; margin-left: .4em; vertical-align: .12em;
}
.note-body iframe { max-width: 100%; border: 1px solid var(--line-faint); }
.video-wrap { margin: 1.6em 0; }
