/* ===== 칭호 보유자 아바타 — 금색 링 + 별 + 상승 차트 훈장 ===== */
/* user-identity partial 이 쓰이는 모든 곳에 적용된다. */

.user-identity.ui-titled{
  position:relative;
  overflow:visible;
}
.user-identity.ui-titled .user-identity-avatar-link{
  overflow:visible;
  position:static;
}

.user-identity.ui-titled .user-identity-avatar-link{
  position:relative;
  display:inline-block;
}

.user-identity.ui-titled .user-identity-avatar{
  box-shadow:
    0 0 0 2px var(--panel, #0f0f12),
    0 0 0 4px rgba(212,175,55,.9),
    0 0 18px rgba(212,175,55,.38);
}

/* 상단 금색 스파클 */
.user-identity.ui-titled::before{
  content:'';
  position:absolute; left:calc(var(--user-avatar-size, 26px) / 2); top:-8px;
  transform:translateX(-50%);
  width:17px; height:17px; z-index:1;
  pointer-events:none;
  background:center/17px 17px no-repeat;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%23fff3c9'/%3E%3Cstop offset='.5' stop-color='%23e8c563'/%3E%3Cstop offset='1' stop-color='%23c9a13f'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath fill='url(%23g)' d='M12 0c.5 6.2 5.3 11 11.5 11.5C17.3 12 12.5 16.8 12 23c-.5-6.2-5.3-11-11.5-11.5C6.7 11 11.5 6.2 12 0z'/%3E%3C/svg%3E");
  filter:drop-shadow(0 0 6px rgba(212,175,55,.7));
}

/* 우측 하단 상승 차트 훈장 */
.user-identity.ui-titled::after{
  content:'';
  position:absolute; left:calc(var(--user-avatar-size, 26px) - 14px); bottom:-2px;
  width:20px; height:20px; border-radius:50%;
  box-sizing:border-box; z-index:1;
  pointer-events:none;
  background:#141116 center/12px 12px no-repeat;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f0d891' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='3 17 9.5 10.5 13.5 14.5 21 6'/%3E%3Cpolyline points='15 6 21 6 21 12'/%3E%3C/svg%3E");
  border:2px solid rgba(212,175,55,.9);
  box-shadow:0 1px 6px rgba(0,0,0,.55), 0 0 10px rgba(212,175,55,.3);
}

/* 작은 아바타(게시판 목록 등)에서는 축소 */
.user-identity.ui-titled[style*="--user-avatar-size:20px"]::before,
.user-identity.ui-titled[style*="--user-avatar-size:22px"]::before,
.user-identity.ui-titled[style*="--user-avatar-size:24px"]::before,
.user-identity.ui-titled[style*="--user-avatar-size:26px"]::before{
  width:12px; height:12px; top:-6px; background-size:12px 12px;
}
.user-identity.ui-titled[style*="--user-avatar-size:20px"]::after,
.user-identity.ui-titled[style*="--user-avatar-size:22px"]::after,
.user-identity.ui-titled[style*="--user-avatar-size:24px"]::after,
.user-identity.ui-titled[style*="--user-avatar-size:26px"]::after{
  width:14px; height:14px; right:-4px; bottom:-4px; background-size:8px 8px; border-width:1.5px;
}

/* 닉네임은 장식보다 위 레이어 — 별·훈장에 가려지지 않게 */
.user-identity.ui-titled .user-identity-name,
.user-identity.ui-titled .user-identity-tier{
  position:relative;
  z-index:2;
}

/* 훈장이 튀어나온 만큼 닉네임 앞에 여백 */
.user-identity.ui-titled{ gap:8px; }
.user-identity-title{
  display:inline-flex; align-items:center; padding:1px 6px; border-radius:5px;
  border:1px solid rgba(212,175,55,.42); background:rgba(212,175,55,.12);
  color:#e3c77e; font-size:10px; font-weight:800; line-height:1.5;
}
