/* Home: play on the left, community records on the right. */
#intro{overflow-y:auto;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(310px,1fr);align-content:start;gap:50px;padding:130px 7vw 80px}
#intro .intro-copy{position:relative;left:auto;top:auto;width:auto;min-width:0}
#intro .intro-copy h1{font-size:clamp(76px,8vw,140px)}
#intro .scene-caption{display:none}
#intro>footer{position:static;grid-column:1/-1;margin-top:10px}
.home-ranks{align-self:center;min-width:0;max-width:560px;width:100%;justify-self:end;padding-left:36px;border-left:1px solid #e8c5ed40}
.home-ranks-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:10px;letter-spacing:2px;color:var(--pink)}
.home-ranks-heading button{border:1px solid #e8c5ed40;background:#171622aa;padding:9px 12px;font-size:11px;letter-spacing:0}
.home-ranks>p{font-size:11px;color:#d2c1d7;line-height:1.6;margin:12px 0 25px}
.home-ranks section{background:#171622de;border-top:2px solid var(--pink);padding:20px 22px;margin-top:20px}
.home-ranks section:last-child{border-color:var(--cyan)}
.home-ranks h3{font:24px Georgia,serif;margin:0 0 5px}.home-ranks section>small{font-size:9px;letter-spacing:1.4px;color:#c3b5ce}
.home-ranks ol{padding:0;margin:18px 0 0;list-style:none}.home-ranks li{display:flex;align-items:center;gap:12px;border-top:1px solid #e8c5ed20;padding:12px 0;font-size:12px;min-width:0}
.home-rank-place{font:18px Georgia,serif;color:#b4a4bc}.home-ranks li:first-child .home-rank-place{color:#f2accf}.home-rank-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.home-ranks strong{font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:normal}.home-ranks strong small{font-size:8px;color:#b4a4bc}
.home-rank-empty{font-size:12px;line-height:1.6;color:#d2c1d7;min-height:55px;margin:20px 0 0}
@media(max-width:800px){#intro{grid-template-columns:minmax(0,1fr);padding:105px 6vw 35px;gap:30px}.home-ranks{max-width:none;border-left:0;padding-left:0}.home-ranks section{padding:18px}#intro>footer{flex-wrap:wrap}.intro-actions{width:100%}}
@media(min-width:801px) and (max-height:800px){#intro{padding-top:100px;gap:30px}#intro .intro-copy h1{font-size:90px;margin-top:20px}.home-ranks section{padding:14px 18px;margin-top:14px}.home-ranks li{padding:9px 0}.home-ranks>p{margin-bottom:12px}}
@media(min-width:801px) and (max-height:800px){#intro{padding-bottom:30px;gap:20px}.home-ranks h3{font-size:21px}.home-ranks ol{margin-top:10px}.home-ranks li{padding:6px 0}.home-ranks>p{margin:9px 0}.home-ranks section{margin-top:12px}}
/* Keep the home screen in the viewport; long rankings scroll inside their column. */
#intro{overflow:hidden;height:100dvh;grid-template-rows:minmax(0,1fr) auto;gap:18px;padding:110px 7vw 24px}
#intro .intro-copy,.home-ranks{min-height:0;max-height:100%;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
#intro>footer{margin-top:0}
@media(min-width:801px) and (max-height:800px){
 #intro{padding-top:90px;gap:12px;padding-bottom:16px}
 #intro .intro-copy h1{font-size:clamp(54px,11vh,88px);margin:10px 0 5px}
 #intro h2{margin:10px 0 14px}.tagline{margin-bottom:14px;font-size:17px}
 #intro .primary,#intro .secondary{padding:10px 16px}#intro .text-button{padding:8px 0}
 #intro .chapter{margin-top:10px;padding-top:10px}
}
@media(max-width:800px){#intro{grid-template-rows:minmax(0,1fr) minmax(0,1fr) auto;padding:90px 6vw 16px;gap:12px}#intro .intro-copy h1{font-size:64px;margin:8px 0}#intro .tagline,#intro .chapter{display:none}#intro h2{margin:10px 0}.home-ranks{align-self:stretch}#intro>footer{font-size:7px}}