:root {
  --ink: #22201c;
  --sub: #6b6357;
  --paper: #f6f1e7;
  --paper2: #efe7d6;
  --jumuk: #8a2b2b;       /* 주묵 — 강조 */
  --songcheong: #2f6453;  /* 송청록 — 안정 */
  --myeonghwang: #b8901f; /* 명황 — 환기 */
  --line: #e2d8c4;
  --serif: 'Nanum Myeongjo', serif;
  --sans: 'Pretendard', 'Pretendard Variable', system-ui, sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  line-height: 1.9;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; }

/* ── 글 페이지 ── */
.essay { max-width: 40rem; margin: 0 auto; padding: 4.5rem 1.5rem 6rem; }
.essay-head { margin-bottom: 2.6rem; border-bottom: 1px solid var(--line); padding-bottom: 1.6rem; }
.series { display: inline-block; color: var(--songcheong); font-size: .8rem; letter-spacing: .16em; text-decoration: none; }
.part { color: var(--jumuk); font-size: .85rem; margin: .7rem 0 .2rem; letter-spacing: .02em; }
.essay-head h1 { font-family: var(--serif); font-weight: 800; font-size: 2.1rem; line-height: 1.45; margin: .3rem 0 0; letter-spacing: -.01em; }
.prose { font-size: 1.08rem; }
.prose p { margin: 1.35rem 0; }
.prose strong { color: var(--jumuk); font-weight: 700; }
.prose h2, .prose h3 { font-family: var(--serif); font-weight: 700; margin: 2.6rem 0 1rem; }
.prose blockquote { margin: 2rem 0; padding: .9rem 1.2rem; border-left: 3px solid var(--myeonghwang); background: var(--paper2); color: var(--sub); }
.prose blockquote p { margin: .3rem 0; }
.prose hr { border: none; border-top: 1px solid var(--line); margin: 3rem auto; width: 38%; }
.prose sup a { color: var(--songcheong); text-decoration: none; }
.prose .footnotes { margin-top: 3.5rem; border-top: 1px solid var(--line); padding-top: 1.5rem; font-size: .9rem; color: var(--sub); }
.essay-foot { margin-top: 4.5rem; text-align: center; }
.essay-foot a { color: var(--songcheong); text-decoration: none; font-size: .9rem; }
.essay-foot a:hover { color: var(--jumuk); }

/* ── 목록(인덱스) ── */
.index { max-width: 42rem; margin: 0 auto; padding: 5rem 1.5rem 6rem; }
.site-head { text-align: center; margin-bottom: 3.5rem; }
.site-head .kicker { color: var(--songcheong); font-size: .8rem; letter-spacing: .15em; margin: 0 0 1rem; }
.site-head h1 { font-family: var(--serif); font-weight: 800; font-size: 2.7rem; margin: 0; letter-spacing: -.01em; }
.site-head .sub { color: var(--sub); margin: .9rem 0 .4rem; font-size: 1.05rem; }
.site-head .byline { color: var(--jumuk); font-size: .85rem; letter-spacing: .04em; }
.toc { list-style: none; margin: 0; padding: 0; }
.toc-item a { display: flex; align-items: baseline; gap: 1.1rem; padding: 1.05rem .4rem; border-bottom: 1px solid var(--line); text-decoration: none; transition: background .15s; }
.toc-item a:hover { background: var(--paper2); }
.toc .num { font-family: var(--serif); color: var(--jumuk); font-weight: 700; min-width: 1.7rem; text-align: right; }
.toc .t { flex: 1; font-size: 1.06rem; }
.toc .bu { color: var(--sub); font-size: .74rem; white-space: nowrap; }
.site-foot { margin-top: 4rem; text-align: center; color: var(--songcheong); font-family: var(--serif); font-size: .95rem; }
@media (max-width: 520px) { .toc .bu { display: none; } .site-head h1 { font-size: 2.1rem; } }