/* ============================================================
   精通閃電網路 - 繁體中文版 自訂樣式 v2
   Carefully overrides Asciidoctor inline CSS (31KB, lines 11-555)

   Key Asciidoctor rules to override:
   - body{font-family:"Noto Serif"} → Noto Sans TC
   - body.toc2{padding-left:15em} @media(min-width:768px) → 280px
   - #toc.toc2{width:15em} @media(min-width:768px) → 280px
   - body.toc2{padding-left:20em} @media(min-width:1280px) → 280px
   - h1-h6{color:#ba3925;font-weight:300} → #2c3e50, 700
   ============================================================ */

/* --- CSS Variables --- */
:root {
  --ln-primary: #f7931a;
  --ln-primary-dark: #e07b00;
  --ln-secondary: #4a90d9;
  --ln-secondary-dark: #3570b0;
  --ln-text: #2c3e50;
  --ln-text-light: #5a6c7d;
  --ln-bg: #ffffff;
  --ln-bg-alt: #f8f9fa;
  --ln-bg-warm: #fffbf5;
  --ln-border: #e2e8f0;
  --ln-border-light: #f0f0f0;
  --ln-code-bg: #f6f8fa;
  --ln-shadow: 0 1px 3px rgba(0,0,0,0.08);
  --ln-shadow-lg: 0 4px 16px rgba(0,0,0,0.1);
  --ln-radius: 8px;
  --ln-font-sans: "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", "Helvetica Neue", Arial, sans-serif;
  --ln-font-mono: "JetBrains Mono", "Fira Code", "Source Code Pro", monospace;
  --ln-toc-width: 280px;
  --ln-line-height: 1.9;
  --ln-progress-height: 3px;
  --ln-nav-height: 44px;
}

/* Dark mode is at the END of the file to ensure it overrides all light mode rules */

/* --- Reading Progress Bar --- */
#reading-progress {
  position: fixed;
  top: 0;
  left: 0;
  width: 0%;
  height: var(--ln-progress-height);
  background: linear-gradient(90deg, var(--ln-primary), var(--ln-secondary));
  z-index: 10000;
  transition: width 0.1s linear;
  pointer-events: none;
}

/* ============================================================
   BASE TYPOGRAPHY
   Override Asciidoctor's body{font-family:"Noto Serif","DejaVu Serif",serif}
   ============================================================ */
html {
  scroll-behavior: smooth;
  scroll-padding-top: 80px;
}

body.book {
  font-family: var(--ln-font-sans) !important;
  font-size: 17px !important;
  line-height: var(--ln-line-height) !important;
  color: var(--ln-text) !important;
  background-color: var(--ln-bg) !important;
  padding-bottom: var(--ln-nav-height) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* ============================================================
   DESKTOP TOC LAYOUT OVERRIDES
   Must use same media queries as Asciidoctor to win specificity
   ============================================================ */

/* Override: @media(min-width:768px) body.toc2{padding-left:15em} */
@media screen and (min-width: 768px) {
  body.book.toc2 {
    padding-left: var(--ln-toc-width) !important;
    padding-right: 0 !important;
  }

  #toc.toc2 {
    width: var(--ln-toc-width) !important;
    background-color: var(--ln-bg-alt) !important;
    border-right: 1px solid var(--ln-border) !important;
    padding: 1.2rem 0 2rem 0 !important;
    font-size: 0.85rem !important;
    scrollbar-width: thin;
    scrollbar-color: var(--ln-border) transparent;
  }

  #toc.toc2 #toctitle {
    font-size: 1.05rem !important;
    font-weight: 700 !important;
    color: var(--ln-primary) !important;
    padding: 0 1.2rem 0.8rem !important;
    margin-bottom: 0.5rem !important;
    border-bottom: 2px solid var(--ln-primary) !important;
    font-family: var(--ln-font-sans) !important;
  }

  #toc.toc2 > ul {
    font-size: 0.85rem !important;
  }

  /* TOC scrollbar styling */
  #toc.toc2::-webkit-scrollbar { width: 5px; }
  #toc.toc2::-webkit-scrollbar-track { background: transparent; }
  #toc.toc2::-webkit-scrollbar-thumb { background: var(--ln-border); border-radius: 3px; }
}

