/* assets/css/base.css */
/* Typography */
h1 { font-size: var(--font-size-2xl); font-weight: var(--font-weight-extrabold); }
h2 { font-size: var(--font-size-xl); font-weight: var(--font-weight-bold); }
h3 { font-size: var(--font-size-lg); font-weight: var(--font-weight-bold); }

.text-muted { color: var(--color-text-muted); }
.text-small { font-size: var(--font-size-sm); }
.text-center { text-align: center; }

/* Utility Classes */
.hidden { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; }

/* Scrollbar */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: var(--color-bg-secondary);
  border-radius: var(--radius-sm);
}

::-webkit-scrollbar-thumb {
  background: var(--color-border-strong);
  border-radius: var(--radius-sm);
}

::-webkit-scrollbar-thumb:hover {
  background: var(--color-text-muted);
}

/* Focus Styles */
:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}