/* COUNTER · Legendary Character Profiles V5
   Scoped visual upgrade for public player modal, player cards and Account details.
   Hero / Noblesse / achievements are derived only from existing character data. */
#publicProfileModal .public-profile-card,
#characterModal .character-profile {
  border:1px solid rgba(127,202,226,.36)!important;
  background:linear-gradient(175deg,rgba(10,34,49,.99),rgba(4,16,26,.99) 61%,rgba(3,13,21,.99))!important;
  box-shadow:0 34px 98px rgba(0,0,0,.68),0 0 34px rgba(27,127,181,.10),inset 0 1px rgba(201,242,255,.08)!important;
}
#publicProfileModal .public-profile-card[data-legendary-hero="true"],
#characterModal .character-profile[data-legendary-hero="true"] {
  border-color:rgba(232,194,111,.66)!important;
  box-shadow:0 34px 100px rgba(0,0,0,.73),0 0 32px rgba(192,151,70,.13),inset 0 1px rgba(255,233,185,.16)!important;
}
#publicProfileModal .public-profile-banner,
#characterModal .profile-hero {
  position:relative;
  isolation:isolate;
  border-bottom:1px solid rgba(117,209,241,.21)!important;
}
#publicProfileModal .public-profile-banner {
  min-height:222px!important;
  gap:20px!important;
  background-position:67% 37%;
}
#characterModal .profile-hero {
  min-height:215px!important;
  align-items:flex-end;
  gap:20px!important;
}
#publicProfileModal .public-profile-banner::before,
#characterModal .profile-hero::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    radial-gradient(ellipse 55% 70% at 10% 85%,rgba(44,151,205,.24),transparent 80%),
    linear-gradient(110deg,rgba(3,14,24,.24),transparent 63%),
    linear-gradient(to top,rgba(3,14,23,.48),transparent 60%);
}
#publicProfileModal .public-profile-card[data-legendary-hero="true"] .public-profile-banner::before,
#characterModal .character-profile[data-legendary-hero="true"] .profile-hero::before {
  background:
    radial-gradient(ellipse 54% 70% at 12% 78%,rgba(203,152,56,.21),transparent 80%),
    linear-gradient(110deg,rgba(15,13,9,.21),transparent 70%),
    linear-gradient(to top,rgba(10,13,19,.52),transparent 64%);
}
#publicProfileModal .public-profile-banner > .public-avatar-wrap,
#publicProfileModal .public-profile-banner > .public-profile-title,
#publicProfileModal .public-profile-banner > .public-profile-clan,
#characterModal .profile-hero > .profile-emblem,
#characterModal .profile-hero > .profile-title {
  position:relative;
  z-index:1;
}
#publicProfileModal .public-profile-rank {
  z-index:3;
}
#publicProfileModal .public-avatar.race-avatar {
  width:116px!important;
  height:116px!important;
  border-radius:20px!important;
  border:2px solid rgba(129,213,244,.69)!important;
  box-shadow:0 0 0 4px rgba(7,26,38,.85),0 0 32px rgba(72,183,239,.20),0 18px 35px rgba(0,0,0,.50)!important;
}
#characterModal .profile-emblem.account-race-portrait {
  width:110px!important;
  height:110px!important;
  border-radius:19px!important;
  border:2px solid rgba(140,213,240,.65)!important;
  box-shadow:0 0 0 4px rgba(7,27,40,.85),0 0 30px rgba(70,181,231,.16),0 18px 36px rgba(0,0,0,.53)!important;
}
#publicProfileModal .public-profile-card[data-legendary-hero="true"] .public-avatar.race-avatar,
#characterModal .character-profile[data-legendary-hero="true"] .profile-emblem.account-race-portrait {
  border-color:rgba(250,213,132,.88)!important;
  box-shadow:0 0 0 4px rgba(54,39,18,.84),0 0 36px rgba(228,182,82,.28),0 17px 36px rgba(0,0,0,.5)!important;
}
#publicProfileModal .public-profile-title h2,
#characterModal .profile-title h2 {
  color:#f3fbff!important;
  text-shadow:0 2px 22px rgba(114,194,235,.17),0 2px 10px rgba(0,0,0,.44)!important;
}
#publicProfileModal .public-profile-card[data-legendary-hero="true"] .public-profile-title h2,
#characterModal .character-profile[data-legendary-hero="true"] .profile-title h2 {
  color:#fff3d6!important;
  text-shadow:0 0 21px rgba(230,182,88,.21),0 2px 10px rgba(0,0,0,.55)!important;
}
/* Existing rank badge is preserved; the aura only highlights its current rank. */
#publicProfileModal .public-profile-card[data-race-rank="1"] .public-profile-rank strong {
  color:#ffe1a0!important;
  text-shadow:0 0 18px rgba(240,194,95,.38)!important;
}
#publicProfileModal .public-profile-card[data-race-rank="2"] .public-profile-rank strong {
  color:#d8eff9!important;
  text-shadow:0 0 15px rgba(161,209,232,.23)!important;
}
#publicProfileModal .public-profile-card[data-race-rank="3"] .public-profile-rank strong {
  color:#d9aa88!important;
  text-shadow:0 0 15px rgba(189,123,83,.18)!important;
}
/* Only show Hero / Noblesse marks when those flags are true. */
.legendary-status-line {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:7px;
  margin-top:10px;
}
.legendary-status-chip {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:27px;
  padding:5px 10px;
  border:1px solid rgba(149,216,235,.34);
  border-radius:7px;
  background:linear-gradient(110deg,rgba(26,74,95,.75),rgba(5,29,42,.83));
  color:#c8f2fb;
  font:800 10px/1.15 Arial,sans-serif;
  letter-spacing:.13em;
  white-space:nowrap;
}
.legendary-status-chip .legendary-symbol {font-size:12px;line-height:1;}
.legendary-status-chip.is-hero {
  border-color:rgba(235,200,127,.65);
  color:#ffe7a9;
  background:linear-gradient(110deg,rgba(101,69,23,.70),rgba(37,31,22,.87));
  box-shadow:inset 0 1px rgba(255,239,190,.10),0 0 16px rgba(219,170,74,.09);
}
.legendary-status-chip.is-noble {
  border-color:rgba(158,216,239,.45);
  color:#c2eeff;
  background:linear-gradient(110deg,rgba(24,72,102,.78),rgba(6,33,51,.85));
}
#publicProfileModal .public-main-stats > div,
#characterModal .profile-stat {
  border:1px solid rgba(107,180,210,.17)!important;
  background:linear-gradient(147deg,rgba(21,51,67,.55),rgba(6,24,35,.65))!important;
  box-shadow:inset 0 1px rgba(196,233,247,.04)!important;
}
#publicProfileModal .public-main-stats > div.accent {
  border-color:rgba(95,212,242,.30)!important;
}
#publicProfileModal .public-main-stats strong,
#characterModal .profile-stat b {color:#e2f2f8!important;}
#publicProfileModal .public-main-stats > div.accent strong {color:#90ecfa!important;}
#publicProfileModal .public-profile-panel,
#publicProfileModal .public-badges-block,
#characterModal .profile-box {
  border:1px solid rgba(115,193,221,.19)!important;
  background:linear-gradient(145deg,rgba(12,36,52,.76),rgba(5,20,32,.86))!important;
  box-shadow:inset 0 1px rgba(208,240,255,.04)!important;
}
#publicProfileModal .public-badges {
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px!important;
}
/* Badge content already comes from the character's stored public achievements. */
#publicProfileModal .public-badge {
  display:flex;
  align-items:center;
  gap:11px;
  min-width:0;
  min-height:82px;
  padding:14px 12px!important;
  border:1px solid rgba(108,190,217,.24)!important;
  border-radius:11px!important;
  background:linear-gradient(135deg,rgba(21,54,70,.78),rgba(7,26,40,.92))!important;
  box-shadow:inset 0 1px rgba(198,234,248,.08),0 11px 25px rgba(0,0,0,.18);
}
#publicProfileModal .public-badge > span {
  display:grid;
  place-items:center;
  flex:0 0 39px;
  width:39px;
  height:39px;
  border:1px solid rgba(126,213,234,.38)!important;
  border-radius:11px!important;
  background:rgba(30,88,116,.25)!important;
  color:#d5f2fb!important;
  font-size:19px!important;
  text-shadow:0 0 11px rgba(89,208,239,.14);
}
#publicProfileModal .public-badge b {color:#e1f2f6!important;font-size:12px!important;line-height:1.35;}
#publicProfileModal .public-badge small {color:#9ab5c0!important;font-size:10px!important;line-height:1.4;overflow-wrap:anywhere;}
#publicProfileModal .public-badge.legendary-badge-hero,
#publicProfileModal .public-badge.legendary-badge-siege {
  border-color:rgba(211,173,101,.39)!important;
  background:linear-gradient(135deg,rgba(68,48,27,.74),rgba(18,31,38,.93))!important;
}
#publicProfileModal .public-badge.legendary-badge-hero > span,
#publicProfileModal .public-badge.legendary-badge-siege > span {
  border-color:rgba(226,191,127,.55)!important;
  background:rgba(115,83,34,.24)!important;
  color:#f4d7a0!important;
}
#publicProfileModal .public-badge.legendary-badge-pvp > span {
  border-color:rgba(103,199,237,.48)!important;
  color:#a5e8ff!important;
}
#publicProfileModal .public-badge.legendary-badge-support > span {
  border-color:rgba(118,212,169,.42)!important;
  color:#a8ebcd!important;
}
#characterModal .legendary-kills {
  margin-top:15px;
  padding:14px;
  border:1px solid rgba(105,192,222,.21);
  border-radius:11px;
  background:linear-gradient(125deg,rgba(10,40,57,.65),rgba(4,20,32,.77));
}
#characterModal .legendary-kills h4 {
  margin:0 0 10px;
  color:#b4e7f7;
  font:800 10px/1.4 Arial,sans-serif;
  letter-spacing:.16em;
}
#characterModal .legendary-kills-list {
  display:flex;
  flex-wrap:wrap;
  gap:9px;
}
#characterModal .legendary-kill-medal {
  display:flex;
  align-items:center;
  gap:7px;
  padding:9px 12px;
  border:1px solid rgba(104,201,236,.33);
  border-radius:8px;
  background:rgba(32,90,121,.20);
  color:#e1f5ff;
  font:800 12px/1.2 Arial,sans-serif;
  white-space:nowrap;
}
#characterModal .legendary-kill-medal.is-highest {
  border-color:rgba(232,192,114,.52);
  color:#ffe4a4;
  background:linear-gradient(110deg,rgba(89,65,30,.53),rgba(21,33,37,.51));
}
#characterModal .legendary-kill-medal .legendary-symbol {font-size:15px;}
/* Dedicated player pages (community demo), not clan profile panels. */
body[data-profile-kind="player"] #public-profile .profile-shell,
.community-dialog .profile-shell {
  border:1px solid rgba(124,202,231,.33)!important;
  box-shadow:0 24px 63px rgba(0,0,0,.35),inset 0 1px rgba(200,237,251,.06)!important;
}
body[data-profile-kind="player"] #public-profile .profile-top,
.community-dialog .profile-shell .profile-top {
  background-image:radial-gradient(ellipse at 12% 20%,rgba(63,160,210,.13),transparent 69%);
}
body[data-profile-kind="player"] #public-profile .profile-avatar-large.race-avatar,
.community-dialog .profile-avatar-large.race-avatar {
  width:100px!important;
  height:100px!important;
  flex:0 0 100px!important;
  border:2px solid rgba(132,213,238,.65)!important;
  border-radius:19px!important;
  box-shadow:0 0 0 3px rgba(4,22,34,.78),0 0 26px rgba(83,173,224,.17),0 13px 33px rgba(0,0,0,.37)!important;
}
body[data-profile-kind="player"] #public-profile .profile-shell[data-legendary-hero="true"],
.community-dialog .profile-shell[data-legendary-hero="true"] {
  border-color:rgba(226,189,112,.60)!important;
  box-shadow:0 23px 70px rgba(0,0,0,.41),0 0 25px rgba(208,161,72,.11)!important;
}
body[data-profile-kind="player"] #public-profile .profile-shell[data-legendary-hero="true"] .profile-avatar-large.race-avatar,
.community-dialog .profile-shell[data-legendary-hero="true"] .profile-avatar-large.race-avatar {
  border-color:rgba(241,209,139,.90)!important;
  box-shadow:0 0 0 3px rgba(55,40,17,.74),0 0 26px rgba(223,175,83,.24)!important;
}
body[data-profile-kind="player"] #public-profile .achievement-badge.unlocked,
.community-dialog .achievement-badge.unlocked {
  border-color:rgba(116,210,234,.34)!important;
  box-shadow:inset 0 1px rgba(201,239,253,.07),0 10px 25px rgba(0,0,0,.12)!important;
}
body[data-profile-kind="player"] #public-profile .achievement-badge.unlocked.legendary-badge-pvp,
body[data-profile-kind="player"] #public-profile .achievement-badge.unlocked.legendary-badge-hero,
.community-dialog .achievement-badge.unlocked.legendary-badge-pvp,
.community-dialog .achievement-badge.unlocked.legendary-badge-hero {
  border-color:rgba(222,184,103,.43)!important;
  background:linear-gradient(135deg,rgba(64,46,25,.59),rgba(8,31,42,.92))!important;
}
@media(hover:hover) and (pointer:fine){
  #publicProfileModal .public-badge {transition:border-color .2s ease,box-shadow .2s ease;}
  #publicProfileModal .public-badge:hover {border-color:rgba(157,222,245,.49)!important;box-shadow:inset 0 1px rgba(204,242,255,.09),0 14px 29px rgba(0,0,0,.25)!important;}
}
@media(max-width:720px){
  #publicProfileModal .public-profile-banner {min-height:265px!important;gap:13px!important;}
  #characterModal .profile-hero {min-height:237px!important;gap:14px!important;}
  #publicProfileModal .public-avatar.race-avatar {width:82px!important;height:82px!important;border-radius:15px!important;}
  #characterModal .profile-emblem.account-race-portrait {width:80px!important;height:80px!important;border-radius:14px!important;}
  #publicProfileModal .public-badges {grid-template-columns:1fr!important;gap:8px!important;}
  #publicProfileModal .public-badge {min-height:70px;padding:11px!important;}
  .legendary-status-chip {font-size:9px!important;min-height:25px;padding:5px 8px;letter-spacing:.08em;}
  body[data-profile-kind="player"] #public-profile .profile-avatar-large.race-avatar,
  .community-dialog .profile-avatar-large.race-avatar {
    width:70px!important;height:70px!important;flex:0 0 70px!important;border-radius:13px!important;
  }
}
@media(max-width:380px){
  #publicProfileModal .public-avatar.race-avatar {width:73px!important;height:73px!important;}
  #characterModal .profile-emblem.account-race-portrait {width:72px!important;height:72px!important;}
  #characterModal .legendary-kill-medal {padding:8px 9px;font-size:11px;}
}
@media(prefers-reduced-motion:reduce){
  #publicProfileModal .public-badge {transition:none!important;}
}

