/* =========================================================
   ST7D v7.8.3 - PROFILE STUDIO LIVE PREVIEW + COSMETIC FUNCTION PASS
   Every non-default cosmetic gets a visible treatment. Expensive motion
   is limited to visible profile/preview surfaces by the v7.8.3 runtime.
   ========================================================= */

/* --- Identity Vault workbench: collection left, live sticky preview right --- */
.identity-vault-workbench{display:grid;grid-template-columns:minmax(0,1fr) minmax(390px,460px);gap:20px;align-items:start}
.identity-vault-workbench>#memberIdentityVault{min-width:0}
.identity-vault-workbench .identity-vault-catalog{grid-template-columns:1fr!important}
.identity-vault-workbench .identity-vault-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
.identity-vault-preview-dock{position:sticky;top:94px;min-width:0;max-height:calc(100vh - 112px);overflow:auto;padding:14px;border:1px solid rgba(255,255,255,.09);border-radius:16px;background:linear-gradient(145deg,rgba(15,15,18,.98),rgba(8,8,10,.985));box-shadow:0 22px 60px rgba(0,0,0,.28);scrollbar-width:thin;scrollbar-color:#36363b transparent}
.identity-vault-preview-head{display:grid;gap:4px;margin:0 0 11px;padding:0 2px 11px;border-bottom:1px solid rgba(255,255,255,.07)}
.identity-vault-preview-head>span{color:#ef555b;font:900 9px/1 Inter,sans-serif;letter-spacing:.13em}
.identity-vault-preview-head>strong{color:#f2ede9;font-size:12px}.identity-vault-preview-head>small{color:#77716d;font-size:10px;line-height:1.45}
#identityVaultPreview{min-width:0}
#identityVaultPreview .profile-mini-preview{margin:0}
#identityVaultPreview .profile-live-preview-head{display:none}
#identityVaultPreview .profile-preview-selection-grid{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:9px;gap:6px}
#identityVaultPreview .profile-preview-selection-grid article{min-height:48px;padding:8px 9px}
#identityVaultPreview .profile-preview-selection-grid span{font-size:7px}#identityVaultPreview .profile-preview-selection-grid strong{font-size:9px}
#identityVaultPreview .profile-preview-media-grid,#identityVaultPreview .profile-preview-meta{display:none!important}
#identityVaultPreview .profile-mini-copy p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#identityVaultPreview .profile-mini-preview{min-height:385px}
#identityVaultPreview .profile-mini-hero{min-height:385px}
.identity-vault-preview-dock .portal-loading{min-height:210px;display:grid;place-items:center}
@media(max-width:1180px){.identity-vault-workbench{grid-template-columns:1fr}.identity-vault-preview-dock{position:static;max-height:none;order:-1}.identity-vault-workbench .identity-vault-catalog{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:760px){.identity-vault-workbench .identity-vault-summary,.identity-vault-workbench .identity-vault-catalog{grid-template-columns:1fr!important}.identity-vault-preview-dock{padding:10px}#identityVaultPreview .profile-preview-selection-grid{grid-template-columns:1fr 1fr}}

/* --- Common functional effect layer --- */
.profile-showcase,.profile-mini-preview{position:relative;isolation:isolate}
.profile-showcase-backdrop{z-index:0!important}
.profile-cosmetic-effect-layer{position:absolute;inset:0;z-index:1;overflow:hidden;border-radius:inherit;pointer-events:none;opacity:.72;transform:translateZ(0)}
.profile-showcase-grid,.profile-mini-hero,.profile-mini-finish-label{position:relative;z-index:2}
.progression-effect-none .profile-cosmetic-effect-layer{display:none}

/* The old options now all have an unmistakable visual layer. */
.progression-effect-scanlines .profile-cosmetic-effect-layer{background:repeating-linear-gradient(0deg,transparent 0 4px,rgba(210,235,245,.055) 4px 5px);opacity:.42}
.progression-effect-fallout .profile-cosmetic-effect-layer{background:radial-gradient(circle at 76% 28%,rgba(82,255,110,.19),transparent 28%),radial-gradient(circle at 28% 76%,rgba(54,204,82,.10),transparent 24%);box-shadow:inset 0 0 46px rgba(75,228,95,.09)}
.progression-effect-embers .profile-cosmetic-effect-layer{background:radial-gradient(circle at 15% 88%,rgba(255,157,66,.72) 0 2px,transparent 3px),radial-gradient(circle at 32% 92%,rgba(255,79,42,.64) 0 1.5px,transparent 3px),radial-gradient(circle at 63% 87%,rgba(255,184,78,.58) 0 1.5px,transparent 3px),radial-gradient(circle at 83% 94%,rgba(255,92,44,.62) 0 2px,transparent 3px);background-size:140px 170px,190px 210px,220px 190px,170px 230px;opacity:.68}
.progression-effect-frost .profile-cosmetic-effect-layer{background:linear-gradient(115deg,transparent 24%,rgba(111,219,255,.11) 46%,transparent 64%),radial-gradient(circle at 82% 14%,rgba(99,211,255,.12),transparent 28%);opacity:.66}
.progression-effect-legendary .profile-cosmetic-effect-layer{background:radial-gradient(circle at 82% 15%,rgba(255,224,126,.18),transparent 30%),linear-gradient(120deg,transparent 35%,rgba(255,255,255,.055) 48%,transparent 60%);box-shadow:inset 0 0 54px rgba(238,186,69,.09)}
.progression-effect-season_crown .profile-cosmetic-effect-layer{background:conic-gradient(from 225deg at 82% 8%,transparent 0 35deg,rgba(244,204,94,.16) 36deg 43deg,transparent 44deg 75deg,rgba(244,204,94,.11) 76deg 82deg,transparent 83deg 360deg);opacity:.85}
.progression-effect-prestige_pulse .profile-cosmetic-effect-layer{background:radial-gradient(ellipse at center,transparent 52%,rgba(120,92,255,.11) 69%,transparent 75%);box-shadow:inset 0 0 42px rgba(76,193,255,.07)}
.progression-effect-immortal_aura .profile-cosmetic-effect-layer{background:radial-gradient(circle at 82% 14%,rgba(255,244,199,.19),transparent 30%),radial-gradient(circle at 15% 85%,rgba(241,196,82,.10),transparent 23%);box-shadow:inset 0 0 50px rgba(255,235,168,.08)}
.progression-effect-apex_aura .profile-cosmetic-effect-layer{background:repeating-conic-gradient(from 0deg at 80% 18%,rgba(255,60,68,.12) 0 5deg,transparent 5deg 18deg,rgba(246,204,91,.09) 18deg 22deg,transparent 22deg 39deg);opacity:.76}

/* v7.8.2 collection effects. */
.progression-effect-reactor_particles .profile-cosmetic-effect-layer{background:radial-gradient(circle at 14% 18%,rgba(132,255,129,.78) 0 2px,transparent 3px),radial-gradient(circle at 33% 74%,rgba(72,222,96,.66) 0 1.5px,transparent 3px),radial-gradient(circle at 63% 22%,rgba(189,255,140,.58) 0 1.5px,transparent 3px),radial-gradient(circle at 86% 68%,rgba(88,239,102,.72) 0 2px,transparent 3px);background-size:160px 190px,210px 170px,180px 230px,240px 180px;box-shadow:inset 0 0 45px rgba(84,232,98,.08)}
.progression-effect-electric_arc .profile-cosmetic-effect-layer{background:linear-gradient(128deg,transparent 0 47%,rgba(159,232,255,.18) 48%,transparent 49% 62%,rgba(103,181,255,.11) 63%,transparent 64%),radial-gradient(circle at 78% 17%,rgba(94,195,255,.15),transparent 28%);background-size:175% 100%,auto;opacity:.74}
.progression-effect-eclipse_dust .profile-cosmetic-effect-layer{background:radial-gradient(circle at 18% 26%,rgba(255,69,79,.64) 0 1.5px,transparent 3px),radial-gradient(circle at 52% 82%,rgba(193,21,31,.58) 0 2px,transparent 3px),radial-gradient(circle at 82% 34%,rgba(255,119,124,.42) 0 1.5px,transparent 3px);background-size:210px 180px,180px 220px,240px 190px;box-shadow:inset 0 0 52px rgba(189,22,33,.08)}
.progression-effect-void_distortion .profile-cosmetic-effect-layer{background:repeating-linear-gradient(118deg,transparent 0 34px,rgba(121,79,255,.055) 35px 37px,transparent 38px 72px),radial-gradient(circle at 80% 16%,rgba(119,70,255,.16),transparent 31%);opacity:.82}
.progression-effect-immortal_sparks .profile-cosmetic-effect-layer{background:radial-gradient(circle at 17% 21%,rgba(255,246,204,.88) 0 1.5px,transparent 3px),radial-gradient(circle at 44% 76%,rgba(242,200,92,.70) 0 2px,transparent 3px),radial-gradient(circle at 77% 25%,rgba(255,255,245,.72) 0 1.5px,transparent 3px),radial-gradient(circle at 88% 72%,rgba(246,213,124,.60) 0 2px,transparent 3px);background-size:180px 200px,220px 190px,190px 240px,250px 210px;box-shadow:inset 0 0 46px rgba(248,218,137,.08)}
.progression-effect-ascendant_energy .profile-cosmetic-effect-layer{background:radial-gradient(circle at 80% 16%,rgba(255,58,67,.19),transparent 27%),radial-gradient(circle at 63% 55%,rgba(244,201,84,.10),transparent 25%),linear-gradient(120deg,transparent 35%,rgba(255,81,84,.06) 48%,transparent 58%);opacity:.82}
.progression-effect-the_seven .profile-cosmetic-effect-layer{background:repeating-conic-gradient(from 0deg at 80% 17%,rgba(255,56,65,.16) 0 4deg,transparent 4deg 47deg,rgba(247,208,93,.13) 47deg 51deg,transparent 51deg 94deg),radial-gradient(circle at 80% 17%,rgba(255,239,174,.12),transparent 25%);opacity:.88}
.progression-effect-legacy_long_press .profile-cosmetic-effect-layer{background:repeating-linear-gradient(90deg,transparent 0 28px,rgba(211,71,55,.045) 29px 31px,transparent 32px 61px),radial-gradient(circle at 82% 15%,rgba(204,69,51,.12),transparent 30%);opacity:.68}
.progression-effect-legacy_quiet_waters .profile-cosmetic-effect-layer{background:repeating-radial-gradient(ellipse at 82% 15%,rgba(76,196,207,.065) 0 2px,transparent 3px 13px),linear-gradient(115deg,transparent 35%,rgba(95,214,222,.05) 48%,transparent 62%);opacity:.68}

/* Motion is visibility-gated by the runtime. */
.st7d-cosmetic-active.progression-effect-fallout .profile-cosmetic-effect-layer{animation:v783PulseGreen 4.8s ease-in-out infinite}
.st7d-cosmetic-active.progression-effect-embers .profile-cosmetic-effect-layer,.st7d-cosmetic-active.progression-effect-reactor_particles .profile-cosmetic-effect-layer,.st7d-cosmetic-active.progression-effect-eclipse_dust .profile-cosmetic-effect-layer,.st7d-cosmetic-active.progression-effect-immortal_sparks .profile-cosmetic-effect-layer{animation:v783Particles 8s linear infinite}
.st7d-cosmetic-active.progression-effect-frost .profile-cosmetic-effect-layer{animation:v783Sweep 7s linear infinite}
.st7d-cosmetic-active.progression-effect-legendary .profile-cosmetic-effect-layer,.st7d-cosmetic-active.progression-effect-immortal_aura .profile-cosmetic-effect-layer{animation:v783GoldPulse 5.6s ease-in-out infinite}
.st7d-cosmetic-active.progression-effect-prestige_pulse .profile-cosmetic-effect-layer{animation:v783Prestige 4.8s ease-in-out infinite}
.st7d-cosmetic-active.progression-effect-apex_aura .profile-cosmetic-effect-layer,.st7d-cosmetic-active.progression-effect-the_seven .profile-cosmetic-effect-layer{animation:v783Spin 12s linear infinite}
.st7d-cosmetic-active.progression-effect-electric_arc .profile-cosmetic-effect-layer{animation:v783Arc 4.6s steps(1,end) infinite}
.st7d-cosmetic-active.progression-effect-void_distortion .profile-cosmetic-effect-layer{animation:v783Void 6.5s ease-in-out infinite}
.st7d-cosmetic-active.progression-effect-ascendant_energy .profile-cosmetic-effect-layer{animation:v783Ascend 5.2s ease-in-out infinite}
@keyframes v783PulseGreen{50%{opacity:1;box-shadow:inset 0 0 58px rgba(83,244,106,.16)}}
@keyframes v783Particles{to{background-position:12px -48px,-18px -62px,21px -56px,-11px -75px}}
@keyframes v783Sweep{to{background-position:190% 0,0 0}}
@keyframes v783GoldPulse{50%{opacity:1;box-shadow:inset 0 0 62px rgba(248,213,119,.15)}}
@keyframes v783Prestige{50%{opacity:1;filter:saturate(1.18)}}
@keyframes v783Spin{to{transform:rotate(.001deg);background-position:24px 0,0 0}}
@keyframes v783Arc{0%,82%,100%{opacity:.48;background-position:0 0,0 0}84%{opacity:1;background-position:34% 0,0 0}87%{opacity:.54}90%{opacity:.92;background-position:66% 0,0 0}}
@keyframes v783Void{50%{opacity:1;filter:hue-rotate(10deg) saturate(1.15)}}
@keyframes v783Ascend{50%{opacity:1;box-shadow:inset 0 0 54px rgba(235,52,61,.11)}}

/* Missing V7 prestige customisations now have real visuals. */
.survivor-name-plasma{color:transparent!important;background:linear-gradient(90deg,#53d8ff,#a666ff,#f287ff,#53d8ff);background-size:200% 100%;background-clip:text!important;-webkit-background-clip:text!important;text-shadow:0 0 12px rgba(98,173,255,.15)}
.survivor-name-reactor_gold{color:transparent!important;background:linear-gradient(90deg,#d89a28,#fff1a6,#ff7d32,#d89a28);background-size:210% 100%;background-clip:text!important;-webkit-background-clip:text!important;filter:drop-shadow(0 0 5px rgba(231,168,46,.18))}
.survivor-name-apex{color:transparent!important;background:linear-gradient(90deg,#ff3b43,#f0c35d,#fff,#7d74ff,#ff3b43);background-size:230% 100%;background-clip:text!important;-webkit-background-clip:text!important;filter:drop-shadow(0 0 6px rgba(240,190,78,.19))}
.st7d-cosmetic-active .survivor-name-plasma,.st7d-cosmetic-active .survivor-name-reactor_gold,.st7d-cosmetic-active .survivor-name-apex{animation:v783Name 5s linear infinite}.st7d-cosmetic-active .survivor-name-apex{animation-duration:3.6s}@keyframes v783Name{to{background-position:210% 0}}
.progression-banner-prestige_200 .profile-showcase-backdrop{background:radial-gradient(circle at 82% 15%,rgba(127,86,255,.23),transparent 31%),linear-gradient(100deg,rgba(5,5,7,.98),rgba(25,12,57,.76) 58%,rgba(58,40,111,.24))}
.progression-banner-prestige_500 .profile-showcase-backdrop{background:radial-gradient(circle at 82% 14%,rgba(255,239,181,.25),transparent 31%),linear-gradient(100deg,rgba(5,5,7,.98),rgba(55,42,10,.73) 58%,rgba(132,101,19,.22))}
.progression-banner-apex_850 .profile-showcase-backdrop{background:radial-gradient(circle at 82% 14%,rgba(255,56,64,.27),transparent 26%),radial-gradient(circle at 70% 42%,rgba(245,200,82,.14),transparent 28%),linear-gradient(100deg,rgba(5,5,7,.98),rgba(57,8,12,.75) 55%,rgba(110,73,12,.24))}

/* Existing/new reward banners are guaranteed visible in the preview/public hero. */
.progression-banner-reactor_core .profile-showcase-backdrop,.progression-banner-electric_storm .profile-showcase-backdrop,.progression-banner-eclipse .profile-showcase-backdrop,.progression-banner-void_rift .profile-showcase-backdrop,.progression-banner-immortal .profile-showcase-backdrop,.progression-banner-ascendant .profile-showcase-backdrop,.progression-banner-the_seven .profile-showcase-backdrop,.progression-banner-prestige_200 .profile-showcase-backdrop,.progression-banner-prestige_500 .profile-showcase-backdrop,.progression-banner-apex_850 .profile-showcase-backdrop{opacity:1!important}

@media(prefers-reduced-motion:reduce){
 .st7d-cosmetic-active .profile-cosmetic-effect-layer,
 .st7d-cosmetic-active .survivor-name-plasma,.st7d-cosmetic-active .survivor-name-reactor_gold,.st7d-cosmetic-active .survivor-name-apex{animation:none!important}
}