:root{
    --bg:#f8f9fa; --panel:#ffffff; --panel-2:#f1f3f4;
    --line:#dadce0; --line-soft:#e8eaed;
    --text:#202124; --text-2:#5f6368; --muted:#80868b;
    --accent:#1a73e8; --accent-weak:#e8f0fe;
    --gold:#b8901f; --silver:#7e8794; --bronze:#a96b3c;
    --bar-track:#e8eaed; --fav-bg:#fbf3da; --fav-bg-h:#f5e8bf; --zebra:#f3f4f6;
    --shadow:0 1px 2px 0 rgba(60,64,67,.1), 0 2px 6px 2px rgba(60,64,67,.06);
    --header-bg:rgba(255,255,255,.82);
    --mono:"SF Mono",ui-monospace,"JetBrains Mono","Roboto Mono",Menlo,Consolas,monospace;
    --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,Helvetica,Arial,sans-serif;
  }
@media (prefers-color-scheme: dark){
    html:not([data-theme="light"]){
      --bg:#202124; --panel:#2a2b2e; --panel-2:#35363a;
      --line:#3c4043; --line-soft:#303134;
      --text:#e8eaed; --text-2:#9aa0a6; --muted:#80868b;
      --accent:#8ab4f8; --accent-weak:#283446;
      --gold:#d6ab43; --silver:#aab2bf; --bronze:#cf8a55;
      --bar-track:#3c4043; --fav-bg:#322b17; --fav-bg-h:#3c3420; --zebra:#26282b;
      --shadow:0 1px 2px 0 rgba(0,0,0,.3), 0 2px 6px 2px rgba(0,0,0,.25);
      --header-bg:rgba(32,33,36,.8);
    }
  }
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--bg); color:var(--text); font-family:var(--sans); font-size:14px; line-height:1.5; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:none}
.top{position:sticky; top:0; z-index:40; display:flex; align-items:center; gap:1.1rem; flex-wrap:wrap; row-gap:.5rem; padding:.72rem 1.5rem; background:var(--header-bg); backdrop-filter:blur(14px) saturate(1.6); -webkit-backdrop-filter:blur(14px) saturate(1.6); border-bottom:1px solid var(--line); box-shadow:0 6px 20px -12px rgba(20,22,40,.25)}
.brand{white-space:nowrap; width:calc(264px - .85rem); display:flex; align-items:center; gap:.55rem}
/* spans the sidebar width (type filter aligns with the content column); holds the home link + Timeline/RFC */
  .brand-name{font-weight:750; font-size:1.06rem; letter-spacing:-.02em; color:var(--text); text-decoration:none; cursor:pointer; flex:none}
.brand-name:hover{opacity:.82}
.brand-name b{color:var(--accent)}
.top-links{display:flex; align-items:center; gap:.25rem}
.icon-btn{display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:8px; border:1px solid var(--line); background:var(--panel); color:var(--text-2); cursor:pointer; font-size:.9rem}
.icon-btn:hover{color:var(--text); border-color:var(--accent)}
.icon-btn svg{width:17px; height:17px}
.nav{position:sticky; top:57px; align-self:start; height:calc(100vh - 57px); overflow-y:auto; border-right:1px solid var(--line); padding:.9rem .7rem 3rem; background:transparent; scrollbar-width:thin; scrollbar-color:var(--line) transparent}
.nav::-webkit-scrollbar{width:9px}
.nav::-webkit-scrollbar-thumb{background:var(--line); border-radius:6px; border:2px solid var(--bg)}
.nav::-webkit-scrollbar-thumb:hover{background:var(--muted)}
.nav::-webkit-scrollbar-track{background:transparent}
.nav-mobile{display:none}
/* page search — pinned to the top of the menu so it stays put while the tree scrolls */
  .nav-search{position:sticky; top:0; z-index:2; background:var(--bg); padding:.1rem 0 .55rem}
