/* Pilot layout additions. Preserve the existing CB Fitness colour palette. */
:root {
  color-scheme: dark;
}
body {
  font-size: 14px;
  line-height: 1.5;
}
button,
input,
select,
textarea {
  font: inherit;
}
button {
  cursor: pointer;
  min-height: 42px;
}
button:disabled {
  cursor: wait;
  opacity: 0.6;
}
:focus-visible {
  outline: 2px solid var(--lime, #e8c875);
  outline-offset: 3px;
}
input,
select,
textarea {
  min-height: 44px;
  max-width: 100%;
}
.stack {
  display: grid;
  gap: 16px;
}
.head h1 {
  overflow-wrap: anywhere;
}
.clientSelect {
  min-width: 220px;
  max-width: 300px;
  font-size: 12px;
}
.clientSelect select {
  margin-top: 4px;
}
.roster {
  display: grid;
  gap: 8px;
}
.rosterRow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px;
  text-align: left;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel);
  color: var(--text);
  width: 100%;
}
.rosterRow span {
  font-size: 12px;
  color: var(--muted);
}
.buttonRow {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
}
.moreDialog {
  width: min(460px, calc(100% - 28px));
  max-height: 85dvh;
  border: 1px solid var(--line);
  background: #11161b;
  color: var(--text);
  border-radius: 18px;
  padding: 20px;
}
.moreDialog::backdrop {
  background: #030507bd;
  backdrop-filter: blur(5px);
}
.moreLinks {
  display: grid;
  gap: 8px;
}
.pilotFooter {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  color: var(--muted);
  font-size: 11px;
  margin: 28px 0 10px;
}
fieldset {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 14px;
  min-width: 0;
}
legend {
  padding: 0 6px;
  color: var(--muted);
}
.dayChoices {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.dayChoices label,
.toggle {
  display: flex;
  gap: 10px;
  align-items: center;
}
input[type="checkbox"] {
  accent-color: var(--lime);
  width: 20px;
  min-height: 20px;
  flex-shrink: 0;
}
.reviewConfirm {
  margin: 20px 0;
}
.prescription {
  display: grid;
  gap: 3px;
  border-bottom: 1px solid var(--line);
  padding: 10px 0;
}
.prescription span,
.prescription small {
  color: var(--muted);
  font-size: 12px;
}
.mealDay {
  border-bottom: 1px solid var(--line);
  padding: 10px 0;
}
.macroLine {
  font-size: 12px;
  color: var(--lime);
}
.meal {
  grid-template-columns: 65px minmax(0, 1fr) auto;
  min-width: 0;
}
.meal details {
  margin-top: 8px;
  font-size: 12px;
  white-space: pre-line;
}
.shoppingItems {
  display: grid;
  gap: 8px;
}
.shoppingItem {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border-bottom: 1px solid var(--line);
}
.shoppingItem small,
.foodLog small {
  display: block;
  color: var(--muted);
}
.dailyTasks {
  display: grid;
  gap: 10px;
  margin: 20px 0;
}
.foodLog {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
}
.historyRows {
  display: grid;
  gap: 6px;
  margin-top: 16px;
}
.historyRows > div {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  border-bottom: 1px solid var(--line);
  padding: 10px 0;
}
.historyRows span {
  font-size: 12px;
  color: var(--muted);
}
.chartBars .bar small {
  position: absolute;
  bottom: -24px;
  left: 0;
  font-size: 9px;
}
.restTimer {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 20;
  padding: 14px;
  background: #1a222a;
  border: 1px solid var(--lime);
  border-radius: 14px;
  box-shadow: 0 8px 32px #0008;
}
.restTimer[hidden] {
  display: none;
}
.aiAnalysis {
  border-top: 1px solid var(--line);
  margin-top: 20px;
  padding-top: 20px;
}
.aiAnalysis li {
  margin-bottom: 14px;
}
.aiAnalysis p {
  margin: 6px 0;
}
.notice ul {
  margin-bottom: 0;
}
.action {
  min-width: 0;
}
.action > div {
  min-width: 0;
}
.authCard {
  max-width: 480px;
}
.authCard h1 {
  margin-top: 24px;
}
.workout .set {
  grid-template-columns: 34px minmax(82px, 1fr) minmax(92px, 1.15fr) minmax(62px, 0.8fr) minmax(62px, 0.8fr) minmax(52px, 0.65fr) 72px;
  gap: 7px;
}
.workout .set input {
  width: 100%;
  min-width: 0;
}
.workout .set .suggest {
  white-space: normal;
  line-height: 1.25;
}
@media (max-width: 980px) {
  .mobileNav {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    padding-bottom: max(8px, env(safe-area-inset-bottom));
    gap: 2px;
  }
  .mobileNav button {
    font-size: 11px;
    min-height: 48px;
    padding: 8px 3px;
  }
  .main {
    padding-bottom: 100px;
  }
  .head {
    flex-wrap: wrap;
  }
  .clientSelect {
    width: 100%;
    max-width: none;
  }
  .pilotFooter {
    margin-top: 24px;
  }
  .rosterRow {
    flex-wrap: wrap;
  }
  .moreDialog {
    margin: auto auto 90px;
  }
  .workout {
    padding-bottom: 50px;
  }
}
@media (max-width: 640px) {
  .formGrid {
    grid-template-columns: 1fr 1fr;
  }
  .formGrid .span3,
  .formGrid .span2 {
    grid-column: 1/-1;
  }
  .formGrid label {
    min-width: 0;
  }
  .metrics {
    grid-template-columns: 1fr 1fr;
  }
  .action {
    flex-wrap: wrap;
  }
  .actionBtns {
    width: 100%;
  }
  .historyRows > div {
    flex-wrap: wrap;
  }
  .workout .exercise {
    overflow-x: auto;
  }
  .workout .set {
    min-width: 650px;
    grid-template-columns: 30px 78px 88px 66px 66px 52px 68px;
    gap: 5px;
  }
  .workout .set input {
    padding: 9px 4px;
    font-size: 15px;
  }
  .workout .set button {
    padding: 7px 4px;
    font-size: 11px;
  }
  .workout .exHead,
  .workTop {
    flex-wrap: wrap;
  }
  .restTimer {
    left: 14px;
    right: 14px;
    bottom: 14px;
  }
  .meal {
    grid-template-columns: 50px minmax(0, 1fr) auto;
    gap: 8px;
  }
  .meal small {
    font-size: 11px;
  }
  .shoppingItem {
    font-size: 12px;
  }
  .card h2 {
    overflow-wrap: anywhere;
  }
}

.twEx {
  grid-template-columns: minmax(160px, 1.6fr) repeat(
      3,
      minmax(60px, 0.55fr)
    ) minmax(100px, 0.8fr);
  flex-wrap: wrap;
}
.twHide {
  display: block !important;
}
@media (max-width: 700px) {
  .twEx {
    grid-template-columns: 1fr 1fr;
  }
  .twEx > div:first-child {
    grid-column: 1/-1;
  }
  .twProgramControls {
    grid-template-columns: 1fr 1fr;
  }
}

.actionDefer {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
}
.actionDefer select {
  min-height: 34px;
  max-width: 90px;
}

.inviteActions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}
@media (max-width: 640px) {
  .inviteActions {
    width: 100%;
    justify-content: flex-start;
  }
  .inviteActions .btn {
    flex: 1 1 130px;
  }
}

