/* =============================================================================
   GRC Tracker — "ops console" stylesheet (restyle epic #160; plan: docs/restyle-plan.md)
   Dark base, GRC purple accent (D22), JetBrains Mono for HUD text (D24).
   Every pair here is checked numerically by issue G (#159) — keep this block in step
   with the tokens table in docs/restyle-plan.md.
   ============================================================================= */

/* --- Font (D24): self-hosted, one variable file, no third-party requests ---- */
@font-face {
  font-family: "JetBrains Mono";
  src: url("/fonts/JetBrainsMono-Variable.woff2") format("woff2");
  font-weight: 100 800;
  font-style: normal;
  font-display: swap;
}

/* --- Custom properties ---------------------------------------------------- */
:root {
  --bg:#04070A; --fill:#091016; --fill-2:#0E171E;
  --text:#E6F2EC; --dim:#9FB5AA; --faint:#6E8579;
  --accent:#C44DFF; --accent-deep:#8A1FC2; --accent-ink:#1B0A24;   /* D22: GRC purple, brightened */
  --green:#3DFF9A; --green-deep:#12B86A; --amber:#FFB020; --red:#FF5C5C; --cyan:#5CE1FF;
  --line:rgba(196,77,255,.30); --line-soft:rgba(196,77,255,.12);
  --mono:"JetBrains Mono","IBM Plex Mono","SFMono-Regular",Menlo,Consolas,monospace;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --cut:14px; --hud-h:52px; --gutter:max(1rem, calc((100vw - 1200px) / 2 + 1rem)); --max-width:540px; --max-width-wide:1200px;

  /* Tints for status backgrounds / borders (alpha of the semantic colours). */
  --accent-a:rgba(196,77,255,.14);
  --green-a:rgba(61,255,154,.12);  --green-b:rgba(61,255,154,.35);
  --amber-a:rgba(255,176,32,.12);  --amber-b:rgba(255,176,32,.35);
  --red-a:rgba(255,92,92,.12);     --red-b:rgba(255,92,92,.40);
  --cyan-a:rgba(92,225,255,.12);   --cyan-b:rgba(92,225,255,.35);

  /* Session-type colours (restyle F): chart series/bars and calendar chips share these. */
  --type-water:#5CE1FF; --type-erg:#C44DFF; --type-run:#3DFF9A; --type-cycle:#FFB020; --type-sc:#9FB5AA;
}

