.collection-room{--cr-ink:#505365;--cr-muted:#a3a3b4;--cr-border:#ece9f2;--cr-surface:#fff;max-width:100%;color:var(--cr-ink)}
.collection-heading{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:22px}.collection-eyebrow{font-size:8px;font-weight:700;letter-spacing:1.8px;color:#aba1ba}.collection-heading h2{font-size:24px;margin:8px 0 7px;letter-spacing:-.8px}.collection-heading-spark{font-size:21px;color:#b5a1d1;margin-left:9px}.collection-heading p{font-size:11px;color:var(--cr-muted);margin:0;line-height:1.8}.collection-total{flex-shrink:0;font-size:10px;color:#a296b1;border:1px solid var(--cr-border);padding:8px 10px;border-radius:20px;background:var(--cr-surface)}
.collection-progress{display:flex;align-items:center;flex-wrap:wrap;gap:8px;justify-content:space-between;padding:16px 18px;border:1px solid var(--cr-border);border-radius:13px;background:var(--cr-surface);font-size:10px;color:var(--cr-muted)}.collection-progress strong{font-size:12px;font-variant-numeric:tabular-nums;color:#a08bb7}.collection-progress>div{flex-basis:100%;height:4px;border-radius:4px;background:#f0edf5;overflow:hidden;margin-top:3px}.collection-progress>div>span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#bba1dd,#9bbebf);transition:width .3s}
.collection-tabs{display:flex;gap:6px;margin:21px 0 15px}.collection-tabs>button{padding:9px 15px;border:1px solid var(--cr-border);border-radius:8px;background:var(--cr-surface);font-size:10px;color:#a69ab3}.collection-tabs>button[aria-pressed=true]{border-color:#cebdde;background:#f3eef9;color:#9275af;font-weight:600}.collection-skins{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.collection-skin{position:relative;display:flex;flex-direction:column;align-items:flex-start;text-align:left;min-width:0;padding:12px;border:1px solid var(--cr-border);border-radius:14px;background:var(--cr-surface);color:inherit;transition:transform .18s,border-color .18s}.collection-skin:hover{border-color:#cfc0e1;transform:translateY(-2px)}.collection-skin.is-equipped{border-color:#bca5d4;box-shadow:inset 0 0 0 1px #e8ddf3}.collection-preview{display:flex;align-items:center;justify-content:center;position:relative;width:100%;height:105px;gap:5px;overflow:hidden;border-radius:10px;background:radial-gradient(ellipse at 50% 0,#fff,#f0ecf7);margin-bottom:13px;isolation:isolate}.collection-preview-ball>i{width:26%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 30% 25%,#ffffff9c,transparent 70%),#b29bd6;box-shadow:inset 0 -2px 2px #504c6d15,0 4px 5px #5e507e0b}.collection-preview-ball>i:nth-child(2){background-color:#d9a29c;transform:translateY(-7px)}.collection-preview-ball>i:nth-child(3){background-color:#93b9b2}.collection-preview-ball[data-preview-skin=pearl]>i{background-image:radial-gradient(circle at 28% 20%,#fff 0,#fff8 15%,#e3e9ff73 30%,transparent 65%);box-shadow:inset -4px -4px 5px #ffffff6b,inset 3px 3px 5px #fff9,0 3px 7px #a7a2c224}.collection-preview-ball[data-preview-skin=neon]{background:#20253d}.collection-preview-ball[data-preview-skin=neon]>i{background-image:radial-gradient(circle at 30% 25%,#ffffffa8,transparent 55%);box-shadow:0 0 10px #b29bd69c,inset -3px -4px 5px #0002}.collection-preview-ball[data-preview-skin=neon]>i:nth-child(2){box-shadow:0 0 10px #d9a29c9c,inset -3px -4px 5px #0002}.collection-preview-ball[data-preview-skin=neon]>i:nth-child(3){box-shadow:0 0 10px #93b9b29c,inset -3px -4px 5px #0002}.collection-preview-ball[data-preview-skin=stardust]{background:radial-gradient(ellipse at top,#e3e0f7,#d0e3ea)}.collection-preview-ball[data-preview-skin=stardust]>i{position:relative;background-image:radial-gradient(circle at 28% 23%,#ffffffc9,transparent 70%);box-shadow:inset -3px -3px 5px #79719422,0 4px 5px #7d729125}.collection-preview-ball[data-preview-skin=stardust]>i:after{content:'✦';position:absolute;top:18%;left:27%;font-style:normal;font-size:10px;color:#ffffffdc}
.collection-preview-tube{gap:13px}.collection-preview-tube>i{display:flex;flex-direction:column-reverse;gap:2px;width:27px;height:74px;border:1.5px solid #c5c6d8;border-top-width:3px;border-radius:3px 3px 13px 13px;padding:4px 3px;background:linear-gradient(90deg,#ffffffa3,#ffffff23);box-shadow:inset 2px 0 0 #fff9}.collection-preview-tube b{display:block;width:100%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 30% 25%,#fff7,transparent 70%),#b39ed8;flex-shrink:0}.collection-preview-tube b:nth-child(2){background-color:#d9a29c}.collection-preview-tube b:nth-child(3){background-color:#93b9b2}.collection-preview-tube[data-preview-skin=frost]>i{border-color:#bad5e4;background:linear-gradient(130deg,#eff9ffba,#e7f1ff57);box-shadow:inset 3px 0 0 #fff8,0 0 8px #bfd9e855}.collection-preview-tube[data-preview-skin=crystal]>i{border-color:#b9afd8;background:linear-gradient(112deg,#ffffff99 0 25%,#cbbce726 26% 55%,#edf7ff7a 56% 75%,#ffffff35 76%);box-shadow:inset 2px 0 0 #fff,2px 2px 0 #e3d9ee}.collection-preview-tube[data-preview-skin=gold]>i{border-color:#d5bd83;background:linear-gradient(90deg,#fff9,#f7edce35);box-shadow:inset 2px 0 0 #fff9,0 3px 6px #c3a7681c}
.collection-lock{position:absolute;inset:0;display:grid;place-items:center;z-index:2;background:#f1eff47a;backdrop-filter:blur(1px);color:#a8a0b5}.collection-lock svg{width:20px;height:20px;padding:8px;box-sizing:content-box;border:1px solid #fff8;border-radius:50%;background:#ffffff8c}.collection-skin-name{font-size:12px;font-weight:600;letter-spacing:-.2px;line-height:1.5}.collection-skin-description{font-size:9px;color:var(--cr-muted);line-height:1.8;margin-top:4px;min-height:32px}.collection-skin-state{font-size:9px;color:#a190b4;margin-top:9px}.collection-skin.is-equipped .collection-skin-state{color:#9a7bb6}.collection-notice{font-size:10px;color:var(--cr-muted);line-height:1.9;min-height:19px;text-align:center;margin:15px 0 25px}.collection-badge-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:13px}.collection-badge-heading h3{font-size:14px;font-weight:600;margin:0;letter-spacing:-.3px}.collection-badge-heading>span{font-size:10px;color:var(--cr-muted)}.collection-badges{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.collection-badge{display:flex;align-items:center;gap:12px;min-width:0;padding:13px;border:1px solid var(--cr-border);border-radius:12px;background:var(--cr-surface);opacity:.64}.collection-badge-icon{display:grid;place-items:center;width:34px;height:34px;flex-shrink:0;border:1px solid #ebe5f1;border-radius:10px;background:#f7f4fb;color:#b8a8ca;font-size:20px}.collection-badge>div{min-width:0}.collection-badge strong{display:block;font-size:10px;font-weight:600;line-height:1.5}.collection-badge small{display:block;color:var(--cr-muted);font-size:9px;line-height:1.8;margin-top:3px}.collection-badge-check{margin-left:auto;color:#a5b4a6;font-size:12px;flex-shrink:0}.collection-badge.is-earned{opacity:1;border-color:#dfd4eb;background:linear-gradient(110deg,var(--cr-surface),#f8f5fc)}.collection-badge.is-earned .collection-badge-icon{color:#ad8ac7;background:#f0e7f8;border-color:#e5d7ef}.collection-storage-note{font-size:9px;text-align:center;color:#b6adbf;line-height:1.8;margin:22px 0 0}
html[data-theme=dark] .collection-room,html[data-theme=aurora] .collection-room{--cr-ink:#dee1ef;--cr-muted:#8e97b4;--cr-border:#363c56;--cr-surface:#252b40}html[data-theme=dark] .collection-total,html[data-theme=aurora] .collection-total{color:#b5a7ce}html[data-theme=dark] .collection-progress>div,html[data-theme=aurora] .collection-progress>div{background:#34384f}html[data-theme=dark] .collection-tabs>button[aria-pressed=true],html[data-theme=aurora] .collection-tabs>button[aria-pressed=true]{background:#3a3150;border-color:#66527e;color:#c5afd9}html[data-theme=dark] .collection-preview,html[data-theme=aurora] .collection-preview{background:radial-gradient(ellipse at top,#363b55,#292e44)}html[data-theme=dark] .collection-lock,html[data-theme=aurora] .collection-lock{background:#252a406b;color:#b3abc5}html[data-theme=dark] .collection-lock svg,html[data-theme=aurora] .collection-lock svg{background:#34394dba;border-color:#5e5d7855}html[data-theme=dark] .collection-badge-icon,html[data-theme=aurora] .collection-badge-icon{background:#34324b;border-color:#45415e;color:#9e8fb5}html[data-theme=dark] .collection-badge.is-earned,html[data-theme=aurora] .collection-badge.is-earned{background:linear-gradient(110deg,#292f44,#343048);border-color:#50415f}html[data-theme=dark] .collection-badge.is-earned .collection-badge-icon,html[data-theme=aurora] .collection-badge.is-earned .collection-badge-icon{background:#433752;color:#c5a2df;border-color:#5b466d}
@media(max-width:650px){.collection-heading h2{font-size:21px}.collection-heading p{font-size:10px}.collection-total{font-size:8px;padding:7px 8px}.collection-heading{gap:10px}.collection-skins{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.collection-preview{height:104px}.collection-skin{padding:11px}.collection-badges{grid-template-columns:1fr}.collection-badge{padding:12px}.collection-skin-description{min-height:30px;font-size:9px}.collection-skin-name{font-size:11px}.collection-badge strong{font-size:11px}.collection-badge small{font-size:9px}}
@media(prefers-reduced-motion:reduce){.collection-room *{transition:none!important}}
