/* Raporlar → Performans */
.pf-filter { flex-wrap: wrap; }
.pf-period { margin: -6px 2px 16px; display: flex; flex-wrap: wrap; gap: 6px 16px; }
.pf-warn { color: #c0772f; }

.pf-mine { margin-bottom: 18px; padding: 20px 22px; border: 1px solid #e3e0ff; border-radius: 16px; background: linear-gradient(135deg, #fbfaff, #f3f1ff); }
.pf-mine-head { display: flex; align-items: center; gap: 16px; }
.pf-mine-head h2 { margin: 2px 0 4px; font: 800 22px Manrope, sans-serif; color: var(--ink); }
.pf-mine-head h2 small { font-size: 13px; font-weight: 600; color: var(--muted); }
.pf-mine-head p { margin: 0; }
.pf-mine-head .eyebrow { margin: 0; }
.avatar.pf-avatar-lg { width: 52px; height: 52px; font-size: 20px; }
.pf-chips { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin-top: 16px; }
.pf-chip { display: grid; gap: 2px; padding: 10px 12px; text-align: left; border: 1px solid #e6e4f6; border-radius: 12px; background: #fff; color: var(--ink); }
.pf-chip span { color: var(--muted); font-size: 11px; font-weight: 600; }
.pf-chip b { font: 800 17px Manrope, sans-serif; }
.pf-chip small { color: var(--purple); font-weight: 700; font-size: 11px; }
.pf-chip:hover, .pf-chip.active { border-color: var(--purple); box-shadow: 0 0 0 3px #6857df1f; }

.pf-trend { display: inline-block; margin-left: 6px; padding: 1px 6px; border-radius: 10px; font-size: 10px; font-weight: 700; vertical-align: middle; }
.pf-trend.up { color: #1f8a5f; background: #e5f7ee; }
.pf-trend.down { color: #c2453d; background: #fdecea; }
.pf-trend.same { color: #8b8fa3; background: #f0f1f6; }
.pf-trend.new { color: #6857df; background: #f0efff; }

.pf-top { display: grid; grid-template-columns: minmax(0, 1fr); margin-bottom: 18px; }
.pf-podium { display: flex; justify-content: center; align-items: flex-end; gap: 18px; padding: 10px 0 0; min-height: 230px; }
.pf-step { display: flex; flex-direction: column; align-items: center; gap: 6px; width: 170px; text-align: center; }
.pf-step b { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink); }
.pf-step-value { font: 800 16px Manrope, sans-serif; color: var(--purple); }
.pf-block { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; border-radius: 12px 12px 0 0;
  color: #fff; font: 800 22px Manrope, sans-serif; background: linear-gradient(180deg, #8f84f5, #6857df); }
.pf-block span { font-size: 22px; line-height: 1; }
.pf-step-1 .pf-block { height: 110px; }
.pf-step-2 .pf-block { height: 80px; background: linear-gradient(180deg, #a9acc0, #8287a0); }
.pf-step-3 .pf-block { height: 60px; background: linear-gradient(180deg, #e2a36f, #c97c44); }
.pf-step.me b::after { content: ' (siz)'; color: var(--purple); font-weight: 600; }

.pf-table .pf-rank { width: 48px; font-size: 15px; }
.pf-user { display: flex; align-items: flex-start; gap: 10px; min-width: 210px; }
.pf-user b { display: block; color: #2c3044; }
.pf-user small { color: #8b8fa3; }
.pf-table tbody tr.pf-me td { background: #f6f4ff; }
.pf-table td.pf-sel { background: #faf9ff; font-weight: 700; }
.pf-table tbody tr.pf-me td.pf-sel { background: #efecff; }
.pf-table th[data-pf-metric].sorted { color: var(--purple); }
.pf-table th[data-pf-metric].sorted::after { content: ' ↓'; }
.ua-tag.pf-you { color: #fff; background: var(--purple); }
.pf-table tfoot small { font-weight: 500; }

@media (max-width: 1100px) { .pf-chips { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) {
  .pf-chips { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pf-podium { gap: 8px; }
  .pf-step { width: 31%; }
}