:root {
  --bg:      #FAFAFA;  /* app background — near-white, neutral */
  --surface: #FFFFFF;  /* cards, headers, sheets */
  --card:    #F5F5F7;  /* nested/inset surfaces, controls */
  --border:  #E5E5EA;  /* all hairlines */
  --text:    #1C1C1E;  /* primary text — near-black */
  --muted:   #8E8E93;  /* secondary text, labels */

  --blue:    #4C7FF0;  /* Monday + informational accents */
  --teal:    #2FA89C;  /* Wednesday + warnings (deload due, stall) */
  --green:   #34C759;  /* Friday + success (progression earned, set done) */
  --indigo:  #6C63FF;  /* Home routine + charts/analysis contexts */
  --red:     #FF3B30;  /* destructive only (delete, abandon session) */

  --font-ui: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html { background: var(--bg); }
body {
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 15px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

.shell {
  max-width: 560px;
  margin: 0 auto;
  /* viewport-fit=cover (base.html) draws under the status bar / notch, so the
     top inset keeps every screen's header clear of it. One source: the header
     is the first child of .shell on all four tabs and Active Workout, and these
     headers scroll rather than stick, so padding here fixes them all. The bottom
     inset stays on the fixed .tabbar / .timer-bar / .sheet, not here. */
  padding: calc(16px + env(safe-area-inset-top)) 16px 120px;
}
.shell-wide { max-width: 760px; }

/* mono is reserved for numeric/tabular data (weights, reps, timers, counts);
   all prose, labels, buttons, and headers use Inter (--font-ui). */
.mono { font-family: var(--font-mono); }
.muted { color: var(--muted); }

.section-label {
  font-family: var(--font-ui);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
}

.sp-top { margin-top: 24px; }

/* accents */
.accent-text-blue   { color: var(--blue); }
.accent-text-teal   { color: var(--teal); }
.accent-text-green  { color: var(--green); }
.accent-text-indigo { color: var(--indigo); }

.accent-border-blue   { border-left: 3px solid var(--blue); }
.accent-border-teal   { border-left: 3px solid var(--teal); }
.accent-border-green  { border-left: 3px solid var(--green); }
.accent-border-indigo { border-left: 3px solid var(--indigo); }

.accent-blue-ctx   { --accent: var(--blue); }
.accent-teal-ctx   { --accent: var(--teal); }
.accent-green-ctx  { --accent: var(--green); }
.accent-indigo-ctx { --accent: var(--indigo); }

/* cards */
.card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 16px;
  margin-top: 12px;
  display: block;
  text-decoration: none;
  color: var(--text);
}
.card-title { font-size: 17px; font-weight: 600; }
.card-meta { font-size: 13px; margin-top: 4px; }
.card-meta a { color: var(--muted); }

/* buttons */
.btn-primary {
  display: block;
  width: 100%;
  height: 56px;
  margin-top: 16px;
  border: none;
  border-radius: 12px;
  font-family: var(--font-ui);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: #fff;
  cursor: pointer;
}
.btn-link { line-height: 56px; text-align: center; text-decoration: none; }
.accent-blue   { background: var(--blue); }
.accent-teal   { background: var(--teal); }
.accent-green  { background: var(--green); }
.accent-indigo { background: var(--indigo); }

.btn-danger {
  display: block;
  width: 100%;
  height: 56px;
  margin-top: 12px;
  background: var(--surface);
  border: 1px solid var(--red);
  border-radius: 12px;
  color: var(--red);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.06em;
  cursor: pointer;
}

/* neutral full-width confirm (reset progress): nothing destroyed, so no red */
.btn-confirm {
  display: block;
  width: 100%;
  height: 56px;
  margin-top: 12px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  color: var(--text);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.06em;
  cursor: pointer;
}
.btn-confirm:active { border-color: var(--muted); }

/* secondary/tertiary button: bordered pill with fill (never bare text) */
.btn-quiet {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 13px;
  padding: 8px 14px;
  cursor: pointer;
}
.btn-quiet:active { border-color: var(--muted); }
.btn-quiet.danger { color: var(--red); border-color: var(--red); }

/* header */
.app-header { padding: 8px 0 4px; }
.week-count { font-size: 13px; margin-top: 4px; }

/* nav */
.header-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
/* long routine/program/exercise names must wrap within the card, not push the
   chip/action off the edge. A flex child needs min-width:0 to shrink below its
   content's intrinsic width; overflow-wrap breaks the rare space-less token. */
.header-row > :first-child { min-width: 0; overflow-wrap: break-word; }
.nav-links { display: flex; gap: 8px; flex-wrap: wrap; padding-top: 2px; }
.nav-links a {
  font-size: 13px;
  color: var(--text);
  text-decoration: none;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 6px 10px;
  display: inline-flex;
  align-items: center;
}
.nav-links a:active { border-color: var(--muted); }

/* bottom tab bar — a floating glassmorphic pill (Hevy-style), four equal-width
   tabs, icon + label. NOT edge-to-edge: it floats ~16px in from both edges and
   clear of the home indicator, as a translucent frosted-glass capsule over the
   scrolling content. Active tab = --indigo (icon + label color only, no pill-
   behind-icon highlight); inactive = --muted. z-index sits BELOW the sheet
   backdrop (10) so an open bottom sheet covers it. The shell's 120px bottom
   padding lets content scroll clear. Rendered only on Home/Workout/Exercises/
   Profile (+ Finish Summary); unmounted during Active Workout and login.
   backdrop-filter needs BOTH the -webkit- prefix (iOS Safari/PWA) and the
   unprefixed property — do not drop either. */
.tabbar {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: calc(env(safe-area-inset-bottom) + 14px);
  width: calc(100% - 32px);
  max-width: 460px;
  z-index: 5;
  border-radius: 30px;
  background: rgba(255, 255, 255, 0.75);
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.4);
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
}
.tabbar-inner {
  display: flex;
}
.tab {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  min-height: 56px;
  padding: 8px 0;
  color: var(--muted);
  text-decoration: none;
  font-family: var(--font-ui);
  font-size: 11px;
  letter-spacing: 0.04em;
}
.tab svg { width: 22px; height: 22px; }
.tab.is-active { color: var(--indigo); }

