/* Single type scale. Rem units preserve browser font preferences and zoom.
   At the usual 16px browser default: secondary 14, body 16, card titles 18,
   section headings 20, detail titles 24 and page headings 28–32px. */
:root{
 font-size:100%;
 --type-small:.875rem;
 --type-body:1rem;
 --type-card:1.125rem;
 --type-section:1.25rem;
 --type-detail:1.5rem;
 --type-page:2rem;
}
body{font-size:var(--type-body);line-height:1.5}
button,input,select,textarea{font-size:var(--type-body);line-height:1.5}
button{font-weight:500}
input,select,textarea{font-weight:400}
h1,h2,h3{font-weight:600;line-height:1.25;letter-spacing:-.02em}
h1,.page-heading h1,.intro h1,.login-form h1,.summary>h1{font-size:var(--type-page);line-height:1.25}
h2,.panel h2,.empty h2{font-size:var(--type-section);line-height:1.3}
h3,.word,.grid .word,.trade-preview-card .word,.preview-group .word{font-size:var(--type-card);line-height:1.3;letter-spacing:-.01em}
.reveal .word,dialog .word{font-size:var(--type-detail);line-height:1.25}
.nav button,.primary,.secondary,.danger-button,.pack-stage>.pack-open,.login-form .primary,.reveal>.primary,.row .primary,.row .secondary{font-size:var(--type-body);line-height:1.5}
.filters input,.filters select,.favorites-filter,.rarities button,.rarities button span,.field-label,.login-form label,.trade-form label{font-size:var(--type-body);line-height:1.5}
.intro p,.page-heading p,.empty p,.inline-empty,.inline-empty p,.login-art>p{font-size:var(--type-body);line-height:1.5}
.translations,.grid .translations,.trade-preview-card .translations,.reveal .translations,dialog .translations{font-size:var(--type-body);line-height:1.5}
.preview-group .translations{font-size:var(--type-small);line-height:1.5}
.help,.login-form>p.help,.login-fields .login-recipient,.login-form #login-status,.login-form .text-button,.text-button,.compact,.row small,.trade-preview-card small,.dialog-meta,.dialog-meta p,.owned-status,.results-line,.results-line .text-button,.pagination,.pagination .secondary,.timer,.stock small,.stat span,.about-panel>summary{font-size:var(--type-small);line-height:1.5}
.card-foot,.grid .card-foot,.reveal .card-foot,.trade-preview-card .card-foot,.preview-group .card-foot{font-size:var(--type-small);line-height:1.4;letter-spacing:0;font-weight:500}
.badge,.reveal .badge,.preview-group .badge,.ownership-label,.nav-count,.count-badge,.eyebrow,.new-label{font-size:var(--type-small);line-height:1.4}
.collection-progress .progress-title h2,.collection-progress .rarity-stats>div,.collection-progress .rarity-stats b,.collection-progress .rarity-stats small,.rarity-stats>div,.rarity-stats small{font-size:var(--type-small);line-height:1.5}
.collection-progress .progress-title strong,.reveal .counter,.reveal .counter b{font-size:var(--type-body);line-height:1.5}
.progress-title>strong{font-size:var(--type-section)}
.stat b{font-size:1.75rem;line-height:1.25}
.stock strong{font-size:var(--type-detail);line-height:1.3}
.stock strong span{font-size:var(--type-section)}
.word-link{font-size:var(--type-body);line-height:1.5}
#toast{font-size:var(--type-small);line-height:1.5}
.photo-credit{font-size:var(--type-small);line-height:1.5}
.login-steps strong{font-size:var(--type-body);line-height:1.5}
.login-steps span{font-size:var(--type-small);line-height:1.5}
.brand,.sidebar>.brand{font-size:1.625rem;line-height:1.2}
.login-brand{font-size:1.75rem}
.brand-mark,.login-brand .brand-mark{font-size:var(--type-detail)}
.mobile-brand{font-size:1.375rem;line-height:1.2}
.brand small,.mini-profile small,.subtle-button,.prototype-note,.login-footer,.pack-label,.rules-row,.booster-content small{font-size:var(--type-small);line-height:1.5}
.topbar,.topbar .pill,.pill{font-size:var(--type-body);line-height:1.5}
.login-form #login-code,#delete-account-form input{font-size:var(--type-detail);line-height:1.5;font-variant-numeric:tabular-nums}
/* Decorative lettering belongs to the pack illustration, outside the UI scale. */
.pack-symbol{font-size:4.5rem}
.booster-content strong{font-size:var(--type-section)}
.booster-content .swirl{font-size:8.125rem}
@media(max-width:720px){
 h1,.page-heading h1,.intro h1,.login-form h1,.summary>h1{font-size:1.75rem}
 .nav button{font-size:var(--type-small)}
 .sidebar .nav button{font-size:var(--type-body)}
 .sidebar>.brand{font-size:1.5rem}
}