:root {
  --bg:#f7f8fb; --panel:#fff; --ink:#172033; --muted:#6b7280; --accent:#1d4ed8; --border:#e5e7eb; --warn:#fff7ed; --danger:#b91c1c;
  /* Phase-pattern colors, ported from course_tracker_integrated_mock.html's
     --cruise/--growth/--health/--event onto this app's own palette -- see
     PatternPhase.color_key. */
  --phase-cruise:#dce5ee; --phase-cruise-ink:#35546e;
  --phase-growth:#dbe7d7; --phase-growth-ink:#2f5d3a;
  --phase-health:#f3e5cc; --phase-health-ink:#8a5a17;
  --phase-event:#f6dca0; --phase-event-ink:#8a5a17;
  --phase-other:#e5e7eb; --phase-other-ink:#374151;
  /* Reserved status colors (dataviz skill's validated palette) -- never reused
     for series/categorical color, only for a badge's meaning. See lab_trends. */
  --status-good:#0ca30c; --status-warning:#fab219; --status-serious:#ec835a; --status-critical:#d03b3b;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin:0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; background:var(--bg); color:var(--ink); }
a { color:var(--accent); text-decoration:none; }
.topbar { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1rem 1.5rem; background:#0f172a; color:#fff; position:sticky; top:0; z-index:20; }
.topbar a { color:#fff; opacity:.92; margin-right:.8rem; }
.subbar { display:flex; align-items:center; gap:1.25rem; flex-wrap:nowrap; overflow-x:auto; padding:.5rem 1.5rem; background:#e2e8f0; border-bottom:1px solid var(--border); }
.athlete-picker { display:flex; align-items:center; gap:.5rem; flex:none; white-space:nowrap; }
.subbar-divider { width:1px; height:1.4rem; background:var(--border); flex:none; }
.topbar .athlete-picker .muted { color:#cbd5e1; }
.subbar .athlete-picker .muted { color:var(--muted); }
.brand { font-weight:800; font-size:1.1rem; }
.container { max-width:1180px; margin:0 auto; padding:1.25rem; }
.notice { background:#eef2ff; border:1px solid #c7d2fe; border-radius:12px; padding:.85rem 1rem; color:#3730a3; margin-bottom:1rem; }
h1 { margin:1rem 0; }
h2 { margin-top:0; }
.grid { display:grid; gap:1rem; }
.cards { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
.two { grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); margin-top:1rem; }
.card, .panel, .form-card { background:var(--panel); border:1px solid var(--border); border-radius:16px; padding:1rem; box-shadow: 0 1px 2px rgba(15,23,42,.04); }
.card strong { display:block; font-size:1.6rem; margin-top:.35rem; }
.label, small { color:var(--muted); }
.warn { background:var(--warn); border-color:#fed7aa; }
.actions { display:flex; gap:.7rem; flex-wrap:wrap; margin:1rem 0; }
.button { display:inline-block; background:var(--accent); color:#fff; border:0; border-radius:10px; padding:.65rem .9rem; font-weight:700; cursor:pointer; }
.button.secondary { background:#64748b; }
.button.danger { background:var(--danger); }
.heading-row { display:flex; justify-content:space-between; align-items:center; gap:1rem; margin-top:2rem; }
.heading-row:first-of-type { margin-top:0; }
.table-wrap { overflow:auto; background:#fff; border-radius:14px; border:1px solid var(--border); margin-bottom:1rem; }
.section-heading { margin-top:1.5rem; }
.section-heading:first-of-type { margin-top:0; }
table { width:100%; border-collapse:collapse; }
th, td { padding:.75rem; border-bottom:1px solid var(--border); text-align:left; white-space:nowrap; }
td.wrap-cell { white-space:normal; min-width:16rem; }
td.wrap-cell .pill { margin:.15rem .35rem .15rem 0; }
th { background:#f1f5f9; font-size:.85rem; text-transform:uppercase; letter-spacing:.03em; }
.row-actions { text-align:right; }
.clean { padding-left:1rem; }
.clean li { margin:.45rem 0; }
.pill { display:inline-block; margin-left:.5rem; padding:.15rem .45rem; border-radius:999px; background:#e0f2fe; font-size:.78rem; }
.field { margin-bottom:.9rem; }
.field label { display:block; font-weight:700; margin-bottom:.3rem; }
.input { width:100%; padding:.65rem; border:1px solid #cbd5e1; border-radius:10px; font:inherit; background:#fff; }
.checkbox { transform: scale(1.2); margin:.5rem; }
.error { color:var(--danger); font-size:.9rem; }
.pagination { color:var(--muted); }
@media (max-width: 760px) { .topbar { display:block; } .topbar nav { margin-top:.75rem; line-height:2; } }
.muted { color: var(--muted); }
.compact { margin:0; }
.plan-grid { display:grid; gap:1rem; }
.plan-day h2 { margin-bottom:.25rem; }
.compact-table th, .compact-table td { white-space:normal; padding:.55rem; }
.workout-plan { margin-bottom:1.25rem; }
.day-buttons { display:flex; gap:.6rem; flex-wrap:wrap; margin:.75rem 0; }
.day-panel { margin-top:1rem; padding-top:1rem; border-top:1px solid var(--border); }
.day-panel h3 { margin-top:0; }
.exercise-card { margin-bottom:1rem; }
.exercise-card .set-rows { margin:.75rem 0; }
.exercise-card .set-rows input { width:90px; }
.rest-timer { display:flex; align-items:center; gap:.5rem; flex:none; }
.rest-timer-display { font-variant-numeric:tabular-nums; font-weight:700; min-width:3.2rem; text-align:center; }
.pill.success { background:#dcfce7; color:#166534; }
.progress-wrap { display:flex; align-items:center; gap:.75rem; margin-bottom:1rem; }
.progress-bar { flex:1; height:.6rem; border-radius:999px; background:#e5e7eb; overflow:hidden; }
.progress-fill { height:100%; background:var(--accent); width:0; transition:width .2s ease; }
.exercise-card.folded .set-rows, .exercise-card.folded .add-set-row { display:none; }
.set-rows tbody tr.row-complete { opacity:.55; }
.set-rows .set-goal-label { font-size:.75rem; margin-top:.2rem; }
.weight-unit-toggle { display:inline; background:none; border:0; padding:0; margin:0; color:var(--accent); font:inherit; font-weight:700; letter-spacing:inherit; text-transform:none; cursor:pointer; text-decoration:underline; text-underline-offset:.15em; }
.weight-unit-toggle:hover { color:#1e3a8a; }
.set-rows .info-row td { background:#f8fafc; padding:.6rem .75rem; }
.set-rows .info-content { font-size:.85rem; line-height:1.5; }
.set-rows .info-content strong { display:block; margin-bottom:.3rem; }
dialog#timer-dialog { border:1px solid var(--border); border-radius:14px; padding:1.1rem; max-width:340px; }
dialog#timer-dialog::backdrop { background:rgba(15,23,42,.4); }
.timer-options { display:flex; gap:.5rem; flex-wrap:wrap; margin:.5rem 0; }
.chart-card { background:var(--panel); border:1px solid var(--border); border-radius:16px; padding:1.1rem; margin-bottom:1rem; }
.chart-group { margin-top:.9rem; }
.chart-group-label { font-size:.75rem; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); font-weight:700; margin-bottom:.45rem; }
.chart-toggles { display:flex; flex-wrap:wrap; gap:.5rem; }
.chart-chip { display:inline-flex; align-items:center; gap:.45rem; font-size:.85rem; padding:.35rem .7rem; border-radius:999px; border:1px solid var(--border); background:#fff; cursor:pointer; transition:background .12s ease, border-color .12s ease; }
.chart-chip input { margin:0; }
.chart-chip .swatch { width:.65rem; height:.65rem; border-radius:50%; display:inline-block; background:var(--metric-color, var(--accent)); }
.chart-chip.active { border-color:var(--metric-color, var(--accent)); background:color-mix(in srgb, var(--metric-color, var(--accent)) 12%, white); }
.chart-canvas-wrap { position:relative; margin-top:1.1rem; }
#daily-trend-chart { width:100%; height:auto; display:block; }
.chart-tooltip { position:absolute; top:0; left:0; transform:translate(-9999px, -9999px); pointer-events:none; background:#0f172a; color:#fff; border-radius:10px; padding:.55rem .7rem; font-size:.78rem; line-height:1.5; box-shadow:0 4px 14px rgba(15,23,42,.18); white-space:nowrap; z-index:1; }
.chart-tooltip strong { display:block; font-size:.78rem; margin-bottom:.2rem; color:#fff; }
.chart-tooltip .row { display:flex; align-items:center; gap:.4rem; }
.chart-tooltip .dot { width:.55rem; height:.55rem; border-radius:50%; display:inline-block; flex:none; }
.calendar-wrap { overflow:auto; background:#fff; border:1px solid var(--border); border-radius:16px; }
.week-grid { min-width:1400px; border-collapse:collapse; }
.week-grid th, .week-grid td { text-align:center; white-space:nowrap; padding:.4rem .5rem; border-bottom:1px solid var(--border); border-right:1px solid var(--border); }
.week-grid .meta-row th { background:#f1f5f9; font-size:.75rem; color:var(--muted); font-weight:600; }
.week-grid .year-row th { background:#0f172a; color:#fff; font-weight:700; }
.week-grid .course-col { position:sticky; left:0; z-index:2; background:#f8fafc; text-align:left; min-width:220px; }
.week-grid thead .course-col { z-index:3; }
.week-grid .current-week { background:#eef2ff; }
.week-grid .current-day { background:#eef2ff; }
.week-grid.year-grid { min-width:0; }
.week-grid.year-grid th, .week-grid.year-grid td { text-align:left; white-space:normal; }
.dose-row { display:flex; align-items:center; gap:.5rem; margin-bottom:.3rem; }
.dose-row .tick-label { display:inline-flex; align-items:center; gap:.3rem; cursor:pointer; }
.inline-form { display:inline; }
.week-grid .amount-input { width:60px; text-align:center; border:1px solid transparent; border-radius:6px; background:transparent; padding:.2rem; font:inherit; }
.week-grid .amount-input:hover { border-color:var(--border); }
.week-grid .amount-input:focus { border-color:var(--accent); background:#fff; outline:none; }
.week-grid .amount-input.saving { opacity:.5; }
.inline-form { display:inline-flex; align-items:center; gap:.4rem; margin-right:.5rem; }
.inline-form select { width:auto; }
.topbar-user { display:flex; align-items:center; gap:.75rem; flex:none; }
.topbar-user a { color:#fff; opacity:.92; }
.topbar-user form { margin:0; }
.notice.success { background:#ecfdf5; border-color:#a7f3d0; color:#065f46; }
.notice.error { background:#fef2f2; border-color:#fecaca; color:#991b1b; }
.markdown-preview-btn { margin-top:.4rem; }
.execution-toggle { display:inline; background:none; border:0; padding:0; margin:0; color:var(--accent); font:inherit; font-weight:700; cursor:pointer; }
.execution-toggle:hover { color:#1e3a8a; }
.execution-notes-row td { white-space:normal; background:#f8fafc; }
.execution-notes-panel { margin:.5rem 0 .15rem; padding:.7rem .85rem; background:#f8fafc; border:1px solid var(--border); border-radius:10px; }
.split-editor-toolbar { display:flex; flex-wrap:wrap; gap:.75rem 1.25rem; align-items:flex-end; margin:1rem 0; }
.split-editor .inline-form .input { width:auto; min-width:12rem; }
.split-editor .input-compact { width:4.6rem; padding:.4rem .45rem; }
.split-editor .notes-input { width:12rem; min-width:8rem; padding:.4rem .45rem; }
.split-editor .day-title-edit { display:flex; align-items:center; gap:.6rem; }
.split-editor .day-name-input { width:14rem; font-weight:700; }
.split-editor .add-exercise-form { margin-top:.75rem; }
.split-editor .exercise-combobox { position:relative; min-width:18rem; }
.split-editor .exercise-combobox-field { position:relative; }
.split-editor .add-exercise-form .exercise-search { min-width:18rem; width:18rem; padding-right:2.3rem; }
.split-editor .exercise-caret { position:absolute; right:0; top:0; bottom:0; width:2.3rem; border:0; background:transparent; cursor:pointer; }
.split-editor .exercise-caret::after { content:""; display:block; width:0; height:0; margin:0 auto; border-left:5px solid transparent; border-right:5px solid transparent; border-top:6px solid #64748b; }
.split-editor .exercise-combobox.open .exercise-search { border-color:var(--accent); border-bottom-left-radius:0; border-bottom-right-radius:0; }
.split-editor .exercise-combobox.open .exercise-caret::after { border-top:0; border-bottom:6px solid #64748b; }
.split-editor .exercise-menu { position:absolute; left:0; right:0; top:100%; z-index:5; margin:0; padding:.2rem 0; list-style:none; background:#fff; border:1px solid var(--accent); border-top:0; border-radius:0 0 10px 10px; box-shadow:0 8px 24px rgba(15,23,42,.12); max-height:16rem; overflow:auto; }
.split-editor .exercise-menu li { padding:.45rem .75rem; cursor:pointer; }
.split-editor .exercise-menu li:hover,
.split-editor .exercise-menu li.active { background:#eef2ff; }
.split-editor .exercise-menu .empty { color:var(--muted); cursor:default; }
.split-editor .drag-handle { cursor:grab; color:var(--muted); font-size:1.1rem; letter-spacing:-.15em; user-select:none; }
.split-editor .drag-handle:active { cursor:grabbing; }
.split-editor tr.dragging { opacity:.45; }
.split-editor .split-ex-list { min-height:2.4rem; }
.split-editor .saving { opacity:.5; }
.markdown-body { white-space:normal; overflow-wrap:anywhere; }
.markdown-body :first-child, .article-body :first-child { margin-top:0; }
.markdown-body :last-child, .article-body :last-child { margin-bottom:0; }
.markdown-body p { margin:.4em 0; }
.markdown-body ul, .markdown-body ol { margin:.35em 0; padding-left:1.2em; }
.markdown-body h1 { font-size:1.3rem; }
.markdown-body h2 { font-size:1.15rem; }
.markdown-body h3 { font-size:1.05rem; }

/* --- Course-tracker UI (ported from course_tracker_integrated_mock.html) --- */
.tabs { display:flex; gap:.4rem; flex-wrap:wrap; margin:0 0 1rem; }
.tab { border:1px solid var(--border); background:#fff; padding:.5rem .75rem; border-radius:9px; font-size:.8rem; font-weight:700; color:#3c4650; }
.tab.active { background:var(--accent); color:#fff; border-color:var(--accent); }
.segmented { display:flex; gap:.4rem; flex-wrap:wrap; }
.seg { padding:.5rem .65rem; border:1px solid var(--border); border-radius:999px; background:#f8fafc; cursor:pointer; font-size:.8rem; font-weight:700; color:#374151; }
.seg.active { background:#e0ecff; border-color:#93b4f5; color:#1e3a8a; }
.toggleline { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:.6rem 0; }
.toggle { width:2.6rem; height:1.5rem; border-radius:999px; background:#c8ced5; position:relative; cursor:pointer; border:0; flex:none; }
.toggle::after { content:""; position:absolute; left:.2rem; top:.2rem; width:1.1rem; height:1.1rem; background:#fff; border-radius:50%; box-shadow:0 1px 4px rgba(0,0,0,.25); transition:left .12s ease; }
.toggle.on { background:var(--accent); }
.toggle.on::after { left:1.3rem; }
.days { display:flex; gap:.4rem; flex-wrap:wrap; }
.day-pill { border:1px solid var(--border); background:#f8fafc; border-radius:8px; padding:.4rem .55rem; font-weight:700; font-size:.75rem; cursor:pointer; }
.day-pill.on { background:#e0ecff; border-color:#93b4f5; color:#1e3a8a; }
.phaseblock { min-width:9rem; border-radius:10px; padding:.75rem; border:1px solid rgba(0,0,0,.06); }
.phaseblock strong { display:block; }
.phaseblock small { color:#57616a; }
.phase-cruise, .phase-band-cell.cruise { background:var(--phase-cruise); color:var(--phase-cruise-ink); }
.phase-growth, .phase-band-cell.growth { background:var(--phase-growth); color:var(--phase-growth-ink); }
.phase-health, .phase-band-cell.health { background:var(--phase-health); color:var(--phase-health-ink); }
.phase-event, .phase-band-cell.event { background:var(--phase-event); color:var(--phase-event-ink); }
.phase-other, .phase-band-cell.other { background:var(--phase-other); color:var(--phase-other-ink); }
.phase-band-row th { padding:0; border-right:1px solid var(--border); }
.phase-band-cell { display:flex; align-items:center; justify-content:center; height:1.9rem; font-size:.7rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em; border-right:1px solid rgba(255,255,255,.5); }
.checklist { display:grid; grid-template-columns:1fr 1fr; gap:.9rem; }
@media (max-width:760px) { .checklist { grid-template-columns:1fr; } }
.checkitem { display:grid; grid-template-columns:1.7rem 1fr auto; gap:.7rem; align-items:center; padding:.85rem; border:1px solid var(--border); border-radius:11px; background:#fff; }
.checkitem.done { background:#e7f2ea; }
.checkitem .name { font-weight:800; }
.checkitem .meta { font-size:.75rem; color:var(--muted); }
.checkitem .amount { font-weight:850; }
.rule { border:1px solid var(--border); border-radius:11px; padding:.75rem; margin-top:.6rem; background:#f8fafc; }
.rule.inherit { background:#f4f5f6; color:var(--muted); border-style:dashed; }
.rulehead { display:flex; justify-content:space-between; align-items:center; margin-bottom:.6rem; gap:.5rem; }
.rulegrid { display:grid; grid-template-columns:1fr 1fr 1fr; gap:.6rem; }
@media (max-width:760px) { .rulegrid { grid-template-columns:1fr; } }
.summary { border:1px solid var(--border); border-radius:10px; overflow:hidden; }
.sumrow { padding:.6rem .65rem; border-bottom:1px solid var(--border); }
.sumrow:last-child { border-bottom:0; }
.sumrow strong { display:block; font-size:.8rem; }
.sumrow span { font-size:.72rem; color:var(--muted); }
.note { padding:.6rem .7rem; border-radius:9px; background:#f7f8f9; border:1px dashed var(--border); color:var(--muted); font-size:.75rem; }
.hint { font-size:.72rem; color:var(--muted); }
.groupname { font-size:.7rem; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); font-weight:800; margin:1rem 0 .5rem; }
input.toggle-checkbox { appearance:none; -webkit-appearance:none; width:2.6rem; height:1.5rem; border-radius:999px; background:#c8ced5; position:relative; cursor:pointer; border:0; outline:none; flex:none; }
input.toggle-checkbox::after { content:""; position:absolute; left:.2rem; top:.2rem; width:1.1rem; height:1.1rem; background:#fff; border-radius:50%; transition:left .12s ease; box-shadow:0 1px 4px rgba(0,0,0,.25); }
input.toggle-checkbox:checked { background:var(--accent); }
input.toggle-checkbox:checked::after { left:1.3rem; }
.split-layout { display:grid; grid-template-columns:minmax(0,1fr) 20rem; gap:1rem; align-items:start; }
.split-layout .preview { position:sticky; top:1rem; }
@media (max-width:980px) { .split-layout { grid-template-columns:1fr; } .split-layout .preview { position:static; } }

/* --- Lab trends (lab_trends.html) --- */
.stat-row { display:flex; gap:1.5rem; flex-wrap:wrap; margin:1rem 0; }
.stat-tile strong { display:block; font-size:1.8rem; line-height:1.1; }
.stat-tile span { font-size:.75rem; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); }
.status-critical-text { color:var(--status-critical); }
.trend-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:1rem; margin-top:1rem; }
.trend-card { background:var(--panel); border:1px solid var(--border); border-radius:14px; padding:1rem; }
.trend-card-head { display:flex; justify-content:space-between; align-items:center; gap:.5rem; margin-bottom:.4rem; }
.trend-latest { margin:.4rem 0; font-weight:700; }
.sparkline { display:block; margin:.3rem 0; }
.badge.status-good { background:color-mix(in srgb, var(--status-good) 16%, white); color:#0a7a0a; }
.badge.status-warning { background:color-mix(in srgb, var(--status-warning) 22%, white); color:#93650a; }
.badge.status-serious { background:color-mix(in srgb, var(--status-serious) 22%, white); color:#9a4726; }
.badge.status-critical { background:color-mix(in srgb, var(--status-critical) 16%, white); color:#a12525; }
.lab-grid-card-head { display:flex; justify-content:space-between; align-items:baseline; margin:1.5rem 0 .5rem; }
.lab-grid-card-head h3 { margin:0; }
.marker-grid-wrap { overflow:auto; background:var(--panel); border:1px solid var(--border); border-radius:14px; margin-bottom:1rem; }
.marker-grid { min-width:100%; border-collapse:collapse; }
.marker-grid th, .marker-grid td { padding:.5rem .65rem; border-bottom:1px solid var(--border); text-align:right; white-space:nowrap; font-size:.85rem; }
.marker-grid thead th { background:#f1f5f9; font-size:.7rem; text-transform:uppercase; letter-spacing:.03em; color:var(--muted); font-weight:700; text-align:right; }
.marker-grid .marker-col { position:sticky; left:0; z-index:2; background:var(--panel); text-align:left; min-width:14rem; }
.marker-grid thead .marker-col { background:#f1f5f9; z-index:3; }
.marker-grid .marker-name { display:block; font-weight:700; }
.marker-grid .marker-meta { font-size:.72rem; color:var(--muted); font-weight:400; }
.marker-grid td.flagged-high, .marker-grid td.flagged-low { background:#fdecea; color:#a12525; font-weight:700; }
.marker-grid td.flagged-high sup, .marker-grid td.flagged-low sup { font-size:.7em; }
.marker-grid .trend-col { text-align:center; }
.marker-grid .trend-col .sparkline { display:inline-block; vertical-align:middle; margin-left:.3rem; }