.cosmetics-intro{color:var(--cos-text-muted);line-height:1.6;margin-bottom:var(--space-xl)}:root{--cos-rail-width:260px;--cos-list-width:320px;--cos-surface:var(--mp-bg-surface,rgba(14,18,32,.96));--cos-elev:var(--mp-bg-elevated,rgba(18,24,34,.92));--cos-border:var(--mp-border-default,rgba(48,54,61,.8));--cos-border-muted:var(--mp-border-muted,rgba(48,54,61,.5));--cos-accent:var(--mp-accent,var(--accent-primary,#58a6ff));--cos-text:var(--mp-text-primary,var(--text-bright,#e6edf3));--cos-text-muted:var(--mp-text-secondary,var(--text-muted,#8b949e));--cos-shadow:var(--mp-shadow-md,var(--shadow-lg,0 8px 24px rgba(0,0,0,.4)))}.cosmetics-console{align-items:stretch;display:grid;gap:var(--space-md);grid-template-columns:var(--cos-rail-width) var(--cos-list-width) minmax(0,1fr);height:70vh;max-height:700px;max-width:100%;min-height:450px;overflow:hidden;width:100%}.cosmetics-detail,.cosmetics-list,.cosmetics-rail{background:var(--cos-surface);border:var(--border-thin) solid var(--cos-border);border-radius:var(--radius-xl);box-shadow:var(--cos-shadow);display:flex;flex-direction:column;overflow:hidden}.cosmetics-rail{overflow:hidden}.cosmetics-rail__header{border-bottom:var(--border-thin) solid var(--cos-border-muted);padding:var(--space-lg)}.cosmetics-rail__title{color:var(--cos-text);font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);margin:0}.cosmetics-rail__tree{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:var(--space-md)}.cos-group{margin-bottom:4px}.cos-group__header{align-items:center;background:transparent;border:var(--border-thin) solid transparent;border-radius:var(--radius-lg);color:var(--cos-text);cursor:pointer;display:flex;font-weight:var(--font-weight-semibold);gap:8px;padding:10px 12px;text-align:left;transition:background .15s,border-color .15s;width:100%}.cos-group__header:hover{background:rgba(88,166,255,.08);border-color:rgba(88,166,255,.15)}.cos-group__header[aria-expanded=true]{background:rgba(88,166,255,.06)}.cos-group__arrow{color:var(--cos-text-muted);height:16px;transition:transform .2s;width:16px}.cos-group__header[aria-expanded=true] .cos-group__arrow{transform:rotate(90deg)}.cos-group__icon{font-size:18px}.cos-group__label{flex:1}.cos-group__count{background:rgba(0,0,0,.25);border-radius:var(--radius-full);color:var(--cos-text-muted);font-size:var(--font-size-xs);padding:2px 8px}.cos-group__children{display:none;margin-top:4px;padding-left:24px}.cos-group[data-expanded=true]>.cos-group__children{display:block}.cos-subgroup{align-items:center;background:transparent;border:var(--border-thin) solid transparent;border-radius:var(--radius-md);color:var(--cos-text-muted);cursor:pointer;display:flex;font-size:var(--font-size-sm);gap:8px;padding:8px 12px;text-align:left;transition:background .15s,color .15s,border-color .15s;width:100%}.cos-subgroup:hover{background:rgba(88,166,255,.06);color:var(--cos-text)}.cos-subgroup[aria-selected=true]{background:rgba(88,166,255,.12);border-color:rgba(88,166,255,.35);color:var(--cos-text);font-weight:var(--font-weight-semibold)}.cos-subgroup__icon{font-size:16px}.cos-subgroup__count{color:var(--cos-text-muted);font-size:var(--font-size-xs);margin-left:auto}.cosmetics-detail{min-width:0;overflow:hidden}.cosmetics-detail__empty{align-items:center;color:var(--cos-text-muted);display:flex;flex:1;flex-direction:column;justify-content:center;padding:var(--space-2xl);text-align:center}.cosmetics-detail__empty-icon{font-size:64px;margin-bottom:var(--space-lg);opacity:.5}.cosmetics-detail__empty-text{font-size:var(--font-size-lg);margin:0}.cosmetics-detail__content{display:none;flex-direction:column;height:100%}.cosmetics-detail__content.active{display:flex}.cosmetics-detail__image-wrap{align-items:center;background:radial-gradient(ellipse 80% 70% at 50% 40%,var(--detail-glow,rgba(88,166,255,.1)),transparent 70%);border-bottom:1px solid hsla(0,0%,100%,.07);display:flex;flex:0 0 auto;justify-content:center;padding:var(--space-lg);position:relative}.cosmetics-detail__image{border-radius:var(--radius-lg);filter:drop-shadow(0 4px 16px rgba(0,0,0,.5));max-height:240px;max-width:240px;-o-object-fit:contain;object-fit:contain}.cosmetics-detail__image-placeholder{background:hsla(0,0%,100%,.04);border:var(--border-thin) solid hsla(0,0%,100%,.08);border-radius:var(--radius-xl);display:grid;font-size:120px;height:240px;place-items:center;width:240px}.cosmetics-detail__info{display:flex;flex:1;flex-direction:column;gap:4px;min-height:0;overflow-y:auto;padding:var(--space-md) var(--space-lg)}.cosmetics-detail__cat-label{color:var(--cos-text-muted);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);letter-spacing:.08em;opacity:.7;text-transform:uppercase}.cosmetics-detail__name{border-left:3px solid var(--detail-accent,var(--cos-accent));color:var(--cos-text);font-size:var(--font-size-xl,1.25rem);font-weight:var(--font-weight-bold);line-height:1.3;margin:0 0 2px;padding-left:10px}.cosmetics-detail__quality{align-items:center;align-self:flex-start;border:1px solid;border-radius:var(--radius-full);display:inline-flex;font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);margin-bottom:4px;padding:2px 10px}.cosmetics-detail__quality--event{background:rgba(156,163,175,.12);color:#9ca3af}.cosmetics-detail__quality--classic{background:rgba(74,222,128,.12);color:#4ade80}.cosmetics-detail__quality--rare{background:rgba(194,120,45,.12);color:#c2782d}.cosmetics-detail__quality--seasonal{background:rgba(212,175,55,.12);color:#d4af37}.cosmetics-detail__quality--supreme{background:rgba(245,158,11,.12);color:#f59e0b}.cosmetics-detail__quality--prestige{background:rgba(192,132,252,.12);color:#c084fc}.cos-quality-icon{margin-right:4px;-o-object-fit:contain;object-fit:contain;vertical-align:middle}.cosmetics-detail__desc-section{border-top:1px solid hsla(0,0%,100%,.06);margin-top:var(--space-sm);padding-top:var(--space-sm)}.cosmetics-detail__desc{color:var(--cos-text-muted);font-size:var(--font-size-sm);line-height:1.5;margin-bottom:var(--space-sm)}.cosmetics-detail__buffs-wrap{display:flex;flex-direction:row;flex-wrap:wrap;gap:var(--space-sm)}.cosmetics-detail__buffs-wrap>*{flex:1 1 45%;min-width:150px}.cosmetics-detail__buffs{background:rgba(0,0,0,.2);border:var(--border-thin) solid hsla(0,0%,100%,.06);border-radius:var(--radius-md);padding:var(--space-sm)}.cosmetics-detail__buffs--owning{background:rgba(168,85,247,.08);border-color:rgba(168,85,247,.3)}.cosmetics-detail__buffs--equipping{background:rgba(34,197,94,.08);border-color:rgba(34,197,94,.3)}.cosmetics-detail__buffs-title{color:var(--cos-accent);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);margin:0 0 var(--space-sm)}.cosmetics-detail__buffs--owning .cosmetics-detail__buffs-title{color:#a855f7}.cosmetics-detail__buffs--equipping .cosmetics-detail__buffs-title{color:#22c55e}.cosmetics-detail__buff{color:var(--cos-text);font-size:var(--font-size-sm);padding:4px 0}.cosmetics-detail__skill{background:rgba(0,0,0,.25);border:var(--border-thin) solid rgba(168,85,247,.25);border-radius:var(--radius-md);margin-bottom:10px;padding:12px}.cosmetics-detail__skill-header{color:var(--cos-text);font-size:var(--font-size-base);margin-bottom:6px}.cosmetics-detail__skill-header strong{color:#a855f7}.cosmetics-detail__skill-desc{color:var(--cos-text-muted);font-size:var(--font-size-sm);line-height:1.5}.cosmetics-list{overflow:hidden}.cosmetics-list__header{border-bottom:var(--border-thin) solid var(--cos-border-muted);padding:var(--space-lg)}.cosmetics-list__title{color:var(--cos-text);font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);margin:0 0 var(--space-sm)}.cosmetics-list__search{background:rgba(0,0,0,.22);border:var(--border-thin) solid hsla(0,0%,100%,.1);border-radius:var(--radius-md);color:var(--cos-text);font-size:var(--font-size-sm);padding:8px 12px;width:100%}.cosmetics-list__search:focus{border-color:rgba(88,166,255,.45);outline:none}.cosmetics-list__items{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:var(--space-md)}.cosmetics-list__empty{color:var(--cos-text-muted);padding:var(--space-xl);text-align:center}.cos-item{align-items:center;background:transparent;border:var(--border-thin) solid transparent;border-radius:var(--radius-lg);cursor:pointer;display:flex;gap:12px;margin-bottom:4px;padding:10px 12px;transition:background .15s,border-color .15s}.cos-item:hover{background:rgba(88,166,255,.06);border-color:rgba(88,166,255,.15)}.cos-item[aria-selected=true]{background:rgba(88,166,255,.12);border-color:rgba(88,166,255,.35)}.cos-item__thumb{-o-object-fit:contain;object-fit:contain}.cos-item__thumb,.cos-item__thumb-placeholder{background:rgba(0,0,0,.2);border:var(--border-thin) solid hsla(0,0%,100%,.06);border-radius:var(--radius-md);flex-shrink:0;height:72px;width:72px}.cos-item__thumb-placeholder{display:grid;font-size:32px;place-items:center}.cos-item__info{flex:1;min-width:0}.cos-item__name{color:var(--cos-text);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cos-item__meta{color:var(--cos-text-muted);font-size:var(--font-size-xs);margin:2px 0 0}@media (max-width:1100px){.cosmetics-console{gap:var(--space-sm);grid-template-columns:220px minmax(0,1fr);grid-template-rows:1fr auto;height:auto;max-height:none}.cosmetics-detail{grid-column:1/-1;max-height:450px}.cosmetics-rail{max-height:400px}}@media (max-width:768px){.cosmetics-intro{font-size:var(--font-size-sm);margin-bottom:var(--space-md)}.cosmetics-console{gap:var(--space-sm);grid-template-columns:1fr;height:auto}.cosmetics-rail{border-radius:var(--radius-lg)}.cosmetics-rail,.cosmetics-rail__tree{max-height:none;overflow:visible}.cosmetics-rail__header{padding:var(--space-md)}.cosmetics-rail__title{font-size:var(--font-size-base)}.cosmetics-list{border-radius:var(--radius-lg);max-height:none}.cosmetics-list__items{max-height:350px;overflow-y:auto}.cosmetics-list__header{padding:var(--space-md)}.cosmetics-list__title{font-size:var(--font-size-base)}.cosmetics-detail{border-radius:var(--radius-lg);max-height:none;min-height:auto}.cosmetics-detail__image-wrap{padding:var(--space-md)}.cosmetics-detail__image{max-height:210px;max-width:210px}.cosmetics-detail__image-placeholder{font-size:80px;height:170px;width:170px}.cosmetics-detail__info{padding:var(--space-md)}.cosmetics-detail__name{font-size:var(--font-size-base)}.cosmetics-detail__buffs-wrap{flex-direction:column}.cosmetics-detail__buffs-wrap>*{flex:1 1 100%;min-width:100%}.cos-group__header{padding:12px 10px}.cos-subgroup{padding:10px 12px}.cos-item{padding:12px 10px}.cos-item__thumb,.cos-item__thumb-placeholder{height:64px;width:64px}.cos-item__thumb-placeholder{font-size:28px}}@media (max-width:480px){.cosmetics-rail,.cosmetics-rail__tree{max-height:none;overflow:visible}.cosmetics-list{max-height:none}.cosmetics-list__items{max-height:300px;overflow-y:auto}.cosmetics-detail__image{max-height:175px;max-width:175px}.cosmetics-detail__image-placeholder{font-size:67px;height:135px;width:135px}.cos-group__header{font-size:var(--font-size-sm);padding:10px 8px}.cos-subgroup{font-size:var(--font-size-xs);padding:8px 10px}}.collection-card{background:var(--cos-surface);border:1px solid var(--cos-border);border-radius:var(--radius-lg,12px);box-shadow:0 8px 24px rgba(0,0,0,.35);padding:var(--space-xl)}.collection-header{margin-bottom:var(--space-md)}.collection-name{border-left:3px solid var(--cos-accent);color:var(--cos-text);font-size:1.25rem;margin:0;padding-left:var(--space-sm)}.collection-description{color:var(--cos-text-muted);line-height:1.65;margin:var(--space-sm) 0 var(--space-lg)}.item-card{align-items:center;background:var(--cos-elev);border:1px solid var(--cos-border-muted);border-radius:var(--radius-md,8px);display:flex;flex-direction:column;gap:var(--space-xs);padding:var(--space-md);text-align:center;transition:border-color .2s,transform .2s}.item-card:hover{border-color:var(--cos-accent);transform:translateY(-3px)}.item-name{color:var(--cos-text);font-size:var(--font-size-sm,.85rem);font-weight:500;line-height:1.3}.buff-item{align-items:flex-start;color:var(--cos-text-muted);display:flex;font-size:var(--font-size-sm);gap:var(--space-sm);margin-bottom:var(--space-sm)}.buff-icon{flex-shrink:0;font-size:1rem}.buff-description{color:var(--cos-text);line-height:1.5}@media (max-width:600px){.collection-card{padding:var(--space-lg)}}