/*
 * Be:Move Gym design-system adapter
 *
 * Source: Be_Move Design System.zip / handoff/css/styles.css
 *
 * The handoff is intentionally kept as a scoped adapter instead of being
 * loaded wholesale. Formula X has a second product surface, so unscoped
 * .card/.btn rules would change Formula pages while the Bemove bundle is
 * loading. These tokens and overrides are shared by the member app and the
 * Bemove X mode without changing their existing data/event markup.
 */
@import url("https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600;700&family=Barlow:ital,wght@0,400;0,500;0,600;0,700;1,400;1,600&family=Barlow+Condensed:wght@500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap");

:root {
  --bm-font-display: "Oswald", "Arial Narrow", Impact, sans-serif;
  --bm-font-condensed: "Barlow Condensed", "Arial Narrow", sans-serif;
  --bm-font-body: "Barlow", "Helvetica Neue", Arial, sans-serif;
  --bm-font-mono: "IBM Plex Mono", ui-monospace, monospace;
  --bm-orange-100: #fdeadf;
  --bm-orange-200: #facfb6;
  --bm-orange-300: #f5a97f;
  --bm-orange-400: #f0854e;
  --bm-orange-500: #ec662a;
  --bm-orange-600: #d2531b;
  --bm-orange-700: #a94013;
  --bm-charcoal-900: #141414;
  --bm-charcoal-850: #1c1c1c;
  --bm-charcoal-800: #232323;
  --bm-charcoal-700: #353535;
  --bm-charcoal-600: #4a4a4a;
  --bm-charcoal-500: #6b6b6b;
  --bm-charcoal-400: #8e8e8e;
  --bm-charcoal-300: #b5b5b5;
  --bm-charcoal-200: #d6d6d6;
  --bm-charcoal-100: #e9e9e9;
  --bm-charcoal-050: #f4f4f4;
  --bm-white: #fff;
  --bm-chalk: #faf9f7;
  --bm-green-500: #2e9e5b;
  --bm-green-100: #e2f4e9;
  --bm-amber-500: #f2b01e;
  --bm-amber-100: #fdf1d5;
  --bm-red-500: #d93a3a;
  --bm-red-100: #fbe4e4;
  --bm-blue-500: #2f6fd0;
  --bm-blue-100: #e4edfb;
  --bm-radius-control: 4px;
  --bm-radius-card: 6px;
  --bm-radius-sheet: 10px;
  --bm-shadow-card: 0 1px 2px rgb(20 20 20 / 6%), 0 8px 20px -14px rgb(20 20 20 / 22%);
  --bm-shadow-raised: 0 2px 4px rgb(20 20 20 / 8%), 0 20px 44px -20px rgb(20 20 20 / 34%);
}

/* Shared role aliases. Existing screens consume these names already. */
body.bemove-design-theme {
  color-scheme: light;
  --primary: var(--bm-orange-500);
  --primary-dark: var(--bm-orange-600);
  --primary-light: var(--bm-orange-100);
  --accent: var(--bm-orange-500);
  --bm-surface: var(--bm-white);
  --bm-surface-muted: var(--bm-charcoal-050);
  --bm-text: var(--bm-charcoal-900);
  --bm-text-sub: var(--bm-charcoal-500);
  --bm-border: var(--bm-charcoal-100);
  --text: var(--bm-charcoal-900);
  --text-sub: var(--bm-charcoal-500);
  --border: rgb(20 20 20 / 12%);
  --card: var(--bm-surface);
  --ink: var(--bm-charcoal-900);
  --muted: var(--bm-charcoal-500);
  --line: var(--bm-charcoal-100);
  --canvas: var(--bm-chalk);
  --purple: var(--bm-orange-500);
  --purple-dark: var(--bm-orange-700);
  --purple-soft: var(--bm-orange-100);
  --orange: var(--bm-orange-500);
  background: var(--bm-chalk);
  color: var(--bm-charcoal-700);
  font-family: var(--bm-font-body);
}

body.bemove-design-theme :where(h1, h2, h3, h4, .nav-logo, .btn, .button, .eyebrow, .bm-label) {
  font-family: var(--bm-font-display);
}

/* --------------------------- Member app --------------------------- */
body.bemove-design-theme .app {
  background: var(--bm-chalk);
}

body.bemove-design-theme .topbar {
  min-height: 72px;
  background: var(--bm-charcoal-900);
  border-bottom-color: var(--bm-charcoal-700);
  color: var(--bm-white);
}

