*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --bg:      rgb(var(--mdui-color-surface-container-lowest));
  --surface: rgb(var(--mdui-color-surface-container));
  --surface2:rgb(var(--mdui-color-surface-container-high));
  --border:  rgb(var(--mdui-color-outline-variant));
  --text1:   rgb(var(--mdui-color-on-surface));
  --text2:   rgb(var(--mdui-color-on-surface-variant));
  --text3:   rgb(var(--mdui-color-outline));
  --font:    'Google Sans Flex', var(--mdui-typescale-body-medium-font);
  --mono:    'JetBrains Mono', ui-monospace, monospace;

  --primary:              rgb(var(--mdui-color-primary));
  --on-primary:           rgb(var(--mdui-color-on-primary));
  --primary-container:    rgb(var(--mdui-color-primary-container));
  --on-primary-container: rgb(var(--mdui-color-on-primary-container));

  --chip-bg: rgb(var(--mdui-color-tertiary-container));
  --chip-fg: rgb(var(--mdui-color-on-tertiary-container));

  --q-cluster-1:    #993C1D;
  --q-cluster-2:    #534AB7;
  --q-cluster-3:    #0F6E56;
  --q-cluster-4:    #854F0B;
  --q-cluster-none: #5F5E5A;

  --q-urgency-critical: #991B1B;
  --q-urgency-high:     #EF4444;
  --q-urgency-medium:   #F59E0B;
  --q-urgency-low:      #4CAF50;
}

[mdui-theme="dark"] {
  --q-cluster-1:    #C4583A;
  --q-cluster-2:    #7B72D4;
  --q-cluster-3:    #1A9A78;
  --q-cluster-4:    #B87A1A;
  --q-cluster-none: #8A8880;
}