/* TeenConnect Celebrity Titles v3 — forced premium CSS renderer */

/* Hard reset only for the two premium titles so old theme CSS cannot flatten them. */
.profile-title-badge.tc-title-luxe,
.profile-title-badge.tc-title-luxe.tc-title-partner,
.profile-title-badge.tc-title-luxe.tc-title-operator{
  --h:36px;
  --edge:#78eaff;
  --edge2:#9b78ff;
  --ink:#eefbff;
  --bg1:#0b1535;
  --bg2:#20285a;
  position:relative!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  box-sizing:border-box!important;
  height:var(--h)!important;
  min-width:142px!important;
  padding:0 24px 0 42px!important;
  margin:0!important;
  border:0!important;
  border-radius:12px!important;
  overflow:visible!important;
  isolation:isolate!important;
  white-space:nowrap!important;
  color:var(--ink)!important;
  background:linear-gradient(135deg,var(--bg1),var(--bg2) 58%,#171a3d)!important;
  font-size:12px!important;
  font-weight:950!important;
  line-height:1!important;
  letter-spacing:.025em!important;
  text-shadow:0 1px 7px rgba(150,230,255,.28)!important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.10),
    inset 0 9px 18px rgba(255,255,255,.035),
    inset 0 -10px 18px rgba(0,0,0,.10),
    0 4px 12px rgba(10,20,55,.22),
    0 0 13px color-mix(in srgb,var(--edge) 24%, transparent)!important;
  vertical-align:middle!important;
  transform:translateZ(0)!important;
}

/* luminous bevel frame */
.profile-title-badge.tc-title-luxe::before{
  content:""!important;
  position:absolute!important;
  inset:-1px!important;
  padding:1px!important;
  border-radius:13px!important;
  background:linear-gradient(110deg,var(--edge),rgba(255,255,255,.85) 28%,var(--edge2) 62%,var(--edge))!important;
  background-size:220% 100%!important;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0)!important;
  -webkit-mask-composite:xor!important;
  mask-composite:exclude!important;
  pointer-events:none!important;
  z-index:3!important;
  filter:drop-shadow(0 0 4px color-mix(in srgb,var(--edge) 52%,transparent))!important;
  animation:tcLuxeEdge 4.8s linear infinite!important;
}

/* moving sheen */
.profile-title-badge.tc-title-luxe::after{
  content:""!important;
  position:absolute!important;
  top:-40%!important;
  bottom:-40%!important;
  left:-42%!important;
  width:34%!important;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.38),transparent)!important;
  transform:skewX(-18deg)!important;
  pointer-events:none!important;
  z-index:2!important;
  animation:tcLuxeSheen 5.4s ease-in-out infinite!important;
}

