/* v1.10.5 — Player hand readability first.
   Reverts the oversized bottom hand treatment and restores compact, information-first hand cards. */

/* Keep the dock stable, but do NOT enlarge hand cards to fill it. */
:root{
  --v160-dock-h:clamp(96px,18.2dvh,118px);
}
.personal-zone{
  flex-basis:var(--v160-dock-h)!important;
  min-height:var(--v160-dock-h)!important;
}

/* Player hand cards should be compact and fully legible, not stretched. */
.personal-zone-right{
  align-items:center!important;
}
.personal-hand{
  min-height:0!important;
  height:100%!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:4px!important;
}
.hand-row{
  align-items:center!important;
  justify-content:flex-start!important;
  padding:0 1px 2px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
}
.personal-hand .hand-row .game-card,
.hand-row .game-card{
  flex:0 0 clamp(52px,5.4vw,64px)!important;
  width:clamp(52px,5.4vw,64px)!important;
  height:clamp(72px,9.2dvh,90px)!important;
  min-height:clamp(72px,9.2dvh,90px)!important;
  padding:3px!important;
  border-radius:5px!important;
}
.personal-hand .hand-row .game-card .effect,
.hand-row .game-card .effect{
  min-height:calc(clamp(72px,9.2dvh,90px) - 8px)!important;
  height:100%!important;
  margin:0!important;
  padding:4px 3px!important;
  gap:2px!important;
}
.personal-hand .hand-row .game-card .cube,
.hand-row .game-card .cube{
  width:8px!important;
  height:8px!important;
}
.personal-hand .hand-row .game-card .effect .arrow,
.hand-row .game-card .effect .arrow{
  font-size:11px!important;
}
.personal-hand .hand-row .game-card .upgrade-icon,
.hand-row .game-card .upgrade-icon{
  font-size:17px!important;
}
.personal-hand .hand-row .game-card .upgrade-compact,
.hand-row .game-card .upgrade-compact{
  font-size:12px!important;
}
.personal-hand .hand-row .game-card .index,
.hand-row .game-card .index{
  font-size:5px!important;
}

/* Specifically undo the more spacious merchant effect styling inside the hand area. */
.personal-hand .game-card:not(.point){
  gap:2px!important;
}
.personal-hand .game-card:not(.point) .effect{
  margin:0!important;
  padding:4px 3px!important;
}
.personal-hand .game-card:not(.point)::before{opacity:.10!important}

/* Used cards remain coloured, but must read clearly. */
.personal-hand .played-hand-card{
  filter:brightness(.72) saturate(.82) contrast(.97)!important;
}

/* Orders panel keeps its place without forcing hand cards taller. */
.personal-zone-right.has-orders{
  grid-template-columns:minmax(0,1fr) clamp(190px,27vw,350px) clamp(58px,7.4vw,88px)!important;
  align-items:center!important;
}
.completed-orders-panel{
  height:100%!important;
  align-self:stretch!important;
}

/* Very short landscape screens */
@media (orientation:landscape) and (max-height:620px){
  :root{
    --v160-dock-h:92px;
  }
  .personal-hand .hand-row .game-card,
  .hand-row .game-card{
    flex-basis:50px!important;
    width:50px!important;
    height:66px!important;
    min-height:66px!important;
    padding:2px!important;
  }
  .personal-hand .hand-row .game-card .effect,
  .hand-row .game-card .effect{
    min-height:58px!important;
    padding:3px 2px!important;
  }
  .personal-hand .hand-row .game-card .cube,
  .hand-row .game-card .cube{width:7px!important;height:7px!important}
  .personal-hand .hand-row .game-card .effect .arrow,
  .hand-row .game-card .effect .arrow{font-size:10px!important}
  .personal-hand .hand-row .game-card .upgrade-icon,
  .hand-row .game-card .upgrade-icon{font-size:15px!important}
  .personal-zone-right.has-orders{
    grid-template-columns:minmax(0,1fr) clamp(150px,24vw,220px) 48px!important;
    gap:3px!important;
  }
}
