:root {
  --bg: #0B0B0B;
  --bg-2: #121212;
  --card: #17150F;
  --line: rgba(245, 196, 81, 0.14);
  --line-soft: rgba(255, 255, 255, 0.08);
  --text: #F4F1EA;
  --muted: rgba(244, 241, 234, 0.6);
  --gold: #F5C451;
  --gold-hi: #FFE29A;
  --gold-lo: #B8862B;
  --gold-grad: linear-gradient(135deg, var(--gold-hi), var(--gold) 45%, var(--gold-lo));
  --up: #22C55E;
  --down: #EF4444;
  --radius: 16px;
  --font: 'Sora', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --ease: cubic-bezier(.2, .8, .2, 1);
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: var(--font); line-height: 1.55; -webkit-font-smoothing: antialiased; }
img, svg, canvas, iframe { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; cursor: pointer; border: 0; background: none; }
h1, h2, h3 { line-height: 1.1; margin: 0; letter-spacing: -0.02em; }
p { margin: 0; }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; border-radius: 6px; }
[hidden] { display: none !important; }

.gold-text { background: var(--gold-grad); -webkit-background-clip: text; background-clip: text; color: transparent; font-style: normal; }
.muted { color: var(--muted); }
.up { color: var(--up); }
.down { color: var(--down); }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5em;
  padding: .9em 1.5em; border-radius: 10px; font-weight: 700; font-size: .95rem;
  transition: transform .2s var(--ease), box-shadow .2s var(--ease), background .2s;
}
.btn:active { transform: scale(.97); }
.btn-gold { background: var(--gold-grad); color: #1A1305; box-shadow: 0 8px 30px -10px rgba(245, 196, 81, .6); }
.btn-gold:hover { box-shadow: 0 12px 40px -8px rgba(245, 196, 81, .8); transform: translateY(-2px); }
.btn-ghost { border: 1px solid rgba(255, 255, 255, .25); }
.btn-ghost:hover { border-color: var(--gold); color: var(--gold); }
.btn-sm { padding: .6em 1.1em; font-size: .85rem; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}