.collection-entry{display:flex;align-items:center;gap:10px;width:100%;min-height:60px;padding:7px 12px;border:1px solid #d1b1ff35;border-radius:15px;background:linear-gradient(105deg,#49396550,#192e454d);color:#eff5ff;text-align:left}.collection-entry:hover{border-color:#d1b1ff7a;background:#473b6459}.collection-entry-copy{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}.collection-entry-copy>strong{font-size:12px}.collection-entry-copy>small{font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#beaeda}.collection-entry>.avatar-preview{width:42px;height:42px;flex:0 0 42px}.entry-balance{display:flex;align-items:center;gap:5px;color:#ffe7a5;font-size:13px;white-space:nowrap}.entry-balance .coin-icon{width:17px;height:17px}.entry-badge:empty{display:none}.entry-badge .badge-art{width:28px;height:31px}.coin-icon{width:21px;height:21px;flex-shrink:0;vertical-align:middle;fill:#604e25;stroke:#ffe6a1;stroke-width:1.4}.coin-icon path{fill:#ffd579;stroke:none}.avatar-preview{position:static;inset:auto;display:block;touch-action:pan-y;max-width:100%}.collection-result-title{font-size:11px;color:#cbb7ea;letter-spacing:.03em}.collection-result-title:empty{display:none}
.collection-dialog{width:min(860px,calc(100% - 28px));height:min(860px,calc(100dvh - 32px - env(safe-area-inset-top) - env(safe-area-inset-bottom)));max-height:calc(100dvh - 32px - env(safe-area-inset-top) - env(safe-area-inset-bottom));padding:0;overflow:hidden;background:radial-gradient(ellipse at 20% 0%,#263451 0%,#131d34 42%,#0c1226 100%)}.collection-dialog[open]{display:flex;flex-direction:column}.collection-heading{display:flex;align-items:center;justify-content:space-between;padding:15px 22px 0;gap:14px;flex-shrink:0}.collection-heading h2{font-size:20px;line-height:1.35}.collection-close{display:grid;place-items:center;width:36px;height:36px;min-width:36px;border:1px solid #c9daf024;border-radius:50%;background:#ffffff08;color:#c9d9eb;font-size:25px}.collection-profile{display:flex;align-items:center;gap:15px;padding:0 26px 12px;flex-shrink:0;min-height:108px}.collection-profile>.avatar-preview{width:98px;height:98px;flex:0 0 98px}.collection-identity{display:flex;flex-direction:column;gap:5px;flex:1;min-width:0}.collection-eyebrow{font-size:10px;color:#a9bad5}.collection-identity>strong{font-size:17px;line-height:1.45;color:#f2eaff;overflow-wrap:anywhere}.collection-identity>span:not(.collection-eyebrow){font-size:10px;color:#9fb1ce}.collection-wallet{display:flex;align-items:center;gap:7px;margin-top:2px;color:#ffe7a6;flex-wrap:wrap}.collection-wallet>b{font-size:24px;font-variant-numeric:tabular-nums;line-height:1.1}.collection-wallet>span{font-size:11px;color:#c9b784}#collectionPinned{flex:0 0 56px}#collectionPinned:empty{display:none}#collectionPinned .badge-art{width:56px;height:60px;filter:drop-shadow(0 0 12px #d2a5ff35)}
.collection-tabs{display:flex;gap:5px;padding:0 20px 10px;flex-shrink:0;border-bottom:1px solid #bbcfee14}.collection-tabs>button{flex:1;padding:10px 5px;border:1px solid transparent;border-radius:10px;background:transparent;color:#a9bbd5;font-size:12px;line-height:1.4;font-weight:800;min-width:0}.collection-tabs>button[aria-selected=true]{background:#bc9aff1c;border-color:#c2a3fd45;color:#f3eaff}.collection-tabs>button:hover{background:#ffffff08}.collection-notice{flex-shrink:0;margin:0;padding:9px 22px;background:#6cd8c60c;color:#aee5d6;font-size:11px;line-height:1.6;overflow-wrap:anywhere;max-height:95px;overflow-y:auto}.collection-notice:empty{display:none}.collection-notice.is-error{color:#ffcfaf;background:#e3926b10}.collection-scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;padding:18px 22px 24px;scrollbar-width:thin;scrollbar-color:#67749770 transparent}#collectionPanel:focus{outline:none}.collection-help{color:#aabdd7;font-size:12px;line-height:1.8;text-align:left;margin:0 0 13px;overflow-wrap:anywhere}.collection-earn-help{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border-radius:12px;background:#ffe7a507;border:1px solid #ffe7a519;margin-bottom:15px}.collection-earn-help .coin-icon{width:19px;height:19px;margin-top:2px}.collection-earn-help p{font-size:11px;line-height:1.75;color:#cbbd97}.collection-categories{display:flex;gap:7px;margin-bottom:14px}.collection-categories button{padding:8px 13px;border:1px solid #ffffff16;border-radius:99px;background:#ffffff03;color:#a4b8d5;font-size:12px;min-height:36px;line-height:1.4;min-width:0}.collection-categories button[aria-pressed=true]{background:#85dfe81c;border-color:#85dfe859;color:#b9f4fb}.collection-categories button:hover{border-color:#8dc9e45e}.collection-next{display:flex;align-items:center;gap:11px;width:100%;padding:10px 13px;border:1px solid #a9c2eb1c;border-radius:13px;background:#9bbbe609;color:#cbdcf3;text-align:left;margin-bottom:17px}.collection-next>.badge-art{width:40px;height:44px;flex-shrink:0}.collection-next>span{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}.collection-next small{color:#99accc;font-size:9px}.collection-next strong{font-size:12px;line-height:1.45}.collection-next>span>span{font-size:10px;color:#a8b5ce;line-height:1.5}.collection-next>b{color:#bca8e0;font-size:11px;white-space:nowrap}.collection-next>b>span{font-size:20px;margin-left:5px}.cosmetic-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}.cosmetic-card{display:flex;flex-direction:column;align-items:center;min-width:0;padding:9px 10px 12px;border:1px solid #b2c8e222;border-radius:16px;background:radial-gradient(ellipse at 50% 35%,#aac0ff0a,#ffffff02);color:#dfebfa;min-height:158px;transition:border-color .12s,background .12s}.cosmetic-card:hover{border-color:#baa4e874;background-color:#c5adff07}.cosmetic-card[aria-pressed=true]{border-color:#c6a5ff;box-shadow:0 0 0 1px #c6a5ff45 inset;background-color:#b78ef414}.cosmetic-card>.avatar-preview{width:93px;height:93px}.cosmetic-card>strong{font-size:12px;line-height:1.5;margin-top:1px;min-height:18px;overflow-wrap:anywhere;text-align:center}.cosmetic-price{display:flex;align-items:center;justify-content:center;gap:5px;min-height:22px;margin-top:5px;color:#e2c993;font-size:11px}.cosmetic-price .coin-icon{width:14px;height:14px}.cosmetic-card.is-owned .cosmetic-price{color:#9ed8d1}.collection-welcome{font-size:11px;color:#d0b792;margin-top:18px;text-align:center}.collection-action{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 22px max(14px,env(safe-area-inset-bottom));border-top:1px solid #bc9dfa25;background:#12182d;flex-shrink:0;box-shadow:0 -12px 28px #060b1c55}.collection-action>div{min-width:0;display:flex;flex-direction:column;gap:4px}.collection-action strong{font-size:13px;line-height:1.4;overflow-wrap:anywhere}.collection-action small{font-size:11px;color:#c8bda3}.collection-action .btn{font-size:13px;padding:11px 21px;min-height:44px;box-shadow:none;line-height:1.4;max-width:60%;background:linear-gradient(105deg,#c5b0ff,#90e5ec)}.collection-action .btn:disabled{background:#36344a;color:#a4a4b8;opacity:1;cursor:default}
.badge-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.collection-badge{display:flex;flex-direction:column;padding:15px;border:1px solid #cad6ef19;border-radius:16px;background:#ffffff03;min-width:0}.collection-badge.is-unlocked{background:linear-gradient(140deg,#ab8be611,#8cc9e907);border-color:#bba3e441}.badge-top{display:flex;align-items:center;justify-content:space-between;gap:5px}.badge-top>.badge-art{width:48px;height:52px;opacity:.45;filter:saturate(.4)}.badge-top>span{font-size:10px;color:#8599ba;line-height:1.5;text-align:right}.collection-badge.is-unlocked .badge-top>.badge-art{opacity:1;filter:none}.collection-badge.is-unlocked .badge-top>span{color:#a5decb}.collection-badge>h3{font-size:13px;line-height:1.6;color:#bfcce3;margin:9px 0 5px;overflow-wrap:anywhere}.collection-badge.is-unlocked>h3{color:#f4eafa}.collection-badge>p{font-size:10px;line-height:1.7;color:#9baeca;flex:1;min-height:34px;overflow-wrap:anywhere}.badge-progress{height:4px;border-radius:4px;background:#080c1e90;overflow:hidden;margin-top:13px}.badge-progress>i{height:100%;display:block;background:linear-gradient(90deg,#9276c1,#9de5e2);border-radius:4px}.collection-badge>small{display:block;font-size:9px;color:#96a6c2;margin-top:5px}.badge-actions{display:grid;grid-template-columns:1fr;gap:6px;margin-top:12px}.badge-actions>button{border:1px solid #bcb8e233;background:#a18cdb0a;color:#d6cde9;border-radius:9px;padding:8px 5px;font-size:10px;min-height:34px;line-height:1.5}.badge-actions>button[aria-pressed=true]{color:#a9ebe5;background:#7bdbc917;border-color:#86dece40}.collection-clear{display:flex;flex-wrap:wrap;gap:5px;margin:-5px 0 10px}.collection-clear:empty{display:none}.collection-clear .text-btn{font-size:10px;color:#aea5cb}.badge-art{display:block;width:64px;height:68px;flex-shrink:0}.badge-ribbon{fill:color-mix(in srgb,var(--badge-color) 25%,#11182b);stroke:color-mix(in srgb,var(--badge-color) 60%,#11182b);stroke-width:1.3}.badge-shield{fill:color-mix(in srgb,var(--badge-color) 12%,#172037);stroke:var(--badge-color);stroke-width:1.5}.badge-symbol{fill:none;stroke:var(--badge-color);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.badge-tier{fill:var(--badge-color)}
.collection-stat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.collection-stat-grid>div{display:flex;flex-direction:column;gap:5px;border:1px solid #b9c9e021;background:#ffffff03;border-radius:13px;padding:15px 16px;min-width:0}.collection-stat-grid strong{font-size:23px;font-variant-numeric:tabular-nums;color:#c7e7ff;overflow-wrap:anywhere}.collection-stat-grid span{font-size:11px;color:#96acca;line-height:1.5}.collection-backup{border-top:1px solid #ffffff15;margin-top:23px;padding-top:17px}.collection-backup p{font-size:11px;color:#a9b6cf;line-height:1.9;margin-bottom:14px}.collection-backup-actions{display:flex;gap:9px;flex-wrap:wrap}.collection-secondary{padding:10px 15px;border:1px solid #aebfdb36;border-radius:11px;background:#d1d2ff08;color:#c4d4ee;font-size:11px;min-height:42px;line-height:1.5}.collection-restore{border:1px solid #e0c09340;background:#e0bc8310;padding:15px;border-radius:12px;margin-top:16px}.collection-restore .btn{font-size:12px;box-shadow:none;min-height:40px;padding:10px 18px}.collection-restore .text-btn{font-size:11px}.collection-retry{margin-top:16px}.collection-run-reward{width:100%;padding:15px 17px;border:1px solid #d9bd8340;border-radius:16px;background:linear-gradient(115deg,#7e653714,#382e4f33);text-align:center}.reward-heading{display:flex;justify-content:space-between;align-items:center;gap:10px}.reward-heading>span{font-size:12px;color:#d7c5a2}.reward-heading>strong{display:flex;align-items:center;gap:7px;color:#ffe5a3;font-size:26px;font-variant-numeric:tabular-nums}.reward-breakdown{font-size:10px;color:#aeabc3;line-height:1.8;margin-top:6px}.reward-badges{display:flex;justify-content:center;gap:12px;margin-top:14px}.reward-badges>span{display:flex;align-items:center;flex-direction:column;gap:6px;flex:1;max-width:130px;min-width:0}.reward-badges .badge-art{width:40px;height:44px}.reward-badges small{font-size:9px;color:#d6c4ee;line-height:1.6}.reward-new{font-size:11px;color:#e4d0ff;margin:12px 0 4px}.collection-run-reward>.text-btn{color:#ddc899;font-size:11px}.collection-run-reward .collection-help{margin:0;text-align:center}.battle-result .collection-run-reward{max-width:480px}.collection-run-reward:not(.hide){animation:collection-reward-in .35s ease-out}@keyframes collection-reward-in{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:620px){.cosmetic-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.badge-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.collection-badge{padding:12px}.badge-top{align-items:flex-start;flex-direction:column;gap:4px}.badge-top>span{text-align:left}.collection-heading{padding:13px 16px 0}.collection-profile{padding:0 17px 12px;gap:10px}.collection-profile>.avatar-preview{width:86px;height:86px;flex-basis:86px}.collection-identity>strong{font-size:14px}.collection-tabs{padding:0 12px 9px;gap:2px}.collection-tabs>button{font-size:11px;padding:9px 3px}.collection-scroll{padding:15px 15px 22px}.collection-notice{padding:8px 16px}.collection-action{padding:12px 15px;gap:10px}.collection-action .btn{font-size:11px;padding:10px 14px}.collection-action strong{font-size:12px}.collection-action small{font-size:10px}#collectionPinned{flex-basis:35px}#collectionPinned .badge-art{width:35px;height:38px}.collection-categories button{font-size:11px;padding:7px 10px}.collection-stat-grid>div{padding:13px}.collection-stat-grid strong{font-size:20px}.collection-stat-grid span{font-size:10px}}
@media(max-width:440px){.cosmetic-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cosmetic-card{min-height:150px;padding:6px 7px 11px}.cosmetic-card>.avatar-preview{width:88px;height:88px}.cosmetic-card>strong{font-size:11px}.collection-profile{gap:6px;min-height:100px}.collection-profile>.avatar-preview{width:75px;height:80px;flex-basis:75px}.collection-wallet>b{font-size:23px}.collection-identity>strong{font-size:12px}.collection-identity>span:not(.collection-eyebrow){font-size:9px}.collection-wallet .coin-icon{width:17px;height:17px}.collection-wallet>span{font-size:10px}.collection-next{padding:9px;gap:8px}.collection-next>.badge-art{width:31px;height:35px}.collection-next strong{font-size:11px}.collection-next>span>span{font-size:9px}.collection-next>b{font-size:9px}.collection-badge>h3{font-size:11px}.collection-badge>p{font-size:10px}.collection-action .btn{max-width:58%;font-size:10px;min-height:42px}.collection-heading h2{font-size:18px}.collection-help{font-size:11px}.collection-earn-help{padding:10px}.collection-earn-help p{font-size:10px}.collection-stat-grid{gap:8px}}
@media(max-height:600px){.collection-heading{padding-top:8px}.collection-heading h2{font-size:17px}.collection-close{width:30px;height:30px;min-width:30px}.collection-profile{min-height:65px;padding-bottom:6px}.collection-profile>.avatar-preview{width:64px;height:64px;flex-basis:64px}.collection-identity{gap:2px}.collection-eyebrow{display:none}.collection-identity>strong{font-size:12px}.collection-wallet>b{font-size:18px}.collection-tabs{padding-bottom:6px}.collection-tabs>button{padding:7px 3px}.collection-scroll{padding-top:12px}.collection-action{padding-top:8px;padding-bottom:8px}.collection-notice{max-height:55px}}
@media(prefers-reduced-motion:reduce){.cosmetic-card{transition:none}.collection-run-reward:not(.hide){animation:none}}
.collection-earn-help p>small{display:block;font-size:9px;color:#a99f87;margin-top:5px}
.badge-actions>button{min-height:40px}
@media(max-width:360px){.collection-tabs{padding-left:10px;padding-right:10px}.collection-tabs>button{font-size:10px;padding-left:2px;padding-right:2px}.collection-categories{gap:5px}.collection-categories button{padding-left:8px;padding-right:8px}}