:root {
  --site-font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --site-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  --site-menu-font-size: 0.92rem;
  --site-brand-name-size: 1.16rem;
  --site-brand-role-size: 0.62rem;
}

.nav,
.site-menu {
  font-family: var(--site-font-sans);
}

.brand-name {
  color: var(--text);
  font-size: var(--site-brand-name-size);
  font-weight: 920;
  line-height: 1;
  letter-spacing: 0.005em;
  text-shadow: 0 1px 10px color-mix(in srgb, var(--accent) 8%, transparent);
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}

.brand-role {
  color: var(--muted);
  font-family: var(--site-font-mono);
  font-size: var(--site-brand-role-size);
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.nav-links a,
.nav-actions a,
.nav-actions button,
.theme-toggle,
.mobile-menu-btn {
  font-family: var(--site-font-sans);
  font-size: var(--site-menu-font-size);
  font-weight: 400;
  letter-spacing: 0;
}