/* A Web — A Sports Plus + composer fix + animation layer. Loads after polish.css.
   Motion is transform/opacity only. Phones (html.lite) keep entrances but drop endless loops. */
:root{--spring:cubic-bezier(.2,1.5,.3,1)}

/* ===== A-AI composer: no more tall empty box ===== */
.aco{align-items:center!important;padding:8px 12px!important;gap:8px}
.aco textarea{min-height:46px!important;height:46px;padding:12px 16px!important;line-height:20px;overflow-y:auto;transition:box-shadow .3s,border-color .3s,transform .3s var(--spring)}
.aco textarea:focus{transform:translateY(-2px)}
.aco:focus-within{box-shadow:0 -10px 30px -18px var(--g)}
.aim{padding-bottom:6px!important}
.aoi{transition:transform .3s var(--spring),background .2s,box-shadow .3s}
.aoi.go:hover{transform:scale(1.18) rotate(-14deg);box-shadow:0 8px 20px -6px var(--g)}
.aoi.go:active{transform:scale(.9)}

/* ===== team grade / class / number badge ===== */
.gb{display:inline-flex;align-items:baseline;gap:6px;margin:4px 0 0 8px;padding:3px 10px;border-radius:99px;background:color-mix(in srgb,var(--g) 22%,transparent);border:1px solid color-mix(in srgb,var(--g) 55%,transparent);vertical-align:middle;animation:aPop .6s var(--spring) both}
.gb b{font-size:13px;letter-spacing:.5px}.gb small{font-size:10px;opacity:.75;font-weight:700}
.glr{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0!important;font-weight:600}.glr input{width:70px;padding:6px 8px}
.gls{display:grid;gap:6px;max-height:240px;overflow:auto;padding:10px;border:1px solid var(--line);border-radius:12px}