/* minimized-session bar (item 20) — a mini-player strip riding directly above
   the tab pill. Same glass recipe as .tabbar (including the required -webkit-
   prefix) and the same width/centering, so the two read as one floating unit
   rather than two competing elements. Sits at the tab bar's z-index, still
   below the sheet backdrop (10). Its bottom offset is the tab bar's own offset
   plus the pill's height (58px incl. border) plus an 8px gap. */
.minibar {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: calc(env(safe-area-inset-bottom) + 14px + 58px + 8px);
  width: calc(100% - 32px);
  max-width: 460px;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 52px;
  padding: 8px 16px;
  border-radius: 26px;
  background: rgba(255, 255, 255, 0.75);
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.4);
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
  color: var(--text);
  text-decoration: none;
}
/* The day accent reads as a left edge, matching the routine cards it came from.
   accent-border-* can't do it here: its border-left would be overridden by the
   glass `border` shorthand above, and a square 3px border sits badly inside a
   26px pill. An inset shadow follows the rounded edge instead, coloured by the
   --accent that accent-*-ctx sets. */
.minibar { box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08), inset 3px 0 0 var(--accent); }
.minibar-text { min-width: 0; }
.minibar-name {
  font-family: var(--font-ui);
  font-size: 14px;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.minibar-meta { font-size: 12px; margin-top: 1px; }
.minibar.resting .minibar-meta { color: var(--text); }
.minibar-resume {
  flex: none;
  font-size: 12px;
  color: var(--indigo);
  letter-spacing: 0.04em;
}
/* with the mini-bar present, content needs to clear both floating elements */
body.with-minibar .shell { padding-bottom: 180px; }

/* exercises search */
.search-row { display: flex; gap: 8px; margin: 12px 0 4px; }
.search-input { flex: 1; height: 44px; font-size: 15px; }

/* routines + import */
.notice {
  font-size: 13px;
  color: var(--green);
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface);
  padding: 10px 12px;
  margin-top: 12px;
}
.routine-lines { margin-top: 8px; font-size: 13px; }
.routine-line {
  display: flex;
  justify-content: space-between;
  /* wrap so a long name doesn't crush the action group into a one-char-per-line
     column: when name + actions won't fit, the action group drops to the next
     line and the name gets a full-width line to wrap at spaces within the card */
  flex-wrap: wrap;
  gap: 4px 12px;
  padding: 4px 0;
  border-bottom: 1px solid var(--border);
}
.routine-line:last-child { border-bottom: none; }
.routine-line { align-items: center; }
/* name grows to fill the line and wraps; the action group keeps its size */
.routine-line > :first-child { flex: 1 1 auto; min-width: 0; overflow-wrap: break-word; }
.routine-line-right { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
/* tapping a routine name opens its read-only preview (BACKLOG item 14) */
.routine-line-link { color: var(--text); text-decoration: none; }
.routine-line-link:active { color: var(--muted); }
/* the quick-start card's tap area for preview, kept distinct from its START btn */
.routine-card-link { display: block; text-decoration: none; color: inherit; }

/* routine preview screen */
.preview-row { margin-top: 8px; }
.preview-name { font-size: 16px; }
.preview-primary {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  flex-shrink: 0;
}
.preview-start { margin-top: 20px; }
.preview-note { text-align: center; margin-top: 8px; }
.import-box {
  width: 100%;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--text);
  font-size: 13px;
  padding: 12px;
  resize: vertical;
  outline: none;
}
.import-box:focus { border-color: var(--indigo); }
.import-errors { color: var(--red); font-size: 13px; margin-top: 8px; }
.import-create { color: var(--green); }
.import-replace { color: var(--teal); }
.import-archive { color: var(--red); }
/* active/archived view toggle — segmented control, same chrome as buttons */
.view-tabs {
  display: flex;
  gap: 8px;
  margin-top: 12px;
}
.view-tab {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--muted);
  font-family: var(--font-ui);
  font-size: 13px;
  letter-spacing: 0.04em;
  text-decoration: none;
}
.view-tab.is-active {
  color: var(--indigo);
  border-color: var(--indigo);
}

