/* aimpera monitor design tokens. Light is the default; dark via [data-theme="dark"] or system preference. */
:root {
  --bg: #F4F6F9;
  --surface: #FFFFFF;
  --surface-2: #F8FAFC;
  --border: #E3E7ED;
  --border-strong: #CBD2DB;
  --text: #1F2933;
  --text-muted: #5F6B78;
  --primary: #0B5CAD;
  --primary-contrast: #FFFFFF;
  --primary-soft: #E6F0FA;
  --ok: #1E9E5A;
  --ok-text: #137A43;
  --ok-soft: #E4F5EC;
  --warn: #E0A100;
  --warn-text: #8A6100;
  --warn-soft: #FFF5D9;
  --danger: #D64545;
  --danger-text: #B42E2E;
  --danger-soft: #FCE8E8;
  --unknown: #8A94A0;
  --unknown-text: #5F6B78;
  --unknown-soft: #EEF1F4;
  --paused: #B5BDC7;
  --paused-text: #5F6B78;
  --paused-soft: #EEF1F4;
  --accent-band: #B04A97;
  --focus: #0B5CAD;
  --shadow: 0 1px 2px rgba(31, 41, 51, .06), 0 1px 3px rgba(31, 41, 51, .04);
  --radius: 8px;
  --radius-sm: 6px;
  --rail-w: 64px;
  --font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0F1419;
    --surface: #171D24;
    --surface-2: #1C232B;
    --border: #2A333D;
    --border-strong: #3A4552;
    --text: #E6EAEE;
    --text-muted: #9AA6B2;
    --primary: #4C9BE8;
    --primary-contrast: #0B1117;
    --primary-soft: #14293F;
    --ok: #3DBE7A;
    --ok-text: #5FD497;
    --ok-soft: #12291D;
    --warn: #F0B429;
    --warn-text: #F0B429;
    --warn-soft: #2E2410;
    --danger: #EF6B6B;
    --danger-text: #F28B8B;
    --danger-soft: #331A1A;
    --unknown: #8A94A0;
    --unknown-text: #A5AFBA;
    --unknown-soft: #222A33;
    --paused: #6B7684;
    --paused-text: #A5AFBA;
    --paused-soft: #222A33;
    --accent-band: #D277BB;
    --focus: #7DB6F0;
    --shadow: 0 1px 2px rgba(0, 0, 0, .4);
  }
}

:root[data-theme="dark"] {
  --bg: #0F1419;
  --surface: #171D24;
  --surface-2: #1C232B;
  --border: #2A333D;
  --border-strong: #3A4552;
  --text: #E6EAEE;
  --text-muted: #9AA6B2;
  --primary: #4C9BE8;
  --primary-contrast: #0B1117;
  --primary-soft: #14293F;
  --ok: #3DBE7A;
  --ok-text: #5FD497;
  --ok-soft: #12291D;
  --warn: #F0B429;
  --warn-text: #F0B429;
  --warn-soft: #2E2410;
  --danger: #EF6B6B;
  --danger-text: #F28B8B;
  --danger-soft: #331A1A;
  --unknown: #8A94A0;
  --unknown-text: #A5AFBA;
  --unknown-soft: #222A33;
  --paused: #6B7684;
  --paused-text: #A5AFBA;
  --paused-soft: #222A33;
  --accent-band: #D277BB;
  --focus: #7DB6F0;
  --shadow: 0 1px 2px rgba(0, 0, 0, .4);
}