.actionNote,
.actionEdit {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
}
.actionNote input {
  min-width: 210px;
}
.actionEdit input {
  width: 78px;
  min-height: 34px;
}
.actionEdit span {
  color: var(--muted);
}
@media (max-width: 640px) {
  .actionNote,
  .actionEdit {
    width: 100%;
    flex-wrap: wrap;
  }
  .actionNote input {
    min-width: 0;
    flex: 1 1 180px;
  }
}


/* Coach command centre: evidence-led client pulse for the PT pilot. */
.coachWelcome {
  margin-top: 16px;
}
.coachWelcome p {
  max-width: 720px;
  color: var(--muted);
}
.coachPulse .sectionTitle {
  align-items: flex-start;
  gap: 18px;
}
.coachPulse .sectionTitle p {
  margin: 6px 0 0;
  max-width: 760px;
}
.pulseGrid {
  display: grid;
  gap: 14px;
  margin-top: 18px;
}
.clientPulseCard {
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 16px;
  background: color-mix(in srgb, var(--panel) 92%, transparent);
}
.clientPulseCard.review {
  border-color: color-mix(in srgb, var(--lime) 45%, var(--line));
}
.pulseHead {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}
.pulseHead h3 {
  margin: 3px 0 0;
  font-size: 18px;
  overflow-wrap: anywhere;
}
.pulseState {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 5px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}
.pulseState.review {
  color: var(--text);
  border-color: color-mix(in srgb, var(--lime) 55%, var(--line));
  background: color-mix(in srgb, var(--lime) 10%, transparent);
}
.pulseState.clear {
  border-color: #335848;
  background: #183126;
  color: #c8f1dc;
}
.pulseMetrics {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 9px;
  margin-top: 14px;
}
.pulseMetric {
  min-width: 0;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #0d1217;
}
.pulseMetric b,
.pulseMetric span,
.pulseMetric small {
  display: block;
}
.pulseMetric b {
  font-size: 16px;
  overflow-wrap: anywhere;
}
.pulseMetric span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 11px;
}
.pulseMetric small {
  margin-top: 5px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.35;
}
.pulseFlags {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 12px;
}
.pulseFlags span {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 4px 9px;
  border-radius: 999px;
  border: 1px solid #5a4630;
  background: #251c13;
  color: #f2d3ac;
  font-size: 11px;
}
.pulseFlags span.good {
  border-color: #335848;
  background: #183126;
  color: #c8f1dc;
}
@media (max-width: 980px) {
  .pulseMetrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  .coachPulse .sectionTitle,
  .pulseHead {
    flex-direction: column;
  }
  .pulseState {
    white-space: normal;
  }
  .pulseMetrics {
    grid-template-columns: 1fr 1fr;
  }
  .pulseMetric:last-child {
    grid-column: 1 / -1;
  }
  .clientPulseCard .buttonRow .btn {
    flex: 1 1 110px;
  }
}


