/* Self-hosted screen typography: optical serif for titles, sans for compact UI. */
:root{--font-display:"Literata",Georgia,serif;--font-ui:"Golos Text",system-ui,sans-serif}
body{font-family:var(--font-ui);font-optical-sizing:auto}
button,input,select,textarea{font-optical-sizing:auto}
.home-menu button{font-size:20px;line-height:1.4}
.home-subhead h2{font-size:24px;line-height:1.35}
.home-menu .home-back{font-size:14px;flex-shrink:0}
.home-label,.account-form label{font-size:14px;line-height:1.5}
body #modal h2{font-size:28px;line-height:1.35}
body #modal button,body .result button{font-size:17px;line-height:1.4}
body #modal p,body #modal li{line-height:1.65}
.game .opponent .status,.game .hand-count-text,.game .sort-label,
.club-op-score,.club-phase,.club-control-label,.club-selected-count,.club-coach p,
.club-coach-example small,.club-last-action,.club-card-owner{font-family:var(--font-ui)}
.game .opponent .name{line-height:1.4}
.game .turn-text{line-height:1.25}
.game .turn-text small{font-family:var(--font-ui);font-size:1.35cqw;line-height:1.45}
.game .actions button{font-size:1.65cqw;line-height:1.3}
.game .hand-tools button{font-family:var(--font-display);font-size:1.02cqw;line-height:1.3}
.game .multi-controls button{font-family:var(--font-display);line-height:1.35}
.club-table .club-sort button,.game .opponent-count,.game .sort-label{font-family:var(--font-display)}
.club-coach p{font-size:clamp(12px,.92cqw,16px);line-height:1.55}
.club-turn-copy h2{line-height:1.25}
@media(max-width:900px) and (orientation:portrait){
 .game .turn-text{font-size:21px}.game .turn-text small{font-size:13px}
 .game .actions button{font-size:17px}.game .hand-tools button{font-size:12px}
 .game .opponent .name{font-size:15px}
 .game:has(.opponent:nth-child(4)) .opponent .name{font-size:12px}
 .game .multi-controls button{font-size:11px;white-space:normal}
}
@media(max-height:500px) and (orientation:landscape){
 .game .turn-text{font-size:19px}.game .turn-text small{font-size:12px}
 .game .actions button{font-size:17px}.game .hand-tools button{font-size:12px}
}
@media(max-width:420px){
 .home-menu button{font-size:18px}.home-subhead h2{font-size:22px}
 .home-menu .home-back{font-size:14px}
 body #modal h2{font-size:25px}body #modal button{font-size:16px}
 .home-menu .home-avatar-options button{font-size:inherit}
}