:root {
  --bg-color: #fcfaf7;
  --text-primary: #1a1a1a;
  --text-secondary: #595959;
  --accent: #d4af37;
  --border: #e0ddd5;
  --card-bg: #ffffff;
  --card-shadow: 0 2px 8px rgba(0,0,0,0.05);
  --font-main: 'Inter', system-ui, sans-serif;
  --transition: 0.3s ease;
  --danger: #ef4444;
  --success: #10b981;
  --warning: #f59e0b;
  --info: #3b82f6;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg-color: #121212;
    --text-primary: #e6e6e6;
    --text-secondary: #a0a0a0;
    --accent: #ffcc33;
    --border: #2a2a2a;
    --card-bg: #1e1e1e;
    --card-shadow: none;
  }
}

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

body {
  background-color: var(--bg-color);
  color: var(--text-primary);
  font-family: var(--font-main);
  line-height: 1.6;
  transition: background-color var(--transition), color var(--transition);
  user-select: none;
}

h1, h2, h3 {
  color: var(--text-primary);
  font-weight: 700;
}

a {
  color: var(--accent);
  text-decoration: none;
  transition: opacity var(--transition);
}

a:hover {
  opacity: 0.8;
}

button {
  background-color: var(--text-primary);
  color: var(--bg-color);
  border: none;
  padding: 0.8rem 1.5rem;
  border-radius: 4px;
  cursor: pointer;
  font-weight: 600;
  transition: transform 0.1s active;
}

button:hover {
  filter: brightness(1.1);
}

.secondary-text {
  color: var(--text-secondary);
}

input, textarea{
  caret-color: var(--accent);
  outline: none;
  caret-shape: underscore;
}