@import url("https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700&family=Noto+Serif+KR:wght@600;700&display=swap");
/* BYUNSHIJI SITE SYSTEM V124
 * Whole-site desktop/mobile navigation, secondary navigation and readable colour system.
 */
:root {
  --ui124-paper: #fffdf8;
  --ui124-page: #eee7d8;
  --ui124-panel: #fbf6ec;
  --ui124-ink: #211b15;
  --ui124-text: #40362c;
  --ui124-muted: #625649;
  --ui124-accent: #8b5418;
  --ui124-line: #d4c4ab;
  --ui124-shadow: 0 18px 48px rgba(45, 34, 21, .16);
  --ui124-header-h: 84px;
  --ui124-context-h: 0px;
  color-scheme: light !important;
}

body.site-system-v124.has-context-bar-v124 {
  --ui124-context-h: 44px;
}

/*
 * Old templates stored a dark preference independently, but several of them
 * changed only the foreground colours. V124 keeps one reliable warm-paper
 * reading theme across all templates.
 */
html body.site-system-v124,
html body.site-system-v124.ink-mode,
html body.site-system-v124.dark,
html body.site-system-v124.dark-mode,
html body.site-system-v124.night-mode,
html body.site-system-v124.theme-dark,
html[data-theme="dark"] body.site-system-v124,
html[data-theme="night"] body.site-system-v124 {
  --parch: var(--ui124-paper) !important;
  --parch-m: var(--ui124-panel) !important;
  --parch-d: #eee2cf !important;
  --ink: var(--ui124-ink) !important;
  --ink-m: var(--ui124-text) !important;
  --ink-l: var(--ui124-muted) !important;
  --ink-xl: #75685b !important;
  --border: #cbb48f !important;
  --border-l: #dfd0b8 !important;
  --ochre-ll: #f7ead8 !important;
  background-color: var(--ui124-page) !important;
  color: var(--ui124-ink) !important;
}

/* The V123 primary header must win over template-level display:none rules. */
html body.site-system-v124 > header.atlas-unified-header-v123,
html.atlas-v102 body.site-system-v124 > header.atlas-unified-header-v123 {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  min-height: var(--ui124-header-h) !important;
}

/* Remove every superseded primary bar; V124 supplies a compact context row. */
body.site-system-v124 > #topbar,
body.site-system-v124 > .topbar,
body.site-system-v124 > .site-header,
body.site-system-v124 > .global-header,
body.site-system-v124 > .masthead,
body.site-system-v124 > .nav-wrap,
body.site-system-v124 .atlas-legacy-topnav-v102,
body.site-system-v124 #theme-btn,
body.site-system-v124 [data-theme-toggle],
body.site-system-v124 .theme-toggle,
body.site-system-v124 .dark-mode-toggle {
  display: none !important;
}

body.site-system-v124 > #app {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

body.site-system-v124 #reader {
  margin-top: 0 !important;
}

/* Consistent page-level context row below the global header. */
.atlas-context-bar-v124 {
  position: sticky;
  top: var(--ui124-header-h);
  z-index: 999998;
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  padding: 7px max(14px, calc((100vw - 1500px) / 2 + 26px));
  border-bottom: 1px solid var(--ui124-line);
  background: rgba(255, 253, 248, .98);
  color: var(--ui124-ink);
  font: 500 12px/1.35 Arial, "Noto Sans KR", sans-serif;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.atlas-context-title-v124 {
  overflow: hidden;
  flex: 1 1 auto;
  min-width: 0;
  color: var(--ui124-muted);
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.atlas-context-home-v124,
.atlas-secondary-toggle-v124 {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 0 11px;
  border: 1px solid var(--ui124-line);
  border-radius: 999px;
  background: var(--ui124-paper);
  color: var(--ui124-text);
  font: 600 12px/1 Arial, "Noto Sans KR", sans-serif;
  text-decoration: none;
}

.atlas-secondary-toggle-v124 {
  display: none;
  cursor: pointer;
}

.atlas-context-home-v124:hover,
.atlas-secondary-toggle-v124:hover,
.atlas-secondary-toggle-v124[aria-expanded="true"] {
  border-color: var(--ui124-accent);
  background: var(--ui124-accent);
  color: #fffdf8;
}

/* Useful book/research tables of contents are secondary navigation, not headers. */
body.site-system-v124 #sidebar.atlas-secondary-nav-v124 {
  position: sticky !important;
  top: calc(var(--ui124-header-h) + var(--ui124-context-h)) !important;
  display: block !important;
  flex: 0 0 280px !important;
  width: 280px !important;
  min-width: 280px !important;
  height: calc(100vh - var(--ui124-header-h) - var(--ui124-context-h)) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  transform: none !important;
  border: 0 !important;
  border-right: 1px solid var(--ui124-line) !important;
  background: var(--ui124-panel) !important;
  color: var(--ui124-ink) !important;
  box-shadow: none !important;
}

body.site-system-v124 #sidebar.atlas-secondary-nav-v124 *,
body.site-system-v124 #sidebar.atlas-secondary-nav-v124 a,
body.site-system-v124 #sidebar.atlas-secondary-nav-v124 button,
body.site-system-v124 #sidebar.atlas-secondary-nav-v124 label {
  opacity: 1;
}

