/* 선수 비교: 초록 점 · 알약/채움 버튼 · 무지개 색 분류 · 연한 초록 배지 · 장식 아이콘을 걷어내고,
   두 선수를 구분하는 색(파랑/주황)만 남긴 담백한 비교 화면 */

/* 상단 도구 */
.compare-page-body .compare-hero .compare-tool {
  min-height: 0; padding: 4px 2px; border: 0; border-radius: 0; background: transparent; box-shadow: none;
  color: var(--muted); font-size: 13px; font-weight: 500; text-decoration: underline; text-underline-offset: 3px;
}
.compare-page-body .compare-hero .compare-tool:hover { color: var(--ink); background: transparent; }
.compare-page-body .compare-hero .compare-tool .bi { display: none; }
.compare-page-body .compare-hero-actions { gap: 14px; }

/* 선수 선택 칸 */
.compare-page-body .slot-title { font-size: 14px; font-weight: 700; }
.compare-page-body .slot-title::before { display: none; }
.compare-page-body .player-search, .compare-page-body .control-select { border-radius: 6px; }
.compare-page-body .player-search:focus, .compare-page-body .control-select:focus { border-color: #4b5563; box-shadow: none; }
.compare-page-body .search-btn { border-radius: 6px; background: var(--ink, #1f2937); border-color: var(--ink, #1f2937); font-weight: 700; box-shadow: none; }
.compare-page-body .search-btn:hover { background: #000; border-color: #000; }
.compare-page-body .player-name { font-weight: 700; letter-spacing: -.3px; }
.compare-page-body .summary-chip { padding: 0; border: 0; border-radius: 0; background: transparent; font-weight: 500; }
.compare-page-body .selected-actions { gap: 14px; }
.compare-page-body .selected-action {
  min-height: 0; padding: 2px 0; border: 0; border-radius: 0; background: transparent; box-shadow: none;
  color: var(--muted); font-size: 12px; font-weight: 500; text-decoration: underline; text-underline-offset: 3px;
}
.compare-page-body .selected-action:hover { color: var(--ink); background: transparent; border: 0; }
.compare-page-body .selected-action .bi { display: none; }
.compare-page-body .skill-settings summary { font-weight: 600; }

/* 가운데 교체 버튼 */
.compare-page-body .rail-button {
  border: 1px solid var(--line); border-radius: 6px; background: transparent; box-shadow: none; color: var(--muted);
}
.compare-page-body .rail-button:hover:not(:disabled) { border-color: var(--ink); color: var(--ink); background: transparent; }
.compare-page-body .rail-line { background: var(--line); }

/* 능력치 비교 머리 */
.compare-page-body .stats-toolbar-actions .compare-tool, .compare-page-body .stats-toolbar-actions button {
  min-height: 0; padding: 4px 2px; border: 0; border-radius: 0; background: transparent; box-shadow: none;
  color: var(--muted); font-size: 13px; font-weight: 500; text-decoration: underline; text-underline-offset: 3px;
}
.compare-page-body .stats-toolbar-actions .bi { display: none; }
.compare-page-body .stats-title { font-weight: 700; letter-spacing: -.3px; }

/* 레이더: 6가지 분류 색을 하나의 중립 색으로 */
.compare-page-body .compare-radar {
  --radar-neutral: #64748b;
}
.compare-page-body .radar-group-speed, .compare-page-body .radar-group-shoot, .compare-page-body .radar-group-pass,
.compare-page-body .radar-group-dribble, .compare-page-body .radar-group-defend, .compare-page-body .radar-group-physical,
html[data-theme="dark"] .compare-page-body .radar-group-speed, html[data-theme="dark"] .compare-page-body .radar-group-shoot,
html[data-theme="dark"] .compare-page-body .radar-group-pass, html[data-theme="dark"] .compare-page-body .radar-group-dribble,
html[data-theme="dark"] .compare-page-body .radar-group-defend, html[data-theme="dark"] .compare-page-body .radar-group-physical {
  --group-color: var(--radar-neutral);
}
.compare-page-body .radar-label-speed, .compare-page-body .radar-label-shoot, .compare-page-body .radar-label-pass,
.compare-page-body .radar-label-dribble, .compare-page-body .radar-label-defend, .compare-page-body .radar-label-physical,
html[data-theme="dark"] .compare-page-body .radar-label-speed, html[data-theme="dark"] .compare-page-body .radar-label-shoot,
html[data-theme="dark"] .compare-page-body .radar-label-pass, html[data-theme="dark"] .compare-page-body .radar-label-dribble,
html[data-theme="dark"] .compare-page-body .radar-label-defend, html[data-theme="dark"] .compare-page-body .radar-label-physical {
  fill: var(--radar-text, #1f2937);
}
.compare-page-body .radar-axis-label { font-weight: 500; }
.compare-page-body .radar-group-arc { stroke-width: 2.5px; opacity: .45; }
.compare-page-body .radar-group-controls { gap: 14px; }
.compare-page-body .radar-group-controls button {
  padding: 4px 1px; border: 0; border-bottom: 2px solid transparent; border-radius: 0; font-size: 12px; font-weight: 500;
  color: var(--muted);
}
.compare-page-body .radar-group-controls button[aria-pressed="true"] { border-bottom-color: var(--ink); color: var(--ink); font-weight: 700; }
.compare-page-body .radar-advantage-heading b { font-weight: 700; }

/* 상세 비교표 */
.compare-page-body .compare-group-tabs { gap: 14px; }
.compare-page-body .compare-group-tabs button {
  min-height: 0; padding: 4px 1px; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: transparent;
  color: var(--muted); font-weight: 500;
}
.compare-page-body .compare-group-tabs button[aria-pressed="true"] {
  background: transparent; border-bottom-color: var(--ink); color: var(--ink); font-weight: 700;
}
.compare-page-body .compare-difference-toggle input { accent-color: var(--ink, #1f2937); }
.compare-page-body .group-title { background: transparent; padding: 14px 14px 6px; border-top: 1px solid var(--line); font-size: 12px; font-weight: 700; color: var(--muted); }
.compare-page-body .stat-bar { background: #e5e7eb; height: 2px; }
.compare-page-body .diff { padding: 0; border-radius: 0; background: transparent; font-weight: 600; }
.compare-page-body .compare-names { background: var(--panel, #fff); }

/* 포커스 */
.compare-page-body :is(button, a, input, select, summary):focus-visible { outline: 2px solid #4b5563; outline-offset: 2px; }
.compare-page-body .result-item:hover { border-color: var(--line); background: rgba(100, 116, 139, .08); }

html[data-theme="dark"] .compare-page-body .stat-bar { background: #334155; }
html[data-theme="dark"] .compare-page-body .group-title { background: transparent !important; border-top-color: var(--dark-line); }
html[data-theme="dark"] .compare-page-body .search-btn { background: #475569; border-color: #475569; }
html[data-theme="dark"] .compare-page-body .compare-group-tabs button[aria-pressed="true"],
html[data-theme="dark"] .compare-page-body .radar-group-controls button[aria-pressed="true"] { border-bottom-color: #e5e7eb; color: #e5e7eb; }
html[data-theme="dark"] .compare-page-body .compare-names { background: var(--dark-panel) !important; }
