Colophon.

The site uses four typefaces. Fraunces by Phaedra Charles, Flavia Zimbardi and Undercase Type is the display face — used for the wordmark, hero headings, and pull quotes. Manrope by Mikhail Sharanda is the UI face — used for navigation, body running text, and form controls. Source Serif 4 by Frank Grießhammer is the prose face — used inside blog posts and legal text where extended reading is expected. JetBrains Mono by Philipp Nurullin and Konstantin Bulenkov is the code face — used for build hashes, timestamps, and any reference to a path or identifier.

All fonts are self-hosted as WOFF2 from /fonts/. There are no requests to Google Fonts or any external CDN. Metric-matched fallbacks (Iowan Old Style for Fraunces; system UI sans for Manrope; Charter for Source Serif 4; SF Mono for JetBrains Mono) absorb the swap so layout does not shift when the WOFF2 arrives.

The design system is defined in src/styles/tokens.json and rendered as CSS custom properties in src/styles/global.css. There is no Tailwind, no utility framework, no component library. Every class name is qf- prefixed and role-based.

The accent colour is #0F1E3D in light mode and #B8C4DC in dark mode. Dark mode is honoured via @media (prefers-color-scheme: dark) — there is no toggle and no stored preference. Theme follows the operating system.

The type scale is a small set of named classes — .text-display-xl through .text-code-sm — sized in clamp() so the same class works fluidly from mobile to a wide desktop. The wordmark rule is exactly 3 px; the rule width tracks the text width using display: inline-block.

The site is built with Astro 6 using the content layer. Products, blog posts, and legal documents are MDX files in src/content/, validated by strict Zod schemas. Adding a new product means dropping two MDX files and rebuilding — no .astro files are touched.

The static build is served by a small Express runtime in server.js. The runtime walks every HTML file in dist/ at startup, extracts each inline <script> body, computes its SHA-256, and includes the hash list in the page's Content Security Policy. Adding or removing an inline script anywhere in the site causes the hash set to rebuild on the next deploy automatically.

OG images are generated by scripts/build-og.mjs using satori and resvg-js. Favicons and OS icons (192/512, any + maskable) are generated by scripts/build-assets.mjs from the brand kit, with AVIF + WebP siblings emitted for every product screenshot.

The only third-party script on the site is Google Analytics 4. It is loaded with async and is opted out automatically when the visitor's browser sends Sec-GPC: 1 (Global Privacy Control) or Save-Data: on. Both signals disable GA4 before any tag fires. Cookie disclosure is in the cookie policy.

No social embeds, no ad networks, no analytics beyond GA4, no behavioural tracking. Permissions-Policy denies interest-cohort (FLoC), browsing-topics (Topics API), and attribution-reporting, so the site opts out of every modern attribution surface Chrome ships by default.

Content Security Policy is computed at server startup from the contents of dist/ — every inline script body is hashed and included in the policy. CSP3-aware browsers prefer the hashes and ignore the 'unsafe-inline' fallback, which is kept only for CSP2 compatibility.

HSTS is set to two years with includeSubDomains and preload. Cross-Origin-Opener-Policy and Cross-Origin-Resource-Policy are both same-origin. Trusted Types are advertised in report-only mode to surface DevTools violations without breaking GA4.

Coordinated disclosure goes through /.well-known/security.txt.

Heading hierarchy is strict, landmarks are explicit, the skip link is the first focusable element on every page. Body text meets 4.5:1 contrast; large text and UI components meet 3:1, verified in both themes. Focus indicators use a 3 px outline with 3 px offset. The site responds to prefers-reduced-motion, prefers-reduced-transparency, and prefers-contrast: more.

The full statement is at /legal/accessibility/.

The build output is fully static. The Node runtime adds three POST endpoints — /contact/, /waitlist/, /support/ — that share a single rate limiter (5 submissions per IP per hour) and a single inbox at hello@quietfield.in. There is no database; waitlist signups append to flat files in data/ and are de-duped on resubmit.

Build metadata — short SHA and date — is surfaced in the footer at 512fa37 · 2026-05-29. The sitemap uses per-URL lastmod read from each source file's git history.