/* ===================================================================
   🏅 LES RANGS DE PRESTIGE — l'habit des lignes de classement (16 oct. 2026, incident 604)
   ===================================================================
   Trois échelles (voir `src/core/prestige.ts`) : LES ASTRES (14 paliers, `pr-fond-aN`), LE RYTHME (12, `pr-rythme-rN`),
   LA COUR — le club des fans VIP — (13 rangs, `pr-cadre-cN`, `pr-fond-cN`). Chaque couche est un enfant de la ligne
   (`pr-fond` sous le contenu, `pr-rythme` en bas, `pr-cadre` par-dessus le bord) : aucun ::before / ::after de la ligne
   n'est pris (ils servent aux embeds 586), aucun attribut `style` (la CSP du site les refuse).
   Règles : AUCUN clignotement rapide (rien sous 0,34 s ; un éclair isolé au plus toutes les 2 s) ; transformations et
   opacités d'abord (le GPU) ; un écran chargé (budget d'animations 0-1) ou « mouvement réduit » fige tout (`pr-calme`).
   =================================================================== */
@property --pr-ang { syntax: '<angle>'; inherits: false; initial-value: 0deg; }

.pr-ligne { position: relative; isolation: isolate; }
.pr-fond, .pr-cadre, .pr-rythme { position: absolute; pointer-events: none; border-radius: inherit; }
.pr-fond { inset: 0; z-index: -1; overflow: hidden; }
.pr-fond i, .pr-rythme i, .pr-cadre i { position: absolute; display: block; pointer-events: none; }
.pr-cadre { inset: 0; z-index: 3; padding: calc(var(--u, 10px) * .26);
  /* L'anneau : le fond du cadre moins sa boîte de contenu (syntaxe préfixée : Chromium de TikTok Studio et d'OBS). */
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; }
.pr-rythme { left: 24%; right: 3%; bottom: 0; height: 36%; z-index: 0; overflow: hidden; border-radius: 0; opacity: .92; }

/* ------------------------------------------------------------------
   Les particules : huit places, huit retards (communs à tous les paliers)
   ------------------------------------------------------------------ */
.pr-fond i:nth-child(1) { left: 6%; top: 22%; animation-delay: -.2s; }
.pr-fond i:nth-child(2) { left: 18%; top: 66%; animation-delay: -.9s; }
.pr-fond i:nth-child(3) { left: 31%; top: 28%; animation-delay: -1.6s; }
.pr-fond i:nth-child(4) { left: 45%; top: 72%; animation-delay: -2.3s; }
.pr-fond i:nth-child(5) { left: 59%; top: 24%; animation-delay: -3s; }
.pr-fond i:nth-child(6) { left: 72%; top: 64%; animation-delay: -3.7s; }
.pr-fond i:nth-child(7) { left: 84%; top: 32%; animation-delay: -4.4s; }
.pr-fond i:nth-child(8) { left: 93%; top: 70%; animation-delay: -5.1s; }

