:root{
  --bg:#191613; --bg-deep:#12100d; --surface:#201c17; --raised:#2a2620;
  --border:#37312a; --border-soft:#2c2username721;
  --text:#e9e3d8; --muted:#a79d8d; --faint:#7d7466;
  --accent:#e6b054; --accent-dim:#bd8a34;
  --sans:'IBM Plex Sans',system-ui,sans-serif; --mono:'IBM Plex Mono',ui-monospace,monospace;
  --content-w:860px;--heading-font:'IBM Plex Mono',monospace;
}
html.theme-light{
  --bg:#f6f2ea; --bg-deep:#ece7dc; --surface:#fdfaf4; --raised:#efeade;
  --border:#ddd5c6; --border-soft:#e6dfd2;
  --text:#2b261e; --muted:#6e6555; --faint:#988e7c;
  --accent:#a06a10; --accent-dim:#7c5510;
}
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=IBM+Plex+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400&family=IBM+Plex+Serif:ital,wght@0,400;0,500;0,600;1,400&display=swap');

/* ---------- base ---------- */
html,body{background:var(--bg) !important;color:var(--text) !important;font-family:var(--sans);margin:0;padding:0;}
body{font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased;}
*{box-sizing:border-box;}
::selection{background:var(--accent);color:var(--bg-deep);}
a{color:var(--accent);text-decoration:none;}
a:hover{color:var(--text);text-decoration:underline;text-underline-offset:3px;}

/* ---------- header ---------- */
#header{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:12px;
  padding:10px 20px;background:color-mix(in srgb,var(--bg) 88%,transparent);
  backdrop-filter:blur(10px);border-bottom:1px solid var(--border);}
#header-logo{display:flex;align-items:center;gap:10px;font-weight:600;font-size:16px;
  letter-spacing:.01em;color:var(--text);flex:1;}
#header-logo:hover{text-decoration:none;color:var(--accent);}
#header-logo img{border-radius:6px;}
.header-button{appearance:none;background:none;border:1px solid transparent;border-radius:8px;
  color:var(--muted);width:38px;height:38px;display:grid;place-items:center;cursor:pointer;padding:0;}
.header-button:hover{color:var(--text);background:var(--raised);border-color:var(--border);}
.header-button-placeholder{width:38px;}

/* ---------- split pane ---------- */
#split-pane{display:flex;align-items:stretch;height:calc(100vh - 59px);overflow:hidden;}
#right-pane{flex:1;min-width:0;display:flex;flex-direction:column;overflow-y:auto;}

/* ---------- left pane / navigation ---------- */
#left-pane{width:280px;flex:none;border-right:1px solid var(--border);background:var(--surface);overflow-y:auto;}
html.left-pane-collapsed #left-pane{display:none;}
#navigation{padding:18px 14px 32px;font-size:14px;}
#site-header{margin-bottom:14px;}
.theme-selection{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:6px 10px 14px;border-bottom:1px solid var(--border-soft);}
#sitetheme{font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);}
label.switch{position:relative;display:inline-flex;align-items:center;width:44px;height:24px;flex:none;cursor:pointer;}
label.switch input{opacity:0;width:0;height:0;}
label.switch .slider{position:absolute;inset:0;background:var(--raised);border:1px solid var(--border);
  border-radius:99px;transition:background .15s;}
label.switch .slider::before{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;
  border-radius:50%;background:var(--muted);transition:transform .15s,background .15s;}
label.switch input:checked + .slider::before{transform:translateX(20px);background:var(--accent);}
label.switch svg{display:none;}

#navigation ul{list-style:none;margin:0;padding:0;}
#navigation ul ul{padding-left:14px;border-left:1px solid var(--border-soft);margin-left:10px;}
#navigation li{margin:1px 0;}
#navigation a{display:block;padding:5px 10px;border-radius:7px;color:var(--muted);line-height:1.45;}
#navigation a:hover{color:var(--text);background:var(--raised);text-decoration:none;}
#navigation a.active{color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,transparent);font-weight:500;}

/* ---------- main / content ---------- */
#main{width:100%;max-width:var(--content-w,820px);margin:0 auto;padding:44px 36px 64px;flex:1;}
#content{font-size:var(--content-size,16px);}
h1#title{font-family:var(--heading-font,var(--sans));font-size:var(--h1-size,34px);line-height:1.2;
  font-weight:650;letter-spacing:-.015em;margin:0 0 22px;color:var(--text);}
