body .overview-charts{display:grid;grid-template-columns:1fr;gap:24px}
body .overview-charts>.card{margin:0;min-width:0}
.weekly-arrows-card,.performance-action-card{min-width:0}
.weekly-arrow-donut{position:relative;width:min(150px,100%);aspect-ratio:1;margin:8px auto}
.weekly-arrow-donut svg{width:100%;height:100%;display:block}
.weekly-arrow-donut circle{fill:none;stroke-width:9}
.weekly-arrow-donut .ring-track{stroke:var(--soft)}
.weekly-arrow-donut .ring-fill{stroke:var(--green);stroke-linecap:round}
.weekly-arrow-donut>div{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column}
.weekly-arrow-donut strong{font-size:25px;line-height:1.2;font-variant-numeric:tabular-nums}
.weekly-arrow-donut small{font-size:11px;color:var(--muted);margin-top:4px}
.performance-mini-label{display:block;font-size:11px;color:var(--muted);margin:10px 0}
.performance-mini-label select{display:block;width:100%;margin-top:4px;min-width:0;max-width:100%;font-size:12px;padding:7px}
.performance-action-card [data-open-performance]{margin-top:12px;font-size:12px;padding:8px 10px}
.performance-controls{display:flex;flex-wrap:wrap;align-items:end;gap:18px;margin-bottom:20px}
.performance-controls label{display:flex;flex-direction:column;gap:6px;font-size:12px;color:var(--muted)}
.performance-periods,.performance-date{display:flex;align-items:end;gap:6px;flex-wrap:wrap}
.performance-periods button{min-height:40px}
.performance-controls select,.performance-controls input{min-height:40px;max-width:100%;min-width:0}
body .performance-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
.performance-trend{margin:24px 0}
.performance-trend svg{width:100%;height:auto;display:block;color:var(--muted)}
@media(max-width:600px){.performance-controls{gap:14px;padding:18px}.performance-controls>label,.performance-date{width:100%}.performance-date label{flex:1}.performance-date input{width:100%}body .performance-stats{grid-template-columns:1fr 1fr}.performance-stats>.card:first-child{grid-column:1/-1}.performance-trend{padding:18px}.performance-trend h2{font-size:18px}}

.performance-point-label{paint-order:stroke;stroke:var(--panel);stroke-width:3px;stroke-linejoin:round}
.performance-breakdown{margin:24px 0}
.performance-breakdown>summary{cursor:pointer;font-weight:600;min-height:28px}
.performance-score-list>div{display:grid;grid-template-columns:140px 1fr auto;gap:12px;padding:12px 0;border-top:1px solid var(--line);align-items:center;font-size:13px}
.performance-score-list small{display:block;color:var(--muted);margin-top:3px}
@media(max-width:600px){.performance-score-list>div{grid-template-columns:1fr auto;gap:6px}.performance-score-list time{grid-column:1/-1}.performance-score-list b{font-size:12px}}

.performance-score-list>div>span{min-width:0;overflow-wrap:anywhere}
.performance-score-list b{white-space:nowrap}

.overview-secondary-metric{border-top:1px solid var(--line);padding-top:16px;margin-top:16px}
.overview-duo-card .overview-secondary-metric .stat-value{margin-top:6px}

.performance-trend{--performance-competition:#2878d0}
body.dark .performance-trend{--performance-competition:#86baff}
.performance-chart-key{display:flex;flex-wrap:wrap;gap:8px 18px;margin:8px 0;font-size:12px;color:var(--muted)}
.performance-chart-key span{display:inline-flex;align-items:center;gap:7px}
.performance-chart-key i{display:inline-block;width:9px;height:9px;border-radius:50%;flex-shrink:0}
.performance-simulation-dot{background:var(--green)}
.performance-competition-dot{background:var(--performance-competition)}

/* Keep date navigation on one line at phone widths, with Today on its own row. */
@media(max-width:600px){
 body .performance-date{display:grid;grid-template-columns:44px minmax(0,144px) 44px;justify-content:start;align-items:end;gap:8px 6px;min-width:0;max-width:100%}
 body .performance-date>label{min-width:0;width:100%;margin:0}
 body .performance-date input{box-sizing:border-box;width:144px;min-width:0;max-width:100%;height:44px;min-height:44px;margin:0;padding:8px 6px;font-size:16px;line-height:1.2;-webkit-appearance:none;appearance:none;overflow:hidden}
 body .performance-date>[data-performance-shift]{box-sizing:border-box;width:44px;min-width:44px;height:44px;min-height:44px;margin:0;padding:0;align-self:end}
 body .performance-date>#performance-today{grid-column:1/-1;justify-self:start;margin:0}
}

@media(max-width:600px){body .performance-date input::-webkit-date-and-time-value{min-width:0;text-align:center}body .performance-date input::-webkit-calendar-picker-indicator{margin:0;padding:0;width:14px;height:14px}}
@media(max-width:340px){body .performance-date{grid-template-columns:44px minmax(0,128px) 44px}body .performance-date input{width:128px;padding-inline:4px}}
