/* ============================================================
   YKMTEST — Color tokens
   Brand DNA sampled from the on-device testing software.
   teal = identity & data accents · violet = primary interactive
   green/red/blue = run / stop / pause + live status
   ============================================================ */
:root {
  /* ---- Brand: teal (turquoise) ---- */
  --ykm-teal-50:  #E9F8F9;
  --ykm-teal-100: #CFEFF1;
  --ykm-teal-200: #9FDFE3;
  --ykm-teal-300: #5FC8CF;
  --ykm-teal-400: #2FB3BC;
  --ykm-teal-500: #1BA9B5;   /* primary brand */
  --ykm-teal-600: #16909B;
  --ykm-teal-700: #14747D;

  /* ---- Brand: graphite (logo "YKM") ---- */
  --ykm-graphite: #58595B;

  /* ---- Primary interactive: violet / indigo ---- */
  --violet-50:  #EEECFA;
  --violet-100: #DFDBF4;
  --violet-200: #C4BDEB;
  --violet-300: #9C92DD;
  --violet-400: #7E72D0;
  --violet-500: #6E63C8;     /* primary buttons, selected nav */
  --violet-600: #5C51B6;
  --violet-700: #4A409A;

  /* ---- Semantic: run / stop / pause / warn ---- */
  --green-50:  #EAF9F0;
  --green-500: #27C06A;      /* Start / OK */
  --green-600: #1FA659;
  --red-50:    #FCEDEC;
  --red-500:   #E24A45;      /* Stop / danger */
  --red-600:   #C73B37;
  --blue-50:   #EAF4FC;
  --blue-500:  #2F9BE0;      /* Pause / info */
  --blue-600:  #2380C2;
  --amber-50:  #FEF3E0;
  --amber-500: #F2A20C;      /* Press Limit / warning */
  --amber-600: #D08905;

  /* ---- Neutrals / ink ---- */
  --ink-900: #23242E;        /* headings */
  --ink-800: #2E2F3A;
  --ink-700: #3C3D49;
  --ink-600: #54566A;
  --ink-500: #6B7280;        /* body secondary */
  --ink-400: #9AA0AB;        /* muted / placeholder */
  --ink-300: #C2C6CE;

  /* ---- Surfaces & lines ---- */
  --surface:        #FFFFFF;
  --surface-raised: #FFFFFF;
  --surface-sunken: #EEF0F3; /* app canvas behind panels */
  --surface-hover:  #F5F6F8;
  --line:    #E4E7EC;        /* default border */
  --line-2:  #EEF0F3;        /* faint divider */
  --line-strong: #D3D7DE;

  /* ---- Live-data card tints ---- */
  --tint-teal:   #E9F8F9;
  --tint-violet: #ECEBF8;
  --tint-green:  #EEFDF3;
  --tint-blue:   #EAF4FC;
  --tint-amber:  #FEF3E0;

  /* ---- Tolerance gradient (loading-rate meter) ---- */
  --grad-tolerance: linear-gradient(90deg, #E24A45 0%, #F2A20C 50%, #27C06A 100%); /* @kind other */

  /* ============ Semantic aliases ============ */
  --brand:            var(--ykm-teal-500);
  --brand-strong:     var(--ykm-teal-600);
  --primary:          var(--violet-500);
  --primary-hover:    var(--violet-600);
  --primary-soft:     var(--violet-50);

  --text-heading:     var(--ink-900);
  --text-body:        var(--ink-700);
  --text-muted:       var(--ink-500);
  --text-faint:       var(--ink-400);
  --text-on-accent:   #FFFFFF;
  --text-link:        var(--ykm-teal-600);

  --bg-app:           var(--surface-sunken);
  --bg-panel:         var(--surface);
  --border-default:   var(--line);
  --border-input:     var(--line-strong);
  --border-focus:     var(--ykm-teal-500);

  --state-run:        var(--green-500);
  --state-stop:       var(--red-500);
  --state-pause:      var(--blue-500);
  --state-warn:       var(--amber-500);
  --state-ok:         var(--green-500);
}