@font-face {
  font-family: 'Geist';
  src: url('assets/fonts/Geist-Variable.ttf') format('truetype');
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

@font-face {
  font-family: 'Apophis Display';
  src: url('assets/fonts/Apophis-Display-Regular.otf') format('opentype');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

:root {
  --font-body: 'Geist', sans-serif;
  --font-display: 'Apophis Display', serif;
}
body { font-family: var(--font-body); font-size: 18px; font-weight: 400; line-height: 25.2px; }
button, input, select, textarea { font-family: var(--font-body); }
p, #panel p, .body-regular { font-family: var(--font-body); font-size: 18px; font-weight: 400; line-height: 25.2px; }
.body-light { font-size: 18px; font-weight: 300; line-height: 25.2px; }
.body-small, .mobile-card strong { font-size: 14px; font-weight: 400; line-height: 19.6px; }
.body-small-medium, .identity, .categories .category-track button[aria-selected=true] { font-size: 14px; font-weight: 500; line-height: 19.6px; }
a, #panel a { font-family: var(--font-body); font-size: 12px; font-weight: 400; line-height: normal; }
.micro-label, .player .vinyl-label, .track-info span, .categories .category-track button { font-size: 12px; font-weight: 400; line-height: 16.8px; }
.micro-label-medium, .screen footer nav button { font-size: 12px; font-weight: 500; line-height: 19.2px; }
.micro-label-small, #panel .eyebrow, .music-times, .music-status { font-size: 10px; font-weight: 500; line-height: 16px; }
.identity span, #panel h2 { font-family: var(--font-display); font-weight: 400; line-height: 1.2; }
/* Keep the requested navigation labels readable at every viewport width. */
.screen footer nav button:is([data-nav="Works"], [data-nav="Resume"], [data-nav="Contact"], [data-nav="Play"]) {
 font-size: 16px;
 line-height: 22.4px;
}