/* Player-card cosmetics gallery */
.ssq-cosmetic-picker-trigger { width:100%; min-height:38px; margin-top:6px; padding:9px 12px; border:1px solid #9474bc; border-radius:10px; background:#3b2450; color:#fff4ff; text-align:left; cursor:pointer; }
.ssq-cosmetic-picker-trigger:hover { background:#55346e; }
.ssq-cosmetic-viewer[hidden] { display:none!important; }
.ssq-cosmetic-viewer { position:fixed;inset:0;z-index:100100;background:rgba(13,8,25,.85);display:flex;align-items:center;justify-content:center;padding:14px; }
.ssq-cosmetic-dialog { width:min(950px,100%);max-height:92dvh;overflow:auto;padding:18px;border:2px solid #9879bb;border-radius:18px;color:#f5e8ff;background:linear-gradient(145deg,#321d43,#180f27);box-shadow:0 20px 65px #080310; }
.ssq-cosmetic-dialog header { display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px; }
.ssq-cosmetic-dialog header h3 { margin:3px 0;font-size:1.25rem; }
.ssq-cosmetic-dialog header small {color:#c9abd9;}
.ssq-cosmetic-dialog [data-cosmetic-close] { font-size:1.6rem;background:#4c2b61;color:white;border:1px solid #a286bb;border-radius:9px;min-width:40px;min-height:40px;cursor:pointer;}
.ssq-cosmetic-tabs { display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px; }
.ssq-cosmetic-tabs button { padding:8px 10px;border:1px solid #73598b;border-radius:10px;color:#f2e3ff;background:#352343;cursor:pointer;}
.ssq-cosmetic-tabs button.selected {background:#77509b;border-color:#d4aaf0;}
.ssq-cosmetic-grid {display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,170px),1fr));gap:10px;max-height:57dvh;overflow-y:auto;padding:3px;}
.ssq-cosmetic-tile { display:flex;flex-direction:column;align-items:center;gap:8px;min-height:150px;padding:13px 10px;background:#3b274e;border:1px solid #79618e;border-radius:12px;color:#fff;cursor:pointer;text-align:center; }
.ssq-cosmetic-tile img {object-fit:contain;width:74px;height:60px;}
.ssq-cosmetic-tile strong {font-size:.93rem;overflow-wrap:anywhere;}
.ssq-cosmetic-tile small {font-size:.77rem;line-height:1.35;color:#d1bbdf;overflow-wrap:anywhere;}
.ssq-cosmetic-tile .ssq-cosmetic-glyph {display:flex;align-items:center;justify-content:center;width:60px;height:60px;font-size:1.7rem;color:#dac4ec;background:#4d3261;border-radius:12px;}
.ssq-cosmetic-tile.selected {border-color:#f5d28c;box-shadow:inset 0 0 0 1px #f5d28c;}
.ssq-cosmetic-tile:disabled {opacity:.68;cursor:not-allowed;background:#292234;}
.ssq-cosmetic-status {min-height:1.2em;color:#dac4ec;margin:10px 0 0;}
@media(max-width:600px){.ssq-cosmetic-dialog{padding:12px;max-height:95dvh}.ssq-cosmetic-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-height:55dvh;}.ssq-cosmetic-tile{min-height:132px;}}

/* Owned appearance cosmetics show their actual text treatment instead
   of a generic sparkle icon. Existing unscoped Player styles handle
   name gradients, glow and most animated name effects. */
.ssq-cosmetic-tile .ssq-cosmetic-style-preview {
    display: inline-block;
    align-self: center;
    max-width: 100%;
    min-height: 54px;
    align-content: center;
    padding: 13px 2px 7px;
    font-size: 1.02rem;
    font-weight: 900;
    line-height: 1.35;
    overflow-wrap: anywhere;
    text-align: center;
    vertical-align: middle;
}
.ssq-cosmetic-tile .ssq-cosmetic-style-preview[data-title-appearance="supporterSpectralTitle"] {
    color: #d9c7ff;
    text-shadow: 0 0 6px rgba(217,199,255,.92), 0 0 13px rgba(158,98,149,.62);
}
.ssq-cosmetic-tile .ssq-cosmetic-style-preview[data-title-appearance="spookyOrangeGlowTitle"] {
    color: #ff9b3d;
    text-shadow: 0 0 7px rgba(255,128,32,.88), 0 0 13px rgba(255,92,0,.5);
}
.ssq-cosmetic-tile .ssq-cosmetic-style-preview[data-name-appearance="spookyOrangeGlowName"] {
    color: #ff9b3d;
    text-shadow: 0 0 7px rgba(255,128,32,.9), 0 0 14px rgba(255,97,0,.55);
}
.ssq-cosmetic-tile .ssq-cosmetic-style-preview[data-name-effect="spookyAnimatedName"] {
    animation: spookySeasonNamePulse 1.8s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce) {
    .ssq-cosmetic-tile .ssq-cosmetic-style-preview[data-name-effect="spookyAnimatedName"] {
        animation: none;
    }
}

/* One Name Styles gallery, with independent appearance and effect sections. */
.account-profile-cosmetic-grid .ssq-cosmetic-hidden-equip[hidden] {
    display: none !important;
}
.ssq-cosmetic-name-hint,
.ssq-cosmetic-group-heading,
.ssq-cosmetic-category-tiles {
    grid-column: 1 / -1;
    min-width: 0;
}
.ssq-cosmetic-name-hint {
    margin: 0;
    padding: 11px 12px;
    border: 1px solid rgba(176,128,210,.38);
    border-radius: 10px;
    color: #e3cee9;
    background: rgba(93,55,127,.22);
    font-size: .84rem;
    line-height: 1.45;
}
.ssq-cosmetic-group-heading {
    margin: 8px 0 0;
    color: #f3d5ff;
    font-size: .94rem;
    letter-spacing: .01em;
}
.ssq-cosmetic-category-tiles {
    display: grid;
    grid-template-columns: repeat(auto-fill,minmax(min(100%,170px),1fr));
    gap: 10px;
}
@media(max-width:600px) {
    .ssq-cosmetic-category-tiles {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

/* 3:1 profile banners preview as banners, not square icons.
   Locked banners reveal neither their image nor their actual name. */
.ssq-cosmetic-tile[data-cosmetic-preview-type="banner"] img,
.ssq-cosmetic-tile[data-cosmetic-preview-type="banner"] .ssq-cosmetic-glyph {
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:auto;
    aspect-ratio:3 / 1;
    border-radius:8px;
    box-sizing:border-box;
    flex-shrink:0;
}
.ssq-cosmetic-tile[data-cosmetic-preview-type="banner"] img {
    display:block;
    object-fit:cover;
}
.ssq-cosmetic-tile[data-cosmetic-preview-type="banner"] .ssq-cosmetic-glyph {
    font-size:1.25rem;
    font-weight:800;
    letter-spacing:.12em;
    color:#dcc7ee;
    background:linear-gradient(135deg,#382349,#241b33);
    border:1px dashed #735884;
}