/* CB pilot weekly accountability loop. */
.pulseSignals {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 12px;
}
.pulseSignals span {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 4px 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font-size: 11px;
  background: #0d1217;
}
.checkinHistory {
  display: grid;
  gap: 14px;
}
.checkinCard {
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 16px;
  background: #0d1217;
}
.checkinHead {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}
.checkinHead h3 {
  margin: 3px 0 0;
  font-size: 18px;
}
.checkinScores {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-top: 14px;
}
.checkinScores > div {
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel);
  min-width: 0;
}
.checkinScores b,
.checkinScores span {
  display: block;
}
.checkinScores b {
  font-size: 15px;
  overflow-wrap: anywhere;
}
.checkinScores span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 10px;
}
.clientReflection,
.coachResponse,
.checkinReviewForm {
  margin-top: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
}
.clientReflection p,
.coachResponse p {
  margin: 6px 0 0;
  white-space: pre-wrap;
}
.coachResponse {
  border-color: #335848;
  background: #14251e;
}
.coachResponse.pending {
  border-color: #5a4630;
  background: #211b14;
}
.coachResponse small {
  display: block;
  margin-top: 7px;
  color: var(--muted);
}
.checkinReviewForm textarea {
  width: 100%;
}
.checkinReviewStatus:empty {
  display: none;
}
@media (max-width: 760px) {
  .checkinScores {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 520px) {
  .checkinHead {
    flex-direction: column;
  }
  .checkinScores {
    grid-template-columns: 1fr 1fr;
  }
  .checkinReviewForm .buttonRow .btn {
    flex: 1 1 130px;
  }
}


/* CB pilot weekly review summary. */
.weeklyReview {
  margin-bottom: 16px;
}
.weeklyReviewHead {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
}
.weeklyReviewHead h2 {
  margin: 3px 0 0;
}
.weeklyReviewHead p {
  margin: 6px 0 0;
  max-width: 720px;
}
.weeklyReviewMetrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
  margin-top: 16px;
}
.weeklyReviewMetric {
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #0d1217;
  min-width: 0;
}
.weeklyReviewMetric span,
.weeklyReviewMetric b,
.weeklyReviewMetric small {
  display: block;
}
.weeklyReviewMetric span,
.weeklyReviewMetric small {
  color: var(--muted);
}
.weeklyReviewMetric span {
  font-size: 10px;
}
.weeklyReviewMetric b {
  margin-top: 4px;
  font-size: 17px;
  overflow-wrap: anywhere;
}
.weeklyReviewMetric small {
  margin-top: 5px;
  font-size: 10px;
  line-height: 1.35;
}
.weeklyReviewColumns {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}
.weeklyReviewList {
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel);
}
.weeklyReviewList ul {
  margin: 9px 0 0;
  padding-left: 18px;
}
.weeklyReviewList li {
  margin: 6px 0;
  line-height: 1.4;
}
.weeklyReviewList.wins {
  border-color: #335848;
}
.weeklyReviewList.attention {
  border-color: #5a4630;
}
.weeklyReviewReflection {
  margin-top: 12px;
}
@media (max-width: 900px) {
  .weeklyReviewMetrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .weeklyReviewColumns {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 520px) {
  .weeklyReviewHead {
    flex-direction: column;
  }
  .weeklyReviewMetrics {
    grid-template-columns: 1fr 1fr;
  }
}


/* CB pilot Real Progress hub. */
.progressHero {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.5fr);
  gap: 18px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--panel);
}
.progressHero h2 {
  margin: 4px 0 0;
}
.progressHero p {
  margin: 8px 0 0;
  color: var(--muted);
  max-width: 620px;
}
.progressStats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.progressStats > div,
.trainingWindowGrid > div {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: #0d1217;
  min-width: 0;
}
.progressStats span,
.progressStats b,
.progressStats small,
.trainingWindowGrid span,
.trainingWindowGrid b,
.trainingWindowGrid small {
  display: block;
}
.progressStats span,
.trainingWindowGrid span {
  color: var(--muted);
  font-size: 10px;
}
.progressStats b,
.trainingWindowGrid b {
  margin-top: 4px;
  font-size: 20px;
  overflow-wrap: anywhere;
}
.progressStats small,
.trainingWindowGrid small {
  margin-top: 5px;
  color: var(--muted);
  line-height: 1.35;
}
.progressTrendGrid,
.progressDetailGrid {
  margin-top: 16px;
}
.progressTrend {
  margin-top: 12px;
}
.progressTrend svg {
  width: 100%;
  min-height: 180px;
  overflow: visible;
}
.progressTrend polyline {
  stroke: var(--lime);
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.progressTrend circle {
  fill: var(--panel);
  stroke: var(--lime);
  stroke-width: 3;
}
.progressTrendRange {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  margin-top: 8px;
}
.progressTrendRange span {
  display: grid;
  gap: 2px;
}
.progressTrendRange span:last-child {
  text-align: right;
}
.progressTrendRange small,
.progressTrendRange em {
  color: var(--muted);
  font-size: 10px;
  font-style: normal;
}
.progressTrendRange b {
  font-size: 15px;
}
.progressContextGrid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 9px;
  margin-top: 14px;
}
.progressContextMetric {
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #0d1217;
  min-width: 0;
}
.progressContextMetric span,
.progressContextMetric b {
  display: block;
}
.progressContextMetric span {
  color: var(--muted);
  font-size: 10px;
}
.progressContextMetric b {
  margin-top: 4px;
  font-size: 16px;
  overflow-wrap: anywhere;
}
.trainingWindowGrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
  margin-top: 14px;
}
.progressSessionHistory {
  margin-top: 12px;
}
.progressMilestoneTimeline {
  display: grid;
  gap: 9px;
  margin-top: 14px;
}
.progressMilestoneTimeline > div {
  display: grid;
  gap: 3px;
  padding: 11px;
  border-left: 3px solid var(--lime);
  background: #0d1217;
  border-radius: 0 10px 10px 0;
}
.progressMilestoneTimeline span,
.progressMilestoneTimeline small {
  color: var(--muted);
  font-size: 10px;
}
.progressPhotoGrid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 14px;
}
.progressPhoto {
  margin: 0;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #0d1217;
  min-width: 0;
}
.progressPhoto img {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  border-radius: 13px 13px 0 0;
}
.progressPhoto figcaption,
.progressPhoto.unavailable {
  padding: 10px;
}
.progressPhoto figcaption b,
.progressPhoto figcaption span,
.progressPhoto.unavailable span,
.progressPhoto.unavailable small {
  display: block;
}
.progressPhoto figcaption span,
.progressPhoto.unavailable small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 10px;
  text-transform: capitalize;
}
.progressPhoto.unavailable {
  min-height: 140px;
  display: grid;
  align-content: center;
}
.progressMilestoneGrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
  margin-top: 14px;
}
.progressMilestone {
  display: grid;
  gap: 4px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #0d1217;
}
.progressMilestone small {
  color: var(--muted);
}
.progressEmpty {
  padding: 18px;
  border: 1px dashed var(--line);
  border-radius: 12px;
  color: var(--muted);
  text-align: center;
}
@media (max-width: 980px) {
  .progressHero {
    grid-template-columns: 1fr;
  }
  .progressContextGrid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .progressPhotoGrid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 700px) {
  .progressPhotoGrid,
  .progressMilestoneGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 520px) {
  .progressStats,
  .trainingWindowGrid,
  .progressContextGrid,
  .progressPhotoGrid,
  .progressMilestoneGrid {
    grid-template-columns: 1fr 1fr;
  }
  .progressHero {
    padding: 14px;
  }
  .progressTrend svg {
    min-height: 150px;
  }
  .progressPhotos .sectionTitle {
    align-items: flex-start;
    flex-direction: column;
  }
}


