/* UNITY GAMING • Animated forum rank • 186×60 • no external assets */
.ugrank, .ugrank * { box-sizing:border-box; }
.ugrank {
  --ug-accent:var(--rc,#ff355c);
  position:relative; isolation:isolate; display:inline-block; vertical-align:middle;
  width:186px; height:60px; max-width:none; flex:none; margin:0; padding:0;
  overflow:hidden; background:transparent; color:#eff7ff;
  font-family:Tahoma,Arial,sans-serif; font-style:normal; text-transform:none;
  -webkit-font-smoothing:antialiased;
  filter:drop-shadow(0px 2px 2px rgba(0,0,0,.38));
}
.ugrank__rim, .ugrank__body, .ugrank__mesh, .ugrank__aura,
.ugrank__glint, .ugrank__sweep, .ugrank__top,
.ugrank__slash, .ugrank__caption, .ugrank__emblem,
.ugrank__emblemcore, .ugrank__brand, .ugrank__name { position:absolute; }
.ugrank__rim {
  inset:0; background:linear-gradient(155deg,#e8f8ff 1%,#5d7084 12%,#121b28 30%,var(--ug-accent) 55%,#7d8b9c 79%,#0a0e19 95%);
  clip-path:polygon(11% 3%,76% 3%,80% 0,93% 0,100% 19%,100% 83%,96% 98%,11% 98%,0 75%,0 31%);
}
.ugrank__body {
  inset:2px; z-index:1;
  background: radial-gradient(ellipse at 77% 49%,rgba(244,250,255,.18),transparent 39%),
    linear-gradient(125deg,#202d42 0%,#0b1221 34%,#111b2b 72%,#060b16 100%);
  clip-path:polygon(11% 3%,76% 3%,80% 0,93% 0,100% 19%,100% 82%,96% 98%,11% 98%,0 75%,0 31%);
}
.ugrank__mesh {
  inset:4px 2px 4px; z-index:2; opacity:.28;
  background:repeating-linear-gradient(0deg,transparent 0 7px,rgba(213,234,255,.12) 7px 8px),
      repeating-linear-gradient(90deg,transparent 0 10px,rgba(213,234,255,.10) 10px 11px);
  clip-path:polygon(11% 3%,76% 3%,80% 0,93% 0,100% 19%,100% 82%,96% 98%,11% 98%,0 75%,0 31%);
}
.ugrank__aura {
  inset:3px; z-index:3; opacity:.65;
  background: radial-gradient(ellipse 55px 43px at 84% 62%,var(--ug-accent), transparent 88%);
  mix-blend-mode:screen; animation:ug-aura 3.6s ease-in-out infinite;
  clip-path:polygon(11% 3%,76% 3%,80% 0,93% 0,100% 19%,100% 82%,96% 98%,11% 98%,0 75%,0 31%);
}
.ugrank__glint {
  z-index:5; top:-28px; left:-54px; width:29px; height:120px; opacity:.56;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.09),rgba(255,255,255,.48),rgba(255,255,255,.08),transparent);
  transform:skewX(-23deg); animation:ug-shine 5.8s ease-in-out infinite;
  pointer-events:none;
}
.ugrank__top {
  z-index:5; top:4px; left:20px; width:105px; height:3px;
  background:linear-gradient(90deg,transparent,var(--ug-accent) 23%,#fff 58%,var(--ug-accent) 78%,transparent);
  box-shadow:0 0 6px var(--ug-accent);
}
.ugrank__slash {
  z-index:4; left:4px; top:19px; width:18px; height:22px;
  border-left:3px solid var(--ug-accent); transform:skewX(-32deg);
  opacity:.95; filter:drop-shadow(0 0 3px var(--ug-accent));
}
.ugrank__name {
  z-index:6; top:13px; left:14px; width:109px; height:27px;
  display:flex; align-items:center; justify-content:center;
  padding:0 2px; direction:rtl; text-align:center;
  color:#fff; font-family:Tahoma,Arial,sans-serif; font-weight:900;
  font-size:11.8px; line-height:1.22; letter-spacing:-.35px;
  text-shadow:0 1px 1px #000,0 2px 2px #000,0 0 6px rgba(255,255,255,.25);
}
.ugrank__name--long {font-size:10.9px;}
.ugrank__caption {
  z-index:5; bottom:8px; left:18px; width:103px; height:11px;
  border-radius:1px; background:linear-gradient(90deg,transparent,var(--ug-accent) 23%,var(--ug-accent) 83%,transparent);
  box-shadow:0 0 7px var(--ug-accent); opacity:.87;
}
.ugrank__brand {
  z-index:7; bottom:8px; left:18px; width:103px;
  color:#fff; text-align:center; direction:ltr; white-space:nowrap;
  font:bold 8px/11px 'Arial Narrow',Arial,sans-serif; letter-spacing:1px;
  text-shadow:0 1px 2px #080c17;
}
.ugrank__emblem {
  z-index:9; top:1px; right:4px; width:56px; height:58px;
  transform-origin:center 49%; animation:ug-float 3.6s ease-in-out infinite;
  background:linear-gradient(140deg,#f3faff 0%,#7993a9 16%,#151c29 25%,var(--ug-accent) 48%,#131924 67%,#9aaebe 90%);
  clip-path:polygon(50% 0%,84% 12%,100% 30%,100% 71%,50% 100%,0% 71%,0% 30%,16% 12%);
  filter:drop-shadow(0 0 3px var(--ug-accent));
}
.ugrank__emblemcore {
  inset:3px; background:radial-gradient(ellipse at 50% 37%,#2f4255 0%,#111d2e 54%,#070b16 85%);
  clip-path:polygon(50% 0%,84% 12%,100% 30%,100% 71%,50% 100%,0% 71%,0% 30%,16% 12%);
  border:0;
}
.ugrank__emblemcore::before {
  content:''; position:absolute; top:6px; left:7px; right:7px; height:18px;
  border-top:1px solid var(--ug-accent); border-radius:50%; opacity:.75;
  box-shadow:0 -3px 11px var(--ug-accent);
}
.ugrank__monogram {
  position:absolute; top:15px; left:0; width:100%; text-align:center; direction:ltr;
  font:italic 900 23px/.92 Arial,sans-serif; letter-spacing:-2px; padding-right:3px;
  color:#fbfcff; text-shadow:1px 2px 0 #5a6a77,0 0 7px var(--ug-accent),0 2px 3px #02050a;
}
.ugrank__mini {
  position:absolute; top:39px; left:0; width:100%; text-align:center; direction:ltr;
  font:800 5.8px/1 Arial,sans-serif; letter-spacing:1.15px;
  color:#cfdcea; opacity:.95;
}
.ugrank__sweep {
  z-index:4; right:2px; top:7px; height:2px; width:40px;
  background:linear-gradient(90deg,transparent,#fff,transparent); opacity:.75;
  animation:ug-line 3.4s ease-in-out infinite; pointer-events:none;
}
@keyframes ug-shine {0%,18%{left:-49px;opacity:0}31%{opacity:.58}46%,100%{left:212px;opacity:0}}
@keyframes ug-aura {0%,100%{opacity:.42}50%{opacity:.78}}
@keyframes ug-float {0%,100%{transform:translateY(0)}50%{transform:translateY(-1.2px)}}
@keyframes ug-line {0%,100%{opacity:.22;transform:translateX(-9px)}50%{opacity:.85;transform:translateX(8px)}}
@media(prefers-reduced-motion:reduce){.ugrank__aura,.ugrank__glint,.ugrank__emblem,.ugrank__sweep{animation:none}}

/* Integrate 186x60 animated UG rank badges across profile, forum and member directory. */
.fx-side .ugrank,.mem-who .ugrank { display:block; width:186px; height:60px; margin:8px auto 0; max-width:none; flex:none; }
.mem-who .ugrank { margin:0; }
.ugrank__name {font-family:var(--f-body, Tajawal),Tahoma,Arial,sans-serif; letter-spacing:0;}
.ugrank__name--long {font-size:10px}
/* Official colors are inherited from profile's role --rc variable. */

@media(max-width:680px){ .fx-side .ugrank{display:block;} }
@media(prefers-reduced-motion:reduce){ .ugrank *{animation:none!important;transition:none!important} }
