.oppRow{
  display:flex;
  gap:10px;
  overflow:auto;
  padding-bottom:6px;
}

.oppChip{
  min-width: 210px;
  padding:12px;
  border-radius:18px;
  border:1px solid rgba(32,51,83,.9);
  background: rgba(14,24,48,.55);
  box-shadow: var(--shadow);
}
.oppChip.me{border-color: rgba(125,255,179,.55)}
.oppName{font-weight:900}
.oppMeta{font-size:.85rem;color:var(--muted);margin-top:2px}
.oppSeq{display:flex;gap:6px;margin-top:10px}
.dot{width:16px;height:16px;border-radius:999px;opacity:.9}
.dot.red{background:#ef4444}
.dot.yellow{background:#facc15}
.dot.blue{background:#3b82f6}
.dot.creature{background:#a855f7}

.boardCard{
  border-radius:18px;
  border:1px solid rgba(32,51,83,.9);
  background: rgba(14,24,48,.55);
  box-shadow: var(--shadow);
  padding:14px;
}
.boardHead{
  display:flex;justify-content:space-between;gap:10px;align-items:center;
  margin-bottom:12px;
}
.boardTitle{font-weight:900;font-size:1.2rem;color:var(--green)}
.boardPhase{font-size:.9rem;color:var(--muted)}
.boardSlots{display:flex;gap:10px;flex-wrap:wrap}
.slot.big{
  width:74px;height:104px;border-radius:16px;
  border:1px solid rgba(32,51,83,.9);
  background: rgba(7,11,20,.55);
}
.slot.big.red{box-shadow: inset 0 -6px 0 #ef4444}
.slot.big.yellow{box-shadow: inset 0 -6px 0 #facc15}
.slot.big.blue{box-shadow: inset 0 -6px 0 #3b82f6}
.slot.big.creature{box-shadow: inset 0 -6px 0 #a855f7}
.boardHint{margin-top:12px;color:var(--muted);font-size:.9rem}

.handWrap{max-width:1100px;margin:0 auto}
.handTitle{font-weight:900;color:var(--muted);margin:0 0 8px 2px}

.fan{
  display:flex;
  justify-content:center;
  align-items:flex-end;
  gap:0;
  height: 190px;
  overflow:hidden;
}

.handCard{
  width:120px;
  height:170px;
  border:0;
  background:transparent;
  cursor:pointer;
  margin-left:-44px; /* sovrapposizione */
  transform-origin: 50% 120%;
  transition: transform .12s ease, filter .12s ease;
}
.handCard:active{transform: translateY(-6px) scale(.98) rotate(0deg) !important}
.handImg{
  width:100%;
  height:100%;
  border-radius:18px;
  border:1px solid rgba(42,74,90,.9);
  background: rgba(14,24,48,.55);
  position:relative;
  overflow:hidden;
  box-shadow: 0 14px 30px rgba(0,0,0,.45);
}
.handImg img{
  width:100%;
  height:100%;
  object-fit:contain;
}
.handLabel{
  position:absolute;left:0;right:0;bottom:0;
  padding:8px 10px;
  font-weight:900;
  font-size:.85rem;
  color:rgba(255,255,255,.95);
  background: linear-gradient(180deg, transparent, rgba(0,0,0,.65));
  text-shadow: 0 2px 10px rgba(0,0,0,.55);
}