.pk-page {
  --pk-ink: #1c292f;
  --pk-muted: #62727b;
  --pk-accent: #006c70;
  --pk-line: #dce3e5;
  color-scheme: light;
  background: #f7f9f9;
  color: var(--pk-ink);
  padding-top: 52px;
  font-family: -apple-system, BlinkMacSystemFont, "Pretendard", "Noto Sans KR", "Segoe UI", sans-serif;
}
.pk-page--devlog { --pk-accent: #315dc1; }
.pk-page a:focus-visible, .pk-page button:focus-visible, .pk-page summary:focus-visible {
  outline: 3px solid #397cdb;
  outline-offset: 4px;
  border-radius: 3px;
}
.pk-shell { width: min(1120px, calc(100% - 64px)); margin: 0 auto; padding: 38px 0 88px; }
.pk-breadcrumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; color: var(--pk-muted); font-size: 13px; line-height: 1.8; }
.pk-breadcrumbs a:hover, .pk-footer a:hover { text-decoration: underline; text-underline-offset: 4px; }
.pk-breadcrumbs [aria-current] { color: #35454d; }
.pk-hero { padding: 20px 0; border-bottom: 1px solid var(--pk-line); }
.pk-eyebrow { margin: 0 0 17px; color: var(--pk-accent); font-size: 11px; line-height: 1.6; font-weight: 750; letter-spacing: .15em; }
.pk-hero h1 { max-width: 930px; margin: 0; font-size: 36px; line-height: 1.4; font-weight: 750; letter-spacing: -.045em; word-break: keep-all; overflow-wrap: anywhere; }
.pk-summary { max-width: 790px; margin: 20px 0; color: #4c5d65; font-size: 17px; line-height: 1.8; word-break: keep-all; overflow-wrap: anywhere; }
.pk-meta { margin-top: 18px; color: var(--pk-muted); font-size: 13px; line-height: 1.85; }
.pk-meta > :first-child { margin-top: 0; }
.pk-meta > :last-child { margin-bottom: 0; }
.pk-meta a { color: var(--pk-accent); text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.pk-meta ul { display: flex; flex-wrap: wrap; gap: 5px 22px; padding-left: 17px; }
.pk-meta dl { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 0; }
.pk-meta dt { font-weight: 650; }
.pk-meta dd { margin: 0; }
.pk-reading-layout { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 54px; align-items: start; padding-top: 24px; }
.pk-toc { position: sticky; top: 84px; padding: 2px 22px 8px 0; border-right: 1px solid var(--pk-line); font-size: 13px; line-height: 1.75; }
.pk-toc-summary { min-height: 44px; padding: 10px 0; box-sizing: border-box; color: #35454d; font-size: 14px; line-height: 1.6; font-weight: 750; cursor: pointer; }
.pk-toc details[open] > .pk-toc-summary { margin-bottom: 16px; }
.pk-toc-summary:hover { color: var(--pk-accent); }
.pk-toc-content { min-width: 0; }
.pk-toc ol, .pk-toc ul { margin: 0; padding: 0; list-style: none; }
.pk-toc li { margin: 0 0 12px; }
.pk-toc li ul, .pk-toc li ol { padding: 10px 0 0 13px; }
.pk-toc a { display: inline-block; color: #65757e; }
.pk-toc a:hover { color: var(--pk-accent); }
.pk-body-column { min-width: 0; }
.pk-prose { font-size: 17px; line-height: 1.8; overflow-wrap: anywhere; }
.pk-prose > :first-child { margin-top: 0; }
.pk-prose h2 { margin: 56px 0 20px; color: var(--pk-ink); font-size: 26px; line-height: 1.4; letter-spacing: -.035em; font-weight: 750; word-break: keep-all; }
.pk-prose h3 { margin: 34px 0 14px; font-size: 21px; line-height: 1.5; letter-spacing: -.025em; }
.pk-prose h2, .pk-prose h3, .pk-prose [id] { scroll-margin-top: 82px; }
.pk-prose p { margin: 0 0 24px; }
.pk-prose a { color: var(--pk-accent); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.pk-prose strong { font-weight: 750; }
.pk-prose ul, .pk-prose ol { padding-left: 23px; margin: 0 0 27px; }
.pk-prose li { margin: 7px 0; padding-left: 4px; }
.pk-prose li > p { margin-bottom: 8px; }
.pk-prose code { padding: 3px 6px; border-radius: 5px; background: #e9eef0; color: #244655; font-size: .87em; font-family: "Cascadia Code", Consolas, ui-monospace, monospace; overflow-wrap: anywhere; }
.pk-prose pre { max-width: 100%; margin: 28px 0 32px; padding: 24px; overflow: auto; background: #14242e; color: #e0edf0; border-radius: 13px; border: 1px solid #223845; font-size: 13px; line-height: 1.85; tab-size: 4; }
.pk-prose pre code { padding: 0; background: transparent; color: inherit; border-radius: 0; font-size: inherit; overflow-wrap: normal; white-space: pre; }
.pk-prose table { display: block; width: 100%; overflow-x: auto; margin: 27px 0 32px; border-collapse: collapse; border-top: 1px solid #becdd2; border-bottom: 1px solid #becdd2; font-size: 14px; line-height: 1.8; }
.pk-prose th, .pk-prose td { min-width: 125px; padding: 14px 16px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--pk-line); }
.pk-prose th { color: #284653; background: #eaf0f2; font-weight: 700; }
.pk-prose td { background: #fff; }
.pk-prose tr:last-child td { border-bottom: 0; }
.pk-prose blockquote { margin: 30px 0; padding: 20px 24px; border-left: 3px solid var(--pk-accent); background: #edf3f4; color: #3a535e; }
.pk-prose blockquote p:last-child { margin-bottom: 0; }
.pk-prose figure { margin: 30px 0; }
.pk-prose figure img { width: 100%; height: auto; border-radius: 12px; }
.pk-prose figure img[src$=".svg"] { display: block; width: auto; max-width: 100%; margin-inline: auto; }
.pk-prose figcaption { margin-top: 10px; color: var(--pk-muted); font-size: 13px; line-height: 1.7; }
.pk-prose hr { border: 0; border-top: 1px solid var(--pk-line); margin: 42px 0; }
.pk-related { margin-top: 55px; padding: 27px 28px; border: 1px solid #d5e0e5; border-radius: 14px; background: #fff; }
.pk-related .pk-eyebrow { margin-bottom: 10px; }
.pk-related h2 { margin: 0 0 17px; font-size: 22px; line-height: 1.5; letter-spacing: -.025em; }
.pk-related p, .pk-related li { color: #536670; font-size: 14px; line-height: 1.8; }
.pk-related ul, .pk-related ol { margin: 0; padding-left: 19px; }
.pk-related li { margin: 8px 0; }
.pk-related a, .pk-pager a { color: var(--pk-accent); text-decoration: underline; text-underline-offset: 4px; }
.pk-related [data-status="draft"], .pk-related [data-status="planned"] { color: #73818a; }
.pk-related > :last-child { margin-bottom: 0; }
.pk-pager { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 20px; margin: 28px 0; font-size: 14px; line-height: 1.8; }
.pk-pager:empty { display: none; }
.pk-pager > * { max-width: 100%; }
.pk-share { display: flex; flex-wrap: wrap; gap: 22px; align-items: center; justify-content: space-between; margin-top: 34px; padding-top: 29px; border-top: 1px solid var(--pk-line); }
.pk-share p { margin: 4px 0; color: var(--pk-muted); font-size: 13px; line-height: 1.7; }
.pk-share .pk-share-title { color: #35454d; font-size: 15px; font-weight: 700; }
.pk-share button { border: 1px solid #c6d2d7; border-radius: 8px; padding: 11px 17px; min-height: 44px; color: #264b5d; background: #fff; font-size: 13px; font-weight: 650; cursor: pointer; }
.pk-share button:hover { background: #edf3f5; }
.pk-share button:disabled { opacity: .65; cursor: progress; }
.pk-share [role="status"] { display: block; max-width: 450px; margin-top: 9px; color: var(--pk-muted); font-size: 12px; line-height: 1.7; overflow-wrap: anywhere; }
.pk-share [role="status"]:empty { display: none; }
.pk-footer { width: min(1120px, calc(100% - 64px)); margin: 0 auto; padding: 35px 0 42px; border-top: 1px solid var(--pk-line); color: var(--pk-muted); font-size: 12px; line-height: 1.8; }
.pk-footer-brand { display: inline-block; margin-bottom: 17px; color: #263f4b; font-size: 16px; font-weight: 750; letter-spacing: -.03em; }
.pk-footer nav { display: flex; flex-wrap: wrap; gap: 10px 23px; }
.pk-footer p { margin: 18px 0 5px; }
.pk-footer small { font-size: 11px; }
@media (min-width: 901px) {
  .pk-toc { max-height: calc(100vh - 108px); overflow-y: auto; }
}
@media (max-width: 900px) {
  .pk-shell, .pk-footer { width: min(760px, calc(100% - 48px)); }
  .pk-reading-layout { grid-template-columns: minmax(0, 1fr); gap: 20px; padding-top: 20px; }
  .pk-toc { position: static; padding: 20px 23px; border: 1px solid var(--pk-line); border-radius: 12px; background: #eef3f4; }
  .pk-toc-content > nav > ol, .pk-toc-content > nav > ul { columns: 2; column-gap: 28px; }
  .pk-toc li { break-inside: avoid; margin-bottom: 9px; }
  .pk-hero { padding-top: 20px; }
}
@media (max-width: 680px) {
  .pk-shell, .pk-footer { width: calc(100% - 36px); }
  .pk-shell { padding-top: 24px; padding-bottom: 56px; }
  .pk-breadcrumbs { gap: 6px 8px; font-size: 11px; }
  .pk-hero { padding-top: 20px; padding-bottom: 20px; }
  .pk-hero h1 { font-size: 28px; line-height: 1.4; }
  .pk-eyebrow { font-size: 10px; letter-spacing: .12em; }
  .pk-summary { margin-top: 20px; font-size: 16px; }
  .pk-meta { font-size: 12px; }
  .pk-toc { padding: 10px 16px; font-size: 13px; }
  .pk-toc-content > nav > ol, .pk-toc-content > nav > ul { columns: 1; }
  .pk-prose { font-size: 16px; line-height: 1.8; }
  .pk-prose h2 { margin-top: 43px; font-size: 22px; }
  .pk-prose h3 { font-size: 20px; }
  .pk-prose pre { padding: 19px; font-size: 12px; border-radius: 10px; }
  .pk-prose th, .pk-prose td { min-width: 125px; padding: 12px; }
  .pk-related { margin-top: 40px; padding: 22px 20px; }
  .pk-related h2 { font-size: 21px; }
  .pk-share { align-items: flex-start; }
  .pk-share button { font-size: 14px; }
  .pk-footer { padding-top: 28px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .pk-page *, .pk-page *::before, .pk-page *::after { animation: none !important; transition: none !important; }
}

/* Book reader: the same chapter navigation stays beside every chapter. */
.pk-page--book .pk-shell { width: min(1240px, calc(100% - 64px)); padding-top: 24px; }
.book-layout { display: grid; grid-template-columns: 286px minmax(0, 1fr); gap: 46px; align-items: start; margin-top: 22px; }
.book-sidebar { min-width: 0; position: sticky; top: 76px; max-height: calc(100dvh - 94px); overflow-y: auto; overscroll-behavior: contain; border: 1px solid #dce3e5; border-radius: 10px; background: #fff; scrollbar-width: thin; }
.book-toc-details > summary { padding: 16px 18px; font-size: 15px; line-height: 1.6; font-weight: 750; cursor: pointer; border-bottom: 1px solid #dce3e5; }
.book-toc-details > summary span { color: #62727b; font-size: 12px; font-weight: 500; margin-left: 12px; }
.book-toc-inner { padding: 16px 10px 12px; }
.book-home { display: block; padding: 0 10px 16px; color: #006c70; font-size: 14px; line-height: 1.7; font-weight: 700; }
.book-chapters ol { list-style: none; padding: 0; margin: 0; }
.book-chapters > ol > li { margin: 3px 0; }
.book-chapters > ol > li > a, .book-pending { display: flex; gap: 10px; align-items: baseline; padding: 10px; border-radius: 6px; font-size: 14px; line-height: 1.6; color: #35454d; text-decoration: none; }
.book-chapters > ol > li > a:hover { background: #f0f5f5; color: #006c70; }
.book-chapters > ol > li > a[aria-current="page"] { background: #e5f2ef; color: #005b5e; font-weight: 750; }
.book-number { flex: 0 0 20px; color: #73858b; font-size: 12px; font-variant-numeric: tabular-nums; }
.book-section-toc { margin: 5px 8px 12px 30px; padding-left: 12px; border-left: 2px solid #c7dfd9; }
.book-section-toc a { display: block; padding: 5px 0; font-size: 12px; line-height: 1.6; color: #526b70; }
.book-section-toc .pk-toc-level-3 { display: none; }
.book-layout .pk-article { min-width: 0; }
.book-layout .pk-hero { padding-top: 0; }
.book-layout .pk-hero h1 { font-size: 34px; line-height: 1.4; }
.book-layout .pk-eyebrow { margin-bottom: 10px; }
.book-layout .pk-summary { margin: 14px 0; }
.book-reading-content { padding-top: 28px; }
.book-index-entry { margin: 0; padding: 0; }
.book-index-entry > a { display: flex; gap: 10px; padding: 10px; border-radius: 6px; color: #35454d; font-size: 14px; line-height: 1.6; }
.book-index-entry > a:hover { background: #f0f5f5; color: #006c70; }
.book-index-entry h3 { font: inherit; margin: 0; }
.book-legacy { margin-top: 48px; border-top: 1px solid #dce3e5; padding-top: 22px; }
.book-legacy > summary { cursor: pointer; font-size: 16px; line-height: 1.7; color: #526b70; }
.book-legacy .wiki-reading-layout { display: block; }
.book-legacy .wiki-sidebar { display: none; }
.book-legacy .section { margin-top: 36px; }
.book-legacy h2 { font-size: 26px; line-height: 1.4; }
.book-legacy h3 { font-size: 21px; line-height: 1.5; }
.book-legacy table { display: block; max-width: 100%; overflow-x: auto; }
.book-legacy pre { max-width: 100%; overflow-x: auto; padding: 20px; background: #14242e; color: #e0edf0; border-radius: 8px; }
.book-legacy code { white-space: pre-wrap; overflow-wrap: anywhere; }
.book-legacy [id] { scroll-margin-top: 80px; }
.book-start { display: inline-block; padding: 11px 18px; border-radius: 6px; background: #006c70; color: #fff !important; text-decoration: none !important; font-weight: 650; }
@media (max-width: 1050px) and (min-width: 901px) { .book-layout { grid-template-columns: 250px minmax(0, 1fr); gap: 28px; } }
@media (max-width: 900px) {
  .pk-page--book .pk-shell { width: min(760px, calc(100% - 40px)); }
  .book-layout { display: block; margin-top: 16px; }
  .book-sidebar { position: static; max-height: none; margin-bottom: 26px; }
  .book-toc-details[open] .book-toc-inner { max-height: 55dvh; overflow-y: auto; }
  .book-layout .pk-hero h1 { font-size: 28px; }
}
@media (max-width: 680px) {
  .pk-page--book .pk-shell { width: calc(100% - 36px); padding-top: 18px; }
  .book-layout .pk-hero h1 { font-size: 28px; }
  .book-reading-content { padding-top: 22px; }
  .book-legacy h2 { font-size: 22px; }
}

/* Keep book overview card titles within the reading-content scale policy. */
@media (min-width: 681px) { .pk-page--book .card h2 { font-size: 24px; } }