.staffStats{display:grid;gap:14px;margin:6px 0 18px}
.ssHead{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.ssHead h2{margin:0}
.staffStats .periodBar button{background:#1a1a1a;border:1px solid #2e2e2e;color:#ddd;border-radius:10px;padding:7px 12px;cursor:pointer}
.staffStats .periodBar button.on{background:linear-gradient(90deg,#f59e0b,#ef4444);border-color:transparent;color:#fff;font-weight:800}
.ssTeam{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.ssTeam>div{background:#131313;border:1px solid #262626;border-radius:14px;padding:14px}
.ssTeam small{display:block;color:#9a9a9a}.ssTeam b{display:block;font-size:24px;font-weight:900;margin-top:4px;color:#fff}.ssTeam b.warn{color:#fb7185}.ssTeam em{font-style:normal;color:#8a8a8a;font-size:12px}
.ssBoard{background:#131313;border:1px solid #262626;border-radius:14px;padding:14px;display:grid;gap:8px}
.ssBoard h3{margin:0 0 4px}
.ssRow{display:grid;grid-template-columns:32px minmax(90px,160px) 1fr 70px 64px;gap:10px;align-items:center}
.ssRow .rk{font-size:18px;text-align:center}.ssRow .nm{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ssRow .bar{height:10px;background:#1f1f1f;border-radius:99px;overflow:hidden}.ssRow .bar i{display:block;height:100%;background:linear-gradient(90deg,#f59e0b,#ef4444);border-radius:99px}
.ssRow .v{color:#ddd;font-size:13px}.ssRow .sp{font-weight:800;font-size:13px;text-align:center;border-radius:99px;padding:2px 6px;background:#1a1a1a}
.good{color:#34d399!important}.mid{color:#fbbf24!important}.bad{color:#fb7185!important}
.ssCards{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px}
.ssCard{background:#131313;border:1px solid #262626;border-radius:16px;padding:14px;display:grid;gap:12px}
.ssTop{display:flex;justify-content:space-between;align-items:center;gap:8px}.ssTop strong{font-size:16px}
.pres{font-size:12px;color:#9a9a9a;display:inline-flex;align-items:center;gap:6px}.pres i{width:9px;height:9px;border-radius:50%;background:#555}.pres.on{color:#34d399}.pres.on i{background:#34d399;box-shadow:0 0 8px #34d399}
.ssKpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.ssKpis span{background:#0f0f0f;border:1px solid #232323;border-radius:10px;padding:8px}
.ssKpis small{display:block;color:#8f8f8f;font-size:11px}.ssKpis b{display:block;font-size:19px;font-weight:900;color:#fff}.ssKpis em{display:block;font-style:normal;font-size:10.5px;color:#777}
.ssSales,.ssTime{display:flex;flex-wrap:wrap;gap:6px}
.ssSales span,.ssTime span{background:#171717;border:1px solid #262626;border-radius:99px;padding:4px 10px;font-size:12px;color:#bbb}.ssSales b,.ssTime b{color:#fbbf24;margin-inline-start:4px}
.hrs{display:flex;align-items:flex-end;gap:2px;height:32px;direction:ltr}.hrs i{flex:1;background:#262626;border-radius:3px 3px 0 0}.hrs i.on{background:linear-gradient(180deg,#fbbf24,#f59e0b)}
.hrsAxis{display:flex;justify-content:space-between;direction:ltr;font-size:10px;color:#777;margin-top:-6px}
@media (max-width:820px){.ssTeam{grid-template-columns:repeat(2,minmax(0,1fr))}.ssRow{grid-template-columns:28px 1fr 60px 56px}.ssRow .bar{display:none}.ssCards{grid-template-columns:1fr}.ssKpis{grid-template-columns:repeat(2,1fr)}}