/* ============================================================================ SirBoard — documentation viewer Sits on top of sirboard.css and uses only its tokens, so the docs inherit the board/drawing theme switch for free. Layout note: docs is a reading application, not a landing page, so this shell deliberately does NOT wear .wrap. A centred 1240px column leaves the sidebar floating in from the window edge with dead space beside it. The tracks are explicit and packed to the left, and only re-centre once the viewport is wide enough that a left-packed shell would look marooned. ========================================================================= */ :root { /* .topbar is sticky at top:0 and 62px tall plus its 1px rule. Everything that pins below it measures from this one number. */ --docs-header: 63px; } /* ── Shell ───────────────────────────────────────────────────────────────── */ .docs-shell { display: grid; grid-template-columns: 252px minmax(0, 830px) 208px; justify-content: start; gap: clamp(24px, 2.6vw, 44px); align-items: start; padding: 26px clamp(18px, 3vw, 44px) 78px; } /* The middle track is minmax(0, 830px), never 1fr. A flexible middle track keeps the PROSE measured (max-width lives on .markdown) while the TRACK itself grows to the window, which flings the on-this-page rail far away from the text it indexes. With a capped max the rail stays beside the prose and the leftover width is simply left unused on the right. minmax's 0 min still lets the track shrink below 830px when the viewport is narrow, so no width needs its own breakpoint. */ @media (min-width: 1900px) { .docs-shell { justify-content: center; } } @media (max-width: 1180px) { .docs-shell { grid-template-columns: 244px minmax(0, 830px); } .outline { display: none; } } @media (max-width: 880px) { .docs-shell { grid-template-columns: minmax(0, 1fr); gap: 0; padding-top: 16px; } } /* ── Sidebar column ──────────────────────────────────────────────────────── */ /* position:sticky goes on the COLUMN, with a real height, not on the