/* TeenConnect Celebrity Titles v2 — premium CSS-only rebuild */

.profile-title-badge.profile-title-title_tinpartner,
.profile-title-badge.profile-title-admin_tinpartner_infinity_title{
  --tc-title-h: 34px;
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  height: var(--tc-title-h) !important;
  min-width: 122px !important;
  padding: 0 16px 0 38px !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  isolation: isolate !important;
  white-space: nowrap !important;
  vertical-align: middle !important;
  font-size: 12px !important;
  line-height: 1 !important;
  letter-spacing: .02em !important;
  font-weight: 900 !important;
  text-decoration: none !important;
  box-sizing: border-box !important;
  backdrop-filter: blur(6px) !important;
  -webkit-backdrop-filter: blur(6px) !important;
  transform: translateZ(0) !important;
}

.profile-title-badge.profile-title-title_tinpartner > *,
.profile-title-badge.profile-title-admin_tinpartner_infinity_title > *{
  position: relative !important;
  z-index: 2 !important;
}

/* TIN PARTNER */
.profile-title-badge.profile-title-title_tinpartner{
  color: #eefaff !important;
  border: 1px solid rgba(141, 233, 255, .8) !important;
  background:
    radial-gradient(circle at 16% 20%, rgba(132, 232, 255, .30), transparent 24%),
    radial-gradient(circle at 82% 80%, rgba(170, 110, 255, .20), transparent 26%),
    linear-gradient(135deg, rgba(12,21,46,.97) 0%, rgba(18,42,88,.96) 38%, rgba(46,47,109,.96) 68%, rgba(19,20,54,.97) 100%) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.10),
    inset 0 8px 18px rgba(255,255,255,.05),
    inset 0 -12px 22px rgba(58,22,118,.10),
    0 4px 14px rgba(15,33,82,.25),
    0 0 14px rgba(92,220,255,.22) !important;
  text-shadow: 0 1px 6px rgba(126,228,255,.26) !important;
}
.profile-title-badge.profile-title-title_tinpartner::before{
  content: "✦" !important;
  position: absolute !important;
  left: 8px !important;
  top: 50% !important;
  width: 22px !important;
  height: 22px !important;
  transform: translateY(-50%) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  color: #dffcff !important;
  font-size: 12px !important;
  line-height: 1 !important;
  border: 1px solid rgba(154,237,255,.6) !important;
  background: linear-gradient(145deg, rgba(113,232,255,.22), rgba(173,118,255,.14)) !important;
  box-shadow:
    inset 0 0 10px rgba(255,255,255,.12),
    0 0 10px rgba(118,230,255,.25) !important;
  z-index: 2 !important;
  animation: tcTitlePartnerPulse 2.6s ease-in-out infinite !important;
}
.profile-title-badge.profile-title-title_tinpartner::after{
  content: "" !important;
  position: absolute !important;
  inset: -30% auto -30% -36% !important;
  width: 36% !important;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.28), transparent) !important;
  transform: skewX(-18deg) !important;
  z-index: 1 !important;
  animation: tcTitlePartnerSweep 4.8s ease-in-out infinite !important;
}

