/* Probemas typography — Inter single-family stack
 *
 * Replaces the previous 112-declaration multi-family CSS. Single Inter
 * variable woff2 covers all weights (100-900) and optical sizes (text/display).
 *
 * Type-scale lock: 2026-05-06. See
 * ~/.claude/projects/-home-probemas/memory/project_inter_font_lock_2026_05_06.md
 */

@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  font-optical-sizing: auto;
  src: local('Inter'),
       local('InterVariable'),
       url('/fonts/InterVariable.woff2') format('woff2-variations'),
       url('/fonts/InterVariable.woff2') format('woff2');
}

/* No italic @font-face — Inter Italic ships as a separate variable file
 * we don't currently bundle (would add ~100 KB). For the rare <em> /
 * <i> in Probemas UI, browsers synthesize italic from the upright
 * Inter via faux-italic transform. If/when we add italic UI prominently
 * (e.g. testimonials with italic styling), download Inter-Italic-VariableFont
 * subset and add the @font-face block here.
 */

/* Inter Fallback — Arial with Inter's exact metrics overridden onto it.
 * Layout doesn't shift when Inter swaps in, because Arial-with-overrides
 * already occupies the same horizontal/vertical space as Inter. Numbers
 * come from the official Inter project's published fallback overrides.
 * https://github.com/rsms/inter#cross-platform-rendering-tips
 */
@font-face {
  font-family: 'Inter Fallback';
  src: local('Arial'), local('Helvetica');
  size-adjust: 107.4%;
  ascent-override: 90%;
  descent-override: 22.5%;
  line-gap-override: 0%;
}

/* Form-element font-family reset.
 *
 * HTML form controls (button, input, select, textarea) do NOT inherit
 * font-family from their parent — browsers apply a user-agent default
 * (Arial on Linux/Windows, system-ui on macOS). Without this reset,
 * footer Mui<Link component="button"> elements and any other styled
 * <button> without an explicit font-family fall through to that UA
 * default, breaking the single-family Inter lock.
 *
 * `inherit` is non-destructive: any control that explicitly sets
 * font-family in JSS/CSS keeps its explicit value (specificity wins).
 */
button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
}