/* Raphael & Raphael — color tokens.
   Base values are transcribed verbatim from raphael-and-raphael-color-guide.png. */
:root{
  /* ---- Primary swatches ---- */
  --rr-slate:#0F0F32;
  --rr-gold:#A1762B;
  --rr-blue:#445788;
  --rr-green:#29615F;
  --rr-gray-medium:#C9C9C9;
  --rr-gray-light:#EFEFEF;

  /* ---- Typography swatches ---- */
  --rr-gray-dark:#4D4D4D;
  --rr-white:#FFFFFF;

  /* ---- Derived tints/shades (for hover, panels, borders) ---- */
  --rr-slate-900:#0A0A22;
  --rr-slate-700:#1E1E4A;
  --rr-slate-050:#F4F4F8;
  --rr-gold-700:#87621F;
  --rr-gold-050:#F7F1E6;
  --rr-green-700:#1B403E;
  --rr-green-050:#EDF3F2;
  --rr-blue-700:#33436D;
  --rr-blue-050:#EEF1F7;
  --rr-gray-050:#F7F7F7;
  --rr-gray-300:#DBDBDB;
  --rr-gray-600:#767676;

  /* ---- Functional palette (special use only — UI status, never decoration) ---- */
  --rr-status-negative:#D62928;
  --rr-status-warning:#AC9400;
  --rr-status-info:#3D708D;
  --rr-status-positive:#006563;

  /* ---- Gradient palette ---- */
  --rr-gradient-slate:linear-gradient(180deg,#002A3A 0%,#05161C 100%); /* @kind color */
  --rr-gradient-blue:linear-gradient(180deg,#003C71 0%,#001E39 100%); /* @kind color */
  /* NOTE: the color guide labels this "Gradient green" but prints purple hexes
     (#330072 → #1A0039) next to a green swatch. Following the swatch. Flagged in readme.md. */
  --rr-gradient-green:linear-gradient(180deg,#29615F 0%,#0E2422 100%); /* @kind color */
  --rr-gradient-gray:linear-gradient(180deg,#F2F2F2 0%,#DBDBDB 100%); /* @kind color */

  /* ---- Semantic: surfaces ---- */
  --surface-page:var(--rr-white);
  --surface-card:var(--rr-white);
  --surface-subtle:var(--rr-gray-light);
  --surface-muted:var(--rr-gray-050);
  --surface-inverse:var(--rr-slate);
  --surface-inverse-alt:var(--rr-slate-700);
  --surface-accent-soft:var(--rr-gold-050);
  --surface-brand-soft:var(--rr-green-050);
  --surface-table-header:var(--rr-blue);

  /* ---- Semantic: text ---- */
  --text-heading:var(--rr-slate);
  --text-body:var(--rr-gray-dark);
  --text-muted:var(--rr-gray-600);
  --text-on-inverse:var(--rr-white);
  --text-on-inverse-muted:#C6C6D6;
  --text-accent:var(--rr-gold);
  --text-brand:var(--rr-green);
  --text-emphasis-figure:var(--rr-blue);
  --text-link:var(--rr-green);
  --text-link-hover:var(--rr-green-700);

  /* ---- Semantic: borders & rules ---- */
  --border-default:var(--rr-gray-medium);
  --border-subtle:var(--rr-gray-300);
  --border-strong:var(--rr-slate);
  --border-focus:var(--rr-green);
  --rule-accent:var(--rr-gold);

  /* ---- Semantic: interactive ---- */
  --action-primary:var(--rr-green);
  --action-primary-hover:var(--rr-green-700);
  --action-primary-text:var(--rr-white);
  --action-secondary-text:var(--rr-green);
  --action-disabled:var(--rr-gray-medium);
  --action-disabled-text:#8A8A8A;

  /* ---- Semantic: status ---- */
  --status-negative:var(--rr-status-negative);
  --status-negative-soft:#FBEAEA;
  --status-warning:var(--rr-status-warning);
  --status-warning-soft:#F8F4E0;
  --status-info:var(--rr-status-info);
  --status-info-soft:#EAF1F5;
  --status-positive:var(--rr-status-positive);
  --status-positive-soft:#E5F1F0;
}