/*
 * 規約類の独立ページ（terms_en.html・terms_zh.html・privacy_en.html・privacy_zh.html・
 * disclaimer_en.html・disclaimer_zh.html）を /v2/ のデザインに寄せるための追加分。
 * CEO 指示（2026-09-26・移行の棚卸し drafts/v2-migration-2026-09/TASKS.md 項目6）。
 *
 * 文面（本文のテキスト）は変えない（drafts/legal-2026-09/ で別の担当が見直し中）。
 * ここで触るのは型の見た目だけ。各ページは今までどおり自分の <style> を持つため
 * （body・.container・h1・h2・.effective-date・.back-link・ul・li・table・.warning-box を素の
 * 要素/クラスセレクタで定義）、この上書きは <body class="legal-page"> を前提に、より詳細度の高い
 * body.legal-page 系のセレクタで揃える（元の <style> は削除しない＝この6ページの編集は
 * 「<head> の読み込みと本文を包む class だけ」に限る）
 */

body.legal-page {
  background: var(--snow);
  color: var(--ink);
  font-family: var(--ui);
  line-height: 1.7;
}

body.legal-page .container {
  background: var(--paper);
  border: 1px solid var(--rule);
  border-radius: 12px;
  box-shadow: none;
}

body.legal-page h1 {
  color: var(--ink);
  border-bottom: 3px solid var(--ink);
}

body.legal-page h2 {
  color: var(--ink);
}

body.legal-page .effective-date {
  color: var(--mist);
}

body.legal-page .back-link {
  color: var(--ink);
  border: 1px solid var(--rule);
  border-radius: 8px;
  transition: none;
}

body.legal-page .back-link:hover {
  background: var(--wash);
  color: var(--ink);
}

body.legal-page ul,
body.legal-page li {
  color: var(--graphite);
}

body.legal-page table {
  border-collapse: collapse;
}

body.legal-page th,
body.legal-page td {
  border: 1px solid var(--rule);
}

body.legal-page th {
  background: var(--wash);
  color: var(--ink);
}

/* disclaimer_*.html だけが持つ警告枠 */
body.legal-page .warning-box {
  background: var(--wash);
  border: 2px solid var(--r24);
}

body.legal-page .warning-box h3 {
  color: var(--r24);
}

/* terms_ja.html・disclaimer_ja.html・privacy_ja.html だけが持つ型
   （旧画面の規約の窓 .legal-content にあった型をそのまま持ってきた・2026-10-06） */
body.legal-page .article-number {
  color: var(--link);
}

body.legal-page .date {
  color: var(--mist);
}

body.legal-page .highlight {
  background: var(--wash);
}

body.legal-page .important {
  background: var(--wash);
  border-left: 5px solid var(--r24);
  color: var(--ink);
}

body.legal-page ol {
  color: var(--graphite);
}

@media (max-width: 768px) {
  body.legal-page {
    padding: 12px;
  }

  body.legal-page .container {
    padding: 24px 20px;
  }
}