/* Hungry Wars v106 — rankings repair + compact premium redesign */

/* ---- modal / book ---- */
#modal[data-view="mainRanks"] > .modal-window{
  width:min(94vw,1480px)!important;
  height:min(86vh,820px)!important;
  min-height:620px!important;
  border-radius:28px!important;
}
#modal[data-view="mainRanks"] #modalBody{
  padding:0!important;
  overflow:hidden!important;
}
#modal[data-view="mainRanks"] .hw57-book{
  height:100%!important;
  padding:16px 18px 18px!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 50% -25%,rgba(255,255,255,.98),rgba(255,248,226,.76) 36%,transparent 68%),
    linear-gradient(180deg,#fffdf8 0%,#f9e9bc 100%)!important;
}
#modal[data-view="mainRanks"] .hw57-book:before{
  opacity:.25!important;
}
#modal[data-view="mainRanks"] .hw57-book>header{
  min-height:92px!important;
  padding:4px 62px 12px 80px!important;
  border-bottom:1px solid rgba(190,126,30,.52)!important;
}
#modal[data-view="mainRanks"] .hw57-book-head-icon{
  width:64px!important;height:64px!important;
  left:4px!important;top:2px!important;
}
#modal[data-view="mainRanks"] .hw57-book-head-copy h2{
  font-size:31px!important;
  line-height:1.05!important;
  letter-spacing:.015em!important;
  color:#6f3a0b!important;
}
#modal[data-view="mainRanks"] .hw57-book-head-copy p{
  margin-top:6px!important;
  font-size:12px!important;
  line-height:1.25!important;
  color:#88531e!important;
}
#modal[data-view="mainRanks"] .hw57-book-head-copy h2:before,
#modal[data-view="mainRanks"] .hw57-book-head-copy h2:after{
  opacity:.55!important;
}

/* ---- two pages ---- */
#modal[data-view="mainRanks"] .hw57-book-pages{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  gap:14px!important;
  height:calc(100% - 102px)!important;
  padding-top:12px!important;
}
#modal[data-view="mainRanks"] .hw57-page{
  min-width:0!important;
  min-height:0!important;
  padding:12px 14px 10px!important;
  border:1px solid #d9a24b!important;
  border-radius:22px!important;
  background:linear-gradient(180deg,rgba(255,252,242,.94),rgba(247,226,174,.88))!important;
  box-shadow:inset 0 1px rgba(255,255,255,.94),0 5px 14px rgba(105,61,12,.09)!important;
}
#modal[data-view="mainRanks"] .hw57-page-head{
  min-height:58px!important;
  padding:0 2px 9px!important;
  margin-bottom:8px!important;
  border-bottom:1px solid rgba(206,146,53,.45)!important;
}
#modal[data-view="mainRanks"] .hw57-page-head h3{
  font-size:25px!important;
  line-height:1!important;
  color:#70400f!important;
}
#modal[data-view="mainRanks"] .hw57-page-head p{
  margin-top:5px!important;
  font-size:10.5px!important;
  color:#9b672b!important;
}
#modal[data-view="mainRanks"] .hw57-page-mark{
  min-width:78px!important;
  height:34px!important;
  padding:0 13px!important;
  border-radius:14px!important;
  font-size:10px!important;
}

/* ---- player mode tabs ---- */
#modal[data-view="mainRanks"] .hw57-page-subtabs{
  gap:8px!important;
  margin:0 0 10px!important;
}
#modal[data-view="mainRanks"] .hw57-page-subtabs button{
  height:35px!important;
  padding:0 16px!important;
  border-radius:12px!important;
  font-size:10px!important;
  letter-spacing:.025em!important;
}

