@import 'nav.css';

:root {
  /* Colors */
  --bg-color: #f5f0e6;
  --text-color: #1a1a1a;
  --text-muted: #4b5563;
  --text-light: #6b7280;
  
  --accent-pink: #ff9cc2;
  --accent-blue: #a2d2ff;
  --accent-yellow: #fefcbf;
  --accent-green: #b7e4c7;
  
  --border-color: #e5e5e5;
  --card-bg: white;
  
  --font-sans: 'Inter', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;
  --font-hand: 'Patrick Hand', cursive;
  
  /* Shadows */
  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

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

body {
  background-color: var(--bg-color);
  background-image: radial-gradient(#d7cfc2 1px, transparent 1px);
  background-size: 24px 24px;
}