:root{--frame-base:#3a2f5f;--frame-shadow:#0d0a1a;--frame-highlight:#5a4a8a;--frame-deep-shadow:#4b00bd;--frame-accent:#a970ff}.card-frame[data-rarity=common]{--frame-base:#8a8f9e;--frame-highlight:#c2c4cc;--frame-shadow:#585d6a;--frame-deep-shadow:#353840;--frame-accent:#8a8f9e}.card-frame[data-rarity=uncommon]{--frame-base:#5faa7d;--frame-highlight:#a1cdb3;--frame-shadow:#386a4d;--frame-deep-shadow:#1e3929;--frame-accent:#5faa7d}.card-frame[data-rarity=rare]{--frame-base:#4da3ff;--frame-highlight:#b3d8ff;--frame-shadow:#006fe6;--frame-deep-shadow:#004a9a;--frame-accent:#4da3ff}.card-frame[data-rarity=epic]{--frame-base:#a970ff;--frame-highlight:#d7bcff;--frame-shadow:#6c0aff;--frame-deep-shadow:#4b00bd;--frame-accent:#a970ff}.card-frame[data-rarity=legendary]{--frame-base:#ffc857;--frame-highlight:#ffe9bd;--frame-shadow:#f0a000;--frame-deep-shadow:#a36d00;--frame-accent:#ffc857}.card-art-shell{isolation:isolate;background:var(--surface-inset);border-radius:12px}.card-art-vignette{border-radius:inherit;pointer-events:none;z-index:1;mix-blend-mode:multiply;background:radial-gradient(70% 65% at 50% 48%,#0000 30%,#0a0f1e59 65%,#050512a6 100%);position:absolute;inset:0}.card-stats-divider{opacity:.5;background:linear-gradient(90deg,#0000 0%,#b18eff38 12%,#b18eff42 88%,#0000 100%);height:.04em;margin:.12em 0 .17em}.card-stats-grid-divider{opacity:.5;background:linear-gradient(#0000 0%,#b18eff38 16% 84%,#0000 100%);width:.05em;position:absolute;top:.06em;bottom:.06em;left:50%;transform:translate(-50%)}.card-stats-grid-gem{background:#381a69;border:1px solid #aa77ff40;width:.24em;height:.24em;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)rotate(45deg);box-shadow:0 0 .12em #2b0088}.card-core-glow{filter:drop-shadow(0 0 .12em #e8dfff)}@keyframes card-core-pulse{0%,to{opacity:.55;transform:scale(1)}50%{opacity:.95;transform:scale(1.18)}}.card-core-pulse{transform-origin:50%;transform-box:fill-box;animation:2.2s ease-in-out infinite card-core-pulse}.card-stage-gems{width:.64em;height:2.2em;top:15.8%;left:91.92%;transform:translate(-50%)}.card-stage-gem{filter:drop-shadow(0 0 .1em #ffde6ea6)drop-shadow(0 0 .18em #f5a52859);background:radial-gradient(circle at 28% 28%,#fff 0%,#fff8c8 20%,#ffde6e 45%,#f5a528 75%,#8a5214 100%);width:.38em;height:.38em;position:absolute;left:50%;transform:translate(-50%,-50%)rotate(45deg)}.card-finish--holo{background:linear-gradient(135deg,#67e8f91a 0%,#0000 40%,#e879f91a 100%)}.card-finish--darkholo{background:linear-gradient(135deg,#e879f92e 0%,#0000 35%,#fbbf242e 100%)}.card-frame-finish{pointer-events:none;-webkit-mask-mode:alpha;position:absolute;inset:0;overflow:hidden;-webkit-mask:url(/frame.svg) 0 0/100% 100% no-repeat;-webkit-mask-source-type:alpha;mask:url(/frame.svg) 0 0/100% 100% no-repeat alpha}.card-frame-finish--holo{mix-blend-mode:overlay;background:linear-gradient(120deg,#ef444480 0%,#facc1580 11%,#4ade8080 22%,#60a5fa80 33%,#0000 40%,#e879f980 100%)}.card-frame-finish--darkholo{mix-blend-mode:multiply;contain:paint}.card-frame-finish--darkholo:before{content:"";inset-inline:0;will-change:transform;background:linear-gradient(#0000 0% 20%,#32195a4d 30%,#32195ab3 45%,#19375fb3 55%,#5a2d19b3 65%,#32195ab3 75%,#32195a4d 90%,#0000 100%) 0 0/100% 25% repeat-y;height:1600%;animation:16s linear infinite darkholo-flow;position:absolute;top:0}@keyframes darkholo-flow{0%{transform:translate(0,0)}to{transform:translateY(-75%)}}.card-selected{z-index:1;transform:translateY(-.32em)scale(1.03)}.card-selected:hover{transform:translateY(-.5em)scale(1.05)}.card-selected:active{transform:translateY(-.18em)scale(1)}.card-selected-badge{color:#fffffffa;background:radial-gradient(circle at 30% 30%, #ffffff8c 0%, transparent 45%), var(--badge-bg,#a970ff);width:1.5em;height:1.5em;box-shadow:0 0 .18em #ffffff8c, 0 0 .55em var(--badge-bg,#a970ff), 0 0 1.1em var(--badge-bg,#a970ff), 0 .06em .18em #00000073;text-shadow:0 .04em .06em #00000080;z-index:70;pointer-events:none;transform-origin:50%;border:.1em solid #ffffffeb;border-radius:9999px;justify-content:center;align-items:center;font-size:1em;font-weight:800;line-height:1;animation:2.6s ease-in-out infinite card-selected-pulse;display:inline-flex;position:absolute;top:.55em;left:.55em}.card-selected-badge>svg{stroke-width:3px;width:.9em;height:.9em}@keyframes card-selected-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}@keyframes card-hp-heal-pulse{0%{text-shadow:0 0 #6ee7b700;transform:scale(1)}22%{text-shadow:0 0 9px #6ee7b7fa,0 0 20px #34d399cc;transform:scale(1.3)}55%{text-shadow:0 0 6px #6ee7b7a6,0 0 14px #34d39973;transform:scale(1.1)}to{text-shadow:0 0 #6ee7b700;transform:scale(1)}}.card-hp-heal-pulse{transform-origin:50%;will-change:transform;animation:.4s ease-out .25s backwards card-hp-heal-pulse}@keyframes card-atk-buff-pulse{0%{text-shadow:0 0 #6ee7b700;transform:scale(1)}22%{text-shadow:0 0 9px #6ee7b7fa,0 0 20px #34d399cc;transform:scale(1.3)}55%{text-shadow:0 0 6px #6ee7b7a6,0 0 14px #34d39973;transform:scale(1.1)}to{text-shadow:0 0 #6ee7b700;transform:scale(1)}}.card-atk-buff-pulse{transform-origin:50%;will-change:transform;animation:.4s ease-out .25s backwards card-atk-buff-pulse}@keyframes card-atk-fire-ring-enter{0%{opacity:0;border-color:#fed7aa00;transform:translate(-50%,-50%)translate(-110%)scale(.3);box-shadow:0 0 #fb923c00}40%{opacity:1;border-color:#fed7aa;box-shadow:0 0 14px 3px #f97316cc,0 0 24px 5px #ea580c73,inset 0 0 8px #fdba74b3}to{opacity:.78;border-color:#fb923cd9;transform:translate(-50%,-50%)scale(1);box-shadow:0 0 8px 1px #fb923c8c,inset 0 0 6px #fb923c73}}@keyframes card-atk-fire-ring{0%{opacity:.78;border-color:#fb923cd9;transform:translate(-50%,-50%)scale(1);box-shadow:0 0 8px 1px #fb923c8c,inset 0 0 6px #fb923c73}50%{opacity:1;border-color:#fed7aa;transform:translate(-50%,-50%)scale(1.12);box-shadow:0 0 18px 3px #f97316d9,0 0 32px 6px #ea580c73,inset 0 0 10px #fdba74b3}to{opacity:.78;border-color:#fb923cd9;transform:translate(-50%,-50%)scale(1);box-shadow:0 0 8px 1px #fb923c8c,inset 0 0 6px #fb923c73}}@keyframes card-atk-fire-ring-exit{0%{opacity:1;border-width:2px;border-color:#fed7aa;transform:translate(-50%,-50%)scale(1);box-shadow:0 0 14px 2px #fb923cbf,inset 0 0 8px #fb923c99}40%{opacity:1;border-width:3px;border-color:#fffbeb;transform:translate(-50%,-50%)scale(.5);box-shadow:0 0 28px 6px #fed7aa,0 0 56px 12px #f97316bf,inset 0 0 18px #ffedd5e6}70%{opacity:.55;border-width:2px;transform:translate(-50%,-50%)scale(.2);box-shadow:0 0 12px 3px #f973168c,inset 0 0 6px #fb923c73}to{opacity:0;border-width:1px;border-color:#fb923c00;transform:translate(-50%,-50%)scale(0);box-shadow:0 0 #fb923c00}}.card-atk-fire-ring{pointer-events:none;will-change:transform, opacity, box-shadow;border:2px solid #fb923cd9;border-radius:50%;position:absolute}.card-atk-fire-ring--entering{animation:.6s ease-out forwards card-atk-fire-ring-enter}.card-atk-fire-ring--active{animation:1.4s ease-in-out infinite card-atk-fire-ring}.card-atk-fire-ring--exiting{animation:.25s cubic-bezier(.5,0,.85,.45) forwards card-atk-fire-ring-exit}@keyframes card-atk-debuff-pulse{0%{text-shadow:0 0 #f43f5e00;transform:scale(1)}22%{text-shadow:0 0 9px #f43f5efa,0 0 20px #e11d48cc;transform:scale(1.3)}55%{text-shadow:0 0 6px #f43f5ea6,0 0 14px #e11d4873;transform:scale(1.1)}to{text-shadow:0 0 #f43f5e00;transform:scale(1)}}.card-atk-debuff-pulse{transform-origin:50%;will-change:transform;animation:.4s ease-out .25s backwards card-atk-debuff-pulse}@keyframes card-armor-buff-pulse{0%{text-shadow:0 0 #ab54f400;transform:scale(1)}22%{text-shadow:0 0 9px #cf8efffa,0 0 20px #ab54f4cc;transform:scale(1.3)}55%{text-shadow:0 0 6px #cf8effa6,0 0 14px #ab54f473;transform:scale(1.1)}to{text-shadow:0 0 #ab54f400;transform:scale(1)}}.card-armor-buff-pulse{transform-origin:50%;will-change:transform;animation:.4s ease-out .25s backwards card-armor-buff-pulse}@keyframes card-water-badge-pulse{0%,to{filter:drop-shadow(0 0 4px #22d3ee8c);transform:scale(1)}50%{filter:drop-shadow(0 0 7px #22d3eebf);transform:scale(1.08)}}@keyframes card-water-badge-enter{0%{opacity:0}to{opacity:1}}.card-water-badge{transform-origin:50%;will-change:transform, filter;animation:2.4s ease-in-out infinite card-water-badge-pulse}.card-water-badge--entering{animation:.35s ease-out backwards card-water-badge-enter,2.4s ease-in-out infinite card-water-badge-pulse}@media (prefers-reduced-motion:reduce){.card-selected-badge,.card-hp-heal-pulse,.card-atk-buff-pulse,.card-atk-debuff-pulse,.card-armor-buff-pulse{animation:none}.card-atk-fire-ring,.card-atk-fire-ring--entering,.card-atk-fire-ring--active,.card-atk-fire-ring--exiting{opacity:.9;animation:none;transform:translate(-50%,-50%);box-shadow:0 0 10px 1px #fb923ca6,inset 0 0 8px #fb923c8c}.card-atk-fire-ring--exiting{opacity:0}.card-water-badge{filter:drop-shadow(0 0 4px #22d3ee8c);animation:none}}.card-offscreen .card-frame-finish--darkholo:before,.card-offscreen .card-frame-shimmer:after{animation-play-state:paused}@media (prefers-reduced-motion:reduce){.card-frame-finish--darkholo,.card-frame-finish--darkholo:before,.card-frame-shimmer:after{animation:none}}.card-noise:before{content:"";border-radius:inherit;opacity:.03;pointer-events:none;z-index:50;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:128px 128px;position:absolute;inset:0;-webkit-mask:url(/frame.svg) 0 0/100% 100% no-repeat,linear-gradient(#fff,#fff) 50% 10.48%/86% 52.3% no-repeat;mask:url(/frame.svg) 0 0/100% 100% no-repeat,linear-gradient(#fff,#fff) 50% 10.48%/86% 52.3% no-repeat}.card-frame-shimmer{contain:paint;position:absolute;inset:0;overflow:hidden;-webkit-mask:url(/frame.svg) 0 0/100% 100% no-repeat,linear-gradient(#fff,#fff) 50% 10.48%/86% 52.3% no-repeat;mask:url(/frame.svg) 0 0/100% 100% no-repeat,linear-gradient(#fff,#fff) 50% 10.48%/86% 52.3% no-repeat}.card-frame-shimmer:after{content:"";inset-block:0;pointer-events:none;will-change:transform;background:linear-gradient(115deg,#0000 40%,#ffc85738 50%,#0000 60%);width:200%;animation:7s ease-in-out 1.5s infinite legendary-shimmer;position:absolute;left:0}@keyframes legendary-shimmer{0%{transform:translate(-75%)}to{transform:translate(25%)}}.card-skeleton{--skeleton-glow:var(--rarity-common-glow);--skeleton-rim:#ffffff0f;box-shadow:inset 0 0 0 1px var(--skeleton-rim), inset 0 0 24px #00000059, 0 0 10px var(--skeleton-glow), 0 6px 14px #00000080;z-index:50;will-change:opacity, transform;background:radial-gradient(70% 55% at 50% 30%,#ffffff09,#0000 65%),linear-gradient(160deg,#282a37f2 0%,#14161ef2 100%);border-radius:.75rem;transition:opacity .24s ease-out,transform .28s ease-out;position:absolute;inset:5%;overflow:hidden}.card-skeleton[data-rarity=uncommon]{--skeleton-glow:var(--rarity-uncommon-glow)}.card-skeleton[data-rarity=rare]{--skeleton-glow:var(--rarity-rare-glow)}.card-skeleton[data-rarity=epic]{--skeleton-glow:var(--rarity-epic-glow)}.card-skeleton[data-rarity=legendary]{--skeleton-glow:var(--rarity-legendary-glow)}.card-skeleton:before{content:"";aspect-ratio:1;filter:grayscale();opacity:.18;pointer-events:none;background:url(/illuviclash_logo_compact.png) 50%/contain no-repeat;width:90%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.card-skeleton:after{content:"";pointer-events:none;background:linear-gradient(110deg,#0000 38%,#ffffff12 50%,#0000 62%);animation:2.8s ease-in-out infinite card-skeleton-sweep;position:absolute;inset:-50%}.card-skeleton--hidden{opacity:0;pointer-events:none;transform:scale(.985)}@keyframes card-skeleton-sweep{0%{transform:translate(-35%)}to{transform:translate(35%)}}.card-reveal{opacity:0;will-change:opacity, transform;transition:opacity .28s ease-out,transform .32s ease-out;position:absolute;inset:0;transform:scale(.985)}.card-reveal--ready{opacity:1;transform:scale(1)}.card-reveal--instant{opacity:1;transition:none;transform:none}@media (prefers-reduced-motion:reduce){.card-skeleton:after{animation:none}.card-skeleton--hidden,.card-reveal,.card-reveal--ready{transition:opacity .12s linear;transform:none}}