/* --- Reset ----------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { background: var(--bg); color-scheme: dark; }
body {
  margin: 0;
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.5;
  color: var(--text);
  background: var(--bg);
  font-variant-numeric: tabular-nums;
}
::selection { background: var(--accent); color: var(--accent-ink); }
img, svg { display: block; max-width: 100%; }
a { color: var(--accent); text-decoration: underline; }
a:hover { color: var(--text); }
button { cursor: pointer; }

/* --- Typography ------------------------------------------------------------ */
h1, h2, h3, .card__title, .section-title, .sessions-section-title, .session-section-title, .kicker {
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
h1 { font-size: 1.5rem; margin: 0 0 0.5rem; }
h2 { font-size: 1.2rem; margin: 0 0 0.4rem; }
h3 { font-size: 1rem;   margin: 0 0 0.3rem; font-weight: 600; }
.kicker { font-size: 0.7rem; letter-spacing: 0.24em; color: var(--accent); font-weight: 600; }
p  { margin: 0 0 0.75rem; }
small { font-size: 0.85rem; color: var(--dim); }

/* --- Layout --------------------------------------------------------------- */
.page {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0.75rem 1rem 2rem;
  position: relative;
  z-index: 1;
  animation: fadeUp 0.45s ease both;
}
@keyframes fadeUp { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* --- Atmosphere (D23): fixed, non-interactive, no radar ---------------------- */
#bg, #grid, #scan { position: fixed; inset: 0; pointer-events: none; z-index: 0; }
#bg {
  background:
    radial-gradient(ellipse 70% 50% at 15% -10%, rgba(196, 77, 255, 0.16), transparent 70%),
    radial-gradient(ellipse 60% 45% at 100% 105%, rgba(138, 31, 194, 0.18), transparent 70%),
    var(--bg);
}
#grid {
  background-image:
    linear-gradient(rgba(196, 77, 255, 0.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(196, 77, 255, 0.08) 1px, transparent 1px);
  background-size: 56px 56px;
  opacity: 0.35;
  -webkit-mask-image: radial-gradient(ellipse at 50% 30%, #000 0%, transparent 75%);
  mask-image: radial-gradient(ellipse at 50% 30%, #000 0%, transparent 75%);
}
#scan {
  background: repeating-linear-gradient(to bottom, rgba(0, 0, 0, 0.0) 0, rgba(0, 0, 0, 0.0) 2px, rgba(0, 0, 0, 0.22) 3px);
  mix-blend-mode: multiply;
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}

/* --- HUD + tab row (C, #155) ---------------------------------------------------------------------
   #chrome sticks both bars together (the HUD wraps to two rows on phones, so the tab row can't use a fixed top).
   Tab links keep the .nav__link class (view-as.test.ts + active-nav.ts match on it); the current tab comes from aria-current. */
#chrome { position: sticky; top: 0; z-index: 100; }
#hud {
  min-height: var(--hud-h); display: flex; align-items: center; gap: 18px; padding: 0 var(--gutter);
  background: linear-gradient(180deg, rgba(4, 7, 10, 0.96), rgba(4, 7, 10, 0.7));
  border-bottom: 1px solid var(--line-soft);
  font-family: var(--mono); font-size: 13px; letter-spacing: 0.08em;
}
.brand { display: flex; align-items: center; gap: 10px; white-space: nowrap; color: var(--text); text-decoration: none; font-weight: 700; }
.brand b { color: var(--accent); }
.brand:hover { color: var(--text); }
.dot { width: 8px; height: 8px; background: var(--green-deep); display: inline-block; clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); }
.dot--error { background: var(--red); animation: blink 1.4s steps(2) infinite; }
@keyframes blink { 50% { opacity: 0.2; } }
#crumb { flex: 1; min-width: 0; color: var(--dim); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#crumb::before { content: "// "; color: var(--faint); }
#crumb:empty { visibility: hidden; }
#crumb b { color: var(--text); font-weight: 600; }
.hudRight { display: flex; align-items: center; gap: 12px; margin-left: auto; flex-shrink: 0; min-width: 0; }
.hudUser { color: var(--dim); max-width: 16ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.iconBtn {
  display: inline-block; border: 1px solid var(--line-soft); background: transparent; padding: 5px 9px; margin: 0;
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; text-decoration: none;
  color: var(--dim); white-space: nowrap; cursor: pointer;
}
.iconBtn:hover { color: var(--text); border-color: var(--line); background: var(--accent-a); }
.iconBtn:focus-visible { outline: 2px solid var(--cyan); outline-offset: 3px; }

.nav { background: rgba(4, 7, 10, 0.88); border-bottom: 1px solid var(--line-soft); }
.nav__inner {
  padding: 6px var(--gutter); display: flex; align-items: center; gap: 6px;
  overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.nav__inner::-webkit-scrollbar { display: none; }
.nav__link {
  flex: 0 0 auto; white-space: nowrap; scroll-margin: 0 var(--gutter);
  border: 1px solid var(--line-soft); padding: 5px 10px; text-decoration: none;
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--dim);
  transition: background 0.15s, color 0.15s;
}
.nav__link:hover { color: var(--text); background: var(--accent-a); }
.nav__link[aria-current="page"] {
  color: var(--accent); border-color: var(--accent); background: var(--accent-a);
  box-shadow: inset 0 0 14px rgba(196, 77, 255, 0.18);
}
/* The tab row above already carries these links (with the current one marked); the in-page copy stays in the DOM for its tests. */
nav.coach-tabs { display: none; }

/* --- Chamfer plate (D25) -----------------------------------------------------
   One shape language: a cut corner top-left and bottom-right, a 1px tinted edge (the element's own
   background = --edge) and an inset ::before filling with --plate. No radius, no shadows.
   Fallback (.plate--flat): <details>, <table> wrappers and overflow:auto containers get a plain
   1px tinted border instead — clip-path would clip their scroll/open content.
   Used by: .card, .btn, .cal-card, .stat, .test-block, .empty-state, .flash, .completion-block, .crew-result, .crews-summary, .crews-unassigned, .crew-publish-all, .dev-login-banner, .cal-crewbox, .prescription. */
.plate, .card, .btn, .cal-card, .stat, .test-block, .empty-state, .flash, .completion-block, .crew-result, .crews-summary, .crews-unassigned, .crew-publish-all, .dev-login-banner, .cal-crewbox, .prescription, .chart-empty {
  --cut: 14px; --edge: var(--line); --plate: var(--fill);
  position: relative; isolation: isolate; background: var(--edge);
  clip-path: polygon(var(--cut) 0, 100% 0, 100% calc(100% - var(--cut)), calc(100% - var(--cut)) 100%, 0 100%, 0 var(--cut));
}
.plate::before, .card::before, .btn::before, .cal-card::before, .stat::before, .test-block::before, .empty-state::before, .flash::before, .completion-block::before, .crew-result::before, .crews-summary::before, .crews-unassigned::before, .crew-publish-all::before, .dev-login-banner::before, .cal-crewbox::before, .prescription::before, .chart-empty::before {
  content: ""; position: absolute; inset: 1px; z-index: -1;
  background: linear-gradient(var(--plate), var(--plate)), var(--fill);
  clip-path: polygon(calc(var(--cut) - 0.4px) 0, 100% 0, 100% calc(100% - var(--cut) + 0.4px), calc(100% - var(--cut) + 0.4px) 100%, 0 100%, 0 calc(var(--cut) - 0.4px));
}
.plate--soft, .stat, .test-block, .completion-block, .prescription, .cal-crewbox, .crews-summary, .crews-unassigned, .crew-publish-all, .cal-card, .chart-empty { --cut: 8px; --edge: var(--line-soft); --plate: var(--fill-2); }
.plate--in { --edge: var(--accent); box-shadow: inset 0 0 24px rgba(196, 77, 255, 0.12); }
.plate--flat, .session-collapsed {
  clip-path: none; background: var(--fill); border: 1px solid var(--line-soft); position: static; isolation: auto;
}
.plate--flat::before, .session-collapsed::before { display: none; }
.session-collapsed { margin-bottom: 0.75rem; }
.session-collapsed > summary { padding: 0.6rem 0.8rem; cursor: pointer; }
.session-collapsed[open] > summary { border-bottom: 1px solid var(--line-soft); }

/* --- Flash / alerts ------------------------------------------------------- */
.flash { padding: 0.75rem 1rem;margin: 0.75rem 0; font-size: 0.9rem; }
.flash--error   { --edge: var(--red-b);   --plate: var(--red-a);   color: var(--red); }
.flash--success { --edge: var(--green-b); --plate: var(--green-a); color: var(--green); }
.flash--info    { --edge: var(--cyan-b);  --plate: var(--cyan-a);  color: var(--cyan); }

/* --- Cards ---------------------------------------------------------------- */
.card {
  padding: 1rem;
  margin-bottom: 1rem;
  --plate: var(--fill);
  
}
.card--brand { --edge: var(--accent); }
.card__header {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
}
.card__title { font-weight: 600; font-size: 1rem; }
.card__meta  { font-size: 0.8rem; color: var(--dim); }

th, .tab, .block-tab { font-family: var(--mono); }
th { text-transform: uppercase; letter-spacing: 0.12em; }

/* Traffic lights (focus ratings) */
.light { display: inline-block; width: 12px; height: 12px; clip-path: circle(50%); vertical-align: middle; }
.light--red    { background: var(--red); }
.light--amber  { background: var(--amber); }
.light--green  { background: var(--green); }

/* --- Prescription block --------------------------------------------------- */
.prescription {
  --plate: var(--fill-2);
  padding: 0.75rem;
  font-size: 0.9rem;
  margin: 0.5rem 0;
}
.prescription__structure {
  font-family: var(--mono);
  font-size: 0.85rem;
  white-space: pre-wrap;
  word-break: break-word;
}

/* --- Crew list ------------------------------------------------------------ */
.crew-list { list-style: none; padding: 0; margin: 0.5rem 0; }
.crew-list li {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.15rem 0;
  font-size: 0.9rem;
}
.crew-list__seat { font-family: var(--mono); color: var(--dim); min-width: 2.5rem; }

/* --- Section headings ----------------------------------------------------- */
.section-header {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  margin: 1.25rem 0 0.5rem;
}
.section-header h2 { margin: 0; }

/* --- Forms ---------------------------------------------------------------- */
.form-group { margin-bottom: 1rem; }
label { display: block; font-weight: 600; font-size: 0.9rem; margin-bottom: 0.3rem; }

/* --- Buttons -------------------------------------------------------------- */




/* --- Buttons (B) --------------------------------------------------------------- */
.btn {
  --cut: 11px; --plate: var(--fill);
  display: inline-flex; align-items: center; justify-content: center; gap: 0.4rem;
  min-height: 44px; padding: 13px 24px; border: 0; color: var(--text);
  font-family: var(--mono); font-size: 0.85rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase;
  text-decoration: none; cursor: pointer; transition: transform 0.12s, filter 0.15s;
}
.btn:hover:not(:disabled) { --edge: var(--accent); transform: translateY(-1px); color: var(--text); }
.btn:disabled { opacity: 0.45; cursor: not-allowed; }
.btn--primary { --edge: var(--accent); --plate: var(--accent); color: var(--accent-ink); font-weight: 800; filter: drop-shadow(0 0 14px rgba(196, 77, 255, 0.35)); }
.btn--primary:hover:not(:disabled) { --plate: #D77DFF; --edge: #D77DFF; color: var(--accent-ink); }
.btn--secondary { --plate: var(--bg); }
.btn--danger { --edge: rgba(255, 92, 92, 0.7); --plate: #1A0B0B; color: var(--red); }
.btn--danger:hover:not(:disabled) { --edge: var(--red); --plate: #2A1010; color: var(--red); }
.btn--small { --cut: 8px; min-height: 0; padding: 8px 14px; font-size: 0.75rem; }
.btn--full { width: 100%; }
.btn:focus-visible, .nav__link:focus-visible, .brand:focus-visible, .chip:focus-visible { outline: 2px solid var(--cyan); outline-offset: 3px; }

/* --- Badges / chips / status chips: one family (B) ------------------------------ */
.status-chip { white-space: nowrap; }
.badge, .status-chip, .chip, .range-tab, .category-tab, .session-row-chip, .tests-cell__src, .cal-test, .test-week-chip {
  display: inline-block; padding: 0.1rem 0.5rem; border: 1px solid var(--chip-edge, var(--line-soft)); color: var(--chip-ink, var(--dim));
  background: transparent; font-family: var(--mono); font-size: 0.7rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; line-height: 1.5;
}
.cal-test { font-size: 0.6rem; padding: 0 0.3rem; }
.tests-cell__src { margin-left: 0.4rem; padding: 0 0.3rem; }
.session-row-chip--target { --chip-ink: var(--green); --chip-edge: var(--green-b); }
.chip, .range-tab, .category-tab { font-size: 0.75rem; padding: 0.2rem 0.65rem; text-decoration: none; }
.chip:hover, .range-tab:hover, .category-tab:hover { --chip-edge: var(--accent); }
.chip--active, .range-tab--active, .category-tab--active { background: var(--accent); --chip-edge: var(--accent); color: var(--accent-ink); }
.badge--green, .status-chip--completed, .status-chip--compensated { --chip-edge: var(--green-b); --chip-ink: var(--green); background: var(--green-a); }
.badge--amber, .status-chip--partial, .test-week-chip, .cal-test, .tests-cell__src--manual { --chip-edge: var(--amber-b); --chip-ink: var(--amber); background: var(--amber-a); }
.badge--red { --chip-edge: var(--red-b); --chip-ink: var(--red); background: var(--red-a); }
.badge--brand { --chip-edge: var(--line); --chip-ink: var(--accent); background: var(--accent-a); }
.badge--grey, .status-chip--other, .status-chip--assigned, .tests-cell__src { --chip-edge: var(--line-soft); --chip-ink: var(--dim); background: var(--fill-2); }
.status-chip--compensated { font-style: italic; }
.status-chip--excused { --chip-edge: var(--faint); --chip-ink: var(--dim); border-style: dashed; background: transparent; }
.badge--pb, .test-pb-badge { --chip-edge: var(--amber); background: var(--amber); color: var(--accent-ink); font-weight: 800; }
.status-chip--pending { --chip-edge: var(--amber-b); --chip-ink: var(--amber); background: var(--amber-a); }
.status-chip--missed { --chip-edge: var(--red); background: var(--red); color: var(--accent-ink); }

/* --- Kicker / stamp / fuse (B) -------------------------------------------------- */
.kicker { display: block; font-size: 0.8rem; letter-spacing: 0.24em; font-weight: 600; color: var(--accent); margin: 0 0 0.25rem; }
.stamp {
  --stamp: var(--red);
  display: inline-block; transform: rotate(8deg); border: 3px solid var(--stamp); color: var(--stamp); padding: 0.2rem 0.7rem;
  font-family: var(--mono); font-weight: 700; font-size: 0.8rem; letter-spacing: 0.2em; text-transform: uppercase; opacity: 0.9;
}
.stamp--green { --stamp: var(--green); }
.stamp--amber { --stamp: var(--amber); }
.stamp--red { --stamp: var(--red); }
.fuse { --pct: 0; --fuse-a: var(--amber); --fuse-b: #C77D00; position: relative; height: 1.1rem; margin: 0.25rem 0; display: flex; align-items: center; grid-column: 1 / -1; }
.fuse__track { position: absolute; left: 0; right: 0; height: 5px; background: repeating-linear-gradient(90deg, #3a2f1a 0 10px, #2a2213 10px 15px); }
.fuse__fill { position: absolute; left: 0; height: 5px; width: calc(var(--pct) * 1%); max-width: 100%; background: linear-gradient(90deg, var(--fuse-b), var(--fuse-a)); }
.fuse--low { --fuse-a: var(--red); --fuse-b: #B31D1D; }
.fuse--num { padding-right: 4.5rem; }
.fuse__num { position: absolute; right: 0; font-family: var(--mono); font-size: 1.4rem; font-weight: 800; color: var(--fuse-a); width: 4.2rem; text-align: right; }

/* --- Forms (B) ------------------------------------------------------------------ */
input[type="text"], input[type="email"], input[type="date"], input[type="time"], input[type="number"], input[type="password"], input[type="search"], input[type="url"], select, textarea {
  background: var(--fill-2); color: var(--text); border: 1px solid var(--line-soft); padding: 0.55rem 0.75rem; font-size: 1rem; font-family: var(--sans);
}
input[type="number"], input[type="time"], input[type="date"], input.input--short, input.input--date { font-family: var(--mono); }
input[type="text"], input[type="email"], select { width: 100%; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(196, 77, 255, 0.15); }
input[type="checkbox"], input[type="radio"] { accent-color: var(--accent); }
::placeholder { color: var(--faint); }
.field-error { border-left: 2px solid var(--red); padding-left: 0.5rem; }

/* --- Dev sign-in page ----------------------------------------------------- */
.dev-login-banner {
  --edge: var(--amber-b); --plate: var(--amber-a);
  font-family: var(--mono); letter-spacing: 0.08em;
  padding: 0.75rem 1rem;
  font-size: 0.85rem;
  color: var(--amber);
  margin-bottom: 1rem;
}
.user-list { list-style: none; padding: 0; margin: 0; }
.user-list__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.6rem 0;
  border-bottom: 1px solid var(--line-soft);
  gap: 0.5rem;
}
.user-list__item:last-child { border-bottom: none; }
.user-list__name { font-weight: 600; }
.user-list__role { font-size: 0.8rem; color: var(--dim); }

/* --- Empty states --------------------------------------------------------- */
.empty-state {
  text-align: center;
  padding: 2rem 1rem;
  color: var(--dim);
}
.empty-state p { margin: 0; }

/* --- Utilities ------------------------------------------------------------ */
.mt-1  { margin-top: 0.5rem; }
.mt-2  { margin-top: 1rem; }
.mt-3  { margin-top: 1.5rem; }
.text-muted { color: var(--dim); }
.text-small { font-size: 0.85rem; }
.text-right { text-align: right; }
.sr-only {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); border: 0;
}

/* =============================================================================
   Coach dashboard (#71) — wide pages, attendance grid, progress table
   ============================================================================= */
.page--wide { max-width: var(--max-width-wide); }

.tabs { display: flex; gap: 6px; margin: 0 0 1rem; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.tabs::-webkit-scrollbar { display: none; }
.tab  { flex: 0 0 auto; white-space: nowrap; padding: 5px 10px; border: 1px solid var(--line-soft); text-decoration: none; color: var(--dim);
        font-family: var(--mono); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; scroll-margin: 0 1rem; }
.tab:hover { color: var(--text); background: var(--accent-a); }
.tab--active, .tab[aria-current="page"] { color: var(--accent); border-color: var(--accent); background: var(--accent-a); box-shadow: inset 0 0 14px rgba(196, 77, 255, 0.18); font-weight: 600; }

.att-controls { display: flex; gap: 0.4rem; flex-wrap: wrap; align-items: center; margin: 0 0 0.75rem; }

.view-as {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0.75rem 0; padding: 0.4rem 0.75rem;
  background: var(--amber-a); border: 1px solid var(--amber-b); border-left: 3px solid var(--amber); color: var(--amber);
  font-family: var(--mono); font-size: 12px; letter-spacing: 0.2em; text-transform: uppercase;
}
.view-as span { margin-right: auto; }
.view-as strong { color: var(--text); letter-spacing: 0.08em; }
.view-as a {
  border: 1px solid var(--amber-b); padding: 4px 8px; font-size: 11px; letter-spacing: 0.1em; text-decoration: none; color: var(--amber);
}
.view-as a:hover { background: var(--amber-a); color: var(--text); }

/* Scroll container: horizontal on phones, sticky first column. */
.att-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--line-soft);}
.att-table, .prog-table { border-collapse: separate; border-spacing: 0; font-size: 0.85rem; min-width: 100%; }
.att-table th, .att-table td, .prog-table th, .prog-table td {
  padding: 0.3rem 0.4rem; border-bottom: 1px solid var(--line-soft); white-space: nowrap; text-align: center; vertical-align: middle;
}
.att-table thead th, .prog-table thead th { background: var(--fill-2); position: sticky; top: 0; z-index: 1; }
.att-week { font-weight: 600; border-left: 2px solid var(--line-soft); }
.att-session { font-weight: 400; min-width: 3.4rem; }
.att-session__day, .att-session__title { display: block; font-size: 0.7rem; color: var(--dim); }
.att-session__icon { display: block; font-size: 0.9rem; }
.att-name { text-align: left; position: sticky; left: 0; background: var(--fill); z-index: 2; font-weight: 400;
            border-right: 2px solid var(--line-soft); }
.att-table thead .att-name, .prog-table thead .prog-name { z-index: 3; background: var(--fill-2); }
.att-name a { text-decoration: none; color: var(--text); }
.att-row--cox .att-name { border-top: 2px solid var(--line-soft); }
.att-cell { width: 2.2rem; }
.att-cell__link { display: inline-block; min-width: 1.8rem; padding: 0.1rem 0.2rem;                  text-decoration: none; font-weight: 600; }
.att-cell--done     .att-cell__link { background: var(--green-a); color: var(--green); }
.att-cell--partial  .att-cell__link { background: var(--amber-a); color: var(--amber); font-size: 0.75rem; }
.att-cell--awaiting .att-cell__link { background: var(--amber-a); color: var(--amber); }
.att-cell--compensated .att-cell__link { background: var(--green-a); color: var(--green); font-style: italic; }
.att-cell__edit { font-size: 0.65rem; color: var(--dim); text-decoration: none; margin-left: 0.1rem; opacity: 0.55; }
.att-cell__edit:hover { opacity: 1; }
.att-cell--upcoming .att-cell__link { color: transparent; }
.att-cell--na { background: repeating-linear-gradient(45deg, transparent, transparent 4px, var(--line-soft) 4px, var(--line-soft) 5px); }
.att-dot { color: var(--accent); text-decoration: none; font-weight: 700; margin-left: 0.1rem; }
.att-total { font-variant-numeric: tabular-nums; }
.att-coltotal { font-size: 0.75rem; color: var(--dim); }
.att-legend { margin-top: 0.75rem; }
.att-key { display: inline-block; min-width: 1.4rem; text-align: center;font-weight: 600; }
.att-key.att-cell--done { background: var(--green-a); color: var(--green); }
.att-key.att-cell--partial { background: var(--amber-a); color: var(--amber); }
.att-key.att-cell--awaiting { background: var(--amber-a); color: var(--amber); }
.att-key.att-cell--compensated { background: var(--green-a); color: var(--green); font-style: italic; }

.prog-name { text-align: left; position: sticky; left: 0; background: var(--fill); z-index: 2; font-weight: 400;
             border-right: 2px solid var(--line-soft); }
.prog-name a { text-decoration: none; color: var(--text); }
.prog-th a { text-decoration: none; color: var(--text); }
.prog-th--active a { color: var(--accent); }
.prog-row--cox .prog-name { border-top: 2px solid var(--line-soft); }
.prog-median th, .prog-median td { background: var(--fill-2); font-weight: 600; border-top: 2px solid var(--line-soft); }
.prog-median th { text-align: left; position: sticky; left: 0; }
.prog-spark { text-align: left; }
.spark { display: inline-flex; align-items: center; gap: 0.3rem; }
.spark__svg { display: inline-block; }
.spark__last { font-variant-numeric: tabular-nums; }
.spark__delta--up { color: var(--green); }
.spark__delta--down { color: var(--red); }
.prog-up { color: var(--green); }
.prog-down { color: var(--red); }

.roster { list-style: none; padding: 0; margin: 0; }
.roster__item { display: flex; justify-content: space-between; align-items: center; gap: 1rem;
                padding: 0.5rem 0; border-bottom: 1px solid var(--line-soft); }
.roster__links { display: flex; gap: 0.75rem; }

/* =============================================================================
   #72 — UI polish
   ============================================================================= */

/* --- Status chips: excused (outline, grey) must not read like missed (solid red) --- */

/* Coach attendance grid uses the same vocabulary. */
.att-cell--missed  .att-cell__link { background: var(--red); color: var(--accent-ink); }
.att-cell--excused .att-cell__link { background: transparent; color: var(--dim); border: 1px dashed var(--faint); }
.att-key.att-cell--missed  { background: var(--red); color: var(--accent-ink); }
.att-key.att-cell--excused { background: transparent; color: var(--dim); border: 1px dashed var(--faint); }

/* --- Horizontal scroll containers with a visible edge hint (shadow appears on the side
       that still has content to scroll to; pure CSS). --- */
.att-wrap, .week-table-wrap, .matrix-table-wrapper, .erg-intervals, .table-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border: 1px solid var(--line-soft);
  background:
    linear-gradient(to right, var(--fill) 30%, transparent) left center / 2.5rem 100% no-repeat local,
    linear-gradient(to left,  var(--fill) 30%, transparent) right center / 2.5rem 100% no-repeat local,
    radial-gradient(farthest-side at 0 50%,    rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0)) left center / 0.9rem 100% no-repeat scroll,
    radial-gradient(farthest-side at 100% 50%, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0)) right center / 0.9rem 100% no-repeat scroll,
    var(--fill);
}
.week-table, .matrix-table, .interval-table, .target-table {
  border-collapse: collapse; width: 100%; font-size: 0.875rem;
}
.week-table th, .week-table td, .matrix-table th, .matrix-table td,
.interval-table th, .interval-table td, .target-table th, .target-table td {
  padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--line-soft); text-align: left; white-space: nowrap;
}
.week-table thead th, .matrix-table thead th, .interval-table thead th, .target-table thead th {
  background: var(--fill-2); font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.12em;
  color: var(--dim);
}
.week-table tbody tr:last-child td, .matrix-table tbody tr:last-child td { border-bottom: 0; }
.matrix-table__group-header th { background: var(--accent); color: var(--accent-ink); font-size: 0.8rem; letter-spacing: 0.04em; }
.matrix-table__name { white-space: normal; min-width: 9rem; }
.matrix-table__score { letter-spacing: 0.1em; color: var(--accent); }
.matrix-table__focus { color: var(--accent); text-align: center; }
.matrix-table__scored-on { color: var(--dim); }
.matrix-table__note { max-width: 14rem; overflow: hidden; text-overflow: ellipsis; color: var(--dim); }
.matrix-table__row--focus { background: var(--accent-a); }
.interval-rest td { color: var(--dim); }
.target-met td, .chip-met { color: var(--green); }
.target-missed td, .chip-missed { color: var(--red); }
.chip-unknown { color: var(--dim); }

/* --- Sessions list ---------------------------------------------------------- */
.sessions-header h1, .session-detail-title { margin-top: 0.75rem; }
.block-tabs { display: flex; gap: 0.25rem; flex-wrap: wrap; margin: 0.5rem 0 1rem; border-bottom: 1px solid var(--line-soft); }
.block-tab { padding: 0.4rem 0.75rem; text-decoration: none; color: var(--dim); border-bottom: 2px solid transparent; }
.block-tab--active { color: var(--accent); border-bottom-color: var(--accent); font-weight: 600; }
.sessions-section-title, .section-title { font-size: 1.05rem; margin: 1.25rem 0 0.5rem; }
.session-week-group { margin-bottom: 1rem; }
.session-week-header { display: flex; justify-content: space-between; align-items: baseline; gap: 0.5rem;
                       padding: 0.35rem 0; border-bottom: 2px solid var(--line-soft); margin-bottom: 0.25rem; }
.session-week-label { font-weight: 700; }
.session-week-dates { font-size: 0.8rem; color: var(--dim); }
.session-row {
  display: grid; grid-template-columns: 4.5rem 1.6rem 1fr auto; grid-template-areas:
    "date icon title chip" ". . result chip" ". . target target";
  column-gap: 0.5rem; row-gap: 0.1rem; align-items: center;
  padding: 0.6rem 0.25rem; border-bottom: 1px solid var(--line-soft);
  text-decoration: none; color: var(--text);
}
.session-row:hover { background: var(--fill-2); }
.session-row-date  { grid-area: date; font-size: 0.8rem; color: var(--dim); }
.session-row-icon  { grid-area: icon; text-align: center; }
.session-row-title { grid-area: title; font-weight: 600; min-width: 0; }
.session-row-result { grid-area: result; font-size: 0.8rem; color: var(--dim); }
.session-row-result:empty { display: none; }
.session-row-chip--status { grid-area: chip; justify-self: end; }
.session-row-chip--target { grid-area: target; justify-self: start; font-size: 0.75rem; font-weight: 600; }
.session-row-offprog-label { font-weight: 400; color: var(--dim); }
.session-row--off-prog .session-row-chip--status { background: var(--fill-2); color: var(--dim); }

/* --- Session detail --------------------------------------------------------- */
.session-detail-nav { display: flex; gap: 0.5rem; flex-wrap: wrap; margin: 0.75rem 0; }
.session-detail-meta { display: flex; gap: 0.75rem; font-size: 0.8rem; color: var(--dim); }
.session-detail-header { margin-bottom: 1rem; }
.session-detail-optional { font-size: 0.8rem; color: var(--dim); margin-left: 0.4rem; }
.session-section { margin-bottom: 1.25rem; }
.session-section-title { font-size: 1rem; border-bottom: 1px solid var(--line-soft); padding-bottom: 0.25rem; margin-bottom: 0.5rem; }
.session-detail-dl { display: grid; grid-template-columns: max-content 1fr; gap: 0.2rem 0.75rem; margin: 0 0 0.5rem; font-size: 0.9rem; }
.session-detail-dl dt { color: var(--dim); }
.session-detail-dl dd { margin: 0; }
.coaching-notes, .session-override-note { font-style: italic; }
.completion-block { padding: 0.6rem 0.75rem; --plate: var(--fill-2);margin-bottom: 0.5rem; }
.completion-summary { display: flex; gap: 0.75rem; flex-wrap: wrap; align-items: baseline; }
.completion-date { color: var(--dim); font-size: 0.85rem; }
.completion-km, .completion-duration { font-weight: 600; }
.completion-pb-banner { background: var(--green); color: var(--accent-ink); font-weight: 700;
                        padding: 0.3rem 0.6rem;}
.completion-fragment-label { font-size: 0.8rem; color: var(--dim); }
.focus-item { display: flex; gap: 0.5rem; align-items: baseline; flex-wrap: wrap; padding: 0.15rem 0; }
.focus-light--green { color: var(--green); }
.focus-light--amber { color: var(--amber); }
.focus-light--red   { color: var(--red); }
.focus-light--none  { color: var(--faint); }
.focus-comment { font-size: 0.85rem; color: var(--dim); font-style: italic; }
.focus-bumped { font-size: 0.75rem; color: var(--green); font-weight: 600; }
.provenance-block { font-size: 0.85rem; color: var(--dim); margin-top: 1rem; }
.provenance-summary { cursor: pointer; }

/* --- Progress --------------------------------------------------------------- */
.progress-header { display: flex; justify-content: space-between; align-items: center; gap: 0.5rem; flex-wrap: wrap; margin: 0.75rem 0 0.5rem; }
.progress-header h1 { margin: 0; }
.range-tabs { display: flex; gap: 0.25rem; flex-wrap: wrap; }
.erg-picker { margin: 0 0 0.5rem; }
.focus-history { list-style: none; padding: 0; margin: 0; display: grid; gap: 0.5rem; }
.focus-history__item { padding: 0.6rem 0.8rem; }
.focus-history__title, .focus-history__lights { margin: 0.15rem 0; }
.matrix-table__progress { font-size: 0.85rem; white-space: nowrap; }
.block-cards { display: grid; gap: 0.5rem; }
.block-rollup-card__name { margin: 0; }
.block-rollup-card__dates { font-size: 0.8rem; margin-bottom: 0.5rem; }
.stats-row { display: flex; gap: 0.5rem; flex-wrap: wrap; margin: 0; }
.stat { flex: 1 1 5.5rem; --plate: var(--fill-2); padding: 0.5rem 0.75rem; }
.stat dt { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--dim); }
.stat dd { margin: 0; font-size: 1.15rem; font-weight: 700; }
.card > .section-title:first-child { margin-top: 0; }
.mileage-headline__value, .mileage-card__headline { font-size: 1.35rem; font-weight: 700; color: var(--accent); margin: 0 0 0.25rem; }
.mileage-headline__value .text-muted { font-size: 0.9rem; font-weight: 400; }
.mileage-headline__breakdown { font-size: 0.85rem; }
.percentile-list { display: grid; gap: 0.6rem; }
.percentile-row { display: grid; grid-template-columns: 1fr auto; gap: 0.2rem 0.5rem; align-items: baseline; }
.percentile-row__label { font-size: 0.9rem; }
.percentile-row__value { font-size: 0.85rem; font-weight: 600; }
.benchmark-charts { display: grid; gap: 1rem; }
.benchmark-chart__title { font-size: 0.9rem; margin: 0 0 0.25rem; }
.chart { width: 100%; height: auto; }
/* SVG chart marks (restyle F) — colours here, series colours are var(--…) attributes in charts.tsx. */
.chart__grid { stroke: var(--line-soft); stroke-width: 1; }
.chart__base { stroke: var(--line); stroke-width: 1.5; }
.chart__tick { fill: var(--dim); font-family: var(--mono); }
.chart__tier { fill: var(--faint); font-family: var(--mono); letter-spacing: 0.04em; }
.chart-empty { margin: 0 0 0.5rem; padding: 0.6rem 0.9rem; font-family: var(--mono); font-size: 0.7rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--dim); }
.erg-prog-empty, .run-prog-empty, .target-hit-empty { font-size: 0.9rem; }
.section { margin-bottom: 1.5rem; }