/* Override: @media(min-width:1280px) body.toc2{padding-left:20em} */
@media screen and (min-width: 1280px) {
  body.book.toc2 {
    padding-left: var(--ln-toc-width) !important;
    padding-right: 0 !important;
  }

  #toc.toc2 {
    width: var(--ln-toc-width) !important;
  }

  #toc.toc2 #toctitle {
    font-size: 1.1rem !important;
  }

  #toc.toc2 > ul {
    font-size: 0.88rem !important;
  }
}

/* --- TOC link styling (applies to all desktop widths) --- */
#toc.toc2 ul {
  padding-left: 0 !important;
  margin: 0 !important;
  list-style: none !important;
}

#toc.toc2 ul ul {
  padding-left: 1rem !important;
  margin-left: 0 !important;
}

#toc.toc2 li {
  margin: 0 !important;
  padding: 0 !important;
}

#toc.toc2 a {
  display: block !important;
  padding: 0.5rem 1.2rem !important;
  min-height: 44px !important;
  box-sizing: border-box !important;
  color: var(--ln-text-light) !important;
  font-size: 0.85rem !important;
  line-height: 1.5 !important;
  border-bottom: none !important;
  border-left: 3px solid transparent !important;
  transition: color 0.15s, background-color 0.15s, border-left-color 0.15s !important;
  text-decoration: none !important;
}

#toc.toc2 a:hover {
  color: var(--ln-primary) !important;
  background-color: var(--ln-bg-warm) !important;
  border-left-color: var(--ln-primary) !important;
}

#toc.toc2 a.toc-active {
  color: var(--ln-primary) !important;
  background-color: var(--ln-bg-warm) !important;
  border-left-color: var(--ln-primary) !important;
  font-weight: 600 !important;
}

/* ============================================================
   CONTENT AREA
   ============================================================ */
/* Content centered within the space right of TOC.
   52rem ≈ 832px = ~48 CJK chars at 17px — ideal reading width.
   On wide screens (>1280px), extra space is distributed evenly on both sides. */
#content {
  max-width: 52rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 2rem 3rem 3rem !important;
}

/* On very wide screens, limit the dead space by widening slightly */
@media screen and (min-width: 1600px) {
  #content {
    max-width: 58rem !important;
    padding: 2rem 4rem 3rem !important;
  }
}

/* ============================================================
   HEADINGS
   Override Asciidoctor's h1-h6{color:#ba3925;font-weight:300}
   ============================================================ */
h1, h2, h3, h4, h5, h6,
.sidebarblock > .content > .title {
  font-family: var(--ln-font-sans) !important;
  font-weight: 700 !important;
  font-style: normal !important;
  color: var(--ln-text) !important;
  line-height: 1.35 !important;
  letter-spacing: -0.01em;
}

h1 {
  font-size: 2rem !important;
  margin-top: 3rem !important;
  margin-bottom: 1rem !important;
  padding-bottom: 0.5rem !important;
  border-bottom: 3px solid var(--ln-primary) !important;
}

#content h1:first-child {
  margin-top: 0.5rem !important;
}

h2 {
  font-size: 1.6rem !important;
  margin-top: 2.5rem !important;
  margin-bottom: 0.8rem !important;
  padding-bottom: 0.35rem !important;
  border-bottom: 2px solid var(--ln-border) !important;
}

h3, .sidebarblock > .content > .title {
  font-size: 1.3rem !important;
  margin-top: 2rem !important;
  margin-bottom: 0.7rem !important;
}

h4, h5 {
  font-size: 1.1rem !important;
  margin-top: 1.6rem !important;
  margin-bottom: 0.5rem !important;
}

h6 { font-size: 1rem !important; }

/* Part titles (第一部分、第二部分) */
.sect0 > h1,
h1.sect0 {
  text-align: center !important;
  font-size: 1.8rem !important;
  color: var(--ln-primary) !important;
  border-bottom: none !important;
  margin: 4rem 0 2rem !important;
  padding: 1rem 0 !important;
}