.program-card.program-active { border-color: var(--indigo); }
.week-label { margin-top: 12px; }
.import-primary {
  font-size: 11px;
  color: var(--muted);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 1px 6px;
}
.cancel-link { display: flex; width: 100%; margin-top: 8px; }

/* progression + deload */
.chip {
  font-size: 12px;
  border-radius: 8px;
  padding: 2px 8px;
  white-space: nowrap;
  align-self: flex-start;
}
.chip-progress { color: var(--green); border: 1px solid var(--green); }
.chip-stall { color: var(--teal); border: 1px solid var(--teal); }
.deload-banner { border-color: var(--teal); }

/* small inline action / video-link chip: bordered pill with fill */
.link-chip {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 6px 12px;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 13px;
  text-decoration: none;
  cursor: pointer;
}
.link-chip:active { border-color: var(--muted); }
.exercise-actions { display: flex; gap: 8px; margin-top: 12px; }
.reset-note { margin-top: 8px; }

.skipped-note { margin-top: 12px; }

.sub-new { display: flex; gap: 8px; margin-top: 12px; align-items: center; }
.sub-new-input { flex: 1; height: 44px; font-size: 15px; }
.sub-meta { font-size: 12px; }
.sub-section { margin-top: 4px; }
.sub-btn { display: flex; width: 100%; margin-top: 12px; }
.sub-card { text-align: left; }
.sub-card .sub-meta { display: inline-block; margin-top: 2px; }
.sub-demo { flex: none; align-self: center; margin-left: 12px; }

/* login */
.login-wrap { padding-top: 30vh; }
.login-form { margin-top: 12px; }
.secret-input {
  width: 100%;
  height: 52px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  color: var(--text);
  font-size: 16px;
  padding: 0 16px;
  outline: none;
}
.secret-input:focus { border-color: var(--indigo); }
.login-error { color: var(--red); font-size: 13px; margin-top: 8px; }

/* automation tokens (settings) */
.token-list { margin-top: 12px; }
.token-reveal {
  margin-top: 12px;
  padding: 12px;
  background: var(--card);
  border: 1px solid var(--green);
  border-radius: 8px;
}
.token-value {
  margin-top: 6px;
  font-size: 13px;
  word-break: break-all;
  color: var(--text);
}

/* workout */
.workout-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 12px 16px;
}