/* --- Landing ---------------------------------------------------------------- */
.upcoming-list a { color: inherit; }
.mileage-card__headline { font-size: 1rem; font-weight: 400; color: var(--text); margin: 0; }
.mileage-card__headline strong { font-size: 1.35rem; color: var(--accent); }

/* Phones (C): HUD wraps to two rows — brand full width, user + sign out under it, crumb hidden. */
@media (max-width: 600px) {
  :root { --hud-h: 96px; }
  #hud { flex-wrap: wrap; align-content: center; gap: 4px; padding: 8px 12px; }
  #hud .brand { width: 100%; font-size: 12px; }
  #crumb { display: none; }
  .hudRight { width: 100%; justify-content: flex-end; gap: 6px; }
  .hudRight .iconBtn { min-height: 40px; letter-spacing: 0.04em; }
  .hudRight .hudUser { margin-right: auto; }
  #hud, .nav__inner { --gutter: 12px; }
  .nav__inner { padding-top: 6px; padding-bottom: 6px; }
}

/* --- Tests (#86) ------------------------------------------------------------ */
.test-block { margin: 0.5rem 0; padding: 0.6rem 0.75rem; --plate: var(--fill-2); }
.test-block--done[data-state="pb"] { background: var(--accent-a); }
.test-block__title { margin: 0 0 0.25rem; font-weight: 600; font-size: 0.9rem; }
.test-block__result { margin: 0; font-size: 1.05rem; }
.test-block__facts { display: grid; grid-template-columns: auto 1fr; gap: 0.1rem 0.75rem; margin: 0; font-size: 0.9rem; }
.test-block__facts dt { color: var(--dim); }
.test-block__facts dd { margin: 0; font-weight: 600; }
.test-block__next { margin: 0.35rem 0 0; font-size: 0.82rem; }
/* Standards category toggle (#98, #172) — full-width segmented bar, equal segments, works on a phone */
.category-toggle { margin: 0 0 1rem; }
.category-toggle__label { margin: 0 0 0.35rem; font-family: var(--mono); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--dim); }
.category-toggle__note { margin: 0.4rem 0 0; font-size: 0.85rem; }
.category-tabs { display: flex; gap: 0; align-items: stretch; width: 100%; font-size: 0.85rem; }
.category-toggle .category-tab { flex: 1 1 0; text-align: center; padding: 0.7rem 0.5rem; font-size: 0.8rem; min-height: 2.75rem; box-sizing: border-box; }
.category-toggle .category-tab + .category-tab { margin-inline-start: -1px; }
.category-toggle .category-tab--active { position: relative; z-index: 1; }
.delta--good { color: var(--green); }
.delta--bad { color: var(--amber); }