.sect0 > h1::after,
h1.sect0::after {
  content: "";
  display: block;
  width: 60px;
  height: 3px;
  background: var(--ln-primary);
  margin: 0.8rem auto 0;
  border-radius: 2px;
}

/* ============================================================
   TEXT CONTENT
   ============================================================ */
p {
  font-family: var(--ln-font-sans) !important;
  line-height: var(--ln-line-height) !important;
  margin-bottom: 1.1em !important;
  color: var(--ln-text) !important;
  word-break: break-word;
  overflow-wrap: break-word;
}

a {
  color: var(--ln-secondary) !important;
  text-decoration: none !important;
  transition: color 0.15s;
}

a:hover, a:focus {
  color: var(--ln-secondary-dark) !important;
  text-decoration: underline !important;
}

/* ============================================================
   CODE BLOCKS
   ============================================================ */
pre {
  font-family: var(--ln-font-mono) !important;
  font-size: 0.85rem !important;
  line-height: 1.6 !important;
  background-color: var(--ln-code-bg) !important;
  border: 1px solid var(--ln-border) !important;
  border-radius: var(--ln-radius) !important;
  padding: 1.1rem 1.3rem !important;
  overflow-x: auto !important;
  white-space: pre !important;
  word-wrap: normal !important;
  margin: 1.3em 0 !important;
  -webkit-overflow-scrolling: touch;
}

pre code {
  font-family: inherit !important;
  font-size: inherit !important;
  background: none !important;
  padding: 0 !important;
  border: none !important;
  border-radius: 0 !important;
  color: inherit !important;
}

code {
  font-family: var(--ln-font-mono) !important;
  font-size: 0.87em !important;
  background-color: var(--ln-code-bg) !important;
  padding: 0.12em 0.35em !important;
  border-radius: 4px !important;
  color: #c7254e;
  border: 1px solid var(--ln-border-light) !important;
  word-break: break-word;
}

/* code dark mode color handled in main dark mode block above */

.listingblock > .title,
.literalblock > .title {
  font-size: 0.82rem !important;
  font-weight: 600 !important;
  color: var(--ln-text-light) !important;
  margin-bottom: 0.3rem !important;
}

/* Callouts */
.conum[data-value] {
  display: inline-block !important;
  color: #fff !important;
  background: var(--ln-secondary) !important;
  border-radius: 50% !important;
  text-align: center !important;
  font-size: 0.7em !important;
  width: 1.8em !important;
  height: 1.8em !important;
  line-height: 1.8em !important;
  font-family: var(--ln-font-sans) !important;
  font-style: normal !important;
  font-weight: 700 !important;
}
.conum[data-value]::after { content: attr(data-value); }
.conum[data-value] + b { display: none !important; }
.colist ol { list-style-type: none !important; padding-left: 0 !important; }

/* ============================================================
   ADMONITION BLOCKS
   ============================================================ */
.admonitionblock {
  margin: 1.5em 0 !important;
  border-radius: var(--ln-radius) !important;
  overflow: hidden !important;
}

.admonitionblock > table {
  border: none !important;
  background: none !important;
  width: 100% !important;
}

.admonitionblock > table td.icon {
  width: 48px !important;
  text-align: center !important;
  vertical-align: top !important;
  padding: 0.9rem 0.4rem 0.9rem 0.9rem !important;
}

.admonitionblock > table td.content {
  padding: 0.9rem 1rem !important;
  border-left: none !important;
  color: var(--ln-text) !important;
  font-size: 0.93rem !important;
  line-height: 1.7 !important;
}

.admonitionblock > table td.content > .title {
  font-weight: 700 !important;
  margin-bottom: 0.3em !important;
}

