@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Instrument+Serif:ital@0;1&family=JetBrains+Mono:wght@400;500&family=Sora:wght@400;500;600;700&display=swap");

:root {
  --tk-obsidian: #0A0A0B;
  --tk-night: #141016;
  --tk-plum: #3D2640;
  --tk-mauve: #8B5E83;
  --tk-orchid: #B85C9A;
  --tk-violet: #A35BC0;
  --tk-blush: #FF97D6;
  --tk-peach: #F8B994;
  --tk-mist: #F5F0F4;
  --tk-white: #FFFFFF;
  --tk-success: #31B47A;

  --bg: var(--tk-obsidian);
  --surface: #121014;
  --surface-2: #1A161C;
  --line: rgba(245, 240, 244, 0.09);
  --line-strong: rgba(245, 240, 244, 0.18);
  --text: var(--tk-mist);
  --text-2: rgba(245, 240, 244, 0.64);
  --text-3: rgba(245, 240, 244, 0.42);
  --accent: var(--tk-blush);
  --accent-ink: #1A0B16;

  --grad-aurora: linear-gradient(135deg, #F8B994 0%, #FF97D6 38%, #B85C9A 68%, #A35BC0 100%);
  --grad-dusk: linear-gradient(160deg, #3D2640 0%, #A35BC0 100%);
  --grad-text: linear-gradient(100deg, #F8B994 0%, #FF97D6 45%, #C38BE0 100%);
  --glow-orchid: radial-gradient(closest-side, rgba(184, 92, 154, 0.55), transparent);
  --glow-violet: radial-gradient(closest-side, rgba(163, 91, 192, 0.5), transparent);
  --glow-peach: radial-gradient(closest-side, rgba(248, 185, 148, 0.35), transparent);

  --font-display: "Sora", "Space Grotesk", system-ui, sans-serif;
  --font-body: "Inter", system-ui, sans-serif;
  --font-serif: "Instrument Serif", Georgia, serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;

  --r-sm: 10px;
  --r-md: 16px;
  --r-lg: 24px;
  --r-xl: 32px;
  --r-pill: 999px;
}