/* --- Coach tests table (#87) ------------------------------------------------- */
.tests-table td, .tests-table th { vertical-align: top; }
.tests-cell { min-width: 8rem; }
.tests-cell > * { display: block; }
.tests-cell > .badge, .tests-cell > .tests-cell--missing { color: var(--red); font-weight: 600; background: var(--red-a); }
.tests-cell--excused { color: var(--dim); font-style: italic; }
.tests-cell__sub { font-size: 0.78rem; }
.tests-needs__list { columns: 2 16rem; margin: 0.25rem 0 0.5rem; padding-left: 1.1rem; font-size: 0.9rem; }
.tests-needs__list li { break-inside: avoid; }
.tests-cell__std { font-size: 0.78rem; color: var(--green); }
.tier-dot { font-size: 0.9rem; line-height: 1; }
.tier-dot--none { color: var(--faint); }
.tier-dot--low { color: var(--amber); }
.tier-dot--mid { color: #A3E635; }
.tier-dot--top { color: var(--green); }
.tests-history .spark { margin-bottom: 0.1rem; }
.tests-needs { border-left: 4px solid var(--red); margin-bottom: 1rem; }

/* =============================================================================
   Coach calendar (#102) — block grid + week cards (laptop-first, D16)
   ============================================================================= */
.cal-strip { margin: 0.5rem 0 0.75rem; }
.cal-strip .stat dd { font-size: 1.05rem; }
.cal-strip .stat a { text-decoration: none; color: inherit; }
.cal-strip .stat a:hover { text-decoration: underline; }
.cal-strip .stat--attention { --edge: var(--amber); }
.cal-strip .stat--clear dd { color: var(--green); }
.cal-table { border-collapse: separate; border-spacing: 0; table-layout: fixed; min-width: 1100px; width: 100%; font-size: 0.8rem; }
.cal-table thead th { background: var(--fill-2); padding: 0.3rem 0.4rem; text-align: left; position: sticky; top: 0; z-index: 1; }
.cal-weekhead { width: 9.5rem; text-align: left; vertical-align: top; padding: 0.4rem 0.5rem; background: var(--fill-2);
                position: sticky; left: 0; z-index: 2; border-right: 2px solid var(--line-soft); font-weight: 400; }
.cal-weekhead__top { display: flex; justify-content: space-between; align-items: center; gap: 0.3rem; font-weight: 600; }
.cal-edited { color: var(--accent); margin-left: 0.25rem; font-size: 0.7rem; }
.cal-note { font-style: italic; font-size: 0.75rem; color: var(--dim); margin: 0.2rem 0; white-space: pre-line; }
.cal-row { border-bottom: 1px solid var(--line-soft); }
.cal-row--draft .cal-weekhead { border-left: 3px solid var(--amber); }
.cal-cell { vertical-align: top; padding: 0.25rem; border-bottom: 1px solid var(--line-soft); border-right: 1px solid var(--line-soft); height: 4.5rem; }
.cal-cell--past { background: rgba(255, 255, 255, 0.025); }
.cal-cell--today { background: var(--amber-a); outline: 2px solid var(--amber); outline-offset: -2px; }
.cal-cell__date { font-size: 0.65rem; color: var(--dim); text-align: right; }

.cal-chip { border: 1px solid var(--line-soft); border-left-width: 3px;padding: 0.15rem 0.3rem;
            margin-bottom: 0.2rem; background: var(--fill); line-height: 1.25; }
.cal-chip--water { border-left-color: var(--type-water); }
.cal-chip--erg   { border-left-color: var(--type-erg); }
.cal-chip--run   { border-left-color: var(--type-run); }
.cal-chip--cycle { border-left-color: var(--type-cycle); }
.cal-chip--sc    { border-left-color: var(--type-sc); }
.cal-chip--optional { border-style: dashed; border-left-style: solid; }
.cal-chip--tbc { background: var(--amber-a); }
.cal-chip--transferred { opacity: 0.7; border-style: dashed; }
.cal-transfer { font-size: 0.7rem; }
.cal-chip--cancelled { opacity: 0.7; border-style: dashed; }
.cal-chip--cancelled .cal-chip__title { text-decoration: line-through; }
.cal-cancel { font-size: 0.7rem; }
.session-transferred a { color: inherit; text-decoration: underline; }
.type-chooser--inline { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.type-chooser__btn.is-active { outline: 2px solid var(--accent); }
.cal-chip__top { display: flex; gap: 0.25rem; align-items: baseline; overflow: hidden; white-space: nowrap; }
.cal-chip__time { font-variant-numeric: tabular-nums; color: var(--dim); }
.cal-chip__title { font-weight: 600; overflow: hidden; text-overflow: ellipsis; }
.cal-chip__meta { display: flex; flex-wrap: wrap; gap: 0.25rem; align-items: center; color: var(--dim); font-size: 0.72rem; }
.cal-tbc { color: var(--amber); }
.cal-crew { color: var(--cyan); }
.cal-crew--tbc { color: var(--dim); font-style: italic; }
.cal-drills { font-size: 0.7rem; color: var(--dim); white-space: nowrap; }
.cal-card__drills { margin: 0.25rem 0; }
.cal-att { margin-left: auto; font-variant-numeric: tabular-nums; font-weight: 600; color: var(--text); }

.cal-notes-form { margin: 0 0 1rem; max-width: 60rem; }
.cal-notes-form textarea { width: 100%; font: inherit; padding: 0.4rem; border: 1px solid var(--line-soft);}

.cal-week { display: grid; grid-template-columns: repeat(7, minmax(11rem, 1fr)); gap: 0.5rem; overflow-x: auto; align-items: start; }
.cal-day { min-width: 0; }
.cal-day__head { margin: 0 0 0.4rem; font-size: 0.9rem; padding-bottom: 0.2rem; border-bottom: 2px solid var(--line-soft); }
.cal-day--today .cal-day__head { border-bottom-color: var(--amber); }
.cal-day--past { opacity: 0.92; }
.cal-card {  border-top-width: 3px;padding: 0.4rem 0.5rem;
            margin-bottom: 0.5rem; --plate: var(--fill); font-size: 0.82rem;  }
.cal-card--water { border-top-color: var(--cyan); }
.cal-card--erg   { border-top-color: var(--accent); }
.cal-card--run   { border-top-color: var(--green); }
.cal-card--cycle { border-top-color: #7FB6FF; }
.cal-card--sc    { border-top-color: var(--amber); }
.cal-card--tbc { --plate: var(--amber-a); }
.cal-card__head { display: flex; gap: 0.3rem; align-items: baseline; flex-wrap: wrap; }
.cal-card__tags { display: flex; gap: 0.25rem; flex-wrap: wrap; margin: 0.25rem 0; }
.cal-card__structure { font-family: var(--mono); font-size: 0.78rem; }
.cal-card__notes { font-size: 0.75rem; font-style: italic; color: var(--dim); margin-top: 0.25rem; white-space: pre-line; }
.cal-card__att { margin-top: 0.35rem; font-size: 0.75rem; border-top: 1px dashed var(--line-soft); padding-top: 0.25rem; }
.cal-crewbox { --plate: var(--fill-2); padding: 0.25rem 0.4rem; margin-top: 0.35rem; }
.cal-crewbox__head { font-weight: 600; font-size: 0.78rem; }
.cal-seats { list-style: none; margin: 0.2rem 0 0; padding: 0; font-size: 0.75rem; }
.cal-seat { display: inline-block; min-width: 1.6rem; font-family: var(--mono); color: var(--dim); }
/* Long variable structures (pyramids, ladders) must not blow up a grid cell — full text is in the title. */
.cal-sum { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; max-width: 100%; }

/* --- Session editor (#103) -------------------------------------------------- */
.editor { max-width: 46rem; }
.editor-fieldset { border: 1px solid var(--line-soft);padding: 0.75rem 1rem 0.25rem; margin: 0 0 1rem; min-inline-size: 0; }
/* Fieldsets default to min-inline-size: min-content, which lets a long hint or input row push the page wide on phones (G #159). */
fieldset { min-inline-size: 0; }
.editor-fieldset legend { font-weight: 700; padding: 0 0.4rem; }
.editor textarea { width: 100%; font: inherit; padding: 0.5rem 0.75rem; border: 1px solid var(--line-soft);}
.editor input[type="text"].input--short { width: 7.5rem; }
.editor input[type="date"].input--date { width: 11rem; }
.field-row { display: flex; gap: 0.75rem; align-items: center; flex-wrap: wrap; }
.field-row--top { align-items: flex-start; }
.field-row--top .form-group { margin-bottom: 0.75rem; }
.field-or { color: var(--dim); font-size: 0.85rem; align-self: center; }
.field-hint { display: block; font-size: 0.8rem; color: var(--dim); margin-top: 0.2rem; }
.field-error { display: block; font-size: 0.82rem; color: var(--red); margin-top: 0.2rem; font-weight: 600; }
.form-group--error input, .form-group--error select, .form-group--error textarea { border-color: var(--red); }
.mode-block { border-top: 1px dashed var(--line-soft); padding: 0.5rem 0 0.25rem; }
.mode-block:first-of-type { border-top: 0; }
.mode-label { display: flex; align-items: center; gap: 0.4rem; font-weight: 600; margin-bottom: 0.4rem; }
.piece-table { border-collapse: collapse; margin: 0.25rem 0 0.5rem; display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; } /* scrolls on phones (G #159) */
.piece-table th { font-size: 0.75rem; text-align: left; color: var(--dim); padding: 0 0.4rem 0.2rem 0; }
.piece-table td { padding: 0.15rem 0.4rem 0.15rem 0; }
.piece-row--error input { border-color: var(--red); }
.confirm-label { display: block; margin-top: 0.5rem; font-weight: 600; }
.editor-actions { display: flex; gap: 0.75rem; align-items: center; flex-wrap: wrap; margin-top: 0.5rem; }
.editor-delete { color: var(--red); margin-left: auto; font-size: 0.9rem; }

.type-chooser { display: grid; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); gap: 0.75rem; }
.type-chooser__btn { display: flex; flex-direction: column; align-items: center; gap: 0.4rem; padding: 1.25rem 0.5rem; border: 2px solid var(--line-soft);
text-decoration: none; font-weight: 700; font-size: 1.1rem; color: var(--text); background: var(--fill); }
.type-chooser__btn:hover { border-color: var(--accent); }
.type-chooser__icon { font-size: 2rem; }
.type-chooser__btn--water { border-top: 4px solid var(--cyan); }
.type-chooser__btn--erg   { border-top: 4px solid var(--accent); }
.type-chooser__btn--run   { border-top: 4px solid var(--green); }
.type-chooser__btn--sc    { border-top: 4px solid var(--amber); }
.cal-add { display: block; text-align: center; font-size: 0.8rem; color: var(--dim); text-decoration: none; border: 1px dashed var(--line-soft);
padding: 0.1rem; margin-top: 0.2rem; opacity: 0.6; }
.cal-add:hover { opacity: 1; color: var(--accent); border-color: var(--accent); }
.cal-edit { margin-left: auto; text-decoration: none; font-size: 0.8rem; opacity: 0.55; }
.cal-edit:hover { opacity: 1; }
.cal-edit + .cal-edit { margin-left: 0.3rem; }
/* drag-and-drop enhancement (#150): public/calendar-dnd.js */
.cal-chip[draggable="true"] { cursor: grab; }
.cal-chip--dragging { opacity: 0.45; }
.cal-cell--drop { outline: 2px dashed var(--accent); outline-offset: -2px; }
.cal-card--saved {  }
.cal-card__actions { margin-top: 0.3rem; }
.field-row select { width: auto; min-width: 9rem; }
.field-row .form-group { flex: 0 1 auto; }

/* ── Crew entry (#105) ───────────────────────────────────────────────────── */
.crews-summary { --plate: var(--fill-2); padding: 0.5rem 0.75rem; margin: 0.5rem 0; }
.crews-copy { margin: 0.5rem 0; }
.crews-recorded { margin: 0.5rem 0; }
.crews-layout { display: grid; grid-template-columns: minmax(0, 1fr) 15rem; gap: 1.25rem; align-items: start; }
@media (max-width: 800px) { .crews-layout { grid-template-columns: 1fr; } }
.crews-unassigned { position: sticky; top: 0.75rem; --plate: var(--fill-2); padding: 0.5rem 0.75rem; }
.crews-unassigned__list { list-style: none; padding: 0; margin: 0.25rem 0 0.5rem; }
.crews-unassigned__list li { padding: 0.1rem 0; }
.crews-unassigned__list--away li { color: var(--dim); text-decoration: line-through; text-decoration-color: transparent; opacity: 0.7; }
.crew-boat--error { border-color: var(--red); }
.crew-boat__remove { align-self: end; margin-left: auto; }
.crew-seats { display: grid; grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); gap: 0.35rem 1rem; margin-top: 0.5rem; }
.crew-seat { display: flex; align-items: flex-start; gap: 0.5rem; }
.crew-seat__label { min-width: 5.5rem; padding-top: 0.35rem; font-size: 0.85rem; color: var(--dim); }
.crew-seat__body { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.crew-seat__body select { width: 100%; }
.crew-seat__hint { margin: 0.1rem 0 0; font-size: 0.72rem; }
.crews-copy select { width: auto; max-width: 100%; }

/* Record result (#106) */
.crews-results { margin: 1.25rem 0; }
.crew-result {padding: 0.6rem 0.8rem; margin: 0.75rem 0; --plate: var(--fill); }
.crew-result__title { margin: 0 0 0.4rem; font-size: 1rem; }
.crew-result__seats { list-style: none; margin: 0; padding: 0; columns: 2; }
.crew-publish-all { --plate: var(--fill-2); padding: 0.5rem 0.75rem; margin: 0.5rem 0; }
.crew-focus { border-top: 1px dashed var(--line-soft); margin-top: 0.6rem; padding-top: 0.4rem; }
.crew-focus__title { margin: 0 0 0.3rem; font-size: 0.95rem; }
.crew-focus__seat { margin-bottom: 0.4rem; }
.crew-focus__row { display: flex; gap: 0.6rem; align-items: center; flex-wrap: wrap; padding: 0.15rem 0 0.15rem 1rem; }
.crew-focus__el { min-width: 12rem; }
.crew-focus__light { font-weight: 600; margin-right: 0.3rem; white-space: nowrap; }
.crew-focus__comment { flex: 1 1 12rem; min-width: 10rem; }

/* --- Coach trends (#107) ---------------------------------------------------- */
.trend-block { margin: 0 0 1.25rem; }
.trend-block h2 { font-size: 1rem; margin: 0 0 0.35rem; }
.trend-chart { margin: 0 0 0.5rem; max-width: 640px; }
.trend-legend { display: flex; flex-wrap: wrap; gap: 0.25rem 1rem; list-style: none; padding: 0; margin: 0.15rem 0 0; font-size: 0.8rem; color: var(--dim); }
.trend-swatch { display: inline-block; vertical-align: middle; margin-right: 0.3rem; width: 1.1rem; height: 0; border-top: 3px solid var(--swatch, var(--accent)); }
.trend-swatch--dashed { border-top-style: dashed; }
.trend-swatch--box { height: 0.7rem; border: 0; background: var(--swatch, var(--accent));width: 0.7rem; }
.trend-swatch--band { height: 0.7rem; border: 0; background: var(--swatch, var(--accent)); opacity: 0.2;}
.trend-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.9rem; margin: 0 0 1rem; font-size: 0.9rem; }
.trend-controls label { display: inline-flex; align-items: center; gap: 0.3rem; }
.trend-controls__presets { display: inline-flex; gap: 0.35rem; }
.trend-table { font-variant-numeric: tabular-nums; }
.trend-tests__list { display: flex; flex-wrap: wrap; gap: 0.4rem 1.5rem; list-style: none; padding: 0; margin: 0; font-size: 0.9rem; }
.trend-tests__list li { display: inline-flex; align-items: center; gap: 0.5rem; }

/* Athlete Tests tab (#128) */
.tests-grid { display: grid; gap: 1rem; }
.tests-card__title { margin: 0 0 0.25rem; font-size: 1.05rem; }
.tests-card__latest { margin: 0.1rem 0 0.4rem; }
.tests-card__latest strong { font-size: 1.4rem; }
.tests-card__facts { display: flex; flex-wrap: wrap; gap: 0.25rem 1.25rem; margin: 0 0 0.4rem; }
.tests-card__facts dt { font-size: 0.75rem; color: var(--dim); }
.tests-card__facts dd { margin: 0; font-weight: 600; }
.tests-card__band { margin: 0.25rem 0 0.5rem; font-weight: 500; }
.tests-card__chart { overflow-x: auto; }
.tests-card__progress-note { font-size: 0.85rem; margin: 0.25rem 0 0.5rem; }
.tests-ladder { list-style: none; margin: 0.5rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.25rem 1rem; font-size: 0.82rem; }
.tests-ladder__tier { display: inline-flex; gap: 0.35rem; align-items: baseline; }
.tests-ladder__label { font-weight: 600; }
.tests-ladder__tier--attained .tests-ladder__mark { color: var(--green); }

/* --- Drills library (#143) -------------------------------------------------- */
.drill-sequence__items { margin: 0 0 0.5rem; padding-left: 1.25rem; }
.drills-table th[scope="row"] { text-align: left; font-weight: 600; }
.drill-row--retired { opacity: 0.6; }

/* Drills (#144) */
.drills-block { margin-top: 0.75rem; }
.drills-block__title { font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--dim); margin: 0.5rem 0 0.25rem; }
.drill-list { margin: 0; padding-left: 1.25rem; font-size: 0.9rem; }
.drill-item { margin-bottom: 0.3rem; }
.drill-item summary { cursor: pointer; }
.drill-item__name { font-weight: 600; }
.drill-item__meta { color: var(--dim); }
.drill-item__body { padding: 0.25rem 0 0.25rem 0.25rem; }
.drill-item__body p { margin: 0.25rem 0; }
.drill-item__note { font-size: 0.85rem; color: var(--dim); font-style: italic; }
.drills-section .piece-table input[type=text] { width: 100%; }
.drills-section .input--short { width: 4.5rem; }
.drills-warmup > summary { cursor: pointer; }


