/* manual.css — the shared shell for the three manuals: manual.html (the
 * production tools), faculty-manual.html and student-manual.html (the classroom).
 *
 * Lifted out of manual.html verbatim when the two classroom manuals were added,
 * rather than pasted into each of them. Same reasoning as js/theme-tokens.css:
 * three copies of one stylesheet means every future tweak is a three-file sweep,
 * and the copy that gets missed is the one nobody looks at.
 *
 * It sits where the inline <style> sat: BEFORE js/theme-tokens.css and
 * js/theme.css. That order is load-bearing in one direction only — theme.css
 * must come after, because it overrides the :root values declared here per mode.
 * The tokens it consumes (--ink-rgb, --spink) resolve at use time, not at parse
 * time, so those may be declared later without breaking anything.
 */
:root{--bg:#1a1a2e;--surface:#16213e;--toolbar-bg:#0d1b2a;--border:rgba(var(--ink-rgb),0.08);--text:#eee;--text-dim:#bbc0cf;--accent:var(--spink);}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:var(--bg);color:var(--text);font-family:'Inter',system-ui,sans-serif;font-size:15px;line-height:1.65;}
a{color:inherit;text-decoration:none;}
.man-shell{display:flex;align-items:flex-start;max-width:1280px;margin:0 auto;}
/* ---- sidebar TOC ---- */
.man-toc{position:sticky;top:0;align-self:flex-start;width:284px;flex-shrink:0;height:100vh;overflow-y:auto;background:var(--toolbar-bg);border-right:1px solid var(--border);padding:0 0 40px;}
.man-toc-head{padding:22px 22px 16px;border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--toolbar-bg);z-index:2;}
.man-toc-head.brand{font-size:15px;font-weight:800;letter-spacing:.2px;}
.man-toc-head.brand b{color:var(--accent);}
.man-toc-head.sub{font-size:11px;text-transform:uppercase;letter-spacing:1.5px;color:var(--text-dim);margin-top:4px;font-weight:600;}
.man-search{width:calc(100% - 28px);margin:14px;padding:9px 12px;background:var(--surface);border:1px solid var(--border);border-radius:8px;color:var(--text);font-family:inherit;font-size:13px;}
.man-search::placeholder{color:var(--text-dim);}
.toc-group{margin:6px 0;}
.toc-group-title{padding:10px 22px 5px;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--g);}
.toc-link{display:block;padding:5px 22px 5px 26px;font-size:13px;color:var(--text-dim);border-left:2px solid transparent;transition:.12s;}
.toc-link:hover{color:var(--text);background:rgba(var(--ink-rgb),0.03);}
.toc-link.active{color:var(--g);border-left-color:var(--g);background:rgba(var(--ink-rgb),0.04);font-weight:600;}
/* ---- main column ---- */
.man-main{flex:1;min-width:0;padding:0 48px 120px;}
.man-hero{padding:54px 0 26px;border-bottom:1px solid var(--border);margin-bottom:8px;}
.man-hero h1{font-size:34px;font-weight:800;margin:0 0 8px;letter-spacing:-.5px;}
.man-hero p{color:var(--text-dim);max-width:680px;margin:0;font-size:15px;}
.man-hero .meta{margin-top:16px;font-size:12px;color:var(--text-dim);}
.man-group{padding-top:30px;}
.man-group-h{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;color:var(--g);margin:34px 0 4px;padding-bottom:8px;border-bottom:1px solid var(--border);}
.man-tool{border:1px solid var(--border);border-radius:12px;background:var(--surface);margin:16px 0;overflow:hidden;}
.man-tool-head{display:flex;align-items:center;gap:12px;padding:16px 20px;cursor:pointer;user-select:none;border-left:3px solid var(--g);}
.man-tool-head:hover{background:rgba(var(--ink-rgb),0.02);}
.man-tool-title{font-size:18px;font-weight:700;margin:0;}
.man-file{font-size:11px;color:var(--text-dim);font-family:ui-monospace,Menlo,monospace;}
/* NOTE: the four rules below were compound selectors (.man-tool.collapsed.man-chev),
 * which require all three classes on ONE element and therefore matched nothing.
 * Collapse was dead in the shipped manual: clicking a header did nothing, the
 * chevron never turned, and Collapse all was a no-op. They are descendant
 * selectors now. Nothing starts collapsed, so default rendering is unchanged. */
.man-chev{margin-left:auto;color:var(--text-dim);transition:transform.2s;}
.man-tool.collapsed .man-chev{transform:rotate(-90deg);}
.man-tool.collapsed .man-tool-body{display:none;}
.man-tool-body{padding:4px 24px 24px;border-top:1px solid var(--border);}
.man-lede{font-size:15px;color:var(--text);font-weight:500;margin:18px 0 6px;}
.man-tool-body h3{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--g);margin:22px 0 8px;}
.man-tool-body p{margin:0 0 10px;color:var(--text-dim);}
.man-tool-body ul,.man-tool-body ol{margin:6px 0 14px;padding-left:22px;}
.man-tool-body li{margin-bottom:7px;color:var(--text-dim);}
.man-tool-body li strong,.man-tool-body p strong{color:var(--text);font-weight:600;}
.man-tip{margin:14px 0;padding:11px 16px;background:rgba(var(--ink-rgb),0.03);border:1px solid var(--border);border-left:3px solid var(--g);border-radius:8px;font-size:13.5px;color:var(--text-dim);}
.man-tip strong{color:var(--g);}
.man-tophint{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px;}
.man-tophint button{background:var(--surface);border:1px solid var(--border);color:var(--text-dim);padding:6px 12px;border-radius:7px;font-family:inherit;font-size:12px;cursor:pointer;}
.man-tophint button:hover{color:var(--text);border-color:var(--accent);}
.man-keytable{width:100%;border-collapse:collapse;margin:6px 0 16px;font-size:13px;table-layout:fixed;}
.man-keytable th{text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.7px;color:var(--text-dim);font-weight:700;padding:7px 12px 7px 0;border-bottom:1px solid var(--border);}
.man-keytable th:first-child{width:150px;}
.man-keytable th:nth-child(2){width:30%;}
.man-keytable td{padding:8px 12px 8px 0;color:var(--text-dim);vertical-align:top;line-height:1.45;word-wrap:break-word;}
/* group rows by item: a subtle top rule starts each item group */
.man-keytable tr.man-keygrp>td{border-top:1px solid var(--border);}
.man-keytable tr:first-child>td{border-top:none;}
.man-keytable td.man-keyitem{color:var(--text);font-weight:600;padding-top:9px;border-right:1px solid var(--border);padding-right:14px;}
.man-keytable td.man-keyeffect{color:var(--text);font-weight:500;}
.man-keytable kbd{display:inline-block;background:var(--toolbar-bg);border:1px solid var(--border);border-bottom-width:2px;border-radius:5px;padding:1px 7px;font-family:ui-monospace,Menlo,monospace;font-size:11.5px;color:var(--text);white-space:nowrap;line-height:1.7;}
@media print{.man-toc{display:none;}.man-tool.collapsed .man-tool-body{display:block;}.man-main{padding:0 12px;}.man-tool{break-inside:avoid;}}
@media(max-width:860px){.man-toc{display:none;}.man-main{padding:0 18px 80px;}}