/* CB pilot presentation journey: selected-client coach workspace. */
.coachClientRail {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 0 0 18px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel);
}
.coachClientSummary {
  display: grid;
  gap: 3px;
  min-width: 190px;
}
.coachClientSummary b {
  font-size: 15px;
  overflow-wrap: anywhere;
}
.coachClientSummary small {
  color: var(--muted);
  line-height: 1.35;
}
.coachJourney {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 7px;
}
.coachJourney button {
  min-height: 40px;
  padding: 8px 11px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #0d1217;
  color: var(--muted);
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}
.coachJourney button:hover,
.coachJourney button:focus-visible {
  border-color: var(--lime);
  color: var(--text);
}
.coachJourney button.active {
  border-color: var(--lime);
  background: color-mix(in srgb, var(--lime) 12%, #0d1217);
  color: var(--text);
}
@media (max-width: 900px) {
  .coachClientRail {
    align-items: stretch;
    flex-direction: column;
  }
  .coachJourney {
    justify-content: flex-start;
  }
  .coachJourney button {
    flex: 1 1 130px;
    min-height: 44px;
  }
}
@media (max-width: 520px) {
  .coachClientRail {
    padding: 11px;
  }
  .coachJourney {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .coachJourney button {
    width: 100%;
  }
  .coachJourney button:last-child {
    grid-column: 1 / -1;
  }
}


/* P03 dated recovery records and supplement lifecycle. */
.recoveryRecordList,
.recoveryTaskList {
  display: grid;
  gap: 10px;
  margin-top: 16px;
}
.recoveryRecord,
.recoveryTaskRow,
.recoveryTaskEditor {
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #0d1217;
}
.recoveryRecord {
  padding: 0 12px 12px;
}
.recoveryRecord summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 48px;
  cursor: pointer;
}
.recoveryRecord summary span,
.recoveryTaskRow small,
.recordMeta,
.archiveList small {
  color: var(--muted);
}
.recoveryRecordForm {
  margin-top: 12px;
}
.recoveryTasksCard .sectionTitle {
  align-items: flex-start;
  gap: 18px;
}
.recoveryDatePicker {
  min-width: 170px;
}
.recoveryDatePicker input {
  margin-top: 4px;
}
.recoveryTaskRow {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding: 13px;
}
.recoveryTaskRow > div,
.recoveryTaskEditor label {
  min-width: 0;
}
.recoveryTaskRow b,
.recoveryTaskRow small {
  display: block;
  overflow-wrap: anywhere;
}
.recoveryTaskRow small + small {
  margin-top: 4px;
}
.recoveryTaskEditor {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(120px, 0.5fr);
  gap: 10px;
  padding: 13px;
}
.recoveryTaskEditor .span2,
.recoveryTaskEditor .buttonRow,
.recoveryTaskEditor .recordMeta {
  grid-column: 1 / -1;
}
.recordMeta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  font-size: 11px;
}
.archiveList {
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}
.archiveList > summary {
  min-height: 42px;
  cursor: pointer;
  color: var(--muted);
  font-weight: 700;
}
.recoveryTaskRow.archived {
  margin-top: 8px;
  opacity: 0.82;
}
@media (max-width: 700px) {
  .recoveryTasksCard .sectionTitle,
  .recoveryTaskRow,
  .recoveryRecord summary {
    flex-direction: column;
    align-items: stretch;
  }
  .recoveryDatePicker {
    width: 100%;
    min-width: 0;
  }
  .recoveryDatePicker input,
  .recoveryTaskRow .btn {
    width: 100%;
  }
  .recoveryTaskEditor {
    grid-template-columns: 1fr;
  }
  .recoveryTaskEditor .span2,
  .recoveryTaskEditor .buttonRow,
  .recoveryTaskEditor .recordMeta {
    grid-column: auto;
  }
  .recoveryTaskEditor .buttonRow .btn,
  .recoveryRecordForm .buttonRow .btn {
    flex: 1 1 140px;
  }
}
@media (max-width: 520px) {
  .recoveryRecord,
  .recoveryTaskEditor,
  .recoveryTaskRow {
    padding-left: 11px;
    padding-right: 11px;
  }
  .recoveryRecordForm.formGrid {
    grid-template-columns: 1fr;
  }
  .recoveryRecordForm.formGrid .span2,
  .recoveryRecordForm.formGrid .span3 {
    grid-column: auto;
  }
}