/* =============================================================================
   Athlete pages (restyle D, #156): home / week, session detail + list, progress, tests, technique
   Zero client JS, no inline styles in the athlete components — everything below is a class.
   ============================================================================= */
:root {
  /* Technique group colours (series in the group line chart + its legend). */
  --g-catch: var(--accent); --g-finish: var(--amber); --g-bladework: var(--green); --g-drive: var(--cyan); --g-recovery: #FF7AC6;
}

/* Small shared bits */
.mini-label { display: block; font-family: var(--mono); font-size: 0.7rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--dim); }
.chip-row { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.chip-row--center { align-items: center; }
.mini-label + .chip-row { margin-top: 0.25rem; }
.num { text-align: right; font-variant-numeric: tabular-nums; }
.badge--target { text-transform: none; letter-spacing: 0.04em; }
.stamp--small { font-size: 0.65rem; border-width: 2px; padding: 0.05rem 0.45rem; letter-spacing: 0.14em; transform: rotate(4deg); margin-left: 0.4rem; vertical-align: middle; }
.chip-row > .stamp--small, .chip-row--center > .stamp--small { margin-left: 0; }
.card__lead { margin: 0 0 0.25rem; font-family: var(--mono); font-weight: 700; }
.card__lead-in { margin: 0 0 0.35rem; }
.chart-caption { font-size: 0.8rem; }
.legend-item { display: inline-flex; align-items: center; gap: 0.35rem; white-space: nowrap; margin-right: 0.75rem; }
.legend-dot { width: 10px; height: 10px; flex: none; display: inline-block; }
.delta--good { color: var(--green); }
.delta--down { color: var(--red); }

/* Focus lights: 10px dots that glow in their own colour (no box-shadow — D25 — so the glow is a radial gradient). */
.rdot { --c: var(--faint); display: inline-block; flex: none; width: 16px; height: 16px; vertical-align: middle;
  background: radial-gradient(circle closest-side, var(--c) 0 62%, color-mix(in srgb, var(--c) 45%, transparent) 70%, transparent 100%); }
.rdot--red { --c: var(--red); } .rdot--amber { --c: var(--amber); } .rdot--green { --c: var(--green); }
.rdot--bump { outline: 1px solid var(--c); outline-offset: -2px; }

/* Greeting + landing */
.greeting { margin: 0 0 0.75rem; }
.kicker + .greeting { margin-top: -0.1rem; }
.landing-links { margin-top: 0.5rem; gap: 0.75rem; }
.mileage-card .kicker { margin: 0; }
.mileage-card__headline { margin: 0; font-family: var(--mono); font-weight: 800; font-size: clamp(32px, 8vw, 48px); line-height: 1.1; color: var(--amber); }
.mileage-card__headline strong { font-size: inherit; color: inherit; }
.mileage-card__unit { font-size: 1rem; font-weight: 600; color: var(--dim); }
.mileage-card__season { margin: 0; font-family: var(--mono); font-size: 0.8rem; }

/* Week header + nav */
.week-header { padding: 0.75rem 1rem; margin-bottom: 1rem; }
.week-header .kicker { margin: 0; }
.week-header__range { margin: 0 0 0.5rem; font-family: var(--mono); font-weight: 700; font-size: 0.95rem; }
.week-header__stats { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem 1rem; font-family: var(--mono); font-size: 0.9rem; }
.week-header__stats strong { color: var(--amber); font-size: 1.15rem; }
.week-header__pct { margin-left: 0.4rem; color: var(--accent); font-weight: 700; }
.week-nav { display: flex; justify-content: space-between; align-items: center; gap: 0.5rem; margin-bottom: 0.75rem; }

/* Session cards */
.session-wrap { margin-bottom: 1.25rem; }
.session-eyebrow { margin: 0 0 0.3rem 0.1rem; font-size: 0.7rem; letter-spacing: 0.18em; color: var(--dim); }
.session-open { margin: 1rem 0 0; }
.next-session-card { margin-bottom: 0.5rem; }
.next-session-empty { margin-bottom: 1rem; }
.next-tag { display: inline-flex; align-items: center; gap: 0.4rem; margin-right: 0.7rem; color: var(--accent); font-weight: 800; }
.next-tag::before { content: ""; width: 8px; height: 8px; background: var(--accent); clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); }
.session-card { padding: 0.85rem; margin: 0; }
.session-card__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 0.5rem; margin-bottom: 0.5rem; }
.session-title { margin: 0 0 0.15rem; font-family: var(--mono); font-weight: 700; font-size: 1rem; text-transform: uppercase; letter-spacing: 0.05em; }
.session-replaces { margin: 0 0 0.3rem; font-family: var(--mono); font-size: 0.68rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--accent); }
.session-structure { margin: 0 0 0.1rem; font-family: var(--mono); font-size: 0.85rem; color: var(--dim); }
.session-zone { margin-left: 0.4rem; color: var(--accent); }
.session-warn { margin: 0.15rem 0 0; font-size: 0.82rem; color: var(--amber); }
.session-notes { margin: 0.35rem 0 0; font-size: 0.85rem; font-style: italic; color: var(--dim); }
.session-block { margin-top: 0.6rem; }
.result-line { font-family: var(--mono); font-size: 0.88rem; }
.result-note { margin: 0.5rem 0 0; font-size: 0.82rem; color: var(--dim); }
.result-notes { margin-top: 0.4rem; font-size: 0.82rem; color: var(--dim); }
.result-notes p { margin: 0.1rem 0; }
.session-focus__item { margin-top: 0.25rem; font-size: 0.85rem; }
.erg-result__intervals { margin-top: 0.5rem; font-size: 0.85rem; }
.erg-result__intervals > summary { cursor: pointer; color: var(--dim); user-select: none; font-family: var(--mono); font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase; }
.erg-result__intervals .erg-intervals { margin-top: 0.35rem; }
.interval-table td, .interval-table th { font-family: var(--mono); }
.interval-table th.num { text-align: right; }
.athlete-crews { margin-top: 0.75rem; }
.athlete-crew { margin-top: 0.6rem; padding: 0.5rem 0.75rem; background: var(--fill-2); border: 1px solid var(--line-soft); font-size: 0.9rem; }
.athlete-crews > .athlete-crew:first-child { margin-top: 0; }
.athlete-crew--tbc { color: var(--dim); font-family: var(--mono); font-size: 0.8rem; letter-spacing: 0.08em; text-transform: uppercase; }
.athlete-crew__title { margin-bottom: 0.3rem; font-family: var(--mono); font-weight: 700; letter-spacing: 0.06em; }
.seat-chip { padding: 0.1rem 0.5rem; border: 1px solid var(--line-soft); background: var(--fill); font-family: var(--mono); font-size: 0.78rem; }
.seat-chip--me { border-color: var(--accent); background: var(--accent); color: var(--accent-ink); font-weight: 700; }

