@import "https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&family=Newsreader:ital,opsz,wght@0,6..72,200..800;1,6..72,200..800&family=Noto+Serif+SC:wght@400;700&display=swap";:root{--bg-deep:#0c1324;--bg-halo:#191f31;--text-primary:#dce1fb;--text-dim:#cbc3d5;--accent-cyan:#00daf3;--accent-purple:#6a1b9a;--accent-amber:#f59e0b;--accent-green:#3ce36a;--card-bg:#070d1f;--glass-bg:#0c132473}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background-color:var(--bg-deep);color:var(--text-primary);min-height:100vh;font-family:Newsreader,Noto Serif SC,serif;line-height:1.7;overflow-x:hidden}body:before{content:"";opacity:.03;pointer-events:none;z-index:999;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='nf'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23nf)' opacity='0.05'/%3E%3C/svg%3E");width:100vw;height:100vh;position:fixed;top:0;left:0}.abyssal-gradient{background:radial-gradient(circle,#191f31 0%,#0c1324 100%)}.hard-light-cta{background:linear-gradient(45deg,#00daf3 0%,#005964 100%)}.ap-card-wrap{flex-direction:column;flex-shrink:0;align-items:center;gap:10px;display:flex}.ap-card{cursor:pointer;--faction-color:#7c3aed;width:300px;height:420px;transition:transform .5s cubic-bezier(.23,1,.32,1),filter .5s;position:relative}.ap-card:hover{transform:translateY(-12px)scale(1.04)perspective(700px)rotateY(-4deg)}.ap-bleed{background:var(--card-bg);z-index:0;border-radius:10px;position:absolute;inset:-10px}.cm{z-index:1;pointer-events:none;position:absolute}.cm:before,.cm:after{content:"";background:#fff3;position:absolute}.cm-tl{top:0;left:0}.cm-tl:before{width:7px;height:1px}.cm-tl:after{width:1px;height:7px}.cm-tr{top:0;right:0}.cm-tr:before{width:7px;height:1px;right:0}.cm-tr:after{width:1px;height:7px;right:0}.cm-bl{bottom:0;left:0}.cm-bl:before{width:7px;height:1px;bottom:0}.cm-bl:after{width:1px;height:7px;bottom:0;left:0}.cm-br{bottom:0;right:0}.cm-br:before{width:7px;height:1px;bottom:0;right:0}.cm-br:after{width:1px;height:7px;bottom:0;right:0}.ap-border{z-index:1;background:var(--faction-color);filter:blur(1.5px);opacity:.65;border-radius:8px;transition:opacity .4s,filter .4s;position:absolute;inset:0}.ap-card:hover .ap-border{opacity:1;filter:blur(3px)}.ap-shell{z-index:2;background:var(--card-bg);clip-path:polygon(0 10px,7px 3px,10px 0,calc(100% - 10px) 0,calc(100% - 7px) 3px,100% 10px,100% calc(100% - 10px),calc(100% - 7px) calc(100% - 3px),calc(100% - 10px) 100%,10px 100%,7px calc(100% - 3px),0 calc(100% - 10px));position:absolute;inset:2px}.ap-art{z-index:3;clip-path:polygon(0 7px,7px 0,calc(100% - 7px) 0,100% 7px,100% 100%,0 100%);height:56%;position:absolute;top:3px;left:3px;right:3px;overflow:hidden}.ap-art img{object-fit:cover;object-position:center 15%;width:100%;height:100%;transition:transform .6s cubic-bezier(.23,1,.32,1);display:block}.ap-card:hover .ap-art img{transform:scale(1.06)}.ap-art:after{content:"";background:linear-gradient(to top, var(--card-bg), transparent);height:55%;position:absolute;bottom:0;left:0;right:0}.ap-svg{z-index:4;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.ap-cost{z-index:10;border:1.5px solid var(--faction-color);width:40px;height:40px;box-shadow:0 0 18px var(--faction-color), inset 0 0 10px #0000004d;background:radial-gradient(circle at 35% 35%,#4c1d95,#1e1040);border-radius:50%;flex-direction:column;justify-content:center;align-items:center;animation:4s ease-in-out infinite costPulse;display:flex;position:absolute;top:5px;left:5px}@keyframes costPulse{0%,to{box-shadow:0 0 16px var(--faction-color), inset 0 0 8px #0000004d}50%{box-shadow:0 0 28px var(--faction-color), inset 0 0 14px #0003}}.ap-cost .cv{color:#f3e8ff;text-shadow:0 0 8px var(--faction-color);font-family:Space Grotesk,sans-serif;font-size:18px;font-weight:900;line-height:1}.ap-cost .cl{text-transform:uppercase;letter-spacing:1px;color:#c4b5d9b3;font-size:5px}.ap-faction{z-index:10;text-transform:uppercase;letter-spacing:2px;color:var(--faction-color);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border:1px solid var(--faction-color);white-space:nowrap;text-overflow:ellipsis;background:#04030ad9;border-left-width:3px;border-radius:2px;max-width:120px;padding:2px 8px;font-family:Space Grotesk,sans-serif;font-size:7px;position:absolute;top:8px;right:6px;overflow:hidden}.ap-namezone{z-index:8;padding:0 4px;position:absolute;bottom:178px;left:4px;right:4px}.ap-name{color:#f3e8ff;text-shadow:0 2px 10px #000000e6;white-space:nowrap;text-overflow:ellipsis;font-family:Space Grotesk,Noto Serif SC,sans-serif;font-size:15px;font-weight:900;line-height:1.1;overflow:hidden}.ap-name.cn{font-size:14px}.ap-typename{text-transform:uppercase;letter-spacing:2px;color:var(--faction-color);align-items:center;gap:4px;margin-top:3px;font-size:8px;display:flex}.ap-typename:before,.ap-typename:after{content:"";background:linear-gradient(to right, transparent, var(--faction-color));flex:1;height:1px}.ap-typename:after{background:linear-gradient(to left, transparent, var(--faction-color))}.ap-abilities{z-index:8;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#c4b5d9;word-break:break-word;overflow-wrap:anywhere;background:#04030acc;border:1px solid #6d28d933;border-top-color:#6d28d973;max-height:62px;padding:5px 8px;font-size:clamp(7.5px,1.8vw,9px);line-height:1.5;position:absolute;bottom:112px;left:4px;right:4px;overflow:hidden;-webkit-mask-image:linear-gradient(#000 70%,#0000 100%);mask-image:linear-gradient(#000 70%,#0000 100%)}.ap-kw{color:#fde68a;margin-bottom:2px;font-family:Space Grotesk,Noto Serif SC,sans-serif;font-size:clamp(7px,1.6vw,8.5px);font-weight:700;display:block}.ap-ab-body{color:#9c8ec2;font-style:italic}.ap-ab-body .label{color:#c084fc;font-style:normal;font-weight:700}.ap-wek-res{z-index:8;gap:3px;height:18px;display:flex;position:absolute;bottom:90px;left:4px;right:4px}.wek-cell,.res-cell{letter-spacing:.3px;white-space:nowrap;text-overflow:ellipsis;border-radius:2px;flex:1;justify-content:center;align-items:center;gap:3px;padding:0 4px;font-family:Space Grotesk,sans-serif;font-size:7.5px;font-weight:700;display:flex;overflow:hidden}.wek-cell{color:#d4a96a;background:#78350f66;border:1px solid #b4530980}.res-cell{color:#67e8f9;background:#064e5f66;border:1px solid #0891b280}.ap-rarity-badge{z-index:9;white-space:nowrap;border-radius:10px;align-items:center;gap:3px;padding:2px 10px;display:flex;position:absolute;bottom:70px;left:50%;transform:translate(-50%)}.r-pip{border:1px solid #fff3;border-radius:50%;flex-shrink:0;width:6px;height:6px}.r-name{text-transform:uppercase;letter-spacing:1.5px;margin-left:3px;font-family:Space Grotesk,sans-serif;font-size:7px;font-weight:700}.rl-pip{background:radial-gradient(circle at 35% 35%,#fde68a,#b45309);box-shadow:0 0 10px #f59e0b,0 0 20px #fbbf2459}.rl-name{color:#fef08a}.rl-badge{background:#fbbf241a;border:1px solid #fbbf2461}.rr-pip{background:#60a5fa;box-shadow:0 0 7px #3b82f6}.rr-name{color:#93c5fd}.rr-badge{background:#60a5fa1a;border:1px solid #60a5fa4d}.rc-pip{background:#94a3b8;box-shadow:0 0 5px #64748b}.rc-name{color:#cbd5e1}.rc-badge{background:#94a3b81a;border:1px solid #94a3b84d}.r-strip{z-index:9;border-radius:2px;height:3px;position:absolute;bottom:2px;left:10px;right:10px}.rl-strip{background:linear-gradient(90deg,#0000,#d97706 20%,#fbbf24 50%,#d97706 80%,#0000);animation:2s ease-in-out infinite goldGlow}@keyframes goldGlow{0%,to{opacity:.9}50%{opacity:1;filter:brightness(1.7)saturate(1.4)}}.rr-strip{background:linear-gradient(90deg,#0000,#3b82f6,#0000)}.rc-strip{background:linear-gradient(90deg,#0000,#64748b,#0000)}.ap-statbar{z-index:8;grid-template-columns:repeat(5,1fr);gap:3px;height:62px;display:grid;position:absolute;bottom:4px;left:4px;right:4px}.ap-stat{background:#04030aeb;border:1px solid #ffffff12;border-radius:3px;flex-direction:column;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.ap-stat:before{content:"";height:2px;position:absolute;top:0;left:0;right:0}.ap-stat .si{margin-bottom:1px;font-size:11px;line-height:1}.ap-stat .sv{font-family:Space Grotesk,sans-serif;font-size:14px;font-weight:900;line-height:1}.ap-stat .sl{text-transform:uppercase;letter-spacing:1.5px;color:#c4b5d966;margin-top:1px;font-size:6px}.s-atk:before{background:#ef4444}.s-atk .si,.s-atk .sv{color:#fca5a5}.s-atk .si{color:#ef4444}.s-def:before{background:#3b82f6}.s-def .si,.s-def .sv{color:#93c5fd}.s-def .si{color:#3b82f6}.s-hp:before{background:#10b981}.s-hp .si,.s-hp .sv{color:#6ee7b7}.s-hp .si{color:#10b981}.s-spd:before{background:#f59e0b}.s-spd .si,.s-spd .sv{color:#fcd34d}.s-spd .si{color:#f59e0b}.s-san:before{background:#d946ef}.s-san .si,.s-san .sv{color:#f0abfc}.s-san .si{color:#d946ef}.ap-card-scaled{transform:scale(var(--ap-scale,.85));transform-origin:top}@media (width<=600px){.ap-card-scaled{transform:scale(.7)}.ap-card-wrap{width:240px!important;height:336px!important}.ap-card{transform-origin:0 0;transform:scale(.8)}}@media (width<=400px){.ap-card-wrap{width:210px!important;height:294px!important}.ap-card{transform-origin:0 0;transform:scale(.7)}}.ap-card[data-faction=Outer\ Gods]{--faction-color:#9333ea}.ap-card[data-faction=Abyss\ Servants]{--faction-color:#14b8a6}.ap-card[data-faction=Humanity]{--faction-color:#f59e0b}.ap-card[data-faction=Elder\ Signs]{--faction-color:#06b6d4}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-deep)}::-webkit-scrollbar-thumb{background:#00ffd54d;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--accent-cyan)}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}.ap-card:hover,.ap-card:hover .ap-art img{transform:none!important}}.section-divider{background:linear-gradient(90deg,#0000,#7c3aed66,#0000);height:1px;margin:0}.axis-chip{color:#c4b5d9;background:#04030ab3;border:1px solid #7c3aed33;border-left-width:3px;border-radius:2px;align-items:center;gap:10px;padding:10px 14px;font-size:12px;transition:border-color .3s,transform .3s;display:flex}.axis-chip:hover{border-color:#7c3aedb3;transform:translate(4px)}.axis-chip .axis-icon{text-align:center;flex-shrink:0;width:22px;font-size:16px}.axis-chip .axis-label{color:#fde68a;margin-right:4px;font-family:Space Grotesk,sans-serif;font-weight:700}
