/* ─── Bloc Athletics | brand tokens ─────────────────────────────────────
   Palette approved 30 July 2026. Source of truth: section 11 of
   06 Branding/Bloc Style Guide.md.
   Two slots, one job each: Bloc Navy is the FIXED brand and never rebrands
   with the team colour engine. The accent carries every action element and
   is the one value a coach replaces. ─────────────────────────────────── */
:root {
  --hdr-icon-gap: 12px;   /* standard spacing between header action icons (all pages) */
  --msg-gap:      14px;   /* standard vertical spacing between message tiles (all messaging) */
  /* Bloc Navy: the FIXED brand. Icon field, splash, wordmark, og, chrome.
     These three are the generated asset field stops, so app chrome and the
     app icon are the same navy. NEVER rebrands with the team colour. */
  --navy:        #1D2F52;
  --navy-dark:   #111E38;
  --navy-light:  #24396B;
  /* v5.130.0: shell surface tokens; navy family stays usable as ink in dark */
  --shell:       #1D2F52;
  --shell-dark:  #111E38;
  --shell-light: #24396B;
  /* The --crimson family is kept as an ALIAS and now holds THE ACCENT, not
     crimson. The name survives because 243 rules and applyTeamColor() write
     it; renaming them all is a wide risk for no gain, exactly as the legacy
     ft prefix is kept elsewhere. Ships as Cobalt. */
  --crimson:     #2A54BE;
  --crimson-soft:#2A54BE1F;
  /* v5.157.0: --crimson is for FILLS. Accent TEXT uses --crimson-ink, which is
     darkened on light and lightened on dark so every team colour clears 4.5:1.
     applyTeamColor() recomputes it per swatch and per theme. Default Cobalt
     already passes on white (6.75) so light needs no shift. */
  --crimson-ink: #2A54BE;
  --steel:       #7C879B;
  --lane-light:  #EEF1F6;
  --bg:          #ffffff;
  --card:        #ffffff;   /* v5.128.0: card/surface token (white in light, slate in dark) */
  --text:        #181C24;
  --text-soft:   #6b6b73;
  --text-mute:   #667084;   /* v5.156.0: was #7C879B = 3.62:1 on white, below the 4.5 minimum. #667084 = 4.98. Dark mode unchanged, it already passes at 5.65. */
  --border:      #E3E7EF;
  --border-soft: #EEF1F6;
  --green:       #12A594;
  --amber:       #C57B16;
  /* The accent, under its canonical names. Same value as the --crimson
     alias above; applyTeamColor() writes both so either name works.
     Was #2F6BFF Electric Lane, a stray legacy blue that never rebranded. */
  --accent:      #2A54BE;   /* Cobalt: default accent, all actions */
  --accent-soft: #2A54BE1F; /* accent tint: chips, avatars, code pills */
  --accent-ink:  #2A54BE;   /* accent TEXT. NEVER put the raw accent on text. */
  /* Channels for rgba() glows so they recolour with the team accent. Before
     this the glow was 60 hardcoded crimson rgba values that stayed crimson
     whatever the coach picked, against what the style guide promises. */
  --accent-rgb:  42,84,190;
  /* Navy family as rgb channels, so an rgba() scrim or hairline can hold the
     brand navy without keeping a second copy of the value. No dark override:
     these are compositing channels, not the themed --navy ink token. */
  --navy-rgb:       29,47,82;
  --navy-dark-rgb:  17,30,56;
  --navy-light-rgb: 36,57,107;
  /* ONE glow for every action element, so the level is tuned in one place.
     Toned down 4 Aug: the previous set ran from .35 to .45 alpha at up to
     16px blur and read as a hard halo on every button at once. */
  --glow:        0 2px 8px rgba(var(--accent-rgb),.18);
  --glow-lg:     0 6px 18px rgba(var(--accent-rgb),.16);
  /* Copper: EARNED MOMENTS ONLY (a PR, a streak, a championship). Always
     carries a label or an icon. Never a bare status chip: it sits 1.07 from
     the caution amber and would read as a status. */
  --copper:      #A9603A;
  --copper-ink:  #A65E39;
  /* The BLOC CTA. Fixed at Cobalt, and applyTeamColor() never writes to it.
     Bloc owns every screen before sign in, so the buttons there stay Bloc's
     colour no matter what a coach has picked. Once a coach is inside their
     class, every control takes the team colour as normal. */
  --bloc-cta:      #2A54BE;
  --bloc-cta-ink:  #2A54BE;
  --bloc-cta-rgb:  42,84,190;
  --ok-tint:     #E2F4F1;
  --ok-ink:      #0C7A6D;
  /* v5.157.0 status triad. Was hardcoded #2E9E5B/#D98E1B/#B23343 in six
     places and theme blind: green and amber failed on white, red failed on
     the dark card. Tokenised and tuned per canvas. */
  --stat-good:   #1E7A42;
  --stat-warn:   #8E6811;
  --stat-bad:    #A32236;
  --cau-tint:    #FBEAD4;
  --cau-ink:     #8A560F;
  /* Rest day palette: muted brand tones (cool navy-tinged neutrals) */
  --rest-bg:     #EEF1F7;
  --rest-accent: #24396B;
  --rest-soft:   #FAF6F2;
  --shadow-sm:   0 1px 2px rgba(0,0,0,0.04);
  --radius-sm:   8px;
  --radius-md:   12px;
  --radius-lg:   16px;
  --radius-btn:  6px;   /* action buttons (cards keep --radius-md) */
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-top:    env(safe-area-inset-top, 0px);
  /* STANDARD section rhythm — space above each section heading, and the gap
     from a heading down to its content. Used app-wide via .section-label. */
  --section-gap:       28px;
  --section-label-gap: 10px;
  /* Display / heading typeface. Body + UI keep the system font for legibility. */
  --font-display: "Kanit", -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/* ─── Reset / base ─────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html, body {
  margin: 0; padding: 0;
  background: var(--shell);
  color: var(--text);
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  font-size: 16px;
  line-height: 1.5;
  min-height: 100vh;
  /* `clip` prevents sideways scroll WITHOUT turning the root into a scroll
     container (which `hidden` does, and which breaks position:sticky headers
     and lets position:fixed nav drift). */
  overflow-x: clip;
}
button { font: inherit; cursor: pointer; border: none; background: none; color: inherit; padding: 0; }
input { font: inherit; color: inherit; }

.hidden { display: none !important; }
.sr-only {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

#app {
  max-width: 480px;
  margin: 0 auto;
  padding-bottom: calc(70px + var(--safe-bottom));
  min-height: 100vh;
}

/* ─── Launch splash ────────────────────────────────────────────────── */
/* Quik-style loader: tiger crest sits dark on a near-black navy screen; a light
   sweep (masked to the crest shape) shimmers across and reveals it. */
.splash {
  position: fixed; inset: 0; z-index: 2000;
  display: flex; align-items: center; justify-content: center;
  background: radial-gradient(120% 100% at 50% 42%, #142339 0%, #0a1120 72%);
  transition: opacity 0.5s ease;
}
.splash.hide { opacity: 0; pointer-events: none; }
/* The crest shape masks everything inside, so the moving light bar only shows on the logo. */
.splash-mark {
  position: relative; width: 150px; height: 150px;
  -webkit-mask-image: url(assets/bloc-mark.png); mask-image: url(assets/bloc-mark.png);
  -webkit-mask-size: contain; mask-size: contain;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center; mask-position: center;
}
.splash-logo {
  width: 100%; height: 100%; object-fit: contain; display: block;
  filter: brightness(1) saturate(1.05);
}
/* slower silver light bar that sweeps across the crest on a loop */
.splash-shine {
  position: absolute; top: -20%; left: 0; height: 140%; width: 60%; pointer-events: none;
  background: linear-gradient(100deg, transparent, rgba(214,222,235,0.85) 50%, transparent);
  transform: translateX(-160%);
  animation: splash-shine 2.6s ease-in-out infinite;
}
@keyframes splash-shine {
  0%   { transform: translateX(-160%); }
  55%  { transform: translateX(280%); }
  100% { transform: translateX(280%); }
}
@media (prefers-reduced-motion: reduce) {
  .splash-shine { display: none; }
}

/* ─── Headers ──────────────────────────────────────────────────────── */
.app-header {
  background: var(--shell);
  color: #fff;
  padding: calc(14px + var(--safe-top)) 18px 14px;
  border-radius: 0 0 22px 22px;
  position: sticky;
  top: 0;
  z-index: 20;
}
.app-header-row { display: flex; align-items: center; gap: var(--hdr-icon-gap); }
.app-header-text { display: flex; flex-direction: column; gap: 2px; flex: 1 1 auto; min-width: 0; }
.greeting    { font-size: 13px; opacity: 0.78; font-weight: 600; }
.screen-name { font-family: var(--font-display); font-style: italic; text-transform: uppercase; font-size: 27px; font-weight: 700; letter-spacing: 0.01em; line-height: 1.1; }
.app-logo {
  width: 40px; height: 40px;
  display: flex; align-items: center; justify-content: center;
}
.app-logo img { width: 100%; height: 100%; object-fit: contain; }
/* A club slot with no uploaded logo: the club's initials on the team colour,
   never the Bloc mark. Bloc owns the chrome before sign in, the club owns
   every coaching surface after it. */
.club-init {
  width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;
  border-radius: 11px; background: var(--accent); color: #fff;
  font-family: var(--font-display); font-style: italic; font-weight: 800;
  font-size: 13px; letter-spacing: .02em; line-height: 1;
}
.msg-head-av .club-init, .conv-av .club-init { border-radius: 50%; font-size: 18px; }
.header-meta { display: flex; gap: 9px; margin-top: 14px; flex-wrap: wrap; }
.header-pill {
  background: rgba(255,255,255,0.13);
  font-size: 14px;
  font-weight: 600;
  padding: 6px 14px;
  border-radius: 13px;
}

/* ─── Page body ────────────────────────────────────────────────────── */
.page-body { padding: 16px 14px 24px; }
.section-label {
  font-size: 12px;
  color: var(--text-mute);
  text-transform: uppercase;
  letter-spacing: 0.8px;
  font-weight: 800;
  margin: var(--section-gap) 0 var(--section-label-gap);
}
.section-label:first-child { margin-top: 0; }

/* ─── Cards ────────────────────────────────────────────────────────── */
.card {
  background: var(--card);
  border: 0.5px solid var(--border);
  border-radius: var(--radius-md);
  padding: 14px;
  margin-bottom: 10px;
}
.card.accent-crimson { border-left: 3px solid var(--crimson); border-radius: 0 var(--radius-md) var(--radius-md) 0; }
.card.accent-navy    { border-left: 3px solid var(--navy);    border-radius: 0 var(--radius-md) var(--radius-md) 0; }
.card.accent-steel   { border-left: 3px solid var(--steel);   border-radius: 0 var(--radius-md) var(--radius-md) 0; }
.card.accent-green   { border-left: 3px solid var(--green);   border-radius: 0 var(--radius-md) var(--radius-md) 0; }
.card-cat {
  font-size: 11px;
  color: var(--text-mute);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  font-weight: 500;
  margin: 0 0 4px;
}
.card-title  { font-size: 16px; font-weight: 500; color: var(--navy); margin: 0 0 6px; }
.card-detail { font-size: 14px; line-height: 1.55; color: var(--text); margin: 0 0 8px; }
.card-target { font-size: 12px; color: var(--crimson-ink); font-weight: 500; }

/* ─── Phase card (gradient) ────────────────────────────────────────── */
.phase-card {
  background: linear-gradient(135deg, var(--shell) 0%, var(--shell-light) 100%);
  color: #fff;
  border-radius: var(--radius-md);
  padding: 14px 16px;
  margin: 0 0 14px;
}
.phase-eyebrow { font-size: 10px; opacity: 0.7; text-transform: uppercase; letter-spacing: 0.6px; }
.phase-title   { font-size: 16px; font-weight: 500; margin: 4px 0 8px; }
.phase-bar     { background: rgba(255,255,255,0.2); height: 5px; border-radius: 3px; overflow: hidden; }
.phase-bar-fill{ background: var(--crimson); height: 100%; transition: width 0.4s ease; }
.phase-foot    { display: flex; justify-content: space-between; font-size: 11px; opacity: 0.85; margin-top: 8px; }

/* ─── Stats row ────────────────────────────────────────────────────── */
.stats-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0 0 14px; }
.stat {
  background: var(--lane-light);
  border-radius: var(--radius-sm);
  padding: 10px 12px;
}
.stat-label { font-size: 10px; color: var(--text-mute); text-transform: uppercase; letter-spacing: 0.4px; font-weight: 500; margin: 0; }
.stat-value { font-size: 20px; font-weight: 500; color: var(--navy); margin: 4px 0 0; font-variant-numeric: tabular-nums; }
.stat-sub   { font-size: 10px; color: var(--text-soft); margin: 2px 0 0; }

/* ─── Goals list ───────────────────────────────────────────────────── */
.goals-list { background: var(--card); border: 0.5px solid var(--border); border-radius: var(--radius-md); padding: 6px 14px; }
.goal-row { display: grid; grid-template-columns: 60px 1fr auto; align-items: center; gap: 10px; padding: 9px 0; border-bottom: 0.5px solid var(--border-soft); }
.goal-row:last-child { border-bottom: 0; }
.goal-row.secondary { opacity: 0.92; }
.goal-row.secondary .goal-time { color: var(--navy); font-weight: 400; }
.goal-row.secondary .goal-event { color: var(--text-mute); font-style: italic; font-size: 12px; }
.goal-dist { font-size: 11px; color: var(--text-mute); font-weight: 500; }
.goal-event { font-size: 13px; color: var(--text); font-weight: 500; }
.goal-time { font-size: 14px; color: var(--crimson-ink); font-weight: 500; font-variant-numeric: tabular-nums; }

/* Make stat tile clickable on Home (cursor + active state) */
.stat.clickable {
  cursor: pointer;
  text-align: left;
  width: 100%;
  display: block;
  transition: background 0.12s, transform 0.08s;
}
.stat.clickable:active { background: var(--border-soft); transform: scale(0.98); }
.stat.clickable .stat-link {
  display: inline-block;
  font-size: 10px;
  color: var(--crimson-ink);
  margin-top: 4px;
  font-weight: 500;
}

/* ─── CTA Buttons ──────────────────────────────────────────────────── */
.cta {
  background: var(--crimson);
  color: #fff;
  border-radius: var(--radius-btn);
  padding: 14px 16px;
  margin: 0 0 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  text-align: left;
}
.cta:active { transform: scale(0.98); }
.cta-text  { display: flex; flex-direction: column; }
.cta-title { font-size: 15px; font-weight: 500; }
.cta-sub   { font-size: 12px; opacity: 0.9; margin-top: 2px; }
.cta-arrow { font-size: 20px; line-height: 1; }

.cta-rest {
  background: var(--rest-bg);
  color: var(--rest-accent);
  border: 1px solid var(--rest-accent);
  border-radius: var(--radius-btn);
  padding: 14px 16px;
  margin: 0 0 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.btn-secondary {
  background: var(--lane-light);
  color: var(--navy);
  border-radius: var(--radius-btn);
  padding: 12px 14px;
  width: 100%;
  font-weight: 500;
  font-size: 14px;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.btn-secondary svg { width: 18px; height: 18px; flex-shrink: 0; }

/* ─── Lift exercise list ───────────────────────────────────────────── */
.lift-row {
  display: grid; grid-template-columns: 1fr auto auto; gap: 10px;
  align-items: center; padding: 10px 0;
  border-bottom: 0.5px solid var(--border-soft);
}
.lift-row:last-child { border-bottom: 0; }
.lift-vid { flex: 0 0 auto; background: none; border: 0; padding: 2px; cursor: pointer; color: var(--navy-light); opacity: .5; }
.lift-vid:active { opacity: .85; }
.lift-info  { min-width: 0; }
.lift-name  { font-size: 14px; color: var(--text); font-weight: 500; }
.lift-sub   { font-size: 12px; color: var(--text-mute); margin-top: 2px; }
/* Prominent action button so athletes see where to log; logged state is subtle. */
.lift-log {
  font-size: 12.5px;
  background: var(--shell-light);
  color: #fff;
  padding: 8px 16px;
  border-radius: 999px;
  border: 0;
  font-weight: 700;
  white-space: nowrap;
  box-shadow: 0 1px 3px rgba(17,25,45,.20);
  cursor: pointer;
}
.lift-log.done { background: rgba(var(--navy-light-rgb),0.12); color: var(--navy-light); box-shadow: none; }

/* Coach note — navy memo header + white body, only shown when a note exists */
.coach-note { border: 1px solid var(--border); border-radius: 12px; overflow: hidden; margin: 4px 0 2px; }
.coach-note-head { display: flex; align-items: center; gap: 8px; background: var(--shell); color: #fff; padding: 7px 13px; }
.coach-note-ic { display: inline-flex; color: #fff; }
.coach-note-h { font-size: 10.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: #fff; }
.coach-note-body { background: var(--card); padding: 11px 13px; font-size: 13.5px; line-height: 1.5; color: var(--text); white-space: pre-line; }

/* Parent notifications sheet — clean light cards */
.ntf-sub { font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--text-mute); margin: 16px 0 8px; }
.ntf-card { position: relative; display: block; width: 100%; text-align: left; background: var(--card); border: 1px solid var(--border); border-radius: 12px; padding: 13px 15px; margin-bottom: 10px; cursor: pointer; }
.ntf-card-plain { cursor: default; }
.ntf-when { font-size: 12px; font-weight: 700; color: var(--text-mute); text-transform: uppercase; letter-spacing: .03em; }
.ntf-title { font-size: 16px; font-weight: 700; color: var(--navy); margin-top: 3px; padding-right: 18px; }
.ntf-detail { font-size: 13px; color: var(--text); line-height: 1.45; margin-top: 4px; }
.ntf-chev { position: absolute; right: 14px; top: 14px; color: var(--text-mute); font-size: 18px; }

/* Parent home: spacing between weather and the athlete card + edit-athlete link */
.par-idcard-gap { margin-top: 16px; }
.par-edit-kid { display: inline-flex; align-items: center; gap: 4px; margin: 10px 2px 4px; padding: 8px 15px; background: var(--card); border: 1px solid var(--border); border-radius: 999px; font-size: 13px; font-weight: 600; color: var(--navy-light); cursor: pointer; }
.par-edit-kid:active { background: var(--lane-light); }

/* Parent profile: Your athletes cards (mirror the athlete identity grammar) */
.par-athlete-card { display: flex; align-items: center; background: var(--card); border: 1px solid var(--border); border-radius: 12px; margin-bottom: 8px; overflow: hidden; }
.par-athlete-main { flex: 1; min-width: 0; display: flex; align-items: center; gap: 12px; text-align: left; background: none; border: 0; padding: 11px 4px 11px 13px; cursor: pointer; }
.par-athlete-main:active { background: var(--lane-light); }
.par-athlete-edit { flex: 0 0 auto; width: 46px; align-self: stretch; display: flex; align-items: center; justify-content: center; background: none; border: 0; border-left: 1px solid var(--border); color: var(--navy-light); cursor: pointer; }
.par-athlete-edit:active { background: var(--lane-light); }
.par-athlete-av { width: 42px; height: 42px; border-radius: 50%; overflow: hidden; flex: 0 0 auto; background: var(--shell-light); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 14px; }
.par-athlete-av img { width: 100%; height: 100%; object-fit: cover; }
.par-athlete-id { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.par-athlete-name { font-size: 14px; font-weight: 700; color: var(--navy); }
.par-athlete-sub { font-size: 12px; color: var(--text-mute); margin-top: 1px; }

/* Clean parent home cards */
.par-home-card { padding: 14px 15px; }
.ph-status { display: flex; align-items: center; gap: 12px; }
.ph-av { width: 44px; height: 44px; }
.ph-status-id { flex: 1; min-width: 0; }
.ph-name { font-size: 15px; font-weight: 700; color: var(--navy); }
.ph-sub { font-size: 12px; color: var(--text-mute); margin-top: 1px; }
.par-bar { height: 8px; border-radius: 5px; background: #e6eaf2; overflow: hidden; margin: 13px 0 6px; }
.par-bar > i { display: block; height: 100%; background: var(--shell-light); border-radius: 5px; transition: width .3s; }
.par-bar-row { display: flex; align-items: center; justify-content: space-between; font-size: 12.5px; color: var(--text-mute); }
.par-bar-pct { font-weight: 700; color: var(--navy); }
.ph-today { display: flex; align-items: center; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px solid rgba(17,25,45,.08); font-size: 13px; color: var(--text); }
.ph-tick { width: 22px; height: 22px; border-radius: 50%; background: var(--green, #12A594); color: #fff; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.ph-pend { width: 10px; height: 10px; border-radius: 50%; background: var(--shell-light); flex: 0 0 auto; margin: 0 6px; }
.ph-pend-rest { background: #b7c0d0; }
.ph-today-t { flex: 1; min-width: 0; }

/* Parent home: next meet card + RSVP */
.par-meet-card { padding: 0; overflow: hidden; }
.par-meet-top { display: flex; align-items: flex-start; gap: 12px; padding: 13px 14px; cursor: pointer; }
.par-meet-date { flex: 0 0 auto; width: 46px; text-align: center; }
.par-meet-date .pm-mon { display: block; font-size: 10px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--crimson-ink); }
.par-meet-date .pm-day { display: block; font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: 22px; color: var(--navy); line-height: 1; }
.par-meet-info { flex: 1; min-width: 0; }
.par-meet-name { font-size: 15px; font-weight: 700; color: var(--navy); }
.par-meet-meta { font-size: 12px; color: var(--text-mute); margin-top: 2px; }
.par-meet-chev { color: var(--text-mute); font-size: 18px; align-self: center; }
.par-rsvp { display: flex; gap: 8px; padding: 0 14px 14px; }
.par-rsvp-btn { flex: 1; font-size: 13px; font-weight: 600; border-radius: 10px; padding: 10px; cursor: pointer; border: 1px solid var(--border); background: var(--card); color: var(--navy); }
.par-rsvp-btn.yes { background: var(--shell); color: #fff; border-color: var(--shell); }
.par-rsvp-btn.no { background: var(--text-mute); color: #fff; border-color: var(--text-mute); }

/* Logging feedback toast (the reward moment right after logging) */
.ft-toast { position: fixed; left: 50%; bottom: 92px; transform: translate(-50%, 20px); z-index: 4000; display: flex; align-items: center; gap: 10px; background: var(--shell); color: #fff; border-radius: 999px; padding: 11px 18px; box-shadow: 0 10px 28px rgba(10,20,45,.30); opacity: 0; transition: opacity .28s, transform .28s; max-width: 88vw; }
.ft-toast.show { opacity: 1; transform: translate(-50%, 0); }
.ft-toast-ic { display: flex; }
.ft-toast-txt { font-size: 14px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ft-toast-pr { background: #E9B84A; color: #3d2a00; }
.ft-toast-pr .ft-toast-ic { color: #3d2a00; }

/* First-run walkthrough modal */
.wt-modal { text-align: center; }
.wt-ic { color: var(--crimson-ink); display: flex; align-items: center; justify-content: center; margin: 6px auto 14px; }
.wt-ic svg { width: 44px; height: 44px; }
.wt-ic .wt-logo { width: 72px; height: 72px; border-radius: 18px; display: block; }
.wt-modal h3 { margin: 0 0 6px; font-family: var(--font-display, "Kanit"), -apple-system, Arial, sans-serif; font-weight: 800; font-style: italic; text-transform: uppercase; letter-spacing: .02em; color: var(--navy); font-size: 25px; line-height: 1.15; }
.wt-b { font-size: 14px; color: var(--text-mute); line-height: 1.5; margin: 0 0 16px; }
.wt-dots { display: flex; gap: 6px; justify-content: center; margin-bottom: 18px; }
.wt-dot { width: 7px; height: 7px; border-radius: 50%; background: #d4d8e2; transition: width .2s, background .2s; }
.wt-dot.on { background: var(--shell-light); width: 18px; border-radius: 4px; }
.wt-actions { display: flex; align-items: center; gap: 12px; }
.wt-skip { background: none; border: 0; color: var(--text-mute); font-size: 13px; font-weight: 600; cursor: pointer; padding: 8px 4px; }
.wt-next { flex: 1; }

/* Swap-workout-to-another-day sheet (coach) */
.md-list { display: flex; flex-direction: column; gap: 8px; }
.md-day { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; background: var(--card);
  border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; cursor: pointer; }
.md-dow { font-weight: 700; color: var(--navy); font-size: 14px; }
.md-theme { flex: 1; min-width: 0; font-size: 12.5px; color: var(--text-mute); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.md-swap { flex: 0 0 auto; font-size: 18px; color: var(--navy-light); font-weight: 800; }
.md-status { font-size: 13px; color: var(--text-mute); text-align: center; min-height: 16px; margin-top: 12px; }
.md-status.err { color: var(--crimson-ink); }

/* ─── Recent activity list ─────────────────────────────────────────── */
.recent { background: var(--card); border: 0.5px solid var(--border); border-radius: var(--radius-md); padding: 6px 14px; }
.recent-row { display: flex; justify-content: space-between; padding: 8px 0; border-bottom: 0.5px solid var(--border-soft); font-size: 13px; }
.recent-row:last-child { border-bottom: 0; }
.status-pill { font-size: 11px; padding: 2px 8px; border-radius: 10px; }
.status-pill.done    { background: #e1f5ee; color: var(--green); }
.status-pill.today   { background: var(--crimson-soft); color: var(--crimson-ink); font-weight: 500; }
.status-pill.upcoming{ color: var(--text-mute); }
.status-pill.rest    { background: var(--rest-bg); color: var(--rest-accent); }

/* ─── Bottom nav ───────────────────────────────────────────────────── */
.bottom-nav {
  position: fixed;
  bottom: calc(6px + var(--safe-bottom)); left: 12px; right: 12px;
  max-width: 452px; margin: 0 auto;
  background: rgba(var(--navy-rgb), 0.42);
  -webkit-backdrop-filter: blur(4px) saturate(1.2);
  backdrop-filter: blur(4px) saturate(1.2);
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 34px;
  display: flex; justify-content: space-around; gap: 4px;
  padding: 8px 8px;
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.42);
  z-index: 50;
}
.nav-item span:not(.nav-icon) { font-size: 11px; font-weight: 700; }
.nav-item {
  flex: 1;
  display: flex; flex-direction: row; align-items: center; justify-content: center; gap: 8px;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.62);
  padding: 9px 14px;
  border-radius: 24px;
}
.nav-item.active { color: #fff; background: rgba(255, 255, 255, 0.34); font-weight: 800; }
.nav-item.active .nav-icon svg { stroke: #fff; }
.nav-icon { font-size: 28px; line-height: 1; }
.nav-icon svg { width: 28px; height: 28px; display: block; }
.nav-item { background: none; border: none; cursor: pointer; }

/* ─── Login screen ─────────────────────────────────────────────────── */
.login-hero {
  position: relative;
  color: #fff;
  padding: calc(48px + var(--safe-top)) 24px 38px;
  text-align: center;
  overflow: hidden;
  /* Layered background: brand-tone gradient overlay over hero photo.
     If hero.jpg is missing, the gradient alone still looks on-brand. */
  background:
    linear-gradient(135deg, rgba(var(--navy-rgb),0.78) 0%, rgba(var(--accent-rgb),0.70) 100%),
    url("assets/hero.jpg") center/cover no-repeat,
    var(--navy);
}
.login-hero img {
  width: 130px; height: 130px;
  margin-bottom: 16px;
  position: relative; z-index: 1;
}
.login-hero h1 {
  font-size: 22px; font-weight: 500;
  margin: 0; line-height: 1.3; padding: 0 12px;
  position: relative; z-index: 1;
  text-shadow: 0 1px 2px rgba(0,0,0,0.25);
}
.login-prompt { padding: 22px 14px 4px; text-align: center; }
.login-prompt .season-eyebrow { font-size: 10px; color: var(--text-mute); text-transform: uppercase; letter-spacing: 0.8px; font-weight: 500; }
.login-prompt h2 { font-size: 22px; margin: 4px 0 0; color: var(--navy); font-weight: 500; }
.login-copyright {
  padding: 22px 24px calc(28px + var(--safe-bottom));
  text-align: center;
  font-size: 11px;
  color: var(--text-mute);
}

/* ─── Login landing (full gradient) + slide-up auth sheet ──────────── */
.auth-landing {
  min-height: 100vh;
  background: linear-gradient(165deg, #1D2F52 0%, #3f5e9c 50%, #20305a 100%);
  display: flex; flex-direction: column; align-items: center;
  padding: calc(24px + var(--safe-top)) 26px calc(30px + var(--safe-bottom));
  text-align: center;
}
.auth-landing-top { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.auth-landing-crest { width: 150px; height: 150px; object-fit: contain; }
.auth-landing-name { color: #fff; font-size: 24px; font-weight: 600; margin-top: 14px; }
.auth-landing-tag { color: #C5D0EA; font-size: 14px; margin-top: 4px; letter-spacing: 0.3px; }
.landing-cta {
  width: 100%; max-width: 360px; background: var(--crimson); color: #fff; border: none;
  border-radius: 14px; padding: 16px; font-size: 16px; font-weight: 600; cursor: pointer;
  box-shadow: var(--glow);
}
.landing-cta:active { background: color-mix(in srgb, var(--accent) 78%, #000); }
.auth-landing-foot { color: rgba(255,255,255,0.5); font-size: 11px; margin-top: 16px; }

.auth-sheet-backdrop {
  position: fixed; inset: 0; z-index: 1500; background: rgba(8,14,28,0.55);
  display: flex; align-items: flex-end; opacity: 0; pointer-events: none; transition: opacity 0.28s ease;
}
.auth-sheet-backdrop.open { opacity: 1; pointer-events: auto; }
.auth-sheet {
  width: 100%; max-width: 480px; margin: 0 auto; background: var(--bg);
  border-radius: 24px 24px 0 0; padding: 8px 22px calc(26px + var(--safe-bottom));
  transform: translateY(100%); transition: transform 0.32s cubic-bezier(.2,.8,.2,1);
}
.auth-sheet-backdrop.open .auth-sheet { transform: translateY(0); }
.auth-sheet-grab {
  display: block; width: 40px; height: 5px; border-radius: 3px; background: #d5d5da;
  margin: 8px auto 16px; padding: 0; border: none; cursor: pointer;
}
/* v5.156.0: the auth sheet title was the only screen title still in body sans.
   Every other title in the app is the display voice (Build Brief section 4:
   Kanit, italic, uppercase). Also moved off --navy, which is retired as chrome. */
.auth-sheet-title { font-family: var(--font-display); font-style: italic; text-transform: uppercase;
  font-size: 26px; font-weight: 700; letter-spacing: .01em; color: var(--text); margin: 4px 0 18px; }
.auth-hint { font-size: 12px; color: var(--text-soft); margin: 8px 0 0; }

.roster {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  padding: 12px 14px;
}
.roster-tile {
  aspect-ratio: 1;
  background: var(--lane-light);
  border-radius: var(--radius-md);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 6px; padding: 8px;
  transition: transform 0.1s;
}
.roster-tile:active { transform: scale(0.96); }
.tile-avatar {
  width: 38px; height: 38px;
  border-radius: 50%;
  background: var(--crimson);
  color: #fff;
  font-size: 13px; font-weight: 500;
  display: flex; align-items: center; justify-content: center;
}
.tile-name { font-size: 12px; font-weight: 500; color: var(--navy); }

/* PIN entry */
.pin-screen { padding: 24px 24px 32px; text-align: center; }
.pin-avatar {
  width: 64px; height: 64px;
  background: var(--crimson); color: #fff;
  border-radius: 50%;
  margin: 0 auto 12px;
  display: flex; align-items: center; justify-content: center;
  font-size: 22px; font-weight: 500;
}
.pin-name { font-size: 20px; font-weight: 500; color: var(--navy); margin: 0 0 4px; }
.pin-sub  { font-size: 13px; color: var(--text-soft); margin: 0 0 22px; }
.pin-dots { display: flex; justify-content: center; gap: 14px; margin-bottom: 22px; }
.pin-dot {
  width: 14px; height: 14px;
  border-radius: 50%;
  border: 2px solid var(--steel);
}
.pin-dot.filled { background: var(--shell); border-color: var(--shell); }
.pin-keypad {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  max-width: 260px;
  margin: 0 auto;
}
.pin-key {
  background: var(--lane-light);
  border-radius: var(--radius-md);
  padding: 16px 0;
  font-size: 20px;
  font-weight: 500;
  color: var(--navy);
  transition: transform 0.1s;
}
.pin-key:active { transform: scale(0.94); background: var(--border); }
.pin-key.action { background: transparent; color: var(--text-mute); font-size: 16px; }
.pin-error { color: var(--stat-bad); font-size: 12px; margin-top: 14px; min-height: 18px; }
.pin-back { margin-top: 18px; font-size: 13px; color: var(--text-soft); }

/* ─── Today screen ─────────────────────────────────────────────────── */
.day-label { font-size: 11px; color: var(--text-mute); text-transform: uppercase; letter-spacing: 0.6px; margin: 0 0 12px; font-weight: 500; }

/* Rest day — same Light Canvas branding as every other athlete page. */
.rest-hero-icon {
  text-align: center; padding: 18px 0 8px;
  display: flex; justify-content: center; align-items: center;
}
.rest-hero-icon svg { width: 56px; height: 56px; color: var(--navy-light); }
.rest-hero-title { font-size: 22px; font-weight: 600; color: var(--navy); text-align: center; margin: 0 0 4px; }
.rest-hero-sub  { font-size: 13px; color: var(--text-mute); text-align: center; margin: 0 0 16px; }
.recovery-list { background: var(--card); border: 0.5px solid var(--border); box-shadow: var(--shadow-sm); border-radius: var(--radius-lg); padding: 14px 18px; }
.recovery-item { display: grid; grid-template-columns: 24px 1fr; gap: 12px; padding: 7px 0; font-size: 13px; align-items: start; }
.recovery-item .ico {
  display: flex; align-items: center; justify-content: center;
  width: 22px; height: 22px;
  border-radius: 50%;
  background: var(--rest-accent);
  color: #fff;
  font-size: 12px; font-weight: 500;
  margin-top: 1px;
}

/* ─── Testing screen ───────────────────────────────────────────────── */
.test-window {
  background: linear-gradient(135deg, var(--shell) 0%, var(--shell-light) 100%);
  color: #fff;
  border-radius: var(--radius-md);
  padding: 12px 14px;
  margin: 0 0 14px;
}
.test-eyebrow { font-size: 10px; opacity: 0.7; text-transform: uppercase; letter-spacing: 0.5px; }
.test-title   { font-size: 15px; font-weight: 500; margin: 3px 0 0; }

.test-card { background: var(--card); border: 0.5px solid var(--border); border-radius: var(--radius-md); padding: 11px 14px; margin: 0 0 8px; }
.test-row { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 8px; }
.test-name  { font-size: 14px; font-weight: 500; color: var(--navy); }
.test-stats { display: flex; gap: 12px; margin-top: 3px; font-size: 11px; color: var(--text-soft); }
.test-stats strong { color: var(--text); font-variant-numeric: tabular-nums; }
.test-trend.improved { color: var(--green); font-weight: 500; font-size: 11px; }
.test-trend.regressed { color: var(--crimson-ink); font-weight: 500; font-size: 11px; }
.test-trend.baseline { color: var(--text-mute); font-size: 11px; }
.test-input-btn {
  font-size: 13px;
  color: var(--crimson-ink);
  background: var(--crimson-soft);
  border-radius: 8px;
  padding: 6px 14px;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}
.test-pending { font-size: 11px; color: var(--text-mute); margin-top: 2px; }

/* ─── Modal for logging ────────────────────────────────────────────── */
.modal-backdrop {
  position: fixed; inset: 0;
  background: rgba(17, 25, 45, 0.6);
  display: flex; align-items: flex-end; justify-content: center;
  z-index: 100;
}
.modal {
  width: 100%; max-width: 480px;
  background: var(--card);
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
  padding: 18px 18px calc(18px + var(--safe-bottom));
  animation: slideUp 0.2s ease-out;
}
@keyframes slideUp { from { transform: translateY(100%); } to { transform: translateY(0); } }
.modal h3 { font-size: 17px; font-weight: 500; margin: 0 0 4px; color: var(--navy); }
.modal-sub { font-size: 12px; color: var(--text-soft); margin: 0 0 14px; }
.modal-field { margin-bottom: 12px; }
.modal-field label { font-size: 11px; color: var(--text-mute); text-transform: uppercase; letter-spacing: 0.5px; font-weight: 500; }
.modal-field input, .modal-field textarea {
  width: 100%; margin-top: 4px;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 10px 12px;
  font-size: 15px;
  background: var(--lane-light);
}
.modal-field input:focus, .modal-field textarea:focus { outline: none; border-color: var(--navy); background: var(--card); }
.modal-actions { display: grid; grid-template-columns: 1fr 2fr; gap: 8px; margin-top: 14px; }
.btn-modal-save { background: var(--crimson); color: #fff; border-radius: 10px; padding: 12px; font-size: 14px; font-weight: 500; }
.btn-modal-cancel { background: var(--lane-light); color: var(--navy); border-radius: 10px; padding: 12px; font-size: 14px; }
.btn-modal-delete { background: var(--card); color: var(--crimson-ink); border: 1px solid var(--crimson); border-radius: 10px; padding: 11px; font-size: 14px; font-weight: 500; }
.modal-sub strong { color: var(--navy); font-weight: 500; }

/* ─── Date navigation (Today screen) ──────────────────────────────── */
.date-nav-row {
  display: grid;
  grid-template-columns: 48px 1fr 48px;
  gap: 10px;
  align-items: center;
  margin-top: 14px;
}
.date-nav-arrow {
  width: 44px; height: 48px;
  border-radius: 0;
  background: transparent;
  border: 0;
  color: #fff;
  font-size: 38px; font-weight: 800; line-height: 1;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
}
.date-nav-arrow:active { opacity: 0.55; }
.date-nav-center { text-align: center; }
.date-nav-kind {
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
  opacity: 0.92;
}
.date-nav-back-today {
  display: inline-block;
  font-size: 11px;
  color: #fff;
  background: rgba(255,255,255,0.16);
  border-radius: 12px;
  padding: 4px 10px;
  margin-top: 6px;
  font-weight: 500;
}
.date-nav-back-today:active { background: rgba(255,255,255,0.28); }
.read-only-banner {
  font-size: 11px;
  color: var(--text-soft);
  text-align: center;
  background: var(--lane-light);
  border-radius: 8px;
  padding: 8px 12px;
  margin-bottom: 12px;
}

/* Edit pill (small badge for already-logged lift rows on past days) */
.lift-log.edit {
  background: var(--card);
  color: var(--crimson-ink);
  border: 1px solid var(--crimson);
}

/* ─── Pace + Recovery (workout detail card) ────────────────────────── */
.workout-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 10px 0 8px; }
.meta-tile { background: var(--lane-light); border-radius: 10px; padding: 8px 12px; }
.meta-tile.target { background: var(--crimson-soft); }
.meta-tile-label { font-size: 9px; color: var(--text-mute); text-transform: uppercase; letter-spacing: 0.5px; font-weight: 500; }
.meta-tile.target .meta-tile-label { color: var(--crimson-ink); }
.meta-tile-value { font-size: 16px; font-weight: 500; color: var(--navy); margin-top: 3px; font-variant-numeric: tabular-nums; }
.meta-tile.target .meta-tile-value { color: var(--crimson-ink); }
.meta-tile-sub { font-size: 10px; color: var(--text-soft); margin-top: 1px; }

/* ─── Structured workout blocks ────────────────────────────────────── */
.block-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 2px 0 10px; }
.block-chip { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: var(--text-soft);
  background: var(--lane-light); border-radius: 999px; padding: 4px 11px; }
.block-chip-ic { color: var(--steel); font-size: 11px; }
.block-list { margin: 2px 0 4px; }
.block-row { padding: 11px 0; border-top: 1px solid var(--border-soft); }
.block-row:first-child { border-top: none; padding-top: 4px; }
.block-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.block-rd { font-size: 19px; font-weight: 500; color: var(--navy); font-variant-numeric: tabular-nums; }
.block-sets { display: inline-block; margin-left: 9px; font-size: 11.5px; font-weight: 700; letter-spacing: .04em;
  text-transform: uppercase; color: var(--text-mute); vertical-align: middle; }
.block-int { font-size: 13px; font-weight: 500; color: var(--crimson-ink); white-space: nowrap; }
.block-sub { font-size: 14px; color: var(--text-soft); margin-top: 2px; }
.block-pace { color: var(--crimson-ink); font-weight: 500; font-variant-numeric: tabular-nums; }
.block-rest { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: var(--rest-accent);
  background: var(--rest-bg); border-radius: 8px; padding: 4px 9px; margin-top: 7px; font-variant-numeric: tabular-nums; }
.block-rest-ic { font-size: 12px; }
.block-rest-empty { color: var(--text-mute); background: var(--lane-light); font-style: italic; }
.vol-flag { display: flex; align-items: center; gap: 6px; font-size: 12px; line-height: 1.45; margin-top: 11px;
  padding: 7px 11px; border-radius: 8px; font-variant-numeric: tabular-nums; }
.vol-flag-ic { font-size: 12px; }
.vol-under { color: #8a5a00; background: #fff4dc; border-left: 3px solid #e0a020; }
.vol-over  { color: #8a2330; background: #ffe7e7; border-left: 3px solid #d6536a; }
.block-focus { font-size: 12.5px; line-height: 1.5; color: var(--navy); background: var(--rest-soft);
  border-left: 3px solid var(--steel); border-radius: 0 8px 8px 0; padding: 8px 11px; margin: 12px 0 2px; }
.block-focus-tag { display: inline-block; font-size: 10px; font-weight: 500; text-transform: uppercase;
  letter-spacing: 0.5px; color: var(--steel); margin-right: 7px; }

/* ─── Abs / core circuit card ──────────────────────────────────────────── */
.abs-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin: 2px 0 8px; }
.abs-sub { font-size: 13px; color: var(--text-soft); }
.abs-count { font-size: 12px; font-weight: 500; color: var(--text-mute); white-space: nowrap; font-variant-numeric: tabular-nums; }
.abs-count.hit { color: var(--green); }
.abs-dots { display: flex; gap: 6px; margin: 0 0 12px; }
.abs-dot { width: 14px; height: 14px; border-radius: 50%; background: var(--lane-light); border: 1.5px solid var(--border); }
.abs-dot.on { background: var(--shell-light); border-color: var(--shell-light); }
.abs-list { margin: 0 0 10px; padding-left: 20px; }
.abs-list li { font-size: 15px; line-height: 1.7; color: var(--text); }
.abs-rest { font-size: 12px; color: var(--text-soft); background: var(--lane-light); border-radius: 8px; padding: 6px 10px; margin-bottom: 10px; }
.abs-done.done { background: var(--shell-light); color: #fff; border-color: var(--shell-light); }

/* ─── Coach login tile + coach view ────────────────────────────────────── */
.coach-login-wrap { padding: 4px 20px 8px; }
.coach-tile { display: flex; align-items: center; gap: 12px; width: 100%; padding: 12px 14px;
  background: var(--shell); color: #fff; border: none; border-radius: var(--radius-md); cursor: pointer; text-align: left; }
.coach-tile-avatar { width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,0.15);
  display: flex; align-items: center; justify-content: center; font-size: 16px; flex: 0 0 auto; }
.coach-tile-text { display: flex; flex-direction: column; flex: 1; }
.coach-tile-name { font-size: 15px; font-weight: 500; }
.coach-tile-sub { font-size: 12px; color: rgba(255,255,255,0.7); }
.coach-tile-arrow { font-size: 20px; color: rgba(255,255,255,0.6); }
.coach-nav { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.coach-nav .date-nav-arrow { flex: 0 0 32px; width: 32px; height: 42px; font-size: 30px; overflow: hidden; white-space: nowrap; }
.coach-logout { margin-top: 16px; width: 100%; }

/* ─── Email/password auth screen ───────────────────────────────────────── */
.auth-screen { min-height: 100vh; display: flex; flex-direction: column; align-items: center; padding: 0 22px; }
.auth-card { width: 100%; max-width: 360px; background: var(--bg); border: 0.5px solid var(--border);
  border-radius: var(--radius-lg); padding: 20px 18px; margin-top: 8px; box-shadow: var(--shadow-sm); }
.auth-sub { font-size: 14px; color: var(--text-soft); margin: 0 0 14px; line-height: 1.5; }
.auth-note { font-size: 12px; color: var(--text-mute); margin: 4px 0 14px; }
.auth-label { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: 0.5px;
  color: var(--text-mute); font-weight: 500; margin: 10px 0 4px; }
.auth-input { width: 100%; box-sizing: border-box; font-size: 16px; padding: 11px 12px;
  border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--bg); color: var(--text); }
.auth-input:focus { outline: none; border-color: var(--navy); }
/* School / college type-ahead dropdown */
.ac-wrap { position: relative; }
.ac-list { position: absolute; left: 0; right: 0; top: 100%; z-index: 50; margin-top: 4px;
  background: var(--card); border: 1px solid var(--border); border-radius: var(--radius-sm);
  box-shadow: 0 12px 30px rgba(17,25,45,0.18); max-height: 232px; overflow-y: auto; display: none; }
.ac-list.show { display: block; }
.ac-opt { display: flex; flex-direction: column; gap: 1px; width: 100%; text-align: left;
  background: none; border: 0; border-bottom: 1px solid var(--border); padding: 10px 12px; cursor: pointer; }
.ac-opt:last-child { border-bottom: 0; }
.ac-opt:hover, .ac-opt:focus { background: var(--crimson-soft); }
.ac-n { font-size: 15px; color: var(--navy); }
.ac-c { font-size: 12px; color: var(--text-mute); }
/* Branded date picker */
.fcal-wrap { position: relative; }
.fcal { position: absolute; left: 0; top: 100%; z-index: 60; width: 300px; max-width: calc(100vw - 36px); margin-top: 6px;
  background: var(--card); border: 1px solid var(--border); border-radius: 14px; box-shadow: 0 14px 34px rgba(17,25,45,0.22); padding: 12px; display: none; }
.fcal.show { display: block; }
.fcal-hd { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.fcal-t { flex: 1; text-align: left; font-size: 16px; font-weight: 600; color: var(--navy); cursor: pointer; padding: 4px 4px; border-radius: 8px; white-space: nowrap; }
.fcal-t:hover { background: var(--crimson-soft); }
.fcal-navs { display: flex; gap: 6px; flex: 0 0 auto; }
.fcal-nav { width: 38px; height: 32px; border: 0; border-radius: 9px; background: var(--crimson); color: #fff; font-size: 17px; cursor: pointer; }
.fcal-dow { display: grid; grid-template-columns: repeat(7,1fr); gap: 2px; margin-bottom: 4px; }
.fcal-dow span { text-align: center; font-size: 12px; font-weight: 600; color: var(--text-mute); }
.fcal-grid { display: grid; grid-template-columns: repeat(7,1fr); gap: 2px; }
.fcal-cell { aspect-ratio: 1; display: flex; align-items: center; justify-content: center; font-size: 14px; border-radius: 9px; cursor: pointer; color: var(--navy); }
.fcal-cell.mut { visibility: hidden; }
.fcal-cell:hover { background: var(--crimson-soft); }
.fcal-cell.sel { background: var(--crimson); color: #fff; font-weight: 600; }
.fcal-mg { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
.fcal-m { padding: 13px 0; text-align: center; font-size: 13px; border-radius: 9px; background: var(--bg); cursor: pointer; color: var(--navy); }
.fcal-m:hover { background: var(--crimson-soft); }
.fcal-m.sel { background: var(--crimson); color: #fff; font-weight: 600; }
.fcal-yg { display: grid; grid-template-columns: repeat(4,1fr); gap: 6px; max-height: 200px; overflow-y: auto; }
.fcal-y { padding: 10px 0; text-align: center; font-size: 13px; border-radius: 9px; background: var(--bg); cursor: pointer; color: var(--navy); }
.fcal-y:hover { background: var(--crimson-soft); }
.fcal-y.sel { background: var(--crimson); color: #fff; font-weight: 600; }
/* Parent / guardian portal */
.consent-line { display: flex; gap: 10px; align-items: flex-start; background: var(--bg); border: 1px solid var(--border); border-radius: 11px; padding: 12px; margin: 10px 0 14px; cursor: pointer; }
.consent-box { width: 20px; height: 20px; border-radius: 6px; border: 1.5px solid var(--border); flex: 0 0 auto; margin-top: 1px; display: flex; align-items: center; justify-content: center; }
.consent-box svg { display: none; }
.consent-box.on { background: var(--crimson); border-color: var(--crimson); }
.consent-box.on svg { display: block; }
.consent-line span:last-child { font-size: 13px; color: var(--text); line-height: 1.45; }
.kidrow { display: flex; gap: 9px; overflow-x: auto; padding: 12px 0 2px; }
.kidchip { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.22); border-radius: 999px; padding: 6px 14px 6px 7px; color: #fff; font-size: 13.5px; font-weight: 600; cursor: pointer; }
.kidchip.on { background: var(--crimson); border-color: var(--crimson); }
.kidchip-av { width: 26px; height: 26px; border-radius: 50%; background: rgba(255,255,255,0.18); display: flex; align-items: center; justify-content: center; font-size: 12px; overflow: hidden; }
.kidchip-av img { width: 100%; height: 100%; object-fit: cover; }
.kidchip.addk { background: transparent; border-style: dashed; }
.par-tabs { display: flex; gap: 6px; padding: 12px 20px 0; background: var(--bg); }
.par-tab { flex: 1; text-align: center; padding: 11px; font-size: 14px; font-weight: 600; color: var(--text-mute); cursor: pointer; border: 0; background: none; border-bottom: 2px solid transparent; }
.par-tab.on { color: var(--navy); border-bottom-color: var(--crimson); }
.ro-badge { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; color: var(--text-mute); background: var(--bg); border: 1px solid var(--border); border-radius: 999px; padding: 4px 10px; margin-bottom: 12px; }
.par-week { display: flex; gap: 6px; margin-bottom: 14px; }
.par-week .wd { flex: 1; text-align: center; background: var(--bg); border: 1px solid var(--border); border-radius: 10px; padding: 8px 2px; }
.par-week .wd .d { font-size: 11px; color: var(--text-mute); }
.par-week .wd .n { font-size: 15px; font-weight: 600; color: var(--navy); margin-top: 2px; }
.par-week .wd.train { background: var(--crimson-soft); border-color: rgba(var(--accent-rgb),0.3); }
.par-week .wd.is-today { outline: 2px solid var(--crimson); }
.par-card { margin-bottom: 14px; }
.par-ctitle { font-size: 19px; font-weight: 600; color: var(--navy); margin: 4px 0 6px; }
.par-detail { font-size: 14px; color: var(--text); line-height: 1.5; white-space: pre-line; }
.par-detail.muted { color: var(--text-mute); }
.par-sub { font-size: 13px; color: var(--text-mute); margin-top: 6px; }
.secttl { font-size: 12px; letter-spacing: 0.05em; text-transform: uppercase; color: var(--text-mute); margin: 14px 0 8px; }
.ann { background: var(--card); border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; margin-bottom: 10px; }
.ann-who { font-size: 11px; font-weight: 700; color: var(--crimson-ink); }
.ann-ti { font-size: 15px; font-weight: 600; color: var(--navy); margin: 3px 0; }
.ann-bd { font-size: 13.5px; color: var(--text); line-height: 1.45; }
.ann-tm { font-size: 11px; color: var(--text-mute); margin-top: 6px; }
.par-dmnote { font-size: 12px; color: var(--text-mute); background: var(--bg); border: 1px solid var(--border); border-radius: 10px; padding: 8px 11px; margin-bottom: 10px; }
.par-dm { display: flex; flex-direction: column; gap: 8px; margin-bottom: 12px; }
.par-dm .bub { max-width: 80%; padding: 9px 12px; border-radius: 14px; font-size: 13.5px; line-height: 1.4; }
.par-dm .bub.me { align-self: flex-end; background: var(--crimson); color: #fff; border-bottom-right-radius: 4px; }
.par-dm .bub.them { align-self: flex-start; background: var(--bg); color: var(--text); border-bottom-left-radius: 4px; }
.par-dmbar { display: flex; gap: 8px; }
.par-dmbar input { flex: 1; }

/* ── Parent screen — match the athlete's dark, frosted branding ─────────────── */
.parent-screen .par-tabs { background: transparent; padding: 14px 18px 0; }
.parent-screen .par-tab { color: #aeb9d2; }
.parent-screen .par-tab.on { color: #fff; border-bottom-color: var(--crimson); }
.parent-screen .ro-badge { color: #c5d0ea; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.16); }
.parent-screen .par-week .wd { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); }
.parent-screen .par-week .wd .d { color: #9fb0cc; }
.parent-screen .par-week .wd .n { color: #fff; }
.parent-screen .par-week .wd.train { background: rgba(var(--accent-rgb),0.24); border-color: rgba(var(--accent-rgb),0.5); }
.parent-screen .par-week .wd.is-today { outline: 2px solid var(--crimson); }
.parent-screen .card, .parent-screen .par-card { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); }
.parent-screen .ck { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: #9fb0cc; font-weight: 700; margin-bottom: 4px; }
.parent-screen .par-ctitle { color: #fff; }
.parent-screen .par-detail { color: #e7ecf5; }
.parent-screen .par-detail.muted { color: #aab6cf; }
.parent-screen .par-sub { color: #aab6cf; }
.parent-screen .secttl { color: #c5d0ea; }
.parent-screen .ann { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); }
.parent-screen .ann-ti { color: #fff; }
.parent-screen .ann-bd { color: #e7ecf5; }
.parent-screen .ann-tm { color: #9fb0cc; }
.parent-screen .par-dmnote { color: #c5d0ea; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); }
.parent-screen .par-dm .bub.them { background: rgba(255,255,255,0.10); color: #f2f5fa; }
.parent-screen .auth-input { background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.18); color: #fff; }
.parent-screen .auth-input::placeholder { color: #8a97b3; }
.parent-screen .class-chip-line { justify-content: flex-start; }
.parent-screen .section-label { color: #C5D0EA; }
/* clear the floating bottom nav */
.parent-screen .page-body { padding-bottom: calc(104px + var(--safe-bottom)); }

/* one-time welcome note — clean, dismissible, no tiles */
.par-welcome { position: relative; border-left: 3px solid var(--crimson); background: rgba(255,255,255,0.05); border-radius: 0 12px 12px 0; padding: 13px 38px 14px 14px; margin-bottom: 16px; }
.par-welcome-h { font-size: 15px; font-weight: 800; color: #fff; margin-bottom: 3px; }
.par-welcome-p { font-size: 13px; line-height: 1.5; color: #c8d2e6; }
.par-welcome-x { position: absolute; top: 8px; right: 8px; width: 26px; height: 26px; border-radius: 50%; border: 0; background: rgba(255,255,255,0.08); color: #cdd8ec; font-size: 18px; line-height: 1; cursor: pointer; }
.par-welcome-x:active { background: rgba(255,255,255,0.18); }

/* settings rows */
.set-row { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.16); border-radius: 14px; padding: 14px; margin-bottom: 10px; color: #fff; font-size: 15px; font-weight: 600; cursor: pointer; }
.set-row .set-ic { color: #cfd9ee; display: flex; flex: 0 0 auto; }
.set-row .set-chev { margin-left: auto; color: #8b9abf; font-size: 20px; }
.set-row.set-add { border-style: dashed; }
.set-row.set-danger { color: #ff9aa8; }
.set-current { margin-left: auto; font-size: 11px; font-weight: 700; color: #5DCAA5; background: rgba(93,202,165,0.16); border-radius: 999px; padding: 3px 9px; }
.set-current + .set-chev { margin-left: 8px; }

/* notifications bottom sheet */
.par-sheet-back { position: fixed; inset: 0; background: rgba(6,10,22,0.55); opacity: 0; transition: opacity .25s ease; z-index: 60; }
.par-sheet-back.open { opacity: 1; }
.par-sheet { position: fixed; left: 0; right: 0; bottom: 0; max-width: 480px; margin: 0 auto; max-height: 80vh; overflow-y: auto;
  background: #16213b; border-top-left-radius: 22px; border-top-right-radius: 22px;
  transform: translateY(110%); transition: transform .28s cubic-bezier(.22,.61,.36,1);
  padding: 8px 16px calc(26px + var(--safe-bottom)); box-shadow: 0 -10px 40px rgba(0,0,0,0.5); }
.par-sheet-back.open .par-sheet { transform: translateY(0); }
.par-sheet-grab { width: 40px; height: 5px; border-radius: 3px; background: rgba(255,255,255,0.3); margin: 6px auto 14px; }
.par-sheet-h { font-family: var(--font-display); font-style: italic; text-transform: uppercase; letter-spacing: 0.01em; font-size: 18px; font-weight: 700; color: #fff; margin-bottom: 12px; }
.par-sheet-sub { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: #9fb0cc; margin: 6px 0 8px; }
.par-notif-item { display: block; width: 100%; text-align: left; cursor: pointer; }
/* ── Meets (club schedule) — frosted dark, works on every screen ─────────── */
.home-screen .section-label { color: #C5D0EA; }
.meet-empty { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); border-radius: 14px; padding: 14px; margin-bottom: 12px; color: #aab6cf; font-size: 14px; line-height: 1.5; }
.meets-head, .tile-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 18px 0 8px; }
.meets-head .section-label, .tile-head .section-label { margin: 0; }
.tile-head .att-date-nav { margin: 0; }
.meets-add-link { background: none; border: 0; color: #E5ECFA; font-size: 13px; font-weight: 700; cursor: pointer; padding: 2px 0; }
.meets-add-link:active { opacity: .7; }
.meet { display: flex; gap: 14px; align-items: center; width: 100%; text-align: left; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); border-radius: 14px; padding: 14px; margin-bottom: 12px; cursor: pointer; }
.meet:active { background: rgba(255,255,255,0.1); }
.meet-date { flex: 0 0 56px; text-align: center; }
.meet-dow { font-size: 11px; color: #aab6cf; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.meet-day { font-size: 30px; font-weight: 800; color: #fff; line-height: 1.04; }
.meet-mon { font-size: 11px; color: #9fb0cc; font-weight: 800; text-transform: uppercase; }
.meet-main { flex: 1; min-width: 0; }
.meet-name { font-size: 17px; font-weight: 700; color: #fff; }
.meet-meta { font-size: 12.5px; color: #c5d0ea; margin-top: 3px; }
.meet-loc { font-size: 12.5px; color: #9fb0cc; margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.meet-chev { color: #8b9abf; font-size: 24px; flex: 0 0 auto; }
.sheet-eyebrow { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: #9fb0cc; }
.meet-sheet-meta { font-size: 13.5px; color: #cdd8ee; margin-bottom: 3px; }
.meet-sheet-notes { margin-top: 6px; color: #c8d2e6; }
.meet-map { margin: 12px 0; border-radius: 12px; overflow: hidden; border: 1px solid rgba(255,255,255,0.14); height: 160px; }
.meet-map-frame { width: 100%; height: 100%; border: 0; display: block; }
.sheet-actions { display: flex; gap: 10px; margin-top: 6px; }
.btn-maps { flex: 1; display: flex; align-items: center; justify-content: center; gap: 7px; background: var(--crimson); color: #fff; border: 0; border-radius: var(--radius-btn); padding: 13px; font-size: 14px; font-weight: 700; text-decoration: none; }
.btn-ghost { flex: 1; display: flex; align-items: center; justify-content: center; gap: 7px; background: rgba(255,255,255,0.08); color: #fff; border: 1px solid rgba(255,255,255,0.2); border-radius: var(--radius-btn); padding: 13px; font-size: 14px; font-weight: 700; cursor: pointer; }
.btn-ghost.meet-del-btn { color: #ff9aa8; border-color: rgba(232,96,122,0.4); }

/* dark form controls inside a bottom sheet (e.g. Add athlete) */
.par-sheet .auth-input, .par-sheet .onb-select { background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.18); color: #fff; }
.par-sheet .auth-input::placeholder { color: #8a97b3; }
.par-sheet .auth-label { color: #c5d0ea; }
.par-sheet .auth-input[type="datetime-local"], .par-sheet .auth-input[type="date"] { text-align: left; -webkit-appearance: none; appearance: none; width: 100%; max-width: 100%; box-sizing: border-box; min-height: 46px; }

/* address autocomplete dropdown */
.addr-wrap { position: relative; }
.addr-ac { position: absolute; top: calc(100% + 4px); left: 0; right: 0; z-index: 6; background: #1b2740; border: 1px solid rgba(255,255,255,0.18); border-radius: 12px; overflow: hidden; max-height: 220px; overflow-y: auto; box-shadow: 0 12px 30px rgba(0,0,0,0.45); }
.addr-ac-item { display: block; width: 100%; text-align: left; background: none; border: 0; border-bottom: 1px solid rgba(255,255,255,0.08); color: #e7ecf5; font-size: 13.5px; line-height: 1.35; padding: 11px 13px; cursor: pointer; }
.addr-ac-item:last-child { border-bottom: 0; }
.addr-ac-item:active { background: rgba(255,255,255,0.08); }

/* all-day switch row */
.mf-row { display: flex; align-items: center; justify-content: space-between; margin: 10px 0 12px; }
.mf-switch { position: relative; width: 46px; height: 28px; flex: 0 0 auto; }
.mf-switch input { opacity: 0; width: 0; height: 0; position: absolute; }
.mf-switch .track { position: absolute; inset: 0; background: rgba(255,255,255,0.2); border-radius: 999px; transition: background .15s; cursor: pointer; }
.mf-switch .track::after { content: ""; position: absolute; top: 3px; left: 3px; width: 22px; height: 22px; border-radius: 50%; background: var(--card); transition: transform .15s; }
.mf-switch input:checked + .track { background: var(--crimson); }
.mf-switch input:checked + .track::after { transform: translateX(18px); }

/* Per-result "count toward projections" toggle on a meet result row (coach only) */
.mr-proj-sw { position: relative; width: 38px; height: 22px; flex: 0 0 auto; margin-left: auto; cursor: pointer; }
.mr-proj-sw input { opacity: 0; width: 0; height: 0; position: absolute; }
.mr-proj-sw .track { position: absolute; inset: 0; background: rgba(255,255,255,.22); border-radius: 999px; transition: background .15s; cursor: pointer; }
.mr-proj-sw .track::after { content: ""; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: var(--card); transition: transform .15s; }
.mr-proj-sw input:checked + .track { background: var(--green, #12A594); }
.mr-proj-sw input:checked + .track::after { transform: translateX(16px); }
.mr-proj-sw ~ .mr-del { margin-left: 6px; }
.par-sheet.sheet-light .mr-proj-sw .track { background: rgba(17,25,45,.18); }
.par-sheet.sheet-light .mr-proj-sw input:checked + .track { background: var(--green, #12A594); }

/* Share icon on an athlete's own result row (meet popup) */
.mr-share { margin-left: auto; flex: 0 0 auto; width: 32px; height: 32px; border-radius: 50%;
  border: 1px solid rgba(255,255,255,.28); background: transparent; color: #cdd8e8;
  display: inline-flex; align-items: center; justify-content: center; cursor: pointer; padding: 0; }
.par-sheet.sheet-light .mr-share { border-color: var(--border); background: var(--card); color: var(--navy-light); }

/* Athlete "Meet marks" list on the Progress page (Light Canvas card) */
.mk-card { padding: 2px 14px; }
.mk-row { display: flex; align-items: center; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--border); }
.mk-row:last-child { border-bottom: 0; }
.mk-ev { flex: 0 0 58px; font-size: 13px; font-weight: 700; color: var(--navy); }
.mk-time { font-weight: 800; color: var(--navy); font-variant-numeric: tabular-nums; }
.mk-meet { flex: 1; min-width: 0; font-size: 12px; color: var(--text-mute); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mk-place { flex: 0 0 auto; font-size: 12px; font-weight: 800; color: var(--crimson-ink); }

/* Time-trial entry (Testing tab) */
.tt-intro { font-size: 13px; color: var(--text-mute); margin-bottom: 12px; line-height: 1.45; }
.tt-log-btn { width: 100%; }
.tt-list { margin-top: 12px; border-top: 1px solid var(--border); }
.tt-row { display: flex; align-items: center; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--border); }
.tt-row:last-child { border-bottom: 0; }
.tt-dist { flex: 0 0 56px; font-weight: 700; color: var(--navy); font-size: 13px; }
.tt-time { font-weight: 800; color: var(--navy); font-variant-numeric: tabular-nums; }
.tt-date { margin-left: auto; font-size: 12px; color: var(--text-mute); }
.tt-err { color: var(--stat-bad); font-size: 12.5px; margin: 6px 0 2px; }

/* Coach edit-diverged warning (per-class program won't get a default edit) */
.pe-status.warn { color: #C77A16 !important; text-align: left; line-height: 1.5;
  background: rgba(199,122,22,.09); border: 1px solid rgba(199,122,22,.28); border-radius: 10px; padding: 11px 13px; margin-top: 6px; }
.pe-status.warn b { color: var(--stat-bad); }
.parent-screen .par-dmbar { margin-top: 6px; }
.auth-parent-row { text-align: center; margin-top: 10px; padding-top: 10px; border-top: 1px solid rgba(255,255,255,0.12); }
.auth-input[type="date"] { text-align: left; -webkit-appearance: none; appearance: none; }
.auth-input[type="date"]::-webkit-date-and-time-value { text-align: left; width: 100%; margin: 0; }
.auth-input[type="date"]::-webkit-datetime-edit { width: 100%; padding: 0; }
/* An error is STATUS, not brand. This read var(--crimson-ink), which only
   looked like an error while the brand happened to be crimson: after the
   palette port every validation message rendered in Cobalt, and inside the
   registration flow, where the accent is pinned to Bloc, it stayed blue.
   The status triad never takes the accent. */
.auth-error { font-size: 13px; color: var(--stat-bad); min-height: 18px; margin: 8px 0 2px; }
.auth-btn { width: 100%; margin-top: 8px; }
.btn-primary { width: 100%; background: var(--shell); color: #fff; border: 1px solid var(--shell);
  border-radius: var(--radius-btn); padding: 12px; font-size: 15px; font-weight: 500; cursor: pointer; }
.btn-primary:active { background: var(--shell-dark); }
.btn-primary:disabled, .btn-secondary:disabled { opacity: 0.55; }
.auth-link { display: block; width: 100%; background: none; border: none; color: var(--navy-light);
  font-size: 13px; margin-top: 12px; cursor: pointer; text-align: center; }

/* ─── Coach team dashboard ─────────────────────────────────────────────── */
.team-summary { font-size: 13px; color: var(--text-soft); margin: 2px 0 12px; }
.live-dot { color: var(--green); font-size: 11px; font-weight: 600; margin-left: 4px; }
.day-screen .team-summary .live-dot { color: #5DCAA5; }
.team-row { display: flex; align-items: center; gap: 11px; }
.tile-avatar.sm { width: 44px; height: 44px; font-size: 15px; flex: 0 0 auto; display: flex;
  align-items: center; justify-content: center; border-radius: 50%; background: var(--lane-light); color: var(--navy); font-weight: 500; }
.team-info { flex: 1; min-width: 0; }
.team-prog { height: 5px; border-radius: 3px; background: var(--border-soft); margin-top: 6px; overflow: hidden; max-width: 160px; }
.team-prog-bar { height: 100%; background: var(--green); border-radius: 3px; transition: width 0.4s ease; }
.tc-wk { font-weight: 600; color: var(--navy); }
.team-name { font-size: 15px; font-weight: 500; color: var(--navy); }
.team-sub { font-size: 12px; color: var(--text-mute); }
.team-stats { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; flex: 0 0 auto; }
.team-badge { font-size: 11px; font-weight: 500; color: var(--text-mute); }
.team-badge.on { color: var(--green); }
.team-core { font-size: 11px; color: var(--text-soft); font-variant-numeric: tabular-nums; }
.danger-btn { color: var(--crimson-ink) !important; border-color: var(--crimson) !important; }

/* ─── Coach "View as athlete" (read-only preview) ──────────────────────── */
.viewas-bar { position: sticky; top: 0; z-index: 60; display: flex; align-items: center;
  justify-content: space-between; gap: 10px; padding: 9px 14px;
  padding-top: calc(9px + env(safe-area-inset-top, 0px));
  background: var(--crimson); color: #fff; font-size: 13px; font-weight: 500;
  box-shadow: 0 2px 8px rgba(0,0,0,0.18); }
.viewas-bar > span { display: inline-flex; align-items: center; gap: 7px; }
.viewas-bar .viewas-eye { flex: 0 0 auto; }
.viewas-bar button { background: rgba(255,255,255,0.18); color: #fff; border: 1px solid rgba(255,255,255,0.45);
  border-radius: 999px; padding: 6px 14px; font-size: 13px; font-weight: 600; cursor: pointer; flex: 0 0 auto; }
.viewas-bar button:active { background: rgba(255,255,255,0.32); }
/* logging-on-behalf mode uses a green bar so the coach knows entries WILL save */
.viewas-bar-log { background: #1f8a5b; }
.viewas-btn { margin-bottom: 12px; }
.viewas-btn .viewas-eye { margin-right: 6px; }

/* ─── v1.5: attendance quick-mark (coach Team) ─────────────────────────── */
.team-card { background: var(--bg); border: 0.5px solid var(--border); border-radius: var(--radius-md); margin-bottom: 8px; overflow: hidden; }
.team-main { display: block; width: 100%; text-align: left; background: none; border: none; padding: 12px 14px 6px; cursor: pointer; }
.team-main .team-row { display: flex; align-items: center; gap: 11px; }
.att-group { display: flex; gap: 6px; padding: 0 14px 12px; }
.att-btn { flex: 1; font-size: 12px; font-weight: 500; padding: 6px 0; border-radius: var(--radius-sm);
  border: 0.5px solid var(--border); background: var(--bg); color: var(--text-soft); cursor: pointer; }
.att-btn.att-here.on { background: var(--green); color: #fff; border-color: var(--green); }
.att-btn.att-late.on { background: var(--amber); color: #fff; border-color: var(--amber); }
.att-btn.att-out.on  { background: var(--crimson); color: #fff; border-color: var(--crimson); }

/* ─── v1.5: attendance history + testing trends (athlete detail) ───────── */
.att-history { display: flex; flex-wrap: wrap; gap: 6px; }
.att-pill { font-size: 11px; padding: 3px 9px; border-radius: 999px; background: var(--lane-light); color: var(--text-soft); }
.att-pill.att-here { background: #E1F5EE; color: #0F6E56; }
.att-pill.att-late { background: #FAEEDA; color: #854F0B; }
.att-pill.att-out  { background: #FAECE7; color: #993C1D; }
.test-trend { padding: 8px 0; border-top: 1px solid var(--border-soft); }
.test-trend:first-child { border-top: none; }
.test-trend-head { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 2px; }
.test-trend-name { font-size: 13px; font-weight: 500; color: var(--navy); }
.test-trend-latest { font-size: 13px; font-weight: 500; color: var(--crimson-ink); font-variant-numeric: tabular-nums; }

/* ─── Login polish ─────────────────────────────────────────────────────── */
.auth-pass-wrap { position: relative; }
.auth-eye { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); background: none; border: none;
  color: var(--navy-light); font-size: 12px; font-weight: 500; cursor: pointer; padding: 6px 6px; }
.auth-switch { font-size: 13px; color: var(--text-soft); text-align: center; margin: 14px 0 2px; }
.auth-link-inline { background: none; border: none; color: var(--navy-light); font-size: 13px; font-weight: 600; cursor: pointer; padding: 0; }
.auth-copy { display: flex; align-items: center; gap: 8px; background: var(--lane-light); border-radius: var(--radius-sm);
  padding: 9px 12px; margin: 10px 0 14px; }
.auth-copy span { flex: 1; font-size: 13px; color: var(--navy); word-break: break-all; }
.auth-copy button { background: var(--shell); color: #fff; border: none; border-radius: 7px; font-size: 12px; font-weight: 500; padding: 6px 12px; cursor: pointer; }

/* ─── Trends/Testing toggle on Progress (light bg) ─────────────────────── */
.perf-toggle { display: flex; gap: 4px; justify-content: center; margin: 0 0 14px; }
.perf-toggle .cvt { font-size: 13px; font-weight: 500; padding: 6px 20px; border-radius: 999px;
  border: 0.5px solid var(--border); background: var(--bg); color: var(--text-soft); cursor: pointer; }
.perf-toggle .cvt.active { background: var(--shell); color: #fff; border-color: var(--shell); }

/* ─── Home dashboard (frosted) ─────────────────────────────────────────── */
.home-screen { min-height: 100vh; background: var(--lane-light); color: var(--text); display: flex; flex-direction: column; }
.home-head { padding: calc(10px + var(--safe-top)) 20px 14px; color: #fff; background: var(--shell); border-radius: 0 0 22px 22px; position: sticky; top: 0; z-index: 20; }
.home-head-row { display: flex; justify-content: space-between; align-items: flex-start; }
.home-title { font-size: 23px; font-weight: 600; }
.home-date { font-size: 14px; color: #C5D0EA; margin-top: 2px; }
.home-ring { width: 60px; height: 60px; border-radius: 50%; border: 3.5px solid rgba(255,255,255,0.22);
  border-top-color: color-mix(in srgb, var(--accent) 55%, #fff); border-right-color: color-mix(in srgb, var(--accent) 55%, #fff); display: flex; flex-direction: column; align-items: center; justify-content: center; flex: 0 0 auto; }
.home-ring-w { font-size: 14px; font-weight: 600; line-height: 1; color: #fff; }
.home-ring-s { font-size: 9px; color: #C5D0EA; }
.home-body { padding: 14px 14px calc(78px + var(--safe-bottom)); flex: 1; display: flex; flex-direction: column; color: var(--text); }

.home-note { display: flex; gap: 12px; align-items: flex-start;
  background: var(--card);
  border: 0.5px solid var(--border); border-left: 3px solid var(--crimson);
  border-radius: 0 12px 12px 0; padding: 13px 15px; margin-bottom: 10px; box-shadow: var(--shadow-sm); }
.home-note-ic { flex: 0 0 auto; width: 34px; height: 34px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: rgba(var(--accent-rgb),0.22); color: var(--accent-ink); }
.home-note-ic svg { width: 18px; height: 18px; }
.home-note-main { min-width: 0; }
.home-note-tag { display: block; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.06em; color: var(--accent-ink); margin-bottom: 3px; }
.home-note-body { font-size: 13.5px; color: var(--text); line-height: 1.5; }

.home-stack { position: relative; padding-bottom: 52px; margin-top: 6px; overflow-x: clip; }
.home-peek { position: absolute; left: 9px; right: 9px; bottom: 0; z-index: 1; background: rgba(255,255,255,0.5);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,0.4); border-radius: 16px; padding: 10px 16px 18px; cursor: pointer; }
.home-peek-eb { font-size: 10.5px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; color: #5B6B7F; }
.home-peek-title { font-size: 13px; font-weight: 500; color: var(--navy); margin-left: 8px; }
.home-tile { position: relative; z-index: 2; background: rgba(255,255,255,0.85); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px);
  border: 1px solid rgba(255,255,255,0.6); border-radius: 18px; padding: 20px 19px 30px; min-height: 224px; display: flex; flex-direction: column; box-shadow: 0 6px 20px rgba(10,20,45,0.22); transition: opacity .2s ease, transform .2s ease; }
.home-tile-top { display: flex; justify-content: space-between; align-items: center; }
.home-tile-eb { font-size: 10.5px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.6px; color: #5B6B7F; }
.home-tag { font-size: 9.5px; font-weight: 600; padding: 3px 9px; border-radius: 999px; }
.home-tile-title { font-size: 23px; line-height: 1.14; font-weight: 600; color: var(--navy); margin: 11px 0 8px; }
.home-tile-desc { font-size: 14px; line-height: 1.5; color: #44464d; margin-bottom: 18px; }
.home-start { display: inline-flex; align-items: center; gap: 6px; background: var(--crimson); color: #fff; border: none;
  font-size: 14px; font-weight: 600; padding: 11px 24px; border-radius: 999px; cursor: pointer; box-shadow: var(--glow); }
.home-preview { background: transparent; color: var(--navy); border: 1.5px solid var(--navy); font-size: 14px; font-weight: 600; padding: 10px 22px; border-radius: 999px; cursor: pointer; }

.home-cal { background: rgba(255,255,255,0.13); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  border: 1px solid rgba(255,255,255,0.18); border-radius: 16px; padding: 11px 11px 13px; margin-top: 16px;
  /* clip the horizontal week-strip slide; `clip` keeps the month-expand (vertical) visible */
  overflow-x: clip; }
.home-cal-head { display: flex; justify-content: space-between; align-items: center; padding: 2px 4px 9px; cursor: pointer; }
.cal-week-label { font-size: 12px; font-weight: 500; color: #fff; }
.cal-viewmonth { font-size: 11px; color: #E5ECFA; background: none; border: 0; padding: 3px 2px; cursor: pointer; }
.cal-monthnav { display: flex; align-items: center; gap: 12px; color: #fff; font-size: 15px; font-weight: 600; }
.cal-monthnav button { background: none; border: none; color: #fff; font-size: 18px; cursor: pointer; padding: 0 4px; }
.cal-collapse { background: rgba(255,255,255,0.14); border: 1px solid rgba(255,255,255,0.2); color: #C5D0EA; font-size: 11px; border-radius: 999px; padding: 3px 10px; cursor: pointer; }

.home-week { display: flex; justify-content: space-between; gap: 3px; }
.ws-day { flex: 1; text-align: center; padding: 8px 0 7px; background: none; border: none; border-radius: 14px;
  cursor: pointer; -webkit-tap-highlight-color: transparent; transition: background .15s ease; }
.ws-day:active { background: rgba(255,255,255,0.16); }
.ws-day.today { background: rgba(255,255,255,0.16); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); box-shadow: inset 0 0 0 1px rgba(255,255,255,0.30); }
.ws-day.today:active { background: rgba(255,255,255,0.22); }
.ws-l { font-size: 11px; color: #C5D0EA; }
.ws-day.today .ws-l { color: #e3eaf7; font-weight: 600; }
.ws-n { font-size: 15px; color: #fff; }
.ws-day.today .ws-n { color: #fff; font-weight: 700; }
.ws-dot { width: 5px; height: 5px; border-radius: 50%; margin: 3px auto 0; }
.ws-dot.empty { background: transparent; height: 5px; }
.ws-dot.done { background: #5DCAA5; }
.ws-dot.sched { background: #F0997B; }
.ws-dot.miss { background: #E24B4A; }

.mg-head { display: grid; grid-template-columns: repeat(7,1fr); text-align: center; font-size: 10px; color: #C5D0EA; font-weight: 600; margin: 2px 0 4px; }
.mg-grid { display: grid; grid-template-columns: repeat(7,1fr); gap: 2px; }
.mg-cell { background: none; border: none; padding: 4px 0 2px; text-align: center; cursor: pointer; }
.mg-cell.today { background: var(--card); border-radius: 9px; }
.mg-n { font-size: 12px; color: #fff; }
.mg-cell.mut .mg-n { color: #9AA8C8; }
.mg-cell.today .mg-n { color: var(--navy); font-weight: 700; }
.mg-dot { width: 6px; height: 6px; border-radius: 50%; margin: 2px auto 0; }
.mg-dot.empty { background: transparent; height: 6px; }
.mg-dot.done { background: #5DCAA5; }
.mg-dot.sched { background: #F0997B; }
.mg-dot.miss { background: #E24B4A; }
.mg-dot.test { border: 1.5px solid #E0A33A; }
.mg-legend { display: flex; gap: 12px; justify-content: center; margin-top: 10px; font-size: 9px; color: #C5D0EA; }
.mg-legend i { display: inline-block; width: 6px; height: 6px; border-radius: 50%; margin-right: 3px; vertical-align: middle; }
.mg-legend i.done { background: #5DCAA5; }
.mg-legend i.sched { background: #F0997B; }
.mg-legend i.test { border: 1px solid #E0A33A; }
.coach-viewtoggle { display: flex; gap: 4px; justify-content: center; flex-wrap: nowrap; margin-top: 10px; position: relative; z-index: 1; }
.cvt { font-size: 12.5px; font-weight: 500; padding: 5px 13px; border-radius: 999px; white-space: nowrap;
  border: 0.5px solid rgba(255,255,255,0.35); background: transparent; color: rgba(255,255,255,0.78); cursor: pointer; }
.cvt:not(.active):hover { background: rgba(255,255,255,0.12); color: #fff; }
.cvt.active { background: var(--card); color: var(--navy); border-color: #fff; }

/* week-at-a-glance day cards */
.cwk-day { display: block; width: 100%; text-align: left; background: var(--bg); border: 0.5px solid var(--border);
  border-radius: var(--radius-md); padding: 12px 14px; margin-bottom: 8px; cursor: pointer; }
.cwk-day.rest { background: var(--lane-light); }
.cwk-day-head { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 6px; }
.cwk-dow { font-size: 15px; font-weight: 500; color: var(--navy); }
.cwk-date { font-size: 12px; color: var(--text-mute); }
.cwk-theme { font-size: 12px; color: var(--crimson-ink); font-weight: 500; margin-bottom: 6px; }
.cwk-rest { font-size: 13px; color: var(--text-mute); }
.cwk-line { font-size: 12.5px; line-height: 1.5; color: var(--text); margin-top: 4px; display: flex; gap: 7px; align-items: baseline; }
.cwk-tag { flex: 0 0 auto; font-size: 9px; font-weight: 500; text-transform: uppercase; letter-spacing: 0.4px;
  padding: 2px 7px; border-radius: 5px; color: #fff; }
.cwk-tag.sprint { background: var(--crimson); }
.cwk-tag.hurdle { background: var(--crimson); opacity: 0.7; }
.cwk-tag.lift   { background: var(--shell); }
.cwk-tag.core   { background: var(--green); }

.lift-hint { font-size: 12.5px; color: var(--green); background: #eaf6f0; border-radius: 8px; padding: 7px 10px; margin: -2px 0 12px; }
.lift-hint strong { color: var(--green); }

/* Multi-block log: one grid per distance */
.modal-tall { max-height: 86vh; overflow-y: auto; }
.log-block { margin-bottom: 16px; }
.log-block:last-of-type { margin-bottom: 6px; }
.log-block-head { display: flex; align-items: baseline; gap: 8px; margin: 0 0 8px; flex-wrap: wrap; }
.log-block-dist { font-size: 16px; font-weight: 600; color: var(--navy); }
.log-block-meta { font-size: 12px; color: var(--text-soft); }
.log-block + .log-block { border-top: 0.5px solid var(--border-soft); padding-top: 14px; }

/* ─── Per-rep logging grid ─────────────────────────────────────────── */
.rep-grid { margin: 8px 0; }
.set-block { margin-bottom: 12px; }
.set-label { font-size: 11px; color: var(--text-mute); text-transform: uppercase; letter-spacing: 0.5px; font-weight: 500; margin-bottom: 6px; }
.rep-row {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(72px, 1fr));
  gap: 6px;
}
.rep-cell {
  display: flex; flex-direction: column;
  background: var(--lane-light);
  border-radius: 8px;
  padding: 6px 8px;
  position: relative;
}
.rep-cell-label {
  font-size: 9px;
  color: var(--text-mute);
  text-transform: uppercase;
  letter-spacing: 0.4px;
  font-weight: 500;
  margin-bottom: 2px;
}
.rep-cell input {
  background: transparent;
  border: none;
  font-size: 14px;
  font-weight: 500;
  color: var(--navy);
  padding: 0;
  width: 100%;
  font-variant-numeric: tabular-nums;
}
.rep-cell input:focus { outline: none; }
.rep-cell.filled { background: var(--card); border: 1px solid var(--navy); }
.btn-add-rep {
  background: transparent;
  color: var(--crimson-ink);
  font-size: 12px;
  font-weight: 500;
  padding: 8px 12px;
  border-radius: 8px;
  margin-top: 4px;
  border: 1px dashed var(--crimson);
  width: 100%;
}

/* ─── Progress: testing sparklines ─────────────────────────────────── */
.progress-card {
  background: var(--card);
  border: 0.5px solid var(--border);
  border-radius: var(--radius-md);
  padding: 12px 14px;
  margin-bottom: 8px;
}
.progress-card-head {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}
.progress-test-name {
  font-size: 13px;
  font-weight: 500;
  color: var(--navy);
}
.progress-delta {
  font-size: 11px;
  font-weight: 500;
  padding: 3px 9px;
  border-radius: 10px;
  font-variant-numeric: tabular-nums;
}
.progress-delta.improved  { background: #e1f5ee; color: var(--green); }
.progress-delta.regressed { background: var(--crimson-soft); color: var(--crimson-ink); }
.progress-delta.baseline  { background: var(--lane-light); color: var(--text-mute); }
.progress-values {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  margin-bottom: 8px;
}
.progress-window {
  text-align: center;
  font-size: 10px;
}
.progress-window-label { color: var(--text-mute); text-transform: uppercase; letter-spacing: 0.4px; font-weight: 500; }
.progress-window-value {
  display: block;
  font-size: 13px;
  font-weight: 500;
  color: var(--text);
  margin-top: 2px;
  font-variant-numeric: tabular-nums;
}
.progress-window-value.empty { color: var(--text-mute); font-weight: 400; }
.sparkline-wrap { display: block; margin-top: 4px; }
.sparkline-wrap svg { display: block; width: 100%; height: 36px; }
.sparkline-empty {
  font-size: 11px;
  color: var(--text-mute);
  text-align: center;
  padding: 8px 0;
  font-style: italic;
}

/* ─── Test-primary cards (one card per test, 4 window cells across) ──── */
.test-row-card {
  background: var(--card);
  border: 0.5px solid var(--border);
  border-radius: var(--radius-md);
  padding: 12px 14px;
  margin-bottom: 8px;
}
.test-row-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
  gap: 8px;
}
.test-row-name { font-size: 14px; font-weight: 500; color: var(--navy); }
.test-row-cells {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
}
.test-cell {
  background: var(--lane-light);
  border-radius: 10px;
  padding: 9px 4px;
  text-align: center;
  cursor: pointer;
  border: 1px solid transparent;
  transition: transform 0.08s, background 0.12s;
  min-height: 56px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 3px;
}
.test-cell:active { transform: scale(0.96); }
.test-cell.logged {
  background: var(--crimson-soft);
  border-color: var(--crimson);
}
.test-cell.next {
  background: var(--card);
  border: 1px dashed var(--crimson);
}
.test-cell.future { opacity: 0.6; }
.test-cell-label {
  font-size: 9px;
  color: var(--text-mute);
  text-transform: uppercase;
  letter-spacing: 0.4px;
  font-weight: 500;
}
.test-cell.logged .test-cell-label { color: var(--crimson-ink); }
.test-cell.next .test-cell-label { color: var(--crimson-ink); }
.test-cell-value {
  font-size: 13px;
  font-weight: 500;
  color: var(--navy);
  font-variant-numeric: tabular-nums;
}
.test-cell.logged .test-cell-value { color: var(--crimson-ink); }
.test-cell.empty .test-cell-value, .test-cell.future .test-cell-value {
  color: var(--text-mute);
  font-weight: 400;
}

/* ─── Calendar screen ──────────────────────────────────────────────── */
.cal-bar {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 4px 10px;
}
.cal-month { font-size: 16px; font-weight: 500; color: var(--navy); }
.cal-arrow {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--lane-light);
  color: var(--navy);
  font-size: 18px;
  display: flex; align-items: center; justify-content: center;
}
.cal-arrow:active { background: var(--border); }
.cal-weekdays {
  display: grid; grid-template-columns: repeat(7, 1fr);
  text-align: center;
  font-size: 10px; font-weight: 500;
  color: var(--text-mute);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 6px 0;
}
.cal-grid {
  display: grid; grid-template-columns: repeat(7, 1fr);
  gap: 4px;
}
.cal-day {
  aspect-ratio: 1;
  border-radius: 10px;
  background: transparent;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 3px;
  font-size: 13px;
  color: var(--text);
  position: relative;
  padding: 4px 0;
}
.cal-day.outside    { color: var(--text-mute); opacity: 0.4; }
.cal-day.today      { background: var(--shell); color: #fff; font-weight: 500; }
.cal-day.training   { background: var(--lane-light); }
.cal-day.rest       { background: var(--rest-bg); color: var(--rest-accent); }
.cal-day.logged     { background: var(--crimson-soft); color: var(--crimson-ink); font-weight: 500; }
.cal-day.testing::after {
  content: "";
  position: absolute;
  top: 4px; right: 4px;
  width: 6px; height: 6px;
  background: var(--crimson);
  border-radius: 50%;
}
.cal-day:active     { transform: scale(0.95); }
.cal-day-dot {
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--crimson);
}
.cal-day.today .cal-day-dot { background: var(--card); }
.cal-legend {
  display: flex; gap: 12px; flex-wrap: wrap;
  font-size: 10px; color: var(--text-soft);
  padding: 12px 4px 4px;
}
.cal-legend .swatch {
  display: inline-block; width: 10px; height: 10px;
  border-radius: 3px; vertical-align: middle; margin-right: 4px;
}

/* Day-detail modal extras */
.day-detail-section { margin-top: 10px; }
.day-detail-section h4 {
  font-size: 11px; color: var(--text-mute);
  text-transform: uppercase; letter-spacing: 0.5px;
  font-weight: 500; margin: 12px 0 6px;
}
.day-detail-section p { font-size: 13px; margin: 0 0 4px; color: var(--text); }

/* ─── Pace Calculator ──────────────────────────────────────────────── */
.pc-result {
  background: linear-gradient(135deg, var(--shell) 0%, var(--shell-light) 100%);
  color: #fff;
  border-radius: var(--radius-lg);
  padding: 22px 18px;
  text-align: center;
  margin-bottom: 18px;
}
.pc-result-eyebrow {
  font-size: 10px;
  opacity: 0.7;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  font-weight: 500;
}
.pc-result-time {
  font-size: 44px;
  font-weight: 500;
  margin-top: 4px;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.5px;
}
.pc-result-sub {
  font-size: 12px;
  opacity: 0.85;
  margin-top: 6px;
}

.pc-section { margin-bottom: 16px; }
.pc-label {
  font-size: 10px;
  color: var(--text-mute);
  text-transform: uppercase;
  letter-spacing: 0.6px;
  font-weight: 500;
  margin: 0 0 8px;
}
.pc-pills {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.pc-pill {
  background: var(--lane-light);
  color: var(--navy);
  border: 1px solid transparent;
  font-size: 12px;
  font-weight: 500;
  padding: 6px 12px;
  border-radius: 16px;
  cursor: pointer;
  transition: transform 0.08s, background 0.12s;
}
.pc-pill:active { transform: scale(0.95); }
.pc-pill.active { background: var(--crimson); color: #fff; }
.pc-pill.dim { color: var(--text-mute); }

/* ─── Empty / loading ──────────────────────────────────────────────── */
.empty-state { text-align: center; padding: 40px 20px; color: var(--text-soft); }
.empty-state p { font-size: 14px; }

/* ─── Shared frosted "screen" look (Today / Progress / Profile) ─────── */
.day-screen { min-height: 100vh; background: var(--lane-light); color: var(--text); }
.day-screen .page-body { background: transparent; }
.day-screen .section-label { color: var(--text-mute); }
.day-screen .empty-state, .day-screen .empty-state p { color: var(--text-mute); }
.day-screen .test-window { border: 0.5px solid var(--border); }
/* Coach screens: bare helper text on the light canvas */
.day-screen .team-summary { color: var(--text-mute); }
/* Header crest sits in the navy band — no white box */
.day-screen .app-logo { background: transparent; padding: 0; border-radius: 0; }

/* Today accordion tiles: Warm-up / Main session / Cool-down — match Home tile look */
.day-body { padding-top: 26px; }
.day-acc { position: relative; z-index: 1; background: #f3f6fc;
  border: 1px solid rgba(var(--navy-light-rgb),0.12); border-radius: 16px; box-shadow: none;
  overflow: hidden; }
/* Separate cards stacked vertically — each expands on tap (flat, like other tiles) */
.day-acc + .day-acc { margin-top: 12px; }
.day-acc.open { z-index: 2; background: #f3f6fc; box-shadow: none; border-color: rgba(var(--navy-light-rgb),0.18); }
.day-acc.open .day-acc-head { border-bottom: 2px solid var(--crimson); }
.day-acc:last-child { margin-bottom: 4px; }
.day-acc-head { width: 100%; display: flex; align-items: center; justify-content: space-between;
  padding: 16px 18px; background: none; border: none; cursor: pointer; }
.day-acc-title { font-size: 23px; font-weight: 800; color: var(--navy); letter-spacing: -0.01em; }
.day-acc-chev { width: 22px; height: 22px; color: var(--steel); transition: transform .22s ease; flex: 0 0 auto; }
.day-acc.open .day-acc-chev { transform: rotate(180deg); }
.day-acc-body { display: none; padding: 0 18px 16px; }
.day-acc.open .day-acc-body { display: block; }
/* Flatten the inner cards into clean sections within the one rounded tile */
.day-acc-body .card { background: transparent; border: none; border-left: none; border-radius: 0;
  box-shadow: none; padding: 14px 0; margin: 0; }
/* Clearer separator + breathing room between sections inside a tile */
.day-acc-body .card + .card { border-top: 1px solid rgba(var(--navy-rgb),0.12); margin-top: 4px; padding-top: 16px; }
.day-acc-body > *:first-child { padding-top: 4px; }

.seg-list { margin: 4px 0 6px; padding-left: 18px; }
.seg-list li { font-size: 14px; line-height: 1.7; color: var(--text); }
.seg-note { font-size: 12px; color: var(--text-soft); font-style: italic; margin-top: 6px; }
/* Warm-up / cool-down steps: separated rows so each block reads on its own */
.seg-step { margin-bottom: 12px; }
.seg-step:last-child { margin-bottom: 0; }
.seg-step + .seg-step { border-top: 1px solid rgba(var(--navy-rgb),0.10); padding-top: 12px; margin-top: 12px; }
.seg-step-h { font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--navy); margin: 0 0 4px; }
.seg-step-note { font-size: 12px; color: var(--rest-accent); font-weight: 500; margin-top: 2px; }
/* Clean single-column list for coach-provided warm-up text */
.seg-clean { list-style: none; margin: 6px 0 2px; padding: 0; }
.seg-clean li { font-size: 14px; line-height: 1.55; color: var(--text); padding: 8px 0; border-top: 1px solid rgba(var(--navy-rgb),0.08); }
.seg-clean li:first-child { border-top: 0; padding-top: 2px; }

/* Warm-up / cool-down — numbered sequential sections, left-aligned, per-exercise video icon */
.wu-sec { padding: 13px 0; border-top: 1px solid rgba(var(--navy-rgb),0.10); }
.wu-sec:first-child { border-top: 0; padding-top: 2px; }
.wu-sec-h { display: flex; align-items: baseline; gap: 9px; margin-bottom: 4px; }
.wu-num { flex: 0 0 auto; min-width: 18px; font-family: var(--font-display, "Kanit"), -apple-system, Arial, sans-serif;
  font-style: italic; font-weight: 800; font-size: 15px; color: var(--crimson-ink); }
.wu-sec-name { font-size: 14px; font-weight: 800; text-transform: uppercase; letter-spacing: .03em; color: var(--navy); }
.wu-note { margin-left: auto; font-size: 11px; font-weight: 700; color: var(--green); background: rgba(18,165,148,.10); padding: 3px 8px; border-radius: 999px; white-space: nowrap; }
.wu-ex { display: flex; align-items: center; gap: 10px; padding: 8px 0 8px 27px; border-top: 1px solid rgba(var(--navy-rgb),0.06); }
.wu-ex:first-child { border-top: 0; }
.wu-ex-num { flex: 0 0 auto; min-width: 16px; font-size: 12px; font-weight: 700; color: var(--text-mute); font-variant-numeric: tabular-nums; }
.wu-ex-name { flex: 1; min-width: 0; text-align: left; font-size: 13.5px; line-height: 1.35; color: var(--text); }
.wu-vid { flex: 0 0 auto; background: none; border: 0; padding: 2px; cursor: pointer; color: var(--navy-light); opacity: .5; }
.wu-vid:active { opacity: .85; }
.seg-ol { list-style: decimal; }
.seg-ol li { padding-left: 2px; }
.seg-ol li::marker { color: var(--steel); font-weight: 600; }
.day-foot { font-size: 11px; color: #C5D0EA; margin-top: 10px; }
.day-foot a { color: #fff; text-decoration: underline; }

/* ─── Onboarding (profile setup) ───────────────────────────────────── */
.onb-screen { display: flex; flex-direction: column; }
.onb-head { padding: calc(28px + var(--safe-top)) 22px 6px; text-align: center; color: #fff; }
.onb-title { font-size: 21px; font-weight: 600; }
.onb-sub { font-size: 13px; color: #C5D0EA; margin-top: 3px; }
.onb-crest { width: 62px; height: 62px; object-fit: contain; display: block; margin: 0 auto 10px; }
.onb-card { max-width: 380px; margin: 8px auto 0; }
/* Frosted registration cards (parent sign-up + athlete onboarding) ---------- */
.onb-card { background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.16);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-shadow: 0 10px 30px rgba(0,0,0,0.22); }
.onb-card .auth-label { color: #9FB0D0; }
.onb-card .auth-hint { color: #9FB0D0; }
.onb-card .auth-input { background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.2); color: #fff; }
.onb-card .auth-input::placeholder { color: #7E8DAC; }
.onb-card .auth-input:focus { border-color: rgba(255,255,255,0.5); }
.onb-card .auth-eye { color: #C5D0EA; }
.onb-card .auth-error { color: #FF9B9B; }
.onb-card .btn-primary { background: var(--crimson); border-color: var(--crimson); }
.onb-card .btn-primary:active { background: color-mix(in srgb, var(--accent) 78%, #000); }
.onb-card .auth-link { color: #C5D0EA; }
.onb-card .consent-line { background: rgba(255,255,255,0.05); border-color: rgba(255,255,255,0.16); }
.onb-card .consent-line span:last-child { color: #C5D0EA; }
.onb-card .consent-box { border-color: rgba(255,255,255,0.4); }
.onb-card .onb-photo-label { color: #9FB0D0; }
/* dark popovers so the lookups match the frosted card */
.onb-card .ac-list { background: #16223d; border-color: rgba(255,255,255,0.16); box-shadow: 0 12px 30px rgba(0,0,0,0.5); }
.onb-card .ac-opt { border-bottom-color: rgba(255,255,255,0.08); }
.onb-card .ac-opt:hover, .onb-card .ac-opt:focus { background: rgba(198,40,40,0.22); }
.onb-card .ac-n { color: #fff; }
.onb-card .ac-c { color: #9FB0D0; }
.onb-card .fcal { background: #16223d; border-color: rgba(255,255,255,0.16); box-shadow: 0 14px 34px rgba(0,0,0,0.55); }
.onb-card .fcal-t { color: #fff; }
.onb-card .fcal-t:hover { background: rgba(255,255,255,0.08); }
.onb-card .fcal-dow span { color: #9FB0D0; }
.onb-card .fcal-cell { color: #fff; }
.onb-card .fcal-cell:hover { background: rgba(255,255,255,0.12); }
.onb-card .fcal-cell.sel { background: var(--crimson); }
.onb-card .fcal-m, .onb-card .fcal-y { background: rgba(255,255,255,0.06); color: #fff; }
.onb-card .fcal-m:hover, .onb-card .fcal-y:hover { background: rgba(255,255,255,0.12); }
.onb-card .fcal-m.sel, .onb-card .fcal-y.sel { background: var(--crimson); }
.auth-parent-lead { color: var(--text-mute); font-size: 14px; }
/* Home: "not in a class yet" reminder banner */
.home-joinclass { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%;
  background: var(--crimson-soft); border: 1px solid rgba(var(--accent-rgb),0.28); border-radius: 14px;
  padding: 14px 16px; margin: 0 0 12px; cursor: pointer; text-align: left; }
.home-joinclass .hj-title { display: block; font-size: 15px; font-weight: 600; color: var(--crimson-ink); }
.home-joinclass .hj-sub { display: block; font-size: 12.5px; color: var(--navy); opacity: 0.75; margin-top: 2px; }
.home-joinclass .hj-cta { flex: 0 0 auto; font-size: 13px; font-weight: 600; color: #fff; background: var(--crimson); border-radius: 999px; padding: 8px 14px; }
.home-empty-card { text-align: center; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); border-radius: 16px; padding: 30px 22px; margin-top: 4px; }
.home-empty-card .he-ic { width: 60px; height: 60px; border-radius: 50%; background: rgba(255,255,255,0.08); display: flex; align-items: center; justify-content: center; margin: 0 auto 12px; color: #C5D0EA; }
.home-empty-card .he-title { font-size: 17px; font-weight: 600; color: #fff; margin-bottom: 6px; }
.home-empty-card .he-sub { font-size: 13.5px; line-height: 1.5; color: #C5D0EA; }
/* Consistent field height + native date / select styling on frosted cards */
.onb-card .auth-input { min-height: 46px; }
.onb-card select.auth-input { -webkit-appearance: none; appearance: none; padding-right: 40px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%238B93A2' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 16px center; }
.onb-card .auth-input[type="date"] { color: #fff; }
.onb-card .auth-input[type="date"]::-webkit-datetime-edit,
.onb-card .auth-input[type="date"]::-webkit-datetime-edit-text,
.onb-card .auth-input[type="date"]::-webkit-datetime-edit-month-field,
.onb-card .auth-input[type="date"]::-webkit-datetime-edit-day-field,
.onb-card .auth-input[type="date"]::-webkit-datetime-edit-year-field { color: #fff; }
.onb-card .auth-input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(1) opacity(0.75); }
/* code + button rows (join class / copy email) */
.code-row { display: flex; gap: 8px; align-items: stretch; }
.code-row .auth-input { flex: 1; min-width: 0; }
.code-row .code-join { width: auto; flex: 0 0 auto; padding: 0 20px; }
.nr-divider { display: flex; align-items: center; gap: 10px; margin: 18px 0 12px; color: #9FB0D0; }
.nr-divider::before, .nr-divider::after { content: ""; flex: 1; height: 1px; background: rgba(255,255,255,0.16); }
.nr-divider span { font-size: 12px; text-transform: uppercase; letter-spacing: 0.06em; }
.verify-ok { display: flex; align-items: center; justify-content: center; gap: 8px; width: fit-content; margin: 2px auto 18px;
  font-size: 15px; font-weight: 600; color: #1D9E75; background: rgba(29,158,117,0.14); border: 1px solid rgba(29,158,117,0.45); border-radius: 999px; padding: 10px 20px; }
.verify-ok svg { width: 18px; height: 18px; }
/* ===== Unified branded auth/registration: navy splash + dark frosted pull-up sheet ===== */
/* Big tiger fixed in the navy background; frosted sheet pulls up over it (matches Sign in). */
.authx { position: relative; min-height: 100vh; overflow: hidden;
  background: radial-gradient(115% 85% at 50% 34%, #243a66 0%, #16223f 50%, #0a1120 100%); }
.authx-splash { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding-top: 0; pointer-events: none; }
.authx-crest { width: 150px; height: 150px; object-fit: contain;
  filter: drop-shadow(0 0 12px rgba(125,160,215,0.22)) drop-shadow(0 8px 18px rgba(0,0,0,0.4)); }
.authx-sheet { position: absolute; left: 0; right: 0; bottom: 0; width: 100%; max-width: 480px; margin: 0 auto;
  max-height: 86vh; overflow-y: auto; border-radius: 26px 26px 0 0; padding: 8px 22px calc(28px + var(--safe-bottom)); }
.authx-title { font-family: var(--font-display); font-style: italic; text-transform: uppercase;
  font-size: 26px; font-weight: 700; letter-spacing: .01em; text-align: center; margin: 4px 0 4px; }
.authx-sub { font-size: 13px; text-align: center; margin: 0 0 18px; color: #C5D0EA; }
.authx-body .onb-photo-wrap { margin-top: 0; }
/* dark frosted sheet treatment (shared by sign-in + registration) */
/* v5.156.0 THEME FIX: .auth-sheet.sheet-dark was changed to background:var(--card)
   during the token migration, but every text rule below still hardcoded the old
   dark-sheet palette. Result: white titles, white input text and white links on a
   white card, i.e. invisible in light mode. Sign in, Create your account, Forgot
   password and typed characters were all unreadable. Now fully tokenised. */
.sheet-dark { background: var(--card); -webkit-backdrop-filter: blur(13px) saturate(1.1); backdrop-filter: blur(13px) saturate(1.1);
  border-top: 1px solid var(--border); box-shadow: 0 -16px 46px rgba(8,14,28,0.28); }
.sheet-dark .auth-sheet-title, .sheet-dark .authx-title { color: var(--text); }
.sheet-dark .auth-label { color: var(--text-mute); }
.sheet-dark .auth-input { background: var(--bg); border: 1px solid var(--border); color: var(--text); min-height: 46px; }
.sheet-dark .auth-input::placeholder { color: var(--text-mute); }
.sheet-dark .auth-input:focus { border-color: var(--crimson); outline: none; box-shadow: 0 0 0 1.5px rgba(var(--accent-rgb),0.55); }
.sheet-dark .auth-hint { color: var(--text-mute); }
.sheet-dark .auth-error { color: var(--stat-bad); }
.sheet-dark .btn-primary { background: var(--crimson); border-color: var(--crimson); color: #fff; }
.sheet-dark .btn-primary:active { background: #871d31; }
.sheet-dark .auth-eye { color: var(--text-mute); }
.sheet-dark .auth-link, .sheet-dark .auth-link-inline { color: var(--crimson-ink); }
.sheet-dark .auth-switch, .sheet-dark .auth-parent-lead { color: var(--text-mute); }
.sheet-dark .auth-sheet-grab { background: var(--border); }
.sheet-dark select.auth-input { -webkit-appearance: none; appearance: none; padding-right: 40px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%238B93A2' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 16px center; }
.sheet-dark .auth-input[type="date"] { color: var(--text); }
.sheet-dark .auth-input[type="date"]::-webkit-datetime-edit,
.sheet-dark .auth-input[type="date"]::-webkit-datetime-edit-text,
.sheet-dark .auth-input[type="date"]::-webkit-datetime-edit-month-field,
.sheet-dark .auth-input[type="date"]::-webkit-datetime-edit-day-field,
.sheet-dark .auth-input[type="date"]::-webkit-datetime-edit-year-field { color: var(--text); }
.sheet-dark .auth-input[type="date"]::-webkit-calendar-picker-indicator { opacity: 0.75; }
html[data-theme="dark"] .sheet-dark .auth-input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(1) opacity(0.75); }
.sheet-dark .ac-list { background: var(--card); border-color: var(--border); box-shadow: 0 12px 30px rgba(0,0,0,0.28); }
.sheet-dark .ac-opt { border-bottom-color: var(--border); }
.sheet-dark .ac-opt:hover, .sheet-dark .ac-opt:focus { background: var(--crimson-soft); }
.sheet-dark .ac-n { color: var(--text); }
.sheet-dark .ac-c { color: #9FB0D0; }
.sheet-dark .fcal { background: #16223d; border-color: rgba(255,255,255,0.16); }
.sheet-dark .consent-line { background: rgba(255,255,255,0.05); border-color: rgba(255,255,255,0.16); }
.sheet-dark .consent-line span:last-child { color: #C5D0EA; }
.sheet-dark .consent-box { border-color: rgba(255,255,255,0.4); }
.sheet-dark .onb-photo-label { color: #9FB0D0; }
.onb-photo-wrap { display: flex; flex-direction: column; align-items: center; gap: 6px; margin: 4px 0 14px; }
.onb-photo { position: relative; width: 92px; height: 92px; border-radius: 50%; background: var(--rest-bg);
  border: 1px solid var(--border); display: flex; align-items: center; justify-content: center; cursor: pointer; overflow: visible; padding: 0; }
.onb-photo img { width: 92px; height: 92px; border-radius: 50%; object-fit: cover; display: none; }
.onb-photo-ic { width: 44px; height: 44px; color: var(--steel); display: flex; }
.onb-photo-ic svg { width: 44px; height: 44px; }
.onb-photo-badge { position: absolute; right: -2px; bottom: -2px; width: 30px; height: 30px; border-radius: 50%;
  background: var(--crimson); border: 2px solid #fff; display: flex; align-items: center; justify-content: center; color: #fff; }
.onb-photo-badge svg { width: 16px; height: 16px; }
.onb-photo-label { font-size: 12px; color: var(--text-mute); }
.onb-file, #onb-file, .onb-photo-wrap input[type="file"] { display: none; }
.onb-row2 { display: flex; gap: 8px; }
.onb-row2 > div { flex: 1; }
.onb-select { -webkit-appearance: none; appearance: none; background-image:
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%238893A6' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center; padding-right: 34px; }

/* Profile photo header (athlete Profile) */
.profile-hero { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 6px 0 12px; }
.profile-av { width: 116px; height: 116px; border-radius: 50%; background: var(--crimson); color: #fff;
  font-size: 40px; font-weight: 600; display: flex; align-items: center; justify-content: center;
  overflow: hidden; border: 3px solid rgba(255,255,255,0.55); box-shadow: 0 5px 18px rgba(8,16,38,0.34); }
.profile-av img { width: 100%; height: 100%; object-fit: cover; }
.profile-hero-name { color: #fff; font-size: 19px; font-weight: 600; }
.profile-hero-sub { color: #C5D0EA; font-size: 13px; }
.profile-edit { margin-top: 8px; background: rgba(255,255,255,0.16); border: 1px solid rgba(255,255,255,0.4);
  color: #fff; font-size: 13px; font-weight: 500; border-radius: 999px; padding: 7px 18px; cursor: pointer; }
.profile-edit:active { background: rgba(255,255,255,0.28); }
.onb-back { position: absolute; left: 14px; top: calc(14px + var(--safe-top)); background: rgba(255,255,255,0.16);
  border: 1px solid rgba(255,255,255,0.35); color: #fff; font-size: 13px; font-weight: 500;
  border-radius: 999px; padding: 6px 14px; cursor: pointer; }
.onb-head { position: relative; }
.coach-detail-actions { display: flex; gap: 10px; margin-bottom: 10px; }
.coach-detail-actions button { flex: 1; margin-bottom: 0; }
.pc-coach-back { background: var(--shell); padding: 0 18px 12px; }

/* Coach roster / detail avatar photos */
.tile-avatar img, .tile-avatar.sm img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }
.coach-ath-av { width: 54px; height: 54px; background: var(--crimson); border-radius: 50%; padding: 0; color: #fff;
  font-size: 18px; font-weight: 600; overflow: hidden; }
.coach-ath-av img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }

/* Photo crop / zoom modal */
.crop-modal { background: var(--card); border-radius: 16px; padding: 18px; width: 320px; max-width: 92vw; }
.crop-title { font-size: 16px; font-weight: 600; color: var(--navy); margin-bottom: 12px; text-align: center; }
.crop-stage { position: relative; width: 280px; height: 280px; max-width: 84vw; margin: 0 auto; overflow: hidden;
  background: #000; border-radius: 8px; touch-action: none; cursor: grab; }
.crop-stage:active { cursor: grabbing; }
.crop-stage img { position: absolute; top: 0; left: 0; transform-origin: 0 0; user-select: none; -webkit-user-drag: none; max-width: none; }
.crop-ring { position: absolute; inset: 0; pointer-events: none; border-radius: 50%; box-shadow: 0 0 0 9999px rgba(0,0,0,0.45); }
.crop-zoom { display: flex; align-items: center; gap: 10px; margin: 16px 4px 2px; }
.crop-zoom input { flex: 1; }
.crop-zoom-ic { font-size: 18px; font-weight: 600; color: var(--text-mute); width: 14px; text-align: center; }
.crop-actions { display: flex; gap: 10px; margin-top: 14px; }
.crop-actions button { flex: 1; }

/* ─── Team messaging (feature #6) ───────────────────────────────────────── */
.conv-list { display: flex; flex-direction: column; gap: 10px; }
.conv-row { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left;
  background: rgba(255,255,255,0.97); border: none; border-radius: 16px; padding: 13px 14px; cursor: pointer; }
.conv-av { width: 44px; height: 44px; border-radius: 50%; background: #eef1f5; overflow: hidden;
  display: flex; align-items: center; justify-content: center; font-weight: 600; font-size: 18px; color: #16202e; }
.conv-av img { width: 100%; height: 100%; object-fit: cover; }
.conv-pin .conv-av { background: var(--accent-soft); }
.conv-main { flex: 1; min-width: 0; }
.conv-title { font-size: 15px; font-weight: 600; color: #16202e; }
.conv-sub { font-size: 12.5px; color: #6b7785; margin-top: 2px; }
.conv-chev { color: #b6bfca; font-size: 22px; }

.msg-back { background: none; border: none; color: #fff; font-size: 30px; line-height: 1; padding: 0 8px 0 0; cursor: pointer; }
.msg-loading { color: rgba(255,255,255,0.7); text-align: center; padding: 24px; font-size: 13px; }

.ann-card { background: rgba(255,255,255,0.97); border-radius: 16px; padding: 14px; margin-bottom: 12px; }
.ann-head { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.ann-from { font-size: 13px; font-weight: 600; color: var(--accent-ink); }
.ann-when { font-size: 11px; color: #8893a2; white-space: nowrap; }
.ann-body { font-size: 14px; color: #1f2a37; line-height: 1.5; margin-top: 6px; white-space: pre-wrap; word-break: break-word; }
.ann-locked { font-size: 11.5px; color: #9aa3b0; margin-top: 10px; font-style: italic; }
.ann-del { margin-top: 10px; background: none; border: 0.5px solid color-mix(in srgb, var(--accent) 34%, transparent); color: var(--accent-ink); border-radius: 8px; padding: 4px 10px; font-size: 11px; cursor: pointer; }
.ann-del.small { margin-top: 6px; padding: 2px 8px; font-size: 10px; }
.ann-replies { margin-top: 10px; border-top: 0.5px solid #eef0f3; padding-top: 8px; display: flex; flex-direction: column; gap: 8px; }
.ann-reply { background: #f4f6f9; border-radius: 10px; padding: 8px 10px; }
.ann-reply-head { display: flex; justify-content: space-between; gap: 8px; }
.ann-reply-head .ann-from { font-size: 12px; color: #16202e; }
.ann-reply-body { font-size: 13px; color: #1f2a37; margin-top: 3px; white-space: pre-wrap; word-break: break-word; }

.msg-atts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.msg-att { font-size: 12px; border-radius: 10px; text-decoration: none; }
.msg-att-link, .msg-att-file { display: inline-block; padding: 6px 10px; background: #eef1f5; color: #16407a; border: 0.5px solid #dbe2ea; word-break: break-all; }
.msg-att-img img { max-width: 210px; max-height: 210px; border-radius: 10px; display: block; }
.msg-link { color: #185fa5; text-decoration: underline; word-break: break-all; }

.msg-composer { background: rgba(255,255,255,0.97); border-radius: 14px; padding: 8px; margin-top: 10px; }
.ann-card .msg-composer { background: #f4f6f9; }
.msg-chiprow { display: flex; flex-wrap: wrap; gap: 6px; }
.msg-chiprow:not(:empty) { margin-bottom: 6px; }
.att-chip { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; background: #e3e7ee; color: #3a4453; border-radius: 14px; padding: 3px 8px; }
.att-chip button { background: none; border: none; color: #6b7785; font-size: 13px; line-height: 1; cursor: pointer; }
.msg-replytoggle { display: flex; align-items: center; gap: 7px; font-size: 12.5px; color: #3a4453; margin: 2px 2px 8px; }
.msg-inputrow { display: flex; align-items: flex-end; gap: 7px; }
.msg-attbtn { flex: none; width: 34px; height: 34px; border-radius: 50%; border: 0.5px solid #dbe2ea; background: var(--card); color: var(--accent-ink); font-size: 17px; cursor: pointer; }
.msg-body { flex: 1; resize: none; border: 0.5px solid #dbe2ea; border-radius: 14px; padding: 8px 11px; font: inherit; font-size: 14px; max-height: 120px; }
.msg-sendbtn { flex: none; background: var(--accent); color: #fff; border: none; border-radius: 14px; padding: 9px 14px; font-size: 13px; font-weight: 600; cursor: pointer; }
.msg-sendbtn:disabled { opacity: 0.5; }

.dm-body { display: flex; flex-direction: column; }
#dm-thread { flex: 1; display: flex; flex-direction: column; gap: var(--msg-gap); padding-bottom: 6px; }
.dm-daysep { align-self: center; font-size: 10.5px; color: rgba(255,255,255,0.75); background: rgba(255,255,255,0.14); padding: 3px 10px; border-radius: 14px; margin: 2px 0; }
.dm-bubble { max-width: 80%; padding: 8px 11px 5px; border-radius: 14px; }
.dm-theirs { align-self: flex-start; background: rgba(255,255,255,0.97); color: #1f2a37; border-bottom-left-radius: 5px; }
.dm-mine { align-self: flex-end; background: var(--accent); color: #fff; border-bottom-right-radius: 5px; }
.dm-text { font-size: 14px; line-height: 1.4; white-space: pre-wrap; word-break: break-word; }
.dm-mine .msg-link { color: #ffd9e0; }
.dm-stamp { font-size: 9.5px; margin-top: 3px; opacity: 0.75; text-align: right; }
.dm-del { background: none; border: none; color: inherit; font-size: 9.5px; text-decoration: underline; cursor: pointer; opacity: 0.85; }

.nav-icon { position: relative; }
.nav-badge { position: absolute; top: -4px; right: -9px; min-width: 15px; height: 15px; border-radius: 8px;
  background: var(--accent); color: #fff; font-size: 9px; font-weight: 600; display: flex; align-items: center; justify-content: center; padding: 0 3px; }
.nav-badge.hidden { display: none; }

/* announcement date separators + sender/time footer (v3.2.2) */
.ann-daysep { align-self: center; display: block; width: max-content; margin: 4px auto 10px; font-size: 10.5px;
  color: rgba(255,255,255,0.8); background: rgba(255,255,255,0.16); padding: 3px 11px; border-radius: 14px; text-align: center; }
.ann-foot { font-size: 11px; color: #8893a2; margin-top: 8px; }
.ann-foot-main { font-weight: 500; color: #6b7785; }
.ann-reply .ann-foot { margin-top: 5px; }

/* compose icon + conversation previews (v3.3) */
.msg-compose-btn { background: none; border: none; color: #fff; padding: 4px; cursor: pointer; display: flex; align-items: center; }
.conv-toprow { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.conv-when { font-size: 11px; color: #8893a2; white-space: nowrap; flex: none; }
.conv-sub { font-size: 12.5px; color: #6b7785; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.compose-opt { display: block; width: 100%; text-align: left; margin-bottom: 8px; }
.dm-picker { display: flex; flex-direction: column; gap: 8px; max-height: 50vh; overflow-y: auto; margin: 4px 0 10px; }
.dm-picker .conv-row { background: #f4f6f9; }

/* v3.4 — larger message fonts, coach logo avatar, date field width */
.ann-body { font-size: 15.5px; line-height: 1.55; }
.ann-reply-body { font-size: 14.5px; }
.dm-text { font-size: 15.5px; }
.conv-title { font-size: 16px; }
.conv-sub { font-size: 13.5px; }
.ann-foot, .ann-foot-main { font-size: 12px; }
.conv-av-ic { display: flex; align-items: center; justify-content: center; color: var(--accent-ink); }
.conv-av img { width: 100%; height: 100%; object-fit: cover; }
/* date inputs render full-width even when empty (iOS shrinks them otherwise) */
/* Styled (appearance:none) box keeps it inside the card; the ::-webkit-date-and-time-value
   width:100% above stops empty ones collapsing narrow. */
.auth-input[type="date"] { width: 100%; max-width: 100%; box-sizing: border-box; display: block; min-height: 44px; }

/* announcement titles (v3.4) */
.ann-title { font-size: 16px; font-weight: 600; color: #16202e; margin-bottom: 4px; }
.conv-pin .conv-sub { color: #5a6472; }

/* per-set lift inputs (v3.4) */
.lift-sets { display: flex; flex-direction: column; gap: 7px; margin: 6px 0 4px; }
.lift-set-row { display: flex; align-items: center; gap: 8px; }
.lift-set-num { font-size: 12px; color: var(--text-soft); width: 42px; flex: none; }
.lift-set-w, .lift-set-r { flex: 1; min-width: 0; border: 0.5px solid var(--border); border-radius: 8px; padding: 8px 10px; font: inherit; font-size: 15px; }
.lift-set-r { max-width: 78px; }
.lift-set-x { color: var(--text-mute); flex: none; }
.lift-set-del { flex: none; width: 28px; height: 28px; border-radius: 50%; border: none; background: var(--lane-light); color: var(--text-soft); font-size: 16px; cursor: pointer; }
.lift-logged { font-size: 12px; color: var(--crimson-ink); font-weight: 500; margin-top: 3px; font-variant-numeric: tabular-nums; }

/* v3.4.1 — stop iOS auto-zoom on focus (inputs must be >=16px), unread badges */
.msg-body { font-size: 16px; }
.lift-set-w, .lift-set-r { font-size: 16px; }
.cvt { position: relative; }
.cvt-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 16px; height: 16px;
  padding: 0 4px; margin-left: 5px; border-radius: 8px; background: var(--accent); color: #fff; font-size: 10px; font-weight: 600; vertical-align: middle; }
.cvt.active .cvt-badge { background: var(--accent); color: #fff; }
.cvt-badge.hidden { display: none; }

/* unread conversation tiles (v3.4.2) */
.conv-right { display: flex; align-items: center; gap: 6px; flex: none; }
.conv-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--accent); flex: none; }
.conv-unread .conv-title { font-weight: 700; color: #0e1726; }
.conv-unread .conv-sub { font-weight: 600; color: #3a4453; }

/* push-notification opt-in card (v3.5) */
.push-card { display: flex; align-items: center; gap: 11px; background: rgba(255,255,255,0.97); border-radius: 14px; padding: 12px 13px; margin-bottom: 12px; position: relative; }
.push-card-ic { flex: none; width: 38px; height: 38px; border-radius: 10px; background: var(--accent-soft); color: var(--accent-ink); display: flex; align-items: center; justify-content: center; }
.push-card-main { flex: 1; min-width: 0; }
.push-card-title { font-size: 14px; font-weight: 600; color: #16202e; }
.push-card-sub { font-size: 12px; color: #6b7785; margin-top: 2px; line-height: 1.4; }
.push-card-btn { flex: none; background: var(--accent); color: #fff; border: none; border-radius: 12px; padding: 9px 14px; font-size: 13px; font-weight: 600; cursor: pointer; }
.push-card-x { position: absolute; top: 6px; right: 8px; background: none; border: none; color: var(--text-mute); font-size: 17px; line-height: 1; cursor: pointer; }

/* coach view-app icon (v3.6) */
.viewas-ic { display: inline-flex; vertical-align: -3px; margin-right: 6px; }

/* inactive athletes list (v3.7) */
.team-card .inactive-react { display: block; width: calc(100% - 24px); margin: 0 12px 12px; }

/* ─── Coach Week: weekly volume & progression rollup ─────────────────────── */
.week-rollup {
  background: var(--card); border: 1px solid #e7e9ef; border-radius: var(--radius-md, 14px);
  padding: 14px 14px 12px; margin: 0 0 14px; box-shadow: 0 1px 3px rgba(17,25,45,.05);
}
.wr-title { font-size: 15px; font-weight: 700; color: var(--navy); display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.wr-phase { font-size: 11px; font-weight: 600; color: var(--crimson-ink); background: var(--crimson-soft); padding: 2px 8px; border-radius: 999px; }
.wr-grp { padding: 8px 0; border-top: 1px solid #f0f1f5; }
.wr-grp:first-of-type { border-top: 0; }
.wr-grp-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 6px; }
.wr-grp-name { font-size: 13px; font-weight: 600; color: #2a2a30; }
.wr-grp-total { font-size: 14px; font-weight: 700; color: var(--navy); }
.wr-bar { display: flex; height: 9px; border-radius: 6px; overflow: hidden; background: #eef0f4; }
.wr-seg { display: block; height: 100%; }
.wr-ac, .wr-dot.wr-ac { background: #2f9e6f; }   /* extensive tempo */
.wr-ap, .wr-dot.wr-ap { background: #e0a33a; }   /* intensive tempo */
.wr-se, .wr-dot.wr-se { background: var(--crimson); } /* special endurance */
.wr-sp, .wr-dot.wr-sp { background: #5b6bb5; }   /* speed */
.wr-legend { display: flex; flex-wrap: wrap; gap: 4px 12px; margin: 7px 0 6px; font-size: 11px; color: var(--text-soft); }
.wr-legend span { display: inline-flex; align-items: center; gap: 5px; }
.wr-dot { width: 8px; height: 8px; border-radius: 2px; display: inline-block; }
.wr-status { font-size: 12px; font-weight: 600; padding: 5px 9px; border-radius: 8px; }
.wr-status.wr-ok   { color: #1c7a4f; background: #e6f4ec; }
.wr-status.wr-warn { color: #9a2030; background: #fbe7e9; }
.wr-status.wr-base { color: #4a5169; background: #eef0f5; }
.wr-foot { font-size: 10.5px; color: var(--text-soft); line-height: 1.45; margin-top: 10px; padding-top: 9px; border-top: 1px solid #f0f1f5; }

.block-focus-top { margin: 2px 0 12px; }

/* ─── Athlete Home header (avatar + greeting + actions) ──────────────────── */
.home-id-row { display: flex; align-items: center; gap: 12px; }
.home-av { width: 52px; height: 52px; border-radius: 50%; overflow: hidden; border: 0;
  background: rgba(255,255,255,.12); padding: 0; flex: 0 0 auto; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.home-av img { width: 100%; height: 100%; object-fit: cover; }
.home-av-ini { font-weight: 700; font-size: 20px; color: #fff; }
.home-id-text { flex: 1 1 auto; min-width: 0; }
.home-greet { font-size: 20px; font-weight: 700; color: #fff; line-height: 1.15; }
.home-wave { display: inline-block; }
.home-id-actions { display: flex; gap: var(--hdr-icon-gap); flex: 0 0 auto; }
.home-icon-btn { position: relative; width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(255,255,255,.3);
  background: rgba(255,255,255,.1); color: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.home-icon-btn:active { background: rgba(255,255,255,.2); }
.home-badge { position: absolute; top: -3px; right: -3px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px;
  background: var(--crimson); color: #fff; font-size: 10px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.home-badge.hidden { display: none; }

/* ─── Profile: stats + charts ────────────────────────────────────────────── */
.profile-stats { display: flex; justify-content: center; gap: 26px; margin: 14px 0 4px; }
.pstat { text-align: center; }
.pstat-n { font-size: 19px; font-weight: 700; color: var(--navy); }
.pstat-l { font-size: 11px; color: var(--text-soft); margin-top: 2px; }
.chart-card { padding: 14px 12px 12px; }
.mini-chart { width: 100%; height: 132px; display: block; }
.chart-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 8px; font-size: 11px; color: var(--text-soft); }
.chart-legend .leg { display: inline-flex; align-items: center; gap: 5px; }
.chart-legend .leg i { width: 10px; height: 10px; border-radius: 2px; display: inline-block; }
.chart-legend .leg-bar { width: 10px; height: 10px; border-radius: 2px; background: var(--crimson); display: inline-block; }
.chart-legend .leg-line { width: 14px; height: 0; border-top: 2px dashed var(--navy-light); display: inline-block; }
/* Broken-avatar fallback: initials fill + center the avatar circle */
.av-fallback { display: inline-flex; align-items: center; justify-content: center; width: 100%; height: 100%; }

/* Branded feedback tile (frosted, dark-theme) for progress messages */
.feedback-tile { margin-top: 11px; display: flex; flex-direction: column; gap: 8px; }
.fb-row { display: flex; align-items: flex-start; gap: 9px; background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1); border-radius: 11px; padding: 10px 12px; }
.fb-dot { width: 8px; height: 8px; border-radius: 50%; margin-top: 5px; flex: 0 0 auto; }
.fb-text { font-size: 12.5px; font-weight: 600; color: #e7ecf5; line-height: 1.35; }
.fb-ok   { border-color: rgba(93,202,165,0.35); }
.fb-ok   .fb-dot { background: #5DCAA5; }
.fb-warn { border-color: rgba(250,199,117,0.32); }
.fb-warn .fb-dot { background: #FAC775; }
.fb-low  { border-color: rgba(232,96,122,0.4); }
.fb-low  .fb-dot { background: #E8607A; }

/* Page-level feedback tile (sits on the navy page, not inside a chart card) */
.feedback-tile-page { margin-top: 4px; margin-bottom: 8px; }
.feedback-tile-page .fb-row { background: rgba(255,255,255,0.06); }
.feedback-tile .fb-text b { color: #fff; font-weight: 800; }

.chart-readout { font-size: 12px; font-weight: 600; padding: 6px 9px; border-radius: 8px; margin-top: 8px; }
.chart-readout.ro-ok { color: #1c7a4f; background: #e6f4ec; }
.chart-readout.ro-warn { color: #9a6a16; background: #fbf1dd; }
.chart-readout.ro-low { color: #9a2030; background: #fbe7e9; }
.progress-window-value.from-session { color: var(--navy); font-style: italic; }

/* ─── Profile v2 (reference-style, dark) ─────────────────────────────────── */
.profile-hero2 { padding: 8px 4px 2px; }
.ph2-top { display: flex; align-items: center; gap: 16px; }
.ph2-av { width: 78px; height: 78px; border-radius: 50%; overflow: hidden; flex: 0 0 auto;
  background: rgba(255,255,255,.16); display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 700; font-size: 28px; }
.ph2-av img { width: 100%; height: 100%; object-fit: cover; }
.ph2-id { min-width: 0; }
.ph2-name { font-size: 22px; font-weight: 700; color: #fff; line-height: 1.15; }
.ph2-sub { font-size: 14px; color: #C5D0EA; margin-top: 3px; }
.ph2-stats { display: flex; gap: 32px; margin: 16px 2px 2px; }
.ph2-n { font-size: 20px; font-weight: 700; color: #fff; }
.ph2-l { font-size: 12px; color: #aab6cf; margin-top: 2px; }
.ph2-btns { display: flex; gap: 10px; margin: 15px 0 6px; }
.ph2-btn { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 10px 12px;
  border-radius: 999px; border: 1px solid rgba(255,255,255,.4); background: rgba(255,255,255,.07); color: #fff; font-size: 13px; font-weight: 600; cursor: pointer; }
.ph2-btn:active { background: rgba(255,255,255,.18); }

.chart-card-dark { background: #131d31; border: 0.5px solid rgba(255,255,255,.08); padding: 12px 12px 10px; }
.area-chart { width: 100%; height: auto; display: block; }
.chart-head { display: flex; align-items: center; justify-content: space-between; margin: var(--section-gap) 2px var(--section-label-gap); }
.chart-head-title { font-size: 12px; font-weight: 800; letter-spacing: 0.8px; text-transform: uppercase; color: var(--text-mute); }
.chart-pr { font-size: 12px; font-weight: 700; color: #E0B65A; }
.chart-sub { font-size: 11px; color: #8a93a6; margin-top: 6px; }
.chart-card-dark .chart-legend { color: #aab6cf; margin-top: 8px; }
.chart-card-dark .chart-legend .leg-area { width: 12px; height: 10px; border-radius: 2px; background: linear-gradient(#D8852F, rgba(216,133,47,.2)); display: inline-block; }
.chart-card-dark .chart-legend .leg-line { width: 14px; height: 0; border-top: 2px dashed #9fb0c8; display: inline-block; }

/* QR modal */
.qr-modal { text-align: center; }
.qr-box { background: #fff; border-radius: 14px; padding: 14px; margin: 12px auto 8px; width: 220px; }
.qr-box svg { width: 100%; height: auto; display: block; }
.qr-link { font-size: 11px; color: var(--text-soft); word-break: break-all; margin-bottom: 8px; }

/* ─── Clearance for the floating nav + brand chart colors ────────────────── */
.page-body { padding-bottom: calc(88px + var(--safe-bottom)); }
.chart-card-dark .chart-legend .leg-area { background: linear-gradient(var(--crimson), rgba(var(--accent-rgb),.2)); }
.chart-pr { color: #8FB0EA; }

/* ─── Target status card ─────────────────────────────────────────────────── */
.target-card { border-radius: var(--radius-md, 14px); padding: 13px 14px; margin: 6px 0 4px; border: 1px solid; }
.target-card .tg-top { display: flex; align-items: center; gap: 9px; }
.target-card .tg-icon { width: 24px; height: 24px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; flex: 0 0 auto; }
.target-card .tg-label { font-size: 15px; font-weight: 700; }
.target-card .tg-sub { font-size: 12px; margin-top: 6px; opacity: .85; }
.tg-ahead { background: #e6f4ec; border-color: #bfe3cd; color: #14663f; } .tg-ahead .tg-icon { background: #1c7a4f; color: #fff; }
.tg-on    { background: #e6f4ec; border-color: #bfe3cd; color: #14663f; } .tg-on .tg-icon { background: #1c7a4f; color: #fff; }
.tg-behind{ background: #fbecdd; border-color: #f3d2ad; color: #8a4b14; } .tg-behind .tg-icon { background: #C9791E; color: #fff; }
.tg-none  { background: #eef0f5; border-color: #dfe3ec; color: #44485a; } .tg-none .tg-icon { background: #8a93a6; color: #fff; }

/* ─── QR full-screen share page (reference style) ────────────────────────── */
.qr-page { position: fixed; inset: 0; z-index: 1200; display: flex; flex-direction: column; align-items: center; justify-content: center;
  background: linear-gradient(160deg, var(--shell) 0%, var(--shell-light) 100%); padding: calc(20px + var(--safe-top)) 24px calc(28px + var(--safe-bottom)); overflow-y: auto; }
.qr-brand { display: flex; flex-direction: column; align-items: center; gap: 10px; margin-bottom: 18px; }
.qr-logo { width: 56px; height: 56px; border-radius: 14px; }
.qr-eyebrow { font-family: var(--font-display, "Kanit"), -apple-system, Arial, sans-serif; font-weight: 800; font-style: italic; text-transform: uppercase; letter-spacing: .08em; font-size: 12px; color: #cdd8e8; }
.qr-close { position: absolute; top: calc(16px + var(--safe-top)); left: 18px; width: 38px; height: 38px; border-radius: 50%;
  background: transparent; border: 0; color: #fff; font-size: 22px; cursor: pointer; }
.qr-title { color: #fff; font-size: 30px; font-weight: 800; text-align: center; line-height: 1.2; margin: 44px 0 30px; }
.qr-card { width: 100%; max-width: 340px; background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.14); border-top: 3px solid var(--crimson); border-radius: 22px; padding: 18px; }
.qr-card-head { display: flex; flex-direction: column; align-items: center; gap: 2px; margin-bottom: 14px; padding: 0 4px; }
.qr-name { font-family: var(--font-display, "Kanit"), -apple-system, Arial, sans-serif; font-weight: 800; font-style: italic; text-transform: uppercase; font-size: 21px; color: #fff; text-align: center; line-height: 1.15; }
.qr-season { font-size: 12.5px; color: #cdd8e8; }
.qr-box { background: #fff; border-radius: 16px; padding: 16px; }
.qr-box svg { width: 100%; height: auto; display: block; }
.qr-actions { display: flex; gap: 14px; width: 100%; max-width: 340px; margin-top: 22px; }
.qr-act { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 16px 10px; border-radius: 16px;
  background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.1); color: #fff; font-size: 15px; font-weight: 600; cursor: pointer; }
.qr-act:active { background: rgba(255,255,255,0.18); }
@media print { body > *:not(.qr-page) { display: none !important; } .qr-page { position: static; background: #fff; } .qr-title, .qr-card-head { color: #111; } .qr-close, .qr-actions { display: none !important; } .qr-card { border-color: #ccc; } }

/* ─── Profile goals chips (below stats) ──────────────────────────────────── */
.ph2-goals { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 13px 2px 2px; }
.ph2-goals-label { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: #aab6cf; margin-right: 2px; }
.ph2-goal { font-size: 13px; color: #fff; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.16); border-radius: 999px; padding: 4px 11px; }
.ph2-goal b { color: #fff; font-weight: 700; margin-right: 4px; }

/* ─── Attention states use the STATUS triad, never the accent. They carry
   meaning, not brand, so they stay constant across every team colour. ─── */
.chart-readout.ro-warn { color: var(--stat-bad); background: #f8e3e7; }
.chart-readout.ro-low { color: #8e1f30; background: #f7dde1; }
.target-card.tg-behind { background: #f8e3e7; border-color: #ecc4cc; color: #8e1f30; }
.target-card.tg-behind .tg-icon { background: var(--stat-bad); color: #fff; }

/* nav polish: smaller icons inside the pill, bolder home greeting */
.bottom-nav .nav-icon svg { width: 21px; height: 21px; }
.bottom-nav .nav-icon { font-size: 21px; }
.home-greet { font-size: 22px; font-weight: 800; letter-spacing: -0.01em; }

/* ─── Profile: combined Event group + Goals frosted tile ─────────────────── */
.prof-id-tile {
  background: rgba(255,255,255,0.07);
  border: 1px solid rgba(255,255,255,0.16);
  border-radius: 16px;
  padding: 14px 16px;
  margin: 8px 0 2px;
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
}
.pit-row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.pit-k { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: #9fb0cc; font-weight: 800; }
.pit-k-block { display: block; margin-bottom: 9px; }
.pit-v { font-size: 16px; font-weight: 700; color: #fff; text-align: right; }
.pit-sub { font-size: 13px; color: #C5D0EA; margin-top: 4px; }
.pit-divider { height: 1px; background: rgba(255,255,255,0.13); margin: 13px 0; }
.prof-id-tile .ph2-goals { margin: 0; }

/* combined event-group line */
.pit-line { font-size: 16px; font-weight: 700; color: #fff; margin-top: 2px; }

/* lift selector on the strength chart */
.lift-select {
  width: 100%; margin: 0 0 8px; padding: 9px 12px;
  background: rgba(255,255,255,0.08); color: #fff;
  border: 1px solid rgba(255,255,255,0.18); border-radius: 10px;
  font: inherit; font-size: 14px; font-weight: 600;
  -webkit-appearance: none; appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 5l4 4 4-4'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center;
}
.lift-select option { color: #111; }

/* ─── Profile header bar (back + message + settings) ─────────────────────── */
.prof-head-bar { display: flex; align-items: center; justify-content: space-between; }
.prof-back { background: transparent; border: 0; color: #fff; font-size: 34px; font-weight: 800; line-height: 1; width: 40px; height: 40px; display: flex; align-items: center; cursor: pointer; padding: 0; }
.prof-head-actions { display: flex; gap: 10px; }

/* Profile action buttons → outlined (crimson, reference style) */
.ph2-btn { background: transparent; border: 1.5px solid var(--crimson); color: var(--crimson-ink); }
.ph2-btn:active { background: rgba(var(--accent-rgb),0.10); }
.ph2-n-sub { font-size: 13px; font-weight: 600; color: var(--text-mute); margin-left: 1px; }

/* ─── Progress + Testing cards on the Light Canvas day-screen ────── */
.day-screen .recent-row,
.day-screen .progress-card,
.day-screen .test-row-card,
.day-screen .stat {
  background: var(--card); border: 0.5px solid var(--border);
}
.day-screen .recent-row { color: var(--text); }
.day-screen .progress-test-name, .day-screen .test-row-name, .day-screen .progress-window-value,
.day-screen .test-title, .day-screen .stat-value { color: var(--text); }
.day-screen .progress-window-label, .day-screen .stat-sub, .day-screen .stat-label,
.day-screen .test-eyebrow, .day-screen .test-cell-label { color: var(--text-mute); }
.day-screen .test-window { background: var(--card); border: 0.5px solid var(--border); }
.day-screen .test-cell { background: var(--lane-light); border: 0.5px solid var(--border); color: var(--text); }
.day-screen .test-cell.logged { background: var(--crimson-soft); border-color: rgba(var(--accent-rgb),0.35); color: var(--crimson-ink); }
.day-screen .test-cell.next { border-color: rgba(var(--accent-rgb),0.45); }
.day-screen .status-pill.done { background: var(--crimson); color: #fff; }
.day-screen .status-pill.upcoming { background: var(--lane-light); color: var(--text-mute); }

/* ─── Testing: text-only selections (no tile boxes), readable + brand ────── */
.day-screen .test-cell { background: transparent !important; border: 0 !important; box-shadow: none; padding: 8px 2px; }
.day-screen .test-cell-label { color: var(--text-mute); font-size: 11px; font-weight: 700; letter-spacing: .04em; opacity: 1; }
.day-screen .test-cell-value { color: var(--text); font-weight: 700; font-size: 15px; margin-top: 4px; }
.day-screen .test-cell.empty .test-cell-value, .day-screen .test-cell.future .test-cell-value { color: var(--text-mute); }
.day-screen .test-cell.next .test-cell-label { color: var(--crimson-ink); }
.day-screen .test-cell.next .test-cell-value { color: var(--crimson-ink); font-size: 22px; line-height: 1; }
.day-screen .test-cell.logged .test-cell-value { color: var(--crimson-ink); }

/* center the Progress stats tile */
.ph2-stats { justify-content: center; gap: 40px; }
.ph2-stat { text-align: center; }

/* restore the per-week outline on testing cells (outlined, not filled tiles) */
.day-screen .test-cell { border: 1px solid rgba(255,255,255,0.16) !important; border-radius: 12px; padding: 11px 6px; }
.day-screen .test-cell.empty, .day-screen .test-cell.future { border-color: rgba(255,255,255,0.12) !important; }
.day-screen .test-cell.next { border-color: rgba(255,255,255,0.5) !important; }
.day-screen .test-cell.logged { border-color: var(--crimson) !important; background: rgba(var(--accent-rgb),0.13) !important; }
/* settings header: larger logo + message icon */
.set-head-actions { display: flex; align-items: center; gap: 12px; }
.app-logo.app-logo-lg { width: 58px; height: 58px; }

.prof-copyright { text-align: center; color: #8a93a6; font-size: 11px; margin-top: 26px; padding-bottom: 6px; }

/* ─── Trends/Testing toggle → frosted pill like the bottom nav ───────────── */
.perf-toggle { background: rgba(17,25,45,0.72); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
  border: 1px solid rgba(255,255,255,0.14); border-radius: 30px; padding: 6px; gap: 4px; max-width: 300px; margin: 0 auto 16px; }
.perf-toggle .cvt { flex: 1; font-size: 14px; font-weight: 600; padding: 9px 18px; border-radius: 24px; border: 0; background: transparent; color: rgba(255,255,255,0.62); }
.perf-toggle .cvt.active { background: rgba(255,255,255,0.16); color: #fff; border: 0; }

/* ─── Week-by-week → frost + readable ───────────────────────────────────── */
.day-screen .recent { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); border-radius: 14px; }
.day-screen .recent-row { color: #dfe6f2; border-bottom: 1px solid rgba(255,255,255,0.07); }
.day-screen .recent-row strong { color: #fff; }

/* global copyright + settings back arrow */
.app-copyright { text-align: center; color: #8a93a6; font-size: 11px; margin-top: 26px; padding-bottom: 6px; }
.set-back { margin: 0 0 6px; }

/* profile action buttons → no border, soft fill */
.ph2-btn { border: 0; background: rgba(255,255,255,0.1); }
.ph2-btn:active { background: rgba(255,255,255,0.2); }

/* messages tiles → frost + readable */
.day-screen .conv-row { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); }
.day-screen .conv-title { color: #fff; }
.day-screen .conv-sub { color: #b9c4d8; }
.day-screen .conv-when, .day-screen .ann-daysep { color: #8a93a6; }

/* week-by-week → separator only (no row box), count without pill */
.day-screen .recent-row { background: transparent !important; border: 0 !important; border-bottom: 1px solid rgba(255,255,255,0.1) !important; border-radius: 0 !important; }
.day-screen .recent-row:last-child { border-bottom: 0 !important; }
.day-screen .status-pill { background: transparent !important; border: 0 !important; padding: 0 !important; color: #aab6cf !important; font-weight: 700; }
.day-screen .status-pill.done { color: #fff !important; }

/* pace calculator → frosted on the dark page */
.pc-title { font-family: var(--font-display); font-style: italic; text-transform: uppercase; letter-spacing: 0.01em; font-size: 22px !important; flex: 1; margin-left: 6px; font-weight: 700; }
.day-screen .pc-label { color: #9fb0cc; }
.day-screen .pc-pill { background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.16); color: #e7ecf5; }
.day-screen .pc-pill.active { background: var(--crimson); border-color: var(--crimson); color: #fff; }
.day-screen .card.accent-steel { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); }
.day-screen .card.accent-steel .card-cat { color: #9fb0cc; }
.day-screen .card.accent-steel .card-detail { color: #cdd8e8 !important; }

/* session-page calendar strip */
.day-cal { margin: 0 0 14px; overflow-x: clip; }
.day-cal-head { color: #fff; font-weight: 800; font-size: 16px; text-align: center; margin: 4px 0 10px; }
.day-cal-week { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; touch-action: pan-y; }

/* session header: plain Week·theme line + calendar in the header */
.date-meta-line { color: #aeb9d2; font-size: 13px; font-weight: 600; margin-top: 4px; letter-spacing: .01em; }
.day-header .day-cal { margin: 14px 0 2px; }
.day-header .day-cal-head { margin: 2px 0 10px; }

/* DM thread: frosted incoming bubbles + header balance */
.msg-head-spacer { width: 40px; height: 40px; flex: 0 0 auto; }

/* Peer avatar in the DM header */
.msg-head-av { width: 52px; height: 52px; border-radius: 50%; flex: 0 0 auto; overflow: hidden;
  background: rgba(255,255,255,0.12); border: 1px solid rgba(255,255,255,0.25);
  display: flex; align-items: center; justify-content: center; }
.msg-head-av img { width: 100%; height: 100%; object-fit: cover; display: block; }
.msg-head-av-initial { font-weight: 800; font-size: 22px; color: #fff; }

/* DM screen: fixed-height flex column so the header + composer stay pinned and
   only the thread scrolls (position:sticky is unreliable under body overflow-x:hidden). */
#app:has(> .dm-screen) { padding-bottom: 0; min-height: 0; }
.dm-screen { height: 100vh; height: 100dvh; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
.dm-screen .app-header { flex: 0 0 auto; }
.dm-screen .dm-body { flex: 1 1 auto; min-height: 0; overflow: hidden; padding: 14px 14px 0; }
.dm-screen #dm-thread { flex: 1 1 auto; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; padding-bottom: 8px; }
.dm-screen #dm-compose { flex: 0 0 auto; padding-bottom: calc(6px + var(--safe-bottom)); }
/* DM header: keep the name on one line beside the avatar (smaller so the full name fits) */
.dm-screen .screen-name { font-size: 21px; text-transform: none; letter-spacing: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dm-bubble.dm-theirs { background: rgba(255,255,255,0.10); border: 1px solid rgba(255,255,255,0.16); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.dm-bubble.dm-theirs .dm-text { color: #f2f5fa; }
.dm-bubble.dm-theirs .dm-stamp { color: #aab6cf; }
.dm-bubble.dm-theirs .dm-text a { color: #cdd8ee; }

/* frosted outgoing (red) DM bubbles */
.dm-bubble.dm-mine { background: rgba(var(--accent-rgb),0.42); border: 1px solid rgba(var(--accent-rgb),0.55); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }

/* settings: frosted tiles + readable text */
.set-screen .card { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); }
.set-screen .card .card-cat { color: #9fb0cc; }
.set-screen .card .card-detail { color: #cdd8e8 !important; }
.set-screen .card .card-detail a { color: #e3b7c1; }
.set-screen .btn-secondary { background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.16); color: #f2f5fa; }
.set-screen .btn-secondary:active { background: rgba(255,255,255,0.14); }

/* progress: circular week ring next to the title */
.screen-name-wrap { display: flex; align-items: center; gap: 12px; }
.wk-ring { position: relative; width: 42px; height: 42px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.wk-ring-num { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 800; color: #fff; }

/* home: navy header holds avatar, info icons and the coach note */
.home-head { background: var(--shell); padding-bottom: 14px; }
.home-head .home-note { margin: 12px 0 0; }

/* week ring: stacked circle + "Week" label */
.wk-ring { flex-direction: column; gap: 2px; width: auto; height: auto; }
.wk-ring-circle { position: relative; width: 42px; height: 42px; display: inline-flex; align-items: center; justify-content: center; }
.wk-ring-label { font-size: 9.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #aab8d4; }

/* home: breathing room between navy header and the first tile */
.home-body { padding-top: 16px; }

/* session calendar: swipe arrows flanking the date range + smooth slide */
.day-cal-head { display: flex; align-items: center; justify-content: center; gap: 14px; }
.day-cal-range { min-width: 150px; text-align: center; }
.day-cal-arrow { background: none; border: 0; color: #cdd8ec; font-size: 22px; font-weight: 700; line-height: 1; padding: 2px 8px; cursor: pointer; }
.day-cal-arrow:active { color: #fff; }
.day-cal-week { will-change: transform; }

/* settings: change-password card */
.set-pw-card { padding: 0 !important; overflow: hidden; }
.set-pw-toggle { width: 100%; display: flex; align-items: center; justify-content: space-between; background: none; border: 0; color: #f2f5fa; font-size: 14px; font-weight: 600; padding: 14px 16px; cursor: pointer; }
.set-pw-chev { color: #9fb0cc; transition: transform .18s ease; }
.set-pw-toggle.open .set-pw-chev { transform: rotate(180deg); }
.set-pw-form { display: flex; flex-direction: column; gap: 8px; padding: 0 14px 14px; }
.set-pw-input { background: rgba(255,255,255,0.10); border: 1px solid rgba(255,255,255,0.16); border-radius: 9px; padding: 11px 12px; color: #fff; font-size: 14px; }
.set-pw-input::placeholder { color: #8a97b3; }
.set-pw-input:focus { outline: none; border-color: rgba(var(--accent-rgb),0.7); }
.set-pw-save { background: var(--crimson); color: #fff; border: 0; border-radius: 9px; padding: 12px; font-size: 14px; font-weight: 600; margin-top: 2px; cursor: pointer; }
.set-pw-save:disabled { opacity: .6; }
.set-pw-msg { font-size: 12.5px; min-height: 0; }
.set-pw-msg.err { color: #F09595; }
.set-pw-msg.ok { color: #5DCAA5; }
.set-pw-hint { color: #9fb0cc; font-size: 11px; line-height: 1.5; margin: 2px 0 0; }

/* ─── Coach portal: bottom nav + frosted screens ───────────────────────── */
.coach-bottom-nav {
  position: fixed; bottom: calc(6px + var(--safe-bottom)); left: 12px; right: 12px;
  max-width: 452px; margin: 0 auto;
  background: rgba(var(--navy-rgb), 0.42);
  -webkit-backdrop-filter: blur(4px) saturate(1.2);
  backdrop-filter: blur(4px) saturate(1.2);
  border: 1px solid rgba(255, 255, 255, 0.22); border-radius: 34px;
  display: flex; justify-content: space-around; gap: 4px; padding: 8px;
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.42); z-index: 50;
}
.cnav-item { flex: 1; background: none; border: 0; cursor: pointer; position: relative;
  display: flex; flex-direction: column; align-items: center; gap: 3px;
  color: rgba(255, 255, 255, 0.6); padding: 7px 4px; border-radius: 24px; }
.cnav-item.active { color: #fff; background: rgba(255, 255, 255, 0.34); }
.cnav-ic svg { width: 21px; height: 21px; display: block; }
.cnav-l { font-size: 10.5px; font-weight: 700; }
.cnav-badge { position: absolute; top: 4px; right: calc(50% - 20px); min-width: 15px; height: 15px;
  background: var(--crimson); color: #fff; border-radius: 8px; font-size: 9px; font-weight: 700;
  display: flex; align-items: center; justify-content: center; padding: 0 4px; }
.coach-body { padding-bottom: calc(96px + var(--safe-bottom)) !important; }
.coach-tools-row { display: flex; gap: 10px; margin-bottom: 10px; }
.coach-tool { flex: 1; min-width: 0; background: var(--card); border: 0.5px solid var(--border); border-radius: var(--radius-md); padding: 15px 14px 16px; text-align: left; display: flex; flex-direction: column; box-shadow: var(--shadow-sm); cursor: pointer; }
.coach-tool:active { transform: scale(0.99); }
.coach-tool-ic { color: var(--navy); line-height: 0; margin-bottom: 10px; }
.coach-tool-t { font-size: 16px; font-weight: 700; color: var(--text); }
.coach-tool-sub { font-size: 12.5px; color: var(--text-mute); margin-top: 2px; }
.up-next-row { display: flex; gap: 10px; margin-bottom: 10px; }
.up-next-tile { flex: 1; min-width: 0; background: var(--card); border: 0.5px solid var(--border); border-radius: var(--radius-md); padding: 13px 14px 15px; text-align: left; display: flex; flex-direction: column; box-shadow: var(--shadow-sm); cursor: pointer; }
.up-next-tile:active { transform: scale(0.99); }
.un-eb { font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--text-mute); }
.un-title { font-size: 17px; font-weight: 700; color: var(--text); margin-top: 3px; line-height: 1.15; }
.un-sub { font-size: 12.5px; color: var(--text-mute); margin-top: 3px; }
/* static (sticky) coach header — content scrolls beneath it */
.coach-screen .app-header { position: sticky; top: 0; z-index: 30; }
.coach-screen { -webkit-overflow-scrolling: touch; }

/* coach screens: solid white cards on the Light Canvas */
.coach-screen .card { background: var(--card); border: 0.5px solid var(--border); }
/* Keep the progress chart card identical to the athlete's view (solid dark, not frosted) */
.coach-screen .card.chart-card-dark { background: #131d31; border: 0.5px solid rgba(255,255,255,.08); }
.coach-screen .card .card-cat { color: var(--text-mute); }
.coach-screen .card .card-detail, .coach-screen .card .card-title { color: var(--text); }
.coach-screen .auth-input, .coach-screen textarea.auth-input, .coach-screen .onb-select {
  background: var(--card); border: 1px solid var(--border); color: var(--text); }
.coach-screen .auth-input::placeholder { color: var(--text-mute); }
.coach-screen .team-summary { color: var(--text-mute); }
.coach-screen .team-card { background: var(--card); border: 0.5px solid var(--border); }
.coach-screen .team-name { color: var(--text); }
.coach-screen .team-sub, .coach-screen .team-core { color: var(--text-mute); }
.coach-screen .team-prog { background: var(--lane-light); }
.coach-screen .btn-secondary { background: var(--lane-light); border: 0.5px solid var(--border); color: var(--navy); }

/* roster: name row + on-track status chip */
.team-name-row { display: flex; align-items: center; gap: 8px; }
.status-chip { font-size: 10px; font-weight: 700; padding: 2px 7px; border-radius: 7px; white-space: nowrap; }
.status-chip.sc-ok { background: var(--ok-tint); color: var(--ok-ink); }
.status-chip.sc-watch { background: var(--cau-tint); color: var(--cau-ink); }
.status-chip.sc-behind { background: #fde7eb; color: var(--crimson-ink); }
.status-chip.sc-none { background: var(--lane-light); color: var(--text-mute); }

/* coach Today command center */
.ctoday-att { background: var(--card); border: 0.5px solid var(--border); border-radius: 14px; padding: 13px 15px; margin-bottom: 14px; }
.ctoday-att-head { display: flex; align-items: center; justify-content: space-between; color: var(--text-mute); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; }
.ctoday-att-head .live-dot { color: var(--green); text-transform: none; letter-spacing: 0; font-size: 11px; }
.ctoday-att-row { display: flex; gap: 18px; margin-top: 2px; }
.ctoday-att-cell { display: flex; flex-direction: column; }
.ctoday-att-n { color: var(--text); font-size: 22px; font-weight: 700; line-height: 1.1; }
.ctoday-att-l { font-size: 11px; color: var(--text-mute); }
.ctoday-att-l.ok { color: var(--green); } .ctoday-att-l.watch { color: var(--amber); } .ctoday-att-l.behind { color: var(--crimson-ink); }
.coach-note-card { margin-bottom: 6px; }
.ctoday-note-row { display: flex; align-items: center; gap: 12px; margin-top: 8px; }
.ctoday-note-status { color: var(--green); font-size: 12px; }
.ctoday-flag { display: flex; align-items: flex-start; gap: 11px; border-radius: 11px; padding: 11px 13px; margin-bottom: 8px; }
.ctoday-flag.behind { background: #fde7eb; border: 0.5px solid rgba(var(--accent-rgb),0.35); }
.ctoday-flag.watch { background: var(--cau-tint); border: 0.5px solid rgba(197,123,22,0.35); }
.ctoday-flag-ic svg { width: 18px; height: 18px; display: block; }
.ctoday-flag.behind .ctoday-flag-ic { color: var(--crimson-ink); }
.ctoday-flag.watch .ctoday-flag-ic { color: var(--amber); }
.ctoday-flag-t { color: var(--text); font-size: 13.5px; font-weight: 600; }
.ctoday-flag-sub { color: var(--text-mute); font-size: 12px; margin-top: 1px; }
.ctoday-actions { display: flex; gap: 10px; margin-top: 16px; }
.ctoday-act { flex: 1; background: var(--lane-light); border: 0.5px solid var(--border); color: var(--navy); border-radius: var(--radius-btn); padding: 13px; font-size: 14px; font-weight: 600; cursor: pointer; }
.ctoday-act.primary { background: var(--crimson); border-color: var(--crimson); color: #fff; }

/* coach Today: even attendance + today's-training tile */
.ctoday-att-row { justify-content: space-between; gap: 0; }
.ctoday-att-cell { align-items: center; text-align: center; flex: 1; }
.ctoday-train { background: var(--card); border: 0.5px solid var(--border); border-radius: 14px; padding: 14px 15px; margin-bottom: 14px; }
.ctoday-train-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.ctoday-train-eb { color: var(--text-mute); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; }
.ctoday-train-tag { font-size: 11px; font-weight: 700; padding: 3px 9px; border-radius: 8px; }
.ctoday-train-title { color: var(--text); font-size: 18px; font-weight: 700; }
.ctoday-train-desc { color: var(--text-mute); font-size: 13px; line-height: 1.5; margin: 4px 0 12px; }
.coach-screen .day-cal { margin-bottom: 14px; }

/* coach week-at-a-glance: solid cards on Light Canvas */
.coach-screen .week-rollup { background: var(--card); border: 0.5px solid var(--border); }
.coach-screen .wr-title { color: var(--text); }
.coach-screen .wr-phase { color: var(--crimson-ink); }
.coach-screen .wr-grp-name { color: var(--text); }
.coach-screen .wr-grp-total { color: var(--text-mute); }
.coach-screen .wr-legend, .coach-screen .wr-foot { color: var(--text-mute); }
.coach-screen .wr-status { color: var(--text-mute); }
.coach-screen .cwk-day { background: var(--card); border: 0.5px solid var(--border); }
.coach-screen .cwk-day.rest { background: var(--lane-light); }
.coach-screen .cwk-dow { color: var(--text); }
.coach-screen .cwk-date { color: var(--text-mute); }
.coach-screen .cwk-theme { color: var(--crimson-ink); }
.coach-screen .cwk-rest, .coach-screen .cwk-line { color: var(--text-mute); }

/* coach calendar: subtle marker for the real today when another day is selected */
.ws-day.ws-istoday .ws-n { color: var(--crimson-ink); }

/* coach screens: breathing room between header and first tile */
.coach-body { padding-top: 16px; }

/* keep header icon buttons perfectly round (don't let flex squash them) */
.home-icon-btn { flex: 0 0 40px; min-width: 40px; }

/* coach rest-day core circuit: readable text on navy */
.coach-screen .abs-sub { color: #9fb0cc; }
.coach-screen .abs-list li { color: #eef2f9; }
.coach-screen .abs-rest { background: rgba(255,255,255,0.10); color: #cdd8e8; }

/* prominent Add-athlete button on the roster */
.coach-add-btn { width: 100%; background: var(--crimson); color: #fff; border: 0; border-radius: 12px; padding: 14px; font-size: 15px; font-weight: 700; cursor: pointer; margin-bottom: 14px; display: flex; align-items: center; justify-content: center; gap: 8px; }
.coach-add-btn:active { opacity: .9; }

/* coach day-program: link to the week-at-a-glance rollup */
.coach-week-link { width: 100%; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); color: #cdd8ec; border-radius: 10px; padding: 11px 14px; font-size: 13px; font-weight: 600; text-align: left; cursor: pointer; margin-bottom: 14px; }
.coach-week-link:active { background: rgba(255,255,255,0.12); }

/* branded (dark) modals — change password / change email / add athlete */
.modal.modal-dark { background: #16223d; border: 1px solid rgba(255,255,255,0.12); }
.modal.modal-dark h3 { color: #fff; }
.modal.modal-dark .modal-sub { color: #9fb0cc; }
.modal.modal-dark .modal-sub strong { color: #fff; }
.modal.modal-dark .modal-field label { color: #9fb0cc; }
.modal-field select { width: 100%; margin-top: 4px; border: 1px solid var(--border); border-radius: 8px; padding: 10px 12px; font-size: 15px; background: var(--lane-light); }
.modal.modal-dark .modal-field input, .modal.modal-dark .modal-field textarea, .modal.modal-dark .modal-field select { background: rgba(255,255,255,0.10); border: 1px solid rgba(255,255,255,0.16); color: #fff; }
.modal.modal-dark .modal-field input::placeholder { color: #8a97b3; }
.modal.modal-dark .modal-field input:focus, .modal.modal-dark .modal-field select:focus { outline: none; border-color: rgba(var(--accent-rgb),0.7); background: rgba(255,255,255,0.13); }
.modal.modal-dark .btn-modal-cancel { background: rgba(255,255,255,0.10); color: #e7ecf5; }
.modal.modal-dark .auth-error { color: #F09595; }
.modal-scroll { max-height: 86vh; overflow-y: auto; }

/* week-at-a-glance link: branded icon */
.coach-week-link { display: flex; align-items: center; gap: 10px; }
.coach-week-link .cwl-ic { flex: 0 0 auto; color: var(--crimson-ink); display: flex; }
.coach-week-link .cwl-ic svg { width: 18px; height: 18px; }
.coach-week-link .cwl-chev { margin-left: auto; color: #9fb0cc; }

/* add-athlete modal: two-up name/level rows + event chips */
.modal-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.evt-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 6px; }
.evt-chip { display: flex; align-items: center; justify-content: center; text-align: center; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.16); border-radius: 9px; padding: 9px 4px; font-size: 12px; color: #cdd8e8; cursor: pointer; user-select: none; }
.evt-chip input { position: absolute; opacity: 0; pointer-events: none; }
.evt-chip.on { background: var(--crimson); border-color: var(--crimson); color: #fff; font-weight: 600; }

/* dark-modal inputs + branded compose options */
.modal.modal-dark .auth-input { background: rgba(255,255,255,0.10); border: 1px solid rgba(255,255,255,0.16); color: #fff; }
.modal.modal-dark .auth-input::placeholder { color: #8a97b3; }
.modal.modal-dark .btn-secondary { background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.16); color: #f2f5fa; }
.compose-opt { display: flex; align-items: center; gap: 13px; width: 100%; justify-content: flex-start; text-align: left; margin-bottom: 10px; padding: 12px 14px; }
.compose-opt-ic { flex: 0 0 auto; width: 38px; height: 38px; border-radius: 50%; background: rgba(var(--accent-rgb),0.22); color: var(--accent-ink); display: flex; align-items: center; justify-content: center; }
.compose-opt-ic svg { width: 19px; height: 19px; }
.compose-opt-text { display: flex; flex-direction: column; }
.compose-opt-t { font-size: 14px; font-weight: 600; color: #f2f5fa; }
.compose-opt-s { font-size: 11.5px; color: #9fb0cc; }
.modal.modal-dark .conv-row { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); }
.modal.modal-dark .conv-title { color: #fff; }

/* coach Today: attendance date navigator */
.ctoday-att-datebar { display: flex; align-items: center; justify-content: center; gap: 14px; margin: 8px 0 10px; }
.att-date-label { color: #cdd8ec; font-size: 13px; font-weight: 600; min-width: 120px; text-align: center; }
.att-date-arrow { background: none; border: 0; color: #cdd8ec; font-size: 20px; font-weight: 700; line-height: 1; padding: 2px 8px; cursor: pointer; }
.att-date-arrow:disabled { opacity: .3; cursor: default; }

/* coach Today header avatar */
.day-header .home-av { flex: 0 0 auto; width: 44px; height: 44px; margin-right: 10px; }

/* coach profile editor (light theme: the old translucent dark-theme cells were
   nearly invisible on the light canvas) */
.cp-avatar-wrap { display: flex; flex-direction: column; align-items: center; gap: 10px; margin: 8px 0 18px; }
.cp-avatar { width: 96px; height: 96px; }
.cp-photo-btn { background: var(--card); border: 1px solid var(--border); color: var(--navy); border-radius: 9px; padding: 8px 16px; font-size: 13px; font-weight: 600; cursor: pointer; }
.coach-screen .modal-field label { color: var(--text-mute); }
.coach-screen .cp-avatar .home-av-ini { font-size: 32px; }

/* coach profile fields: solid white cells with a visible border */
.coach-screen .modal-field input, .coach-screen .modal-field select { background: var(--card); border: 1px solid #D5DBE6; color: var(--text); }
.coach-screen .modal-field input::placeholder { color: var(--text-mute); }
.coach-screen .modal-field input:focus, .coach-screen .modal-field select:focus { background: var(--card); border-color: var(--navy); color: var(--text); outline: none; }
.coach-screen .modal-field select option { color: #111; }

/* Club page tiles (v5.119): classes, staff, inbox, member benefits */
.club-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 2px; }
.club-tile { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 2px;
  text-align: left; background: var(--card); border: 0.5px solid var(--border); border-radius: var(--radius-md);
  padding: 14px; cursor: pointer; min-height: 92px; box-sizing: border-box; }
.club-tile:active { background: var(--lane-light); }
.club-tile-ic { color: var(--navy-light); margin-bottom: 5px; display: inline-flex; }
.club-tile-t { font-size: 15px; font-weight: 600; color: var(--text); line-height: 1.25; }
.club-tile-s { font-size: 12px; color: var(--text-mute); line-height: 1.35; }
.club-tile.is-inactive { opacity: .55; cursor: default; }
.club-tile-cur { position: absolute; top: 10px; right: 10px; font-size: 10.5px; font-weight: 700;
  letter-spacing: .04em; text-transform: uppercase; color: var(--crimson-ink); background: rgba(var(--accent-rgb),.08);
  border-radius: 6px; padding: 3px 7px; }
.club-tile .prof-list-badge { position: absolute; top: 10px; right: 10px; }

/* v5.121 athlete id card: age beside the name; grade stacked under school */
.pidc-age { margin-left: 9px; font-family: -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-style: normal; font-weight: 600; font-size: 15px; letter-spacing: 0; text-transform: none;
  color: rgba(255,255,255,.72); vertical-align: 3px; }
.pidc-grade { margin-top: 1px; }

/* coach Today: larger avatar + attendance date in the head */
.day-header .home-av { width: 58px; height: 58px; }
.ctoday-att-head { text-transform: none; }
.ctoday-att-head > span:first-child { text-transform: uppercase; letter-spacing: .06em; }
.att-date-nav { display: inline-flex; align-items: center; gap: 8px; }
.att-date-label { color: #cdd8ec; font-size: 12px; font-weight: 600; min-width: 92px; text-align: center; letter-spacing: 0; }
.att-date-arrow { background: none; border: 0; color: #cdd8ec; font-size: 18px; font-weight: 700; line-height: 1; padding: 0 4px; cursor: pointer; }
.att-date-arrow:disabled { opacity: .3; cursor: default; }

/* post-note success state */
.ctoday-note-row .set-pw-save.posted { background: #1D9E75; }

/* coach Manage profile hero spacing */
.coach-screen .profile-hero2 { margin: 4px 0 8px; }

/* coach program day: keep the SAME white accordions + dark text as athletes.
   (My earlier coach-screen light-text rules were for the rest-day card on navy;
   undo them inside the white .day-acc tiles so the program reads like the athlete view.) */
.coach-screen .day-acc-body .card { background: transparent; border: 0; }
.coach-screen .day-acc .card-cat { color: var(--text-mute); }
.coach-screen .day-acc .card-title { color: var(--navy); }
.coach-screen .day-acc .card-detail { color: var(--text); }
.coach-screen .day-acc .abs-sub { color: var(--text-soft); }
.coach-screen .day-acc .abs-list li { color: var(--text); }
.coach-screen .day-acc .abs-rest { background: var(--lane-light); color: var(--text-soft); }

/* notes: darker, slightly bolder so they read clearly (athlete + coach) */
.note-text { color: var(--navy) !important; font-weight: 500; }

/* coach profile error message: readable on the navy background */
.coach-screen .auth-error { color: #FAB4B4; font-weight: 600; }

/* week-at-a-glance date range: plain (no pill), matches other page headers */
.cwk-range-btn { background: none; border: 0; color: #fff; font-size: 16px; font-weight: 600; cursor: pointer; padding: 4px 8px; }
.cwk-range-btn:active { opacity: .7; }

/* coach athlete detail + edit athlete: brand to match (frosted on navy) */
.coach-screen .greeting { color: #9fb0cc; }
.coach-screen .auth-label { color: #9fb0cc; }
.coach-screen .auth-note { color: #9fb0cc; }
.coach-screen .meta-tile { background: rgba(255,255,255,0.08); }
.coach-screen .meta-tile-label { color: #9fb0cc; }
.coach-screen .meta-tile-value { color: #fff; }
.coach-screen .test-trend-name { color: #eef2f9; }
.coach-screen .test-trend-latest { color: #cdd8e8; }
.coach-screen .coach-ath-av { background: rgba(255,255,255,0.12); color: #fff; }
.coach-screen .viewas-btn { background: rgba(255,255,255,0.10); border: 1px solid rgba(255,255,255,0.18); color: #fff; }
.coach-screen .cwk-tag.lift { background: rgba(var(--navy-light-rgb),0.6); }

/* coach athlete detail/edit: avatar left of name, school below, arrow below + roomier tiles */
.ath-head-id { display: flex; align-items: center; gap: 14px; }
.ath-head-id .coach-ath-av { width: 56px; height: 56px; flex: 0 0 auto; }
.ath-head-text .greeting { margin-top: 2px; }
.ath-head-back { margin-top: 12px; }
.coach-screen .coach-detail-actions { margin: 14px 0; }
.coach-screen .page-body > .card,
.coach-screen .page-body > .coach-detail-actions,
.coach-screen .page-body > .viewas-btn,
.coach-screen .page-body > .section-label { margin-bottom: 16px; }
.coach-screen .page-body > .section-label { margin-top: var(--section-gap); margin-bottom: var(--section-label-gap); }

/* coach Today: Take attendance button inside the attendance tile */
.ctoday-att-btn { width: 100%; margin-top: 18px; background: var(--crimson); color: #fff; border: 0; border-radius: 10px; padding: 12px; font-size: 14px; font-weight: 600; cursor: pointer; }
.ctoday-att-btn:active { opacity: .9; }

/* athlete detail "This week": no highlight behind sessions/core */
.coach-screen .meta-tile { background: transparent; }

/* roster card: full-width tappable + alert chips */
.team-main-full { width: 100%; }
.team-alerts { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 7px; }
.alert-chip { font-size: 10px; font-weight: 700; padding: 2px 7px; border-radius: 7px; background: rgba(239,159,39,0.18); color: #FAC775; white-space: nowrap; }

/* attendance roll-call modal */
.att-modal-list { display: flex; flex-direction: column; gap: 9px; margin: 8px 0 4px; }
.att-modal-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.att-modal-name { color: var(--text); font-size: 14px; font-weight: 500; flex: 1; min-width: 0; }
.att-modal-row .att-group { flex: 0 0 auto; }

/* attendance modal: branded wider cells, separators, full-width Done */
.att-modal .att-modal-row { border-bottom: 1px solid var(--border); padding-bottom: 10px; }
.att-modal .att-modal-row:last-child { border-bottom: 0; }
.att-modal .att-group { gap: 7px; padding: 0; }
.att-modal .att-btn { flex: 0 0 auto; min-width: 56px; padding: 9px 6px; font-size: 13px; font-weight: 600;
  background: var(--lane-light); border: 0.5px solid var(--border); color: var(--navy); border-radius: 9px; }
.att-modal .att-btn.att-here.on { background: var(--green); border-color: var(--green); color: #fff; }
.att-modal .att-btn.att-late.on { background: var(--amber); border-color: var(--amber); color: #fff; }
.att-modal .att-btn.att-out.on  { background: var(--crimson); border-color: var(--crimson); color: #fff; }
.att-modal .modal-actions { grid-template-columns: 1fr; margin-top: 16px; }
.att-modal .btn-modal-cancel { background: var(--crimson); color: #fff; }

/* roster card: bigger avatar left, name + school, event far right */
.team-main-full { display: flex; align-items: center; gap: 13px; width: 100%; text-align: left; }
.team-main-full .tile-avatar { width: 54px; height: 54px; font-size: 17px; flex: 0 0 auto; }
.team-main-full .team-info { flex: 1; min-width: 0; }
.team-event { flex: 0 0 auto; margin-left: auto; color: #cdd8ec; font-size: 13px; font-weight: 700; white-space: nowrap; padding-left: 8px; }

/* athlete detail: "This week" sessions/core distributed evenly */
.tw-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.tw-meta .meta-tile { text-align: center; align-items: center; }

/* roster card: larger avatar (events/alerts moved to the profile) */
.team-main-full .tile-avatar { width: 60px; height: 60px; font-size: 19px; }

/* athlete detail: weekly progress rings (Main session / Lifts / Core) */
.prog-rings { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 10px 0 4px; }
.prog-ring-item { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.prog-ring { position: relative; width: 62px; height: 62px; display: inline-flex; align-items: center; justify-content: center; }
.prog-ring-num { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 800; color: #fff; }
.prog-ring-label { font-size: 11.5px; font-weight: 600; color: #cdd8e8; }
.prog-ring-sub { font-size: 11px; color: #9fb0cc; }
.prog-alerts { margin-top: 12px; }

/* athlete detail: Recent activity accordion */
.acc-card { padding: 0 !important; }
.acc-head { width: 100%; display: flex; align-items: center; justify-content: space-between; background: none; border: 0; color: #fff; font-size: 14px; font-weight: 600; padding: 14px 16px; cursor: pointer; }
.acc-chev { color: #9fb0cc; transition: transform .18s ease; }
.acc-head.open .acc-chev { transform: rotate(180deg); }
.acc-body { padding: 0 16px 14px; }

/* athlete home: weekly progress rings tile (frosted, no coach alerts) */
.home-week-card { background: rgba(255,255,255,0.07); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border: 1px solid rgba(255,255,255,0.14); border-radius: 16px; padding: 14px 16px; margin-bottom: 14px; }
.home-week-card .card-cat { color: #c5d0ea; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; margin: 0 0 4px; }

/* ── Standard vertical spacing: 16px between stacked tiles (home) ──────────── */
.home-body { gap: 16px; }
.home-body > .home-cal, .home-body > .home-week-card, .home-body > .home-stack { margin-top: 0; margin-bottom: 0; }
/* Section-label spacing on the athlete home: match the coach screen (tight 8px under
   the title) despite the home-body flex gap. This is the standard everywhere. */
/* Home is a flex column with a 16px gap, so the effective space around a
   heading is gap + margin. Offset by the gap to hit the standard 28/10. */
.home-body > .section-label { margin: calc(var(--section-gap) - 16px) 0 calc(var(--section-label-gap) - 16px); }
.home-body > #ath-meets { margin-top: 0; }
/* Leaderboard label lives inside its wrap (so it's not a direct-child label) —
   push the whole wrap down to give the section its standard gap. */
.home-body > #home-lead-wrap { margin-top: calc(var(--section-gap) - 16px); }
.home-body > #home-lead-wrap:empty { margin-top: 0; }
.home-week-card { margin-bottom: 0; }
.home-cal { margin-top: 0; }
.home-stack { margin-top: 0; }

/* athlete home: calendar lives in the navy header (expands for month view) */
.home-cal-header { margin-top: 12px; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.14); }
.cal-week-nav { display: flex; align-items: center; gap: 10px; }
.cal-wk-arrow { background: none; border: 0; color: #cdd8ec; font-size: 18px; font-weight: 700; line-height: 1; padding: 0 2px; cursor: pointer; }
.cal-wk-arrow:active { color: #fff; }
.home-week { will-change: transform; }

/* athlete home: calendar sits inside the navy header so its rounded bottom shows
   (matches the coach home/day headers). Transparent band, no tile corners. */
.home-head { padding-bottom: 16px; border-radius: 0 0 22px 22px; }
.home-cal-header { margin: 14px 0 2px; padding: 0; border: 0; border-radius: 0; background: transparent; -webkit-backdrop-filter: none; backdrop-filter: none; }
.home-cal-header .home-cal-head { padding: 2px 0 9px; }

/* flush light-band calendar in headers — session (athlete) + coach today/week */
.app-header.day-header { padding-bottom: 14px; border-radius: 0 0 22px 22px; }
.day-header .day-cal { margin: 12px 0 2px; padding: 0 0 4px; background: transparent; }
.day-header .day-cal-head { margin: 2px 0 9px; }

/* announcement card → frosted to match messages/DM (not a white tile) */
.day-screen .ann-card { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.day-screen .ann-title { color: #fff; }
.day-screen .ann-body { color: #eef2f8; }
.day-screen .ann-body a { color: #cdd8ee; }
.day-screen .ann-foot, .day-screen .ann-foot-main { color: #aab6cf; }
.day-screen .ann-locked { color: #93a0b8; }
.day-screen .ann-replies { border-top-color: rgba(255,255,255,0.12); }
.day-screen .ann-reply { background: rgba(255,255,255,0.05); }
.day-screen .ann-reply-body { color: #e7ecf5; }
.day-screen .ann-reply-head .ann-from { color: #fff; }
.day-screen .ann-card .msg-composer { background: rgba(255,255,255,0.05); }

/* coach today: action + post-message buttons fill their tile */
.ctoday-train .ctoday-act { display: block; width: 100%; box-sizing: border-box; margin-top: 14px; }
.ctoday-note-row { flex-direction: column; align-items: stretch; gap: 8px; }
#ctoday-note-save { width: 100%; box-sizing: border-box; }
.ctoday-note-status { text-align: center; }

/* week-at-a-glance: date nav sits in the secondary header band (matches other header calendars) */
.coach-nav { margin: 14px -18px -14px; padding: 12px 18px 14px; background: rgba(255,255,255,0.055); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }

/* Progress page accordions → frosted to match the dark screen (not white cards) */
.day-screen .acc-card { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.day-screen .acc-head { color: #fff; }
.day-screen .acc-body .recent { background: transparent; border: 0; padding: 0; }

/* ─── Coach program editor ──────────────────────────────────────────────── */
.pe-body { display: flex; flex-direction: column; gap: 14px; }
.pe-hint .card-detail { color: #cdd8e8 !important; font-size: 12.5px; }
.pe-top { margin-top: 2px; }
.pe-f { display: flex; flex-direction: column; gap: 5px; }
.pe-f > span { font-size: 11px; color: #9fb0cc; letter-spacing: .04em; text-transform: uppercase; }
.pe-in { background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.16); border-radius: 9px; color: #fff; font-size: 15px; padding: 10px 11px; width: 100%; box-sizing: border-box; }
.pe-in::placeholder { color: #7d89a3; }
.pe-in:focus { outline: none; border-color: rgba(255,255,255,0.4); }
textarea.pe-in { resize: vertical; }
.pe-group { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); border-radius: 14px; padding: 13px; display: flex; flex-direction: column; gap: 12px; }
.pe-group-head { font-size: 13px; font-weight: 700; color: #fff; letter-spacing: .02em; }
.pe-block { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); border-radius: 12px; padding: 12px; display: flex; flex-direction: column; gap: 10px; }
.pe-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.pe-blockfoot { display: flex; justify-content: space-between; align-items: center; }
.pe-mini { background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.16); color: #dfe6f2; font-size: 12px; font-weight: 600; border-radius: 8px; padding: 7px 11px; cursor: pointer; }
.pe-mini:active { opacity: .8; }
.pe-danger { color: #F2A6AE; border-color: rgba(var(--accent-rgb),0.4); }
.pe-add { align-self: flex-start; background: none; border: 1px dashed rgba(255,255,255,0.28); color: #cdd8e8; font-size: 13px; font-weight: 600; border-radius: 9px; padding: 9px 14px; cursor: pointer; }
.pe-toggle { display: flex; align-items: center; gap: 10px; color: #e7ecf5; font-size: 14px; padding: 2px; }
.pe-toggle input { width: 18px; height: 18px; accent-color: var(--crimson); }
.pe-save { background: var(--crimson); color: #fff; border: 0; border-radius: var(--radius-btn); padding: 14px; font-size: 15px; font-weight: 700; cursor: pointer; margin-top: 2px; }
.pe-save:disabled { opacity: .6; }
.pe-status { font-size: 13px; text-align: center; min-height: 18px; color: #9fb0cc; }
.pe-status.ok { color: #5DCAA5; }
.pe-status.err { color: #FAB4B4; }

/* program editor: themed select + note suggestion chips */
.pe-select { -webkit-appearance: none; appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%239fb0cc' d='M1 1l5 5 5-5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; padding-right: 30px; }
.pe-select option { color: #16202e; }
.pe-chips { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 8px; }
.pe-chip { background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.16); color: #cdd8e8; font-size: 12px; border-radius: 999px; padding: 6px 11px; cursor: pointer; }
.pe-chip:active { background: rgba(var(--accent-rgb),0.35); border-color: rgba(var(--accent-rgb),0.55); color: #fff; }

/* coach day: per-group edit pencil + editor focus flash */
.ctc-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ctc-edit { background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.16); color: #cdd8e8; border-radius: 8px; padding: 5px 8px; cursor: pointer; line-height: 0; flex: 0 0 auto; }
.ctc-edit:active { opacity: .75; }
.pe-group.pe-flash, #pe-fourwrap.pe-flash { animation: peFlash 1.4s ease; }
@keyframes peFlash { 0%,100% { box-shadow: 0 0 0 0 rgba(255,255,255,0); } 25% { box-shadow: 0 0 0 2px rgba(240,153,123,0.65); } }

/* program editor v2: block spacing, reorder buttons, clean note picker */
#pe-sprint, #pe-four { display: flex; flex-direction: column; gap: 12px; }
.pe-grid3 { grid-template-columns: 1fr 1fr 1fr; }
.pe-foot-l { display: flex; align-items: center; gap: 7px; }
.pe-move { padding: 7px 10px; font-size: 14px; line-height: 1; }
.pe-note-pick, .pe-notes-ta { margin-top: 0; }
#pe-note-pick { margin-bottom: 8px; }
/* retire the per-group pencil styles (feature removed) */
.ctc-edit { display: none; }

/* program editor v3: obvious reorder control */
.pe-reorder { display: inline-flex; align-items: center; gap: 6px; }
.pe-reorder-lbl { font-size: 10px; text-transform: uppercase; letter-spacing: .06em; color: #8a93a6; }
.pe-reorder .pe-move { width: 34px; height: 32px; display: inline-flex; align-items: center; justify-content: center; font-size: 17px; font-weight: 700; background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.22); color: #fff; cursor: pointer; padding: 0; }
.pe-reorder .pe-move[data-up] { border-radius: 8px 0 0 8px; border-right: 0; }
.pe-reorder .pe-move[data-down] { border-radius: 0 8px 8px 0; }
.pe-reorder .pe-move:active { background: rgba(255,255,255,0.2); }
#pe-sprint .pe-block:first-child .pe-move[data-up],
#pe-four .pe-block:first-child .pe-move[data-up] { opacity: .3; pointer-events: none; }
#pe-sprint .pe-block:last-child .pe-move[data-down],
#pe-four .pe-block:last-child .pe-move[data-down] { opacity: .3; pointer-events: none; }

/* program editor v4: button polish */
.pe-mini { white-space: nowrap; }
.pe-blockfoot [data-auto], .pe-blockfoot [data-remove] { padding: 9px 14px; min-width: 92px; text-align: center; }
.pe-danger { background: rgba(199,42,58,0.92) !important; border-color: rgba(199,42,58,0.95) !important; color: #fff !important; }
.pe-danger:active { background: rgba(170,32,48,0.95) !important; }
.pe-reorder .pe-move { background: rgba(255,255,255,0.18); border-color: rgba(255,255,255,0.4); color: #fff; font-weight: 800; }
.pe-reorder .pe-move:active { background: rgba(255,255,255,0.28); }

/* program editor v5: Reset + Remove together on the right, Reorder below them */
.pe-blockfoot { justify-content: flex-end; gap: 10px; }
.pe-reorder-row { display: flex; justify-content: flex-end; margin-top: 2px; }

/* coach day: Week-at-a-glance + Edit-workout buttons → red with white icons */
.coach-week-link { background: var(--crimson); border-color: var(--crimson); color: #fff; }
.coach-week-link:active { background: color-mix(in srgb, var(--accent) 78%, #000); }
.coach-week-link .cwl-ic { color: #fff; }
.coach-week-link .cwl-chev { color: rgba(255,255,255,0.85); }

/* attendance modal: drag handle + swipe-to-dismiss header */
.att-modal-head { position: relative; padding-top: 4px; cursor: grab; touch-action: none; }
.att-grab { width: 40px; height: 5px; border-radius: 3px; background: #cfd5df; margin: 0 auto 12px; }

/* ─── Coach: squad health rollup ────────────────────────────────────────── */
.squad-card { width: 100%; text-align: left; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); border-radius: 14px; padding: 13px 15px; margin-bottom: 12px; cursor: pointer; display: block; }
.squad-card:active { background: rgba(255,255,255,0.1); }
.squad-head { display: flex; align-items: baseline; justify-content: space-between; }
.squad-name { font-size: 15px; font-weight: 700; color: #fff; }
.squad-n { font-size: 12px; color: #9fb0cc; }
.squad-stats { display: flex; gap: 16px; margin: 9px 0 8px; }
.squad-stat { font-size: 12.5px; color: #9fb0cc; }
.squad-stat b { font-size: 17px; font-weight: 700; margin-right: 3px; }
.squad-stat.ok b { color: #5DCAA5; }
.squad-stat.behind b { color: #F09595; }
.squad-stat.none b { color: #cdd8ec; }
.squad-foot { display: flex; gap: 14px; font-size: 11.5px; color: #8a93a6; }

/* roster group filter chip */
.roster-filter-chip { display: inline-flex; align-items: center; gap: 8px; background: rgba(var(--accent-rgb),0.22); border: 1px solid rgba(var(--accent-rgb),0.5); color: #fff; font-size: 13px; font-weight: 600; border-radius: 999px; padding: 7px 14px; margin-bottom: 12px; cursor: pointer; }
.roster-filter-chip .rfc-x { color: #F2A6AE; font-size: 14px; }

/* attendance roll-call controls */
.att-rollcall { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 2px 0 12px; }
.att-filter { display: inline-flex; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.14); border-radius: 9px; overflow: hidden; }
.att-fbtn { background: none; border: 0; color: #b9c4d8; font-size: 12.5px; font-weight: 600; padding: 7px 12px; cursor: pointer; }
.att-fbtn.on { background: rgba(255,255,255,0.16); color: #fff; }
.att-allhere { background: rgba(29,158,117,0.85); border: 0; color: #fff; font-size: 13px; font-weight: 700; border-radius: 9px; padding: 8px 13px; cursor: pointer; white-space: nowrap; }
.att-allhere:active { opacity: .85; }

/* squad health: centered stats with more breathing room */
.squad-stats { justify-content: center; gap: 22px; margin: 15px 0 14px; }
.squad-foot { justify-content: center; }

/* roster page: segmented group filter */
.roster-filter { display: inline-flex; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.14); border-radius: 9px; overflow: hidden; margin-bottom: 12px; }
.rf-btn { background: none; border: 0; color: #b9c4d8; font-size: 13px; font-weight: 600; padding: 8px 16px; cursor: pointer; }
.rf-btn.on { background: rgba(255,255,255,0.16); color: #fff; }

/* attendance: clear hint below the roll-call row */
.att-hint { color: #8a93a6; font-size: 12px; text-align: center; margin: 0 0 6px; }

/* Needs attention: collapsible alerts with tappable athlete names */
.ctoday-flag { display: block; padding: 0; }
.ctoday-flag-head { display: flex; align-items: center; gap: 11px; width: 100%; background: none; border: 0; padding: 11px 13px; cursor: pointer; text-align: left; }
.ctoday-flag-chev { margin-left: auto; color: #9fb0cc; transition: transform .18s ease; }
.ctoday-flag-head.open .ctoday-flag-chev { transform: rotate(180deg); }
.ctoday-flag-body { display: block; padding: 0 13px 6px; }
.ctoday-flag-body[hidden] { display: none; }
.flag-name { display: flex; align-items: center; justify-content: space-between; width: 100%; background: none; border: 0; border-top: 1px solid rgba(255,255,255,0.1); color: #eef2f8; font-size: 14px; font-weight: 500; padding: 11px 2px; cursor: pointer; text-align: left; }
.flag-name-chev { color: #9fb0cc; font-size: 18px; }
.flag-name:active { background: rgba(255,255,255,0.06); }

/* ─── Coach classes ─────────────────────────────────────────────────────── */
.class-card { display: block; }
.class-top { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.class-name { font-size: 16px; font-weight: 700; color: #fff; }
.class-count { font-size: 12px; color: #9fb0cc; flex: 0 0 auto; }
.class-dates { font-size: 12.5px; color: #9fb0cc; margin-top: 3px; }
.class-coderow { display: flex; align-items: center; gap: 10px; margin-top: 12px; }
.class-code-k { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--text-mute); }
.class-code { font-family: ui-monospace, Menlo, monospace; font-size: 18px; font-weight: 700; letter-spacing: 2px; color: #fff; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.18); border-radius: 9px; padding: 7px 13px; cursor: pointer; }
.class-copy-ic { font-size: 13px; color: #9fb0cc; letter-spacing: 0; }
.class-actions { display: flex; gap: 8px; margin-top: 12px; }

/* athlete: join-a-class */
.join-row { display: flex; gap: 8px; margin-top: 10px; }
.join-row input { flex: 1; }
.join-btn { flex: 0 0 auto; width: auto; padding-left: 18px; padding-right: 18px; }
.join-status { font-size: 12.5px; margin-top: 8px; min-height: 16px; color: var(--text-mute); }
.join-status.ok { color: var(--green); }
.join-status.err { color: #C0392B; }
.set-screen .join-status.err { color: #FAB4B4; }

/* coach: program context (which class's program) selector */
.prog-ctx { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.prog-ctx-k { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: #9fb0cc; flex: 0 0 auto; }
.prog-ctx-sel { flex: 1; }

/* fields inside modals (e.g. class create/edit) get breathing room */
.modal .pe-f { margin-bottom: 12px; }
/* Native iOS date inputs reserve extra height/width by default — pin them to the
   same compact height as the text inputs and let them shrink so two fit per row. */
.modal .pe-in[type="date"] { width: 100%; box-sizing: border-box; height: 46px; min-height: 0; padding: 0 10px; line-height: 46px; -webkit-appearance: none; appearance: none; }
/* side-by-side date cells: minmax(0,1fr) lets the columns shrink below the native
   date input's intrinsic width on iOS, so the boxes don't overflow/overlap. */
.pe-dates { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
.pe-dates .pe-f { min-width: 0; overflow: hidden; }
.pe-dates .pe-in[type="date"] { min-width: 0; padding: 0 8px; font-size: 14px; }

/* classes: spacing under the create button; program action + context banner */
#create-class { margin-bottom: 16px; }
.class-actions .pcb-prog { background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.22); color: #fff; }
.prog-ctx-banner { display: flex; align-items: center; justify-content: space-between; gap: 10px; background: rgba(var(--accent-rgb),0.18); border: 1px solid rgba(var(--accent-rgb),0.45); border-radius: 11px; padding: 10px 13px; margin-bottom: 14px; font-size: 13px; color: #f2f5fa; }
.prog-ctx-banner b { font-weight: 700; }
.pcb-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--crimson); margin-right: 7px; }
.pcb-exit { background: rgba(255,255,255,0.12); border: 1px solid rgba(255,255,255,0.28); color: #fff; font-size: 12px; font-weight: 600; border-radius: 8px; padding: 6px 11px; cursor: pointer; flex: 0 0 auto; }

/* program builder: competition date rows */
.pb-comp-row { display: flex; gap: 8px; align-items: center; margin-bottom: 8px; }
.pb-comp-row input { flex: 1; min-width: 0; }
.pb-comp-row .pe-danger { flex: 0 0 auto; padding: 8px 11px; }

/* program builder: weeks readout, direction help, competition rows */
.pb-weeks-out { font-size: 13px; color: #9fb0cc; margin: -4px 0 6px; font-weight: 600; }
.pb-weeks-out.ok { color: #5DCAA5; }
.pb-help { font-size: 12px; color: #9fb0cc; line-height: 1.45; margin: -4px 0 8px; }
.pb-comp { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); border-radius: 12px; padding: 11px; display: flex; flex-direction: column; gap: 8px; margin-bottom: 10px; }
.pb-comp-row2 { display: flex; gap: 8px; align-items: center; }
.pb-comp-row2 .pe-in[type="date"] { flex: 1; min-width: 0; }
.pb-comp-row2 .pe-danger { flex: 0 0 auto; }

/* coach: active-class switcher pill in headers */
/* Class switcher is now a round icon button (matches the gear). */
.class-switch-btn.is-on { background: rgba(214,40,40,0.92); border-color: rgba(214,40,40,0.92); color: #fff; }
/* Centered class line under the avatar/name row (athlete Home + coach Today). */
.class-chip-line { display: flex; justify-content: center; margin: 9px 0 2px; }
.class-chip { display: inline-block; max-width: 92%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #fff; font-size: 14px; font-weight: 700; letter-spacing: 0.01em; }
.class-chip-k { color: rgba(255,255,255,0.6); font-weight: 600; }
/* Header icon spacing is standardized via the --hdr-icon-gap variable on
   .app-header-row and .home-id-actions — the only two header containers. */
.ac-target { margin: -2px 0 12px; }
.ac-pill { display: inline-flex; align-items: center; gap: 6px; background: rgba(214,40,40,0.14); border: 1px solid rgba(214,40,40,0.4); color: #fff; border-radius: 999px; padding: 5px 12px; font-size: 12.5px; }
.ac-pill strong { font-weight: 700; }
.cls-switch-list { display: flex; flex-direction: column; gap: 8px; margin: 6px 0 4px; }
.cls-switch-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; text-align: left; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); border-radius: 11px; padding: 13px 14px; cursor: pointer; }
.cls-switch-row.on { background: rgba(var(--accent-rgb),0.28); border-color: rgba(var(--accent-rgb),0.55); }
.csr-name { color: #fff; font-size: 15px; font-weight: 600; }
.csr-n { color: #9fb0cc; font-size: 12.5px; flex: 0 0 auto; }

/* program builder: date cells centered (no clipping) + weeks as a pill */
.pe-dates .pe-in[type="date"] { height: 46px; line-height: 46px; -webkit-appearance: none; appearance: none; box-sizing: border-box; min-width: 0; padding: 0 9px; font-size: 14px; }
.pb-weeks-out { display: inline-block; font-size: 12.5px; font-weight: 700; color: #cdd8e8; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.16); border-radius: 999px; padding: 5px 13px; margin: 2px 0 8px; }
.pb-weeks-out.ok { color: #fff; background: rgba(var(--accent-rgb),0.28); border-color: rgba(var(--accent-rgb),0.5); }

/* ─── Biometric app lock veil (Face ID / Touch ID) ───────────────────────── */
body.ft-locked { overflow: hidden; }
.ft-lock {
  position: fixed; inset: 0; z-index: 100000;
  display: flex; align-items: center; justify-content: center;
  padding: 24px calc(24px + env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) calc(24px + env(safe-area-inset-left));
  background: linear-gradient(160deg, var(--shell) 0%, var(--shell-dark) 100%);
  /* Frosted veil so any rendered content underneath is fully obscured. */
  -webkit-backdrop-filter: blur(22px); backdrop-filter: blur(22px);
}
.ft-lock-card {
  width: 100%; max-width: 340px; text-align: center; color: #fff;
  display: flex; flex-direction: column; align-items: center;
}
.ft-lock-logo { width: 76px; height: 76px; object-fit: contain; margin-bottom: 22px; filter: drop-shadow(0 6px 18px rgba(0,0,0,0.35)); }
.ft-lock-face { width: 64px; height: 64px; border-radius: 18px; display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,0.10); border: 1px solid rgba(255,255,255,0.18); color: #fff; margin-bottom: 16px; }
.ft-lock-face svg { width: 34px; height: 34px; }
.ft-lock-title { font-size: 22px; font-weight: 600; letter-spacing: 0.2px; }
.ft-lock-sub { font-size: 14px; color: #c6d0e2; margin: 6px 0 24px; }
.ft-lock-btn {
  width: 100%; background: var(--crimson); color: #fff; border: none;
  border-radius: 12px; padding: 15px 18px; font-size: 16px; font-weight: 600;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.ft-lock-btn:disabled { opacity: 0.7; }
.ft-lock-err { min-height: 18px; font-size: 13px; color: #ffb3bf; margin: 12px 0 0; }
.ft-lock-alt { margin-top: 14px; background: none; border: none; color: #c6d0e2; font-size: 14px; text-decoration: underline; cursor: pointer; padding: 6px; }

/* ─── Class progress board (peer cards + leaderboard) ────────────────────── */
.cb-av { display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:50%; overflow:hidden; background:var(--shell-light); color:#fff; font-size:13px; font-weight:600; flex:0 0 auto; }
.cb-av img { width:100%; height:100%; object-fit:cover; }
.cb-av .av-fallback { display:flex; align-items:center; justify-content:center; width:100%; height:100%; }
.cb-av-lg { width:44px; height:44px; font-size:16px; }
.cb-av-xl { width:60px; height:60px; font-size:20px; }
.cb-you { font-size:10px; font-weight:700; color:#fff; background:var(--crimson); border-radius:999px; padding:2px 7px; margin-left:6px; vertical-align:middle; }

.cb-lead { padding:6px 4px; }
.cb-lead-row { display:flex; align-items:center; gap:10px; padding:9px 8px; border-bottom:1px solid var(--border-soft); }
.cb-lead-row:last-child { border-bottom:none; }
.cb-rank { width:20px; text-align:center; font-weight:700; color:var(--navy); font-variant-numeric:tabular-nums; }
.cb-lead-name { flex:1; min-width:0; font-weight:500; color:var(--navy); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cb-lead-metric { font-size:13px; color:var(--text-soft); font-variant-numeric:tabular-nums; white-space:nowrap; }
.cb-delta.ok { color:var(--green); font-weight:600; }
.cb-delta.low { color: var(--crimson-ink); font-weight:600; }

.cb-card { display:flex; align-items:center; gap:12px; width:100%; text-align:left; margin-bottom:10px; }
.cb-card-id { flex:1; min-width:0; display:flex; flex-direction:column; }
.cb-card-name { font-size:15px; font-weight:600; color:var(--navy); }
.cb-card-sub { font-size:12.5px; color:var(--text-soft); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.cb-sheet-head { display:flex; align-items:center; gap:14px; margin:4px 0 14px; }
.cb-sheet-name { font-size:20px; font-weight:600; color:var(--navy); }
.cb-sheet-sub { font-size:13px; color:var(--text-soft); }
.cb-best { font-size:14px; color:var(--navy); margin:0 0 14px; }
.cb-pr-card { padding:4px 6px; }
.cb-pr-row { display:flex; justify-content:space-between; align-items:center; padding:9px 6px; border-bottom:1px solid var(--border-soft); font-size:14px; color:var(--text); }
.cb-pr-row:last-child { border-bottom:none; }
.cb-pr-row b { color:var(--navy); font-variant-numeric:tabular-nums; }

/* ─── Share-card builder ─────────────────────────────────────────────────── */
.sh-pick { margin-bottom:10px; }
.sh-loading { padding:22px; text-align:center; color:var(--text-soft); font-size:14px; }
.sh-preview { width:100%; height:auto; border-radius:14px; margin-top:14px; display:block; box-shadow:0 8px 24px rgba(17,25,45,0.18); }
/* Interactive editor: gestures adjust the photo, so block the page from scrolling/zooming under them */
.sh-editor { touch-action: none; -webkit-user-select: none; user-select: none; cursor: grab; }
.sh-hint { text-align:center; font-size:12px; color:var(--text-mute); margin-top:8px; }
.sh-zoom { width:100%; margin-top:8px; }
.sh-addvid { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; margin-top:10px;
  background:transparent; border:1px dashed var(--border-strong,rgba(17,25,45,.22)); border-radius:12px;
  padding:11px; font-size:14px; font-weight:600; color:var(--navy-light); cursor:pointer; }
.sh-vidnote { margin-top:8px; font-size:12.5px; color:var(--green); text-align:center; font-weight:600; }
.sh-actions { display:flex; gap:10px; margin-top:14px; }
.sh-actions .btn-secondary { flex:1; margin:0; }
.sh-actions .sh-primary { background:var(--crimson); color:#fff; border-color:var(--crimson); }

/* ─── Projection source label (coach-only) + time-trial toggle ───────────── */
.fb-src { color: var(--text-mute); font-weight: 400; font-size: 0.9em; white-space: nowrap; }
.tk-tt { display: flex; align-items: flex-start; gap: 10px; margin-top: 14px; font-size: 14px; color: var(--text); cursor: pointer; }
.tk-tt input { width: 20px; height: 20px; margin-top: 1px; flex: 0 0 auto; accent-color: var(--crimson); }
.tk-tt span { display: flex; flex-direction: column; line-height: 1.3; }
.tk-tt small { color: var(--text-soft); font-size: 12px; margin-top: 1px; }

/* ─── Discoverability entry points (Today share, Progress class link) ────── */
.btn-share-session { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; background: var(--shell-light); color: #fff; border: none; border-radius: 12px; padding: 13px; font-size: 15px; font-weight: 600; margin-top: 8px; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.btn-share-session svg { flex: 0 0 auto; }
.btn-share-session.is-locked { background: rgba(var(--navy-light-rgb),0.10) !important; color: var(--text-mute) !important; border-color: transparent !important; cursor: not-allowed; box-shadow: none; }

/* Weight-room "share a lift" picker */
.ws-list { display: flex; flex-direction: column; gap: 8px; }
.ws-item { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; text-align: left;
  background: var(--card); border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; cursor: pointer; }
.ws-name { font-size: 14px; font-weight: 700; color: var(--navy); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ws-w { flex: 0 0 auto; font-size: 14px; font-weight: 800; color: var(--navy-light); font-variant-numeric: tabular-nums; }

/* Session-complete celebration popup */
.scp-back { display: flex; align-items: center; justify-content: center; padding: 24px; }
.scp { position: relative; width: 100%; max-width: 340px; overflow: hidden;
  background: linear-gradient(160deg, #24396B 0%, #1D2F52 55%, #111E38 100%);
  border: 1px solid rgba(255,255,255,.10); border-radius: 22px; padding: 30px 24px 22px;
  text-align: center; color: #fff; box-shadow: 0 24px 60px rgba(6,12,28,.55); animation: scpPop .28s cubic-bezier(.2,.9,.3,1.2); }
@keyframes scpPop { from { opacity: 0; transform: translateY(10px) scale(.94); } to { opacity: 1; transform: none; } }
.scp-rays { position: absolute; top: -70px; left: 50%; width: 300px; height: 300px; transform: translateX(-50%);
  background: radial-gradient(closest-side, rgba(var(--accent-rgb),.30), transparent 70%); pointer-events: none; }
.scp-badge { position: relative; width: 74px; height: 74px; margin: 0 auto 14px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; color: #FFCE54;
  background: rgba(255,206,84,.12); border: 1px solid rgba(255,206,84,.35); }
.scp-title { position: relative; font-family: var(--font-display, "Kanit"), -apple-system, Arial, sans-serif;
  font-style: italic; text-transform: uppercase; font-weight: 800; font-size: 26px; letter-spacing: .01em; }
.scp-msg { position: relative; font-size: 14.5px; line-height: 1.5; color: rgba(255,255,255,.82); margin: 8px 4px 20px; }
.scp-actions { position: relative; display: flex; flex-direction: column; gap: 10px; }
.scp-share { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; border: 0; border-radius: 12px;
  padding: 13px; font-size: 15px; font-weight: 700; cursor: pointer; background: var(--accent, #2A54BE); color: #fff; }
.scp-done { width: 100%; border: 1px solid rgba(255,255,255,.22); background: transparent; color: #fff;
  border-radius: 12px; padding: 12px; font-size: 14px; font-weight: 600; cursor: pointer; }
.cb-entry { display: flex; align-items: center; gap: 12px; width: 100%; background: var(--bg); border: 1px solid var(--border); border-radius: 12px; padding: 13px 14px; margin-bottom: 14px; text-align: left; cursor: pointer; }
.cb-entry-ic { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; background: var(--lane-light); color: var(--navy); flex: 0 0 auto; }
.cb-entry-txt { flex: 1; min-width: 0; font-size: 15px; font-weight: 600; color: var(--navy); }
.cb-entry-chev { color: var(--text-mute); font-size: 20px; line-height: 1; }

/* ─── Program check (advisory guardrails sheet) ──────────────────────────── */
.pc-ok { display: flex; align-items: flex-start; gap: 12px; padding: 8px 4px 4px; }
.pc-ok-ic { width: 34px; height: 34px; border-radius: 50%; background: #e7f6ef; color: var(--green); display: flex; align-items: center; justify-content: center; font-weight: 700; flex: 0 0 auto; }
.pc-ok-sub { font-size: 13px; color: var(--text-soft); margin-top: 3px; }
.pc-flag { display: flex; gap: 10px; padding: 11px 12px; border: 1px solid var(--border); border-radius: 12px; margin-bottom: 10px; font-size: 14px; color: var(--text); background: var(--bg); }
.pc-flag .pc-dot { width: 9px; height: 9px; border-radius: 50%; margin-top: 5px; flex: 0 0 auto; }
.pc-warn .pc-dot { background: var(--amber); }
.pc-info .pc-dot { background: var(--shell-light); }
.pc-msg { flex: 1; min-width: 0; line-height: 1.45; }
.pc-note { font-size: 12px; color: var(--text-mute); margin-top: 6px; }

/* ─── Program overview (review & confirm the whole plan) ─────────────────── */
.ov-check { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; margin-bottom: 14px; }
.ov-check-ic { width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 700; color: #fff; flex: 0 0 auto; }
.ov-check.ok .ov-check-ic { background: var(--green); }
.ov-check.warn .ov-check-ic { background: var(--amber); }
.ov-check-txt { flex: 1; min-width: 0; font-size: 14px; font-weight: 500; color: var(--navy); }
.ov-chev { color: var(--text-mute); font-size: 18px; line-height: 1; }
.ov-phase { display: flex; align-items: center; justify-content: space-between; margin-top: 18px; }
.ov-phase-wk { font-size: 11px; color: var(--text-mute); font-weight: 600; text-transform: none; letter-spacing: 0; }
.ov-week { display: block; width: 100%; text-align: left; background: var(--bg); border: 1px solid var(--border); border-radius: 12px; padding: 11px 13px; margin-bottom: 10px; }
.ov-week-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 7px; }
.ov-week-n { font-size: 14px; font-weight: 600; color: var(--navy); }
.ov-badges { display: flex; gap: 6px; }
.ov-badge { font-size: 10px; font-weight: 700; border-radius: 999px; padding: 2px 8px; }
.ov-badge.deload { background: #eef1f7; color: #24396B; }
.ov-badge.test { background: #e7f6ef; color: #1d9e75; }
.ov-badge.meet { background: var(--crimson-soft); color: var(--crimson-ink); }
.ov-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.ov-chip { font-size: 12px; color: var(--text); background: var(--lane-light); border-radius: 8px; padding: 4px 9px; }
.ov-chip b { color: var(--navy); font-weight: 600; margin-right: 3px; }
.ov-rest { font-size: 12px; color: var(--text-soft); }

/* ─── Light Canvas full re-theme (v5.31.0) — generated: every frosted-on-navy
   content class converted to white-card + dark/mute text by luminance; navy
   header/nav/buttons/badges/active states preserved. Live-verified vs prototype. ─── */
.phase-card{color:var(--text)!important}
.test-window{color:var(--text)!important}
.coach-tile{color:var(--text)!important}
.coach-tile-sub{color:var(--text)!important}
.coach-tile-arrow{color:var(--text)!important}
.parent-screen .card, .parent-screen .par-card{background:var(--card)!important;border:0.5px solid var(--border)!important}
.parent-screen .ck{color:var(--text-mute)!important}
.parent-screen .par-ctitle{color:var(--text)!important}
.parent-screen .par-detail{color:var(--text)!important}
.parent-screen .par-detail.muted{color:var(--text-mute)!important}
.parent-screen .par-sub{color:var(--text-mute)!important}
.parent-screen .secttl{color:var(--text)!important}
.parent-screen .ann{background:var(--card)!important;border:0.5px solid var(--border)!important}
.parent-screen .ann-ti{color:var(--text)!important}
.parent-screen .ann-bd{color:var(--text)!important}
.parent-screen .ann-tm{color:var(--text-mute)!important}
.parent-screen .par-dmnote{color:var(--text)!important}
.parent-screen .par-dmnote{background:var(--card)!important;border:0.5px solid var(--border)!important}
.parent-screen .auth-input{color:var(--text)!important}
.parent-screen .auth-input{background:var(--card)!important;border:0.5px solid var(--border)!important}
.parent-screen .section-label{color:var(--text-mute)!important}
.par-welcome{background:var(--card)!important;border:0.5px solid var(--border)!important}
.par-welcome-h{color:var(--text)!important}
.par-welcome-p{color:var(--text)!important}
.par-welcome-x{color:var(--text)!important}
.par-welcome-x{background:var(--card)!important;border:0.5px solid var(--border)!important}
.set-row{color:var(--text)!important}
.set-row{background:var(--card)!important;border:0.5px solid var(--border)!important}
.set-row .set-ic{color:var(--text)!important}
.set-row.set-danger{color:var(--text-mute)!important}
.set-current{color:var(--text-mute)!important}
.home-screen .section-label{color:var(--text-mute)!important}
.meet-empty{color:var(--text-mute)!important}
.meet-empty{background:var(--card)!important;border:0.5px solid var(--border)!important}
.meets-add-link{color:var(--text)!important}
.meet{background:var(--card)!important;border:0.5px solid var(--border)!important}
.meet-dow{color:var(--text-mute)!important}
.meet-day{color:var(--text)!important}
.meet-mon{color:var(--text-mute)!important}
.meet-name{color:var(--text)!important}
.meet-meta{color:var(--text)!important}
.meet-loc{color:var(--text-mute)!important}
.mg-head{color:var(--text)!important}
.mg-legend{color:var(--text)!important}
.cvt{color:var(--text)!important}
.pc-result{color:var(--text)!important}
.day-foot{color:var(--text)!important}
.day-foot a{color:var(--text)!important}
.home-empty-card{background:var(--card)!important;border:0.5px solid var(--border)!important}
.home-empty-card .he-title{color:var(--text)!important}
.home-empty-card .he-sub{color:var(--text)!important}
.nr-divider{color:var(--text-mute)!important}
.conv-chev{color:var(--text-mute)!important}
.msg-loading{color:var(--text)!important}
.ann-locked{color:var(--text-mute)!important}
.dm-daysep{color:var(--text)!important}
.ann-daysep{color:var(--text)!important}
.fb-row{background:var(--card)!important;border:0.5px solid var(--border)!important}
.fb-text{color:var(--text)!important}
.feedback-tile-page .fb-row{background:var(--card)!important;border:0.5px solid var(--border)!important}
.feedback-tile .fb-text b{color:var(--text)!important}
.chart-pr{color:var(--text-mute)!important}
.ph2-goals-label{color:var(--text-mute)!important}
.ph2-goal{color:var(--text)!important}
.ph2-goal{background:var(--card)!important;border:0.5px solid var(--border)!important}
.ph2-goal b{color:var(--text)!important}
.prof-id-tile{background:var(--card)!important;border:0.5px solid var(--border)!important}
.pit-k{color:var(--text-mute)!important}
.pit-v{color:var(--text)!important}
.pit-sub{color:var(--text)!important}
.pit-line{color:var(--text)!important}
.lift-select{color:var(--text)!important}
.lift-select{background:var(--card)!important;border:0.5px solid var(--border)!important}
.day-screen .recent{background:var(--card)!important;border:0.5px solid var(--border)!important}
.day-screen .recent-row{color:var(--text)!important}
.day-screen .recent-row strong{color:var(--text)!important}
.day-screen .conv-row{background:var(--card)!important;border:0.5px solid var(--border)!important}
.day-screen .conv-title{color:var(--text)!important}
.day-screen .conv-sub{color:var(--text-mute)!important}
.day-screen .pc-label{color:var(--text-mute)!important}
.day-screen .pc-pill{color:var(--text)!important}
.day-screen .pc-pill{background:var(--card)!important;border:0.5px solid var(--border)!important}
.day-screen .card.accent-steel{background:var(--card)!important;border:0.5px solid var(--border)!important}
.day-screen .card.accent-steel .card-cat{color:var(--text-mute)!important}
.day-screen .card.accent-steel .card-detail{color:var(--text)!important}
.date-meta-line{color:var(--text-mute)!important}
.dm-bubble.dm-theirs .dm-text{color:var(--text)!important}
.dm-bubble.dm-theirs .dm-stamp{color:var(--text-mute)!important}
.dm-bubble.dm-theirs .dm-text a{color:var(--text)!important}
.set-screen .card{background:var(--card)!important;border:0.5px solid var(--border)!important}
.set-screen .card .card-cat{color:var(--text-mute)!important}
.set-screen .card .card-detail{color:var(--text)!important}
.set-screen .card .card-detail a{color:var(--text-mute)!important}
.wk-ring-num{color:var(--text)!important}
.wk-ring-label{color:var(--text-mute)!important}
.set-pw-toggle{color:var(--text)!important}
.set-pw-chev{color:var(--text-mute)!important}
.set-pw-input{color:var(--text)!important}
.set-pw-save{color:var(--text)!important}
.set-pw-msg.err{color:var(--text-mute)!important}
.set-pw-msg.ok{color:var(--text-mute)!important}
.set-pw-hint{color:var(--text-mute)!important}
.coach-screen .abs-sub{color:var(--text-mute)!important}
.coach-screen .abs-list li{color:var(--text)!important}
.coach-screen .abs-rest{color:var(--text)!important}
.coach-add-btn{color:var(--text)!important}
.coach-week-link{color:var(--text)!important}
.coach-week-link{background:var(--card)!important;border:0.5px solid var(--border)!important}
.coach-week-link .cwl-chev{color:var(--text-mute)!important}
.evt-chip{color:var(--text)!important}
.evt-chip{background:var(--card)!important;border:0.5px solid var(--border)!important}
.compose-opt-t{color:var(--text)!important}
.compose-opt-s{color:var(--text-mute)!important}
.att-date-label{color:var(--text)!important}
.att-date-arrow{color:var(--text)!important}
.coach-screen .modal-field label{color:var(--text-mute)!important}
.coach-screen .modal-field input, .coach-screen .modal-field select{color:var(--text)!important}
.coach-screen .auth-error{color:var(--text-mute)!important}
.cwk-range-btn{color:var(--text)!important}
.coach-screen .auth-label{color:var(--text-mute)!important}
.coach-screen .auth-note{color:var(--text-mute)!important}
.coach-screen .meta-tile{background:var(--card)!important;border:0.5px solid var(--border)!important}
.coach-screen .meta-tile-label{color:var(--text-mute)!important}
.coach-screen .meta-tile-value{color:var(--text)!important}
.coach-screen .test-trend-name{color:var(--text)!important}
.coach-screen .test-trend-latest{color:var(--text)!important}
.coach-screen .viewas-btn{color:var(--text)!important}
.alert-chip{color:var(--text-mute)!important}
.att-modal-name{color:var(--text)!important}
.team-event{color:var(--text)!important}
.prog-ring-num{color:var(--text)!important}
.prog-ring-label{color:var(--text)!important}
.prog-ring-sub{color:var(--text-mute)!important}
.acc-head{color:var(--text)!important}
.acc-chev{color:var(--text-mute)!important}
.home-week-card{background:var(--card)!important;border:0.5px solid var(--border)!important}
.home-week-card .card-cat{color:var(--text)!important}
.day-screen .ann-card{background:var(--card)!important;border:0.5px solid var(--border)!important}
.day-screen .ann-title{color:var(--text)!important}
.day-screen .ann-body{color:var(--text)!important}
.day-screen .ann-body a{color:var(--text)!important}
.day-screen .ann-foot, .day-screen .ann-foot-main{color:var(--text-mute)!important}
.day-screen .ann-locked{color:var(--text-mute)!important}
.day-screen .ann-reply{background:var(--card)!important;border:0.5px solid var(--border)!important}
.day-screen .ann-reply-body{color:var(--text)!important}
.day-screen .ann-reply-head .ann-from{color:var(--text)!important}
.coach-nav{background:var(--card)!important;border:0.5px solid var(--border)!important}
.day-screen .acc-card{background:var(--card)!important;border:0.5px solid var(--border)!important}
.day-screen .acc-head{color:var(--text)!important}
.pe-hint .card-detail{color:var(--text)!important}
.pe-f > span{color:var(--text-mute)!important}
.pe-in{color:var(--text)!important}
.pe-in{background:var(--card)!important;border:0.5px solid var(--border)!important}
.pe-group{background:var(--card)!important;border:0.5px solid var(--border)!important}
.pe-group-head{color:var(--text)!important}
.pe-block{background:var(--card)!important;border:0.5px solid var(--border)!important}
.pe-mini{color:var(--text)!important}
.pe-mini{background:var(--card)!important;border:0.5px solid var(--border)!important}
.pe-danger{color:var(--text-mute)!important}
.pe-add{color:var(--text)!important}
.pe-toggle{color:var(--text)!important}
.pe-status{color:var(--text-mute)!important}
.pe-status.ok{color:var(--text-mute)!important}
.pe-status.err{color:var(--text-mute)!important}
.pe-chip{color:var(--text)!important}
.pe-chip{background:var(--card)!important;border:0.5px solid var(--border)!important}
.ctc-edit{color:var(--text)!important}
.ctc-edit{background:var(--card)!important;border:0.5px solid var(--border)!important}
.pe-reorder .pe-move{color:var(--text)!important}
.pe-danger{color:var(--text)!important}
.coach-week-link .cwl-ic{color:var(--text)!important}
.coach-week-link .cwl-chev{color:var(--text)!important}
.squad-card{background:var(--card)!important;border:0.5px solid var(--border)!important}
.squad-name{color:var(--text)!important}
.squad-n{color:var(--text-mute)!important}
.squad-stat{color:var(--text-mute)!important}
.squad-stat.ok b{color:var(--text-mute)!important}
.squad-stat.behind b{color:var(--text-mute)!important}
.squad-stat.none b{color:var(--text)!important}
.roster-filter-chip{color:var(--text)!important}
.roster-filter-chip .rfc-x{color:var(--text-mute)!important}
.att-filter{background:var(--card)!important;border:0.5px solid var(--border)!important}
.att-fbtn{color:var(--text-mute)!important}
.att-allhere{color:var(--text)!important}
.roster-filter{background:var(--card)!important;border:0.5px solid var(--border)!important}
.rf-btn{color:var(--text-mute)!important}
.ctoday-flag-chev{color:var(--text-mute)!important}
.flag-name{color:var(--text)!important}
.flag-name-chev{color:var(--text-mute)!important}
.class-name{color:var(--text)!important}
.class-count{color:var(--text-mute)!important}
.class-dates{color:var(--text-mute)!important}
.class-code{color:var(--text)!important}
.class-code{background:var(--card)!important;border:0.5px solid var(--border)!important}
.class-copy-ic{color:var(--text-mute)!important}
.set-screen .join-status.err{color:var(--text-mute)!important}
.prog-ctx-k{color:var(--text-mute)!important}
.class-actions .pcb-prog{color:var(--text)!important}
.prog-ctx-banner{color:var(--text)!important}
.pcb-exit{color:var(--text)!important}
.pb-weeks-out{color:var(--text-mute)!important}
.pb-weeks-out.ok{color:var(--text-mute)!important}
.pb-help{color:var(--text-mute)!important}
.pb-comp{background:var(--card)!important;border:0.5px solid var(--border)!important}
.class-switch-btn.is-on{color:var(--text)!important}
.class-chip{color:var(--text)!important}
.class-chip-k{color:var(--text)!important}
.ac-pill{color:var(--text)!important}
.cls-switch-row{background:var(--card)!important;border:0.5px solid var(--border)!important}
.csr-name{color:var(--text)!important}
.csr-n{color:var(--text-mute)!important}
.pb-weeks-out{color:var(--text)!important}
.pb-weeks-out{background:var(--card)!important;border:0.5px solid var(--border)!important}
.pb-weeks-out.ok{color:var(--text)!important}
.ft-lock-card{color:var(--text)!important}
.ft-lock-face{color:var(--text)!important}
.ft-lock-sub{color:var(--text)!important}
.ft-lock-btn{color:var(--text)!important}
.ft-lock-err{color:var(--text-mute)!important}
.ft-lock-alt{color:var(--text)!important}
.cb-you{color:var(--text)!important}
.sh-actions .sh-primary{color:var(--text)!important}
.ov-check-ic{color:var(--text)!important}
.rf-btn.on{background:var(--crimson)!important;color:#fff!important;border-color:var(--crimson)!important}
.meets-add-link,.day-foot a{color: var(--crimson-ink)!important}
.set-screen .btn-secondary,.viewas-btn{background:var(--lane-light)!important;border:0.5px solid var(--border)!important;color:var(--navy)!important}
.viewas-btn .viewas-ic svg{stroke:var(--navy)!important}

/* ─── Coach home v5.33 refinements ───────────────────────────────────── */
.coach-screen .screen-name.coach-greet-fit { white-space: nowrap; overflow: hidden; }
.coach-head-text { flex: 1; min-width: 0; }
.coach-menu-pop { position: fixed; z-index: 200; background: var(--card); border: 0.5px solid var(--border); border-radius: 12px; box-shadow: 0 12px 34px rgba(20,30,55,.22); padding: 6px; min-width: 170px; }
.cm-item { display: flex; align-items: center; gap: 11px; width: 100%; background: none; border: 0; padding: 11px 12px; font-size: 14px; font-weight: 600; color: var(--text); cursor: pointer; border-radius: 8px; text-align: left; }
.cm-item:active { background: var(--lane-light); }
.cm-item svg { color: var(--navy); flex: 0 0 auto; }

.class-banner { font-family: var(--font-display); font-style: italic; text-transform: uppercase; letter-spacing: .01em; font-size: 17px; font-weight: 700; color: var(--navy); margin: 2px 2px 12px; }

.ctoday-att.att-tile-v2 { display: flex; flex-direction: column; gap: 14px; }
.att-tile-v2 .att-summary { display: flex; align-items: flex-start; justify-content: space-between; width: 100%; }
.att-stats { display: flex; gap: 26px; }
.att-stat { display: flex; flex-direction: column; }
.att-n { font-family: var(--font-display); font-style: italic; font-size: 40px; font-weight: 700; line-height: 1; }
.att-n.att-present { color: var(--green); } .att-n.att-out { color: var(--amber); }
.att-l { font-size: 12px; color: var(--text-mute); margin-top: 4px; }
.att-total { text-align: right; } .att-total-n { font-size: 16px; font-weight: 700; color: var(--text); }
.att-tile-v2 .ctoday-att-btn { width: 100%; }

.attn-card { padding: 2px 14px; }
.attn-row { display: flex; align-items: center; gap: 12px; width: 100%; background: none; border: 0; padding: 13px 0; cursor: pointer; border-bottom: 1px solid var(--border-soft); text-align: left; }
.attn-row:last-child { border-bottom: 0; }
.attn-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--amber); flex: 0 0 auto; }
.attn-name { font-size: 16px; font-weight: 600; color: var(--text); flex: 1; min-width: 0; }
.attn-issue { font-size: 13px; color: var(--text-mute); flex: 0 0 auto; }

.set-pw-save { background: var(--crimson) !important; color: #fff !important; }
.set-pw-save.posted { background: var(--green) !important; }

.att-allhere { background: var(--shell-light) !important; color: #fff !important; }
.att-filter { background: var(--lane-light) !important; border: 0.5px solid var(--border) !important; }
.att-fbtn { color: var(--navy) !important; }
.att-fbtn.on { background: var(--crimson) !important; color: #fff !important; }

.par-sheet.sheet-light { background: var(--card); }
.par-sheet.sheet-light .par-sheet-h { color: var(--navy); }
.par-sheet.sheet-light .par-sheet-grab { background: #cfd5df; }
.par-sheet.sheet-light .auth-label { color: var(--text-mute); }
.par-sheet.sheet-light .auth-input, .par-sheet.sheet-light .onb-select { background: var(--card); border: 1px solid var(--border); color: var(--text); }
.par-sheet.sheet-light .auth-input::placeholder { color: var(--text-mute); }
.par-sheet.sheet-light .btn-primary { background: var(--crimson); border-color: var(--crimson); color: #fff; }

/* ─── Coach v5.34 refinements ─────────────────────────────────────────── */
/* kebab: no round background */
.coach-kebab { background: none; border: 0; padding: 6px; margin: -6px; color: #fff; line-height: 0; cursor: pointer; flex: 0 0 auto; }
.coach-kebab svg { display: block; }

/* light bottom-sheet list rows (menu, switch class, new message) */
.cm-sheet-list { display: flex; flex-direction: column; gap: 2px; padding-bottom: 6px; }
.cm-row { display: flex; align-items: center; gap: 13px; width: 100%; background: none; border: 0; padding: 15px 6px; font-size: 16px; font-weight: 600; color: var(--text); cursor: pointer; text-align: left; border-bottom: 1px solid var(--border-soft); }
.cm-row:last-child { border-bottom: 0; }
.cm-row-ic { color: var(--navy); flex: 0 0 auto; line-height: 0; }
.cls-sub { font-size: 13px; color: var(--text-mute); margin: -4px 0 14px; }
.sheet-light .cls-switch-row { background: var(--card); border: 0.5px solid var(--border); margin-bottom: 10px; }
.sheet-light .cls-switch-row.on { background: var(--crimson-soft); border-color: rgba(var(--accent-rgb),0.4); }
.sheet-light .csr-name { color: var(--text); }
.sheet-light .csr-n { color: var(--text-mute); }
.cls-close { width: 100%; background: var(--lane-light); border: 0.5px solid var(--border); color: var(--navy); border-radius: var(--radius-btn); padding: 13px; font-size: 15px; font-weight: 600; cursor: pointer; margin-top: 4px; }
.sheet-light .compose-opt { background: var(--card); border: 0.5px solid var(--border); color: var(--text); }
.sheet-light .compose-opt .compose-opt-t { color: var(--text); }
.sheet-light .compose-opt .compose-opt-s { color: var(--text-mute); }
.sheet-light .compose-opt .compose-opt-ic { color: var(--crimson-ink); }

/* roster: white add btn text, names bold, filter dividers */
.coach-add-btn, .ctoday-att-btn { color: #fff !important; }
.coach-screen .team-name { font-weight: 700 !important; color: var(--text) !important; }
.roster-filter .rf-btn:not(:last-child) { border-right: 1px solid var(--border); }

/* build program: match standard cell sizing */
.set-screen .pe-in, .set-screen .pe-select { min-height: 46px; padding: 12px 13px; font-size: 16px; border-radius: var(--radius-sm); }

/* manage: clean white card rows */
.set-row { background: var(--card) !important; border: 0.5px solid var(--border) !important; border-radius: var(--radius-md) !important; color: var(--text) !important; box-shadow: var(--shadow-sm); }
.set-row .set-ic { color: var(--navy) !important; }
.set-row .set-chev { color: var(--text-mute) !important; }
.set-row.set-danger { color: var(--crimson-ink) !important; }
.set-row.set-add { border-style: dashed !important; }

/* ─── Coach profile hub (v5.35) ───────────────────────────────────────── */
.cphub-screen { min-height: 100vh; background: var(--card); padding: calc(20px + var(--safe-top)) 22px calc(30px + var(--safe-bottom)); position: relative; }
.slide-left { animation: cphubSlide .26s ease; }
@keyframes cphubSlide { from { transform: translateX(-100%); } to { transform: translateX(0); } }
.cphub-close { position: absolute; top: calc(16px + var(--safe-top)); right: 16px; background: none; border: 0; font-size: 22px; color: var(--text); cursor: pointer; line-height: 1; padding: 6px; }
.cphub-id { display: flex; flex-direction: column; align-items: center; gap: 12px; margin: 34px 0 26px; }
.cphub-av { width: 96px; height: 96px; border-radius: 50%; overflow: hidden; background: var(--lane-light); border: 0; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.cphub-av img { width: 100%; height: 100%; object-fit: cover; }
.cphub-av .home-av-ini { font-size: 32px; font-weight: 700; color: var(--navy); }
.cphub-name { font-size: 22px; font-weight: 700; color: var(--text); }
.cphub-edit { background: none; border: 1.5px solid var(--border); color: var(--text); border-radius: 999px; padding: 10px 26px; font-size: 15px; font-weight: 600; cursor: pointer; }
.cphub-tiles { display: flex; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); margin-bottom: 6px; }
.cphub-tile { flex: 1; background: none; border: 0; padding: 18px 4px; display: flex; flex-direction: column; align-items: center; gap: 9px; cursor: pointer; color: var(--navy); }
.cphub-tile + .cphub-tile { border-left: 1px solid var(--border); }
.cphub-tile-l { font-size: 13px; font-weight: 600; color: var(--text); }
.cphub-row { display: flex; align-items: center; justify-content: space-between; width: 100%; background: none; border: 0; border-bottom: 1px solid var(--border); padding: 18px 2px; cursor: pointer; text-align: left; }
.cphub-row-t { font-size: 19px; font-weight: 700; color: var(--text); }
.cphub-row-s { font-size: 14px; color: var(--text-mute); margin-top: 2px; }
.cphub-row-chev { font-size: 24px; color: var(--text-mute); font-weight: 300; }
.cphub-foot { text-align: center; color: var(--text-mute); font-size: 12px; margin-top: 30px; }

/* ─── Settings list (Nike-style, v5.35) ──────────────────────────────── */
.setl-screen .page-body { padding: 0 0 24px; }
.setl-group { background: var(--card); margin-top: 12px; border-top: 0.5px solid var(--border); border-bottom: 0.5px solid var(--border); }
.setl-row { display: flex; align-items: center; justify-content: space-between; width: 100%; background: var(--card); border: 0; border-bottom: 0.5px solid var(--border); padding: 16px 18px; text-align: left; }
.setl-row:last-child { border-bottom: 0; }
.setl-nav, .setl-logout { cursor: pointer; }
.setl-label { font-size: 16px; font-weight: 500; color: var(--text); }
.setl-chev { font-size: 20px; color: var(--text-mute); font-weight: 300; }
.setl-logout .setl-label { color: var(--crimson-ink); font-weight: 600; }
.setl-foot { text-align: center; color: var(--text-mute); font-size: 12px; margin: 18px 0; }

/* slim on/off toggle */
.slimtog { width: 38px; height: 21px; border-radius: 999px; background: #cfd5df; border: 0; position: relative; cursor: pointer; flex: 0 0 auto; transition: background .15s; }
.slimtog::after { content: ""; position: absolute; top: 2px; left: 2px; width: 17px; height: 17px; border-radius: 50%; background: var(--card); transition: transform .15s; box-shadow: 0 1px 2px rgba(0,0,0,.25); }
.slimtog.on { background: var(--green); }
.slimtog.on::after { transform: translateX(17px); }

/* ─── Coach v5.36 refinements ─────────────────────────────────────────── */
/* sheet cells: more contrast on the white sheet */
.sheet-light .compose-opt, .sheet-light .cls-switch-row { background: var(--lane-light) !important; border: 0.5px solid var(--border) !important; }

/* settings section labels */
.setl-sec { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--text-mute); margin: 20px 18px 7px; }

/* edit profile: fill light, visible change-photo, X button */
.coach-screen.set-screen { background: var(--lane-light); min-height: 100vh; }
.cp-photo-btn { color: var(--navy) !important; opacity: 1 !important; }
.cphub-xbtn { font-size: 22px; line-height: 1; font-weight: 400; }

/* QR page → light */
.qr-page-light { background: #fff !important; color: var(--text) !important; }
.qr-page-light .qr-close { color: var(--text) !important; background: none !important; }
.qr-page-light .qr-card { background: #fff !important; border: 0.5px solid var(--border) !important; box-shadow: 0 6px 22px rgba(20,30,55,.12); }
.qr-page-light .qr-card-head { justify-content: center !important; }
.qr-page-light .qr-name { color: var(--navy) !important; font-weight: 700; font-size: 20px; }
.qr-page-light .qr-box { background: #fff !important; }
.qr-page-light .qr-box svg { width: 100%; height: auto; }
.qr-page-light .qr-act { background: var(--lane-light) !important; color: var(--navy) !important; border: 0.5px solid var(--border) !important; }

/* coach calendar month */
.cal-monthbar { display: flex; align-items: center; justify-content: space-between; margin: 2px 2px 10px; }
.cal-mname { font-family: var(--font-display); font-style: italic; text-transform: uppercase; letter-spacing: .01em; color: var(--navy); font-size: 18px; font-weight: 700; }
.cal-mnav { background: none; border: 0; color: var(--text-mute); font-size: 24px; cursor: pointer; padding: 2px 12px; line-height: 1; }
.cal-month-card { padding: 12px 12px 8px; }

/* Coach calendar grid — dark numbers on light card (v5.36.2) */
.cal-month-card .mg-n { color: var(--text); }
.cal-month-card .mg-cell.mut .mg-n { color: var(--text-mute); }
.cal-month-card .mg-cell.today { background: var(--shell); border-radius: 9px; }
.cal-month-card .mg-cell.today .mg-n { color: #fff; font-weight: 700; }

/* ─── Coach settings v5.37: light modals, program check, week glance ───── */
/* Program check + any sheet-light info sheet: dark body text on white */
.par-sheet.sheet-light { color: var(--text); }
.par-sheet.sheet-light .par-sheet-body { color: var(--text); }
.par-sheet.sheet-light .pc-ok b { color: var(--text); }
.par-sheet.sheet-light .pc-ok-sub { color: var(--text-soft); }
.par-sheet.sheet-light .par-sheet-sub { color: var(--text-mute); }
.par-sheet.sheet-light .pc-flag { background: var(--lane-light); border-color: var(--border); color: var(--text); }
.par-sheet.sheet-light .pc-note { color: var(--text-mute); }
.pc-intro { font-size: 13px; line-height: 1.5; color: var(--text-soft); margin: 0 0 14px; }

/* Light modal: event chips legible on white, cancel reads light-navy */
.modal:not(.modal-dark) .evt-chip { background: var(--lane-light); border: 1px solid var(--border); color: var(--text); }
.modal:not(.modal-dark) .evt-chip.on { background: var(--crimson); border-color: var(--crimson); color: #fff; }
.modal:not(.modal-dark) .btn-modal-cancel { background: var(--lane-light); color: var(--navy); }

/* Inactive page intro */
.setl-intro { font-size: 13px; line-height: 1.5; color: var(--text-mute); margin: 4px 2px 14px; }

/* Coach home: This week glance section */
.wg-link { font-size: 13px; font-weight: 600; color: var(--crimson-ink); cursor: pointer; }
.week-glance-wrap { cursor: pointer; }
.week-glance-wrap .week-rollup { margin: 0; }

/* ─── Coach v5.38: week header, simplified rollup, day page, builder cell ── */
/* Week page header: range nav sits on the navy rounded header */
.coach-week-header .coach-nav { margin-top: 6px; background: transparent !important; }
.coach-week-header .cwk-range-btn { color: #fff !important; background: transparent !important; }
.coach-week-header .date-nav-arrow { color: #fff !important; background: transparent !important; border: 0; }

/* Weekly volume tile — simplified, larger key numbers */
.wr-grp-name { font-size: 16px; font-weight: 700; color: var(--text); }
.wr-grp-total { font-size: 23px; font-weight: 800; color: var(--navy); line-height: 1; }
.wr-grp-unit { font-size: 13px; font-weight: 600; color: var(--text-mute); margin-left: 1px; }
.wr-legend2 { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 9px; font-size: 13px; color: var(--text-soft); }
.wr-legend2 span { display: inline-flex; align-items: center; gap: 5px; }
.wr-status2 { margin-top: 11px; font-size: 13px; font-weight: 600; padding: 8px 11px; border-radius: 9px; line-height: 1.35; }
.wr-status2.wr-ok { background: var(--ok-tint); color: var(--ok-ink); }
.wr-status2.wr-warn { background: var(--cau-tint); color: var(--cau-ink); }
.wr-status2.wr-base { background: var(--lane-light); color: var(--text-mute); }
.wr-foot { font-size: 11.5px; }

/* Day (session) page: week/theme line + clean white accordion cards */
.day-weekline { font-size: 13px; font-weight: 600; color: var(--text-mute); margin: 2px 2px 12px; }
.coach-screen .day-acc { background: var(--card); border: 1px solid var(--border); box-shadow: 0 1px 3px rgba(17,25,45,.05); }
.coach-screen .day-acc + .day-acc { margin-top: 10px; }
.coach-screen .day-acc.open { background: var(--card); box-shadow: 0 6px 18px rgba(17,25,45,.10); border-color: var(--border); }
.coach-screen .day-acc-title { font-size: 18px; font-weight: 800; }

/* Build program: duration cell = full-width, centered, teal, same height as inputs */
.set-screen .pb-weeks-out, .pb-weeks-out {
  display: flex; align-items: center; justify-content: center; text-align: center;
  width: 100%; box-sizing: border-box; min-height: 46px;
  padding: 8px 12px; border-radius: var(--radius-btn);
  font-size: 14px; font-weight: 700;
  background: var(--lane-light) !important; border: 1px solid var(--border) !important;
  color: var(--text-mute) !important; margin: 2px 0 10px;
}
.set-screen .pb-weeks-out.ok, .pb-weeks-out.ok { color: var(--green) !important; background: var(--ok-tint) !important; border-color: rgba(18,165,148,0.45) !important; }

/* ─── Coach v5.39: athlete page, meets btn, compose, DM, calendar lines ──── */
/* Athlete name scales to one line */
.coach-greet-fit { white-space: nowrap; overflow: hidden; }

/* Coach athlete page — clearly visible branded action buttons */
.coach-ath-screen .viewas-btn.btn-primary { background: var(--crimson) !important; border: 0 !important; color: #fff !important; }
.coach-ath-screen .viewas-btn.btn-primary .viewas-ic svg { stroke: #fff !important; }
.coach-ath-screen .btn-secondary { background: var(--card) !important; border: 1px solid var(--border) !important; color: var(--text) !important; font-weight: 600 !important; }
.coach-ath-screen .viewas-btn.btn-secondary .viewas-ic svg { stroke: var(--navy) !important; }

/* Home: "Add meet" as a crimson pill button */
.meets-add-btn { background: var(--crimson) !important; color: #fff !important; border: 0; border-radius: var(--radius-btn); padding: 7px 14px; font-size: 13px; font-weight: 600; cursor: pointer; flex: 0 0 auto; }
.meets-add-btn:active { opacity: .85; }

/* New-message sheet: icons without circle, Cancel as light-navy */
.compose-opt-ic, .sheet-light .compose-opt-ic { background: none !important; width: auto !important; height: auto !important; border-radius: 0 !important; color: var(--crimson-ink) !important; }
.cls-close { background: rgba(var(--navy-light-rgb),0.12) !important; border: 1px solid rgba(var(--navy-light-rgb),0.28) !important; color: var(--navy) !important; }

/* DM bubbles: navy outgoing, no borders, no image border */
.dm-bubble.dm-mine { background: var(--shell) !important; border: 0 !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
.dm-bubble.dm-mine .dm-text { color: #fff !important; }
.dm-bubble.dm-mine .dm-stamp { color: rgba(255,255,255,0.65) !important; }
.dm-bubble.dm-mine .dm-text a { color: #cdd8ee !important; }
.dm-bubble.dm-mine .dm-del { color: rgba(255,255,255,0.7) !important; }
.dm-bubble.dm-theirs { background: var(--card) !important; border: 0 !important; box-shadow: 0 1px 2px rgba(17,25,45,0.06); -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
.dm-bubble img { border: 0 !important; }

/* Calendar: grid lines separating dates (coach month view) */
.cal-month-card .mg-grid { gap: 0; border-top: 1px solid var(--border); border-left: 1px solid var(--border); border-radius: 10px; overflow: hidden; margin-top: 4px; }
.cal-month-card .mg-cell { border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); padding: 9px 0 7px; }

/* Edit profile / set-screens: always fill width, never offset */
.coach-screen.set-screen { width: 100%; max-width: 100%; overflow-x: hidden; }

/* ─── Coach v5.40: push off, chips, cancel blue, athlete btns, pace calc ── */
/* Week header: remove the seam line on the range nav */
.coach-week-header .coach-nav { border-top: 0 !important; border-bottom: 0 !important; }

/* Add-athlete event chips: visible on the white modal */
.modal .evt-grid .evt-chip { background: var(--lane-light) !important; border: 1px solid #cdd5e2 !important; color: var(--text) !important; }
.modal .evt-grid .evt-chip.on { background: var(--crimson) !important; border-color: var(--crimson) !important; color: #fff !important; }

/* New-message Cancel = light blue */
.cls-close { background: rgba(47,107,255,0.12) !important; border: 1px solid rgba(47,107,255,0.38) !important; color: #2F6BFF !important; }

/* Coach athlete page secondary buttons: clearly visible (light navy) */
.coach-ath-screen .btn-secondary { background: rgba(var(--navy-light-rgb),0.10) !important; border: 1px solid rgba(var(--navy-light-rgb),0.32) !important; color: var(--navy) !important; font-weight: 600 !important; }
.coach-ath-screen .viewas-btn.btn-secondary .viewas-ic svg { stroke: var(--navy) !important; }

/* Pace calculator: selected pill = light navy */
.pc-pill.active, .day-screen .pc-pill.active { background: var(--crimson) !important; border-color: var(--crimson) !important; color: #fff !important; }

/* ─── STYLE GUIDE v5.41: action buttons = NAVY-LIGHT (#2E4170). Red ONLY for delete / log out ─ */
.btn-primary,
.btn-modal-save,
.set-pw-save,
.pe-save,
.coach-add-btn,
.meets-add-btn,
.ctoday-att-btn,
.ctoday-act.primary,
.btn-share-session,
.sh-actions .sh-primary,
.home-start,
.btn-maps,
.fcal-nav,
.home-joinclass .hj-cta,
.onb-card .btn-primary,
.sheet-dark .btn-primary,
.par-sheet.sheet-light .btn-primary,
.coach-ath-screen .viewas-btn.btn-primary,
.msg-sendbtn,
.att-modal .btn-modal-cancel {
  background: var(--crimson) !important;
  border-color: var(--crimson) !important;
  color: #fff !important;
}
.coach-ath-screen .viewas-btn.btn-primary .viewas-ic svg { stroke: #fff !important; }

/* selected pills / chips / filters → navy-light (were crimson) */
.pc-pill.active, .day-screen .pc-pill.active,
.rf-btn.on,
.evt-chip.on,
.modal .evt-grid .evt-chip.on, .modal:not(.modal-dark) .evt-chip.on,
.kidchip.on,
.consent-box.on,
.fcal-cell.sel, .fcal-m.sel, .fcal-y.sel,
.onb-card .fcal-cell.sel, .onb-card .fcal-m.sel, .onb-card .fcal-y.sel {
  background: var(--crimson) !important;
  border-color: var(--crimson) !important;
  color: #fff !important;
}

/* Cancel buttons: subdued, navy-family (not red) */
.cls-close { background: var(--lane-light) !important; border: 1px solid var(--border) !important; color: var(--text) !important; }

/* DELETE + LOG OUT keep red */
.btn-modal-delete { background: var(--card) !important; color: var(--crimson-ink) !important; border: 1px solid var(--crimson) !important; }
.setl-logout .setl-label { color: var(--crimson-ink) !important; }
.dm-del { color: var(--crimson-ink) !important; }
.dm-bubble.dm-mine .dm-del { color: rgba(255,255,255,0.85) !important; }

/* DM: peer name ALL CAPS; message image with no frame / border */
.dm-screen .screen-name { text-transform: uppercase !important; }
.dm-bubble .msg-att-img img { border: 0 !important; outline: 0 !important; box-shadow: none !important; }
/* image-only message: no bubble frame around the photo (class-based — works without :has) */
.dm-bubble.dm-img-only { background: transparent !important; padding: 2px 0 !important; border: 0 !important; box-shadow: none !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
.dm-bubble.dm-img-only .dm-stamp { color: var(--text-mute) !important; padding: 3px 2px 0; }
.dm-bubble.dm-img-only.dm-mine { align-items: flex-end; }

/* v5.42: guarantee every coach page header has the rounded bottom */
.coach-screen .app-header { border-radius: 0 0 22px 22px; padding-bottom: 14px; }

/* v5.43: new-message options + switch-class selected + push CTA → navy-light */
.compose-opt-ic, .sheet-light .compose-opt-ic { color: var(--crimson-ink) !important; background: none !important; }
.cls-switch-row.on, .sheet-light .cls-switch-row.on { background: rgba(var(--navy-light-rgb),0.12) !important; border-color: rgba(var(--navy-light-rgb),0.45) !important; }
.push-card-btn { background: var(--shell-light) !important; border-color: var(--shell-light) !important; color: #fff !important; }

/* v5.44: settings gear (spoke) with NO background circle; cancel/close solid navy-light; DM avatar no border */
[data-hdr-settings].home-icon-btn, [data-go-manage].home-icon-btn, #home-settings.home-icon-btn { background: none !important; border: 0 !important; }
.cls-close, .btn-modal-cancel { background: var(--shell-light) !important; border: 1px solid var(--shell-light) !important; color: #fff !important; }
.msg-head-av { border: 0 !important; }

/* v5.45: athlete header back arrow inline-left of avatar (no longer floating above) */
.ath-head-id { gap: 10px; }
.ath-head-id .ath-back-inline { flex: 0 0 auto; padding: 0; margin: 0 0 0 -2px; font-size: 28px; align-self: center; }

/* v5.46: athlete Settings join-class card + navy-light Join button */
.setl-joincard { padding: 14px 16px; }
.setl-join { display: flex; gap: 8px; align-items: stretch; }
.setl-join .auth-input { flex: 1; min-width: 0; }
.setl-join-btn { flex: 0 0 auto; background: var(--shell-light); color: #fff; border: 0; border-radius: var(--radius-btn); padding: 0 18px; font-size: 14px; font-weight: 600; cursor: pointer; }
.setl-joincard .join-status { margin: 8px 2px 0; }

/* v5.47: athlete home reworked to coach look (bare bell+gear, rings+stats card, up-next tiles, 4-tab nav) */
.home-greet { font-family: var(--font-display); font-style: italic; text-transform: uppercase; letter-spacing: .01em; white-space: nowrap; overflow: hidden; }
.home-hdr-ic { background: none !important; border: 0 !important; color: #fff; padding: 6px; margin: -6px 0; position: relative; line-height: 0; cursor: pointer; flex: 0 0 auto; }
.home-hdr-ic svg { display: block; }
.home-hdr-dot { position: absolute; top: 2px; right: 2px; width: 9px; height: 9px; border-radius: 50%; background: var(--crimson); border: 1.5px solid var(--navy); }
.home-id-actions { gap: 8px; }

/* Message from coach card — crimson left rule, eyebrow caps */
.home-note { background: var(--card); border: 1px solid var(--border); border-left: 3px solid var(--crimson); border-radius: var(--radius-md, 14px); padding: 13px 15px; box-shadow: 0 1px 3px rgba(17,25,45,.05); margin-bottom: 14px; }
.home-note-tag { display: block; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--text-mute); margin-bottom: 3px; }
.home-note-body { font-size: 15px; color: var(--text); line-height: 1.4; }

/* This-week card: concentric rings + stat lines + chevron */
.home-week2 { display: flex; align-items: center; gap: 16px; width: 100%; text-align: left; background: var(--card); border: 1px solid var(--border); border-radius: var(--radius-md, 14px); padding: 16px; box-shadow: 0 1px 3px rgba(17,25,45,.05); cursor: pointer; }
.hw2-rings { flex: 0 0 auto; line-height: 0; }
.hw2-stats { flex: 1 1 auto; display: flex; flex-direction: column; gap: 5px; }
.hw2-stat { font-size: 15px; color: var(--text-mute); }
.hw2-stat b { color: var(--text); font-weight: 700; margin-right: 4px; }
.hw2-chev { flex: 0 0 auto; color: var(--text-mute); font-size: 22px; }

/* v5.47: 4-tab athlete nav — icon over label (fits Home/Progress/Messages/Profile) */
.bottom-nav .nav-item { flex-direction: column; gap: 3px; padding: 7px 4px; }
.bottom-nav .nav-item span:not(.nav-icon) { font-size: 10.5px; }
.nav-icon { position: relative; }
.nav-badge { position: absolute; top: -3px; right: -6px; min-width: 8px; height: 8px; border-radius: 50%; background: var(--crimson); }

/* v5.49: athlete Progress + Profile readability + Trends/Testing toggle branding */
/* Progress stats tile: dark numbers on the white tile (were white = invisible) */
.prof-id-tile .ph2-n { color: var(--text) !important; }
.prof-id-tile .ph2-l { color: var(--text-mute) !important; }
/* Profile hero name/sub on the light page */
.profile-hero2 .ph2-name { color: var(--navy) !important; }
.profile-hero2 .ph2-sub { color: var(--text-mute) !important; }
/* Trends / Testing toggle — light branded, navy-light selected */
.perf-toggle { background: var(--lane-light) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; border: 1px solid var(--border) !important; }
.perf-toggle .cvt { color: var(--navy) !important; }
.perf-toggle .cvt.active { background: var(--shell-light) !important; color: #fff !important; }

/* v5.50: Progress page — kebab header + week ring relocated to body (readable on light) */
.prog-week { display: flex; align-items: center; gap: 12px; margin: 2px 2px 14px; }
.prog-week .wk-ring-num { color: var(--navy) !important; }
.prog-week .wk-ring-label { color: var(--text-mute) !important; }
.prog-week .wk-ring svg circle:first-child { stroke: rgba(var(--navy-rgb),0.12) !important; }
.prog-week-l { font-size: 14px; color: var(--text-mute); }

/* v5.50: class board note (sharing now controlled in Settings) */
.cb-note { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius-md, 14px); padding: 14px 16px; font-size: 14px; line-height: 1.45; color: var(--text-mute); margin-bottom: 16px; box-shadow: 0 1px 3px rgba(17,25,45,.05); }
.cb-note b { color: var(--text); }

/* v5.53: Home leaderboard — ranked cards with photo + per-goal projections */
.home-lead-list { display: flex; flex-direction: column; gap: 10px; }
/* v5.66: home leaderboard = stacked card + peek (like Up next) with a vertical
   dash rail on the left; swipe up/down or tap the peek/rail to move through top 5 */
.home-lead-section { display: flex; gap: 12px; align-items: stretch; }
.home-lead-rail { display: flex; flex-direction: column; justify-content: center; gap: 7px; flex: 0 0 auto; }
.home-lead-seg { width: 3px; height: 18px; border-radius: 2px; border: 0; padding: 0; background: #b7c0d0; cursor: pointer; transition: background .15s ease, height .15s ease; }
.home-lead-seg.on { background: var(--crimson); height: 28px; }
.home-lead-stack { position: relative; flex: 1; min-width: 0; padding-bottom: 34px; touch-action: pan-x; overflow-y: clip; }
.home-lead-front { position: relative; z-index: 2; transition: opacity .18s ease, transform .18s ease; }
.home-lead-peek { position: absolute; left: 10px; right: 10px; bottom: 0; z-index: 1; display: flex; align-items: center; gap: 8px; background: var(--shell-light); border-radius: var(--radius-md); padding: 9px 14px 18px; cursor: pointer; }
.home-lead-peek .cb-av { width: 22px; height: 22px; flex: 0 0 auto; }
.home-lead-peek .home-peek-eb { font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: #9fb0cc; }
.home-lead-peek .home-peek-title { font-size: 13px; font-weight: 600; color: #fff; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.home-lead-card { background: var(--card); border: 0.5px solid var(--border); border-radius: var(--radius-md); padding: 12px 14px; box-shadow: var(--shadow-sm); }
.hlc-top { display: flex; align-items: center; gap: 11px; }
.hlc-rank { width: 22px; height: 22px; flex: 0 0 auto; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--shell); color: #fff; font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums; }
.home-lead-card .cb-av-lg { width: 38px; height: 38px; flex: 0 0 auto; }
.hlc-name { flex: 1; min-width: 0; font-size: 15px; font-weight: 700; color: var(--navy); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hlc-goals { margin-top: 10px; padding-top: 10px; border-top: 0.5px solid var(--border-soft); display: flex; flex-direction: column; gap: 7px; }
.hlc-goal { display: flex; align-items: baseline; gap: 8px; }
.hlc-goal-ev { font-size: 12px; font-weight: 700; color: var(--text-mute); text-transform: uppercase; letter-spacing: .03em; width: 52px; flex: 0 0 auto; }
.hlc-goal-proj { font-size: 15px; font-weight: 700; color: var(--navy); font-variant-numeric: tabular-nums; flex: 1; }
.hlc-goal .cb-delta { font-size: 13px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.hlc-none { font-size: 12.5px; color: var(--text-mute); }
.home-lead-more-btn { display: block; width: 100%; margin-top: 10px; background: transparent; border: 0; text-align: center; font-size: 13.5px; font-weight: 600; color: var(--accent); padding: 8px; cursor: pointer; }
.home-lead-empty { font-size: 13.5px; line-height: 1.45; color: var(--text-mute); }
.home-lead-prompt { display: flex; align-items: center; gap: 12px; }
.home-lead-prompt .hlp-ic { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background: var(--lane-light); color: var(--navy); flex: 0 0 auto; }
.home-lead-prompt .hlp-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.home-lead-prompt .hlp-title { font-size: 15px; font-weight: 700; color: var(--navy); }
.home-lead-prompt .hlp-sub { font-size: 12.5px; color: var(--text-mute); line-height: 1.35; }
.hlp-cta-btn { flex: 0 0 auto; background: var(--shell-light); color: #fff; border: 0; border-radius: var(--radius-btn); font-size: 13px; font-weight: 600; padding: 9px 14px; cursor: pointer; white-space: nowrap; }
.hlp-cta-btn:active { transform: scale(0.97); }
.hlp-cta-btn:disabled { opacity: .6; }

/* v5.52: rebranded Profile — branded athlete identity card (Electric Lane + Kanit) */
.prof-body { padding-top: 20px; }
.prof-idcard {
  position: relative; overflow: hidden;
  background: linear-gradient(150deg, var(--shell-dark) 0%, var(--shell) 52%, var(--shell-light) 100%);
  border-radius: var(--radius-lg);
  padding: 18px 18px 20px;
  margin-bottom: 14px;
  box-shadow: 0 10px 28px rgba(17,25,45,.22);
}
/* Faint tiger-crest watermark bleeding off the top-right corner. */
.prof-idcard-watermark {
  position: absolute; top: -34px; right: -30px; width: 188px; height: 188px;
  background: var(--club-logo, none) center/contain no-repeat;
  opacity: .07; pointer-events: none;
  -webkit-mask-image: linear-gradient(225deg, #000 35%, transparent 78%);
  mask-image: linear-gradient(225deg, #000 35%, transparent 78%);
}
.prof-idcard-eyebrow {
  position: relative; font-family: var(--font-display); font-style: italic; text-transform: uppercase;
  font-size: 14.5px; font-weight: 700; letter-spacing: .1em; color: var(--accent); margin-bottom: 14px;
}
.prof-idcard .prof-idcard-eyebrow { margin-bottom: 3px; }
.pidc-gradeage { display: flex; gap: 26px; }
.prof-idcard-top { position: relative; display: flex; align-items: center; gap: 15px; }
.prof-idcard-av {
  width: 76px; height: 76px; border-radius: 50%; overflow: hidden; flex: 0 0 auto;
  border: 2.5px solid rgba(255,255,255,.18); box-shadow: 0 4px 14px rgba(0,0,0,.28);
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.14); color: #fff; font-weight: 700; font-size: 27px;
}
.prof-idcard-av img { width: 100%; height: 100%; object-fit: cover; }
.prof-idcard-id { min-width: 0; }
.prof-idcard-name {
  font-family: var(--font-display); font-style: italic; text-transform: uppercase;
  font-size: 25px; font-weight: 700; line-height: 1.08; letter-spacing: .005em; color: #fff;
  word-break: break-word;
}
.prof-idcard-sub { font-size: 13.5px; color: #C5D0EA; margin-top: 5px; }
.pidc-divider { height: 1px; background: rgba(255,255,255,.12); margin: 16px 0 14px; }
.pidc-group-lbl, .pidc-goals-lbl {
  font-size: 11px; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; color: #9fb0cc; margin-bottom: 6px;
}
.pidc-group { font-size: 16px; font-weight: 700; color: #fff; }
.pidc-goals-lbl { margin-top: 14px; }
.pidc-goals { display: flex; flex-wrap: wrap; gap: 8px; }
.pidc-goal {
  font-size: 13px; color: #fff; background: rgba(255,255,255,.09);
  border: 1px solid rgba(255,255,255,.16); border-radius: 999px; padding: 5px 12px;
}
.pidc-goal b { color: var(--accent); font-weight: 700; margin-right: 5px; }
/* Action buttons sit on the light canvas below the card. */
.prof-actions { margin: 0; }
.prof-actions .ph2-btn { border: 1.5px solid var(--crimson); color: var(--crimson-ink); background: transparent; }
.prof-actions .ph2-btn:active { background: rgba(var(--accent-rgb),.10); }

/* ── v5.53 Progress page ─────────────────────────────────────────────────── */
/* Item 5: larger week ring + class name as the heading. */
.prog-week-lg { gap: 14px; margin-bottom: 16px; }
.prog-week-lg .wk-ring-circle { width: 58px !important; height: 58px !important; }
.prog-week-lg .wk-ring-circle svg { width: 58px !important; height: 58px !important; }
.prog-week-lg .wk-ring-num { font-size: 20px !important; }
.prog-week-lg .wk-ring-label { font-size: 10.5px !important; }
.prog-week-lg .prog-week-l { font-family: var(--font-display); font-style: italic; text-transform: uppercase; font-weight: 700; font-size: 19px; letter-spacing: .01em; color: var(--navy) !important; line-height: 1.1; }

/* Item 6: clearer Trends / Testing segmented toggle (light page). */
.day-screen .perf-toggle { background: var(--lane-light) !important; border: 1px solid var(--border) !important; border-radius: 999px; padding: 4px; gap: 4px; margin: 0 0 16px; max-width: none; width: 100%; }
.day-screen .perf-toggle .cvt { flex: 1; font-size: 14.5px; font-weight: 600; padding: 10px 18px; border-radius: 999px; border: 0 !important; background: transparent !important; color: var(--text-mute) !important; }
.day-screen .perf-toggle .cvt.active { background: var(--shell) !important; color: #fff !important; box-shadow: 0 2px 8px rgba(17,25,45,.22); }

/* Item 7: readable Pace calculator button. */
.pace-calc-btn { display: flex; align-items: center; gap: 12px; width: 100%; background: var(--card); border: 0.5px solid var(--border); border-radius: var(--radius-md); padding: 13px 14px; margin-bottom: 14px; text-align: left; cursor: pointer; box-shadow: var(--shadow-sm); }
.pace-calc-btn:active { transform: scale(0.995); }
.pace-calc-ic { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; background: var(--lane-light); color: var(--navy); flex: 0 0 auto; }
.pace-calc-ic svg { width: 19px; height: 19px; }
.pace-calc-txt { flex: 1; min-width: 0; font-size: 15px; font-weight: 600; color: var(--navy); }
.pace-calc-chev { color: var(--text-mute); font-size: 20px; line-height: 1; }

/* Progress update tile (v5.120 approved layout): four equal centered columns
   sharing one label line + one value line so everything aligns horizontally;
   status word stacked over its delta; hairline, source chip, coach's read. */
.goalproj-tile { padding: 4px 14px 2px; }
.gp-row { display: grid; grid-template-columns: repeat(4, 1fr); align-items: start; padding: 14px 0 0; }
.gp-c { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 0 6px; border-left: 1px solid var(--border-soft); min-width: 0; }
.gp-c:first-child { border-left: 0; }
.gp-lbl { height: 15px; font-size: 10px; text-transform: uppercase; letter-spacing: .06em; font-weight: 700; color: var(--text-mute); line-height: 15px; }
.gp-vrow { height: 24px; display: flex; align-items: center; justify-content: center; }
.gp-ev { font-family: var(--font-display); font-style: italic; text-transform: uppercase; font-weight: 700; font-size: 16px; color: var(--navy); }
.gp-val { font-size: 16px; font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; }
.gp-val.gp-proj { color: var(--navy); }
.gp-word { height: 15px; line-height: 15px; font-size: 13px; font-weight: 700; text-transform: capitalize; }
.gp-delta { font-size: 12.5px; font-weight: 600; font-variant-numeric: tabular-nums; }
.gp-ok .gp-word, .gp-ok .gp-delta { color: var(--green); }
.gp-low .gp-word, .gp-low .gp-delta { color: var(--crimson-ink); }
.gp-hair { border-top: 1px solid var(--border-soft); margin: 11px 0 9px; }
.gp-srcline { margin: 0 2px; }
.gp-srcchip { display: inline-block; font-size: 12px; font-weight: 700; color: var(--navy); background: var(--border-soft); border-radius: 7px; padding: 3px 10px; }
.gp-read { font-size: 13px; color: var(--text-soft); line-height: 1.5; margin: 6px 2px 14px; }
.gp-sep { height: 1px; background: var(--border-soft); }
.gp-row-na { color: var(--text-mute); padding-bottom: 14px; }
.gp-na { grid-column: 2 / -1; align-self: center; font-size: 13px; color: var(--text-mute); }
.gp-empty { font-size: 13.5px; color: var(--text-mute); padding: 10px 0; }

/* ── v5.53 Item 2: Edit profile — branded, readable Light Canvas form ──────── */
.onb-edit { background: var(--lane-light); min-height: 100vh; }
.onb-edit .onb-head { color: var(--navy); padding-top: calc(20px + var(--safe-top)); }
.onb-edit .onb-back { color: var(--navy); font-weight: 600; }
.onb-edit .onb-title { font-family: var(--font-display); font-style: italic; text-transform: uppercase; font-weight: 700; font-size: 24px; letter-spacing: .01em; color: var(--navy); }
.onb-edit .onb-sub { color: var(--text-mute); }
.onb-edit .onb-card { background: var(--card); border: 0.5px solid var(--border); box-shadow: var(--shadow-sm); }
.onb-edit .onb-card .auth-label, .onb-edit .onb-card .auth-hint { color: var(--text-mute); }
.onb-edit .onb-card .auth-input, .onb-edit .onb-card .onb-select { background: var(--card); border: 1px solid var(--border); color: var(--text); }
.onb-edit .onb-card .auth-input::placeholder { color: var(--text-mute); }
.onb-edit .onb-card .auth-input:focus, .onb-edit .onb-card .onb-select:focus { border-color: var(--navy-light); }
.onb-edit .onb-card .onb-photo-label { color: var(--text-mute); }
.onb-edit .onb-card .btn-primary { background: var(--shell); border-color: var(--shell); color: #fff; }
.onb-edit .onb-card .btn-primary:active { background: var(--shell-dark); }
.onb-edit .onb-card .auth-link, .onb-edit .onb-card .onb-cancel { color: var(--navy-light); }
.onb-edit .onb-card .ac-list, .onb-edit .onb-card .fcal { background: var(--card); border-color: var(--border); box-shadow: 0 12px 30px rgba(17,25,45,.18); }
.onb-edit .onb-card .ac-n, .onb-edit .onb-card .fcal-t { color: var(--text); }
.onb-edit .onb-card .ac-c { color: var(--text-mute); }
.onb-edit .onb-card .ac-opt:hover, .onb-edit .onb-card .ac-opt:focus { background: var(--lane-light); }
.onb-edit .onb-card .fcal-t:hover { background: var(--lane-light); }

/* ── v5.54 ───────────────────────────────────────────────────────────────── */
/* Item 2: Pace calculator target card — readable, branded (overrides the
   light-canvas blanket that forced dark text onto the navy card). */
.pc-result { color: #fff !important; }
.pc-result-eyebrow { color: var(--accent) !important; opacity: 1; font-family: var(--font-display); font-style: italic; text-transform: uppercase; letter-spacing: .12em; font-weight: 700; font-size: 12px; }
.pc-result-time { color: #fff !important; font-weight: 700; }
.pc-result-sub { color: #C5D0EA !important; opacity: 1; font-weight: 600; }

/* Item 4: Profile action row — icon over label, divided segments (like example). */
.prof-acts { display: flex; background: var(--card); border: 0.5px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-sm); overflow: hidden; margin-bottom: 14px; }
.prof-act { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 7px; padding: 16px 8px; background: transparent; border: 0; cursor: pointer; position: relative; }
.prof-act + .prof-act { border-left: 0.5px solid var(--border); }
.prof-act:active { background: var(--lane-light); }
.prof-act-ic { color: var(--navy); line-height: 0; }
.prof-act-l { font-size: 13px; font-weight: 600; color: var(--navy); }

/* ── v5.55 ───────────────────────────────────────────────────────────────── */
/* Item 3: bolder Progress stat numbers (Sessions / Weeks active / Tests done). */
.prof-id-tile .ph2-n { font-family: var(--font-display); font-style: italic; font-weight: 700; font-size: 26px; color: var(--navy) !important; letter-spacing: .01em; }
.prof-id-tile .ph2-n-sub { font-style: normal; font-size: 13px; }
.prof-id-tile .ph2-l { font-weight: 600; }

/* Item 1: Nike-style profile list rows (Inbox, Achievements). */
.prof-list { margin-top: 4px; }
.prof-list-row { display: flex; align-items: center; gap: 12px; width: 100%; background: transparent; border: 0; border-top: 0.5px solid var(--border); padding: 16px 4px; text-align: left; cursor: pointer; }
.prof-list-row:last-child { border-bottom: 0.5px solid var(--border); }
.prof-list-row:active:not(.is-inactive) { background: var(--lane-light); }
.prof-list-text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.prof-list-title { font-size: 19px; font-weight: 700; color: var(--navy); line-height: 1.1; }
.prof-list-sub { font-size: 14px; color: var(--text-mute); }
.prof-list-chev { color: var(--text-mute); font-size: 22px; line-height: 1; flex: 0 0 auto; }
.prof-list-badge { flex: 0 0 auto; min-width: 22px; height: 22px; padding: 0 6px; display: inline-flex; align-items: center; justify-content: center; background: var(--crimson); color: #fff; border-radius: 999px; font-size: 12px; font-weight: 700; }
.prof-list-row.is-inactive { cursor: default; }
.prof-list-row.is-inactive .prof-list-title { color: var(--text-mute); }

/* Item 2c: session congratulations card. */
.congrats-card { text-align: center; background: linear-gradient(150deg, var(--shell-dark) 0%, var(--shell) 55%, var(--shell-light) 100%); border: 0; color: #fff; padding: 20px 16px; }
.congrats-emoji { font-size: 30px; line-height: 1; }
.congrats-title { font-family: var(--font-display); font-style: italic; text-transform: uppercase; font-weight: 700; font-size: 21px; color: #fff; margin-top: 8px; }
.congrats-sub { font-size: 13.5px; color: #C5D0EA; margin-top: 4px; }
.congrats-lines { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 8px; margin-top: 12px; }
.congrats-line { font-size: 12.5px; font-weight: 600; color: #fff; background: rgba(255,255,255,.10); border: 1px solid rgba(255,255,255,.16); border-radius: 999px; padding: 5px 11px; }
.congrats-share { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; background: var(--card); color: var(--navy); border: 0; border-radius: var(--radius-btn); font-size: 14px; font-weight: 700; padding: 10px 18px; cursor: pointer; }
.congrats-share:active { transform: scale(0.98); }

/* Item 2d: per-day session summaries on Progress. */
.day-sum-list { display: flex; flex-direction: column; }
.day-sum-row { display: flex; align-items: center; gap: 10px; width: 100%; background: var(--card); border: 0.5px solid var(--border); border-radius: var(--radius-md); padding: 12px 14px; margin-bottom: 8px; text-align: left; cursor: pointer; box-shadow: var(--shadow-sm); }
.day-sum-row:active { background: var(--lane-light); }
.day-sum-date { flex: 0 0 auto; font-size: 13px; font-weight: 700; color: var(--navy); min-width: 92px; }
.day-sum-lines { flex: 1; min-width: 0; font-size: 12.5px; color: var(--text-mute); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.day-sum-chev { color: var(--text-mute); font-size: 18px; line-height: 1; flex: 0 0 auto; }

/* ── v5.57 ───────────────────────────────────────────────────────────────── */
/* Item 1: 4-up profile action row + footer. */
.prof-acts-4 .prof-act { padding: 14px 4px; }
.prof-acts-4 .prof-act-l { font-size: 11.5px; }
.prof-foot { text-align: center; font-size: 12px; color: var(--text-mute); margin: 18px 0 6px; }

/* Item 2: peer sheet readable on the light bottom sheet + branded name. */
.par-sheet.sheet-light .par-sheet-sub { color: var(--text-mute); }
.par-sheet.sheet-light .cb-sheet-name { color: var(--navy); font-family: var(--font-display); font-style: italic; text-transform: uppercase; font-weight: 700; }
.par-sheet.sheet-light .cb-sheet-sub { color: var(--text-mute); }
.par-sheet.sheet-light .cb-best { color: var(--text); }
.par-sheet.sheet-light .cb-sheet-head { display: flex; align-items: center; gap: 14px; margin-bottom: 12px; }

/* Item 3: branded "Share a card" option cards. */
.share-opt { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; background: var(--card); border: 0.5px solid var(--border); border-radius: var(--radius-md); padding: 14px; margin-bottom: 10px; cursor: pointer; }
.share-opt:active { background: var(--lane-light); }
.share-opt:disabled { opacity: .55; cursor: default; }
.share-opt-ic { width: 40px; height: 40px; border-radius: 50%; background: var(--lane-light); color: var(--navy); display: flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.share-opt-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.share-opt-title { font-size: 15px; font-weight: 700; color: var(--navy); }
.share-opt-sub { font-size: 12.5px; color: var(--text-mute); line-height: 1.35; }

/* Item 5: cleaner testing cards with inline entry. */
.tcard { background: var(--card); border: 0.5px solid var(--border); border-radius: var(--radius-md); padding: 14px; margin-bottom: 12px; box-shadow: var(--shadow-sm); }
.tcard-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.tcard-name { font-size: 17px; font-weight: 700; color: var(--navy); }
.tcard-enter { background: var(--lane-light); color: var(--navy); border: 0; border-radius: 999px; font-size: 12.5px; font-weight: 700; padding: 6px 13px; cursor: pointer; white-space: nowrap; }
.tcard-enter:active { background: #e2e7f0; }
.tcells { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.tcell { display: flex; flex-direction: column; align-items: center; gap: 6px; background: var(--lane-light); border: 1px solid transparent; border-radius: 10px; padding: 12px 6px; text-align: center; }
.tcell-lbl { font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--text-mute); }
.tcell-val { font-size: 17px; font-weight: 700; color: var(--navy); font-variant-numeric: tabular-nums; }
.tcell-empty .tcell-val { color: var(--text-mute); font-weight: 600; }
.tcell-logged { cursor: pointer; }
.tcell-logged:active { background: #e2e7f0; }
.tcell-active { background: var(--card); border-color: var(--navy-light); box-shadow: 0 0 0 2px rgba(var(--navy-light-rgb),.12); }
.tcell-input { width: 100%; border: 0; background: transparent; text-align: center; font-size: 17px; font-weight: 700; color: var(--navy); font-variant-numeric: tabular-nums; padding: 0; }
.tcell-input:focus { outline: none; }
.tcell-input::placeholder { color: var(--text-mute); font-weight: 600; }

/* Item 4: compact coach Edit-workout rows (one line + Details expander). */
.pe-compact { gap: 0 !important; }
.pe-rowline { display: flex; align-items: center; gap: 6px; }
.pe-rowline .pe-bin { flex: 1; min-width: 0; width: 0; border: 1px solid var(--border); border-radius: 6px; padding: 10px 6px; font-size: 14px; text-align: center; color: var(--text); background: var(--card); box-sizing: border-box; min-height: 0; }
.pe-rowline .pe-bin::placeholder { color: var(--text-mute); }
.pe-rowline .pe-bin-wide { flex: 2.4; text-align: left; }
.pe-bin-sel { flex: 1.4; min-width: 0; display: flex; }
.pe-rowline .pe-bin-sel select.pe-in { flex: 1; min-width: 0; width: 100%; padding: 10px 6px !important; font-size: 14px !important; min-height: 0 !important; text-align: center; border-radius: 6px !important; }
.pe-bx { font-size: 11px; color: var(--text-mute); font-weight: 600; white-space: nowrap; flex: 0 0 auto; }
.pe-details-btn { flex: 0 0 auto; background: var(--lane-light); border: 0; color: var(--navy); font-size: 12px; font-weight: 700; border-radius: 6px; padding: 9px 11px; cursor: pointer; }
.pe-details-btn.open { background: var(--shell); color: #fff; }
.pe-details { margin-top: 12px; display: flex; flex-direction: column; gap: 12px; }
.pe-compact .pe-blockfoot { justify-content: space-between; align-items: center; gap: 10px; }

/* ── v5.59: bolder pace-calculator target time (Kanit, smaller decimal) ────── */
.pc-result-time { font-family: var(--font-display); font-style: italic; font-weight: 700 !important; font-size: 56px; letter-spacing: .005em; line-height: 1.02; }
.pc-result-time .pc-dec { font-size: 0.5em; font-weight: 700; }

/* ── v5.60 ───────────────────────────────────────────────────────────────── */
/* Recovery / rest day — Light Canvas, matching every other athlete page. */
.rest-screen { min-height: 100vh; background: var(--lane-light); color: var(--text); }
.rest-screen .app-header { background: var(--shell); }
.rest-screen .section-label { color: var(--text-mute); }
/* Up-next + core-circuit tiles: fully rounded white cards (drop the left accent bar). */
.rest-screen .card.accent-crimson, .rest-screen .card.accent-green,
.rest-screen .card.accent-steel, .rest-screen .card.accent-navy {
  border: 0.5px solid var(--border); border-left: 0.5px solid var(--border); border-radius: var(--radius-lg);
}

/* v5.62: week ring back in the header, right after the title. */
.ah-lead { display: flex; align-items: center; gap: 14px; min-width: 0; }
.app-header .ah-lead .wk-ring { gap: 0; }
.app-header .wk-ring-num { color: #fff !important; }
.app-header .wk-ring-label { color: #aab8d4 !important; }
.prog-class { margin: 2px 2px 12px; }

/* v5.62: Messages back in the 3-dot menu (unread pill) + Events month calendar */
.cm-row-badge { margin-left: auto; min-width: 20px; height: 20px; padding: 0 6px; display: inline-flex; align-items: center; justify-content: center; background: var(--crimson); color: #fff; border-radius: 999px; font-size: 12px; font-weight: 700; }
.ev-cal-nav { display: flex; align-items: center; justify-content: space-between; margin-bottom: 4px; }
.ev-cal-nav .cal-wk-arrow { color: var(--navy); font-size: 20px; padding: 4px 8px; }
.ev-cal-title { font-family: var(--font-display); font-style: italic; text-transform: uppercase; font-weight: 700; font-size: 15px; letter-spacing: .01em; color: var(--navy); }

/* v5.64: core circuit — per-exercise check-off + editable sets × reps */
.abs-exlist { display: flex; flex-direction: column; margin: 6px 0 2px; }
.abs-ex { display: flex; align-items: center; gap: 12px; padding: 9px 0; border-bottom: 0.5px solid var(--border-soft); }
.abs-ex:last-child { border-bottom: 0; }
.abs-check { flex: 0 0 auto; width: 26px; height: 26px; border-radius: 50%; border: 2px solid var(--border); background: var(--card); color: #fff; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; padding: 0; }
.abs-check svg { opacity: 0; }
.abs-ex.done .abs-check { background: var(--shell-light); border-color: var(--shell-light); }
.abs-ex.done .abs-check svg { opacity: 1; }
.abs-ex-name { flex: 1; min-width: 0; font-size: 15px; color: var(--text); }
.abs-ex.done .abs-ex-name { color: var(--text-mute); text-decoration: line-through; }
.abs-ex-log { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; }
.abs-in { width: 42px; text-align: center; border: 1px solid var(--border); border-radius: 6px; padding: 6px 4px; font-size: 14px; font-weight: 600; color: var(--text); background: var(--card); box-sizing: border-box; min-height: 0; }
.abs-in-reps { width: 54px; }
.abs-in:focus { outline: none; border-color: var(--navy-light); }
.abs-x { font-size: 12px; color: var(--text-mute); }
.abs-hint { font-size: 12px; color: var(--text-mute); line-height: 1.4; margin-top: 12px; }

/* v5.65: home calendar date range centered + coach-side font size */
.home-cal-header .home-cal-head { justify-content: center; }
.home-cal-header .cal-week-nav { gap: 14px; }
.home-cal-header .cal-week-label { font-size: 16px; font-weight: 800; }

/* v5.65: coach message on the athlete home scrolls as a marquee */
.home-note-body { overflow: hidden; white-space: nowrap; }
.home-note-body .marquee-track { display: inline-block; padding-left: 100%; animation: ftMarquee 18s linear infinite; }
/* v5.120 approved ticker: first thing on home, no tag, bold caps, no crimson
   strip. Short messages sit centered (no scroll); long ones loop seamlessly at
   a steady speed (duration set from text length in renderHome). */
.home-note-ticker { border-left: 1px solid var(--border); }
.home-note-ticker .home-note-body { font-weight: 700; color: var(--navy); text-transform: uppercase; letter-spacing: .02em; }
.home-note-ticker .marquee-track { padding-left: 0; animation: none; }
.home-note-ticker .marquee-track.mq-static { display: block; text-align: center; }
.home-note-ticker .mq-copy { padding-right: 56px; }
@keyframes ftMarqueeLoop { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
  .home-note-ticker .marquee-track { animation: none !important; }
}
@keyframes ftMarquee { from { transform: translateX(0); } to { transform: translateX(-100%); } }
@media (prefers-reduced-motion: reduce) {
  .home-note-body { white-space: normal; }
  .home-note-body .marquee-track { padding-left: 0; animation: none; }
}

/* Branded home leaderboard cards (navy gradient + tiger, equal height, white text). */
.home-lead-card.hlc-branded { position: relative; overflow: hidden; border: 0;
  background: linear-gradient(150deg, var(--shell-dark) 0%, var(--shell) 55%, var(--shell-light) 100%);
  box-shadow: 0 8px 22px rgba(17,25,45,.20); }
.hlc-watermark { position: absolute; top: -26px; right: -24px; width: 150px; height: 150px;
  background: var(--club-logo, none) center/contain no-repeat; opacity: .06; pointer-events: none;
  -webkit-mask-image: linear-gradient(225deg,#000 35%,transparent 78%); mask-image: linear-gradient(225deg,#000 35%,transparent 78%); }
.hlc-branded .hlc-top { position: relative; }
.hlc-branded .hlc-name { color: #fff; }
.hlc-branded .cb-av-lg { border: 2px solid rgba(255,255,255,.18); }
.hlc-branded .hlc-goals { position: relative; border-top-color: rgba(255,255,255,.14); min-height: 78px; }
.hlc-branded .hlc-goal-ev { color: #9fb0cc; }
.hlc-branded .hlc-goal-proj { color: #fff; }
.hlc-branded .cb-delta.ok { color: #46C7B3; }
.hlc-branded .cb-delta.low { color: #FF9B9B; }
.hlc-branded .hlc-none { color: #9fb0cc; }

/* ── v5.61: follow system ─────────────────────────────────────────────────── */
/* Labeled leaderboard goal rows (Goal / Proj / Gap). */
.hlc-tappable { cursor: pointer; }
.hlc-tappable:active { transform: scale(.995); }
.hlc-chev { margin-left: auto; color: rgba(255,255,255,.5); font-size: 22px; line-height: 1; }
.hlc-ghead, .hlc-grow { display: grid; grid-template-columns: repeat(4, 1fr); align-items: center; }
.hlc-ghead { font-size: 10px; text-transform: uppercase; letter-spacing: .04em; color: #8593b0; padding-bottom: 4px; }
.hlc-ghead span, .hlc-grow > * { padding: 0 6px; text-align: center; }
.hlc-ghead span:first-child, .hlc-grow > *:first-child { padding-left: 6px; }
.hlc-ghead span:nth-child(n+2), .hlc-grow > *:nth-child(n+2) { border-left: 1px solid rgba(255,255,255,.14); }
.hlc-grow { padding: 5px 0; }
.hlc-grow .hlc-ev { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: #9fb0cc; }
.hlc-grow .hlc-gv { font-size: 14.5px; font-weight: 700; color: #fff; font-variant-numeric: tabular-nums; }
.hlc-grow .cb-delta { font-size: 13px; }

/* Follow list + requests (light Class progress page). */
.fl-row { display: flex; align-items: center; gap: 12px; background: var(--card); border: 0.5px solid var(--border); border-radius: var(--radius-md); padding: 12px 14px; margin-bottom: 8px; box-shadow: var(--shadow-sm); }
.fl-row .cb-av-lg { width: 44px; height: 44px; flex: 0 0 auto; }
.fl-id { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.fl-name { font-size: 15px; font-weight: 700; color: var(--navy); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fl-sub { font-size: 12.5px; color: var(--text-mute); }
.fl-acts { display: flex; gap: 8px; flex: 0 0 auto; }
.fl-yes { background: var(--shell); color: #fff; border: 0; border-radius: var(--radius-btn); font-size: 13px; font-weight: 700; padding: 8px 12px; cursor: pointer; }
.fl-no { background: transparent; color: var(--text-mute); border: 1px solid var(--border); border-radius: var(--radius-btn); font-size: 13px; font-weight: 600; padding: 8px 12px; cursor: pointer; }
.fl-btn { flex: 0 0 auto; background: var(--shell-light); color: #fff; border: 0; border-radius: 999px; font-size: 13px; font-weight: 700; padding: 8px 16px; cursor: pointer; }
.fl-btn.is-pending { background: var(--lane-light); color: var(--text-mute); }
.fl-btn.is-following { background: var(--card); color: var(--navy); border: 1.5px solid var(--navy-light); }
.fl-btn:disabled { cursor: default; }

/* Peer sheet: locked-info note for non-followers. */
.cb-follow-note { background: var(--lane-light); border-radius: var(--radius-md); padding: 14px 16px; font-size: 13.5px; line-height: 1.45; color: var(--text-mute); margin-top: 8px; }

/* Profile Following / Followers counts. */
.prof-follow { display: flex; gap: 10px; margin-bottom: 14px; }
.pf-stat { flex: 1; background: var(--card); border: 0.5px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-sm); padding: 12px 14px; display: flex; flex-direction: column; gap: 2px; }
.pf-l { font-size: 12px; color: var(--text-mute); font-weight: 600; }
.pf-n { font-family: var(--font-display); font-style: italic; font-weight: 700; font-size: 24px; color: var(--navy); }

/* v5.62: restored Up-next stack tiles — crisp white on the light home canvas */
.home-screen .home-tile { background: var(--card); border: 0.5px solid var(--border); box-shadow: 0 6px 18px rgba(17,25,45,.10); -webkit-backdrop-filter: none; backdrop-filter: none; }
.home-screen .home-peek { background: var(--card); border: 0.5px solid var(--border); -webkit-backdrop-filter: none; backdrop-filter: none; }

/* v5.72: weather + heat index as two swipeable tiles (like the leaderboard
   stack) with an animated backdrop reflecting the current conditions. */
.wx-wrap { margin: 0 0 2px; }
.wx-wrap[hidden] { display: none; }
.wx-loading-card { background: var(--card); border: 0.5px solid var(--border); border-radius: var(--radius-lg); box-shadow: 0 6px 18px rgba(17,25,45,.08); padding: 16px; color: var(--text-mute); font-size: 13px; }

.wx-section { display: flex; gap: 12px; }
.wx-rail { flex: none; display: flex; flex-direction: column; justify-content: center; gap: 8px; }
.wx-seg { width: 3px; height: 20px; border-radius: 2px; background: #b7c0d0; border: 0; padding: 0; cursor: pointer; }
.wx-seg.on { background: var(--crimson); height: 30px; }
.wx-stack { position: relative; flex: 1; min-width: 0; padding-bottom: 28px; touch-action: pan-x; }
.wx-peek { position: absolute; left: 12px; right: 12px; bottom: 0; background: var(--shell-light); border-radius: 14px; padding: 8px 14px 15px; }
.wx-peek-eb { font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: #cdd7ea; }
.wx-front { position: relative; z-index: 2; }

.wx-tile { position: relative; overflow: hidden; border-radius: var(--radius-lg); min-height: 96px; box-shadow: 0 8px 22px rgba(17,25,45,.16); color: #fff; }
.wx-tile-in { position: relative; z-index: 3; padding: 14px 16px 15px; }
/* Meteocons fill icon, top-right of the weather tile (gradient shows behind) */
.wx-ico { position: absolute; top: 4px; right: 4px; width: 94px; height: 94px; z-index: 2; pointer-events: none; }
.wx-eb { font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; opacity: .9; }
.wx-temp { font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: 38px; line-height: 1; margin-top: 3px; text-shadow: 0 1px 6px rgba(0,0,0,.18); }
.wx-cond { font-size: 14px; font-weight: 700; margin-top: 2px; }
.wx-facts { font-size: 12px; opacity: .9; margin-top: 5px; }
.wx-heat-row { display: flex; align-items: center; gap: 10px; margin-top: 3px; }
.wx-tile-heat .wx-temp { font-size: 32px; }
.wx-band { flex: none; background: rgba(255,255,255,.22); border-radius: 999px; padding: 4px 10px; font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .4px; color: #fff; }
.wx-msg { font-size: 12.5px; line-height: 1.4; margin-top: 8px; opacity: .97; }

/* condition gradients */
.wx-bg { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.wx-k-sun   { background: linear-gradient(135deg, #2f6fd0 0%, #4aa3df 55%, #f4c266 135%); }
.wx-k-cloud { background: linear-gradient(135deg, #51607a 0%, #7b899f 100%); }
.wx-k-rain  { background: linear-gradient(135deg, #263a5c 0%, #3d5a80 100%); }
.wx-k-snow  { background: linear-gradient(135deg, #58698a 0%, #8fa4c0 100%); }
.wx-k-fog   { background: linear-gradient(135deg, #6a7688 0%, #97a3b4 100%); }
.wx-tile-heat { background: var(--wx); }
.wx-bg-heat { background: linear-gradient(135deg, rgba(255,255,255,.12), rgba(0,0,0,.14)); }

/* sun: glowing orb + slowly rotating rays */
.wx-sun-orb  { top: -18px; right: -12px; left: auto; bottom: auto; width: 84px; height: 84px; border-radius: 50%; background: radial-gradient(circle, #fff4cd 0%, #ffd766 45%, rgba(255,215,102,0) 70%); z-index: 2; }
.wx-sun-rays { top: -42px; right: -36px; left: auto; bottom: auto; width: 150px; height: 150px; border-radius: 50%; background: conic-gradient(from 0deg, rgba(255,240,190,.55) 0 7deg, transparent 7deg 45deg); animation: wxSpin 32s linear infinite; opacity: .5; }
/* clouds: drifting blobs */
.wx-cloud   { border-radius: 50%; background: rgba(255,255,255,.16); }
.wx-cloud-a { width: 120px; height: 62px; top: -10px; right: -22px; left: auto; bottom: auto; animation: wxDrift 22s ease-in-out infinite alternate; }
.wx-cloud-b { width: 84px; height: 46px; bottom: -16px; left: -12px; right: auto; top: auto; background: rgba(255,255,255,.10); animation: wxDrift 28s ease-in-out infinite alternate-reverse; }
/* rain / snow / fog / flash */
.wx-rain-layer { background-image: repeating-linear-gradient(108deg, rgba(255,255,255,.22) 0 1px, transparent 1px 9px); background-size: auto 62px; animation: wxRain .75s linear infinite; }
.wx-snow-layer { background-image: radial-gradient(rgba(255,255,255,.75) 1.4px, transparent 1.7px); background-size: 26px 26px; animation: wxSnow 5s linear infinite; }
.wx-fog-layer  { background: repeating-linear-gradient(180deg, rgba(255,255,255,.10) 0 6px, transparent 6px 14px); }
.wx-flash { background: rgba(255,255,255,.6); opacity: 0; z-index: 2; animation: wxFlash 6.5s ease-in-out infinite; }

@keyframes wxSpin  { to { transform: rotate(360deg); } }
@keyframes wxDrift { from { transform: translateX(-9px); } to { transform: translateX(11px); } }
@keyframes wxRain  { to { background-position: -14px 62px; } }
@keyframes wxSnow  { to { background-position: 7px 26px; } }
@keyframes wxFlash { 0%,90%,100% { opacity: 0; } 92% { opacity: .5; } 94% { opacity: 0; } 96% { opacity: .32; } }
@media (prefers-reduced-motion: reduce) {
  .wx-sun-rays, .wx-cloud-a, .wx-cloud-b, .wx-rain-layer, .wx-snow-layer, .wx-flash { animation: none; }
}

.wx-why { display: flex; align-items: flex-start; gap: 8px; margin: 10px 2px 0; }
.wx-why-ic { flex: none; width: 15px; height: 15px; color: var(--text-mute); margin-top: 1px; }
.wx-why-ic svg { width: 15px; height: 15px; }
.wx-why-t { flex: 1 1 auto; font-size: 11.5px; line-height: 1.4; color: var(--text-mute); }
.wx-why-x { flex: none; background: none; border: 0; color: var(--text-mute); font-size: 18px; line-height: 1; padding: 0 2px; cursor: pointer; }

/* v5.73: Events page — meet-focused calendar (Direction D) */
.ev-count { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; width: 100%; text-align: left; position: relative; background: linear-gradient(135deg, var(--shell), var(--shell-light)); color: #fff; border: 0; border-radius: 14px; padding: 15px 16px; box-shadow: 0 8px 20px rgba(17,25,45,.16); cursor: pointer; }
.ev-count:active { transform: scale(0.99); }
.evc-k { font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; opacity: .85; }
.evc-name { font-family: var(--font-display); font-style: italic; text-transform: uppercase; font-weight: 800; font-size: 22px; line-height: 1.05; margin-top: 3px; }
.evc-when { font-size: 12.5px; opacity: .9; margin-top: 3px; padding-right: 20px; }
.evc-chev { position: absolute; right: 14px; top: 50%; transform: translateY(-50%); font-size: 22px; opacity: .6; }
.ev-count-none, .ev-count-load { background: var(--card); color: var(--text-mute); box-shadow: none; border: 0.5px solid var(--border); font-size: 13px; cursor: default; }
.ev-count-none .evc-k { color: var(--text-mute); }
.ev-count-none .evc-name-sm { font-size: 14px; color: var(--navy); font-weight: 600; margin-top: 2px; }

/* meet day = filled crimson pill; training dots muted so meets read first */
.ev-meetfocus .mg-cell.mg-meet .mg-n { background: var(--crimson); color: #fff; width: 26px; height: 26px; line-height: 26px; border-radius: 50%; margin: 0 auto; font-weight: 700; }
.ev-meetfocus .mg-cell.mg-meet .mg-dot { visibility: hidden; }
.ev-meetfocus .mg-dot.done, .ev-meetfocus .mg-dot.sched, .ev-meetfocus .mg-dot.miss { background: #b7c0d0; }
.ev-meetfocus .mg-legend { display: none; }
.ev-legend { display: flex; gap: 14px; justify-content: center; margin-top: 12px; font-size: 10.5px; color: var(--text-mute); }
.ev-legend .evl { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 4px; vertical-align: middle; }
.evl-meet { background: var(--crimson); }
.evl-train { background: #b7c0d0; }
.evl-test { background: var(--green); }

/* v5.74: meet results block inside the (dark) meet sheet */
.meet-results { margin-top: 14px; border-top: 0.5px solid rgba(255,255,255,.14); padding-top: 12px; }
.mr-head { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: #9fb0cc; margin-bottom: 10px; }
.mr-ath { margin-bottom: 12px; }
.mr-ath-name { font-size: 14px; font-weight: 700; color: #fff; margin-bottom: 3px; }
.mr-row { display: flex; align-items: center; gap: 10px; padding: 6px 0; border-bottom: 1px solid rgba(255,255,255,.08); }
.mr-row:last-child { border-bottom: 0; }
.mr-ev { flex: 0 0 76px; font-size: 13px; color: #cdd8e8; }
.mr-time { font-weight: 700; color: #fff; font-variant-numeric: tabular-nums; }
.mr-place { font-size: 12px; font-weight: 700; color: #E0B65A; }
.mr-del { margin-left: auto; background: none; border: 0; color: #8a93a6; font-size: 20px; line-height: 1; cursor: pointer; padding: 0 4px; }
.mr-empty { font-size: 13px; color: #9fb0cc; }
.mr-link { display: inline-block; margin-top: 10px; font-size: 13px; font-weight: 600; color: #7fb0ff; text-decoration: none; }

/* v5.76: meet sheet on the light theme — recolor the dark-tuned bits */
.par-sheet.sheet-light .sheet-eyebrow { color: var(--text-mute); }
.par-sheet.sheet-light .meet-sheet-meta { color: var(--text); }
.par-sheet.sheet-light .meet-sheet-notes { color: var(--text); }
.par-sheet.sheet-light .meet-map { border-color: var(--border); }
.par-sheet.sheet-light .btn-ghost { background: var(--lane-light); color: var(--navy); border: 0.5px solid var(--border); }
.par-sheet.sheet-light .btn-ghost.meet-del-btn { color: var(--crimson-ink); border-color: rgba(var(--accent-rgb),0.4); }
.par-sheet.sheet-light .meet-results { border-top-color: var(--border); }
.par-sheet.sheet-light .mr-head { color: var(--text-mute); }
.par-sheet.sheet-light .mr-ath-name { color: var(--navy); }
.par-sheet.sheet-light .mr-row { border-bottom-color: var(--border); }
.par-sheet.sheet-light .mr-ev { color: var(--text-mute); }
.par-sheet.sheet-light .mr-time { color: var(--navy); }
.par-sheet.sheet-light .mr-place { color: var(--crimson-ink); }
.par-sheet.sheet-light .mr-empty { color: var(--text-mute); }
.par-sheet.sheet-light .mr-label { color: var(--text-mute); }
.par-sheet.sheet-light .mr-status { color: var(--text-mute); }
.par-sheet.sheet-light .mr-del { color: var(--text-mute); }
.par-sheet.sheet-light .mr-add-toggle { color: var(--accent); }
.par-sheet.sheet-light .mr-link { color: var(--accent); }

/* v5.75: "results posted" home banner (dismissible) */
#home-results-banner:empty { display: none; }
.rb { display: flex; align-items: center; gap: 11px; background: var(--card); border: 0.5px solid var(--border); border-left: 4px solid var(--crimson); border-radius: 12px; padding: 11px 12px; box-shadow: 0 4px 14px rgba(17,25,45,.07); margin-bottom: 14px; }
.rb-ic { flex: none; width: 30px; height: 30px; color: var(--crimson-ink); display: flex; align-items: center; justify-content: center; }
.rb-ic svg { width: 25px; height: 25px; }
.rb-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.rb-t { font-weight: 800; font-size: 12px; color: var(--navy); text-transform: uppercase; letter-spacing: .04em; }
.rb-s { font-size: 12.5px; color: var(--text-mute); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rb-view { flex: none; background: var(--crimson); color: #fff; border: 0; border-radius: 999px; font-size: 12.5px; font-weight: 700; padding: 7px 15px; cursor: pointer; }
.rb-x { flex: none; background: none; border: 0; color: var(--text-mute); font-size: 20px; line-height: 1; padding: 0 2px; cursor: pointer; }
.mr-coach { margin-top: 14px; }
.mr-label { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: #9fb0cc; font-weight: 800; }
.mr-urlrow { display: flex; gap: 8px; margin: 6px 0 2px; }
.mr-urlrow .auth-input { flex: 1; min-width: 0; }
.mr-urlrow .btn-ghost { flex: none; padding: 0 16px; }
.mr-status { font-size: 12px; margin: 6px 0; min-height: 14px; color: #9fb0cc; }
.mr-status.err { color: #ff9aa5; }
.mr-status.ok { color: #5DCAA5; }
.mr-add-toggle { background: none; border: 0; color: #7fb0ff; font-size: 13px; font-weight: 600; padding: 4px 0; cursor: pointer; }
.mr-add { margin-top: 6px; }
.mr-add-row { display: flex; gap: 8px; margin: 6px 0; }
.mr-add-row .auth-input { min-width: 0; }

/* ─── Morning report (coach Today) ─────────────────────────────────────────
   Item 3: today's session per group, live logged/not-logged roster split,
   one-tap nudge, and the FTSummary week glance. */
.morn-refresh { background: none; border: 0; color: var(--navy-light); opacity: .65; padding: 6px; cursor: pointer; display: flex; align-items: center; }
.morn-refresh:disabled { opacity: .35; }
.morn-refresh.morn-spin svg { animation: morn-rot 0.9s linear infinite; }
@keyframes morn-rot { to { transform: rotate(360deg); } }
.morn-card { padding: 14px 14px 12px; }
.morn-sessions { display: flex; flex-direction: column; gap: 6px; }
.morn-sess { display: flex; align-items: baseline; gap: 10px; cursor: pointer; }
.morn-sess-grp { flex: 0 0 auto; font-family: var(--font-display, "Kanit"), -apple-system, Arial, sans-serif; font-weight: 800; font-style: italic; text-transform: uppercase; font-size: 12px; letter-spacing: .04em; color: var(--crimson-ink); min-width: 52px; }
.morn-sess-line { font-size: 14px; color: var(--navy); font-weight: 600; }
.morn-split { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); }
.morn-col-label { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: #5B6B7F; margin: 0 0 6px; }
.morn-col-n { display: inline-block; min-width: 18px; text-align: center; background: rgba(29,158,117,0.14); color: #1D9E75; border-radius: 9px; padding: 0 5px; font-size: 11px; margin-left: 4px; }
.morn-col-n-warn { background: rgba(var(--accent-rgb),0.12); color: var(--crimson-ink); }
.morn-chips { display: flex; flex-direction: column; gap: 6px; }
.morn-chip { display: flex; align-items: center; gap: 8px; background: var(--lane-light); border: 1px solid var(--border); border-radius: 10px; padding: 6px 8px; cursor: pointer; text-align: left; width: 100%; }
.morn-chip-av { flex: 0 0 auto; width: 26px; height: 26px; border-radius: 50%; overflow: hidden; background: var(--shell-light); color: #fff; font-size: 11px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.morn-chip-av img { width: 100%; height: 100%; object-fit: cover; }
.morn-chip-name { font-size: 13px; font-weight: 600; color: var(--navy); flex: 0 0 auto; }
.morn-chip-mark { font-size: 11px; color: #5B6B7F; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.morn-chip-not { background: var(--card); }
.morn-chip-out { opacity: .55; }
.morn-none { font-size: 13px; color: #5B6B7F; margin: 2px 0; }
.morn-nudge { margin-top: 12px; width: 100%; background: var(--shell-light); color: #fff; border: 0; border-radius: 10px; padding: 12px; font-size: 14px; font-weight: 600; cursor: pointer; }
.morn-nudge:active { opacity: .85; }
.morn-glance { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); }
.morn-g { font-size: 12.5px; color: #5B6B7F; }
.morn-g b { color: var(--navy); font-weight: 700; }
.morn-g-warn b { color: var(--crimson-ink); }
.morn-nudge-names { font-size: 14px; font-weight: 600; color: var(--navy); margin: 8px 0 6px; }
.morn-nudge-note { font-size: 12px; color: #5B6B7F; margin: 0; }
.morn-send { background: var(--shell-light); }  /* action = navy; crimson stays delete/logout only */

/* ─── Parent Settings pane (Profile › Settings) ────────────────────────────
   Mirrors the athlete Settings screen inside the parent home pane. */
.par-setl { margin: 0 -14px; }                     /* page-body pads 14px; let setl groups run edge to edge */
.par-setl-head { display: flex; align-items: center; gap: 4px; padding: 4px 10px 0; }
.par-setl-back { color: var(--navy); font-size: 30px; background: none; border: 0; padding: 2px 8px; cursor: pointer; line-height: 1; }
.par-setl-title { font-family: var(--font-display, "Kanit"), -apple-system, Arial, sans-serif; font-weight: 800; font-style: italic; text-transform: uppercase; font-size: 17px; color: var(--navy); }

/* ─── Edit workout: collapsible tiles + sticky save + rest chip ────────────
   Light theme — the screen sits on Light Canvas, so tiles mirror the athlete
   Today cards: white, bordered, navy Kanit titles, muted summaries. */
.pe-sec { background: var(--card); border: 0.5px solid var(--border); border-radius: 14px; overflow: hidden; }
.pe-sec-head { display: flex; align-items: center; gap: 8px; width: 100%; background: none; border: 0; padding: 15px 14px; cursor: pointer; text-align: left; }
.pe-sec-t { font-family: var(--font-display, "Kanit"), -apple-system, Arial, sans-serif; font-weight: 800; font-style: italic; text-transform: uppercase; font-size: 13px; letter-spacing: .03em; color: var(--navy); flex: 0 0 auto; }
.pe-sec-sum { flex: 1; min-width: 0; font-size: 12.5px; color: var(--text-mute); text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pe-sec-chev { flex: 0 0 auto; color: var(--text-mute); font-size: 14px; transition: transform .15s; }
.pe-sec.open .pe-sec-chev { transform: rotate(180deg); }
.pe-sec.open .pe-sec-sum { visibility: hidden; }        /* summary hides while editing — the fields are the truth */
.pe-sec-body { padding: 0 14px 14px; display: flex; flex-direction: column; gap: 12px; }
.pe-sec-body[hidden], .pe-details[hidden] { display: none !important; }   /* hidden must beat the flex display */
/* Uniform, readable cells inside the tiles */
.pe-sec .pe-in { min-height: 46px; font-size: 15px; padding: 11px 12px; }
.pe-sec select.pe-in { min-height: 46px; }
.pe-sec .pe-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.pe-sec .pe-grid3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; }
.pe-sec .pe-f > span { font-size: 11px; letter-spacing: .05em; }
.pe-rowline .pe-bin-sel { flex: 1.6; }                  /* distance select gets room to show "200m" */
.pe-core-note { font-size: 12px; color: var(--text-mute); }
.pe-savebar { position: sticky; bottom: 0; z-index: 5; margin: 4px -14px calc(-24px - env(safe-area-inset-bottom, 0px)); padding: 10px 14px calc(12px + env(safe-area-inset-bottom, 0px)); background: linear-gradient(180deg, rgba(238,240,245,0) 0%, var(--lane-light) 30%); display: flex; flex-direction: column; gap: 6px; }
.pe-savebar .pe-save { background: var(--shell-light); margin-top: 0; }   /* action = navy per button standard */
.pe-rest-chip { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 3px; background: var(--lane-light); border: 0.5px solid var(--border); color: var(--navy); border-radius: 999px; padding: 8px 10px; font-size: 12.5px; font-weight: 600; cursor: pointer; white-space: nowrap; }

/* ─── Weekly volume card: headline number + plain-language delta ──────────── */
.wr-headline { display: flex; align-items: baseline; gap: 10px; margin: 2px 0 6px; }
.wr-big { font-family: var(--font-display, "Kanit"), -apple-system, Arial, sans-serif; font-weight: 800; font-style: italic; font-size: 26px; line-height: 1; color: var(--navy); }
.coach-screen .wr-big { color: var(--navy); }
.wr-big .wr-grp-unit { font-size: 14px; font-style: normal; font-weight: 600; margin-left: 1px; }
.wr-delta { font-size: 12px; font-weight: 600; border-radius: 999px; padding: 3px 8px; }
.wr-d-up { background: rgba(29,158,117,0.14); color: #1D9E75; }
.wr-d-down { background: rgba(var(--navy-light-rgb),0.12); color: var(--navy-light); }
.wr-d-flat { background: rgba(127,143,166,0.16); color: #5B6B7F; }
.pe-sec .pe-block { background: var(--lane-light) !important; border: 0.5px solid var(--border) !important; }  /* block rows read as rows inside the white tile */

/* ─── Edit workout: labeled, uniform cells (v5.106 readability pass) ──────── */
.pe-cells { display: grid; gap: 10px; }
.pe-cells-3 { grid-template-columns: 1fr 1fr 1fr; }
.pe-cell { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.pe-cell > span { font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--text-mute); }
.pe-cell .pe-in, .pe-cell select.pe-in { width: 100%; min-height: 48px; font-size: 16px; padding: 11px 10px; text-align: center; border-radius: 10px; box-sizing: border-box; }
.pe-cell-name { grid-column: 1 / -1; }
.pe-cell-name .pe-in, .pe-cell-name select.pe-in { text-align: left; font-size: 15px; }
.pe-rowfoot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 10px; }
.pe-exsel { overflow: hidden; text-overflow: ellipsis; }
.morn-g-link { margin-left: auto; color: var(--navy-light); font-weight: 700; cursor: pointer; }
.ctoday-flag-head.open .ctoday-flag-chev { transform: rotate(180deg); }

/* ─── Coach profile: Club Command Center (v5.107) ─────────────────────────── */
.cph2-screen { min-height: 100vh; background: var(--lane-light); padding-bottom: calc(96px + var(--safe-bottom)); }  /* room for the bottom nav */
.cph2-head { background: linear-gradient(135deg, var(--shell) 0%, var(--shell-light) 100%); padding: calc(18px + var(--safe-top)) 16px 16px; position: relative; }
.cph2-close { position: absolute; top: calc(14px + var(--safe-top)); right: 14px; background: none; border: 0; font-size: 21px; color: rgba(255,255,255,.75); cursor: pointer; line-height: 1; padding: 6px; }
.cph2-club { display: flex; align-items: center; gap: 12px; }
.cph2-logo { width: 52px; height: 52px; border-radius: 14px; overflow: hidden; border: 0; padding: 0; background: var(--shell-light); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 20px; font-weight: 700; flex: 0 0 auto; cursor: pointer; }
.cph2-logo img { width: 100%; height: 100%; object-fit: cover; }
.cph2-club-text { flex: 1; min-width: 0; }
.cph2-club-name { font-family: var(--font-display, "Kanit"), -apple-system, Arial, sans-serif; font-weight: 800; font-style: italic; text-transform: uppercase; font-size: 17px; line-height: 1.12; color: #fff; white-space: nowrap; overflow: hidden; }  /* one line — coach-greet-fit shrinks to fit */
.cph2-coach { font-size: 12px; color: #cdd8e8; margin-top: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cph2-edit { flex: 0 0 auto; background: none; border: 1px solid rgba(255,255,255,.4); color: #fff; font-size: 12px; font-weight: 600; border-radius: 999px; padding: 7px 13px; cursor: pointer; }
.cph2-stats { display: flex; background: var(--card); border: 0.5px solid var(--border); border-radius: 14px; margin: var(--section-label-gap, 10px) 14px 0; }
.cph2-stat { flex: 1; text-align: center; padding: 12px 4px 11px; }
.cph2-stat + .cph2-stat { border-left: 0.5px solid var(--border); }
.cph2-stat b { display: block; font-family: var(--font-display, "Kanit"), -apple-system, Arial, sans-serif; font-weight: 800; font-style: italic; font-size: 20px; color: var(--navy); }
.cph2-stat span { font-size: 9.5px; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: var(--text-mute); }
.cph2-body { padding: 4px 14px 0; }
.cph2-sec { font-size: 11px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--text-mute); margin: var(--section-gap, 28px) 2px var(--section-label-gap, 10px); }
.cph2-list { background: var(--card); border: 0.5px solid var(--border); border-radius: 14px; overflow: hidden; }
.cph2-row { display: flex; align-items: center; gap: 11px; width: 100%; background: none; border: 0; border-bottom: 0.5px solid var(--border); padding: 13px 14px; text-align: left; cursor: pointer; }
.cph2-row:last-child { border-bottom: 0; }
.cph2-ic { width: 32px; height: 32px; border-radius: 9px; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.cph2-ic-navy { background: rgba(var(--navy-light-rgb),.10); color: var(--navy-light); }
.cph2-ic-crim { background: rgba(var(--accent-rgb),.09); color: var(--crimson-ink); }
.cph2-ic-green { background: rgba(29,158,117,.10); color: #1D9E75; }
.cph2-row-text { flex: 1; min-width: 0; }
.cph2-row-t { display: block; font-size: 14px; font-weight: 600; color: var(--text); }
.cph2-row-s { display: block; font-size: 11.5px; color: var(--text-mute); margin-top: 1px; }

/* ─── Club sub pages: shared strip placement + sticky action bar ──────────── */
.team-strip { margin: var(--section-label-gap, 10px) 0 0; }      /* page-body already pads 14px */
.team-strip-warn { color: var(--crimson-ink) !important; }
.club-abar { position: sticky; bottom: calc(78px + var(--safe-bottom)); z-index: 5; margin: 16px -14px 0; padding: 10px 14px 6px; background: linear-gradient(180deg, rgba(238,240,245,0) 0%, var(--lane-light) 40%); }
.club-abar-btn { display: block; width: 100%; background: var(--shell-light); color: #fff; border: 0; border-radius: 11px; padding: 13px; font-size: 14px; font-weight: 700; cursor: pointer; }
.club-abar-btn:active { opacity: .85; }

/* ─── Month grid: meet-day highlight (coach calendar) ─────────────────────── */
/* Meet day = solid crimson circle behind the date (readable on dark + light grids) */
.mg-cell.meetday .mg-n { display: inline-block; min-width: 26px; height: 26px; line-height: 26px; border-radius: 50%; background: var(--crimson); color: #fff !important; font-weight: 700; }
.mg-cell.meetday { background: none; }
.mg-dot.meet { background: var(--crimson); }
.mg-legend i.meet, .mg-legend .lg.meet { background: var(--crimson); width: 8px; height: 8px; border: 0; }
.team-strip { margin: 0 0 12px; }                                  /* strip sits tight under the class banner */
.coach-add-btn { background: var(--shell-light); }                  /* action = navy per button standard */

/* ─── Meet head count (coach) + row tally (v5.111, items 6+7) ─────────────── */
.meet-tally { font-size: 11.5px; color: var(--text-mute); margin-top: 2px; }
.meet-tally b { color: #1D9E75; font-weight: 700; }
.meet-headcount { margin-top: 12px; background: var(--lane-light); border: 0.5px solid var(--border); border-radius: 12px; padding: 12px; }
.mh-title { font-family: var(--font-display, "Kanit"), -apple-system, Arial, sans-serif; font-weight: 800; font-style: italic; text-transform: uppercase; font-size: 12px; color: var(--navy); margin-bottom: 8px; }
.mh-grp { margin-bottom: 7px; }
.mh-grp:last-child { margin-bottom: 0; }
.mh-label { display: inline-block; font-size: 11px; font-weight: 700; border-radius: 999px; padding: 2px 8px; margin-right: 6px; }
.mh-ok { background: rgba(29,158,117,.12); color: #1D9E75; }
.mh-no { background: rgba(var(--accent-rgb),.10); color: var(--crimson-ink); }
.mh-mute { background: rgba(91,107,127,.12); color: var(--text-mute); }
.mh-names { font-size: 12.5px; color: var(--text); }
/* (gp-basis retired in v5.120: the projection basis is now .gp-read, styled with the tile) */

/* ─── Compact head count + legal pages (v5.114) ────────────────────────────── */
.mh-compact { display: flex; align-items: center; gap: 8px; width: 100%; background: none; border: 0; padding: 0; cursor: pointer; text-align: left; }
.mh-total { margin-left: auto; font-size: 13.5px; font-weight: 700; color: var(--navy); }
.mh-compact .ctoday-flag-chev { color: var(--text-mute); transition: transform .15s; }
.mh-compact.open .ctoday-flag-chev { transform: rotate(180deg); }
.mh-detail { margin-top: 10px; }
.legal-body { background: var(--card); border: 0.5px solid var(--border); border-radius: 14px; padding: 4px 16px 16px; font-size: 14px; line-height: 1.6; color: var(--text); }
.legal-body h1 { font-family: var(--font-display, "Kanit"), -apple-system, Arial, sans-serif; font-weight: 800; font-style: italic; text-transform: uppercase; font-size: 19px; color: var(--navy); margin: 14px 0 4px; }
.legal-body h2 { font-size: 15px; color: var(--navy); margin: 18px 0 4px; }
.legal-body .meta { color: var(--text-mute); font-size: 12.5px; }
.legal-body a { color: var(--navy-light); }
.legal-body hr { border: none; border-top: 0.5px solid var(--border); margin: 16px 0; }

/* ─── Coach athlete page: identity card + tabs (v5.114 redesign) ──────────── */
.pidc-class { font-family: var(--font-display, "Kanit"), -apple-system, Arial, sans-serif; font-weight: 800; font-style: italic; text-transform: uppercase; font-size: 11px; letter-spacing: .06em; color: #E9B84A; margin-bottom: 12px; }
.pidc-email { font-size: 11.5px; color: #9fb0cc; margin-top: 5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ca-tabs { display: flex; background: var(--card); border: 0.5px solid var(--border); border-radius: 999px; padding: 4px; margin: 12px 0; }
.ca-tab { flex: 1; text-align: center; font-size: 12.5px; font-weight: 700; padding: 9px 0; border-radius: 999px; color: var(--text-mute); background: none; border: 0; cursor: pointer; }
.ca-tab.on { background: var(--shell-light); color: #fff; }
.ca-pane[hidden] { display: none; }
.viewas-btns { display: flex; gap: 8px; flex: 0 0 auto; }

/* ── v5.123: prototype splash landing ──────────────────────────────────────
   Radial navy canvas, tiger with a soft glow behind it + shine sweep inside
   the mark (masked to the logo shape), spaced-caps tagline. From the locked
   clickable prototype splash. */
.auth-landing.landing-v2 {
  background: radial-gradient(115% 85% at 50% 34%, #243a66 0%, #16223f 50%, #0a1120 100%);
}
.landing-hero { position: relative; }
.landing-mark {
  position: relative; width: 196px; height: 170px; margin: 0 auto;
  -webkit-mask-image: url(assets/bloc-lockup.png); mask-image: url(assets/bloc-lockup.png);
  -webkit-mask-size: contain; mask-size: contain;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center; mask-position: center;
}
.landing-mark img { width: 100%; height: 100%; object-fit: contain; display: block; }
.landing-shine {
  position: absolute; top: -20%; left: 0; height: 140%; width: 60%; pointer-events: none;
  background: linear-gradient(100deg, transparent, rgba(214,222,235,0.85) 50%, transparent);
  transform: translateX(-160%); animation: ftSplashShine 4.6s ease-in-out 0.5s 1 forwards;
}
@keyframes ftSplashShine { 0% { transform: translateX(-160%); } 55%, 100% { transform: translateX(280%); } }
.landing-tagline {
  margin-top: 16px; color: #7e96c4; font-size: 12px; font-weight: 700;
  letter-spacing: 0.14em; text-transform: uppercase;
}
.landing-cta2 {
  width: 100%; max-width: 360px; background: transparent; color: #fff;
  border: 1.5px solid rgba(255,255,255,0.30); border-radius: 14px; padding: 15px;
  font-size: 16px; font-weight: 600; cursor: pointer; margin-top: 12px;
}
.landing-cta2:active { background: rgba(255,255,255,0.08); }

/* Role choice sheet (who's signing up) */
.role-card {
  display: flex; align-items: center; gap: 14px; width: 100%; text-align: left;
  background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.16);
  border-radius: 16px; padding: 16px; margin-bottom: 12px; cursor: pointer; color: #fff;
}
.role-card:active { background: rgba(255,255,255,0.12); }
.role-card-t { font-size: 16px; font-weight: 700; }
.role-card-s { font-size: 13px; color: #C5D0EA; margin-top: 2px; line-height: 1.4; }
.role-card-chev { margin-left: auto; color: #7E8DAC; font-size: 22px; }
.role-note { text-align: center; font-size: 12.5px; color: #9FB0D0; margin-top: 8px; line-height: 1.5; }

/* ── v5.123: registration stepper (one question per screen) ──────────────── */
.regx {
  min-height: 100vh; display: flex; flex-direction: column; max-width: 480px; margin: 0 auto;
  padding: calc(14px + var(--safe-top, 0px)) 22px calc(26px + var(--safe-bottom, 0px));
}
/* #app reserves ~70px at the foot for the bottom nav, but the nav is hidden on
   the auth and registration screens. On a step SHORTER than the viewport that
   dead space is invisible; on a tall one, like the grouped events step, the
   registration canvas ends and the navy body shows through as a strip under
   the footer. Reclaim it whenever a full screen auth surface is mounted. */
#app:has(> .regx), #app:has(> .auth-landing), #app:has(> .authx) { padding-bottom: 0; }

.regx.sheet-dark {
  background: radial-gradient(120% 100% at 50% 30%, #1C1E25 0%, #101216 72%);
  -webkit-backdrop-filter: none; backdrop-filter: none; border-radius: 0;
}
.regx .authx-body { flex: 1; display: flex; flex-direction: column; }
.regx-top { display: flex; align-items: center; gap: 14px; margin-bottom: 24px; }
.regx-back {
  flex: 0 0 44px; width: 44px; height: 44px; border: none; cursor: pointer; background: none;
  color: #fff; display: flex; align-items: center; justify-content: center; padding: 0; margin-left: -10px;
}
.regx-back svg { width: 26px; height: 26px; }
.foot-prog { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.foot-count { color: #7e96c4; font-size: 11px; font-weight: 700; letter-spacing: 0.1em; white-space: nowrap; }
.prog-seg { flex: 1; display: flex; gap: 6px; }
.prog-seg i { flex: 1; height: 6px; border-radius: 99px; background: rgba(255,255,255,0.13); }
.prog-seg i.on { background: var(--crimson); }
.regx-h {
  font-family: var(--font-display, "Kanit"), -apple-system, Arial, sans-serif;
  font-style: italic; font-weight: 700; text-transform: uppercase; letter-spacing: 0.01em;
  color: #fff; font-size: 26px; line-height: 1.12; margin: 0 0 6px; text-align: center;
  /* The one rule that does the VERTICAL centring, and the only part of the
     approved centred layout the app never got: the heading, sub and body sit
     as one block, pushed off the top by this and off the bottom by
     .regx-foot's own margin-top:auto, so the slack splits evenly instead of
     all collecting above the footer.
     margin-top, not flex:1 on .regx-body, because .regx is min-height:100vh:
     the step GROWS past the viewport on a tall step like events, and auto
     margins simply stop applying when there is no slack. A centred flex
     container would push its first row out of reach instead. */
  margin-top: auto;
}
.regx-sub { color: #C5D0EA; font-size: 14px; line-height: 1.5; margin: 0 0 22px; text-align: center; }
.regx .auth-hint, .regx .auth-error { text-align: center; }
.regx .onb-photo-label { text-align: center; }
.regx-step { animation: regxIn 0.28s ease; display: flex; flex-direction: column; flex: 1; }
@keyframes regxIn { from { opacity: 0; transform: translateX(26px); } to { opacity: 1; transform: none; } }
.regx-body { display: flex; flex-direction: column; }
.regx-foot { margin-top: auto; padding-top: 22px; }
.regx-next {
  width: 100%; background: var(--crimson); color: #fff; border: none; border-radius: 14px;
  padding: 16px; font-size: 16px; font-weight: 600; cursor: pointer;
  box-shadow: var(--glow);
}
.regx-next:active { background: color-mix(in srgb, var(--crimson) 78%, #000); }
.regx-next:disabled { opacity: 0.55; }
.regx-skip { display: block; margin: 14px auto 0; background: none; border: none; color: #9fb1d8; font-size: 14px; font-weight: 600; cursor: pointer; }
.regx-chips { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
/* Grouped events. Two columns, because "100m Hurdles" and "Weight Throw" do
   not fit three up on a 375pt phone; the all short numeric groups get three. */
/* Events accordion. Namespaced evg-, NOT ev-: .ev-count is already the Events
   screen's meet card. Closed by default, since eight groups of chips is a long
   scroll and an athlete cares about one or two; a group holding a pick opens
   itself and shows a count so a collapsed list still says what you chose. */
.ev-group { margin-bottom: 8px; border: 1px solid var(--border); border-radius: 14px; overflow: hidden; }
.evg-head { width: 100%; display: flex; align-items: center; gap: 10px; background: var(--lane-light);
  border: 0; padding: 14px; cursor: pointer; text-align: left; }
.evg-head .ev-lbl { margin: 0; flex: 1; }
.evg-count { font-size: 11px; font-weight: 700; color: #fff; background: var(--crimson); border-radius: 99px;
  min-width: 20px; height: 20px; padding: 0 6px; display: none; align-items: center; justify-content: center; }
.ev-group.has-pick .evg-count { display: flex; }
.evg-chev { color: var(--text-soft); font-size: 17px; line-height: 1; transition: transform .22s cubic-bezier(.3,.7,.3,1); }
.ev-group.open .evg-chev { transform: rotate(90deg); }
.evg-panel { display: none; padding: 4px 12px 14px; }
.ev-group.open .evg-panel { display: block; }
/* Every chip the same size: one grid, two equal columns, one fixed height. */
.ev-group .regx-chips { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.ev-group .regx-chip { width: 100%; height: 46px; padding: 0 6px; font-size: 13px; text-align: center;
  display: flex; align-items: center; justify-content: center; }
.ev-lbl {
  display: block; font-size: 10px; letter-spacing: 0.16em; font-weight: 700;
  color: #7e96c4; text-transform: uppercase; margin-bottom: 8px; text-align: center;
}
.regx-chip {
  padding: 13px 18px; border-radius: 12px; border: 1.5px solid rgba(255,255,255,0.22);
  color: #fff; background: rgba(255,255,255,0.05); font-size: 15px; font-weight: 600; cursor: pointer;
}
.regx-chip.on { background: var(--crimson); border-color: var(--crimson); }
.regx .onb-photo-wrap { margin-top: 6px; }

/* ─── REGISTRATION, LIGHT ────────────────────────────────────────────────
   The chooser sheet is white and the stepper used to drop to a dark canvas.
   Scoped to .regx-light so the SCRATCH BUILDER, which shares the .regx shell
   as .regx.sheet-dark, is untouched. Everything below is a value that was
   hardcoded for the dark canvas; the .sheet-dark descendant rules simply stop
   applying, and the base .auth-label / .auth-input rules are already light. */
.regx-light { background: var(--card); color: var(--text); }
.regx-light .regx-back { color: var(--navy); }
.regx-light .regx-h { color: var(--navy); }
.regx-light .regx-sub { color: var(--text-soft); }
.regx-light .regx-skip { color: var(--text-mute); }
.regx-light .foot-count { color: var(--text-mute); }
/* The progress TRACK. Was rgba(255,255,255,.13): invisible on a light canvas,
   so only the filled portion showed and there was no bar for it to fill.
   The .on override has to be restated at this specificity: .prog-seg i.on and
   .regx-light .prog-seg i are both (0,2,1), so the later rule wins and the
   filled segments were being repainted as track. */
.regx-light .prog-seg i { background: var(--border); }
.regx-light .prog-seg i.on { background: var(--crimson); }
.regx-light .ev-lbl { color: var(--text-soft); }
.regx-light .regx-chip { border-color: var(--border); color: var(--text); background: var(--card); }
.regx-light .regx-chip.on { background: var(--crimson); border-color: var(--crimson); color: #fff; }
.regx-light textarea.tw-area { background: var(--card); border-color: var(--border); color: var(--text); }
.regx-light .onb-photo { background: var(--lane-light); }
/* The birth date widget. Its big display digits were color:#fff, so on the
   light canvas you typed and nothing appeared. The same widget is reused by
   the DARK class setup screens via regDateGroupHTML(), which is why every one
   of these is scoped to .regx-light rather than fixed at source. */
.regx-light .dob-seg input { color: var(--text); border-bottom-color: var(--border); }
.regx-light .dob-seg input::placeholder { color: var(--text-mute); }
.regx-light .dob-seg input:focus { border-bottom-color: var(--crimson); }
.regx-light .dob-seg label { color: var(--text-soft); }
.regx-light .dob-age { color: var(--text-soft); }
/* Air between the screen title and the first event group. */
.regx-light .ev-group:first-child { margin-top: 14px; }

/* Right hand value on a settings nav row, e.g. the current club name. Muted,
   truncating rather than pushing the chevron off the row. */
.tog-val {
  color: var(--text-mute); font-size: 14px; max-width: 46vw;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* v5.124: birth date step — centered, no cell, big segmented digits */
.dob-row { display: flex; justify-content: center; align-items: flex-end; gap: 20px; margin-top: 30px; }
.dob-seg { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.dob-seg input { width: 72px; background: none; border: none; border-bottom: 2px solid rgba(255,255,255,0.25);
  color: #fff; font-family: var(--font-display, "Kanit"), -apple-system, Arial, sans-serif;
  font-style: italic; font-weight: 700; font-size: 34px; text-align: center; padding: 2px 0 8px; border-radius: 0; }
.dob-seg input::placeholder { color: #3d4f78; }
.dob-seg input:focus { outline: none; border-bottom-color: var(--crimson); }
.dob-seg.dob-y input { width: 118px; }
.dob-seg label { font-size: 10px; letter-spacing: 0.14em; color: #7e96c4; font-weight: 700; text-transform: uppercase; }
.dob-age { text-align: center; color: #9fb1d8; font-size: 13px; margin-top: 22px; min-height: 18px; }

/* ── v5.126: class setup stepper (create/edit a class, guided) ───────────── */
.dob-row.dob-sm .dob-seg input { width: 58px; font-size: 27px; padding-bottom: 6px; }
.dob-row.dob-sm .dob-seg.dob-y input { width: 92px; }
.date-group { margin-top: 18px; }
.date-group + .date-group { margin-top: 28px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,0.12); }
.date-glbl { text-align: center; font-size: 11px; letter-spacing: 0.12em; color: #9FB0D0; font-weight: 700; text-transform: uppercase; margin-bottom: 2px; }
.wk-live { text-align: center; margin-top: 18px; color: #7e96c4; font-size: 12px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
.wk-live b { display: block; font-family: var(--font-display, "Kanit"), -apple-system, Arial, sans-serif; font-style: italic; font-size: 30px; color: #fff; letter-spacing: 0; margin-top: 2px; }
.guide { display: flex; gap: 10px; border-radius: 12px; padding: 12px 13px; margin-top: 16px; font-size: 13px; line-height: 1.5; text-align: left; }
.guide svg { flex: 0 0 18px; margin-top: 1px; }
.guide-info { background: rgba(84,124,201,0.14); border: 1px solid rgba(84,124,201,0.35); color: #C5D0EA; }
.guide-safe { background: rgba(38,150,92,0.14); border: 1px solid rgba(38,150,92,0.4); color: #B7E2CC; }
.guide-warn { background: rgba(216,146,42,0.14); border: 1px solid rgba(216,146,42,0.45); color: #F0D3A6; }
.opt-card { display: flex; flex-direction: column; gap: 3px; width: 100%; text-align: left; color: #fff; cursor: pointer;
  background: rgba(255,255,255,0.06); border: 1.5px solid rgba(255,255,255,0.16); border-radius: 16px; padding: 15px 16px; margin-bottom: 12px; }
.opt-card.on { border-color: var(--crimson); background: rgba(var(--accent-rgb),0.16); }
.opt-card b { font-size: 15.5px; }
.opt-card span { font-size: 13px; color: #C5D0EA; line-height: 1.45; }
.day-rows { display: flex; flex-direction: column; gap: 10px; }
.day-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; text-align: left; color: #fff; cursor: pointer;
  background: rgba(255,255,255,0.06); border: 1.5px solid rgba(255,255,255,0.16); border-radius: 14px; padding: 15px 16px; font-size: 15.5px; font-weight: 700; }
.day-row span { font-size: 12.5px; color: #C5D0EA; font-weight: 500; text-align: right; }
.day-row.on { border-color: var(--crimson); background: rgba(var(--accent-rgb),0.16); }
.code-box { text-align: center; margin-top: 10px; }
.code-big { font-family: var(--font-display, "Kanit"), -apple-system, Arial, sans-serif; font-style: italic; font-weight: 700; font-size: 40px; letter-spacing: 6px; color: #fff;
  background: rgba(255,255,255,0.07); border: 1.5px dashed rgba(255,255,255,0.3); border-radius: 16px; padding: 18px 10px; }
.code-acts { display: flex; gap: 10px; margin-top: 12px; }
.code-acts button { flex: 1; background: rgba(255,255,255,0.1); color: #fff; border: 1px solid rgba(255,255,255,0.22); border-radius: 12px; padding: 12px; font-size: 14px; font-weight: 600; cursor: pointer; }

/* ── v5.127: from-scratch program builder ─────────────────────────────────── */
.scrx .bld-week { display: flex; align-items: center; justify-content: center; gap: 18px; margin: 0 0 8px; color: #fff; }
.scrx .bld-week b { font-family: var(--font-display, "Kanit"), -apple-system, Arial, sans-serif; font-style: italic; text-transform: uppercase; font-size: 19px; text-align: center; min-width: 150px; }
.scrx .bld-week button { background: none; border: none; color: #fff; width: 40px; height: 40px; font-size: 22px; cursor: pointer; padding: 0; }
.rest-hint { text-align: center; color: #9FB0D0; font-size: 12px; margin: 0 0 12px; line-height: 1.45; }
.bld-day { display: flex; align-items: center; justify-content: space-between; gap: 8px; background: rgba(255,255,255,0.05); border: 1px dashed rgba(255,255,255,0.22); border-radius: 12px; padding: 12px 14px; margin-bottom: 8px; }
.bld-day b { color: #fff; font-size: 13.5px; font-weight: 700; width: 42px; flex: 0 0 42px; }
.bld-day span { flex: 1; color: #7E8DAC; font-size: 12.5px; line-height: 1.4; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.bld-day button { background: none; border: 1px solid rgba(255,255,255,0.3); color: #fff; border-radius: 99px; padding: 6px 12px; font-size: 12px; font-weight: 700; cursor: pointer; white-space: nowrap; }
.bld-day.filled { border-style: solid; border-color: rgba(var(--accent-rgb),0.55); background: rgba(var(--accent-rgb),0.13); }
.bld-day.filled span { color: #E9C7CE; }
.bld-day.rest { opacity: 0.65; }
.grid-top { display: flex; align-items: center; justify-content: space-between; }
.tools-pill { background: none; border: none; color: #fff; padding: 8px 4px; font-size: 14px; font-weight: 700; cursor: pointer; }
.sec-card { background: rgba(255,255,255,0.05); border: 1px dashed rgba(255,255,255,0.22); border-radius: 14px; padding: 13px 14px; margin-bottom: 10px; }
.sec-card.filled { border-style: solid; border-color: rgba(var(--accent-rgb),0.55); background: rgba(var(--accent-rgb),0.13); }
.sec-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.sec-head b { color: #fff; font-size: 13px; text-transform: uppercase; letter-spacing: 0.07em; font-family: var(--font-display, "Kanit"), -apple-system, Arial, sans-serif; font-style: italic; }
.sec-head button { background: none; border: 1px solid rgba(255,255,255,0.3); color: #fff; border-radius: 99px; padding: 6px 12px; font-size: 12px; font-weight: 700; cursor: pointer; white-space: nowrap; }
.sec-body { color: #7E8DAC; font-size: 12.5px; line-height: 1.5; margin-top: 6px; }
.sec-card.filled .sec-body { color: #E9C7CE; }
.tw-block { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.16); border-radius: 14px; padding: 12px; margin-bottom: 10px; }
.tw-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.tw-head b { color: #fff; font-size: 13px; text-transform: uppercase; letter-spacing: 0.06em; font-family: var(--font-display, "Kanit"), -apple-system, Arial, sans-serif; font-style: italic; }
.tw-head button { background: none; border: none; color: #FF9B9B; font-size: 12px; font-weight: 700; cursor: pointer; }
.tw-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
.tw-grid.tw-grid2 { grid-template-columns: 1fr 1fr; }
.tw-f { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.tw-f > span { font-size: 9.5px; letter-spacing: 0.1em; text-transform: uppercase; color: #9FB0D0; font-weight: 700; }
.tw-f select { background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.2); color: #fff; border-radius: 9px; padding: 0 28px 0 8px; font-size: 14px; width: 100%; height: 44px;
  -webkit-appearance: none; appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238B93A2' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 10px center; }
.tw-f select:focus { outline: none; border-color: var(--crimson); box-shadow: 0 0 0 1.5px rgba(var(--accent-rgb),0.55); }
.tw-pace { margin-top: 8px; background: rgba(84,124,201,0.12); border: 1px solid rgba(84,124,201,0.3); border-radius: 10px; padding: 8px 10px; font-size: 11.5px; color: #C5D0EA; line-height: 1.45; }
.tw-add { width: 100%; background: none; border: 1.5px dashed rgba(255,255,255,0.3); color: #C5D0EA; border-radius: 13px; padding: 12px; font-size: 13px; font-weight: 700; cursor: pointer; margin: 2px 0 10px; }
.wu-sel-wrap { margin-bottom: 18px; }
.wu-group-tag { text-align: center; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: #7cd992; font-weight: 700; margin: 0 0 10px; }
.wu-row { display: flex; align-items: center; gap: 9px; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.16); border-radius: 12px; padding: 10px 12px; margin-bottom: 8px; }
.wu-row.dragging { position: relative; z-index: 6; border-color: var(--crimson); background: rgba(var(--accent-rgb),0.28); box-shadow: 0 8px 22px rgba(0,0,0,0.45); }
.wu-handle { touch-action: none; cursor: grab; width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; color: #7E8DAC; flex: 0 0 30px; }
.wu-handle svg { width: 16px; height: 16px; }
.wu-row-t { flex: 1; min-width: 0; }
.wu-row-t b { display: block; color: #fff; font-size: 13.5px; }
.wu-row-t span { display: block; color: #9FB0D0; font-size: 11.5px; margin-top: 1px; }
.wu-ctl { display: flex; gap: 5px; }
.wu-ctl button { width: 30px; height: 30px; border-radius: 8px; border: 1px solid rgba(255,255,255,0.22); background: rgba(255,255,255,0.06); color: #FF9B9B; font-size: 13px; cursor: pointer; padding: 0; }
.sheet-over { position: fixed; inset: 0; background: rgba(8,14,28,0.65); display: flex; align-items: flex-end; z-index: 1600; }
.sheet-in { width: 100%; max-width: 480px; margin: 0 auto; max-height: 86%; overflow-y: auto; background: #111a30; border-top: 1px solid rgba(255,255,255,0.14); border-radius: 22px 22px 0 0; padding: 14px 18px calc(24px + var(--safe-bottom, 0px)); }
.sheet-grabber { width: 40px; height: 5px; border-radius: 3px; background: rgba(255,255,255,0.25); margin: 0 auto 14px; }
.sheet-h { font-family: var(--font-display, "Kanit"), -apple-system, Arial, sans-serif; font-style: italic; text-transform: uppercase; color: #fff; font-size: 16px; margin: 0 0 12px; text-align: center; }
.srow { display: flex; flex-direction: column; gap: 2px; width: 100%; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.16); border-radius: 12px; padding: 13px 14px; margin-bottom: 8px; color: #fff; font-size: 14px; font-weight: 600; cursor: pointer; text-align: left; }
.srow small { color: #9FB0D0; font-weight: 400; font-size: 11.5px; }
.pick-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; text-align: left; color: #fff; cursor: pointer; background: rgba(255,255,255,0.06); border: 1.5px solid rgba(255,255,255,0.16); border-radius: 13px; padding: 12px 14px; margin-bottom: 8px; }
.pick-row.on { border-color: var(--crimson); background: rgba(var(--accent-rgb),0.16); }
.pick-row b { font-size: 14px; display: block; }
.pick-row .pick-sub { font-size: 11.5px; color: #C5D0EA; display: block; margin-top: 1px; }
.rest-chips { display: flex; gap: 6px; margin-bottom: 6px; }
.rest-chips button { flex: 1; padding: 10px 0; border-radius: 10px; border: 1.5px solid rgba(255,255,255,0.2); background: rgba(255,255,255,0.05); color: #7E8DAC; font-size: 12px; font-weight: 700; cursor: pointer; }
.rest-chips button.on { background: rgba(var(--accent-rgb),0.2); border-color: var(--crimson); color: #fff; }
.regx textarea.tw-area { width: 100%; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.2); color: #fff; border-radius: 12px; padding: 11px 12px; font-size: 14px; min-height: 90px; resize: none; }
.regx textarea.tw-area:focus { outline: none; border-color: var(--crimson); box-shadow: 0 0 0 1.5px rgba(var(--accent-rgb),0.55); }


/* ─── The pre sign in surfaces are BLOC'S ─────────────────────────────────
   applyTeamColor() writes --crimson and friends as an INLINE style on :root.
   A declaration on a DESCENDANT wins for that subtree, so re-pinning here
   makes every control inside these four roots paint Bloc without enumerating
   a single button, and anything added to these screens later inherits it for
   free. Covers fills, tints, accent text and the glow, which reads
   --accent-rgb. Nothing after sign in is touched. ─────────────────────── */
.auth-landing, .authx, .regx, .ft-lock {
  --crimson:      var(--bloc-cta);
  --crimson-soft: #2A54BE1F;
  --crimson-ink:  var(--bloc-cta-ink);
  --accent:       var(--bloc-cta);
  --accent-soft:  #2A54BE1F;
  --accent-ink:   var(--bloc-cta-ink);
  --accent-rgb:   var(--bloc-cta-rgb);
}

/* ─── Dark theme (v5.128.0) — token overrides only. Light values live in :root
   and are untouched, so light mode renders exactly as before. Users are light
   by default; the Appearance setting (coach Settings for now) opts in. ─── */
html[data-theme="dark"] {
  color-scheme: dark;
  --bg:          #0B0F16;
  --card:        #141A24;
  --text:        #F4F5F8;
  --text-soft:   #A9B0BE;
  --text-mute:   #8B93A2;
  --border:      #232B3A;
  --border-soft: #1B2230;
  --lane-light:  #1B2230;
  --crimson-soft:#2A54BE1F;
  /* Cobalt on the dark card is only 2.59:1, so accent text is lightened.
     Computed by ftAccentInk() at a 4.9 target, not hand picked. */
  --crimson-ink: #6A87D2;
  --accent-soft: #2A54BE1F;
  --accent-ink:  #6A87D2;
  --copper-ink:  #B7795A;
  --bloc-cta-ink:  #6A87D2;
  --steel:       #8B93A2;
  --shell:       #0F1626;
  --shell-dark:  #070B12;
  --shell-light: #22304E;
  --navy:        #C4CEE2;
  --navy-dark:   #A9B8D8;
  --navy-light:  #A9B8D8;
  --rest-bg:     #121826;
  --rest-accent: #A9B8D8;
  --rest-soft:   #151B28;
  --ok-tint:     #0F2A26;
  --ok-ink:      #3BC0AF;
  --stat-good:   #4FC07E;
  --stat-warn:   #D9A24A;
  --stat-bad:    #E0788C;
  --cau-tint:    #2E2310;
  --cau-ink:     #DFA33C;
  --shadow-sm:   0 1px 2px rgba(0,0,0,0.4);
}

/* Appearance setting (coach Settings, v5.128.0) */
.appear-wrap { padding: 12px 14px 6px; }
.appear-seg { display: flex; width: 100%; background: var(--lane-light); border: 1px solid var(--border); border-radius: 12px; padding: 3px; }
.appear-seg button { flex: 1; border: 0; background: transparent; color: var(--text-mute); font: inherit; font-size: 13.5px; font-weight: 600; padding: 9px 0; border-radius: 9px; cursor: pointer; transition: background .2s ease, color .2s ease; }
.appear-seg button.on { background: var(--crimson); color: #fff; box-shadow: var(--glow); }
.appear-hint { font-size: 12.5px; color: var(--text-mute); margin: 0; padding: 8px 16px 12px; }


/* ─── Coach nav v2 (v5.129.0, from the preview design) ────────────────────
   Frosted glass bar, five slots with a raised round Home in the center.
   Overrides the v5.107 bar; light values here, dark below. ─── */
.coach-bottom-nav.cnav-v2 {
  background: rgba(255,255,255,.38);
  -webkit-backdrop-filter: blur(22px) saturate(1.5);
  backdrop-filter: blur(22px) saturate(1.5);
  border: 1px solid rgba(255,255,255,.65);
  box-shadow: 0 14px 34px rgba(28,35,51,.16), inset 0 1px 0 rgba(255,255,255,.85), inset 0 -1px 0 rgba(255,255,255,.2);
  justify-content: center; align-items: center; gap: 0; height: 64px; padding: 8px;
}
.cnav-v2 .cnav-side { flex: 1 1 0; min-width: 0; display: flex; align-self: stretch; }
.cnav-v2 .cnav-item { color: #1C2333; gap: 3px; padding: 0 2px; justify-content: center; }
.cnav-v2 .cnav-item.active { color: #1C2333; background: rgba(28,35,51,.08); }
.cnav-v2 .cnav-home {
  flex: 0 0 48px; width: 48px; height: 48px; border-radius: 50%; padding: 0;
  background: var(--crimson); color: #fff; margin: 0 6px;
  box-shadow: var(--glow);
}
.cnav-v2 .cnav-home.active { background: var(--crimson); color: #fff; }
.cnav-v2 .cnav-home .cnav-ic svg { width: 23px; height: 23px; }
html[data-theme="dark"] .coach-bottom-nav.cnav-v2 {
  background: rgba(28,30,36,.32);
  -webkit-backdrop-filter: blur(24px) saturate(1.4);
  backdrop-filter: blur(24px) saturate(1.4);
  border-color: rgba(255,255,255,.15);
  box-shadow: 0 14px 34px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.18), inset 0 -1px 0 rgba(255,255,255,.05);
}
html[data-theme="dark"] .cnav-v2 .cnav-item { color: rgba(255,255,255,.62); }
html[data-theme="dark"] .cnav-v2 .cnav-item.active { color: #fff; background: rgba(255,255,255,.22); }
html[data-theme="dark"] .cnav-v2 .cnav-home { color: #fff; background: var(--crimson); }


/* ─── Coach dashboard v2 (v5.130.0, from the preview design) ────────────── */
.ct3-hero { text-align: center; }
.ct3-ring-wrap { position: relative; width: 148px; height: 148px; margin: 4px auto 2px; background: none; border: 0; cursor: pointer; display: block; }
.ct3-ring { width: 148px; height: 148px; transform: rotate(-90deg); display: block; }
.ct3-ring-bg { fill: none; stroke: var(--lane-light); stroke-width: 10; }
.ct3-ring-fg { fill: none; stroke: var(--crimson); stroke-width: 10; stroke-linecap: round; transition: stroke-dashoffset .8s cubic-bezier(.3,.7,.3,1); }
.ct3-ring-center { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; pointer-events: none; }
.ct3-ring-n { font-family: var(--font-display); font-style: italic; font-size: 40px; font-weight: 800; color: var(--text); line-height: 1; }
.ct3-ring-l { font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--text-mute); margin-top: 3px; }
.ct3-ring-sub { font-size: 12.5px; color: var(--text-mute); margin: 2px 0 10px; }
.ct3-ring-sub b { color: var(--crimson-ink); }
.ct3-hero .morn-split { text-align: left; }

.ct3-stat-row { display: flex; gap: 10px; margin-bottom: 10px; }
.ct3-stat { flex: 1; min-width: 0; background: var(--card); border: 0.5px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-sm); padding: 13px 14px; text-align: left; cursor: pointer; }
.ct3-stat b { display: block; font-family: var(--font-display); font-style: italic; font-size: 27px; font-weight: 800; color: var(--text); line-height: 1.05; }
.ct3-stat span { display: block; font-size: 10.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--text-mute); margin-top: 4px; line-height: 1.35; }

.ct3-att-outs { display: block; font-size: 12px; color: var(--text-mute); margin-top: 3px; }

.ct3-ready { border-left: 3px solid var(--border); }
.ct3-ready-t { font-size: 14.5px; font-weight: 700; color: var(--text-soft); margin: 0; }
.ct3-ready-s { font-size: 12.5px; color: var(--text-mute); margin: 4px 0 0; }

.ct3-look { padding: 4px 8px; }
.ct3-look .attn-row { width: 100%; }
.ct3-look .ctoday-flag-head { width: 100%; }

.ct3-next-title { font-size: 17px; font-weight: 800; color: var(--text); margin-bottom: 8px; }
.ct3-next-tile { width: 100%; margin-top: 10px; }

#coach-meets-row .ct3-meet-main { display: flex; flex-direction: column; min-width: 0; flex: 1; text-align: left; }
#coach-meets-row .ct3-meet-name { font-size: 15px; font-weight: 800; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#coach-meets-row .ct3-meet-sub { font-size: 12px; color: var(--text-mute); margin-top: 1px; }
#coach-meets-row .ct3-meet-days { display: flex; flex-direction: column; align-items: center; line-height: 1; padding: 0 6px; }
#coach-meets-row .ct3-meet-days b { font-family: var(--font-display); font-style: italic; font-size: 26px; font-weight: 800; color: var(--crimson-ink); }
#coach-meets-row .ct3-meet-days { font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--text-mute); }

/* v5.130.0: action buttons go crimson per the design rules (glow included) */
.morn-nudge, .ctoday-att-btn, .coach-add-btn, #ctoday-note-save.set-pw-save {
  background: var(--crimson) !important; color: #fff !important; border-color: var(--crimson) !important;
  box-shadow: var(--glow);
}


/* v5.130.0 dark: replace literal grays that disappear on dark surfaces */
html[data-theme="dark"] .morn-col-label,
html[data-theme="dark"] .morn-none,
html[data-theme="dark"] .morn-g { color: var(--text-mute); }
html[data-theme="dark"] .morn-g b { color: var(--text); }


/* ─── v5.131.0 (C4-C6 batch) ────────────────────────────────────────────── */
/* roster rows: status chip + metrics column */
.team-metrics { flex: 0 0 auto; text-align: right; padding-right: 2px; }
.team-metrics b { display: block; font-size: 15px; font-weight: 800; color: var(--text); line-height: 1.1; }
.team-metrics span { display: block; font-size: 9.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--text-mute); margin-top: 2px; }
/* events calendar legend dot on dark */
html[data-theme="dark"] .cal-legend, html[data-theme="dark"] .cal-mname { color: var(--text-soft); }


/* ─── Reports builder (v5.132.0, C7) ─────────────────────────────────────── */
.rpt-card { padding: 12px 14px; }
.rpt-note { font-size: 12.5px; color: var(--text-mute); text-align: center; margin-top: 10px; }
.scr-repeat-btn { margin: 0 0 12px; background: var(--crimson) !important; color: #fff !important; box-shadow: var(--glow); }

/* printable report: hidden on screen, the only thing on paper */
.report-print { display: none; }
@media print {
  html, body { background: #fff !important; }
  body > *:not(.report-print) { display: none !important; }
  /* body > .report-print outranks the qr-page print rule's :not() specificity */
  body > .report-print { display: block !important; background: #fff; color: #16181d; font-size: 12px; line-height: 1.45; padding: 6mm; }
  .rp-band { display: flex; justify-content: space-between; align-items: baseline; background: #1D2F52; color: #fff; padding: 8px 12px; border-left: 6px solid #2A54BE; }
  .rp-club { font-weight: 800; letter-spacing: .08em; font-size: 11px; }
  .rp-kind { font-weight: 800; letter-spacing: .1em; font-size: 11px; color: #F3C8CF; }
  .rp-sub { font-size: 11px; color: #555; margin: 6px 0 12px; }
  .rp-tiles { display: flex; gap: 8px; margin: 0 0 12px; }
  .rp-tile { flex: 1; border: 0.5px solid #ddd; border-top: 3px solid #2A54BE; padding: 8px 10px; }
  .rp-tile b { display: block; font-size: 20px; font-weight: 800; }
  .rp-tile span { display: block; font-size: 8.5px; font-weight: 700; letter-spacing: .08em; color: #777; margin-top: 2px; }
  .rp-h { font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; margin: 14px 0 6px; color: #1D2F52; }
  .rp-table { width: 100%; border-collapse: collapse; }
  .rp-table th { text-align: left; font-size: 9.5px; letter-spacing: .06em; text-transform: uppercase; color: #777; border-bottom: 1.5px solid #1D2F52; padding: 4px 6px; }
  .rp-table td { border-bottom: 0.5px solid #e3e3e3; padding: 5px 6px; font-size: 11px; }
  .rp-foot { margin-top: 14px; font-size: 9px; color: #999; }
}


/* ═══════════════════════════════════════════════════════════════════════
   v5.133.0 — NEW DESIGN SKIN (coach phase). The previews are the spec.
   ═══════════════════════════════════════════════════════════════════════ */

/* canvas + geometry tokens: preview values */
:root {
  --bg: #F7F7F9;
  --border: #ECECF1;
  --border-soft: #F1F2F6;
  --radius-md: 20px;
  --shadow-sm: 0 1px 2px rgba(16,20,30,.05), 0 6px 18px rgba(16,20,30,.05);
}
html[data-theme="dark"] {
  --border: #1E2531;
  --border-soft: #171E2A;
  --lane-light: #2B3444;
  --shadow-sm: 0 1px 2px rgba(0,0,0,.3), 0 8px 22px rgba(0,0,0,.25);
}

/* coach canvas: light page, no navy shell */
body.is-coach { background: var(--bg); }

/* headers: ink Kanit titles straight on the canvas, no navy band */
body.is-coach .app-header,
body.is-coach .day-header {
  background: var(--bg);
  color: var(--text);
  border-radius: 0;
  box-shadow: none;
}
body.is-coach .app-header .screen-name,
body.is-coach .app-header .greeting,
body.is-coach .day-cal-head,
body.is-coach .day-cal-range { color: var(--text); }
body.is-coach .msg-back,
body.is-coach .coach-kebab,
body.is-coach .day-cal-arrow { color: var(--text); }
body.is-coach .day-cal-arrow:active { color: var(--crimson-ink); }
body.is-coach .home-icon-btn { border-color: var(--border); background: var(--card); color: var(--text); }
body.is-coach .home-icon-btn:active { background: var(--lane-light); }
body.is-coach .home-av { background: var(--card); border: 1px solid var(--border); color: var(--text); }
body.is-coach .home-av-ini { color: var(--text); }
body.is-coach .date-meta-line { color: var(--text-mute); }
body.is-coach .msg-head-av { background: var(--lane-light); border-color: var(--border); }
body.is-coach .msg-head-av-initial { color: var(--text); }

/* header week strip: card chips with ink, crimson for today */
body.is-coach .ws-l { color: var(--text-mute); }
body.is-coach .ws-n { color: var(--text); }
body.is-coach .ws-day:active { background: var(--lane-light); }
body.is-coach .ws-day.today {
  background: var(--card);
  border: 1px solid var(--border);
  box-shadow: var(--shadow-sm);
  -webkit-backdrop-filter: none; backdrop-filter: none;
}
body.is-coach .ws-day.today .ws-l { color: var(--text-mute); }
body.is-coach .ws-day.today .ws-n { color: var(--text); }
body.is-coach .ws-day.ws-istoday .ws-n { color: var(--crimson-ink); }

/* every primary action is crimson with the glow: the standing rule */
body.is-coach .btn-primary,
body.is-coach .regx-next,
body.is-coach .btn-modal-save,
body.is-coach .set-pw-save,
body.is-coach .fbtn,
body.is-coach .par-rsvp-btn.yes,
body.is-coach .auth-copy button,
body.is-coach .perf-toggle .cvt.active {
  background: var(--crimson) !important;
  border-color: var(--crimson) !important;
  color: #fff !important;
  box-shadow: var(--glow);
}
body.is-coach .fbtn.dim { opacity: .55; box-shadow: none; }
body.is-coach .cal-day.today { background: var(--crimson); color: #fff; }
body.is-coach .cal-day.today .cal-day-dot { background: #fff; }

/* section labels in the preview voice */
body.is-coach .section-label {
  font-size: 11px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase;
  color: var(--text-mute);
}

/* coach note band goes crimson accent instead of navy */
body.is-coach .coach-note-head { background: var(--crimson); }


/* ─── v5.134.0: coach home pixel parity ─────────────────────────────────── */
.ch-date { font-size: 12px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; color: var(--text-mute); margin-top: 5px; }
body.is-coach .ch-head { padding-bottom: 4px; }
.ch-av { flex: 0 0 auto; }

.chw-pill { display: flex; align-items: center; gap: 10px; background: linear-gradient(90deg, #FDF1DE, #FDFBF7); border: 1px solid #F5E3C2; border-radius: 999px; padding: 12px 16px; margin-bottom: 20px; }
html[data-theme="dark"] .chw-pill { background: linear-gradient(90deg, #2A2210, #191A20); border-color: #3A2F14; }
.chw-pill img { width: 28px; height: 28px; flex: 0 0 auto; }
.chw-pill b { font-size: 19px; font-weight: 800; color: var(--text); flex: 0 0 auto; }
.chw-pill .chw-sub { flex: 1; min-width: 0; font-size: 14px; color: var(--text-soft); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.chw-chip { flex: 0 0 auto; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #B47B1E; background: #F7E3BC; border-radius: 999px; padding: 6px 12px; }
html[data-theme="dark"] .chw-chip { background: #3A2F14; color: #DFA33C; }

.ch-hero { text-align: center; margin: 8px 0 22px; }
.ch-ring { position: relative; width: 214px; height: 214px; margin: 0 auto; background: none; border: 0; cursor: pointer; display: block; padding: 0; }
.ch-ring svg { width: 100%; height: 100%; transform: rotate(-90deg); display: block; }
.ch-ring-bg { fill: none; stroke: var(--lane-light); stroke-width: 12; }
.ch-ring-fg { fill: none; stroke: var(--crimson); stroke-width: 12; stroke-linecap: round; transition: stroke-dashoffset .8s cubic-bezier(.3,.7,.3,1); }
.ch-ring-center { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; pointer-events: none; }
.ch-ring-center b { font-family: var(--font-display); font-style: italic; font-size: 64px; font-weight: 800; color: var(--text); line-height: .95; }
.ch-ring-center span { font-size: 12px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--text-mute); margin-top: 7px; }
.ch-hero-eb { font-size: 12px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--text-mute); margin: 18px 0 10px; }
.ch-behind { display: inline-block; font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #7E540F; background: #F7E3BC; border-radius: 999px; padding: 7px 15px; }
html[data-theme="dark"] .ch-behind { background: #3A2F14; color: #DFA33C; }
.ch-behind.allin { color: var(--ok-ink); background: var(--ok-tint); }
.ch-hero-sub { font-size: 15.5px; color: var(--text-soft); margin: 13px 0 0; }

.ch-cards { display: flex; gap: 12px; margin-bottom: 14px; }
.ch-card { flex: 1; min-width: 0; text-align: left; background: var(--card); border: 1px solid var(--border); border-radius: 22px; box-shadow: var(--shadow-sm); padding: 17px 16px; cursor: pointer; }
.ch-card-eb { display: block; font-size: 11px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; color: var(--text-mute); }
.ch-card b { display: block; font-family: var(--font-display); font-style: italic; font-size: 31px; font-weight: 800; color: var(--text); margin-top: 9px; line-height: 1; }
.ch-amber { color: #805E13 !important; }
html[data-theme="dark"] .ch-amber { color: #D9A24A !important; }  /* #805E13 is 2.93:1 on the dark card */
.ch-card-sub { display: block; font-size: 13.5px; color: var(--text-soft); margin-top: 9px; }

.ch-ready-n { font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--crimson-ink); }
.ch-nudge { background: var(--crimson); color: #fff; border: 0; border-radius: 999px; padding: 7px 16px; font-size: 13px; font-weight: 700; cursor: pointer; box-shadow: var(--glow); }
.ch-look-av { width: 34px; height: 34px; border-radius: 50%; overflow: hidden; flex: 0 0 auto; background: var(--lane-light); display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 800; color: var(--text-soft); }
.ch-look-av img { width: 100%; height: 100%; object-fit: cover; }
.ct3-look .attn-row { display: flex; align-items: center; gap: 12px; }

/* nav minimized on Home: just the frosted circle; first tap expands */
.cnav-v2.min { max-width: 64px; width: 64px; height: 64px; left: 50%; right: auto; transform: translateX(-50%); border-radius: 50%; padding: 0; }
.cnav-v2.min .cnav-side { opacity: 0; pointer-events: none; }
.cnav-v2.min .cnav-home { background: transparent; box-shadow: none; color: var(--text); margin: 0; }
html[data-theme="dark"] .cnav-v2.min .cnav-home { color: #fff; }

/* the preview stat grammar carried to shared components on every coach page */
body.is-coach .cph2-stat b, body.is-coach .ct3-stat b { font-family: var(--font-display); font-style: italic; font-weight: 800; }
body.is-coach .coach-add-btn { border-radius: 999px; }


/* ─── v5.135.0: nav + header corrections to the preview spec ────────────── */
/* 1. bottom menu: neutral frosted home circle (not crimson), preview label size,
      subtle active pill exactly like the preview */
.cnav-v2 .cnav-home,
.cnav-v2 .cnav-home.active {
  background: rgba(28,35,51,.06);
  color: #1C2333;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7);
}
html[data-theme="dark"] .cnav-v2 .cnav-home,
html[data-theme="dark"] .cnav-v2 .cnav-home.active {
  background: rgba(255,255,255,.18);
  color: #fff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.25);
}
.cnav-v2 .cnav-l { font-size: 10px; letter-spacing: .03em; }
.cnav-v2.min .cnav-home { background: transparent; box-shadow: none; }

/* 2. headers: round back chip + soft crimson identity avatar, preview grammar */
body.is-coach .msg-back {
  width: 40px; height: 40px; flex: 0 0 auto;
  display: flex; align-items: center; justify-content: center;
  background: var(--card); border: 1px solid var(--border); border-radius: 50%;
  box-shadow: var(--shadow-sm);
  color: var(--text); font-size: 24px; padding: 0; margin-right: 4px;
}
body.is-coach .msg-back:active { background: var(--lane-light); }
body.is-coach .home-av, body.is-coach .home-av.ch-av {
  background: var(--crimson-soft); border: 0; color: var(--crimson-ink);
}
body.is-coach .home-av .home-av-ini, body.is-coach .home-av-ini { color: var(--crimson-ink); font-weight: 800; }


/* practice conditions popup (v5.135.0) */
.chw-pill { width: 100%; cursor: pointer; font-family: inherit; text-align: left; }
.chwx-back { position: fixed; inset: 0; background: rgba(12,14,20,.45); z-index: 3000; display: flex; align-items: flex-end; justify-content: center; }
.chwx { width: 100%; max-width: 476px; background: var(--card); border-radius: 26px 26px 0 0; padding: 22px 22px calc(26px + var(--safe-bottom)); position: relative; box-shadow: 0 -14px 44px rgba(8,10,16,.25); }
.chwx-x { position: absolute; top: 18px; right: 18px; background: none; border: 0; color: var(--text); cursor: pointer; padding: 6px; }
.chwx-eb { font-size: 12px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--text-mute); margin: 0 0 10px; }
.chwx-big { font-family: var(--font-display); font-style: italic; font-size: 64px; font-weight: 800; color: var(--text); text-align: center; line-height: 1; }
.chwx-band { font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--text-mute); text-align: center; margin: 10px 0 8px; }
.chwx-msg { font-size: 16px; line-height: 1.5; color: var(--text-soft); text-align: center; max-width: 320px; margin: 0 auto 8px; }
.chwx-rows { margin-top: 14px; border-top: 1px solid var(--border); }
.chwx-row { display: flex; align-items: center; justify-content: space-between; padding: 13px 2px; border-bottom: 1px solid var(--border); }
.chwx-row span { font-size: 16px; font-weight: 700; color: var(--text); }
.chwx-row b { font-size: 16px; font-weight: 700; color: var(--text); }


/* ─── v5.135.0b: readiness grid, look rows, actions pill, outline nudge ── */
.ch-actions { display: flex; align-items: center; gap: 4px; background: var(--card); border-radius: 999px; padding: 5px 10px 5px 6px; box-shadow: var(--shadow-sm); flex: 0 0 auto; }
body.is-coach .ch-actions .home-av { width: 40px; height: 40px; }

.chr-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.chr-chip { background: var(--card); border: 1px solid var(--border); border-radius: 16px; padding: 12px 4px 10px; text-align: center; cursor: pointer; box-shadow: var(--shadow-sm); }
.chr-chip b { display: block; font-size: 15px; font-weight: 800; color: var(--text); letter-spacing: .02em; }
.chr-chip.dim b { color: var(--text-mute); }
.chr-dot { display: block; width: 10px; height: 10px; border-radius: 50%; margin: 7px auto 0; background: var(--lane-light); }
.chr-dot.ok { background: #3E9B4F; }
.chr-dot.warn { background: #D9A11B; }
.chr-dot.flag { background: #B23343; }
.chr-foot { font-size: 14.5px; color: var(--text-soft); margin: 12px 2px 0; }

.ch-nudge { background: var(--card); color: var(--crimson-ink); border: 2px solid var(--crimson); border-radius: 999px; padding: 6px 18px; font-size: 14px; font-weight: 700; cursor: pointer; box-shadow: none; }
.ch-nudge:active { background: var(--crimson-soft); }

.chl-row { align-items: center; }
.ch-look-av { width: 44px; height: 44px; background: var(--crimson-soft); color: var(--crimson-ink); font-size: 14px; font-weight: 800; }
.chl-main { flex: 1; min-width: 0; display: flex; flex-direction: column; text-align: left; }
.chl-main b { font-size: 16.5px; font-weight: 800; color: var(--text); }
.chl-main span { font-size: 13.5px; color: var(--text-mute); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.chl-dot { width: 9px; height: 9px; border-radius: 50%; background: #D9A11B; flex: 0 0 auto; }


/* ─── v5.135.0c: floating header actions pill (matches the bottom menu) ──
   The greeting scrolls away with the page; only the avatar + menu stay,
   as a fixed frosted pill in the top right, same glass as the tab bar. */
body.is-coach .app-header, body.is-coach .day-header { position: static; }
.ch-actions {
  position: fixed; top: calc(10px + var(--safe-top)); right: 14px; z-index: 60;
  background: rgba(255,255,255,.38);
  -webkit-backdrop-filter: blur(22px) saturate(1.5);
  backdrop-filter: blur(22px) saturate(1.5);
  border: 1px solid rgba(255,255,255,.65);
  box-shadow: 0 8px 24px rgba(28,35,51,.14), inset 0 1px 0 rgba(255,255,255,.85);
}
html[data-theme="dark"] .ch-actions {
  background: rgba(28,30,36,.32);
  -webkit-backdrop-filter: blur(24px) saturate(1.4);
  backdrop-filter: blur(24px) saturate(1.4);
  border-color: rgba(255,255,255,.15);
  box-shadow: 0 8px 24px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.18);
}
/* keep the greeting clear of the floating pill */
body.is-coach .ch-head .coach-head-text { padding-right: 108px; }


/* ─── v5.135.0d: home bottom section (up next, highlights, next meet) ──── */
.chd-next { display: block; width: 100%; text-align: left; cursor: pointer; }
.chd-next .tile-head { display: flex; }
.chh-chev { color: var(--text-mute); font-size: 22px; font-weight: 700; line-height: 1; }
.chd-next-t { display: block; font-size: 24px; font-weight: 800; color: var(--text); letter-spacing: -.02em; }
.chd-next-s { display: block; font-size: 15.5px; color: var(--text-soft); margin-top: 6px; line-height: 1.45; }

.chh-head { width: 100%; background: none; border: 0; padding: 0; cursor: pointer; }
.chh-row { display: flex; gap: 10px; }
.chh-tile { flex: 1; min-width: 0; border: 0; border-radius: 18px; padding: 46px 12px 14px; text-align: left; cursor: pointer; color: #fff; display: flex; flex-direction: column; justify-content: flex-end; min-height: 120px; }
.chh-tile b { font-size: 13px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; line-height: 1.35; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.chh-tile span { font-size: 12.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; opacity: .92; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.chh-t0 { background: linear-gradient(150deg, #2A2A48, #1B1B33); }
.chh-t1 { background: linear-gradient(150deg, #4A1A28, #33121E); }
.chh-t2 { background: linear-gradient(150deg, #16302A, #101F22); }

.chm-card { display: block; width: 100%; border: 0; border-radius: 22px; padding: 18px; text-align: left; cursor: pointer;
  background: linear-gradient(120deg, color-mix(in srgb, var(--crimson) 82%, #000),
                              var(--crimson) 55%,
                              color-mix(in srgb, var(--crimson) 68%, #000)); color: #fff;
  box-shadow: var(--glow-lg); margin-bottom: 14px; }
.chm-card > span { display: flex; align-items: center; gap: 12px; }
.chm-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.chm-eb { font-size: 11px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; color: rgba(255,255,255,.85); }
.chm-main b { font-size: 23px; font-weight: 800; letter-spacing: -.01em; margin-top: 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.chm-sub { font-size: 14px; color: rgba(255,255,255,.85); margin-top: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.chm-days { flex: 0 0 auto; text-align: center; }
.chm-days b { display: block; font-family: var(--font-display); font-style: italic; font-size: 44px; font-weight: 800; line-height: 1; }
.chm-days span { display: block; font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: rgba(255,255,255,.85); margin-top: 2px; }


/* ─── v5.135.0e: attendance modal to the preview spec ───────────────────── */
.att-modal { position: relative; }
.attx { position: absolute; top: 16px; right: 16px; background: none; border: 0; color: var(--text); cursor: pointer; padding: 6px; z-index: 2; }
.attx-eb { font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--text-mute); margin: 2px 40px 2px 0; }
body.is-coach .att-allhere { background: var(--card); color: var(--crimson-ink); border: 2px solid var(--crimson); border-radius: 999px; font-weight: 700; }
body.is-coach .att-btn { border-radius: 999px; border: 1px solid var(--border); background: var(--card); color: var(--text-soft); font-weight: 700; }
body.is-coach .att-btn.on { color: #fff; border-color: transparent; }
body.is-coach .att-here.on { background: #3E9B4F; }
body.is-coach .att-late.on { background: #D9A11B; }
body.is-coach .att-out.on { background: #6E7480; }
body.is-coach .att-save { background: var(--crimson) !important; color: #fff !important; border-radius: 18px; padding: 16px; font-size: 17px; font-weight: 800; box-shadow: var(--glow); width: 100%; }


/* v5.136.0: events calendar cells for the ported Events tab */
.pvx .cal7 .c7 { position: relative; aspect-ratio: 1; display: flex; align-items: center; justify-content: center; border-radius: 9px; font-size: 13.5px; font-weight: 600; color: var(--text); }
.pvx .cal7 .c7.meet { background: var(--crimson); color: #fff; }
.pvx .cal7 .c7.today { box-shadow: inset 0 0 0 2px var(--text-mute); }
.pvx .cal7 .c7 .c7-dot { position: absolute; bottom: 4px; left: 50%; transform: translateX(-50%); width: 5px; height: 5px; border-radius: 50%; background: var(--crimson); opacity: .55; }
.pvx .icon-dot.hidden { display: none; }


/* v5.139.0: season glance bars for the ported overview */
.pvx .sgv-wrap { display: flex; align-items: flex-end; gap: 3px; height: 96px; margin-top: 10px; }
.pvx .sgv-col { flex: 1; position: relative; display: flex; align-items: flex-end; justify-content: center; }
.pvx .sgv-bar { width: 100%; border-radius: 3px 3px 0 0; background: var(--lane-light); }
.pvx .sgv-col.now .sgv-bar { background: var(--crimson); }
.pvx .sgv-col.deload .sgv-bar { opacity: .55; }
.pvx .sgv-col .sg-T { position: absolute; top: -14px; font-size: 9px; font-weight: 800; color: var(--crimson-ink); }
.pvx .sgv-col .sg-star { position: absolute; top: -16px; font-size: 11px; color: #8E6811; }
html[data-theme="dark"] .pvx .sgv-col .sg-star { color: #D9A11B; }  /* 5.36:1 on the dark card */


/* ─── PUNCH v5.140.0 ─────────────────────────────────────────────────────── */
/* 1. one canvas color everywhere */
body.is-coach, body.is-coach .day-screen, body.is-coach .page-body,
body.is-coach .app-header, body.is-coach .day-header { background: var(--bg); }

/* 2. content clears the status bar on every ported screen */
.pvx .page-body { padding-top: calc(12px + var(--safe-top)); }
body.is-coach .ch-head { padding-top: calc(14px + var(--safe-top)); }

/* 6. actions pill: invisible until you scroll; everything eases */
.ch-actions { background: transparent; border-color: transparent; box-shadow: none;
  transition: background .3s ease, border-color .3s ease, box-shadow .3s ease; }
.ch-actions.scrolled { background: rgba(255,255,255,.38);
  -webkit-backdrop-filter: blur(22px) saturate(1.5); backdrop-filter: blur(22px) saturate(1.5);
  border-color: rgba(255,255,255,.65);
  box-shadow: 0 8px 24px rgba(28,35,51,.14), inset 0 1px 0 rgba(255,255,255,.85); }
html[data-theme="dark"] .ch-actions { background: transparent; border-color: transparent; box-shadow: none; }
html[data-theme="dark"] .ch-actions.scrolled { background: rgba(28,30,36,.32); border-color: rgba(255,255,255,.15);
  box-shadow: 0 8px 24px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.18); }
.coach-bottom-nav.cnav-v2 { overflow: hidden;
  transition: max-width .45s cubic-bezier(.4,0,.2,1), height .45s cubic-bezier(.4,0,.2,1), border-radius .45s cubic-bezier(.4,0,.2,1), padding .45s cubic-bezier(.4,0,.2,1); }
.cnav-v2 .cnav-side { transition: opacity .25s ease .1s; }
.cnav-v2.min .cnav-side { opacity: 0; pointer-events: none; transition: opacity .18s ease; }
.cnav-v2.min { max-width: 64px; height: 64px; border-radius: 50%; padding: 0; }

/* 8. events calendar: clean grid, aligned dots, clear legend */
.pvx .cal-head7 { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; text-align: center;
  font-size: 11px; font-weight: 700; letter-spacing: .06em; color: var(--text-mute); margin-bottom: 6px; }
.pvx .cal7 { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
.pvx .cal7 > span { aspect-ratio: 1; display: flex; align-items: center; justify-content: center;
  position: relative; border-radius: 10px; font-size: 13.5px; font-weight: 600; color: var(--text);
  background: none; box-shadow: none; }
.pvx .cal7 > span.meet { background: var(--crimson); color: #fff; }
.pvx .cal7 > span.today { box-shadow: inset 0 0 0 2px var(--text-mute); }
.pvx .cal7 > span .c7-dot { position: absolute; bottom: 5px; left: 50%; transform: translateX(-50%);
  width: 5px; height: 5px; border-radius: 50%; background: var(--crimson); opacity: .55; }
.pvx .cal-legend { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center;
  margin-top: 14px; font-size: 12px; color: var(--text-mute); position: static; }
.pvx .cal-legend > span { display: inline-flex; align-items: center; gap: 6px; }

/* 9. add meet sheet */
.par-sheet .am-x { position: absolute; top: 16px; right: 16px; background: none; border: 0; color: var(--text); cursor: pointer; padding: 6px; z-index: 2; }
.pvx .field-in, .par-sheet .pvx .field-in { width: 100%; box-sizing: border-box; background: var(--card);
  border: 1px solid var(--border); border-radius: 14px; padding: 13px 14px; font: inherit; font-size: 16px; color: var(--text); }
.par-sheet .pvx select.field-in { appearance: none; -webkit-appearance: none; }
.par-sheet .pvx .btn { display: block; width: 100%; background: var(--crimson); color: #fff; border: 0;
  border-radius: 16px; padding: 16px; font-size: 17px; font-weight: 700; cursor: pointer;
  box-shadow: var(--glow); }
.par-sheet .am-del { display: block; width: 100%; background: none; border: 0; color: var(--crimson-ink);
  font-size: 14px; font-weight: 700; margin-top: 12px; cursor: pointer; }

/* 7. settings hero spacing */
.pv-settings .prof-hero { text-align: center; margin-bottom: 16px; }


/* ─── PUNCH2 v5.141.0 ────────────────────────────────────────────────────── */
/* 1. only one thing selected: the home circle is plain unless Home is active */
.cnav-v2 .cnav-home { background: transparent; box-shadow: none; color: #1C2333; }
.cnav-v2 .cnav-home.active { background: rgba(28,35,51,.09); box-shadow: inset 0 1px 0 rgba(255,255,255,.7); }
html[data-theme="dark"] .cnav-v2 .cnav-home { background: transparent; box-shadow: none; color: #fff; }
html[data-theme="dark"] .cnav-v2 .cnav-home.active { background: rgba(255,255,255,.22); box-shadow: inset 0 1px 0 rgba(255,255,255,.25); }
.cnav-v2.min .cnav-home, html[data-theme="dark"] .cnav-v2.min .cnav-home { background: transparent; box-shadow: none; }

/* 3. session play buttons */
.pvx .play-btn { display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; border-radius: 50%; background: var(--tint); color: var(--accent);
  margin-right: 10px; flex: 0 0 auto; vertical-align: -5px; }
.pvx .line-name { display: inline-flex; align-items: center; min-width: 0; }

/* 4. motion matched to the approved design: slower, eased, everywhere */
.coach-bottom-nav.cnav-v2 {
  transition: max-width .5s cubic-bezier(.3,.7,.3,1), height .5s cubic-bezier(.3,.7,.3,1),
              border-radius .5s cubic-bezier(.3,.7,.3,1), padding .5s cubic-bezier(.3,.7,.3,1); }
.cnav-v2 .cnav-side { transition: opacity .32s ease .12s; }
.cnav-v2.min .cnav-side { transition: opacity .22s ease; }
.cnav-v2 .cnav-item { transition: background .28s ease, color .28s ease; }
.ch-actions { transition: background .38s ease, border-color .38s ease, box-shadow .38s ease; }
body.is-coach .par-sheet-back { transition: opacity .4s ease; }
body.is-coach .par-sheet { transition: transform .5s cubic-bezier(.3,.7,.3,1); }
@keyframes pvTabIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.pvx .page-body { animation: pvTabIn .42s cubic-bezier(.3,.7,.3,1); }


/* hist v5.141: safe area floor + pager dash active state */
.pvx .page-body { padding-top: max(calc(12px + var(--safe-top)), 26px); }
.pvx .ch-dash.on { background: var(--crimson); }


/* ─── PUNCH3 v5.142.0 ────────────────────────────────────────────────────── */
.chm-card[hidden] { display: none !important; }
.chr-chip { padding: 13px 4px 14px; }
.chr-dot { margin: 8px auto 0; }
html[data-theme="dark"] .attn-row, html[data-theme="dark"] .cm-row { border-bottom-color: var(--border-soft); }
.par-sheet .cmx { position: absolute; top: 18px; right: 18px; background: none; border: 0; color: var(--text); cursor: pointer; padding: 6px; z-index: 2; }
.cm-row { font-size: 17px; font-weight: 700; padding: 17px 2px; }
.cm-end { margin-left: auto; display: inline-flex; align-items: center; gap: 10px; }
.cm-cur { font-size: 12px; font-weight: 700; letter-spacing: .1em; color: var(--text-mute); }
.cm-chev { font-size: 22px; font-weight: 700; color: var(--text-mute); line-height: 1; }
.cm-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--crimson); display: inline-block; }
.cm-dot.hidden { display: none; }


/* v5.143.0: practice conditions popup eases in slowly; warm up expanders */
.chwx-anim { opacity: 0; transition: opacity .45s ease; }
.chwx-anim .chwx { transform: translateY(46px); opacity: .4; transition: transform .55s cubic-bezier(.3,.7,.3,1), opacity .45s ease; }
.chwx-anim.in { opacity: 1; }
.chwx-anim.in .chwx { transform: none; opacity: 1; }
.pvx .wu-chev { display: inline-block; transition: transform .25s ease; color: var(--sub-ink); }
.pvx .wu-chev.open { transform: rotate(180deg); }
.pvx .wu-items .wu-sub { padding: 8px 0 8px 32px; border-top: 1px solid var(--border-soft); }

/* ─── PUNCH5 v5.144.0: session accordions + Edit Session pvx skin ────────── */
.pvx .pv-acc-head { display: flex; align-items: center; justify-content: space-between; width: 100%; background: none; border: 0; padding: 0; margin: 0; cursor: pointer; font-family: inherit; text-align: left; }
.pvx .pv-acc-body { margin-top: 4px; }
.pvx .pv-acc-body[hidden] { display: none; }
.pvx .wu-num { display: inline-block; min-width: 24px; color: var(--sub-ink); font-weight: 700; font-size: 14px; }
.pvx .line-row .wu-chev { font-size: 16px; line-height: 1; }
.pvx .wu-items .wu-stepnote { padding: 10px 0 2px 32px; font-size: 13.5px; color: var(--sub-ink); }
/* Edit Session: tiles carry the new design look */
.pvx .pe-sec { border-radius: 16px; border: 0.5px solid var(--line); background: var(--card); box-shadow: var(--shadow); }
.pvx .pe-sec-t { font-size: 15px; font-weight: 700; color: var(--ink); }
.pvx .pe-sec-sum { color: var(--sub-ink); }
.pvx .pe-sec-chev { color: var(--sub-ink); transition: transform .3s cubic-bezier(.3,.7,.3,1); }
.pvx .pe-sec.open .pe-sec-chev { transform: rotate(180deg); }
.pvx .pe-add { border: 1px dashed var(--line); color: var(--sub-ink); background: none; }
.pvx .pe-savebar { margin: 4px -14px calc(-24px - env(safe-area-inset-bottom, 0px)); padding: 10px 14px calc(14px + env(safe-area-inset-bottom, 0px)); background: linear-gradient(180deg, rgba(0,0,0,0) 0%, var(--lane-light) 32%); }
.pvx .pe-savebar .pe-save { background: var(--accent) !important; border-color: var(--accent) !important; color: #fff; border-radius: 16px; padding: 16px; font-size: 16px; font-weight: 700; box-shadow: var(--glow); transition: transform .15s ease; }
.pvx .pe-savebar .pe-save:active { transform: scale(.98); }

/* ─── PUNCH6 v5.145.0: warm up chips, block detail toggles, dose under name ─ */
.pvx .wu-meta { padding: 8px 0 4px 30px; }
.pvx .wu-chip { display: inline-block; background: var(--chart-off); color: var(--sub-ink); font-size: 12.5px; font-weight: 700; border-radius: 999px; padding: 5px 11px; }
.pvx .line-under { font-size: 13.5px; font-weight: 600; color: var(--sub-ink); margin-top: 3px; padding-left: 30px; }
.pvx .block-end { display: inline-flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.pvx .block-sub[hidden] { display: none; }
.pvx .block-row[data-acc-row] .block-sub { margin-top: 4px; }

/* ─── PUNCH7 v5.146.0: profile Edit outline, look-dot spacing ────────────── */
body.is-coach .pvx .fbtn.out { background: transparent !important; color: var(--crimson-ink) !important; box-shadow: none !important; }
.chl-row .chl-dot { margin-right: 6px; }

/* ─── PUNCH8 v5.147.0 ────────────────────────────────────────────────────── */
/* heat chip when conditions are fine: quiet, informative */
.chw-chip.chw-hi { background: var(--lane-light); color: var(--text-mute); }
/* readiness scores */
.chr-score { display: block; font-size: 15px; font-weight: 800; color: var(--text-mute); margin-top: 6px; }
/* needs a look tap card */
.ch-look-sub { display: block; text-align: left; font-size: 13.5px; color: var(--text-mute); margin-top: 8px; }
/* Working Class radios */
.rdo { width: 22px; height: 22px; border-radius: 50%; border: 2px solid var(--border); display: inline-block; position: relative; flex: 0 0 auto; }
.rdo.on { border-color: var(--crimson); }
.rdo.on::after { content: ""; position: absolute; inset: 4px; border-radius: 50%; background: var(--crimson); }
/* messages: carded conversations */
.pvx .pv-conv { display: flex; flex-direction: column; gap: 10px; margin-bottom: 8px; }
.pvx .pv-conv .conv-row { background: var(--card); border: 0.5px solid var(--border); border-radius: 18px; padding: 14px; box-shadow: var(--shadow-sm); }
.pvx .pv-conv .msg-loading { color: var(--text-mute); padding: 8px 2px; }
/* team color sheet */
.tc-grid { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 10px; }
.tc-swatch { background: var(--card); border: 1.5px solid var(--border); border-radius: 14px; padding: 12px 4px 10px; cursor: pointer; font-family: inherit; display: flex; flex-direction: column; align-items: center; gap: 7px; font-size: 12px; font-weight: 700; color: var(--text); }
.tc-swatch.on { border-color: var(--crimson); box-shadow: 0 0 0 3px var(--crimson-soft); }
.tc-dot { width: 22px; height: 22px; border-radius: 50%; display: inline-block; }
.tc-dot.sm { width: 12px; height: 12px; }
/* sheets and modals live on card tokens: navy chrome retired */
.par-sheet { background: var(--card) !important; color: var(--text); }
.par-sheet .par-sheet-h, .sheet-dark .par-sheet-h { color: var(--text); }
.par-sheet.sheet-dark, .auth-sheet.sheet-dark { background: var(--card) !important; color: var(--text) !important; }
.auth-sheet.sheet-dark .auth-sheet-title, .auth-sheet.sheet-dark .role-card-t { color: var(--text); }
.auth-sheet.sheet-dark .role-card { background: var(--lane-light); }
.auth-sheet.sheet-dark .role-card-s { color: var(--text-mute); }

/* ─── STANDARD PASS v5.149.0: one design system for every coach surface ──── */
/* type standard: any legacy header reads in the display voice */
body.is-coach .screen-name { font-family: var(--font-display); font-style: italic; text-transform: uppercase; letter-spacing: .01em; }
body.is-coach .date-meta-line { font-size: 11px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: var(--text-mute); }
/* motion standard: every coach page opens the same way */
body.is-coach .day-screen .page-body { animation: pvTabIn .42s cubic-bezier(.3,.7,.3,1); }
/* legacy bottom sheets join the popup standard */
body.is-coach .sheet-over { background: rgba(8,10,14,.45); }
body.is-coach .sheet-in { background: var(--card) !important; color: var(--text); border-radius: 22px 22px 0 0; animation: pvSheetUp .5s cubic-bezier(.3,.7,.3,1); }
@keyframes pvSheetUp { from { transform: translateY(46px); opacity: .4; } to { transform: none; opacity: 1; } }
body.is-coach .sheet-h { color: var(--text-mute); font-size: 11.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
body.is-coach .sheet-in .srow { background: var(--lane-light); color: var(--text); border: 0.5px solid var(--border); border-radius: 14px; }
body.is-coach .sheet-in .srow small { color: var(--text-mute); }
body.is-coach .pick-row { background: var(--lane-light) !important; color: var(--text) !important; border: 0.5px solid var(--border) !important; border-radius: 14px; }
body.is-coach .pick-row .pick-sub, body.is-coach .pick-row b { color: var(--text) !important; }
body.is-coach .pick-row .pick-sub { color: var(--text-mute) !important; font-weight: 500; }
body.is-coach .rest-chips button { background: var(--lane-light); color: var(--text); border: 1px solid var(--border); }
body.is-coach .rest-chips button.on { background: var(--crimson); color: #fff; border-color: var(--crimson); }
/* pace calculator on card tokens: the navy hero retires */
body.is-coach .pc-result { background: var(--card) !important; border: 0.5px solid var(--border); border-radius: 20px; box-shadow: var(--shadow-sm); color: var(--text) !important; }
body.is-coach .pc-result-time { color: var(--crimson-ink) !important; }
body.is-coach .pc-result-sub { color: var(--text-mute) !important; }
body.is-coach .pc-label { color: var(--text-mute); font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
body.is-coach .day-screen .pc-pill { background: var(--card); border: 1px solid var(--border); color: var(--text); }
/* old day view pieces read as standard cards inside pvx */
.pvx .day-acc { background: var(--card); border: 0.5px solid var(--border); border-radius: 20px; box-shadow: var(--shadow-sm); }
.pvx .day-acc-title { font-size: 15px; font-weight: 700; color: var(--text); }
.pvx .day-weekline { display: none; }
.pvx .coach-week-link { background: var(--card); border: 0.5px solid var(--border); border-radius: 16px; box-shadow: var(--shadow-sm); }
.pvx .coach-cal { margin: 4px 0 14px; }
/* legacy form buttons in pvx shells go full standard */
.pvx .pe-save, .pvx .set-pw-save { display: block; width: 100%; border-radius: 16px; padding: 16px; font-size: 16px; }

/* ─── PUNCH10 v5.150.0 ───────────────────────────────────────────────────── */
/* popup standard: X only, no grab handles anywhere */
.par-sheet-grab, .att-grab, .sheet-grabber { display: none !important; }
.par-sheet { padding-top: 16px; }
/* bottom nav closes on the same curve it opens */
.coach-bottom-nav.cnav-v2 { transition: max-width .55s cubic-bezier(.3,.7,.3,1), width .55s cubic-bezier(.3,.7,.3,1), height .55s cubic-bezier(.3,.7,.3,1), border-radius .55s cubic-bezier(.3,.7,.3,1), padding .55s cubic-bezier(.3,.7,.3,1), left .55s cubic-bezier(.3,.7,.3,1), transform .55s cubic-bezier(.3,.7,.3,1); }
.cnav-v2 .cnav-side { transition: opacity .32s ease .14s; }
.cnav-v2.min .cnav-side { transition: opacity .22s ease; }
/* needs a look stands out */
.ch-lookcard { border: 1px solid color-mix(in srgb, var(--crimson) 40%, transparent) !important; background: linear-gradient(180deg, var(--crimson-soft), var(--card) 62%) !important; }
.ch-lookcard .section-label { color: var(--crimson-ink); font-weight: 800; }
.ch-lookcard .chh-chev { color: var(--crimson-ink); }
.ch-lookcard .ch-look-sub { color: var(--text); font-weight: 600; }
/* add athlete sheet polish */
.aa-sheet { position: relative; }
.aa-sheet .cmx { position: absolute; top: 16px; right: 16px; background: none; border: 0; color: var(--text); cursor: pointer; padding: 6px; z-index: 2; }
.aa-sheet .modal-field label { font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--text-mute); }
.aa-sheet input, .aa-sheet select { background: var(--lane-light); border: 0.5px solid var(--border); color: var(--text); border-radius: 12px; }
/* report tuning */
.rp-none { font-size: 12px; color: #667; margin: 4px 0 10px; }

/* ─── PUNCH11 v5.151.0 ───────────────────────────────────────────────────── */
/* 7: back buttons = plain chevron, no circle highlight */
.pvx .push > .back, .pvx .push > .home-top .back,
html[data-theme="dark"] .pvx .hdr-glass .push > .back,
html[data-theme="dark"] .pvx .hdr-glass .push > .home-top .back {
  background: none !important; border-color: transparent !important; box-shadow: none !important;
  -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
}
/* popup standard: everything opens like the weather popup (fade + slide) */
.modal-backdrop { animation: pvFadeIn .45s ease; }
.modal-backdrop .modal { animation: pvSheetUp .55s cubic-bezier(.3,.7,.3,1); }
@keyframes pvFadeIn { from { opacity: 0; } to { opacity: 1; } }
body.is-coach .par-sheet { transition: transform .55s cubic-bezier(.3,.7,.3,1); }
body.is-coach .par-sheet-back { transition: opacity .45s ease, visibility .45s ease; }
/* 12: calendar legend clearly below the grid */
.pvx .cal-legend { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--border-soft); justify-content: center; }
/* 14: class setup progress reads as one solid line */
.prog-seg { gap: 0; border-radius: 99px; overflow: hidden; }
.prog-seg i { border-radius: 0; }
/* 15: switcher radios right aligned, centered */
.cm-row .rdo { margin-left: auto; }
/* 16: class detail season strip scrolls instead of clipping */
.pvx .peri { overflow-x: auto; padding-bottom: 6px; scrollbar-width: none; }
.pvx .peri::-webkit-scrollbar { display: none; }
.pvx .peri-seg { min-width: 84px; flex-shrink: 0; }
/* 18: attendance controls on the standard */
.att-modal .att-allhere { background: var(--crimson) !important; border: 0 !important; color: #fff !important; border-radius: 999px; font-weight: 700; }
.att-modal .att-filter { background: var(--lane-light); border-radius: 999px; padding: 3px; display: inline-flex; }
.att-modal .att-fbtn { border-radius: 999px; padding: 8px 14px; color: var(--text-mute); }
.att-modal .att-fbtn.on { background: var(--crimson) !important; color: #fff !important; }
/* 11: Add a Meet fields uniform */
.pvx .field-in { width: 100%; min-height: 46px; background: var(--lane-light); border: 0.5px solid var(--border); color: var(--text); border-radius: 12px; padding: 11px 12px; font-size: 15px; font-family: inherit; }
/* Edit Session cleanup: tiles in the lbl voice, canvas-true savebar */
.pvx .pe-sec-t { font-family: var(--font-body, inherit); font-style: normal; text-transform: uppercase; font-size: 12px; font-weight: 800; letter-spacing: .08em; color: var(--text); }
.pvx .pe-sec-sum { font-size: 12.5px; }
.pvx .pe-body { gap: 12px; }
.pvx .pe-body > .back { position: sticky; top: 6px; z-index: 30; }
.pvx .pe-sec .pe-block { padding: 12px !important; border-radius: 14px; }
.pvx .pe-block .pe-f > span, .pvx .pe-cell > span { font-size: 10px; letter-spacing: .08em; }
.pvx .pe-details-btn { color: var(--crimson-ink); font-weight: 700; background: none; border: 0; }
.pvx .pe-savebar { background: linear-gradient(180deg, rgba(0,0,0,0) 0%, var(--bg) 40%); }

/* ─── PUNCH12 v5.152.0: play icons right column, dose under the name ─────── */
.pvx .line-row > .play-btn { margin: 0 0 0 12px; flex: 0 0 auto; }
.pvx .line-under { padding-left: 0; }
.pvx .block-sub { margin-top: 4px; }

/* ─── PUNCH13 v5.153.0: events page fixes ────────────────────────────────── */
.pvx .cal-key { display: flex; justify-content: center; gap: 22px; margin-top: 16px; padding-top: 13px; border-top: 1px solid var(--border-soft); font-size: 11.5px; font-weight: 600; color: var(--text-mute); }
.pvx .cal-key span { display: inline-flex; align-items: center; gap: 6px; }
.pvx .cal-key i { display: inline-block; flex: 0 0 auto; }
.pvx .ck-meet { width: 10px; height: 10px; border-radius: 3px; background: var(--crimson); }
.pvx .ck-train { width: 5px; height: 5px; border-radius: 50%; background: var(--crimson); opacity: .55; }
.pvx .ck-today { width: 10px; height: 10px; border-radius: 3px; box-shadow: inset 0 0 0 2px var(--text-mute); }
.pvx .cal7 .c7, .pvx .cal7 > span { min-height: 40px; max-height: 50px; }
.pvx .cal7 { margin-bottom: 2px; }
/* add a meet: identical fields, real halves */
.pvx .am-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
.pvx .am-grid2 > div { min-width: 0; }
.pvx .field-in { -webkit-appearance: none; appearance: none; min-width: 0; }
.pvx input.field-in[type="date"], .pvx input.field-in[type="time"] { line-height: 1.2; }

/* ─── PUNCH14 v5.154.0 ───────────────────────────────────────────────────── */
/* 1: nav contracts INTO the home circle: both states share the center anchor */
.coach-bottom-nav.cnav-v2 { left: 50% !important; right: auto !important; transform: translateX(-50%); width: calc(100% - 24px); max-width: 452px; overflow: hidden; }
.cnav-v2.min { width: 64px !important; max-width: 64px !important; }
/* 2: meet days always win over legacy .meet rules */
.pvx .cal7 .c7.meet, .pvx .cal7 > span.meet { background: var(--crimson) !important; color: #fff !important; display: flex; padding: 0; margin: 0; border: 0; }
.pvx .cal7 .c7.meet .c7-dot { background: #fff; }
/* 4: results block on tokens inside the meet page */
.pvx .mr-head { font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--text-mute); margin-bottom: 10px; }
.pvx #pv-meet-results input, .pvx #pv-meet-results select { background: var(--lane-light); border: 0.5px solid var(--border); color: var(--text); border-radius: 10px; padding: 9px 10px; font: inherit; }
.pvx #pv-meet-results .mr-status { font-size: 12.5px; margin-top: 8px; color: var(--text-mute); }
.pvx #pv-meet-results .mr-status.ok { color: #2E9E5B; }
.pvx #pv-meet-results .mr-status.err { color: var(--crimson-ink); }
/* 5: the pill is the same glass everywhere */
.pv-acts { z-index: 70; }

/* ─── V2 PARITY v5.155.0: chart pager, overview fill, pace look ──────────── */
.pvx .pace-time { font-family: var(--font-display); font-style: italic; font-size: 62px; font-weight: 700; letter-spacing: 0; color: var(--ink); line-height: 1; }
.pvx .pill-scroll { display: flex; gap: 8px; overflow-x: auto; padding: 2px 2px 10px; scrollbar-width: none; margin-bottom: 8px; }
.pvx .pill-scroll::-webkit-scrollbar { display: none; }
.pvx .pill-scroll .pill { flex: 0 0 auto; }
.pvx .sgv-bar.sgv-plan { position: relative; background: var(--crimson-soft); overflow: hidden; }
.pvx .sgv-bar.sgv-plan .sgv-act { position: absolute; left: 0; right: 0; bottom: 0; display: block; background: var(--crimson); border-radius: inherit; }
.pvx .sgv-col.deload .sgv-bar.sgv-plan { opacity: .55; }

/* ============================================================================
   v5.156.0 LOADING KIT  (Bayardo approved: B staggered heat + D skeleton)

   THEY ARE NEVER SHOWN TOGETHER. One screen, one loading form:
     .ft-lanes  LOGIN ONLY. The boot moment, after sign in, full screen.
     .ft-skel   EVERY OTHER SECTION. Lists and cards filling in.
   If you ever find both on screen at once, that is the bug.

   Tokens only, .55s weather curve, reduced motion aware.
   Pacing: deliberately unhurried. A loading state that sprints reads as
   anxious, and these loop for as long as the network takes.
   ========================================================================= */
.ft-lanes { display:flex; flex-direction:column; gap:9px; width:100%; max-width:260px; margin:0 auto; }
.ft-lanes i { display:block; height:6px; border-radius:99px; background:var(--lane-light);
  overflow:hidden; position:relative; }
.ft-lanes i::after { content:""; position:absolute; top:0; bottom:0; left:0; width:30%;
  border-radius:99px; background:var(--crimson);
  animation:ftLaneSweep 2.2s cubic-bezier(.3,.7,.3,1) infinite; }
.ft-lanes i:nth-child(2)::after { animation-delay:.26s; opacity:.72; }
.ft-lanes i:nth-child(3)::after { animation-delay:.52s; opacity:.46; }
@keyframes ftLaneSweep { 0% { transform:translateX(-110%); } 100% { transform:translateX(400%); } }

.ft-skel .ft-sk { background:var(--card); border:1px solid var(--border); border-radius:16px;
  padding:14px; margin-bottom:10px; }
.ft-skel .ft-sk b { display:block; height:10px; border-radius:6px; background:var(--lane-light);
  position:relative; overflow:hidden; }
.ft-skel .ft-sk b + b { margin-top:9px; }
.ft-skel .ft-sk b::after { content:""; position:absolute; inset:0; transform:translateX(-100%);
  background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--crimson) 13%, transparent), transparent);
  animation:ftSkShimmer 2.4s cubic-bezier(.3,.7,.3,1) infinite; }
@keyframes ftSkShimmer { 100% { transform:translateX(100%); } }

/* Looping motion is a genuine accessibility problem for some users, and Apple
   expects this to be honoured. Slow rather than stop, so it still reads as busy. */
@media (prefers-reduced-motion: reduce) {
  .ft-lanes i::after   { animation-duration:3.4s; }
  .ft-skel .ft-sk b::after { animation-duration:3.6s; }
}