/* Pulse re-pointed 2026-08 by the brand team: #E11D48 crimson, replacing the fuchsia
   #C026D3 this system first shipped. Crimson sits at 347° — clear of the rest of the
   family (blue 200 · orange 25 · green 160 · sky 199) and far enough from danger red
   #DC2626 that a Pulse badge is never read as an error.

   One shell, five products. A sub-product sets `data-product` once, on the shell, and
   nothing else in the system changes. The accent colours TOUCHES — a badge, a highlight,
   a chart series — while structure and primary buttons stay Syriana blue, or the platform
   stops reading as one platform.

   Each accent carries a ramp and an ink tone, derived the same way the blue was: hue and
   saturation held from the brand value, lightness matched step-for-step to the blue ramp
   (100 · 300 · 500 · 700 · 900). The 500 is the brand value untouched.

   --color-accent-ink is the tone a filled control or a coloured label uses, measured
   against white:
     pulse   #E11D48 white-on-500 5.99 → passes; ink #BE123C (6.29) for small labels
     print   #F97316 white-on-500 2.80 → ink #C35305 (4.61)
     store   #10B981 white-on-500 2.54 → ink #0C855D (4.64)
     connect #0EA5E9 white-on-500 2.77 → ink #0B7CAF (4.65)
   Same rule as the parent blue: one tone for the mark, one for the ink. */
:root{
  --color-product-core:#2D7DAE;
  --color-product-pulse:#E11D48;
  --color-product-print:#F97316;
  --color-product-store:#10B981;
  --color-product-connect:#0EA5E9;

  --color-pulse-100:#FFF1F2;
  --color-pulse-300:#FDA4AF;
  --color-pulse-500:#E11D48;
  --color-pulse-700:#BE123C;
  --color-pulse-900:#881337;
  --color-pulse-ink:#BE123C;

  --color-print-100:#FEE5D4;
  --color-print-300:#FBAA72;
  --color-print-500:#F97316;
  --color-print-700:#933F04;
  --color-print-900:#572502;
  --color-print-ink:#C35305;

  --color-store-100:#D7FBEF;
  --color-store-300:#7AF3CB;
  --color-store-500:#10B981;
  --color-store-700:#0C8B61;
  --color-store-900:#075239;
  --color-store-ink:#0C855D;

  --color-connect-100:#D5F0FD;
  --color-connect-300:#76CFF7;
  --color-connect-500:#0EA5E9;
  --color-connect-700:#09658E;
  --color-connect-900:#053B54;
  --color-connect-ink:#0B7CAF;

  /* Defaults to the parent brand — the blue ramp already exists in colors.css. */
  --color-accent:var(--color-product-core);
  --color-accent-100:var(--color-primary-100);
  --color-accent-300:var(--color-primary-300);
  --color-accent-700:var(--color-primary-700);
  --color-accent-900:var(--color-primary-900);
  --color-accent-ink:var(--color-primary-600);
}
[data-product='core']{
  --color-accent:var(--color-product-core);
  --color-accent-100:var(--color-primary-100);
  --color-accent-300:var(--color-primary-300);
  --color-accent-700:var(--color-primary-700);
  --color-accent-900:var(--color-primary-900);
  --color-accent-ink:var(--color-primary-600);
}
[data-product='pulse']{
  --color-accent:var(--color-pulse-500);
  --color-accent-100:var(--color-pulse-100);
  --color-accent-300:var(--color-pulse-300);
  --color-accent-700:var(--color-pulse-700);
  --color-accent-900:var(--color-pulse-900);
  --color-accent-ink:var(--color-pulse-ink);
}
[data-product='print']{
  --color-accent:var(--color-print-500);
  --color-accent-100:var(--color-print-100);
  --color-accent-300:var(--color-print-300);
  --color-accent-700:var(--color-print-700);
  --color-accent-900:var(--color-print-900);
  --color-accent-ink:var(--color-print-ink);
}
[data-product='store']{
  --color-accent:var(--color-store-500);
  --color-accent-100:var(--color-store-100);
  --color-accent-300:var(--color-store-300);
  --color-accent-700:var(--color-store-700);
  --color-accent-900:var(--color-store-900);
  --color-accent-ink:var(--color-store-ink);
}
[data-product='connect']{
  --color-accent:var(--color-connect-500);
  --color-accent-100:var(--color-connect-100);
  --color-accent-300:var(--color-connect-300);
  --color-accent-700:var(--color-connect-700);
  --color-accent-900:var(--color-connect-900);
  --color-accent-ink:var(--color-connect-ink);
}
/* On a dark surface the 500s fall below 4.5 against near-black; the 300 is what a
   coloured label uses there. Re-pointed for the whole dark subtree, as the roles are. */
[data-theme='dark']{--color-accent-ink:var(--color-accent-300)}

/* Pulse carries three roles the other products do not: the AI surfaces use a hover tone,
   a glow for generating states, and a tinted surface. Only Pulse defines them, so
   --color-accent-hover is undefined elsewhere — deliberately, so a component that reaches
   for it on the wrong product fails visibly rather than silently borrowing a colour. */
:root{--color-pulse-hover:#F43F5E;--color-pulse-glow:#FDA4AF;--color-pulse-surface:#FFF1F2}
[data-product='pulse']{--color-accent-hover:var(--color-pulse-hover);--color-accent-glow:var(--color-pulse-glow);--color-accent-surface:var(--color-pulse-surface)}