.profile-title-badge.tc-title-luxe .tc-title-emblem{
  position:absolute!important;
  left:8px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  width:25px!important;
  height:25px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:8px!important;
  border:1px solid color-mix(in srgb,var(--edge) 70%,white 10%)!important;
  background:
    radial-gradient(circle at 35% 30%,rgba(255,255,255,.30),transparent 28%),
    linear-gradient(145deg,color-mix(in srgb,var(--edge) 30%,#11204a),color-mix(in srgb,var(--edge2) 26%,#151534))!important;
  color:#fff!important;
  font-size:13px!important;
  line-height:1!important;
  box-shadow:inset 0 0 10px rgba(255,255,255,.08),0 0 10px color-mix(in srgb,var(--edge) 28%,transparent)!important;
  z-index:4!important;
  animation:tcLuxeEmblem 2.8s ease-in-out infinite!important;
}
.profile-title-badge.tc-title-luxe .tc-title-text{position:relative!important;z-index:4!important}
.profile-title-badge.tc-title-luxe .tc-title-gem{
  position:absolute!important;
  right:8px!important;
  top:50%!important;
  width:5px!important;
  height:5px!important;
  border-radius:50%!important;
  transform:translateY(-50%)!important;
  background:#fff!important;
  box-shadow:0 0 5px #fff,0 0 10px var(--edge)!important;
  z-index:4!important;
  animation:tcLuxeGem 1.9s ease-in-out infinite!important;
}

/* winglets give it a collectible-skin silhouette instead of a plain pill */
.profile-title-badge.tc-title-luxe .tc-title-wing{
  position:absolute!important;
  top:50%!important;
  width:16px!important;
  height:22px!important;
  transform:translateY(-50%)!important;
  z-index:-1!important;
  opacity:.92!important;
  filter:drop-shadow(0 0 5px color-mix(in srgb,var(--edge) 38%,transparent))!important;
}
.profile-title-badge.tc-title-luxe .tc-title-wing.left{left:-9px!important;clip-path:polygon(100% 0,100% 100%,42% 83%,0 50%,42% 17%)!important;background:linear-gradient(180deg,var(--edge),var(--edge2))!important}
.profile-title-badge.tc-title-luxe .tc-title-wing.right{right:-9px!important;clip-path:polygon(0 0,0 100%,58% 83%,100% 50%,58% 17%)!important;background:linear-gradient(180deg,var(--edge2),var(--edge))!important}

/* PARTNER: bright celebrity / creator aura */
.profile-title-badge.tc-title-partner{
  --edge:#71efff;
  --edge2:#9a76ff;
  --ink:#f5fdff;
  --bg1:#091831;
  --bg2:#25336d;
  min-width:146px!important;
  background:
    radial-gradient(circle at 20% 20%,rgba(114,237,255,.22),transparent 26%),
    radial-gradient(circle at 82% 78%,rgba(160,111,255,.20),transparent 24%),
    linear-gradient(135deg,#0a1734 0%,#17386f 42%,#473a86 72%,#181b43 100%)!important;
}
.profile-title-badge.tc-title-partner .tc-title-emblem{border-radius:50%!important}
.profile-title-badge.tc-title-partner .tc-title-emblem::after{content:"✦"!important;color:#e8fdff!important;text-shadow:0 0 8px #71efff!important}
.profile-title-badge.tc-title-partner .tc-title-text{
  background:linear-gradient(90deg,#ffffff 0%,#dffaff 35%,#b9c9ff 72%,#e4caff 100%)!important;
  -webkit-background-clip:text!important;background-clip:text!important;color:transparent!important;
  text-shadow:none!important;
}

/* OPERATOR: heavier black-gold authority with cool neon accents */
.profile-title-badge.tc-title-operator{
  --edge:#ffd36a;
  --edge2:#6fdfff;
  --ink:#fff2c1;
  --bg1:#0c101e;
  --bg2:#2a2141;
  min-width:150px!important;
  background:
    radial-gradient(circle at 18% 20%,rgba(105,226,255,.14),transparent 24%),
    radial-gradient(circle at 80% 76%,rgba(255,207,93,.16),transparent 26%),
    linear-gradient(135deg,#0b0e18 0%,#18213d 40%,#3b2a4b 72%,#17131e 100%)!important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.09),
    inset 0 9px 20px rgba(255,255,255,.04),
    0 4px 13px rgba(8,11,23,.30),
    0 0 14px rgba(255,206,91,.20)!important;
}
.profile-title-badge.tc-title-operator .tc-title-emblem::after{content:"♛"!important;color:#ffe08a!important;text-shadow:0 0 8px rgba(255,207,83,.75)!important}
.profile-title-badge.tc-title-operator .tc-title-text{
  background:linear-gradient(90deg,#fff7d6 0%,#ffe69c 42%,#f2c95d 75%,#ffffff 100%)!important;
  -webkit-background-clip:text!important;background-clip:text!important;color:transparent!important;
  text-shadow:none!important;
}

/* shop cards: larger, like a skin preview */
.cosmetic-preview .profile-title-badge.tc-title-luxe,
.profile-cosmetic-preview .profile-title-badge.tc-title-luxe,
.profile-item-card .profile-title-badge.tc-title-luxe,
.profile-shop-card .profile-title-badge.tc-title-luxe{
  --h:46px!important;
  min-width:184px!important;
  padding-left:48px!important;
  padding-right:28px!important;
  border-radius:15px!important;
  font-size:14px!important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.10),
    inset 0 10px 22px rgba(255,255,255,.05),
    0 8px 20px rgba(14,25,65,.22),
    0 0 18px color-mix(in srgb,var(--edge) 28%,transparent)!important;
}
.cosmetic-preview .profile-title-badge.tc-title-luxe .tc-title-emblem,
.profile-cosmetic-preview .profile-title-badge.tc-title-luxe .tc-title-emblem,
.profile-item-card .profile-title-badge.tc-title-luxe .tc-title-emblem,
.profile-shop-card .profile-title-badge.tc-title-luxe .tc-title-emblem{width:31px!important;height:31px!important;left:10px!important;font-size:16px!important}
.cosmetic-preview .profile-title-badge.tc-title-luxe .tc-title-wing,
.profile-cosmetic-preview .profile-title-badge.tc-title-luxe .tc-title-wing,
.profile-item-card .profile-title-badge.tc-title-luxe .tc-title-wing,
.profile-shop-card .profile-title-badge.tc-title-luxe .tc-title-wing{width:20px!important;height:28px!important}

@keyframes tcLuxeEdge{to{background-position:220% 0}}
@keyframes tcLuxeSheen{0%,18%{left:-42%;opacity:0}30%{opacity:.9}65%{opacity:.45}78%,100%{left:126%;opacity:0}}
@keyframes tcLuxeEmblem{0%,100%{transform:translateY(-50%) scale(.96);filter:brightness(.96)}50%{transform:translateY(-50%) scale(1.06);filter:brightness(1.15)}}
@keyframes tcLuxeGem{0%,100%{opacity:.45;transform:translateY(-50%) scale(.7)}50%{opacity:1;transform:translateY(-50%) scale(1.35)}}

@media(max-width:520px){
 .profile-title-badge.tc-title-luxe{--h:34px!important;min-width:128px!important;padding-left:40px!important;padding-right:20px!important;font-size:11px!important}
 .profile-title-badge.tc-title-luxe .tc-title-emblem{width:23px!important;height:23px!important;left:8px!important}
}
@media(prefers-reduced-motion:reduce){.profile-title-badge.tc-title-luxe,.profile-title-badge.tc-title-luxe::before,.profile-title-badge.tc-title-luxe::after,.profile-title-badge.tc-title-luxe .tc-title-emblem,.profile-title-badge.tc-title-luxe .tc-title-gem{animation:none!important}}