/* V5.1 — Compact PvP rank insignia on phones.
   The existing mobile rule set left:20px while desktop retains right:22px:
   both inset edges stretch the positioned rank container into a wide bar.
   Reset left and explicitly size the trophy emblem rather than painting
   a full-width plate across the player's portrait/title. */
#publicProfileModal .public-profile-banner .public-profile-rank {
  left:auto!important;
  right:20px!important;
  top:17px!important;
  bottom:auto!important;
  width:max-content!important;
  max-width:calc(100% - 40px)!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-end!important;
  gap:5px!important;
  margin:0!important;
  padding:0!important;
  text-align:right!important;
  z-index:5!important;
}
#publicProfileModal .public-profile-rank small {
  display:block!important;
  margin:0!important;
  padding:0!important;
  color:#c0b69b!important;
  font-size:10px!important;
  letter-spacing:.11em!important;
  line-height:1.2!important;
  white-space:nowrap!important;
}
#publicProfileModal .public-profile-rank #publicProfileRank.realm-rank-emblem {
  display:inline-flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 auto!important;
  gap:6px!important;
  box-sizing:border-box!important;
  position:relative!important;
  inset:auto!important;
  width:auto!important;
  max-width:110px!important;
  min-width:76px!important;
  height:39px!important;
  min-height:39px!important;
  max-height:39px!important;
  margin:0!important;
  padding:7px 11px!important;
  overflow:hidden!important;
  border:1px solid rgba(223,192,124,.5)!important;
  border-radius:9px!important;
  font-size:13px!important;
  line-height:1.2!important;
}
#publicProfileModal #publicProfileRank .realm-icon {
  display:inline-block!important;
  flex:0 0 auto!important;
  width:auto!important;
  height:auto!important;
  font-size:15px!important;
  line-height:1!important;
}
#publicProfileModal #publicProfileRank .realm-rank-value {
  display:inline!important;
  width:auto!important;
  white-space:nowrap!important;
  font:800 13px/1.2 system-ui,sans-serif!important;
}
@media(max-width:720px){
  #publicProfileModal .public-profile-banner .public-profile-rank {
    left:auto!important;
    right:16px!important;
    top:14px!important;
    max-width:calc(100% - 32px)!important;
  }
  #publicProfileModal .public-profile-rank #publicProfileRank.realm-rank-emblem {
    height:36px!important;
    min-height:36px!important;
    max-height:36px!important;
    min-width:72px!important;
    padding:6px 9px!important;
  }
}
@media(max-width:380px){
  #publicProfileModal .public-profile-banner .public-profile-rank {right:12px!important;}
}
