:root {
  --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Inter", system-ui, sans-serif;
  --font-mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, monospace;

  --bg: #f3f5f4;
  --text: #07120d;
  --text-2: rgba(7, 18, 13, 0.64);
  --text-3: rgba(7, 18, 13, 0.42);
  --separator: rgba(7, 18, 13, 0.08);

  --brand: #36ff9f;
  --brand-2: #00d68a;
  --brand-3: #1fe0c8;
  --brand-4: #0a9e66;
  --brand-ink: #04170e;
  --danger: #f5a524;
  --accent: #00a565;
  --grad-text: linear-gradient(120deg, var(--brand-4), var(--brand-2) 50%, var(--brand-3));

  --glass-bg: rgba(255, 255, 255, 0.22);
  --glass-bg-flat: rgba(255, 255, 255, 0.34);
  --glass-bg-strong: rgba(255, 255, 255, 0.42);
  --glass-tint: rgba(255, 255, 255, 0.08);
  --glass-edge: rgba(255, 255, 255, 0.85);
  --glass-edge-soft: rgba(255, 255, 255, 0.18);
  --glass-inner: rgba(255, 255, 255, 0.55);
  --glass-shadow: 0 12px 40px rgba(10, 60, 40, 0.14), 0 2px 6px rgba(10, 60, 40, 0.06);
  --glass-blur: 14px;
  --glass-saturate: 190%;

  --blob-1: #36ff9f;
  --blob-2: #e4e9e7;
  --blob-3: #1fe0c8;
  --blob-4: #ffffff;
  --blob-5: #dfe5e2;
  --blob-opacity: 0.32;

  --r-xs: 10px;
  --r-sm: 16px;
  --r-md: 24px;
  --r-lg: 34px;
  --r-pill: 999px;

  --gutter: clamp(16px, 4vw, 28px);
  --section-gap: clamp(64px, 10vw, 120px);

  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast: 180ms;
  --dur: 420ms;
  --dur-slow: 800ms;

  color-scheme: light;
}

[data-theme="dark"] {
  --bg: #070908;
  --text: #f2fff8;
  --text-2: rgba(242, 255, 248, 0.66);
  --text-3: rgba(242, 255, 248, 0.4);
  --separator: rgba(255, 255, 255, 0.08);

  --accent: var(--brand);
  --grad-text: linear-gradient(120deg, var(--brand), var(--brand-3));

  --glass-bg: rgba(255, 255, 255, 0.06);
  --glass-bg-flat: rgba(255, 255, 255, 0.08);
  --glass-bg-strong: rgba(255, 255, 255, 0.12);
  --glass-tint: rgba(255, 255, 255, 0.02);
  --glass-edge: rgba(255, 255, 255, 0.42);
  --glass-edge-soft: rgba(255, 255, 255, 0.06);
  --glass-inner: rgba(255, 255, 255, 0.16);
  --glass-shadow: 0 16px 50px rgba(0, 0, 0, 0.5), 0 2px 8px rgba(0, 0, 0, 0.3);

  --blob-1: #1fbf7a;
  --blob-2: #161b19;
  --blob-3: #0f8f80;
  --blob-4: #1c2220;
  --blob-5: #121614;
  --blob-opacity: 0.22;

  color-scheme: dark;
}