/* ==========================================================
   STEVE BOSTON ACCESS — VERSION 2.0AA
   GENERIC CANONICAL PROFILE RING ENGINE
   One renderer for every profile ring, everywhere.
   ========================================================== */

.access-ring-anchor{
  position:relative!important;
  isolation:isolate;
  overflow:visible!important;
}

.access-profile-ring-layer{
  --access-ring-speed:3.2s;
  --access-ring-gap:8px;
  --access-ring-bloom-gap:13px;
  --access-ring-blur:10px;
  --access-ring-primary:#62f6ff;
  --access-ring-secondary:#6b7cff;
  --access-ring-highlight:#d26cff;
  --access-ring-glow:.72;
  --access-ring-thickness:1;
  position:absolute;
  z-index:0;
  pointer-events:none;
  border-radius:50%;
  overflow:visible;
}

.access-profile-ring-layer::before,
.access-profile-ring-layer::after{
  content:"";
  position:absolute;
  border-radius:50%;
  pointer-events:none;
}

.access-profile-ring-layer::before{
  inset:calc(var(--access-ring-gap) * -1);
  background:
    conic-gradient(
      from 0deg,
      var(--access-ring-primary) 0deg,
      var(--access-ring-secondary) 85deg,
      var(--access-ring-highlight) 165deg,
      var(--access-ring-primary) 255deg,
      var(--access-ring-highlight) 315deg,
      var(--access-ring-primary) 360deg
    );
  box-shadow:
    0 0 calc(14px * var(--access-ring-glow)) color-mix(in srgb,var(--access-ring-primary) 72%,transparent),
    0 0 calc(28px * var(--access-ring-glow)) color-mix(in srgb,var(--access-ring-secondary) 48%,transparent),
    0 0 calc(42px * var(--access-ring-glow)) color-mix(in srgb,var(--access-ring-highlight) 26%,transparent);
}

.access-profile-ring-layer::after{
  inset:calc(var(--access-ring-bloom-gap) * -1);
  background:
    conic-gradient(
      from 70deg,
      color-mix(in srgb,var(--access-ring-primary) 70%,transparent),
      color-mix(in srgb,var(--access-ring-secondary) 12%,transparent),
      color-mix(in srgb,var(--access-ring-highlight) 58%,transparent),
      color-mix(in srgb,var(--access-ring-primary) 10%,transparent)
    );
  filter:blur(var(--access-ring-blur));
  opacity:calc(.72 * var(--access-ring-glow));
}

/* Animated modes */
.access-profile-ring-layer[data-ring-animation="spin"]::before,
.access-profile-ring-layer[data-ring-animation="flow"]::before{
  animation:accessRingSpin var(--access-ring-speed) linear infinite;
}
.access-profile-ring-layer[data-ring-animation="spin"]::after,
.access-profile-ring-layer[data-ring-animation="flow"]::after{
  animation:accessRingBloom 1.8s ease-in-out infinite alternate;
}
.access-profile-ring-layer[data-ring-animation="flicker"]::before,
.access-profile-ring-layer[data-ring-animation="flicker"]::after{
  animation:accessRingFlicker var(--access-ring-speed) ease-in-out infinite alternate;
}
.access-profile-ring-layer[data-ring-animation="pulse"]::before,
.access-profile-ring-layer[data-ring-animation="pulse"]::after{
  animation:accessRingPulse var(--access-ring-speed) ease-in-out infinite alternate;
}

/* Prism uses a full-spectrum ring while keeping the same component. */
.access-profile-ring-layer[data-ring-style="prism"]::before{
  background:conic-gradient(
    #ff4f92,#ff9d4f,#ffe45f,#83ff7d,#5fd8ff,#786cff,#c85fff,#ff4fb3,#ff4f92
  );
}
.access-profile-ring-layer[data-ring-style="prism"]::after{
  background:conic-gradient(
    rgba(255,79,146,.55),
    rgba(255,228,95,.20),
    rgba(95,216,255,.52),
    rgba(200,95,255,.46),
    rgba(255,79,146,.16)
  );
}

/* Metallic/static finish */
.access-profile-ring-layer[data-ring-style="metallic"]::before{
  background:conic-gradient(
    from 15deg,
    var(--access-ring-primary) 0deg,
    var(--access-ring-secondary) 55deg,
    var(--access-ring-highlight) 82deg,
    var(--access-ring-secondary) 112deg,
    var(--access-ring-primary) 180deg,
    var(--access-ring-secondary) 245deg,
    var(--access-ring-highlight) 278deg,
    var(--access-ring-secondary) 305deg,
    var(--access-ring-primary) 360deg
  );
}
.access-profile-ring-layer[data-ring-style="metallic"]::after{
  opacity:calc(.38 * var(--access-ring-glow));
  filter:blur(calc(var(--access-ring-blur) * .7));
}

/* Avatar is always untouched except suppressing legacy border. */
.access-profile-ring-equipped{
  position:relative!important;
  z-index:1!important;
  border-color:transparent!important;
  background-clip:padding-box;
  box-shadow:
    0 0 0 2px rgba(7,9,14,.90),
    0 12px 38px rgba(0,0,0,.42)!important;
}
.dm-avatar.access-profile-ring-equipped,
.member-avatar.access-profile-ring-equipped,
.network-avatar.access-profile-ring-equipped,
.network-quick-avatar.access-profile-ring-equipped{
  box-shadow:
    0 0 0 2px rgba(7,9,14,.90),
    0 4px 14px rgba(0,0,0,.42)!important;
}

