/* V45 — full-width responsive homepage (desktop-first, no phone shell) */
:root{
  --v45-page-max: 1800px;
  --v45-content-pad: clamp(18px, 3vw, 56px);
}

body[data-page="home"]{
  width:100%!important;
  min-width:0!important;
  padding:0 0 98px!important;
  overflow-x:hidden!important;
}

body[data-page="home"] #app{
  width:100%!important;
  max-width:none!important;
  min-height:100vh!important;
  margin:0!important;
  overflow:visible!important;
  background:
    radial-gradient(circle at 50% 0,rgba(92,17,124,.15),transparent 35%),
    #030106!important;
}

/* Wide promotional banner */
body[data-page="home"] .royal-promo{
  width:calc(100% - (var(--v45-content-pad) * 2))!important;
  max-width:var(--v45-page-max)!important;
  min-height:clamp(180px,18vw,290px)!important;
  margin:22px auto 0!important;
  border-radius:28px!important;
  background-position:center 48%!important;
}
body[data-page="home"] .royal-topbar{
  top:clamp(52px,6.5vw,102px)!important;
  width:min(980px,78vw)!important;
}
body[data-page="home"] .royal-brand{gap:clamp(14px,2vw,28px)!important}
body[data-page="home"] .royal-logo-shell{
  flex-basis:clamp(78px,8vw,126px)!important;
  width:clamp(78px,8vw,126px)!important;
  height:clamp(78px,8vw,126px)!important;
}
body[data-page="home"] .royal-brand-copy h1{
  font-size:clamp(34px,4.3vw,68px)!important;
}
body[data-page="home"] .royal-brand-subtitle{
  font-size:clamp(12px,1.45vw,22px)!important;
}

/* Search uses the available page width instead of a mobile-width column */
body[data-page="home"] .home-search-slot{
  width:calc(100% - (var(--v45-content-pad) * 2))!important;
  max-width:var(--v45-page-max)!important;
  min-height:72px!important;
  margin:22px auto 0!important;
}
body[data-page="home"] .fixed-game-search{
  height:72px!important;
  grid-template-columns:72px minmax(0,1fr) auto 92px!important;
  border-radius:18px!important;
}
body[data-page="home"] .fixed-game-search input{
  font-size:clamp(18px,1.8vw,27px)!important;
}
body[data-page="home"] #app-search-filter{width:92px!important}

/* Main content spans the viewport and fits more applications per row */
body[data-page="home"] #games-section{
  width:100%!important;
  max-width:var(--v45-page-max)!important;
  margin:0 auto!important;
  padding:28px var(--v45-content-pad) 34px!important;
  box-sizing:border-box!important;
}
body[data-page="home"] #games-section .sec-head{
  margin:0 0 20px!important;
}
body[data-page="home"] #games-section .sec-title{
  font-size:clamp(23px,2.1vw,34px)!important;
}
body[data-page="home"] .view-all-games{
  font-size:clamp(17px,1.45vw,24px)!important;
}
body[data-page="home"] .games-grid{
  grid-template-columns:repeat(7,minmax(0,1fr))!important;
  gap:20px!important;
}
body[data-page="home"] #games-section .game-card{
  padding:9px 9px 12px!important;
  border-radius:18px!important;
}
body[data-page="home"] .game-name{
  margin-top:9px!important;
  font-size:clamp(12px,1.05vw,17px)!important;
}
body[data-page="home"] .game-name:after{
  margin-top:7px!important;
  font-size:clamp(11px,.9vw,15px)!important;
}

/* Desktop dock: fixed and compact, not a stretched mobile navigation panel */
body[data-page="home"] .royal-bottom-nav{
  left:50%!important;
  right:auto!important;
  bottom:14px!important;
  width:min(1120px,calc(100% - 48px))!important;
  height:76px!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  align-items:center!important;
  gap:10px!important;
  padding:8px 10px!important;
  border:1px solid #593065!important;
  border-radius:22px!important;
  transform:translateX(-50%)!important;
  backdrop-filter:blur(16px)!important;
  background:linear-gradient(180deg,rgba(42,17,50,.96),rgba(16,6,20,.97))!important;
}
body[data-page="home"] .royal-bottom-item{
  height:58px!important;
  flex-direction:row!important;
  gap:9px!important;
  padding:6px 12px!important;
  border-radius:14px!important;
}
body[data-page="home"] .royal-bottom-item .nav-icon{
  font-size:26px!important;
}
body[data-page="home"] .royal-bottom-item b{
  font-size:15px!important;
}
body[data-page="home"] .royal-bottom-item[data-bottom-action="account"]{
  height:62px!important;
  margin:0!important;
  border:1px solid #9c3bc0!important;
  border-radius:16px!important;
  background:linear-gradient(145deg,#9b20cb,#6d0e99)!important;
  box-shadow:inset 0 2px rgba(255,255,255,.14),0 5px 0 #31063f,0 8px 18px rgba(0,0,0,.42)!important;
}
body[data-page="home"] .royal-bottom-item[data-bottom-action="account"] .nav-icon{
  width:auto!important;
  height:auto!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  font-size:31px!important;
}
body[data-page="home"] .royal-bottom-item[data-bottom-action="account"] b{
  margin:0!important;
  font-size:16px!important;
}

/* Laptop and tablet widths */
@media (max-width:1399px){
  body[data-page="home"] .games-grid{grid-template-columns:repeat(6,minmax(0,1fr))!important}
}
@media (max-width:1160px){
  body[data-page="home"] .games-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important}
}
@media (max-width:900px){
  body[data-page="home"]{padding-bottom:92px!important}
  body[data-page="home"] .royal-promo{min-height:190px!important}
  body[data-page="home"] .games-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:14px!important}
  body[data-page="home"] .royal-bottom-nav{bottom:8px!important;width:calc(100% - 24px)!important;height:72px!important}
  body[data-page="home"] .royal-bottom-item{height:54px!important;flex-direction:column!important;gap:2px!important;padding:5px!important}
  body[data-page="home"] .royal-bottom-item .nav-icon{font-size:23px!important}
  body[data-page="home"] .royal-bottom-item b{font-size:11px!important}
  body[data-page="home"] .royal-bottom-item[data-bottom-action="account"]{height:57px!important}
  body[data-page="home"] .royal-bottom-item[data-bottom-action="account"] .nav-icon{font-size:26px!important}
  body[data-page="home"] .royal-bottom-item[data-bottom-action="account"] b{font-size:12px!important}
}
@media (max-width:620px){
  :root{--v45-content-pad:14px}
  body[data-page="home"] .royal-promo{width:calc(100% - 20px)!important;margin-top:10px!important}
  body[data-page="home"] .home-search-slot{width:calc(100% - 28px)!important}
  body[data-page="home"] .games-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px 9px!important}
}
@media (max-width:410px){
  body[data-page="home"] .games-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}