/* Handbuch-Leseansicht — nutzt Tokens aus site.css.
 * Uebernommen aus dem Entwurf in Claude Design. Angepasst wurden nur die
 * Schriftstaerken (640/550 gibt es in den Markenschnitten nicht) und die
 * Zuweisung der Auszeichnungsschrift fuer Kapitel-Ueberschriften. */
.bk{display:grid;grid-template-columns:17rem minmax(0,1fr);gap:0;align-items:start;max-width:76rem;margin:0 auto;padding:0 24px}
.bk__nav{position:sticky;top:96px;max-height:calc(100vh - 130px);overflow-y:auto;padding:34px 26px 40px 0;border-right:1px solid var(--border);font-size:13.5px}
.bk__nav h2{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-2);font-weight:600;margin:22px 0 8px}
.bk__nav h2:first-child{margin-top:0}
.bk__nav ol{list-style:none;margin:0 0 4px;padding:0;display:flex;flex-direction:column}
.bk__nav a{display:grid;grid-template-columns:1.85rem 1fr;gap:6px;padding:6px 8px 6px 0;color:var(--muted);text-decoration:none;line-height:1.45;border-radius:var(--radius-sm);text-wrap:pretty;font-family:var(--font-sans)}
.bk__nav a:hover{color:var(--fg-strong)}
.bk__nav a .n{font-family:var(--font-mono);font-size:11.5px;color:var(--muted-2);padding-top:2px}
.bk__nav a[aria-current="page"]{color:var(--fg-strong);font-weight:600}
.bk__nav a[aria-current="page"] .n{color:var(--fg-strong)}
.bk__main{min-width:0;padding:34px 0 0 clamp(28px,4vw,64px)}
.bk__art{max-width:40rem}
.bk__meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted-2)}
.bk__meta .dot{width:3px;height:3px;border-radius:50%;background:var(--border-2)}
.bk h1{font-family:var(--font-display);font-size:clamp(28px,3.6vw,40px);line-height:1.14;letter-spacing:-.012em;color:var(--fg-strong);font-weight:700;margin:14px 0 0;text-wrap:balance}
.bk__lede{font-family:var(--font-serif);font-size:17px;line-height:1.6;color:var(--muted);margin:18px 0 0;text-wrap:pretty}
.bk__body{margin-top:34px;font-family:var(--font-serif);font-size:16.5px;line-height:1.72;color:var(--fg)}
.bk__body p{margin:0 0 20px;text-wrap:pretty}
.bk__body h2{font-family:var(--font-display);font-size:20px;line-height:1.3;letter-spacing:-.012em;color:var(--fg-strong);font-weight:700;margin:44px 0 16px;padding-top:22px;border-top:1px solid var(--border);scroll-margin-top:110px;position:relative}
.bk__body h2 .num{font-family:var(--font-mono);font-size:12.5px;color:var(--muted-2);display:block;margin-bottom:7px;letter-spacing:.06em}
.bk__body h2 .anchor{position:absolute;left:-1.4em;top:calc(22px + .18em);opacity:0;color:var(--muted-2);text-decoration:none;font-weight:400}
.bk__body h2:hover .anchor,.bk__body h2 .anchor:focus-visible{opacity:1}
.bk__body h3{font-family:var(--font-sans);font-size:14px;font-weight:600;letter-spacing:.02em;color:var(--fg-strong);margin:34px 0 14px;text-transform:none;scroll-margin-top:110px}
.bk__body ul{list-style:none;margin:0 0 24px;padding:0;border-top:1px solid var(--border)}
.bk__body ul li{display:grid;grid-template-columns:1.1rem minmax(0,1fr);gap:2px;padding:13px 0;border-bottom:1px solid var(--border);text-wrap:pretty}
.bk__body ul li::before{content:"";width:5px;height:5px;margin-top:.62em;border-radius:50%;background:var(--border-2)}
.bk__body sup.fnref{font-family:var(--font-mono);font-size:10px;color:var(--muted-2);padding-left:1px}
.bk__body a{color:var(--fg-strong);text-decoration:underline;text-decoration-color:var(--border-2);text-underline-offset:2px;text-decoration-thickness:1px;word-break:break-word}
.bk__body a:hover{text-decoration-color:var(--accent);color:var(--accent)}
.bk__quellen a{color:var(--muted);text-decoration:underline;text-decoration-color:var(--border-2);text-underline-offset:2px;word-break:break-all}
.bk__quellen a:hover{color:var(--fg-strong);text-decoration-color:var(--muted)}
.bk__quellen{margin:52px 0 0;padding-top:22px;border-top:1px solid var(--border)}
.bk__quellen h2{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-2);font-weight:600;margin:0 0 14px;border:0;padding:0}
.bk__quellen ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.bk__quellen li{display:grid;grid-template-columns:1.7rem minmax(0,1fr);gap:8px;font-size:13px;line-height:1.55;color:var(--muted);min-width:0}
.bk__quellen .n{font-family:var(--font-mono);font-size:11.5px;color:var(--muted-2)}
.bk__quellen a{color:var(--muted)}
/* Stand des Kapitels — steht zwischen Text und Blaetternavigation.
   Bewusst ruhig gehalten: die Zeile ist eine Fussnote zum Text, kein
   Element, das mit der Ueberschrift um Aufmerksamkeit ringt. Der obere
   Strich trennt sie vom Fliesstext, damit sie nicht als letzter Absatz
   des Kapitels gelesen wird.
   Das fuehrende .bk ist NICHT schmueckend: site.css setzt
   body.af-website p auf die Serifenschrift, und ein Element im
   Selektor wiegt schwerer als diese eine Klasse allein. Ohne den
   Vorsatz erbt die Zeile Serife statt Monospace — am 07.09.2026
   am gerenderten Element nachgemessen. */