/* Collapsed rows (past + transferred sessions): plate--flat details, status chip right-aligned */
.collapsed-row { display: flex; align-items: center; gap: 0.5rem; list-style: none; }
.collapsed-row::-webkit-details-marker { display: none; }
.collapsed-row::before { content: "▸"; color: var(--accent); font-size: 0.8rem; }
details[open] > .collapsed-row::before { content: "▾"; }
.collapsed-row__when { font-family: var(--mono); font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--dim); white-space: nowrap; }
.collapsed-row__title { flex: 1; min-width: 0; font-size: 0.9rem; font-weight: 500; }
.collapsed-body { padding: 0.6rem 0.8rem 0.2rem; }
.collapsed-body .session-wrap { margin-bottom: 0.6rem; }
.session-transferred { opacity: 0.85; }
.session-transferred .collapsed-body { margin: 0; }
/* Cancelled sessions (D21): struck-through title, no opacity (keeps the contrast pairs valid) */
.session-cancelled__title { text-decoration: line-through; color: var(--dim); }
.session-cancelled .collapsed-body { margin: 0; }
.session-cancelled a { color: inherit; text-decoration: underline; }
.session-cancelled-banner { margin-bottom: 1rem; padding: 0.8rem 1rem; }
.session-row--cancelled .session-row-title { text-decoration: line-through; color: var(--dim); }

