/* S05 기록·통계 — semantic 토큰만, .st- 접두사만 (mockup/screens-more.css 통계 블록 기준) */
.st-stack { display: grid; gap: var(--stack-gap); }
.st-num { font-variant-numeric: tabular-nums; }
.st-plus { color: var(--color-primary-text); font-weight: var(--font-weight-bold); font-variant-numeric: tabular-nums; }
.st-minus { color: var(--color-text-sub); font-weight: var(--font-weight-bold); font-variant-numeric: tabular-nums; }
.st-ellipsis { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* 주차별 막대 차트 (라이브러리 없이 CSS) */
.st-chart { display: flex; align-items: flex-end; gap: var(--space-2); height: 168px; padding-top: var(--space-5); border-bottom: var(--border-width) solid var(--color-border-strong); }
.st-bar { flex: 1; min-width: 0; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; }
.st-bar__stack { width: 100%; max-width: 28px; display: flex; flex-direction: column-reverse; border-radius: var(--radius-xs) var(--radius-xs) 0 0; overflow: hidden; }
.st-bar__done { background: var(--color-done); }
.st-bar__late { background: var(--color-late); }
.st-bar__pct { font-size: var(--font-size-2xs); font-weight: var(--font-weight-bold); color: var(--color-text-sub); font-variant-numeric: tabular-nums; margin-bottom: 2px; white-space: nowrap; }
.st-bar--current .st-bar__stack { outline: var(--border-width-strong) dashed var(--color-border-control); outline-offset: 1px; }
.st-chart-x { display: flex; gap: var(--space-2); margin-top: var(--space-1); }
.st-chart-x span { flex: 1; min-width: 0; text-align: center; font-size: var(--font-size-2xs); color: var(--color-text-sub); font-variant-numeric: tabular-nums; white-space: nowrap; overflow: visible; }
.st-legend { display: flex; flex-wrap: wrap; gap: var(--space-3); font-size: var(--font-size-xs); color: var(--color-text-sub); margin-top: var(--space-2); }
.st-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: var(--space-1); vertical-align: -1px; }
.st-legend .st-swatch-done { background: var(--color-done); }
.st-legend .st-swatch-late { background: var(--color-late); }
/* 막대가 많으면(전체 기간) % 라벨이 겹치므로 숨긴다 — 값은 aria-label에 있다 */
.st-chart:has(> .st-bar:nth-child(13)) .st-bar__pct { visibility: hidden; }

/* 리스트 행 */
.st-li { display: flex; align-items: center; gap: var(--space-3); min-height: 48px; padding: var(--space-2) var(--space-4); }
.st-li--link { color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; }
.st-li--link:active { background: var(--color-surface-sunken); }
.st-li__main { flex: 1; min-width: 0; }
.st-li__title { font-weight: var(--font-weight-semibold); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.st-li__meta { font-size: var(--font-size-xs); color: var(--color-text-sub); font-variant-numeric: tabular-nums; }
.st-li__trail { flex: none; text-align: right; font-variant-numeric: tabular-nums; }