/* Tokens are NOT defined here — they live in tokens.json / tokens.light.json and are emitted into :root by the host at render time (or by build-preview.mjs for local preview), matching every other Tovu theme's convention. This file is mode-agnostic on purpose: it reads var(--x) only, so the same stylesheet serves both modes. */ /* Self-hosted Geist — deliberately vendored, never fetched from a CDN, the same rationale NOTICE.md already records for the kUInetic bundle. This site's published Privacy Policy states plainly that no third-party resource loads and no visitor data reaches any CDN; a `fonts.googleapis.com` stylesheet link here would falsify that document, so the faces are declared against files this theme ships itself (`assets/fonts/`, SIL OFL 1.1, licence text vendored beside them — see NOTICE.md, "Self-hosted Geist"). Until this block existed, `tokens.json` named 'Geist'/'Geist Mono' as the display, body and mono faces and nothing ever fetched them: the manifest's `fonts` array is read only by `fontLink()` inside `pageShell()`, the declarative document shell, which a static-tier theme never reaches because it ships its own head. Every page silently rendered in the fallback stack. These url()s are RELATIVE on purpose. This stylesheet is served at `/theme-assets/tovu-theme/css/theme.css`, so `../assets/fonts/` resolves to `/theme-assets/tovu-theme/assets/fonts/` with no path rewriting anywhere — the same self-resolving arrangement `apps/site-chat/public/remixicon.css` uses for its own woff2. Relative is also the only form that survives a base-path static export: `platform/export/site-exporter.ts` follows one hop into a fetched stylesheet's own url() references, so these files ARE discovered and exported, but it deliberately does not rewrite them, so an absolute `/theme-assets/...` url would 404 under any non-root base path. One VARIABLE file per family (wght 100-900) rather than the static 400/500 instances the manifest used to name: the rules below use 400, 500 and 600, and static 400/500 files would have left every 600 rule synthesising a faux bold. `font-display: swap` keeps first paint on the fallback stack the tokens already declare instead of blocking on the font. */ @font-face { font-family: 'Geist'; src: url('../assets/fonts/geist-var.woff2') format('woff2'); font-weight: 100 900; font-style: normal; font-display: swap; } @font-face { font-family: 'Geist Mono'; src: url('../assets/fonts/geist-mono-var.woff2') format('woff2'); font-weight: 100 900; font-style: normal; font-display: swap; } * { box-sizing: border-box; } html { scroll-behavior: smooth; } /* Classic (non-`position: fixed`) sticky footer: on a page shorter than the viewport the footer still sits at the bottom instead of floating mid-page; on a long page it scrolls normally and never overlays content. This relies on every page template in `render/pages/` rendering the SAME flat sibling structure once the header/footer partial-embed markers are substituted (embed markers swap the whole marker element — see `.site-header`'s own comment below on why the header ends up a sibling, not an ancestor, of page content): `
…
…
`. Verified against all 14 templates in `render/pages/`, including the grid/sidebar layouts (`docs.html`'s `
`, `posts-sidebar.html`'s `
` wrapping a nested `.docs-layout` div) — `
` is always the one element between header and footer, so growing it via `flex: 1 0 auto` below is what pins the footer without a fixed/absolute footer and without reserving space with `padding-bottom` (which does not actually pin anything). `min-height`, not `height`, so a page taller than the viewport is free to grow past 100vh instead of being clipped or forcing internal scroll. `.site-header`'s own `position: sticky` is unaffected — sticky positioning works the same whether its containing block is a flex item or a plain block child. */ body { margin: 0; background: var(--bg); color: var(--fg); font-family: var(--font-body); font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased; display: flex; flex-direction: column; min-height: 100vh; } main { flex: 1 0 auto; } /* `video`/`iframe` are constrained on the same terms as `img`, not as an afterthought: all three are REPLACED elements, so they size from their own intrinsic dimensions and ignore the width of whatever box an author put them in. A media embed resolves to a bare `