/* The same ribbon medals as the profile, with a dedicated slot below the emblem. */
.has-tier-medals .medal-stage{height:clamp(350px,53svh,470px)}
.has-tier-medals :is(.medal-camera,.badge-story,.medal-halo,.medal-rays,.medal-particles){bottom:120px}
.has-tier-medals .medal-orbit,.has-tier-medals .medal-impact{top:calc(50% - 60px)}
.has-tier-medals .medal-ground{bottom:125px}
.ceremony-medal-row{--ribbon-size:clamp(60px,15vw,72px);--slot-gap:10px;position:relative;z-index:4;display:grid;grid-template-columns:repeat(4,var(--ribbon-size));gap:var(--slot-gap);width:max-content;max-width:100%;height:120px;flex-shrink:0;list-style:none;margin:-120px auto 0;padding:0;perspective:850px;isolation:isolate}
.ceremony-medal-row.single-medal{grid-template-columns:var(--ribbon-size)}
.ceremony-medal-slot{position:relative;min-width:0;display:flex;flex-direction:column;align-items:center;gap:7px;perspective:700px;transform-style:preserve-3d}
.ceremony-ribbon-medal{width:var(--ribbon-size);height:calc(var(--ribbon-size)*1.34);flex:none;filter:none;opacity:1;transform-style:preserve-3d}
.ceremony-ribbon-medal .tier-ribbon{height:40%;width:32%;top:2%;border-radius:3px 3px 0 0;box-shadow:inset 0 2px 2px #fff8,inset 2px 0 3px #0005,0 2px 3px #0007}
.ceremony-ribbon-medal .ribbon-left{left:28%}.ceremony-ribbon-medal .ribbon-right{right:28%}
.ceremony-ribbon-medal .tier-medal-loop{top:25%;height:17%;border-width:3px;box-shadow:0 2px 2px #0009}
.ceremony-ribbon-medal .tier-medal-face{left:4%;width:92%;bottom:3%;border-width:4px;box-shadow:0 3px 0 var(--metal-dark),0 6px 8px #0008,inset 0 0 0 1px var(--metal-light);transform-style:preserve-3d}
.ceremony-ribbon-medal .tier-medal-face::before{inset:4px;border-width:1px;box-shadow:inset 0 2px 4px var(--metal-dark)}
.ceremony-ribbon-medal .tier-medal-seal{font-size:calc(var(--ribbon-size)*.37);text-shadow:0 2px 0 var(--metal-dark),0 -1px #fff8;transform:translateZ(3px)}
.ceremony-ribbon-medal.rank-bronze{--metal:#d99a64;--metal-light:#ffdbb6;--metal-dark:#764023}
.ceremony-ribbon-medal.rank-bronze .tier-medal-face{border-style:ridge;background:repeating-conic-gradient(from 15deg,#bd753d 0 5deg,#f3c390 5deg 8deg,#8d5029 8deg 12deg)}
.ceremony-ribbon-medal.rank-silver{--metal:#d4e6f5;--metal-light:#fff;--metal-dark:#607e9c}
.ceremony-ribbon-medal.rank-silver .tier-medal-face{border-style:double;border-width:5px;background:conic-gradient(#fff,#536f8b,#e0f3ff,#93b3cd,#fff)}
.ceremony-ribbon-medal:is(.rank-gold,.rank-complete){--metal:#ffd747;--metal-light:#fff4b8;--metal-dark:#965805}
.ceremony-ribbon-medal:is(.rank-gold,.rank-complete) .tier-medal-face{border-style:ridge;border-width:5px;box-shadow:0 3px 0 #965805,0 5px 9px #0007,0 0 17px #ffcc2940,inset 0 0 0 1px #fff8c7}
.ceremony-ribbon-medal.rank-platinum{--metal:#e5edf5;--metal-light:#fffef1;--metal-dark:#697687}
.ceremony-ribbon-medal.rank-platinum .tier-medal-face{border:5px double #f4faff;background:conic-gradient(from 30deg,#fff,#627895,#e8f8ff,#98a8bd,#fff);outline:2px solid #ffe600;outline-offset:1px;box-shadow:0 4px 0 #515e70,0 0 17px #ffe60080,inset 0 0 0 2px #ffe600}
.ceremony-ribbon-medal.rank-platinum .tier-medal-seal{color:#fff09a;text-shadow:0 2px #56657c,0 -1px #fff}
.tier-medal-laurel{display:none;position:absolute;z-index:3;left:11%;right:11%;bottom:9%;font-family:Georgia,serif;font-size:calc(var(--ribbon-size)*.3);line-height:1;color:var(--metal-light);text-align:left;text-shadow:0 1px var(--metal-dark);pointer-events:none}
.tier-medal-laurel::after{content:'❧';position:absolute;right:0;transform:scaleX(-1)}
.ceremony-ribbon-medal:is(.rank-gold,.rank-platinum,.rank-complete) .tier-medal-laurel{display:block}
.tier-medal-glint{position:absolute;z-index:4;inset:30% 7% 5%;border-radius:50%;background:linear-gradient(115deg,transparent 25%,#fff0 36%,#ffff 47%,#fff0 57%,transparent 70%);opacity:0;pointer-events:none;mix-blend-mode:screen}
.ceremony-medal-caption{color:#e6ecfa;font-size:12px;font-weight:700;line-height:1.1;white-space:nowrap}
.medal-current .ceremony-medal-caption{color:var(--metal-light);text-shadow:0 0 12px color-mix(in srgb,var(--metal),transparent 45%)}
.medal-held .ceremony-ribbon-medal{filter:saturate(.8) brightness(.9)}
.medal-held .ceremony-medal-caption{color:#bacce1}
.tier-arrival-shimmer,.tier-arrival-wave{position:absolute;pointer-events:none;opacity:0;z-index:-1}
.tier-arrival-shimmer{inset:8% -55% 0;background:radial-gradient(ellipse,var(--metal-light),color-mix(in srgb,var(--metal),transparent 20%) 19%,transparent 63%);mix-blend-mode:screen}
.tier-arrival-wave{width:90%;aspect-ratio:1;left:5%;top:32%;border:2px solid var(--metal-light);border-radius:50%;box-shadow:0 0 14px var(--metal);transform:scale(.5)}
.celebration-rank-platinum .ceremony-medal-row::after{content:'';position:absolute;z-index:-2;inset:25% -12% 5%;background:radial-gradient(ellipse,#ffe60077,transparent 66%);opacity:0;pointer-events:none}
@media(prefers-reduced-motion:no-preference){
 body:not(.no-motion) .has-tier-medals[data-motion=on][data-ready=loading] .medal-new :is(.ceremony-ribbon-medal,.ceremony-medal-caption){visibility:hidden}
 body:not(.no-motion) .has-tier-medals[data-motion=on][data-ready=ready] .medal-current .ceremony-ribbon-medal{animation:ribbon-bronze-arrival var(--ceremony) linear both}
 body:not(.no-motion) .has-tier-medals[data-motion=on][data-ready=ready] .medal-current .rank-silver{animation-name:ribbon-silver-arrival}
 body:not(.no-motion) .has-tier-medals[data-motion=on][data-ready=ready] .medal-current :is(.rank-gold,.rank-complete){animation-name:ribbon-gold-arrival}
 body:not(.no-motion) .has-tier-medals[data-motion=on][data-ready=ready] .medal-current .rank-platinum{animation-name:ribbon-platinum-arrival}
 body:not(.no-motion) .has-tier-medals[data-motion=on][data-ready=ready] .medal-current .tier-ribbon{animation:ribbon-fabric-settle var(--ceremony) ease-out both}
 body:not(.no-motion) .has-tier-medals[data-motion=on][data-ready=ready] .medal-current.rank-platinum .ribbon-left{animation-name:ribbon-platinum-left}
 body:not(.no-motion) .has-tier-medals[data-motion=on][data-ready=ready] .medal-current.rank-platinum .ribbon-right{animation-name:ribbon-platinum-right}
 body:not(.no-motion) .has-tier-medals[data-motion=on][data-ready=ready] .medal-current.rank-platinum .tier-medal-face{animation:ribbon-platinum-forge var(--ceremony) ease-out both}
 body:not(.no-motion) .has-tier-medals[data-motion=on][data-ready=ready] .medal-current .tier-medal-glint{animation:ribbon-metal-shine var(--ceremony) linear both}
 body:not(.no-motion) .has-tier-medals[data-motion=on][data-ready=ready] .medal-current .ceremony-medal-caption{animation:ribbon-caption var(--ceremony) ease-out both}
 body:not(.no-motion) .has-tier-medals[data-motion=on][data-ready=ready] .medal-current .tier-arrival-shimmer{animation:ribbon-arrival-light var(--ceremony) linear both}
 body:not(.no-motion) .has-tier-medals[data-motion=on][data-ready=ready] .medal-current :is(.tier-arrival-wave){animation:ribbon-arrival-wave var(--ceremony) ease-out both}
 body:not(.no-motion) .has-tier-medals[data-motion=on][data-ready=ready] .medal-catchup .ceremony-ribbon-medal{animation:ribbon-catchup .55s calc(.16s + var(--arrival-step)*.16s) ease-out both}
 body:not(.no-motion) .has-tier-medals[data-motion=on][data-ready=ready] .medal-catchup .ceremony-medal-caption{animation:ribbon-catchup .35s calc(.3s + var(--arrival-step)*.16s) ease-out both}
 body:not(.no-motion) .has-tier-medals.celebration-rank-platinum[data-motion=on][data-ready=ready] .ceremony-medal-row::after{animation:ribbon-ultimate-glow var(--ceremony) ease-out both}
 body:not(.no-motion) .has-tier-medals.celebration-rank-platinum[data-motion=on][data-ready=ready] .medal-held .tier-medal-glint{animation:ribbon-collection-shine var(--ceremony) linear both}
}
/* Bronze lands with weight; silver turns, gold follows an arc, platinum assembles in depth. */
@keyframes ribbon-bronze-arrival{
 0%,54%{opacity:0;transform:translate3d(calc(var(--slot-x)*(var(--ribbon-size) + var(--slot-gap))),-145px,90px) rotate(-18deg) scale(1.65)}
 60%{opacity:1;transform:translate3d(calc(var(--slot-x)*(var(--ribbon-size) + var(--slot-gap))*.6),-105px,50px) rotate(-9deg) scale(1.45)}
 79%{opacity:1;transform:translate3d(0,0,0) rotate(4deg) scale(1.02,.94)}
 85%{transform:translate3d(0,-12px,0) rotate(-3deg) scale(1)}
 91%{transform:translate3d(0,2px,0) rotate(1deg)}
 97%,100%{opacity:1;transform:none}
}
@keyframes ribbon-silver-arrival{
 0%,53%{opacity:0;transform:translate3d(-135px,-95px,110px) rotateY(-280deg) rotateZ(-12deg) scale(1.6)}
 58%{opacity:1;transform:translate3d(-95px,-85px,75px) rotateY(-230deg) rotateZ(-8deg) scale(1.45)}
 71%{transform:translate3d(-30px,-45px,35px) rotateY(-75deg) rotateZ(5deg) scale(1.2)}
 80%{transform:translate3d(0,0,0) rotateY(15deg) rotateZ(-3deg)}
 88%{transform:translate3d(0,-5px,0) rotateY(-8deg) rotateZ(2deg)}
 97%,100%{opacity:1;transform:none}
}
@keyframes ribbon-gold-arrival{
 0%,52%{opacity:0;transform:translate3d(-100px,-75px,150px) rotate(-40deg) scale(1.8)}
 59%{opacity:1;transform:translate3d(-80px,-130px,95px) rotate(-17deg) scale(1.6)}
 71%{transform:translate3d(18px,-95px,55px) rotate(13deg) scale(1.35)}
 84%{transform:translate3d(0,0,0) rotate(-4deg) scale(1.03)}
 90%{transform:translate3d(0,-7px,0) rotate(2deg)}
 97%,100%{opacity:1;transform:none}
}
@keyframes ribbon-platinum-arrival{
 0%,54%{opacity:0;transform:translate3d(calc(var(--slot-x)*(var(--ribbon-size) + var(--slot-gap))),-125px,190px) rotateY(-35deg) rotateX(10deg) scale(2.15)}
 59%{opacity:1;transform:translate3d(calc(var(--slot-x)*(var(--ribbon-size) + var(--slot-gap))),-115px,140px) rotateY(28deg) rotateX(-12deg) scale(1.9)}
 68%{opacity:1;transform:translate3d(-60px,-95px,100px) rotateY(-18deg) rotateX(6deg) scale(1.65)}
 80%{transform:translate3d(0,0,0) rotateY(0) rotateX(0) scale(1.06,.94)}
 83%{transform:translate3d(-3px,-10px,15px) rotateY(10deg) rotateZ(-4deg) scale(1.07)}
 87%{transform:translate3d(2px,3px,0) rotateY(-5deg) rotateZ(3deg)}
 92%{transform:translate3d(-1px,-2px,0) rotateZ(-1deg)}
 97%,100%{opacity:1;transform:none}
}
@keyframes ribbon-fabric-settle{0%,77%{translate:0 0}82%{translate:0 -5px}90%{translate:0 2px}100%{translate:0 0}}
@keyframes ribbon-platinum-left{0%,55%{opacity:0;transform:translate(-35px,-25px) rotate(-65deg)}65%{opacity:1;transform:translate(-18px,-10px) rotate(-45deg)}76%{transform:translate(0,0) rotate(-28deg)}82%{transform:translate(0,-6px) rotate(-38deg)}94%,100%{opacity:1;transform:rotate(-28deg)}}
@keyframes ribbon-platinum-right{0%,55%{opacity:0;transform:translate(35px,-25px) rotate(65deg)}65%{opacity:1;transform:translate(18px,-10px) rotate(45deg)}76%{transform:translate(0,0) rotate(28deg)}82%{transform:translate(0,-6px) rotate(38deg)}94%,100%{opacity:1;transform:rotate(28deg)}}
@keyframes ribbon-platinum-forge{0%,55%{opacity:0;transform:translateZ(80px) rotateY(-80deg) scale(.7)}65%{opacity:1;transform:translateZ(40px) rotateY(28deg) scale(.93)}75%{transform:translateZ(0) rotateY(0) scale(1)}82%{transform:translateZ(6px) scale(1.03)}94%,100%{opacity:1;transform:none}}
@keyframes ribbon-metal-shine{0%,78%{opacity:0;transform:translateX(-35%) rotate(-10deg)}86%{opacity:.85;transform:translateX(0) rotate(0)}97%,100%{opacity:0;transform:translateX(35%) rotate(10deg)}}
@keyframes ribbon-caption{0%,79%{opacity:0;transform:translateY(7px)}93%,100%{opacity:1;transform:none}}
@keyframes ribbon-arrival-light{0%,76%{opacity:0;transform:scale(.4)}83%{opacity:.6;transform:scale(1.15)}100%{opacity:0;transform:scale(1.45)}}
@keyframes ribbon-arrival-wave{0%,79%{opacity:0;transform:scale(.5)}82%{opacity:.75;transform:scale(1)}98%,100%{opacity:0;transform:scale(2.5)}}
@keyframes ribbon-catchup{0%{opacity:0;transform:translateY(16px) scale(.65)}70%{opacity:1;transform:translateY(-3px) scale(1.04)}100%{opacity:1;transform:none}}
@keyframes ribbon-ultimate-glow{0%,79%{opacity:0;transform:scaleX(.2)}85%{opacity:1;transform:scaleX(1.1)}100%{opacity:0;transform:scaleX(1.3)}}
@keyframes ribbon-collection-shine{0%,80%{opacity:0;transform:translateX(-30%)}88%{opacity:.65;transform:translateX(0)}99%,100%{opacity:0;transform:translateX(30%)}}
@media(max-height:650px){.has-tier-medals .medal-stage{height:330px}.has-tier-medals .medal-assembly{--size:min(52vw,174px)}.ceremony-medal-row{--ribbon-size:60px;height:112px;margin-top:-112px}.has-tier-medals :is(.medal-camera,.badge-story,.medal-halo,.medal-rays,.medal-particles){bottom:112px}.has-tier-medals .medal-orbit,.has-tier-medals .medal-impact{top:calc(50% - 56px)}}