.admonitionblock.tip > table      { background: #ecfdf5 !important; border-left: 4px solid #10b981 !important; }
.admonitionblock.note > table     { background: #eff6ff !important; border-left: 4px solid var(--ln-secondary) !important; }
.admonitionblock.warning > table  { background: #fffbeb !important; border-left: 4px solid #f59e0b !important; }
.admonitionblock.caution > table  { background: #fef2f2 !important; border-left: 4px solid #ef4444 !important; }
.admonitionblock.important > table{ background: #f5f3ff !important; border-left: 4px solid #8b5cf6 !important; }

/* admonition dark mode colors handled in main dark mode block above */

/* ============================================================
   TABLES
   ============================================================ */
table.tableblock {
  border-collapse: collapse !important;
  width: 100% !important;
  margin: 1.3em 0 !important;
  font-size: 0.9rem !important;
  border: 1px solid var(--ln-border) !important;
}

table.tableblock thead th {
  background-color: var(--ln-bg-alt) !important;
  font-weight: 700 !important;
  padding: 0.7rem 0.9rem !important;
  border-bottom: 2px solid var(--ln-border) !important;
  color: var(--ln-text) !important;
}

table.tableblock td {
  padding: 0.6rem 0.9rem !important;
  border-bottom: 1px solid var(--ln-border-light) !important;
  vertical-align: top !important;
}

table.tableblock tbody tr:hover {
  background-color: var(--ln-bg-warm) !important;
}

/* ============================================================
   IMAGES
   ============================================================ */
.imageblock {
  margin: 1.8em 0 !important;
  text-align: center !important;
}

.imageblock img {
  max-width: 100% !important;
  height: auto !important;
  border-radius: 6px !important;
  box-shadow: var(--ln-shadow) !important;
}

.imageblock .title {
  font-size: 0.82rem !important;
  color: var(--ln-text-light) !important;
  margin-top: 0.6em !important;
  font-style: italic !important;
  line-height: 1.4 !important;
}

/* ============================================================
   BLOCKQUOTES & SIDEBARS
   ============================================================ */
blockquote, .quoteblock {
  border-left: 4px solid var(--ln-primary) !important;
  margin: 1.3em 0 !important;
  padding: 0.7em 1.1em !important;
  background-color: var(--ln-bg-warm) !important;
  border-radius: 0 var(--ln-radius) var(--ln-radius) 0 !important;
}

.quoteblock blockquote {
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
}

.sidebarblock {
  background: var(--ln-bg-alt) !important;
  border: 1px solid var(--ln-border) !important;
  border-radius: var(--ln-radius) !important;
  padding: 1.3rem !important;
  margin: 1.5em 0 !important;
}

.sidebarblock > .content > .title {
  color: var(--ln-primary) !important;
  margin-bottom: 0.7rem !important;
  border-bottom: 1px solid var(--ln-border) !important;
  padding-bottom: 0.4rem !important;
}

/* ============================================================
   LISTS
   ============================================================ */
ul, ol {
  margin: 0.8em 0 !important;
  padding-left: 1.6em !important;
}

li {
  margin: 0.3em 0 !important;
  line-height: var(--ln-line-height) !important;
}

li > p { margin-bottom: 0.4em !important; }

.dlist dt { font-weight: 700 !important; color: var(--ln-text) !important; margin-top: 0.8em !important; }
.dlist dd { margin-left: 1.3em !important; margin-bottom: 0.4em !important; }

/* ============================================================
   SECTIONS & SEPARATORS
   ============================================================ */
hr {
  border: none !important;
  border-top: 1px solid var(--ln-border) !important;
  margin: 2.5rem 0 !important;
}

#preamble .sectionbody {
  font-size: 1.02rem !important;
  line-height: 2 !important;
}

/* Scroll performance: contain layout paint for large DOM (14K+ elements) */
.sect1 {
  padding-top: 0.5rem;
  contain: layout style;
}
.sect1 + .sect1 { border-top: 1px solid var(--ln-border-light); margin-top: 2.5rem; }

.imageblock {
  content-visibility: auto;
  contain-intrinsic-size: auto 300px;
}

/* --- Footer --- */
#footer {
  margin-top: 3rem !important;
  padding: 1.5rem 2rem !important;
  text-align: center !important;
  font-size: 0.82rem !important;
  color: var(--ln-text-light) !important;
  border-top: 1px solid var(--ln-border) !important;
}

/* --- Math --- */
.stemblock, .math { overflow-x: auto !important; margin: 1.3em 0 !important; }

/* --- Selection --- */
::selection { background: rgba(247, 147, 26, 0.2); color: inherit; }

/* ============================================================
   FIXED UI: Chapter Nav, Buttons
   ============================================================ */

/* Chapter nav bar at bottom */
#chapter-nav {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: var(--ln-nav-height);
  padding: 0 1.5rem;
  background: var(--ln-bg);
  border-top: 1px solid var(--ln-border);
  z-index: 999;
  font-size: 0.82rem;
  box-shadow: 0 -1px 4px rgba(0,0,0,0.04);
}

#chapter-nav a {
  color: var(--ln-secondary) !important;
  padding: 0.5rem 0.8rem;
  min-height: 44px;
  display: flex;
  align-items: center;
  border-radius: 4px;
  text-decoration: none !important;
  max-width: 45%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#chapter-nav a:hover {
  background: var(--ln-bg-alt);
  text-decoration: none !important;
}

/* Desktop: chapter nav shifts for TOC */
@media screen and (min-width: 768px) {
  body.book.toc2 #chapter-nav {
    left: var(--ln-toc-width);
  }
}