/* TIN OPERATOR */
.profile-title-badge.profile-title-admin_tinpartner_infinity_title{
  min-width: 128px !important;
  color: #fff1ba !important;
  border: 1px solid rgba(255, 219, 121, .82) !important;
  background:
    radial-gradient(circle at 12% 22%, rgba(97, 224, 255, .18), transparent 22%),
    radial-gradient(circle at 88% 78%, rgba(223, 123, 255, .16), transparent 25%),
    linear-gradient(135deg, rgba(11,15,30,.98) 0%, rgba(20,30,60,.97) 34%, rgba(44,34,67,.97) 70%, rgba(18,18,32,.98) 100%) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.09),
    inset 0 8px 20px rgba(255,255,255,.05),
    inset 0 -16px 24px rgba(97,53,150,.10),
    0 4px 16px rgba(11,18,39,.26),
    0 0 15px rgba(255,212,107,.20) !important;
  text-shadow: 0 1px 6px rgba(255,221,130,.30) !important;
}
.profile-title-badge.profile-title-admin_tinpartner_infinity_title::before{
  content: "♛" !important;
  position: absolute !important;
  left: 8px !important;
  top: 50% !important;
  width: 23px !important;
  height: 23px !important;
  transform: translateY(-50%) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  color: #ffe07f !important;
  font-size: 13px !important;
  line-height: 1 !important;
  border: 1px solid rgba(255,222,137,.65) !important;
  background: linear-gradient(145deg, rgba(255,220,109,.22), rgba(94,231,255,.12)) !important;
  box-shadow:
    inset 0 0 12px rgba(255,255,255,.10),
    0 0 10px rgba(255,214,105,.26) !important;
  z-index: 2 !important;
  animation: tcTitleOperatorPulse 2.8s ease-in-out infinite !important;
}
.profile-title-badge.profile-title-admin_tinpartner_infinity_title::after{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  border-radius: inherit !important;
  background:
    linear-gradient(100deg, transparent 0%, transparent 32%, rgba(99,231,255,.10) 46%, rgba(255,223,123,.18) 54%, rgba(222,135,255,.10) 62%, transparent 76%, transparent 100%),
    linear-gradient(180deg, rgba(255,255,255,.06), transparent 40%, transparent 64%, rgba(255,255,255,.03)) !important;
  background-size: 220% 100%, 100% 100% !important;
  z-index: 1 !important;
  animation: tcTitleOperatorSweep 5s ease-in-out infinite !important;
}

/* Shop / preview areas: slightly larger and more collectible-looking */
.cosmetic-preview .profile-title-badge.profile-title-title_tinpartner,
.cosmetic-preview .profile-title-badge.profile-title-admin_tinpartner_infinity_title,
.profile-cosmetic-preview .profile-title-badge.profile-title-title_tinpartner,
.profile-cosmetic-preview .profile-title-badge.profile-title-admin_tinpartner_infinity_title,
.profile-item-card .profile-title-badge.profile-title-title_tinpartner,
.profile-item-card .profile-title-badge.profile-title-admin_tinpartner_infinity_title{
  --tc-title-h: 40px;
  min-width: 146px !important;
  padding-left: 42px !important;
  padding-right: 18px !important;
  font-size: 13px !important;
  border-radius: 14px !important;
}
.profile-item-card .profile-title-badge.profile-title-title_tinpartner::before,
.profile-item-card .profile-title-badge.profile-title-admin_tinpartner_infinity_title::before,
.cosmetic-preview .profile-title-badge.profile-title-title_tinpartner::before,
.cosmetic-preview .profile-title-badge.profile-title-admin_tinpartner_infinity_title::before,
.profile-cosmetic-preview .profile-title-badge.profile-title-title_tinpartner::before,
.profile-cosmetic-preview .profile-title-badge.profile-title-admin_tinpartner_infinity_title::before{
  width: 25px !important;
  height: 25px !important;
  font-size: 14px !important;
}

@keyframes tcTitlePartnerPulse{
  0%,100%{opacity:.82; transform: translateY(-50%) scale(.96)}
  50%{opacity:1; transform: translateY(-50%) scale(1.06)}
}
@keyframes tcTitlePartnerSweep{
  0%,18%{left:-36%; opacity:0}
  28%{opacity:.95}
  62%{opacity:.45}
  76%,100%{left:126%; opacity:0}
}
@keyframes tcTitleOperatorPulse{
  0%,100%{opacity:.84; transform: translateY(-50%) scale(.96)}
  50%{opacity:1; transform: translateY(-50%) scale(1.04)}
}
@keyframes tcTitleOperatorSweep{
  0%,100%{background-position:0% 50%,0 0; opacity:.72}
  50%{background-position:100% 50%,0 0; opacity:1}
}

@media (max-width: 520px){
  .profile-title-badge.profile-title-title_tinpartner,
  .profile-title-badge.profile-title-admin_tinpartner_infinity_title{
    --tc-title-h: 32px;
    min-width: 112px !important;
    padding-left: 36px !important;
    padding-right: 14px !important;
    font-size: 11px !important;
  }
}

@media (prefers-reduced-motion: reduce){
  .profile-title-badge.profile-title-title_tinpartner::before,
  .profile-title-badge.profile-title-title_tinpartner::after,
  .profile-title-badge.profile-title-admin_tinpartner_infinity_title::before,
  .profile-title-badge.profile-title-admin_tinpartner_infinity_title::after{
    animation: none !important;
  }
}
