:root {
    --bg:#0f0f0f; --panel:#121212; --panel-2:#161616; --line:#202020;
    --rule:#333333; --fg:#ffffff; --dim:#aaaaaa; --faint:#888888;
    --fainter:#666666;
    /* Code uses the Dark+ palette, the same one the editor shows. */
    --c-com:#6a9955; --c-str:#ce9178; --c-num:#b5cea8; --c-kw:#c586c0;
    --c-bi:#9cdcfe; --c-fn:#dcdcaa; --c-prp:#9cdcfe; --c-op:#d4d4d4;
    --c-nk:#dcdcaa; --c-prm:#9cdcfe; --c-typ:#4ec9b0;
    --sans:"Inter",ui-sans-serif,system-ui,-apple-system,sans-serif;
    --mono:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,monospace;
    color-scheme: dark;
  }
  * { box-sizing:border-box; }
  body { margin:0; background:var(--bg); color:var(--fg); font-family:var(--sans);
         font-size:16px; line-height:1.65; -webkit-font-smoothing:antialiased; }
  a { color:var(--faint); text-decoration:none; }
  a:hover { color:var(--fg); }
  :focus-visible { outline:1px solid var(--faint); outline-offset:3px; }
  code { font-family:var(--mono); font-size:.88em; }
  /* JetBrains Mono ligates --> into an arrow, which hides that a Lua
     comment starts with two dashes. */
  code, pre, .sig, .crumb, .toc a, .toc kbd, .fn-name h1, .pill,
  .pager b, .fn-list a, .code-bar span {
    font-variant-ligatures:none; font-feature-settings:"liga" 0, "calt" 0; }
  button { font:inherit; color:inherit; background:none; border:0; cursor:pointer; }

  .banner { background:var(--panel); border-bottom:1px solid var(--line);
            font-size:13.5px; }
  .banner a { display:block; max-width:1140px; margin:0 auto; padding:9px 20px;
              color:var(--dim); text-align:center; }
  .banner a:hover { color:var(--fg); }
  .banner b { color:var(--fg); font-weight:500; }
  /* ---------------------------------------------------------------- header */
  header { position:sticky; top:0; z-index:20; background:var(--bg);
           border-bottom:1px solid var(--rule); }
  .bar { max-width:1140px; margin:0 auto; padding:0 20px; height:56px;
         display:flex; align-items:center; gap:14px; }
  .brand { display:flex; align-items:baseline; gap:8px; font-weight:700;
           font-size:16px; color:var(--fg); }
  .brand:hover { color:var(--fg); }
  .brand span { font-weight:400; font-size:12px; color:var(--fainter);
                font-family:var(--mono); }
  .bar .right { margin-left:auto; display:flex; align-items:center; gap:18px; }
  .bar .right a { font-size:14px; }

  /* ----------------------------------------------------------------- shell */
  .shell { max-width:1140px; margin:0 auto; padding:36px 20px 72px;
           display:grid; grid-template-columns:216px minmax(0,1fr); gap:44px;
           align-items:start; }

  /* --------------------------------------------------------------- sidebar */
  .toc { position:sticky; top:80px; max-height:calc(100vh - 108px);
         display:flex; flex-direction:column; }
  .toc-search { position:relative; flex:none; margin-bottom:14px; }
  .toc input { width:100%; background:var(--panel); border:1px solid var(--line);
               border-radius:3px; color:var(--fg); font-family:var(--sans);
               font-size:13.5px; padding:7px 32px 7px 10px; }
  .toc input::placeholder { color:var(--fainter); }
  .toc input:focus { outline:none; border-color:var(--rule); }
  .toc kbd { position:absolute; right:8px; top:50%; transform:translateY(-50%);
             font-family:var(--mono); font-size:10.5px; color:var(--fainter);
             border:1px solid var(--line); border-radius:3px; padding:1px 5px;
             pointer-events:none; }
  .toc input:focus + kbd { opacity:0; }
  .toc-list { overflow-y:auto; overscroll-behavior:contain; padding-right:6px;
              scrollbar-width:thin; scrollbar-color:var(--line) transparent; }
  .toc-list::-webkit-scrollbar { width:7px; }
  .toc-list::-webkit-scrollbar-thumb { background:var(--line); border-radius:4px; }
  .toc-list::-webkit-scrollbar-thumb:hover { background:var(--rule); }
  .toc h4 { position:sticky; top:0; z-index:1; margin:16px 0 6px; padding:5px 0;
            background:var(--bg); font-size:11px; letter-spacing:.12em;
            text-transform:uppercase; color:var(--fainter); font-weight:500; }
  .toc h4:first-child { margin-top:0; }
  .toc a { display:block; margin-bottom:3px; padding:4px 9px;
           background:var(--panel); border:1px solid var(--line); border-radius:3px;
           font-family:var(--mono); font-size:12.5px; color:var(--faint);
           white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .toc a:hover { background:var(--panel-2); border-color:var(--rule); color:var(--fg); }
  .toc a.on { background:var(--panel-2); border-color:var(--faint); color:var(--fg); }
  .toc .empty { padding:10px 0 0; font-size:13px; color:var(--fainter); }
  .toc-toggle { display:none; }

  /* -------------------------------------------------------- function page */
  .crumb { font-family:var(--mono); font-size:11.5px; letter-spacing:.06em;
           text-transform:uppercase; color:var(--fainter); margin:0 0 14px; }
  .crumb a { color:var(--fainter); }
  .crumb a:hover { color:var(--fg); }

  .fn-name { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin:0 0 14px; }
  .fn-name h1 { font-family:var(--mono); font-size:24px; font-weight:600;
                margin:0; letter-spacing:-.01em; }
  .pill { font-family:var(--mono); font-size:11px; color:var(--fainter);
          background:var(--panel); border:1px solid var(--line); border-radius:3px;
          padding:1px 6px; }
  .fn > p { margin:0 0 14px; color:var(--dim); max-width:66ch; }
  .fn h2 { font-size:11px; font-weight:500; letter-spacing:.12em;
           text-transform:uppercase; color:var(--fainter); margin:24px 0 8px; }

  .sig { background:var(--panel); border:1px solid var(--line);
         border-left:2px solid var(--rule); border-radius:0 3px 3px 0;
         padding:10px 14px; font-family:var(--mono); font-size:13px;
         line-height:1.6; overflow-x:auto; margin:0 0 14px; white-space:pre; }

  .code { background:var(--panel); border:1px solid var(--line); border-radius:3px;
          overflow:hidden; }
  .code-bar { display:flex; align-items:center; height:30px; padding:0 7px 0 13px;
              border-bottom:1px solid var(--line); }
  .code-bar span { font-family:var(--mono); font-size:10.5px; letter-spacing:.1em;
                   text-transform:uppercase; color:var(--fainter); }
  .copy { margin-left:auto; font-family:var(--mono); font-size:11px;
          color:var(--fainter); padding:3px 8px; border-radius:3px; }
  .copy:hover { background:var(--panel-2); color:var(--fg); }
  .copy.done { color:var(--c-com); }
  .code pre { margin:0; padding:14px 16px; overflow-x:auto; font-family:var(--mono);
              font-size:13px; line-height:1.7; color:var(--c-op);
              scrollbar-width:thin; scrollbar-color:var(--line) transparent; }
  .code pre::-webkit-scrollbar { height:8px; }
  .code pre::-webkit-scrollbar-thumb { background:var(--line); border-radius:4px; }

  .c-com { color:var(--c-com); }
  .c-str { color:var(--c-str); }
  .c-num { color:var(--c-num); }
  .c-kw  { color:var(--c-kw); }
  .c-bi  { color:var(--c-bi); }
  .c-fn  { color:var(--c-fn); }
  .c-prp { color:var(--c-prp); }
  .c-op  { color:var(--c-op); }
  .c-nk  { color:var(--c-nk); }
  .c-prm { color:var(--c-prm); }
  .c-typ { color:var(--c-typ); }

  /* ------------------------------------------------------------- prev/next */
  .pager { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:44px;
           padding-top:24px; border-top:1px solid var(--line); }
  .pager a { display:block; padding:10px 13px; background:var(--panel);
             border:1px solid var(--line); border-radius:3px; }
  .pager a:hover { background:var(--panel-2); border-color:var(--rule); }
  .pager b { display:block; font-family:var(--mono); font-size:13px;
             font-weight:500; color:var(--fg); margin-top:2px;
             white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .pager em { font-style:normal; font-size:11px; letter-spacing:.1em;
              text-transform:uppercase; color:var(--fainter); }
  .pager .next { grid-column:2; text-align:right; }

  /* ----------------------------------------------------------- index page */
  .intro { margin-bottom:36px; }
  .intro h1 { font-size:30px; font-weight:700; margin:0 0 10px; }
  .intro p { margin:0 0 8px; color:var(--dim); max-width:64ch; }
  section + section { margin-top:36px; }
  .sec-head { padding-top:26px; border-top:1px solid var(--line); margin-bottom:16px; }
  .sec-head h2 { margin:0 0 4px; font-size:13px; font-weight:600;
                 text-transform:uppercase; letter-spacing:.1em; color:var(--fainter); }
  .sec-head p { margin:0; color:var(--faint); font-size:14.5px; max-width:64ch; }
  .fn-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr));
             gap:6px; }
  .fn-list a { display:block; padding:6px 10px; background:var(--panel);
               border:1px solid var(--line); border-radius:3px;
               font-family:var(--mono); font-size:12.5px;
               white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .fn-list a:hover { background:var(--panel-2); border-color:var(--rule); }

  /* ------------------------------------------------------------------ misc */
  .top { position:fixed; right:20px; bottom:20px; width:34px; height:34px;
         display:grid; place-items:center; background:var(--panel);
         border:1px solid var(--line); border-radius:3px; color:var(--fainter);
         opacity:0; pointer-events:none; z-index:15; }
  .top.show { opacity:1; pointer-events:auto; }
  .top:hover { color:var(--fg); }

  footer { border-top:1px solid var(--rule); padding:26px 20px 40px;
           text-align:center; font-size:.9rem; color:var(--fainter); }

  @media (max-width:860px) {
    .shell { grid-template-columns:minmax(0,1fr); gap:22px; padding-top:26px; }
    .toc { position:static; max-height:none; }
    .toc-toggle { display:flex; align-items:center; width:100%; margin-bottom:12px;
                  padding:8px 11px; background:var(--panel);
                  border:1px solid var(--line); border-radius:3px;
                  font-size:13.5px; color:var(--dim); }
    .toc-toggle::after { content:"+"; margin-left:auto; font-family:var(--mono);
                         color:var(--fainter); }
    .toc.open .toc-toggle::after { content:"\2212"; }
    .toc-search, .toc-list { display:none; }
    .toc.open .toc-search, .toc.open .toc-list { display:block; }
    .toc.open .toc-list { max-height:52vh; }
    .pager { grid-template-columns:1fr; }
    .pager .next { grid-column:1; }
    .top { display:none; }
  }