/* ============================================================
   melvin-dossier.css — Subject Dossier
   Path: /css/melvin-dossier.css

   既存のデザイン言語（style.css のトークンと mission-briefing の
   タイムライン表現）に合わせたページ固有スタイル。
   style.css など共通CSSには一切手を入れていない。
   ============================================================ */

.md-banner,
.md-main {
  font-family: 'Inter', sans-serif;
}

/* ── Banner ─────────────────────────────────────────────── */

.md-banner {
  background: linear-gradient(180deg, var(--bg-deep) 0%, var(--bg-dark) 100%);
  border-bottom: 1px solid var(--rule);
  padding: clamp(72px, 12vw, 132px) 24px clamp(40px, 6vw, 64px);
}

.md-banner-inner,
.md-main {
  max-width: 860px;
  margin: 0 auto;
}

/* 名前を大きく置くが、プロフィールページ的な演出はしない。
   見出しはアーカイブの他ページと同じ Cormorant Garamond のまま、
   種別ラベルだけ Space Mono の小さなキッカーで添える。 */
.md-title {
  margin: 0 0 1.1rem;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.md-title-name {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 300;
  font-size: clamp(2.6rem, 9vw, 4.6rem);
  line-height: 1;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text);
}
.md-title-kind {
  font-family: 'Space Mono', monospace;
  font-size: 0.5rem;
  letter-spacing: 0.38em;
  text-transform: uppercase;
  color: var(--accent);
  opacity: 0.75;
  display: flex;
  align-items: center;
  gap: 12px;
}
.md-title-kind::before {
  content: '';
  display: block;
  width: 22px;
  height: 0.5px;
  background: var(--accent);
  opacity: 0.6;
}

.md-lede {
  font-size: 0.9rem;
  line-height: 1.7;
  color: rgba(240, 236, 228, 0.58);
  max-width: 56ch;
  margin: 0 0 2.4rem;
}

.md-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 1px;
  background: var(--rule);
  border: 1px solid var(--rule);
  margin: 0;
}
.md-stat {
  background: var(--bg-dark);
  padding: 14px 16px;
}
.md-stat dt {
  font-family: 'Space Mono', monospace;
  font-size: 0.44rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--accent);
  opacity: 0.65;
  margin-bottom: 8px;
}
.md-stat dd {
  margin: 0;
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.35rem;
  color: var(--text);
}

/* ── Sections ───────────────────────────────────────────── */

.md-main { padding: 0 24px 96px; }

.md-section {
  padding: clamp(40px, 6vw, 64px) 0;
  border-bottom: 1px solid var(--rule);
}
.md-section:last-child { border-bottom: none; }

.md-h2 {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  font-size: clamp(1.5rem, 3.4vw, 2.1rem);
  color: var(--text);
  margin: 0 0 0.5rem;
}

.md-sub {
  font-size: 0.82rem;
  line-height: 1.7;
  color: rgba(240, 236, 228, 0.5);
  max-width: 62ch;
  margin: 0 0 2.2rem;
}

/* ── Thread: visit blocks ───────────────────────────────── */

/* データ上の精度の限界を、本文と同じ重さで明示するための帯。 */
.md-precision {
  border-left: 2px solid var(--accent-mid);
  background: var(--accent-dim);
  padding: 14px 16px;
  margin-bottom: 40px;
  font-family: 'Space Mono', monospace;
  font-size: 0.6rem;
  line-height: 1.8;
  letter-spacing: 0.02em;
  color: rgba(240, 236, 228, 0.62);
}

.md-visit { margin-bottom: 56px; }
.md-visit:last-child { margin-bottom: 0; }

.md-visit-head {
  border-top: 1px solid var(--accent-mid);
  padding-top: 14px;
  margin-bottom: 26px;
}
.md-visit-no {
  font-family: 'Space Mono', monospace;
  font-size: 0.48rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--accent);
  margin-bottom: 8px;
}
.md-visit-date {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 300;
  font-size: clamp(1.5rem, 3.4vw, 2.1rem);
  color: var(--text);
  margin: 0 0 6px;
}
.md-visit-count {
  font-family: 'Space Mono', monospace;
  font-size: 0.5rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(240, 236, 228, 0.35);
}

/* ── Record cards ───────────────────────────────────────── */

.md-cards { display: flex; flex-direction: column; gap: 20px; }

/* 枠と地色はカード側、レイアウトと余白は中のリンク側が持つ。
   こうするとカード全体（画像・見出し・本文・余白）がそのまま
   クリック／タップ領域になり、見た目は従来と変わらない。 */
.md-card {
  border: 1px solid var(--rule);
  background: var(--bg-mid);
}

/* グリッドの親。link がある通常のカードは .md-card-link、
   link を持たない記録は .md-card--plain が担う（従来と同じ配置）。 */
.md-card-link,
.md-card--plain {
  display: grid;
  grid-template-columns: 168px 1fr;
  gap: 0 22px;
  padding: 18px;
}

/* リンクになっても文字色・下線は本文のまま。カードとして読ませる。 */
.md-card-link {
  color: inherit;
  text-decoration: none;
  transition: background 0.2s;
}

