/* One transparent, branded pack asset; FX never cover labels or capture touches. */
.sealed-pack{--pack-light:#ffcf47;position:relative;isolation:isolate;display:block;width:112px;max-width:100%;aspect-ratio:1;margin:0 auto;pointer-events:none}
.sealed-pack.tone-comum{--pack-light:#91e5bd}.sealed-pack.tone-raro{--pack-light:#75dbff}.sealed-pack.tone-epico{--pack-light:#d9a0ff}.sealed-pack.tone-lendario{--pack-light:#ffe478}
.sealed-pack-halo{position:absolute;inset:9%;z-index:-1;border-radius:50%;background:radial-gradient(ellipse,color-mix(in srgb,var(--pack-light) 36%,transparent),transparent 69%);opacity:.8}
.sealed-pack-halo::after{content:"";position:absolute;inset:5%;border:1px solid color-mix(in srgb,var(--pack-light) 22%,transparent);border-radius:50%;transform:rotateX(35deg)}
.sealed-pack-float{position:absolute;inset:0;display:block;transform:rotate(-4deg);transform-origin:50% 70%;filter:drop-shadow(0 5px 3px #02122499) drop-shadow(0 0 3px color-mix(in srgb,var(--pack-light) 45%,transparent))}
.sealed-pack-asset{display:block;width:100%;height:100%;object-fit:contain;max-width:none}
.sealed-pack-glint{position:absolute;inset:0;opacity:0;background:linear-gradient(110deg,transparent 35%,#fff6d280 44%,#fff9e4dd 49%,transparent 56%) -170% 0/280% 100% no-repeat;-webkit-mask:url('assets/arena/icon/packs-20260928-192.webp') center/contain no-repeat;mask:url('assets/arena/icon/packs-20260928-192.webp') center/contain no-repeat;mix-blend-mode:screen}
.sealed-pack-sparks{position:absolute;inset:0;pointer-events:none}.sealed-pack-sparks i{position:absolute;display:block;width:9px;height:13px;background:#fff8cc;clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%);opacity:.75;filter:drop-shadow(0 0 4px var(--pack-light))}
.sealed-pack-sparks i:nth-child(1){left:8%;top:17%}.sealed-pack-sparks i:nth-child(2){right:5%;top:49%;width:7px;height:11px;animation-delay:1.1s}.sealed-pack-sparks i:nth-child(3){left:18%;bottom:8%;width:5px;height:8px;animation-delay:2.3s}
.sealed-pack-shadow{position:absolute;z-index:-1;left:23%;right:23%;bottom:-2%;height:8%;border-radius:50%;background:radial-gradient(ellipse,#03122099,transparent 72%)}
.sealed-pack.is-ready .sealed-pack-float{animation:sealed-pack-hover 4.8s ease-in-out infinite}
.sealed-pack.is-ready .sealed-pack-glint{animation:sealed-pack-shine 6.8s ease-in-out infinite}
.sealed-pack.is-ready .sealed-pack-sparks i{animation:sealed-pack-twinkle 3.4s ease-in-out infinite}
.sealed-pack.is-ready .sealed-pack-sparks i:nth-child(2){animation-delay:1.1s}.sealed-pack.is-ready .sealed-pack-sparks i:nth-child(3){animation-delay:2.3s}
@keyframes sealed-pack-hover{0%,100%{transform:translateY(1px) rotate(-4deg)}50%{transform:translateY(-5px) rotate(2deg)}}
@keyframes sealed-pack-shine{0%,62%{opacity:0;background-position:-170% 0}64%{opacity:.7}84%{opacity:0;background-position:170% 0}100%{opacity:0;background-position:170% 0}}
@keyframes sealed-pack-twinkle{0%,100%{opacity:.2;transform:scale(.55)}48%{opacity:.95;transform:scale(1.12)}}
#startModal .pack-inventory{gap:12px}
#startModal .pack-inventory>button{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;gap:5px;padding:15px 8px 12px;min-width:0;border:1px solid #eec86d99;border-radius:17px;background:radial-gradient(ellipse at 50% 21%,#2c5e7899,transparent 64%),linear-gradient(155deg,#193c56,#0b2338 72%);box-shadow:inset 0 1px #e5f6ff2b,0 4px 0 #041422;color:#fff5d8;transition:border-color .18s,background-color .18s}
#startModal .pack-inventory>button::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,#fff1ab08,transparent 40%,#74d7ff07)}
#startModal .pack-inventory>button:focus-visible{outline:3px solid #fff3a0;outline-offset:3px}
#startModal .pack-inventory>button>strong{font-size:13px;line-height:1.22;max-width:100%;overflow-wrap:anywhere;position:relative}
#startModal .pack-inventory>button>small{margin:0;color:#b7d7e8;font:700 10px/1.4 system-ui;position:relative}
#startModal .pack-inventory .pack-open-prompt{display:block;margin-top:6px;padding:6px 13px;border:1px solid #ffe7a5;border-radius:8px;background:linear-gradient(#ffe887,#f5b233);box-shadow:0 2px 0 #59390e;color:#302111;font:900 10px/1.1 system-ui;letter-spacing:.08em}
#startModal .pack-inventory>button:nth-child(n+5) .sealed-pack-float,#startModal .pack-inventory>button:nth-child(n+5) .sealed-pack-glint,#startModal .pack-inventory>button:nth-child(n+5) .sealed-pack-sparks i{animation:none}
#startModal .pack-shop .sealed-pack{width:96px;margin-bottom:9px}
#startModal .shop-pack-icon-wrapper .sealed-pack{width:108px;margin:0 auto}
#startModal .bairro-map .bonus-art .sealed-pack{width:40px;max-width:none;margin:0;transform:translateX(-2px)}
#startModal .bairro-map .trail-bonus.locked .sealed-pack{opacity:.65;filter:saturate(.65)}
#startModal .bairro-map .trail-bonus.claimed .sealed-pack{opacity:.55}
#startModal .bairro-map .bonus-art .sealed-pack-sparks{display:none}
#homeRewardBtn .hub-reward-art{background:none;overflow:visible}
#homeRewardBtn .sealed-pack{width:48px;max-width:none}
#homeRewardBtn .sealed-pack-asset{width:100%;height:100%;filter:none}
#homeRewardBtn .sealed-pack-sparks i{width:4px;height:7px}
@media(hover:hover){#startModal .pack-inventory>button:hover{border-color:#fff0a9;background-color:#255a72}#startModal .pack-inventory>button:hover .sealed-pack-halo{opacity:1}}
@media(max-width:360px){#startModal .pack-inventory .sealed-pack{width:96px}#startModal .pack-inventory>button>strong{font-size:12px}}
@media(prefers-reduced-motion:reduce){.sealed-pack.is-ready .sealed-pack-float,.sealed-pack.is-ready .sealed-pack-glint,.sealed-pack.is-ready .sealed-pack-sparks i{animation:none!important}.sealed-pack-glint{display:none}}