@keyframes accessRingSpin{to{transform:rotate(360deg)}}
@keyframes accessRingBloom{
  from{transform:scale(.98);opacity:.48}
  to{transform:scale(1.045);opacity:.90}
}
@keyframes accessRingFlicker{
  0%{opacity:.62;filter:brightness(.95)}
  28%{opacity:1;filter:brightness(1.20)}
  54%{opacity:.78;filter:brightness(1.02)}
  100%{opacity:.96;filter:brightness(1.12)}
}
@keyframes accessRingPulse{
  from{transform:scale(.985);opacity:.56}
  to{transform:scale(1.055);opacity:1}
}

@media(prefers-reduced-motion:reduce){
  .access-profile-ring-layer::before,
  .access-profile-ring-layer::after{
    animation:none!important;
  }
}


/* ==========================================================
   STEVE BOSTON ACCESS — VERSION 2.0AB
   DETAILED PROFILE RING FX PACK

   Adds real secondary FX layers to animated rings:
   - Ember Pulse: sparks / ember flecks
   - Ice Current: traveling electric arcs / icy specks
   - Toxic Pulse: drifting toxic mist / bubbles
   - Prism Shift: sparkle particles / color shimmer

   All effects stay outside the avatar image and scale with the
   canonical site-wide ring renderer.
   ========================================================== */

.access-profile-ring-layer{
  overflow:visible!important;
}

/* Shared FX child layers */
.access-profile-ring-fx,
.access-profile-ring-fx::before,
.access-profile-ring-fx::after{
  position:absolute;
  inset:0;
  border-radius:50%;
  pointer-events:none;
  content:"";
}

.access-profile-ring-fx{
  z-index:2;
  overflow:visible;
}

/* ---------- EMBER PULSE ---------- */
.access-profile-ring-layer[data-ring-fx="ember"] .access-profile-ring-fx{
  inset:calc(var(--access-ring-gap) * -1.45);
  background:
    radial-gradient(circle at 12% 18%, rgba(255,238,144,.95) 0 1.4%, transparent 1.8%),
    radial-gradient(circle at 80% 12%, rgba(255,112,0,.95) 0 1.1%, transparent 1.6%),
    radial-gradient(circle at 92% 56%, rgba(255,220,128,.9) 0 1.2%, transparent 1.6%),
    radial-gradient(circle at 18% 82%, rgba(255,78,0,.95) 0 1.2%, transparent 1.8%),
    radial-gradient(circle at 55% 94%, rgba(255,197,70,.9) 0 1.1%, transparent 1.5%);
  filter:drop-shadow(0 0 4px rgba(255,75,0,.85));
  animation:accessEmberOrbit 2.7s linear infinite;
}
.access-profile-ring-layer[data-ring-fx="ember"] .access-profile-ring-fx::before{
  inset:-6%;
  background:
    radial-gradient(ellipse at 50% 100%, rgba(255,58,0,.34), transparent 45%),
    radial-gradient(ellipse at 15% 48%, rgba(255,121,0,.22), transparent 38%),
    radial-gradient(ellipse at 84% 38%, rgba(255,86,0,.24), transparent 36%);
  filter:blur(5px);
  animation:accessEmberHeat 1.15s ease-in-out infinite alternate;
}
.access-profile-ring-layer[data-ring-fx="ember"] .access-profile-ring-fx::after{
  inset:-18%;
  background:
    radial-gradient(circle at 30% 20%, rgba(255,201,81,.72) 0 1.1%, transparent 1.5%),
    radial-gradient(circle at 68% 8%, rgba(255,82,0,.65) 0 1.0%, transparent 1.5%),
    radial-gradient(circle at 92% 74%, rgba(255,210,93,.78) 0 1.0%, transparent 1.4%),
    radial-gradient(circle at 7% 72%, rgba(255,95,0,.7) 0 1.1%, transparent 1.5%);
  animation:accessEmberRise 1.8s ease-out infinite;
}

