.mati-map-collection{position:absolute;z-index:30;top:14px;right:14px;display:flex;align-items:center;gap:7px;min-height:38px;padding:7px 12px;border:1px solid #ffffff39;border-radius:13px;background:#191b35e8;backdrop-filter:blur(8px);color:#f7f4ed;box-shadow:0 4px 14px #11142730;font:700 11px/1.2 var(--display);transform:scale(var(--reward-pocket-scale,1));transform-origin:center;isolation:isolate}
.mati-map-collection svg{width:22px;height:24px;overflow:visible;fill:#bcb0f3;stroke:#f7f4ed;stroke-width:1.2}.mati-map-collection svg path{fill:#f7f4ed;stroke:none}.mati-map-collection em{position:absolute;right:-7px;top:-6px;display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:#f7f4ed;color:#5e4e91;font:800 12px/1 system-ui;opacity:0;transform:scale(.5)}
.mati-map-collection.has-new-card{border-color:#d4c6ff;box-shadow:0 0 0 5px #ccbaff28,0 0 28px #d3b6ff68}.mati-map-collection.has-new-card em{opacity:1;transform:scale(1)}
.mati-map-reward{--reward-card-width:clamp(54px,12cqw,94px);position:absolute;left:0;top:0;z-index:28;width:clamp(118px,24cqw,174px);height:calc(var(--reward-card-width)*1.4 + 58px);pointer-events:none;transform-origin:0 0;isolation:isolate}
.mati-reward-flight{position:absolute;left:calc(50% - var(--reward-card-width)/2);top:6px;width:var(--reward-card-width);height:calc(var(--reward-card-width)*1.4);perspective:700px;transform-origin:center;filter:drop-shadow(0 7px 8px #10142660);z-index:2;will-change:transform,opacity}
.mati-reward-rotor{width:100%;height:100%;position:relative;transform-style:preserve-3d;will-change:transform}
.mati-reward-face{position:absolute;inset:0;border-radius:9px;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden;border:1px solid #fff4c8c0;background:#273c3a}
.mati-reward-face img{width:100%;height:100%;display:block;object-fit:cover}
.mati-reward-back{transform:rotateY(180deg)}
.mati-reward-shine{position:absolute;inset:-20%;background:linear-gradient(90deg,transparent 28%,#fffdfaab 50%,transparent 72%);mix-blend-mode:screen;pointer-events:none}
.mati-reward-glow{position:absolute;left:-15%;top:-15%;width:130%;height:120%;border-radius:50%;background:radial-gradient(ellipse,#fff7bc8c 0,#d5c0f857 30%,#bfb9f522 47%,transparent 70%);filter:blur(5px);pointer-events:none}
.mati-reward-caption{position:absolute;left:0;right:0;top:calc(var(--reward-card-width)*1.4 + 17px);display:flex;flex-direction:column;align-items:center;gap:3px;text-align:center}
.mati-reward-caption strong{display:block;border-radius:20px;padding:5px 9px;color:#fffaf0;background:#24203deb;border:1px solid #f3e8ff66;box-shadow:0 2px 10px #13172c35;font:700 clamp(9px,1.8cqw,12px)/1.2 var(--display);white-space:nowrap}
.mati-reward-caption>span{padding:1px 5px;color:#fff9e9;border-radius:5px;background:#24203dbd;font:700 9px/1.2 var(--display)}
.mati-reward-stars{position:absolute;left:50%;top:calc(var(--reward-card-width)*.7);z-index:3}.mati-reward-stars span{position:absolute;left:-7px;top:-7px;font:700 18px/1 system-ui;text-shadow:0 0 9px #fffce9}
.mati-reward-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@container(max-width:420px){.mati-map-collection{top:10px;right:10px;padding:5px 9px;gap:5px;min-height:34px;font-size:9px}.mati-map-collection svg{width:18px;height:20px}.mati-reward-face{border-radius:7px}.mati-reward-stars span{font-size:14px}.mati-reward-caption>span{font-size:8px}}
@media(prefers-reduced-motion:reduce){.mati-reward-stars,.mati-reward-glow,.mati-reward-shine{display:none}.mati-map-collection{transform:none}}
