/* ============================================================
   Be:Move brand theme — applied to every role inside Bemove X mode.
   Scope: Be:Move mode plus Formula X sessions belonging to a Be:Move brand.
   Strategy: remap the app's root design variables to Be:Move tokens so the many
   variable-driven components adopt the brand without per-component rewrites.
   Source of truth: design-systems/bemove/ (tokens copied to web/brands/bemove/).
   ============================================================ */
@import url("tokens.css");

/* ── Core variable remap (charcoal / chalk / orange, angular radii) ── */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) {
  --primary: var(--orange-500);
  --primary-dark: var(--orange-600);
  --primary-light: var(--orange-400);
  --bg: var(--chalk);
  --card: var(--surface-card);
  --text: var(--charcoal-900);
  --text-sub: var(--charcoal-500);
  --text-muted: var(--charcoal-400);
  --border: var(--border-hairline);
  --success: var(--green-500);
  --warning: var(--amber-500);
  --danger: var(--red-500);
  --pt: var(--orange-500);
  --fc: var(--blue-500);
  --radius: 8px;
  --shadow: var(--shadow-card);

  background: var(--surface-page);
  color: var(--text-body);
  font-family: var(--font-body);
}

/* Stable Be:Move aliases.  The component rules below intentionally use the
   bm-* namespace; define it in both themes so a missing custom property can
   never silently fall back to Formula's blue/purple defaults. */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) {
  --bm-chalk: var(--chalk);
  --bm-white: var(--white);
  --bm-orange-100: var(--orange-100);
  --bm-orange-200: var(--orange-200);
  --bm-orange-300: var(--orange-300);
  --bm-orange-400: var(--orange-400);
  --bm-orange-500: var(--orange-500);
  --bm-orange-600: var(--orange-600);
  --bm-orange-700: var(--orange-700);
  --bm-charcoal-050: var(--charcoal-050);
  --bm-charcoal-100: var(--charcoal-100);
  --bm-charcoal-200: var(--charcoal-200);
  --bm-charcoal-300: var(--charcoal-300);
  --bm-charcoal-400: var(--charcoal-400);
  --bm-charcoal-500: var(--charcoal-500);
  --bm-charcoal-600: var(--charcoal-600);
  --bm-charcoal-700: var(--charcoal-700);
  --bm-charcoal-800: var(--charcoal-800);
  --bm-charcoal-850: var(--charcoal-850);
  --bm-charcoal-900: var(--charcoal-900);
  --bm-green-100: var(--green-100);
  --bm-green-500: var(--green-500);
  --bm-amber-100: var(--amber-100);
  --bm-amber-500: var(--amber-500);
  --bm-red-100: var(--red-100);
  --bm-red-500: var(--red-500);
  --bm-blue-100: var(--blue-100);
  --bm-blue-500: var(--blue-500);
  --bm-font-body: var(--font-body);
  --bm-font-display: var(--font-display);
  --bm-radius-control: var(--radius-control);
  --bm-radius-card: var(--radius-card);
  --bm-radius-field: var(--radius-field);
  --bm-radius-sheet: var(--radius-sheet);
  --bm-shadow-card: var(--shadow-card);
  --bm-shadow-raised: var(--shadow-raised);
  --bm-shadow-sheet: var(--shadow-sheet);
  --bm-ring-focus: var(--ring-focus);
}

/* ── Typography: Oswald(라틴) + Noto Sans KR(국문) for structural type ── */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) h1,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) h2,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) h3,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) h4 {
  font-family: var(--font-display);
  letter-spacing: 0.005em;
}

/* ── 좌상단 로고: "Bemove X" 텍스트 → Be:Move 워드마크 이미지 ── */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .nav-logo.is-bemove {
  display: inline-block;
  width: 78px;
  height: 36px;
  background: url("assets/logo-wordmark.png") no-repeat left center;
  background-size: contain;
  color: transparent !important;
  text-shadow: none !important;
  font-size: 0 !important;
  line-height: 0;
  overflow: hidden;
  vertical-align: middle;
}

