/* Fit the desktop lobby into the viewport; long lists scroll inside their panels. */
@media(min-width:1000px) and (min-height:650px){
 body.reference-lobby.app-shell>#main-content{flex:1 1 auto!important;min-height:0;padding:10px 3.7vw!important}
 body.reference-lobby.app-shell{height:100dvh!important;overflow:hidden}
 body.reference-lobby.app-shell #play:not([hidden]){height:100%;gap:10px;grid-template-rows:minmax(0,1fr) auto auto!important}
 body.reference-lobby.app-shell #play #deck-picker,body.reference-lobby.app-shell #play .match-configuration{min-height:0;overflow:auto!important;padding:16px}
 body.reference-lobby.app-shell #play .play-mode-sections{min-height:0;overflow:auto;grid-template-rows:minmax(0,1.7fr) minmax(0,1fr) minmax(0,1fr);gap:8px}
 body.reference-lobby.app-shell #play .play-mode-section{padding:12px 16px;overflow:auto!important}
 body.reference-lobby.app-shell #play .picker-heading,body.reference-lobby.app-shell #play .play-mode-section>.picker-heading{margin-bottom:8px}
 body.reference-lobby.app-shell #play #picked-deck{min-height:95px;padding:10px;margin-bottom:10px;flex-shrink:0}
 body.reference-lobby.app-shell #play #deck-picker #deck-tiles{flex:1;max-height:none!important;min-height:0}
 body.reference-lobby.app-shell #play .standard-queues{gap:6px;margin-top:8px}
 body.reference-lobby.app-shell #play .standard-queues>button{min-height:42px;padding:6px;font-size:15px;gap:2px}
 body.reference-lobby.app-shell #play .play-modes{margin-top:8px}
 body.reference-lobby.app-shell #play .play-modes>button{min-height:36px;font-size:15px}
 body.reference-lobby.app-shell #play p{margin-bottom:6px}
 body.reference-lobby.app-shell #play #resume-match,body.reference-lobby.app-shell #play #expired-tutorial{grid-column:1/-1;grid-row:2;margin:0;padding:8px 16px;min-height:0;align-items:center;gap:12px}
 body.reference-lobby.app-shell #play #resume-match:not([hidden]),body.reference-lobby.app-shell #play #expired-tutorial:not([hidden]){display:flex}
 body.reference-lobby.app-shell #play #resume-match h2,body.reference-lobby.app-shell #play #expired-tutorial h2{font-size:16px;margin:0}
 body.reference-lobby.app-shell #play .campaign-banner{grid-column:1/3;grid-row:3;min-height:0;margin:0;padding:12px 18px;border-radius:8px}
 body.reference-lobby.app-shell #play .discord-community{grid-column:3;grid-row:3;min-height:0;margin:0;padding:12px 16px;gap:8px;flex-wrap:wrap}
 body.reference-lobby.app-shell #play .discord-community h2{font-size:17px;margin:3px 0}
 body.reference-lobby.app-shell #play .discord-community p{font-size:12px}
 body.reference-lobby.app-shell #play .discord-join{width:190px;min-height:42px;padding:8px 24px;font-size:14px}
 body.reference-lobby.app-shell>footer{flex-shrink:0;font-size:9px;padding:4px 0;margin:0 3.7vw}
}
@media(min-width:1000px) and (min-height:650px){
 body.reference-lobby.app-shell #play .play-mode-sections{grid-template-rows:minmax(0,2.8fr) minmax(0,1fr) minmax(0,1fr)}
 body.reference-lobby.app-shell #play .campaign-banner,body.reference-lobby.app-shell #play .discord-community{padding:8px 14px}
 body.reference-lobby.app-shell #play .campaign-banner{display:grid;grid-template-columns:1fr auto;align-content:center;column-gap:10px}
 body.reference-lobby.app-shell #play .campaign-banner button{grid-column:2;grid-row:1/4;align-self:center}
 body.reference-lobby.app-shell #play .discord-community{flex-wrap:nowrap}
 body.reference-lobby.app-shell #play .discord-community .discord-join{width:150px;font-size:12px}
 body.reference-lobby.app-shell #play h2,body.reference-lobby.app-shell #play #deck-picker .picker-heading h2{font-size:19px}
 body.reference-lobby.app-shell #play h3{font-size:17px}
 body.reference-lobby.app-shell #play .picker-heading p{font-size:12px}
 body.reference-lobby.app-shell #play #picked-deck{min-height:90px}
 body.reference-lobby.app-shell #play .match-fields{gap:8px;margin-bottom:8px}
 body.reference-lobby.app-shell #play input:not([type=checkbox]):not([type=range]),body.reference-lobby.app-shell #play select{min-height:34px;padding:6px 9px;margin-top:4px}
 body.reference-lobby.app-shell #play .play-panel>.primary{min-height:38px;padding:8px;margin:8px 0;font-size:17px}
 body.reference-lobby.app-shell #play .reference-config-heading{margin-bottom:8px}
 body.reference-lobby.app-shell #play .play-mode-section p{font-size:12px}
 body.reference-lobby.app-shell #play .play-mode-section{padding:8px 12px}
 body.reference-lobby.app-shell #play .play-mode-section>.picker-heading{margin-bottom:6px}
 body.reference-lobby.app-shell #play .play-modes{margin-top:4px}
 body.reference-lobby.app-shell #play .picker-heading{flex-wrap:nowrap}
}
@media(min-width:1000px) and (min-height:650px) and (max-height:900px){
 body.reference-lobby.app-shell #play>#deck-picker,body.reference-lobby.app-shell #play .play-mode-sections,body.reference-lobby.app-shell #play .match-configuration{zoom:.8}
 body.reference-lobby.app-shell #play .campaign-banner,body.reference-lobby.app-shell #play .discord-community{zoom:.85}
}