@font-face {
  font-family: "Monogram";
  src: url("./monogram-extended.woff2") format("woff2");
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  /* Monogram's capitals occupy half as much of the em as Pixel Operator 8. */
  size-adjust: 200%;
  ascent-override: 43.75%;
  descent-override: 6.25%;
  line-gap-override: 4.5%;
}

:root {
  --game-font: "Monogram", "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", system-ui, monospace;
}

body, body *, body *::before, body *::after, body *::marker {
  font-family: var(--game-font) !important;
}

/* Keep the pixel face readable without letting longer labels push out prices or stats. */
#hud .resource-value {
  font-size: 13px;
  letter-spacing: 0;
  line-height: 1;
}
#hr .wave-label { font-size: clamp(9.9px, 2.88vw, 13.5px); line-height: 1; }
#tabs button .tab-label { font-size: clamp(11px, 3.1vw, 14px); line-height: 1; }
@media (max-width: 350px) {
  #tabs button .tab-label { font-size: 10px; }
}

#panel.carousel-mode :is(#upgrade-carousel, #buildings-panel) { flex-basis: 97px; }
#panel.carousel-mode :is(#list, #building-cards) > .up {
  height: 88px;
  min-height: 88px;
  max-height: 88px;
}
#panel.carousel-mode :is(#list, #building-cards) > .up .up-info b {
  align-items: flex-start;
  font-size: 11.7px;
  line-height: 1;
}
#panel.carousel-mode :is(#list, #building-cards) > .up .up-info b > span {
  min-width: 0;
  overflow-wrap: anywhere;
}
#panel.carousel-mode #list > .up .up-info b small {
  font-size: 9px;
  line-height: 1.25;
  white-space: nowrap;
}
#panel.carousel-mode #list > .up .up-desc { font-size: 9.9px; line-height: 1.08; }
#panel.carousel-mode #list > .up.has-resource-cost .up-info b { font-size: 10.8px; }
#panel.carousel-mode #list > .up.has-resource-cost .up-desc { font-size: 9px; }
#panel.carousel-mode :is(#list, #building-cards) > .up .up-buy { font-size: 11.7px; }
#building-menu #factory-content .factory-card-strip > .up .up-info b {
  font-size: 11.7px;
  line-height: 1.1;
}
#building-menu #factory-content .factory-card-strip > .up .up-info b small { font-size: 9px; }
#building-menu #factory-content .factory-card-strip > .up .up-desc { font-size: 9.9px; }
#building-menu #factory-content .factory-card-strip > .up .up-buy { font-size: clamp(8.1px, 2.16vw, 9.9px); }
:is(#workshop-upgrades, #store-upgrades) .up .up-info b { font-size: clamp(9.9px, 2.7vw, 11.7px); }
:is(#workshop-upgrades, #store-upgrades) .up .up-info b small { font-size: 9px; }
:is(#workshop-upgrades, #store-upgrades) .up .up-desc { font-size: 9.9px; }
:is(#workshop-upgrades, #store-upgrades) .up .up-buy { font-size: 10.8px; }
@media (max-height: 650px) {
  :is(#workshop-upgrades, #store-upgrades) .up .up-buy { font-size: 9.9px; }
}

#soul-screen #soul-tree-board .soul-node .soul-node-copy strong {
  font-size: 12.6px;
  line-height: 1;
  overflow-wrap: anywhere;
}
#soul-screen #soul-tree-board .soul-node .soul-node-copy small {
  font-size: 9.9px;
  line-height: 1.08;
}
#soul-screen #soul-tree-board :is(.soul-level, .soul-prerequisite) {
  font-size: 9px;
  line-height: 1;
}
#soul-screen #soul-tree-board .soul-price { font-size: 10.8px; }
#prestige-screen .prestige-card-copy strong { font-size: 12.6px; }
#prestige-screen .prestige-card-copy small { font-size: 8.1px; }
#prestige-screen #prestige-upgrades .prestige-card p { font-size: 9.9px; }
#prestige-screen #prestige-upgrades .prestige-buy { font-size: 13.5px; }
@media (max-width: 360px) {
  #prestige-screen .prestige-card-copy strong { font-size: 10.8px; }
  #prestige-screen #prestige-upgrades .prestige-buy { font-size: 11.7px; }
}

#game-frame .excavation-shaft { gap: 4px; }
#game-frame .excavation-shaft > button { flex: 0 0 30px; min-width: 0; padding-inline: 3px; }
#game-frame .excavation-shaft > button:last-child {
  flex-basis: 84px;
  white-space: normal;
  overflow-wrap: anywhere;
  font-size: 9px;
  line-height: 1;
}
#game-frame .excavation-shaft > span { font-size: 13px; }
#game-frame .excavation-shaft > span small { font-size: 9.5px; }

#excavation-dock #excavation-upgrades { height: 97px; }
#excavation-dock #excavation-upgrades .miner-upgrade {
  grid-template-rows: 25px 12px 11px 24px;
  align-items: center;
  height: 88px;
  min-height: 88px;
  max-height: 88px;
}
#excavation-dock #excavation-upgrades .miner-upgrade strong {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 3px;
  font-size: 11.7px;
  line-height: .95;
  white-space: normal;
}
#excavation-dock #excavation-upgrades .miner-upgrade strong > span {
  min-width: 0;
  font: inherit;
  color: inherit;
  overflow-wrap: anywhere;
}
#excavation-dock #excavation-upgrades .miner-upgrade strong > small {
  flex: none;
  font-size: 9px;
  line-height: 1.15;
  color: #d6c5a6;
  white-space: nowrap;
}
#excavation-dock #excavation-upgrades .miner-stats { font-size: 10.8px; line-height: 1; }
#excavation-dock #excavation-upgrades .miner-next { font-size: 9.9px; line-height: 1; }
#excavation-dock #excavation-upgrades .miner-upgrade b { align-self: stretch; font-size: 11.7px; }
#excavation-dock #excavation-status { justify-content: safe center; }
#excavation-dock #excavation-status .resource-wallet-empty { font-size: 11px; }
#excavation-dock #excavation-status .resource-wallet-item { font-size: 12px; }