/* Combat is a progressive visual replay of an already saved server result. */
[data-battle-staging],.combat-card-back,.combat-replay{display:none}
.battle-armed [data-battle-staging]{display:block}
.battle-armed [data-battle-result]{display:none}
.battle-armed .battle-complete [data-battle-result]{display:block}
.battle-armed .battle-complete .combat-intro,.battle-armed .battle-complete .combat-controls{display:none}
.battle-armed .combat-replay{display:inline-block}
.battle-armed body:has(.combat-screen:not(.battle-complete)) .wallet-hud strong{visibility:hidden}
.combat-screen{max-width:100%;overflow:hidden;padding:0 8px 22px}
.combat-intro h1{font-size:clamp(43px,6vw,70px);margin-bottom:12px}
.combat-round{min-height:98px;text-align:center;padding:14px 12px;margin:0 auto 22px;background:linear-gradient(90deg,transparent,#6381321c,transparent);border-block:1px solid #81a34e45}
.combat-round>span,.combat-round>small{display:block;color:var(--muted);font-size:9px;letter-spacing:1.6px}
.combat-round>strong{font:800 38px/1.2 var(--display);color:var(--green);letter-spacing:1px}
.combat-round>small{font-size:9px;letter-spacing:.7px}
.combat-stage{position:relative;gap:80px;max-width:820px;padding:12px 14px 32px;margin:12px auto 0;isolation:isolate}
.combat-stage:before{content:'';position:absolute;inset:3% -40px -10px;z-index:-1;background:radial-gradient(ellipse at 50% 80%,#a6d45115,transparent 70%);border-bottom:1px solid #89b75540;border-radius:50%}
.battle-sides>.combat-fighter{width:250px;flex:0 1 250px}
.combat-fighter .side-label{margin:0 0 10px}
.combat-card{position:relative;transform-origin:50% 80%;will-change:transform;transition:transform .38s cubic-bezier(.16,.8,.28,1)}
.combat-card>.football-card{position:relative;z-index:1;backface-visibility:hidden}
.combat-energy{margin:0 3px 15px;text-align:left}
.combat-energy>div{display:flex;align-items:center;justify-content:space-between;font-size:9px;letter-spacing:1.2px}
.combat-energy strong{font:800 24px var(--display);color:var(--green)}
.combat-energy progress{display:block;width:100%;height:9px;border:1px solid #64804a;border-radius:8px;overflow:hidden;background:#202b22;accent-color:var(--green)}
.combat-energy progress::-webkit-progress-bar{background:#202b22}
.combat-energy progress::-webkit-progress-value{background:linear-gradient(90deg,#6eab32,var(--green));transition:width .3s ease-out}
.combat-energy progress::-moz-progress-bar{background:var(--green)}
.fighter-opponent .combat-energy strong{color:#ffbd8e}
.fighter-opponent .combat-energy progress{accent-color:#f6a777;border-color:#916048}
.fighter-opponent .combat-energy progress::-webkit-progress-value{background:linear-gradient(90deg,#bc613e,#ffbd8e)}
.battle-armed .fighter-opponent .football-card{visibility:hidden}
.battle-armed .opponent-revealed .fighter-opponent .football-card{visibility:visible;animation:combat-flip .5s ease-out both}
.battle-armed .combat-card-back{position:absolute;inset:0;display:flex;z-index:3;flex-direction:column;justify-content:space-around;align-items:center;border:2px solid #bbd269;border-radius:15px 15px 25px 25px;background:repeating-linear-gradient(135deg,transparent 0 22px,#a4c65b1a 23px 25px),linear-gradient(135deg,#42582d,#14251b);box-shadow:0 10px 35px #0007,inset 0 0 0 7px #adcb6130}
.combat-card-back>small{font-weight:800;letter-spacing:3px;font-size:14px}
.combat-card-back>strong{font:800 150px/.8 var(--display);color:var(--green);text-shadow:0 0 40px #bbdd5570}
.combat-card-back>span{font-size:9px;letter-spacing:3px;color:#cfdda3}
.battle-armed .opponent-revealed .combat-card-back{display:none}
.combat-impact{position:absolute!important;left:50%;top:50%;width:90px!important;height:90px;transform:translate(-50%,-10%);z-index:5;pointer-events:none;display:grid;place-items:center}
.combat-impact-word{position:relative;z-index:3;display:grid;place-items:center;min-width:54px;height:54px;border:1px solid #a8c4618c;border-radius:50%;background:#15251cef;color:var(--green);font:800 35px var(--display);text-shadow:0 3px 1px #13200e}
.combat-impact i,.combat-impact b{position:absolute;inset:-35px;opacity:0;border-radius:50%;pointer-events:none}
.combat-impact i{background:repeating-conic-gradient(from 5deg,#fff5bd 0 4deg,transparent 4deg 24deg);clip-path:polygon(50% 0,57% 34%,80% 8%,70% 40%,100% 50%,70% 59%,86% 87%,58% 69%,50% 100%,41% 70%,12% 86%,31% 58%,0 50%,34% 41%,16% 13%,43% 32%)}
.combat-impact b{border:3px solid #f4e9b2;box-shadow:0 0 35px #d8ee7b,inset 0 0 30px #e9ec9970}
.combat-damage{position:absolute;top:25%;left:50%;z-index:9;opacity:0;transform:translate(-50%,20px);font:800 64px var(--display);color:#fff3b3;text-shadow:3px 4px 0 #822d22,0 0 20px #f0533460;pointer-events:none}
.battle-armed .combat-controls{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:12px 30px;margin:8px auto 20px}
.combat-controls>p{margin:0;color:var(--muted);font-size:10px}
.combat-controls button{font-size:11px;padding:12px}
.combat-conclusion h1{font-size:clamp(43px,5.6vw,70px);margin-bottom:22px}
.combat-conclusion:focus{outline:none}
.combat-replay-note{font-size:10px;color:var(--muted);margin:16px auto 0;max-width:580px}
.combat-conclusion .result-actions{align-items:center}
.combat-replay{padding:12px;font-size:11px}
.is-charging .fighter-player .combat-card{transform:translateX(-12px) rotate(-6deg) scale(.97);filter:drop-shadow(0 0 15px #b9ee5350)}
.is-charging .fighter-opponent .combat-card{transform:translateX(12px) rotate(6deg) scale(.97);filter:drop-shadow(0 0 15px #efac6a50)}
.is-striking .combat-card{transform:translateX(var(--strike-x,0)) rotate(8deg) scale(1.07);transition:transform .27s cubic-bezier(.2,.7,.1,1);z-index:4}
.is-striking .fighter-opponent .combat-card{transform:translateX(var(--strike-x,0)) rotate(-8deg) scale(1.07)}
.is-impacting .combat-impact-word{animation:combat-impact-word .45s ease-out both;font-size:43px;border-color:transparent;background:transparent;white-space:nowrap;color:#fff6bd}
.is-impacting .combat-impact i{animation:combat-spark .55s ease-out both}
.is-impacting .combat-impact b{animation:combat-ring .55s ease-out both}
.is-impacting .combat-damage{animation:combat-damage .9s ease-out both}
.is-impacting .combat-stage{animation:combat-shake .28s linear}
.is-recovering .fighter-player .combat-card{transform:translateX(-7px) rotate(-3deg)}
.is-recovering .fighter-opponent .combat-card{transform:translateX(7px) rotate(3deg)}
.battle-entering .fighter-player .combat-card{animation:combat-arrival .6s cubic-bezier(.2,.8,.2,1) both}
.battle-complete.outcome-won .fighter-player .football-card,.battle-complete.outcome-lost .fighter-opponent .football-card{box-shadow:0 0 0 3px #eff9a733,0 0 45px #c4ef5645;animation:combat-winner .5s ease-out both}
.battle-complete.outcome-won .fighter-opponent .football-card,.battle-complete.outcome-lost .fighter-player .football-card{filter:saturate(.15) brightness(.55);transform:rotate(3deg) scale(.95)}
@keyframes combat-arrival{from{opacity:0;transform:translate(-80px,35px) rotate(-18deg) scale(.7)}to{opacity:1;transform:none}}
@keyframes combat-flip{from{transform:rotateY(-90deg);filter:brightness(2)}to{transform:rotateY(0);filter:none}}
@keyframes combat-damage{0%{opacity:0;transform:translate(-50%,20px) scale(.6)}15%,65%{opacity:1;transform:translate(-50%,-15px) scale(1.1)}100%{opacity:0;transform:translate(-50%,-65px) scale(.9)}}
@keyframes combat-spark{0%{opacity:0;transform:scale(.2) rotate(-20deg)}15%{opacity:1}100%{opacity:0;transform:scale(2.2) rotate(20deg)}}
@keyframes combat-ring{0%{opacity:1;transform:scale(.1)}100%{opacity:0;transform:scale(2.5)}}
@keyframes combat-impact-word{0%{transform:scale(.3) rotate(-10deg)}45%{transform:scale(1.35) rotate(6deg)}100%{transform:scale(1)}}
@keyframes combat-shake{0%,100%{transform:none}20%,60%{transform:translateX(-4px)}40%,80%{transform:translateX(4px)}}
@keyframes combat-winner{from{transform:scale(.94);filter:brightness(1.8)}to{transform:none;filter:none}}
/* Album shows lifetime discoveries and current playable copies separately. */
.album-progress{display:flex;align-items:center;gap:30px;border-block:1px solid var(--line);padding:25px 0;margin:5px 0 28px}
.album-progress strong{font:800 55px/1 var(--display);color:var(--green)}
.album-progress strong>span{font-size:28px;color:var(--muted)}
.album-progress>div>p{font-size:8px;letter-spacing:1.4px;margin:7px 0 0;color:var(--muted)}
.album-progress-track{flex:1;max-width:650px}
.album-progress progress{display:block;width:100%;height:10px;accent-color:var(--green)}
.album-progress-track>p{letter-spacing:0!important;font-size:10px!important}
.album-progress>a{font-size:11px;margin-left:auto}
.album-filters>label:first-child{grid-column:auto}
.album-club{padding:10px 0 24px}
.album-club-heading{display:flex;align-items:baseline;gap:20px;justify-content:space-between;border-bottom:1px solid var(--line);margin-bottom:22px;padding-bottom:10px}
.album-club-heading>h2{font:800 36px var(--display);margin:0}
.album-club-heading>p{font-size:10px;color:var(--muted);margin:0}
.album-slot-caption{font-size:9px;color:var(--muted);display:flex;justify-content:space-between;gap:6px;margin:12px 0 0}
.album-slot-caption>span{color:var(--green);font-size:8px}
.album-locked-card{--card-accent:#a3bd91;position:relative;aspect-ratio:240/355;overflow:hidden;border:1px dashed var(--card-accent);border-radius:15px 15px 25px 25px;background:linear-gradient(135deg,#ffffff08,#0d1712);display:flex;flex-direction:column;justify-content:space-between;text-align:center;padding:16px 14px;color:var(--muted)}
.album-locked-card.rarity-rare{--card-accent:#6089a5}.album-locked-card.rarity-epic{--card-accent:#8c6aaa}.album-locked-card.rarity-legendary{--card-accent:#a39360}
.album-lock-rarity{text-transform:uppercase;letter-spacing:2px;font-size:9px;color:var(--card-accent)}
.album-locked-card>div:last-child{position:relative;z-index:1;background:linear-gradient(0deg,#132019,transparent)}
.album-locked-card h3{font:800 29px/1.05 var(--display);color:#b1c0ac;margin:5px 0 12px}
.album-locked-card p{font-size:8px;margin:0;color:var(--card-accent)}
.album-locked-card small{font-size:7px;letter-spacing:1.4px}
.album-silhouette{position:absolute;inset:15% 0 20%;overflow:hidden;opacity:.65}
.album-silhouette i{position:absolute;width:30%;aspect-ratio:.9;background:#40533d;border-radius:45% 45% 40% 40%;left:35%;top:5%}
.album-silhouette b{position:absolute;width:85%;height:90%;background:#32452f;border-radius:50% 50% 0 0;left:7.5%;top:47%}
.album-silhouette>span{position:absolute;top:45%;left:0;right:0;font:800 70px/1 var(--display);color:#78886c}
.album-note{max-width:650px;font-size:11px;color:var(--muted);margin-top:0}
@media(max-width:700px){.combat-screen{padding-inline:0}.combat-intro h1{font-size:48px}.combat-round{margin-bottom:18px;min-height:90px}.combat-round>strong{font-size:32px}.combat-round>span,.combat-round>small{font-size:8px}.combat-stage{gap:22px;padding:10px 0 22px}.battle-sides>.combat-fighter{width:calc(50% - 11px);flex-basis:calc(50% - 11px)}.combat-impact{width:60px!important;height:60px;top:52%}.combat-impact-word{font-size:26px;min-width:40px;height:40px}.combat-impact i,.combat-impact b{inset:-20px}.is-impacting .combat-impact-word{font-size:35px}.combat-energy{margin-bottom:12px}.combat-energy>div{font-size:7px}.combat-energy strong{font-size:23px}.combat-energy progress{height:7px}.combat-fighter .side-label{font-size:7px;letter-spacing:1px}.combat-damage{font-size:48px}.combat-card-back>strong{font-size:95px}.combat-card-back>small{font-size:11px}.combat-card-back>span{font-size:6px}.combat-controls>p{font-size:9px;max-width:280px}.combat-replay-note{font-size:9px}.combat-conclusion h1{font-size:48px}.combat-conclusion .result-actions>.combat-replay{width:auto}.album-progress{gap:14px;flex-wrap:wrap;padding:19px 0}.album-progress strong{font-size:44px}.album-progress strong>span{font-size:23px}.album-progress-track{min-width:160px}.album-progress>a{margin-left:0;font-size:10px}.album-progress-track>p{font-size:9px!important}.album-filters{grid-template-columns:1fr 1fr}.album-club-heading>h2{font-size:29px}.album-club-heading>p{font-size:8px}.album-locked-card{padding:13px 10px;border-radius:12px 12px 20px 20px}.album-locked-card h3{font-size:24px;margin-bottom:9px}.album-lock-rarity{font-size:7px;letter-spacing:1px}.album-locked-card small{font-size:6px;letter-spacing:.8px}.album-slot-caption{display:block;font-size:8px;line-height:1.7}.album-slot-caption>span{display:block;font-size:7px}.album-club .card-grid{margin-bottom:14px}}
@media(prefers-reduced-motion:reduce){.combat-screen *{animation:none!important;transition:none!important}.combat-replay{display:none!important}}
.cg-main:has(.combat-screen){padding-top:15px}.combat-intro{display:none!important}.combat-round{min-height:66px;padding:8px 12px;margin-bottom:8px}.combat-round>strong{font-size:31px}.combat-stage{padding-top:3px;padding-bottom:15px;margin-top:3px}.battle-sides>.combat-fighter{width:clamp(165px,25vh,225px);flex:0 1 clamp(165px,25vh,225px)}.combat-fighter .side-label{margin-bottom:5px}.combat-energy{margin-bottom:9px}.combat-controls{margin-top:5px}.combat-controls>p{margin:5px auto}.combat-conclusion{scroll-margin-top:20px}@media(max-width:700px){.combat-intro{display:none!important}.combat-round{min-height:65px;margin-bottom:8px;padding:8px}.combat-round>strong{font-size:27px}.combat-stage{padding:3px 0 12px;gap:22px}.battle-sides>.combat-fighter{width:calc(50% - 11px);flex-basis:calc(50% - 11px)}.combat-controls{margin-top:5px}.combat-energy{margin-bottom:8px}}
