:root{ /* The same colors as r,g,b lists for the see-through tints, and the surface of inputs, swatches and cards, so a brand theme (brand.css) recolors every page. */ --brass-rgb:176,141,87; --ivory-rgb:34,30,25; --ink-rgb:236,228,221; --surface:#fff; --surface-rgb:255,255,255; --ink:#ECE4DD; --ivory:#221E19; --ivory-dim:rgba(var(--ivory-rgb),0.62); --brass:#B08D57; --brass-light:#C9A467; --oxblood:#5C2430; --line: rgba(var(--ivory-rgb),0.14); --card-tint: rgba(var(--ivory-rgb),0.035); --overlay-ivory:#F2EDE3; --overlay-line: rgba(242,237,227,0.16); } *{box-sizing:border-box;} /* overflow-x:clip (not :hidden) on purpose: any non-"visible" overflow-x without a matching overflow-y makes the browser implicitly set overflow-y to "auto" too, which turns html/body into their own scroll container -- and that's what silently breaks position:sticky on nav below (a sticky element sticks to its *nearest* scrolling ancestor; with html/body only ever "auto" in theory and never actually scrolling themselves, real page scrolling on the true window scroller stopped moving nav at all). "clip" prevents horizontal overflow the same as "hidden" without tripping that implicit-auto rule. */ html{max-width:100%;overflow-x:clip;} body{margin:0;background:var(--ink);color:var(--ivory);font-family:'Inter',sans-serif;max-width:100%;overflow-x:clip;} h1,h2,h3{font-family:'Playfair Display',serif;font-weight:600;margin:0;} p{margin:0;} .wrap{max-width:1180px;margin:0 auto;padding:0 32px;} /* Sticky (not fixed-over-content) so Start Over -- and the rest of the nav -- stays reachable at any scroll depth without ever sitting on top of page content: it occupies its own strip at the top of the viewport, pushing nothing, covering nothing. The bar itself spans the full width (so its background covers edge-to-edge on screens wider than the 1180px content column -- otherwise page content would show through on either side once it's sticky); .nav-inner keeps the actual nav content centered the same way the old single