/* Fit content to the viewport: no clipped text hidden behind a scrollbar. */
html,body{height:100dvh;overflow:hidden}
main{overflow:hidden}.battle{min-height:0}
header #lobby .form{overflow:visible;padding:3px 0;margin:0;flex-wrap:wrap}
header #lobby #solo{min-width:55px}header #lobby #create{min-width:64px}
.battle-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,380px) minmax(0,1fr);gap:10px}
.battle-top>div:first-child{grid-column:1;grid-row:1;min-width:0}
.battle-top #teamHealth,.battle-top #duelHealth{grid-column:2;grid-row:1;width:100%;min-width:0}
.battle-top #phase{grid-column:3;grid-row:1;min-width:0}
.battle-top #era{overflow-wrap:anywhere;letter-spacing:.3px}
dialog:not(#report):not(#finishBurst){overflow:hidden!important}
.viewport-content{display:flow-root;min-width:0;transform-origin:top left}
#help .help-route{overflow:visible;flex:none}
#assignments{max-height:none;overflow:visible;display:flex;flex-wrap:wrap;justify-content:center;gap:3px}
#gameCards{overflow:visible;grid-template-columns:repeat(6,minmax(0,1fr));gap:7px;margin:10px 0}
#gameCards .game-card{min-width:0;padding:7px 4px}
#gameCards .game-card b{overflow-wrap:anywhere}
#gameCards .monthly-badge{white-space:normal}
#guideBubble{overflow:visible;font-size:14px}
@media(max-width:1100px){body>header{flex-wrap:wrap}header #lobby{order:3;flex:1 0 100%;width:100%}header #lobby .form{justify-content:center}}
@media(max-width:600px){
 header #lobby .form{display:grid;grid-template-columns:minmax(0,1fr) 55px 64px;gap:5px}
 header #lobby .mode-select-row{grid-column:1 / -1;width:100%;justify-content:center}
 header #lobby .nickname-field{grid-column:1;grid-row:2;width:100%;min-width:0}
 header #lobby #solo{grid-column:2;grid-row:2}header #lobby #create{grid-column:3;grid-row:2}
 header #lobby #joinCode{grid-column:1 / 3;grid-row:3;width:100%;min-width:0}
 header #lobby #join{grid-column:3;grid-row:3;padding:5px 2px;font-size:11px}
 .battle-top{grid-template-columns:minmax(0,1fr) minmax(0,1.8fr) minmax(0,1fr);gap:4px}
 .battle-top .badge{font-size:7px;padding:3px;letter-spacing:0}.battle-top #era{font-size:6px}
 #teamHealth>div:first-child{font-size:7px;gap:3px;flex-wrap:wrap}#teamHealth b{letter-spacing:0}
 #gameCards{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
 #gameCards .game-card b{font-size:10px;line-height:1.1}
 #duelHealth{gap:3px}.battle-top .duel-team{padding:4px}.battle-top .duel-team>b{font-size:9px}.battle-top .duel-team>strong{font-size:13px}
 .battle-top #duelHealth .clan-icon{display:none}
}
@media(max-height:500px){header #lobby .form{display:flex;flex-wrap:nowrap;gap:3px}header #lobby .mode-select-row{width:auto}header #lobby .nickname-field{width:80px;min-width:50px;flex:1 1 80px}header #lobby #joinCode{width:100px;min-width:65px;flex:1 1 100px}#gameCards{grid-template-columns:repeat(6,minmax(0,1fr))}}