:root{--ink:#1f2328;--soft:#5d6470;--rule:#e4e1da;--bg:#fdfcf9;--card:#f4f1ea}
@media (prefers-color-scheme:dark){:root{--ink:#ecebe7;--soft:#a3a8b0;--rule:#34363b;--bg:#17181b;--card:#202226}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:18px/1.7 Charter,"Bitstream Charter","Sitka Text",Cambria,serif}
a{color:var(--accent);text-underline-offset:2px}
.shell{max-width:1180px;margin:0 auto;padding:0 20px}
.site-header{border-bottom:1px solid var(--rule)}
.header-row{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:64px}
.site-name{font:600 21px/1.2 "Gill Sans","Gill Sans MT",Calibri,sans-serif;color:var(--ink);text-decoration:none;letter-spacing:.02em}
.toc-btn,.close-btn{font:15px "Gill Sans","Gill Sans MT",Calibri,sans-serif;background:var(--card);color:var(--ink);border:1px solid var(--rule);border-radius:999px;padding:7px 16px;cursor:pointer}
.overlay{position:fixed;inset:0;z-index:20;background:var(--bg);overflow-y:auto}
.overlay[hidden]{display:none}
.overlay-panel{padding-top:20px;padding-bottom:40px;position:relative}
.close-btn{position:sticky;top:12px;float:right;font-size:22px;line-height:1;padding:6px 14px}
.overlay-cols{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:26px;clear:both;padding-top:10px}
.overlay-head{display:block;font:600 18px/1.3 "Gill Sans","Gill Sans MT",Calibri,sans-serif;color:var(--ink);text-decoration:none;border-bottom:2px solid var(--accent);padding-bottom:6px;margin-bottom:8px}
.overlay-col ul{list-style:none;margin:0;padding:0;font-size:16px}
.overlay-col li{margin:6px 0}
.home{padding:34px 20px 40px}
.home-head h1{font-size:clamp(30px,4.5vw,46px);line-height:1.15;margin:0 0 12px;max-width:22ch}
.home-head p{font-size:20px;color:var(--soft);max-width:60ch}
.chapters{list-style:none;margin:30px 0;padding:0;border-top:1px solid var(--rule)}
.chapters li{display:flex;gap:18px;padding:16px 0;border-bottom:1px solid var(--rule)}
.num{font:600 15px/1.9 "Gill Sans","Gill Sans MT",Calibri,sans-serif;color:var(--accent);min-width:28px}
.chapters a{font-size:21px;font-weight:600;text-decoration:none;color:var(--ink)}
.chapters p{margin:4px 0 0;color:var(--soft);font-size:16px}
.page-grid{display:grid;grid-template-columns:1fr;gap:30px;padding-top:26px;padding-bottom:40px}
@media (min-width:1000px){.page-grid{grid-template-columns:240px minmax(0,720px)}.outline nav{position:sticky;top:20px}}
.outline{font:15px/1.5 "Gill Sans","Gill Sans MT",Calibri,sans-serif}
.outline ul,.next-read ul{list-style:none;margin:0;padding:0}
.outline li{margin:7px 0}
.outline a{color:var(--soft);text-decoration:none}
.outline-title{font:600 13px "Gill Sans","Gill Sans MT",Calibri,sans-serif;text-transform:uppercase;letter-spacing:.12em;color:var(--soft);margin:0 0 8px}
.where{font:14px "Gill Sans","Gill Sans MT",Calibri,sans-serif;color:var(--soft);margin:0 0 8px}
.entry-title{font-size:clamp(28px,4vw,40px);line-height:1.18;margin:0 0 8px}
.entry-date{font:14px "Gill Sans","Gill Sans MT",Calibri,sans-serif;color:var(--soft);margin:0 0 22px}
.entry h2{font-size:26px;line-height:1.25;margin:34px 0 10px}
.entry h3{font-size:21px;margin:24px 0 8px}
.entry blockquote{margin:20px 0;padding:4px 20px;border-left:2px solid var(--accent);color:var(--soft)}
.entry table{border-collapse:collapse;display:block;overflow-x:auto;font-size:16px}
.entry th,.entry td{border-bottom:1px solid var(--rule);padding:7px 10px;text-align:left}
.qa details{border-bottom:1px solid var(--rule);padding:10px 0}
.qa summary{cursor:pointer;font-weight:600}
.aside-note{background:var(--card);border-radius:10px;padding:16px 20px;margin:28px 0;font-size:16px}
.aside-note h2{font:600 17px "Gill Sans","Gill Sans MT",Calibri,sans-serif;margin:0 0 6px}
.aside-note p{margin:4px 0}
.next-read{margin-top:30px;padding-top:16px;border-top:1px solid var(--rule)}
.next-read li{margin:8px 0}
.site-footer{border-top:1px solid var(--rule);padding:26px 0 36px;font:14px/1.6 "Gill Sans","Gill Sans MT",Calibri,sans-serif;color:var(--soft)}
.footer-grid{display:grid;grid-template-columns:1fr;gap:16px}
@media (min-width:800px){.footer-grid{grid-template-columns:2fr 1fr}}
.footer-links{list-style:none;margin:0;padding:0;columns:2;column-gap:24px}
.footer-links a,.footer-meta a{color:var(--soft)}
.footer-meta p{margin:0 0 6px}