/* Floating action buttons - positioned above chapter nav */
#back-to-top,
#search-toggle,
#toc-toggle {
  position: fixed;
  z-index: 9999;
  border-radius: 50%;
  cursor: pointer;
  box-shadow: var(--ln-shadow);
  transition: all 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

#back-to-top {
  display: none;
  bottom: calc(var(--ln-nav-height) + 1rem);
  right: 1.2rem;
  width: 42px;
  height: 42px;
  background: var(--ln-bg-alt);
  color: var(--ln-text-light);
  border: 1px solid var(--ln-border);
  font-size: 1.1rem;
}
#back-to-top:hover { background: var(--ln-primary); color: #fff; border-color: var(--ln-primary); }
#back-to-top.visible { display: flex; }

#search-toggle {
  bottom: calc(var(--ln-nav-height) + 1rem);
  right: 4.2rem;
  width: 42px;
  height: 42px;
  background: var(--ln-bg-alt);
  color: var(--ln-text-light);
  border: 1px solid var(--ln-border);
  font-size: 1rem;
}
#search-toggle:hover { background: var(--ln-secondary); color: #fff; border-color: var(--ln-secondary); }

#toc-toggle {
  display: none;
  bottom: calc(var(--ln-nav-height) + 1rem);
  left: 1.2rem;
  width: 44px;
  height: 44px;
  background: var(--ln-primary);
  color: #fff;
  border: none;
  font-size: 1.2rem;
  z-index: 10001;
  box-shadow: var(--ln-shadow-lg);
}
#toc-toggle:hover { background: var(--ln-primary-dark); }

/* ============================================================
   SEARCH MODAL
   ============================================================ */
#search-modal {
  display: none;
  position: fixed;
  top: 0; left: 0; width: 100%; height: 100%;
  z-index: 20000;
}

#search-modal.open {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding-top: 12vh;
}

#search-modal-backdrop {
  position: fixed;
  top: 0; left: 0; width: 100%; height: 100%;
  background: rgba(0,0,0,0.45);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}

#search-modal-content {
  position: relative;
  width: 90%;
  max-width: 600px;
  max-height: 65vh;
  background: var(--ln-bg);
  border-radius: var(--ln-radius);
  box-shadow: var(--ln-shadow-lg);
  overflow: hidden;
  z-index: 1;
}

#search-close {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  width: 36px;
  height: 36px;
  border: none;
  background: transparent;
  color: var(--ln-text-light);
  font-size: 1.5rem;
  cursor: pointer;
  z-index: 2;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  transition: background 0.15s;
}

#search-close:hover {
  background: var(--ln-bg-alt);
  color: var(--ln-text);
}

/* Pagefind UI overrides */
.pagefind-ui {
  --pagefind-ui-primary: var(--ln-primary) !important;
  --pagefind-ui-text: var(--ln-text) !important;
  --pagefind-ui-background: var(--ln-bg) !important;
  --pagefind-ui-border: var(--ln-border) !important;
  --pagefind-ui-border-width: 1px !important;
  --pagefind-ui-border-radius: 6px !important;
  --pagefind-ui-font: var(--ln-font-sans) !important;
}

