.content-metrics {padding:16px;border:1px solid var(--border,#718096);border-radius:12px;margin:12px 16px;background:var(--panel-bg,transparent);font-size:14px}
.content-metrics small,.content-metrics-person small {display:block;font-size:12px;line-height:1.4}
.content-metrics-top {display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;align-items:center}
.content-metrics-total {display:block;font-size:28px;color:var(--accent,#70b4ff)}
.content-metrics-controls {display:flex;flex-wrap:wrap;gap:8px;align-items:end}
.content-metrics-controls label {display:grid;gap:4px}
#content-metrics-month[aria-pressed="true"] {border-color:var(--accent,#70b4ff);color:var(--accent,#70b4ff)}
.content-metrics-leaders {display:flex;flex-wrap:wrap;gap:12px;margin-top:12px}
.content-metrics h3 {font-size:14px;margin:0 0 4px}
.content-metrics-winner {display:block;line-height:1.4;overflow-wrap:anywhere;color:var(--accent,#70b4ff)}
.content-metrics-empty {font-size:12px;opacity:.75;display:block}
.content-metrics-person {display:grid;gap:8px;margin:10px 0 0;padding-top:8px;border-top:1px solid var(--border,#718096);text-align:left;white-space:normal;font-size:13px}
.content-metrics-person-total {display:flex;align-items:center;justify-content:space-between;gap:8px}
.content-metrics-value {display:block;max-width:100%;text-align:left;white-space:normal;padding:0;background:none;border:0;color:var(--accent,#70b4ff);font-size:18px;font-weight:700}
.content-metrics-day {display:block;margin:6px 3px;padding:5px;max-width:calc(100% - 6px);white-space:normal;font-size:12px;line-height:1.35;border:1px solid var(--border,#718096);border-radius:6px;background:transparent;color:var(--accent,#70b4ff)}
.calendar .content-metrics-selected-day {box-shadow:inset 2px 0 var(--accent,#70b4ff),inset -2px 0 var(--accent,#70b4ff)}
.calendar th.content-metrics-selected-day {color:var(--accent,#70b4ff)}
.content-metrics-details>div {display:grid;grid-template-columns:1fr auto;gap:8px;padding:10px 0;border-bottom:1px solid var(--border,#718096)}
@media(max-width:600px) {.content-metrics {margin:10px 8px;padding:12px}.content-metrics-controls{width:100%}.content-metrics-controls label{min-width:0;flex:1}.content-metrics-controls input,.content-metrics-controls select{max-width:100%;min-width:0;width:100%}}
