.battle-api-message {
  margin: 0 0 12px;
  padding: 12px 14px;
  border: 1px solid #f0c9cf;
  border-radius: 12px;
  background: #fff1f3;
  color: #af2940;
  font-size: 10px;
  font-weight: 850;
}

.battle-api-message[hidden] {
  display: none;
}

.battle-team {
  position: relative;
  display: flex;
  min-height: 190px;
  align-items: center;
  overflow: hidden;
  padding: 18px;
  background:
    radial-gradient(circle at 83% 50%, rgba(38, 136, 244, .65), transparent 33%),
    linear-gradient(145deg, #071a35, #123b6b);
  color: #fff;
}

/* Question « meilleure joueuse » : une carte par candidate, sans réduire
   la sélection à un faux duel de deux portraits. */
.battle-best-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:15px;background:linear-gradient(145deg,#06162e,#123b6b)}
.battle-best-list button{display:grid;min-width:0;min-height:86px;grid-template-columns:60px minmax(0,1fr);align-items:center;gap:10px;padding:7px 10px 7px 7px;border:1px solid rgba(144,201,244,.25);border-radius:14px;background:linear-gradient(135deg,rgba(255,255,255,.12),rgba(255,255,255,.045));color:#fff;cursor:pointer;font:inherit;text-align:left;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 5px 12px rgba(0,0,0,.14);transition:.15s}
.battle-best-list button:hover,.battle-best-list button.is-selected{border-color:#72c5ff;background:linear-gradient(135deg,rgba(66,164,239,.38),rgba(255,255,255,.10));box-shadow:0 0 0 2px rgba(114,197,255,.16),0 7px 16px rgba(0,0,0,.18)}
.battle-best-list button:disabled{cursor:default}
.battle-best-list img{width:60px;height:72px;grid-column:1;align-self:center;object-fit:cover;object-position:center 18%;border-radius:10px;background:rgba(0,0,0,.22);filter:drop-shadow(0 3px 4px rgba(0,0,0,.25))}
.battle-best-list span{display:flex;min-width:0;flex:1;flex-direction:column;gap:2px}
.battle-best-list small{color:#8fd3ff;font-size:7px;font-weight:950;letter-spacing:.08em}
.battle-best-list b{overflow:hidden;font-size:10px;text-overflow:ellipsis;white-space:nowrap}
.battle-best-list em{color:#a9bed3;font-size:8px;font-style:normal;font-weight:800}
.battle-team[hidden],.battle-duel[hidden],.battle-player[hidden],.battle-best-list[hidden],.battle-choices[hidden]{display:none!important}
@media(max-width:640px){.battle-best-list{grid-template-columns:1fr}}

.battle-team::after {
  position: absolute;
  right: -12px;
  content: "FR";
  color: rgba(255, 255, 255, .06);
  font-size: 150px;
  font-weight: 1000;
  letter-spacing: -.1em;
}

.battle-team > div {
  position: relative;
  z-index: 1;
}

.battle-team i {
  position: absolute;
  top: -4px;
  left: 235px;
  font-size: 55px;
  font-style: normal;
}

.battle-team small {
  color: #74c8ff;
  font-size: 8px;
  font-weight: 950;
  letter-spacing: .09em;
}

.battle-team h2 {
  margin: 8px 0 6px;
  font-size: 29px;
  line-height: .96;
  letter-spacing: -.045em;
}

.battle-team h2 em {
  color: #67b7ff;
  font-style: normal;
}

.battle-team p {
  max-width: 245px;
  margin: 0;
  color: #93abc3;
  font-size: 9px;
}

.battle-complete a {
  display: inline-block;
  margin-top: 11px;
  color: #70c8ff;
  font-size: 9px;
  font-weight: 900;
  text-decoration: none;
}

.battle-card.is-result-win {
  border-color: #42b883;
  box-shadow: 0 0 0 3px rgba(66, 184, 131, .13);
}

.battle-card.is-result-loss {
  border-color: #ef6176;
}

.battle-card.is-result-win > footer span {
  color: #168153;
}

.battle-card.is-result-loss > footer span {
  color: #c92f47;
}

.battle-ranking {
  margin-top: 18px;
  padding: 23px;
  border: 1px solid var(--battle-line);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 10px 30px rgba(16, 42, 70, .06);
}

.battle-history{margin-top:18px;padding:24px;border:1px solid var(--battle-line);border-radius:20px;background:#fff;box-shadow:0 12px 34px #102a4610}.battle-history[hidden]{display:none}.battle-history>header{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:14px}.battle-history>header span{color:#1473c9;font-size:9px;font-weight:950;letter-spacing:.14em}.battle-history>header h2{margin:4px 0 0;font-size:26px}.battle-history>header p{margin:0;color:#718298;font-size:11px}.battle-history-round{overflow:hidden;margin-top:9px;border:1px solid #dce5ef;border-radius:15px}.battle-history-round summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 17px;background:#f7faff;cursor:pointer;list-style:none}.battle-history-round summary::-webkit-details-marker{display:none}.battle-history-round summary span{display:flex;flex-direction:column;gap:3px}.battle-history-round summary small{color:#718298;font-size:9px;text-transform:uppercase}.battle-history-round summary strong{color:#10233d;font-size:14px}.battle-history-round summary>b{color:#0c65b5;font-size:24px;text-align:right}.battle-history-round summary em{display:block;color:#718298;font-size:8px;font-style:normal;text-transform:uppercase}.battle-history-round>div{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:10px}.battle-history-round article{display:flex;align-items:center;gap:9px;padding:11px;border-radius:11px;background:#f3f7fb}.battle-history-round article>b{display:grid;width:25px;height:25px;flex:0 0 25px;place-items:center;border-radius:50%;background:#dcfce7;color:#147445}.battle-history-round article.is-wrong>b{background:#fee2e2;color:#b4233b}.battle-history-round article span{display:flex;min-width:0;flex-direction:column}.battle-history-round article small{color:#718298;font-size:7px;font-weight:900}.battle-history-round article strong{overflow:hidden;color:#10233d;font-size:11px;text-overflow:ellipsis;white-space:nowrap}.battle-history-round article em{margin-top:3px;color:#718298;font-size:8px;font-style:normal}@media(max-width:700px){.battle-history{padding:16px}.battle-history>header{align-items:flex-start;flex-direction:column;gap:5px}.battle-history-round>div{grid-template-columns:1fr}}

.battle-ranking > header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 15px;
}

.battle-ranking header span {
  color: #1473c9;
  font-size: 8px;
  font-weight: 950;
  letter-spacing: .14em;
}

.battle-ranking h2 {
  margin: 3px 0 0;
  font-size: 25px;
  letter-spacing: -.035em;
}

.battle-ranking header p {
  margin: 0;
  color: #728297;
  font-size: 9px;
  font-weight: 800;
}

.battle-ranking header p b {
  color: #116fc5;
  font-size: 19px;
}

.battle-ranking [data-battle-leaderboard] > p {
  margin: 0;
  padding: 22px;
  border-radius: 13px;
  background: #f4f8fc;
  color: #78889c;
  font-size: 10px;
  text-align: center;
}

.battle-rank-row {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) 70px 70px;
  align-items: center;
  min-height: 48px;
  padding: 0 12px;
  border-top: 1px solid #e8edf3;
  font-size: 10px;
}

.battle-rank-row:first-child {
  border-top: 0;
}

.battle-rank-row.is-me {
  border-radius: 10px;
  background: #eaf5ff;
  color: #0d64ad;
}

.battle-rank-row > b:first-child {
  color: #8b9aab;
}

.battle-rank-row strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.battle-rank-row span,
.battle-rank-row small {
  color: #74869b;
  font-weight: 850;
  text-align: right;
}

@media (max-width: 640px) {
  .battle-team i {
    right: 0;
    left: auto;
  }

  .battle-ranking {
    padding: 16px;
  }

  .battle-ranking > header {
    align-items: flex-start;
    flex-direction: column;
    gap: 6px;
  }

  .battle-rank-row {
    grid-template-columns: 30px minmax(0, 1fr) 56px;
  }

  .battle-rank-row small {
    display: none;
  }
}