body.site-system-v124 #sidebar.atlas-secondary-nav-v124 input,
body.site-system-v124 #sidebar.atlas-secondary-nav-v124 select,
body.site-system-v124 #sidebar.atlas-secondary-nav-v124 textarea {
  border-color: var(--ui124-line) !important;
  background: var(--ui124-paper) !important;
  color: var(--ui124-ink) !important;
}

body.site-system-v124 #sidebar.atlas-secondary-nav-v124 input::placeholder,
body.site-system-v124 #sidebar.atlas-secondary-nav-v124 textarea::placeholder {
  color: #6f6255 !important;
  opacity: 1 !important;
}

/* Research indexes use one quiet, light contents card in both languages. */
body.site-system-v124 .fd-toc {
  border: 1px solid var(--ui124-line) !important;
  border-radius: 12px !important;
  background: var(--ui124-paper) !important;
  color: var(--ui124-ink) !important;
  box-shadow: 0 10px 30px rgba(53, 39, 23, .07) !important;
}

body.site-system-v124 .fd-toc a,
body.site-system-v124 .fd-toc li:not(.fd-toc-part) {
  color: var(--ui124-text) !important;
  opacity: 1 !important;
}

body.site-system-v124 .fd-toc .fd-toc-part,
body.site-system-v124 .fd-toc .fd-toc-h {
  color: var(--ui124-accent) !important;
  opacity: 1 !important;
}

/* Reader pages: the warm paper and foreground must always change together. */
body.site-system-v124 #main,
body.site-system-v124 #reader,
body.site-system-v124 #preface,
body.site-system-v124 .chapter,
body.site-system-v124 .ch-body,
body.site-system-v124 .pref-content {
  color: var(--ui124-ink) !important;
}

body.site-system-v124 .ch-title,
body.site-system-v124 .ch-sec-heading,
body.site-system-v124 .ch-epigraph p,
body.site-system-v124 .pref-p,
body.site-system-v124 .pref-sign-text strong {
  color: var(--ui124-ink) !important;
  opacity: 1 !important;
}

body.site-system-v124 .ch-body p,
body.site-system-v124 .pref-p,
body.site-system-v124 .rs-p,
body.site-system-v124 .rs-ul li,
body.site-system-v124 .rs-tbl td {
  color: var(--ui124-ink) !important;
  opacity: 1 !important;
}

body.site-system-v124 .rs-sub,
body.site-system-v124 .rs-meta,
body.site-system-v124 .rs-q p,
body.site-system-v124 .rs-tbl th {
  color: #51463a !important;
  opacity: 1 !important;
}

body.site-system-v124 .rs-q strong,
body.site-system-v124 .rs-tbl strong {
  color: #754714 !important;
}

/* Runtime repair chooses the better of a warm dark and warm light foreground. */
body.site-system-v124 .atlas-contrast-repaired-v124 {
  color: var(--ui124-auto-color) !important;
  opacity: 1 !important;
  text-shadow: none !important;
  -webkit-text-fill-color: var(--ui124-auto-color) !important;
}

body.site-system-v124 #progress-bar {
  top: calc(var(--ui124-header-h) + var(--ui124-context-h)) !important;
}

body.site-system-v124.has-secondary-nav-v124 #progress-bar {
  left: 280px !important;
}

.atlas-secondary-overlay-v124 {
  display: none;
}

.atlas-context-bar-v124 :focus-visible,
body.site-system-v124 #sidebar.atlas-secondary-nav-v124 :focus-visible {
  outline: 3px solid rgba(139, 84, 24, .38) !important;
  outline-offset: 3px !important;
}