/* ===== stats calculator ===== */
.sxc{margin-bottom:14px}.sxg2{display:grid;grid-template-columns:repeat(auto-fit,minmax(310px,1fr));gap:16px;align-items:start}
.sxbox h3{margin:0 0 12px}.sxbox{margin-bottom:16px}
.sxr{display:flex;align-items:center;gap:12px;padding:10px 8px;border-radius:14px;animation:aUp .6s var(--ease) both;animation-delay:calc(var(--i)*60ms);transition:transform .3s var(--spring),background .3s}
.sxr:hover{transform:translateX(6px) scale(1.01);background:var(--soft)}
.sxn{width:34px;text-align:center;font-size:20px;flex:none}
.sxa{width:44px;height:44px;border-radius:50%;overflow:hidden;flex:none;display:grid;place-items:center;font-weight:800;background:linear-gradient(135deg,var(--g),var(--v,#7b3cff));color:#fff}
.sxa img{width:100%;height:100%;object-fit:cover}
.sxi{flex:1;min-width:0}.sxi b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sxi small{color:var(--mut)}
.sxb{display:block;height:7px;border-radius:9px;background:var(--soft);margin-top:6px;overflow:hidden}
.sxb u{display:block;height:100%;width:var(--w);border-radius:9px;background:linear-gradient(90deg,var(--g),var(--v,#7b3cff));transform-origin:left;animation:aGrow 1s var(--ease) both;animation-delay:calc(var(--i)*60ms + 250ms)}
.sxg{font-size:24px;min-width:38px;text-align:end;animation:aPop .7s var(--spring) both;animation-delay:calc(var(--i)*60ms + 300ms)}
.sxr.r1{background:linear-gradient(90deg,color-mix(in srgb,#ffd166 20%,transparent),transparent)}
.sxr.r1 .sxn{animation:aWig 2.4s ease-in-out infinite}
.sxw{overflow-x:auto}.sxt{width:100%;border-collapse:collapse;min-width:520px}.sxt th,.sxt td{padding:10px 12px;text-align:start;border-bottom:1px solid var(--line)}
.sxt th{font-size:12px;color:var(--mut);text-transform:uppercase;letter-spacing:.5px}.sxt tbody tr{animation:aUp .5s var(--ease) both}.sxt tbody tr:hover{background:var(--soft)}.sxt em{color:var(--mut);font-style:normal}
.sxn2{text-align:center;color:var(--mut)}

/* ===== ANIMATIONS EVERYWHERE ===== */
@keyframes aUp{from{opacity:0;transform:translateY(24px)}}
@keyframes aPop{from{opacity:0;transform:scale(.4)}}
@keyframes aGrow{from{transform:scaleX(0)}}
@keyframes aInL{from{opacity:0;transform:translateX(-30px) scale(.94)}}
@keyframes aInR{from{opacity:0;transform:translateX(30px) scale(.94)}}
@keyframes aWig{0%,100%{transform:rotate(0)}15%{transform:rotate(-14deg)}30%{transform:rotate(12deg)}45%{transform:rotate(-8deg)}60%{transform:rotate(0)}}
@keyframes aBob{50%{transform:translateY(-7px)}}
@keyframes aHead{from{opacity:0;transform:translateY(30px) scale(.97);letter-spacing:.06em}}
@keyframes aRing{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--g) 55%,transparent)}100%{box-shadow:0 0 0 18px transparent}}
@keyframes aSlide{from{opacity:0;transform:translateX(-18px)}}

/* page headers + sports tabs */
.ph h1{animation:aHead .9s var(--ease) both!important}.ph p{animation:aUp .8s .15s var(--ease) both}
#sp>*{animation:aUp .55s var(--ease) both}
.tabs>*{animation:aPop .5s var(--spring) both}
.tabs>*:nth-child(2){animation-delay:.04s}.tabs>*:nth-child(3){animation-delay:.08s}.tabs>*:nth-child(4){animation-delay:.12s}.tabs>*:nth-child(5){animation-delay:.16s}.tabs>*:nth-child(6){animation-delay:.2s}.tabs>*:nth-child(7){animation-delay:.24s}.tabs>*:nth-child(n+8){animation-delay:.28s}
.tabs button,.tp{transition:transform .3s var(--spring),background .25s,border-color .25s}
.tabs button:hover,.tp:hover{transform:translateY(-3px) scale(1.05)}.tabs button:active,.tp:active{transform:scale(.94)}
.tabs button.on{animation:aRing 1.6s ease-out 1}

/* nav, logo, avatars, dock */
header nav a{transition:transform .3s var(--spring),color .2s}header nav a:hover{transform:translateY(-3px)}header nav a.on{animation:aPop .5s var(--spring)}
header .logo:hover,.lgo img:hover{animation:aWig .7s ease!important}
header .av,.dk{transition:transform .35s var(--spring)}header .av:hover{transform:scale(1.15) rotate(8deg)}.dk:hover{transform:translateY(-4px) scale(1.15)}.dk:active{transform:scale(.9)}
#mbar a.on i{animation:aBob 2s ease-in-out infinite}

/* buttons shine */
.btn:not(.o){background-size:220% 100%!important;background-position:0 0;transition:transform .3s var(--spring),box-shadow .3s,background-position .6s var(--ease)}
.btn:not(.o):hover{background-position:100% 0;box-shadow:0 10px 24px -8px var(--g)}

/* cards, boxes, lists, stats */
.card,.box{transition:transform .35s var(--spring),box-shadow .35s,border-color .3s}
.card .cv,.card img.cv{transition:transform .6s var(--ease)}.card:hover .cv{transform:scale(1.06)}
.it,.rank,.mr{transition:transform .3s var(--spring),background .25s}.it:hover,.rank:hover,.mr:hover{transform:translateX(5px)}
.tstats>div,.stats div{transition:transform .35s var(--spring)}.tstats>div:hover,.stats div:hover{transform:translateY(-5px) scale(1.04)}
.tstats>div{animation:aPop .6s var(--spring) both}.tstats>div:nth-child(2){animation-delay:.07s}.tstats>div:nth-child(3){animation-delay:.14s}.tstats>div:nth-child(4){animation-delay:.21s}.tstats>div:nth-child(n+5){animation-delay:.28s}

/* matches, form pills, scores */
.match .sc,.sc2{animation:aPop .7s .15s var(--spring) both}
.fm span{animation:aPop .5s var(--spring) both}.fm span:nth-child(2){animation-delay:.08s}.fm span:nth-child(3){animation-delay:.16s}.fm span:nth-child(4){animation-delay:.24s}.fm span:nth-child(5){animation-delay:.32s}
.rs.W{animation:aRing 2s ease-out 2}
.match img,.tl{transition:transform .4s var(--spring)}.match:hover img,.match:hover .tl{transform:rotate(-8deg) scale(1.12)}
.tlogo{animation:aPop .8s var(--spring) both!important}

/* A-AI chat */
.am.a{animation:aInL .5s var(--spring) backwards}.am.u{animation:aInR .5s var(--spring) backwards}
.aav{transition:transform .3s var(--spring)}.am:hover .aav{transform:scale(1.12) rotate(-6deg)}
.dots i{animation:dot 1.1s infinite,aBob 1.1s infinite}
.aem img{animation:aBob 3.5s ease-in-out infinite!important}.aem>*{animation:aUp .7s var(--ease) both}.aem>*:nth-child(2){animation-delay:.1s}.aem>*:nth-child(3){animation-delay:.2s}.aem>*:nth-child(4){animation-delay:.3s}
.ais .cv,.pc,.pl{animation:aSlide .45s var(--ease) both;transition:transform .3s var(--spring)}.ais .cv:hover,.pc:hover,.pl:hover{transform:translateX(5px)}
#aif0{animation:aBob 3.2s ease-in-out infinite!important}#aip:not([hidden]){animation:aUp .45s var(--spring) both}
#aitip{animation:aUp .6s var(--spring) both}

/* modals, overlays, toast, empty states, footer */
.ov{animation:vofade .3s both}.mod{animation:aPop .45s var(--spring) both!important}
.empty{animation:aUp .7s var(--ease) both}
footer{animation:aUp .9s var(--ease) both}
details.fq summary{transition:transform .25s var(--spring)}details.fq summary:hover{transform:translateX(5px)}

/* phones: keep entrances, stop endless loops */
html.lite #aif0,html.lite .aem img,html.lite .sxr.r1 .sxn,html.lite #mbar a.on i,html.lite .dots i,html.lite .rs.W{animation-iteration-count:1!important}
html.lite .dots i{animation:dot 1.1s infinite!important}
@media(prefers-reduced-motion:reduce){.gb,.sxr,.sxb u,.sxg,.tabs>*,#sp>*,.tstats>div,.am,.mod,.ph h1,.ph p,.aem>*,.aem img,#aif0,.empty,footer{animation:none!important}}