/* ── Brand accent on the primary action (one orange fill per view는 콘텐츠 규칙) ── */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .btn-primary,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-555-share-btn {
  background: var(--orange-500);
  border-color: var(--orange-500);
  color: var(--white);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .btn-primary:hover {
  background: var(--orange-600);
  border-color: var(--orange-600);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .btn-primary:focus-visible {
  box-shadow: var(--ring-focus);
}

/* ── 부위별 자극·회복 근육맵: 프로토타입 퍼플 → 브랜드 오렌지 ── */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-555-membermap { border-left-color: var(--orange-500); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .muscle-period label { color: var(--orange-600); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .mm-p-radio.is-week:checked ~ .muscle-period .period-week,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .mm-p-radio.is-month:checked ~ .muscle-period .period-month {
  border-color: var(--orange-500);
  background: linear-gradient(135deg, var(--orange-400), var(--orange-600));
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .mm-head span { color: var(--orange-600); }

/* Keep the main Bemove X shell in sync with the standalone member app. */
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) {
  color-scheme: dark;
  --bm-chalk: #0f1114;
  /* Keep white for text and borders; dark surfaces use explicit aliases. */
  --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;
  --bg: var(--bm-chalk);
  --card: var(--bm-surface);
  /* --bg-sub 를 빼면 style.css 의 var(--bg-sub, #f1f0ee) 들이 폴백(밝은 회색)으로
     떨어져, 어두운 카드가 흰 판 위에 놓인다. (채용 칸반 컬럼이 그랬다) */
  --bg-sub: var(--bm-surface-muted);
  --text: #e4e8ed;
  --text-sub: #aeb7c3;
  --text-muted: #8d98a6;
  --border: #2d343d;
  --shadow: 0 2px 6px rgb(0 0 0 / 28%);
  --purple: var(--orange-500);
  --purple-dark: var(--orange-700);
  --purple-soft: rgb(236 102 42 / 18%);
  background: var(--bm-chalk);
  color: var(--text);
}

/* ─────────────────────────────────────────────────────────────
   Whole Bemove web surface
   The dashboard ships many legacy utility classes with Formula's blue,
   purple and pastel fills. Keep the adapter scoped to Be:Move mode or a
   Be:Move brand Formula session; other Formula X brands remain unchanged.
   ───────────────────────────────────────────────────────────── */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) {
  color-scheme: light;
  --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);
  --bm-focus: var(--bm-orange-500);
  font-family: var(--bm-font-body);
  background: var(--bm-chalk);
  color: var(--bm-text);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) :where(button, input, select, textarea, table) { font-family: var(--bm-font-body); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) :where(h1, h2, h3, h4, h5, .nav-logo, .nav-tab, .btn, .button, .eyebrow, .bemove-title-row, .bemove-action-icon) { font-family: var(--bm-font-display); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) :where(p, label, td, th, .text-muted, .form-hint) { color: var(--bm-text-sub); }

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .main-nav {
  background: var(--bm-charcoal-900);
  border-bottom: 2px solid var(--bm-orange-500);
  box-shadow: 0 3px 12px rgb(20 20 20 / 18%);
  color: var(--bm-white);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .nav-logo,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .nav-logo.is-bemove { color: var(--bm-orange-500); text-shadow: none; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .nav-tab { color: var(--bm-charcoal-300); border-radius: var(--bm-radius-control); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .nav-tab:hover { color: var(--bm-white); background: rgb(236 102 42 / 14%); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .nav-tab.active { color: var(--bm-white); background: var(--bm-orange-500); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) #nav-user-name { color: var(--bm-white); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) #nav-brand-name,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-trainer-header-goal-label { color: var(--bm-charcoal-300); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .role-badge { border-radius: var(--bm-radius-control); }

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .page-content,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-screen { background: var(--bm-chalk); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .card,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-panel,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .panel,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .table-wrap,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-trainer-manage-card,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-trainer-schedule {
  border: 1px solid var(--bm-border);
  border-radius: var(--bm-radius-card);
  background: var(--bm-surface);
  box-shadow: var(--bm-shadow-card);
  color: var(--bm-text);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .card h3,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .card h4,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-panel h3,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-panel h4,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-trainer-manage-card h5 { color: var(--bm-text); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-hero { background: var(--bm-charcoal-900); border-radius: var(--bm-radius-card); box-shadow: var(--bm-shadow-raised); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-hero-title,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-hero-mini span { color: var(--bm-orange-300); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-hero-mini strong,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-hero-value { color: var(--bm-white); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-hero-rate { color: var(--bm-orange-300); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-progress { background: var(--bm-charcoal-200); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-progress > span { background: var(--bm-orange-500); }

/* Dashboard action tiles: one brand accent, semantic colors only for status. */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-trainer-action-btn,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-action-card,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-quick-action {
  border: 1px solid var(--bm-orange-300);
  border-radius: var(--bm-radius-card);
  color: var(--bm-orange-700);
  background: var(--bm-orange-100);
  box-shadow: none;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-trainer-action-btn:hover,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-action-card:hover,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-quick-action:hover { color: var(--bm-white); background: var(--bm-orange-500); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-stat,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-stat-grid .bemove-stat,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-kpi { border-color: var(--bm-border); background: var(--bm-surface); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-stat div,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-stat strong span,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-kpi small { color: var(--bm-text-sub); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-stat strong,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-kpi strong { color: var(--bm-text); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-subtab,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-period-btn,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-view-as-btn { border-color: var(--bm-border); color: var(--bm-text-sub); background: var(--bm-surface); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-subtab.is-active,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-period-btn.is-active,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-view-as-btn.is-active { border-color: var(--bm-orange-500); color: var(--bm-orange-700); background: var(--bm-orange-100); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-branch-item,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ranking-card,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-retention-card { border-color: var(--bm-border); background: var(--bm-surface); color: var(--bm-text); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-branch-head span,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-branch-foot { color: var(--bm-text-sub); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-branch-head strong,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-retention-card strong { color: var(--bm-text); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-555-membermap { border-left-color: var(--bm-orange-500); background: var(--bm-surface); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .muscle-map-shell { border: 1px solid var(--bm-border); background: linear-gradient(145deg, var(--bm-surface-muted), var(--bm-surface)); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .muscle-period label { border-color: var(--bm-border); color: var(--bm-orange-700); background: var(--bm-surface); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .mm-p-radio.is-week:checked ~ .muscle-period .period-week,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .mm-p-radio.is-month:checked ~ .muscle-period .period-month { border-color: var(--bm-orange-500); color: var(--bm-white); background: var(--bm-orange-500); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .muscle-side { background: var(--bm-surface-muted); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .muscle-side label { color: var(--bm-text-sub); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .mm-v-radio.is-front:checked ~ .muscle-side .side-front,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .mm-v-radio.is-back:checked ~ .muscle-side .side-back { color: var(--bm-text); background: var(--bm-surface); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .mm-head h4,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .muscle-label b { color: var(--bm-text); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .muscle-label strong { color: var(--bm-green-500); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .muscle-label.is-active strong { color: var(--bm-red-500); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .volume-row > div { background: var(--bm-charcoal-100); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .volume-row b { color: var(--bm-text); }

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) :where(input, select, textarea) { border-color: var(--bm-border); color: var(--bm-text); background: var(--bm-surface); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) :where(input, select, textarea):focus { border-color: var(--bm-focus); box-shadow: 0 0 0 3px rgb(236 102 42 / 18%); outline: none; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) :where(.table, table) th { color: var(--bm-text-sub); background: var(--bm-surface-muted); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) :where(.table, table) td { color: var(--bm-text); border-color: var(--bm-border); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .btn-primary,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .button-primary { border-color: var(--bm-orange-500); color: var(--bm-white); background: var(--bm-orange-500); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .btn-primary:hover,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .button-primary:hover { border-color: var(--bm-orange-600); background: var(--bm-orange-600); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .btn-outline,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .button-outline { border-color: var(--bm-orange-500); color: var(--bm-orange-700); background: var(--bm-surface); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .badge,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .role-badge { border-radius: var(--bm-radius-control); }

/* Explicit dark-mode contrast for the same selectors. */
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) {
  --bm-surface: #1a1e24;
  --bm-surface-muted: #20262d;
  --bm-text: #f2f5f8;
  --bm-text-sub: #b5bec9;
  --bm-border: #3b444f;
  background: #0f1114;
  color: var(--bm-text);
}
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .page-content,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-screen { background: var(--bm-chalk); }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) :where(.card, .bemove-panel, .panel, .table-wrap, .bemove-trainer-manage-card, .bemove-trainer-schedule, .bemove-stat, .bemove-kpi, .bemove-branch-item, .bemove-ranking-card, .bemove-retention-card) { border-color: var(--bm-border); background: var(--bm-surface); color: var(--bm-text); }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) :where(.card h3, .card h4, .bemove-panel h3, .bemove-panel h4, .bemove-trainer-manage-card h5, .bemove-stat strong, .bemove-kpi strong, .bemove-branch-head strong, .bemove-retention-card strong) { color: var(--bm-text); }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) :where(p, label, td, th, .text-muted, .form-hint, .bemove-stat div, .bemove-stat strong span, .bemove-kpi small, .bemove-branch-head span, .bemove-branch-foot) { color: var(--bm-text-sub); }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) :where(input, select, textarea) { border-color: var(--bm-border); color: var(--bm-text); background: var(--bm-surface-muted); }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) :where(.table, table) th { color: var(--bm-text-sub); background: var(--bm-surface-muted); }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) :where(.table, table) td { color: var(--bm-text); border-color: var(--bm-border); }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-trainer-action-btn,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-action-card,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-quick-action { border-color: #a94013; color: #facfb6; background: #342119; }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-subtab.is-active,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-period-btn.is-active,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-view-as-btn.is-active { color: #facfb6; background: #342119; }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-555-membermap { background: var(--bm-surface); }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .muscle-map-shell { border-color: var(--bm-border); background: linear-gradient(145deg, var(--bm-surface-muted), var(--bm-surface)); }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .rbh polygon.muscle-none { fill: #53606d; }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .muscle-label b,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .mm-head h4 { color: var(--bm-text); }

/* ------------------------------------------------------------------
   Role-independent Bemove surface normalization
   Legacy member/trainer widgets carry their own blue/violet defaults.
   In Bemove mode the role changes available data and actions only; the
   brand surface stays the same for super admins, managers, trainers,
   and members.
   ------------------------------------------------------------------ */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-subtab.active,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-member-detail-tab.is-active,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-member-register-tab.is-active {
  border-color: var(--bm-orange-500);
  box-shadow: inset 0 -2px 0 var(--bm-orange-500);
  color: var(--bm-orange-700);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-subtab.active {
  background: var(--bm-orange-500);
  box-shadow: none;
  color: var(--bm-white);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-trainer-sidebar {
  border-color: var(--bm-border);
  background: var(--bm-surface);
  box-shadow: var(--bm-shadow-card);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-trainer-sidebar-logo { color: var(--bm-orange-500); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-rank-chip {
  border-color: var(--bm-orange-200);
  background: var(--bm-orange-100);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-rank-chip .value { color: var(--bm-text); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-rank-chip .badge {
  border-color: var(--bm-orange-300);
  color: var(--bm-orange-700);
  background: var(--bm-white);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-trainer-nav-item:hover,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-trainer-nav-item.active {
  color: var(--bm-orange-700);
  background: var(--bm-orange-100);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-trainer-schedule {
  border-color: var(--bm-orange-300) !important;
  background: var(--bm-orange-100) !important;
  color: var(--bm-orange-700);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-trainer-schedule-icon-wrap,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-trainer-schedule h4 { color: var(--bm-orange-700); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-trainer-today-row {
  border-color: var(--bm-orange-300);
  background: var(--bm-white);
  color: var(--bm-text);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-trainer-today-row:hover { background: var(--bm-orange-100); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-trainer-today-row .name .last-workout,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-journal-queue-row .date,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-journal-queue-row .time,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-journal-queue-row .dur,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-homework-board-row .latest,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-homework-board-row .date { color: var(--bm-text-sub); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-journal-queue-row,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-homework-board-row {
  border-color: var(--bm-border);
  background: var(--bm-surface);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-journal-queue-row:hover,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-homework-board-row:hover { background: var(--bm-orange-100); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-journal-queue-row .name,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-homework-board-row .name { color: var(--bm-text); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-trainer-action-btn,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-action-register,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-action-library,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-action-journal-list,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-action-diet,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-action-schedule,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-action-homework-board {
  border-color: var(--bm-orange-300);
  color: var(--bm-orange-700);
  background: var(--bm-orange-100);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-trainer-action-btn:hover,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-action-register:hover,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-action-library:hover,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-action-journal-list:hover,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-action-diet:hover,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-action-schedule:hover,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-action-homework-board:hover {
  color: var(--bm-white);
  background: var(--bm-orange-500);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-member-detail-status,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-member-option.is-active,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-555-condition.is-active,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-555-pain.is-active,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-body-view].is-active {
  border-color: var(--bm-orange-500);
  color: var(--bm-orange-700);
  background: var(--bm-orange-100);
  box-shadow: inset 0 0 0 1px var(--bm-orange-500);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-member-detail-status { box-shadow: none; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-member-detail-avatar,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-pt-member-avatar {
  background: linear-gradient(135deg, var(--bm-charcoal-700), var(--bm-orange-600));
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-member-detail-banner {
  background: linear-gradient(135deg, var(--bm-charcoal-900), var(--bm-charcoal-700));
  color: var(--bm-charcoal-200);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-member-detail-banner h4 { color: var(--bm-white); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-member-register-tab,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-member-detail-tab { color: var(--bm-text-sub); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-pt-total { background: var(--bm-orange-100); color: var(--bm-orange-700); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-pt-member-phone.is-pending-signup { color: var(--bm-orange-700); font-weight: 700; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) #bemove-inbody-analyzing-overlay .bemove-inbody-analyzing-card {
  min-width: 240px;
  max-width: 380px;
  border: 1px solid var(--bm-border);
  border-radius: var(--bm-radius-sheet);
  padding: 16px 18px;
  text-align: center;
  background: var(--bm-surface);
  box-shadow: var(--bm-shadow-raised);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) #bemove-inbody-analyzing-overlay .bemove-inbody-analyzing-head {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-bottom: 6px;
  color: var(--bm-text);
  font-size: 14px;
  font-weight: 800;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) #bemove-inbody-analyzing-overlay .bemove-inbody-analyzing-spinner {
  display: inline-block;
  width: 16px;
  height: 16px;
  border: 2px solid var(--bm-border);
  border-top-color: var(--bm-orange-500);
  border-radius: 999px;
  animation: bemoveSpin 1s linear infinite;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) #bemove-inbody-analyzing-overlay .bemove-inbody-analyzing-copy { color: var(--bm-text-sub); font-size: 12px; }

html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-trainer-sidebar,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-journal-queue-row,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-homework-board-row,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-trainer-today-row {
  background: var(--bm-surface);
  color: var(--bm-text);
}
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-rank-chip,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-trainer-nav-item:hover,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-trainer-nav-item.active,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-trainer-action-btn,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-action-register,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-action-library,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-action-journal-list,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-action-diet,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-action-schedule,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-action-homework-board {
  border-color: var(--bm-orange-700);
  color: var(--bm-orange-200);
  background: rgb(236 102 42 / 15%);
}
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-trainer-today-row:hover,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-journal-queue-row:hover,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-homework-board-row:hover { background: rgb(236 102 42 / 20%); }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-pt-total { background: rgb(236 102 42 / 16%); color: var(--bm-orange-200); }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) #bemove-inbody-analyzing-overlay .bemove-inbody-analyzing-card { background: var(--bm-surface); border-color: var(--bm-border); }

/* ------------------------------------------------------------------
   OT / 운영 대시보드 표면 정규화
   OT 탭은 오래된 Formula 기본 스타일이 마지막에 남아 흰색 필터 바,
   파랑·초록 KPI, 기본 표 헤더가 Bemove 화면 안으로 새어 나왔다.
   여기서는 역할과 무관하게 동일한 Be:Move 표면 토큰을 사용한다.
   ------------------------------------------------------------------ */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-period-filter,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-list,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-conversion-table-wrap {
  border-color: var(--bm-border);
  background: var(--bm-surface-muted);
  box-shadow: var(--bm-shadow-card);
  color: var(--bm-text);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-period-filter .btn,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-view-filters .btn,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-period-inputs input[type="date"],
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-view-filters select {
  border-color: var(--bm-border);
  color: var(--bm-text);
  background: var(--bm-surface);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-period-filter .btn:hover,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-period-filter .btn.is-active,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-view-filters .btn:hover,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-view-filters .btn.is-active {
  border-color: var(--bm-orange-500);
  color: var(--bm-white);
  background: var(--bm-orange-500);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-period-inputs .text-muted,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-view-filters,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-kpi-label,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-progress-label,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-email,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-date,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-empty { color: var(--bm-text-sub); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-kpi {
  border-color: var(--bm-border);
  background: var(--bm-surface);
  box-shadow: var(--bm-shadow-card);
  color: var(--bm-text);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-kpi-total strong,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-kpi-pending strong,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-kpi-converted strong,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-kpi-rate strong,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-progress-num { color: var(--bm-orange-600); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-rows,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-row,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-conversion-table th,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-conversion-table td { border-color: var(--bm-border); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-conversion-table th {
  color: var(--bm-text-sub);
  background: var(--bm-surface-muted);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-conversion-table td { color: var(--bm-text); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-tag,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-conversion-success {
  border: 1px solid var(--bm-green-500);
  background: var(--bm-green-100);
  color: #1b6b3c;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-conversion-failure { background: var(--bm-red-100); color: #9f2323; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-conversion-pending { background: var(--bm-orange-100); color: var(--bm-orange-700); }

/* Formula X의 파란 지식 대시보드 캐릭터는 Bemove 전용 표면에 노출하지 않는다. */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) #knowledge-dashboard-floating-btn,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .knowledge-dashboard-floating-btn { display: none !important; }

html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-period-filter,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-list,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-conversion-table-wrap {
  border-color: var(--bm-border);
  background: var(--bm-surface-muted);
  color: var(--bm-text);
}
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-period-filter .btn,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-view-filters .btn,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-period-inputs input[type="date"],
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-view-filters select {
  border-color: var(--bm-border);
  color: var(--bm-text);
  background: var(--bm-surface);
}
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-period-filter .btn:hover,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-period-filter .btn.is-active,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-view-filters .btn:hover,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-view-filters .btn.is-active {
  border-color: var(--bm-orange-500);
  color: var(--bm-white);
  background: var(--bm-orange-500);
}
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-kpi {
  border-color: var(--bm-border);
  background: var(--bm-surface);
  color: var(--bm-text);
}
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-kpi-total strong,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-kpi-pending strong,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-kpi-converted strong,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-kpi-rate strong,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-progress-num { color: var(--bm-orange-300); }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-conversion-table th {
  color: var(--bm-text-sub);
  background: var(--bm-surface-muted);
}
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-conversion-table td { color: var(--bm-text); }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-ot-tag,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-conversion-success {
  border-color: #2e9e5b;
  background: #123a28;
  color: #8de0ad;
}
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-conversion-failure {
  background: #3a1d22;
  color: #ff9b9b;
}
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-conversion-pending {
  background: rgb(236 102 42 / 16%);
  color: var(--bm-orange-200);
}

/* ------------------------------------------------------------------
   Contrast guard for legacy Formula markup inside Be:Move surfaces
   ------------------------------------------------------------------
   Some operational pages still emit explicit #fff/#f8fafc surfaces. Keep
   their semantics, but make the surface/text pair follow Be:Move tokens in
   both modes. This is intentionally scoped to Be:Move X and Be:Move-brand
   Formula sessions; unrelated Formula X brands keep their own UI.
   ------------------------------------------------------------------ */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .place-table-wrap,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .place-table-wrap > table,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .place-weekly-body-table,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .goal-achievement-place-table-wrap {
  background: var(--bm-surface);
  color: var(--bm-text);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .place-table-wrap > table tbody tr,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .place-weekly-body-table tbody tr,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .goal-achievement-place-table-wrap .profit-table tbody tr { background: var(--bm-surface); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .place-table-wrap > table tbody tr:nth-child(even),
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .place-weekly-body-table tbody tr:nth-child(even),
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .goal-achievement-place-table-wrap .profit-table tbody tr:nth-child(even) { background: var(--bm-surface-muted); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .place-table-wrap > table tbody td,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .place-weekly-body-table tbody td,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .goal-achievement-place-table-wrap .profit-table tbody td {
  background: transparent !important;
  border-bottom-color: var(--bm-border) !important;
  color: var(--bm-text) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .place-table-wrap > table thead th,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .place-weekly-sticky-head .place-weekly-head-table th {
  background: var(--bm-surface-muted);
  color: var(--bm-text-sub);
  border-bottom-color: var(--bm-border);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .place-table-wrap .bar-value,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .place-weekly-body-table .bar-value { color: var(--bm-text); }

/* Explicit legacy card/control surfaces that otherwise stay white in dark
 * mode. The list is limited to operational Be:Move components. */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) :is(
  .bemove-sales-card, .bemove-sales-tab, .bemove-modal,
  .bemove-sales-radio, .bemove-sales-radio-contract,
  .bemove-schedule-grid, .bemove-schedule-input-wrap,
  .bemove-schedule-time-select, .bemove-schedule-duration,
  .bemove-schedule-nav-btn, .bemove-schedule-today,
  .bemove-schedule-view-btn, .bemove-survey-item select,
  .bemove-diet-create-grid textarea, .bemove-diet-ai-card,
  .bemove-hw-left, .bemove-hw-right, .bemove-retention-card
) {
  background: var(--bm-surface);
  color: var(--bm-text);
  border-color: var(--bm-border);
}
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) :is(
  .bemove-sales-card, .bemove-sales-tab, .bemove-modal,
  .bemove-sales-radio, .bemove-sales-radio-contract,
  .bemove-schedule-grid, .bemove-schedule-input-wrap,
  .bemove-schedule-time-select, .bemove-schedule-duration,
  .bemove-schedule-nav-btn, .bemove-schedule-today,
  .bemove-schedule-view-btn, .bemove-survey-item select,
  .bemove-diet-create-grid textarea, .bemove-diet-ai-card,
  .bemove-hw-left, .bemove-hw-right, .bemove-retention-card
) { background: var(--bm-surface); color: var(--bm-text); border-color: var(--bm-border); }

/* Remaining component-level light surfaces found by the contrast audit. */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) :is(
  .bemove-member-kcal-kpis span, .bemove-ai-rx-card,
  .bemove-self-workout-ex-item.is-cardio, .bemove-schedule-grid,
  .bemove-schedule-input-wrap, .bemove-schedule-time-select,
  .bemove-schedule-duration, .bemove-retention-card,
  .bemove-survey-item select, .bemove-diet-create-grid textarea,
  .bemove-diet-top-photo, .bemove-diet-ai-feedback-input[readonly]
) {
  background: var(--bm-surface);
  color: var(--bm-text);
  border-color: var(--bm-border);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) :is(
  .bemove-sales-table th, .bemove-schedule-weekdays,
  .bemove-schedule-timetable thead th, .bemove-retention-table th,
  .bemove-satisfaction-table th, .bemove-diet-archive-table th
) {
  background: var(--bm-surface-muted);
  color: var(--bm-text-sub);
  border-color: var(--bm-border);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) :is(
  .bemove-trainer-today-row:hover, .bemove-journal-queue-row:hover,
  .bemove-homework-board-row:hover, .bemove-schedule-cell:hover,
  .bemove-schedule-timetable-cell:hover,
  .bemove-schedule-list-row.bemove-schedule-clickable-slot:hover,
  .bemove-diet-archive-row:hover
) { background: var(--bm-surface-muted); }

html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) :is(
  .bemove-ai-rx-error, .bemove-diet-analysis-error
) {
  background: rgb(239 68 68 / 14%);
  border-color: rgb(248 113 113 / 46%);
  color: #fecaca;
}
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) :is(
  .bemove-ai-rx-warning, .bemove-inbody-composition-grid article.is-watch,
  .bemove-inbody-box.is-diet
) {
  background: rgb(245 158 11 / 14%);
  border-color: rgb(251 191 36 / 46%);
  color: #fde68a;
}
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bemove-diet-ai-feedback-input[readonly] {
  color: var(--bm-text) !important;
  background: var(--bm-surface-muted);
}

/* ------------------------------------------------------------------
   Legacy Formula views inside Be:Move
   ------------------------------------------------------------------
   Formula's sales/goal/activity/profit screens still contain a second,
   hard-coded blue/purple palette.  They are also rendered in the Be:Move
   brand when a super user opens Formula X, so only remapping root variables
   is not enough.  These selectors intentionally target the legacy view
   primitives and keep semantic success/warning/error colors intact.
   ------------------------------------------------------------------ */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) {
  --bm-control-surface: var(--bm-surface);
  --bm-control-muted: var(--bm-surface-muted);
  --bm-control-border: var(--bm-border);
  --bm-control-text: var(--bm-text);
  --bm-control-sub: var(--bm-text-sub);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-subtab-btn,
  .sales-period-btn,
  .sales-period-toggle,
  .sales-month-projection-pill,
  .sales-mix-month-select,
  .sales-analysis-toolbar select,
  .sales-period-wrap select,
  .sales-filter select,
  .goal-achievement-month-inline .form-control,
  .goal-achievement-conversion-label
) {
  background: var(--bm-control-surface) !important;
  border-color: var(--bm-control-border) !important;
  color: var(--bm-control-text) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-subtab-btn:hover,
  .sales-subtab-btn.is-active,
  .sales-period-btn.active,
  .sales-period-btn.is-active,
  .sales-period-toggle .sales-period-btn.active,
  .sales-period-toggle-inline .sales-period-btn.active
) {
  background: var(--bm-orange-500) !important;
  border-color: var(--bm-orange-500) !important;
  color: var(--bm-white) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .app-mode-toggle-text {
  color: var(--bm-orange-300) !important;
}

/* Neutral legacy panels and every data table use the same Be:Move surface. */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-table-wrap, .sales-tab-scroll .sales-table-wrap,
  .sales-mix-table-wrap, .profit-table-wrap, .activity-table-wrap,
  .goal-achievement-conversion-table-wrap,
  .goal-achievement-unified-table-wrap,
  .goal-achievement-place-table-wrap
) {
  background: var(--bm-control-surface) !important;
  border-color: var(--bm-control-border) !important;
  color: var(--bm-control-text) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-table, .sales-mix-table, .profit-table,
  .goal-achievement-conversion-table,
  .goal-achievement-unified-table
) {
  color: var(--bm-control-text) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-table thead th, .sales-mix-table thead th,
  .profit-table thead th, .activity-table-wrap .profit-table thead th,
  .goal-achievement-conversion-table thead th,
  .goal-achievement-unified-table thead th
) {
  background: var(--bm-control-muted) !important;
  color: var(--bm-control-sub) !important;
  border-color: var(--bm-control-border) !important;
  box-shadow: inset 0 -1px 0 var(--bm-control-border) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-table tbody td, .sales-mix-table tbody td,
  .profit-table tbody td, .activity-table-wrap .profit-table tbody td,
  .goal-achievement-conversion-table tbody td,
  .goal-achievement-unified-table tbody td
) {
  color: var(--bm-control-text) !important;
  border-color: var(--bm-control-border) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-table tbody tr, .sales-mix-table tbody tr,
  .profit-table tbody tr, .activity-table-wrap .profit-table tbody tr,
  .goal-achievement-conversion-table tbody tr,
  .goal-achievement-unified-table tbody tr
) { background: var(--bm-control-surface) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-table tbody tr:nth-child(even), .sales-mix-table tbody tr:nth-child(even),
  .profit-table tbody tr:nth-child(even), .activity-table-wrap .profit-table tbody tr:nth-child(even),
  .goal-achievement-conversion-table tbody tr:nth-child(even),
  .goal-achievement-unified-table tbody tr:nth-child(even)
) { background: var(--bm-control-muted) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-table tbody tr:hover, .sales-mix-table tbody tr:hover,
  .profit-table tbody tr:hover, .activity-table-wrap .profit-table tbody tr:hover,
  .goal-achievement-conversion-table tbody tr:hover,
  .goal-achievement-unified-table tbody tr:hover
) { background: color-mix(in srgb, var(--bm-orange-100) 48%, var(--bm-control-surface)) !important; }

/* Sticky cells otherwise re-introduce the old white Formula background. */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-mix-table th:first-child, .sales-mix-table td:first-child,
  .goal-achievement-unified-table thead th:first-child,
  .goal-achievement-unified-table tbody td:first-child,
  .goal-achievement-place-table-wrap .profit-table thead th,
  .goal-achievement-place-table-wrap .profit-table tbody td
) {
  background: var(--bm-control-muted) !important;
  color: var(--bm-control-text) !important;
  border-color: var(--bm-control-border) !important;
}

/* Be:Move accent: replace Formula blue/indigo bars and labels while keeping
   green/red cells for outcome semantics. */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-mix-bar-fill,
  .sales-mix-trend-value-shell.is-fc .sales-mix-trend-value-fill,
  .sales-mix-trend-value-shell.is-peak.is-fc .sales-mix-trend-value-fill,
  .sales-fc-unit-bar-cell .sales-mix-trend-value-shell.is-at-avg .sales-mix-trend-value-fill
) { background: linear-gradient(90deg, var(--bm-orange-300), var(--bm-orange-500)) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .sales-amount-track {
  background: var(--bm-charcoal-100) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-amount-fill.is-total, .sales-amount-fill.is-fc,
  .sales-amount-fill.is-pt, .sales-amount-fill.is-re
) {
  background: linear-gradient(90deg, var(--bm-orange-300), var(--bm-orange-500)) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-amount-fill.is-new, .sales-amount-fill.is-member
) { background: linear-gradient(90deg, var(--bm-green-500), #5ec987) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .sales-amount-text {
  color: var(--bm-text) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-ratio-track, .sales-ratio-left, .sales-ratio-right
) { border-color: var(--bm-control-border) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .sales-ratio-left {
  background: var(--bm-orange-500) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .sales-ratio-right {
  background: var(--bm-orange-300) !important;
  color: var(--bm-charcoal-900) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-mix-bar-share, .sales-mix-trend-peak-plain .sales-mix-trend-count-plain,
  .sales-fc-unit-avg-label, .sales-fc-unit-avg-value, .sales-fc-unit-avg-unit,
  .sales-month-projection-label, .sales-month-projection-inline
) { color: var(--bm-orange-600) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-mix-th-fc, .sales-mix-th-pt
) {
  color: var(--bm-orange-700) !important;
  background: var(--bm-orange-100) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-mix-card, .sales-info-fold, .sales-mix-reconcile,
  .sales-fc-unit-narrative, .sales-fc-unit-excluded,
  .sales-fc-unit-avg-banner
) {
  background: var(--bm-control-surface) !important;
  border-color: var(--bm-control-border) !important;
  color: var(--bm-control-text) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-mix-card-value, .sales-fc-unit-label, .sales-mix-bar-label,
  .sales-info-fold-title, .sales-fc-unit-narrative
) { color: var(--bm-control-text) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-mix-card-label, .sales-mix-card-sub, .sales-mix-bar-meta,
  .sales-fc-unit-meta, .sales-fc-unit-avg-sub, .sales-context-label
) { color: var(--bm-control-sub) !important; }

/* Avoid a blue Formula robot or blue-only empty-state action in Be:Move. */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .knowledge-dashboard-floating-btn,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) #knowledge-dashboard-floating-btn { display: none !important; }

/* Secondary Formula controls that are not part of the main sales table. */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-product-class-panel,
  .sales-product-class-table-wrap,
  .sales-product-origin-body,
  .sales-fc-unit-picker,
  .sales-fc-unit-picker-item,
  .finance-menu-item,
  .finance-mobile-tabs,
  .finance-mobile-tab-btn
) {
  background: var(--bm-control-surface) !important;
  border-color: var(--bm-control-border) !important;
  color: var(--bm-control-text) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-product-class-table th,
  .sales-product-origin-table th,
  .sales-fc-unit-picker-item:hover,
  .finance-menu-item:hover,
  .finance-mobile-tab-btn:hover
) {
  background: var(--bm-control-muted) !important;
  color: var(--bm-control-text) !important;
  border-color: var(--bm-control-border) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-product-class-panel-switch-label,
  .sales-product-class-toggle-label,
  .sales-product-class-stats,
  .sales-product-class-name,
  .sales-product-origin-file,
  .sales-product-origin-amt,
  .sales-fc-unit-picker-meta,
  .sales-fc-unit-picker-name,
  .finance-mobile-tab-btn
) { color: var(--bm-control-sub) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-product-class-panel-body,
  .sales-product-origin-related,
  .sales-product-origin-table th,
  .sales-product-origin-table td
) { border-color: var(--bm-control-border) !important; }

/* Product classification is an action control, so all non-semantic states use
   the same orange focus treatment instead of Formula's blue/indigo palette. */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-product-class-toggle input.sales-product-class-filter-diff:checked + .sales-product-class-toggle-track,
  .sales-product-class-seg-btn.is-active,
  .sales-product-class-seg-btn.is-active.cat-fc_membership,
  .sales-product-class-seg-btn.is-active.cat-pt,
  .sales-product-class-seg-btn.is-active.cat-auto,
  .finance-menu-item.is-active,
  .finance-mobile-tab-btn.is-active
) {
  background: var(--bm-orange-500) !important;
  border-color: var(--bm-orange-500) !important;
  color: var(--bm-white) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-product-class-seg-btn:hover,
  .sales-product-class-seg-btn:focus-visible,
  .sales-product-class-toggle input.sales-product-class-filter-diff:focus-visible + .sales-product-class-toggle-track
) {
  background: var(--bm-orange-100) !important;
  border-color: var(--bm-orange-500) !important;
  color: var(--bm-orange-700) !important;
  outline-color: var(--bm-orange-300) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-product-class-auto-badge.cat-fc_membership,
  .sales-product-class-auto-badge.cat-auto,
  .sales-product-origin-summary,
  .sales-product-origin-related-title
) { color: var(--bm-orange-700) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-product-class-auto-badge.cat-fc_membership,
  .sales-product-class-auto-badge.cat-auto
) { background: var(--bm-orange-100) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .sales-product-bundled-callout {
  background: var(--bm-orange-100) !important;
  border-color: var(--bm-orange-300) !important;
  color: var(--bm-orange-700) !important;
}

/* Inline bar cells receive colors from dashboard-app.js.  !important is
   intentional: the brand adapter must win over those inline Formula colors. */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .bar-cell .bar-fill,
  .sales-table .funnel-bar-row > div,
  .overview-sales-card .funnel-bar-row > div
) { background: linear-gradient(90deg, var(--bm-orange-300), var(--bm-orange-500)) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-table .funnel-bar-row > div:nth-child(2),
  .overview-sales-card .funnel-bar-row > div:nth-child(2)
) { background: linear-gradient(90deg, var(--bm-orange-200), var(--bm-orange-400)) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .overview-funnel-track.is-inflow,
  .overview-funnel-track.is-order,
  .overview-funnel-track.is-review
) { background: linear-gradient(90deg, var(--bm-orange-400), var(--bm-orange-600)) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .sales-branch-cell-bar {
  background: rgb(236 102 42 / 24%) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .sales-branch-metric.is-active {
  background: var(--bm-orange-500) !important;
  border-color: var(--bm-orange-500) !important;
  color: var(--bm-white) !important;
}

/* Profit/goal bars: neutral blue/purple fills become orange; outcome colors
   remain green/red so the meaning of positive and negative results survives. */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .profit-table .profit-bar-bg {
  z-index: 0;
  background: linear-gradient(90deg, var(--bm-orange-200), var(--bm-orange-500)) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .profit-table .profit-cell-positive .profit-bar-bg {
  background: linear-gradient(90deg, var(--bm-green-500), var(--bm-green-500)) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .profit-table .profit-cell-negative .profit-bar-bg {
  background: linear-gradient(90deg, var(--bm-red-500), var(--bm-red-500)) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .profit-table .profit-bar-txt,
  .profit-table .profit-td-bar
) { color: var(--bm-control-text) !important; }

/*
   The bar is a background layer, not the label. Keep labels above the fill
   and change only their foreground color so the chart remains visually
   continuous (no artificial text box behind each value).
*/
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .profit-table .profit-td-bar {
  isolation: isolate;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .profit-table .profit-td-bar .profit-bar-txt {
  position: relative;
  z-index: 1;
  display: inline-block;
  color: var(--bm-charcoal-900) !important;
  text-shadow: none;
  line-height: 1.25;
  font-variant-numeric: tabular-nums;
}

html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .profit-table .profit-td-bar .profit-bar-txt {
  color: var(--bm-white) !important;
}

/* Small semantic chips and labels in the sales tables. */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-table .chip-fc,
  .sales-table .chip-re,
  .sales-table .chip-fc-price
) {
  background: var(--bm-orange-100) !important;
  color: var(--bm-orange-700) !important;
}

/* Dark mode must also cover controls that carry explicit light backgrounds. */
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-period-toggle,
  .sales-period-btn,
  .sales-product-class-table,
  .sales-product-origin-table,
  .finance-menu-item,
  .finance-mobile-tab-btn,
  .overview-filter-row select,
  .overview-filter-row input[type="date"],
  .overview-filter-row input[type="text"]
) {
  background: var(--bm-control-surface) !important;
  color: var(--bm-control-text) !important;
  border-color: var(--bm-control-border) !important;
}

/* ------------------------------------------------------------------
   BeMove X member detail / consultation form
   ------------------------------------------------------------------
   This view is rendered by the Bemove module rather than the Formula
   dashboard tables. Its original controls carry literal white/blue values,
   so they bypass the root theme variables unless they are remapped here.
   Keep the same component contract in light and dark modes; only the token
   values change with --bm-surface and --bm-text.
   ------------------------------------------------------------------ */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .bemove-member-detail-page,
  .bemove-member-detail-header-card,
  .bemove-member-detail-content
) {
  background: var(--bm-surface) !important;
  border-color: var(--bm-border) !important;
  color: var(--bm-text) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .bemove-member-detail-back-btn,
  .bemove-member-detail-sub,
  .bemove-member-detail-kpis,
  .bemove-member-detail-tab,
  .bemove-member-form-item label,
  .bemove-member-detail-form .form-hint
) { color: var(--bm-text-sub) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .bemove-member-detail-title-row h3,
  .bemove-member-detail-kpis b,
  .bemove-member-detail-form .bemove-member-form-section-title
) { color: var(--bm-text) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-member-detail-tabs {
  background: var(--bm-surface-muted) !important;
  border-radius: var(--bm-radius-control);
  padding: 4px;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-member-detail-tab {
  background: transparent !important;
  border-color: transparent !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-member-detail-tab:hover {
  background: var(--bm-orange-100) !important;
  color: var(--bm-orange-700) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-member-detail-tab.is-active {
  background: var(--bm-orange-500) !important;
  border-color: var(--bm-orange-500) !important;
  box-shadow: none !important;
  color: var(--bm-white) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-member-detail-head-actions .bemove-member-detail-icon-btn {
  background: var(--bm-surface-muted) !important;
  border-color: var(--bm-border) !important;
  color: var(--bm-text-sub) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-member-detail-head-actions .bemove-member-detail-icon-btn:hover {
  border-color: var(--bm-orange-500) !important;
  color: var(--bm-orange-600) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-member-detail-status {
  background: var(--bm-orange-100) !important;
  border: 1px solid var(--bm-orange-300) !important;
  color: var(--bm-orange-700) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .bemove-member-detail-goal-chip,
  .bemove-member-detail-birth-chip,
  .bemove-member-detail-goal-chip.is-empty
) {
  background: var(--bm-surface-muted) !important;
  border: 1px solid var(--bm-border) !important;
  color: var(--bm-text-sub) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-member-detail-goal-chip:not(.is-empty) {
  background: var(--bm-orange-100) !important;
  border-color: var(--bm-orange-300) !important;
  color: var(--bm-orange-700) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-member-detail-avatar {
  background: linear-gradient(135deg, var(--bm-charcoal-850), var(--bm-orange-600)) !important;
  color: var(--bm-white) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-member-detail-banner {
  background: linear-gradient(135deg, var(--bm-charcoal-850), var(--bm-charcoal-900)) !important;
  border: 1px solid var(--bm-border) !important;
  color: var(--bm-charcoal-200) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-member-detail-banner h4 {
  color: var(--bm-white) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .bemove-member-form-item textarea,
  .bemove-member-form-item input[type="text"]
) {
  background: var(--bm-surface-muted) !important;
  border-color: var(--bm-border) !important;
  color: var(--bm-text) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .bemove-member-form-item textarea,
  .bemove-member-form-item input[type="text"]
)::placeholder { color: var(--bm-text-sub) !important; opacity: .85; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-member-option {
  background: var(--bm-surface-muted) !important;
  border-color: var(--bm-border) !important;
  color: var(--bm-text-sub) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-member-option:hover {
  border-color: var(--bm-orange-300) !important;
  color: var(--bm-orange-600) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-member-option.is-active {
  background: var(--bm-orange-100) !important;
  border-color: var(--bm-orange-500) !important;
  box-shadow: inset 0 0 0 1px var(--bm-orange-500) !important;
  color: var(--bm-orange-700) !important;
}

html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-member-detail-overlay {
  background: rgb(5 7 10 / 78%) !important;
}
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-member-detail-page {
  box-shadow: 0 18px 44px rgb(0 0 0 / 42%) !important;
}

/* ------------------------------------------------------------------
   Global dark/light token adapter for legacy Formula views
   ------------------------------------------------------------------
   Formula's tables are built from a second stylesheet which still assigns
   literal white/pastel backgrounds to cells, summary rows and sticky
   columns.  A surface on the parent is therefore not enough: table cells
   paint over it.  Keep neutral data surfaces on Be:Move tokens in both
   themes, while leaving semantic success/error fills to the rules below.
   This is intentionally at the end of the file so it wins over the legacy
   component declarations without changing non-Be:Move Formula brands.
   ------------------------------------------------------------------ */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) {
  --bm-table-surface: var(--bm-control-surface);
  --bm-table-muted: var(--bm-control-muted);
  --bm-table-border: var(--bm-control-border);
  --bm-table-text: var(--bm-control-text);
  --bm-table-sub: var(--bm-control-sub);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .profit-table-wrap,
  .sales-table-wrap,
  .sales-mix-table-wrap,
  .activity-table-wrap,
  .goal-achievement-conversion-table-wrap,
  .goal-achievement-unified-table-wrap,
  .goal-achievement-place-table-wrap,
  .fx-customer-table-wrap
) {
  background: var(--bm-table-surface) !important;
  border-color: var(--bm-table-border) !important;
  color: var(--bm-table-text) !important;
  scrollbar-color: var(--bm-charcoal-500) var(--bm-table-muted);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .profit-table-wrap,
  .sales-table-wrap,
  .sales-mix-table-wrap,
  .activity-table-wrap,
  .goal-achievement-conversion-table-wrap,
  .goal-achievement-unified-table-wrap,
  .goal-achievement-place-table-wrap,
  .fx-customer-table-wrap
)::-webkit-scrollbar-track { background: var(--bm-table-muted); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .profit-table-wrap,
  .sales-table-wrap,
  .sales-mix-table-wrap,
  .activity-table-wrap,
  .goal-achievement-conversion-table-wrap,
  .goal-achievement-unified-table-wrap,
  .goal-achievement-place-table-wrap,
  .fx-customer-table-wrap
)::-webkit-scrollbar-thumb {
  background: var(--bm-charcoal-500);
  border: 2px solid var(--bm-table-muted);
  border-radius: 999px;
}

/* Neutral table cells (including the generated weekly/summary rows). */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-table,
  .sales-mix-table,
  .profit-table,
  .goal-achievement-conversion-table,
  .goal-achievement-unified-table,
  .fx-customer-table
) {
  background: var(--bm-table-surface) !important;
  color: var(--bm-table-text) !important;
  border-color: var(--bm-table-border) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-table,
  .sales-mix-table,
  .profit-table,
  .goal-achievement-conversion-table,
  .goal-achievement-unified-table,
  .fx-customer-table
) :is(thead, tbody, tfoot) { background: var(--bm-table-surface) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-table,
  .sales-mix-table,
  .profit-table,
  .goal-achievement-conversion-table,
  .goal-achievement-unified-table,
  .fx-customer-table
) :is(tbody tr, tfoot tr) { background: var(--bm-table-surface) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-table,
  .sales-mix-table,
  .profit-table,
  .goal-achievement-conversion-table,
  .goal-achievement-unified-table,
  .fx-customer-table
) :is(tbody tr:nth-child(even), tfoot tr:nth-child(even)) { background: var(--bm-table-muted) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-table,
  .sales-mix-table,
  .profit-table,
  .goal-achievement-conversion-table,
  .goal-achievement-unified-table,
  .fx-customer-table
) :is(tbody td, tfoot td) {
  background: var(--bm-table-surface) !important;
  color: var(--bm-table-text) !important;
  border-color: var(--bm-table-border) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-table,
  .sales-mix-table,
  .profit-table,
  .goal-achievement-conversion-table,
  .goal-achievement-unified-table,
  .fx-customer-table
) :is(tbody tr:nth-child(even) td, tfoot tr:nth-child(even) td) { background: var(--bm-table-muted) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-table,
  .sales-mix-table,
  .profit-table,
  .goal-achievement-conversion-table,
  .goal-achievement-unified-table,
  .fx-customer-table
) :is(tbody tr:hover td, tfoot tr:hover td) {
  background: color-mix(in srgb, var(--bm-orange-100) 42%, var(--bm-table-surface)) !important;
}

/* Sticky columns and activity's alternating-column treatment must not
   reintroduce Formula white cells on either theme. */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .profit-table th,
  .profit-table td,
  .activity-table-wrap .profit-table th,
  .activity-table-wrap .profit-table td,
  .sales-mix-table th,
  .sales-mix-table td,
  .goal-achievement-place-table-wrap .profit-table th,
  .goal-achievement-place-table-wrap .profit-table td
) { border-color: var(--bm-table-border) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .activity-table-wrap .profit-table thead th,
  .sales-table thead th,
  .sales-mix-table thead th,
  .profit-table thead th,
  .goal-achievement-conversion-table thead th,
  .goal-achievement-unified-table thead th,
  .fx-customer-table thead th
) {
  background: var(--bm-table-muted) !important;
  color: var(--bm-table-sub) !important;
  border-color: var(--bm-table-border) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .activity-table-wrap .profit-table tbody td:nth-child(2n),
  .activity-table-wrap .profit-table tbody td:nth-child(2n+1):not(:first-child),
  .activity-table-wrap .profit-table tbody td:first-child,
  .sales-mix-table th:first-child,
  .sales-mix-table td:first-child,
  .goal-achievement-unified-table th:first-child,
  .goal-achievement-unified-table td:first-child,
  .goal-achievement-place-table-wrap .profit-table th,
  .goal-achievement-place-table-wrap .profit-table td
) { background: var(--bm-table-surface) !important; color: var(--bm-table-text) !important; }

/* Goal-sales has hard-coded pastel summary/filler cells and a white monthly
   card.  Keep achieved/missed cells semantic, but make all neutral cells
   follow the same Be:Move surface. */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-target-summary-card,
  .sales-target-summary-card .profit-table-wrap,
  .sales-target-summary-card .profit-table,
  #sales-target-tbody,
  .sales-target-weekly-summary-row,
  .sales-target-weekly-grand-row,
  .sales-target-weekly-summary-row > td,
  .sales-target-weekly-grand-row > td,
  .sales-target-grand-filler,
  .sales-target-footer-label,
  .sales-target-footer-branch
) {
  background: var(--bm-table-surface) !important;
  color: var(--bm-table-text) !important;
  border-color: var(--bm-table-border) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-target-weekly-summary-row > td,
  .sales-target-weekly-grand-row > td,
  .sales-target-summary-card .sales-target-monthly-total-row > td
) { background: var(--bm-table-muted) !important; font-weight: 700; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-target-weekly-summary-row > td.st-cell-achieved,
  .sales-target-weekly-grand-row > td.st-cell-achieved,
  .sales-target-summary-card .sales-target-monthly-total-row > td.st-cell-achieved
) { background: color-mix(in srgb, var(--bm-green-500) 38%, var(--bm-table-surface)) !important; color: var(--bm-green-500) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .sales-target-weekly-summary-row > td.st-cell-missed,
  .sales-target-weekly-grand-row > td.st-cell-missed,
  .sales-target-summary-card .sales-target-monthly-total-row > td.st-cell-missed,
  .st-target-mismatch
) { background: color-mix(in srgb, var(--bm-red-500) 30%, var(--bm-table-surface)) !important; color: var(--bm-red-500) !important; }

/* Customer DB and CRM tables use Formula's --bg-sub/--card aliases, which
   can still point at light values when only the Be:Move theme is active. */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .fx-customer-wrap,
  .fx-customer-toolbar,
  .fx-customer-filterbar,
  .fx-contact-search-panel,
  .fx-contact-pending-resp,
  .fx-customer-summary,
  .fx-customer-dashboard,
  .fx-res-section,
  .fx-an-section
) { color: var(--bm-table-text); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .fx-customer-table thead th,
  .fx-customer-table tbody td,
  .fx-customer-table tbody tr,
  .fx-customer-table tbody tr.is-registered,
  .fx-customer-table tbody tr:hover
) {
  background: var(--bm-table-surface) !important;
  color: var(--bm-table-text) !important;
  border-color: var(--bm-table-border) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .fx-customer-table thead th,
  .fx-customer-table tbody tr.is-registered
) { background: var(--bm-table-muted) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .fx-customer-table input,
  .fx-customer-table select,
  .fx-customer-brand-select,
  .fx-customer-form-select,
  .fx-customer-form-reg-branch-select,
  .fx-inquiry-toolbar-branch-select,
  .fx-customer-filterbar input,
  .fx-customer-filterbar select,
  .fx-contact-search-bar input,
  .fx-contact-search-bar select
) {
  background: var(--bm-table-muted) !important;
  border-color: var(--bm-table-border) !important;
  color: var(--bm-table-text) !important;
}

/* Be:Move-specific white cards and controls that are not part of Formula's
   table primitives.  Outcome/error callouts keep their semantic colors. */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .bemove-sales-card,
  .bemove-sales-modal,
  .bemove-modal,
  .bemove-schedule-grid,
  .bemove-schedule-input-wrap,
  .bemove-retention-card,
  .bemove-sales-tab,
  .bemove-sales-radio,
  .bemove-sales-radio-contract,
  .bemove-schedule-nav-btn,
  .bemove-schedule-today,
  .bemove-schedule-view-btn,
  .bemove-schedule-duration,
  .bemove-survey-item select,
  .bemove-diet-create-grid textarea,
  .bemove-diet-top-photo,
  .bemove-diet-ai-feedback-input,
  .bemove-diet-archive-table
) {
  background: var(--bm-table-surface) !important;
  border-color: var(--bm-table-border) !important;
  color: var(--bm-table-text) !important;
}

/* Legacy Formula detail modals are rendered outside the Be:Move cards.  In
   dark mode the page text token is light while the legacy modal keeps a white
   surface, which makes its values (and the title) disappear.  Give the modal
   and its detail rows an explicit surface/text pair in both themes. */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .fx-modal,
  .fx-modal-header,
  .fx-modal-body,
  .fx-modal-footer
) {
  background: var(--bm-control-surface) !important;
  color: var(--bm-control-text) !important;
  border-color: var(--bm-control-border) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .fx-modal-header h4 {
  color: var(--bm-control-text) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .fx-modal-detail-panel {
  background: var(--bm-control-muted) !important;
  border-color: var(--bm-control-border) !important;
  color: var(--bm-control-text) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .fx-modal-detail-panel .fx-modal-check-item > span:first-child {
  color: var(--bm-control-sub) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .fx-modal-detail-panel .fx-modal-check-item > span:last-child {
  color: var(--bm-control-text) !important;
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .bemove-sales-table th,
  .bemove-schedule-weekdays,
  .bemove-schedule-timetable thead th,
  .bemove-retention-table th,
  .bemove-satisfaction-table th,
  .bemove-diet-archive-table th
) { background: var(--bm-table-muted) !important; color: var(--bm-table-sub) !important; border-color: var(--bm-table-border) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .bemove-sales-table td,
  .bemove-schedule-timetable td,
  .bemove-retention-table td,
  .bemove-satisfaction-table td,
  .bemove-diet-archive-table td
) { color: var(--bm-table-text) !important; border-color: var(--bm-table-border) !important; }

/* Analytics/CRM panels also contain literal white chart canvases. */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .fx-marketing-crm,
  .fx-marketing-crm .table-wrap,
  .fx-marketing-crm .table,
  .fx-dai-card,
  .fx-an-kpi-card,
  .fx-res-section,
  .fx-res-q-card,
  .fx-res-detail-box,
  .fx-mcrm-db-row,
  .fx-mcrm-db-item,
  .fx-qr-card,
  .fx-qr-analytics-card,
  .fx-customer-dashboard .card,
  .fx-pt-historical-card,
  .fx-pt-trend-card
) {
  background: var(--bm-table-surface) !important;
  border-color: var(--bm-table-border) !important;
  color: var(--bm-table-text) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .fx-res-section-head,
  .fx-res-q-head,
  .fx-res-detail-item,
  .fx-an-funnel,
  .fx-marketing-crm .table thead,
  .fx-mcrm-db-results
) { background: var(--bm-table-muted) !important; color: var(--bm-table-text) !important; border-color: var(--bm-table-border) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .fx-res-q-title,
  .fx-res-q-meta,
  .fx-res-detail-q,
  .fx-res-detail-a,
  .fx-an-kpi-label,
  .fx-an-kpi-value,
  .fx-marketing-crm-label,
  .fx-mcrm-tab-btn,
  .fx-customer-title h3,
  .fx-customer-title p
) { color: var(--bm-table-text) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .fx-res-bar-track,
  .fx-an-funnel-bar-wrap,
  .fx-pt-metric-cell,
  .fx-pt-metric-cell--reg
) { background: var(--bm-charcoal-100) !important; }

/* Marketing response dashboards still ship Formula's light-theme text
   selectors.  They are more specific than the parent card color, so titles,
   counts and UTM labels can disappear against Be:Move's dark surfaces.
   Keep semantic badges and chart fills untouched; only the text hierarchy is
   remapped to the Be:Move table tokens. */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .fx-fd-form-table tbody td,
  .fx-fd-form-table .fx-fd-cell-title,
  .fx-fd-form-table .fx-fd-title-line,
  .fx-fd-form-table .fx-fd-title-line strong,
  .fx-fd-form-table .fx-fd-cell-num,
  .fx-fd-form-table .fx-fd-cell-total,
  .fx-fd-form-table .fx-fd-cell-meta,
  .fx-fd-title-link,
  .fx-fd-bar-val,
  .fx-fd-bar-x,
  .fx-res-bar-label,
  .fx-res-bar-value
) { color: var(--bm-table-text) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .fx-fd-form-table thead th,
  .fx-res-section-head strong,
  .fx-res-section-head .text-muted
) { color: var(--bm-table-sub) !important; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .fx-fd-form-table tbody td {
  border-bottom-color: var(--bm-table-border) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .fx-fd-form-table tbody tr:hover td {
  background: color-mix(in srgb, var(--bm-orange-100) 22%, var(--bm-table-surface)) !important;
}

/* Focus/active controls use the brand orange rather than Formula's blue or
   indigo.  Keep status badges and chart series semantic. */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .fx-customer-subtab.active,
  .fx-mcrm-chip.is-active,
  .fx-mcrm-tab-btn.is-active,
  .fx-res-option.is-on,
  .fx-res-filter-cell.is-filter-active,
  .fx-dc-propose.is-on,
  .fx-ds-present-bar .fx-ds-present-exit,
  .finance-mobile-tab-btn.active
) {
  background: var(--bm-orange-500) !important;
  border-color: var(--bm-orange-500) !important;
  color: var(--bm-white) !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .fx-customer-link,
  .fx-customer-tel:hover,
  .fx-customer-subtab:hover,
  .fx-mcrm-tab-btn:hover,
  .fx-res-filter-cell:hover,
  .fx-res-option:hover
) { color: var(--bm-orange-600) !important; }

/* PT sales is also rendered while a Formula route is being converted to the
   Be:Move brand.  During that transition the legacy table rules can paint
   pale cells over the dark page, leaving the labels and metric values nearly
   invisible.  Keep this screen readable from the root theme attribute as a
   final safety net, even if the body mode attribute is briefly stale. */
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-pt-sales-screen :is(
  .profit-table-wrap,
  .profit-table
) {
  background: #1a1e24 !important;
  color: #f2f5f8 !important;
  border-color: #3b444f !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-pt-sales-screen .profit-table :is(
  thead,
  tbody,
  tfoot,
  tr
) { background: #1a1e24 !important; }
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-pt-sales-screen .profit-table tbody tr:nth-child(even) {
  background: #20262d !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-pt-sales-screen .profit-table :is(
  thead th,
  tbody td,
  tfoot td
) {
  background: #1a1e24 !important;
  color: #f2f5f8 !important;
  border-color: #3b444f !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-pt-sales-screen .profit-table :is(
  tbody tr:nth-child(even) td,
  tfoot tr:nth-child(even) td
) { background: #20262d !important; }
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-pt-sales-screen .profit-table thead th {
  background: #20262d !important;
  color: #b5bec9 !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-pt-sales-screen :is(
  .bemove-pt-amount-cell,
  .bemove-inline-metric-text,
  .bemove-pt-mini-chart-label,
  .bemove-pt-mini-chart-value
) { color: #f2f5f8 !important; }
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-pt-sales-screen .bemove-pt-mini-chart-track {
  background: #3b444f !important;
}

/* Root-scoped dark fallback for legacy Formula screens.  Some routes keep
   their body mode class while the theme attribute is already switched (and
   several legacy cards still carry literal light colors).  These selectors
   keep PT sales, Customer DB, CRM and finance overlays readable during and
   after that transition without changing the semantic status colors. */
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .fx-customer-wrap,
  .fx-customer-toolbar,
  .fx-customer-body,
  .fx-customer-filterbar,
  .fx-contact-search-panel,
  .fx-contact-pending-resp,
  .fx-customer-summary,
  .fx-customer-dashboard,
  .fx-customer-dashboard .card,
  .fx-cd-rate-grid,
  .fx-cd-payment-table-wrap,
  .fx-cd-payment-table,
  .fx-cd-status-details,
  .fx-cd-action-block,
  .fx-cd-action-followup-section,
  .fx-cd-rate-card,
  .fx-an-kpi-card,
  .fx-an-kpi-grid,
  .fx-res-section,
  .fx-res-q-card,
  .fx-res-detail-box,
  .fx-pt-historical-card,
  .fx-pt-trend-card,
  .fx-marketing-crm,
  .fx-marketing-crm .table-wrap,
  .fx-marketing-crm .table-responsive,
  .fx-mcrm-db-row,
  .fx-mcrm-db-item
) {
  background: #1a1e24 !important;
  color: #f2f5f8 !important;
  border-color: #3b444f !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .fx-customer-table-wrap,
  .fx-naver-import-table-wrap,
  .fx-inquiry-table-wrap,
  .fx-customer-table,
  .fx-naver-import-table,
  .fx-inquiry-table,
  .fx-marketing-crm .table
) {
  background: #1a1e24 !important;
  color: #f2f5f8 !important;
  border-color: #3b444f !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .fx-customer-table thead,
  .fx-customer-table thead th,
  .fx-naver-import-table thead,
  .fx-naver-import-table thead th,
  .fx-inquiry-table thead,
  .fx-inquiry-table thead th,
  .fx-marketing-crm .table thead
) {
  background: #20262d !important;
  color: #dbe3eb !important;
  border-color: #3b444f !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .fx-customer-table tbody,
  .fx-customer-table tbody tr,
  .fx-customer-table tbody td,
  .fx-naver-import-table tbody tr,
  .fx-naver-import-table tbody td,
  .fx-inquiry-table tbody tr,
  .fx-inquiry-table tbody td,
  .fx-marketing-crm .table tbody tr,
  .fx-marketing-crm .table tbody td
) {
  background: #1a1e24 !important;
  color: #f2f5f8 !important;
  border-color: #3b444f !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .fx-cd-payment-table th,
  .fx-cd-payment-table td,
  .fx-cd-payment-table tfoot td,
  .fx-cd-payment-table tbody tr,
  .fx-contacts-table thead th,
  .fx-contacts-table tbody td,
  .fx-contacts-table tbody tr
) {
  background: #1a1e24 !important;
  color: #f2f5f8 !important;
  border-color: #3b444f !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .fx-cd-payment-table th,
  .fx-cd-payment-table tfoot td,
  .fx-contacts-table thead th
) {
  background: #20262d !important;
  color: #dbe3eb !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .fx-cd-payment-table tbody tr:nth-child(even),
  .fx-contacts-table tbody tr:nth-child(even),
  .fx-contacts-table tbody tr.is-registered
) { background: #20262d !important; }
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .fx-cd-rate-label,
  .fx-cd-rate-value,
  .fx-cd-payment-amt,
  .fx-cd-month-caption,
  .fx-cd-status-details summary
) { color: #f2f5f8 !important; }
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .fx-cd-payment-table tbody tr.fx-cd-payment-row:hover,
  .fx-cd-payment-table tbody tr.fx-cd-payment-row:focus-visible,
  .fx-contacts-table tbody tr:hover
) { background: #2a333d !important; }

/* Detail dialogs are another legacy surface that used to retain white
   backgrounds when only the html theme attribute had switched. */
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .modal-content,
  .fx-modal,
  .fx-modal-content,
  .fx-modal-header,
  .fx-modal-body,
  .fx-modal-footer,
  .expense-modal,
  .expense-modal .modal-content
) {
  background: #1a1e24 !important;
  color: #f2f5f8 !important;
  border-color: #3b444f !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .modal-content :is(input, select, textarea),
  .fx-modal :is(input, select, textarea),
  .fx-modal-content :is(input, select, textarea),
  .expense-modal :is(input, select, textarea)
) {
  background: #20262d !important;
  color: #f2f5f8 !important;
  border-color: #3b444f !important;
  color-scheme: dark;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .modal-content .text-muted,
  .fx-modal .text-muted,
  .fx-modal-content .text-muted,
  .expense-modal .text-muted
) { color: #b5bec9 !important; }

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) {
  /* Inline KPI colors are kept semantic but raised to accessible dark-mode
     equivalents so green/amber cards do not disappear on dark surfaces. */
  --bm-kpi-success: #6ee7b7;
  --bm-kpi-warning: #fcd34d;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .fx-an-kpi-value[style*="15803d"],
  .fx-cd-payment-amt,
  .fx-cd-rate-card--money .fx-cd-rate-value
) { color: #6ee7b7 !important; }
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .fx-an-kpi-value[style*="b45309"],
  .fx-cd-rate-card--cancel .fx-cd-rate-value
) { color: #fcd34d !important; }

/* Keep ordinary text and labels visible even when a legacy rule assigns a
   pale text color inline inside these dark panels. */
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .fx-customer-wrap,
  .fx-customer-dashboard,
  .bemove-pt-sales-screen
) :is(label, p, h1, h2, h3, h4, h5, h6, th, td, .text-muted) {
  color: #f2f5f8 !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .fx-customer-wrap,
  .fx-customer-dashboard,
  .bemove-pt-sales-screen
) :is(.text-muted, small, .hint, .description) {
  color: #b5bec9 !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .fx-customer-table tbody tr:nth-child(even),
  .fx-customer-table tbody tr.is-registered,
  .fx-naver-import-table tbody tr:nth-child(even),
  .fx-inquiry-table tbody tr:nth-child(even),
  .fx-marketing-crm .table tbody tr:nth-child(even)
) {
  background: #20262d !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .fx-customer-title h3,
  .fx-customer-title p,
  .fx-customer-subtabs,
  .fx-customer-subtab,
  .fx-customer-label,
  .fx-customer-field,
  .fx-cd-action-title,
  .fx-cd-action-hint,
  .fx-cd-action-row-label,
  .fx-cd-action-row-count,
  .fx-cd-bar-label,
  .fx-cd-bar-count,
  .fx-res-q-title,
  .fx-res-q-meta,
  .fx-res-detail-q,
  .fx-res-detail-a,
  .fx-an-kpi-label,
  .fx-an-kpi-value,
  .fx-marketing-crm-label,
  .fx-mcrm-tab-btn,
  .fx-mcrm-db-results
) {
  color: #f2f5f8 !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .fx-customer-brand-select,
  .fx-customer-filterbar input,
  .fx-customer-filterbar select,
  .fx-contact-search-panel input,
  .fx-contact-search-panel select,
  .fx-cd-period-controls input,
  .fx-cd-period-controls select,
  .fx-pt-modal-field input,
  .fx-pt-modal-field select,
  .fx-pt-modal-field textarea,
  .fx-inquiry-input
) {
  background: #20262d !important;
  color: #f2f5f8 !important;
  border-color: #3b444f !important;
  color-scheme: dark;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .fx-cd-action-row-track,
  .fx-cd-bar-track,
  .fx-res-bar-track,
  .fx-an-funnel-bar-wrap,
  .fx-pt-metric-cell,
  .fx-pt-metric-cell--reg
) { background: #3b444f !important; }

/* PT sales has outer cards and filters outside the table fallback above. */
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-pt-sales-screen :is(
  .bemove-pt-sales-head,
  .bemove-pt-sales-summary,
  .bemove-pt-sales-card,
  .bemove-panel,
  .card,
  .table-wrap,
  .bemove-pt-sales-filter,
  select,
  input
) {
  background: #1a1e24 !important;
  color: #f2f5f8 !important;
  border-color: #3b444f !important;
  color-scheme: dark;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-pt-sales-screen :is(
  .bemove-pt-sales-head small,
  .bemove-pt-sales-summary small,
  .bemove-pt-sales-card small,
  .bemove-pt-sales-filter label
) { color: #b5bec9 !important; }

/* ------------------------------------------------------------------
   InBody contrast contract
   ------------------------------------------------------------------
   InBody is rendered by the Be:Move member-detail view but its original
   component stylesheet still paints literal white/chart-pastel surfaces.
   In dark mode that leaves inherited light text on white cards (and light
   chart labels on dark cards). Keep the entire feature on one explicit
   surface/text contract, including SVG labels, semantic callouts and the
   manual-entry dialog. This block is intentionally last so it wins over
   legacy literal colors and remains valid when a route keeps a stale body
   mode class during theme transitions.
   ------------------------------------------------------------------ */
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .bemove-inbody-panel,
  .bemove-inbody-graph-card,
  .bemove-inbody-composition,
  .bemove-inbody-insight,
  .bemove-inbody-history,
  .bemove-inbody-trend-card,
  .bemove-inbody-progress-summary > div,
  .bemove-inbody-latest-strip,
  .bemove-inbody-latest-strip .metric,
  .bemove-inbody-composition-grid article,
  .bemove-inbody-chart-wrap,
  .bemove-inbody-chart-empty
) {
  background: #1a1e24 !important;
  color: #f2f5f8 !important;
  border-color: #3b444f !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-score-card {
  background: linear-gradient(120deg, #0d0f12 0%, #171b20 100%) !important;
  color: #fff !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-example-banner {
  background: #3a241b !important;
  border-color: #a94f22 !important;
  color: #ffd9c7 !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-example-banner span {
  color: #ffd9c7 !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-panel :is(
  h4, h5, p, label, span, small, b, em, li, th, td
) { color: #f2f5f8 !important; }
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-panel :is(
  .bemove-inbody-graph-head p,
  .bemove-inbody-section-title p,
  .bemove-inbody-section-title > span,
  .bemove-inbody-progress-summary span,
  .bemove-inbody-progress-summary small,
  .bemove-inbody-trend-head span,
  .bemove-inbody-trend-head strong small,
  .bemove-inbody-trend-deltas,
  .bemove-inbody-goal-copy,
  .bemove-inbody-chart-note,
  .bemove-inbody-composition-grid article > div small,
  .bemove-inbody-composition-grid article > b,
  .bemove-inbody-latest-strip .metric b,
  .bemove-inbody-history-table th
) { color: #b5bec9 !important; }
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-progress-summary strong,
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-trend-head strong,
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-composition-grid article strong {
  color: #f2f5f8 !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-section-title > span {
  background: #2d343d !important;
  border: 1px solid #3b444f;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-progress-summary > div::before {
  background: #737e8b;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-progress-summary .is-weight::before { background: #ff6b6b; }
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-progress-summary .is-smm::before { background: #8fb8ff; }
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-progress-summary .is-bfp::before { background: #f6c86e; }
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-progress-summary .is-score::before { background: #ff8b58; }
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-latest-strip .metric.weight strong { color: #ff8b86 !important; }
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-latest-strip .metric.smm strong { color: #8fb8ff !important; }
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-latest-strip .metric.bfp strong { color: #f6c86e !important; }

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-chart-wrap {
  background: linear-gradient(180deg, #20262d 0%, #1a1e24 100%) !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-chart-empty {
  background: #20262d !important;
  border-color: #596574 !important;
  color: #b5bec9 !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-chart .y-grid line,
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-mini-chart .grid line {
  stroke: #46515d !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-chart :is(.y-grid text, .x-labels text),
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-mini-chart :is(.grid text, .dates text) {
  fill: #b5bec9 !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-chart .dot,
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-mini-chart .dots circle {
  stroke: #1a1e24 !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-mini-chart .target text {
  fill: #6ee7b7 !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-trend-card :is(.is-good, .is-watch) {
  border: 1px solid transparent;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-trend-card .is-good {
  background: #17382e !important;
  color: #6ee7b7 !important;
  border-color: #28634e;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-trend-card .is-watch {
  background: #3a3018 !important;
  color: #fcd34d !important;
  border-color: #79611b;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-composition-grid article.is-watch {
  background: #30251a !important;
  border-color: #79532a !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-composition-grid article > b.is-up { color: #8fb8ff !important; }
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-composition-grid article > b.is-down { color: #ff8b86 !important; }
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-box {
  background: #20262d !important;
  border-color: #3b444f !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-box.is-current,
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-box.is-goal {
  background: #342119 !important;
  border-color: #a94f22 !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-box.is-needs {
  background: #321f25 !important;
  border-color: #7c3642 !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-box.is-method {
  background: #17382e !important;
  border-color: #28634e !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-box.is-diet {
  background: #30251a !important;
  border-color: #79532a !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-box.is-exercise {
  background: #17323b !important;
  border-color: #2c6472 !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-history-table :is(th, td) {
  background: #1a1e24 !important;
  color: #f2f5f8 !important;
  border-color: #3b444f !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-history-table th {
  background: #20262d !important;
  color: #dbe3eb !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-manual-overlay {
  background: rgb(5 7 10 / 80%) !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-manual-modal {
  background: #1a1e24 !important;
  border-color: #3b444f !important;
  color: #f2f5f8 !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-inbody-manual-modal :is(input, select, textarea) {
  background: #20262d !important;
  border-color: #3b444f !important;
  color: #f2f5f8 !important;
  color-scheme: dark;
}

/* Detail rows inside the legacy modal have inline slate colors and a white
   detail panel.  Override both so expense/refund details stay readable too. */
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .fx-modal-detail-panel,
  .fx-modal-checklist,
  .fx-expense-request-modal .fx-modal-body,
  .fx-image-viewer-modal .fx-modal-body
) {
  background: #20262d !important;
  color: #f2f5f8 !important;
  border-color: #3b444f !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .fx-modal-detail-panel .fx-modal-check-item,
  .fx-modal-checklist .fx-modal-check-item
) {
  border-color: #3b444f !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .fx-modal-detail-panel .fx-modal-check-item > span:first-child,
  .fx-modal-checklist .fx-modal-check-item > span:first-child
) {
  color: #b5bec9 !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .fx-modal-detail-panel .fx-modal-check-item > span:last-child,
  .fx-modal-checklist .fx-modal-check-item > span:last-child,
  .fx-expense-request-modal .fx-modal-body label
) {
  color: #f2f5f8 !important;
}

/* ------------------------------------------------------------------
   Legacy Formula table contrast guard
   ------------------------------------------------------------------
   Formula routes can switch the root theme before their body mode class is
   refreshed.  Their older table rules also paint literal white rows and
   sticky cells.  Keep neutral table surfaces and labels readable from the
   root theme alone; semantic bars/badges remain free to keep their colors.
   ------------------------------------------------------------------ */
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .profit-table-wrap,
  .sales-table-wrap,
  .sales-mix-table-wrap,
  .sales-product-class-table-wrap,
  .sales-product-origin-table-wrap,
  .activity-table-wrap,
  .goal-achievement-conversion-table-wrap,
  .goal-achievement-unified-table-wrap,
  .goal-achievement-place-table-wrap,
  .place-table-wrap,
  .fx-pt-table-wrap,
  .fx-customer-table-wrap,
  .fx-naver-import-table-wrap,
  .fx-inquiry-table-wrap,
  .fx-cd-payment-table-wrap
) {
  background: #1a1e24 !important;
  color: #f2f5f8 !important;
  border-color: #3b444f !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .profit-table,
  .sales-table,
  .sales-mix-table,
  .sales-product-class-table,
  .sales-product-origin-table,
  .goal-achievement-conversion-table,
  .goal-achievement-unified-table,
  .place-table-wrap > table,
  .place-weekly-body-table,
  .fx-pt-table,
  .fx-customer-table,
  .fx-naver-import-table,
  .fx-inquiry-table,
  .fx-cd-payment-table
) {
  background: #1a1e24 !important;
  color: #f2f5f8 !important;
  border-color: #3b444f !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .profit-table,
  .sales-table,
  .sales-mix-table,
  .sales-product-class-table,
  .sales-product-origin-table,
  .goal-achievement-conversion-table,
  .goal-achievement-unified-table,
  .place-table-wrap > table,
  .place-weekly-body-table,
  .fx-pt-table,
  .fx-customer-table,
  .fx-naver-import-table,
  .fx-inquiry-table,
  .fx-cd-payment-table
) :is(thead, thead tr, tbody, tfoot, tbody tr, tfoot tr) {
  background: #1a1e24 !important;
  color: #f2f5f8 !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .profit-table,
  .sales-table,
  .sales-mix-table,
  .sales-product-class-table,
  .sales-product-origin-table,
  .goal-achievement-conversion-table,
  .goal-achievement-unified-table,
  .place-table-wrap > table,
  .place-weekly-body-table,
  .fx-pt-table,
  .fx-customer-table,
  .fx-naver-import-table,
  .fx-inquiry-table,
  .fx-cd-payment-table
) :is(tbody tr:nth-child(even), tfoot tr:nth-child(even)) {
  background: #20262d !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .profit-table,
  .sales-table,
  .sales-mix-table,
  .sales-product-class-table,
  .sales-product-origin-table,
  .goal-achievement-conversion-table,
  .goal-achievement-unified-table,
  .place-table-wrap > table,
  .place-weekly-body-table,
  .fx-pt-table,
  .fx-customer-table,
  .fx-naver-import-table,
  .fx-inquiry-table,
  .fx-cd-payment-table
) :is(th, td) {
  background: #1a1e24 !important;
  color: #f2f5f8 !important;
  border-color: #3b444f !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .profit-table,
  .sales-table,
  .sales-mix-table,
  .sales-product-class-table,
  .sales-product-origin-table,
  .goal-achievement-conversion-table,
  .goal-achievement-unified-table,
  .place-table-wrap > table,
  .place-weekly-body-table,
  .fx-pt-table,
  .fx-customer-table,
  .fx-naver-import-table,
  .fx-inquiry-table,
  .fx-cd-payment-table
) :is(tbody tr:nth-child(even) td, tfoot tr:nth-child(even) td) {
  background: #20262d !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .profit-table,
  .sales-table,
  .sales-mix-table,
  .sales-product-class-table,
  .sales-product-origin-table,
  .goal-achievement-conversion-table,
  .goal-achievement-unified-table,
  .place-weekly-head-table,
  .place-table-wrap > table,
  .fx-pt-table,
  .fx-customer-table,
  .fx-naver-import-table,
  .fx-inquiry-table,
  .fx-cd-payment-table
) :is(thead th, thead tr th) {
  background: #20262d !important;
  color: #dbe3eb !important;
  border-color: #3b444f !important;
}
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .profit-table,
  .sales-table,
  .sales-mix-table,
  .sales-product-class-table,
  .sales-product-origin-table,
  .goal-achievement-conversion-table,
  .goal-achievement-unified-table,
  .place-table-wrap > table,
  .place-weekly-body-table,
  .fx-pt-table,
  .fx-customer-table,
  .fx-naver-import-table,
  .fx-inquiry-table,
  .fx-cd-payment-table
) :is(.text-muted, .text-sub, .muted, small, caption) {
  color: #b5bec9 !important;
}

/* PT sales/member list: restore contrast for modern light exceptions in dark mode. */
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .fx-pt {
  color: #f2f5f8 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .fx-pt .fx-pt-subtab-group {
  background: #1a1e24 !important;
  border-color: #3b444f !important;
  color: #f2f5f8 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .fx-pt .fx-pt-subtab-group-label {
  background: #20262d !important;
  border-color: #3b444f !important;
  color: #b5bec9 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .fx-pt .fx-pt-subtab {
  background: transparent !important;
  border-color: transparent !important;
  color: #b5bec9 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .fx-pt .fx-pt-subtab:hover {
  background: #2a333d !important;
  color: #f2f5f8 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .fx-pt .fx-pt-subtab.is-active {
  background: #342119 !important;
  border-color: #f26522 !important;
  color: #facfb6 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .fx-pt .fx-pt-kpi {
  background: #1a1e24 !important;
  border-color: #3b444f !important;
  color: #f2f5f8 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .fx-pt .fx-pt-kpi--emphasis {
  background: #342119 !important;
  border-color: #a94f22 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .fx-pt :is(.fx-pt-kpi-label, .fx-pt-kpi-hint) {
  color: #b5bec9 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .fx-pt .fx-pt-kpi-value {
  color: #f2f5f8 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-pt-member-new {
  background: #1a1e24 !important;
  border-color: #3b444f !important;
  color: #f2f5f8 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-pt-member-new .bemove-pt-member-name {
  color: #f2f5f8 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-pt-member-new .bemove-pt-member-sub {
  color: #b5bec9 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-pt-member-new .bemove-pt-avatar-new {
  background: #342119 !important;
  border-color: #a94f22 !important;
  color: #facfb6 !important;
}

/* Workout log and homework surfaces: replace the light-only defaults in style.css
   so BeMove dark mode keeps every label, input and empty state readable. */
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .bemove-555-overview-card,
  .bemove-555-archive-wrap,
  .bemove-555-archive-details,
  .bemove-555-archive-workout-item,
  .bemove-555-modal-card,
  .bemove-hw-left,
  .bemove-hw-right,
  .bemove-self-homework-item,
  .bemove-self-homework-detail,
  .bemove-self-workout-modal
) {
  background: #1a1e24 !important;
  border-color: #3b444f !important;
  color: #f2f5f8 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .bemove-555-overview-kpis,
  .bemove-555-overview-kpis > div,
  .bemove-555-archive-set-table th,
  .bemove-555-archive-set-table td,
  .bemove-555-tabs,
  .bemove-555-merge-row,
  .bemove-555-condition,
  .bemove-555-pain,
  .bemove-555-exercise,
  .bemove-555-icon-del,
  .bemove-555-ex-video,
  .bemove-self-workout-type,
  .bemove-self-workout-ex-list,
  .bemove-self-workout-ex-item.is-cardio,
  .bemove-self-homework-sections section,
  .bemove-self-homework-exercises article,
  .bemove-hw-part,
  .bemove-hw-exercise,
  .bemove-hw-exercise-empty,
  .bemove-hw-coach-message
) {
  background: #20262d !important;
  border-color: #3b444f !important;
  color: #f2f5f8 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .bemove-555-overview-kpis span,
  .bemove-555-overview-note p,
  .bemove-555-archive-workout-head span,
  .bemove-555-bodymap-caption,
  .bemove-555-ex-video-head,
  .bemove-555-ex-video-hint,
  .bemove-555-ex-feedback label,
  .bemove-hw-part-sub,
  .bemove-hw-part-plus,
  .bemove-hw-tip,
  .bemove-self-homework-item span small,
  .bemove-self-homework-detail .detail-head span,
  .bemove-self-homework-detail .guide li,
  .bemove-self-workout-empty,
  .bemove-hw-preview-empty
) {
  color: #b5bec9 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .bemove-555-overview-kpis b,
  .bemove-555-overview-note b,
  .bemove-555-archive-workout-head strong,
  .bemove-555-merge-summary strong,
  .bemove-555-merge-summary span,
  .bemove-self-homework-item span b,
  .bemove-self-homework-detail .detail-head b,
  .bemove-self-homework-detail .guide b,
  .bemove-self-homework-exercises article strong,
  .bemove-self-workout-head h3,
  .bemove-self-workout-close,
  .bemove-hw-left h5,
  .bemove-hw-right h5,
  .bemove-hw-exercise-title,
  .bemove-hw-exercise-head,
  .bemove-hw-part-label
) {
  color: #f2f5f8 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .bemove-555-overview-note,
  .bemove-555-overview-note.is-ai,
  .bemove-555-summary,
  .bemove-hw-preview
) {
  background: #342119 !important;
  border-color: #a94f22 !important;
  color: #f2f5f8 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-555-overview-note.is-goal {
  background: #123a28 !important;
  border-color: #2e9e5b !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .bemove-555-archive-row:hover,
  .bemove-self-homework-row.is-active
) {
  background: #342119 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .bemove-555-tab,
  .bemove-self-workout-type,
  .bemove-hw-part
) {
  color: #b5bec9 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .bemove-555-tab.is-active,
  .bemove-self-workout-type.is-active,
  .bemove-hw-part.is-active
) {
  background: #342119 !important;
  border-color: #f26522 !important;
  color: #facfb6 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .bemove-555-section input,
  .bemove-555-section textarea,
  .bemove-555-ex-head input,
  .bemove-555-ex-head select,
  .bemove-555-set-table input,
  .bemove-555-ex-feedback textarea,
  .bemove-hw-settings input,
  .bemove-hw-settings textarea,
  .bemove-hw-exercise-grid input,
  .bemove-hw-exercise-grid select,
  .bemove-hw-coach-message,
  .bemove-self-workout-group input,
  .bemove-self-workout-group textarea,
  .bemove-self-workout-ex-item input,
  .bemove-self-workout-ex-item select
) {
  background: #20262d !important;
  border-color: #3b444f !important;
  color: #f2f5f8 !important;
  caret-color: #f26522 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .bemove-hw-settings label span,
  .bemove-hw-exercise-grid label span
) {
  color: #b5bec9 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .bemove-hw-exercise-head b,
  .bemove-self-homework-exercises article li
) {
  color: #facfb6 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-self-homework-exercises article li {
  background: #342119 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .bemove-hw-settings,
  .bemove-self-workout-head
) {
  border-color: #3b444f !important;
}

/* Muscle-map labels use a navy light-mode default that disappears on dark panels. */
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .bemove-555-membermap,
  .bemove-555-bodymap,
  .muscle-map-shell,
  .muscle-side
) {
  background: #20262d !important;
  border-color: #3b444f !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .muscle-label b,
  .muscle-label small,
  .muscle-legend,
  .muscle-side label
) {
  color: #f2f5f8 !important;
}

/* Conversion log: the legacy cards and view buttons have light-only defaults.
   Keep their surfaces and semantic colors legible when the Be:Move theme is dark. */
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .bemove-conversion-card,
  .bemove-conversion-filter,
  .bemove-ot-view-filters .btn
) {
  background: #20262d !important;
  border-color: #3b444f !important;
  color: #f2f5f8 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-conversion-card-label {
  color: #b5bec9 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-conversion-card-value {
  color: #f2f5f8 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-conversion-card-success .bemove-conversion-card-value {
  color: #63d997 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) .bemove-conversion-card-failure .bemove-conversion-card-value {
  color: #ff7a7d !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) :is(
  .bemove-conversion-filter:hover,
  .bemove-conversion-filter.is-active,
  .bemove-ot-view-filters .btn:hover,
  .bemove-ot-view-filters .btn.is-active
) {
  background: #342119 !important;
  border-color: #f26522 !important;
  color: #facfb6 !important;
}

/* ------------------------------------------------------------------
   Formula X overview cards in a Be:Move-branded dark session
   ------------------------------------------------------------------
   Formula X deliberately removes data-formula-theme when a Be:Move brand
   profile is active, so the Formula-only rules in style.css do not match.
   The overview split cards still carry literal light-mode surfaces in that
   state, which makes their inherited light text disappear on the dark page.
   Keep this scoped to the branded Formula session so an unbranded Formula
   installation keeps its own palette.
   ------------------------------------------------------------------ */
html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) body[data-bemove-brand="1"] :is(
  .overview-filter-card,
  .overview-funnel-card,
  .overview-sales-card,
  .overview-root > .card
) {
  background: #1a1e24 !important;
  border-color: #3b444f !important;
  color: #f2f5f8 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) body[data-bemove-brand="1"] :is(
  .overview-filter-card label,
  .overview-funnel-rate,
  .overview-segment-title,
  .overview-sales-split .label,
  .overview-sales-split .sub
) {
  color: #b5bec9 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) body[data-bemove-brand="1"] :is(
  .overview-filter-row select,
  .overview-filter-row input[type="date"],
  .overview-filter-row input[type="text"]
) {
  background: #20262d !important;
  border-color: #3b444f !important;
  color: #f2f5f8 !important;
  color-scheme: dark;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) body[data-bemove-brand="1"] .overview-sales-total {
  background: #123a28 !important;
  border-color: #2e9e5b !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) body[data-bemove-brand="1"] :is(
  .overview-sales-total .label,
  .overview-sales-total .value
) {
  color: #b8f5cf !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) body[data-bemove-brand="1"] .overview-sales-split .split-box {
  background: #20262d !important;
  border-color: #3b444f !important;
  color: #f2f5f8 !important;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) body[data-bemove-brand="1"] .overview-sales-split .value {
  color: #f2f5f8 !important;
}