.exercise-panel {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 16px;
  margin-top: 12px;
}
/* the title block flexes; min-width:0 lets a long routine name ellipsize rather
   than pushing the minimize/list buttons off the header */
.workout-title { flex: 1; min-width: 0; }
/* minimize chevron (item 20): square target, same chrome as the other quiet
   buttons so it reads as tappable per item 3 */
.minimize-btn {
  flex: none;
  width: 44px;
  min-height: 44px;
  padding: 0;
}
.minimize-btn svg { width: 20px; height: 20px; }

.exercise-name { font-size: 19px; font-weight: 600; }
.exercise-cue { color: var(--muted); font-size: 13px; margin-top: 4px; }
.exercise-target {
  font-family: var(--font-mono);
  font-size: 13px;
  color: var(--muted);
  margin-top: 8px;
}
.exercise-target a { color: var(--muted); }

.done-sets { margin-top: 12px; }
.done-set {
  display: flex;
  justify-content: space-between;
  font-family: var(--font-mono);
  font-size: 14px;
  padding: 8px 12px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 8px;
  margin-top: 6px;
}
.done-set .check { color: var(--green); }
/* a completed set is a button when its type has something to correct (item 18);
   .done-set already carries the border + fill item 3 requires of anything
   tappable, so it only needs the button element's own styling neutralised */
button.done-set {
  width: 100%;
  align-items: center;
  color: var(--text);
  cursor: pointer;
  text-align: left;
}
button.done-set:active { border-color: var(--muted); }
.done-set .edit-tag { font-family: var(--font-ui); font-size: 12px; color: var(--muted); }

.current-set { margin-top: 16px; }
.current-set-label { margin-bottom: 8px; }

.last-line {
  font-family: var(--font-mono);
  font-size: 14px;
  color: var(--text);
  text-align: center;
  margin: 6px 0 2px;
}
.last-line .last-tag {
  font-family: var(--font-ui);
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-right: 6px;
}

.big-value {
  font-family: var(--font-mono);
  font-size: 26px;
  font-weight: 500;
  text-align: center;
  padding: 8px 0 4px;
}
.big-value .big-sep { color: var(--muted); margin: 0 2px; }
.unit-chip {
  display: inline-block;
  font-size: 14px;
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 6px 10px;
  margin-left: 8px;
  vertical-align: middle;
  cursor: pointer;
  background: var(--card);
  font-family: var(--font-mono);
}

.steppers { display: flex; gap: 12px; margin-top: 12px; }
.stepper {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 4px;
}
.stepper-btn {
  width: 52px;
  height: 52px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--text);
  font-family: var(--font-mono);
  font-size: 18px;
  cursor: pointer;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
}
.stepper-value {
  font-family: var(--font-mono);
  font-size: 16px;
  text-align: center;
  flex: 1;
}
.stepper-label {
  font-family: var(--font-ui);
  font-size: 11px;
  color: var(--muted);
  text-align: center;
  margin-top: 4px;
}

/* timer bar — pinned to the bottom of Active Workout. On the light UI the
   progress line is thickened to 4px and sits in a light --border track so the
   draining accent fill stays legible (a 2px hairline that read on near-black
   does not read on white). */
.timer-bar {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  background: var(--surface);
  border-top: 1px solid var(--border);
  padding-bottom: env(safe-area-inset-bottom);
}
.timer-line { height: 4px; background: var(--border); }
.timer-line-fill { height: 4px; background: var(--accent, var(--blue)); width: 100%; }
.timer-row {
  max-width: 560px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  padding: 10px 16px;
  gap: 12px;
}
.timer-count { font-family: var(--font-mono); font-size: 24px; font-weight: 500; }
.timer-label { font-size: 13px; flex: 1; }
.timer-row .btn-quiet { min-height: 36px; padding: 6px 12px; }
.timer-bar.done .timer-line-fill { background: var(--green); }
/* "rest done" uses --text, not green: #34C759 as text on white is too faint —
   the green signal lives in the fill line and the flash instead. */
.timer-bar.done .timer-count { color: var(--text); }

