/* layout-compact.css — rakip + istaka sıkı layout */
#game > #opp-top,
#game > .opp-slot-top {
  margin: 0 8px !important;
}

.opp-card {
  padding: 5px 7px !important;
  min-width: 68px !important;
  border-radius: 10px !important;
}

#opp-top .opp-card {
  gap: 7px !important;
  padding: 4px 8px 4px 6px !important;
  max-width: min(260px, 62%) !important;
}

.opp-card .avatar,
#opp-top .opp-card .avatar {
  width: 26px !important;
  height: 26px !important;
  font-size: 11px !important;
  margin-bottom: 2px !important;
}

.opp-card .name,
#opp-top .opp-card .name {
  font-size: 10px !important;
  max-width: 88px !important;
}

.opp-card .tile-backs {
  height: 16px !important;
  margin-top: 3px !important;
}

.opp-card .tile-back {
  width: 10px !important;
  height: 15px !important;
  margin-left: -4px !important;
}

.opp-card .tile-meta {
  font-size: 9px !important;
  margin-top: 2px !important;
}

.opp-card .turn-chip {
  font-size: 8px !important;
  padding: 1px 5px !important;
}

.opp-card .partner-badge {
  display: inline-block;
  font-size: 7px !important;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #1a1208;
  background: linear-gradient(90deg, #ffe082, #ffd700);
  border-radius: 999px;
  padding: 0 5px;
  margin-left: 4px;
  vertical-align: middle;
}

.opp-card.is-partner {
  border-color: rgba(255, 215, 0, 0.45) !important;
  background: rgba(255, 215, 0, 0.1) !important;
}

.opp-card .opened-chip {
  font-size: 7px !important;
  font-weight: 700;
  color: #8fd4b8;
  margin-top: 1px;
}

#opp-left .opp-card,
#opp-right .opp-card {
  min-width: 58px !important;
  padding: 4px 5px !important;
}

#rack-section {
  padding: 5px 8px 8px !important;
}

#rack-header {
  padding: 0 2px 5px !important;
  gap: 6px !important;
}

#rack-header .rack-title {
  font-size: 11px !important;
}

#rack-header .selected-info {
  font-size: 10px !important;
}

.rack-arrange {
  gap: 4px !important;
}

.rack-arrange-btn {
  padding: 3px 7px !important;
  font-size: 10px !important;
}

.rack-arrange-btn .rack-arr-ico {
  font-size: 11px !important;
}

.set-group.partner .set-owner {
  color: #ffd700 !important;
}

.set-group.partner .set-owner::after {
  content: ' · eş';
  opacity: 0.75;
  font-weight: 600;
}

.opp-card .tile-back.partner-face {
  width: 12px !important;
  height: 16px !important;
  font-size: 8px !important;
  font-weight: 800;
  line-height: 16px;
  text-align: center;
  border-radius: 2px;
  margin-left: -3px !important;
  box-shadow: 0 0 0 1px rgba(0,0,0,.25);
}

.tb-chip.tb-mode {
  background: linear-gradient(90deg, rgba(255,215,0,.22), rgba(255,215,0,.08)) !important;
  border-color: rgba(255,215,0,.35) !important;
  color: #ffe082 !important;
  font-weight: 700;
}

.tb-chip.tb-foul {
  background: rgba(255, 87, 34, 0.22) !important;
  border-color: rgba(255, 87, 34, 0.45) !important;
  color: #ffab91 !important;
  font-weight: 700;
}

/* Ceza riski — okey / işler taş */
#rack-container .tile.foul-risk {
  box-shadow: 0 0 0 2px rgba(255, 87, 34, 0.85), 0 2px 8px rgba(0,0,0,.35) !important;
}
#rack-container .tile.foul-risk .foul-dot {
  position: absolute;
  top: 3px;
  right: 3px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #ff5722;
  box-shadow: 0 0 0 1px rgba(0,0,0,.35);
  pointer-events: none;
}
#rack-container .tile.foul-okey .foul-dot {
  background: #ffd700;
  box-shadow: 0 0 0 1px rgba(0,0,0,.4), 0 0 6px rgba(255,215,0,.6);
}

@media (max-width: 520px) {
  #opp-top .opp-card {
    max-width: min(220px, 70%) !important;
  }
  .rack-arrange-btn .rack-arr-lbl {
    display: none;
  }
}
