:root {
  /* Brand colors */
  --blue:     #003AF4;
  --violet:   #7A3FF5;
  --charcoal: #151E27;
  --cherry:   #FF4D7A;
  --ocean:    #4D9CFF;
  --green:    #1D9E75;
  --amber:    #EF9F27;

  /* Gradient */
  --grad: linear-gradient(135deg, #003AF4 0%, #7A3FF5 100%);

  /* Glass surfaces */
  --glass:        rgba(255, 255, 255, 0.72);
  --glass-border: rgba(0, 58, 244, 0.10);

  /* Page background */
  --page-bg: linear-gradient(135deg, #fafbfc 0%, #eef2fb 100%);

  /* Shadows */
  --shadow-card: 0 4px 24px rgba(0, 58, 244, 0.07);
  --shadow-hover: 0 8px 26px rgba(0, 58, 244, 0.10);
  --shadow-modal: 0 30px 80px rgba(0, 58, 244, 0.22);
  --shadow-nav:   0 4px 14px rgba(80, 50, 200, 0.25);

  /* Typography */
  --font: 'Manrope', -apple-system, Arial, sans-serif;
}

*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  font-family: var(--font);
  color: var(--charcoal);
  background: var(--page-bg);
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
}

button, input {
  font-family: inherit;
}

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

.page-loading {
  padding: 48px 32px;
  color: #7a8390;
  font-size: 14px;
}