/* Tabs on the athlete pages share the nav-tab look (progress / tests / technique selectors, block + category + range chips) */
.block-tabs, .range-tabs, .category-tabs { gap: 6px; border-bottom: 0; }
.block-tab, .range-tab, .category-tab {
  display: inline-block; padding: 5px 10px; border: 1px solid var(--line-soft); background: transparent; text-decoration: none;
  font-family: var(--mono); font-size: 11px; font-weight: 400; letter-spacing: 0.1em; text-transform: uppercase; line-height: 1.5; color: var(--dim);
}
.block-tab:hover, .range-tab:hover, .category-tab:hover { color: var(--text); background: var(--accent-a); border-color: var(--line-soft); }
.block-tab--active, .range-tab--active, .category-tab--active {
  color: var(--accent); border-color: var(--accent); background: var(--accent-a); box-shadow: inset 0 0 14px rgba(196, 77, 255, 0.18); font-weight: 600;
}
.block-tab:focus-visible, .range-tab:focus-visible, .category-tab:focus-visible { outline: 2px solid var(--cyan); outline-offset: 3px; }

/* Sessions list: thin-divider rows (weekday · title · result · status) */
.session-week-header { border-bottom: 1px solid var(--line); }
.session-week-label { font-family: var(--mono); font-size: 0.75rem; letter-spacing: 0.24em; text-transform: uppercase; color: var(--accent); }
.session-week-dates { font-family: var(--mono); color: var(--dim); }
.session-row { border-bottom: 1px solid var(--line-soft); }
.session-row:hover { background: var(--accent-a); }
.session-row-date { font-family: var(--mono); font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--dim); }
.session-row-title { font-family: var(--mono); font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.04em; }
.session-row-result { font-family: var(--mono); color: var(--amber); }
.session-row--off-prog { opacity: 0.8; }
.session-row-offprog-label { display: block; font-family: var(--mono); font-size: 0.6rem; font-style: normal; font-weight: 400; letter-spacing: 0.2em; text-transform: uppercase; color: var(--dim); }
.session-row-chip--offprog { --chip-edge: var(--faint); --chip-ink: var(--dim); border-style: dashed; background: transparent; }

/* Session detail: each section is a plate with a kicker heading */
.session-detail-meta { font-family: var(--mono); letter-spacing: 0.12em; text-transform: uppercase; color: var(--dim); }
.session-section { padding: 0.9rem 1rem; margin-bottom: 1rem; --plate: var(--fill); }
.session-section-title { margin: 0 0 0.6rem; padding-bottom: 0.35rem; border-bottom: 1px solid var(--line-soft); font-size: 0.75rem; letter-spacing: 0.24em; color: var(--accent); }
.session-detail-dl dt { font-family: var(--mono); font-size: 0.7rem; letter-spacing: 0.14em; text-transform: uppercase; }
.session-detail-dl dd { font-family: var(--mono); }
.session-detail-dl dd.coaching-notes { font-family: var(--sans); }
.prescription-structure { font-family: var(--mono); }
.completion-km, .completion-duration { font-family: var(--mono); color: var(--amber); }
.completion-pb-banner {
  float: right; max-width: 60%; margin: 0 0 0.3rem 0.5rem; padding: 0.1rem 0.5rem; border: 2px solid var(--green); background: transparent; color: var(--green);
  font-family: var(--mono); font-size: 0.68rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; transform: rotate(3deg);
}
.completion-detail { clear: right; }
.focus-item { align-items: center; }
.focus-bumped { margin-left: 0; }
.provenance-block { padding: 0.5rem 0.8rem; font-family: var(--mono); }
.provenance-summary { font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase; }

/* Progress */
.mileage-headline__value { font-family: var(--mono); font-size: 1rem; font-weight: 600; color: var(--text); }
.mileage-headline__value strong { font-size: clamp(28px, 7vw, 40px); font-weight: 800; color: var(--amber); }
.mileage-headline__breakdown { font-family: var(--mono); }
.percentile-row__value { font-family: var(--mono); color: var(--amber); }
.stat dd { font-family: var(--mono); color: var(--amber); }

/* Tests */
.tests-card { padding: 1rem; }
.tests-card__title { margin: 0 0 0.25rem; font-size: 0.75rem; letter-spacing: 0.24em; color: var(--accent); }
.tests-card__latest strong { font-family: var(--mono); font-size: clamp(32px, 8vw, 48px); font-weight: 800; line-height: 1.1; color: var(--amber); }
.tests-card__latest .stamp { margin-left: 0.6rem; }
.tests-card__facts dt { font-family: var(--mono); letter-spacing: 0.14em; text-transform: uppercase; }
.tests-card__facts dd { font-family: var(--mono); }
.tests-card__progress-note { font-family: var(--mono); font-size: 0.7rem; letter-spacing: 0.1em; text-transform: uppercase; }
.tests-ladder { display: block; margin: 0.6rem 0 0; font-size: 0.82rem; }
.tests-ladder__tier { display: grid; grid-template-columns: 1fr auto 5.5rem; gap: 0.5rem; align-items: baseline; padding: 0.3rem 0; border-bottom: 1px solid var(--line-soft); font-family: var(--mono); }
.tests-ladder__tier:last-child { border-bottom: 0; }
.tests-ladder__label { text-transform: uppercase; letter-spacing: 0.06em; }
.tests-ladder__tier > span:nth-child(2) { color: var(--amber); text-align: right; }
.tests-ladder__tier > span:nth-child(3) { text-align: right; color: var(--dim); }
.tests-ladder__tier--attained .tests-ladder__label { color: var(--green); }
.tests-ladder__tier--attained .tests-ladder__mark { color: var(--green); }

/* Technique */
.matrix-table th, .matrix-table td { font-family: var(--mono); font-size: 0.8rem; }
.matrix-table__name { font-family: var(--sans); font-size: 0.85rem; position: sticky; left: 0; z-index: 1; background: var(--fill); border-right: 1px solid var(--line-soft); }
.matrix-table thead th:first-child { position: sticky; left: 0; z-index: 2; }
.matrix-table__row--focus .matrix-table__name { background: linear-gradient(var(--accent-a), var(--accent-a)), var(--fill); }
.matrix-table__group-header th { background: var(--accent-a); color: var(--accent); font-size: 0.7rem; letter-spacing: 0.24em; text-transform: uppercase; }
.matrix-table__score { color: var(--text); }
.score-on { color: var(--accent); }
.score-off { color: var(--faint); }
.matrix-table__focus, .focus-star { color: var(--amber); }
.matrix-table__note { font-family: var(--sans); }
.focus-history__lights { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem; }

/* Drills (athlete view): <details> rows on flat plates, cues in sans, video links as buttons */
.drills-warmup { margin-bottom: 0.5rem; padding: 0.4rem 0.65rem; background: var(--fill); border: 1px solid var(--line-soft); }
.drills-warmup > summary, .drills-block__title { font-family: var(--mono); font-size: 0.7rem; letter-spacing: 0.2em; color: var(--dim); }
.drill-list { list-style: none; padding: 0; counter-reset: drill; display: grid; gap: 0.4rem; margin: 0.4rem 0 0; }
.drill-item { margin: 0; padding: 0.45rem 0.65rem; background: var(--fill); border: 1px solid var(--line-soft); }
.drill-item__name { font-family: var(--mono); font-size: 0.82rem; text-transform: uppercase; letter-spacing: 0.04em; }
.drill-item__name::before { counter-increment: drill; content: counter(drill, decimal-leading-zero) " "; color: var(--accent); }
.drill-item__meta { font-family: var(--mono); font-size: 0.78rem; }
.drill-item__videos { display: flex; flex-wrap: wrap; gap: 0.4rem; }

