body.uno-theme {
  --bg-color: #14101c;
  --surface-color: #1f1a2c;
  --accent-color: #ff5c5c;
}

.uno-table {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin: 20px 0;
}

/* Carte : cadre blanc + intérieur coloré, comme les vraies cartes UNO */
.uno-card {
  width: 62px;
  height: 92px;
  border-radius: 10px;
  background: #fff;
  padding: 3px;
  flex-shrink: 0;
  box-shadow: 0 2px 4px rgba(0,0,0,0.4);
}

.uno-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 8px;
  border: 2px solid #000;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.uno-card.red .uno-card-inner { background: #ED1C24; }
.uno-card.yellow .uno-card-inner { background: #FFDE00; }
.uno-card.green .uno-card-inner { background: #00A651; }
.uno-card.blue .uno-card-inner { background: #0072BC; }
.uno-card.wild .uno-card-inner { background: #000; }
.uno-card.wild4 .uno-card-inner { background: #000; }

.uno-card-symbol {
  font-size: 30px;
  font-weight: 900;
  font-style: italic;
  font-family: Georgia, 'Times New Roman', serif;
  color: #fff;
  -webkit-text-stroke: 1px #000;
  transform: skewX(-6deg);
  z-index: 1;
}

.uno-card.yellow .uno-card-symbol { color: #fff; -webkit-text-stroke: 1px #000; }

/* Petits chiffres/symboles dans les coins, comme les vraies cartes */
.uno-card-corner {
  position: absolute;
  font-size: 11px;
  font-weight: 800;
  color: #fff;
  line-height: 1;
}
.uno-card.yellow .uno-card-corner { color: #fff; -webkit-text-stroke: 0.5px #000; }
.uno-card-corner.top-left { top: 4px; left: 5px; }
.uno-card-corner.bottom-right { bottom: 4px; right: 5px; transform: rotate(180deg); }

/* Joker classique : pastille multicolore (façon logo UNO) */
.uno-card.wild .uno-card-symbol {
  width: 65%;
  height: 50%;
  border-radius: 50%;
  background: conic-gradient(#ee2b2b 0deg 90deg, #f4c60a 90deg 180deg, #24a148 180deg 270deg, #1560d4 270deg 360deg);
  transform: rotate(-20deg);
}

/* +4 : petits losanges colorés sur fond noir */
.uno-card.wild4 .uno-card-symbol {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 3px;
  width: 60%;
  height: 44%;
}
.uno-card.wild4 .uno-card-symbol span {
  border-radius: 3px;
  transform: rotate(45deg);
}
.uno-card.wild4 .uno-card-symbol span:nth-child(1) { background: #ee2b2b; }
.uno-card.wild4 .uno-card-symbol span:nth-child(2) { background: #1560d4; }
.uno-card.wild4 .uno-card-symbol span:nth-child(3) { background: #f4c60a; }
.uno-card.wild4 .uno-card-symbol span:nth-child(4) { background: #24a148; }

.uno-discard .uno-card { width: 74px; height: 108px; }
.uno-discard .uno-card-symbol { font-size: 30px; }

.uno-hand {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 10px 4px 20px;
}

.uno-hand .uno-card { cursor: pointer; transition: transform 0.1s; }
.uno-hand .uno-card:active { transform: translateY(-6px); }
.uno-hand .uno-card.disabled { opacity: 0.4; cursor: default; }

.color-choices {
  display: flex;
  gap: 10px;
  justify-content: center;
}

.color-btn {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: none;
  cursor: pointer;
}

.color-btn.red { background: #ee2b2b; }
.color-btn.yellow { background: #f4c60a; }
.color-btn.green { background: #24a148; }
.color-btn.blue { background: #1560d4; }

/* Liste des joueurs (mode 3-10) */
.uno-players-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 10px;
}

.uno-player-row {
  display: flex;
  justify-content: space-between;
  padding: 6px 10px;
  border-radius: 8px;
  background: var(--surface-color);
  font-size: 14px;
}

.uno-player-row.current-turn { outline: 2px solid var(--accent-color); }