:root {
  color-scheme: dark;
  --bg: #03111f;
  --bg-elevated: #081a2d;
  --bg-panel: rgba(7, 24, 43, 0.74);
  --bg-panel-strong: rgba(7, 28, 49, 0.92);
  --bg-panel-accent: rgba(82, 224, 255, 0.12);
  --text: #f1fbff;
  --text-soft: #cfdeef;
  --muted: #89a0bd;
  --line: rgba(120, 214, 255, 0.16);
  --line-strong: rgba(130, 242, 255, 0.34);
  --cyan: #52e0ff;
  --green: #6ff5c7;
  --blue: #7ea4ff;
  --violet: #a7b2ff;
  --highlight: #ffffff;
  --shadow: 0 35px 90px rgba(0, 0, 0, 0.42);
  --radius-sm: 1rem;
  --radius-md: 1.5rem;
  --radius-lg: 2.2rem;
  --space-2xs: 0.35rem;
  --space-xs: 0.625rem;
  --space-sm: 0.95rem;
  --space-md: 1.35rem;
  --space-lg: 2rem;
  --space-xl: 3rem;
  --space-2xl: 4.5rem;
  --space-3xl: 6rem;
  --container: min(100% - 2rem, 78rem);
  --container-wide: min(100% - 2rem, 106rem);
  --display: "Aptos Display", "Segoe UI Variable Display", "Bahnschrift", "Segoe UI", sans-serif;
  --body: "Aptos", "Segoe UI Variable Text", "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --mono: "Cascadia Mono", "Consolas", "Liberation Mono", monospace;
  --transition: 180ms ease;
}

@media (min-width: 80rem) {
  :root {
    --container: min(100% - 4rem, 82rem);
    --container-wide: min(100% - 4rem, 118rem);
  }
}