/* ============================================================
   Object — Color tokens
   Foundation: Open Color (yeun.github.io/open-color)
   The system is built almost entirely on a neutral GRAY scale,
   with a single BLUE accent. Gray usage follows
   yeun.github.io/2016/09/25/general-usage-of-gray.html
   ============================================================ */

:root {
  /* ---------- Base · Gray (Open Color) ---------- */
  --oc-gray-0: #f8f9fa;
  --oc-gray-1: #f1f3f5;
  --oc-gray-2: #e9ecef;
  --oc-gray-3: #dee2e6;
  --oc-gray-4: #ced4da;
  --oc-gray-5: #adb5bd;
  --oc-gray-6: #868e96;
  --oc-gray-7: #495057;
  --oc-gray-8: #343a40;
  --oc-gray-9: #212529;

  /* ---------- Base · Blue (Open Color) — brand accent ---------- */
  --oc-blue-0: #e7f5ff;
  --oc-blue-1: #d0ebff;
  --oc-blue-2: #a5d8ff;
  --oc-blue-3: #74c0fc;
  --oc-blue-4: #4dabf7;
  --oc-blue-5: #339af0;
  --oc-blue-6: #228be6;
  --oc-blue-7: #1c7ed6;
  --oc-blue-8: #1971c2;
  --oc-blue-9: #1864ab;

  /* ---------- Base · Semantic hues (Open Color) ---------- */
  --oc-red-6:   #fa5252;  /* error */
  --oc-red-7:   #f03e3e;
  --oc-green-6: #40c057;  /* success */
  --oc-green-7: #37b24d;
  --oc-yellow-6:#fab005;  /* warning */
  --oc-yellow-7:#f59f00;

  /* Absolute */
  --white: #ffffff;
  --black: #000000;

  /* ============================================================
     SEMANTIC ALIASES — reference these, not the raw scale.
     ============================================================ */

  /* Brand */
  --brand-accent:        var(--oc-blue-7);   /* the "." in Object. */
  --brand-accent-hover:  var(--oc-blue-8);
  --brand-accent-active: var(--oc-blue-9);
  --brand-accent-subtle: var(--oc-blue-0);
  --brand-ink:           var(--oc-gray-9);   /* wordmark color */

  /* Text — gray hierarchy */
  --text-strong:    var(--oc-gray-9);  /* headings, names, key figures */
  --text-body:      var(--oc-gray-7);  /* default body copy */
  --text-secondary: var(--oc-gray-6);  /* captions, sub-labels */
  --text-muted:     var(--oc-gray-5);  /* placeholder, eyebrow labels */
  --text-on-accent: var(--white);
  --text-on-dark:   var(--white);
  --text-link:      var(--oc-blue-7);

  /* Surfaces */
  --surface-page:    var(--white);
  --surface-subtle:  var(--oc-gray-0);
  --surface-sunken:  var(--oc-gray-1);
  --surface-card:    var(--white);
  --surface-inverse: var(--oc-gray-9);  /* dark logo backdrop */

  /* Borders / dividers */
  --border-subtle:  var(--oc-gray-2);
  --border-default: var(--oc-gray-3);
  --border-strong:  var(--oc-gray-4);

  /* Status */
  --status-error:   var(--oc-red-6);
  --status-success: var(--oc-green-6);
  --status-warning: var(--oc-yellow-6);
}