:root {
  color-scheme: dark;

  --bg-0: #050609;
  --bg-1: #080a0f;
  --panel: rgba(255, 255, 255, .055);
  --panel-strong: rgba(255, 255, 255, .075);
  --panel-hover: rgba(255, 255, 255, .085);
  --line: rgba(255, 255, 255, .085);
  --line-soft: rgba(255, 255, 255, .05);

  --text: #f7f8fb;
  --text-soft: rgba(255, 255, 255, .68);
  --muted: rgba(255, 255, 255, .38);

  --blue: #0a84ff;
  --blue-soft: #78bbff;
  --green: #30d158;
  --orange: #ff9f0a;
  --red: #ff453a;
  --purple: #bf5af2;

  --shadow: 0 24px 80px rgba(0, 0, 0, .38);
  --inner: inset 0 1px 0 rgba(255, 255, 255, .08);

  --r-sm: 12px;
  --r-md: 18px;
  --r-lg: 24px;
  --r-xl: 30px;

  --sidebar: 250px;
  --topbar: 88px;
  --mobile-nav: 78px;

  --ease: cubic-bezier(.22, .61, .36, 1);
  --ease-spring: cubic-bezier(.2, .8, .2, 1);
}