/* AI League One -- Pitchside tokens (D-158). * * The one file that holds colours. Light is :root; the dark variant follows * the phone (prefers-color-scheme) and overrides the same names. Every other * stylesheet uses these tokens and never a raw colour * (tests/test_pitchside_tokens.py holds them to it). * * Club colours arrive per request as custom properties on , and on any * `.clubvars` element, from desk/club_style.py: --club, --club-2, --on-club, * and a light and a dark value each of --club-ink and --club-edge. The rules * at the foot of this file pick the value for the theme in force. * * Figtree is self-hosted (SIL OFL, static/fonts/OFL.txt): the CSP is * default-src 'self', so no font can come from anywhere else. */ @font-face { font-family: "Figtree"; font-style: normal; font-weight: 400 800; font-display: swap; src: url("../fonts/figtree-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: "Figtree"; font-style: normal; font-weight: 400 800; font-display: swap; src: url("../fonts/figtree-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } :root { color-scheme: light dark; --bg: #eef1f4; --card: #ffffff; --card-2: #f5f7f9; --line: #dde2e8; --ink: #12161b; --ink-2: #3a434d; --muted: #5b6570; --shadow: 0 1px 2px rgba(18, 22, 27, .08); --card-border: transparent; --scrim: rgba(18, 22, 27, .45); /* Results. The pill letter has its own ink per theme. The spec's #1f8a4c carried white at 4.38:1, under AA, so light --win is one step darker. */ --win: #1c8046; --draw: #5b6570; --loss: #c2412d; --win-ink: #ffffff; --draw-ink: #ffffff; --loss-ink: #ffffff; --warn: #b87d00; /* a fill: the ceiling bar between 10% and 20% over */ --warn-bg: #fff4d6; --warn-ink: #4a3200; --live: #d83a2c; /* The score header is dark in both themes, so it has its own inks. */ --board: #12161b; --board-ink: #ffffff; --board-muted: #b8c0c9; --board-line: #2a313b; --board-live: #ff6b5c; --board-opp: #6b7682; /* Nobody seated: the brand blue. desk/club_style.py FALLBACK agrees. */ --club: #264d73; --club-2: #f5c542; --on-club: #ffffff; --font: "Figtree", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; --r-card: 16px; --r-ctl: 14px; --r-input: 12px; --r-pill: 999px; --r-pip: 6px; --gutter: 16px; --masthead-h: 60px; --rail-w: 208px; --chat-w: 320px; --tabbar-h: 58px; --continue-h: 74px; } body, .clubvars { --club-ink: var(--club-ink-light, var(--club)); --club-edge: var(--club-edge-light, transparent); } @media (prefers-color-scheme: dark) { :root { --bg: #0d1116; --card: #161b22; --card-2: #1c222b; --line: #2a313b; --ink: #eef1f4; --ink-2: #c7cfd8; --muted: #98a3ae; --shadow: none; --card-border: var(--line); --scrim: rgba(0, 0, 0, .6); /* White on the dark theme's W and L pills is 3.0:1 and 3.5:1, so those two carry the page colour instead; D keeps white (4.6:1). */ --win: #2fa862; --draw: #6b7682; --loss: #e0604a; --win-ink: #0d1116; --draw-ink: #ffffff; --loss-ink: #0d1116; --warn: #e0a82e; --warn-bg: #3a2e10; --warn-ink: #ffe3a3; --live: #ff6b5c; } body, .clubvars { --club-ink: var(--club-ink-dark, var(--club-2)); --club-edge: var(--club-edge-dark, transparent); } }