.bk .bk__stand{margin:48px 0 0;padding-top:18px;border-top:1px solid var(--border);font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted-2)}
.bk .bk__stand time{color:var(--muted)}
.bk__pager{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:56px 0 72px}
.bk__pager a{display:flex;flex-direction:column;gap:6px;padding:18px 20px;border:1px solid var(--border);border-radius:var(--radius);text-decoration:none;color:var(--fg-strong);background:var(--card);min-height:40px}
.bk__pager a:hover{border-color:var(--border-2)}
.bk__pager .lbl{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted-2)}
.bk__pager .ttl{font-family:var(--font-sans);font-size:14.5px;line-height:1.4;text-wrap:pretty}
.bk__pager a.next{text-align:right;align-items:flex-end;grid-column:2}
.bk__pager a.prev{grid-column:1}
/* Lesebalken + Werkzeugleiste */
.bk__bar{position:sticky;top:57px;z-index:40;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--border)}
.bk__bar-in{max-width:76rem;margin:0 auto;padding:9px 24px;display:flex;align-items:center;gap:12px;font-size:13px;color:var(--muted);font-family:var(--font-sans)}
.bk__bar .crumb{display:flex;align-items:center;gap:8px;min-width:0}
.bk__bar .crumb a{color:var(--muted);text-decoration:none;white-space:nowrap}
.bk__bar .crumb a:hover{color:var(--fg-strong)}
.bk__bar .crumb .cur{color:var(--fg-strong);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bk__bar .sp{flex:1}
.bk__tools{display:flex;align-items:center;gap:6px}
.bk__tools button,.bk__tools a{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;min-width:40px;padding:0 12px;border:1px solid transparent;border-radius:var(--radius-sm);background:none;color:var(--muted);font:inherit;font-size:13px;cursor:pointer;text-decoration:none}
.bk__tools button:hover,.bk__tools a:hover{color:var(--fg-strong);border-color:var(--border)}
.bk__tools svg{width:16px;height:16px}
.bk__tools .kbd{font-family:var(--font-mono);font-size:10.5px;color:var(--muted-2);border:1px solid var(--border);border-radius:4px;padding:1px 4px}
.bk__prog{height:2px;background:var(--accent);width:0;transition:width .15s linear}
/* Suche */
.bk__search{position:fixed;inset:0;z-index:90;display:none;padding:12vh 20px 20px;background:color-mix(in srgb,var(--fg-strong) 34%,transparent);backdrop-filter:blur(3px)}
.bk__search[open],.bk__search.on{display:block}
.bk__search-box{max-width:40rem;margin:0 auto;background:var(--card);border:1px solid var(--border-2);border-radius:var(--radius);box-shadow:0 24px 60px rgba(17,34,51,.24);overflow:hidden}
.bk__search-in{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--border)}
.bk__search-in svg{width:17px;height:17px;color:var(--muted-2);flex:none}
.bk__search-in input{flex:1;min-width:0;border:0;background:none;font:inherit;font-family:var(--font-sans);font-size:16px;color:var(--fg-strong);outline:none}
.bk__hits{max-height:52vh;overflow-y:auto;margin:0;padding:6px;list-style:none}
.bk__hits li{margin:0}
.bk__hits a{display:block;padding:11px 12px;border-radius:var(--radius-sm);text-decoration:none;color:var(--fg)}
.bk__hits a:hover,.bk__hits a:focus-visible{background:var(--bg-section)}
.bk__hits .hk{display:block;font-family:var(--font-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted-2);margin-bottom:4px}
.bk__hits .ht{display:block;font-family:var(--font-sans);font-size:14.5px;color:var(--fg-strong);margin-bottom:3px}
.bk__hits .hs{display:block;font-family:var(--font-serif);font-size:13px;line-height:1.55;color:var(--muted)}
.bk__hits mark{background:color-mix(in srgb,var(--accent) 34%,transparent);color:inherit;border-radius:2px}
.bk__search-foot{padding:9px 16px;border-top:1px solid var(--border);font-size:12px;color:var(--muted-2);display:flex;gap:14px;font-family:var(--font-sans)}
/* Übersicht */
.bk-toc{display:flex;flex-direction:column;gap:38px;margin-top:12px}
.bk-toc section{display:block}
.bk-toc h2{font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-2);font-weight:600;margin:0 0 4px;padding-bottom:12px;border-bottom:1px solid var(--border-2)}
.bk-toc ol{list-style:none;margin:0;padding:0}
.bk-toc li{border-bottom:1px solid var(--border)}
.bk-toc a{display:grid;grid-template-columns:2.6rem minmax(0,1fr) auto;gap:14px;align-items:baseline;padding:15px 4px;text-decoration:none;color:var(--fg-strong)}
.bk-toc a:hover{background:var(--bg-section)}
.bk-toc a:hover .ti{text-decoration:underline;text-decoration-color:var(--border-2);text-underline-offset:3px}
.bk-toc .kn{font-family:var(--font-mono);font-size:12.5px;color:var(--muted-2)}
.bk-toc .ti{font-family:var(--font-serif);font-size:15.5px;line-height:1.45;text-wrap:pretty}
.bk-toc .sc{font-family:var(--font-mono);font-size:11px;color:var(--muted-2);white-space:nowrap}
.bk-resume[hidden]{display:none}
.bk-resume{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;padding:18px 20px;border:1px solid var(--border-2);border-radius:var(--radius);background:var(--bg-section);margin:30px 0 0}
.bk-resume .rl{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted-2)}
.bk-resume .rt{font-family:var(--font-serif);font-size:15px;color:var(--fg-strong);flex:1;min-width:12rem}
@media (max-width:960px){
  .bk{grid-template-columns:minmax(0,1fr);padding:0 20px}
  .bk__nav{display:none}
  .bk__main{padding:26px 0 0}
  .bk__art{max-width:none}
  .bk__nav.open{display:block;position:static;max-height:none;border-right:0;border-bottom:1px solid var(--border);padding:24px 0}
}
@media (max-width:520px){
  .bk__bar-in{padding:8px 18px}
  .bk__pager{grid-template-columns:minmax(0,1fr)}
  .bk__pager a.next,.bk__pager a.prev{grid-column:1;text-align:left;align-items:flex-start}
  .bk__body{font-size:16px}
}

/* Tabellen im Buchtext. Der Seiten-Stil gibt .ptable 58rem Mindestbreite,
   gedacht fuer die volle Seitenbreite. In der Lesespalte des Handbuchs ist
   das zu breit: die letzte Spalte liefe aus dem Blick, und der Leser sieht
   dem Kasten nicht an, dass er ihn schieben muesste. Hier also enger. */
.bk__body .ptable{min-width:34rem}
.bk__body .ptable th,.bk__body .ptable td{padding:11px 12px;font-size:13.5px;line-height:1.5}
.bk__body .ptable .rowh{width:8.5rem}
.bk__body .tscroll{margin:18px 0 26px}
@media (max-width:640px){
  .bk__body .ptable .rowh{width:7rem}
}