#content h2{font-family:var(--heading-font,var(--sans));font-size:23px;font-weight:600;
  letter-spacing:-.01em;margin:2.1em 0 .6em;line-height:1.3;}
#content h3{font-family:var(--heading-font,var(--sans));font-size:18px;font-weight:600;margin:1.7em 0 .5em;}
#content p{margin:0 0 1.05em;text-wrap:pretty;}
#content ul,#content ol{padding-left:1.4em;margin:0 0 1.05em;}
#content li{margin:.25em 0;}
#content li::marker{color:var(--accent-dim);}
#content strong{color:var(--text);font-weight:600;}
#content hr{border:none;border-top:1px solid var(--border);margin:2.2em 0;}
#content img{max-width:100%;border-radius:10px;border:1px solid var(--border);}

/* inline + block code */
#content code{font-family:var(--mono);font-size:.86em;background:var(--raised);
  border:1px solid var(--border-soft);border-radius:5px;padding:.1em .38em;color:var(--text);}
#content pre{background:var(--bg-deep) !important;border:1px solid var(--border);border-radius:10px;
  padding:16px 20px;overflow-x:auto;margin:1.3em 0;line-height:1.6;}
#content pre code{background:none;border:none;padding:0;font-size:13.5px;color:#d7d0c3;}
html.theme-light #content pre code{color:#3a342a;}

#content blockquote{margin:1.3em 0;padding:2px 0 2px 18px;border-left:3px solid var(--accent);
  color:var(--muted);font-style:italic;}
#content blockquote p:last-child{margin-bottom:0;}

#content table{border-collapse:collapse;width:100%;margin:1.3em 0;font-size:14.5px;}
#content th{text-align:left;font-weight:600;font-size:12px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--faint);border-bottom:2px solid var(--border);padding:8px 12px;}
#content td{border-bottom:1px solid var(--border-soft);padding:9px 12px;vertical-align:top;}
#content tr:hover td{background:color-mix(in srgb,var(--raised) 55%,transparent);}

/* empty landing note */
/*
#content.no-content > p{display:none;}
#content.no-content::after{content:"Pick a note from the sidebar to start reading.";
  display:block;margin-top:8px;padding:26px 28px;border:1px dashed var(--border);border-radius:12px;
  color:var(--muted);font-size:15px;}
*/

#content-footer{margin-top:56px;padding-top:16px;border-top:1px solid var(--border-soft);
  color:var(--faint);font-size:13px;}

/* parent link / child links (older fragments, kept for safety) */
#parentLink{font-size:13px;color:var(--faint);margin-bottom:10px;}
#childLinks ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:10px;}
#childLinks a{display:inline-block;padding:8px 14px;background:var(--surface);border:1px solid var(--border);
  border-radius:9px;color:var(--text);font-size:14px;}
#childLinks a:hover{border-color:var(--accent);color:var(--accent);text-decoration:none;}
#childLinks hr,#childLinks > span{display:none;}

/* scrollbars */
*{scrollbar-width:thin;scrollbar-color:var(--border) transparent;}
::-webkit-scrollbar{width:10px;height:10px;}
::-webkit-scrollbar-thumb{background:var(--border);border-radius:6px;}
::-webkit-scrollbar-track{background:transparent;}

@media (max-width:900px){
  #left-pane{position:fixed;top:59px;bottom:0;left:0;z-index:40;box-shadow:20px 0 40px rgb(0 0 0/.35);}
  #main{padding:28px 20px 48px;}
}

/* ---------- print ---------- */
@media print{
  html,body{background:#fff !important;color:#141210 !important;}
  #header,#left-pane,.theme-selection{display:none !important;}
  #split-pane{display:block;min-height:0;}
  #main{max-width:none;padding:0;}
  #content a{color:#141210;text-decoration:underline;}
  #content pre{background:#f4f1ea !important;border-color:#ccc;}
  #content pre code{color:#222;}
}
/* --- 1c flavor: mono headings, hash markers, panel code blocks --- */
body{background:
  linear-gradient(var(--bg) 0 0);}
h1#title{font-size:30px;font-weight:600;letter-spacing:-.02em;}
h1#title::before{content:"# ";color:var(--accent);}
#content h2{font-size:19px;}
#content h2::before{content:"## ";color:var(--accent-dim);}
#content h3{font-size:16px;}
#content h3::before{content:"### ";color:var(--accent-dim);}
#header{background:var(--bg-deep);}
#header-logo{font-family:var(--mono);font-size:15px;}
#left-pane{background:var(--bg-deep);}
#navigation{font-family:var(--mono);font-size:12.5px;}
#navigation a{border-radius:3px;}
#navigation a.active{background:var(--accent);color:var(--bg-deep);}
#content pre{position:relative;border-radius:6px;border-top:2px solid var(--accent-dim);}
#content pre::before{content:"$";position:absolute;top:8px;right:14px;font-family:var(--mono);
  font-size:11px;color:var(--faint);}
