.achievement-art{display:block;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 3px 4px #0008)}
.frame-art{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2;overflow:visible;filter:drop-shadow(0 2px 3px #0009)}
.art-frame{position:relative;isolation:isolate;display:grid;place-items:center;background:radial-gradient(circle at 40% 20%,#29422d,#080e0b 70%);border-radius:22%;aspect-ratio:1}
.art-frame>img{width:73%;height:73%;object-fit:contain;position:relative;z-index:1}
.badge-art-wrap{display:block;flex-shrink:0;width:54px;height:54px}
.badge-art-wrap.locked{opacity:.65;filter:saturate(.35)}

/* Tier geometry lives in the SVG, not glow, hue, or the owner's level. */
.frame-art{filter:drop-shadow(0 2px 2px #0008);animation:none}
.banner-art{display:block;width:100%;height:100%;pointer-events:none}
.candle-art{display:block;width:78px;height:108px;margin:auto;flex-shrink:0}
.banner-layer{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;border-radius:inherit}
.banner-layer .banner-art{object-fit:cover;min-height:100%}
.player-hero,.custom-profile-preview{position:relative;isolation:isolate}
.player-hero>.banner-layer,.custom-profile-preview>.banner-layer{z-index:-1}
.profile-live .player-hero,.custom-profile-preview{background:#10191c!important}
.player-hero .hero-main,.player-hero .level-card,.custom-preview-copy{position:relative;background:#10191cde;border-radius:12px;padding:10px}
.cosmetic-banner{position:relative;overflow:hidden!important;background:#10191c!important}
.cosmetic-banner::before,.cosmetic-banner::after,.custom-profile-preview::before,.player-hero::after{content:none!important}
.cosmetic-banner .banner-art{position:absolute;inset:0;object-fit:contain}
.cosmetic-preview-candle{display:grid;place-items:center;gap:4px;background:#10191ce8;border:1px solid #42515d;border-radius:12px;padding:9px;min-width:94px}
.cosmetic-preview-candle small{font-size:10px;color:#d1dce1;text-align:center}
.tier-label{display:block;font:700 10px/1.5 Inter,system-ui,sans-serif;letter-spacing:.07em;color:#d3dce3;text-transform:uppercase}
.reward-card[data-visual-tier="medium"],.cosmetic-choice[data-visual-tier="medium"]{border-style:double;border-width:3px}
.reward-card[data-visual-tier="high"],.cosmetic-choice[data-visual-tier="high"]{border:3px solid #91a6b8;border-radius:4px 20px 4px 20px;box-shadow:inset 0 0 0 3px #10191c,inset 0 0 0 4px #617280}
.reward-card>.tier-label{font-size:9px;min-height:27px}
.style-tabs{grid-template-columns:repeat(6,minmax(0,1fr))!important;overflow-x:auto}
.style-tabs button{min-width:65px}
.custom-preview-inner{flex-wrap:wrap}
@keyframes cosmeticDrift{from{transform:translateX(-1px)}to{transform:translateX(2px)}}
.visual-medium .cosmetic-accent,.visual-high .cosmetic-accent{animation:cosmeticDrift 5s ease-in-out infinite alternate}
.theme-static .cosmetic-accent{animation:none!important;transform:none!important}
@media(prefers-reduced-motion:reduce){.cosmetic-accent,.frame-art,.banner-art{animation:none!important;transition:none!important;transform:none!important}}
@media(max-width:600px){.style-tabs{display:flex!important}.style-tabs button{flex:1 0 70px}.cosmetic-preview-candle{min-width:72px;padding:6px}.cosmetic-preview-candle .candle-art{width:54px;height:80px}.custom-profile-preview{padding:14px!important}.custom-preview-inner{gap:12px!important}.reward-card .candle-art{height:96px}.player-hero .hero-main{padding:7px}}

/* Prestige Collection I: only the broadcast light / tiny inlays breathe.
   The artwork stays complete and legible when animation is absent. */
@keyframes prestigeSignal{0%,100%{opacity:1}50%{opacity:.52}}
.prestige-art .prestige-accent{animation:prestigeSignal 5.5s ease-in-out infinite}
.theme-static .prestige-accent{animation:none!important;opacity:1!important}
@media(prefers-reduced-motion:reduce){.prestige-art .prestige-accent{animation:none!important;transition:none!important;opacity:1!important;transform:none!important}}
