/* docs/features/technical/game-shell/ — canonical in-engine typography */

@font-face {
  font-family: "Metamorphous";
  src: url("/assets/fonts/Metamorphous/Metamorphous-Regular.ttf?v=b67162051c17") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Eagle Lake";
  src: url("/assets/fonts/Eagle_Lake/EagleLake-Regular.ttf?v=353e916e8bbd") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --game-font-body: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, sans-serif;
  --game-font-display: "Metamorphous", var(--game-font-body);
  /* Legacy alias — prefer --game-font-display for primary chrome. */
  --game-font-family: var(--game-font-display);
  /* Display face reads large in chat/journal lines — scale down vs body copy (1 = no change). */
  --game-font-chat-display-scale: 0.88;
}

/* Scoped typography: add .game-typography on play-shell / HOL body (SPA main.ts, auth/landing templates). */
.game-typography {
  --font-body: var(--game-font-body);
  --font-display: var(--game-font-display);
  font-family: var(--font-body);
}

.game-typography :is(input, select, textarea, optgroup) {
  font-family: var(--font-body);
}

/* Detail / secondary copy — body face even inside display-styled parents. */
.game-typography :is(
  [class*="__subtext"],
  [class*="__hint"],
  [class*="__meta"],
  .formation-panel__sub,
  .global-settings-dialog__sub,
  .global-settings-dialog__fine-print,
  .game-card__skills,
  .game-card__skills-dialog,
  .game-card__skill-line,
  .tavern-recruit-option__caption
) {
  font-family: var(--font-body);
}

/* Primary chrome — display face (headlines, buttons, titles, identifiers). */
.game-typography :is(
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  button:not(.gsi-material-button),
  .game-font-display,
  [class*="__title"],
  [class*="-title"],
  [class*="__caption"],
  .onscreen-location__label,
  .campaign-hotspot__label,
  .game-card__name,
  .game-card__cd,
  .game-card__stat-value,
  .game-card__star,
  .game-card__skill-icon-badge,
  .game-mode-bar .game-mode-bar__title,
  .game-mode-bar .game-mode-bar__link,
  .game-mode-bar .game-mode-bar__tab-caption,
  .global-settings-dialog__summary,
  .global-settings-dialog__nav-tab,
  .town-nav-btn,
  .decal-action-btn__face,
  .decal-engage-btn__face,
  .decal-engage-btn__measure,
  .tavern-recruit-buy,
  .nav-brand
) {
  font-family: var(--font-display);
}
