﻿h1, h2, h3 {
  line-height: 1.25;
  margin-bottom: 0.6rem;
}

h1 { font-size: 2rem; }
h2 { font-size: 1.4rem; margin-top: 2rem; }
h3 { font-size: 1.15rem; margin-top: 1.2rem; }

p { margin-top: 0.9rem; color: var(--text); }

ul, ol { margin: 0.8rem 0 0.8rem 1.2rem; }
li { margin-top: 0.4rem; }

.toc {
  margin-top: 1rem;
  border-top: 1px solid var(--border);
  padding-top: 1rem;
}
.toc h3 { margin-top: 1rem; }
.toc a { color: var(--text); }
.toc a:hover { color: var(--link); }

body.chapter-01 .toc a[data-chapter="1"],
body.chapter-02 .toc a[data-chapter="2"],
body.chapter-03 .toc a[data-chapter="3"],
body.chapter-04 .toc a[data-chapter="4"],
body.chapter-05 .toc a[data-chapter="5"],
body.chapter-06 .toc a[data-chapter="6"],
body.chapter-07 .toc a[data-chapter="7"],
body.chapter-08 .toc a[data-chapter="8"],
body.chapter-09 .toc a[data-chapter="9"],
body.chapter-10 .toc a[data-chapter="10"],
body.chapter-11 .toc a[data-chapter="11"],
body.chapter-12 .toc a[data-chapter="12"],
body.chapter-13 .toc a[data-chapter="13"],
body.chapter-14 .toc a[data-chapter="14"],
body.chapter-15 .toc a[data-chapter="15"],
body.chapter-16 .toc a[data-chapter="16"],
body.chapter-17 .toc a[data-chapter="17"],
body.chapter-18 .toc a[data-chapter="18"],
body.chapter-19 .toc a[data-chapter="19"],
body.chapter-20 .toc a[data-chapter="20"],
body.chapter-21 .toc a[data-chapter="21"],
body.chapter-22 .toc a[data-chapter="22"],
body.chapter-23 .toc a[data-chapter="23"],
body.chapter-24 .toc a[data-chapter="24"],
body.chapter-25 .toc a[data-chapter="25"],
body.chapter-26 .toc a[data-chapter="26"],
body.chapter-27 .toc a[data-chapter="27"],
body.chapter-28 .toc a[data-chapter="28"],
body.chapter-29 .toc a[data-chapter="29"],
body.chapter-30 .toc a[data-chapter="30"],
body.chapter-31 .toc a[data-chapter="31"],
body.chapter-32 .toc a[data-chapter="32"],
body.chapter-33 .toc a[data-chapter="33"],
body.chapter-34 .toc a[data-chapter="34"],
body.chapter-35 .toc a[data-chapter="35"],
body.chapter-36 .toc a[data-chapter="36"],
body.chapter-37 .toc a[data-chapter="37"],
body.chapter-38 .toc a[data-chapter="38"],
body.chapter-39 .toc a[data-chapter="39"],
body.chapter-40 .toc a[data-chapter="40"],
body.chapter-41 .toc a[data-chapter="41"],
body.chapter-42 .toc a[data-chapter="42"],
body.chapter-43 .toc a[data-chapter="43"],
body.chapter-44 .toc a[data-chapter="44"],
body.chapter-45 .toc a[data-chapter="45"],
body.chapter-46 .toc a[data-chapter="46"],
body.chapter-47 .toc a[data-chapter="47"],
body.chapter-48 .toc a[data-chapter="48"],
body.chapter-49 .toc a[data-chapter="49"],
body.chapter-50 .toc a[data-chapter="50"],
body.chapter-51 .toc a[data-chapter="51"],
body.chapter-52 .toc a[data-chapter="52"],
body.chapter-53 .toc a[data-chapter="53"] {
  font-weight: 700;
  color: var(--link);
}

.breadcrumbs {
  font-size: 0.9rem;
  color: var(--muted);
  margin-bottom: 1rem;
}

.callout {
  border-radius: var(--radius);
  padding: 14px 16px;
  margin: 1rem 0;
  border: 1px solid transparent;
}
.callout.info { background: var(--callout-info); border-color: #bcd3ff; }
.callout.warn { background: var(--callout-warn); border-color: #ffd188; }
.callout.danger { background: var(--callout-danger); border-color: #ffb3b3; }

.code-block {
  margin: 1rem 0;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  background: var(--code-bg);
}

.code-block figcaption {
  padding: 6px 12px;
  font-size: 0.85rem;
  color: var(--muted);
  border-bottom: 1px solid var(--border);
  background: #ebe9e4;
}

pre {
  font-family: var(--font-mono);
  padding: 14px 16px;
  overflow-x: auto;
  font-size: 0.95rem;
}

code { font-family: var(--font-mono); }
.inline-code {
  background: var(--code-bg);
  padding: 2px 6px;
  border-radius: 6px;
  font-size: 0.95rem;
}

.task, .self-check, .mini-project, .glossary {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 16px;
  margin: 1rem 0;
  background: #fcfbf9;
}

.task h3, .self-check h3, .mini-project h3, .glossary h3 { margin-top: 0; }

.freelance {
  border: 1px solid #b5d4ff;
  background: #eef6ff;
  border-radius: var(--radius);
  padding: 16px;
  margin: 1rem 0;
}

.freelance h3 { margin-top: 0; }

.checklist { list-style: none; margin-left: 0; }
.checklist li {
  display: flex;
  gap: 10px;
  align-items: flex-start;
}
.checklist input { margin-top: 4px; }

.nav-links {
  display: flex;
  gap: 12px;
  margin-top: 2rem;
  flex-wrap: wrap;
}

.button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
}

.button.primary {
  background: var(--link);
  color: white;
  border-color: var(--link);
}

.table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 1rem;
  font-size: 0.95rem;
}
.table th, .table td {
  border: 1px solid var(--border);
  padding: 10px 12px;
  text-align: left;
}
.table th { background: #f1efe9; }

.notice {
  font-size: 0.95rem;
  color: var(--muted);
}

.hero {
  display: grid;
  gap: 16px;
  margin-bottom: 1.5rem;
}

.hero-card {
  background: var(--surface);
  border-radius: var(--radius);
  padding: 18px;
  border: 1px solid var(--border);
  box-shadow: var(--shadow);
}

@media (max-width: 600px) {
  h1 { font-size: 1.7rem; }
  .nav-links { flex-direction: column; }
  .button { width: 100%; justify-content: center; }
}
.donate-card {
  margin-top: 18px;
  padding: 14px;
  border-radius: var(--radius);
  border: 1px dashed var(--border);
  background: #f7f4ef;
}

.donate-card h3 {
  margin-top: 0;
  font-size: 1rem;
}

.donate-card p {
  margin: 0.6rem 0 0.9rem;
  color: var(--muted);
  font-size: 0.95rem;
}