/* Les formes de base */
.pr-p-point { width: calc(var(--u, 10px) * .55); height: calc(var(--u, 10px) * .55); border-radius: 50%;
  background: radial-gradient(circle, #fff 0 35%, var(--pr-c, #fff) 36% 60%, transparent 62%); box-shadow: 0 0 calc(var(--u, 10px) * .8) var(--pr-c, #fff); }
.pr-p-etoile { width: calc(var(--u, 10px) * 1.1); height: calc(var(--u, 10px) * 1.1);
  background: radial-gradient(closest-side, #fff, transparent 70%) center / 26% 100% no-repeat, radial-gradient(closest-side, #fff, transparent 70%) center / 100% 26% no-repeat;
  filter: drop-shadow(0 0 calc(var(--u, 10px) * .35) var(--pr-c, #fff)); }

@keyframes prScintille { 0%, 100% { opacity: .15; transform: scale(.55) rotate(0deg); } 45% { opacity: 1; transform: scale(1.1) rotate(45deg); } }
@keyframes prFlotte { 0% { transform: translate(0, 0); opacity: .35; } 25% { transform: translate(calc(var(--u, 10px) * 1.2), calc(var(--u, 10px) * -.8)); opacity: 1; }
  50% { transform: translate(calc(var(--u, 10px) * 2), calc(var(--u, 10px) * .4)); opacity: .55; } 75% { transform: translate(calc(var(--u, 10px) * .6), calc(var(--u, 10px) * 1)); opacity: 1; } 100% { transform: translate(0, 0); opacity: .35; } }
@keyframes prMonte { 0% { transform: translateY(calc(var(--u, 10px) * 3)) scale(.6); opacity: 0; } 20% { opacity: 1; } 100% { transform: translateY(calc(var(--u, 10px) * -4)) scale(1.1); opacity: 0; } }
@keyframes prTourne { to { transform: rotate(360deg); } }
@keyframes prAngle { to { --pr-ang: 360deg; } }
@keyframes prBalaye { 0% { transform: translateX(-120%) skewX(-18deg); } 55%, 100% { transform: translateX(260%) skewX(-18deg); } }
@keyframes prDerive { 0% { background-position: 0% 40%, 100% 60%, 50% 50%; } 100% { background-position: 100% 60%, 0% 40%, 30% 70%; } }
@keyframes prRespire { 0%, 100% { opacity: .55; } 50% { opacity: 1; } }
@keyframes prNova { 0% { transform: translate(-50%, -50%) scale(.35); opacity: 0; } 18% { opacity: 1; } 100% { transform: translate(-50%, -50%) scale(2.3); opacity: 0; } }
@keyframes prOnde { 0% { transform: translate(-50%, -50%) scale(.2); opacity: .95; } 100% { transform: translate(-50%, -50%) scale(4.2); opacity: 0; } }
@keyframes prComete { 0% { transform: translateX(-60%) rotate(-8deg); opacity: 0; } 12% { opacity: 1; } 70% { opacity: 1; } 100% { transform: translateX(520%) rotate(-8deg); opacity: 0; } }
@keyframes prMeteore { 0% { transform: translate(-40%, -160%) rotate(28deg); opacity: 0; } 15% { opacity: 1; } 100% { transform: translate(380%, 260%) rotate(28deg); opacity: 0; } }
@keyframes prFlamme { 0% { transform: scaleY(.78) skewX(-4deg); opacity: .8; } 50% { transform: scaleY(1.08) skewX(3deg); opacity: 1; } 100% { transform: scaleY(.9) skewX(-2deg); opacity: .88; } }
@keyframes prDefile { to { background-position: 200% 0; } }
@keyframes prPulse { 0%, 100% { transform: translate(-50%, -50%) scale(.85); opacity: .65; } 50% { transform: translate(-50%, -50%) scale(1.15); opacity: 1; } }
@keyframes prJet { 0%, 100% { transform: translateY(-50%) scaleX(.55); opacity: .5; } 50% { transform: translateY(-50%) scaleX(1); opacity: 1; } }
@keyframes prTombe { 0% { transform: translateY(calc(var(--u, 10px) * -3)); opacity: 0; } 20% { opacity: 1; } 100% { transform: translateY(calc(var(--u, 10px) * 4)); opacity: 0; } }
@keyframes prBarre { 0% { transform: scaleY(.18); } 100% { transform: scaleY(1); } }
@keyframes prEcg { to { background-position: -200% 0; } }
@keyframes prBat { 0%, 100% { transform: scale(.7); opacity: .6; } 18% { transform: scale(1.25); opacity: 1; } 34% { transform: scale(.9); } 48% { transform: scale(1.15); opacity: 1; } }
@keyframes prEclair { 0%, 92%, 100% { opacity: 0; } 93% { opacity: 1; } 96% { opacity: .2; } 97% { opacity: .9; } }
@keyframes prVague { to { background-position-x: calc(var(--u, 10px) * -16); } }
@keyframes prTremble { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(calc(var(--u, 10px) * -.08)); } 75% { transform: translateX(calc(var(--u, 10px) * .08)); } }
@keyframes prCouronne { 0%, 100% { transform: translate(-50%, 0) rotate(-6deg); } 50% { transform: translate(-50%, calc(var(--u, 10px) * -.35)) rotate(6deg); } }

/* ==================================================================
   LES ASTRES — le fond (14 paliers, du plus discret au plus fou)
   ================================================================== */
/* a1 Étincelle : une lueur chaude et une étincelle */
.pr-fond-a1 { --pr-c: #ffd9a0; background: linear-gradient(90deg, rgba(255, 217, 160, .22), transparent 42%); }
.pr-fond-a1 i { width: calc(var(--u, 10px) * 1.1); height: calc(var(--u, 10px) * 1.1); background: radial-gradient(closest-side, #fff, transparent 70%) center / 26% 100% no-repeat, radial-gradient(closest-side, #fff, transparent 70%) center / 100% 26% no-repeat; animation: prScintille 2.6s ease-in-out infinite; }
/* a2 Luciole : quatre lucioles qui flottent */
.pr-fond-a2 { --pr-c: #c6ff7a; background: linear-gradient(90deg, rgba(198, 255, 122, .2), transparent 55%); }
.pr-fond-a2 i { width: calc(var(--u, 10px) * .5); height: calc(var(--u, 10px) * .5); border-radius: 50%; background: radial-gradient(circle, #fff 0 30%, #c6ff7a 32% 60%, transparent 64%); box-shadow: 0 0 calc(var(--u, 10px) * .9) #b6ff4a; animation: prFlotte 6.5s ease-in-out infinite; }
/* a3 Braise : les braises montent */
.pr-fond-a3 { --pr-c: #ff7a2e; background: linear-gradient(0deg, rgba(255, 90, 20, .34), transparent 62%), linear-gradient(90deg, rgba(255, 122, 46, .22), transparent 48%); }
.pr-fond-a3 i { top: auto !important; bottom: 0; width: calc(var(--u, 10px) * .42); height: calc(var(--u, 10px) * .42); border-radius: 50%; background: #ffb067; box-shadow: 0 0 calc(var(--u, 10px) * .6) #ff6a00; animation: prMonte 2.8s ease-in infinite; }
/* a4 Flamme : des langues de feu sous le pseudo */
.pr-fond-a4 { --pr-c: #ff9a1f; background: linear-gradient(90deg, rgba(255, 110, 20, .42), rgba(255, 170, 40, .16) 40%, transparent 70%); }
.pr-fond-a4 i { top: auto !important; bottom: -20%; width: calc(var(--u, 10px) * 1.6); height: 85%; border-radius: 50% 50% 22% 22% / 64% 64% 36% 36%; transform-origin: 50% 100%;
  background: radial-gradient(ellipse at 50% 85%, #fff6c0 0 14%, #ffc23a 26%, #ff6a10 52%, transparent 72%); opacity: .9; animation: prFlamme 1.1s ease-in-out infinite alternate; }
.pr-fond-a4 i:nth-child(n+5) { display: none; }
/* a5 Comète : une comète traverse la ligne */
.pr-fond-a5 { --pr-c: #7fd4ff; background: linear-gradient(100deg, rgba(20, 60, 130, .55), rgba(10, 20, 50, .2) 60%, transparent), radial-gradient(60% 120% at 8% 50%, rgba(127, 212, 255, .25), transparent 70%); }
.pr-fond-a5 i:nth-child(1) { left: 0; top: 34%; width: 22%; height: calc(var(--u, 10px) * .5); border-radius: 999px; background: linear-gradient(90deg, transparent, rgba(127, 212, 255, .55) 60%, #fff 94%, #dff6ff); filter: drop-shadow(0 0 calc(var(--u, 10px) * .5) #7fd4ff); animation: prComete 3.4s cubic-bezier(.4, 0, .2, 1) infinite; }
.pr-fond-a5 i:nth-child(n+2) { width: calc(var(--u, 10px) * .3); height: calc(var(--u, 10px) * .3); border-radius: 50%; background: #dff6ff; box-shadow: 0 0 calc(var(--u, 10px) * .5) #7fd4ff; animation: prScintille 2.2s ease-in-out infinite; }
.pr-fond-a5 i:nth-child(n+6) { display: none; }
/* a6 Météore : une pluie d'étoiles filantes en diagonale */
.pr-fond-a6 { --pr-c: #b48cff; background: linear-gradient(110deg, rgba(60, 30, 130, .55), rgba(20, 10, 60, .25) 55%, transparent), radial-gradient(40% 90% at 92% 100%, rgba(255, 160, 90, .28), transparent 70%); }
.pr-fond-a6 i { top: 0 !important; width: 16%; height: calc(var(--u, 10px) * .34); border-radius: 999px; background: linear-gradient(90deg, transparent, rgba(180, 140, 255, .6) 55%, #fff); filter: drop-shadow(0 0 calc(var(--u, 10px) * .4) #b48cff); animation: prMeteore 2.7s ease-in infinite; }
.pr-fond-a6 i:nth-child(2) { animation-delay: -.9s; } .pr-fond-a6 i:nth-child(3) { animation-delay: -1.8s; }
.pr-fond-a6 i:nth-child(n+4) { display: none; }
/* a7 Étoile : l'or, un éclat d'étoile qui tourne derrière la photo, un reflet qui balaie */
.pr-fond-a7 { --pr-c: #ffd34d; background: linear-gradient(90deg, rgba(255, 211, 77, .45), rgba(255, 180, 40, .14) 50%, transparent 80%); }
.pr-fond-a7 i:nth-child(1) { left: 2%; top: 50%; width: calc(var(--u, 10px) * 9); height: calc(var(--u, 10px) * 9); margin: calc(var(--u, 10px) * -4.5) 0 0 0;
  background: repeating-conic-gradient(from 0deg, rgba(255, 230, 140, .5) 0 8deg, transparent 8deg 30deg); -webkit-mask: radial-gradient(closest-side, #000 25%, transparent 75%); mask: radial-gradient(closest-side, #000 25%, transparent 75%); animation: prTourne 14s linear infinite; }
.pr-fond-a7 i:nth-child(2) { left: 0; top: 0; width: 30%; height: 100%; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .38), transparent); animation: prBalaye 3.6s ease-in-out infinite; }
.pr-fond-a7 i:nth-child(n+3) { width: calc(var(--u, 10px) * .9); height: calc(var(--u, 10px) * .9); background: radial-gradient(closest-side, #fff, transparent 70%) center / 26% 100% no-repeat, radial-gradient(closest-side, #fff, transparent 70%) center / 100% 26% no-repeat; animation: prScintille 2.4s ease-in-out infinite; }
.pr-fond-a7 i:nth-child(n+7) { display: none; }
/* a8 Constellation : des étoiles reliées qui s'allument tour à tour */
.pr-fond-a8 { --pr-c: #9fc3ff; background: linear-gradient(90deg, rgba(25, 40, 95, .7), rgba(15, 25, 70, .35) 60%, transparent),
  url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 40' preserveAspectRatio='none'><polyline points='10,12 38,30 70,14 104,30 136,10 168,26 196,14' fill='none' stroke='%239fc3ff' stroke-opacity='.45' stroke-width='.8' stroke-dasharray='3 2'/></svg>") center / 100% 100% no-repeat; }
.pr-fond-a8 i { width: calc(var(--u, 10px) * .8); height: calc(var(--u, 10px) * .8); background: radial-gradient(closest-side, #fff, transparent 70%) center / 26% 100% no-repeat, radial-gradient(closest-side, #fff, transparent 70%) center / 100% 26% no-repeat; filter: drop-shadow(0 0 calc(var(--u, 10px) * .3) #9fc3ff); animation: prScintille 3.2s ease-in-out infinite; }
/* a9 Nébuleuse : des nuages de couleur qui dérivent, des étoiles */
.pr-fond-a9 { --pr-c: #ff6ad5;
  background: radial-gradient(40% 120% at 20% 50%, rgba(255, 106, 213, .5), transparent 70%), radial-gradient(40% 130% at 75% 40%, rgba(110, 90, 255, .5), transparent 70%), radial-gradient(35% 110% at 50% 80%, rgba(60, 220, 255, .32), transparent 70%), rgba(20, 8, 40, .55);
  background-size: 160% 100%, 160% 100%, 140% 100%; animation: prDerive 9s ease-in-out infinite alternate; }
.pr-fond-a9 i { width: calc(var(--u, 10px) * .4); height: calc(var(--u, 10px) * .4); border-radius: 50%; background: #fff; box-shadow: 0 0 calc(var(--u, 10px) * .5) #ffc4ef; animation: prScintille 2.8s ease-in-out infinite; }
/* a10 Supernova : une explosion de lumière derrière la photo, une onde de choc */
.pr-fond-a10 { --pr-c: #ffb36b; background: radial-gradient(45% 160% at 10% 50%, rgba(255, 179, 107, .55), rgba(255, 80, 60, .2) 55%, transparent 75%), linear-gradient(90deg, rgba(60, 15, 10, .5), transparent 80%); }
.pr-fond-a10 i:nth-child(1) { left: 10%; top: 50%; width: calc(var(--u, 10px) * 6); height: calc(var(--u, 10px) * 6); border-radius: 50%; background: radial-gradient(circle, #fff 0 12%, #ffd58a 24%, rgba(255, 100, 50, .6) 46%, transparent 70%); animation: prNova 2.8s ease-out infinite; }
.pr-fond-a10 i:nth-child(2) { left: 10%; top: 50%; width: calc(var(--u, 10px) * 4); height: calc(var(--u, 10px) * 4); border-radius: 50%; border: calc(var(--u, 10px) * .22) solid rgba(255, 220, 160, .85); animation: prOnde 2.8s ease-out infinite; animation-delay: -.4s; }
.pr-fond-a10 i:nth-child(n+3) { width: calc(var(--u, 10px) * .45); height: calc(var(--u, 10px) * .45); border-radius: 50%; background: #ffe2b8; box-shadow: 0 0 calc(var(--u, 10px) * .5) #ff9a4a; animation: prMonte 2.4s ease-in infinite; }
/* a11 Galaxie : une spirale qui tourne derrière la photo, un champ d'étoiles qui défile */
.pr-fond-a11 { --pr-c: #a98bff; background: linear-gradient(90deg, rgba(40, 20, 90, .75), rgba(20, 10, 55, .45) 60%, rgba(10, 5, 30, .2)),
  radial-gradient(1.4px 1.4px at 10% 30%, #fff, transparent), radial-gradient(1.4px 1.4px at 30% 70%, #fff, transparent), radial-gradient(1.2px 1.2px at 52% 22%, #fff, transparent), radial-gradient(1.4px 1.4px at 70% 64%, #fff, transparent), radial-gradient(1.2px 1.2px at 88% 30%, #fff, transparent);
  background-size: 100% 100%, 40% 100%, 40% 100%, 40% 100%, 40% 100%, 40% 100%; animation: prDefile 22s linear infinite; }
.pr-fond-a11 i:nth-child(1) { left: 1%; top: 50%; width: calc(var(--u, 10px) * 10); height: calc(var(--u, 10px) * 10); margin-top: calc(var(--u, 10px) * -5);
  background: conic-gradient(from 0deg, transparent 0 8%, rgba(190, 150, 255, .65) 14%, transparent 24% 40%, rgba(120, 200, 255, .55) 48%, transparent 58% 74%, rgba(255, 150, 230, .5) 82%, transparent 92%);
  -webkit-mask: radial-gradient(closest-side, #000 12%, transparent 72%); mask: radial-gradient(closest-side, #000 12%, transparent 72%); animation: prTourne 9s linear infinite; }
.pr-fond-a11 i:nth-child(n+2) { width: calc(var(--u, 10px) * .5); height: calc(var(--u, 10px) * .5); border-radius: 50%; background: #e9dcff; box-shadow: 0 0 calc(var(--u, 10px) * .6) #a98bff; animation: prScintille 3s ease-in-out infinite; }
.pr-fond-a11 i:nth-child(n+6) { display: none; }
/* a12 Quasar : un cœur blanc qui bat, deux jets de lumière le long de la ligne */
.pr-fond-a12 { --pr-c: #6ff2ff; background: linear-gradient(90deg, rgba(0, 30, 60, .8), rgba(0, 60, 90, .35) 55%, rgba(0, 20, 40, .2)); }
.pr-fond-a12 i:nth-child(1) { left: 11%; top: 50%; width: calc(var(--u, 10px) * 4.2); height: calc(var(--u, 10px) * 4.2); border-radius: 50%; background: radial-gradient(circle, #fff 0 18%, #b8fbff 30%, rgba(111, 242, 255, .45) 52%, transparent 72%); animation: prPulse 1.6s ease-in-out infinite; }
.pr-fond-a12 i:nth-child(2) { left: 11%; top: 50%; width: 88%; height: calc(var(--u, 10px) * .55); transform-origin: 0 50%; background: linear-gradient(90deg, #fff, rgba(111, 242, 255, .8) 20%, rgba(111, 242, 255, .25) 70%, transparent); filter: drop-shadow(0 0 calc(var(--u, 10px) * .6) #6ff2ff); animation: prJet 1.6s ease-in-out infinite; }
.pr-fond-a12 i:nth-child(3) { left: 0; top: 50%; width: 11%; height: calc(var(--u, 10px) * .55); transform-origin: 100% 50%; background: linear-gradient(270deg, #fff, rgba(111, 242, 255, .6) 40%, transparent); animation: prJet 1.6s ease-in-out infinite; }
.pr-fond-a12 i:nth-child(n+4) { width: calc(var(--u, 10px) * .35); height: calc(var(--u, 10px) * .35); border-radius: 50%; background: #dffcff; animation: prScintille 2s ease-in-out infinite; }
/* a13 Pulsar : des anneaux qui partent de la photo, au rythme d'un phare */
.pr-fond-a13 { --pr-c: #ff4fd8; background: linear-gradient(90deg, rgba(60, 0, 60, .8), rgba(0, 60, 90, .45) 60%, rgba(30, 0, 40, .25)); }
.pr-fond-a13 i:nth-child(-n+3) { left: 11%; top: 50%; width: calc(var(--u, 10px) * 3.2); height: calc(var(--u, 10px) * 3.2); border-radius: 50%; border: calc(var(--u, 10px) * .2) solid #ff8fe6; box-shadow: 0 0 calc(var(--u, 10px) * .6) #ff4fd8, inset 0 0 calc(var(--u, 10px) * .6) #6ff2ff; animation: prOnde 2.4s ease-out infinite; }
.pr-fond-a13 i:nth-child(2) { animation-delay: -.8s; border-color: #8ff6ff; } .pr-fond-a13 i:nth-child(3) { animation-delay: -1.6s; }
.pr-fond-a13 i:nth-child(n+4) { width: calc(var(--u, 10px) * .4); height: calc(var(--u, 10px) * .4); border-radius: 50%; background: #ffd6f6; box-shadow: 0 0 calc(var(--u, 10px) * .5) #ff4fd8; animation: prScintille 2.2s ease-in-out infinite; }
/* a14 Big Bang : tout l'univers à la fois */
.pr-fond-a14 { --pr-c: #ffe066;
  background: linear-gradient(100deg, rgba(255, 224, 102, .55), rgba(255, 79, 216, .45), rgba(111, 242, 255, .45), rgba(169, 139, 255, .5), rgba(255, 224, 102, .55)); background-size: 300% 100%; animation: prDefile 7s linear infinite; }
.pr-fond-a14 i:nth-child(1) { left: 1%; top: 50%; width: calc(var(--u, 10px) * 12); height: calc(var(--u, 10px) * 12); margin-top: calc(var(--u, 10px) * -6);
  background: repeating-conic-gradient(from 0deg, rgba(255, 255, 255, .55) 0 6deg, transparent 6deg 24deg); -webkit-mask: radial-gradient(closest-side, #000 20%, transparent 74%); mask: radial-gradient(closest-side, #000 20%, transparent 74%); animation: prTourne 10s linear infinite; }
.pr-fond-a14 i:nth-child(2) { left: 11%; top: 50%; width: calc(var(--u, 10px) * 5); height: calc(var(--u, 10px) * 5); border-radius: 50%; background: radial-gradient(circle, #fff 0 16%, #fff1a8 28%, rgba(255, 120, 220, .5) 50%, transparent 72%); animation: prNova 2.4s ease-out infinite; }
.pr-fond-a14 i:nth-child(3) { left: 0; top: 0; width: 26%; height: 100%; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .5), transparent); animation: prBalaye 2.8s ease-in-out infinite; }
.pr-fond-a14 i:nth-child(n+4) { width: calc(var(--u, 10px) * .55); height: calc(var(--u, 10px) * .55); border-radius: 50%; background: radial-gradient(circle, #fff 0 35%, #ffe066 40% 62%, transparent 66%); box-shadow: 0 0 calc(var(--u, 10px) * .8) #ffd000; animation: prMonte 2.2s ease-in infinite; }

/* ==================================================================
   LA COUR — le fond des VIP sans astres (13 rangs : le velours, puis l'or)
   ================================================================== */
.pr-fond-c1 { --pr-c: #dfe6ef; background: linear-gradient(90deg, rgba(200, 210, 225, .26), transparent 60%); }
.pr-fond-c2 { --pr-c: #9cc2ff; background: linear-gradient(90deg, rgba(70, 110, 170, .45), rgba(40, 60, 100, .18) 60%, transparent); }
.pr-fond-c3 { --pr-c: #e3a065; background: linear-gradient(90deg, rgba(160, 95, 40, .5), rgba(90, 50, 20, .2) 60%, transparent); }
.pr-fond-c4 { --pr-c: #4fe3a0; background: linear-gradient(90deg, rgba(10, 110, 70, .6), rgba(5, 60, 40, .25) 60%, transparent),
  repeating-linear-gradient(45deg, rgba(255, 215, 110, .08) 0 2px, transparent 2px 14px); }
.pr-fond-c5 { --pr-c: #6fa8ff;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 28 28'><path d='M14 4c2 4 2 6 0 10-2-4-2-6 0-10zM4 14c4-2 6-2 10 0-4 2-6 2-10 0zM24 14c-4 2-6 2-10 0 4-2 6-2 10 0zM14 24c-2-4-2-6 0-10 2 4 2 6 0 10z' fill='%23ffd76a' fill-opacity='.16'/></svg>") 0 0 / calc(var(--u, 10px) * 2.8) calc(var(--u, 10px) * 2.8), linear-gradient(90deg, rgba(20, 50, 140, .7), rgba(10, 25, 80, .3) 65%, transparent);
  animation: prDefile 30s linear infinite; }
.pr-fond-c6 { --pr-c: #ff5a7a; background: linear-gradient(90deg, rgba(140, 10, 40, .7), rgba(80, 5, 25, .3) 65%, transparent),
  radial-gradient(30% 140% at 0% 50%, rgba(255, 215, 110, .3), transparent 70%); }
.pr-fond-c7, .pr-fond-c8 { background: linear-gradient(90deg, rgba(90, 20, 140, .75), rgba(50, 10, 90, .35) 65%, transparent); }
.pr-fond-c7 { --pr-c: #c98bff; } .pr-fond-c8 { --pr-c: #ffd76a; }
/* Le laurier d'or qui tourne autour de la photo (Duc et au-dessus) */
.pr-fond-c7 i:nth-child(1), .pr-fond-c8 i:nth-child(1), .pr-fond-c9 i:nth-child(1), .pr-fond-c10 i:nth-child(1) {
  left: 11%; top: 50%; width: calc(var(--u, 10px) * 6.4); height: calc(var(--u, 10px) * 6.4); margin: calc(var(--u, 10px) * -3.2) 0 0 calc(var(--u, 10px) * -3.2);
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><g fill='%23ffd76a'><ellipse cx='32' cy='5' rx='2.6' ry='4.4'/><ellipse cx='50' cy='12' rx='2.6' ry='4.4' transform='rotate(45 50 12)'/><ellipse cx='59' cy='32' rx='2.6' ry='4.4' transform='rotate(90 59 32)'/><ellipse cx='50' cy='52' rx='2.6' ry='4.4' transform='rotate(135 50 52)'/><ellipse cx='32' cy='59' rx='2.6' ry='4.4'/><ellipse cx='14' cy='52' rx='2.6' ry='4.4' transform='rotate(45 14 52)'/><ellipse cx='5' cy='32' rx='2.6' ry='4.4' transform='rotate(90 5 32)'/><ellipse cx='14' cy='12' rx='2.6' ry='4.4' transform='rotate(135 14 12)'/></g></svg>") center / contain no-repeat;
  filter: drop-shadow(0 0 calc(var(--u, 10px) * .3) rgba(255, 215, 106, .8)); animation: prTourne 12s linear infinite; }
/* La poudre d'or qui tombe (Archiduc et au-dessus) */
.pr-fond-c8 i:nth-child(n+2), .pr-fond-c10 i:nth-child(n+2), .pr-fond-c11 i:nth-child(n+2), .pr-fond-c12 i:nth-child(n+2), .pr-fond-c13 i:nth-child(n+2) {
  top: 0 !important; width: calc(var(--u, 10px) * .32); height: calc(var(--u, 10px) * .32); border-radius: 50%; background: #ffe9a6; box-shadow: 0 0 calc(var(--u, 10px) * .45) #ffc400; animation: prTombe 2.6s linear infinite; }
.pr-fond-c9 { --pr-c: #fff1c2; background: linear-gradient(115deg, rgba(255, 255, 255, .42), rgba(255, 236, 190, .28) 30%, rgba(255, 215, 106, .2) 60%, transparent),
  repeating-linear-gradient(160deg, rgba(160, 130, 80, .12) 0 1px, transparent 1px 9px); }
.pr-fond-c9 i:nth-child(2) { left: 0; top: 0; width: 28%; height: 100%; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .5), transparent); animation: prBalaye 4s ease-in-out infinite; }
.pr-fond-c9 i:nth-child(n+3) { display: none; }
.pr-fond-c10 { --pr-c: #ffd000; background: radial-gradient(40% 150% at 11% 50%, rgba(255, 210, 60, .55), transparent 70%), linear-gradient(90deg, rgba(120, 10, 20, .75), rgba(70, 5, 10, .35) 65%, transparent); }
.pr-fond-c11 { --pr-c: #ff7a3a; background: radial-gradient(42% 160% at 11% 50%, rgba(255, 200, 80, .6), rgba(255, 90, 30, .25) 50%, transparent 72%), linear-gradient(90deg, rgba(150, 20, 10, .8), rgba(90, 10, 5, .35) 70%, transparent); }
.pr-fond-c11 i:nth-child(1) { left: 1%; top: 50%; width: calc(var(--u, 10px) * 9); height: calc(var(--u, 10px) * 9); margin-top: calc(var(--u, 10px) * -4.5);
  background: repeating-conic-gradient(from 0deg, rgba(255, 220, 120, .55) 0 10deg, transparent 10deg 20deg); -webkit-mask: radial-gradient(closest-side, transparent 30%, #000 32% 48%, transparent 70%); mask: radial-gradient(closest-side, transparent 30%, #000 32% 48%, transparent 70%); animation: prTourne 16s linear infinite; }
.pr-fond-c12 { --pr-c: #ffe066; background: linear-gradient(100deg, rgba(255, 224, 102, .5), rgba(255, 120, 200, .35), rgba(120, 220, 255, .35), rgba(255, 224, 102, .5)); background-size: 260% 100%; animation: prDefile 9s linear infinite; }
.pr-fond-c13 { --pr-c: #b6fff0;
  background: radial-gradient(40% 130% at 20% 40%, rgba(80, 255, 200, .45), transparent 70%), radial-gradient(40% 130% at 70% 60%, rgba(150, 100, 255, .45), transparent 70%), radial-gradient(30% 110% at 45% 80%, rgba(255, 120, 220, .3), transparent 70%), rgba(10, 15, 40, .55);
  background-size: 170% 100%, 170% 100%, 150% 100%; animation: prDerive 8s ease-in-out infinite alternate; }

/* LE RYTHME SEUL (ni astre ni couronne) : la couleur de son rythme qui monte de la droite, et qui respire */
.pr-fond-r { background: linear-gradient(270deg, var(--pr-rf, rgba(46, 230, 200, .3)), transparent 70%); animation: prRespire 2.4s ease-in-out infinite; }
.pr-fond-r1, .pr-fond-r2, .pr-fond-r3 { --pr-rf: rgba(46, 230, 200, .22); } .pr-fond-r4, .pr-fond-r5 { --pr-rf: rgba(46, 155, 255, .3); }
.pr-fond-r6, .pr-fond-r7 { --pr-rf: rgba(255, 138, 58, .32); } .pr-fond-r8, .pr-fond-r9 { --pr-rf: rgba(111, 139, 255, .38); }
.pr-fond-r10, .pr-fond-r11 { --pr-rf: rgba(0, 212, 230, .42); } .pr-fond-r12 { --pr-rf: rgba(255, 79, 216, .45); }

/* ==================================================================
   LA COUR — le cadre (anneau de couleur sur le bord de la ligne)
   ================================================================== */
.pr-cadre-c1 { background: linear-gradient(90deg, #f4f7fb, #9aa7b8, #f4f7fb); }
.pr-cadre-c2 { background: linear-gradient(90deg, #cfe2ff, #4f7bc0, #cfe2ff); }
.pr-cadre-c3 { background: linear-gradient(90deg, #ffd2a6, #b06a2c, #ffd2a6); }
.pr-cadre-c4 { background: linear-gradient(90deg, #ffe08a, #1aa36b 30%, #ffe08a 50%, #1aa36b 70%, #ffe08a); }
.pr-cadre-c5 { background: linear-gradient(90deg, #ffe08a, #2a5bd7 30%, #ffe08a 50%, #2a5bd7 70%, #ffe08a); }
.pr-cadre-c6 { background: linear-gradient(90deg, #ffe08a, #c2163c 30%, #ffe08a 50%, #c2163c 70%, #ffe08a); }
.pr-cadre-c1, .pr-cadre-c2, .pr-cadre-c3, .pr-cadre-c4, .pr-cadre-c5, .pr-cadre-c6 { background-size: 220% 100%; animation: prDefile 6s linear infinite; }
.pr-cadre-c7, .pr-cadre-c8, .pr-cadre-c9, .pr-cadre-c10, .pr-cadre-c11 { background: conic-gradient(from var(--pr-ang), #ffd76a, #fff6cf, #b8860b, #ffd76a, #7a3cff, #ffd76a); animation: prAngle 5s linear infinite; }
.pr-cadre-c9 { background: conic-gradient(from var(--pr-ang), #fff, #ffe9a6, #ffffff, #e8d5a0, #fff); }
.pr-cadre-c10 { animation-duration: 3.6s; padding: calc(var(--u, 10px) * .32); }
.pr-cadre-c11 { background: conic-gradient(from var(--pr-ang), #ffd000, #ff5a1f, #fff1a8, #ff2b2b, #ffd000); animation-duration: 3.2s; padding: calc(var(--u, 10px) * .34); }
.pr-cadre-c12, .pr-cadre-c13 { background: conic-gradient(from var(--pr-ang), #ff4fd8, #ffe066, #6ff2ff, #a98bff, #4fffb0, #ff4fd8); animation: prAngle 3s linear infinite; padding: calc(var(--u, 10px) * .36); }
.pr-cadre-c13 { filter: drop-shadow(0 0 calc(var(--u, 10px) * .5) rgba(182, 255, 240, .7)); }
/* Les astres hauts portent aussi un cadre quand il n'y a pas de VIP */
.pr-cadre-a5, .pr-cadre-a6 { background: linear-gradient(90deg, transparent, var(--pr-cc, #7fd4ff), transparent); background-size: 200% 100%; animation: prDefile 3s linear infinite; }
.pr-cadre-a5 { --pr-cc: #7fd4ff; } .pr-cadre-a6 { --pr-cc: #b48cff; }
.pr-cadre-a7, .pr-cadre-a8 { background: linear-gradient(90deg, #ffd34d, #fff3c4, #c99a00, #ffd34d); background-size: 220% 100%; animation: prDefile 4s linear infinite; }
.pr-cadre-a8 { background: linear-gradient(90deg, #9fc3ff, #ffffff, #5a7fd6, #9fc3ff); background-size: 220% 100%; }
.pr-cadre-a9, .pr-cadre-a10, .pr-cadre-a11 { background: conic-gradient(from var(--pr-ang), var(--pr-c1, #ff6ad5), var(--pr-c2, #6e5aff), var(--pr-c3, #3cdcff), var(--pr-c1, #ff6ad5)); animation: prAngle 4.5s linear infinite; }
.pr-cadre-a10 { --pr-c1: #ffb36b; --pr-c2: #ff4f3a; --pr-c3: #fff1c4; }
.pr-cadre-a11 { --pr-c1: #a98bff; --pr-c2: #6fc8ff; --pr-c3: #ff8fe6; }
.pr-cadre-a12, .pr-cadre-a13, .pr-cadre-a14 { background: conic-gradient(from var(--pr-ang), #6ff2ff, #ffffff, #ff4fd8, #ffe066, #6ff2ff); animation: prAngle 2.8s linear infinite; padding: calc(var(--u, 10px) * .34); }
.pr-cadre-a14 { padding: calc(var(--u, 10px) * .4); filter: drop-shadow(0 0 calc(var(--u, 10px) * .6) rgba(255, 224, 102, .8)); }

/* ==================================================================
   LE RYTHME — la bande du bas (12 paliers : un battement, puis l'orchestre)
   ================================================================== */
.pr-rythme { display: flex; align-items: flex-end; justify-content: space-evenly; }
.pr-rythme i.pr-b { position: relative; flex: 0 0 auto; width: 5%; max-width: calc(var(--u, 10px) * .7); height: 100%; border-radius: calc(var(--u, 10px) * .2) calc(var(--u, 10px) * .2) 0 0;
  transform-origin: 50% 100%; background: linear-gradient(0deg, var(--pr-b1, #2ee6c8), var(--pr-b2, #b6fff2)); box-shadow: 0 0 calc(var(--u, 10px) * .45) var(--pr-b1, #2ee6c8); animation: prBarre .52s ease-in-out infinite alternate; }
.pr-rythme i.pr-b:nth-child(2n) { animation-duration: .44s; animation-delay: -.2s; }
.pr-rythme i.pr-b:nth-child(3n) { animation-duration: .61s; animation-delay: -.33s; }
.pr-rythme i.pr-b:nth-child(5n) { animation-duration: .48s; animation-delay: -.1s; }
.pr-rythme i.pr-b:nth-child(7n) { animation-duration: .67s; animation-delay: -.45s; }
/* r1 Battement : un cœur de lumière qui bat au bout de la ligne */
.pr-rythme-r1 { justify-content: flex-end; }
.pr-rythme-r1 i { position: relative; width: calc(var(--u, 10px) * .9); height: calc(var(--u, 10px) * .9); margin: 0 4% 18% 0; border-radius: 50%; background: radial-gradient(circle, #fff 0 25%, #2ee6c8 40%, transparent 70%); animation: prBat 1.15s ease-in-out infinite; }
/* r2 Pouls : un tracé de cardiogramme qui défile */
.pr-rythme-r2 i { position: absolute; inset: 0; background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 20' preserveAspectRatio='none'><polyline points='0,14 30,14 36,14 40,4 44,19 48,10 52,14 100,14' fill='none' stroke='%232ee6c8' stroke-width='1.6'/></svg>") 0 50% / 50% 100% repeat-x; animation: prEcg 2.2s linear infinite; }
.pr-rythme-r3 { --pr-b1: #1fbfa8; --pr-b2: #9ffff0; }
.pr-rythme-r4 { --pr-b1: #1fbf6a; --pr-b2: #b8ffb0; }
.pr-rythme-r5 { --pr-b1: #2e9bff; --pr-b2: #c7ecff; }
.pr-rythme-r6 i.pr-b:nth-child(1) { --pr-b1: #ff4f6a; } .pr-rythme-r6 i.pr-b:nth-child(2) { --pr-b1: #ff8a3a; } .pr-rythme-r6 i.pr-b:nth-child(3) { --pr-b1: #ffd23a; }
.pr-rythme-r6 i.pr-b:nth-child(4) { --pr-b1: #8be34a; } .pr-rythme-r6 i.pr-b:nth-child(5) { --pr-b1: #2ee6c8; } .pr-rythme-r6 i.pr-b:nth-child(6) { --pr-b1: #2e9bff; }
.pr-rythme-r6 i.pr-b:nth-child(7) { --pr-b1: #8a5bff; } .pr-rythme-r6 i.pr-b:nth-child(8) { --pr-b1: #ff4fd8; } .pr-rythme-r6 i.pr-b:nth-child(9) { --pr-b1: #ff4f6a; } .pr-rythme-r6 i.pr-b:nth-child(10) { --pr-b1: #ffd23a; }
.pr-rythme-r6 i.pr-b { --pr-b2: #fff; }
.pr-rythme-r7 { --pr-b1: #c0392b; --pr-b2: #ffb199; }
.pr-rythme-r8 { --pr-b1: #2e6bff; --pr-b2: #e6f2ff; }
.pr-rythme-r9 { --pr-b1: #c27a1a; --pr-b2: #ffe0a6; }
.pr-rythme-r10 { --pr-b1: #00a3b8; --pr-b2: #b6fbff; }
.pr-rythme-r11 { --pr-b1: #7a8aa6; --pr-b2: #e6fbff; }
.pr-rythme-r12 { --pr-b1: #ff4fd8; --pr-b2: #ffe066; }
/* Les ondes de basse (Tambour, Grondement, Cataclysme) : elles partent de la photo, sur toute la ligne */
.pr-rythme i.pr-onde { position: absolute; left: -19%; top: 0; width: calc(var(--u, 10px) * 3); height: calc(var(--u, 10px) * 3); border-radius: 50%; border: calc(var(--u, 10px) * .18) solid var(--pr-b2, #c7ecff); animation: prOnde 1.8s ease-out infinite; }
.pr-rythme i.pr-onde + i.pr-onde { animation-delay: -.9s; }
/* L'éclair (Tonnerre, Cataclysme) : UN éclair toutes les 3 s, jamais un stroboscope */
.pr-rythme i.pr-eclair { position: absolute; inset: 0; background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 20' preserveAspectRatio='none'><polyline points='0,4 18,9 30,3 46,12 60,6 74,15 88,8 100,12' fill='none' stroke='%23e6f2ff' stroke-width='1.2'/></svg>") center / 100% 100% no-repeat; filter: drop-shadow(0 0 3px #7fb2ff); opacity: 0; animation: prEclair 3s linear infinite; }
/* Les fissures (Séisme) : la ligne tremble à peine, des failles respirent */
.pr-ligne.pr-r9 > .rg, .pr-ligne.pr-r12 > .rg { animation: prTremble .6s ease-in-out infinite; }
.pr-rythme i.pr-faille { position: absolute; inset: 0; background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 20' preserveAspectRatio='none'><path d='M0 18 L14 12 L20 16 L34 8 L40 13 L56 5 L64 11 L80 4 L100 9' fill='none' stroke='%23ffcf6a' stroke-width='.9'/></svg>") center / 100% 100% no-repeat; animation: prRespire 2.2s ease-in-out infinite; }
/* La vague (Tsunami, Cataclysme) */
.pr-rythme i.pr-vague { position: absolute; left: 0; right: 0; bottom: 0; height: 100%; background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 20' preserveAspectRatio='none'><path d='M0 12 Q10 4 20 12 T40 12 V20 H0 Z' fill='%2300d4e6' fill-opacity='.55'/></svg>") 0 100% / calc(var(--u, 10px) * 16) 100% repeat-x; animation: prVague 2.6s linear infinite; }
/* Le tourbillon (Ouragan, Cataclysme) */
.pr-rythme i.pr-spirale { position: absolute; left: -22%; top: -60%; width: calc(var(--u, 10px) * 5); height: calc(var(--u, 10px) * 5); background: conic-gradient(from 0deg, transparent, rgba(220, 245, 255, .6), transparent 40%, rgba(220, 245, 255, .45), transparent 80%); border-radius: 50%; -webkit-mask: radial-gradient(closest-side, transparent 22%, #000 26% 70%, transparent 74%); mask: radial-gradient(closest-side, transparent 22%, #000 26% 70%, transparent 74%); animation: prTourne 1.8s linear infinite; }

/* ==================================================================
   LES EMBLÈMES (à côté du pseudo) — la couronne et son niveau, l'astre, le rythme
   ================================================================== */
.pr-embs { display: inline-flex; align-items: center; gap: calc(var(--u, 10px) * .3); flex: 0 0 auto; margin-left: calc(var(--u, 10px) * .3); position: relative; z-index: 2; }
.pr-e { position: relative; display: inline-grid; place-items: center; min-width: calc(var(--u, 10px) * 2.2); height: calc(var(--u, 10px) * 2.2); padding: 0 calc(var(--u, 10px) * .35);
  border-radius: 999px; font: 900 calc(var(--u, 10px) * 1.25) / 1 "Archivo", system-ui, sans-serif; font-style: normal; color: #1a1300; box-shadow: 0 0 calc(var(--u, 10px) * .6) var(--pr-g, rgba(255, 255, 255, .4)); }
.pr-e s { text-decoration: none; font-size: calc(var(--u, 10px) * 1.4); line-height: 1; }
.pr-e small { font-size: calc(var(--u, 10px) * 1.05); margin-left: calc(var(--u, 10px) * .12); }
.pr-e-c { display: inline-flex; gap: calc(var(--u, 10px) * .1); background: linear-gradient(180deg, #fff7d6, #ffcc33 55%, #c48a00); --pr-g: rgba(255, 204, 51, .8); }
.pr-e-c1, .pr-e-c2 { background: linear-gradient(180deg, #ffffff, #c9d3e0 55%, #8592a6); --pr-g: rgba(200, 215, 235, .7); }
.pr-e-c3 { background: linear-gradient(180deg, #ffe0c2, #d48a4a 55%, #8a4a14); --pr-g: rgba(212, 138, 74, .7); }
.pr-e-c4 { background: linear-gradient(180deg, #d6ffe9, #36d48a 55%, #0d7a4a); }
.pr-e-c5 { background: linear-gradient(180deg, #dbe8ff, #4f8bff 55%, #1d3fa6); color: #fff; }
.pr-e-c6 { background: linear-gradient(180deg, #ffd6de, #ff3d64 55%, #9a0f2c); color: #fff; }
.pr-e-c7, .pr-e-c8 { background: linear-gradient(180deg, #f0dcff, #a35bff 55%, #5a1fb0); color: #ffe9a6; }
.pr-e-c9, .pr-e-c10, .pr-e-c11 { background: linear-gradient(180deg, #fffbe6, #ffd23a 50%, #b07800); animation: prRespire 2.2s ease-in-out infinite; }
.pr-e-c12, .pr-e-c13 { background: conic-gradient(from var(--pr-ang), #ff4fd8, #ffe066, #6ff2ff, #a98bff, #ff4fd8); animation: prAngle 3s linear infinite; color: #fff; text-shadow: 0 1px 2px rgba(0, 0, 0, .6); }
.pr-e-a { width: calc(var(--u, 10px) * 2.2); padding: 0; color: #fff; background: radial-gradient(circle at 35% 30%, #fff, var(--pr-c, #ffd9a0) 45%, rgba(0, 0, 0, .25) 100%); }
.pr-e-a s { color: #fff; text-shadow: 0 0 calc(var(--u, 10px) * .4) #fff; }
.pr-e-a1 { --pr-c: #ffd9a0; } .pr-e-a2 { --pr-c: #b6ff4a; } .pr-e-a3 { --pr-c: #ff7a2e; } .pr-e-a4 { --pr-c: #ff9a1f; } .pr-e-a5 { --pr-c: #4fbfff; }
.pr-e-a6 { --pr-c: #9c6bff; } .pr-e-a7 { --pr-c: #ffc400; } .pr-e-a8 { --pr-c: #6f9cff; } .pr-e-a9 { --pr-c: #ff4fc8; } .pr-e-a10 { --pr-c: #ff8a3a; }
.pr-e-a11 { --pr-c: #8a5bff; } .pr-e-a12 { --pr-c: #2ee6ff; } .pr-e-a13 { --pr-c: #ff2bd0; }
.pr-e-a14 { background: conic-gradient(from var(--pr-ang), #ffe066, #ff4fd8, #6ff2ff, #a98bff, #ffe066); animation: prAngle 2.6s linear infinite; }
.pr-e-a9 s, .pr-e-a10 s, .pr-e-a11 s, .pr-e-a12 s, .pr-e-a13 s, .pr-e-a14 s { display: inline-block; animation: prTourne 6s linear infinite; }
.pr-e-r { width: calc(var(--u, 10px) * 2.2); padding: 0; color: #003a33; background: radial-gradient(circle at 35% 30%, #fff, var(--pr-c, #2ee6c8) 55%, rgba(0, 0, 0, .25)); }
.pr-e-r s { display: inline-block; animation: prBat 1.15s ease-in-out infinite; }
.pr-e-r1, .pr-e-r2, .pr-e-r3 { --pr-c: #2ee6c8; } .pr-e-r4, .pr-e-r5 { --pr-c: #2e9bff; } .pr-e-r6, .pr-e-r7 { --pr-c: #ff8a3a; }
.pr-e-r8, .pr-e-r9 { --pr-c: #6f8bff; } .pr-e-r10, .pr-e-r11 { --pr-c: #00d4e6; } .pr-e-r12 { --pr-c: #ff4fd8; }

/* ==================================================================
   La place : les classements denses gardent l'essentiel
   ================================================================== */
.sp2-classement.dense .pr-rythme i.pr-b:nth-child(n+7) { display: none; }
.sp2-classement.dense .pr-e { min-width: calc(var(--u, 10px) * 1.7); height: calc(var(--u, 10px) * 1.7); }
.sp2-classement.dense .pr-e small { display: none; }
.sp2-classement.trois .pr-e-a, .sp2-classement.trois .pr-e-r { display: none; }
.sp2-classement.trois .pr-rythme { display: none; }
.sp2-classement.trois .pr-fond i:nth-child(n+4) { display: none; }
/* Le petit classement du coin : une ligne basse, pas de bande de rythme sur les plus petits écrans */
.row.pr-ligne .pr-rythme { left: 30%; height: 24%; }
.row.pr-ligne .pr-e { min-width: calc(var(--u, 10px) * 1.9); height: calc(var(--u, 10px) * 1.9); }

/* Écran chargé, mouvement réduit : l'habit reste, il ne bouge plus */
.pr-calme .pr-fond, .pr-calme .pr-fond i, .pr-calme .pr-cadre, .pr-calme .pr-rythme i, .pr-calme .pr-e, .pr-calme .pr-e s, .pr-calme .pr-ligne > .rg { animation: none !important; }
.pr-calme .pr-fond i:nth-child(n+3), .pr-calme .pr-rythme i.pr-onde, .pr-calme .pr-rythme i.pr-eclair { display: none; }
@media (prefers-reduced-motion: reduce) {
  .pr-fond, .pr-fond i, .pr-cadre, .pr-rythme i, .pr-e, .pr-e s, .pr-ligne > .rg { animation: none !important; }
  .pr-rythme i.pr-eclair { display: none; }
}

/* Le podium final : les emblèmes sous le nom, un cran plus grands */
#podium .marche .pr-embs { margin: calc(var(--u, 10px) * .3) 0 0; justify-content: center; }
#podium .marche .pr-e { min-width: calc(var(--u, 10px) * 2.8); height: calc(var(--u, 10px) * 2.8); }
#podium .marche .pr-e s { font-size: calc(var(--u, 10px) * 1.8); }
#podium .marche .pr-e small { font-size: calc(var(--u, 10px) * 1.3); }
/* La grille sous le podium : des tuiles basses, pas de bande de rythme */
#podium .reste .t.pr-ligne .pr-rythme { display: none; }
#podium .reste .t .pr-e { min-width: calc(var(--u, 10px) * 1.8); height: calc(var(--u, 10px) * 1.8); }
#podium .reste .t .pr-e small { display: none; }
/* La grille : la couronne seulement (le fond et le cadre disent déjà le reste) — le pseudo d'abord */
#podium .reste .t .pr-e-a, #podium .reste .t .pr-e-r { display: none; }