body.bemove-design-theme .brand {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--bm-orange-500);
  font-family: var(--bm-font-display);
  font-size: 20px;
  letter-spacing: .04em;
  text-transform: uppercase;
}
body.bemove-design-theme .brand::before {
  content: "";
  display: inline-block;
  width: 26px;
  height: 26px;
  flex: 0 0 26px;
  background: url("../assets/bemove/design-system/logo-mark.png") center / contain no-repeat;
}
body.bemove-design-theme .nav-logo.is-bemove {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

body.bemove-design-theme .member-meta { color: var(--bm-charcoal-300); }
body.bemove-design-theme .member-meta strong { color: var(--bm-white); }
body.bemove-design-theme .role {
  border-radius: var(--bm-radius-control);
  color: var(--bm-orange-500);
  background: var(--bm-orange-100);
}

body.bemove-design-theme .screen { padding-top: 24px; }
body.bemove-design-theme .alert-card {
  border-radius: var(--bm-radius-card);
  background: var(--bm-orange-500);
  box-shadow: none;
}
body.bemove-design-theme .alert-card.diet-alert {
  border-color: var(--bm-amber-500);
  border-radius: var(--bm-radius-card);
  background: var(--bm-amber-100);
}
body.bemove-design-theme .hero {
  border-radius: var(--bm-radius-card);
  background: var(--bm-charcoal-900);
  box-shadow: var(--bm-shadow-raised);
}
body.bemove-design-theme .hero::after { border-color: rgb(236 102 42 / 18%); }
body.bemove-design-theme .eyebrow { color: var(--bm-orange-400); }
body.bemove-design-theme .eyebrow.dark { color: var(--bm-orange-600); }

body.bemove-design-theme .card,
body.bemove-design-theme .score-card,
body.bemove-design-theme .bemove-panel {
  border-radius: var(--bm-radius-card);
  border-color: var(--bm-charcoal-100);
  box-shadow: var(--bm-shadow-card);
}
body.bemove-design-theme .card h2,
body.bemove-design-theme .outside-title,
body.bemove-design-theme .page-title h1,
body.bemove-design-theme .section-head h2 { letter-spacing: .02em; }

body.bemove-design-theme .button,
body.bemove-design-theme .btn {
  border-radius: var(--bm-radius-control);
  font-family: var(--bm-font-display);
  letter-spacing: .06em;
  text-transform: uppercase;
}
body.bemove-design-theme .button-primary,
body.bemove-design-theme .btn-primary {
  border-color: transparent;
  background: var(--bm-orange-500);
  box-shadow: none;
  color: var(--bm-white);
}
body.bemove-design-theme .button-primary:hover,
body.bemove-design-theme .btn-primary:hover { background: var(--bm-orange-600); }
body.bemove-design-theme .button-outline,
body.bemove-design-theme .btn-outline {
  border-color: var(--bm-charcoal-900);
  color: var(--bm-charcoal-900);
  background: transparent;
}
body.bemove-design-theme .button-white { color: var(--bm-charcoal-900); }
body.bemove-design-theme .progress i,
body.bemove-design-theme .wearable-progress i,
body.bemove-design-theme .goal-line i { background: var(--bm-orange-500); }
body.bemove-design-theme .bottom-nav {
  border-top-color: var(--bm-charcoal-200);
  background: rgb(255 255 255 / 96%);
}
body.bemove-design-theme .bottom-nav > button.is-active { color: var(--bm-orange-600); }
body.bemove-design-theme .bottom-nav > button.is-active:not(.main-action) { background: var(--bm-orange-100); }
body.bemove-design-theme .bottom-nav .main-action span {
  border-radius: var(--bm-radius-control);
  background: var(--bm-orange-500);
  box-shadow: var(--bm-shadow-raised);
}
body.bemove-design-theme .calorie-card,
body.bemove-design-theme .score-card {
  border: 0;
  background: var(--bm-charcoal-900);
  box-shadow: var(--bm-shadow-raised);
}
body.bemove-design-theme .calorie-card::after { border-color: rgb(236 102 42 / 22%); }
body.bemove-design-theme .meal-kind,
body.bemove-design-theme .trainer-feedback,
body.bemove-design-theme .body-advice { border-radius: var(--bm-radius-card); }
body.bemove-design-theme .meal-kind { color: var(--bm-orange-700); background: var(--bm-orange-100); }
body.bemove-design-theme .trainer-feedback,
body.bemove-design-theme .body-advice { border-color: var(--bm-orange-200); background: var(--bm-orange-100); }
body.bemove-design-theme .score-ring { background: conic-gradient(var(--bm-orange-400) calc(var(--score) * 1%), rgb(255 255 255 / 18%) 0); }
body.bemove-design-theme .score-ring::before { background: var(--bm-charcoal-800); }
body.bemove-design-theme .modal-sheet {
  border-radius: var(--bm-radius-sheet) var(--bm-radius-sheet) var(--bm-radius-card) var(--bm-radius-card);
  border-color: var(--bm-charcoal-100);
  box-shadow: var(--bm-shadow-raised);
}
body.bemove-design-theme .modal-head small { color: var(--bm-orange-600); }
body.bemove-design-theme .segmented input:checked + label { color: var(--bm-orange-700); }
body.bemove-design-theme .segmented input:checked + label,
body.bemove-design-theme .field input:focus,
body.bemove-design-theme .field textarea:focus { border-color: var(--bm-orange-500); }
body.bemove-design-theme .check-list label:has(input:checked) { border-color: var(--bm-orange-200); background: var(--bm-orange-100); }
body.bemove-design-theme .check-list input,
body.bemove-design-theme .share-check input { accent-color: var(--bm-orange-500); }
body.bemove-design-theme .muscle-period button.is-active {
  border-color: var(--bm-orange-500);
  background: var(--bm-orange-500);
  box-shadow: none;
}

/* -------------------------- Bemove X mode ------------------------- */
body.bemove-design-theme .main-nav {
  background: var(--bm-charcoal-900);
  border-bottom-color: var(--bm-charcoal-700);
}
body.bemove-design-theme .nav-logo.is-bemove { color: var(--bm-orange-500); text-shadow: none; }
body.bemove-design-theme .nav-tabs .nav-tab {
  border-radius: var(--bm-radius-control);
  color: var(--bm-charcoal-300);
  font-family: var(--bm-font-display);
  letter-spacing: .04em;
  text-transform: uppercase;
}
body.bemove-design-theme .nav-tabs .nav-tab:hover { background: var(--bm-charcoal-800); }
body.bemove-design-theme .nav-tabs .nav-tab.active { background: var(--bm-orange-500); color: var(--bm-white); }
body.bemove-design-theme .page-content { background: var(--bm-chalk); }
body.bemove-design-theme .bemove-screen { gap: 16px; }
body.bemove-design-theme .bemove-screen h3,
body.bemove-design-theme .bemove-screen h4,
body.bemove-design-theme .bemove-title-row h3,
body.bemove-design-theme .bemove-member-section-title { font-family: var(--bm-font-display); letter-spacing: .03em; text-transform: uppercase; }
body.bemove-design-theme .bemove-hero,
body.bemove-design-theme .bemove-member-hero {
  border: 0;
  border-left: 4px solid var(--bm-orange-500);
  border-radius: var(--bm-radius-card);
  background: var(--bm-charcoal-900);
  box-shadow: var(--bm-shadow-raised);
}
body.bemove-design-theme .bemove-hero-title,
body.bemove-design-theme .bemove-member-hero .eyebrow { color: var(--bm-orange-400); }
body.bemove-design-theme .bemove-hero-rate { color: var(--bm-orange-400); }
body.bemove-design-theme .bemove-member-alert {
  border-radius: var(--bm-radius-card);
  background: var(--bm-orange-500);
  box-shadow: none;
}
body.bemove-design-theme .bemove-member-alert-btn { color: var(--bm-charcoal-900); }
body.bemove-design-theme .bemove-panel,
body.bemove-design-theme .bemove-screen > .card,
body.bemove-design-theme .bemove-member-card,
body.bemove-design-theme .bemove-branch-ranking-card,
body.bemove-design-theme .bemove-inbody-trend-card {
  background: var(--bm-white);
  border-color: var(--bm-charcoal-100);
  border-radius: var(--bm-radius-card);
  box-shadow: var(--bm-shadow-card);
}
body.bemove-design-theme .bemove-stat,
body.bemove-design-theme .bemove-pt-card,
body.bemove-design-theme .bemove-member-kcal-kpis span { border-radius: var(--bm-radius-card); }
body.bemove-design-theme .bemove-pt-total { background: var(--bm-orange-100); color: var(--bm-orange-700); }
body.bemove-design-theme .bemove-pt-done { background: var(--bm-green-100); color: #1b6b3c; }
body.bemove-design-theme .bemove-pt-remain { background: var(--bm-amber-100); color: #8a5f05; }
body.bemove-design-theme .bemove-member-progress-bar span,
body.bemove-design-theme .bemove-progress > span { background: var(--bm-orange-500); }
body.bemove-design-theme .bemove-member-stage-badge { border-radius: var(--bm-radius-control); color: var(--bm-orange-700); background: var(--bm-orange-100); }
body.bemove-design-theme .bemove-subtabs { border-bottom-color: var(--bm-charcoal-200); }
body.bemove-design-theme .bemove-subtab { border-radius: var(--bm-radius-control); font-family: var(--bm-font-display); }
body.bemove-design-theme .bemove-subtab.active { color: var(--bm-white); background: var(--bm-orange-500); }
body.bemove-design-theme .bemove-modal-backdrop,
body.bemove-design-theme .bemove-modal-overlay,
body.bemove-design-theme .fx-modal-overlay { background: rgb(20 20 20 / 62%); }
body.bemove-design-theme .bemove-modal,
body.bemove-design-theme .fx-modal,
body.bemove-design-theme .bemove-self-workout-modal,
body.bemove-design-theme .bemove-schedule-modal { border-radius: var(--bm-radius-sheet); border-color: var(--bm-charcoal-100); box-shadow: var(--bm-shadow-raised); }
body.bemove-design-theme .bemove-modal-header h4,
body.bemove-design-theme .bemove-self-workout-head h3 { font-family: var(--bm-font-display); text-transform: uppercase; }
body.bemove-design-theme .bemove-self-workout-type.is-active,
body.bemove-design-theme .bemove-self-workout-type[data-type="weight"].is-active,
body.bemove-design-theme .bemove-self-workout-type[data-type="cardio"].is-active { border-color: var(--bm-orange-500); color: var(--bm-orange-700); background: var(--bm-orange-100); }
body.bemove-design-theme .bemove-diet-summary-kcal,
body.bemove-design-theme .bemove-diet-kpi-value { color: var(--bm-charcoal-900); }
body.bemove-design-theme .bemove-diet-top-kcal { color: var(--bm-orange-700); background: var(--bm-orange-100); }
body.bemove-design-theme .bemove-diet-mix-row .bar i { background: var(--bm-orange-500); }
body.bemove-design-theme .bemove-inbody-score-card { border-radius: var(--bm-radius-card); background: var(--bm-charcoal-900); }
body.bemove-design-theme .bemove-inbody-graph-card,
body.bemove-design-theme .bemove-inbody-box,
body.bemove-design-theme .bemove-self-homework-detail { border-radius: var(--bm-radius-card); }
body.bemove-design-theme .bemove-satisfaction-table th { background: var(--bm-charcoal-050); }

@media (max-width: 720px) {
  body.bemove-design-theme .nav-tabs .nav-tab { letter-spacing: 0; }
  body.bemove-design-theme .bemove-screen { gap: 12px; }
}

/* -------------------------- Be:Move dark mode -------------------------- */
/* The preference is scoped to Be:Move only; Formula X keeps its own theme. */
/* 네이티브 컨트롤(select 목록, 스크롤바, 날짜 피커)은 color-scheme 를 봐야
   다크로 렌더된다. Formula 다크는 :root[data-formula-theme="dark"] 에서
   이미 켜지지만, 비무브 브랜드 사용자는 그 속성이 지워져 흰 목록이 남았다.
   (CRM 「혜택」 다중선택 목록이 그랬다) */
html[data-bemove-theme="dark"] { background: #0f1114; color-scheme: dark; }
html[data-bemove-theme="dark"] body.bemove-design-theme {
  color-scheme: dark;
  --bm-chalk: #0f1114;
  /* Keep white as a text/border token; surfaces use --bm-surface. */
  --bm-white: #fff;
  --bm-surface: #1a1e24;
  --bm-surface-muted: #20262d;
  --bm-text: #f2f5f8;
  --bm-text-sub: #b5bec9;
  --bm-border: #3b444f;
  --bm-charcoal-050: #20262d;
  --bm-charcoal-100: #2d343d;
  --bm-charcoal-200: #3b444f;
  --bm-charcoal-300: #a6b0bc;
  --bm-charcoal-400: #8d98a6;
  --bm-charcoal-500: #aeb7c3;
  --bm-charcoal-600: #737e8b;
  --bm-charcoal-700: #e4e8ed;
  --bm-charcoal-800: #252b32;
  --bm-charcoal-850: #171b20;
  --bm-charcoal-900: #0d0f12;
  --text: #e4e8ed;
  --text-sub: #aeb7c3;
  --text-muted: #8d98a6;
  --border: #2d343d;
  --card: var(--bm-surface);
  /* --card 만 어둡게 바꾸면 var(--bg-sub, <밝은 폴백>) 을 쓰는 곳들이 흰 판으로 남는다 */
  --bg-sub: var(--bm-surface-muted, #20262d);
  --ink: #f3f5f7;
  --muted: #aeb7c3;
  --line: #2d343d;
  --canvas: #0f1114;
  --purple: var(--bm-orange-500);
  --purple-dark: var(--bm-orange-700);
  --purple-soft: rgb(236 102 42 / 18%);
  background: var(--bm-chalk);
  color: var(--text);
}

html[data-bemove-theme="dark"] body.bemove-design-theme .app,
html[data-bemove-theme="dark"] body.bemove-design-theme .viewport,
html[data-bemove-theme="dark"] body.bemove-design-theme .page-content {
  background: var(--bm-chalk);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .card,
html[data-bemove-theme="dark"] body.bemove-design-theme .bemove-panel,
html[data-bemove-theme="dark"] body.bemove-design-theme .bemove-member-card,
html[data-bemove-theme="dark"] body.bemove-design-theme .bemove-branch-ranking-card,
html[data-bemove-theme="dark"] body.bemove-design-theme .bemove-inbody-trend-card {
  background: var(--bm-surface);
  border-color: var(--bm-charcoal-100);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .button-outline,
html[data-bemove-theme="dark"] body.bemove-design-theme .btn-outline {
  border-color: var(--bm-charcoal-200);
  color: var(--bm-charcoal-700);
  background: var(--bm-surface);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .button-white {
  color: var(--bm-charcoal-900);
  background: #fff;
}
html[data-bemove-theme="dark"] body.bemove-design-theme input:not([type="checkbox"]):not([type="radio"]),
html[data-bemove-theme="dark"] body.bemove-design-theme textarea,
html[data-bemove-theme="dark"] body.bemove-design-theme select,
html[data-bemove-theme="dark"] body.bemove-design-theme .form-control {
  border-color: var(--bm-charcoal-200);
  color: var(--bm-charcoal-700);
  background: #15191e;
}
html[data-bemove-theme="dark"] body.bemove-design-theme input::placeholder,
html[data-bemove-theme="dark"] body.bemove-design-theme textarea::placeholder {
  color: var(--bm-charcoal-400);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .bottom-nav {
  border-top-color: var(--bm-charcoal-200);
  background: rgb(19 22 27 / 96%);
  box-shadow: 0 -10px 28px rgb(0 0 0 / 28%);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .bottom-nav > button.is-active:not(.main-action) {
  background: rgb(236 102 42 / 18%);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .theme-toggle,
html[data-bemove-theme="dark"] body.bemove-design-theme .bemove-theme-toggle {
  border-color: var(--bm-charcoal-200);
  color: var(--bm-charcoal-700);
  background: var(--bm-charcoal-850);
}

/* Standalone member app has a few intentionally compact, hard-coded cards. */
html[data-bemove-theme="dark"] body.bemove-design-theme .navigator-grid > div,
html[data-bemove-theme="dark"] body.bemove-design-theme .metric-pair > div,
html[data-bemove-theme="dark"] body.bemove-design-theme .wearable-metrics > div,
html[data-bemove-theme="dark"] body.bemove-design-theme .condition-result-grid div,
html[data-bemove-theme="dark"] body.bemove-design-theme .exercise-entry,
html[data-bemove-theme="dark"] body.bemove-design-theme .exercise-builder,
html[data-bemove-theme="dark"] body.bemove-design-theme .private-field {
  border-color: var(--bm-charcoal-100);
  background: var(--bm-charcoal-850);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .navigator-grid .accent,
html[data-bemove-theme="dark"] body.bemove-design-theme .trainer-feedback,
html[data-bemove-theme="dark"] body.bemove-design-theme .body-advice,
html[data-bemove-theme="dark"] body.bemove-design-theme .nutrition-result,
html[data-bemove-theme="dark"] body.bemove-design-theme .effort-field,
html[data-bemove-theme="dark"] body.bemove-design-theme .trainer-share {
  border-color: rgb(236 102 42 / 34%);
  background: rgb(236 102 42 / 12%);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .week-days button,
html[data-bemove-theme="dark"] body.bemove-design-theme .segmented,
html[data-bemove-theme="dark"] body.bemove-design-theme .muscle-side,
html[data-bemove-theme="dark"] body.bemove-design-theme .log-detail,
html[data-bemove-theme="dark"] body.bemove-design-theme .survey-guide,
html[data-bemove-theme="dark"] body.bemove-design-theme .notification-list button {
  border-color: var(--bm-charcoal-100);
  color: var(--bm-charcoal-300);
  background: var(--bm-charcoal-850);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .week-days .done { color: #6ee7a5; background: #123a28; }
html[data-bemove-theme="dark"] body.bemove-design-theme .week-days .today { color: #fff; background: var(--bm-orange-500); }
html[data-bemove-theme="dark"] body.bemove-design-theme .field > span,
html[data-bemove-theme="dark"] body.bemove-design-theme .choice-field legend,
html[data-bemove-theme="dark"] body.bemove-design-theme .share-check,
html[data-bemove-theme="dark"] body.bemove-design-theme .pain-options label,
html[data-bemove-theme="dark"] body.bemove-design-theme .survey-item legend {
  color: var(--bm-charcoal-300);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .segmented label,
html[data-bemove-theme="dark"] body.bemove-design-theme .muscle-side button,
html[data-bemove-theme="dark"] body.bemove-design-theme .bottom-nav > button {
  color: var(--bm-charcoal-300);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .segmented input:checked + label,
html[data-bemove-theme="dark"] body.bemove-design-theme .muscle-side button.is-active {
  color: var(--bm-charcoal-700);
  background: var(--bm-charcoal-800);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .field input,
html[data-bemove-theme="dark"] body.bemove-design-theme .field textarea,
html[data-bemove-theme="dark"] body.bemove-design-theme .feedback-form input,
html[data-bemove-theme="dark"] body.bemove-design-theme .exercise-metrics input {
  border-color: var(--bm-charcoal-200);
  color: var(--bm-charcoal-700);
  background: #15191e;
}
html[data-bemove-theme="dark"] body.bemove-design-theme .muscle-map-shell {
  background: linear-gradient(145deg, #1a2027, #11161b);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .muscle-label b,
html[data-bemove-theme="dark"] body.bemove-design-theme .volume-row b,
html[data-bemove-theme="dark"] body.bemove-design-theme .measurement-list time,
html[data-bemove-theme="dark"] body.bemove-design-theme .notification-list b,
html[data-bemove-theme="dark"] body.bemove-design-theme .log-detail b {
  color: var(--bm-charcoal-700);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .volume-row > div,
html[data-bemove-theme="dark"] body.bemove-design-theme .progress,
html[data-bemove-theme="dark"] body.bemove-design-theme .wearable-progress,
html[data-bemove-theme="dark"] body.bemove-design-theme .survey-progress-bar {
  background: var(--bm-charcoal-100);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .modal-sheet {
  border-color: var(--bm-charcoal-100);
  background: var(--bm-surface);
}

/* Standalone member shell styles are intentionally explicit in styles.css;
   mirror the important surfaces here so dark mode is complete there too. */
html[data-bemove-theme="dark"] body.bemove-design-theme .topbar {
  border-bottom-color: var(--bm-charcoal-200);
  background: rgb(18 21 25 / 96%);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .brand { color: var(--bm-orange-400); }
html[data-bemove-theme="dark"] body.bemove-design-theme .member-meta { color: var(--bm-charcoal-300); }
html[data-bemove-theme="dark"] body.bemove-design-theme .member-meta strong { color: var(--bm-charcoal-700); }
html[data-bemove-theme="dark"] body.bemove-design-theme .role {
  color: var(--bm-orange-300);
  background: rgb(236 102 42 / 18%);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .viewport {
  scrollbar-color: var(--bm-charcoal-300) transparent;
}
html[data-bemove-theme="dark"] body.bemove-design-theme .alert-card {
  background: linear-gradient(120deg, var(--bm-orange-700), var(--bm-orange-500));
  box-shadow: 0 13px 26px -18px rgb(0 0 0 / 65%);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .alert-card.diet-alert {
  color: #f6d7a5;
  border-color: #7a5720;
  background: #2a2116;
}
html[data-bemove-theme="dark"] body.bemove-design-theme .alert-card.diet-alert small { color: #d8b779; }
html[data-bemove-theme="dark"] body.bemove-design-theme .hero {
  background:
    radial-gradient(circle at 92% 13%, rgb(236 102 42 / 20%), transparent 6.6rem),
    linear-gradient(135deg, #141414 0%, #241a16 62%, #3a2116 100%);
  box-shadow: 0 18px 36px -24px rgb(0 0 0 / 70%);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .helper { border-top-color: var(--bm-charcoal-100); }
html[data-bemove-theme="dark"] body.bemove-design-theme .session-blue { color: #a8c9ff; background: #1b2e4c; }
html[data-bemove-theme="dark"] body.bemove-design-theme .session-green { color: #8de0ad; background: #183726; }
html[data-bemove-theme="dark"] body.bemove-design-theme .session-orange { color: #f5bd8e; background: #3b281c; }
html[data-bemove-theme="dark"] body.bemove-design-theme .stage-row span { color: #f5bd8e; background: #3b281c; }
html[data-bemove-theme="dark"] body.bemove-design-theme .button-primary {
  background: linear-gradient(135deg, var(--bm-orange-400), var(--bm-orange-600));
  box-shadow: 0 9px 18px -12px var(--bm-orange-700);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .week-days button { background: var(--bm-charcoal-850); }
html[data-bemove-theme="dark"] body.bemove-design-theme .week-days .done { color: #6ee7a5; background: #123a28; }
html[data-bemove-theme="dark"] body.bemove-design-theme .check-list label {
  border-color: var(--bm-charcoal-100);
  background: var(--bm-charcoal-850);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .check-list label:has(input:checked) {
  border-color: rgb(236 102 42 / 45%);
  background: rgb(236 102 42 / 12%);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .log-row,
html[data-bemove-theme="dark"] body.bemove-design-theme .measurement-list button {
  border-bottom-color: var(--bm-charcoal-100);
  color: var(--bm-charcoal-300);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .log-date,
html[data-bemove-theme="dark"] body.bemove-design-theme .meal-kind {
  color: var(--bm-orange-300);
  background: rgb(236 102 42 / 18%);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .log-detail {
  color: var(--bm-charcoal-300);
  background: var(--bm-charcoal-850);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .calorie-card,
html[data-bemove-theme="dark"] body.bemove-design-theme .score-card {
  background: linear-gradient(140deg, #141414, #3a2116);
  box-shadow: 0 18px 34px -25px rgb(0 0 0 / 75%);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .score-ring::before { background: #2a1a13; }
html[data-bemove-theme="dark"] body.bemove-design-theme .chart-grid {
  background: repeating-linear-gradient(to bottom, var(--bm-charcoal-100) 0 1px, transparent 1px 30px);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .bottom-nav .main-action span {
  border-color: var(--bm-white);
  background: linear-gradient(135deg, var(--bm-orange-400), var(--bm-orange-600));
}

.theme-toggle,
.bemove-theme-toggle {
  display: inline-flex;
  min-height: 30px;
  padding: 4px 8px;
  align-items: center;
  justify-content: center;
  gap: 4px;
  border: 1px solid var(--bm-charcoal-200);
  border-radius: var(--bm-radius-control);
  color: var(--bm-charcoal-700);
  background: var(--bm-charcoal-850);
  font-family: var(--bm-font-body);
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
}
.theme-toggle span,
.bemove-theme-toggle span { color: var(--bm-orange-400); font-size: 14px; line-height: 1; }
.theme-toggle b,
.bemove-theme-toggle b { font-size: 10px; font-weight: 700; }
.bemove-theme-toggle { margin-left: 6px; }

@media (max-width: 420px) {
  body.bemove-design-theme .theme-toggle {
    width: 32px;
    padding: 4px;
  }
  body.bemove-design-theme .theme-toggle b { display: none; }
}

/* Final palette pass: every Bemove role uses the same orange/charcoal
   accent. These selectors cover compact legacy cards that still carry the
   prototype's violet literals. */
body.bemove-design-theme .role,
body.bemove-design-theme .meal-kind,
body.bemove-design-theme .log-date,
body.bemove-design-theme .diet-ai-status,
body.bemove-design-theme .notification-list span,
body.bemove-design-theme .photo-button.has-photo,
body.bemove-design-theme .exercise-builder-head button {
  border-color: var(--bm-orange-200);
  color: var(--bm-orange-700);
  background: var(--bm-orange-100);
}
body.bemove-design-theme .helper b,
body.bemove-design-theme .icon-purple,
body.bemove-design-theme .text-button,
body.bemove-design-theme .navigator-grid .accent strong,
body.bemove-design-theme .survey-guide span,
body.bemove-design-theme .log-row[aria-expanded="true"],
body.bemove-design-theme .check-list input:checked + span b,
body.bemove-design-theme .schedule-time > strong,
body.bemove-design-theme .meal-card > strong,
body.bemove-design-theme .nutrition-result b,
body.bemove-design-theme .effort-field output,
body.bemove-design-theme .condition-score-row output {
  color: var(--bm-orange-700);
}
body.bemove-design-theme .session-blue {
  border-color: var(--bm-orange-200);
  color: var(--bm-orange-700);
  background: var(--bm-orange-100);
}
body.bemove-design-theme .survey-progress-bar i { background: var(--bm-orange-500); }
body.bemove-design-theme .check-list label:has(input:checked),
body.bemove-design-theme .nutrition-result {
  border-color: var(--bm-orange-200);
  background: var(--bm-orange-100);
}
body.bemove-design-theme .wearable-progress i,
body.bemove-design-theme .feedback-form button,
body.bemove-design-theme .body-advice > span,
body.bemove-design-theme .survey-trainer-avatar,
body.bemove-design-theme .survey-scale input:checked + span,
body.bemove-design-theme .condition-score-row input[type="range"] {
  accent-color: var(--bm-orange-500);
}
body.bemove-design-theme .wearable-progress i,
body.bemove-design-theme .feedback-form button,
body.bemove-design-theme .body-advice > span,
body.bemove-design-theme .survey-trainer-avatar,
body.bemove-design-theme .survey-scale input:checked + span {
  background: var(--bm-orange-500);
}
body.bemove-design-theme .chart .line { stroke: var(--bm-orange-500); }
body.bemove-design-theme .week-days .today,
body.bemove-design-theme .muscle-period button.is-active {
  border-color: var(--bm-orange-500);
  background: var(--bm-orange-500);
  box-shadow: none;
}
body.bemove-design-theme .segmented input:checked + label,
body.bemove-design-theme .pain-options label:has(input:checked),
body.bemove-design-theme .muscle-side button.is-active {
  border-color: var(--bm-orange-500);
  color: var(--bm-orange-700);
  background: var(--bm-orange-100);
}
body.bemove-design-theme .muscle-period button,
body.bemove-design-theme .muscle-side button,
body.bemove-design-theme .guide-button { color: var(--bm-orange-700); }
body.bemove-design-theme .guide-button { border-color: var(--bm-orange-200); }
body.bemove-design-theme .calorie-card,
body.bemove-design-theme .score-card {
  background: linear-gradient(135deg, var(--bm-charcoal-900), var(--bm-charcoal-700));
}

html[data-bemove-theme="dark"] body.bemove-design-theme .role,
html[data-bemove-theme="dark"] body.bemove-design-theme .meal-kind,
html[data-bemove-theme="dark"] body.bemove-design-theme .log-date,
html[data-bemove-theme="dark"] body.bemove-design-theme .diet-ai-status,
html[data-bemove-theme="dark"] body.bemove-design-theme .notification-list span,
html[data-bemove-theme="dark"] body.bemove-design-theme .photo-button.has-photo,
html[data-bemove-theme="dark"] body.bemove-design-theme .exercise-builder-head button,
html[data-bemove-theme="dark"] body.bemove-design-theme .pain-options label:has(input:checked),
html[data-bemove-theme="dark"] body.bemove-design-theme .segmented input:checked + label {
  border-color: var(--bm-orange-700);
  color: var(--bm-orange-200);
  background: rgb(236 102 42 / 16%);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .week-days .today,
html[data-bemove-theme="dark"] body.bemove-design-theme .muscle-period button.is-active,
html[data-bemove-theme="dark"] body.bemove-design-theme .feedback-form button,
html[data-bemove-theme="dark"] body.bemove-design-theme .body-advice > span,
html[data-bemove-theme="dark"] body.bemove-design-theme .survey-trainer-avatar,
html[data-bemove-theme="dark"] body.bemove-design-theme .survey-scale input:checked + span {
  color: var(--bm-white);
  background: var(--bm-orange-500);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .session-blue {
  border-color: var(--bm-orange-700);
  color: var(--bm-orange-200);
  background: rgb(236 102 42 / 16%);
}
html[data-bemove-theme="dark"] body.bemove-design-theme .check-list label:has(input:checked),
html[data-bemove-theme="dark"] body.bemove-design-theme .nutrition-result {
  border-color: var(--bm-orange-700);
  background: rgb(236 102 42 / 16%);
}