/* ---- list / rows ---- */
#modal[data-view="mainRanks"] .hw57-list{
  display:flex!important;
  flex-direction:column!important;
  gap:7px!important;
  min-height:0!important;
  overflow:auto!important;
  padding:2px 3px 6px!important;
  scrollbar-width:thin!important;
  scrollbar-color:#c7892c transparent!important;
}
#modal[data-view="mainRanks"] .hw57-row{
  display:grid!important;
  grid-template-columns:54px minmax(0,1fr) 112px!important;
  align-items:center!important;
  min-height:68px!important;
  padding:6px 11px!important;
  border:1px solid #d69b39!important;
  border-radius:16px!important;
  overflow:hidden!important;
  background:linear-gradient(180deg,#fffaf0,#f6e1b5)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.95),0 2px 5px rgba(111,65,14,.08)!important;
  transition:transform .12s ease,box-shadow .12s ease!important;
}
#modal[data-view="mainRanks"] .hw57-row:hover{
  transform:translateY(-1px)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.96),0 5px 11px rgba(111,65,14,.13)!important;
}
#modal[data-view="mainRanks"] .hw57-row:before{
  width:4px!important;
  opacity:.58!important;
}
#modal[data-view="mainRanks"] .hw57-main{
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  min-width:0!important;
}
#modal[data-view="mainRanks"] .hw57-copy{
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
}
#modal[data-view="mainRanks"] .hw57-copy>b{
  min-width:0!important;
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  font-size:15px!important;
  line-height:1.05!important;
  color:#65380c!important;
  text-shadow:none!important;
}
#modal[data-view="mainRanks"] .hw57-copy>small{
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  margin-top:5px!important;
  min-height:16px!important;
  font-size:9.5px!important;
  color:#916027!important;
  line-height:1.1!important;
}
#modal[data-view="mainRanks"] .hw57-value{
  justify-self:end!important;
  text-align:right!important;
  font-size:18px!important;
  line-height:1!important;
  color:#72400f!important;
  text-shadow:none!important;
}
#modal[data-view="mainRanks"] .hw57-value>span{
  display:block!important;
  margin-top:4px!important;
  font-size:8px!important;
  line-height:1!important;
  letter-spacing:.04em!important;
  color:#a16d30!important;
}

/* ---- ranking places ---- */
#modal[data-view="mainRanks"] .hw57-rank-badge{
  width:44px!important;height:50px!important;
  justify-self:center!important;
  align-self:center!important;
}
#modal[data-view="mainRanks"] .hw69-rank-art{
  width:53px!important;height:61px!important;
  margin:-5px 0!important;
  filter:drop-shadow(0 3px 2px rgba(74,38,5,.18))!important;
}
#modal[data-view="mainRanks"] .hw57-row[data-rank]:not([data-rank="1"]):not([data-rank="2"]):not([data-rank="3"]) .hw57-rank-badge{
  width:38px!important;height:43px!important;
}
#modal[data-view="mainRanks"] .hw57-row[data-rank]:not([data-rank="1"]):not([data-rank="2"]):not([data-rank="3"]) .hw57-rank-badge em{
  font-size:15px!important;
}

/* ---- players ---- */
#modal[data-view="mainRanks"] .hw64-avatar-ring{
  width:45px!important;height:45px!important;
  flex:0 0 45px!important;
  border-width:2px!important;
}
#modal[data-view="mainRanks"] .hw64-avatar-ring img{
  width:100%!important;height:100%!important;
  object-fit:cover!important;
}
#modal[data-view="mainRanks"] .hw57-name{
  color:#66380c!important;
  font-size:15px!important;
  font-weight:1000!important;
  text-shadow:none!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
#modal[data-view="mainRanks"] .hw64-player-row.self .hw57-name{
  color:#5f2e0a!important;
}
#modal[data-view="mainRanks"] .hw69-status-text{
  color:#865520!important;
  font-size:9px!important;
}
#modal[data-view="mainRanks"] .hw64-status{
  width:7px!important;height:7px!important;
}

/* ---- clean clan/player tags: [TAG], NO DOT ---- */
#modal[data-view="mainRanks"] .hw57-clan-tag,
#modal[data-view="mainRanks"] .hw69-player-tag,
#modal[data-view="mainRanks"] .hw69-clan-tag{
  position:relative!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:0!important;
  height:auto!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  transform:none!important;
  color:var(--tag-color,#9d6117)!important;
  font-size:10px!important;
  line-height:1!important;
  font-weight:1000!important;
  letter-spacing:.015em!important;
  text-transform:none!important;
  text-shadow:0 1px rgba(255,255,255,.75)!important;
  white-space:nowrap!important;
}
#modal[data-view="mainRanks"] .hw57-clan-tag:before,
#modal[data-view="mainRanks"] .hw69-player-tag:before,
#modal[data-view="mainRanks"] .hw69-clan-tag:before{
  content:"["!important;
  display:inline!important;
  width:auto!important;height:auto!important;
  margin:0!important;
  border:0!important;border-radius:0!important;
  background:none!important;
  box-shadow:none!important;
  opacity:1!important;
  flex:0 0 auto!important;
  color:inherit!important;
}
#modal[data-view="mainRanks"] .hw57-clan-tag:after,
#modal[data-view="mainRanks"] .hw69-player-tag:after,
#modal[data-view="mainRanks"] .hw69-clan-tag:after{
  content:"]"!important;
  display:inline!important;
  color:inherit!important;
}

/* Player clan tag remains in the metadata line. */
#modal[data-view="mainRanks"] .hw64-player-row .hw57-copy>small{
  overflow:hidden!important;
  white-space:nowrap!important;
}
#modal[data-view="mainRanks"] .hw69-player-tag{
  font-size:9px!important;
}

