/* frontend/css/base.css */

/* =========================
   CSS RESET
========================= */
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html, body {
  height: 100%;
}

body {
  font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  line-height: 1.5;
  background-color: var(--bg);
  color: var(--text);
}

/* =========================
   DESIGN TOKENS
========================= */
:root {
  /* Brand */
  --gold: #d4af37;
  --gold-soft: #e6c85c;
  --black: #0b0b0b;

  /* Semantic */
  --bg: #0b0b0b;
  --bg-alt: #141414;
  --surface: #1b1b1b;

  --text: #f2f2f2;
  --text-muted: #b3b3b3;

  --border: rgba(255, 215, 0, 0.25);

  --danger: #d9534f;
  --success: #4caf50;

  /* Spacing */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;

  /* Radius */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;

  /* Transition */
  --fast: 150ms ease;
  --normal: 250ms ease;
}

/* =========================
   TYPOGRAPHY
========================= */
h1, h2, h3, h4 {
  font-weight: 600;
  color: var(--gold);
  margin-bottom: var(--space-sm);
}

p {
  margin-bottom: var(--space-md);
  color: var(--text-muted);
}

a {
  color: var(--gold);
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}