/* Silkscreen is the display voice; VT323 adds a distinct handheld-game accent. */
@font-face {
  font-family: Retro;
  src: url('/fonts/retro.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
:root {
  --pixel: Pixel, monospace;
  --mono: Mono, monospace;
  --retro: Retro, monospace;
}

.wordmark,
.site-footer .wordmark,
.hero h1,
.section-heading h2,
.quest-intro h2,
.closing h2,
.detail-header h1,
.dialog-head h2,
.card-detail-layout h2,
.reward-dialog h2 {
  font-family: var(--pixel);
  font-weight: 400;
  font-style: normal;
  font-synthesis: none;
  letter-spacing: -.03em;
}
.wordmark { font-size: 27px; line-height: 1.2; letter-spacing: -1px; }
.site-footer .wordmark { font-size: 24px; letter-spacing: -1px; }
.wordmark > img {
  width: 64px;
  height: 64px;
  flex: none;
  object-fit: contain;
  image-rendering: pixelated;
}
.site-footer .wordmark > img { width: 54px; height: 54px; }
.closing .closing-emblem { width: 126px; height: 126px; margin-bottom: 16px; image-rendering: pixelated; }
.token-upload-preview:not(.has-image) > img[src$="pokepair-logo-pair.png"] { width: 110px; height: 110px; object-fit: contain; image-rendering: pixelated; }
.hero h1 { font-size: clamp(40px, 4.2vw, 62px); line-height: 1.3; }
.hero h1 > span:not(.word-shell) {
  font-family: var(--retro);
  font-size: 1.65em;
  font-weight: 400;
  line-height: .95;
  letter-spacing: -.025em;
}
.section-heading h2,
.quest-intro h2,
.closing h2 { font-size: clamp(25px, 2.7vw, 40px); line-height: 1.35; }
.quest-intro h2 em {
  font-family: var(--retro);
  font-size: 1.55em;
  font-style: normal;
  line-height: 1.05;
  letter-spacing: 0;
}
.detail-header h1 { font-size: clamp(26px, 3vw, 42px); line-height: 1.3; }
.dialog-head h2,
.card-detail-layout h2,
.reward-dialog h2 { font-size: 28px; line-height: 1.35; }

.partner-caption h2,
.token-tile-identity h3,
.empty-board h3,
.quest-row h3,
.album-cover h3,
.earned-album h3,
.milestone-row h3,
.detail-draft-notice h3,
.reward-dialog .reward-set {
  font-family: var(--retro);
  font-weight: 400;
  font-synthesis: none;
  font-size: 30px;
  line-height: 1.05;
  letter-spacing: 0;
}
.partner-caption h2 { font-size: 31px; }
.token-tile-identity h3 { font-size: 27px; }
.empty-board h3 { font-size: 32px; }
.milestone-row h3 { font-size: 27px; }
.reward-dialog .reward-set { font-size: 35px; }

.hero-description,
.section-heading > p,
.quest-intro > p,
.empty-board p {
  font-family: var(--mono);
  font-weight: 400;
  font-size: 13px;
  line-height: 1.9;
  letter-spacing: -.2px;
}
.hero-description { font-size: 14px; max-width: 450px; }
.quest-intro > .quest-fine { font-size: 11px; }
.hero-copy > .eyebrow,
.hero-topline,
.section-kicker,
.section-kicker > span:last-child,
.closing > .eyebrow,
.hero-bottom strong,
.hero-bottom a,
.desktop-nav,
.ticker > div {
  font-family: var(--retro);
  font-weight: 400;
  font-synthesis: none;
  letter-spacing: .4px;
}
.hero-copy > .eyebrow { font-size: 21px; line-height: 1.2; }
.hero-topline { font-size: 17px; letter-spacing: .7px; }
.section-kicker,
.section-kicker > span:last-child { font-size: 20px; }
.desktop-nav { font-size: 23px; }
.hero-bottom strong,
.hero-bottom a { font-size: 22px; line-height: 1.1; }
.ticker > div { font-size: 25px; letter-spacing: 1.4px; }
.closing > .eyebrow { font-size: 21px; }

.button,
.button.small,
.button.quiet,
.button.is-connected,
.hero-actions .button,
.head-actions .button.small,
.creator-art .upload-label,
.dialog-footer .button {
  font-family: var(--pixel);
  font-size: 12px;
  font-weight: 400;
  font-synthesis: none;
  line-height: 1.5;
  letter-spacing: -.2px;
}
.button.small,
.button.is-connected,
.head-actions .button.small { font-size: 10px; }
.quest-intro .button,
.catalog-pagination .button,
.closing .button,
.detail-actions .button,
.detail-sync .button {
  font-family: var(--pixel);
  font-weight: 400;
  font-size: 11px;
  line-height: 1.5;
}
.segmented button,
.detail-tabs button,
.text-button { font-family: var(--retro); font-size: 23px; font-weight: 400; line-height: 1.1; }
.quest-number,
.reward-icon,
.detail-stat > strong,
.mini-cover.locked,
.mini-cover.more,
.empty-board .empty-mark,
.pixel-medal span,
.cover-book,
.earned-album.locked .cover-book,
.milestone-row > .quest-number,
.unknown-album,
.mini-album,
.reward-burst {
  font-family: var(--retro);
  font-weight: 400;
  font-synthesis: none;
  letter-spacing: 0;
}
.quest-number { font-size: 26px; }
.reward-icon { font-size: 34px; }
.detail-stat > strong { font-size: 41px; }
.milestone-row > .quest-number { font-size: 27px; }
.earned-album.locked .cover-book { font-size: 50px; }
.detail-draft-notice .button { margin-top: 15px; }
.token-tile-identity h3,
.album-cover h3,
.earned-album h3 { overflow-wrap: anywhere; }
.launch-dialog .launch-head h2 { font: 400 24px/1.4 var(--pixel); letter-spacing: -.5px; }
.launch-dialog .launch-head > div > span,
.launch-dialog .launch-main h3 { font: 400 25px/1.15 var(--retro); }
.launch-dialog .launch-actions button:not(.launch-close) { font: 400 11px/1.5 var(--pixel); }

@media (min-width:1650px) {
  .hero h1 { font-size: 66px; }
  .hero-copy { max-width: 620px; }
}
@media (max-width:1200px) {
  .wordmark { font-size: 25px; }
  .wordmark > img { width: 58px; height: 58px; }
  .hero h1 { font-size: 43px; }
  .hero-copy > .eyebrow { font-size: 17px; }
  .hero-topline { font-size: 14px; }
  .hero-description { font-size: 12px; }
  .hero-actions .button { font-size: 10px; }
  .partner-caption h2 { font-size: 26px; }
  .hero-bottom strong,.hero-bottom a { font-size: 20px; }
  .section-heading h2,.quest-intro h2 { font-size: 29px; }
}
@media (max-width:950px) {
  .hero h1 { font-size: 35px; }
  .hero-copy > .eyebrow { font-size: 15px; }
  .hero-topline { font-size: 12px; }
  .hero-description { font-size: 11px; }
  .hero-actions .button { font-size: 9px; padding-inline: 13px; }
  .hero-bottom strong,.hero-bottom a { font-size: 17px; }
  .partner-caption h2 { font-size: 23px; }
  .section-heading h2,.quest-intro h2 { font-size: 27px; }
  .quest-row h3 { font-size: 26px; }
}
@media (max-width:700px) {
  .wordmark { font-size: 25px; }
  .wordmark > img { width: 56px; height: 56px; }
  .site-footer .wordmark > img { width: 48px; height: 48px; }
  .closing .closing-emblem { width: 106px; height: 106px; }
  .token-upload-preview:not(.has-image) > img[src$="pokepair-logo-pair.png"] { width: 62px; height: 62px; }
  .hero h1 { font-size: clamp(32px, 7.8vw, 48px); line-height: 1.3; }
  .hero-copy > .eyebrow { font-size: 17px; }
  .hero-description { font-size: 12px; max-width: 370px; }
  .hero-topline { font-size: 14px; }
  .hero-actions .button { font-size: 10px; padding-inline: 14px; }
  .head-actions .button.small { font-size: 9px; padding-inline: 10px; }
  .partner-caption h2 { font-size: 24px; }
  .section-kicker,.section-kicker > span:last-child { font-size: 16px; letter-spacing: .2px; }
  .section-heading h2,.quest-intro h2,.closing h2 { font-size: 28px; line-height: 1.35; }
  .section-heading > p,.quest-intro > p { font-size: 12px; }
  .quest-intro > .quest-fine { font-size: 10px; }
  .token-tile-identity h3 { font-size: 22px; max-width: 105px; }
  .album-cover h3 { font-size: 23px; }
  .empty-board h3 { font-size: 29px; }
  .empty-board p { font-size: 12px; }
  .earned-album h3 { font-size: 26px; }
  .detail-header h1 { font-size: 28px; }
  .detail-stat > strong { font-size: 34px; }
  .dialog-head h2,.card-detail-layout h2,.reward-dialog h2 { font-size: 24px; }
  .dialog-footer .button { font-size: 11px; }
  .milestone-row h3 { font-size: 24px; }
  .milestone-row > .quest-number { font-size: 24px; }
  .reward-dialog .reward-set { font-size: 31px; }
  .earned-album .text-button { font-size: 21px; }
  .launch-dialog .launch-head h2 { font-size: 21px; }
  .launch-dialog .launch-actions button:not(.launch-close) { font-size: 10px; }
}
@media (max-width:370px) {
  .wordmark { font-size: 21px; }
  .wordmark > img { width: 44px; height: 44px; }
  .hero h1 { font-size: 29px; }
  .hero-copy > .eyebrow { font-size: 15px; }
  .hero-actions .button { font-size: 9px; padding-inline: 12px; }
  .head-actions .button.small { font-size: 8px; padding-inline: 8px; }
  .partner-caption h2 { font-size: 21px; }
  .section-heading h2,.quest-intro h2,.closing h2 { font-size: 25px; }
  .token-tile-identity h3 { font-size: 19px; max-width: 80px; }
  .album-cover h3 { font-size: 21px; }
}