/* ===== Character Profile — Exodar purple profile ===== */
.cp{
  --cp-bg:rgba(7,5,13,.88);
  --cp-panel:rgba(12,7,20,.88);
  --cp-line:rgba(159,92,246,.34);
  --cp-line-soft:rgba(159,92,246,.18);
  --cp-text:#efe8f7;
  --cp-muted:#b9adc8;
  --cp-purple:#9d55ff;
  --cp-gold:#d8b26a;
  --cp-good:#4ade80;
  --cp-bad:#f87171;
  color:var(--cp-text);
  container-type:inline-size;
}

.cp *{ box-sizing:border-box; }
.cp a{ color:#d9b8ff; text-decoration:none; }
.cp a:hover{ color:#fff; }
.cp img{ vertical-align:middle; }

.cp .TableContainer{
  position:relative;
  margin:0 0 14px;
  overflow:hidden;
  border:1px solid var(--cp-line);
  border-radius:7px;
  background:
    linear-gradient(180deg, rgba(8,6,13,.90), rgba(5,4,9,.92)),
    url("../images/redesign/ui/character-panel-v1.svg") center/100% 100% no-repeat;
  box-shadow:0 18px 36px rgba(0,0,0,.32), inset 0 0 28px rgba(119,70,255,.09);
}

.cp .TableContainer::before,
.cp .TableContainer::after{
  content:"";
  position:absolute;
  top:-6px;
  width:18px;
  height:18px;
  border:1px solid rgba(184,126,255,.50);
  transform:rotate(45deg);
  pointer-events:none;
}

.cp .TableContainer::before{ left:-6px; }
.cp .TableContainer::after{ right:-6px; }

.cp .CaptionContainer{
  background:linear-gradient(180deg, rgba(12,7,20,.60), rgba(5,4,9,.30));
  border-bottom:1px solid rgba(159,92,246,.18);
}

.cp .CaptionInnerContainer{
  position:relative;
  min-height:56px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:12px 18px;
}

.cp .CaptionInnerContainer::before,
.cp .CaptionInnerContainer::after{
  content:"";
  flex:1;
  height:1px;
  max-width:260px;
  background:linear-gradient(90deg, transparent, rgba(190,124,255,.56), transparent);
}

.cp .CaptionInnerContainer .Text{
  margin:0 18px;
  color:#f8efff;
  font-family:var(--font-title, Georgia, serif);
  font-size:1.34rem;
  font-weight:800;
  letter-spacing:.10em;
  line-height:1.1;
  text-align:center;
  text-transform:uppercase;
  text-shadow:0 2px 3px rgba(0,0,0,.78), 0 0 14px rgba(157,85,255,.28);
}

.cp .CaptionInnerContainer span[class^="Caption"]{ display:none!important; }
.cp .InnerTableContainer{ padding:14px; }
.cp .TableContentContainer{ background:transparent; border:0; }

.cp-profile-card{
  background:
    radial-gradient(circle at 22% 45%, rgba(157,85,255,.18), transparent 28%),
    radial-gradient(circle at 84% 12%, rgba(105,47,184,.18), transparent 32%),
    linear-gradient(180deg, rgba(11,7,20,.74), rgba(4,3,9,.94)),
    url("../images/redesign/ui/character-profile-hero-v1.svg") center top/100% 240px no-repeat,
    url("../images/redesign/ui/character-panel-v1.svg") center/100% 100% no-repeat!important;
}

.cp-info-flex{
  display:grid;
  grid-template-columns:260px minmax(0,1fr);
  gap:28px;
  align-items:stretch;
}

.cp-info-left{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:center;
}

.cp-name-header-left{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin:0 0 10px;
}

.cp-player-name{
  color:#f7efff;
  font-family:var(--font-title, Georgia, serif);
  font-size:2.1rem;
  line-height:1.05;
  text-shadow:0 2px 3px rgba(0,0,0,.80), 0 0 17px rgba(157,85,255,.30);
}

.cp-country-flag img{
  max-width:28px;
  height:auto;
  filter:drop-shadow(0 4px 5px rgba(0,0,0,.50));
}

.cp-outfit-box{
  position:relative;
  width:220px;
  height:236px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:22px;
  background:url("../images/redesign/ui/character-outfit-stage-v1.svg") center/100% 100% no-repeat;
  filter:drop-shadow(0 18px 24px rgba(0,0,0,.35));
}

.cp-outfit-box img{
  width:138px;
  height:138px;
  object-fit:contain;
  image-rendering:pixelated;
  filter:drop-shadow(0 16px 12px rgba(0,0,0,.72)) drop-shadow(0 0 18px rgba(157,85,255,.34));
}

.cp-status-badge{
  margin-top:-22px;
  z-index:2;
}

.status-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:26px;
  border-radius:999px;
  padding:4px 12px;
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.status-online{
  border:1px solid rgba(76,218,111,.44);
  background:rgba(19,84,33,.54);
  color:#89ff9f;
  box-shadow:0 0 16px rgba(76,218,111,.18);
}

.status-offline{
  border:1px solid rgba(248,113,113,.40);
  background:rgba(95,21,30,.44);
  color:#ff9c9c;
}

.cp-info-right{
  min-width:0;
  display:flex;
  align-items:center;
}

.cp-details-grid{
  width:100%;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0 28px;
}

.cp-detail-item{
  min-height:46px;
  display:grid;
  grid-template-columns:1fr;
  align-items:center;
  gap:4px;
  padding:7px 0;
  border-bottom:1px solid rgba(159,92,246,.14);
}

.cp-detail-item::before{
  content:"✦";
  position:absolute;
  color:#9d55ff;
  opacity:0;
}

.cp-label{
  color:#cdb9e3;
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.cp-value{
  min-width:0;
  color:#f4edf9;
  overflow:visible;
  overflow-wrap:anywhere;
  }

.text-right{ text-align:left; }
.muted{ color:#9f93ad!important; }
.u-good{ color:#53f28b; font-weight:900; }

.level-box{
  display:inline-flex;
  min-width:46px;
  min-height:28px;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(194,138,255,.42);
  border-radius:5px;
  background:rgba(62,26,96,.58);
  color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 0 12px rgba(157,85,255,.20);
}

.cp-bars-card .InnerTableContainer{
  padding:12px;
}

.cp-stats-grid{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  gap:10px;
}

.stat-item{
  min-width:0;
  position:relative;
  overflow:hidden;
  min-height:88px;
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  grid-template-rows:auto auto 14px;
  align-items:center;
  column-gap:10px;
  padding:12px;
  border:1px solid rgba(159,92,246,.34);
  border-radius:8px;
  background:
    radial-gradient(circle at 20% 22%, rgba(157,85,255,.18), transparent 34%),
    linear-gradient(180deg, rgba(18,10,30,.94), rgba(5,4,10,.96)),
    url("../images/redesign/ui/character-stat-v1.svg") center/100% 100% no-repeat;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05), inset 0 0 24px rgba(157,85,255,.07);
}

.stat-item::after{
  content:"";
  position:absolute;
  inset:auto 14px 10px 14px;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(216,178,106,.28), transparent);
  pointer-events:none;
}

.stat-item--major,
.stat-item--minor{
  grid-column:span 2;
}

.stat-item--major{
  min-height:108px;
}

.stat-item--major .cp-label{
  align-self:end;
  font-size:.76rem;
}

.stat-item--major strong{
  align-self:start;
}

.stat-item--minor{
  min-height:76px;
  grid-template-rows:auto auto;
}

.stat-icon{
  grid-row:1 / span 2;
  width:38px;
  height:38px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(184,126,255,.30);
  border-radius:50%;
  background:
    radial-gradient(circle at 50% 35%, rgba(174,105,255,.40), transparent 62%),
    linear-gradient(180deg, rgba(35,20,56,.94), rgba(9,6,16,.96));
  box-shadow:0 0 16px rgba(157,85,255,.18), inset 0 1px 0 rgba(255,255,255,.10);
}

.stat-icon::before{
  color:#ead9ff;
  font-size:18px;
  text-shadow:0 0 10px rgba(190,124,255,.58);
}

.stat-item--health .stat-icon::before{ content:"♥"; color:#ff5364; }
.stat-item--mana .stat-icon::before{ content:"●"; color:#58a6ff; }
.stat-item--exp .stat-icon::before{ content:"✦"; }
.stat-item--magic .stat-icon::before{ content:"⚚"; }
.stat-item--capacity .stat-icon::before{ content:"▣"; color:#d8b26a; }
.stat-item--speed .stat-icon::before{ content:"✧"; color:#d9b8ff; }

.stat-item strong{
  min-width:0;
  overflow:hidden;
  color:#fff;
  font-size:.95rem;
  text-align:right;
  text-overflow:ellipsis;
  white-space:nowrap;
  text-shadow:0 2px 4px rgba(0,0,0,.78);
}

.cp-progress-bg{
  grid-column:1 / -1;
  width:100%;
  height:10px;
  overflow:hidden;
  align-self:end;
  border:1px solid rgba(159,92,246,.30);
  border-radius:999px;
  background:linear-gradient(180deg, rgba(4,3,8,.94), rgba(10,7,18,.92));
  box-shadow:inset 0 1px 4px rgba(0,0,0,.72);
}

.cp-bar{
  height:100%;
  max-width:100%;
  min-width:2px;
  border-radius:999px;
  box-shadow:0 0 14px currentColor, inset 0 1px 0 rgba(255,255,255,.28);
}

.cp-bar.hp{ background:linear-gradient(90deg,#a20f28,#ff2e63 58%,#ff8aa5); color:#ff3b6b; }
.cp-bar.mp{ background:linear-gradient(90deg,#2442d8,#5d7cff 58%,#9eb5ff); color:#6888ff; }
.cp-bar.exp{ background:linear-gradient(90deg,#7431d4,#b56cff 55%,#e5bf73); color:#b983ff; }

.cp-double-container{
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
  gap:14px;
}

.inventory-display{
  min-height:230px;
  display:grid;
  grid-template-columns:repeat(3,70px);
  justify-content:center;
  gap:10px;
  padding:12px;
  background:radial-gradient(circle at 50% 52%, rgba(157,85,255,.10), transparent 58%);
}

.inv-column{
  display:flex;
  flex-direction:column;
  gap:10px;
  align-items:center;
}

.inv-box{
  width:54px;
  height:54px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(159,92,246,.28);
  border-radius:5px;
  background:rgba(6,4,10,.72);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04), 0 0 14px rgba(157,85,255,.08);
}

.inv-box img{
  max-width:42px;
  max-height:42px;
  image-rendering:pixelated;
  filter:drop-shadow(0 6px 7px rgba(0,0,0,.62));
}

.inv-stat{
  width:100%;
  min-height:42px;
  border:1px solid rgba(159,92,246,.22);
  border-radius:5px;
  background:rgba(7,5,13,.70);
  color:#cfc4dd;
  padding:6px;
  text-align:center;
  font-size:.78rem;
}

.skills-centering-container{
  display:flex;
  align-items:center;
  min-height:186px;
}

.cp-skills-modern{
  width:100%;
  border-collapse:separate;
  border-spacing:4px 0;
  table-layout:fixed;
}

.cp-skills-modern td{
  min-width:0;
  color:#d8cde6;
  text-align:center;
}

.cp-skills-modern thead td{
  padding:0 0 12px;
  font-size:.60rem;
  letter-spacing:0;
  text-transform:uppercase;
}

.cp-skills-modern thead b{
  display:block;
  line-height:1;
  white-space:nowrap;
}

.cp-skill-icon{
  width:38px;
  height:38px;
  display:block;
  margin:0 auto 8px;
  border:1px solid rgba(184,126,255,.36);
  border-radius:7px;
  background-color:rgba(7,5,13,.92);
  background-position:center;
  background-repeat:no-repeat;
  background-size:31px 31px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 0 16px rgba(157,85,255,.20),
    0 8px 14px rgba(0,0,0,.30);
}

.cp-skill-icon--level{ background-image:url("../images/redesign/ui/skill-level-v2.svg"); }
.cp-skill-icon--magic{ background-image:url("../images/redesign/ui/skill-magic-v2.svg"); }
.cp-skill-icon--fist{ background-image:url("../images/redesign/ui/skill-fist-v2.svg"); }
.cp-skill-icon--club{ background-image:url("../images/redesign/ui/skill-club-v2.svg"); }
.cp-skill-icon--sword{ background-image:url("../images/redesign/ui/skill-sword-v2.svg"); }
.cp-skill-icon--axe{ background-image:url("../images/redesign/ui/skill-axe-v2.svg"); }
.cp-skill-icon--dist{ background-image:url("../images/redesign/ui/skill-distance-v2.svg"); }
.cp-skill-icon--def{ background-image:url("../images/redesign/ui/skill-defense-v2.svg"); }
.cp-skill-icon--fish{ background-image:url("../images/redesign/ui/skill-fishing-v2.svg"); }

.cp-skills-values td{
  color:#fff;
  font-family:var(--font-title, Georgia, serif);
  font-size:1.08rem;
  text-shadow:0 2px 4px rgba(0,0,0,.70), 0 0 10px rgba(157,85,255,.18);
}

.cp .TableContent{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  border:1px solid rgba(159,92,246,.18);
  border-radius:6px;
  overflow:hidden;
  background:rgba(5,4,10,.52);
}

.cp .TableContent th,
.cp .TableContent td{
  border:0!important;
  border-bottom:1px solid rgba(159,92,246,.12)!important;
  background:transparent!important;
  color:#e9e1f3;
  padding:10px 12px;
}

.cp .TableContent th{
  color:#cdb9e3;
  font-size:.72rem;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.cp .TableContent tr:last-child td{ border-bottom:0!important; }
.cp .TableContent tr:hover td{ background:rgba(157,85,255,.08)!important; }

.cp > br{ display:none; }
.cp .cp-sp--search{ margin-top:14px; }

@container (max-width:620px){
  .cp-info-flex{
    grid-template-columns:220px minmax(0,1fr);
    gap:18px;
  }

  .cp-outfit-box{
    width:196px;
    height:214px;
  }

  .cp-double-container{
    grid-template-columns:1fr;
  }
}

@container (max-width:560px){
  .cp .CaptionInnerContainer .Text{
    font-size:1.05rem;
  }

  .cp-info-flex,
  .cp-details-grid{
    grid-template-columns:1fr;
  }

  .cp-detail-item{
    grid-template-columns:1fr;
    gap:4px;
    padding:8px 0;
  }

  .cp-skills-modern{
    display:block;
    overflow-x:auto;
  }
}

@container (max-width:560px){
  .cp-stats-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .stat-item--major,
  .stat-item--minor{
    grid-column:span 2;
  }
}

@container (max-width:460px){
  .cp-stats-grid{
    grid-template-columns:1fr;
  }

  .inventory-display{
    grid-template-columns:repeat(3,58px);
    gap:6px;
  }

  .inv-box{
    width:48px;
    height:48px;
  }
}