/* Page des votes et classements du tableau de bord admin */
.vt-scene { position: relative; display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--cadre-bord); border-radius: 20px; color: #e8f4ff; background: radial-gradient(60% 70% at 50% 62%, rgb(255 201 59 / .28), transparent 70%), linear-gradient(180deg, #141a38 0%, #2e2566 58%, #6d3a86 100%); box-shadow: var(--cadre-ombre); }
.vt-scene::before { content: ""; position: absolute; inset: 0 0 auto; height: 60%; opacity: .7; pointer-events: none; background-image: radial-gradient(2px 2px at 12% 30%, #fff 50%, transparent 51%), radial-gradient(2px 2px at 27% 62%, #cfe6ff 50%, transparent 51%), radial-gradient(3px 3px at 41% 18%, #fff 50%, transparent 51%), radial-gradient(2px 2px at 63% 40%, #fff 50%, transparent 51%), radial-gradient(3px 3px at 78% 16%, var(--encart) 50%, transparent 51%), radial-gradient(2px 2px at 90% 56%, #fff 50%, transparent 51%); }
.vt-entete { position: relative; display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 14px 24px; padding: clamp(20px, 3vw, 32px) clamp(20px, 3vw, 36px) 0; }
.vt-surtitre { margin: 0 0 4px; color: var(--or); font: 400 1rem/1.2 var(--bd); letter-spacing: .04em; }
.vt-surtitre::first-letter { text-transform: uppercase; }
html body.aventure .ot .vt-scene h2 { margin: 0; color: #fff; font-size: clamp(1.6rem, 3vw, 2.3rem); text-shadow: var(--cadre-ombre-douce); }
.vt-total { display: grid; justify-items: end; margin: 0; }
.vt-total strong { color: var(--or); font: 400 clamp(2.4rem, 5vw, 3.4rem)/1 var(--bd); text-shadow: var(--cadre-ombre-douce); }
.vt-total span { color: #e8f4ff; font-size: .95rem; font-weight: 600; }

html body.aventure .ot .vt-podium { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: end; gap: 0; width: min(620px, 100%); box-sizing: border-box; margin: auto auto 0; padding: 18px 16px 0; list-style: none; }
html body.aventure .ot .vt-podium > li { display: flex; flex-direction: column; align-items: center; min-width: 0; margin: 0; text-align: center; }
.vt-p1 { order: 2; }
.vt-p2 { order: 1; }
.vt-p3 { order: 3; }
.vt-couronne { display: block; height: 30px; margin-bottom: 4px; color: var(--or); filter: drop-shadow(0 3px 0 var(--encre)); }
.vt-tete { display: grid; place-items: center; width: 64px; height: 64px; border: 1px solid var(--cadre-bord); border-radius: 6px; color: rgb(255 255 255 / .85); background: #3b3f73; box-shadow: inset 0 -6px 0 rgb(0 0 0 / .25), inset 0 6px 0 rgb(255 255 255 / .12); font: 400 1.9rem/1 var(--bd); }
.vt-p1 .vt-tete { width: 84px; height: 84px; font-size: 2.5rem; }
.vt-joueur { max-width: 100%; margin-top: 8px; color: #fff; font: 400 1.05rem/1.2 var(--bd); overflow-wrap: anywhere; }
.vt-nb { margin: 2px 0 10px; color: #dfe6ff; font-size: .85rem; font-weight: 600; }
.vt-socle { display: grid; place-items: center; width: 100%; border: 3px solid var(--encre); border-bottom: 0; color: var(--encre-texte); font: 400 clamp(2.2rem, 6vw, 3.6rem)/1 var(--bd); background-size: 24px 24px; box-shadow: inset 0 8px 0 rgb(255 255 255 / .45); }
.vt-p1 .vt-socle { height: 150px; background-color: #ffc93b; background-image: repeating-conic-gradient(rgb(255 255 255 / .12) 0 25%, transparent 0 50%); }
.vt-p2 .vt-socle { height: 104px; margin-right: -3px; background-color: #cdd6e2; background-image: repeating-conic-gradient(rgb(255 255 255 / .22) 0 25%, transparent 0 50%); }
.vt-p3 .vt-socle { height: 72px; margin-left: -3px; background-color: #d68f55; background-image: repeating-conic-gradient(rgb(255 255 255 / .12) 0 25%, transparent 0 50%); }
.vt-sol { position: relative; height: 44px; border-top: 3px solid var(--encre); background: linear-gradient(#58b368 0 14px, #2f7d48 14px 17px, transparent 17px), repeating-conic-gradient(#6b4630 0 25%, #5c3b28 0 50%) 0 0 / 22px 22px; }

html body.aventure .ot .vt-duo { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 18px; align-items: stretch; }
.vt-bloc { padding: clamp(18px, 2.6vw, 26px); border: 1px solid var(--cadre-bord); border-radius: 20px; background: var(--papier); box-shadow: var(--cadre-ombre); }
html body.aventure .ot .vt-sites { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
html body.aventure .ot .vt-sites > li { display: flex; flex-direction: column; overflow: hidden; margin: 0; border: 1px solid var(--cadre-bord); border-radius: 20px; background: var(--champ); box-shadow: var(--cadre-ombre); }
.vt-illu { position: relative; display: block; height: 118px; color: var(--vt-colline); background: linear-gradient(180deg, var(--vt-ciel-haut), var(--vt-ciel-bas)); border-bottom: 3px solid var(--encre); }
.vt-illu svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.vt-num { position: absolute; top: 9px; left: 9px; display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid var(--cadre-bord); border-radius: 10px; color: var(--encre-texte); background: var(--champ); box-shadow: var(--cadre-ombre-douce); font: 400 1.05rem/1 var(--bd); }
.vt-carte-corps { display: flex; flex: 1; flex-direction: column; justify-content: space-between; gap: 12px; padding: 14px; }
.vt-sites strong { color: var(--encre-texte); font: 400 1.2rem/1.15 var(--bd); overflow-wrap: anywhere; }
.vt-voter { padding: 10px; border-radius: 10px; color: #1d2442; background: linear-gradient(180deg, #4cc6f7, #1a90f2); box-shadow: 0 4px 0 #0040c0; font: 400 1rem/1.2 var(--bd); letter-spacing: .04em; text-align: center; text-transform: uppercase; cursor: not-allowed; }

.vt-titre { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 14px; margin-bottom: 12px; }
html body.aventure .ot .vt-titre h2 { margin: 0; }
.vt-titre p { margin: 0; font-size: .9rem; }
html body.aventure .ot .vt-lignes { margin: 0; padding: 0; list-style: none; }
html body.aventure .ot .vt-lignes > li { display: grid; grid-template-columns: 30px 30px minmax(0, 1fr) auto; align-items: center; gap: 10px; margin: 0; padding: 6px 10px; border-radius: 8px; color: var(--encre-texte); }
html body.aventure .ot .vt-lignes > li:nth-child(odd) { background: rgb(29 36 66 / .06); }
.vt-pos { font: 400 1.15rem/1 var(--bd); text-align: center; }
.vt-lignes li:nth-child(1) .vt-pos { color: #b98500; }
.vt-lignes li:nth-child(2) .vt-pos { color: #66738a; }
.vt-lignes li:nth-child(3) .vt-pos { color: #a7602b; }
.vt-mini { box-sizing: border-box; width: 28px; height: 28px; border: 1px solid var(--cadre-bord); border-radius: 4px; background: #c9c4dd; }
.vt-vide { color: rgb(29 36 66 / .55); }
.vt-score { font: 400 1.05rem/1 var(--bd); }

.vt-onglets { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.vt-onglets button { min-height: 32px; padding: 3px 11px; border: 2px solid var(--encre); border-radius: 8px; background: var(--champ); color: var(--encre-texte); font: 400 .88rem/1.2 var(--bd); cursor: pointer; }
.vt-onglets button::first-letter { text-transform: uppercase; }
.vt-onglets button[aria-pressed="true"] { background: linear-gradient(180deg, #4cc6f7, #1a90f2); }

@media (max-width: 960px) {
  html body.aventure .ot .vt-sites { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html body.aventure .ot .vt-duo { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 620px) {
  .vt-total { display: flex; align-items: baseline; gap: 8px; }
  html body.aventure .ot .vt-podium { padding: 0 8px; }
  .vt-tete { width: 48px; height: 48px; font-size: 1.4rem; }
  .vt-p1 .vt-tete { width: 60px; height: 60px; font-size: 1.8rem; }
  .vt-joueur { font-size: .9rem; }
  .vt-nb { font-size: .75rem; }
  .vt-p1 .vt-socle { height: 110px; }
  .vt-p2 .vt-socle { height: 78px; }
  .vt-p3 .vt-socle { height: 54px; }
}
html body.aventure.aventure .ot:has(.vt-duo) { align-content: start; }
