/* Pure Focus app - DARK SYSTEM. Brand brief compliance:
- Canvas #030303, warm cards #1b1815, gold #b47e37.
- Unbounded for headlines, Mulish for body.
- NO gradients, NO shadows, NO neon. Thin hairline borders only. */
/* BL-16b (2026-05-16) perf — Google Font @imports moved to
in base.html . Loading via @import here was render-blocking sequential
(browser downloads app.css → parses → discovers @import → downloads font CSS
→ downloads font files). Parallel tags in cut ~300-500ms off
first paint on mobile. Same fonts, same weights, identical visuals. */
:root {
--canvas: #030303;
--warm: #1b1815;
--warm-raised: #2b2520;
--hairline: #2b2520;
--hairline-dim: #1f1c19;
--text: #fdfdff;
--text-secondary: #c2bfbc;
--text-dim: #8a8785;
--gold: #b47e37;
--gold-hi: #d8b58f;
--red: #e93d3d; /* anti-pattern only */
--radius: 4px; /* flat, minimal */
--radius-card: 8px;
/* Top-header height. Single source of truth so msg-wrap / chat-wrap can
subtract the right amount from 100dvh on every body+viewport combo.
Adjusted by media-query overrides below. */
--pf-header-h: 56px;
}
/* Mobile, client (or unauthenticated): header is single-row, ~52px */
@media (max-width: 768px) {
:root { --pf-header-h: 52px; }
}
/* Mobile, coach: header is two rows (brand + horizontal nav), ~84px measured.
This MUST match the actual computed height of body.coach-body header.top
on mobile - if the header layout changes, bump this. */
@media (max-width: 768px) {
body.coach-body { --pf-header-h: 84px; }
}
* { box-sizing: border-box; }
html, body {
margin: 0;
padding: 0;
background: var(--canvas);
color: var(--text);
font-family: 'Lato', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
font-size: 16px;
line-height: 1.55;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
/* ============================================================
Bundle AB-2 (2026-04-30) — Global native-form-box purge.
Project-wide sweep extending Bundle AA-1: every coach + client
surface had bare ,