:root {
  --main-bg: oklch(100% 0 0);
  --bg-highlited: oklch(97% 0.003 280);
  --bg-highlited-hover: oklch(94% 0.003 280);
  --accent: oklch(45% 0.17 256);
  --text-highlited: oklch(65% 0.2 256 / 10%);
  --text-highlited-warning: oklch(0% 0 0 / 10%);
  --text-highlited-warning-hover: oklch(0% 0 0 / 16%);
  --text-highlited-hover: oklch(65% 0.2 256 / 16%);
  --text-primary: oklch(10% 0 0);
  --text-primary-stroke: oklch(10% 0 0 / 80%);
  --text-secondary: oklch(23% 0 0 / 65%);
  --text-underline: oklch(23% 0 0 / 40%);
  --text-underline-hover: oklch(23% 0 0);
  --text-warning: oklch(0% 0 0);
  --accent-alternave: oklch(88% 0.16 92);
  --separator: oklch(23% 0 0 / 12%);
  --warning: oklch(94% 0.09 95);
  --error: oklch(82% 0.09 20);
  --twitter: oklch(70% 0.12 235);
}

@media (prefers-color-scheme: dark) {
  :root {
    --main-bg: oklch(23% 0 0);
    --bg-highlited: oklch(31% 0.01 286);
    --bg-highlited-hover: oklch(34% 0.01 286);
    --accent: oklch(77% 0.11 256);
    --text-highlited: oklch(65% 0 256 / 10%);
    --text-highlited-hover: oklch(65% 0 256 / 20%);
    --text-highlited-warning: oklch(31% 0.003 17.31);
    --text-highlited-warning-hover: oklch(28% 0.003 17.31);
    --text-primary: oklch(100% 0.1 139);
    --text-primary-stroke: oklch(100% 0.1 139 / 75%);
    --text-secondary: oklch(100% 0 0 / 50%);
    --text-underline: oklch(100% 0 0 / 40%);
    --text-underline-hover: oklch(100% 0 0 / 85%);
    --text-warning: oklch(100% 0 0);
    --accent-alternave: oklch(63% 0.13 79);
    --separator: oklch(100% 0 0 / 20%);
    --warning: oklch(76% 0.15 83 / 20%);
    --error: oklch(76% 0.14 20 / 20%);
  }
}