/* ---------- ICE CURRENT ---------- */
.access-profile-ring-layer[data-ring-fx="ice"] .access-profile-ring-fx{
  inset:calc(var(--access-ring-gap) * -1.2);
  border:1px solid rgba(174,246,255,.55);
  box-shadow:
    0 0 4px rgba(124,226,255,.85),
    inset 0 0 6px rgba(180,242,255,.45);
}
.access-profile-ring-layer[data-ring-fx="ice"] .access-profile-ring-fx::before{
  inset:-9%;
  background:
    conic-gradient(
      from 0deg,
      transparent 0 18deg,
      rgba(221,252,255,.95) 20deg 23deg,
      transparent 25deg 83deg,
      rgba(105,222,255,.92) 86deg 89deg,
      transparent 91deg 166deg,
      rgba(238,255,255,.95) 169deg 172deg,
      transparent 174deg 257deg,
      rgba(91,170,255,.9) 260deg 264deg,
      transparent 266deg 360deg
    );
  -webkit-mask:radial-gradient(circle, transparent 59%, #000 61% 66%, transparent 68%);
  mask:radial-gradient(circle, transparent 59%, #000 61% 66%, transparent 68%);
  filter:drop-shadow(0 0 4px rgba(112,223,255,.95));
  animation:accessIceArcSpin 1.65s linear infinite;
}
.access-profile-ring-layer[data-ring-fx="ice"] .access-profile-ring-fx::after{
  inset:-18%;
  background:
    radial-gradient(circle at 10% 24%, rgba(215,252,255,.9) 0 1.1%, transparent 1.6%),
    radial-gradient(circle at 82% 15%, rgba(149,230,255,.8) 0 1.2%, transparent 1.7%),
    radial-gradient(circle at 95% 65%, rgba(229,254,255,.9) 0 1.0%, transparent 1.5%),
    radial-gradient(circle at 32% 92%, rgba(119,202,255,.8) 0 1.1%, transparent 1.6%);
  animation:accessIceSparkle 2s ease-in-out infinite alternate;
}

/* ---------- TOXIC PULSE ---------- */
.access-profile-ring-layer[data-ring-fx="toxic"] .access-profile-ring-fx{
  inset:calc(var(--access-ring-bloom-gap) * -1.25);
  background:
    radial-gradient(ellipse at 23% 28%, rgba(170,255,0,.24), transparent 34%),
    radial-gradient(ellipse at 77% 42%, rgba(51,255,91,.22), transparent 30%),
    radial-gradient(ellipse at 48% 82%, rgba(130,255,33,.20), transparent 32%);
  filter:blur(6px);
  animation:accessToxicMistA 2.6s ease-in-out infinite alternate;
}
.access-profile-ring-layer[data-ring-fx="toxic"] .access-profile-ring-fx::before{
  inset:-14%;
  background:
    radial-gradient(circle at 18% 18%, rgba(193,255,77,.72) 0 1.5%, transparent 2.0%),
    radial-gradient(circle at 72% 12%, rgba(70,255,123,.66) 0 1.0%, transparent 1.6%),
    radial-gradient(circle at 92% 62%, rgba(178,255,61,.74) 0 1.2%, transparent 1.8%),
    radial-gradient(circle at 30% 93%, rgba(86,255,112,.66) 0 1.1%, transparent 1.7%);
  filter:drop-shadow(0 0 5px rgba(129,255,24,.75));
  animation:accessToxicBubbles 2.2s ease-in-out infinite;
}
.access-profile-ring-layer[data-ring-fx="toxic"] .access-profile-ring-fx::after{
  inset:-20%;
  background:
    radial-gradient(ellipse at 12% 58%, rgba(127,255,18,.17), transparent 30%),
    radial-gradient(ellipse at 83% 70%, rgba(51,255,99,.16), transparent 28%);
  filter:blur(9px);
  animation:accessToxicMistB 3.2s ease-in-out infinite alternate-reverse;
}

/* ---------- PRISM SHIFT ---------- */
.access-profile-ring-layer[data-ring-fx="prism"] .access-profile-ring-fx{
  inset:calc(var(--access-ring-gap) * -1.35);
  background:
    radial-gradient(circle at 10% 20%, rgba(255,255,255,.96) 0 1.2%, transparent 1.8%),
    radial-gradient(circle at 78% 10%, rgba(255,255,255,.92) 0 1.0%, transparent 1.5%),
    radial-gradient(circle at 96% 58%, rgba(255,255,255,.95) 0 1.1%, transparent 1.6%),
    radial-gradient(circle at 38% 96%, rgba(255,255,255,.9) 0 1.0%, transparent 1.5%);
  filter:drop-shadow(0 0 5px rgba(255,255,255,.85));
  animation:accessPrismSparkle 1.7s ease-in-out infinite alternate;
}
.access-profile-ring-layer[data-ring-fx="prism"] .access-profile-ring-fx::before{
  inset:-8%;
  background:conic-gradient(
    from 0deg,
    rgba(255,79,146,.22),
    rgba(255,228,95,.18),
    rgba(95,216,255,.24),
    rgba(200,95,255,.22),
    rgba(255,79,146,.18)
  );
  -webkit-mask:radial-gradient(circle, transparent 58%, #000 60% 70%, transparent 72%);
  mask:radial-gradient(circle, transparent 58%, #000 60% 70%, transparent 72%);
  filter:blur(2px);
  animation:accessPrismFlow 2.4s linear infinite;
}
.access-profile-ring-layer[data-ring-fx="prism"] .access-profile-ring-fx::after{
  inset:-18%;
  background:
    radial-gradient(circle at 24% 12%, rgba(255,104,221,.55) 0 1.5%, transparent 2.0%),
    radial-gradient(circle at 72% 20%, rgba(104,234,255,.55) 0 1.4%, transparent 1.9%),
    radial-gradient(circle at 89% 81%, rgba(255,226,89,.55) 0 1.3%, transparent 1.8%),
    radial-gradient(circle at 18% 78%, rgba(157,104,255,.55) 0 1.4%, transparent 1.9%);
  animation:accessPrismOrbit 3s linear infinite reverse;
}

@keyframes accessEmberOrbit{to{transform:rotate(360deg)}}
@keyframes accessEmberHeat{
  from{opacity:.42;transform:scale(.98)}
  to{opacity:.9;transform:scale(1.06)}
}
@keyframes accessEmberRise{
  0%{opacity:.18;transform:translateY(6%) scale(.96)}
  45%{opacity:.9}
  100%{opacity:0;transform:translateY(-9%) scale(1.05)}
}
@keyframes accessIceArcSpin{to{transform:rotate(360deg)}}
@keyframes accessIceSparkle{
  from{opacity:.32;transform:scale(.98)}
  to{opacity:1;transform:scale(1.04)}
}
@keyframes accessToxicMistA{
  from{transform:translate(-2%,2%) scale(.97);opacity:.42}
  to{transform:translate(3%,-2%) scale(1.07);opacity:.88}
}
@keyframes accessToxicMistB{
  from{transform:translate(2%,-2%) scale(1.02);opacity:.28}
  to{transform:translate(-3%,3%) scale(1.10);opacity:.74}
}
@keyframes accessToxicBubbles{
  0%,100%{transform:rotate(0deg) scale(.98);opacity:.45}
  50%{transform:rotate(180deg) scale(1.06);opacity:1}
}
@keyframes accessPrismSparkle{
  from{opacity:.3;filter:brightness(.85)}
  to{opacity:1;filter:brightness(1.35)}
}
@keyframes accessPrismFlow{to{transform:rotate(360deg)}}
@keyframes accessPrismOrbit{to{transform:rotate(360deg)}}

@media(prefers-reduced-motion:reduce){
  .access-profile-ring-fx,
  .access-profile-ring-fx::before,
  .access-profile-ring-fx::after{
    animation:none!important;
  }
}


/* ==========================================================
   VERSION 2.0AC — CINEMATIC LAYERED RING PACK
   Locked visual target:
   Ember = flame/embers, Ice = electrical/frost,
   Toxic = mist/bubbles, Prism = spectrum/sparkles.
   Gold Standard + Black Diamond remain structured/solid.
   ========================================================== */

/* Animated atmospheric rings lose the obvious hard hoop.
   Their identity is built from several translucent layers. */
.access-profile-ring-layer[data-ring-fx="ember"],
.access-profile-ring-layer[data-ring-fx="ice"],
.access-profile-ring-layer[data-ring-fx="toxic"],
.access-profile-ring-layer[data-ring-fx="prism"]{
  border-color:transparent!important;
  background:transparent!important;
  box-shadow:none!important;
}

/* Common luminous energy contour */
.access-profile-ring-layer[data-ring-fx="ember"]::before,
.access-profile-ring-layer[data-ring-fx="ice"]::before,
.access-profile-ring-layer[data-ring-fx="toxic"]::before,
.access-profile-ring-layer[data-ring-fx="prism"]::before{
  content:"";
  position:absolute;
  inset:calc(var(--access-ring-gap) * -.70);
  border-radius:50%;
  pointer-events:none;
  z-index:1;
}

/* EMBER — layered fire, not a solid orange ring */
.access-profile-ring-layer[data-ring-fx="ember"]::before{
  background:
    conic-gradient(from 12deg,
      rgba(255,70,0,.08) 0 6%,
      rgba(255,213,69,.96) 8% 10%,
      rgba(255,64,0,.32) 13% 22%,
      rgba(255,239,138,.92) 24% 26%,
      rgba(255,72,0,.22) 29% 43%,
      rgba(255,182,31,.96) 45% 48%,
      rgba(255,45,0,.22) 52% 68%,
      rgba(255,224,93,.9) 70% 73%,
      rgba(255,61,0,.18) 76% 91%,
      rgba(255,184,25,.9) 94% 97%,
      rgba(255,70,0,.08));
  -webkit-mask:radial-gradient(circle,transparent 59%,#000 61% 67%,transparent 70%);
  mask:radial-gradient(circle,transparent 59%,#000 61% 67%,transparent 70%);
  filter:drop-shadow(0 0 3px #ff6a00) drop-shadow(0 0 8px rgba(255,53,0,.7));
  animation:accessCineEmber 2.1s linear infinite;
}
.access-profile-ring-layer[data-ring-fx="ember"]{
  filter:drop-shadow(0 0 6px rgba(255,100,0,.45));
}

/* ICE — broken electrical current + cold bloom */
.access-profile-ring-layer[data-ring-fx="ice"]::before{
  background:
    conic-gradient(from 40deg,
      transparent 0 5%,rgba(232,255,255,.98) 6% 8%,transparent 9% 16%,
      rgba(75,200,255,.9) 17% 20%,transparent 22% 34%,
      rgba(218,252,255,.98) 35% 38%,transparent 40% 52%,
      rgba(71,156,255,.9) 53% 57%,transparent 59% 70%,
      rgba(239,255,255,.98) 71% 74%,transparent 76% 87%,
      rgba(88,218,255,.9) 88% 92%,transparent 94%);
  -webkit-mask:radial-gradient(circle,transparent 58%,#000 60% 66%,transparent 69%);
  mask:radial-gradient(circle,transparent 58%,#000 60% 66%,transparent 69%);
  filter:drop-shadow(0 0 3px #d9fbff) drop-shadow(0 0 9px rgba(44,171,255,.8));
  animation:accessCineIce 1.15s linear infinite;
}
.access-profile-ring-layer[data-ring-fx="ice"]{
  filter:drop-shadow(0 0 8px rgba(61,192,255,.55));
}

/* TOXIC — vapor contour, deliberately soft */
.access-profile-ring-layer[data-ring-fx="toxic"]::before{
  inset:calc(var(--access-ring-gap) * -1.15);
  background:
    radial-gradient(ellipse at 50% 5%,rgba(190,255,45,.72),transparent 20%),
    radial-gradient(ellipse at 95% 48%,rgba(62,255,92,.58),transparent 23%),
    radial-gradient(ellipse at 52% 96%,rgba(157,255,31,.64),transparent 21%),
    radial-gradient(ellipse at 4% 54%,rgba(66,255,97,.56),transparent 22%);
  filter:blur(4px) drop-shadow(0 0 8px rgba(125,255,24,.72));
  animation:accessCineToxic 2.5s ease-in-out infinite alternate;
}
.access-profile-ring-layer[data-ring-fx="toxic"]{
  filter:drop-shadow(0 0 9px rgba(115,255,31,.48));
}

/* PRISM — luminous spectrum with soft disappearing edges */
.access-profile-ring-layer[data-ring-fx="prism"]::before{
  background:conic-gradient(
    from 0deg,
    rgba(255,65,192,.88),
    rgba(177,70,255,.92),
    rgba(80,195,255,.9),
    rgba(101,255,220,.78),
    rgba(255,222,81,.82),
    rgba(255,91,176,.9),
    rgba(177,70,255,.92)
  );
  -webkit-mask:radial-gradient(circle,transparent 59%,#000 61% 66%,transparent 70%);
  mask:radial-gradient(circle,transparent 59%,#000 61% 66%,transparent 70%);
  filter:blur(.5px) drop-shadow(0 0 7px rgba(174,75,255,.72));
  animation:accessCinePrism 3.2s linear infinite;
}
.access-profile-ring-layer[data-ring-fx="prism"]{
  filter:drop-shadow(0 0 8px rgba(139,82,255,.48));
}

/* More depth on existing secondary FX layers */
.access-profile-ring-layer[data-ring-fx="ember"] .access-profile-ring-fx{
  inset:-22%;
  background:
    radial-gradient(circle at 14% 20%,#fff1a1 0 1%,transparent 1.8%),
    radial-gradient(circle at 28% 88%,#ff5b00 0 1.1%,transparent 1.9%),
    radial-gradient(circle at 80% 17%,#ffc83d 0 .9%,transparent 1.7%),
    radial-gradient(circle at 94% 63%,#ff4800 0 1%,transparent 1.8%),
    radial-gradient(circle at 54% 98%,#ffe47c 0 .9%,transparent 1.6%);
  animation:accessCineParticles 2.3s linear infinite;
}
.access-profile-ring-layer[data-ring-fx="ice"] .access-profile-ring-fx{
  inset:-20%;
  background:
    radial-gradient(circle at 13% 19%,rgba(239,255,255,.95) 0 .9%,transparent 1.6%),
    radial-gradient(circle at 83% 11%,rgba(137,226,255,.92) 0 1%,transparent 1.7%),
    radial-gradient(circle at 95% 70%,rgba(230,253,255,.95) 0 .8%,transparent 1.5%),
    radial-gradient(circle at 28% 94%,rgba(100,192,255,.88) 0 .9%,transparent 1.6%);
  animation:accessCineParticles 2.7s linear infinite reverse;
}
.access-profile-ring-layer[data-ring-fx="toxic"] .access-profile-ring-fx{
  inset:-28%;
  background:
    radial-gradient(circle at 17% 27%,rgba(195,255,58,.35) 0 3%,transparent 4%),
    radial-gradient(circle at 82% 20%,rgba(91,255,114,.30) 0 2.4%,transparent 3.4%),
    radial-gradient(circle at 90% 75%,rgba(181,255,54,.28) 0 3.2%,transparent 4.2%),
    radial-gradient(circle at 30% 90%,rgba(74,255,104,.26) 0 2.7%,transparent 3.8%);
  filter:blur(1px) drop-shadow(0 0 5px rgba(126,255,29,.6));
  animation:accessCineToxicBubbles 3.1s ease-in-out infinite;
}
.access-profile-ring-layer[data-ring-fx="prism"] .access-profile-ring-fx{
  inset:-23%;
  background:
    radial-gradient(circle at 10% 25%,rgba(255,255,255,.98) 0 .8%,transparent 1.5%),
    radial-gradient(circle at 27% 4%,rgba(255,111,229,.9) 0 .9%,transparent 1.6%),
    radial-gradient(circle at 79% 11%,rgba(122,233,255,.95) 0 .8%,transparent 1.5%),
    radial-gradient(circle at 96% 62%,rgba(255,240,112,.9) 0 .9%,transparent 1.6%),
    radial-gradient(circle at 62% 97%,rgba(206,124,255,.9) 0 .8%,transparent 1.5%);
  animation:accessCinePrismStars 1.65s ease-in-out infinite alternate;
}

@keyframes accessCineEmber{
  0%{transform:rotate(0deg) scale(.99);opacity:.72}
  50%{transform:rotate(180deg) scale(1.035);opacity:1}
  100%{transform:rotate(360deg) scale(.99);opacity:.72}
}
@keyframes accessCineIce{to{transform:rotate(360deg)}}
@keyframes accessCineToxic{
  from{transform:translate(-2%,2%) scale(.96);opacity:.55}
  to{transform:translate(2%,-2%) scale(1.08);opacity:.92}
}
@keyframes accessCinePrism{to{transform:rotate(360deg)}}
@keyframes accessCineParticles{
  0%{transform:rotate(0deg) scale(.94);opacity:.25}
  45%{opacity:1}
  100%{transform:rotate(360deg) scale(1.08);opacity:.25}
}
@keyframes accessCineToxicBubbles{
  0%,100%{transform:translateY(5%) rotate(0deg);opacity:.35}
  50%{transform:translateY(-6%) rotate(180deg);opacity:.9}
}
@keyframes accessCinePrismStars{
  from{transform:scale(.96) rotate(-3deg);opacity:.28;filter:brightness(.9)}
  to{transform:scale(1.08) rotate(3deg);opacity:1;filter:brightness(1.55)}
}


/* ==========================================================
   VERSION 2.0AD — BLACK DIAMOND FACET CORRECTION
   Black Diamond must visibly contain diamonds, not just a dark hoop.
   Keeps the avatar circular and uses the canonical ring layer everywhere.
   ========================================================== */
.access-profile-ring-layer[data-ring-fx="black-diamond"]{
  filter:drop-shadow(0 0 4px rgba(225,235,255,.22));
}
.access-profile-ring-layer[data-ring-fx="black-diamond"]::before{
  background:
    repeating-conic-gradient(from 0deg,
      #050608 0deg 5deg,#242932 5deg 8deg,#07080b 8deg 13deg,
      #78818d 13deg 14.5deg,#0a0b0e 14.5deg 20deg),
    conic-gradient(from 15deg,#030405,#5f6670,#f2f4f7,#252a31,#030405);
  box-shadow:
    0 0 3px rgba(255,255,255,.48),
    0 0 9px rgba(132,151,180,.26);
}
.access-profile-ring-layer[data-ring-fx="black-diamond"]::after{
  opacity:.7;
  inset:calc(var(--access-ring-gap) * -1.32);
  background:
    radial-gradient(circle at 50% 0%,#fff 0 1.2%,#b8c6dc 1.5% 2.2%,transparent 2.7%),
    radial-gradient(circle at 85% 15%,#fff 0 1%,#8798b2 1.3% 2%,transparent 2.5%),
    radial-gradient(circle at 100% 50%,#fff 0 1.2%,#c7d1df 1.5% 2.1%,transparent 2.7%),
    radial-gradient(circle at 85% 85%,#fff 0 1%,#8290a6 1.3% 2%,transparent 2.5%),
    radial-gradient(circle at 50% 100%,#fff 0 1.2%,#cbd5e3 1.5% 2.1%,transparent 2.7%),
    radial-gradient(circle at 15% 85%,#fff 0 1%,#8290a6 1.3% 2%,transparent 2.5%),
    radial-gradient(circle at 0% 50%,#fff 0 1.2%,#c7d1df 1.5% 2.1%,transparent 2.7%),
    radial-gradient(circle at 15% 15%,#fff 0 1%,#8798b2 1.3% 2%,transparent 2.5%);
  filter:drop-shadow(0 0 3px rgba(255,255,255,.75));
}
/* Faceted stones: eight visible black/crystal diamonds mounted around ring. */
.access-profile-ring-layer[data-ring-fx="black-diamond"] .access-profile-ring-fx{
  position:absolute;inset:calc(var(--access-ring-gap) * -1.18);border-radius:50%;pointer-events:none;z-index:3;
  background:
    conic-gradient(from 22.5deg,transparent 0 5.5%,rgba(255,255,255,.16) 5.8% 6.1%,transparent 6.4% 18%,rgba(255,255,255,.11) 18.3% 18.6%,transparent 18.9% 100%);
}
.access-profile-ring-layer[data-ring-fx="black-diamond"] .access-profile-ring-fx::before,
.access-profile-ring-layer[data-ring-fx="black-diamond"] .access-profile-ring-fx::after{
  content:"";position:absolute;inset:-5%;border-radius:50%;pointer-events:none;
  background:
    radial-gradient(ellipse 5% 7% at 50% 1%,#050608 0 34%,#536070 36% 43%,#0a0c10 45% 62%,transparent 65%),
    radial-gradient(ellipse 5% 7% at 85% 15%,#050608 0 34%,#687487 36% 43%,#0a0c10 45% 62%,transparent 65%),
    radial-gradient(ellipse 5% 7% at 99% 50%,#050608 0 34%,#536070 36% 43%,#0a0c10 45% 62%,transparent 65%),
    radial-gradient(ellipse 5% 7% at 85% 85%,#050608 0 34%,#687487 36% 43%,#0a0c10 45% 62%,transparent 65%),
    radial-gradient(ellipse 5% 7% at 50% 99%,#050608 0 34%,#536070 36% 43%,#0a0c10 45% 62%,transparent 65%),
    radial-gradient(ellipse 5% 7% at 15% 85%,#050608 0 34%,#687487 36% 43%,#0a0c10 45% 62%,transparent 65%),
    radial-gradient(ellipse 5% 7% at 1% 50%,#050608 0 34%,#536070 36% 43%,#0a0c10 45% 62%,transparent 65%),
    radial-gradient(ellipse 5% 7% at 15% 15%,#050608 0 34%,#687487 36% 43%,#0a0c10 45% 62%,transparent 65%);
}
.access-profile-ring-layer[data-ring-fx="black-diamond"] .access-profile-ring-fx::after{
  transform:rotate(22.5deg);opacity:.72;filter:brightness(1.25);
}


/* ==========================================================
   VERSION 2.0AF — BLACK DIAMOND REAL STONE LAYER
   Locked visual target: a luxury black/chrome ring with clearly
   recognizable faceted black diamonds around the avatar.
   ========================================================== */
.access-profile-ring-layer[data-ring-fx="black-diamond"]{
  overflow:visible!important;
  z-index:4;
}
.access-profile-ring-layer[data-ring-fx="black-diamond"]::before{
  inset:calc(var(--access-ring-gap) * -.52)!important;
  border:1px solid rgba(245,248,255,.68);
  background:
    conic-gradient(from 12deg,
      #050608,#424852 7%,#f4f7fb 9%,#111318 12%,
      #020305 22%,#7e8794 25%,#f8fbff 27%,#101217 30%,
      #030405 44%,#555d68 47%,#f6f8fb 49%,#090b0e 52%,
      #030405 68%,#7b8490 71%,#fff 73%,#111318 76%,#030405)!important;
  -webkit-mask:radial-gradient(circle,transparent 58%,#000 59% 68%,transparent 69%)!important;
  mask:radial-gradient(circle,transparent 58%,#000 59% 68%,transparent 69%)!important;
  box-shadow:none!important;
  filter:drop-shadow(0 0 3px rgba(255,255,255,.35));
}
.access-profile-ring-layer[data-ring-fx="black-diamond"] .access-black-diamond-stones{
  position:absolute;
  inset:0;
  border-radius:50%;
  pointer-events:none;
  z-index:8;
}
.access-profile-ring-layer[data-ring-fx="black-diamond"] .access-black-diamond-stone{
  --stone-size:clamp(7px,calc(min(var(--access-avatar-w,100px),var(--access-avatar-h,100px)) * .105),15px);
  position:absolute;
  left:50%;
  top:50%;
  width:var(--stone-size);
  height:var(--stone-size);
  transform:
    translate(-50%,-50%)
    rotate(var(--diamond-angle))
    translateY(calc(var(--access-ring-radius) * -1))
    rotate(calc(var(--diamond-angle) * -1))
    rotate(45deg);
  border-radius:20% 42% 20% 42%;
  border:1px solid rgba(235,242,255,.72);
  background:
    linear-gradient(135deg,rgba(255,255,255,.95) 0 12%,transparent 13% 35%,rgba(129,140,156,.78) 36% 49%,transparent 50%),
    linear-gradient(45deg,#020305 0 24%,#454c57 25% 42%,#080a0d 43% 61%,#a8b2c0 62% 72%,#030405 73% 100%);
  box-shadow:
    inset 1px 1px 1px rgba(255,255,255,.58),
    inset -1px -1px 2px rgba(0,0,0,.95),
    0 0 2px rgba(255,255,255,.7),
    0 0 5px rgba(185,202,225,.34);
}
.access-profile-ring-layer[data-ring-fx="black-diamond"] .access-black-diamond-stone::before,
.access-profile-ring-layer[data-ring-fx="black-diamond"] .access-black-diamond-stone::after{
  content:"";
  position:absolute;
  pointer-events:none;
}
.access-profile-ring-layer[data-ring-fx="black-diamond"] .access-black-diamond-stone::before{
  inset:17%;
  clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);
  background:linear-gradient(135deg,#dce5f0 0 13%,#0b0d11 14% 43%,#687382 44% 58%,#030405 59%);
  opacity:.86;
}
.access-profile-ring-layer[data-ring-fx="black-diamond"] .access-black-diamond-stone::after{
  width:36%;
  height:36%;
  left:-12%;
  top:-12%;
  border-radius:50%;
  background:#fff;
  box-shadow:0 0 4px #fff,0 0 8px rgba(210,226,255,.8);
  opacity:0;
  animation:accessBlackDiamondGlint 3.6s ease-in-out infinite;
  animation-delay:calc(var(--diamond-index) * .18s);
}
@keyframes accessBlackDiamondGlint{
  0%,68%,100%{opacity:0;transform:scale(.25)}
  72%{opacity:1;transform:scale(1.25)}
  76%{opacity:.18;transform:scale(.55)}
}
@media(max-width:520px){
  .access-profile-ring-layer[data-ring-fx="black-diamond"] .access-black-diamond-stone{
    width:8px;
    height:8px;
  }
}
@media(prefers-reduced-motion:reduce){
  .access-profile-ring-layer[data-ring-fx="black-diamond"] .access-black-diamond-stone::after{
    animation:none!important;
  }
}


/* V2.2d — cleaned obsolete Vault ring remnants */
/* ==========================================================
   V2.2 CAPABILITY — LIGHTNING RING FX
   Erratic arc discharge around the ring perimeter. Unlike the
   older fx presets, every colour resolves from --access-ring-*,
   so Vault packs can recolour it with no deployment.
   ========================================================== */
.access-profile-ring-layer[data-ring-fx="lightning"] .access-profile-ring-fx{
  inset:calc(var(--access-ring-gap) * -1.05);
  border-radius:50%;
  background:conic-gradient(
    from 0deg,
    transparent 0deg 14deg,
    var(--access-ring-primary,#7de8ff) 17deg 20deg,
    transparent 23deg 74deg,
    var(--access-ring-highlight,#ffffff) 77deg 80deg,
    transparent 83deg 152deg,
    var(--access-ring-primary,#7de8ff) 155deg 159deg,
    transparent 162deg 214deg,
    var(--access-ring-highlight,#ffffff) 217deg 219deg,
    transparent 222deg 286deg,
    var(--access-ring-primary,#7de8ff) 289deg 293deg,
    transparent 296deg 360deg
  );
  -webkit-mask:radial-gradient(circle,transparent calc(50% - 3.5px),#000 calc(50% - 3px));
  mask:radial-gradient(circle,transparent calc(50% - 3.5px),#000 calc(50% - 3px));
  filter:drop-shadow(0 0 3px var(--access-ring-primary,#7de8ff));
  animation:accessRingLightningJump 1.7s steps(1,end) infinite;
}
.access-profile-ring-layer[data-ring-fx="lightning"] .access-profile-ring-fx::before{
  content:'';
  position:absolute;
  inset:calc(var(--access-ring-gap) * -0.35);
  border-radius:50%;
  border:1px solid color-mix(in srgb,var(--access-ring-primary,#7de8ff) 60%,transparent);
  opacity:0;
  animation:accessRingLightningFlash 2.9s steps(1,end) infinite;
}
/* Discrete rotations read as arcs jumping to new positions rather than
   sweeping smoothly — the difference between "current" and "spinning". */
@keyframes accessRingLightningJump{
  0%  {transform:rotate(0deg);opacity:.95}
  14% {transform:rotate(0deg);opacity:.25}
  15% {transform:rotate(118deg);opacity:1}
  33% {transform:rotate(118deg);opacity:.3}
  34% {transform:rotate(47deg);opacity:.9}
  52% {transform:rotate(47deg);opacity:.2}
  53% {transform:rotate(233deg);opacity:1}
  71% {transform:rotate(233deg);opacity:.35}
  72% {transform:rotate(160deg);opacity:.95}
  89% {transform:rotate(160deg);opacity:.25}
  90% {transform:rotate(303deg);opacity:1}
  100%{transform:rotate(303deg);opacity:.4}
}
@keyframes accessRingLightningFlash{
  0%,92%,100%{opacity:0}
  93%{opacity:.85;box-shadow:0 0 9px var(--access-ring-highlight,#fff)}
  95%{opacity:.15}
  97%{opacity:.6;box-shadow:0 0 6px var(--access-ring-primary,#7de8ff)}
}
@media (prefers-reduced-motion:reduce){
  .access-profile-ring-layer[data-ring-fx="lightning"] .access-profile-ring-fx,
  .access-profile-ring-layer[data-ring-fx="lightning"] .access-profile-ring-fx::before{
    animation:none!important;
  }
}

/* V2.2 — SVG lightning replaces the conic fx overlay for this preset. */
.access-profile-ring-layer[data-ring-fx="lightning"] .access-profile-ring-fx{display:none!important}
.access-profile-ring-layer>.access-lightning-svg{position:absolute;inset:0;z-index:3;pointer-events:none}

/* V2.2d — TRUE LIGHTNING RING
   Lightning is the ring. The normal smooth conic band and continuous
   bloom are disabled for this preset so no solid cyan/blue donut remains.
   Geometry still belongs entirely to the canonical profile-ring renderer. */
.access-profile-ring-layer[data-ring-fx="lightning"]::before,
.access-profile-ring-layer[data-ring-fx="lightning"]::after{
  opacity:0!important;
  background:none!important;
  box-shadow:none!important;
  filter:none!important;
}
.access-profile-ring-layer[data-ring-fx="lightning"]>.access-lightning-svg{
  z-index:5;
  overflow:visible!important;
}


/* V2.2f — premium lightweight lightning polish */
.access-profile-ring-layer[data-ring-fx="lightning"]>.access-lightning-svg{
  filter:drop-shadow(0 0 2px rgba(105,232,255,.45))
         drop-shadow(0 0 5px rgba(111,85,255,.18))!important;
}

/* V2.2h — Electric Storm exact art direction */
.access-profile-ring-layer[data-ring-fx="storm"]::before,
.access-profile-ring-layer[data-ring-fx="storm"]::after{
  opacity:0!important;background:none!important;box-shadow:none!important;filter:none!important;
}
.access-profile-ring-layer[data-ring-fx="storm"]>.access-lightning-svg{
  filter:drop-shadow(0 0 2px rgba(85,239,255,.68))
         drop-shadow(0 0 6px rgba(106,71,255,.38))
         drop-shadow(0 0 10px rgba(255,255,255,.12))!important;
}

/* V2.2i — storm ring must always read as lightning, never a solid ring */
.access-profile-ring-layer[data-ring-fx="storm"] .access-profile-ring-fx{display:none!important}
.access-profile-ring-layer[data-ring-fx="storm"]>.access-lightning-svg{
  z-index:8!important;
  opacity:1!important;
  overflow:visible!important;
  filter:drop-shadow(0 0 3px rgba(85,239,255,.82))
         drop-shadow(0 0 8px rgba(106,71,255,.48))
         drop-shadow(0 0 12px rgba(255,255,255,.18))!important;
}

/* V2.3 atmospheric profile-ring capabilities */
.access-profile-ring-layer[data-ring-fx="liquid"]::before,
.access-profile-ring-layer[data-ring-fx="liquid"]::after,
.access-profile-ring-layer[data-ring-fx="snow"]::before,
.access-profile-ring-layer[data-ring-fx="snow"]::after,
.access-profile-ring-layer[data-ring-fx="rain"]::before,
.access-profile-ring-layer[data-ring-fx="rain"]::after,
.access-profile-ring-layer[data-ring-fx="reactor"]::before,
.access-profile-ring-layer[data-ring-fx="reactor"]::after{
  opacity:0!important;background:none!important;box-shadow:none!important;
}
.access-profile-ring-layer[data-ring-fx="liquid"]>.access-profile-ring-fx,
.access-profile-ring-layer[data-ring-fx="snow"]>.access-profile-ring-fx,
.access-profile-ring-layer[data-ring-fx="rain"]>.access-profile-ring-fx,
.access-profile-ring-layer[data-ring-fx="reactor"]>.access-profile-ring-fx{display:none!important}

/* V2.3i — any custom ring replaces the site's default avatar border */
.access-ring-anchor.has-access-profile-ring{
  overflow:visible!important;
}
.access-ring-anchor.has-access-profile-ring > img,
.access-ring-anchor.has-access-profile-ring > picture > img,
.access-ring-anchor.has-access-profile-ring .avatar,
.access-ring-anchor.has-access-profile-ring .profile-avatar,
.access-ring-anchor.has-access-profile-ring .dm-avatar,
.access-ring-anchor.has-access-profile-ring .member-avatar{
  border-color:transparent!important;
  outline:none!important;
  box-shadow:none!important;
}
.access-ring-anchor.has-access-profile-ring::before,
.access-ring-anchor.has-access-profile-ring::after{
  border-color:transparent!important;
  outline:none!important;
  box-shadow:none!important;
}
.access-ring-anchor.has-access-profile-ring > .access-profile-ring-layer{
  z-index:20!important;
  pointer-events:none!important;
}

/* ==========================================================
   V3.1c — AVATAR STACKING CORRECTION
   The ring layer is forced to z-index:20 by the anchor rule above, but
   nothing raised the avatar, whose highest declaration was z-index:1.
   The layer's ::before is an unmasked filled conic disc (it is normally
   hidden *behind* the avatar and only visible where it extends past the
   edge), so at z-index:20 it painted over the profile picture as a solid
   gradient circle.
   This was latent in V3.0: the rule sat in the corrupted tail of this
   stylesheet and never parsed. Repairing the escapes activated it.
   Fix: raise the avatar above the ring body. The ring's glow and bloom
   still read because they extend beyond the avatar's edge.
   ========================================================== */
.access-ring-anchor.has-access-profile-ring > img,
.access-ring-anchor.has-access-profile-ring > picture,
.access-ring-anchor.has-access-profile-ring > picture > img,
.access-ring-anchor.has-access-profile-ring > .avatar,
.access-ring-anchor.has-access-profile-ring > .ap-avatar,
.access-ring-anchor.has-access-profile-ring > .profile-avatar,
.access-ring-anchor.has-access-profile-ring > .dm-avatar,
.access-ring-anchor.has-access-profile-ring > .member-avatar,
.access-ring-anchor.has-access-profile-ring > .network-avatar,
.access-ring-anchor.has-access-profile-ring > .network-quick-avatar{
  position:relative;
  z-index:21!important;
}

/* Artwork v3 has a transparent center, so its ornaments may overlap the photo.
   Legacy filled ring effects retain their original behind-avatar stacking. */
.access-ring-anchor.has-access-profile-ring > .access-profile-ring-layer[data-artwork-ring="1"]{
  z-index:22!important;
  pointer-events:none!important;
}