/* UI 017.3B.5.2 — Equipment Compare controls polish.
   Additive visual layer only: brighter Compare CTA + consistent CSS-drawn close icons.
   Scoped to isolated Character; no Battle/shared navigation changes. */

#i173a-character-layer .i173b2-actions .i173b5-open{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border-color:rgba(239,199,105,.58);
  background:
    linear-gradient(180deg,rgba(132,48,151,.98) 0%,rgba(94,29,116,.98) 54%,rgba(65,20,80,.99) 100%);
  color:#fff0bd;
  box-shadow:
    inset 0 1px 0 rgba(255,234,179,.20),
    inset 0 0 0 1px rgba(255,214,122,.06),
    0 7px 18px rgba(91,30,110,.22);
  text-shadow:0 1px 8px rgba(255,215,123,.12);
}

#i173a-character-layer .i173b2-actions .i173b5-open::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(255,236,188,.08),transparent 42%);
}

#i173a-character-layer .i173b2-actions .i173b5-open:active{
  filter:brightness(1.08);
}

/* Replace font glyph × with optically centered vector-like CSS strokes. */
#i173a-character-layer .i173b2-close,
#i173a-character-layer .i173a-close,
#i173a-character-layer .i173b5-collapse{
  position:relative;
  overflow:hidden;
  color:transparent !important;
  font-size:0 !important;
  line-height:0 !important;
  border-color:rgba(231,193,104,.42);
  background:
    radial-gradient(circle at 34% 25%,rgba(255,232,173,.08),transparent 48%),
    linear-gradient(180deg,rgba(23,14,29,.94),rgba(8,6,12,.96));
  box-shadow:
    inset 0 1px 0 rgba(255,231,174,.08),
    0 5px 14px rgba(0,0,0,.18);
  -webkit-tap-highlight-color:transparent;
}

#i173a-character-layer .i173b2-close::before,
#i173a-character-layer .i173b2-close::after,
#i173a-character-layer .i173a-close::before,
#i173a-character-layer .i173a-close::after,
#i173a-character-layer .i173b5-collapse::before,
#i173a-character-layer .i173b5-collapse::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:17px;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,#e8c97f,#fff0bd);
  box-shadow:0 0 7px rgba(232,201,127,.10);
  pointer-events:none;
  transform-origin:50% 50%;
}

#i173a-character-layer .i173b2-close::before,
#i173a-character-layer .i173a-close::before,
#i173a-character-layer .i173b5-collapse::before{
  transform:translate(-50%,-50%) rotate(45deg);
}

#i173a-character-layer .i173b2-close::after,
#i173a-character-layer .i173a-close::after,
#i173a-character-layer .i173b5-collapse::after{
  transform:translate(-50%,-50%) rotate(-45deg);
}

#i173a-character-layer .i173b5-collapse{
  border-radius:50%;
}

#i173a-character-layer .i173b5-collapse::before,
#i173a-character-layer .i173b5-collapse::after{
  width:14px;
  height:1.8px;
}

@media (hover:hover) and (pointer:fine){
  #i173a-character-layer .i173b2-actions .i173b5-open:hover{
    filter:brightness(1.10);
    border-color:rgba(247,208,111,.72);
  }

  #i173a-character-layer .i173b2-close:hover,
  #i173a-character-layer .i173a-close:hover,
  #i173a-character-layer .i173b5-collapse:hover{
    border-color:rgba(239,202,112,.62);
    filter:brightness(1.08);
  }
}

#i173a-character-layer .i173b2-actions .i173b5-open:focus-visible,
#i173a-character-layer .i173b2-close:focus-visible,
#i173a-character-layer .i173a-close:focus-visible,
#i173a-character-layer .i173b5-collapse:focus-visible{
  outline:2px solid rgba(231,193,104,.78);
  outline-offset:2px;
}

@media (prefers-reduced-motion:reduce){
  #i173a-character-layer .i173b2-actions .i173b5-open,
  #i173a-character-layer .i173b2-close,
  #i173a-character-layer .i173a-close,
  #i173a-character-layer .i173b5-collapse{
    transition:none !important;
  }
}
