:root {
  /* Core brand */
  --rec-midnight: #071a2b;
  --rec-navy: #0b253e;
  --rec-green: #16a874;
  --rec-green-dark: #0b7f5b;
  --rec-blue: #1f7ae0;
  --rec-cyan: #51c7d9;
  --rec-amber: #f2a33a;
  /* Neutrals */
  --surface: #ffffff;
  --canvas: #f4f7f9;
  --surface-soft: #eaf0f3;
  --border: #dce5ea;
  --border-dark: rgba(255,255,255,0.12);
  --text: #12202a;
  --text-muted: #5f7180;
  --text-inverse: #f6fafc;
  --disabled: #a9b6bf;
  /* Semantic */
  --success-bg: #e8f7f1;
  --success-text: #0b7f5b;
  --info-bg: #eaf3fe;
  --info-text: #155ea8;
  --warning-bg: #fff4e3;
  --warning-text: #9b5a00;
  --error-bg: #fdeded;
  --error-text: #b3261e;
  /* Aliases */
  --action-primary: var(--rec-green);
  --action-primary-hover: var(--rec-green-dark);
  --action-secondary: var(--rec-blue);
  --link: var(--rec-blue);
  --surface-card: var(--surface);
  --surface-dark: var(--rec-midnight);
  --surface-dark-2: var(--rec-navy);
  --border-active: var(--rec-green);
  --focus-ring: var(--rec-blue);
  /* Gradients */
  --gradient-hero: linear-gradient(135deg, #071a2b 0%, #0b253e 55%, #0b4a5b 100%); /* @kind other */
  --gradient-glow: radial-gradient(circle, rgba(81,199,217,0.22) 0%, rgba(22,168,116,0.08) 42%, transparent 72%); /* @kind other */
}