/* Editorial section headers: each photo is decorative, with text and controls in their own column. */
html:root[data-theme] body #appView main :is(#historySection,#trainingSection,#coachSection) .chapter-hero {
  position:relative;isolation:isolate;display:flex;align-items:center;overflow:hidden;min-height:260px;
  padding:30px;margin:0 0 22px;background:var(--m-hero);border:1px solid var(--m-line);border-radius:14px;gap:0;
}
html:root[data-theme] body #appView main :is(#historySection,#trainingSection,#coachSection) .chapter-copy { position:relative;z-index:1;width:58%;min-width:0; }
html:root[data-theme] body #appView main :is(#historySection,#trainingSection,#coachSection) .chapter-copy h3 { color:var(--m-ink);font-size:clamp(1.55rem,1.05rem + 1.4vw,2.15rem);line-height:1.16;letter-spacing:-.04em;margin:12px 0;font-weight:650; }
html:root[data-theme] body #appView main :is(#historySection,#trainingSection,#coachSection) .chapter-copy p { color:var(--m-muted);line-height:1.6;margin:0;max-width:42em; }
html:root[data-theme] body #appView main :is(#historySection,#trainingSection,#coachSection) .chapter-copy .eyebrow { color:var(--m-accent-hover);font-size:.6875rem;line-height:1.5;letter-spacing:.12em; }
html:root[data-theme] body #appView main :is(#historySection,#trainingSection,#coachSection) .chapter-art { position:absolute;inset:0 0 0 auto;width:42%;background:var(--chapter-photo) right top/cover no-repeat;pointer-events:none;-webkit-mask-image:linear-gradient(to right,transparent,#000 30%);mask-image:linear-gradient(to right,transparent,#000 30%); }
html:root[data-theme] body .nutrition-art { --chapter-photo:url('/images/chapters/nutrition-v2-20261028.webp'); }
html:root[data-theme] body .training-art { --chapter-photo:url('/images/chapters/training-v2-20261028.webp'); }
html:root[data-theme] body .coach-art { --chapter-photo:url('/images/chapters/coach-v2-20261028.webp'); }
html:root[data-theme] body #appView main #trainingSection #trainingChapter { border-radius:10px; }
html:root[data-theme] body #appView main #coachSection #coachChapter .section-actions { margin-top:20px;display:flex;flex-wrap:wrap;gap:10px; }
html:root[data-theme] body #appView main #coachSection #coachChapter .section-actions button { min-width:0;max-width:100%;white-space:normal; }
html:root[data-theme] body #appView main #historySection .nutrition-date-row { margin-top:0; }
html:root[data-theme] body #historySummary .stat { border-top:3px solid var(--m-teal); }
html:root[data-theme] body #historySummary .stat:nth-child(2) { border-top-color:var(--m-teal); }
html:root[data-theme] body #historySummary .stat:nth-child(3) { border-top-color:var(--m-clay); }
html:root[data-theme] body #historySummary .stat:nth-child(4) { border-top-color:var(--m-honey); }
html:root[data-theme] body .profile-identity { position:relative;isolation:isolate;overflow:hidden; }
html:root[data-theme] body .identity-orbit { position:absolute;inset:0 0 0 auto;width:40%;height:100%;opacity:.17;color:var(--m-accent);pointer-events:none;z-index:-1;stroke-width:1.4; }
html:root[data-theme] body .identity-fact { border-inline-start:2px solid var(--m-teal);padding-inline-start:12px; }
html:root[data-theme] body .identity-fact:nth-child(2) { border-inline-start-color:var(--m-clay); }
html:root[data-theme] body .identity-fact:nth-child(3) { border-inline-start-color:var(--m-honey); }
html:root[data-theme][dir="rtl"] body #appView main :is(#historySection,#trainingSection,#coachSection) .chapter-art { inset:0 auto 0 0;-webkit-mask-image:linear-gradient(to left,transparent,#000 30%);mask-image:linear-gradient(to left,transparent,#000 30%); }
html:root[data-theme][dir="rtl"] body .identity-orbit { right:auto;left:0; }
@media(max-width:820px) {
  html:root[data-theme] body #appView main :is(#historySection,#trainingSection,#coachSection) .chapter-hero { flex-direction:column;align-items:stretch;min-height:0;padding:22px 18px; }
  html:root[data-theme] body #appView main :is(#historySection,#trainingSection,#coachSection) .chapter-copy { width:100%; }
  html:root[data-theme] body #appView main :is(#historySection,#trainingSection,#coachSection) .chapter-art,
  html:root[data-theme][dir="rtl"] body #appView main :is(#historySection,#trainingSection,#coachSection) .chapter-art { position:relative;inset:auto;order:-1;width:calc(100% + 36px);height:190px;flex:none;margin:-22px -18px 10px;background-position:right top;-webkit-mask-image:linear-gradient(to bottom,#000 65%,transparent);mask-image:linear-gradient(to bottom,#000 65%,transparent); }
  html:root[data-theme] body #appView main #coachSection #coachChapter .section-actions button { flex:1 1 150px; }
  html:root[data-theme] body .identity-orbit { width:75%; }
}