#content code{border-radius:3px;}
#content table{font-family:var(--mono);font-size:13px;}

/* heading anchor links: only on hover */
#content :is(h1,h2,h3,h4,h5) > a[href^="#"]{opacity:0;transition:opacity .15s;}
#content :is(h1,h2,h3,h4,h5):hover > a[href^="#"]{opacity:.55;text-decoration:none;}

/* left-pane search (.search-item > svg.search-icon + input.search-input) */
.search-item{position:relative;margin:12px 0 6px;}
.search-item .search-icon{position:absolute;left:10px;top:50%;transform:translateY(-50%);
  width:15px;height:15px;color:var(--faint);pointer-events:none;}
.search-input{width:100%;background:var(--raised);border:1px solid var(--border);border-radius:5px;
  color:var(--text);font-family:var(--mono);font-size:12.5px;padding:8px 10px 8px 33px;outline:none;}
.search-input:focus{border-color:var(--accent-dim);}
.search-input::placeholder{color:var(--faint);}

/* tree icons + toc anchors */
#menu .tn-icon{color:var(--accent-dim);margin-right:2px;vertical-align:-1px;}
#menu a.active .tn-icon{color:inherit;}
#content .toc-anchor{margin-left:.45em;}

/* content footer: updated stamp + prev/next */
#content-footer .updated{font-size:12px;font-family:var(--mono);color:var(--faint);
  font-style:normal;text-align:right;margin-bottom:14px;}
#content-footer .navigation{display:flex;justify-content:space-between;gap:12px;}
#content-footer .navigation a{font-family:var(--mono);font-size:13px;color:var(--muted);
  border:1px solid var(--border);border-radius:4px;padding:9px 15px;background:var(--surface);}
#content-footer .navigation a{transform:none !important;transition:color .12s,border-color .12s;}
#content-footer .navigation a:hover{color:var(--accent);border-color:var(--accent-dim);text-decoration:none;transform:none !important;box-shadow:none !important;}
#content-footer .navigation a.next{margin-left:auto;}

/* Comentario widget (exact selectors from rendered markup) */
comentario-comments{display:block;margin-top:44px;}
comentario-comments .comentario-root{color:var(--text) !important;font-family:var(--sans) !important;background:transparent !important;}
comentario-comments .comentario-root a{color:var(--accent) !important;}
comentario-comments .comentario-root a:hover{color:var(--text) !important;}

/* profile bar */
comentario-comments .comentario-root .comentario-profile-bar{border-bottom:1px solid var(--border-soft) !important;}
comentario-comments .comentario-root .comentario-avatar{background:var(--raised) !important;color:var(--accent) !important;
  border:1px solid var(--border) !important;border-radius:6px !important;font-family:var(--mono) !important;}
comentario-comments .comentario-root .comentario-name{color:var(--text) !important;}
comentario-comments .comentario-root .comentario-text-muted{color:var(--muted) !important;}

/* buttons */
comentario-comments .comentario-root .comentario-btn{font-family:var(--mono) !important;border-radius:4px !important;
  box-shadow:none !important;transform:none !important;}
