/* Section identities share the matte component contract. Only the signed-in app receives
   these palettes; dialogs inherit the current section, and sign-out restores the brand palette.
   :has is a progressive enhancement: older browsers retain the complete base matte design. */
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="today"] {
  --m-bg:#edf4ef;--m-surface:#fbfefb;--m-subtle:#e2eee5;
  --m-ink:#233f32;--m-muted:#52665b;--m-line:#cbded0;
  --m-accent:#247447;--m-accent-hover:#1b5b36;--m-accent-soft:#d5ebd9;
  --m-on-accent:#ffffff;--m-hero:#c8e6d1;--m-sand:#f2e8cf;
  --m-inverse:#194c35;--m-inverse-text:#f4f8ef;--m-inverse-muted:#d4e6d5;
}
html:root[data-theme="dark"] body:has(#appView:not(.hidden))[data-view="today"] {
  --m-bg:#182b22;--m-surface:#233d2d;--m-subtle:#2d4c37;
  --m-ink:#edf7e9;--m-muted:#bfd7c7;--m-line:#486850;
  --m-accent:#b5e18e;--m-accent-hover:#cbedaa;--m-accent-soft:#385b37;
  --m-on-accent:#243b22;--m-hero:#29513b;--m-sand:#4a4230;
  --m-inverse:#1e402b;--m-inverse-text:#f0f8e9;--m-inverse-muted:#ccdfc9;
}
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="history"] {
  --m-bg:#edf7f7;--m-surface:#fbffff;--m-subtle:#dcefee;
  --m-ink:#193e40;--m-muted:#48686b;--m-line:#bddcdb;
  --m-accent:#0e7478;--m-accent-hover:#095b60;--m-accent-soft:#cef0ec;
  --m-on-accent:#ffffff;--m-hero:#cef0ec;--m-sand:#e0f2f1;
  --m-inverse:#164b50;--m-inverse-text:#effcfa;--m-inverse-muted:#c4e5e3;
}
html:root[data-theme="dark"] body:has(#appView:not(.hidden))[data-view="history"] {
  --m-bg:#122c30;--m-surface:#1c3c40;--m-subtle:#285055;
  --m-ink:#e5f8f5;--m-muted:#b4d7d4;--m-line:#436d72;
  --m-accent:#76ded2;--m-accent-hover:#a0eee3;--m-accent-soft:#28555a;
  --m-on-accent:#123739;--m-hero:#28555a;--m-sand:#25484c;
  --m-inverse:#164147;--m-inverse-text:#eafbfa;--m-inverse-muted:#bce2de;
}
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="training"] {
  --m-bg:#f6eee8;--m-surface:#fffaf6;--m-subtle:#f0e2d6;
  --m-ink:#392f2c;--m-muted:#695b54;--m-line:#e4cdbf;
  --m-accent:#b94a1c;--m-accent-hover:#91380f;--m-accent-soft:#f9dac8;
  --m-on-accent:#ffffff;--m-hero:#f9dac8;--m-sand:#f9dac8;
  --m-inverse:#292f36;--m-inverse-text:#fff6ed;--m-inverse-muted:#e5cec0;
}
html:root[data-theme="dark"] body:has(#appView:not(.hidden))[data-view="training"] {
  --m-bg:#241d1a;--m-surface:#322721;--m-subtle:#44342b;
  --m-ink:#fff2e4;--m-muted:#dbc1ad;--m-line:#665043;
  --m-accent:#ffb37d;--m-accent-hover:#ffcb9f;--m-accent-soft:#583c28;
  --m-on-accent:#382213;--m-hero:#493427;--m-sand:#493427;
  --m-inverse:#181c23;--m-inverse-text:#fff6ed;--m-inverse-muted:#e5cec0;
}
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="progress"] {
  --m-bg:#edf2fc;--m-surface:#fbfdff;--m-subtle:#e0e9f8;
  --m-ink:#273957;--m-muted:#52647c;--m-line:#cdd9ed;
  --m-accent:#315fbd;--m-accent-hover:#22488f;--m-accent-soft:#dce7fb;
  --m-on-accent:#ffffff;--m-hero:#dce7fb;--m-sand:#e0e9f8;
  --m-inverse:#253d68;--m-inverse-text:#f0f5ff;--m-inverse-muted:#c5d6f1;
}
html:root[data-theme="dark"] body:has(#appView:not(.hidden))[data-view="progress"] {
  --m-bg:#182333;--m-surface:#24334a;--m-subtle:#304565;
  --m-ink:#e8f0ff;--m-muted:#b9c9e2;--m-line:#496285;
  --m-accent:#a5c3ff;--m-accent-hover:#bed4ff;--m-accent-soft:#324c75;
  --m-on-accent:#1f355a;--m-hero:#304972;--m-sand:#304565;
  --m-inverse:#223955;--m-inverse-text:#f0f5ff;--m-inverse-muted:#c5d6f1;
}
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="coach"] {
  --m-bg:#f4eef6;--m-surface:#fffbff;--m-subtle:#ebe0f0;
  --m-ink:#403048;--m-muted:#67566f;--m-line:#ddcde4;
  --m-accent:#8243a1;--m-accent-hover:#66317f;--m-accent-soft:#ead7f2;
  --m-on-accent:#ffffff;--m-hero:#ead7f2;--m-sand:#eee0ee;
  --m-inverse:#442553;--m-inverse-text:#fbf0ff;--m-inverse-muted:#e3cde9;
}
html:root[data-theme="dark"] body:has(#appView:not(.hidden))[data-view="coach"] {
  --m-bg:#241c2b;--m-surface:#33263d;--m-subtle:#48344f;
  --m-ink:#f4eaf9;--m-muted:#cebbd8;--m-line:#654d71;
  --m-accent:#ddb0f6;--m-accent-hover:#e9cdff;--m-accent-soft:#50375e;
  --m-on-accent:#3b2348;--m-hero:#4d345c;--m-sand:#48344f;
  --m-inverse:#3d284c;--m-inverse-text:#fbf0ff;--m-inverse-muted:#e3cde9;
}
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="profile"] {
  --m-bg:#eff1f5;--m-surface:#fcfdff;--m-subtle:#e3e7ee;
  --m-ink:#2c3b4c;--m-muted:#526174;--m-line:#d0d8e3;
  --m-accent:#4a6180;--m-accent-hover:#354d6a;--m-accent-soft:#dde5f0;
  --m-on-accent:#ffffff;--m-hero:#d9e3ef;--m-sand:#e3e7ee;
  --m-inverse:#2b3c50;--m-inverse-text:#f1f5fc;--m-inverse-muted:#cbd8e9;
}
html:root[data-theme="dark"] body:has(#appView:not(.hidden))[data-view="profile"] {
  --m-bg:#1d2530;--m-surface:#293442;--m-subtle:#374558;
  --m-ink:#edf1f7;--m-muted:#bdcadb;--m-line:#4f6076;
  --m-accent:#b2c7e6;--m-accent-hover:#cedcf0;--m-accent-soft:#3a4e69;
  --m-on-accent:#23364f;--m-hero:#364963;--m-sand:#374558;
  --m-inverse:#293c55;--m-inverse-text:#f1f5fc;--m-inverse-muted:#cbd8e9;
}