/* A broad eased alpha ramp has no visible starting edge. Subject colour stays intact
   at the outer end; the mobile ramp resolves to the exact matte fill at its base. */
html:root[data-theme] body {
  --photo-direction:to right;
  --photo-fade-inline:linear-gradient(var(--photo-direction),transparent 0%,rgb(0 0 0 / .01) 8%,rgb(0 0 0 / .04) 16%,rgb(0 0 0 / .12) 24%,rgb(0 0 0 / .25) 32%,rgb(0 0 0 / .43) 40%,rgb(0 0 0 / .64) 48%,rgb(0 0 0 / .82) 56%,rgb(0 0 0 / .94) 64%,rgb(0 0 0 / .99) 72%,#000 80%);
  --photo-fade-stack:linear-gradient(to bottom,#000 28%,rgb(0 0 0 / .99) 36%,rgb(0 0 0 / .96) 44%,rgb(0 0 0 / .87) 52%,rgb(0 0 0 / .69) 60%,rgb(0 0 0 / .45) 70%,rgb(0 0 0 / .22) 80%,rgb(0 0 0 / .07) 90%,rgb(0 0 0 / .015) 96%,transparent 100%);
  --m-lake:#315f93;--m-lake-soft:#e4edf6;--m-violet:#76518d;--m-violet-soft:#ece5f3;
}
html:root[data-theme="dark"] body { --m-lake:#accff1;--m-lake-soft:#293e52;--m-violet:#d6b6eb;--m-violet-soft:#41324f; }
html:root[data-theme][dir="rtl"] body { --photo-direction:to left; }
html:root[data-theme] body #appView main :is(#historySection,#trainingSection,#coachSection) .chapter-art,
html:root[data-theme][dir="rtl"] body #appView main :is(#historySection,#trainingSection,#coachSection) .chapter-art,
html:root[data-theme] body #appView main #todaySection .coach-card::after,
html:root[data-theme][dir="rtl"] body #appView main #todaySection .coach-card::after { -webkit-mask-image:var(--photo-fade-inline);mask-image:var(--photo-fade-inline); }
html:root[data-theme] body #appView main :is(#historySection,#trainingSection,#coachSection) .chapter-copy { z-index:2; }
html:root[data-theme] body #appView main .chapter-motif { position:absolute;inset:auto 0 -18% auto;width:68%;height:115%;z-index:1;color:var(--m-accent);opacity:.27;stroke-width:1.6;pointer-events:none;-webkit-mask-image:linear-gradient(to right,transparent,#000 30%,#000 85%,transparent);mask-image:linear-gradient(to right,transparent,#000 30%,#000 85%,transparent); }
html:root[data-theme] body #appView main .motif-secondary { stroke:var(--m-honey); }
html:root[data-theme] body #appView main .training-motif { inset:auto -4% -20% auto;transform:rotate(-4deg); }
html:root[data-theme] body #appView main .coach-motif { opacity:.25; }
html:root[data-theme][dir="rtl"] body #appView main .chapter-motif { right:auto;left:0;transform:scaleX(-1); }
html:root[data-theme] body #appView main .progress-intro { position:relative;isolation:isolate;overflow:hidden;background:var(--m-hero); }
html:root[data-theme] body #appView main .progress-intro p { position:relative;z-index:1;max-width:78%; }
html:root[data-theme] body #appView main .analysis-motif { position:absolute;inset:auto -3% -65px auto;width:40%;height:180px;color:var(--m-accent);opacity:.22;stroke-width:1;pointer-events:none; }
html:root[data-theme][dir="rtl"] body #appView main .analysis-motif { right:auto;left:-3%;transform:scaleX(-1); }
html:root[data-theme] body #appView main .identity-orbit { opacity:.26; }
/* Labels, numbers and status colours retain their meanings. The supporting fills
   distinguish repeated statistic cards without replacing those labels. */
html:root[data-theme] body #appView main :is(#trainingStats,#coachStats,#metricStats,#progressStats) > .stat { --tile-fill:var(--m-teal-soft);--tile-edge:var(--m-teal);background:var(--tile-fill);border-top:3px solid var(--tile-edge); }
html:root[data-theme] body #appView main :is(#trainingStats,#coachStats,#metricStats,#progressStats) > .stat:nth-child(2) { --tile-fill:var(--m-lake-soft);--tile-edge:var(--m-lake); }
html:root[data-theme] body #appView main :is(#trainingStats,#coachStats,#metricStats,#progressStats) > .stat:nth-child(3) { --tile-fill:var(--m-honey-soft);--tile-edge:var(--m-honey); }
html:root[data-theme] body #appView main :is(#trainingStats,#coachStats,#metricStats,#progressStats) > .stat:nth-child(4) { --tile-fill:var(--m-violet-soft);--tile-edge:var(--m-violet); }
html:root[data-theme] body #appView main #trainingStats > .stat:first-child { --tile-fill:var(--m-clay-soft);--tile-edge:var(--m-clay); }
html:root[data-theme] body #appView main .identity-fact { background:var(--m-teal-soft);padding:12px;border-radius:8px;border-color:var(--m-teal); }
html:root[data-theme] body #appView main .identity-fact:nth-child(2) { background:var(--m-lake-soft);border-color:var(--m-lake); }
html:root[data-theme] body #appView main .identity-fact:nth-child(3) { background:var(--m-honey-soft);border-color:var(--m-honey); }
html:root[data-theme] body #appView main .identity-fact:nth-child(4) { background:var(--m-violet-soft);border-color:var(--m-violet); }
html:root[data-theme] body #appView main #progressOverview .board-card { --board-colour:var(--m-teal);--board-fill:var(--m-teal-soft);border-top:3px solid var(--board-colour);background:color-mix(in srgb,var(--m-surface) 82%,var(--board-fill)); }
html:root[data-theme] body #appView main #progressOverview [data-metric="WORKOUTS"] .board-card { --board-colour:var(--m-clay);--board-fill:var(--m-clay-soft); }
html:root[data-theme] body #appView main #progressOverview [data-metric="WEIGHT"] .board-card { --board-colour:var(--m-lake);--board-fill:var(--m-lake-soft); }
html:root[data-theme] body #appView main #progressOverview [data-metric="STEPS"] .board-card { --board-colour:var(--m-honey);--board-fill:var(--m-honey-soft); }
html:root[data-theme] body #appView main #progressOverview [data-metric="SLEEP"] .board-card { --board-colour:var(--m-violet);--board-fill:var(--m-violet-soft); }
@media(max-width:820px) {
  html:root[data-theme] body #appView main :is(#historySection,#trainingSection,#coachSection) .chapter-art,
  html:root[data-theme][dir="rtl"] body #appView main :is(#historySection,#trainingSection,#coachSection) .chapter-art,
  html:root[data-theme] body #appView main #todaySection .coach-card::after,
  html:root[data-theme][dir="rtl"] body #appView main #todaySection .coach-card::after { -webkit-mask-image:var(--photo-fade-stack);mask-image:var(--photo-fade-stack); }
  html:root[data-theme] body #appView main .chapter-motif { width:110%;height:290px;inset:18px -8% auto auto;opacity:.26; }
  html:root[data-theme][dir="rtl"] body #appView main .chapter-motif { right:auto;left:-8%; }
  html:root[data-theme] body #appView main .progress-intro p { max-width:100%; }
  html:root[data-theme] body #appView main .analysis-motif { width:75%;opacity:.12; }
}
html:root[data-theme] body #appView main #historySummary .stat { background:var(--m-teal-soft); }
html:root[data-theme] body #appView main #historySummary .stat:nth-child(3) { background:var(--m-clay-soft); }
html:root[data-theme] body #appView main #historySummary .stat:nth-child(4) { background:var(--m-honey-soft); }

/* The welcome chapter uses the same matte/photo transition as the diary, with a quieter form beside it. */
html:root[data-theme] body .auth-shell { align-items:center;gap:clamp(28px,5vw,88px);padding:24px;min-height:100dvh; }
html:root[data-theme] body .brand-panel { position:relative;isolation:isolate;overflow:hidden;align-self:stretch;display:flex;flex-direction:column;min-height:calc(100dvh - 48px);background:#233f36;border-radius:22px;padding:38px; }
html:root[data-theme] body .brand-panel::after { display:none; }
html:root[data-theme] body .auth-art { position:absolute;inset:0;z-index:-1;pointer-events:none; }
html:root[data-theme] body .auth-art img { position:absolute;inset:auto 0 0;width:100%;height:68%;object-fit:cover;object-position:74% center;mask-image:linear-gradient(to bottom,transparent 0%,#0002 6%,#0008 13%,#000d 22%,#000 32%);-webkit-mask-image:linear-gradient(to bottom,transparent 0%,#0002 6%,#0008 13%,#000d 22%,#000 32%); }
html:root[data-theme] body .auth-art::after { content:'';position:absolute;inset:0;background:linear-gradient(90deg,#233f36 0%,#233f36e8 20%,#233f3650 48%,transparent 75%),linear-gradient(to top,#142b24bb,transparent 22%); }
html:root[data-theme] body .auth-contours { position:absolute;inset:auto auto -6% -20%;width:110%;height:70%;z-index:1;color:#d8e9ab;opacity:.4;stroke:currentColor;stroke-width:1; }
html:root[data-theme] body .auth-contours circle { fill:#d8e9ab;stroke:none; }
html:root[data-theme] body .auth-story { margin:44px 0 auto;padding:0 0 44px;position:relative;max-width:470px; }
html:root[data-theme] body .auth-story h1 { font-size:clamp(2.3rem,3.8vw,4.2rem);max-width:11ch;line-height:1.08;margin:18px 0 22px;color:#f5f7ef; }
html:root[data-theme] body .auth-story>p:last-child { max-width:27ch;color:#e3e9dc;line-height:1.65; }
html:root[data-theme] body .auth-story .eyebrow { color:#c8dcae;font-size:.65rem;letter-spacing:.14em; }
html:root[data-theme] body .auth-proof { position:relative;max-width:250px;gap:12px;padding-top:42px; }
html:root[data-theme] body .auth-proof .promise { background:#203e35e8;padding:12px;border:1px solid #d8e9ab26;border-radius:10px; }
html:root[data-theme] body .auth-proof .promise :is(span,p) { color:#f1f5e8;font-size:.75rem;line-height:1.5; }
html:root[data-theme] body .auth-proof .promise span { color:#d8e9ab; }
html:root[data-theme] body .auth-card { max-width:400px;padding:32px 16px; }
html:root[data-theme] body .auth-card .auth-heading { font-size:2rem;margin:0 0 24px; }
html:root[data-theme] body .auth-card .email-signin { margin-top:20px; }
html:root[data-theme] body .auth-card .detail-hint { font-size:.875rem;line-height:1.65;margin:0 0 20px; }
html:root[data-theme] body .auth-card .password-auth:not(.auth-only-password) { border-top:1px solid var(--m-line);margin-top:24px;padding-top:18px; }
html:root[data-theme] body .auth-card .password-auth summary { padding:8px 0;font-size:.8125rem; }
html:root[data-theme] body .auth-card .auth-extras { margin-top:24px; }
html:root[data-theme] body .coach-stat-hint { font-size:.75rem;line-height:1.5;margin:10px 0 0;color:var(--m-muted);font-weight:400;letter-spacing:0;overflow-wrap:anywhere; }
html:root[data-theme] body .workout-pulse-detail { padding:12px;border-radius:10px;background:var(--m-lake-soft);color:var(--m-ink);line-height:1.6; }
html:root[data-theme][dir="rtl"] body .auth-art::after { background:linear-gradient(270deg,#233f36 0%,#233f36e8 20%,#233f3650 48%,transparent 75%),linear-gradient(to top,#142b24bb,transparent 22%); }
html:root[data-theme][dir="rtl"] body .auth-art img { transform:scaleX(-1); }
@media (max-width:820px) {
  html:root[data-theme] body .auth-shell { padding:0;display:block; }
  html:root[data-theme] body .brand-panel { min-height:260px;padding:24px;border-radius:0 0 22px 22px; }
  html:root[data-theme] body .auth-brand .dk-logo { width:36px;height:36px; }
  html:root[data-theme] body .auth-story { margin:24px 0 0;padding:0;width:62%; }
  html:root[data-theme] body .auth-story h1 { font-size:clamp(1.65rem,5.8vw,2.3rem);max-width:15ch;margin:0; }
  html:root[data-theme] body .auth-story>p:last-child,html:root[data-theme] body .auth-proof { display:none; }
  html:root[data-theme] body .auth-art img { height:100%;width:64%;inset:0 0 0 auto;mask-image:var(--photo-fade-inline);-webkit-mask-image:var(--photo-fade-inline);object-position:68% center; }
  html:root[data-theme] body .auth-art::after { background:linear-gradient(to bottom,#233f3660,transparent 50%,#233f3660); }
  html:root[data-theme] body .auth-contours { height:80%;inset:auto auto -20% -30%;opacity:.35; }
  html:root[data-theme] body .auth-card { width:auto;max-width:440px;padding:28px 24px;margin:auto; }
  html:root[data-theme] body .auth-card .auth-heading { font-size:1.6rem;margin-bottom:18px; }
  html:root[data-theme][dir="rtl"] body .auth-art img { inset:0 auto 0 0;mask-image:linear-gradient(to left,transparent,#000 65%);-webkit-mask-image:linear-gradient(to left,transparent,#000 65%); }
  html:root[data-theme][dir="rtl"] body .auth-art::after { background:linear-gradient(to bottom,#233f3660,transparent 50%,#233f3660); }
}

html:root[data-theme] body .coach-health-snapshot { display:flex;flex-wrap:wrap;gap:8px;margin:16px 0; }
html:root[data-theme] body .coach-health-snapshot span { padding:8px 12px;background:var(--m-subtle);border:1px solid var(--m-line);border-radius:8px;font-size:.8125rem;line-height:1.5; }

/* Session-specific coach choices and accessible replacement actions. */
.coach-plan-settings{margin:16px 0;padding:16px;border:1px solid var(--m-line);border-radius:14px;display:grid;gap:12px}.coach-plan-settings legend{font-weight:650;padding:0 6px}.coach-plan-settings p{margin:0;font-size:.9rem}.coach-plan-settings select{max-width:100%;min-height:44px}.coach-equipment{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px;padding-top:10px}.coach-gear-option{display:flex;align-items:center;gap:8px;min-height:44px}.coach-gear-option input{width:20px;height:20px;flex:none}.coach-plan-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}.coach-plan-row .plan-ex{width:100%;min-width:0}.coach-swap{min-height:44px}.coach-replacements{width:min(520px,calc(100% - 24px));max-height:80dvh;overflow:auto;padding:20px}.coach-replacement-option{display:flex;flex-direction:column;align-items:flex-start;text-align:start;width:100%;gap:6px;min-height:52px;margin-top:10px;padding:12px}.coach-replacement-option strong{overflow-wrap:anywhere}.coach-plan-row h4{overflow-wrap:anywhere}@media(max-width:420px){.coach-plan-row{grid-template-columns:minmax(0,1fr)}.coach-swap{justify-self:end}.coach-equipment{grid-template-columns:1fr 1fr}}

html[data-theme] #coachPlanCard .plan-ex{background:var(--m-surface);color:var(--m-ink);text-align:start}html[data-theme] #coachPlanCard .plan-ex :is(h4,p,small),html[data-theme] #coachPlanCard .plan-foot small{color:var(--m-ink)}

/* Three stages share the matte surfaces, with quieter optional preparation/recovery. */
.stage-preview{border:1px solid var(--line);border-radius:16px;padding:14px 18px;margin:14px 0;background:var(--m-surface)}
.stage-preview summary{cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:32px}
.stage-preview summary span,.stage-preview small{font-variant-numeric:tabular-nums;white-space:nowrap}
.stage-preview ol{padding-inline-start:22px}.stage-preview li{padding:8px 0}.stage-preview li small{display:block;margin-top:4px}
.stage-rail{display:flex;flex-wrap:wrap;gap:8px;margin-block-end:24px}.stage-rail span{padding:8px 12px;border:1px solid var(--line);border-radius:999px;font-size:.8rem}.stage-rail .active{background:var(--brand);color:var(--m-on-accent)}
.stage-total,.stage-timer{display:block;font-size:clamp(2.5rem,10vw,4.5rem);font-variant-numeric:tabular-nums;margin:20px 0;line-height:1.2}.stage-movement{font-size:1.2rem;line-height:1.6;max-width:48ch}
.stage-actions{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0}.stage-actions button{min-height:44px;white-space:normal}.stage-locked .queue-item{opacity:.55}
#liveOptionalStage{min-width:0}#liveOptionalStage h2{font-size:clamp(1.8rem,6vw,3rem);overflow-wrap:anywhere}

.stage-preview summary::after{content:"+";font-size:1.3rem}.stage-preview[open] summary::after{content:"−"}.stage-preview.cooldown{background:var(--m-accent-soft)}

/* A hidden-list marker must never hide warnings about exceeded limits. */
.diary-count.over-limit{color:var(--danger,#9b352f);font-weight:700}
#coachDiaryText,#coachDiaryList .diary-text,.meal-title,.goal-title{unicode-bidi:plaintext}
.coach-plan-row{grid-template-columns:minmax(0,1fr) auto!important;align-items:start}
.coach-plan-row .coach-swap{align-self:start;justify-self:end;max-width:112px;white-space:normal}
.coach-plan-row .plan-ex{padding:12px;min-width:0}
#coachInsightCard:empty{display:none}

.coach-refresh-help{display:block;max-width:55ch;color:var(--m-muted);font-size:.82rem;line-height:1.45;margin:8px 0}

/* Keep replacement words intact and respect translated minute abbreviations. */
html:root[data-theme] body .coach-plan-row .coach-swap{padding-inline:10px;max-width:min(160px,44vw);overflow-wrap:normal;word-break:normal}
html:root[data-theme] body .plan-head .pill{text-transform:none}