comentario-comments .comentario-root .comentario-btn-tool{background:transparent !important;border:none !important;color:var(--faint) !important;}
comentario-comments .comentario-root .comentario-btn-tool:hover{color:var(--accent) !important;background:var(--raised) !important;}
comentario-comments .comentario-root .comentario-btn-link{background:transparent !important;border:none !important;color:var(--muted) !important;}
comentario-comments .comentario-root .comentario-btn-link:hover{color:var(--accent) !important;}
comentario-comments .comentario-root .comentario-btn-active{color:var(--accent) !important;}
comentario-comments .comentario-root .comentario-text-danger{color:#c96a5a !important;}
comentario-comments .comentario-root .comentario-text-danger:hover{color:#e2887a !important;}

/* add-comment box */
comentario-comments .comentario-root .comentario-add-comment-host{background:var(--raised) !important;
  border:1px solid var(--border) !important;border-radius:6px !important;box-shadow:none !important;}
comentario-comments .comentario-root .comentario-add-comment-host:hover,comentario-comments .comentario-root .comentario-add-comment-host:focus{
  border-color:var(--accent-dim) !important;outline:none !important;}
comentario-comments .comentario-root .comentario-add-comment-placeholder{color:var(--faint) !important;font-family:var(--mono) !important;font-size:13px !important;}
comentario-comments .comentario-root textarea,comentario-comments .comentario-root input[type="text"]{
  background:var(--raised) !important;border:1px solid var(--border) !important;
  color:var(--text) !important;border-radius:5px !important;font-family:var(--sans) !important;}
comentario-comments .comentario-root textarea:focus,comentario-comments .comentario-root input:focus{border-color:var(--accent-dim) !important;box-shadow:none !important;outline:none !important;}

/* thread toolbar */
comentario-comments .comentario-root .comentario-thread-toolbar{font-family:var(--mono) !important;font-size:12px !important;
  border:none !important;color:var(--faint) !important;}
comentario-comments .comentario-root .comentario-comment-count{color:var(--faint) !important;font-family:var(--mono) !important;font-size:12px !important;}

/* comment cards + thread lines */
comentario-comments .comentario-root .comentario-card{border:none !important;background:transparent !important;box-shadow:none !important;}
comentario-comments .comentario-root .comentario-card-self{background:var(--surface) !important;border:1px solid var(--border-soft) !important;
  border-radius:6px !important;padding:12px 14px !important;margin:10px 0 !important;}
comentario-comments .comentario-root .comentario-card-body{color:var(--text) !important;}
comentario-comments .comentario-root .comentario-card-body p{margin:0 0 .5em !important;}
comentario-comments .comentario-root .comentario-border-20{border-color:var(--border) !important;}
comentario-comments .comentario-root .comentario-card-expand-toggler:hover{border-color:var(--accent-dim) !important;}
comentario-comments .comentario-root .comentario-subtitle,comentario-comments .comentario-root .comentario-subtitle a,comentario-comments .comentario-root .comentario-subtitle span{
  color:var(--faint) !important;font-size:12px !important;}
comentario-comments .comentario-root .comentario-subtitle a:hover{color:var(--accent) !important;}
comentario-comments .comentario-root .comentario-score{color:var(--muted) !important;font-family:var(--mono) !important;}
comentario-comments .comentario-root .comentario-badge{background:transparent !important;border:1px solid var(--accent-dim) !important;
  color:var(--accent) !important;border-radius:4px !important;font-family:var(--mono) !important;
  font-size:10px !important;letter-spacing:.05em !important;}

/* footer */
comentario-comments .comentario-root .comentario-footer{margin-top:10px !important;}
comentario-comments .comentario-root .comentario-footer a{color:var(--faint) !important;font-size:12px !important;}
comentario-comments .comentario-root .comentario-footer a:hover{color:var(--muted) !important;}

/* light-mode syntax highlighting (hljs tokens are too pale on cream) */
html.theme-light #content pre code{color:#3a342a;}
html.theme-light #content .hljs-keyword,html.theme-light #content .hljs-built_in,
html.theme-light #content .hljs-type,html.theme-light #content .hljs-symbol{color:#8a5200 !important;}
html.theme-light #content .hljs-string,html.theme-light #content .hljs-regexp{color:#4a6d3a !important;}
html.theme-light #content .hljs-comment,html.theme-light #content .hljs-quote{color:#8a8171 !important;}
html.theme-light #content .hljs-number,html.theme-light #content .hljs-literal{color:#9c4f2e !important;}
html.theme-light #content .hljs-title,html.theme-light #content .hljs-function,
html.theme-light #content .hljs-attr,html.theme-light #content .hljs-name{color:#2f5d7c !important;}

/* hardened light/dark widget bits */
comentario-comments .comentario-root .comentario-name,
comentario-comments .comentario-root .comentario-name-wrap .comentario-name{
  color:var(--text) !important;opacity:1 !important;font-weight:600 !important;}
comentario-comments .comentario-root .comentario-avatar,
comentario-comments .comentario-root .comentario-avatar[class*="comentario-bg-"]{
  background:var(--raised) !important;color:var(--accent) !important;
  border:1px solid var(--border) !important;border-radius:6px !important;}
comentario-comments .comentario-root [class*="comentario-border-"]{border-color:var(--border) !important;}

/* table of contents (#toc-pane > h3 + ul#toc) — sticky right rail, toggleable */
#right-pane{flex-direction:row;align-items:flex-start;} /* flex-start, NOT stretch: stretch pins #main to pane height, making #main the scroller and starving the #right-pane scroll-spy */
#main{flex:1;min-width:0;}
#toc-pane{width:230px;flex:none;order:2;position:sticky;top:0;align-self:flex-start;
  max-height:calc(100vh - 59px);overflow-y:auto;padding:48px 24px 32px 0;
  background:transparent !important;box-shadow:none !important;border:none !important;margin:0 !important;}
html.toc-pane-collapsed #toc-pane{display:none !important;}
#toc-pane h3{font-family:var(--mono);font-size:11px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;color:var(--faint);margin:0 0 10px;}
#toc-pane ul{list-style:none;margin:0;padding:0;}
#toc-pane ul ul{padding-left:12px;}
#toc-pane li{margin:0;}
#toc-pane a{display:block;padding:4px 10px;border-left:2px solid var(--border-soft);
  color:var(--muted) !important;font-size:13px;line-height:1.45;}
