:root {
  color-scheme: light dark;
  --sc-bg: #f6f9ff;
  --sc-surface: #ffffff;
  --sc-surface-2: #eef4ff;
  --sc-text: #0b1220;
  --sc-muted: #526074;
  --sc-line: rgba(12, 28, 54, 0.13);
  --sc-primary: #1266f1;
  --sc-primary-strong: #084ad8;
  --sc-cyan: #08b9d7;
  --sc-green: #18a957;
  --sc-yellow: #f4b740;
  --sc-red: #e64848;
  --sc-purple: #7657ff;
  --sc-radius-sm: 8px;
  --sc-radius-md: 12px;
  --sc-radius-lg: 18px;
  --sc-shadow-soft: 0 16px 50px rgba(15, 38, 80, 0.14);
  --sc-shadow-card: 0 12px 34px rgba(15, 38, 80, 0.1);
  --sc-max: 1180px;
  --sc-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --sc-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
}

[data-theme="dark"] {
  --sc-bg: #07111f;
  --sc-surface: #101b2d;
  --sc-surface-2: #13243a;
  --sc-text: #edf6ff;
  --sc-muted: #9cafc7;
  --sc-line: rgba(224, 242, 255, 0.14);
  --sc-shadow-soft: 0 18px 60px rgba(0, 0, 0, 0.34);
  --sc-shadow-card: 0 12px 36px rgba(0, 0, 0, 0.25);
}

* {
  box-sizing: border-box;
}

html {
  min-height: 100%;
  background: var(--sc-bg);
}

body {
  margin: 0;
  font-family: var(--sc-font);
  background:
    radial-gradient(circle at top left, rgba(18, 102, 241, 0.14), transparent 34rem),
    linear-gradient(180deg, var(--sc-bg), color-mix(in srgb, var(--sc-bg), var(--sc-surface-2) 36%));
  color: var(--sc-text);
  min-height: 100vh;
}

a {
  color: inherit;
  text-decoration: none;
}

button,
input,
textarea,
select {
  font: inherit;
}