/* * CxP palette, ported from the campaign page in the `website` repo so the two read as one brand * while they coexist. Only the tokens live here — components reference the variables and never * a literal, which is what lets a second tenant ship a different stylesheet and nothing else. */ :root { --ink: #0a0a0f; --raise: #15151f; --line: #262633; --text: #f4f4f8; --muted: #9a9aad; --accent: #ff2d9b; --live: #ff2d9b; --font-display: 'Oswald', system-ui, sans-serif; --font-body: 'DM Sans', system-ui, sans-serif; } /* * Broadcast overlay tokens (overlay decision 2026-09-24 §6). Scoped under .overlay-root so the * campaign values above stay untouched. Two sets, one vocabulary: dark is the producer default * for the hall, `?theme=bright` (data-theme on ) is for a bug over the white wall. Hex * only — vMix's CEF is not our Chrome. --accent is the darker, Rec.709-safer magenta the large * fills sit on; --accent-hot is for hairlines, the serve rail and the ×; neither ever leaves a * plate. No green (the sponsor), no blue fills (the court), no yellow. */ .overlay-root { --ink: #0a0a0f; --raise: #15151f; --line: #3e3e50; --hair: #5a5a6e; --text: #f4f4f8; --muted: #c8c8d4; --ov-cell: #1b1b28; --ov-dim: #8a8a99; --accent: #d91a7a; --accent-hot: #ff2d9b; --accent-edge: #ff5ab3; --on-accent: #ffffff; --overlay-radius: 4px; --overlay-wordmark: url('/tenants/cxp/wordmark.svg'); /* Opaque 1920 × 1080 ink with the cropped ×, painted at its own size, never scaled. */ --overlay-fullscreen-bg: url('/tenants/cxp/fullscreen-bg.png'); } .overlay-root[data-theme='bright'] { /* A shade darker than white and a dark keyline: #F4F4F8 dissolved into the cream wall. */ --ink: #e4e4ec; --raise: #d8d8e2; --line: #c8c8d4; --hair: #5a5a6e; --text: #0a0a0f; --muted: #4a4a58; --ov-cell: #ceced8; --ov-dim: #6a6a78; --accent: #d91a7a; --accent-hot: #c4106a; --accent-edge: #c4106a; --on-accent: #ffffff; } /* * The venue screen (live v2 §C). Scoped to the page that carries a `.screen-root` so the campaign * values above stay untouched; set on so the letterbox around a scaled stage is the same * canvas. Dark by default for a hall at night; `?theme=light` for a bright hall — same geometry, * the darker magenta for marks on white. The QR panel is white in both: a code needs its quiet * zone light. */ html:has(.screen-root) { --sc-canvas: #0a0a0f; --sc-panel: #15151f; --sc-panel-quiet: #111119; --sc-line: #2e2e3d; --sc-track: #3a2a36; --sc-text: #f7f7fa; --sc-muted: #b4b4c4; --sc-dim: #7c7c8e; --sc-accent: #ff5ab3; --sc-on-accent: #0a0a0f; --sc-qr-panel: #ffffff; } html:has(.screen-root[data-theme='light']) { --sc-canvas: #f7f7fa; --sc-panel: #ffffff; --sc-panel-quiet: #f0f0f5; --sc-line: #d4d4de; --sc-track: #f2c6dd; --sc-text: #0a0a0f; --sc-muted: #4a4a58; --sc-dim: #6e6e7e; --sc-accent: #d91a7a; --sc-on-accent: #0a0a0f; --sc-qr-panel: #ffffff; }