/* Media coding (decision D5): the brand accent means an image, purple means a
 * video.
 *
 * Its own file for one reason: both interfaces need it and they load different
 * stylesheets. The browser app gets its named colours from base.css; the
 * desktop app links only the token layer and declares its own aliases inline,
 * and its <style> block is forbidden from hand-typing a colour. Rather than
 * type this purple into both - which is exactly the drift every generated file
 * in this repo exists to prevent - it is named once here, and both link it.
 * tools/sync_webui_assets.py carries the copy across and CI fails on a stale
 * one.
 *
 * Two values because a single purple cannot clear AA on both grounds:
 * PostHog's own #B62AD9 (the palette this reskin was drawn from) measures
 * 4.76:1 on the light surface and only 3.11:1 on the dark one. The light theme
 * therefore takes the brand purple and the dark theme a lighter tint of it at
 * 6.00:1 - the same shape as the accent's own orange-in-light,
 * yellow-in-dark swap.
 *
 * The colour is never the only carrier of meaning. The badge it paints already
 * says "Video" in words and carries the running time, so a person who does not
 * separate these two hues loses nothing - the same rule the verdict colours
 * follow.
 *
 * js/theme.js always stamps a RESOLVED data-theme onto the root, so matching
 * the attribute is sufficient and prefers-color-scheme is never consulted.
 */
:root {
  --c-media-video: #B62AD9;
}

[data-theme='dark'] {
  --c-media-video: #C98BE8;
}