/* ── Fonts: self-hosted (#417) ─────────────────────────────────────────────── This file used to open with @import url('https://fonts.googleapis.com/...') — which is why removing the from login.html did NOT make the login path third-party-free, and my claim that it did was wrong. TC-08 only read the HTML and never looked here. Now all four faces ship from /assets/fonts. That kills a third-party request on every page (a privacy leak, and a render-blocking dependency on someone else's uptime), and an @import is the worst way to load a font besides: the browser cannot even discover it until this stylesheet has downloaded and parsed. All four are SIL Open Font License, which explicitly permits self-hosting. Each file is the VARIABLE font — one file covers every weight, which is why there are 4 files and not 12 (Google serves the same bytes for :wght@400 and :wght@700; they were byte-identical). font-display: swap — text paints immediately in the fallback and re-renders when the face arrives. Never invisible, at the cost of a reflow. ------------------------------------------------------------------------- */ /* #1182 THREE @font-face BLOCKS REMOVED (DM Sans, Montserrat, Great Vibes) — all three were dead. No font-family rule anywhere in client/ consumed them: --font-head and --mono both alias --font (Inter), and Great Vibes was superseded when the Prime Vectors wordmark replaced the cursive (see the note further down this file). Their .woff2 files are gone with them. ⚠ Deleting them is HYGIENE, not a speed-up — a browser never downloads an @font-face it has no rule for, so these cost nothing at runtime. What they cost was 118KB in the tree and a false premise: the critical-path audit for #1018 counted four fonts as blocking, when only one is. The real win in this change is the preload of inter.woff2, which IS on the critical path. */ @font-face { font-family: 'Inter'; font-style: normal; font-weight: 300 800; /* variable: the whole range from one file */ font-display: swap; src: url('/assets/fonts/inter.woff2') format('woff2'); } * { margin: 0; padding: 0; box-sizing: border-box; } /* Native form controls (button/input/select/textarea) don't inherit font-family — browsers apply their own default (Arial-ish), so any control that doesn't explicitly set a font "reverts" off the app face (e.g. the runner odds button). Force them onto --font once, globally, so nothing drifts. font-family only (not `font:`) so each control keeps its own size/weight. */ button, input, select, textarea, optgroup { font-family: inherit; } :root { /* #234 shared chip metrics — EVERY badge/chip family on the runner card consumes these so heights align on a shared row (colour/border stay per-family). */ --chip-h: 20px; /* #235 single source for page gutters — consumed by .page-main (+ 640px override). */ /* #239 phase 1: ALL white overlays route through this base triplet, so a future light theme flips ONE knob (e.g. to 16,18,24) instead of hunting 39 literals. */ --brand-vo-green: #3fe9ad; /* the VectorOdds mark — a BRAND, so it is the same on */ --brand-vo-green-2: #2fcf98; /* every theme. Declared once here, not typed per page. */ --brand-vo-purple: #4b3ff0; --brand-vo-purple-2: #6d5cff; /* #417 The exchange's back/lay convention: blue is BACK, pink is LAY, on every betting exchange there is. Like the rug colours, that is a fact about the domain — a theme that recoloured them would be lying to the user — so they are declared once and inherited by every palette rather than typed into the screener. */ --exch-back: #1e88e5; --exch-back-rgb: 30, 136, 229; --exch-lay: #e53935; --exch-lay-rgb: 229, 57, 53; /* the modal scrim: it DIMS the page, so it is black on a light theme too */ --scrim-rgb: 0, 0, 0; --video-mat: #000; /* letterbox behind