:root {
  /* Misc */
  --color-surface: #f1f8ff;
  --color-surface-alt: #dbe5f3;
  --color-on-surface: #1d293d;
  --color-subtle: #90a1b9;
  --color-border: #AFB7C8;
  --color-border-alt: rgb(144.7777777778, 155.8, 179.2222222222);
  /* base colors */
  --color-base: #98adcf;
  --color-base-rgb: rgb(152, 173, 207);
  --color-base-hover: rgb(142.9898806354, 159.1604761696, 185.3040893187);
  --color-base-active: rgb(113.7469262803, 145.0269649607, 196.1187683818);
  --color-base-subtle: rgb(116.7650183054, 126.8476001871, 143.1276232009);
  --color-base-subtle-hover: rgb(146.5328338278, 157.0281753881, 173.9670803206);
  --color-base-subtle-active: rgb(155.6915270581, 166.3017439673, 183.4244378226);
  --color-base-on: #1d293d;
  --color-base-on-subtle: rgb(4.8452931748, 7.3439742955, 12.6599613893);
  /* primary colors */
  --color-primary: #0078D4;
  --color-primary-rgb: rgb(0, 120, 212);
  --color-primary-hover: hsl(206.024958036, 102.3197787018%, 36.9831553327%);
  --color-primary-active: hsl(206.3836540002, 165.4488289484%, 29.1699279128%);
  --color-primary-subtle: hsl(205.55344626, 133.3025737183%, 24.9692839965%);
  --color-primary-subtle-hover: rgb(23.8145231858, 106.0204898508, 180.8446359791);
  --color-primary-subtle-active: rgb(35.9006597396, 115.1095760085, 190.6982238562);
  --color-primary-on: #f1f8ff;
  --color-primary-on-subtle: rgb(197.7812920736, 197.7812920736, 197.7812920736);
  /* secondary colors */
  --color-secondary: #1B9A59;
  --color-secondary-rgb: rgb(27, 154, 89);
  --color-secondary-hover: rgb(26.4580507372, 138.6605058625, 80.2305389943);
  --color-secondary-active: hsl(155.3389042092, 266.1508340799%, 13.9350327609%);
  --color-secondary-subtle: hsl(153.4785845074, 113.7541592324%, 19.2345380495%);
  --color-secondary-subtle-hover: rgb(45.0604319031, 134.6712715705, 83.2057848148);
  --color-secondary-subtle-active: rgb(55.680770379, 143.8370439741, 91.7455891361);
  --color-secondary-on: #f1f8ff;
  --color-secondary-on-subtle: rgb(197.7812920736, 197.7812920736, 197.7812920736);
  /* tertiary colors */
  --color-tertiary: #0e8996;
  --color-tertiary-rgb: rgb(14, 137, 150);
  --color-tertiary-hover: rgb(26.4914665841, 122.1108981138, 133.1780864997);
  --color-tertiary-active: hsl(185.4096800345, 296.1411596108%, 12.987681551%);
  --color-tertiary-subtle: rgb(12.0214715601, 89.3734776324, 98.0175681744);
  --color-tertiary-subtle-hover: rgb(49.9576490583, 118.2320662662, 127.0734618186);
  --color-tertiary-subtle-active: rgb(59.518882364, 127.1324186991, 136.0328034963);
  --color-tertiary-on: #f1f8ff;
  --color-tertiary-on-subtle: rgb(197.7812920736, 197.7812920736, 197.7812920736);
  /* accent colors */
  --color-accent: #FF1493;
  --color-accent-rgb: rgb(255, 20, 147);
  --color-accent-hover: rgb(234.4781379622, 0.4986031228, 133.6404208019);
  --color-accent-active: hsl(322.3993268567, 178.4215334551%, 32.5083424027%);
  --color-accent-subtle: hsl(323.127662335, 149.7611227885%, 29.9483363001%);
  --color-accent-subtle-hover: rgb(227.1863352709, 29.0998382088, 131.7227025341);
  --color-accent-subtle-active: rgb(238.2024856083, 45.3668532362, 140.7114780313);
  --color-accent-on: #f1f8ff;
  --color-accent-on-subtle: rgb(197.7812920736, 197.7812920736, 197.7812920736);
  /* error colors */
  --color-error: #FE3A34;
  --color-error-rgb: rgb(254, 58, 52);
  --color-error-hover: rgb(232.9946556079, 48.8756885698, 44.2873057717);
  --color-error-active: hsl(354.7457419537, 152.8622765086%, 35.9068372369%);
  --color-error-subtle: rgb(188.8869864718, 1.4793558095, 14.3754359919);
  --color-error-subtle-hover: rgb(224.9486187259, 58.2139634827, 50.977381562);
  --color-error-subtle-active: rgb(235.8547594032, 69.5444175396, 60.4420526226);
  --color-error-on: #f1f8ff;
  --color-error-on-subtle: rgb(197.7812920736, 197.7812920736, 197.7812920736);
  /* success colors */
  --color-success: #33C1A5;
  --color-success-rgb: rgb(51, 193, 165);
  --color-success-hover: rgb(55.1239698053, 176.7311302046, 151.7250578303);
  --color-success-active: hsl(172.0695808184, 259.8441732552%, 18.4365310611%);
  --color-success-subtle: rgb(37.7579534483, 141.0583861245, 120.3325643972);
  --color-success-subtle-hover: rgb(75.2756247692, 172.1158651417, 150.2219543148);
  --color-success-subtle-active: rgb(85.4983990804, 181.6300399651, 159.4149823733);
  --color-success-on: #1d293d;
  --color-success-on-subtle: rgb(4.8452931748, 7.3439742955, 12.6599613893);
  /* warning colors */
  --color-warning: #E09D00;
  --color-warning-rgb: rgb(224, 157, 0);
  --color-warning-hover: rgb(205.5983520278, 144.8017097143, 14.7265538761);
  --color-warning-active: hsl(42.5868826835, 204.0939971632%, 26.2152105003%);
  --color-warning-subtle: hsl(42.7520974269, 120.393832357%, 29.6696546651%);
  --color-warning-subtle-hover: rgb(198.8808727793, 144.8783146383, 46.4988538403);
  --color-warning-subtle-active: rgb(208.6956711594, 154.2232504927, 58.0312570292);
  --color-warning-on: #1d293d;
  --color-warning-on-subtle: rgb(4.8452931748, 7.3439742955, 12.6599613893);
  /* info colors */
  --color-info: #289DF6;
  --color-info-rgb: rgb(40, 157, 246);
  --color-info-hover: rgb(37.6036487515, 143.2363245088, 224.3225238048);
  --color-info-active: hsl(201.7691104312, 163.5531917473%, 34.4224406306%);
  --color-info-subtle: rgb(5.6884363708, 110.821477623, 181.015834286);
  --color-info-subtle-hover: rgb(53.261742992, 141.5221270062, 214.0724597779);
  --color-info-subtle-active: rgb(63.7498079073, 150.9104724497, 224.1467120326);
  --color-info-on: #f1f8ff;
  --color-info-on-subtle: rgb(197.7812920736, 197.7812920736, 197.7812920736);
  --shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
  --shadow-up: rgba(99, 99, 99, 0.2) 0px -2px 8px 0px;
  --magic-background-color1: #dbe5f3;
  --magic-background-color2: #f1f8ff;
  --color-magic-bg: #90a1b9;
  --drag-drop-preview-bg: rgba(100, 113, 139, 0.95);
  --drag-preview-item-bg: rgba(119, 208, 238, 0.589);
}