/* ============================================================
   Base — Reset, tipografia, helpers
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html, body {
  height: 100%;
  background: var(--bg-primary);
  color: var(--text-primary);
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: var(--text-primary);
}

a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }

button { font-family: inherit; cursor: pointer; border: none; background: none; color: inherit; }
input, select, textarea { font-family: inherit; }
img { max-width: 100%; height: auto; display: block; }

.mono { font-family: var(--font-mono); font-feature-settings: 'tnum'; }

::selection { background: var(--accent); color: var(--bg-primary); }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--bg-secondary); }
::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 5px; }
::-webkit-scrollbar-thumb:hover { background: var(--border-accent); }

/* Helpers de texto */
.text-xs    { font-size: 11px; }
.text-sm    { font-size: 12px; }
.text-md    { font-size: 14px; }
.text-lg    { font-size: 16px; }
.text-xl    { font-size: 20px; }
.text-muted { color: var(--text-tertiary); }
.text-secondary { color: var(--text-secondary); }
.text-accent { color: var(--accent); }
.text-bold { font-weight: 700; }
.text-center { text-align: center; }
.text-right  { text-align: right; }

.pos { color: var(--gain) !important; }
.neg { color: var(--loss) !important; }

.hidden { display: none !important; }

/* Animações */
@keyframes fadeIn  { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
@keyframes spin    { from { transform: rotate(0); } to { transform: rotate(360deg); } }
@keyframes pulse   { 0%, 100% { opacity: 1; } 50% { opacity: 0.55; } }
@keyframes shimmer { 0% { background-position: -200% 0; } 100% { background-position: 200% 0; } }