:root {
  --primary-color: oklch(65% 0.22 260);
  --primary-color-hover: oklch(70% 0.25 260);
  --background-color: oklch(98% 0.01 240);
  --background-color-soft: oklch(95% 0.015 240);
  --surface-color: oklch(100% 0 0);
  --text-color: oklch(25% 0.02 240);
  --label-color: oklch(50% 0.02 240);
  --border-color: oklch(90% 0.01 240);
  --shadow-color: 240 10% 20%;
  --shadow-elevation-low: 0.3px 0.5px 0.7px oklch(from var(--shadow-color) l h c / 0.1), 0.4px 0.8px 1.1px -1.2px oklch(from var(--shadow-color) l h c / 0.1), 1px 2px 2.7px -2.5px oklch(from var(--shadow-color) l h c / 0.1);
  --shadow-elevation-medium: 0.3px 0.5px 0.7px oklch(from var(--shadow-color) l h c / 0.11), 0.8px 1.6px 2.2px -0.8px oklch(from var(--shadow-color) l h c / 0.11), 2.1px 4.1px 5.6px -1.7px oklch(from var(--shadow-color) l h c / 0.11), 5px 9.9px 13.6px -2.5px oklch(from var(--shadow-color) l h c / 0.11);
  --shadow-elevation-high: 0.3px 0.5px 0.7px oklch(from var(--shadow-color) l h c / 0.12), 1.5px 2.9px 4px -0.4px oklch(from var(--shadow-color) l h c / 0.12), 2.8px 5.6px 7.7px -0.8px oklch(from var(--shadow-color) l h c / 0.12), 4.6px 9.1px 12.5px -1.2px oklch(from var(--shadow-color) l h c / 0.12), 7.6px 15.1px 20.7px -1.7px oklch(from var(--shadow-color) l h c / 0.12), 12.5px 24.8px 34px -2.1px oklch(from var(--shadow-color) l h c / 0.12), 20.2px 40.2px 55.1px -2.5px oklch(from var(--shadow-color) l h c / 0.12);
}

body {
  margin: 0;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  background-color: var(--background-color);
  color: var(--text-color);
}