/* 「カード全体がリンクになった」と分かる程度の控えめな反応のみ。
   塗りつぶしの変化は地色を1段変えるだけで、拡大や影は使わない。 */
.md-card-link:hover,
.md-card-link:focus-visible {
  background: var(--bg-base);
}
.md-card-link:focus-visible {
  outline: 1px solid var(--accent);
  outline-offset: -2px;
}
.md-card-link:hover .md-read,
.md-card-link:focus-visible .md-read {
  color: #d9b85c;
  border-bottom-color: #d9b85c;
}
.md-card-media {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--bg-dark);
  border: 1px solid var(--rule);
}
.md-card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: saturate(0.85) contrast(1.02);
}
.md-card-body { min-width: 0; }
.md-card-sub {
  font-family: 'Space Mono', monospace;
  font-size: 0.54rem;
  line-height: 1.7;
  letter-spacing: 0.06em;
  color: rgba(240, 236, 228, 0.4);
  margin: -8px 0 14px;
}

.md-tl-kicker {
  font-family: 'Space Mono', monospace;
  font-size: 0.46rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(240, 236, 228, 0.35);
  margin-bottom: 8px;
}
.md-tl-heading {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  font-size: clamp(1.15rem, 2.4vw, 1.5rem);
  line-height: 1.25;
  color: var(--text);
  margin: 0 0 14px;
}

.md-q, .md-d {
  font-size: 0.86rem;
  line-height: 1.75;
  margin: 0 0 12px;
}
.md-q { color: rgba(240, 236, 228, 0.55); }
.md-d { color: rgba(240, 236, 228, 0.8); }
.md-q-label, .md-d-label {
  display: block;
  font-family: 'Space Mono', monospace;
  font-size: 0.44rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  margin-bottom: 6px;
  color: var(--accent);
  opacity: 0.7;
}

.md-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0; }
.md-chip {
  font-family: 'Space Mono', monospace;
  font-size: 0.5rem;
  letter-spacing: 0.1em;
  color: rgba(240, 236, 228, 0.55);
  border: 1px solid var(--rule);
  padding: 4px 8px;
}

.md-encnote {
  font-family: 'Space Mono', monospace;
  font-size: 0.5rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--accent);
  opacity: 0.55;
  margin: 10px 0;
}

.md-read {
  display: inline-block;
  margin-top: 6px;
  font-family: 'Space Mono', monospace;
  font-size: 0.52rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--accent);
  text-decoration: none;
  border-bottom: 1px solid var(--accent-mid);
  padding-bottom: 3px;
}
.md-read:hover { color: #d9b85c; border-bottom-color: #d9b85c; }

/* ── Revised findings ───────────────────────────────────── */

.md-revision {
  border: 1px solid var(--rule);
  padding: 22px;
  margin-bottom: 20px;
  background: var(--bg-mid);
}
.md-ver { border-left: 2px solid var(--rule); padding: 2px 0 2px 16px; margin-top: 16px; }
.md-ver--current { border-left-color: var(--accent); }
.md-ver--superseded { opacity: 0.5; }
.md-ver-head {
  display: flex;
  gap: 12px;
  align-items: center;
  font-family: 'Space Mono', monospace;
  font-size: 0.46rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  margin-bottom: 8px;
}
.md-ver-no { color: var(--accent); }
.md-ver-date { color: rgba(240, 236, 228, 0.4); }
.md-ver-flag { color: rgba(240, 236, 228, 0.4); margin-left: auto; }
.md-ver--current .md-ver-flag { color: var(--accent); }
.md-ver-text {
  font-size: 0.86rem;
  line-height: 1.75;
  color: rgba(240, 236, 228, 0.78);
  margin: 0;
}
.md-ver--superseded .md-ver-text { text-decoration: line-through; text-decoration-color: rgba(240,236,228,0.25); }
.md-ver-why {
  margin-top: 10px;
  font-size: 0.74rem;
  line-height: 1.65;
  color: rgba(240, 236, 228, 0.42);
  font-style: italic;
}

/* ── Open questions ─────────────────────────────────────── */

.md-open { list-style: none; padding: 0; margin: 0; }
.md-open-item { border-top: 1px solid var(--rule); padding: 18px 0; }
.md-open-text {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.05rem;
  font-style: italic;
  line-height: 1.6;
  color: rgba(240, 236, 228, 0.78);
  margin: 0 0 8px;
}
.md-open-meta {
  font-family: 'Space Mono', monospace;
  font-size: 0.46rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(240, 236, 228, 0.35);
}
.md-open-rest {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--rule);
  font-family: 'Space Mono', monospace;
  font-size: 0.56rem;
  line-height: 1.8;
  color: rgba(240, 236, 228, 0.38);
}

/* ── Mobile ─────────────────────────────────────────────── */

@media (max-width: 640px) {
  .md-card-link,
  .md-card--plain { grid-template-columns: 1fr; gap: 14px 0; }
  .md-card-media { aspect-ratio: 16 / 9; }
  .md-card-sub { margin-top: 0; }
  .md-visit { margin-bottom: 44px; }
}