html:root[data-theme] body:has(#appView:not(.hidden)) {
  /* Rebind legacy aliases here: root aliases otherwise retain the root palette. */
  --navy:var(--m-ink);--navy-2:var(--m-accent);--cyan:var(--m-accent);--cyan-text:var(--m-accent);
  --cyan-soft:var(--m-accent-soft);--yellow:var(--m-accent-soft);--yellow-soft:var(--m-subtle);
  --paper:var(--m-bg);--paper-2:var(--m-surface);--white:var(--m-surface);
  --ink:var(--m-ink);--muted:var(--m-muted);--line:var(--m-line);--brand:var(--m-accent);--outline:var(--m-line);--dk-text:var(--m-ink);
  --m-frame:var(--m-subtle);--s-highlight:#ffbc76;--s-on-highlight:#382213;
}
html:root[data-theme] body:has(#appView:not(.hidden)) .sidebar, html:root[data-theme] body:has(#appView:not(.hidden)) .bottom-nav { background:var(--m-frame); }
html:root[data-theme] body .sidebar .sidebar-foot .text-button:not(.danger-text) { color:var(--m-ink); }
html:root[data-theme] body:has(#appView:not(.hidden)) .topbar { border-bottom:2px solid var(--m-accent); }
html:root[data-theme] body:has(#appView:not(.hidden)) .topbar h1 { font-weight:700; }
html:root[data-theme] body:has(#appView:not(.hidden)) .page-heading .eyebrow { color:var(--m-accent); }

html:root[data-theme] body:has(#appView:not(.hidden)) :is(input,textarea)::placeholder { color:var(--m-muted);opacity:1; }

/* Each destination keeps its own colour in navigation; labels and selection remain explicit. */
html:root[data-theme] body :is(.nav-item,.bottom-nav button)[data-view="today"] { --nav-accent:#247447;--nav-tint:#d5ebd9; }
html:root[data-theme="dark"] body :is(.nav-item,.bottom-nav button)[data-view="today"] { --nav-accent:#b5e18e;--nav-tint:#385b37; }
html:root[data-theme] body :is(.nav-item,.bottom-nav button)[data-view="history"] { --nav-accent:#0e7478;--nav-tint:#e3f7f4; }
html:root[data-theme="dark"] body :is(.nav-item,.bottom-nav button)[data-view="history"] { --nav-accent:#76ded2;--nav-tint:#28555a; }
html:root[data-theme] body :is(.nav-item,.bottom-nav button)[data-view="training"] { --nav-accent:#b94a1c;--nav-tint:#ffefe5; }
html:root[data-theme="dark"] body :is(.nav-item,.bottom-nav button)[data-view="training"] { --nav-accent:#ffb37d;--nav-tint:#583c28; }
html:root[data-theme] body :is(.nav-item,.bottom-nav button)[data-view="progress"] { --nav-accent:#315fbd;--nav-tint:#dce7fb; }
html:root[data-theme="dark"] body :is(.nav-item,.bottom-nav button)[data-view="progress"] { --nav-accent:#a5c3ff;--nav-tint:#324c75; }
html:root[data-theme] body :is(.nav-item,.bottom-nav button)[data-view="coach"] { --nav-accent:#8243a1;--nav-tint:#ead7f2; }
html:root[data-theme="dark"] body :is(.nav-item,.bottom-nav button)[data-view="coach"] { --nav-accent:#ddb0f6;--nav-tint:#50375e; }
html:root[data-theme] body :is(.nav-item,.bottom-nav button)[data-view="profile"] { --nav-accent:#4a6180;--nav-tint:#dde5f0; }
html:root[data-theme="dark"] body :is(.nav-item,.bottom-nav button)[data-view="profile"] { --nav-accent:#b2c7e6;--nav-tint:#3a4e69; }
html:root[data-theme] body .nav-item span, html:root[data-theme] body .bottom-nav button:not(.active)>span { color:var(--m-muted); }
html:root[data-theme] body .nav-item.active { background:var(--nav-tint);color:var(--nav-accent);box-shadow:inset 3px 0 var(--nav-accent); }
html:root[data-theme][dir="rtl"] body .nav-item.active { box-shadow:inset -3px 0 var(--nav-accent); }
html:root[data-theme] body .bottom-nav button.active { background:var(--nav-tint);color:var(--nav-accent); }

/* Training: a graphite anchor, warm action colour and tighter, stronger type. */
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="training"] .topbar h1 { font-weight:750; }
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="training"] .training-mark { color:var(--m-accent);background:var(--m-accent-soft);border-radius:8px; }
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="training"] .training-intro .eyebrow { color:var(--m-accent); }
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="training"] #activeProgramCard { background:var(--m-inverse);color:var(--m-inverse-text);border-color:var(--m-inverse);border-radius:10px; }
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="training"] #activeProgramCard :is(h3,h4) { color:var(--m-inverse-text);font-weight:750; }
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="training"] #activeProgramCard :is(p,.eyebrow,.leave-program) { color:var(--m-inverse-muted); }
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="training"] #activeProgramCard :is(.primary,.secondary) { background:var(--s-highlight);color:var(--s-on-highlight);border-color:transparent; }
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="training"] :is(.training-create-bar,.run-entry) { border-inline-start:4px solid var(--m-accent);border-radius:8px; }
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="training"] .training-create-bar { background:var(--m-accent-soft); }
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="training"] .program-card { border-radius:8px; }
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="training"] .queue-item.active { background:var(--m-accent);color:var(--m-on-accent); }
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="training"] .queue-item.active .queue-number { background:var(--m-inverse);color:var(--m-inverse-text); }

/* Progress: cool blue data panels, consistent chart colour and tabular figures. */
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="progress"] #progressSection>.section-intro { padding:18px 22px;background:var(--m-accent-soft);border-radius:10px; }
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="progress"] .progress-board { border-top:4px solid var(--m-accent);border-radius:8px; }
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="progress"] #progressChartCard { --accent:var(--m-accent);border-radius:8px;border-top:4px solid var(--m-accent); }
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="progress"] :is(.board-value,.metric-headline strong,.stat strong) { color:var(--m-accent);font-variant-numeric:tabular-nums; }
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="progress"] #metricChart { color:var(--m-accent); }
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="progress"] .chart-line { filter:none; }
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="progress"] :is(.chart-dot,.chart-marker-ring) { fill:var(--m-surface); }
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="progress"] .chart-latest { stroke:var(--m-surface); }

