/* Backpack layout is mapped to backpack-panel-frame.svg (800×1360):
   gray well  x=43,y=238,w=714,h=676
   detail box x=58,y=958,w=684,h=316
   Whole board stays 374×636 and scales uniformly. */
#gameScreen .bp-overlay.bp-v4{
  --bp-panel-scale:1;
  position:absolute!important;
  z-index:3200!important;
  inset:0!important;
  width:390px!important;
  max-width:100%!important;
  height:100%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:52px 8px 12px!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
  background:rgba(16,32,24,.52)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  font-family:"Noto Sans SC",Inter,system-ui,sans-serif;
}
#gameScreen .bp-v4 .bp-fit{
  position:relative!important;
  flex:none!important;
  width:calc(374px * var(--bp-panel-scale,1))!important;
  height:calc(636px * var(--bp-panel-scale,1))!important;
}
#gameScreen .bp-v4 .bp-panel{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:374px!important;
  height:636px!important;
  max-width:none!important;
  max-height:none!important;
  min-width:374px!important;
  min-height:636px!important;
  margin:0!important;
  padding:0!important;
  display:block!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
  color:#402b1c!important;
  background:transparent url("assets/ui/backpack/backpack-inventory-ui-v2/ui/svg/backpack-panel-frame.svg?v=bp9") center/100% 100% no-repeat!important;
  filter:drop-shadow(0 10px 10px #21140977)!important;
  transform:translate(-50%,-50%) scale(var(--bp-panel-scale,1))!important;
  transform-origin:center center!important;
}
#gameScreen .bp-v4 .bp-panel::before{content:none!important;display:none!important}

#gameScreen .bp-v4 .bp-header{
  position:absolute!important;
  z-index:3!important;
  left:50%!important;
  top:2.35%!important;
  width:max-content!important;
  min-width:38%!important;
  height:auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:.35em!important;
  margin:0!important;
  padding:.28em 1em .3em .7em!important;
  border:3px solid #6a3916!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,#e9bb62,#a66427 58%,#8b501d)!important;
  box-shadow:0 3px 0 #4e2a10,inset 0 1px #ffe59b!important;
  transform:translateX(-50%)!important;
}
#gameScreen .bp-v4 .bp-header img{width:1.2em!important;height:1.2em!important;object-fit:contain!important}
#gameScreen .bp-v4 .bp-title{
  margin:0!important;
  color:#fff8d7!important;
  font-size:16px!important;
  font-weight:900!important;
  letter-spacing:.12em!important;
  line-height:1!important;
  text-shadow:0 1px #5a2f12!important;
}
#gameScreen .bp-v4 .bp-close{
  position:absolute!important;
  z-index:4!important;
  left:auto!important;
  right:3.2%!important;
  top:2.6%!important;
  width:7.2%!important;
  aspect-ratio:1!important;
  height:auto!important;
  display:grid!important;
  place-items:center!important;
  padding:0!important;
  border:3px solid #793319!important;
  border-radius:50%!important;
  background:linear-gradient(#ff785b,#dc3f2d)!important;
  box-shadow:inset 0 2px #ffb096,0 3px #8c321f!important;
  color:#fff7d9!important;
  font-size:17px!important;
  font-weight:900!important;
  line-height:1!important;
  transform:none!important;
  cursor:pointer;
}

/* Tabs sit on the paper above the gray well (y≈128–230). */
#gameScreen .bp-v4 .bp-tabs{
  position:absolute!important;
  left:7.2%!important;
  top:9.4%!important;
  width:85.6%!important;
  height:7.6%!important;
  margin:0!important;
  padding:0!important;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  grid-template-rows:repeat(2,minmax(0,1fr))!important;
  gap:8% 2.2%!important;
  align-content:stretch!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
}
#gameScreen .bp-v4 .bp-tab{
  width:100%!important;
  min-width:0!important;
  height:auto!important;
  min-height:0!important;
  padding:0 2px!important;
  border:2px solid #a96d2e!important;
  border-radius:8px!important;
  background:linear-gradient(#fff7db,#e9c98e)!important;
  color:#55371e!important;
  font-size:10px!important;
  font-weight:900!important;
  line-height:1!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  cursor:pointer;
}
#gameScreen .bp-v4 .bp-tab[aria-selected="true"]{
  border-color:#477b1e!important;
  background:linear-gradient(#9bdf4c,#55a52b)!important;
  box-shadow:inset 0 2px #d9ff94,0 2px #315d18!important;
  color:#fff!important;
  text-shadow:0 1px #315d18!important;
}

