.effects-layer{position:fixed;inset:0;z-index:1000;pointer-events:none;overflow:visible;contain:strict}.effects-layer *{pointer-events:none}.fx-mote,.fx-ring,.fx-projectile,.fx-swing,.fx-glyph,.fx-number{position:absolute;pointer-events:none;will-change:transform,opacity}.fx-mote{display:block;border-radius:50%;background:var(--fx-color);box-shadow:0 0 7px var(--fx-color)}.fx-mote.leaf{border-radius:90% 0 90% 0;box-shadow:none}.fx-mote.diamond,.fx-mote.spark{border-radius:0;clip-path:polygon(50% 0,65% 35%,100% 50%,65% 65%,50% 100%,35% 65%,0 50%,35% 35%)}.fx-mote.drop{border-radius:80% 0 80% 80%}.fx-mote.rock{border-radius:1px;box-shadow:none}.fx-mote.wind{width:15px!important;height:2px!important;border-radius:50%;opacity:.5}.fx-mote.spore{background:transparent;border:1px solid var(--fx-color);box-shadow:0 0 5px var(--fx-color)}.fx-mote.firefly{background:#fff3b7;box-shadow:0 0 12px 3px #fceaaa66}.fx-ring{border:1.5px solid var(--fx-color);border-radius:50%;box-shadow:0 0 10px color-mix(in srgb,var(--fx-color) 35%,transparent)}.fx-ring.shield-aura{clip-path:polygon(50% 0,90% 20%,86% 67%,50% 100%,14% 67%,10% 20%);border-radius:0;border-width:3px;background:color-mix(in srgb,var(--fx-color) 9%,transparent)}.fx-ring.growth{border-style:dashed;border-width:2px}.fx-ring.halo{border-width:1px;box-shadow:0 0 18px 5px #ffebaa20,inset 0 0 16px #ffebaa22}.fx-ring.sunburst{border-style:dotted;border-width:5px}.fx-ring.impact{border-width:3px;transform:scaleY(.5)}.fx-projectile{width:12px;height:12px;border-radius:50%;background:var(--fx-color);box-shadow:0 0 10px 3px color-mix(in srgb,var(--fx-color) 60%,transparent)}.fx-fireball{border-radius:65% 50% 50% 65%;background:radial-gradient(circle at 65% 50%,#fff5c0,#ffc06b 40%,#f37b43 75%);box-shadow:-8px 0 12px #f5a45577,-16px 0 17px #f0944233}.fx-flare{width:20px;height:20px;background:radial-gradient(#fff9ce,#ffd28a 35%,#e9975077 70%);box-shadow:0 0 22px 6px #ffc47977}.fx-wind{width:28px;height:14px;background:transparent;border-top:2px solid #edd5a5;border-bottom:1px solid #edd5a599;border-radius:50%;box-shadow:none}.fx-dart{width:19px;height:5px;border-radius:80% 30% 30% 80%;background:linear-gradient(90deg,#d9b7f155,#e2caff);box-shadow:-8px 0 9px #bc8be366}.fx-spores{width:17px;height:17px;background:radial-gradient(#e4c8f388,#a779cb44,transparent 75%);box-shadow:0 0 14px #bb8cda77}.fx-glyph{font:40px Georgia,serif;color:var(--fx-color);text-shadow:0 0 12px var(--fx-color)}.fx-projectile.fx-glyph{width:12px;height:12px;border-radius:0;background:transparent;border:1.5px solid var(--fx-color);box-shadow:0 0 10px #ead4a555}.fx-swing{width:65px;height:65px;border-radius:50%;border-right:4px solid #fff0be;border-top:2px solid #d8bc7b77;filter:drop-shadow(0 0 6px #f2cf8a66)}.fx-beam{position:fixed;overflow:visible}.fx-number{font:800 15px 'Manrope',system-ui,sans-serif;white-space:nowrap;text-shadow:0 2px 3px #081416,0 0 5px #081416;color:#ffd09b}.fx-number.heal{color:#c4e7a2}.tower.tower-hit{animation:tower-hit .2s ease-out}.relic-demo{display:flex;justify-content:space-around;align-items:center;height:106px;margin:3px 0 0;background:radial-gradient(ellipse at 25% 50%,#d3ba7810,transparent 60%);position:relative}.relic-demo-source{width:105px;height:100px;position:relative;display:grid;place-items:center;--color:#dbc890}.relic-demo-source .detail-art{margin:0;width:80px;height:88px}.relic-demo-target{display:grid;place-items:center;width:58px;height:67px;border:1px solid #87966d44;border-radius:28px 28px 5px 5px;background:#15232088;color:#8c9e7e;position:relative}.relic-demo-target .icon{width:34px;height:38px}.relic-demo-target:after{content:'ЦЕЛЬ';position:absolute;bottom:-17px;font-size:11px;letter-spacing:1px;color:#7e9076}.demo-button{display:block;margin:10px auto 16px;padding:8px 13px;border:1px solid #b9a16955;border-radius:20px;background:#d4b87b0c;color:#d8c18a;font-size:11px;min-height:36px}.topbar>.icon-btn{width:29px;height:29px;flex-shrink:0}.topbar .wallet{margin-left:auto}.arena-tools .icon-btn[data-action=sound]{display:none}.slot .relic-storm{animation:crystal-idle 3.4s ease-in-out infinite}.slot .relic-ward{animation:ward-idle 3.6s ease-in-out infinite}.slot .relic-fang{animation:fang-idle 3s ease-in-out infinite;transform-origin:50% 20%}.slot .relic-mushroom{animation:mushroom-idle 3.8s ease-in-out infinite;transform-origin:50% 80%}.slot .relic-lantern{animation:lantern-idle 3.2s ease-in-out infinite}.slot .relic-rune{animation:rune-idle 4s ease-in-out infinite}.casting-ember .relic,.casting-sun .relic{animation:cast-fire .48s ease-out!important}.casting-bellows .relic{animation:cast-bellows .5s ease-out!important}.casting-seed .relic{animation:cast-seed .65s ease-out!important}.casting-ward .relic{animation:cast-ward .6s ease-out!important}.casting-coil .relic,.casting-storm .relic{animation:cast-storm .45s ease-out!important}.casting-fang .relic{animation:cast-fang .4s ease-out!important}.casting-mushroom .relic{animation:cast-mushroom .65s ease-out!important}.casting-hammer .relic{animation:cast-hammer .55s cubic-bezier(.2,.9,.2,1)!important;transform-origin:32% 75%}.casting-lantern .relic{animation:cast-lantern .7s ease-out!important}.casting-rune .relic{animation:cast-rune .65s ease-out!important}
@keyframes cast-hammer{0%{transform:rotate(0)}30%{transform:translate(-5px,-8px) rotate(-45deg)}48%{transform:translate(6px,7px) rotate(35deg)}65%{transform:translate(-1px,-2px) rotate(-5deg)}100%{transform:none}}@keyframes cast-fire{25%{transform:translateY(-6px) scale(.82,1.28)}65%{transform:translateY(2px) scale(1.13,.9)}100%{transform:none}}@keyframes cast-bellows{30%{transform:scale(.7,1.09) rotate(-5deg)}60%{transform:scale(1.12,.93) rotate(4deg)}100%{transform:none}}@keyframes cast-seed{25%{transform:scale(.9) rotate(-8deg)}55%{transform:translateY(-5px) scale(1.16) rotate(5deg)}100%{transform:none}}@keyframes cast-ward{30%{transform:translateY(-3px) scale(1.16)}65%{transform:scale(.95)}100%{transform:none}}@keyframes cast-storm{20%{transform:translateY(-5px) rotate(-8deg)}45%{transform:translate(3px,-3px) rotate(6deg)}70%{transform:translate(-2px,1px)}100%{transform:none}}@keyframes cast-fang{25%{transform:translate(-4px,2px) rotate(-18deg)}50%{transform:translate(8px,-5px) rotate(12deg)}100%{transform:none}}@keyframes cast-mushroom{25%{transform:scale(1.18,.75)}55%{transform:translateY(-5px) scale(.9,1.2)}100%{transform:none}}@keyframes cast-lantern{30%{transform:rotate(-12deg) translateY(-3px)}60%{transform:rotate(10deg)}100%{transform:none}}@keyframes cast-rune{40%{transform:translateY(-7px) rotate(12deg) scale(1.12)}100%{transform:none}}@keyframes tower-hit{35%{transform:translateX(2px)}65%{transform:translateX(-1px)}100%{transform:none}}@keyframes crystal-idle{50%{transform:translateY(-4px) rotate(4deg)}}@keyframes ward-idle{50%{transform:scale(1.03)}}@keyframes fang-idle{50%{transform:rotate(5deg) translateY(-1px)}}@keyframes mushroom-idle{50%{transform:scale(1.04,.95)}}@keyframes lantern-idle{25%{transform:rotate(-4deg)}50%{transform:translateY(-2px)}75%{transform:rotate(4deg)}}@keyframes rune-idle{50%{transform:translateY(-3px) rotate(-3deg)}}
.sheet-close{z-index:5}
@media(prefers-reduced-motion:reduce){[class*=casting-] .relic,.tower.tower-hit{animation:none!important}.effects-layer *{will-change:opacity}}
/* Per-relic effects (effects.mjs RELIC_FX). */
.fx-smoke,.fx-flame,.fx-dome,.fx-bite,.fx-puddle,.fx-cloud,.fx-impact-star,.fx-rune-circle,.fx-sunburst,.fx-explosion{position:absolute;pointer-events:none;will-change:transform,opacity}
.fx-smoke{width:18px;height:18px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--fx-color) 70%,transparent),transparent 70%)}
.fx-flame{width:12px;height:22px;border-radius:50% 50% 45% 45%/70% 70% 30% 30%;background:radial-gradient(ellipse at 50% 80%,#fff4c2,#ffb54d 45%,#f0662e 80%,transparent);transform-origin:50% 100%}
.fx-fireball{width:22px;height:18px;border-radius:65% 45% 45% 65%;background:radial-gradient(circle at 70% 50%,#fffbe0,#ffc76b 35%,#f3743c 70%,#c2401f);box-shadow:-6px 0 10px #f5a455aa,-14px 0 16px #f0944255,0 0 12px #ffb46b88}
.fx-sunball{width:24px;height:24px;border-radius:50%;background:radial-gradient(circle at 60% 45%,#fffde8,#ffe08a 30%,#ff9a3d 62%,#d4501f);box-shadow:0 0 22px 8px #ffb45c99,-12px 0 24px #ff8a3d66}
.fx-dart{width:24px;height:6px;border-radius:80% 30% 30% 80%;background:linear-gradient(90deg,#d9b7f122,#f0e2ff);box-shadow:-9px 0 10px #bc8be399}
.fx-glyph-orb{width:18px;height:18px;border:2px solid #fff1cc;border-radius:3px;background:radial-gradient(circle,#fff6dc,#ead4a566 60%);box-shadow:0 0 16px 4px #ead4a5aa;rotate:45deg}
@keyframes fx-flicker{from{}to{}}
.fx-dome{width:86px;height:86px;border-radius:50%;border:2px solid var(--fx-color);background:radial-gradient(circle at 40% 30%,#ffffff2a,color-mix(in srgb,var(--fx-color) 14%,transparent) 55%,transparent 70%),repeating-conic-gradient(from 0deg,color-mix(in srgb,var(--fx-color) 22%,transparent) 0 8deg,transparent 8deg 30deg);box-shadow:0 0 18px color-mix(in srgb,var(--fx-color) 45%,transparent),inset 0 0 14px color-mix(in srgb,var(--fx-color) 40%,transparent)}
.fx-bite{width:9px;height:16px;background:linear-gradient(#ffffff,#e9dcff);clip-path:polygon(0 0,100% 0,50% 100%)}
.fx-puddle{width:34px;height:9px;border-radius:50%;background:radial-gradient(ellipse,color-mix(in srgb,var(--fx-color) 75%,transparent),transparent 70%)}
.fx-cloud{width:30px;height:30px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--fx-color) 85%,transparent),color-mix(in srgb,var(--fx-color) 35%,transparent) 45%,transparent 70%)}
.fx-impact-star{width:40px;height:40px;background:#fff6dc;clip-path:polygon(50% 0,60% 38%,100% 50%,60% 62%,50% 100%,40% 62%,0 50%,40% 38%)}
.fx-rune-circle{width:76px;height:76px;border:1.5px solid var(--fx-color);border-radius:50%;display:grid;place-items:center;font:600 13px/1 Georgia,serif;letter-spacing:4px;color:var(--fx-color);text-shadow:0 0 6px var(--fx-color);box-shadow:0 0 14px #ead4a544,inset 0 0 10px #ead4a533}
.fx-ring.echo{border-width:1.5px;border-style:double}
.fx-sunburst{width:96px;height:96px;border-radius:50%;background:repeating-conic-gradient(#ffd98a66 0 6deg,transparent 6deg 22deg);-webkit-mask:radial-gradient(circle,transparent 22%,#000 30%,transparent 70%);mask:radial-gradient(circle,transparent 22%,#000 30%,transparent 70%)}
.fx-explosion{width:80px;height:80px;border-radius:50%;background:radial-gradient(circle,#fffbe6,#ffd27a 25%,#ff8a3d 50%,#c2401f99 68%,transparent 72%)}

.tower.tower-slam{animation:tower-slam .3s ease-out}
@keyframes tower-slam{15%{transform:translate(3px,2px)}35%{transform:translate(-3px,-1px)}55%{transform:translate(2px,1px)}75%{transform:translate(-1px,0)}100%{transform:none}}
@media(prefers-reduced-motion:reduce){.tower.tower-slam{animation:none!important}.fx-fireball,.fx-sunball{animation:none}}
/* Battle finale (effects.mjs showBattleFinale) and result meters. */
.arena.duel .duel-towers{transition:transform .55s cubic-bezier(.2,.8,.2,1)}
.arena.duel.finale-zoom .duel-towers{transform:scale(1.07)}
.arena.duel.zoom-theirs .duel-towers{transform-origin:78% 55%}
.arena.duel.zoom-mine .duel-towers{transform-origin:22% 55%}
.tower.tower-crumble{animation:tower-crumble 1.6s ease-in .1s forwards}
.tower.tower-crumble .slot{transition:filter .35s,opacity .35s;filter:grayscale(1) brightness(.45);opacity:.75}
.tower.tower-crumble .slot:nth-child(2){transition-delay:.1s}.tower.tower-crumble .slot:nth-child(3){transition-delay:.2s}.tower.tower-crumble .slot:nth-child(4){transition-delay:.3s}.tower.tower-crumble .slot:nth-child(5){transition-delay:.4s}.tower.tower-crumble .slot:nth-child(6){transition-delay:.5s}
@keyframes tower-crumble{0%{transform:none}8%{transform:translateX(3px)}16%{transform:translateX(-3px)}24%{transform:translateX(2px) rotate(.4deg)}32%{transform:translateX(-1px)}100%{transform:translateY(18px) rotate(-3deg)}}
.tower.tower-victory{animation:tower-victory 1.6s ease-out .2s both}
@keyframes tower-victory{0%{filter:none}35%{filter:drop-shadow(0 0 20px #ffd98a) brightness(1.2)}100%{filter:drop-shadow(0 0 8px #ffd98a88) brightness(1.06)}}
.tower.tower-draw{animation:tower-slam .5s ease-out}
.run-result-meters .gained em,.run-result-meters .gained b{display:inline-block}
.run-result-meters [data-meter="trophies"].gained em{animation:meter-pop .9s ease-out .3s both}
.run-result-meters [data-meter="gold"].gained b{animation:meter-pop .7s ease-out .5s both}
@keyframes meter-pop{0%{transform:translateY(10px) scale(.5);opacity:0}55%{transform:translateY(-6px) scale(1.3);opacity:1;text-shadow:0 0 10px #ffd98a}100%{transform:none;opacity:1}}
.run-result-meters .lost .icon{animation:heart-crack .8s ease-out .2s both}
.run-result-meters .lost em{display:inline-block;animation:meter-drop .8s ease-in .35s both}
@keyframes heart-crack{0%{transform:none}20%{transform:rotate(-14deg) scale(1.15);color:#ff8f7a}40%{transform:rotate(12deg)}60%{transform:rotate(-6deg) scale(.9)}100%{transform:none;color:#e09a85}}
@keyframes meter-drop{0%{transform:translateY(-8px);opacity:0}60%{transform:translateY(3px);opacity:1}100%{transform:none;opacity:1}}
@media(prefers-reduced-motion:reduce){.tower.tower-crumble,.tower.tower-victory,.tower.tower-draw,.run-result-meters *{animation:none!important}.arena.duel .duel-towers{transition:none}}
/* Earthquake: a short low rumble of the whole duel scene once a second from 15 s. No flash. */
.duel.quaking{animation:quake .5s ease-out}
@keyframes quake{0%,100%{transform:translate(0,0)}15%{transform:translate(-3px,1px)}30%{transform:translate(3px,-1px)}45%{transform:translate(-2px,1px)}60%{transform:translate(2px,0)}80%{transform:translate(-1px,0)}}
@media(prefers-reduced-motion:reduce){.duel.quaking{animation:none}}
/* A frozen relic in battle: an icy rim and frost tint; its cooldown bar stands still. */
.duel .slot.frozen{box-shadow:inset 0 0 0 2px #cfe8ffcc,inset 0 0 20px #9fd8f099;background-image:linear-gradient(#cfe8ff2e,#cfe8ff2e)}
.duel .slot.frozen .cooldown{background:#cfe8ff}
/* The bellows' explosion: a short orange burst inside the struck enemy slot. */
.blast{animation:blast-shake .45s ease-out}
.crit-burst{position:absolute;left:50%;top:18%;z-index:4;pointer-events:none;white-space:nowrap;font-size:13px;font-weight:800;line-height:1;letter-spacing:.04em;color:#fff2b8;text-shadow:0 1px 0 #3a2410,0 0 6px #ffb052;transform:translate(-50%,0);animation:crit-burst .7s ease-out forwards}
@keyframes crit-burst{0%{transform:translate(-50%,6px) scale(.6);opacity:0}25%{transform:translate(-50%,0) scale(1.15);opacity:1}100%{transform:translate(-50%,-14px) scale(1);opacity:0}}
.cast-mark{position:absolute;right:6%;top:8%;z-index:4;pointer-events:none;font-size:13px;font-weight:800;line-height:1;color:#e6dcff;text-shadow:0 1px 0 #2a2140,0 0 6px #9b84e8;animation:cast-mark .8s ease-out forwards}
@keyframes cast-mark{0%{transform:scale(.5);opacity:0}20%{transform:scale(1.2);opacity:1}100%{transform:translateY(-12px) scale(1);opacity:0}}
.feed-cost{color:#c9a0f0;font-weight:700}
.feed-leech{color:#e58a92;font-weight:700}
.fx-drop{position:absolute;display:block;width:7px;height:9px;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;background:var(--fx-color,#e0505c)}
.feed-crit{color:#ffd27a;font-weight:700}
.blast-burst{position:absolute;inset:8%;border-radius:50%;pointer-events:none;z-index:3;background:radial-gradient(circle,#fff4c2 0,#ffb052 30%,#f0602e88 55%,transparent 72%);animation:blast-burst .55s ease-out forwards}
@keyframes blast-burst{0%{transform:scale(.2);opacity:1}60%{opacity:.85}100%{transform:scale(1.15);opacity:0}}
@keyframes blast-shake{20%{transform:translate(-2px,1px)}40%{transform:translate(2px,-1px)}60%{transform:translate(-1px,0)}}
@media (prefers-reduced-motion:reduce){.blast{animation:none}.blast-burst{animation:none;opacity:0}.crit-burst{animation:none;opacity:0}.cast-mark{animation:none;opacity:0}}
/* In battle relics hold still between casts: idle loops on SVG parts restyle on the main thread every frame. Casts still play. */
.duel .slot .relic,.duel .slot .relic *{animation:none}