.pagefind-ui .pagefind-ui__search-input {
  font-size: 1.05rem !important;
  padding: 0.7rem 1rem !important;
}

.pagefind-ui .pagefind-ui__results-area {
  max-height: 45vh;
  overflow-y: auto;
  padding: 0 1rem 1rem !important;
}

/* ============================================================
   MOBILE: max-width 767px
   Override Asciidoctor which only applies toc2 at min-width:768px
   Below 768px, Asciidoctor shows TOC as inline block at top.
   We hide it and use our toggle button instead.
   ============================================================ */
@media screen and (max-width: 767px) {
  body.book {
    font-size: 16px !important;
    padding-bottom: var(--ln-nav-height) !important;
  }

  body.book.toc2 {
    padding-left: 0 !important;
  }

  /* Show TOC toggle */
  #toc-toggle { display: flex !important; }

  /* Hide TOC by default, slide in from left */
  #toc.toc2,
  #toc {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 82vw !important;
    max-width: 300px !important;
    height: 100vh !important;
    height: 100dvh !important;
    overflow-y: auto !important;
    background-color: var(--ln-bg-alt) !important;
    border-right: 1px solid var(--ln-border) !important;
    padding: 1.2rem 0 2rem 0 !important;
    z-index: 10000 !important;
    transform: translateX(-100%) !important;
    transition: transform 0.3s ease !important;
    box-shadow: var(--ln-shadow-lg) !important;
    margin-top: 0 !important;
    border-bottom: none !important;
  }

  #toc.toc2.toc-open,
  #toc.toc-open {
    transform: translateX(0) !important;
  }

  /* Overlay */
  #toc-overlay {
    display: none;
    position: fixed;
    top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0,0,0,0.6);
    z-index: 9999;
    opacity: 0;
    transition: opacity 0.3s;
  }
  #toc-overlay.visible { display: block; opacity: 1; }

  /* Hide content behind overlay — prevents iOS Safari stacking bleed-through */
  body.toc-is-open #header,
  body.toc-is-open #content,
  body.toc-is-open #footnotes,
  body.toc-is-open #footer {
    visibility: hidden !important;
  }
  /* TOC lives inside #header in Asciidoctor — keep it visible */
  body.toc-is-open #toc {
    visibility: visible !important;
  }

  /* Content full width */
  #content {
    max-width: 100% !important;
    margin: 0 !important;
    padding: 1rem 1.1rem 2rem !important;
  }

  /* Headings */
  h1 { font-size: 1.5rem !important; margin-top: 2rem !important; }
  h2 { font-size: 1.3rem !important; margin-top: 1.8rem !important; }
  h3 { font-size: 1.12rem !important; margin-top: 1.4rem !important; }

  /* Code: readable, scrollable */
  pre {
    font-size: 0.85rem !important;
    padding: 0.9rem !important;
    border-radius: 6px !important;
  }

  /* Tables: horizontal scroll */
  table.tableblock {
    display: block !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    font-size: 0.83rem !important;
  }

  /* Admonitions compact */
  .admonitionblock > table td.icon { width: 34px !important; padding: 0.7rem 0.3rem 0.7rem 0.6rem !important; }
  .admonitionblock > table td.content { padding: 0.7rem 0.7rem !important; font-size: 0.88rem !important; }

  .sidebarblock { padding: 0.9rem !important; }
  .sect1 + .sect1 { margin-top: 1.8rem; }

  /* Search fullscreen on mobile */
  #search-modal.open { padding-top: 0; align-items: stretch; }
  #search-modal-content { width: 100%; max-width: 100%; max-height: 100vh; border-radius: 0; }

  /* Chapter nav */
  #chapter-nav { padding: 0 0.8rem; font-size: 0.78rem; }

  /* Floating buttons - min 44px touch target */
  #back-to-top { right: 0.8rem; width: 44px; height: 44px; font-size: 0.95rem; }
  #search-toggle { right: 3.8rem; width: 44px; height: 44px; font-size: 0.9rem; }
  #toc-toggle { left: 0.8rem; width: 44px; height: 44px; font-size: 1.1rem; }
}

