/* Generated from BRAND_PRIMARY and BRAND_ACCENT. */

/*
 * `:root:root`, not `:root`.
 *
 * Vite injects the built stylesheet at the end of the head, after this
 * file, so an equally specific selector would lose on order and the
 * shipped palette would quietly win. Doubling the selector raises the
 * specificity instead, which does not care where the link ended up.
 */
:root:root {
  --brand: #ce1267;
  --brand-deep: #a10e50;
  --brand-coral: #e47dab;
  --accent: #00b8d4;
}

:root:root, :root:root[data-theme='light'] {
  --focus: #009bb2;
  --focus-ring: color-mix(in srgb, #009bb2 22%, transparent);
  --selection-bg: #f6d4e4;
  --action: var(--brand);
  --action-hover: #b10f59;
  --action-ink: #ffffff;
  --brand-on: #ce1267;
  --brand-surface: #fceef4;
  --brand-border: #f3c6db;
  --accent-on: #007688;
  --accent-surface: #e8f9fb;
  --accent-border: #bdedf4;
}

:root:root[data-theme='dark'] {
  --focus: #00b8d4;
  --focus-ring: color-mix(in srgb, #00b8d4 26%, transparent);
  --selection-bg: #710a39;
  --action: var(--brand);
  --action-hover: #d73d82;
  --action-ink: #ffffff;
  --brand-on: #da4b8b;
  --brand-surface: #3a051d;
  --brand-border: #5d082e;
  --accent-on: #00b8d4;
  --accent-surface: #002126;
  --accent-border: #003f48;
}