/* P03 tracked progress-photo upload and deletion states. */
.photoGrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 14px;
}
.managedPhoto {
  margin: 0;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #0d1217;
}
.managedPhoto img,
.photoUnavailable {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 4;
  border-radius: 13px 13px 0 0;
}
.managedPhoto img {
  object-fit: cover;
}
.photoUnavailable {
  display: grid;
  place-items: center;
  padding: 14px;
  color: var(--muted);
  text-align: center;
  background: #111820;
}
.managedPhoto figcaption {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px;
}
.managedPhoto figcaption span {
  min-width: 0;
  color: var(--muted);
  font-size: 11px;
  text-transform: capitalize;
  overflow-wrap: anywhere;
}
.photoIntegrity {
  margin-top: 14px;
  padding: 12px;
  border: 1px solid #5a4630;
  border-radius: 14px;
  background: #251c13;
}
.photoIntegrity p {
  margin: 5px 0 10px;
}
.photoCleanupRow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 0;
  border-top: 1px solid color-mix(in srgb, var(--line) 70%, transparent);
}
.photoCleanupRow span {
  min-width: 0;
  font-size: 11px;
  overflow-wrap: anywhere;
}
@media (max-width: 760px) {
  .photoGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 520px) {
  .photoGrid {
    grid-template-columns: 1fr;
  }
  .managedPhoto figcaption,
  .photoCleanupRow {
    flex-direction: column;
    align-items: stretch;
  }
  .managedPhoto figcaption .btn,
  .photoCleanupRow .btn {
    width: 100%;
  }
}