.ns-box{position:relative}
.ns-box svg{position:absolute; left:.6rem; top:50%; transform:translateY(-50%); color:var(--muted); pointer-events:none}
.nav-search input{font:inherit; font-size:.82rem; width:100%; padding:.45rem .6rem .45rem 1.85rem; background:var(--panel); color:var(--text); border:1px solid var(--line); transition:border-color .15s ease, box-shadow .15s ease}
.nav-search input:focus{outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-weak)}
.nav-search input::-webkit-search-cancel-button{cursor:pointer}
.nav-results{margin-bottom:.7rem}
.nav-res-h{display:flex; justify-content:space-between; gap:.5rem; margin:.15rem .55rem .4rem; font-size:.66rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--muted)}
.nav-res{display:block; width:100%; text-align:left; font:inherit; background:none; border:0; border-left:2px solid transparent; padding:.42rem .55rem; cursor:pointer; color:var(--text-2); text-decoration:none}
.nav-res:hover, .nav-res.sel{background:var(--panel-2); color:var(--text); border-left-color:var(--text-2)}
.nav-res:focus-visible{outline:2px solid var(--accent); outline-offset:-2px}
.nav-res-t{display:block; font-size:.83rem; font-weight:600; color:var(--text)}
.nav-res-c{display:block; font-size:.66rem; color:var(--muted); margin-top:.08rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.nav-res-s{display:block; font-size:.7rem; color:var(--text-2); margin-top:.2rem; line-height:1.4}
.nav-res-s mark{background:var(--accent-weak); color:var(--text); font-weight:600}
.nav-empty{padding:.5rem .6rem; font-size:.78rem; color:var(--muted); line-height:1.5}
.nav-sec{margin-bottom:.4rem}
.nav-sec + .nav-sec{margin-top:1rem}
.nav-sec-h{display:flex; align-items:center; gap:.35rem; margin:.1rem .55rem .45rem; font-size:.66rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--muted)}
.nav-scope, .nav-item, .nav-grp-h, .nav-subgrp-h{transition:background .12s ease, color .12s ease, box-shadow .12s ease, transform .12s ease}
.nav-scope{padding:.38rem .6rem .38rem 1.1rem; border-radius:7px; cursor:pointer; color:var(--text-2); font-size:.84rem; font-weight:500}
.nav-scope:hover{background:var(--panel-2); color:var(--text); transform:translateX(2px)}
.nav-scope.active{background:var(--panel-2); color:var(--text); font-weight:600; box-shadow:inset 2px 0 0 var(--text-2)}
.nav-item{display:flex; align-items:center; justify-content:space-between; gap:.5rem; padding:.4rem .6rem; border-radius:7px; cursor:pointer; color:var(--text-2); font-size:.85rem; font-weight:500}
.nav-item:hover{background:var(--panel-2); color:var(--text); transform:translateX(2px)}
.nav-item.active{background:var(--panel-2); color:var(--text); font-weight:600; box-shadow:inset 2px 0 0 var(--text-2)}
.nav-item .n{font-size:.68rem; color:var(--muted); font-variant-numeric:tabular-nums}
.nav-item:hover .n{color:var(--text-2)}
.nav-item.active .n{color:var(--text-2)}
.nav-grp-h{display:flex; align-items:center; justify-content:space-between; gap:.4rem; padding:.44rem .55rem; border-radius:7px; cursor:pointer; color:var(--text); font-weight:650; font-size:.86rem; user-select:none}
.nav-grp-h:hover{background:var(--panel-2)}
.nav-grp-h.active{background:var(--panel-2); box-shadow:inset 2px 0 0 var(--text-2)}
.nav-grp-t{flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.nav-ico{display:inline-flex; align-items:center; justify-content:center; flex:none; color:var(--muted); transition:color .12s ease}
.nav-ico svg{width:15px; height:15px}
.nav-grp-h:hover .nav-ico, .nav-grp.open>.nav-grp-h .nav-ico{color:var(--text)}
.nav-grp.lvl0>.nav-grp-h{font-size:.9rem; padding:.5rem .55rem}
.nav-subgrp-h{display:flex; align-items:center; gap:.4rem; padding:.34rem .55rem; border-radius:7px; cursor:pointer; color:var(--text-2); font-weight:600; font-size:.78rem; user-select:none}
.nav-subgrp-h:hover{background:var(--panel-2); color:var(--text)}
.caret{display:inline-flex; align-items:center; justify-content:center; width:.85rem; font-size:.62rem; color:var(--muted); transition:transform .22s cubic-bezier(.4,0,.2,1); flex:none}
.nav-grp.open>.nav-grp-h .caret, .nav-subgrp.open>.nav-subgrp-h .caret{transform:rotate(90deg)}
/* smooth accordion: animate the row track 0fr -> 1fr, fade the contents */
  .nav-grp-body{margin-left:.8rem; border-left:1px solid var(--line); padding-left:.5rem; display:grid; grid-template-rows:0fr; transition:grid-template-rows .24s cubic-bezier(.4,0,.2,1)}
.nav-grp.open>.nav-grp-body{grid-template-rows:1fr}
.nav-grp-inner{overflow:hidden; min-height:0; opacity:0; transition:opacity .18s ease .04s}
.nav-grp.open>.nav-grp-body>.nav-grp-inner{opacity:1}
.nav-grp-link{flex:1; min-width:0; color:inherit; font:inherit; text-decoration:none; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.nav-grp-link:hover{text-decoration:underline}
.nav-grp-link.active{color:var(--text); font-weight:600}
/* ── Knowledge Base prose ── */
  .doc-wrap{max-width:880px; animation:docIn .26s cubic-bezier(.2,.6,.2,1)}
.doc-title{font-size:1.7rem; font-weight:750; margin:.1rem 0 1.2rem; color:var(--text); line-height:1.2; letter-spacing:-.01em}
.doc-body{font-size:.92rem; line-height:1.7; color:var(--text-2)}
.doc-body > :first-child{margin-top:0}
.doc-body h2{font-size:1.25rem; font-weight:700; color:var(--text); margin:2rem 0 .8rem; padding-bottom:.35rem; border-bottom:1px solid var(--line); letter-spacing:-.01em}
.doc-body h3{font-size:1.06rem; font-weight:650; color:var(--text); margin:1.6rem 0 .55rem}
.doc-body h4{font-size:.95rem; font-weight:650; color:var(--text); margin:1.3rem 0 .5rem}
.doc-body p{margin:.7rem 0}
.doc-body a{color:var(--accent); text-decoration:none}
.doc-body a:hover{text-decoration:underline}
.doc-body ul,.doc-body ol{margin:.7rem 0; padding-left:1.45rem}
.doc-body li{margin:.3rem 0}
.doc-body li>ul,.doc-body li>ol{margin:.25rem 0}
.doc-body code{font-family:var(--mono); font-size:.84em; background:var(--panel-2); border:1px solid var(--line-soft); border-radius:5px; padding:.08em .36em; color:var(--text)}
.doc-body pre{background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:.9rem 1.1rem; overflow-x:auto; margin:1rem 0; line-height:1.55}
.doc-body pre code{background:none; border:0; padding:0; font-size:.82rem; color:var(--text-2); white-space:pre}
.doc-body blockquote{margin:1rem 0; padding:.2rem .9rem; border-left:3px solid var(--accent-weak); color:var(--muted)}
.doc-body hr{border:0; border-top:1px solid var(--line); margin:1.6rem 0}
.doc-body table{border-collapse:separate; border-spacing:0; width:100%; margin:1.1rem 0; font-size:.85rem; border:1px solid var(--line); border-radius:10px; overflow:hidden}
.doc-body th{text-align:left; font-weight:650; color:var(--text); background:var(--panel-2); padding:.55rem .75rem; border-bottom:1px solid var(--line)}
.doc-body td{padding:.5rem .75rem; border-bottom:1px solid var(--line-soft); vertical-align:top}
.doc-body tr:last-child td{border-bottom:0}
.doc-cards{display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:.7rem; margin:1.2rem 0}
.doc-card{display:flex; flex-direction:column; gap:.3rem; padding:.85rem 1rem; border:1px solid var(--line); border-radius:10px; background:var(--panel); text-decoration:none; transition:border-color .12s, box-shadow .12s, transform .12s}
.doc-card:hover{border-color:var(--accent); box-shadow:var(--shadow); transform:translateY(-1px)}
.doc-card .dc-t{font-weight:650; color:var(--text); font-size:.9rem}
.doc-card .dc-s{color:var(--muted); font-size:.8rem; line-height:1.5}
.type-rules{margin:1.2rem 0; border:1px solid var(--line); border-radius:10px; overflow:hidden}
.type-rules-tabs{display:flex; background:var(--panel-2); border-bottom:1px solid var(--line)}
.type-rules-tab{flex:1; display:flex; align-items:center; justify-content:center; gap:.4rem; padding:.6rem 1rem; font-size:.84rem; font-weight:600; cursor:pointer; border:0; background:transparent; color:var(--muted); font-family:inherit; transition:background .15s ease, color .15s ease}
.type-rules-tab:hover{color:var(--text)}
.type-rules-tab.active{color:var(--text); background:var(--panel)}
.tr-sq{width:9px; height:9px; border-radius:3px; display:inline-block}
.type-rules-panel{display:none; padding:.9rem 1.1rem; font-size:.88rem; line-height:1.7; color:var(--text-2)}
.type-rules-panel.active{display:block}
.doc-tabset{margin:1.1rem 0; border:1px solid var(--line); border-radius:10px; overflow:hidden}
.doc-tabs{display:flex; gap:.25rem; background:var(--panel-2); border-bottom:1px solid var(--line); padding:.3rem .3rem 0}
.doc-tab{padding:.45rem .9rem; font-size:.83rem; font-weight:600; cursor:pointer; border:0; background:transparent; color:var(--muted); border-radius:7px 7px 0 0; font-family:inherit; transition:background .15s ease, color .15s ease}
.doc-tab:hover{color:var(--text)}
.doc-tab.active{color:var(--text); background:var(--panel)}
.doc-tabpanel{display:none; padding:.4rem 1.1rem 1rem}
.doc-tabpanel.active{display:block}
.doc-tabpanel>:first-child{margin-top:0}
/* sharp edges - no rounded corners anywhere */
  *, *::before, *::after{border-radius:0 !important}
/* ── standalone doc-page shell (not present on the board) ─────────────── */
.brand-sub{color:var(--text-2);font-size:.9rem;padding-left:.7rem;border-left:1px solid var(--line)}
.top-links{margin-left:auto}
/* Same two-column shape as the board's .layout; the rail itself is the board's
   .nav, styled by the board's own CSS. */
/* wider than the board's 264px rail: this tree goes five levels deep and
   each level costs .8rem of indent, so names would truncate. */
.docs-layout{display:grid;grid-template-columns:320px 1fr;align-items:start}
.doc-main{min-width:0;padding:1.6rem 2rem 4rem;max-width:900px}
.doc-wrap{max-width:none}
.nav-grp-link{display:block;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:inherit;font:inherit;text-decoration:none}
@media (max-width:820px){.docs-layout{grid-template-columns:1fr}.nav{position:static;height:auto;width:100%;border-right:0;border-bottom:1px solid var(--line)}.doc-main{padding:1.1rem 1.1rem 4rem;max-width:100%}.brand{width:auto}}
