/* ============================================================
   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-font-mono: var(--font-mono);
  --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-radius-pill: var(--radius-pill);
  --bm-shadow-card: var(--shadow-card);
  --bm-shadow-raised: var(--shadow-raised);
  --bm-shadow-sheet: var(--shadow-sheet);
  --bm-ring-focus: var(--ring-focus);
  --bm-dur-fast: var(--dur-fast);
  --bm-dur-base: var(--dur-base);
  --bm-ease-standard: var(--ease-standard);
  --bm-ease-out: var(--ease-out);
  --bm-ease-in-out: var(--ease-standard);
}

/* ── 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-profit-expense-detail-summary {
  background: #f8fafc !important;
  color: #1e293b !important;
  border-color: #e2e8f0 !important;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .fx-profit-expense-detail-summary span {
  color: #64748b !important;
}
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .fx-profit-expense-detail-summary {
  background: var(--bm-control-muted, #20262d) !important;
  color: var(--bm-control-text, #f2f5f8) !important;
  border-color: var(--bm-control-border, #3b444f) !important;
}
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .fx-profit-expense-detail-summary span {
  color: var(--bm-control-sub, #b5bec9) !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;
}

/* ------------------------------------------------------------------
   Formula X profitability report mode for Be:Move brands
   ------------------------------------------------------------------ */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .bemove-profit-title-row h3,
  .bemove-profit-report-notes-head h3,
  .bemove-profit-report-header h1,
  .bemove-profit-report-section-head h2,
  .bemove-profit-report-metric-value,
  .bemove-profit-report-money
) {
  font-family: var(--bm-font-display);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .bemove-profit-report-number,
  .bemove-profit-report-share,
  .bemove-profit-report-trend-value,
  .bemove-profit-report-section-head > span
) {
  font-family: var(--bm-font-mono);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-number .bemove-profit-report-money {
  font-family: var(--bm-font-mono);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .bemove-profit-title-row h3,
  .bemove-profit-report-notes-head h3
) {
  min-height: 0;
  color: var(--bm-text);
  font-size: 20px;
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .bemove-profit-title-row .btn,
  .bemove-profit-report-notes-foot .btn,
  .bemove-profit-report .btn,
  .bemove-profit-report-month
) {
  min-height: 48px;
  border-radius: var(--bm-radius-control);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-source-summary {
  border-color: var(--bm-border);
  border-left-color: var(--bm-orange-500);
  background: var(--bm-surface-muted);
  color: var(--bm-text);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .bemove-profit-source-copy > span,
  .bemove-profit-source-item small,
  .bemove-profit-source-plus
) {
  color: var(--bm-text-sub);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-source-item > strong {
  font-family: var(--bm-font-mono);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-notes-card {
  border-color: var(--bm-border);
  border-radius: var(--bm-radius-card);
  background: var(--bm-surface);
  color: var(--bm-text);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .bemove-profit-report-notes-head p,
  .bemove-profit-report-note-field small,
  .bemove-profit-report-notes-foot p
) {
  color: var(--bm-text-sub);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-editor-period {
  color: var(--bm-orange-700);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-partial {
  color: var(--bm-orange-300);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-note-field > span {
  color: var(--bm-text);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-note-field textarea {
  border-color: var(--bm-border);
  background: var(--bm-surface);
  color: var(--bm-text);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-note-readonly {
  border-color: var(--bm-border);
  background: var(--bm-surface-muted);
  color: var(--bm-text);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-note-readonly .is-empty {
  color: var(--bm-text-sub);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-note-field textarea::placeholder {
  color: var(--bm-text-sub);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-note-field textarea:focus-visible {
  border-color: var(--bm-orange-500);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-notes-foot {
  border-color: var(--bm-border);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-note-count {
  border-color: var(--bm-amber-500);
  background: var(--bm-amber-100);
  color: #805800;
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-note-count.is-complete {
  border-color: var(--bm-green-500);
  background: var(--bm-green-100);
  color: #1b6b3c;
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-shell {
  background: var(--bm-chalk);
  color: var(--bm-text);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-header {
  border-top-color: var(--bm-orange-500);
  background: var(--bm-charcoal-900);
  color: var(--bm-white);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-header h1 {
  color: var(--bm-white);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-eyebrow {
  color: var(--bm-orange-300);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-header p {
  color: var(--bm-charcoal-300);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-trend-empty {
  color: var(--bm-text-sub);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-header .btn-outline {
  border-color: var(--bm-charcoal-300);
  background: transparent;
  color: var(--bm-white);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-header .btn-outline:hover {
  border-color: var(--bm-orange-400);
  background: rgb(236 102 42 / 16%);
  color: var(--bm-white);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-month-label {
  color: var(--bm-charcoal-300);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-month {
  border-color: var(--bm-charcoal-600);
  background: var(--bm-charcoal-800);
  color: var(--bm-white);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-status.is-warning {
  border-color: var(--bm-amber-500);
  background: var(--bm-amber-100);
  color: #805800;
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-status.is-ready {
  border-color: var(--bm-green-500);
  background: var(--bm-green-100);
  color: #1b6b3c;
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .bemove-profit-report-summary,
  .bemove-profit-report-card,
  .bemove-profit-report-note
) {
  border-color: var(--bm-border);
  background: var(--bm-surface);
  color: var(--bm-text);
  box-shadow: var(--bm-shadow-card);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-label,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-metric-sub,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-section-head p,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-table-row.is-head,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-share,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-note .is-empty {
  color: var(--bm-text-sub);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-metric-value {
  color: var(--bm-text);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-metric.is-strong .bemove-profit-report-metric-value,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-section-head > span {
  color: var(--bm-orange-700);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-section-head {
  border-color: var(--bm-text);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-section-head h2 {
  color: var(--bm-text);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-table-row,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-trend-track {
  border-color: var(--bm-border);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-chip {
  border-color: var(--bm-border);
  background: var(--bm-surface-muted);
  color: var(--bm-text-sub);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-chip.is-warning {
  border-color: var(--bm-amber-500);
  background: var(--bm-amber-100);
  color: #805800;
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-delta.is-positive {
  color: #1b6b3c;
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-delta.is-negative,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-trend-item.is-negative .bemove-profit-report-trend-value {
  color: var(--bm-red-500);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-delta.is-neutral {
  color: var(--bm-text-sub);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-trend-track > span {
  background: var(--bm-orange-500);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-trend-item.is-negative .bemove-profit-report-trend-track > span {
  background: var(--bm-red-500);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-note {
  border-left-color: var(--bm-charcoal-300);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-note.is-filled {
  border-left-color: var(--bm-orange-500);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-note p {
  color: var(--bm-text);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-footer {
  border-color: var(--bm-border);
  background: var(--bm-surface);
  color: var(--bm-text);
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .bemove-profit-report-note-count,
  .bemove-profit-report-status.is-warning,
  .bemove-profit-report-chip.is-warning
) {
  border-color: #b98212;
  background: #3b2b10;
  color: #f8d886;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .bemove-profit-report-note-count.is-complete,
  .bemove-profit-report-status.is-ready
) {
  border-color: #2e9e5b;
  background: #123a28;
  color: #8de0ad;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .bemove-profit-report-delta.is-positive,
  .bemove-profit-report-note-count.is-complete,
  .bemove-profit-report-status.is-ready
) {
  color: #8de0ad;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .bemove-profit-report-delta.is-negative,
  .bemove-profit-report-trend-item.is-negative .bemove-profit-report-trend-value
) {
  color: #ff9b9b;
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .bemove-profit-report-metric.is-strong .bemove-profit-report-metric-value,
  .bemove-profit-report-section-head > span,
  .bemove-profit-report-editor-period,
  .bemove-profit-report-partial
) {
  color: var(--bm-orange-300);
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .bemove-profit-report-notes-foot .btn-outline,
  .bemove-profit-report-footer-actions .btn-outline
) {
  border-color: var(--bm-orange-400);
  background: var(--bm-surface);
  color: var(--bm-orange-300);
}

html:is([data-bemove-theme="dark"], [data-formula-theme="dark"]) body:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
  .bemove-profit-report-notes-foot .btn-outline:hover,
  .bemove-profit-report-footer-actions .btn-outline:hover
) {
  border-color: var(--bm-orange-300);
  background: rgb(236 102 42 / 16%);
  color: var(--bm-orange-300);
}

@media (max-width: 768px) {
  body.mobile-nav-enabled:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
    .bemove-profit-title-row h3,
    .bemove-profit-report-notes-head h3
  ) {
    font-size: 18px;
  }
}

@media print {
  body.fx-profit-report-print-mode:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-shell {
    background: #fff !important;
    color: #141414 !important;
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }
  body.fx-profit-report-print-mode:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
    .bemove-profit-report-summary,
    .bemove-profit-report-card,
    .bemove-profit-report-note
  ) {
    border-color: #d6d6d6 !important;
    background: #fff !important;
    color: #141414 !important;
    box-shadow: none !important;
  }
  body.fx-profit-report-print-mode:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
    .bemove-profit-report-metric-value,
    .bemove-profit-report-section-head h2,
    .bemove-profit-report-note p
  ) {
    color: #141414 !important;
  }
  body.fx-profit-report-print-mode:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
    .bemove-profit-report-label,
    .bemove-profit-report-metric-sub,
    .bemove-profit-report-section-head p,
    .bemove-profit-report-table-row.is-head,
    .bemove-profit-report-share,
    .bemove-profit-report-note .is-empty,
    .bemove-profit-report-trend-empty
  ) {
    color: #6b6b6b !important;
  }
  body.fx-profit-report-print-mode:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-delta.is-positive {
    color: #1b6b3c !important;
  }
  body.fx-profit-report-print-mode:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
    .bemove-profit-report-delta.is-negative,
    .bemove-profit-report-trend-item.is-negative .bemove-profit-report-trend-value
  ) {
    color: var(--bm-red-500) !important;
  }
  body.fx-profit-report-print-mode:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-section-head > span {
    color: var(--bm-orange-700) !important;
  }
  body.fx-profit-report-print-mode:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) .bemove-profit-report-section-head {
    border-color: #141414 !important;
  }
  body.fx-profit-report-print-mode:is([data-app-mode="bemove"], [data-bemove-brand="1"], .bemove-design-theme) :is(
    .bemove-profit-report-table-row,
    .bemove-profit-report-trend-track
  ) {
    border-color: #d6d6d6 !important;
  }
}

/* ------------------------------------------------------------------
   Formula X common trainer payroll — Be:Move visual adapter only
   ------------------------------------------------------------------ */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] {
  --bm-payroll-page: var(--bm-chalk);
  --bm-payroll-card: var(--bm-white);
  --bm-payroll-sunken: var(--bm-charcoal-050);
  --bm-payroll-hover: var(--bm-orange-100);
  --bm-payroll-text: var(--bm-charcoal-700);
  --bm-payroll-strong: var(--bm-charcoal-900);
  --bm-payroll-muted: var(--bm-charcoal-500);
  --bm-payroll-border: var(--border-hairline);
  --bm-payroll-border-strong: var(--border-strong);
  --bm-payroll-accent-soft: var(--bm-orange-100);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-layout,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll {
  min-width: 0;
  color: var(--bm-payroll-text);
  font-family: var(--bm-font-body);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-main {
  min-width: 0;
  min-height: 0;
  overflow: auto;
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll {
  display: grid;
  gap: var(--space-5);
  width: 100%;
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-layout .bemove-trainer-sidebar,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-header,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-section,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-state-card,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-skeleton {
  border: 1px solid var(--bm-payroll-border);
  border-radius: var(--bm-radius-card);
  background: var(--bm-payroll-card);
  box-shadow: var(--bm-shadow-card);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-layout .bemove-trainer-sidebar {
  gap: var(--space-4);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-layout .bemove-trainer-sidebar-summary {
  display: none;
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-layout .bemove-trainer-nav-item {
  min-height: var(--tap-min);
  border: 1px solid transparent;
  border-radius: var(--bm-radius-control);
  background: transparent;
  color: var(--bm-payroll-text);
  font-family: var(--bm-font-body);
  transition: background-color var(--bm-dur-fast) var(--bm-ease-out), border-color var(--bm-dur-fast) var(--bm-ease-out), color var(--bm-dur-fast) var(--bm-ease-out);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-layout .bemove-trainer-nav-item:hover {
  border-color: var(--bm-payroll-border);
  background: var(--bm-payroll-hover);
  color: var(--bm-payroll-strong);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-layout .bemove-trainer-nav-item.active {
  border-color: var(--bm-orange-500);
  background: var(--bm-payroll-accent-soft);
  color: var(--bm-orange-700);
  font-weight: 700;
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-layout .bemove-trainer-nav-icon-asset {
  display: block;
  width: 18px;
  height: 18px;
  background: currentColor;
  -webkit-mask: url("assets/icons/credit-card.svg") center / contain no-repeat;
  mask: url("assets/icons/credit-card.svg") center / contain no-repeat;
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-6);
  padding: var(--space-6) var(--space-7);
  border-top: 3px solid var(--bm-orange-500);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-header-controls {
  display: flex;
  align-items: flex-end;
  gap: var(--space-4);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] :is(.fx-trainer-payroll-header h2, .fx-trainer-payroll-state-card h2) {
  margin: var(--space-1) 0 var(--space-2);
  color: var(--bm-payroll-strong);
  font-family: var(--bm-font-display);
  font-size: var(--text-heading-size);
  font-weight: var(--weight-bold);
  letter-spacing: var(--text-heading-ls);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] :is(.fx-trainer-payroll-header p, .fx-trainer-payroll-state-card p) {
  color: var(--bm-payroll-muted);
  font-size: var(--text-small-size);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-header label {
  display: grid;
  flex: 0 0 160px;
  gap: var(--space-3);
  color: var(--bm-payroll-muted);
  font-size: var(--text-caption-size);
  font-weight: var(--weight-bold);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-header input {
  width: 100%;
  min-height: var(--tap-min);
  border: 1px solid var(--bm-payroll-border-strong);
  border-radius: var(--bm-radius-field);
  background: var(--bm-payroll-card);
  color: var(--bm-payroll-strong);
  font-family: var(--bm-font-mono);
  font-variant-numeric: tabular-nums;
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-scope {
  display: inline-flex;
  align-items: center;
  min-height: var(--tap-min);
  padding: 0 var(--space-4);
  border: 1px solid var(--bm-orange-300);
  border-radius: var(--bm-radius-control);
  background: var(--bm-payroll-accent-soft);
  color: var(--bm-orange-700);
  font-size: var(--text-caption-size);
  font-weight: var(--weight-bold);
  white-space: nowrap;
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] :is(.fx-trainer-payroll-kicker, .fx-trainer-payroll-eyebrow) {
  color: var(--bm-orange-700);
  font-family: var(--bm-font-body);
  font-size: var(--text-label-size);
  font-weight: var(--weight-bold);
  letter-spacing: var(--text-label-ls);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-section {
  min-width: 0;
  padding: var(--space-6);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] :is(.fx-trainer-payroll-section-heading, .fx-trainer-payroll-simulator-head) {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-5);
  margin-bottom: var(--space-4);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] :is(.fx-trainer-payroll-section h3, .fx-trainer-payroll-simulator-head h3, .fx-trainer-payroll-state-inline h3) {
  margin-top: var(--space-1);
  color: var(--bm-payroll-strong);
  font-family: var(--bm-font-display);
  font-size: var(--text-subhead-size);
  font-weight: var(--weight-bold);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-status-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-3) var(--space-4);
  margin-bottom: var(--space-4);
  padding: var(--space-3) var(--space-4);
  border: 1px solid var(--bm-payroll-border);
  border-radius: var(--bm-radius-control);
  background: var(--bm-payroll-sunken);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-status-row.is-complete {
  border-left: 3px solid var(--bm-green-500);
  background: var(--bm-green-100);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-status-row.is-updating {
  border-left: 3px solid var(--bm-amber-500);
  background: var(--bm-amber-100);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-status-row.is-incomplete {
  border-left: 3px solid var(--bm-amber-500);
  background: var(--bm-amber-100);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-status {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: var(--space-1) var(--space-3);
  border: 1px solid var(--bm-payroll-border-strong);
  border-radius: var(--bm-radius-pill);
  color: var(--bm-payroll-strong);
  font-size: var(--text-caption-size);
  font-weight: var(--weight-bold);
  white-space: nowrap;
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-status.is-complete { border-color: var(--bm-green-500); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] :is(.fx-trainer-payroll-status.is-updating, .fx-trainer-payroll-status.is-incomplete) { border-color: var(--bm-amber-500); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] :is(.fx-trainer-payroll-status-copy, .fx-trainer-payroll-resolution) { color: var(--bm-payroll-muted); font-size: var(--text-caption-size); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-resolution { margin-left: auto; font-family: var(--bm-font-mono); }

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-kpi-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: var(--space-4);
  margin-top: var(--space-5);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-kpi-card {
  display: flex;
  min-width: 0;
  min-height: 116px;
  flex-direction: column;
  justify-content: center;
  padding: var(--space-5);
  border: 1px solid var(--bm-payroll-border);
  border-radius: var(--bm-radius-card);
  background: var(--bm-payroll-card);
  box-shadow: var(--bm-shadow-card);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-kpi-card > span {
  color: var(--bm-payroll-muted);
  font-size: var(--text-caption-size);
  font-weight: var(--weight-bold);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-kpi-card strong {
  display: block;
  margin-top: var(--space-3);
  overflow-wrap: anywhere;
  color: var(--bm-payroll-strong);
  font-family: var(--bm-font-mono);
  font-size: var(--text-subhead-size);
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-kpi-card small {
  display: block;
  margin-top: var(--space-2);
  overflow: hidden;
  color: var(--bm-payroll-muted);
  font-size: var(--text-caption-size);
  line-height: var(--text-caption-lh);
  text-overflow: ellipsis;
  white-space: nowrap;
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-kpi-card.is-identity strong {
  font-family: var(--bm-font-display);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-kpi-card.is-primary {
  border-color: var(--bm-orange-300);
  background: var(--bm-payroll-accent-soft);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-kpi-card.is-primary strong {
  color: var(--bm-orange-700);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-results-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-5);
  margin-bottom: var(--space-5);
  padding-bottom: var(--space-4);
  border-bottom: 1px solid var(--bm-payroll-border);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-results-heading h3 {
  margin-top: var(--space-1);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-results-heading p {
  max-width: 80ch;
  margin-top: var(--space-2);
  color: var(--bm-payroll-muted);
  font-size: var(--text-small-size);
  line-height: var(--text-body-lh);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-table-wrap {
  overflow: hidden;
  border: 1px solid var(--bm-payroll-border);
  border-radius: var(--bm-radius-card);
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-table { table-layout: fixed; min-width: 920px; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-table th { padding: var(--space-4); background: var(--bm-payroll-sunken); color: var(--bm-payroll-muted); text-align: left; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-table td { padding: var(--space-4); border-right: 1px solid var(--bm-payroll-border); background: var(--bm-payroll-card); vertical-align: top; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-table td:last-child { border-right: 0; }

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] :is(.fx-trainer-payroll-table strong, .fx-trainer-payroll-mobile-card dd, .fx-trainer-payroll-details dd, .fx-trainer-payroll-result-grid strong, .fx-trainer-payroll-change-list dd) {
  color: var(--bm-payroll-strong);
  font-family: var(--bm-font-mono);
  font-variant-numeric: tabular-nums;
}

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-table strong { display: block; font-size: var(--text-small-size); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-table small { display: block; margin-top: var(--space-2); color: var(--bm-payroll-muted); font-size: var(--text-caption-size); line-height: var(--text-caption-lh); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-secondary-value { margin-top: var(--space-3); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-net { background: var(--bm-payroll-accent-soft); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-net strong { color: var(--bm-orange-700); font-size: var(--text-subhead-size); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-mobile-card { display: none; }

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-details { margin-top: var(--space-4); border-top: 1px solid var(--bm-payroll-border); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-details summary { min-height: var(--tap-min); padding: var(--space-4) var(--space-1) var(--space-3); color: var(--bm-orange-700); font-size: var(--text-eyebrow-size); font-weight: var(--weight-bold); cursor: pointer; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] :is(.fx-trainer-payroll-details dl, .fx-trainer-payroll-change-list) { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-3); margin: var(--space-2) 0 0; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] :is(.fx-trainer-payroll-details dl div, .fx-trainer-payroll-change-list div) { min-width: 0; padding: var(--space-4); border-radius: var(--bm-radius-control); background: var(--bm-payroll-sunken); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] :is(.fx-trainer-payroll-details dt, .fx-trainer-payroll-change-list dt) { color: var(--bm-payroll-muted); font-size: var(--text-caption-size); font-weight: var(--weight-bold); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] :is(.fx-trainer-payroll-details dd, .fx-trainer-payroll-change-list dd) { margin: var(--space-2) 0 0; font-size: var(--text-eyebrow-size); }

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-milestones { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-milestone { min-width: 0; padding: var(--space-4); border: 1px solid var(--bm-payroll-border); border-radius: var(--bm-radius-card); background: var(--bm-payroll-sunken); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-milestone strong { display: block; margin-top: var(--space-3); color: var(--bm-payroll-strong); font-size: var(--text-body-size); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-milestone p { margin-top: var(--space-2); color: var(--bm-payroll-muted); font-size: var(--text-caption-size); line-height: var(--text-small-lh); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-progress { height: 7px; margin-top: var(--space-4); overflow: hidden; border-radius: var(--bm-radius-pill); background: var(--bm-charcoal-200); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-progress span { display: block; height: 100%; border-radius: inherit; background: var(--bm-orange-500); transition: width var(--bm-dur-base) var(--bm-ease-out); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-progress-copy { font-family: var(--bm-font-mono); font-variant-numeric: tabular-nums; }

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] :is(.fx-trainer-payroll-simulator-head p, .fx-trainer-payroll-simulator-locked p, .fx-trainer-payroll-state-inline p) { margin-top: var(--space-2); color: var(--bm-payroll-muted); font-size: var(--text-eyebrow-size); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-simulator-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-field { min-width: 0; padding: var(--space-4); border: 1px solid var(--bm-payroll-border); border-radius: var(--bm-radius-card); background: var(--bm-payroll-sunken); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-field label { display: block; margin-bottom: var(--space-3); color: var(--bm-payroll-strong); font-size: var(--text-eyebrow-size); font-weight: var(--weight-bold); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-field > p { min-height: 18px; margin: var(--space-3) 0 0; color: var(--bm-payroll-muted); font-size: var(--text-caption-size); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-input-unit { display: flex; align-items: center; overflow: hidden; border: 1px solid var(--bm-payroll-border-strong); border-radius: var(--bm-radius-field); background: var(--bm-payroll-card); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-input-unit:focus-within { border-color: var(--bm-orange-500); box-shadow: var(--bm-ring-focus); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-input-unit input { flex: 1; min-width: 0; min-height: var(--tap-min); border: 0; border-radius: 0; background: transparent; color: var(--bm-payroll-strong); box-shadow: none; font-family: var(--bm-font-mono); font-variant-numeric: tabular-nums; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-input-unit span { flex: 0 0 auto; padding: 0 var(--space-4); color: var(--bm-payroll-muted); font-size: var(--text-eyebrow-size); font-weight: var(--weight-bold); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-quick-row { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-3); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-quick-row .btn { min-height: var(--tap-min); padding: var(--space-2) var(--space-4); font-family: var(--bm-font-mono); font-size: var(--text-caption-size); }

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll :is(.btn, button) { min-height: var(--tap-min); font-family: var(--bm-font-body); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-simulator-actions { display: flex; align-items: center; justify-content: flex-end; gap: var(--space-4); margin-top: var(--space-4); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-reset { flex: 0 0 auto; min-height: var(--tap-min); padding: 0 var(--space-3); border: 0; background: transparent; color: var(--bm-payroll-muted); font-size: var(--text-eyebrow-size); font-weight: var(--weight-bold); white-space: nowrap; cursor: pointer; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-simulator-actions .btn-primary { width: auto; min-width: 160px; min-height: var(--tap-min); border-color: var(--bm-orange-500); background: var(--bm-orange-500); color: var(--bm-white); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-simulator-actions .btn-primary:hover { border-color: var(--bm-orange-600); background: var(--bm-orange-600); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-simulator-actions .btn-primary:disabled { opacity: .48; cursor: not-allowed; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-input-error { min-height: 18px; margin-top: var(--space-3); color: var(--bm-red-500); font-size: var(--text-caption-size); text-align: right; }

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-simulation-result { margin-top: var(--space-4); padding: var(--space-4); border: 1px solid var(--bm-orange-500); border-radius: var(--bm-radius-card); background: var(--bm-payroll-accent-soft); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-result-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-result-grid > div { padding: var(--space-4); border-radius: var(--bm-radius-card); background: var(--bm-payroll-card); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-result-grid span { display: block; color: var(--bm-payroll-muted); font-size: var(--text-caption-size); font-weight: var(--weight-bold); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-result-grid strong { display: block; margin-top: var(--space-2); font-size: var(--text-subhead-size); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-result-grid .is-delta strong { color: var(--bm-orange-700); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-simulation-result .fx-trainer-payroll-change-list { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: var(--space-3); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] :is(.fx-trainer-payroll-basis, .fx-trainer-payroll-disclaimer, .fx-trainer-payroll-no-delta) { margin-top: var(--space-3); color: var(--bm-payroll-muted); font-size: var(--text-caption-size); line-height: var(--text-body-lh); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-no-delta { color: var(--bm-payroll-strong); font-weight: 700; }

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] :is(.fx-trainer-payroll-state-inline, .fx-trainer-payroll-state-card, .fx-trainer-payroll-access-denied) { padding: var(--space-7); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-state-inline { margin-top: var(--space-4); border: 1px solid var(--bm-payroll-border); border-radius: var(--bm-radius-card); background: var(--bm-payroll-sunken); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-state-card .btn { margin-top: var(--space-4); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-skeleton { display: grid; gap: var(--space-4); padding: var(--space-6); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-skeleton span { display: block; height: var(--space-10); border-radius: var(--bm-radius-card); background: var(--bm-payroll-sunken); animation: bm-trainer-payroll-pulse 1s var(--bm-ease-out) infinite alternate; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] :is(.fx-trainer-payroll-mobile-open, .fx-trainer-payroll-mobile-close) { display: none; }

body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll :is(button, input, summary):focus-visible {
  outline: 0;
  box-shadow: var(--bm-ring-focus);
}

html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] {
  --bm-payroll-page: var(--bm-charcoal-900);
  --bm-payroll-card: var(--bm-charcoal-850);
  --bm-payroll-sunken: var(--bm-charcoal-800);
  --bm-payroll-hover: var(--bm-charcoal-800);
  --bm-payroll-text: var(--bm-charcoal-300);
  --bm-payroll-strong: var(--bm-charcoal-050);
  --bm-payroll-muted: var(--bm-charcoal-400);
  --bm-payroll-border: var(--bm-charcoal-200);
  --bm-payroll-border-strong: var(--bm-charcoal-600);
  --bm-payroll-accent-soft: var(--bm-charcoal-800);
  color-scheme: dark;
}

html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-kpi-card.is-primary strong {
  color: var(--bm-orange-300);
}

@keyframes bm-trainer-payroll-pulse {
  from { opacity: .55; }
  to { opacity: 1; }
}

@media (max-width: 1180px) {
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-table-wrap { overflow-x: auto; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-details dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-layout .bemove-trainer-sidebar { width: 100%; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-layout .bemove-trainer-nav { width: 100%; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-layout .bemove-trainer-nav-item { width: auto; min-height: var(--tap-min); }
}

@media (max-width: 760px) {
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"].fx-trainer-payroll-modal-open { overflow: hidden; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-layout .bemove-trainer-sidebar { display: none; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-main { padding-top: 0; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll { gap: var(--space-4); }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-header { align-items: stretch; flex-direction: column; gap: var(--space-4); padding: var(--space-5); }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-header-controls { align-items: stretch; flex-direction: column; gap: var(--space-3); }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-header h2 { font-size: var(--text-metric-sm-size); }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-header label { flex-basis: auto; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-scope { align-self: flex-start; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-header input { min-height: var(--tap-min); }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-section { padding: var(--space-4); }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-status-row { align-items: flex-start; flex-direction: column; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-resolution { margin-left: 0; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-table-wrap { display: none; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-mobile-card { display: block; overflow: hidden; border: 1px solid var(--bm-payroll-border); border-radius: var(--bm-radius-card); background: var(--bm-payroll-card); }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-mobile-net { padding: var(--space-5); border-bottom: 1px solid var(--bm-payroll-border); background: var(--bm-payroll-accent-soft); }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-mobile-net span { display: block; color: var(--bm-payroll-muted); font-size: var(--text-caption-size); font-weight: var(--weight-bold); }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-mobile-net strong { display: block; margin-top: var(--space-2); color: var(--bm-orange-700); font-family: var(--bm-font-mono); font-size: var(--text-metric-sm-size); font-variant-numeric: tabular-nums; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-mobile-card dl { margin: 0; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-mobile-card dl div { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); min-height: var(--tap-min); padding: var(--space-3) var(--space-4); border-bottom: 1px solid var(--bm-payroll-border); }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-mobile-card dl div:last-child { border-bottom: 0; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-mobile-card dt { color: var(--bm-payroll-muted); font-size: var(--text-caption-size); }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-mobile-card dd { margin: 0; font-size: var(--text-eyebrow-size); text-align: right; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-details summary { min-height: var(--tap-min); }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] :is(.fx-trainer-payroll-details dl, .fx-trainer-payroll-milestones) { grid-template-columns: 1fr; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-milestone { min-height: 120px; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-mobile-open { display: inline-flex; width: 100%; min-height: var(--tap-min); }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-simulator { display: none; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-simulator.is-mobile-open {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: block;
    overflow-y: auto;
    width: 100vw;
    min-height: 100dvh;
    padding: var(--space-5) var(--space-5) var(--space-13);
    border: 0;
    border-radius: var(--bm-radius-sheet);
    background: var(--bm-payroll-page);
    box-shadow: var(--bm-shadow-sheet);
  }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-mobile-close { display: inline-flex; flex: 0 0 auto; min-width: var(--space-10); min-height: var(--tap-min); padding-inline: var(--space-3); white-space: nowrap; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] :is(.fx-trainer-payroll-simulator-fields, .fx-trainer-payroll-result-grid, .fx-trainer-payroll-simulation-result .fx-trainer-payroll-change-list) { grid-template-columns: 1fr; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-field { padding: var(--space-4); }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] :is(.fx-trainer-payroll-input-unit input, .fx-trainer-payroll-quick-row .btn, .fx-trainer-payroll-reset, .fx-trainer-payroll-simulator-actions .btn-primary) { min-height: var(--tap-min); }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-simulator-actions { position: fixed; right: 0; bottom: 0; left: 0; z-index: 2; margin: 0; padding: var(--space-4) var(--space-5) calc(var(--space-4) + env(safe-area-inset-bottom)); border-top: 1px solid var(--bm-payroll-border); background: var(--bm-payroll-card); }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-simulator-actions .btn-primary { flex: 1; }
}

@media (prefers-reduced-motion: reduce) {
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-progress span,
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="trainer_payroll"] .fx-trainer-payroll-skeleton span {
    transition: none;
    animation: none;
  }
}

/* ------------------------------------------------------------------
   CRM / 출입 패턴 분석
   Claude Design의 CRM 분석 레이아웃을 Be:Move 운영 셸에 맞춘다.
   데이터가 없는 상태도 같은 표면을 유지하되, 수치·원천 상태는 API 응답만
   사용한다. 모든 규칙은 Be:Move 전용 화면 아래에만 적용한다.
   ------------------------------------------------------------------ */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-screen {
  min-height: 100%;
  width: 100%;
  box-sizing: border-box;
  padding: clamp(20px, 3vw, 40px);
  background: var(--bm-chalk);
  color: var(--bm-text);
  font-family: var(--bm-font-body);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-screen :is(button, input, select) {
  font: inherit;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-screen :is(button, input, select):focus-visible {
  outline: 0;
  box-shadow: var(--bm-ring-focus);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-page-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-6);
  width: 100%;
  margin: 0 0 var(--space-6);
  max-width: none;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-eyebrow {
  display: block;
  color: var(--bm-orange-600);
  font-family: var(--bm-font-body);
  font-size: var(--text-caption-size);
  font-weight: var(--weight-bold);
  letter-spacing: .08em;
  line-height: 1.35;
  text-transform: uppercase;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-page-head h1 {
  margin-top: var(--space-2);
  color: var(--bm-text);
  font-family: var(--bm-font-display);
  font-size: clamp(28px, 3vw, 42px);
  line-height: 1.05;
  letter-spacing: .01em;
  text-transform: none;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-page-head p,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-section-head p {
  margin: var(--space-2) 0 0;
  color: var(--bm-text-sub);
  font-size: var(--text-small-size);
  line-height: var(--text-body-lh);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-coverage-note {
  display: block;
  margin-top: var(--space-2);
  color: var(--bm-text-sub);
  font-size: var(--text-caption-size);
  line-height: var(--text-body-lh);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-page-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  flex: 0 0 auto;
  justify-content: flex-end;
  gap: var(--space-3);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-page-actions .btn {
  min-height: var(--tap-min);
  width: auto;
  flex: 0 0 auto;
  white-space: nowrap;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-layout {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  align-items: start;
  gap: var(--space-5);
  width: 100%;
  max-width: none;
  margin: 0;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-side {
  display: grid;
  gap: var(--space-1);
  padding: var(--space-4);
  border: 1px solid var(--bm-border);
  border-radius: var(--bm-radius-card);
  background: var(--bm-surface);
  box-shadow: var(--bm-shadow-card);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-side-title {
  padding: var(--space-2) var(--space-3) var(--space-4);
  color: var(--bm-text);
  font-family: var(--bm-font-display);
  font-size: 20px;
  letter-spacing: .02em;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-side button {
  min-height: var(--tap-min);
  padding: 0 var(--space-3);
  border: 1px solid transparent;
  border-radius: var(--bm-radius-control);
  background: transparent;
  color: var(--bm-text-sub);
  cursor: pointer;
  font-size: var(--text-small-size);
  font-weight: var(--weight-bold);
  text-align: left;
  transition: background var(--bm-dur-fast) var(--bm-ease-standard), color var(--bm-dur-fast) var(--bm-ease-standard);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-side button:hover {
  background: var(--bm-orange-100);
  color: var(--bm-orange-700);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-side button.is-active {
  border-color: var(--bm-orange-300);
  background: var(--bm-orange-100);
  color: var(--bm-orange-700);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-main {
  min-width: 0;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-tabs {
  display: flex;
  gap: var(--space-5);
  min-height: 48px;
  border-bottom: 1px solid var(--bm-border);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-tabs button {
  position: relative;
  min-height: 48px;
  padding: 0 var(--space-1);
  border: 0;
  background: transparent;
  color: var(--bm-text-sub);
  cursor: pointer;
  font-size: var(--text-small-size);
  font-weight: var(--weight-bold);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-tabs button::after {
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  height: 3px;
  background: transparent;
  content: "";
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-tabs button:hover,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-tabs button.is-active { color: var(--bm-orange-700); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-tabs button.is-active::after { background: var(--bm-orange-500); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-quality {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  margin-top: var(--space-5);
  padding: var(--space-4) var(--space-5);
  border: 1px solid var(--bm-green-500);
  border-radius: var(--bm-radius-card);
  background: var(--bm-green-100);
  color: var(--bm-text);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-quality.is-partial {
  border-color: var(--bm-amber-500);
  background: var(--bm-amber-100);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-quality.is-unavailable {
  border-color: var(--bm-red-500);
  background: var(--bm-red-100);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-quality-dot {
  flex: 0 0 auto;
  width: 9px;
  height: 9px;
  margin-top: 6px;
  border-radius: var(--bm-radius-pill);
  background: var(--bm-green-500);
  box-shadow: 0 0 0 4px rgb(46 158 91 / 14%);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-quality.is-partial .bm-access-quality-dot { background: var(--bm-amber-500); box-shadow: 0 0 0 4px rgb(242 176 30 / 16%); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-quality.is-unavailable .bm-access-quality-dot { background: var(--bm-red-500); box-shadow: 0 0 0 4px rgb(217 58 58 / 14%); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-quality strong,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-quality span,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-quality small { display: block; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-quality strong { font-size: var(--text-small-size); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-quality span { margin-top: 2px; color: var(--bm-text-sub); font-size: var(--text-caption-size); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-quality small { margin-top: var(--space-2); color: var(--bm-text-sub); font-size: var(--text-caption-size); line-height: var(--text-body-lh); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-filters {
  display: grid;
  grid-template-columns: repeat(4, minmax(130px, 1fr)) auto;
  align-items: end;
  gap: var(--space-3);
  margin-top: var(--space-5);
  padding: var(--space-4);
  border: 1px solid var(--bm-border);
  border-radius: var(--bm-radius-card);
  background: var(--bm-surface);
  box-shadow: var(--bm-shadow-card);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-field,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-custom-date { min-width: 0; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-field label,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-custom-date label {
  display: block;
  margin-bottom: var(--space-2);
  color: var(--bm-text-sub);
  font-size: var(--text-caption-size);
  font-weight: var(--weight-bold);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-filters :is(select, input) {
  width: 100%;
  min-height: var(--tap-min);
  padding: 0 var(--space-3);
  border: 1px solid var(--bm-border);
  border-radius: var(--bm-radius-control);
  background: var(--bm-surface);
  color: var(--bm-text);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-apply { min-height: var(--tap-min); white-space: nowrap; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-4);
  margin-top: var(--space-5);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-kpi {
  min-width: 0;
  min-height: 138px;
  padding: var(--space-5);
  border: 1px solid var(--bm-border);
  border-radius: var(--bm-radius-card);
  background: var(--bm-surface);
  box-shadow: var(--bm-shadow-card);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-kpi > span,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-kpi > em {
  display: block;
  color: var(--bm-text-sub);
  font-size: var(--text-caption-size);
  font-style: normal;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-kpi strong {
  display: block;
  margin-top: var(--space-4);
  color: var(--bm-text);
  font-family: var(--bm-font-display);
  font-size: clamp(25px, 2.6vw, 36px);
  line-height: 1;
  letter-spacing: .01em;
  overflow-wrap: anywhere;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-kpi strong small { margin-left: var(--space-1); color: var(--bm-orange-600); font-family: var(--bm-font-body); font-size: var(--text-caption-size); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-kpi em { margin-top: var(--space-3); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-kpi.is-peak strong { font-size: clamp(18px, 1.7vw, 26px); line-height: 1.25; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-card,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-detail,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-subcard {
  margin-top: var(--space-5);
  padding: clamp(var(--space-4), 2vw, var(--space-6));
  border: 1px solid var(--bm-border);
  border-radius: var(--bm-radius-card);
  background: var(--bm-surface);
  box-shadow: var(--bm-shadow-card);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-section-head,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-subhead {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-4);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-section-head h2,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-subhead h3 {
  margin-top: var(--space-2);
  color: var(--bm-text);
  font-family: var(--bm-font-display);
  letter-spacing: .01em;
  text-transform: none;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-section-head h2 { font-size: 28px; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-subhead h3 { font-size: 20px; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-section-meta,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-subhead > span {
  flex: 0 0 auto;
  margin-top: var(--space-2);
  color: var(--bm-text-sub);
  font-family: var(--bm-font-mono);
  font-size: var(--text-caption-size);
  font-variant-numeric: tabular-nums;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-heatmap-wrap { overflow-x: auto; margin-top: var(--space-6); padding-bottom: var(--space-2); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-heatmap {
  display: grid;
  min-width: 650px;
  gap: 6px;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-heatmap-corner { min-height: 24px; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-heatmap-hour,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-heatmap-day {
  color: var(--bm-text-sub);
  font-family: var(--bm-font-mono);
  font-size: var(--text-caption-size);
  text-align: center;
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-heatmap-day { align-self: center; font-family: var(--bm-font-body); font-weight: var(--weight-bold); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-heatmap-cell {
  display: grid;
  min-height: 38px;
  place-items: center;
  padding: 0;
  border: 1px solid transparent;
  border-radius: var(--bm-radius-control);
  background: var(--bm-charcoal-050);
  color: var(--bm-text);
  cursor: pointer;
  font-family: var(--bm-font-mono);
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  transition: transform var(--bm-dur-fast) var(--bm-ease-standard), border-color var(--bm-dur-fast) var(--bm-ease-standard);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-heatmap-cell:hover { transform: translateY(-1px); border-color: var(--bm-charcoal-900); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-heatmap-cell.is-selected { border: 2px solid var(--bm-charcoal-900); box-shadow: var(--bm-ring-focus); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-heatmap-cell.level-1 { background: var(--bm-orange-100); color: var(--bm-orange-700); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-heatmap-cell.level-2 { background: var(--bm-orange-200); color: var(--bm-orange-700); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-heatmap-cell.level-3 { background: var(--bm-orange-400); color: var(--bm-white); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-heatmap-cell.level-4 { background: var(--bm-orange-600); color: var(--bm-white); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-legend {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--space-2);
  margin-top: var(--space-3);
  color: var(--bm-text-sub);
  font-size: var(--text-caption-size);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-legend i { width: 14px; height: 14px; border-radius: 2px; background: var(--bm-charcoal-050); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-legend i.level-1 { background: var(--bm-orange-100); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-legend i.level-2 { background: var(--bm-orange-200); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-legend i.level-3 { background: var(--bm-orange-400); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-legend i.level-4 { background: var(--bm-orange-600); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-detail-count { color: var(--bm-orange-700); font-family: var(--bm-font-mono); font-size: var(--text-small-size); font-weight: var(--weight-bold); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-table-scroll { overflow-x: auto; margin-top: var(--space-4); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-table {
  width: 100%;
  min-width: 720px;
  border-collapse: collapse;
  color: var(--bm-text);
  font-size: var(--text-caption-size);
}
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-table :is(th, td) { padding: var(--space-3) var(--space-2); border-bottom: 1px solid var(--bm-border); text-align: left; vertical-align: middle; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-table th { color: var(--bm-text-sub); background: var(--bm-surface-muted); font-weight: var(--weight-bold); white-space: nowrap; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-table tbody tr:hover { background: var(--bm-orange-100); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-mono,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-member-id { font-family: var(--bm-font-mono); font-variant-numeric: tabular-nums; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-member-id { display: block; margin-top: 2px; color: var(--bm-text-sub); font-size: 10px; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-source { display: inline-flex; align-items: center; min-height: 24px; padding: 0 var(--space-2); border-radius: var(--bm-radius-control); background: var(--bm-orange-100); color: var(--bm-orange-700); font-size: 11px; font-weight: var(--weight-bold); white-space: nowrap; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-source.source-broj { background: var(--bm-charcoal-100); color: var(--bm-text); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-bars-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-subcard { margin-top: var(--space-5); padding: var(--space-5); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-bar-row { display: grid; grid-template-columns: 58px minmax(0, 1fr) 44px; align-items: center; gap: var(--space-3); margin-top: var(--space-3); color: var(--bm-text-sub); font-family: var(--bm-font-mono); font-size: 11px; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-bar-row i { display: block; height: 10px; overflow: hidden; border-radius: var(--bm-radius-pill); background: var(--bm-charcoal-100); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-bar-row b { display: block; height: 100%; border-radius: inherit; background: var(--bm-orange-500); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-bar-row strong { color: var(--bm-text); font-weight: 500; text-align: right; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-table-note { margin-top: var(--space-4); color: var(--bm-text-sub); font-family: var(--bm-font-mono); font-size: var(--text-caption-size); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-empty,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-error,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-loading { display: grid; place-items: center; min-height: 220px; padding: var(--space-7); border: 1px dashed var(--bm-border); border-radius: var(--bm-radius-card); text-align: center; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-empty strong,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-error strong,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-loading strong { color: var(--bm-text); font-size: var(--text-body-size); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-empty p,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-error p,
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-loading > span:not(.bm-access-loading-bar) { max-width: 680px; margin: var(--space-2) 0 0; color: var(--bm-text-sub); font-size: var(--text-small-size); line-height: var(--text-body-lh); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-error { border-color: var(--bm-red-500); background: var(--bm-red-100); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-error .btn { margin-top: var(--space-3); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-loading-bar { width: min(280px, 80%); height: 8px; overflow: hidden; border-radius: var(--bm-radius-pill); background: var(--bm-orange-100); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-loading-bar::before { display: block; width: 42%; height: 100%; border-radius: inherit; background: var(--bm-orange-500); content: ""; animation: bm-access-loading 1.1s var(--bm-ease-in-out) infinite; }

html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-quality { background: rgb(46 158 91 / 16%); }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-quality.is-partial { background: rgb(242 176 30 / 16%); }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-quality.is-unavailable,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-error { background: rgb(217 58 58 / 16%); }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-heatmap-cell.level-0 { background: var(--bm-charcoal-800); }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-heatmap-cell.level-1 { background: rgb(236 102 42 / 18%); color: var(--bm-orange-200); }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-heatmap-cell.level-2 { background: rgb(236 102 42 / 34%); color: var(--bm-orange-200); }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-table tbody tr:hover { background: rgb(236 102 42 / 12%); }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-source.source-broj { background: var(--bm-charcoal-800); color: var(--bm-charcoal-300); }

@keyframes bm-access-loading {
  from { transform: translateX(-120%); }
  to { transform: translateX(280%); }
}

@media (max-width: 1080px) {
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-apply { width: 100%; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-screen { padding: var(--space-4); }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-page-head { align-items: stretch; flex-direction: column; gap: var(--space-4); }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-page-actions { justify-content: stretch; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-page-actions .btn { width: auto; flex: 1 1 0; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-layout { grid-template-columns: 1fr; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-side { grid-template-columns: repeat(3, minmax(0, 1fr)); padding: var(--space-2); }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-side-title { grid-column: 1 / -1; padding: var(--space-2) var(--space-3); }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-side button { padding: 0 var(--space-2); font-size: var(--text-caption-size); text-align: center; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-filters { grid-template-columns: 1fr 1fr; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-bars-grid { grid-template-columns: 1fr; gap: 0; }
}
@media (max-width: 480px) {
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-kpis,
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-filters { grid-template-columns: 1fr; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-tabs { gap: var(--space-4); }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-section-head { flex-direction: column; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-section-meta { margin-top: 0; }
}
@media (prefers-reduced-motion: reduce) {
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-screen .bm-access-loading-bar::before { animation: none; }
  body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-access-screen .bm-access-heatmap-cell { transition: none; }
}
/* Be:Move administrator payroll. DTO values stay blank when the source contract is incomplete. */
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) [data-fx-feature="bemove_payroll_admin"],
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin { color: var(--bm-charcoal-900); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin { max-width: 1240px; margin: 0 auto; padding: var(--space-6); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-header { display:flex; justify-content:space-between; gap:var(--space-6); align-items:flex-end; padding:var(--space-6); border-radius:var(--bm-radius-card); background:var(--bm-white); box-shadow:var(--bm-shadow-card); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-kicker { color:var(--bm-orange-600); font:700 18px var(--bm-font-display); letter-spacing:.16em; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin h2 { margin:var(--space-2) 0; font:700 30px var(--bm-font-display); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin p { color:var(--bm-charcoal-500); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-controls { display:flex; align-items:flex-end; gap:var(--space-3); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-controls label { display:grid; gap:var(--space-2); font-size:12px; font-weight:700; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-controls input { min-height:48px; width:130px; padding:0 var(--space-3); border:1px solid var(--bm-charcoal-300); border-radius:var(--bm-radius-control); font:16px var(--bm-font-mono); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-state-line { display:flex; gap:var(--space-4); margin:var(--space-4) 0; padding:var(--space-4); border-left:3px solid var(--bm-orange-500); background:var(--bm-white); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-status, body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-badge { display:inline-flex; align-items:center; min-height:28px; padding:0 var(--space-3); border:1px solid var(--bm-charcoal-300); border-radius:var(--bm-radius-pill); font-size:12px; font-weight:700; white-space:nowrap; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-status.is-complete { border-color:var(--bm-green-500); } body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-status.is-review, body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-status.is-review_required, body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-status.is-incomplete, body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-status.is-data_incomplete, body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-status.is-configuration_missing { border-color:var(--bm-amber-500); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:var(--space-3); margin-bottom:var(--space-4); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-summary > div { padding:var(--space-5); border-radius:var(--bm-radius-card); background:var(--bm-white); box-shadow:var(--bm-shadow-card); } body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-summary small { display:block; color:var(--bm-charcoal-500); } body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-summary strong { display:block; margin-top:var(--space-2); font:700 22px var(--bm-font-mono); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-table-wrap { overflow:auto; background:var(--bm-white); border-radius:var(--bm-radius-card); box-shadow:var(--bm-shadow-card); } body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-table { width:100%; min-width:760px; border-collapse:collapse; } body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-table th, body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-table td { padding:var(--space-4); border-bottom:1px solid var(--bm-charcoal-100); text-align:left; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-link { min-height:40px; padding:0 var(--space-3); border:1px solid var(--bm-charcoal-300); border-radius:var(--bm-radius-control); background:transparent; color:var(--bm-charcoal-900); cursor:pointer; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-actions { display:flex; gap:var(--space-3); justify-content:flex-end; margin-top:var(--space-4); } body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-reasons { margin:var(--space-4) 0; padding:var(--space-4); border:1px solid var(--bm-amber-500); border-radius:var(--bm-radius-card); background:var(--bm-amber-100); }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-detail { position:fixed; inset:0; z-index:50; display:grid; place-items:center; padding:var(--space-5); background:rgba(20,20,20,.6); } body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-detail-card { position:relative; width:min(960px,100%); max-height:90vh; overflow:auto; padding:var(--space-6); border-radius:var(--bm-radius-sheet); background:var(--bm-white); box-shadow:var(--bm-shadow-raised); } body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-close { float:right; min-height:40px; padding:0 var(--space-3); border:1px solid var(--bm-charcoal-300); border-radius:var(--bm-radius-control); background:transparent; }
body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-policy { margin:var(--space-4) 0; padding:var(--space-4); border:1px solid var(--bm-charcoal-200); border-radius:var(--bm-radius-card); background:var(--bm-page); } body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-policy h4 { margin:0 0 var(--space-3); font-size:16px; } body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-policy dl { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-3); margin:0; } body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-policy dt { color:var(--bm-charcoal-500); font-size:12px; } body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-policy dd { margin:var(--space-1) 0 0; font-family:var(--bm-font-mono); }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-policy { background:var(--bm-charcoal-800); border-color:var(--bm-charcoal-600); }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-header, html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-summary > div, html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-table-wrap, html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-detail-card { background:var(--bm-charcoal-800); color:var(--bm-white); }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin p,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-state-line,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-link,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin input,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin select,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin textarea { color:var(--bm-white); }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-state-line,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin input,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin textarea { background:var(--bm-charcoal-800); border-color:var(--bm-charcoal-500); }
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-table th,
html[data-bemove-theme="dark"] body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-table td { border-color:var(--bm-charcoal-600); }
@media (max-width:760px) { body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin { padding:var(--space-4); } body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-header { align-items:stretch; flex-direction:column; } body:is([data-app-mode="bemove"], [data-bemove-brand="1"]) .bm-payroll-admin-summary { grid-template-columns:repeat(2,1fr); } }