/* 3×3 items strictly inside the gray well. */
#gameScreen .bp-v4 .bp-grid{
  position:absolute!important;
  left:7.4%!important;
  top:18.7%!important;
  width:85.2%!important;
  height:44.6%!important;
  margin:0!important;
  padding:1.4% 1.2% 0.8%!important;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  grid-template-rows:repeat(3,minmax(0,1fr))!important;
  grid-auto-rows:minmax(0,1fr)!important;
  gap:2.2%!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
}
#gameScreen .bp-v4 .bp-slot{
  position:relative!important;
  min-width:0!important;
  min-height:0!important;
  width:auto!important;
  height:auto!important;
  overflow:hidden!important;
  border:0!important;
  border-radius:10px!important;
  background:linear-gradient(180deg,#fffdf2,#fff4d8 72%,#f5dda9)!important;
  box-shadow:inset 0 0 0 2px #b77b3d,inset 0 0 0 4px #fff8dc,0 2px 2px #76502b33!important;
  cursor:pointer;
}
#gameScreen .bp-v4 .bp-slot[aria-selected="true"]{
  transform:translateY(-1px)!important;
  box-shadow:inset 0 0 0 3px #ffd452,inset 0 0 0 5px #fff8cc,0 0 0 2px #ed9f12,0 4px 7px #8b5b2640!important;
}
#gameScreen .bp-v4 .bp-slot--empty{
  opacity:.28!important;
  background:linear-gradient(#fff9e6,#ead7aa)!important;
  box-shadow:inset 0 0 0 2px #caa66c!important;
  cursor:default!important;
}
#gameScreen .bp-v4 .bp-slot__halo{left:15%!important;right:15%!important;top:8%!important;height:50%!important}
#gameScreen .bp-v4 .bp-slot__icon{
  position:absolute!important;z-index:1!important;
  left:16%!important;top:4%!important;width:68%!important;height:50%!important;
  object-fit:contain!important;filter:drop-shadow(0 3px 2px #50331635)!important;
}
#gameScreen .bp-v4 .bp-slot__name{
  position:absolute!important;z-index:2!important;
  left:4%!important;right:4%!important;bottom:16%!important;
  overflow:hidden!important;color:#4a301f!important;
  font-size:8px!important;font-weight:900!important;line-height:1.1!important;
  text-align:center!important;text-overflow:ellipsis!important;white-space:nowrap!important;
}
#gameScreen .bp-v4 .bp-slot__qty{
  position:absolute!important;z-index:4!important;
  right:2px!important;top:2px!important;bottom:auto!important;
  min-width:18px!important;height:18px!important;
  display:grid!important;place-items:center!important;
  padding:0 3px!important;border:2px solid #fff0b9!important;border-radius:999px!important;
  background:#704019!important;color:#fff!important;font-size:9px!important;font-weight:900!important;
}
#gameScreen .bp-v4 .bp-slot__tag{
  position:absolute!important;z-index:4!important;left:2px!important;top:2px!important;
  padding:1px 4px!important;border:1.5px solid #fff1ff!important;border-radius:6px!important;
  background:linear-gradient(#b96bec,#8739c4)!important;color:#fff!important;font-size:7px!important;font-weight:900!important;
}
#gameScreen .bp-v4 .bp-slot__kind{
  position:absolute!important;z-index:2!important;
  left:10%!important;right:10%!important;bottom:3%!important;height:11px!important;
  border-radius:6px!important;background:var(--kind,#b97928)!important;color:#fff!important;
  font-size:7px!important;font-weight:850!important;line-height:11px!important;text-align:center!important;
}

/* Pager stays in the gray well, above the detail pocket. */
#gameScreen .bp-v4 .bp-page{
  position:absolute!important;
  left:7.4%!important;
  top:63.6%!important;
  width:85.2%!important;
  height:3.4%!important;
  margin:0!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:3%!important;
  color:#76502b!important;
  font-size:11px!important;
  font-weight:900!important;
}
#gameScreen .bp-v4 .bp-page__arrow{
  width:22px!important;height:20px!important;padding:0!important;border:0!important;border-radius:50%!important;
  background:#d99b3e!important;color:#fff!important;font-size:18px!important;font-weight:900!important;line-height:18px!important;
}
#gameScreen .bp-v4 .bp-page__arrow:disabled{opacity:.3!important}

