/* ───────────────────────────────────────────────────────────────── KOWL · Typography tokens Montserrat carries the whole UI (next/font, applied on ). Geist Sans / Geist Mono are loaded for numeric & code contexts. The product uses very few sizes but a wide weight range, and leans on bold + tight tracking for big numbers (score rings, headings). ───────────────────────────────────────────────────────────────── */ :root { /* ── Families ───────────────────────────────────────────────── */ --font-montserrat: "Montserrat", system-ui, -apple-system, sans-serif; --font-sans: "Geist", "Montserrat", system-ui, sans-serif; --font-mono: "Geist Mono", ui-monospace, "SFMono-Regular", monospace; /* Primary UI family alias — Montserrat everywhere by default */ --font-ui: var(--font-montserrat); /* ── Weights ────────────────────────────────────────────────── */ --fw-regular: 400; /* @kind font */ --fw-medium: 500; /* @kind font */ --fw-semibold: 600; /* @kind font */ --fw-bold: 700; /* @kind font */ --fw-extrabold: 800; /* @kind font */ /* ── Size scale (px values mirror the app's literal usages) ──── */ --text-display: 72px; /* score-ring centre value (xl) */ --text-h1: 48px; /* company name / page hero */ --text-h2: 36px; /* md ring value */ --text-h3: 24px; /* sm ring value / section heading */ --text-lg: 16px; --text-md: 14px; /* default body / tab labels */ --text-sm: 13px; /* table rows, secondary body */ --text-xs: 12px; /* labels, meta, weights */ --text-2xs: 11px; /* tier chips, gauge numbers */ --text-3xs: 10px; /* footer, micro-labels */ /* ── Line heights ───────────────────────────────────────────── */ --leading-none: 1; /* big numbers, ring values @kind other */ --leading-tight: 1.2; /* @kind other */ --leading-snug: 1.3; /* @kind other */ --leading-normal: 1.45; /* @kind other */ /* ── Tracking ───────────────────────────────────────────────── */ --tracking-tight: -0.01em; /* @kind other */ --tracking-normal: 0; /* @kind other */ --tracking-wide: 0.06em; /* KOWL wordmark @kind other */ --tracking-chip: 0.12em; /* uppercase TIER chips @kind other */ /* ── Semantic roles ─────────────────────────────────────────── */ --type-hero-weight: var(--fw-bold); /* @kind font */ --type-number-weight: var(--fw-bold); /* @kind font */ --type-label-weight: var(--fw-semibold); /* @kind font */ --type-body-weight: var(--fw-regular); /* @kind font */ }