/* ============================================================
   SMALL MOBILE: max-width 480px
   ============================================================ */
@media (max-width: 480px) {
  body.book { font-size: 15px !important; }
  #content { padding: 0.7rem 0.9rem 2rem !important; }
  h1 { font-size: 1.35rem !important; }
  h2 { font-size: 1.15rem !important; }
  pre { font-size: 0.8rem !important; padding: 0.7rem !important; }
}

/* ============================================================
   PRINT
   ============================================================ */
@media print {
  body.book.toc2 { padding-left: 0 !important; }
  #toc.toc2 { position: relative !important; width: 100% !important; height: auto !important; border: none !important; overflow: visible !important; }
  #content { max-width: 100% !important; margin: 0 !important; }
  #reading-progress, #back-to-top, #toc-toggle, #toc-overlay, #search-toggle, #search-modal, #chapter-nav { display: none !important; }
  body.book { font-size: 11pt !important; color: #000 !important; background: #fff !important; }
  h1, h2, h3 { page-break-after: avoid !important; color: #000 !important; }
  pre, blockquote, .admonitionblock, .imageblock { page-break-inside: avoid !important; }
  a { color: #000 !important; text-decoration: underline !important; }
}

/* ============================================================
   DARK MODE — MUST BE LAST to override all light mode !important rules
   ============================================================ */
@media (prefers-color-scheme: dark) {
  :root {
    --ln-text: #e2e8f0;
    --ln-text-light: #a0aec0;
    --ln-bg: #1a202c;
    --ln-bg-alt: #2d3748;
    --ln-bg-warm: #1e2533;
    --ln-border: #4a5568;
    --ln-border-light: #2d3748;
    --ln-code-bg: #2d3748;
    --ln-shadow: 0 1px 3px rgba(0,0,0,0.3);
    --ln-shadow-lg: 0 4px 16px rgba(0,0,0,0.4);
  }

  /* --- Global text & background --- */
  body.book {
    background-color: #1a202c !important;
    color: #e2e8f0 !important;
  }

  body.book p,
  body.book td,
  body.book th,
  body.book li,
  body.book dt,
  body.book dd,
  body.book span,
  body.book div,
  body.book label,
  body.book figcaption,
  .admonitionblock td.content,
  .admonitionblock td.content p,
  .sidebarblock,
  .sidebarblock p,
  .quoteblock blockquote,
  .quoteblock blockquote p,
  .dlist dd,
  .dlist dt {
    color: #e2e8f0 !important;
  }

  /* --- Headings --- */
  h1, h2, h3, h4, h5, h6,
  .sidebarblock > .content > .title {
    color: #e2e8f0 !important;
  }

  .sect0 > h1, h1.sect0 {
    color: var(--ln-primary) !important;
  }

  /* --- Links --- */
  a, a:visited {
    color: #63b3ed !important;
  }
  a:hover, a:focus {
    color: #90cdf4 !important;
  }

  /* --- Tables --- */
  /* Nuclear option: force ALL text inside any table to be light */
  table, table *, table.tableblock, table.tableblock * {
    color: #cbd5e0 !important;
  }

  table thead, table tfoot,
  table.tableblock thead {
    background: #2d3748 !important;
  }

  table thead *, table.tableblock thead * {
    color: #e2e8f0 !important;
    font-weight: 700 !important;
  }

  table tr, table.tableblock tr {
    border-color: #4a5568 !important;
  }

  table tr.even, table tr.alt,
  table.tableblock tbody tr:nth-child(even) {
    background: #ffffff08 !important;
  }

  table.tableblock tbody tr:nth-child(odd) {
    background: transparent !important;
  }

  table.tableblock tbody tr:hover {
    background: #ffffff10 !important;
  }

  table td, table th,
  table.tableblock td, table.tableblock th,
  td.tableblock, th.tableblock {
    border-color: #4a5568 !important;
  }

  /* Table title */
  table.tableblock > caption,
  table.tableblock > caption.title,
  table.tableblock > .title,
  .tableblock > .title,
  caption.title {
    color: #a0aec0 !important;
    font-style: italic !important;
  }

  /* Admonition text */
  .admonitionblock > table td.content,
  .admonitionblock > table td.content *,
  .admonitionblock > table td.icon .title {
    color: #e2e8f0 !important;
  }

  /* --- Code --- */
  pre, pre code {
    background-color: #2d3748 !important;
    color: #e2e8f0 !important;
    border-color: #4a5568 !important;
  }

  code {
    color: #f08d8d !important;
    background-color: #2d3748 !important;
    border-color: #4a5568 !important;
  }

  /* --- Admonition blocks (MUST override light mode backgrounds) --- */
  .admonitionblock.tip > table {
    background: #0d3326 !important;
    border-left: 4px solid #10b981 !important;
  }
  .admonitionblock.note > table {
    background: #1a2f4a !important;
    border-left: 4px solid #4a90d9 !important;
  }
  .admonitionblock.warning > table {
    background: #3d2e0a !important;
    border-left: 4px solid #f59e0b !important;
  }
  .admonitionblock.caution > table {
    background: #3d1515 !important;
    border-left: 4px solid #ef4444 !important;
  }
  .admonitionblock.important > table {
    background: #2d1a4e !important;
    border-left: 4px solid #8b5cf6 !important;
  }

  .admonitionblock td.content,
  .admonitionblock td.content p,
  .admonitionblock td.content .title {
    color: #e2e8f0 !important;
  }

  /* --- Sidebar --- */
  .sidebarblock {
    background: #2d3748 !important;
    border-color: #4a5568 !important;
  }

  .sidebarblock > .content > .title {
    color: var(--ln-primary) !important;
    border-bottom-color: #4a5568 !important;
  }

  /* --- Blockquotes --- */
  blockquote, .quoteblock {
    background-color: #1e2533 !important;
  }

  /* --- Images --- */
  .imageblock img {
    box-shadow: 0 2px 8px rgba(0,0,0,0.4) !important;
  }

  /* Override: .subheader,...>.title { color:#7a2518 } (Asciidoctor red) */
  .subheader,
  .admonitionblock td.content > .title,
  .audioblock > .title,
  .exampleblock > .title,
  .imageblock > .title,
  .listingblock > .title,
  .literalblock > .title,
  .stemblock > .title,
  .openblock > .title,
  .paragraph > .title,
  .quoteblock > .title,
  table.tableblock > .title,
  .verseblock > .title,
  .videoblock > .title,
  .dlist > .title,
  .olist > .title,
  .ulist > .title,
  .qlist > .title,
  .hdlist > .title {
    color: #a0aec0 !important;
  }

  /* --- TOC --- */
  #toc.toc2 {
    background-color: #2d3748 !important;
    border-right-color: #4a5568 !important;
  }

  #toc.toc2 a {
    color: #a0aec0 !important;
  }

  #toc.toc2 a:hover,
  #toc.toc2 a.toc-active {
    color: var(--ln-primary) !important;
    background-color: #1e253388 !important;
  }

  #toctitle {
    color: var(--ln-primary) !important;
    border-bottom-color: var(--ln-primary) !important;
  }

  /* --- Footer --- */
  #footer, #footer-text {
    border-top-color: #4a5568 !important;
    color: #a0aec0 !important;
  }

  #footer a { color: #63b3ed !important; }

  /* --- Bottom nav & buttons --- */
  #chapter-nav {
    background: #1a202c !important;
    border-top-color: #4a5568 !important;
  }

  #back-to-top,
  #search-toggle {
    background: #2d3748 !important;
    border-color: #4a5568 !important;
    color: #a0aec0 !important;
  }

  #search-modal-content {
    background: #1a202c !important;
  }

  /* --- Callouts --- */
  .conum[data-value] {
    background: #63b3ed !important;
  }

  /* --- Misc --- */
  ::selection {
    background: rgba(247, 147, 26, 0.35);
  }

  hr { border-top-color: #4a5568 !important; }
  .sect1 + .sect1 { border-top-color: #4a5568 !important; }
}