/* Clan row: full clan NAME first, [TAG] second. */
#modal[data-view="mainRanks"] .hw64-clan-row .hw57-copy>b{
  display:flex!important;
  align-items:baseline!important;
  gap:7px!important;
  overflow:hidden!important;
}
#modal[data-view="mainRanks"] .hw64-clan-row .hw69-clan-name{
  order:1!important;
  min-width:0!important;
  flex:0 1 auto!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  font-size:15.5px!important;
  line-height:1!important;
  color:#63350b!important;
  font-weight:1000!important;
}
#modal[data-view="mainRanks"] .hw64-clan-row .hw69-clan-tag{
  order:2!important;
  flex:0 0 auto!important;
  font-size:9.5px!important;
}
#modal[data-view="mainRanks"] .hw64-meta-dot{
  margin:0 1px!important;
  color:#b47a2b!important;
}
#modal[data-view="mainRanks"] .hw64-power-crown{
  display:inline-block!important;
  margin-right:4px!important;
  color:#c98a18!important;
  font-style:normal!important;
}

/* real clan crests */
#modal[data-view="mainRanks"] .hw65-clan-real-crest{
  width:52px!important;height:52px!important;
  flex:0 0 52px!important;
  filter:drop-shadow(0 3px 3px rgba(92,49,7,.18))!important;
}

/* top 3 treatment is visible but calmer */
#modal[data-view="mainRanks"] .hw57-row[data-rank="1"]{
  background:linear-gradient(180deg,#fff7d8,#f4dfa0)!important;
  border-color:#dca736!important;
}
#modal[data-view="mainRanks"] .hw57-row[data-rank="2"]{
  background:linear-gradient(180deg,#fffdfa,#eee8dc)!important;
  border-color:#c7b79e!important;
}
#modal[data-view="mainRanks"] .hw57-row[data-rank="3"]{
  background:linear-gradient(180deg,#fff6e8,#f1d3ad)!important;
  border-color:#d69e56!important;
}
#modal[data-view="mainRanks"] .hw57-row.self{
  border-color:#74b73f!important;
  box-shadow:inset 0 1px rgba(255,255,255,.96),0 0 0 2px rgba(94,167,43,.10),0 3px 8px rgba(65,122,26,.10)!important;
}

/* ---- footer/pager ---- */
#modal[data-view="mainRanks"] .hw57-pager{
  margin-top:auto!important;
  padding-top:7px!important;
}
#modal[data-view="mainRanks"] .hw57-pager button{
  width:34px!important;height:34px!important;
  border-radius:11px!important;
}
#modal[data-view="mainRanks"] .hw57-pager b{
  font-size:11px!important;
}
#modal[data-view="mainRanks"] .hw57-footnote{
  padding-top:5px!important;
  font-size:8px!important;
  color:#9d713a!important;
}
#modal[data-view="mainRanks"] .hw57-self-card{
  margin-top:8px!important;
  border-radius:14px!important;
}

@media(max-height:760px){
  #modal[data-view="mainRanks"] > .modal-window{height:92vh!important;min-height:560px!important}
  #modal[data-view="mainRanks"] .hw57-book>header{min-height:76px!important;padding-bottom:8px!important}
  #modal[data-view="mainRanks"] .hw57-book-head-copy h2{font-size:26px!important}
  #modal[data-view="mainRanks"] .hw57-book-pages{height:calc(100% - 84px)!important;padding-top:8px!important}
  #modal[data-view="mainRanks"] .hw57-page-head{min-height:48px!important}
  #modal[data-view="mainRanks"] .hw57-row{min-height:58px!important;padding:4px 9px!important;grid-template-columns:48px minmax(0,1fr) 102px!important}
  #modal[data-view="mainRanks"] .hw69-rank-art{width:47px!important;height:54px!important;margin:-4px 0!important}
  #modal[data-view="mainRanks"] .hw65-clan-real-crest{width:46px!important;height:46px!important;flex-basis:46px!important}
  #modal[data-view="mainRanks"] .hw64-avatar-ring{width:40px!important;height:40px!important;flex-basis:40px!important}
}

@media(max-width:1050px){
  #modal[data-view="mainRanks"] > .modal-window{width:96vw!important;height:94vh!important}
  #modal[data-view="mainRanks"] #modalBody{overflow:auto!important}
  #modal[data-view="mainRanks"] .hw57-book{overflow:auto!important}
  #modal[data-view="mainRanks"] .hw57-book-pages{grid-template-columns:1fr!important;height:auto!important}
  #modal[data-view="mainRanks"] .hw57-page{min-height:520px!important}
}