@font-face {
  font-family: 'Rubik Microbe';
  src: url('RubikMicrobe-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root{--sand-l:#f5e7c3;--sand:#e3ce9e;--sand-d:#c9ab72;--dune:#7a5c30;--ink:#241b0e;
 --spice:#a34e22;--glow:#ffdba3;--card:#faf0d8}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:
  repeating-linear-gradient(178deg,transparent 0 3px,rgba(139,105,55,.025) 3px 4px),
  repeating-linear-gradient(2deg,transparent 0 7px,rgba(160,120,60,.02) 7px 8px),
  linear-gradient(178deg,var(--sand-l) 0%,var(--sand) 35%,#d8c290 65%,var(--sand-d) 100%);
 color:var(--ink);font:400 17px/1.75 Charter,'Iowan Old Style',Georgia,serif;min-height:100vh}
#dust{position:fixed;inset:0;pointer-events:none;z-index:5}
.shell{max-width:1120px;margin:0 auto;padding:0 1.5rem;display:grid;
 grid-template-columns:280px minmax(0,1fr);gap:2.5rem}
details.mobile-menu{display:none}
/* ---------- sidebar ---------- */
aside{position:sticky;top:0;height:100vh;overflow-y:auto;padding:2rem 0 3rem;
 scrollbar-width:thin;scrollbar-color:var(--sand-d) transparent}
.brand{font-family:'Rubik Microbe',Georgia,serif;font-weight:400;font-size:2rem;letter-spacing:.1em;
 text-transform:uppercase;color:#3d2a10;text-decoration:none;display:block;
 text-shadow:0 1px 0 #fff4,0 0 18px rgba(255,219,163,.4);margin-bottom:.3rem}
.brand-sub{display:none}
aside nav{display:flex;flex-direction:column;gap:1px;border-left:3px solid var(--sand-d)}
aside nav a{color:var(--ink);text-decoration:none;font-size:.86rem;line-height:1.35;
 padding:.45rem .9rem;border-left:3px solid transparent;margin-left:-3px;transition:.15s}
aside nav a:hover{background:#fff3;border-color:var(--spice)}
aside nav a.on{background:#fff5;border-color:var(--spice);color:var(--spice);font-weight:600}
aside nav a.lvl3{padding-left:1.6rem;font-size:.82rem}
/* ---------- content ---------- */
main{padding:2.5rem 0 5rem;min-width:0}
.hero{text-align:center;padding:3.5rem 0 3rem;border-bottom:2px solid var(--sand-d);margin-bottom:2.5rem}
.hero h1{font-family:'Rubik Microbe',Georgia,serif;font-weight:400;font-size:clamp(3rem,6.5vw,5rem);
 letter-spacing:.16em;text-transform:uppercase;color:var(--dune);line-height:1;
 text-shadow:2px 3px 0 #fff5,0 0 40px var(--glow)}
.hero .sub{margin-top:.8rem;font-style:italic;font-size:1.3rem;color:var(--spice)}
main section{background:var(--card);border:1px solid var(--sand-d);border-radius:12px;
 padding:2.2rem 2.8rem;margin:0 0 2.2rem;box-shadow:0 3px 18px #00000022;
 scroll-margin-top:1.5rem;position:relative}
main section::before{content:'';position:absolute;top:0;left:2.8rem;right:2.8rem;height:3px;
 background:linear-gradient(90deg,transparent,var(--spice) 15%,var(--dune) 50%,var(--spice) 85%,transparent);
 border-radius:0 0 3px 3px;opacity:.6}
main section h2{font:700 1.55rem/1.3 Georgia,serif;color:var(--dune);margin:0 0 1.2rem;
 padding:0 0 .6rem;border-bottom:2px solid var(--sand-d)}
main section h3{font:700 1.15rem/1.3 Georgia,serif;color:var(--spice);margin:1.4rem 0 .5rem}
main section h4{font-weight:700;margin:1.1rem 0 .3rem;color:var(--dune)}
main section p{margin:.75rem 0}
main section ul,main section ol{margin:.75rem 0 .75rem 1.4rem}
main section li{margin:.3rem 0}
main section code{background:var(--sand);padding:.12rem .4rem;border-radius:4px;font-size:.86em;
 font-family:'SF Mono',Consolas,monospace}
main section pre{background:#241b0e;color:#f0e2bf;border-radius:10px;padding:1.1rem 1.3rem;
 overflow-x:auto;margin:1rem 0;font-size:.85rem;line-height:1.5}
main section pre code{background:none;color:inherit;padding:0}
main section table{border-collapse:collapse;width:100%;margin:1.2rem 0;font-size:.9rem;display:block;overflow-x:auto}
main section th{background:var(--sand);font-weight:700}
main section td,main section th{border:1px solid var(--sand-d);padding:.5rem .7rem;text-align:left;vertical-align:top}
main section blockquote{border-left:4px solid var(--spice);padding:.4rem 1rem;margin:1rem 0;
 color:#4d3d22;font-style:italic;background:#fff3;border-radius:0 8px 8px 0}
main section hr{border:none;border-top:1px solid var(--sand-d);margin:1.5rem 0}
main section strong{color:#1a1207}
.sig{text-align:right;font-style:italic;color:var(--spice);font-size:1.05rem;margin-top:1.5rem}
.sig a{color:inherit;text-decoration-thickness:1px;text-underline-offset:3px}
.meta{font-size:.8rem;color:#7a5c30;margin-bottom:.4rem;letter-spacing:.04em;text-transform:uppercase}
footer.site{grid-column:1/-1;text-align:center;padding:2rem 0 2.5rem;color:var(--dune);font-size:.85rem}
@media(max-width:860px){
 .shell{grid-template-columns:1fr;gap:0}
 details.mobile-menu{display:block;position:fixed;top:0;left:0;right:0;z-index:100;
  background:rgba(245,231,195,.97);border-bottom:2px solid var(--sand-d);
  box-shadow:0 2px 12px #0002;backdrop-filter:blur(8px)}
 details.mobile-menu summary{list-style:none;cursor:pointer;padding:.8rem 1.2rem;
  font-family:'Rubik Microbe',Georgia,serif;font-size:1.4rem;color:#3d2a10;
  text-transform:uppercase;letter-spacing:.1em;display:block;user-select:none}
 details.mobile-menu summary::-webkit-details-marker{display:none}
 details.mobile-menu summary::after{content:'☰';float:right;font-size:1.3rem;color:var(--dune)}
 details.mobile-menu[open] summary::after{content:'✕'}
 details.mobile-menu nav{display:block;padding:.5rem 1.2rem 1.5rem;border-top:1px solid var(--sand-d);
  max-height:calc(100vh - 60px);overflow-y:auto}
 details.mobile-menu nav a{display:block;padding:.55rem .8rem;border-left:3px solid transparent;
  border-radius:0 8px 8px 0;color:var(--ink);text-decoration:none;font-size:.88rem}
 details.mobile-menu nav a:hover{background:#fff3;border-left-color:var(--spice)}
 aside{display:none}
 main{padding:0 1rem 3rem}
 .hero{padding:4.5rem 0 2rem}
 main section{scroll-margin-top:4.2rem;padding:1.4rem 1.2rem}
 main section::before{left:1.2rem;right:1.2rem}
}

main section.group-header{background:none;border:none;box-shadow:none;padding:0 0 .5rem;
 scroll-margin-top:1.5rem}
main section.group-header::before{display:none}
main section.group-header h2{font:400 2rem/1.2 'Rubik Microbe',Georgia,serif;color:var(--dune);
 letter-spacing:.08em;text-transform:uppercase;border-bottom:3px double var(--sand-d);
 padding:1.5rem 0 .7rem;margin:1rem 0 .5rem;text-shadow:1px 2px 0 #fff4,0 0 20px var(--glow)}