/* ---------- Bilan & fête finale ---------- */
#end .sheet{max-width:780px;padding:0;overflow:hidden;background:var(--mist)}
.endTop{padding:34px 38px 26px}
#end .eyebrow{font-family:var(--serif);font-style:italic;color:#5c6a54;font-size:18px;margin:0}
#final{font-size:60px;font-family:var(--serif);font-weight:600;line-height:1;margin:6px 0 2px}
#final span{font-size:24px;color:#6b7663}
#level{font-family:var(--serif);font-size:30px;margin:14px 0 6px}
#levelTxt{font-size:17px;line-height:1.5;margin:0 0 22px;color:#3d4a38}
#breakdown{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
#breakdown div{background:var(--paper);border-radius:14px;padding:15px}
#breakdown b{display:block;font-family:var(--serif);font-size:34px;line-height:1}
#breakdown span{font-size:14px;color:#4a5842}

.party{position:relative;overflow:hidden;color:#fdf7e6;padding:36px 38px 0;
  background:radial-gradient(120% 70% at 50% 0%,#3d6130 0%,#1b2d15 55%,#0e180b 100%)}
.kicker{position:relative;font-family:var(--serif);font-style:italic;font-size:21px;color:#ffd37a;margin:0 0 6px}
.party .lead{position:relative;font-family:var(--serif);font-size:19px;line-height:1.5;margin:0 0 24px;color:#e9efd9}

.dateRow{position:relative;display:flex;align-items:center;gap:28px;padding:24px 26px;border-radius:24px;
  background:rgba(255,255,255,.06);
  border:1.5px solid rgba(255,211,122,.45);box-shadow:0 0 50px rgba(255,184,48,.2),inset 0 0 40px rgba(255,184,48,.12)}
.party.pop .dateRow{animation:popIn .9s cubic-bezier(.2,1.6,.4,1) both}
@keyframes popIn{0%{transform:scale(.7) rotate(-3deg);opacity:0}100%{transform:none;opacity:1}}

.cal{flex:none;width:122px;background:#fffdf4;border-radius:14px;overflow:visible;position:relative;color:#2a1d10;text-align:center;
  box-shadow:0 14px 26px rgba(0,0,0,.5);transform-origin:50% -8px;animation:swing 2.4s ease-in-out infinite}
@keyframes swing{0%,100%{transform:rotate(-7deg)}50%{transform:rotate(7deg)}}
.calRings{position:absolute;top:-9px;left:0;right:0;display:flex;justify-content:space-around;z-index:2}
.calRings i{width:10px;height:22px;border-radius:5px;background:linear-gradient(90deg,#8a8a8a,#f4f4f4,#8a8a8a);box-shadow:0 2px 3px rgba(0,0,0,.4)}
.calMonth{background:linear-gradient(#ea5a42,#b3301c);color:#fff;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  font-size:14px;padding:18px 0 7px;border-radius:14px 14px 0 0}
.calDay{font-family:var(--serif);font-size:68px;font-weight:700;line-height:1;padding:8px 0 12px;
  background:repeating-linear-gradient(#fffdf4 0 22px,#f1ecdc 22px 23px);border-radius:0 0 14px 14px}

.dateTxt{display:flex;flex-direction:column;min-width:0}
.rdv{font-size:14px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:#cfe3b0}
.bigDate{font-family:var(--serif);font-weight:700;font-size:clamp(44px,8.6vw,80px);line-height:1.04;margin:4px 0 8px;white-space:nowrap}
.bigDate .ch{display:inline-block;color:#ffd37a;animation:jump 1.8s ease-in-out infinite;
  animation-delay:calc(var(--i) * .09s);text-shadow:0 5px 0 rgba(0,0,0,.35)}
.bigDate .sp{display:inline-block;width:.26em}
@keyframes jump{0%,45%,100%{transform:translateY(0) rotate(0)}22%{transform:translateY(-.2em) rotate(-5deg) scale(1.08)}}
.expoName{font-size:19px;font-weight:700;color:#fff}
.venue{margin-top:6px;font-size:16px;font-weight:700;color:#ffd37a}

/* Piste disco : les danseurs entourent la date (3 au-dessus, 3 au-dessous) */
.dancefloor{position:relative;margin:0 -38px;padding:70px 26px 18px;overflow:hidden;
  background:
    radial-gradient(60% 45% at 50% 50%,rgba(255,211,122,.18),transparent 70%),
    linear-gradient(to top,rgba(0,0,0,.35),transparent 40%),
    conic-gradient(#24401f 25%,#35592c 0 50%,#24401f 0 75%,#35592c 0) 0 0/40px 40px}
.dancefloor::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at 50% 50%,rgba(255,197,61,.28),transparent 55%);animation:floorGlow .47s ease-in-out infinite alternate}
@keyframes floorGlow{from{opacity:.35}to{opacity:1}}
/* boule à facettes : sphère argentée quadrillée de miroirs, qui tourne et scintille */
.disco{position:absolute;top:10px;left:50%;width:52px;height:52px;margin-left:-26px;z-index:2}
.disco::before{content:"";position:absolute;left:50%;bottom:100%;width:2px;height:40px;margin-left:-1px;background:#bbb}
.disco::after{content:"";position:absolute;inset:0;border-radius:50%;
  background:
    radial-gradient(circle at 32% 28%,rgba(255,255,255,.95) 0 6%,transparent 16%),
    radial-gradient(circle at 50% 50%,transparent 45%,rgba(0,0,0,.5) 100%),
    repeating-linear-gradient(0deg,rgba(40,48,56,.75) 0 1px,transparent 1px 7px),
    repeating-linear-gradient(90deg,rgba(40,48,56,.75) 0 1px,transparent 1px 7px),
    conic-gradient(#fff,#8d99a6,#e9eef2,#6f7b88,#fff,#aab4be,#fff);
  box-shadow:0 0 22px 4px rgba(255,255,255,.45);animation:discoSpin 1.88s linear infinite}
.sparkle{position:absolute;z-index:2;color:#fff;font-size:14px;line-height:1;pointer-events:none;
  text-shadow:0 0 6px #fff;animation:twinkle 1.2s ease-in-out infinite}
@keyframes twinkle{0%,100%{opacity:0;transform:scale(.4) rotate(0)}50%{opacity:1;transform:scale(1.1) rotate(45deg)}}
@keyframes discoSpin{to{background-position:0 0,0 0,0 0,28px 0,0 0}}

.crew{position:relative;z-index:1;display:flex;justify-content:space-around;align-items:flex-end}
#crewTop{margin-bottom:-6px}
#crewBot{margin-top:10px}
.dancefloor .dateRow{z-index:1;margin:0 auto;max-width:560px;background:rgba(14,24,11,.72);backdrop-filter:blur(3px)}

.dancer{position:relative;width:24%;max-width:112px;transform-origin:50% 100%;cursor:pointer;overflow:visible;
  filter:drop-shadow(0 8px 6px rgba(0,0,0,.45))}
/* chaque danseur a son pas, sur un même tempo (~128 bpm) */
.d0{animation:disco .94s ease-in-out infinite}
.d1{animation:shimmy .47s ease-in-out infinite alternate}
.d2{animation:flip 2.82s cubic-bezier(.3,.7,.4,1) infinite}
.d3{animation:moonwalk 1.88s ease-in-out infinite}
.d4{animation:groove .94s ease-in-out infinite}
.d5{animation:spin 1.88s cubic-bezier(.5,0,.3,1) infinite}
@keyframes disco{0%,100%{transform:translateY(0) rotate(-14deg)}25%{transform:translateY(-14px) rotate(0) scale(.96,1.06)}50%{transform:translateY(0) rotate(14deg)}75%{transform:translateY(-14px) rotate(0) scale(.96,1.06)}}
@keyframes shimmy{from{transform:skewX(14deg) translateX(-6px) scale(1.04,.95)}to{transform:skewX(-14deg) translateX(6px) translateY(-10px) scale(.97,1.05)}}
@keyframes flip{0%,55%{transform:translateY(0)}65%{transform:translateY(4px) scale(1.12,.84)}82%{transform:translateY(-60px) rotate(360deg)}94%{transform:translateY(0) rotate(360deg) scale(1.1,.9)}100%{transform:rotate(360deg)}}
@keyframes moonwalk{0%,100%{transform:translateX(-18px) skewX(-8deg)}50%{transform:translateX(18px) skewX(-8deg)}25%,75%{transform:translateX(0) translateY(-6px) skewX(-8deg)}}
@keyframes groove{0%,100%{transform:translateX(0) skewX(0)}25%{transform:translateX(-10px) skewX(12deg) translateY(-8px)}75%{transform:translateX(10px) skewX(-12deg) translateY(-8px)}}
@keyframes spin{0%,40%{transform:scaleX(1)}50%{transform:scaleX(-1) translateY(-12px)}60%,90%{transform:scaleX(-1)}100%{transform:scaleX(1)}}
.dancer.yay{animation:yay .7s cubic-bezier(.3,1.5,.5,1)}
@keyframes yay{50%{transform:translateY(-50px) scale(1.2) rotate(-12deg)}}
.dancer .arm{transform-box:fill-box;animation:wave .235s ease-in-out infinite alternate}
.dancer .arm.l{transform-origin:100% 100%}
.dancer .arm.r{transform-origin:0 100%;animation-delay:-.235s}
.d0 .arm.l,.d3 .arm.l{animation:point .94s steps(1) infinite}
@keyframes wave{from{transform:rotate(-40deg)}to{transform:rotate(34deg)}}
@keyframes point{0%{transform:rotate(-70deg)}50%{transform:rotate(30deg)}}
.dancer .foot{transform-box:fill-box;transform-origin:50% 50%;animation:tap .235s ease-in-out infinite alternate}
.dancer .foot.r{animation-delay:-.235s}
@keyframes tap{to{transform:translateY(-4px) rotate(-12deg)}}
.dancer .eyes{transform-box:fill-box;transform-origin:50% 50%;animation:blink 3.2s infinite}
@keyframes blink{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.1)}}
.mnote{position:absolute;bottom:40%;font-size:24px;color:#ffd37a;opacity:0;animation:floatUp 3.6s ease-out infinite;pointer-events:none}
.mnote:nth-child(odd){color:#ff9fc6}
@keyframes floatUp{0%{transform:translateY(0) rotate(-10deg);opacity:0}15%{opacity:1}100%{transform:translateY(-160px) rotate(25deg);opacity:0}}
@media (prefers-reduced-motion:reduce){.dancer,.dancer *,.disco::after,.sparkle,.dancefloor::before,.mnote,.bigDate .ch,.cal{animation:none!important}}

#end .actions{display:flex;gap:12px;padding:26px 38px 30px}
#review{padding:0 38px 32px;font-size:16px;line-height:1.6}
#review h3{margin-bottom:10px}
#review p{margin:0 0 12px}
#review span{color:#6b7663}

@media (max-width:860px),(orientation:portrait){
  .endTop,.party{padding-left:22px;padding-right:22px}
  #end .actions{padding:22px;flex-direction:column}
  #review{padding:0 22px 26px}
  #breakdown{gap:8px}
  #breakdown div{padding:12px 10px}
  #breakdown b{font-size:28px}
  #breakdown span{font-size:12.5px}
  #final{font-size:48px}
  /* téléphone : tout le bloc fête doit tenir sans défiler */
  .party{padding-top:24px}
  .kicker{font-size:18px}
  .party .lead{font-size:15px;margin-bottom:14px}
  .dateRow{flex-direction:row;text-align:left;gap:14px;padding:14px}
  .cal{width:72px;border-radius:10px}
  .calMonth{font-size:10px;padding:12px 0 4px;border-radius:10px 10px 0 0}
  .calDay{font-size:38px;padding:4px 0 6px;background:#fffdf4;border-radius:0 0 10px 10px}
  .calRings{top:-6px}.calRings i{width:7px;height:14px}
  .rdv{font-size:11px}
  .bigDate{font-size:clamp(30px,10vw,44px);margin:2px 0 4px}
  .expoName{font-size:14px}
  .venue{font-size:13px;margin-top:3px}
  .dancefloor{margin:0 -22px;padding:52px 10px 8px}
  .disco{width:40px;height:40px;margin-left:-20px;top:6px}
  .dancer{width:21%;max-width:84px}
  #crewTop{margin-bottom:-4px}#crewBot{margin-top:6px}
  #end .actions{padding:16px 22px}
}
