.performance-report{padding-top:70px}
.performance-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:28px}
.performance-kpi{padding:22px;opacity:0;animation:performanceRise .6s cubic-bezier(.22,.68,.35,1) forwards;transition:border-color .25s,transform .25s}
.performance-kpi:nth-child(2){animation-delay:.09s}
.performance-kpi:nth-child(3){animation-delay:.18s}
.performance-kpi:hover{transform:translateY(-3px);border-color:var(--border)}
.performance-kpi span,.performance-kpi small{display:block;color:var(--muted);font-size:.75rem}
.performance-kpi strong{display:block;font:600 1.65rem Poppins,sans-serif;margin:6px 0;font-variant-numeric:tabular-nums}
.performance-kpi small.positive{color:var(--success)}
.performance-kpi small.negative{color:var(--danger)}
.performance-kpi small i,.performance-legend i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--gold);box-shadow:0 0 9px var(--gold)}
.performance-kpi small i{margin-right:7px;animation:performancePulse 2.4s ease-in-out infinite}
.performance-kpi small.positive i{background:var(--success);box-shadow:0 0 9px var(--success)}
.performance-kpi small.negative i{background:var(--danger);box-shadow:0 0 9px var(--danger)}
.performance-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:16px}
.performance-tabs{margin:0}
.performance-tabs button{cursor:pointer;transition:background .22s,color .22s,border-color .22s}
.performance-tabs button:hover:not(.active){color:var(--gold);border-color:var(--border)}
.performance-updated{color:var(--muted);font-size:.73rem;white-space:nowrap}
.performance-chart-wrap{padding:26px;height:460px;display:flex;flex-direction:column;opacity:0;animation:performanceRise .6s cubic-bezier(.22,.68,.35,1) .24s forwards}
/* Chart.js measures its parent, so the canvas needs a container holding only
   the space left over below the heading. */
.performance-chart-body{position:relative;flex:1;min-height:0}
.performance-chart-body canvas{position:absolute;inset:0;transition:opacity .18s ease}
.performance-chart-body canvas.is-switching{opacity:.3}
.performance-chart-wrap.is-empty{display:grid;place-items:center;height:260px}
.performance-empty{margin:0;color:var(--muted);font-size:.85rem;text-align:center}
.performance-chart-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:13px}
.performance-chart-head .eyebrow{margin-bottom:5px}
.performance-chart-head h3{margin:0}
.performance-period{border:1px solid var(--border);padding:5px 9px;border-radius:99px;color:var(--muted);font-size:.7rem;white-space:nowrap}
.performance-legend{display:flex;justify-content:space-between;padding:14px 3px;color:var(--muted);font-size:.73rem}
.performance-legend i{margin-right:7px}
@keyframes performanceRise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes performancePulse{0%,100%{opacity:1}50%{opacity:.4}}
@media(prefers-reduced-motion:reduce){
.performance-kpi,.performance-chart-wrap{opacity:1;animation:none}
.performance-kpi small i{animation:none}
.performance-chart-wrap canvas.is-switching{opacity:1}
}
@media(max-width:700px){
.performance-summary{grid-template-columns:1fr}
.performance-toolbar,.performance-legend{align-items:flex-start;flex-direction:column}
.performance-chart-wrap{height:380px;padding:18px}
.performance-tabs{width:100%;overflow:auto}
.performance-tabs button{font-size:.68rem}
}