*{box-sizing:border-box}
:root{--bg:#070910;--panel:#0e131d;--panel2:#121925;--line:rgba(255,255,255,.08);--text:#f6f8fc;--muted:#7d899d;--blue:#4788ff;--purple:#7757ff;--green:#38d98b;--red:#f04462}
html{background:var(--bg)}
body{margin:0;background:radial-gradient(circle at 20% 0,rgba(71,136,255,.12),transparent 30%),var(--bg);color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
button,input{font:inherit}.page{width:min(1500px,calc(100% - 40px));margin:auto;padding:38px 0 80px}

.hero{position:relative;overflow:hidden;min-height:320px;display:flex;align-items:center;padding:55px;border:1px solid var(--line);border-radius:26px;background:linear-gradient(120deg,#121a29,#090d15);animation:heroIn .6s ease}
.hero:after{content:"";position:absolute;width:520px;height:520px;right:-170px;top:-280px;border-radius:50%;background:var(--blue);filter:blur(125px);opacity:.2;animation:glow 7s ease-in-out infinite alternate}
.hero-grid{position:absolute;inset:0;background:linear-gradient(90deg,transparent 49%,rgba(255,255,255,.025) 50%,transparent 51%),linear-gradient(transparent 49%,rgba(255,255,255,.025) 50%,transparent 51%);background-size:50px 50px;animation:gridMove 14s linear infinite}
.hero-copy{position:relative;z-index:2;max-width:700px}
.tag{display:inline-flex;align-items:center;gap:8px;padding:7px 10px;border:1px solid rgba(71,136,255,.2);border-radius:7px;background:rgba(71,136,255,.07);color:#82adff;font-size:10px;font-weight:900;letter-spacing:.13em}
.tag i{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 10px var(--green);animation:pulse 1.8s infinite}
.hero h1{margin:17px 0;font-size:clamp(46px,6vw,76px);line-height:.9;letter-spacing:-.06em}
.hero h1 strong{color:#6ea2ff}.hero p{max-width:630px;margin:0;color:var(--muted);font-size:16px;line-height:1.65}
.hero-stats{display:flex;gap:30px;margin-top:25px}.hero-stats strong{display:block;font-size:22px}.hero-stats span{color:#647085;font-size:8px;font-weight:900;letter-spacing:.13em}
.reset{position:absolute;z-index:2;right:55px;top:50%;transform:translateY(-50%);text-align:right}.reset span{display:block;color:#667286;font-size:9px;font-weight:900;letter-spacing:.15em}.reset strong{display:block;margin-top:5px;color:#86afff;font-size:23px;font-family:monospace}
.hero-word{position:absolute;right:15px;bottom:-30px;color:rgba(255,255,255,.023);font-size:180px;font-weight:1000;letter-spacing:-.08em}

.controls{position:sticky;top:0;z-index:100;display:flex;align-items:center;gap:10px;margin:14px 0 30px;padding:12px;border:1px solid var(--line);border-radius:16px;background:rgba(9,13,21,.9);backdrop-filter:blur(16px)}
.search{position:relative;min-width:240px;flex:1}.search span{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:#657186;font-size:18px}.search input{width:100%;height:45px;padding:0 14px 0 41px;border:1px solid var(--line);border-radius:9px;outline:0;background:#080c13;color:var(--text)}
.search input:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(71,136,255,.1)}
.filters{display:flex;gap:5px;max-width:70%;overflow-x:auto}.filters button{flex:0 0 auto;padding:9px 11px;border:1px solid transparent;border-radius:7px;background:transparent;color:#778398;font-size:9px;font-weight:900;text-transform:uppercase;cursor:pointer;transition:.18s}
.filters button:hover{color:#b8c4d8}.filters button.active{background:#1b2639;color:#8eb5ff}.filters button.leaving{color:#ff7088}.filters button.leaving.active{background:rgba(240,68,98,.15);color:#ff7088}
.visible{flex:0 0 auto;padding:0 5px;color:#657186;font-size:9px;font-weight:800}.visible strong{color:#a9b6ca}

.section-title{display:flex;align-items:end;justify-content:space-between;margin:0 3px 13px}.section-title span,.eyebrow{display:block;color:#689aff;font-size:9px;font-weight:900;letter-spacing:.18em}.section-title h2{margin:4px 0 0;font-size:26px;letter-spacing:-.03em}.section-title b{color:#5f6b7e;font-size:9px;letter-spacing:.1em}
.shop-section{margin-bottom:42px}.shop-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:11px}
.shop-item{--r:#6b7280;position:relative;overflow:hidden;border:1px solid var(--line);border-bottom:3px solid var(--r);border-radius:16px;background:var(--panel);cursor:pointer;opacity:0;transform:translateY(14px);transition:opacity .45s var(--delay),transform .3s,border-color .2s,box-shadow .2s}
.shop-item.visible{opacity:1;transform:none}.shop-item:hover{transform:translateY(-5px);border-color:rgba(255,255,255,.15);border-bottom-color:var(--r);box-shadow:0 20px 45px rgba(0,0,0,.25)}
.shop-item[hidden]{display:none}.rarity-legendary{--r:#ff861f}.rarity-epic{--r:#a45cff}.rarity-rare{--r:#4788ff}.rarity-uncommon{--r:#42c878}.rarity-mythic{--r:#e5b941}.rarity-transcendent{--r:#ea5a8d}
.image-wrap{position:relative;aspect-ratio:1;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 50% 65%,color-mix(in srgb,var(--r) 22%,transparent),transparent 58%),#0a0e16}
.image-wrap:after{content:"";position:absolute;inset:auto 0 0;height:35%;background:linear-gradient(transparent,rgba(7,9,16,.28))}
.image-wrap img{width:100%;height:100%;object-fit:contain;transition:transform .5s cubic-bezier(.2,.8,.2,1)}.shop-item:hover .image-wrap img{transform:scale(1.055)}
.badge{position:absolute;z-index:3;left:10px;padding:5px 7px;border-radius:5px;font-size:7px;font-weight:1000;letter-spacing:.11em}.leaving-badge{top:10px;background:var(--red);animation:pulse 1.8s infinite}.new-badge{top:37px;background:var(--green);color:#07130d}
.rarity{position:absolute;z-index:3;right:10px;top:10px;padding:5px 7px;border:1px solid color-mix(in srgb,var(--r) 60%,transparent);border-radius:5px;background:rgba(7,9,16,.7);color:var(--r);font-size:7px;font-weight:900;text-transform:uppercase;backdrop-filter:blur(6px)}
.no-image{color:#4d596c;font-size:10px;font-weight:900;letter-spacing:.1em}
.item-info{padding:15px}.item-info>span{display:block;color:#59667a;font-size:8px;font-weight:800;text-transform:uppercase;letter-spacing:.1em}.item-info h3{overflow:hidden;margin:4px 0 10px;font-size:16px;white-space:nowrap;text-overflow:ellipsis}.price{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:900}.price img{width:17px;height:17px}
#no-results{display:none;padding:80px 20px;text-align:center;color:#667286;border:1px dashed var(--line);border-radius:17px}

.error{display:flex;align-items:center;gap:12px;margin-top:15px;padding:16px;border:1px solid rgba(255,80,100,.2);border-radius:13px;background:rgba(255,80,100,.06)}.error>b{width:35px;height:35px;display:grid;place-items:center;border-radius:9px;background:rgba(255,80,100,.12);color:#ff6579}.error strong,.error span{display:block}.error span{margin-top:2px;color:#ad7c84;font-size:11px}

.modal{position:fixed;z-index:5000;inset:0;display:flex;align-items:center;justify-content:center;padding:25px;background:rgba(3,5,9,.88);backdrop-filter:blur(14px);opacity:0;visibility:hidden;transition:.25s}.modal.open{opacity:1;visibility:visible}.modal-card{position:relative;width:min(960px,100%);max-height:90vh;display:grid;grid-template-columns:1fr 1.15fr;overflow:auto;border:1px solid rgba(255,255,255,.12);border-radius:22px;background:#0d121b;box-shadow:0 30px 100px rgba(0,0,0,.55);transform:translateY(20px) scale(.98);transition:.3s cubic-bezier(.2,.8,.2,1)}.modal.open .modal-card{transform:none}
.close{position:absolute;z-index:5;right:15px;top:15px;width:36px;height:36px;border:1px solid var(--line);border-radius:9px;background:rgba(7,9,16,.65);color:#8793a6;font-size:23px;cursor:pointer}.close:hover{color:#fff}
.modal-image{min-height:500px;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle,#18253d,#070a10 68%)}.modal-image img{width:100%;height:100%;max-height:620px;object-fit:contain}
.modal-info{padding:42px}.modal-info h2{margin:6px 0 12px;font-size:36px;line-height:1;letter-spacing:-.04em}.modal-info>p{margin:0;color:#8490a3;font-size:13px;line-height:1.65}
.modal-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:25px 0}.modal-stats>div,.last-seen{padding:13px;border:1px solid var(--line);border-radius:10px;background:#090d14}.modal-stats span,.last-seen span{display:block;color:#596579;font-size:7px;font-weight:900;letter-spacing:.12em}.modal-stats strong,.last-seen strong{display:block;margin-top:4px;font-size:13px}.last-seen strong{color:#82adff}
#bundle-wrap{display:none;margin-top:22px}#bundle-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(75px,1fr));gap:7px;margin-top:10px}#bundle-grid>div{overflow:hidden;padding:6px;border:1px solid var(--line);border-radius:9px;background:#090d14;text-align:center}#bundle-grid img{width:100%;aspect-ratio:1;object-fit:contain}#bundle-grid span{display:block;overflow:hidden;margin-top:4px;color:#79869a;font-size:7px;white-space:nowrap;text-overflow:ellipsis}
.modal-open{overflow:hidden}

@keyframes heroIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes gridMove{to{background-position:50px 50px}}@keyframes glow{to{transform:translate(-70px,60px) scale(1.12)}}@keyframes pulse{50%{opacity:.48}}
@media(max-width:900px){.reset{position:relative;right:auto;top:auto;transform:none;margin-left:auto}.hero-word{display:none}.controls{align-items:stretch;flex-wrap:wrap}.search{width:100%;flex-basis:100%}.filters{max-width:calc(100% - 80px)}.modal-card{grid-template-columns:1fr}.modal-image{min-height:350px}}
@media(max-width:650px){.page{width:calc(100% - 24px);padding-top:20px}.hero{min-height:340px;align-items:flex-start;flex-direction:column;padding:35px 25px}.reset{margin:25px 0 0;text-align:left}.hero-stats{gap:20px}.shop-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.filters{max-width:100%;width:100%}.visible{display:none}.modal{padding:10px}.modal-info{padding:27px}.modal-image{min-height:280px}.modal-info h2{font-size:29px}}
@media(max-width:420px){.shop-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.shop-item{opacity:1;transform:none}}