.top-actions{display:flex;align-items:center;gap:8px}.dashboard-toolbar{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:14px}.dashboard-toolbar h3{margin:0 0 5px}.dashboard-toolbar label{display:grid;gap:6px;font-size:13px;color:#64748b}.dashboard-toolbar input{min-width:165px}.dashboard-status{min-height:20px;margin-bottom:10px}.analytics-grid{display:grid;grid-template-columns:minmax(280px,.92fr) minmax(390px,1.38fr) minmax(320px,1fr);gap:14px;margin:18px 0}.analytics-card{min-width:0;background:#fff;border:1px solid #dbe4ef;border-radius:14px;padding:16px;box-shadow:0 6px 20px rgba(15,23,42,.04)}.analytics-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:14px}.analytics-heading h3{font-size:16px;margin:0 0 5px;color:#172033}.analytics-heading p{font-size:12px;margin:0}.link-button{border:0;background:transparent;color:#2563eb;font-weight:700;padding:2px 0;white-space:nowrap;cursor:pointer}.chart-content{min-height:260px}.donut-layout{display:grid;grid-template-columns:minmax(150px,210px) minmax(120px,1fr);align-items:center;gap:16px;min-height:260px}.donut-ring{width:min(100%,210px);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;margin:auto;position:relative}.donut-ring:after{content:"";position:absolute;inset:25%;border-radius:50%;background:#fff;box-shadow:0 0 0 1px rgba(148,163,184,.16)}.donut-center{position:relative;z-index:1;text-align:center;max-width:110px}.donut-center span{display:block;color:#64748b;font-size:12px}.donut-center strong{display:block;color:#172033;font-size:17px;margin-top:5px;overflow:hidden;text-overflow:ellipsis}.donut-legend{display:grid;gap:9px;max-height:250px;overflow:auto;padding-right:3px}.donut-legend-row{display:grid;grid-template-columns:9px minmax(0,1fr) auto;align-items:center;gap:8px;font-size:12px}.color-dot{width:9px;height:9px;border-radius:999px}.donut-person{min-width:0}.donut-person strong,.donut-person span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.donut-person span{color:#64748b;margin-top:2px}.donut-percent{font-weight:800;color:#334155}.empty-chart{min-height:230px;display:grid;place-items:center;text-align:center;color:#94a3b8}.ranking-list{display:grid;gap:6px}.ranking-row{display:grid;grid-template-columns:30px minmax(70px,.65fr) minmax(90px,1.2fr) minmax(105px,.75fr) 48px;align-items:center;gap:8px;min-height:25px;font-size:12px}.rank-number{height:22px;display:grid;place-items:center;border-radius:999px;background:#f1f5f9;color:#64748b;font-weight:800}.ranking-row:nth-child(1) .rank-number{background:#fff1bf;color:#b77900}.ranking-row:nth-child(2) .rank-number{background:#e7edf4;color:#526273}.ranking-row:nth-child(3) .rank-number{background:#ffe8d5;color:#b65c18}.rank-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:750;border-left:4px solid var(--rank-color);padding-left:7px}.rank-track{height:9px;border:1px solid #b9c8da;background:#f8fafc;border-radius:999px;overflow:hidden}.rank-fill{height:100%;width:var(--rank-width);max-width:100%;border-radius:999px;background:var(--rank-color)}.rank-amount{text-align:right;color:#0891b2;font-weight:800;white-space:nowrap}.rank-percent{text-align:right;color:var(--rank-color);font-weight:800}.trend-chart{min-height:245px}.trend-svg{display:block;width:100%;height:auto;min-height:220px;overflow:visible}.trend-grid{stroke:#dbe4ef;stroke-width:1;stroke-dasharray:4 4}.trend-zero{stroke:#94a3b8;stroke-width:1}.trend-line{fill:none;stroke:#2563eb;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}.trend-area{fill:url(#trendArea)}.trend-point{fill:#fff;stroke:#2563eb;stroke-width:4;cursor:pointer}.trend-point:hover{fill:#dbeafe}.trend-label{fill:#64748b;font-size:12px;text-anchor:middle}.trend-value{fill:#475569;font-size:10px;text-anchor:middle}.trend-change{font-size:12px;font-weight:800;padding:5px 9px;border-radius:999px;white-space:nowrap}.trend-change.positive{color:#15803d;background:#dcfce7}.trend-change.negative{color:#b91c1c;background:#fee2e2}.trend-change.neutral{color:#475569;background:#f1f5f9}.dashboard-note{margin-top:16px}.ranking-modal-card{width:min(900px,calc(100vw - 32px))}.full-ranking-list{gap:8px}.full-ranking-list .ranking-row{font-size:13px;min-height:30px;grid-template-columns:36px minmax(90px,.7fr) minmax(100px,1.5fr) minmax(125px,.8fr) 55px}.exporting{opacity:.7;cursor:wait}.dashboard-grid:empty{display:none}
@media(max-width:1250px){.analytics-grid{grid-template-columns:1fr 1.4fr}.trend-card{grid-column:1/-1}.trend-svg{max-height:300px}}
@media(max-width:820px){.dashboard-toolbar{align-items:stretch;flex-direction:column}.dashboard-toolbar input{width:100%}.analytics-grid{grid-template-columns:1fr}.trend-card{grid-column:auto}.donut-layout{grid-template-columns:1fr}.donut-ring{width:190px}.donut-legend{grid-template-columns:1fr 1fr;max-height:none}.ranking-row{grid-template-columns:27px minmax(62px,.7fr) minmax(65px,1fr) minmax(94px,.8fr);gap:5px}.rank-percent{display:none}.analytics-card{padding:14px}.top-actions{flex-wrap:wrap;justify-content:flex-end}}
@media(max-width:520px){.donut-legend{grid-template-columns:1fr}.ranking-row{grid-template-columns:25px minmax(58px,.65fr) minmax(55px,1fr) minmax(88px,.8fr);font-size:11px}.rank-amount{font-size:10px}.analytics-heading{align-items:center}.full-ranking-list .ranking-row{grid-template-columns:28px minmax(58px,.7fr) minmax(52px,1fr) minmax(88px,.8fr)}}

.salesperson-analytics { margin-top: 18px; }
.salesperson-analytics .analytics-heading { align-items: center; flex-wrap: wrap; }
.trend-start-control { display: grid; gap: 5px; margin: 0; font-size: 12px; color: #64748b; }
.trend-start-control input { padding: 7px 10px; }
.salesperson-trend-chart { overflow-x: auto; border-radius: 8px; padding-bottom: 4px; }
.salesperson-trend-chart:focus-visible { outline: 2px solid #1687cf; outline-offset: 3px; }
.personal-trend-svg { display: block; width: 100%; height: 360px; font-variant-numeric: tabular-nums; }
.personal-trend-value { fill: #1d4ed8; font-size: 12px; font-weight: 700; text-anchor: middle; }
.personal-trend-point { fill: #fff; stroke: #2563eb; stroke-width: 3; }
.personal-trend-point:hover { fill: #dbeafe; }
.personal-trend-axis-title { fill: #475569; font-size: 12px; font-weight: 600; }
.personal-trend-axis-value { fill: #64748b; font-size: 11px; text-anchor: end; }
.boss-dashboard-toolbar { justify-content: flex-end; }
.dashboard-card-link { text-align: left; color: inherit; font: inherit; transition: border-color .15s, background-color .15s; }
.dashboard-card-link:hover { background: #f0f8ff; border-color: #8fc8ee; }
.dashboard-card-link:focus-visible { outline: 3px solid #1687cf; outline-offset: 3px; }