/* Coach: plum conversation panels, with calm text spacing and a distinct check-in. */
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="coach"] .coach-intro { background:var(--m-accent-soft);border:1px solid var(--m-line);border-radius:14px;padding:22px;flex-wrap:wrap;gap:16px; }
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="coach"] .coach-intro>div { min-width:0; }
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="coach"] .coach-intro .section-actions { flex-wrap:wrap;max-width:100%; }
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="coach"] #coachCheckIn { border-top:4px solid var(--m-accent);border-radius:14px; }
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="coach"] .coach-insight-card h3 { color:var(--m-accent); }
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="coach"] :is(.coach-summary,.coach-intro p) { line-height:1.65; }

/* Nutrition uses clean turquoise; profile stays neutral and structured. */
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="history"] #historySection>.section-head:first-child { border-bottom:3px solid var(--m-accent-soft);padding-bottom:18px; }
html:root[data-theme] body:has(#appView:not(.hidden))[data-view="profile"] .profile-identity { border-inline-start:4px solid var(--m-accent); }
@media(max-width:820px) {
  html:root[data-theme] body:has(#appView:not(.hidden))[data-view="progress"] #progressSection>.section-intro { padding:16px; }
  html:root[data-theme] body:has(#appView:not(.hidden))[data-view="coach"] .coach-intro { padding:18px; }
}

/* Natural-colour photography bleeds into the recommendation, with no rectangular left edge.
   Copy and controls occupy their own column; the picture never sits under them. */
html:root[data-theme] body main #todaySection .coach-card { min-height:300px;isolation:isolate; }
html:root[data-theme] body main #todaySection .coach-card .coach-copy { max-width:59%; }
html:root[data-theme][data-text] body main #todaySection .coach-card .coach-copy { max-width:59%; }
html:root[data-theme] body main #todaySection .coach-card::after {
  display:block;inset:0 0 0 auto;width:41%;border-radius:0;
  background:var(--scene) right center/cover no-repeat;filter:none;opacity:0;z-index:0;transition:opacity .25s ease-out;
  -webkit-mask-image:linear-gradient(to right,transparent,#000 38%);
  mask-image:linear-gradient(to right,transparent,#000 38%);
}
html:root[data-theme] body main #todaySection .coach-card.scene-ready::after { opacity:1; }
html:root[data-theme] body .coach-motion { position:absolute;inset:auto -3% -12% auto;width:64%;height:110%;color:var(--m-accent);opacity:.18;stroke-width:1.8;pointer-events:none;transform:rotate(var(--motion-turn,-7deg));z-index:0; }
html:root[data-theme] body .coach-card.scene-calm .coach-motion { display:none; }
html:root[data-theme] body .coach-card:not(.scene-ready) .coach-motion { opacity:.3; }
html:root[data-theme] body .brand-panel::after { background:none;filter:none;opacity:.7;border:2px solid var(--m-accent);border-radius:50%;box-shadow:0 0 0 18px var(--m-subtle); }
html:root[data-theme][dir="rtl"] body main #todaySection .coach-card::after { inset:0 auto 0 0;-webkit-mask-image:linear-gradient(to left,transparent,#000 38%);mask-image:linear-gradient(to left,transparent,#000 38%); }
html:root[data-theme][dir="rtl"] body .coach-motion { right:auto;left:-3%;transform:scaleX(-1) rotate(var(--motion-turn,-7deg)); }
@media(max-width:820px) {
  html:root[data-theme] body main #todaySection .coach-card { display:flex;flex-direction:column;align-items:stretch;gap:0;min-height:0;padding:22px 18px; }
  html:root[data-theme] body main #todaySection .coach-card .coach-copy,
  html:root[data-theme][data-text] body main #todaySection .coach-card .coach-copy { max-width:100%;width:100%; }
  html:root[data-theme] body main #todaySection .coach-card::after,
  html:root[data-theme][dir="rtl"] body main #todaySection .coach-card::after {
    position:relative;inset:auto;order:-1;flex:none;width:calc(100% + 36px);height:185px;margin:-22px -18px 4px;
    background-position:right top;-webkit-mask-image:linear-gradient(to bottom,#000 64%,transparent);mask-image:linear-gradient(to bottom,#000 64%,transparent);
  }
  html:root[data-theme] body .coach-motion { width:100%;height:80%; }
}

/* A decorative photo owns its space while loading or failing; calm is an explicit profile choice. */
html:root[data-theme] body main #todaySection .coach-card.scene-calm::after { display:none; }
@media(prefers-reduced-motion:reduce) { html:root[data-theme] body main #todaySection .coach-card::after { transition:none; } }