/* D30 approved Charles/client redesign integration. */
body {
  font-size: 16px;
  background: var(--bg);
}
:focus-visible {
  outline-color: var(--gold);
}
.shell {
  grid-template-columns: 220px minmax(0, 1fr);
}
.side {
  background: #0d0f11;
  padding: 24px 16px;
}
.main {
  max-width: 1280px;
  padding: 36px 44px 96px;
}
.head {
  align-items: flex-end;
  margin-bottom: 24px;
}
.head h1 {
  margin: 6px 0;
  font-size: clamp(32px, 3.3vw, 36px);
}
.head p {
  max-width: 720px;
  font-size: 14px;
}
.card {
  border-radius: 12px;
  background: var(--panel);
  box-shadow: none;
}
.btn,
.nav button,
.mobileNav button,
.coachJourney button {
  border-radius: 8px;
}
.btn.primary {
  background: var(--gold);
  border-color: var(--gold);
  color: #101214;
}
.workloadStrip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 2px 0 24px;
  border-block: 1px solid var(--line);
}
.workloadItem {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 18px 20px;
  border: 0;
  border-right: 1px solid var(--line);
  background: transparent;
  color: var(--text);
  text-align: left;
}
.workloadItem:last-child {
  border-right: 0;
}
.workloadItem:hover,
.workloadItem:focus-visible {
  background: var(--panel);
}
.workloadItem b {
  font-size: 26px;
  line-height: 1;
}
.workloadItem span {
  margin-top: 4px;
  font-size: 14px;
  font-weight: 750;
}
.workloadItem small {
  color: var(--muted);
  font-size: 12px;
}
.homeSection {
  margin-top: 20px;
}
.homeSection .sectionTitle {
  align-items: flex-start;
  margin-top: 0;
}
.decisionSection .action {
  grid-template-columns: 10px minmax(0, 1fr) auto;
  padding: 13px 0;
}
.coachPulse .pulseGrid {
  gap: 0;
  margin-top: 4px;
}
.coachPulse .clientPulseCard {
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  padding: 16px 0;
  background: transparent;
}
.coachPulse .clientPulseCard:last-child {
  border-bottom: 0;
}
.coachPulse .clientPulseCard.review {
  border-color: var(--line);
}
.coachPulse .pulseMetrics {
  display: none;
}
.coachPulse .pulseSignals,
.coachPulse .pulseFlags {
  margin-top: 8px;
}
.coachPulse .pulseSignals span,
.coachPulse .pulseFlags span {
  min-height: 26px;
  padding: 3px 8px;
  background: transparent;
}
.coachPulse .buttonRow {
  margin-top: 10px;
}
.coachClientRail {
  border-radius: 12px;
  background: var(--panel);
}
.coachJourney button {
  background: transparent;
}
.coachJourney button:hover,
.coachJourney button:focus-visible,
.coachJourney button.active {
  border-color: var(--gold);
  color: var(--text);
}
.coachJourney button.active {
  background: color-mix(in srgb, var(--gold) 12%, transparent);
}
.todayHero {
  border-radius: 12px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--gold) 8%, var(--panel)), var(--panel));
}
.metric,
.pulseMetric,
.checkinScores > div,
.weeklyReviewMetric,
.progressStats > div,
.trainingWindowGrid > div,
.progressContextMetric {
  border-radius: 8px;
}
@media (max-width: 980px) {
  .shell {
    grid-template-columns: minmax(0, 1fr);
  }
  .main {
    min-width: 0;
    max-width: none;
    padding: 22px 18px 104px;
  }
  .workloadStrip {
    margin-top: 0;
  }
}
@media (max-width: 640px) {
  body {
    font-size: 16px;
  }
  .main {
    padding: 18px 16px 96px;
  }
  .head h1 {
    font-size: 28px;
  }
  .workloadStrip {
    grid-template-columns: 1fr;
  }
  .workloadItem {
    grid-template-columns: 54px minmax(0, 1fr);
    align-items: center;
    padding: 13px 4px;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .workloadItem:last-child {
    border-bottom: 0;
  }
  .workloadItem b {
    grid-row: 1 / 3;
    font-size: 24px;
  }
  .workloadItem span,
  .workloadItem small {
    grid-column: 2;
  }
  .homeSection {
    padding: 16px;
  }
  .homeSection .sectionTitle,
  .pulseHead {
    align-items: stretch;
  }
  .decisionSection .action {
    grid-template-columns: 10px minmax(0, 1fr);
  }
  .decisionSection .actionBtns {
    grid-column: 2;
    flex-wrap: wrap;
  }
  .coachPulse .clientPulseCard .buttonRow {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .coachPulse .clientPulseCard .buttonRow .btn:first-child {
    grid-column: 1 / -1;
  }
  .workout .exercise {
    overflow: visible;
  }
  .workout .set {
    min-width: 0;
    grid-template-columns: 32px minmax(0, 1fr) minmax(0, 1fr);
    gap: 7px;
  }
  .workout .set > :last-child {
    grid-column: 2 / -1;
    width: 100%;
  }
  .workout .set input,
  .workout .set button {
    min-width: 0;
    font-size: 16px;
  }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* Coach theme alignment: visual approximation from the approved profile image.
   Logo font is unknown; use a heavy oblique display treatment, not an exact-font claim. */
:root {
  --bg: #0b0e0c;
  --panel: #171c18;
  --panel2: #242d26;
  --line: #354239;
  --text: #e6e9e4;
  --muted: #b2beb3;
  --gold: #8fb38e;
  --brand-green: #8fb38e;
  --brand-silver: #cbd1c9;
  --brand-display: "Arial Black", "Arial", sans-serif;
}
html, body { background: var(--bg); color: var(--text); }
.brand b, .boot > strong, .logoMark,
.head h1, .authCard h1, .workHero h1 {
  font-family: var(--brand-display);
  font-weight: 900;
  font-style: italic;
  letter-spacing: -.035em;
}
.brand b, .boot > strong { color: var(--brand-silver); }
.brand small { color: var(--brand-green); }
.logoMark {
  background: linear-gradient(135deg, var(--brand-green), var(--brand-silver));
  color: #0b0e0c;
}
.side, .mobileNav { background: #101511; }
.card, .authCard, .workHero { background: var(--panel); }
.auth { background: radial-gradient(circle at 70% 10%,rgba(143,179,142,.12),transparent 36%),var(--bg); }
.btn.primary, .tabs button.on {
  color: #0b0e0c;
  background: var(--brand-green);
  border-color: var(--brand-green);
}
.nav button.active { box-shadow: inset 3px 0 0 var(--brand-green); }
.tabs button, input, select, textarea { background: #101611; }
input:focus, select:focus, textarea:focus {
  border-color: var(--brand-green);
  box-shadow: 0 0 0 3px rgba(143,179,142,.14);
}
.pill.gold { background: rgba(143,179,142,.14); color: var(--brand-green); }
.todayHero, .nutriHero, .workout .workHero {
  background: radial-gradient(circle at 80% 0%,rgba(143,179,142,.14),transparent 42%),var(--panel);
  border-color: var(--line);
}
.shell .builderCard, .shell .assemblyResult { background: var(--panel); }
.shell .assemblyPrep { background: rgba(143,179,142,.07); border-left-color: var(--brand-green); }
.ring { border-color: rgba(143,179,142,.2); border-top-color: var(--brand-green); }
.bar { background: linear-gradient(180deg,var(--brand-green),rgba(143,179,142,.3)); }
/* Keep warnings recognisable independently of the green brand accent. */
.notice.warn { border-color: rgba(230,184,112,.6); background: rgba(230,184,112,.08); }
@media(max-width:640px) {
  .head h1, .authCard h1 { overflow-wrap: anywhere; }
}


/* D30 client-day sequence: ordered meals, workout and recovery blocks. */
.daySequenceCard {
  margin-top: 20px;
  padding: 20px;
}
.daySequenceCard .sectionTitle {
  margin-top: 0;
}
.daySequenceGroup {
  margin-top: 18px;
}
.daySequenceHeading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
  padding: 0 4px;
}
.daySequenceHeading p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 12px;
}
.daySequenceBlocks {
  display: grid;
  gap: 8px;
}
.dayBlock {
  display: grid;
  grid-template-columns: 32px 96px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  min-width: 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #15181b;
}
.dayBlock.done {
  background: color-mix(in srgb, var(--gold) 6%, #15181b);
}
.dayBlockTickWrap {
  display: grid;
  place-items: center;
}
.dayBlockTick {
  width: 22px;
  min-height: 22px;
  accent-color: var(--gold);
}
.dayBlockTick:disabled {
  opacity: 0.8;
}
.dayBlockTime {
  display: grid;
  gap: 3px;
}
.dayBlockTime b {
  font-size: 15px;
}
.dayBlockTime small,
.dayBlockBody p {
  color: var(--muted);
  font-size: 12px;
}
.dayBlockBody {
  min-width: 0;
}
.dayBlockBody h3 {
  margin: 3px 0;
  font-size: 17px;
  overflow-wrap: anywhere;
}
.dayBlockBody p {
  margin: 4px 0 0;
}
.dayBlockBody details {
  margin-top: 8px;
  font-size: 12px;
}
.dayBlockActions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}
.workoutDayBlock {
  margin-top: 18px;
  border-color: color-mix(in srgb, var(--gold) 55%, var(--line));
  background: linear-gradient(135deg, color-mix(in srgb, var(--gold) 12%, var(--panel)), var(--panel));
}
.dayScheduleEditor,
.dayMoveCard {
  margin-top: 16px;
}
.dayScheduleEditor > summary {
  cursor: pointer;
  font-weight: 800;
  list-style-position: inside;
}
.dayScheduleEditor[open] > summary {
  margin-bottom: 10px;
}
.dayScheduleForm {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}
.dayScheduleRow {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 132px;
  gap: 12px;
  align-items: center;
  padding: 9px 0;
  border-top: 1px solid var(--line);
}
.dayScheduleRow span {
  color: var(--text);
  font-size: 13px;
  font-weight: 700;
  overflow-wrap: anywhere;
}
.dayScheduleRow input {
  margin: 0;
}
.workoutScheduleRow {
  border-top: 0;
}
.todayQuickActions {
  margin: 16px 0;
}
.todayFoodExtras {
  margin-top: 16px;
}
@media (max-width: 700px) {
  .dayBlock {
    grid-template-columns: 28px 78px minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    padding: 12px;
  }
  .dayBlockActions {
    grid-column: 2 / -1;
    justify-content: flex-start;
    flex-wrap: wrap;
  }
  .dayBlockActions .btn {
    width: 100%;
  }
  .dayBlockTime b {
    font-size: 14px;
  }
  .dayBlockTime small {
    font-size: 10px;
  }
  .dayScheduleRow {
    grid-template-columns: 1fr 110px;
  }
}
@media (max-width: 480px) {
  .daySequenceCard {
    padding: 14px;
  }
  .dayBlock {
    grid-template-columns: 28px minmax(0, 1fr);
  }
  .dayBlockTime,
  .dayBlockBody,
  .dayBlockActions {
    grid-column: 2;
  }
  .dayBlockTime {
    display: flex;
    gap: 8px;
    align-items: baseline;
    flex-wrap: wrap;
  }
  .dayScheduleRow {
    grid-template-columns: 1fr;
  }
  .dayScheduleRow input,
  .dayScheduleForm .btn {
    width: 100%;
  }
}

/* Current nutrition first, with history available on demand. */
.nutritionWindow > h3{margin:8px 0}.nutritionWindow > .muted{margin:0 0 20px}.nutritionHistory{margin-top:22px;border-top:1px solid var(--line);padding-top:12px}.nutritionHistory > summary{min-height:44px;padding:12px 0;cursor:pointer;font-weight:700;color:var(--brand-silver)}.shoppingWeek{padding:10px 12px;border:1px solid var(--line);border-radius:10px;color:var(--text);overflow-wrap:anywhere}

.nutritionWindow .meal,.nutritionHistory .meal{grid-template-columns:70px minmax(0,1fr);gap:12px;align-items:start}
.nutritionWindow .meal b,.nutritionHistory .meal b{display:block;font-size:15px;line-height:1.4}
.nutritionWindow .meal small,.nutritionHistory .meal small{display:block;font-size:13px;line-height:1.5}
.nutritionWindow .meal > div > small,.nutritionHistory .meal > div > small{margin-top:4px}
.nutritionWindow .meal summary,.nutritionHistory .meal summary{min-height:44px;padding:12px 0;font-size:13px;cursor:pointer}
@media(max-width:640px){.nutritionWindow .meal,.nutritionHistory .meal{grid-template-columns:minmax(0,1fr);gap:6px}.nutritionWindow .meal > small,.nutritionHistory .meal > small{color:var(--gold)}}

/* The saved meal portion is readable beside its preparation on every client route. */
.mealPreparation{font-size:14px;line-height:1.55;max-width:100%}
.mealPreparation > summary{min-height:44px;padding:12px 0;cursor:pointer;font-size:14px}
.mealPreparation h4{font-size:14px;margin:14px 0 8px}
.mealIngredientList{list-style:none;padding:0;margin:8px 0 14px}
.mealIngredientList li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;padding:8px 0;border-bottom:1px solid var(--line);font-size:14px}
.mealIngredientList span{overflow-wrap:anywhere}
.mealIngredientList strong{font-size:14px;font-variant-numeric:tabular-nums;text-align:right}
.mealPreparation .portionNotice{font-size:12px;line-height:1.55;color:var(--muted);margin:10px 0}

/* Keep long signed-in test or client email addresses inside the navigation rail. */
.sideFoot { min-width: 0; max-width: 100%; }
.sideFoot b { display: block; white-space: normal; overflow-wrap: anywhere; }


/* CB Fitness onboarding V2: client-first guided intake. */
.onboardingWizard {
  width: min(920px, 100%);
  margin: 0 auto;
  gap: 14px;
}
.onboardingTop {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(180px, 0.45fr);
  align-items: end;
  gap: 20px;
}
.onboardingTop h2,
.onboardingStep h2,
.onboardingComplete h2 {
  margin: 4px 0 6px;
}
.eyebrow {
  display: block;
  font-size: 11px;
  letter-spacing: 0.14em;
  font-weight: 800;
  color: var(--lime);
}
.onboardingProgress {
  width: 100%;
  padding: 2px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel);
}
.onboardingProgress span {
  display: block;
  width: 14.285%;
  min-height: 6px;
  border-radius: inherit;
  background: var(--lime);
  transition: width 180ms ease;
}
.onboardingStep {
  display: grid;
  gap: 16px;
}
.onboardingStep[hidden] {
  display: none;
}
.onboardingStep > p {
  max-width: 760px;
}
.dataNotice {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 0;
  background: var(--panel);
}
.dataNotice summary {
  cursor: pointer;
  padding: 14px 16px;
  font-weight: 700;
}
.noticeBody {
  padding: 0 16px 14px;
  color: var(--muted);
}
.noticeBody p:last-child {
  margin-bottom: 0;
}
.consentChoice,
.fullGymChoice {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel);
}
.consentChoice input,
.fullGymChoice input {
  margin-top: 2px;
}
.fullGymChoice span {
  display: grid;
  gap: 2px;
}
.fullGymChoice small {
  color: var(--muted);
}
.subCard,
.safetyNote {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 14px;
  background: var(--panel);
}
.subCard[hidden] {
  display: none;
}
.safetyNote {
  display: grid;
  gap: 4px;
}
.safetyNote span {
  color: var(--muted);
}
.choiceGrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
  margin-top: 10px;
}
.chipChoice {
  position: relative;
  min-width: 0;
}
.chipChoice input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.chipChoice span {
  display: flex;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  padding: 10px 12px;
  text-align: center;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel);
  color: var(--text);
  cursor: pointer;
  transition: border-color 140ms ease, transform 140ms ease;
}
.chipChoice input:focus-visible + span {
  outline: 2px solid var(--lime);
  outline-offset: 3px;
}
.chipChoice input:checked + span {
  border-color: var(--lime);
  box-shadow: inset 0 0 0 1px var(--lime);
}
.chipChoice input:active + span {
  transform: scale(0.99);
}
.allergenGrid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.onboardingActions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  padding: 4px 0 8px;
}
.onboardingActions #onboardingBack {
  margin-right: auto;
}
.reviewSummary {
  display: grid;
  gap: 10px;
}
.reviewSummary > div {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 4px 14px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
}
.reviewSummary > div:last-child {
  border-bottom: 0;
}
.reviewSummary b {
  grid-row: 1 / span 2;
}
.reviewSummary span,
.reviewSummary small {
  min-width: 0;
  overflow-wrap: anywhere;
}
.reviewSummary small {
  color: var(--muted);
}
.onboardingComplete {
  width: min(720px, 100%);
  margin: 0 auto;
  display: grid;
  gap: 16px;
}
.onboardingComplete .btn {
  justify-self: start;
}
@media (max-width: 720px) {
  .onboardingTop {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .choiceGrid,
  .allergenGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .reviewSummary > div {
    grid-template-columns: 1fr;
  }
  .reviewSummary b {
    grid-row: auto;
  }
}
@media (max-width: 520px) {
  .onboardingWizard {
    gap: 10px;
  }
  .onboardingTop,
  .onboardingStep,
  .onboardingComplete {
    padding-left: 14px;
    padding-right: 14px;
  }
  .choiceGrid,
  .allergenGrid {
    grid-template-columns: 1fr 1fr;
    gap: 7px;
  }
  .chipChoice span {
    min-height: 48px;
    padding: 9px 8px;
    font-size: 13px;
  }
  .onboardingActions {
    position: sticky;
    bottom: 78px;
    z-index: 12;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--bg, #0b0f12);
  }
  .onboardingActions .btn {
    flex: 1 1 0;
  }
}

.intakeSummary {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.intakeSummary dt{font-weight:700}.intakeSummary dd{margin:6px 0 0;white-space:pre-wrap;overflow-wrap:anywhere;color:var(--muted)}@media(max-width:640px){.intakeSummary{grid-template-columns:1fr}}

/* Supplement routine frequency controls */
.supplementUsageForm [hidden]{display:none!important}
.supplementWeekdays{min-width:0;border:1px solid var(--line);border-radius:12px;padding:12px}
.supplementWeekdays .dayChoices{display:flex;flex-wrap:wrap;gap:8px 14px}
.recoveryRecord summary span small{display:block;margin-top:5px;font-size:12px;color:var(--muted);overflow-wrap:anywhere}

.measurementFields [hidden],#reproductiveContext[hidden]{display:none!important}

#supplementRoutineWrap[hidden]{display:none!important}.supplementEntry{padding:16px;border:1px solid var(--line,#ddd);border-radius:12px;margin:12px 0}.supplementSummary{overflow-x:auto;max-width:100%}.supplementSummary table{width:100%;border-collapse:collapse}.supplementSummary td,.supplementSummary th{text-align:left;padding:10px;vertical-align:top;border-bottom:1px solid #ddd}.supplementSummary small{display:block}

.supplementTrackerChoice{grid-column:1/-1;margin-top:12px;padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--panel-soft,transparent)}
.supplementTrackerChoice>[hidden],.supplementTrackerChoice [hidden]{display:none!important}
.supplementTrackerSlot{display:grid;grid-template-columns:auto minmax(110px,1fr) minmax(130px,1fr);gap:10px;align-items:end;padding:10px 0;border-top:1px solid var(--line)}
.supplementTrackerSlot:first-child{border-top:0}.supplementTrackerSlot>span{font-weight:700;padding-bottom:12px}.supplementTrackerSlot label{margin:0}
@media(max-width:640px){.supplementTrackerSlot{grid-template-columns:1fr}.supplementTrackerSlot>span{padding-bottom:0}}