:root { --paper:#fbfaf6; --ink:#18211f; --muted:#64706c; --line:#d9ded8; --accent:#086c5c; --accent-soft:#dcefe9; --code:#11231f; --sidebar:#10241f; --sidebar-ink:#edf7f3; --max:78rem; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font:17px/1.7 Georgia,serif; }
a { color:var(--accent); text-underline-offset:.18em; }
.layout { min-height:100vh; display:grid; grid-template-columns:19rem minmax(0,1fr); }
.sidebar { position:sticky; top:0; height:100vh; overflow:auto; padding:1.4rem 1.2rem; background:var(--sidebar); color:var(--sidebar-ink); }
.brand { color:white; text-decoration:none; display:block; font:700 1.15rem/1.25 system-ui,sans-serif; margin-bottom:1rem; }
.edition { color:#9fc5ba; font:.76rem/1.4 system-ui,sans-serif; text-transform:uppercase; letter-spacing:.09em; }
.search { width:100%; border:1px solid #41635b; border-radius:.55rem; padding:.65rem .75rem; color:white; background:#19332c; margin:1rem 0; }
.search::placeholder { color:#a7beb8; }
.nav-part { margin:1.15rem 0 .4rem; color:#86bcae; font:700 .72rem/1.2 system-ui,sans-serif; text-transform:uppercase; letter-spacing:.09em; }
.nav-link { display:block; color:#dce9e5; text-decoration:none; padding:.32rem .42rem; border-radius:.35rem; font:.84rem/1.35 system-ui,sans-serif; }
.nav-link:hover,.nav-link.active { color:white; background:#285047; }
.main { min-width:0; }
.topbar { border-bottom:1px solid var(--line); padding:.7rem 2rem; display:flex; gap:1rem; justify-content:flex-end; font:.82rem/1.4 system-ui,sans-serif; }
.content { max-width:var(--max); margin:0 auto; padding:3.2rem 4.5rem 6rem; }
.eyebrow { color:var(--accent); font:700 .78rem/1.3 system-ui,sans-serif; text-transform:uppercase; letter-spacing:.1em; }
h1,h2,h3,h4 { line-height:1.18; text-wrap:balance; }
h1 { font-size:clamp(2.35rem,6vw,4.8rem); letter-spacing:-.045em; margin:.35rem 0 1rem; }
h2 { font-size:2rem; margin-top:3.2rem; border-top:1px solid var(--line); padding-top:1.1rem; }
h3 { font-size:1.4rem; margin-top:2.2rem; }
p,li { max-width:76ch; }
blockquote { margin:2rem 0; border-left:.35rem solid var(--accent); background:var(--accent-soft); padding:1rem 1.3rem; font-size:1.12rem; }
code { font:.88em/1.4 ui-monospace,SFMono-Regular,Consolas,monospace; background:#e7ebe6; border-radius:.25rem; padding:.08rem .25rem; }
pre { overflow:auto; padding:1.15rem; border-radius:.6rem; color:#eaf5f1; background:var(--code); font:.83rem/1.55 ui-monospace,SFMono-Regular,Consolas,monospace; }
pre code { padding:0; background:transparent; color:inherit; }
table { display:block; width:100%; overflow-x:auto; border-collapse:collapse; margin:1.5rem 0 2rem; font:.88rem/1.45 system-ui,sans-serif; }
th,td { border:1px solid var(--line); padding:.62rem .72rem; text-align:left; vertical-align:top; }
th { background:#e8eee9; }
.chapter-meta { display:flex; flex-wrap:wrap; gap:.5rem; margin:1.4rem 0 2.2rem; }
.pill { border:1px solid var(--line); border-radius:999px; padding:.25rem .65rem; color:var(--muted); font:.75rem/1.4 system-ui,sans-serif; }
.supplements { margin-top:5rem; }
.supplement { margin:1.2rem 0; border:1px solid var(--line); border-radius:.65rem; background:white; }
.supplement summary { cursor:pointer; padding:1rem 1.2rem; color:var(--accent); font:700 .95rem/1.4 system-ui,sans-serif; }
.supplement-body { padding:0 1.3rem 1.5rem; }
.chapter-pager { display:grid; grid-template-columns:1fr 1fr; gap:1rem; border-top:1px solid var(--line); margin-top:4rem; padding-top:1.4rem; font:.9rem/1.4 system-ui,sans-serif; }
.chapter-pager a { padding:.8rem; border:1px solid var(--line); border-radius:.55rem; text-decoration:none; }
.chapter-pager .next { text-align:right; }
.figure { margin:2.4rem 0; padding:1rem; border:1px solid var(--line); border-radius:.65rem; background:white; }
.figure figcaption { margin-top:.7rem; color:var(--muted); font:.82rem/1.4 system-ui,sans-serif; }
.figure-caption { display:table; table-layout:fixed; width:100%; margin:.7rem 0 0; overflow:visible; color:var(--muted); font:.82rem/1.4 system-ui,sans-serif; }
.topology-frame { margin:1.5rem 0; overflow:auto; border:1px solid var(--line); border-radius:.7rem; background:#f7faf8; }
.topology-frame img { display:block; width:100%; min-width:1000px; height:auto; }
.figure-caption td { border:0; padding:0; background:transparent; }
.figure img { max-width:100%; height:auto; display:block; }
.diagram { white-space:pre-wrap; color:#17312a; background:#edf3ef; }
.diagram-source { margin-top:.8rem; font:700 .8rem/1.4 system-ui,sans-serif; color:var(--accent); }
.diagram-source summary { cursor:pointer; }
.diagram-atlas { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.2rem; align-items:start; }
.atlas-card { min-width:0; padding:1rem; border:1px solid var(--line); border-radius:.75rem; background:white; }
.atlas-card .figure { margin:.6rem 0 1rem; padding:.65rem; }
.atlas-card .figure img { width:100%; max-height:32rem; object-fit:contain; }
.atlas-link { display:inline-block; font:.82rem/1.4 system-ui,sans-serif; }
.search-results { display:none; position:fixed; z-index:10; top:5.1rem; left:1rem; width:17rem; max-height:70vh; overflow:auto; padding:.4rem; border:1px solid #41635b; border-radius:.55rem; background:#10241f; box-shadow:0 1rem 2rem #0006; }
.search-results.open { display:block; }
.search-hit { display:block; padding:.65rem; color:white; text-decoration:none; border-bottom:1px solid #28463e; font:.78rem/1.35 system-ui,sans-serif; }
.search-hit small { display:block; color:#9fc5ba; margin-top:.2rem; }
.hero { padding:2rem 0 3rem; }
.hero p { font-size:1.25rem; color:#42514c; }
.parts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.part-card { border:1px solid var(--line); border-radius:.7rem; padding:1.1rem 1.3rem; background:white; }
.part-card h2 { border:0; margin:0 0 .7rem; padding:0; font-size:1.1rem; }
.part-card a { display:block; padding:.25rem 0; font:.9rem/1.35 system-ui,sans-serif; }
.mobile-menu { display:none; }
.material-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.material-card { border:1px solid var(--line); border-radius:.75rem; padding:1.2rem 1.35rem; background:white; }
.material-card h2 { border:0; padding:0; margin:.45rem 0 .7rem; font-size:1.35rem; }
.material-card p { color:var(--muted); font:0.86rem/1.45 system-ui,sans-serif; }
.material-meta { display:flex; flex-wrap:wrap; gap:.5rem; margin:0 0 2rem; }
.material-meta span { border:1px solid var(--line); border-radius:999px; padding:.3rem .65rem; color:var(--muted); font:.74rem/1.4 system-ui,sans-serif; }
.material-visuals { margin-top:4rem; }
.material-visual { margin:2rem 0 3rem; }
.library-feature { display:grid; grid-template-columns:minmax(0,1fr) 17rem; gap:2rem; align-items:stretch; margin:0 0 3rem; padding:1.5rem; border:1px solid var(--line); border-radius:.9rem; background:white; }
.library-feature h2 { border:0; margin:.4rem 0 .8rem; padding:0; }
.library-actions { display:flex; flex-wrap:wrap; gap:.65rem; margin-top:1.2rem; }
.library-actions a { padding:.55rem .8rem; border:1px solid #9abbb2; border-radius:.5rem; font:.82rem/1.2 system-ui,sans-serif; text-decoration:none; }
.book-mark { display:flex; flex-direction:column; justify-content:space-between; min-height:15rem; padding:1.25rem; color:#eaf6f2; background:#102f28; border-radius:.65rem; font-family:system-ui,sans-serif; }
.book-mark span { color:#65c7b3; font-size:2.5rem; font-weight:800; }
.book-mark strong { font-size:1.45rem; line-height:1.08; }
.collection-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.collection-card { padding:1.1rem 1.2rem; border:1px solid var(--line); border-radius:.75rem; background:white; }
.collection-card h3 { margin:.35rem 0; }
.collection-card p { color:var(--muted); font:.86rem/1.45 system-ui,sans-serif; }
@media (max-width:850px) {
  .layout { display:block; }
  .sidebar { position:fixed; z-index:20; width:min(88vw,21rem); transform:translateX(-105%); transition:transform .2s; }
  body.menu-open .sidebar { transform:translateX(0); }
  .mobile-menu { display:inline-block; margin-right:auto; }
  .content { padding:2.2rem 1.25rem 5rem; }
  .topbar { padding:.65rem 1rem; }
  .parts { grid-template-columns:1fr; }
  .diagram-atlas { grid-template-columns:1fr; }
  .material-grid { grid-template-columns:1fr; }
  .library-feature { grid-template-columns:1fr; }
  .collection-grid { grid-template-columns:1fr; }
  .search-results { position:static; width:100%; max-height:none; }
}
@media print {
  @page { size:A4; margin:18mm 16mm 20mm; }
  body { color:black; background:white; font-size:10.5pt; }
  .sidebar,.topbar,.chapter-pager,.supplements,.no-print { display:none!important; }
  .layout { display:block; }
  .content { max-width:none; padding:0; }
  h1 { font-size:27pt; page-break-before:always; }
  h2,h3 { page-break-after:avoid; }
  table,pre,blockquote,.figure { break-inside:avoid; }
  a { color:black; text-decoration:none; }
}