#toc-pane a:hover{color:var(--text) !important;text-decoration:none;}
#toc-pane a.active,#toc-pane li.active > a{color:var(--accent) !important;border-left-color:var(--accent);}
@media (max-width:1150px){
  #toc-pane{position:fixed;right:0;top:59px;width:240px;max-height:min(60vh,480px);
    background:var(--surface) !important;border:1px solid var(--border) !important;border-right:none !important;
    border-radius:0 0 0 10px;padding:18px 20px;z-index:45;
    box-shadow:-12px 12px 32px rgb(0 0 0/.3) !important;}
}
@media print{#toc-pane{display:none !important;}}

/* pane scrolling off for print */
@media print{
  #split-pane{height:auto !important;overflow:visible !important;display:block !important;}
  #right-pane,#left-pane{overflow:visible !important;}
}

/* stock tick: #toc li a.active::before is the moving indicator on the #toc track */
#toc li a::before{background:transparent;}
#toc li a.active::before{background:var(--accent) !important;}
#toc::before{background:var(--border) !important;}
/* drop my per-link border in favor of the stock track+tick */
#toc-pane a{border-left:none !important;}

/* ≤768px: the header buttons toggle body.menu-open / body.toc-open (per scripts.js), not the collapse classes */
@media (max-width: 48em){
  #left-pane,#toc-pane{position:fixed;top:0;bottom:0;width:80%;max-width:300px;
    background:var(--surface) !important;z-index:50;overflow-y:auto;transition:transform 200ms ease;
    display:flex;flex-direction:column;border:none !important;border-radius:0;box-shadow:none !important;}
  #left-pane{left:0;transform:translateX(-100%);}
  #toc-pane{right:0;left:auto;transform:translateX(100%);padding:20px;max-height:none;}
  html.toc-pane-collapsed #toc-pane{display:flex !important;}
  html.left-pane-collapsed #left-pane{display:flex;width:80%;}
  body.menu-open #left-pane,body.toc-open #toc-pane{transform:translateX(0);box-shadow:0 0 60px rgb(0 0 0/.5) !important;}
}

/* child-note pills (home page) — match footer nav buttons, no hover motion */
#childLinks li{background:transparent !important;border-radius:0 !important;}
#childLinks li a,#childLinks.grid li a{
  font-family:var(--mono) !important;font-size:13px !important;color:var(--muted) !important;
  background:var(--surface) !important;border:1px solid var(--border) !important;border-radius:4px !important;
  padding:9px 15px !important;transform:none !important;box-shadow:none !important;
  transition:color .12s,border-color .12s !important;}
#childLinks li a:hover,#childLinks.grid li a:hover{
  color:var(--accent) !important;border-color:var(--accent-dim) !important;
  background:var(--surface) !important;transform:none !important;text-decoration:none !important;}
#childLinks{border-top-color:var(--border-soft) !important;}
