/* V82.31 - Rebuild ranking page layout to match other internal pages
   Keeps existing ranking content/cards/list logic intact. */

body.rank-game-body{
  background:#03060d!important;
}

body.rank-game-body .wrapper{
  background:#03060d!important;
}

body.rank-game-body .rank-game-page{
  min-height:auto!important;
  padding:0 0 92px!important;
  overflow-x:hidden!important;
  background:
    linear-gradient(180deg, rgba(2,5,10,.98), rgba(2,5,10,.98))!important;
}

body.rank-game-body .rank-game-shell{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0 0 88px!important;
  background:transparent!important;
}

/* Hero/header exactly in the internal-page language used by news/download */
body.rank-game-body .rank-page-heading{
  position:relative!important;
  width:100%!important;
  max-width:none!important;
  min-height:360px!important;
  height:auto!important;
  margin:0!important;
  padding:74px 24px 58px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  border:0!important;
  border-bottom:1px solid rgba(221,171,62,.18)!important;
  border-radius:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 50% 10%, rgba(112,86,180,.18), transparent 34%),
    linear-gradient(180deg, rgba(4,8,15,.88), rgba(2,6,12,.96)),
    url("../images/inner_bg.png") center/cover no-repeat!important;
}
body.rank-game-body .rank-page-heading:before,
body.rank-game-body .rank-page-heading:after{display:none!important;content:none!important;}
body.rank-game-body .rank-page-heading .rank-kicker{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:30px!important;
  padding:6px 22px!important;
  margin:0 auto 18px!important;
  border-radius:999px!important;
  border:1px solid rgba(255,190,55,.55)!important;
  background:rgba(7,12,20,.72)!important;
  color:#ffd05b!important;
  font-size:12px!important;
  font-weight:900!important;
  letter-spacing:.24em!important;
  text-transform:uppercase!important;
  box-shadow:none!important;
}
body.rank-game-body .rank-page-heading h1{
  max-width:940px!important;
  margin:0 auto 18px!important;
  font-family:Georgia,serif!important;
  color:#fff8ed!important;
  font-size:clamp(56px,7.2vw,96px)!important;
  line-height:.96!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
  text-shadow:0 16px 38px rgba(0,0,0,.65),0 0 20px rgba(161,108,255,.24)!important;
}
body.rank-game-body .rank-page-heading p{
  max-width:780px!important;
  margin:0 auto!important;
  color:#dbe7f4!important;
  font-size:18px!important;
  line-height:1.55!important;
}

/* Main page content block */
body.rank-game-body .rank-game-window{
  width:min(100% - 40px, 1320px)!important;
  max-width:1320px!important;
  margin:54px auto 0!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
body.rank-game-body .rank-game-topbar{display:none!important;}
body.rank-game-body .rank-game-content,
body.rank-game-body .rank-game-content-v56,
body.rank-game-body .rank-game-main,
body.rank-game-body .rank-game-main-v56{
  background:transparent!important;
}

/* Board section should look like the normal page sections, not like a broken full overlay */
body.rank-game-body .rank-game-board{
  width:100%!important;
  margin:0!important;
}

/* Keep current content but make overall spacing cleaner */
body.rank-game-body .rank-game-tabs.rank-mode-tabs-v56{
  margin:0 auto 24px!important;
}
body.rank-game-body .rank-game-note{
  padding:0 4px!important;
}

@media (max-width: 760px){
  body.rank-game-body .rank-page-heading{
    min-height:300px!important;
    padding:50px 18px 44px!important;
  }
  body.rank-game-body .rank-page-heading h1{
    font-size:clamp(38px,12vw,60px)!important;
  }
  body.rank-game-body .rank-game-window{
    width:min(100% - 20px, 1320px)!important;
    margin-top:34px!important;
  }
}
