/* EMERAUD desktop only. Mobile stylesheet and layout remain untouched. */
@media (min-width:900px){
 html,body{min-height:100%!important;height:auto!important;overflow-x:hidden!important;overflow-y:auto!important;background:#091610!important}
 body.home-active{height:auto!important;max-height:none!important;overflow-y:auto!important}
 body.home-active main{height:auto!important;max-height:none!important;overflow:visible!important}
 body.home-active #appView,body.home-active #homeView{overflow:visible!important}
 body.home-active .footer{display:block!important}
 main{max-width:1440px!important;width:100%!important;padding:34px 48px 55px 304px!important;margin:0 auto!important;overflow:visible!important}
 .brand{justify-content:flex-start!important;position:relative!important;z-index:12!important;margin:0 0 35px!important;font-size:25px!important;letter-spacing:2.4px!important}
 .brand .gem-icon{width:39px!important;height:39px!important}
 #appView{max-width:100%!important;overflow:visible!important}
 #homeView{zoom:1!important;transform:none!important;overflow:visible!important;padding:0!important;display:block}
 #homeView.hidden{display:none!important}
 #homeView>.home-intro{text-align:left!important;margin:0 0 22px!important;font-size:15px!important;color:#adcbb8!important}
 #homeView>.card{margin:0 0 20px!important;padding:25px 28px!important;border-radius:18px!important}
 #homeView>.elo-hero{text-align:left!important;display:flex!important;align-items:center!important;gap:18px!important;flex-wrap:wrap!important;background:#112e20!important;border:1px solid #367b52!important}
 #homeView>.elo-hero .eyebrow{width:100%!important;margin:0!important}
 #heroElo{display:inline-block!important;font-size:40px!important;line-height:1.1!important;font-weight:850!important}
 #heroDivision{display:inline-block!important;font-size:22px!important;font-weight:750!important}
 #homeView .progress-labels{font-size:15px!important}
 #homeView .progress-track{height:12px!important;margin:16px 0 10px!important}
 #homeView .progress-sub{font-size:13px!important;margin:0 0 24px!important}
 #homeView .home-stats{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:16px!important}
 #homeView .home-stats .stat{padding:22px 16px!important;min-height:106px!important;gap:8px!important}
 #homeView .home-stats .stat b{color:#edf8f0!important;font-size:31px!important}
 #homeView .home-stats .stat .stat-icon{margin:0!important}
 #homeView .home-stats .stat small{font-size:13px!important}
 #homeView .home-winrate{margin-top:16px!important;padding:13px!important}
 #homeView .line{padding:16px 0!important}
 #homeView .line h2{margin:0!important}
 #homeView #recentRows{font-size:15px!important}
 #profileView,#rankingView,#historyView,#publicView{max-width:100%!important;padding:30px!important;margin:0!important}
 #profileView .stats{grid-template-columns:repeat(2,minmax(0,1fr))!important;max-width:850px!important}
 #rankingRows .line,#historyRows .line{padding:17px 0!important}
 .nav{position:fixed!important;top:0!important;bottom:0!important;left:0!important;right:auto!important;transform:none!important;margin:0!important;width:256px!important;max-width:256px!important;height:100vh!important;min-height:100vh!important;padding:112px 18px 26px!important;display:flex!important;flex-direction:column!important;justify-content:flex-start!important;align-items:stretch!important;gap:10px!important;border:0!important;border-right:1px solid #244b34!important;border-radius:0!important;background:#0b1c13!important;box-shadow:8px 0 28px #0002!important;backdrop-filter:none!important}
 .nav button:not(.play-main){flex:0 0 auto!important;width:100%!important;min-height:49px!important;height:49px!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;padding:0 19px!important;border-radius:11px!important;font-size:15px!important;font-weight:650!important;letter-spacing:0!important;overflow:visible!important;white-space:nowrap!important}
 .nav button#homeTab{order:1}
 .nav button#profileTab{order:2}
 .nav button#rankingTab{order:3}
 .nav button#historyTab{order:4}
 .nav button.play-main{order:5!important;position:relative!important;transform:none!important;display:flex!important;align-items:center!important;justify-content:center!important;flex:0 0 auto!important;width:100%!important;height:62px!important;min-height:62px!important;max-height:62px!important;margin-top:24px!important;padding:0!important;border-radius:12px!important;background:#194a30!important;box-shadow:none!important;color:#65eaa3!important}
 .nav button.play-main::after{content:'JOUER';font-size:17px;font-weight:850;letter-spacing:2px;margin-left:12px;color:#dcffe8}
 .nav button.play-main svg{position:static!important;inset:auto!important;flex:0 0 44px!important;width:44px!important;height:44px!important}
 .nav button.selected:not(.play-main){background:#194a30!important;color:#8cf2b3!important}
 .footer{text-align:left!important;margin-top:38px!important}
}
@media(min-width:900px) and (max-width:1100px){
 main{padding-left:268px!important;padding-right:24px!important}
 .nav{width:238px!important;max-width:238px!important}
}

@media(min-width:900px){
html,body{scrollbar-width:none!important}html::-webkit-scrollbar,body::-webkit-scrollbar{display:none!important}
body.home-active,body.home-active main,body.home-active #appView{height:100dvh!important;max-height:100dvh!important;overflow:hidden!important}
main{padding-top:18px!important;padding-bottom:15px!important}.brand{margin-bottom:12px!important}
#homeView>.home-intro{margin-bottom:9px!important;font-size:13px!important}
#homeView>.card{margin-bottom:10px!important;padding:13px 20px!important}
#homeView>.elo-hero{display:grid!important;grid-template-columns:1fr 1fr!important;gap:3px 18px!important}
#homeView>.elo-hero .eyebrow{grid-column:1/-1!important}
#heroElo{grid-column:1!important;justify-self:start!important;font-size:35px!important}
#heroDivision{grid-column:2!important;justify-self:end!important;font-size:35px!important;line-height:1.1!important}
#homeView .progress-track{margin:9px 0 7px!important;height:9px!important}
#homeView .progress-sub{margin-bottom:12px!important}
#homeView .home-stats{gap:11px!important}
#homeView .home-stats .stat{min-height:0!important;padding:11px!important;gap:3px!important}
#homeView .home-stats .stat b{font-size:25px!important}
#homeView .home-winrate{margin-top:9px!important;padding:8px!important}
#homeView .line{padding:8px 0!important}
#homeView #recentRows .line{padding:7px 0!important}
#homeView #recentRows{font-size:13px!important}
#homeView #seeHistory{padding:8px 12px!important;font-size:12px!important}
#profileView{padding:20px 24px!important}
.nav{overflow:hidden!important}
.footer{display:none!important}
}
@media(min-width:900px) and (max-height:760px){
main{padding-top:10px!important}.brand{margin-bottom:6px!important}
#homeView>.home-intro{margin-bottom:5px!important}
#homeView>.card{padding:9px 15px!important;margin-bottom:6px!important}
#heroElo,#heroDivision{font-size:29px!important}
#homeView .home-stats .stat{padding:7px!important}
#homeView #recentRows .line{padding:5px 0!important}
}

/* Desktop : rang verticalement centré, progression encore plus ramassée. */
@media(min-width:900px){
#homeView>.elo-hero{position:relative!important;align-items:center!important}
#heroDivision{align-self:center!important;justify-self:end!important;margin:0!important}
#homeView>.elo-hero .eyebrow{margin-bottom:0!important}
#homeView>.card:nth-of-type(2){padding:10px 18px!important}
#homeView>.card:nth-of-type(2) .eyebrow{margin-bottom:4px!important}
#homeView .progress-track{margin:6px 0 5px!important;height:7px!important}
#homeView .progress-sub{margin-bottom:8px!important}
#homeView .home-stats .stat{padding:8px!important}
#homeView .home-stats .stat b{font-size:23px!important}
#homeView .home-winrate{margin-top:7px!important;padding:6px!important}
#homeView #recentRows .line{padding:6px 0!important}
}

/* Desktop final spacing: center rank against entire ELO card, not the ELO number. */
@media(min-width:900px){
 #homeView>.elo-hero{position:relative!important;display:grid!important;grid-template-columns:1fr 1fr!important;align-items:center!important;min-height:100px!important;padding:12px 20px!important}
 #homeView>.elo-hero .eyebrow{grid-column:1!important;grid-row:1!important;align-self:end!important}
 #heroElo{grid-column:1!important;grid-row:2!important;align-self:start!important}
 #heroDivision{position:absolute!important;right:20px!important;top:50%!important;transform:translateY(-50%)!important;margin:0!important;line-height:1!important;white-space:nowrap!important}
 #homeView>.card:nth-of-type(2){padding:8px 16px!important}
 #homeView .home-stats .stat{padding:5px 8px!important;gap:2px!important}
 #homeView .home-stats .stat b{font-size:22px!important}
 #homeView .home-stats .stat .stat-icon svg{width:21px!important;height:21px!important}
 #homeView .home-stats .stat small{font-size:11px!important}
 #homeView .home-winrate{padding:5px!important;margin-top:5px!important}
 #homeView>.card{margin-bottom:7px!important}
 #homeView #recentRows .line{padding:4px 0!important}
 #homeView>.card:last-child{padding-top:9px!important;padding-bottom:9px!important}
}

/* Desktop: lift dashboard content above browser chrome and emphasize play. */
@media(min-width:900px){
main{padding-top:9px!important}
.brand{margin-bottom:6px!important}
#homeView>.home-intro{margin-bottom:5px!important}
#homeView>.card{margin-bottom:5px!important}
#homeView>.elo-hero{min-height:90px!important;padding-top:8px!important;padding-bottom:8px!important}
#homeView>.card:nth-of-type(2){padding-top:6px!important;padding-bottom:6px!important}
#homeView .home-stats .stat{padding-top:4px!important;padding-bottom:4px!important}
#homeView #recentRows .line{padding:3px 0!important}
.nav button.play-main{background:#237b4b!important;border:1px solid #43bf78!important}
.nav button.play-main::after{color:#ffffff!important}
#profileView .account-logout{margin-top:18px}
}