:root {
  /* Typography - matching app */
  --font-family: 'Rethink Sans', system-ui, Avenir, Helvetica, Arial, sans-serif;
  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-weight-extrabold: 800;

  /* Colors - from app index.css */
  --color-primary: #646cff;
  --color-primary-hover: #535bf2;
  --color-background: #242424;
  --color-card-bg: #1a1a1a;
  --color-text: rgba(255, 255, 255, 0.87);
  --color-text-secondary: rgba(255, 255, 255, 0.75);
  --color-text-muted: rgba(255, 255, 255, 0.5);
  --color-text-faint: rgba(255, 255, 255, 0.4);
  --color-danger: #ff4444;
  --color-success: #2ecc71;

  /* Spacing */
  --spacing-xs: 0.25rem;
  --spacing-sm: 0.5rem;
  --spacing-md: 1rem;
  --spacing-lg: 2rem;
  --spacing-xl: 4rem;
  --spacing-2xl: 6rem;
  --spacing-3xl: 12rem;

  /* Layout */
  --border-radius: 8px;
  --border-radius-sm: 4px;
  --border-radius-lg: 12px;
  --border-radius-xl: 16px;
  --container-max: 1200px;
  --container-padding: 2rem;

  /* Transitions */
  --transition-speed: 0.2s;
  --transition-timing: ease-out;

  /* Glassmorphism - from app */
  --glass-bg-light: rgba(0, 0, 0, 0.08);
  --glass-bg: rgba(0, 0, 0, 0.1);
  --glass-bg-medium: rgba(0, 0, 0, 0.15);
  --glass-bg-dark: rgba(0, 0, 0, 0.2);
  --glass-blur: blur(150px);
  --glass-blur-light: blur(100px);
  --glass-border: 1px solid rgba(255, 255, 255, 0.1);
  --glass-border-hover: 1px solid rgba(255, 255, 255, 0.2);

  /* Button backgrounds - from app */
  --btn-bg-default: rgba(0, 0, 0, 0.10);
  --btn-bg-hover: rgba(0, 0, 0, 0.20);
  --btn-bg-primary: rgba(0, 0, 0, 0.20);
  --btn-bg-primary-hover: rgba(0, 0, 0, 0.30);

  /* Button text - from app */
  --btn-text-default: rgba(255, 255, 255, 0.75);
  --btn-text-hover: rgba(255, 255, 255, 1);
  --btn-text-muted: rgba(255, 255, 255, 0.5);

  /* Shadows */
  --shadow-sm: 0 0 32px 0 rgba(0, 0, 0, 0.25);
  --shadow-md: 0 0 64px 0 rgba(0, 0, 0, 0.25);
  --shadow-lg: 0 0 96px 0 rgba(0, 0, 0, 0.3);

  /* Z-index */
  --z-nav: 1000;
  --z-mobile-menu: 999;
  --z-overlay: 998;
}