/* sheets */
.sheet-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
  z-index: 10;
}
.sheet {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 11;
  max-width: 560px;
  margin: 0 auto;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px 12px 0 0;
  padding: 8px 16px calc(24px + env(safe-area-inset-bottom));
  transform: translateY(0);
}
.sheet-handle {
  width: 36px;
  height: 4px;
  border-radius: 2px;
  background: var(--border);
  margin: 4px auto 12px;
}
.jump-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 12px;
  margin-top: 8px;
  color: var(--text);
  font-size: 15px;
  cursor: pointer;
  text-align: left;
}
.jump-row .mono { font-size: 13px; }
.jump-row.current { border-color: var(--accent, var(--blue)); }
.jump-row .done { color: var(--green); }
.sheet-finish { margin-top: 16px; }

/* summary */
.summary-stats { display: flex; gap: 24px; font-size: 14px; flex-wrap: wrap; }
.summary-stats .muted { margin-right: 6px; }
.unit-suffix { font-size: 11px; }

@media (prefers-reduced-motion: no-preference) {
  .sheet { animation: sheet-in 200ms ease; }
  @keyframes sheet-in {
    from { transform: translateY(100%); }
    to   { transform: translateY(0); }
  }
  .reveal { animation: reveal 250ms ease; }
  @keyframes reveal {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
  }
  .timer-bar.done .timer-row { animation: flash 400ms ease; }
  @keyframes flash {
    0% { background: rgba(52, 199, 89, 0.18); }
    100% { background: transparent; }
  }
}

/* charts */
.chart-card { padding-bottom: 8px; }
.chart { display: block; margin-top: 12px; overflow: visible; }
.chart-axis { stroke: var(--border); stroke-width: 1; }
.chart-line { stroke: var(--indigo); stroke-width: 2.5; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.chart-deload { stroke: var(--muted); stroke-dasharray: 4 4; }
.chart-pr { fill: var(--indigo); }
.chart-label { fill: var(--muted); font-family: var(--font-mono); font-size: 11px; }
.chart-legend { font-size: 11px; margin-top: 4px; }

/* home v2 (item 21) — completion calendar, stat tiles, volume headline.
   The old .progress-stats text row these replace is gone; nothing else used it. */

/* completion calendar: a weekday header over one row of day cells per week.
   A completed day is filled with its routine's day accent (--accent, set by
   accent-*-ctx) so the grid speaks the same colour language as the routine
   cards; everything else is an empty --card cell. */
.cal { display: flex; flex-direction: column; gap: 6px; }
.cal-row { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
.cal-day { font-size: 11px; text-align: center; }
.cal-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1;
  border-radius: 8px;
  background: var(--card);
  border: 1px solid var(--border);
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--muted);
}
.cal-cell.is-done {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}
/* days that haven't happened yet read as absent, not as missed sessions */
.cal-cell.is-future { opacity: 0.4; }
/* today is outlined rather than filled, so it never reads as "completed" */
.cal-cell.is-today { border-color: var(--text); color: var(--text); }
.cal-cell.is-today.is-done { border-color: var(--text); color: #fff; }

/* the session's headline tonnage, sitting above its own chart */
.volume-latest { font-size: 24px; font-weight: 500; }
.volume-unit { font-size: 13px; color: var(--muted); }

/* four stat tiles: the number is the point, the label explains it */
.stat-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.stat-tile { margin-top: 0; text-align: center; }
.stat-value { font-size: 26px; font-weight: 500; line-height: 1.1; }
.stat-label { font-size: 11px; margin-top: 4px; }

/* progress + exercise detail */
.lift-row { text-decoration: none; color: var(--text); }
.lift-name { font-size: 16px; }
.history-row { margin-top: 8px; }
/* per-set cells in Exercise Detail history: each is its own tap target so a set
   from a past workout can be corrected (item 18). Bordered + filled per item 3;
   the static variant (a 'none'-type set, nothing to edit) drops the chrome so it
   doesn't read as tappable. */
.history-sets { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.set-chip {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 6px 12px;
  color: var(--text);
  font-size: 14px;
  cursor: pointer;
}
.set-chip:active { border-color: var(--muted); }
.set-chip.is-static {
  background: none;
  border-color: transparent;
  color: var(--muted);
  padding-left: 0;
  cursor: default;
}
.audit-note { margin-top: 4px; color: var(--teal); }