/* --- Utility classes replacing coach-page inline styles (restyle E #157; tested: no style= in coach files) --- */
.u-block-tight { display:block; margin:0.2rem 0; }
.u-mt0 { margin-top:0; }
.u-flexrow-top { display:flex; gap:0.75rem; flex-wrap:wrap; margin-top:0.5rem; }
.u-block-mt1 { display:block; margin-top:0.5rem; }
.u-mt3 { margin-top:1.5rem; }
.u-mt-075 { margin-top:0.75rem; }
.u-flexrow-end { display:flex; gap:0.75rem; flex-wrap:wrap; align-items:flex-end; }
.u-w100 { width:100%; }
.u-tl, .att-table .u-tl { text-align:left; }
.u-m-25-0-75 { margin:0.25rem 0 0.75rem; }
.u-m0 { margin:0; }
.u-m-15-0-75 { margin:0.15rem 0 0.75rem; }
.u-ml-3 { margin-left:0.3rem; }
.u-flexrow-actions { display:flex; gap:0.5rem; align-items:center; flex-wrap:wrap; margin:0.5rem 0; }
.u-inline { display:inline; }
.u-fw4 { font-weight:400; }
.u-flexrow-start { display:flex; gap:0.5rem; align-items:flex-start; }
.u-flex1 { flex:1; }
.u-ok-note { color:var(--green); margin:0.25rem 0 0; }
.u-m-0-0-25 { margin:0 0 0.25rem; }
.u-m-0-0-5 { margin:0 0 0.5rem; }
.u-m-5-0 { margin:0.5rem 0; }
.u-mb-4 { margin-bottom:0.4rem; }
.u-mt3-pad { margin-top:1.5rem; padding:1rem; }
.u-m-25-0-0 { margin:0.25rem 0 0; }
.u-fs-1 { font-size:1rem; }
.u-fs-9-mb { font-size:0.9rem; margin-bottom:0.2rem; }
.u-hidden { display:none; }
.u-m-5-0-25 { margin:0.5rem 0 0.25rem; }
.u-m-75-0-25 { margin:0.75rem 0 0.25rem; }
.u-fs-11 { font-size:1.1rem; }
.u-fs-1-m0 { font-size:1rem; margin:0; }
.u-m-15-0 { margin:0.15rem 0; }

/* =============================================================================
   Restyle E (#157) — coach pages. Class names and DOM hooks are unchanged; this block only restyles.
   ============================================================================= */

/* Fieldsets: kicker legends, soft plate edge. */
.editor-fieldset { border-color: var(--line-soft); background: var(--fill-2); position: relative; }
.editor-fieldset legend { font-family: var(--mono); font-size: 0.7rem; letter-spacing: 0.24em; text-transform: uppercase; color: var(--accent); font-weight: 600; padding: 0 0.5rem; }
.editor-fieldset--confirm, .editor-fieldset:has(input[name="confirm"]) { border-color: var(--amber-b); background: var(--amber-a); }

/* Boats: class code as a faint watermark (reference .teamCard .watermark). */
.crew-boat { overflow: hidden; }
.crew-boat[data-class]::after {
  content: attr(data-class); position: absolute; right: 0.6rem; top: 0.2rem; z-index: 0; pointer-events: none;
  font-family: var(--mono); font-weight: 800; font-size: 4.5rem; line-height: 1; color: var(--accent); opacity: 0.07;
}
.crew-boat > * { position: relative; z-index: 1; }
.crew-seat__label { font-family: var(--mono); font-size: 0.78rem; letter-spacing: 0.06em; }
.crews-unassigned__list--away li { text-decoration-color: var(--faint); text-decoration-line: line-through; }

/* Attendance grid: status dots with glow; the glyph stays in the DOM (aria-label on the link) but is not painted. */
.att-cell__link, .att-key { font-size: 0 !important; color: transparent !important; line-height: 0; min-width: 0; padding: 0; width: 1.4rem; height: 1.4rem; display: inline-flex; align-items: center; justify-content: center; background: none !important; border: 0 !important; }
.att-cell__link::before, .att-key::before { content: ""; width: 10px; height: 10px; background: var(--faint); display: block; clip-path: none; }
.att-cell--done .att-cell__link::before, .att-key.att-cell--done::before { background: var(--green); filter: drop-shadow(0 0 8px var(--green)); }
.att-cell--compensated .att-cell__link::before, .att-key.att-cell--compensated::before { background: var(--green-deep); filter: drop-shadow(0 0 8px var(--green-deep)); }
.att-cell--partial .att-cell__link::before, .att-key.att-cell--partial::before { background: linear-gradient(90deg, var(--amber) 50%, transparent 50%); border: 1px solid var(--amber); filter: drop-shadow(0 0 8px var(--amber)); }
.att-cell--missed .att-cell__link::before, .att-key.att-cell--missed::before { background: var(--red); filter: drop-shadow(0 0 8px var(--red)); }
.att-cell--excused .att-cell__link::before, .att-key.att-cell--excused::before { background: none; border: 1px dashed var(--faint);  }
.att-cell--awaiting .att-cell__link::before, .att-key.att-cell--awaiting::before { background: none; border: 1px solid var(--accent); filter: none; }
.att-cell--upcoming .att-cell__link::before { display: none; }
.att-key { vertical-align: middle; margin-right: 0.15rem; }
.att-cell__edit { font-size: 0.7rem; }
.att-table td.att-total, .att-table td:nth-last-child(-n+4) { font-family: var(--mono); }
.att-table td.att-total { color: var(--amber); }
.att-name { background: var(--fill); font-family: var(--mono); font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.06em; }
.att-wrap { background: var(--fill); border-color: var(--line-soft); }

/* Tests table: mono result in amber, Δ colours, tier dots glow. */
.tests-table { font-family: var(--mono); }
.tests-cell__value, .tests-cell__value strong { color: var(--amber); text-decoration: none; font-family: var(--mono); }
.tests-cell--missing, .tests-cell > .tests-cell--missing { color: var(--red); text-transform: uppercase; letter-spacing: 0.2em; font-size: 0.7rem; background: none; }
.tests-cell--excused { color: var(--faint); }
.tests-cell__src { font-size: 0.6rem; text-transform: uppercase; letter-spacing: 0.1em; }
.tier-dot--none { color: var(--faint); } .tier-dot--low { color: var(--amber); text-shadow: 0 0 6px var(--amber); }
.tier-dot--mid { color: var(--cyan); text-shadow: 0 0 6px var(--cyan); } .tier-dot--top { color: var(--green); text-shadow: 0 0 6px var(--green); }
.tests-needs { border-left: 4px solid var(--amber); }

/* Calendar: today = accent glow; type edge colours from the tokens; week actions row. */
.cal-cell--today { background: var(--accent-a); outline: 1px solid var(--accent); outline-offset: -1px; }
.cal-chip { background: var(--fill); }
.cal-chip__time, .cal-att { font-family: var(--mono); }
.cal-table { background: var(--fill); }
.cal-week-actions .btn--danger, .cal-week-actions .btn--secondary { white-space: nowrap; }

/* Drills: retired rows dim + strike; table head kickers. */
.drills-table tr.is-retired td, tr.drill-row--retired td { opacity: 0.5; text-decoration: line-through; text-decoration-color: var(--faint); }
tr.is-retired .btn, tr.drill-row--retired .btn { text-decoration: none; }

/* Trends: controls tabs and blocks. */
.trend-block { background: var(--fill); border: 1px solid var(--line-soft); padding: 0.75rem 1rem; margin-bottom: 1rem; }
.trend-block h2, .trend-block h3 { font-size: 0.75rem; letter-spacing: 0.24em; color: var(--accent); }

/* Phones: calendar / attendance scroll inside their own container, never the page. */
@media (max-width: 600px) {
  .crew-boat[data-class]::after { font-size: 3rem; }
  .cal-week-actions { gap: 0.4rem; }
}

/* Technique matrix fits its container (#169): fixed layout, % widths, names/notes wrap, no horizontal scroll. */
.matrix-table-wrapper { overflow-x: visible; }
.matrix-table { table-layout: fixed; width: 100%; }
.matrix-table th, .matrix-table td { padding: 0.4rem 0.35rem; }
.matrix-table__name { width: 26%; white-space: normal; min-width: 0; overflow-wrap: anywhere; position: static; }
.matrix-table thead th:first-child { position: static; }
.matrix-table__score { width: 7rem; white-space: nowrap; }
.matrix-table__progress { width: 17%; white-space: normal; overflow-wrap: anywhere; }
.matrix-table__focus { width: 2rem; white-space: nowrap; }
.matrix-table__scored-on { width: 5.5rem; white-space: nowrap; }
.matrix-table__note { max-width: none; white-space: normal; overflow-wrap: anywhere; overflow: visible; text-overflow: clip; }
.matrix-table__note-inline { display: none; }
@media (max-width: 600px) {
  .matrix-table__scored-on, .matrix-table__note { display: none; }
  .matrix-table__name { width: auto; }
  .matrix-table__score { width: 5.2rem; }
  .matrix-table__progress { width: 5rem; }
  .matrix-table__note-inline { display: block; color: var(--dim); font-size: 0.75rem; }
}

/* --- Athlete pages use the wide column on desktop (#171) ----------------------
   Signed-in pages are `.page--wide` (1200px); below 900px every rule here is inert, so phones are unchanged.
   SVG charts already scale (`.chart { width:100%; height:auto }` + viewBox). */
@media (min-width: 900px) {
  .session-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(26rem, 1fr)); gap: 0 1.25rem; align-items: start; }
  .session-grid > .session-wrap, .session-grid > .session-collapsed { margin-bottom: 1.25rem; }
  .session-grid > #next-session { grid-column: 1 / -1; }
  .section-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 1.5rem; align-items: start; }
  .tests-grid { grid-template-columns: repeat(auto-fill, minmax(24rem, 1fr)); align-items: start; }
  .block-cards { grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr)); }
  .benchmark-charts { grid-template-columns: repeat(auto-fill, minmax(24rem, 1fr)); }
}