/* Shared editorial layer, loaded after both the Markdown and book themes. */
:root, :root[data-theme="light"] {
  color-scheme: light;
  --bg: #fafbf9; --surface: #ffffff; --surface2: #f0f2ef; --surface-elevated: #ffffff;
  --text: #242b28; --text-dim: #69716c; --border: #e0e5df; --border-bright: #bac5bc;
  --blue: #28775a; --blue-dim: #eaf3ed; --amber: #ad593e; --amber-dim: #f8eee8;
  --sage: #65752f; --sage-dim: #f0f3e5; --rose: #995674; --rose-dim: #f6edf1;
  --steel: #6473a4; --steel-dim: #edf0f8;
  --teal: var(--blue); --teal-dim: var(--blue-dim);
  --copper: var(--amber); --copper-dim: var(--amber-dim);
  --olive: var(--sage); --olive-dim: var(--sage-dim);
  --plum: var(--rose); --plum-dim: var(--rose-dim);
  --accent: var(--blue); --accent-dim: var(--blue-dim);
  --font-body: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'Fira Code', 'SFMono-Regular', Consolas, monospace;
  --font-display: Georgia, 'Times New Roman', serif;
  --reading-size: 18px; --topbar-h: 72px;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #191c1b; --surface: #202422; --surface2: #292e2b; --surface-elevated: #303632;
  --text: #e5e9e3; --text-dim: #a7b0a8; --border: #363d37; --border-bright: #5c685e;
  --blue: #91c8a5; --blue-dim: #253d2f; --amber: #e4a487; --amber-dim: #402e27;
  --sage: #bbc987; --sage-dim: #323a26; --rose: #d6a2bd; --rose-dim: #3d2c35;
  --steel: #a7b7e6; --steel-dim: #2b3347;
}
*, *::before, *::after { box-sizing: border-box; letter-spacing: 0 !important; }
body { background: var(--bg); color: var(--text); font-family: var(--font-body); font-size: 16px; line-height: 1.7; overflow-wrap: anywhere; }
a { color: var(--accent); }
button, input { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: default; opacity: .5; }
button, a, input { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
::selection { background: var(--blue-dim); color: var(--text); }
[hidden] { display: none !important; }
.lucide { width: 19px; height: 19px; stroke-width: 1.65; flex-shrink: 0; vertical-align: middle; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
.skip-link { position: fixed; top: -70px; left: 20px; z-index: 1000; background: var(--surface); padding: 10px 18px; }
.skip-link:focus { top: 10px; }
.reading-progress { position: fixed; top: 0; left: 0; height: 3px; width: var(--progress, 0%); background: var(--accent); z-index: 500; pointer-events: none; }
.topbar { height: var(--topbar-h); background: var(--bg); backdrop-filter: none; -webkit-backdrop-filter: none; border-bottom: 1px solid var(--border); }
.topbar__in { max-width: 1500px; padding: 0 48px; gap: 36px; }
.topbar__brand { font-size: 15px; font-weight: 700; gap: 12px; }
.topbar__brand::before { display: none; }
.brand-mark { display: inline-flex; align-items: baseline; justify-content: center; width: 37px; height: 37px; border-radius: 7px; background: #263d31; color: #fff; font-family: Georgia, serif; font-size: 25px; line-height: 34px; font-weight: 400; }
.brand-mark span { color: #afd1ab; }
.topbar__nav { gap: 6px; margin-left: auto; }
.topbar__l { font-family: var(--font-body); font-size: 13px; font-weight: 500; text-transform: none; padding: 8px 12px; border-radius: 5px; white-space: nowrap; }
.topbar__l.is-active { color: var(--text); background: var(--surface2); }
.topbar__tools { display: flex; gap: 10px; align-items: center; }
.icon-button { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; padding: 0; border: 1px solid transparent; border-radius: 5px; background: transparent; color: var(--text-dim); flex-shrink: 0; }
.icon-button:hover, .icon-button[aria-pressed="true"] { background: var(--accent-dim); color: var(--accent); }
.search-trigger { display: inline-flex; align-items: center; gap: 10px; color: var(--text-dim); background: var(--surface); border: 1px solid var(--border); border-radius: 6px; padding: 7px 13px; font-size: 12px; min-height: 36px; }
.search-trigger .lucide { width: 16px; height: 16px; }
.shell { max-width: 1500px; grid-template-columns: 225px minmax(0, 1fr) 188px; gap: 42px; padding: 38px 48px 90px; }
.main { max-width: 790px; min-width: 0; width: 100%; }
.library-shell { grid-template-columns: 194px minmax(0, 1fr); gap: 64px; padding-top: 48px; }
.library-shell .main { grid-column: 2; max-width: 1080px; margin: 0; }
.library-nav { align-self: start; position: sticky; top: 112px; display: flex; flex-direction: column; font-size: 12px; }
.library-nav__label { font-size: 10px; text-transform: uppercase; color: var(--text-dim); margin: 0 10px 14px; font-family: var(--font-mono); }
.library-nav__label:not(:first-child) { margin-top: 38px; }
.library-nav > a { display: flex; align-items: center; gap: 11px; padding: 9px 10px; text-decoration: none; color: var(--text-dim); border-radius: 5px; }
.library-nav > a:hover { color: var(--text); background: var(--surface2); }
.library-nav > a[aria-current] { background: var(--blue-dim); color: var(--blue); font-weight: 600; }
.library-nav .lucide { width: 16px; height: 16px; }
.library-nav > .library-nav__source { border-top: 1px solid var(--border); margin-top: 35px; border-radius: 0; padding-top: 20px; }
.library-nav__source .lucide:last-child { margin-left: auto; width: 13px; }
.nav-dot { width: 7px; height: 7px; background: var(--blue); border-radius: 2px; margin: 0 4px; flex-shrink: 0; }
.nav-dot--libraries { background: var(--amber); }.nav-dot--ml { background: var(--steel); }.nav-dot--deep-learning { background: var(--rose); }.nav-dot--nlp { background: var(--sage); }
.nav-count { margin-left: auto; color: var(--text-dim); font-size: 10px; }
.hd { margin-bottom: 32px; }
.hd__k { font-family: var(--font-mono); font-size: 10px; font-weight: 400; text-transform: uppercase; margin-bottom: 18px; color: var(--accent); }
.hd__k::before { display: none; }
.hd h1 { font-family: var(--font-display); font-weight: 400; font-size: 42px; line-height: 1.16; text-wrap: pretty; }
.hd--hero h1 { font-size: 48px; }
.lede { font-size: 17px; max-width: 580px; line-height: 1.75; margin-top: 20px; color: var(--text-dim); }
.library-stats { display: flex; flex-wrap: wrap; gap: 28px; margin-top: 25px; color: var(--text-dim); font-size: 12px; }
.library-stats strong { color: var(--text); font-weight: 600; margin-right: 4px; }
.lp__sec { margin-top: 48px; }
.lp__h { font-family: var(--font-body); font-weight: 600; font-size: 16px; text-transform: none; color: var(--text); padding-bottom: 15px; margin-bottom: 22px; }
.cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.card { position: relative; box-shadow: none; border-radius: 8px; padding: 0; transform: none; min-width: 0; }
.card:hover { transform: none; box-shadow: 0 5px 20px #18241a08; border-color: var(--border-bright); }
.course-cover { overflow: hidden; aspect-ratio: 1000 / 480; border-radius: 7px 7px 0 0; border-bottom: 1px solid var(--border); background: var(--surface2); }
.course-cover img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.course-card:hover img { transform: scale(1.025); }
.card__content { padding: 22px 25px 24px; }
.card__k { font-size: 9px; font-weight: 500; text-transform: uppercase; }
.card__t { font-family: var(--font-display); font-weight: 400; font-size: 25px; line-height: 1.23; margin: 10px 0 12px; padding-right: 14px; }
.card__b { font-size: 13px; line-height: 1.8; color: var(--text-dim); }
.card__meta { font-family: var(--font-body); font-size: 11px; margin-top: 20px; padding-top: 15px; }
.card__arrow { position: absolute; right: 19px; bottom: 21px; color: var(--text-dim); width: 16px; height: 16px; }
.cards:has(.category-row) { grid-template-columns: 1fr; gap: 0; }
.category-row { display: flex; align-items: center; gap: 22px; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; background: none; padding: 22px 2px; }
.category-row:hover { background: var(--surface2); box-shadow: none; }
.category-row .card__content { padding: 0 42px 0 0; flex: 1; }
.category-row .card__k { display: none; }
.category-row .card__t { font-family: var(--font-body); font-weight: 600; font-size: 16px; margin: 0 0 5px; }
.category-row .card__b { max-width: 720px; font-size: 12px; }
.category-row .card__meta { border: 0; padding: 0; margin: 8px 0 0; color: var(--accent); font-size: 10px; }
.category-row .card__arrow { top: 28px; right: 8px; }
.category-symbol { width: 46px; height: 46px; display: flex; align-items: center; justify-content: center; border-radius: 7px; flex-shrink: 0; color: var(--blue); background: var(--blue-dim); }
.category-symbol--libraries { color: var(--amber); background: var(--amber-dim); }.category-symbol--ml { color: var(--steel); background: var(--steel-dim); }.category-symbol--deep-learning { color: var(--rose); background: var(--rose-dim); }.category-symbol--nlp { color: var(--sage); background: var(--sage-dim); }
.lp__p { font-size: 14px; line-height: 1.8; }
.lp__p a { display: inline-flex; gap: 5px; align-items: center; }
.lp__p .lucide { width: 14px; height: 14px; }
.site-footer { max-width: 1404px; margin: 0 auto; padding: 25px 0 32px; border-top: 1px solid var(--border); display: flex; align-items: center; gap: 32px; color: var(--text-dim); font-size: 11px; }
.site-footer a { display: inline-flex; align-items: center; gap: 8px; color: var(--text); text-decoration: none; }
.site-footer a:first-child { font-weight: 600; font-size: 13px; gap: 0; }.footer-dot { color: var(--blue); }
.site-footer a:last-child { margin-left: auto; }.site-footer .lucide { width: 14px; }
.nav, .toc { top: calc(var(--topbar-h) + 30px); max-height: calc(100dvh - var(--topbar-h) - 55px); scrollbar-width: thin; scrollbar-color: var(--border) transparent; }
.nav { padding-right: 14px; font-size: 12px; }
.nav__heading { display: flex; align-items: center; justify-content: space-between; }
.nav__brand { margin-bottom: 23px; }
.nav__brand-k { font-size: 9px; color: var(--text-dim); font-weight: 400; text-transform: uppercase; }
.nav__brand-k::before { display: none; }
.nav__brand-t { display: block; font-family: var(--font-display); font-size: 21px; font-weight: 400; line-height: 1.3; margin-top: 10px; }
.nav__grp { font-family: var(--font-body); font-size: 11px; font-weight: 600; text-transform: none; margin: 25px 0 8px; border: 0; color: var(--text); }
.nav__grp a { color: inherit; text-decoration: none; }.nav__grp span { float: right; color: var(--text-dim); }
.nav a.nav__i { padding: 7px 8px; gap: 9px; font-size: 11px; line-height: 1.6; border-radius: 0 5px 5px 0; border-left-width: 2px; margin-bottom: 1px; }
.nav a.nav__i.is-current { color: var(--accent); background: var(--accent-dim); font-weight: 500; }
.nav__n { font-size: 9px; padding-top: 2px; }
.nav__back { display: flex; gap: 8px; align-items: center; font-size: 11px; text-decoration: none; color: var(--text-dim); }.nav__back .lucide { width: 13px; }
.toc { padding-left: 18px; border-left: 1px solid var(--border); margin-top: 12px; }
.toc__h { font-family: var(--font-body); font-size: 11px; font-weight: 600; color: var(--text); text-transform: none; border: 0; margin-bottom: 12px; }
.toc a { font-size: 11px; padding: 5px 0 5px 9px; margin-left: -10px; border-radius: 0; line-height: 1.65; }
.toc a.active { background: none; color: var(--accent); }
.toc__end { border-top: 1px solid var(--border); margin-top: 22px; padding-top: 14px; }.toc__end a { display: flex; align-items: center; gap: 8px; }.toc__end .lucide { width: 12px; }
.reader-tools { display: flex; justify-content: space-between; align-items: center; gap: 10px; border-bottom: 1px solid var(--border); margin: 0 0 34px; padding-bottom: 12px; }
.reading-meta { display: inline-flex; align-items: center; gap: 10px; font-size: 10px; color: var(--text-dim); }
.meta-dot { width: 3px; height: 3px; border-radius: 50%; background: var(--border-bright); }.reader-actions { display: flex; gap: 4px; }
.reader-actions .icon-button { width: 30px; height: 30px; }.reader-actions .lucide { width: 16px; height: 16px; }
.is-reading .hd { padding-bottom: 26px; margin-bottom: 28px; border-bottom: 1px solid var(--border); }
.is-reading .main { font-size: var(--reading-size); line-height: 1.9; }
.is-reading .main > p { margin-bottom: 22px; }
.chapter-outline { margin: 28px 0; border-block: 1px solid var(--border); padding: 15px 0; font-size: 14px; }
.chapter-outline summary { cursor: pointer; font-weight: 600; color: var(--text); }
.chapter-outline ol { margin: 16px 0 0; padding-left: 25px; line-height: 1.7; }
.chapter-outline li { padding: 4px 0; }
.chapter-outline a { text-decoration: none; }
.chapter-outline a:hover { text-decoration: underline; }
.sec { animation: none; scroll-margin-top: 106px; margin-bottom: 28px; }
.sec__body { font-size: inherit; line-height: inherit; }
.sec__body p { margin-bottom: 22px; }
.sec__body h2, .sec__t { font-family: var(--font-display); font-weight: 400; font-size: 28px; line-height: 1.35; text-wrap: pretty; }
.sec__body h2 { margin: 52px 0 22px; padding-top: 10px; scroll-margin-top: 100px; }
.sec__h { align-items: baseline; gap: 14px; margin: 48px 0 22px; padding-bottom: 12px; border-bottom: 1px solid var(--border); }
.sec__n { font-size: 10px; color: var(--text-dim); font-weight: 400; }
.sec__body h3 { font-size: 19px; font-weight: 600; margin: 32px 0 15px; line-height: 1.5; }
.sec__body h4 { font-size: 16px; font-weight: 600; color: var(--text); }
.sec__body li { margin-bottom: 10px; padding-left: 22px; }.sec__body ul > li::before { top: .82em; width: 4px; height: 4px; opacity: .7; }
.sec__body ol > li::before { font-size: 12px; top: 3px; }
.sec__body a { border-bottom-color: var(--border-bright); text-underline-offset: 4px; }
.sec__body strong { font-weight: 600; }
.sec--takeaways .sec__body, .sec--selfcheck .sec__body, .sec--reconcile .sec__body { border: 0; border-left: 2px solid var(--accent); border-radius: 0; padding: 18px 24px 1px; background: var(--accent-dim); box-shadow: none; }
.sec--selfcheck .sec__body { border-left-color: var(--amber); background: var(--amber-dim); }
.sec--reconcile .sec__body { border-left-color: var(--steel); background: var(--surface2); }
.prereq, .callout { border: 0; border-left: 2px solid var(--accent); border-radius: 0; box-shadow: none; background: var(--surface2); padding: 17px 21px; font-size: 14px; line-height: 1.85; }
.prereq { margin-top: 25px; }.prereq p { margin-bottom: 0; }
.callout--warn, .callout--warning { border-color: var(--amber); background: var(--amber-dim); }
.callout--unverified { border-color: var(--rose); background: var(--rose-dim); }
code { font-size: .79em; color: var(--accent); background: var(--accent-dim); padding: 2px 5px; border-radius: 3px; }
.code-file { border-radius: 6px; background: var(--surface2); border-color: var(--border); box-shadow: none; margin: 24px 0; position: relative; }
.code-file__hd { padding: 10px 16px; color: var(--text-dim); font-size: 10px; font-weight: 400; background: transparent; }
pre.code-block, pre { font-family: var(--font-mono); font-size: 12px; line-height: 1.9; max-width: 100%; overflow-x: auto; tab-size: 4; }
pre.code-block { padding: 20px; }pre code { overflow-wrap: normal; word-break: normal; }
.code-copy { position: absolute; top: 4px; right: 6px; width: 30px; height: 30px; background: var(--surface2); }.code-copy .lucide { width: 14px; height: 14px; }
.code-file__hd { min-height: 40px; padding-right: 82px; }
.code-download { position: absolute; top: 4px; right: 42px; width: 30px; height: 30px; text-decoration: none; }
.code-download .lucide { width: 14px; height: 14px; }
.sec__body a.code-download { border-bottom-color: transparent; }
@media print { .code-download { display: none !important; } }
.copy-host { position: relative; }.copy-host:not(.code-file) { padding-top: 32px; }.copy-host:not(.code-file) .code-copy { top: 0; }
.table-wrap { border-radius: 6px; box-shadow: none; margin: 26px 0; }
table.dt { font-size: 13px; line-height: 1.8; }table.dt th { font-family: var(--font-body); font-size: 11px; text-transform: none; color: var(--text); white-space: normal; font-weight: 600; padding: 13px 16px; border-bottom: 1px solid var(--border); }
table.dt td { padding: 13px 16px; }table.dt tbody tr:nth-child(even) { background: transparent; }table.dt tbody tr:hover { background: var(--surface2); }
table.dt th, table.dt td { min-width: 8rem; overflow-wrap: break-word; word-break: normal; }
.math-display { padding: 14px 0; margin: 22px 0; }
/* Keep KaTeX's absolutely positioned accessibility tree inside scrollable tables. */
.katex { font-size: 1.05em; position: relative; }
.math-inline { display: inline-block; max-width: 100%; overflow-x: auto; overflow-y: hidden; vertical-align: middle; }
.diagram-shell { margin: 30px 0; }.diagram-shell__hint { font-size: 9px; margin-bottom: 9px; }
.mermaid-wrap { border-radius: 6px; background: var(--surface); padding: 38px 16px 16px; }
.zoom-controls { border-radius: 4px; box-shadow: none; }.zoom-label { font-size: 9px; }
.zoom-controls button { width: 30px; height: 30px; }.zoom-controls .lucide { width: 14px; height: 14px; }
.widget { border-radius: 6px; padding: 22px; }.widget__stage,.widget__eq,.widget__bar,.widget__readout { border-radius: 5px; box-shadow: none; }.widget__t { font-family: var(--font-body); }
.pager { border-top: 1px solid var(--border); margin-top: 54px; padding-top: 24px; gap: 22px; }
.pager a { background: transparent; padding: 14px 0; border: 0; border-radius: 0; box-shadow: none; }.pager a:hover { transform: none; box-shadow: none; color: var(--accent); }
.pager__k { font-size: 10px; font-family: var(--font-body); text-transform: none; }.pager__t { font-family: var(--font-display); font-size: 20px; font-weight: 400; line-height: 1.4; margin-top: 8px; }
.foot { font-size: 11px; margin-top: 32px; line-height: 1.8; }
.crumb { font-family: var(--font-body); font-size: 11px; text-transform: none; }
.tally { background: none; border: 0; border-radius: 0; padding: 0; font-size: 13px; font-family: var(--font-body); }
.prog__track { height: 4px; }.prog__n { font-family: var(--font-body); font-size: 11px; }
.chks { gap: 0; }.chk { border: 0; border-bottom: 1px solid var(--border); border-radius: 0; background: none; padding: 22px 0; gap: 17px; }.chk__t { font-size: 15px; font-weight: 500; }.chk__d { font-size: 13px; margin-top: 8px; line-height: 1.85; max-width: 78ch; }.chk__s { font-family: var(--font-body); font-size: 10px; font-weight: 500; text-transform: none; border-radius: 4px; }.chk--planned { opacity: 1; }
dialog { background: var(--surface); color: var(--text); border: 1px solid var(--border); border-radius: 8px; margin: 12vh auto auto; padding: 0; box-shadow: 0 25px 100px #0003; max-height: 76dvh; }
dialog::backdrop { background: #15201bb3; backdrop-filter: blur(3px); }
.dialog-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 20px 24px 14px; }.dialog-heading h2 { font-family: var(--font-display); font-size: 23px; font-weight: 400; line-height: 1.3; }
.search-dialog { width: min(680px, calc(100% - 32px)); }.search-field { margin: 2px 24px 17px; border: 1px solid var(--border-bright); border-radius: 5px; display: flex; align-items: center; gap: 12px; padding: 12px 14px; }.search-field:focus-within { border-color: var(--accent); }.search-field > .lucide { color: var(--accent); }.search-field input { width: 100%; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--text); font-size: 15px; }
.search-filters { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 24px 16px; border-bottom: 1px solid var(--border); }
.search-filters button { display: inline-flex; align-items: center; gap: 5px; border: 0; padding: 5px 10px; border-radius: 4px; font-size: 12px; background: var(--surface2); color: var(--text-dim); }.search-filters button[aria-pressed="true"] { background: var(--accent-dim); color: var(--accent); }.search-filters .lucide { width: 12px; height: 12px; }
.search-status { padding: 14px 24px 8px; font-size: 11px; color: var(--text-dim); min-height: 32px; }.search-results { overflow-y: auto; max-height: 43dvh; padding: 0 12px 14px; }
.search-result { display: block; padding: 14px 12px; border-bottom: 1px solid var(--border); color: var(--text); text-decoration: none; border-radius: 4px; }.search-result:hover,.search-result:focus { background: var(--surface2); }.search-result__category { display: block; color: var(--accent); font-size: 10px; margin-bottom: 5px; }.search-result__title { display: block; font-size: 15px; font-weight: 500; line-height: 1.45; }.search-result__description { display: block; font-size: 12px; line-height: 1.7; color: var(--text-dim); margin-top: 5px; }
.settings-dialog { width: min(380px, calc(100% - 32px)); padding-bottom: 20px; }.setting { display: flex; align-items: center; justify-content: space-between; margin: 18px 24px; gap: 18px; font-size: 13px; }.setting output { color: var(--text-dim); font-size: 11px; }.segmented { display: flex; border: 1px solid var(--border); border-radius: 5px; padding: 3px; gap: 3px; }.segmented button { display: flex; align-items: center; justify-content: center; width: 35px; height: 30px; border: 0; border-radius: 3px; color: var(--text-dim); background: transparent; }.segmented button[aria-pressed="true"] { background: var(--accent-dim); color: var(--accent); }.segmented .lucide { width: 16px; height: 16px; }
#reading-size { width: calc(100% - 48px); margin: 0 24px 10px; accent-color: var(--accent); }.switch { appearance: none; background: var(--border-bright); width: 34px; height: 20px; border-radius: 20px; position: relative; cursor: pointer; }.switch::after { content: ''; position: absolute; top: 3px; left: 3px; width: 14px; height: 14px; border-radius: 50%; background: var(--surface); transition: transform .15s; }.switch:checked { background: var(--accent); }.switch:checked::after { transform: translateX(14px); }.reset-preferences { display: flex; align-items: center; gap: 8px; margin: 24px 24px 0; padding: 0; border: 0; background: none; color: var(--text-dim); font-size: 11px; }.reset-preferences .lucide { width: 13px; }
#continue-reading { border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); padding: 18px 0; margin-top: 34px; }#continue-reading a { display: flex; gap: 14px; align-items: center; text-decoration: none; color: var(--text); }#continue-reading small { display: block; font-size: 10px; color: var(--text-dim); margin-bottom: 4px; }#continue-reading strong { font-weight: 500; font-size: 14px; }#continue-reading .lucide:last-child { margin-left: auto; }
:root[data-focus="true"] .is-reading .nav, :root[data-focus="true"] .is-reading .toc { display: none; }
:root[data-focus="true"] .is-reading .shell { grid-template-columns: minmax(0, 820px); justify-content: center; }
:root[data-focus="true"] .is-reading .main { grid-column: 1; max-width: 820px; }
@media (max-width: 1280px) {
  .shell { grid-template-columns: 200px minmax(0, 1fr); gap: 36px; padding-left: 32px; padding-right: 32px; }.toc { display: none; }.library-shell { grid-template-columns: 170px minmax(0, 1fr); gap: 40px; }.topbar__in { padding: 0 32px; }.site-footer { margin: 0 32px; }.card__t { font-size: 22px; }.card__content { padding: 20px; }.nav__brand-t { font-size: 19px; }
}
@media (max-width: 1000px) {
  .library-shell { grid-template-columns: minmax(0,1fr); }.library-shell .main { grid-column: 1; }.library-nav { display: none; }.topbar__in { gap: 18px; }.topbar__l { padding: 7px 9px; }.topbar__tools { gap: 4px; }
}
@media (max-width: 900px) {
  :root { --topbar-h: 64px; }.shell { grid-template-columns: minmax(0, 1fr); gap: 0; padding: 0 24px 60px; }.main { grid-column: 1; max-width: 760px; margin: 0 auto; padding-top: 24px; }.library-shell { padding-top: 30px; }.library-shell .main { padding-top: 0; margin: 0 auto; }.nav { grid-column: 1; grid-row: auto; margin: 0 -24px; padding: 0 24px; top: var(--topbar-h); max-height: none; z-index: 200; border-bottom: 1px solid var(--border); background: var(--bg); overflow: visible; }.nav__heading { min-height: 58px; }.nav__brand { display: block; margin: 0; padding: 10px 0; }.nav__brand-k { display: none; }.nav__brand-t { font-size: 17px; margin: 0; }.navtoggle { display: flex; align-items: center; gap: 7px; background: transparent; color: var(--text-dim); border: 0; padding: 8px 0 8px 10px; font-family: var(--font-body); font-weight: 500; text-transform: none; font-size: 11px; }.navtoggle .lucide { width: 15px; height: 15px; }.nav__list { max-height: 55dvh; padding: 10px 0 20px; overscroll-behavior: contain; }.reader-tools { margin-bottom: 27px; }.is-reading .hd h1 { font-size: 36px; }.hd--hero h1 { font-size: 42px; }.pager { grid-template-columns: repeat(2,minmax(0,1fr)); }.site-footer { margin: 0 24px; }.sec__body h2,.sec__t { font-size: 26px; }.sec,.sec__body h2 { scroll-margin-top: 155px; }
}
@media (max-width: 600px) {
  .topbar__in { padding: 0 18px; gap: 12px; }.topbar__brand { font-size: 0; gap: 0; }.brand-mark { width: 32px; height: 32px; font-size: 23px; line-height: 29px; }.topbar__nav { gap: 0; margin-left: 0; }.topbar__l { font-size: 12px; padding: 7px 9px; }.topbar__nav a:last-child { display: none; }.topbar__tools { margin-left: auto; gap: 0; }.search-trigger { padding: 0; width: 32px; height: 34px; justify-content: center; background: none; border: 0; }.search-trigger span { display: none; }.topbar__tools .icon-button { width: 32px; }.shell { padding-left: 20px; padding-right: 20px; }.nav { margin-left: -20px; margin-right: -20px; padding-left: 20px; padding-right: 20px; }.library-shell { padding-top: 30px; }.hd h1,.is-reading .hd h1 { font-size: 32px; }.hd--hero h1 { font-size: 37px; }.hd__k { font-size: 9px; margin-bottom: 14px; }.lede { font-size: 15px; line-height: 1.8; margin-top: 17px; }.library-stats { gap: 18px; font-size: 10px; margin-top: 20px; }.lp__sec { margin-top: 36px; }.lp__h { margin-bottom: 17px; }.cards { grid-template-columns: minmax(0,1fr); gap: 22px; }.card__t { font-size: 24px; }.card__content { padding: 22px; }.category-row { gap: 15px; padding: 20px 0; }.category-row .card__content { padding-right: 21px; }.category-symbol { width: 37px; height: 37px; }.category-symbol .lucide { width: 19px; }.category-row .card__t { font-size: 15px; }.category-row .card__b { font-size: 12px; }.category-row .card__arrow { width: 14px; right: 0; }.site-footer { flex-wrap: wrap; gap: 14px 20px; margin: 0 20px; }.site-footer > span { order: 3; width: 100%; font-size: 10px; }.reader-actions { gap: 1px; }.reading-meta { font-size: 9px; gap: 7px; }.is-reading .main { line-height: 1.85; }.sec__body h2,.sec__t { font-size: 25px; }.sec__h { gap: 10px; }.sec__body h3 { font-size: 18px; }.callout,.prereq { padding: 14px 17px; font-size: 13px; }.sec--takeaways .sec__body,.sec--selfcheck .sec__body,.sec--reconcile .sec__body { padding: 17px 18px 1px; }.pager { gap: 20px; }.pager__t { font-size: 17px; }.diagram-shell__hint { display: none; }.zoom-label { padding: 0 4px; font-size: 8px; }.zoom-controls { gap: 0; }.zoom-controls button { width: 28px; }.mermaid-wrap { padding-left: 8px; padding-right: 8px; }.widget { padding: 16px 12px; }.search-dialog { margin-top: 5dvh; max-height: 90dvh; }.dialog-heading { padding: 17px 18px 10px; }.search-field { margin: 6px 18px 14px; padding: 10px; }.search-field input { font-size: 16px; }.search-filters { padding: 0 18px 14px; gap: 4px; }.search-filters button { font-size: 11px; padding: 5px 8px; }.search-results { max-height: 55dvh; }.search-status { padding-left: 24px; }
}
@media (max-width: 360px) {
  .topbar__in { padding: 0 12px; gap: 8px; }
  .topbar__nav { flex-shrink: 0; }
  .topbar__l { padding: 7px; }
}
@media print {
  :root, :root[data-theme] { color-scheme: light; --bg: #fff; --surface: #fff; --surface2: #f3f3f3; --text: #000; --text-dim: #333; --border: #ccc; --reading-size: 12pt !important; }
  .topbar,.nav,.toc,.reader-tools,.site-footer,.pager,.reading-progress,.code-copy,dialog { display: none !important; }.shell { display: block !important; padding: 0 !important; }.main { max-width: none !important; padding: 0; }.sec { break-inside: auto; }h2,h3 { break-after: avoid; }pre { white-space: pre-wrap !important; }.table-scroll { overflow: visible; }.mermaid-wrap { break-inside: avoid; }
}
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; } }
