.asoc-dropkick-layer{position:fixed;inset:0;z-index:200010;display:grid;place-items:center;pointer-events:none;overflow:hidden;color:#fff;isolation:isolate}
.asoc-dropkick-layer.role-observer{place-items:start center;padding-top:10vh}
.asoc-dropkick-stage{position:relative;width:min(560px,88vw);height:min(345px,65vh);display:grid;place-items:center;isolation:isolate}
.asoc-dropkick-layer.role-attacker .asoc-dropkick-stage,.asoc-dropkick-layer.role-observer .asoc-dropkick-stage{height:auto;width:auto}
.asoc-dropkick-banner{position:relative;z-index:3;align-self:end;display:grid;gap:5px;padding:13px 24px;text-align:center;border-radius:12px;border:2px solid #dc535e;background:#15131ceE;box-shadow:0 7px 34px #0009;max-width:88vw}
.asoc-dropkick-banner strong{font-size:clamp(19px,2.5vw,30px);letter-spacing:.09em}
.asoc-dropkick-banner span{font-size:clamp(12px,1.4vw,16px);overflow-wrap:anywhere}
.asoc-dropkick-layer.role-observer .asoc-dropkick-banner{padding:8px 15px}
.asoc-dropkick-layer.role-observer .asoc-dropkick-banner strong{font-size:14px}
.asoc-dropkick-layer.role-observer .asoc-dropkick-banner span{font-size:12px}
.asoc-dropkick-layer.role-attacker .asoc-dropkick-banner{border-color:#8ac29a}
.asoc-dropkick-layer.result-miss .asoc-dropkick-banner{border-color:#e2c157}
.asoc-dropkick-layer.result-reflect .asoc-dropkick-banner{border-color:#bf69ff}
.asoc-dropkick-attacker{position:absolute;top:23%;left:0;font-size:clamp(65px,11vw,120px);filter:drop-shadow(0 0 15px #a44);animation:dropkick-flight 1.25s ease-in .35s both;z-index:2}
.asoc-dropkick-layer.broker-attack .asoc-dropkick-attacker{filter:drop-shadow(0 0 20px #b043ff);color:#b043ff}
.asoc-dropkick-victim{position:absolute;top:29%;left:57%;font-size:clamp(60px,10vw,100px);animation:dropkick-victim 1.5s ease-in 1.18s both}
.asoc-dropkick-impact{position:absolute;top:19%;left:35%;font-size:clamp(35px,6vw,64px);font-weight:1000;color:#ffdb78;text-shadow:3px 4px #ad244e,0 0 20px #fc6;transform:rotate(-11deg);opacity:0;animation:dropkick-burst .6s ease-out 1.2s both;z-index:4}
.asoc-dropkick-particles{position:absolute;inset:0;z-index:1}
.asoc-dropkick-particle{position:absolute;top:45%;font-size:30px;opacity:0;animation:dropkick-particle 1.1s ease-out calc(1.16s + var(--index)*45ms) both}
.asoc-dropkick-audio{position:absolute;top:0;right:0;border:1px solid #ffffff70;border-radius:25px;background:#241a35;color:#fff;padding:5px 12px;pointer-events:auto;cursor:pointer;font-size:12px}
@keyframes dropkick-flight{0%{transform:translate(-110vw,-140px) rotate(-32deg);opacity:0}35%{opacity:1}78%{transform:translate(145px,20px) rotate(0)}100%{transform:translate(185px,28px) rotate(15deg);opacity:0}}
@keyframes dropkick-victim{0%,15%{transform:translate(0,0) rotate(0)}28%{transform:translate(30px,-18px) rotate(40deg)}100%{transform:translate(100vw,-160px) rotate(670deg);opacity:0}}
@keyframes dropkick-burst{0%{opacity:0;transform:rotate(-11deg) scale(.2)}33%{opacity:1;transform:rotate(-11deg) scale(1.2)}100%{opacity:0;transform:rotate(4deg) scale(1.5)}}
@keyframes dropkick-particle{0%{opacity:0;transform:translate(0,0) scale(.3)}30%{opacity:1}100%{opacity:0;transform:translate(40px,-120px) rotate(65deg)}}
@media(prefers-reduced-motion:reduce){.asoc-dropkick-layer *{animation:none!important;transition:none!important}}

/* Goalkeeper-punt choreography: the player's portrait is the football. */
.asoc-dropkick-keeper{position:absolute;left:9%;top:17%;width:140px;height:205px;z-index:2;transform-origin:50% 95%}
.asoc-dropkick-keeper-head{position:absolute;left:34px;top:0;width:68px;height:68px;display:grid;place-items:center;background:#20233e;border:3px solid #94a5c4;border-radius:50%;overflow:hidden;box-shadow:0 0 22px #101629aa;z-index:4}
.asoc-dropkick-keeper-head img,.asoc-dropkick-ball img{display:block;width:100%;height:100%;object-fit:cover}
.asoc-dropkick-initials{font-weight:900;font-size:24px;color:#fff}
.asoc-dropkick-keeper-torso{position:absolute;top:65px;left:49px;width:43px;height:75px;border-radius:15px 15px 8px 8px;background:linear-gradient(#3f5f9a,#172643);transform:rotate(-8deg);border:2px solid #9bb3e2}
.asoc-dropkick-keeper-arm{position:absolute;top:71px;left:84px;width:70px;height:17px;border-radius:15px;background:#6985b4;transform:rotate(26deg);transform-origin:0 50%}
.asoc-dropkick-keeper-stance{position:absolute;top:136px;left:50px;width:22px;height:85px;border-radius:13px;background:#4d5e85;transform:rotate(12deg);transform-origin:top}
.asoc-dropkick-keeper-leg{position:absolute;top:134px;left:81px;width:25px;height:90px;border-radius:14px;background:#688ec3;border-bottom:13px solid #22242d;transform-origin:50% 10%;animation:asoc-goalkeeper-leg 1.15s cubic-bezier(.25,.1,.22,1) .45s both}
.asoc-dropkick-mech-boot{position:absolute;left:70px;top:153px;font-size:68px;z-index:6;filter:drop-shadow(0 0 18px #af3aff);transform-origin:15% 10%;animation:asoc-mechanical-kick 1.15s ease .45s both}
.asoc-dropkick-layer.broker-attack .asoc-dropkick-keeper-torso{background:linear-gradient(#54218b,#120a24);border-color:#9f4bf5}
.asoc-dropkick-layer.broker-attack .asoc-dropkick-keeper-head{border-color:#8a2de2;box-shadow:0 0 28px #9e3bfa}
.asoc-dropkick-ball{position:absolute;top:32%;left:34%;width:100px;height:100px;border-radius:50%;background:#283044;border:5px solid #edf2ff;outline:3px solid #121324;z-index:5;display:grid;place-items:center;overflow:hidden;box-shadow:0 14px 32px #000b,inset 0 0 17px #ffffff7d;transform-origin:50% 50%;animation:asoc-punt-ball 2.6s cubic-bezier(.27,.7,.28,1) .15s both}
.asoc-dropkick-ball .asoc-dropkick-initials{font-size:32px}
.asoc-dropkick-ball-seams{position:absolute;inset:0;border-radius:50%;box-shadow:inset 0 0 20px #0009;pointer-events:none}
.asoc-dropkick-layer.result-miss .asoc-dropkick-ball{animation-name:asoc-punt-miss}
.asoc-dropkick-layer.result-reflect .asoc-dropkick-ball{animation-name:asoc-punt-reflect}
.asoc-dropkick-layer.result-reflect .asoc-dropkick-keeper{animation:asoc-reversed-keeper 1.3s ease-out 1.4s both}
.asoc-dropkick-layer.result-miss .asoc-dropkick-impact{left:66%}
.asoc-dropkick-layer.broker-attack .asoc-dropkick-ball{border-color:#cba3ff;box-shadow:0 14px 32px #000b,0 0 24px #7c2cfa}
.asoc-dropkick-layer.role-victim .asoc-dropkick-stage{background:radial-gradient(ellipse at 48% 63%,#152a3a80 0%,#09132600 67%)}
@keyframes asoc-goalkeeper-leg{0%,30%{transform:rotate(-36deg)}59%{transform:rotate(51deg)}74%{transform:rotate(8deg)}100%{transform:rotate(0)}}
@keyframes asoc-mechanical-kick{0%,30%{transform:rotate(-38deg)}59%{transform:rotate(42deg) translateX(18px)}100%{transform:rotate(0)}}
@keyframes asoc-punt-ball{0%{transform:translate(-10px,-65px) scale(.76) rotate(0deg)}25%{transform:translate(-10px,0px) scale(1) rotate(0deg)}40%{transform:translate(25px,18px) scale(1.02) rotate(26deg)}57%{transform:translate(115px,-95px) scale(.95) rotate(170deg)}77%{transform:translate(340px,-220px) scale(.65) rotate(530deg)}100%{transform:translate(120vw,-370px) scale(.2) rotate(970deg);opacity:0}}
@keyframes asoc-punt-miss{0%{transform:translate(-10px,-65px) scale(.76)}32%{transform:translate(-10px,-8px) scale(1)}58%{transform:translate(10px,27px) rotate(25deg)}72%{transform:translate(36px,38px) rotate(80deg)}100%{transform:translate(45px,36px) rotate(80deg)}}
@keyframes asoc-punt-reflect{0%{transform:translate(-10px,-65px) scale(.76)}32%{transform:translate(-10px,0) scale(1)}48%{transform:translate(20px,17px) rotate(30deg)}63%{transform:translate(-135px,-95px) rotate(-160deg)}84%{transform:translate(-260px,-130px) rotate(-390deg)}100%{transform:translate(-60vw,-260px) rotate(-740deg);opacity:0}}
@keyframes asoc-reversed-keeper{0%,20%{transform:translateX(0) rotate(0)}45%{transform:translateX(-70px) rotate(-20deg)}100%{transform:translateX(-90vw) rotate(-270deg);opacity:0}}
@media(prefers-reduced-motion:reduce){.asoc-dropkick-ball,.asoc-dropkick-keeper-leg,.asoc-dropkick-mech-boot,.asoc-dropkick-keeper{animation:none!important}.asoc-dropkick-ball{top:24%;left:50%}}