/* Detail stays inside the lower cream pocket; do not overflow the wood rim. */
#gameScreen .bp-v4 .bp-detail{
  position:absolute!important;
  left:9.1%!important;
  top:71.4%!important;
  width:81.8%!important;
  height:20.6%!important;
  margin:0!important;
  padding:2.4% 2.2% 3.2%!important;
  display:grid!important;
  grid-template-columns:27% minmax(0,1fr)!important;
  gap:3%!important;
  align-items:stretch!important;
  overflow:hidden!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  box-sizing:border-box!important;
}
#gameScreen .bp-v4 .bp-detail[hidden]{display:none!important}
#gameScreen .bp-v4 .bp-detail__visual{
  min-width:0!important;min-height:0!important;
  display:grid!important;place-items:center!important;
  border-radius:10px!important;
  background:radial-gradient(circle,#fffdf0,#f4dda6)!important;
  box-shadow:inset 0 0 0 2px #d59b50!important;
}
#gameScreen .bp-v4 .bp-detail__visual img{
  width:86%!important;height:84%!important;object-fit:contain!important;
  filter:drop-shadow(0 4px 2px #50331635)!important;
}
#gameScreen .bp-v4 .bp-detail__body{
  min-width:0!important;min-height:0!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  grid-template-rows:auto auto minmax(0,1fr) auto!important;
  overflow:hidden!important;
}
#gameScreen .bp-v4 .bp-detail__name{
  grid-column:1!important;grid-row:auto!important;min-width:0!important;
  margin:0!important;padding:0!important;overflow:hidden!important;
  color:#402b1c!important;font-size:13px!important;font-weight:900!important;
  line-height:1.15!important;text-overflow:ellipsis!important;white-space:nowrap!important;
}
#gameScreen .bp-v4 .bp-detail__badge{
  grid-column:1!important;grid-row:auto!important;justify-self:start!important;
  margin:3px 0 2px!important;padding:1px 6px!important;border-radius:7px!important;
  background:#9f58d7!important;color:#fff!important;font-size:8px!important;font-weight:850!important;line-height:13px!important;
}
#gameScreen .bp-v4 .bp-detail__badge--tradable{background:#64a72f!important}
#gameScreen .bp-v4 .bp-detail__description{
  grid-column:1!important;grid-row:auto!important;min-width:0!important;min-height:0!important;
  display:-webkit-box!important;margin:0!important;padding:0!important;overflow:hidden!important;
  color:#65472d!important;font-size:10px!important;line-height:1.3!important;
  -webkit-box-orient:vertical!important;-webkit-line-clamp:2!important;
}
#gameScreen .bp-v4 .bp-detail__footer{
  grid-column:1!important;grid-row:auto!important;min-width:0!important;
  display:flex!important;align-items:center!important;justify-content:space-between!important;
  gap:6px!important;margin:0!important;padding:4px 0 0!important;
  border-top:1px dashed #d2a765!important;
}
#gameScreen .bp-v4 .bp-detail__owned{
  min-width:0!important;overflow:hidden!important;color:#4f321e!important;
  font-size:11px!important;font-weight:900!important;text-overflow:ellipsis!important;white-space:nowrap!important;
}
#gameScreen .bp-v4 .bp-action{
  flex:none!important;width:78px!important;min-height:28px!important;height:28px!important;
  border:0!important;
  background:transparent url("assets/ui/backpack/backpack-inventory-ui-v2/ui/svg/button-primary.svg") center/100% 100% no-repeat!important;
  color:#fff9dd!important;font-size:12px!important;font-weight:900!important;text-shadow:0 2px #34200f!important;
  cursor:pointer;
}
#gameScreen .bp-v4 .bp-action:disabled{filter:grayscale(.8)!important;opacity:.55!important}
#gameScreen .bp-v4 .bp-empty{
  grid-column:1/-1!important;grid-row:1/-1!important;
  display:grid!important;place-items:center!important;color:#927650!important;font-size:12px!important;
}

@media (prefers-reduced-motion:reduce){
  #gameScreen .bp-v4 .bp-slot{transition:none!important}
}