/* RC7: desktop-first presentation density. All content remains scrollable on short screens. */
@media(min-width:801px){
 .topnav{height:67px;padding:0 3.5%;justify-content:flex-start;gap:22px}
 .desktop-nav{margin-left:12px;gap:clamp(14px,2vw,34px);align-items:center}
 .desktop-nav button,.desktop-nav a{font-size:14px;font-weight:800;color:#294933;text-decoration:none;border:0;background:transparent;padding:12px 2px;white-space:nowrap;cursor:pointer;border-bottom:3px solid transparent}
 .desktop-nav button:hover,.desktop-nav a:hover,.desktop-nav .is-active{color:#18653c;border-bottom-color:#2c7b4b}
 .nav-right{margin-left:auto}
 .home-main{min-height:0;min-height:calc(100dvh - 136px);padding:clamp(18px,3.5vh,34px) 4.4% clamp(16px,2.5vh,30px);align-items:center}
 .hero-left{padding:0}.hero-heading{margin:clamp(8px,1.6vh,17px) 0 clamp(14px,3vh,26px);font-size:clamp(50px,6vw,87px)}
 .home-art{min-height:0;height:clamp(340px,66vh,490px)}.home-art.kinetic-art{padding:20px 24px}
 .kinetic-stage{padding:10px 0;margin:auto 14px auto 0}.kinetic-word-card{height:clamp(180px,31vh,235px)}
 .choose-screen{padding:clamp(19px,4vh,44px) 30px clamp(18px,4vh,45px);min-height:0}
 .choose-screen h1{margin:12px 0;font-size:clamp(48px,6vw,70px)}.choose-screen .choice-grid{margin:clamp(14px,3vh,26px) 0 15px}
 .choice-grid button{min-height:clamp(210px,36vh,260px);padding:22px}
 .rx-wrapper{padding:clamp(12px,2.4vh,25px) clamp(18px,4vw,64px) 22px;min-height:calc(100dvh - 67px)}
 .rx-setup-head{padding:0 0 12px}.rx-setup-head h1{font-size:clamp(42px,5.1vw,65px)!important;margin:8px 0!important}
 .rx-steps{margin-bottom:15px}.rx-steps button{padding-top:11px!important;padding-bottom:11px!important}
 .rx-three button{min-height:100px;padding:13px!important;gap:7px}.rx-three button strong{font-size:18px}
 .rx-category-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.rx-category{min-height:62px;padding:9px 12px;gap:10px}.rx-category-icon{width:35px;height:35px}.rx-category strong{font-size:13px}.rx-category small{font-size:11px}.rx-category-copy{gap:2px}
 .rx-rules-layout{gap:9px!important}.rx-setting-card{padding:11px 15px;gap:8px}.rx-mix-stack{gap:8px}.rx-mix-stack .rx-slider{padding:11px 16px}
}
@media(min-width:801px) and (max-height:740px){
 .home-main{gap:3%;}.home-art{height:clamp(300px,61vh,415px)}.hero-heading{font-size:clamp(44px,5.3vw,73px)}
 .rx-setup-head h1{font-size:42px!important}.rx-steps{margin-bottom:11px}.rx-setting-card{padding:9px 12px}
 .rx-category{min-height:54px;padding:6px 10px}.rx-category-icon{height:31px;width:31px}
}
@media(max-width:800px){.desktop-nav{display:none}}

@media(min-width:801px) and (max-width:1150px){.rx-category-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* Put the three difficulty sliders side by side on wide displays. */
@media(min-width:900px){
 .rx-mix-stack{max-width:none;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
 .rx-team-inputs{margin:12px 0;gap:10px}
 .rx-bottom-steps{padding:12px 0;margin-top:14px}
 .rx-recovery{margin-top:14px;padding:12px}
}
@media(min-width:900px) and (max-height:760px){
 .rx-setup-head{padding-bottom:7px}.rx-setup-head h1{margin:4px 0 5px!important}
 .rx-wrapper .rx-stage-label{margin-bottom:6px}
 .rx-three button{min-height:86px;padding:9px!important}
 .rx-recovery{padding:7px 12px}
 .rx-bottom-steps{margin-top:9px;padding:8px 0}
 .rx-rules-layout{gap:7px}.rx-setting-card{padding:8px 12px}
 .rx-team-inputs{margin:9px 0}
}

@media(min-width:1200px){.rx-category-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}

/* Compact the multi-step wizard on laptop displays without losing fields. */
@media(min-width:900px){
 .rx-setup-head.rx-setup-compact{display:none}
 .rx-setting-card.rx-setting-wide{grid-column:auto}
 .rx-rules-layout{grid-template-columns:repeat(2,minmax(0,1fr))}
 .rx-stage-label + h2{margin-top:8px!important;margin-bottom:9px!important;font-size:clamp(35px,4vw,51px)!important}
 .rx-team-inputs{margin:10px 0}
}
@media(min-width:900px) and (max-height:760px){
 .rx-setup-head:not(.rx-setup-compact){padding-bottom:6px}
 .rx-setup-head h1{font-size:35px!important}
 .rx-steps button{padding-top:7px!important;padding-bottom:7px!important}
 .rx-three button{min-height:75px;padding:7px 12px!important}
 .rx-stage-label + h2{font-size:38px!important}
 .rx-bottom-steps{margin-top:5px;padding:6px 0}
}