@media (max-width: 1040px) {
  :root {
    --ui124-header-h: 72px;
  }

  .atlas-context-bar-v124 {
    padding-right: 12px;
    padding-left: 12px;
  }

  .atlas-context-home-v124 {
    width: 36px;
    padding: 0;
    font-size: 0;
  }

  .atlas-context-home-v124::before {
    content: "⌂";
    font-size: 16px;
  }

  .atlas-secondary-toggle-v124 {
    display: inline-flex;
  }

  body.site-system-v124 #sidebar.atlas-secondary-nav-v124 {
    position: fixed !important;
    z-index: 1000000 !important;
    top: calc(var(--ui124-header-h) + var(--ui124-context-h)) !important;
    bottom: 0 !important;
    left: 0 !important;
    width: min(320px, 88vw) !important;
    min-width: 0 !important;
    height: auto !important;
    transform: translateX(-105%) !important;
    border-right: 1px solid var(--ui124-line) !important;
    box-shadow: var(--ui124-shadow) !important;
    transition: transform .22s ease !important;
  }

  body.site-system-v124.atlas-secondary-open-v124 #sidebar.atlas-secondary-nav-v124 {
    transform: translateX(0) !important;
  }

  body.site-system-v124 .atlas-secondary-overlay-v124 {
    position: fixed;
    z-index: 999999;
    inset: calc(var(--ui124-header-h) + var(--ui124-context-h)) 0 0;
    display: none;
    border: 0;
    background: rgba(24, 18, 12, .48);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
  }

  body.site-system-v124.atlas-secondary-open-v124 .atlas-secondary-overlay-v124 {
    display: block;
  }

  body.site-system-v124.has-secondary-nav-v124 #progress-bar {
    left: 0 !important;
  }

  body.site-system-v124 #app > #main,
  body.site-system-v124 #app > main,
  body.site-system-v124 #main {
    width: 100% !important;
    min-width: 0 !important;
  }

  body.site-system-v124 .chapter {
    width: 100% !important;
    max-width: 760px !important;
    padding-right: clamp(16px, 4vw, 32px) !important;
    padding-left: clamp(16px, 4vw, 32px) !important;
  }
}

@media (max-width: 560px) {
  .atlas-context-title-v124 {
    text-align: left;
  }

  .atlas-context-home-v124,
  .atlas-secondary-toggle-v124 {
    min-height: 34px;
  }

  body.site-system-v124 .fd-toc {
    border-radius: 9px !important;
  }
}

/* ── V125 BRAND TYPOGRAPHY ──
 * Unified brand typography for Korean and English headers.
 * Latin renders in Playfair Display, Korean in Noto Serif KR. */
:root {
  --ui123-serif: "Playfair Display", "Noto Serif KR", Georgia, "Times New Roman", serif;
}

/* ── V126 NAVIGATION COMPLETION ── */

/* ── V128 READER COVER LIGHT THEME ──
 * The dark landing covers of the wind and masters readers join the
 * unified warm paper theme. Scoped to the atlas-v102 reader template. */
html.atlas-v102 body.site-system-v124 #cover{
  background:#FEFCF8 !important;
}
html.atlas-v102 body.site-system-v124 #cover::before{
  background:radial-gradient(ellipse at center, rgba(139,84,24,.07) 0%, rgba(139,84,24,0) 70%) !important;
}
html.atlas-v102 body.site-system-v124 #cover .cv-eyebrow{ color:#8B5418 !important; }
html.atlas-v102 body.site-system-v124 #cover .cv-title-ko{ color:#111008 !important; font-weight:400 !important; }
html.atlas-v102 body.site-system-v124 #cover .cv-title-en{ color:#8B5418 !important; }
html.atlas-v102 body.site-system-v124 #cover .cv-div{ background:#8B5418 !important; }
html.atlas-v102 body.site-system-v124 #cover .cv-sub-ko{ color:#4A3C2C !important; }
html.atlas-v102 body.site-system-v124 #cover .cv-sub-en{ color:#7A6C5C !important; }
html.atlas-v102 body.site-system-v124 #cover .cv-author{
  color:#8B5418 !important; border-color:rgba(139,84,24,.35) !important;
  background:rgba(139,84,24,.05) !important;
}
html.atlas-v102 body.site-system-v124 #cover .cv-start-btn{
  background:#8B5418 !important; color:#FFFDF8 !important;
}
html.atlas-v102 body.site-system-v124 #cover .cv-start-btn:hover{ background:#6F4212 !important; }
html.atlas-v102 body.site-system-v124 #cover .cv-start-btn[style*="transparent"]{
  background:transparent !important; color:#8B5418 !important;
  border:1px solid rgba(139,84,24,.5) !important;
}
html.atlas-v102 body.site-system-v124 #cover .cv-start-btn[style*="transparent"]:hover{
  background:rgba(139,84,24,.08) !important;
}
html.atlas-v102 body.site-system-v124 #cover .cv-stat-num{ color:#8B5418 !important; }
html.atlas-v102 body.site-system-v124 #cover .cv-stat-label{ color:#7A6C5C !important; }