/* Shared colors and typography. No layout or interaction changes. */
@font-face {
  font-family: SirhozSans;
  src: url('assets/sans-regular.otf') format('opentype');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: SirhozSans;
  src: url('assets/sans-bold.otf') format('opentype');
  font-style: normal;
  font-weight: 600 900;
  font-display: swap;
}
@font-face {
  font-family: SirhozDisplay;
  src: url('assets/street-display.otf') format('opentype');
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
}
:root {
  --ocr: SirhozSans, Arial, sans-serif;
  --display: SirhozDisplay, SirhozSans, Arial, sans-serif;
}
body, body * {
  font-family: SirhozSans, Arial, sans-serif !important;
}
body h1, body h2, body h3,
body .wordmark, body .brand, body .poster-play strong {
  font-family: SirhozDisplay, SirhozSans, Arial, sans-serif !important;
}
body input, body select, body output,
body .track-price, body .track-timeline, body .seek-area {
  font-variant-numeric: tabular-nums;
}
body:not(.beat-store) .primary,
body:not(.beat-store) .accent,
body:not(.beat-store) .strip button.active {
  background-color: #a5f326;
  border-color: #a5f326;
  color: #edf5e8;
}
body:not(.beat-store) .primary:hover,
body:not(.beat-store) .accent:hover {
  background-color: #a5f326;
  color: #edf5e8;
}
body:not(.beat-store) .brand small {
  color: #bafa80;
  -webkit-text-stroke-color: transparent;
}
body:not(.beat-store) .key {
  background-color: #edf5e8;
  color: #11231a;
}
body:not(.beat-store) .key.black {
  background-color: #11231a;
  color: #edf5e8;
}