:root {

  --container-bg: #00000080;
  --container-high-bg: #17171780;


  --primary: rgb(167 200 255);
  --on-primary: rgb(5 48 95);

  --primary-container: rgb(36 71 119);
  --on-primary-container: rgb(213 227 255);

  --secondary: rgb(151 204 249);
  --on-secondary: rgb(0 52 80);

  --secondary-container: rgb(2 75 113);
  --on-secondary-container: rgb(203 230 255);

  --tertiary: rgb(129 213 205);
  --on-tertiary: rgb(0 55 52);

  --tertiary-container: rgb(0 80 75);
  --on-tertiary-container: rgb(157 242 233);

  --error: rgb(255 180 171);
  --on-error: rgb(105 0 5);

  --error-container: rgb(147 0 10);
  --on-error-container: rgb(255 218 214);

  --background: rgb(17 19 24);
  --on-background: rgb(225 226 233);

  --surface: rgb(0 0 0);
  --on-surface: rgb(226 226 233);

  --surface-variant: rgb(68 71 79);
  --on-surface-variant: rgb(197 198 208);

  --outline: rgb(142 144 153);
  --outline-variant: rgb(68 71 79);

  --shadow: rgb(0 0 0);
  --scrim: rgb(0 0 0);

  --inverse-surface: rgb(226 226 233);
  --inverse-on-surface: rgb(47 48 54);
  --inverse-primary: rgb(62 95 144);

  --surface-dim: rgb(18 19 24);
  --surface-bright: rgb(56 57 62);
  --container-lowest: rgb(12 14 19);
  --container-lowerest: rgb(9, 9, 11);
  --container-low: rgb(26 27 32);
  --container: rgb(30 31 37);
  --container-high: rgb(40 42 47);
  --container-highest: rgb(51 53 58);
}