#gzx-personal-performance { margin-bottom: 16px; }
#gzx-personal-performance .gzx-pp-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:14px; }
#gzx-personal-performance .gzx-pp-head h2 { margin:4px 0 5px; font-size:22px; letter-spacing:-.03em; }
#gzx-personal-performance .gzx-pp-head p { margin:0; color:#66758a; font-size:13px; }
#gzx-personal-performance .gzx-pp-refresh { border:1px solid #d7deea; border-radius:9px; min-height:34px; padding:0 14px; background:#fff; color:#475467; font:inherit; font-weight:700; cursor:pointer; }
#gzx-personal-performance .gzx-pp-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
#gzx-personal-performance .gzx-pp-card { display:grid; gap:5px; padding:13px 14px; border:1px solid #e1e6ee; border-radius:12px; background:linear-gradient(150deg,#fff,#f8fafc); }
#gzx-personal-performance .gzx-pp-card span { color:#66758a; font-size:12px; font-weight:700; }
#gzx-personal-performance .gzx-pp-card strong { color:#172033; font-size:22px; }
#gzx-personal-performance .gzx-pp-card small { color:#475467; font-size:12px; }
#gzx-personal-performance .gzx-pp-card em { color:#8a929c; font-size:11px; font-style:normal; }
#gzx-personal-performance .gzx-pp-section-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:16px 0 8px; }
#gzx-personal-performance .gzx-pp-section-head h3 { margin:0; font-size:15px; }
#gzx-personal-performance .gzx-pp-section-head span { color:#66758a; font-size:12px; }
#gzx-personal-performance .gzx-pp-table-wrap { overflow:auto; border:1px solid #e8edf4; border-radius:11px; }
#gzx-personal-performance table { width:100%; min-width:900px; border-collapse:collapse; }
#gzx-personal-performance th { padding:9px 10px; background:#f8fafc; color:#66758a; font-size:11px; text-align:left; border-bottom:1px solid #edf1f6; white-space:nowrap; }
#gzx-personal-performance td { padding:9px 10px; color:#172033; font-size:12px; border-bottom:1px solid #f1f4f8; vertical-align:top; white-space:nowrap; }
#gzx-personal-performance td small { display:block; margin-top:3px; color:#98a2b3; font-size:10px; }
#gzx-personal-performance .gzx-pp-empty, #gzx-personal-performance .gzx-pp-error { margin:14px 0; padding:16px; border-radius:10px; background:#f8fafc; color:#7b8798; text-align:center; font-size:13px; }
#gzx-personal-performance .gzx-pp-error { background:#fef2f2; color:#991b1b; }
@media (max-width: 900px) {
  #gzx-personal-performance .gzx-pp-cards { grid-template-columns:1fr; }
}

/* layout fix: keep the extra panel compact and scroll records inside */
#gzx-personal-performance.gzx-pp-panel {
  flex: 0 0 340px !important;
  display: block !important;
  height: 340px !important;
  min-height: 340px !important;
  max-height: 340px !important;
  overflow: hidden !important;
  padding: 14px 16px !important;
}
#gzx-personal-performance .gzx-pp-head { margin-bottom: 10px !important; }
#gzx-personal-performance .gzx-pp-card { padding: 10px 12px !important; }
#gzx-personal-performance .gzx-pp-card strong { font-size: 20px !important; }
#gzx-personal-performance .gzx-pp-section-head { margin: 10px 0 6px !important; }
#gzx-personal-performance .gzx-pp-table-wrap { max-height: 135px !important; overflow: auto !important; }

/* parallel layout: personal performance beside full ranking */
#gzx-pp-ranking-wrap {
  display: grid !important;
  grid-template-columns: 360px minmax(0, 1fr) !important;
  gap: 14px !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  width: 100% !important;
  align-items: stretch !important;
}
#gzx-pp-ranking-wrap #gzx-personal-performance.gzx-pp-panel {
  flex: none !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
}
#gzx-pp-ranking-wrap > .panel:not(#gzx-personal-performance) {
  flex: 1 1 auto !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
}
@media (max-width: 1000px) {
  #gzx-pp-ranking-wrap { grid-template-columns: 1fr !important; }
}

/* embedded personal performance tab inside the ranking board */
.rank-board.gzx-pp-mode > .rank-board-controls > .rank-board-tabs:first-child { display: none !important; }
.rank-board.gzx-pp-mode > .rank-board-controls > span { display: none !important; }
.rank-board.gzx-pp-mode > .rank-board-list,
.rank-board.gzx-pp-mode > .rank-board-departments,
.rank-board.gzx-pp-mode > .rank-month-picker,
.rank-board.gzx-pp-mode > .rank-board-error,
.rank-board.gzx-pp-mode > .rank-board-empty { display: none !important; }
.rank-board [data-gzx-personal-tab].active { background:#fff; color:#8a4f2c; box-shadow:0 1px 4px #493a2d1f; }
#gzx-personal-performance.gzx-pp-embed {
  margin: 0 !important;
  padding: 4px 0 0 !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}
#gzx-personal-performance.gzx-pp-embed .gzx-pp-table-wrap { max-height: 420px !important; }
#gzx-pp-ranking-wrap { display: block !important; }