/* Reading order matches the DOM on desktop and mobile. */
.community-panels .game{grid-column:1;grid-row:1}
.community-panels .featured{grid-column:2;grid-row:1}
.community-panels #buy{grid-column:1/-1;grid-row:2}
.community-panels .cutout-transition{grid-column:1/-1;grid-row:3;justify-self:center;width:100%;max-width:660px;height:auto;overflow:visible;margin-top:2px}
.community-panels .cutout-transition img{position:static;transform:none;width:100%;max-width:100%;height:auto}
.community-panels .community{grid-column:1/-1;grid-row:4}
.community-panels #buy .buy-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
.community-panels #buy .buy-steps>div:nth-child(3){border-left:0;padding-left:0}

/* Desktop only: one compact tagline line, wrapping as a whole on tablets. */
@media(min-width:651px){
 header .organic{display:flex;flex-wrap:nowrap;max-width:none;width:auto;gap:10px;align-items:center;justify-content:center}
 header .organic span+span{border-left:1px solid var(--line);padding-left:10px}
 header+.contract{grid-template-columns:max-content max-content max-content;justify-content:start}
 .contract #copy{margin-left:0}
}

@media(max-width:650px){
 .community-panels .game,.community-panels .featured,.community-panels #buy,.community-panels .cutout-transition,.community-panels .community{grid-column:1;grid-row:auto}
 .community-panels .cutout-transition{width:calc(100% - 10px);margin:2px 5px 0}
 .community-panels #buy .buy-steps{grid-template-columns:minmax(0,1fr)}
 /* 12px disclosure gaps become 9px; 8px PLAY gap becomes 6px. */
 #hoher .body>details{margin-top:9px}
 #hoher .game-brand #launch-game{margin-bottom:6px}
}
