/* ============================================================================ Human Workday — design tokens HWW/000 · v0.1 · 2026-08 · PUBLIC SITE FOUNDATION Source of authority: 1. Constitution (Articles III, V, VI, XI) 2. Brand Guidelines v1.2 (identity: mark, colour, type, tagline) 3. Territory B — Declared Structure, Protected Reserve (document system) 4. brand/BRAND_SOURCE_RECONCILIATION.md §5 (contrast-verified inks) THIS IS THE ONLY FILE IN THE SITE ALLOWED TO CONTAIN HEX COLOUR LITERALS. Every other stylesheet and page uses var(). The check script enforces this. ============================================================================ */ :root { /* -------------------------------------------------------------------------- COLOUR — the ratified palette, nothing else. Contrast values are measured against Warm Cream (the working ground) per BRAND_SOURCE_RECONCILIATION.md §5. -------------------------------------------------------------------------- */ /* Grounds */ --hw-ground: #F3EBDD; /* Warm Cream — the working page ground */ --hw-paper: #FFFDF8; /* Paper — cards, header, raised surfaces */ /* Identity inks */ --hw-graphite: #16181B; /* authority; body ink 15.02:1 on cream */ --hw-plan-blue: #26405A; /* systems, landmark moments 9.03:1 on cream */ --hw-terracotta: #B4472F; /* true stopping conditions, deliberate human emphasis 4.57:1 on cream */ /* Secondary inks (re-tuned to clear AA on the ratified ground) */ --hw-field-grey: #676B70; /* captions, metadata, field labels 4.53:1 */ --hw-hairline: #85888C; /* meaningful hairlines — NON-TEXT ONLY, 3.01:1 against the 3:1 non-text requirement. Never used as a text colour. */ /* Capacity palette — released only into data (Territory B rule 4). These inks never colour identity surfaces, navigation, or decoration. */ --hw-cap-system: #5E6C77; /* 4.56:1 on cream */ --hw-cap-external: #79694D; /* 4.50:1 on cream */ --hw-cap-hybrid: #2B7668; /* 4.56:1 on cream */ --hw-cap-human: #A8532F; /* 4.50:1 on cream */ --hw-cap-ai: #35617F; /* 5.60:1 on cream */ /* -------------------------------------------------------------------------- TYPOGRAPHY — Archivo · Source Serif 4 · IBM Plex Mono (Brand v1.2 §10). Loaded via Google Fonts; the pattern is documented in website/STYLE_GUIDE.md. Real fallback stacks below. Roles (Territory B): Archivo — display, titles, navigation, labels, data (tabular figures when setting data) Source Serif 4 — the long-form reading register IBM Plex Mono — identifiers, field codes, declaration lines, versions, state chips -------------------------------------------------------------------------- */ --hw-font-sans: 'Archivo', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif; --hw-font-serif: 'Source Serif 4', ui-serif, Georgia, 'Times New Roman', Times, serif; --hw-font-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, 'Liberation Mono', monospace; /* -------------------------------------------------------------------------- TYPE SCALE — modular, ratio ≈ 1.25 (major third) on a 1.0625rem (17px) base, with fluid display sizes. Each step has a named role. -------------------------------------------------------------------------- */ --hw-text-code: 0.72rem; /* field codes, declaration strips, chips */ --hw-text-caption: 0.85rem; /* captions, footnotes, metadata */ --hw-text-body: 1.0625rem; /* serif reading register */ --hw-text-lead: 1.2rem; /* standfirst / lead paragraph */ --hw-text-h3: 1.33rem; /* minor heading */ --hw-text-h2: clamp(1.55rem, 1.3rem + 1.1vw, 2.05rem); /* section heading */ --hw-text-h1: clamp(2.0rem, 1.5rem + 2.2vw, 3.1rem); /* sheet title */ --hw-text-display: clamp(2.5rem, 1.8rem + 3.6vw, 4.4rem); /* landmark display */ --hw-leading-tight: 1.12; /* display and h1 */ --hw-leading-head: 1.25; /* h2, h3 */ --hw-leading-body: 1.62; /* long-form serif */ --hw-leading-code: 1.5; /* mono blocks */ --hw-tracking-caps: 0.09em; /* uppercase mono and label tracking */ /* -------------------------------------------------------------------------- SPACING — base-8 scale. The reserve is declared, not left over (Territory B rule 2): protected margins are allocations, and filling one is a defect. Prefer the larger step when in doubt. -------------------------------------------------------------------------- */ --hw-space-1: 0.25rem; /* 4px */ --hw-space-2: 0.5rem; /* 8px */ --hw-space-3: 1rem; /* 16px */ --hw-space-4: 1.5rem; /* 24px */ --hw-space-5: 2rem; /* 32px */ --hw-space-6: 3rem; /* 48px */ --hw-space-7: 4.5rem; /* 72px */ --hw-space-8: 6rem; /* 96px */ --hw-space-9: 9rem; /* 144px — landmark breathing room */ /* -------------------------------------------------------------------------- MEASURE & LAYOUT -------------------------------------------------------------------------- */ --hw-measure: 70ch; /* reading measure, within the 65–75ch band */ --hw-sheet-max: 72rem; /* outer sheet width */ --hw-margin-sheet: clamp(1.25rem, 4vw, 3.5rem); /* protected side margin */ /* Hairline weight — hairlines are 1px, always. Shadows do not exist in this system beyond a 1px hairline (Brand v1.2 §12, §15). */ --hw-hairline-w: 1px; /* -------------------------------------------------------------------------- BREAKPOINTS — documented convention (custom properties cannot be used inside media queries; use these literal values): narrow max-width: 47.9375rem (767px) single column mid min-width: 48rem (768px) header row, two columns wide min-width: 75rem (1200px) full sheet margins -------------------------------------------------------------------------- */ /* -------------------------------------------------------------------------- MOTION — measured, never showy. Fully disabled under prefers-reduced-motion (see site.css kill switch). -------------------------------------------------------------------------- */ --hw-ease: cubic-bezier(0.22, 0.61, 0.36, 1); --hw-duration: 420ms; /* scroll reveal */ --hw-duration-ui: 140ms; /* hover / focus transitions */ }