/* rmc-class-grammar.css
 *
 * v2.35 — platform-wide class-grammar completion sweep.
 *
 * Defines all project-prefixed classes that were referenced in templates
 * but never had a CSS rule anywhere in the project. Without this file
 * those references rendered as silent no-ops (empty columns, missing
 * spacing, ghost layouts) — see the `content-max-960` incident.
 *
 * Every rule routes through design-tokens.css. Tenant brand cascade
 * (`--school-primary`, `--brand-gradient`) wins over any value here.
 *
 * Loaded by every shell (portal/marketing/admin/control-plane/studio).
 *
 * Organized by family:
 *   1.  content-max-*          width clamps
 *   2.  cp-*                   control plane surfaces
 *   3.  rmc-*                  platform-wide grammar
 *   4.  setup-studio-*         guided onboarding studio
 *   5.  mkt-*                  marketing surfaces
 *   6.  studio-os-* / studio-* studio_os shell
 *   7.  portal-*               portal kb / support shells
 *   8.  tenant-admin-*         admin index
 *   9.  tenant-studio-*        studio spine
 *  10.  page-*, feature-*, finance-*, report-*, ai-*, dashboard-*, site-settings-*
 */

/* ============================================================ */
/* 1. content-max-*  —  width clamps (Apple HIG editorial measure) */
/* ============================================================ */
.content-max-520  { max-inline-size: min(520px, 100%);  margin-inline: auto; }
.content-max-640  { max-inline-size: min(640px, 100%);  margin-inline: auto; }
.content-max-960  { max-inline-size: min(1440px, 100%); margin-inline: auto; } /* generous — was bug class */
.content-max-1200 { max-inline-size: min(1200px, 100%); margin-inline: auto; }

/* content-measure — the page-aware CENTER cure. One token (`--rmc-measure`) so the
   readable measure is tuned platform-wide, never hardcoded per page. Use ONLY for
   genuinely narrow single forms / settings toggles where full-width is unreadable;
   catalogs and dashboards FILL instead (see .cp-grid / .rmc-page-horizon below). */
.content-measure { max-inline-size: var(--rmc-measure, min(1080px, 100%)); margin-inline: auto; min-width: 0; }

/* cp-form-grid — page-aware FILL cure for operator/config FORMS. Flows fields into
   2–4 responsive columns so a tall single-column form fills the width AND shortens.
   Drop it around a set of .form-field / .mb-3 field rows. */
.cp-form-grid {
  display: grid;
  gap: var(--space-4, 1rem) var(--space-5, 1.25rem);
  grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr));
  align-items: start;
  min-width: 0;
}
/* a field that must span the full row inside a cp-form-grid (textarea, legend, actions) */
.cp-form-grid > .cp-form-grid__full { grid-column: 1 / -1; }

/* ============================================================ */
/* rmc-page-horizon — INTELLIGENT "use the right gutter" layout  */
/* Relocates vertically-stacked content sideways into the empty   */
/* right space so long pages collapse to short, scannable,        */
/* side-by-side ones. Author a page as a primary zone + an aside   */
/* zone; it auto-stacks on narrow screens. Simple to adopt,        */
/* dramatic on wide screens — the width-to-width contract.        */
/* ============================================================ */
.rmc-page-horizon {
  display: grid;
  gap: var(--space-5, 1.25rem);
  align-items: start;
  grid-template-columns: minmax(0, 1fr) minmax(0, var(--rmc-horizon-aside, 340px));
  min-width: 0;
}
.rmc-page-horizon > .rmc-page-horizon__main,
.rmc-page-horizon > .rmc-page-horizon__aside {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-4, 1rem);
}
/* a sticky aside keeps context (summary / actions / preview) in view while the
   primary column scrolls — uses internal scroll, never overflow:hidden (sticky trap). */
.rmc-page-horizon--sticky-aside > .rmc-page-horizon__aside {
  position: sticky;
  top: var(--space-4, 1rem);
}
/* wider aside variant for master-detail catalogs where the detail is the focus */
.rmc-page-horizon--detail { grid-template-columns: minmax(0, var(--rmc-horizon-aside, 340px)) minmax(0, 1fr); }
@media (max-width: 900px) {
  .rmc-page-horizon,
  .rmc-page-horizon--detail { grid-template-columns: 1fr; }
  .rmc-page-horizon--sticky-aside > .rmc-page-horizon__aside { position: static; }
}

/* ============================================================ */
/* 2. cp-*  —  control plane (manager.runmycampus.com)            */
/* ============================================================ */
.cp-page {
  display: flex;
  flex-direction: column;
  gap: var(--space-6, 1.5rem);
  padding: var(--space-6, 1.5rem) var(--space-7, 2rem);
  max-inline-size: min(1440px, 100%);
  margin-inline: auto;
  color: var(--text-primary);
}

.cp-grid {
  display: grid;
  gap: var(--space-5, 1.25rem);
}
.cp-grid-2 { grid-template-columns: repeat(auto-fit, minmax(min(360px, 100%), 1fr)); }
.cp-grid-3 { grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); }

.rmc-page-stack {
  display: flex;
  flex-direction: column;
  gap: var(--space-5, 1.25rem);
  min-width: 0;
}

.rmc-form-stack {
  display: flex;
  flex-direction: column;
  gap: var(--space-4, 1rem);
  min-width: 0;
}

.cp-button {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  min-block-size: 44px;
  padding: 0.625rem 1.125rem;
  border-radius: var(--radius-md, 12px);
  border: 1px solid var(--hairline-strong, rgba(0, 0, 0, 0.14));
  background: var(--surface-elevated, #fff);
  color: var(--text-primary, #1d1d1f);
  font: inherit;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  transition: background 200ms var(--ease-apple, cubic-bezier(0.32, 0.72, 0, 1)),
              border-color 200ms var(--ease-apple, cubic-bezier(0.32, 0.72, 0, 1)),
              transform 150ms var(--ease-apple, cubic-bezier(0.32, 0.72, 0, 1));
}
.cp-button:hover {
  background: var(--surface-canvas, #fffaf0);
  border-color: color-mix(in srgb, var(--school-primary, #4f46e5) 32%, transparent);
}
.cp-button:active { transform: scale(0.98); }
.cp-button:focus-visible {
  outline: 2px solid var(--school-primary, #4f46e5);
  outline-offset: 2px;
}
.cp-button-primary {
  background: var(--brand-gradient, var(--school-primary, #4f46e5));
  color: var(--text-on-brand, #fff);
  border-color: transparent;
}
.cp-button-primary:hover {
  background: var(--brand-gradient, var(--school-primary, #4f46e5));
  filter: brightness(1.05);
  border-color: transparent;
}

.cp-evidence-page {
  display: flex;
  flex-direction: column;
  gap: var(--space-5, 1.25rem);
  padding: var(--space-6, 1.5rem);
  max-inline-size: min(1100px, 100%);
  margin-inline: auto;
  color: var(--text-primary);
}
.cp-evidence-summary,
.cp-evidence-related,
.cp-evidence-advanced {
  padding: var(--space-5, 1.25rem);
  border-radius: var(--radius-lg, 16px);
  background: var(--surface-elevated, #fff);
  border: 1px solid var(--hairline, rgba(0, 0, 0, 0.08));
  box-shadow: var(--elev-1, 0 1px 2px rgba(0, 0, 0, 0.04));
}
.cp-evidence-summary  { background: var(--surface-canvas, #fffaf0); }
.cp-evidence-advanced { background: var(--surface-bg, #fdf9f2); }

.cp-status-badge-,
.cp-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.375em;
  padding: 0.25em 0.625em;
  border-radius: var(--radius-pill, 999px);
  font-size: var(--type-size-micro, 0.72rem);
  font-weight: 500;
  letter-spacing: 0.02em;
  background: color-mix(in srgb, var(--school-primary, #4f46e5) 10%, transparent);
  color: var(--text-secondary);
  border: 1px solid color-mix(in srgb, var(--school-primary, #4f46e5) 20%, transparent);
}

.cp-warning {
  padding: var(--space-4, 1rem) var(--space-5, 1.25rem);
  border-radius: var(--radius-md, 12px);
  background: color-mix(in srgb, #f59e0b 10%, transparent); /* off-token-allow: rgba-decorative */
  border-inline-start: 3px solid #f59e0b;
  color: var(--text-primary);
}

.cp-topbar-actions {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3, 0.75rem);
  margin-inline-start: auto;
}

.cp-sidebar-ultra {
  display: flex;
  flex-direction: column;
  gap: var(--space-2, 0.5rem);
  padding: var(--space-3, 0.75rem);
}

.cp-pin-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  inline-size: 28px;
  block-size: 28px;
  margin-inline-start: auto;
  border-radius: var(--radius-sm, 8px);
  background: transparent;
  border: 0;
  color: var(--text-tertiary);
  cursor: pointer;
  opacity: 0;
  transition: opacity 150ms ease, color 150ms ease, background 150ms ease;
}
.cp-pin-btn:hover {
  background: var(--surface-overlay, rgba(0, 0, 0, 0.04));
  color: var(--text-primary);
}
.cp-pin-pinned {
  color: var(--school-primary, #4f46e5);
  opacity: 1;
}
*:hover > .cp-pin-btn,
.cp-pin-btn:focus-visible { opacity: 1; }

.cp-nav-section-label {
  font-size: var(--type-size-micro, 0.72rem);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-tertiary);
  padding-block: 0.75rem 0.5rem;
  padding-inline: 0.5rem;
}

.cp-card-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-3, 0.75rem);
  padding-block-end: var(--space-3, 0.75rem);
  margin-block-end: var(--space-3, 0.75rem);
  border-block-end: 1px solid var(--hairline);
}

.cp-muted { color: var(--text-tertiary); }

.cp-meta-list {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: var(--type-size-small, 0.875rem);
  color: var(--text-secondary);
}
.cp-meta-list > li {
  display: flex;
  justify-content: space-between;
  gap: var(--space-3, 0.75rem);
}

.cp-health-card-neutral {
  padding: var(--space-5, 1.25rem);
  border-radius: var(--radius-lg, 16px);
  background: var(--surface-canvas, #fffaf0);
  border: 1px solid var(--hairline);
  color: var(--text-secondary);
}

.cp-table-compact {
  font-size: var(--type-size-small, 0.875rem);
}
.cp-table-compact th,
.cp-table-compact td {
  padding: 0.5rem 0.625rem;
  vertical-align: middle;
}

/* ============================================================ */
/* 3. rmc-*  —  platform-wide grammar                            */
/* ============================================================ */

.rmc-page {
  display: flex;
  flex-direction: column;
  gap: var(--space-6, 1.5rem);
  padding: var(--space-6, 1.5rem) var(--space-7, 2rem);
  max-inline-size: min(1440px, 100%);
  margin-inline: auto;
  color: var(--text-primary);
}
.rmc-page__header {
  display: flex;
  flex-direction: column;
  gap: var(--space-2, 0.5rem);
  padding-block-end: var(--space-4, 1rem);
  border-block-end: 1px solid var(--hairline);
}
.rmc-page__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3, 0.75rem);
  margin-block-start: var(--space-3, 0.75rem);
}
.rmc-page--migration-cloud,
.rmc-page--migration-cloud-detail,
.rmc-page--migration-cloud-review {
  background: var(--surface-bg);
}

.rmc-h1 {
  font-size: var(--type-size-display, clamp(2rem, 4.5vw, 3rem));
  font-weight: 600;
  line-height: 1.08;
  letter-spacing: -0.02em;
  margin: 0;
  color: var(--text-primary);
}
.rmc-h2 {
  font-size: var(--type-size-h2, clamp(1.5rem, 3vw, 2rem));
  font-weight: 600;
  line-height: 1.18;
  letter-spacing: -0.012em;
  margin: 0;
  color: var(--text-primary);
}

.rmc-muted { color: var(--text-tertiary); }
.rmc-lede  {
  font-size: var(--type-size-lead, 1.125rem);
  line-height: 1.55;
  color: var(--text-secondary);
  max-inline-size: 64ch;
}
.rmc-meta  {
  font-size: var(--type-size-small, 0.875rem);
  color: var(--text-tertiary);
}

.rmc-card,
.rmc-card-elevated {
  padding: var(--space-5, 1.25rem);
  border-radius: var(--radius-lg, 16px);
  background: var(--surface-elevated, #fff);
  border: 1px solid var(--hairline, rgba(0, 0, 0, 0.08));
  box-shadow: var(--elev-1, 0 1px 2px rgba(0, 0, 0, 0.04));
}
.rmc-card-elevated { box-shadow: var(--elev-2, 0 4px 12px rgba(0, 0, 0, 0.06)); }
.rmc-card-soft {
  padding: var(--space-4, 1rem);
  border-radius: var(--radius-lg, 16px);
  background: var(--surface-bg, var(--surface-elevated, #fff));
  border: 1px solid var(--hairline, rgba(0, 0, 0, 0.06));
}

/* Wave v2.76 (2026-05-16) — integrations hub primitives. */
.rmc-alert {
  display: flex;
  gap: 0.625rem;
  padding: 0.75rem 1rem;
  border-radius: var(--radius-md, 12px);
  background: var(--surface-popover, var(--surface-elevated, #fff));
  border: 1px solid var(--hairline, rgba(0, 0, 0, 0.08));
  color: var(--text-primary);
}
.rmc-integration-mark {
  inline-size: 40px;
  block-size: 40px;
  border-radius: var(--radius-md, 12px);
  background: var(--rmc-brand-bg, var(--surface-elevated, #f4f4f5));
  border: 1px solid var(--hairline, rgba(0, 0, 0, 0.08));
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 60% 60%;
  color: #fff; /* off-token-allow: hex-literal-decorative */ /* glyph fill via currentColor; safe contrast on every brand tile */
}
/* v2.79: inner SVG glyph (sourced from static/sprites/integrations.svg) */
.rmc-integration-mark__glyph {
  inline-size: 60%;
  block-size: 60%;
  fill: currentColor;
  pointer-events: none;
}
/* Per-connector brand color tokens — CSP-clean (no inline styles). */
.rmc-integration-mark--zoom                  { --rmc-brand-bg: #2D8CFF; }
.rmc-integration-mark--microsoft_teams       { --rmc-brand-bg: #464EB8; }
.rmc-integration-mark--microsoft_teams_chat  { --rmc-brand-bg: #464EB8; }
.rmc-integration-mark--google_meet           { --rmc-brand-bg: #00897B; }
.rmc-integration-mark--webex                 { --rmc-brand-bg: #00BCEB; }
.rmc-integration-mark--google_calendar       { --rmc-brand-bg: #4285F4; }
.rmc-integration-mark--outlook_calendar      { --rmc-brand-bg: #0078D4; }
.rmc-integration-mark--gmail                 { --rmc-brand-bg: #EA4335; }
.rmc-integration-mark--outlook_mail          { --rmc-brand-bg: #0078D4; }
.rmc-integration-mark--mailgun               { --rmc-brand-bg: #F06B66; }
.rmc-integration-mark--sendgrid              { --rmc-brand-bg: #1A82E2; }
.rmc-integration-mark--postmark              { --rmc-brand-bg: #FFDE00; }
.rmc-integration-mark--amazon_ses            { --rmc-brand-bg: #FF9900; }
.rmc-integration-mark--sparkpost             { --rmc-brand-bg: #FA6423; }
.rmc-integration-mark--brevo                 { --rmc-brand-bg: #0B996E; }
.rmc-integration-mark--mandrill              { --rmc-brand-bg: #FFE01B; }
.rmc-integration-mark--mailersend            { --rmc-brand-bg: #3457D5; }
.rmc-integration-mark--mailjet               { --rmc-brand-bg: #FEAD0E; }
.rmc-integration-mark--resend                { --rmc-brand-bg: #1D1D1F; }
.rmc-integration-mark--smtp_generic          { --rmc-brand-bg: #54595F; }
.rmc-integration-mark--slack                 { --rmc-brand-bg: #4A154B; }
.rmc-integration-mark--discord               { --rmc-brand-bg: #5865F2; }
.rmc-integration-mark--whatsapp              { --rmc-brand-bg: #25D366; }
.rmc-integration-mark--push                  { --rmc-brand-bg: #6E6E73; }
.rmc-integration-mark--sms                   { --rmc-brand-bg: #34C759; }
.rmc-integration-mark--stripe                { --rmc-brand-bg: #635BFF; }
.rmc-integration-mark--badges                { --rmc-brand-bg: #FF6F00; }
.rmc-integration-mark--lms                   { --rmc-brand-bg: #F77000; }

.rmc-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  min-block-size: 44px;
  padding: 0.625rem 1.125rem;
  border-radius: var(--radius-md, 12px);
  background: var(--surface-elevated);
  border: 1px solid var(--hairline-strong);
  color: var(--text-primary);
  font: inherit;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  transition: background 200ms var(--ease-apple), border-color 200ms var(--ease-apple), transform 150ms var(--ease-apple);
}
.rmc-btn:hover  { background: var(--surface-canvas); }
.rmc-btn:active { transform: scale(0.98); }
.rmc-btn:focus-visible {
  outline: 2px solid var(--school-primary, #4f46e5);
  outline-offset: 2px;
}
.rmc-btn--primary {
  background: var(--brand-gradient, var(--school-primary, #4f46e5));
  color: var(--text-on-brand, #fff);
  border-color: transparent;
}
.rmc-btn--ghost {
  background: transparent;
  border-color: var(--hairline);
  color: var(--text-secondary);
}
.rmc-btn--sm {
  min-block-size: 32px;
  padding: 0.375rem 0.75rem;
  font-size: var(--type-size-small, 0.875rem);
}

.rmc-pill,
.rmc-pill-- {
  display: inline-flex;
  align-items: center;
  gap: 0.375em;
  padding: 0.25em 0.75em;
  border-radius: var(--radius-pill, 999px);
  background: color-mix(in srgb, var(--school-primary, #4f46e5) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--school-primary, #4f46e5) 18%, transparent);
  font-size: var(--type-size-micro, 0.72rem);
  font-weight: 500;
  color: var(--text-secondary);
}

.rmc-kv {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 0.5rem 1rem;
  font-size: var(--type-size-small, 0.875rem);
}
.rmc-kv > dt { color: var(--text-tertiary); font-weight: 500; }
.rmc-kv > dd { color: var(--text-primary); margin: 0; }

.rmc-back {
  display: inline-flex;
  align-items: center;
  gap: 0.375em;
  font-size: var(--type-size-small, 0.875rem);
  color: var(--text-tertiary);
  text-decoration: none;
}
.rmc-back:hover { color: var(--text-primary); }

.rmc-button-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3, 0.75rem);
  margin-block-start: var(--space-4, 1rem);
}

.rmc-shell-footer {
  padding: var(--space-5, 1.25rem) var(--space-7, 2rem);
  margin-block-start: auto;
  border-block-start: 1px solid var(--hairline);
  color: var(--text-tertiary);
  font-size: var(--type-size-small, 0.875rem);
}

.rmc-avatar--36 {
  inline-size: 36px;
  block-size: 36px;
  flex: 0 0 36px;
}

.rmc-acx-glass-panel__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-5, 1.25rem) var(--space-5, 1.25rem) var(--space-4, 1rem);
  border-block-end: 1px solid var(--hairline);
}

.rmc-skeleton-block {
  display: block;
  inline-size: 100%;
  block-size: 1em;
  background: linear-gradient(90deg,
    var(--surface-canvas, #fdf9f2) 0%,
    var(--surface-bg, #ebebef)    50%,
    var(--surface-canvas, #fdf9f2) 100%);
  background-size: 200% 100%;
  border-radius: var(--radius-sm, 8px);
  animation: rmc-skeleton-shimmer 1.4s ease-in-out infinite;
}
@keyframes rmc-skeleton-shimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}
@media (prefers-reduced-motion: reduce) {
  .rmc-skeleton-block { animation: none; opacity: 0.65; }
}

.rmc-check-- {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  inline-size: 1.25em;
  block-size: 1.25em;
  border-radius: 999px;
  background: var(--school-accent, #10b981);
  color: #fff; /* off-token-allow: hex-literal-decorative */
}

.rmc-section-nav--horizontal {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3, 0.75rem);
  padding-block: var(--space-3, 0.75rem);
  border-block-end: 1px solid var(--hairline);
}

.rmc-conversion-more-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2, 0.5rem);
  margin-block-start: var(--space-3, 0.75rem);
}

.rmc-next-action-strip--fallback {
  padding: var(--space-4, 1rem);
  background: var(--surface-canvas);
  border-radius: var(--radius-md, 12px);
  border: 1px dashed var(--hairline);
  color: var(--text-tertiary);
  text-align: center;
}

.rmc-page-hero {
  display: flex;
  flex-direction: column;
  gap: var(--space-3, 0.75rem);
  padding-block: var(--space-5, 1.25rem) var(--space-6, 1.5rem);
}
.rmc-page-hero__breadcrumb {
  font-size: var(--type-size-small, 0.875rem);
  color: var(--text-tertiary);
}
.rmc-page-hero__head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-4, 1rem);
}
.rmc-page-hero__intro { flex: 1 1 auto; min-inline-size: 0; }
.rmc-page-hero__title {
  font-size: var(--type-size-h1, clamp(1.75rem, 3.6vw, 2.5rem));
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.1;
  margin: 0;
  color: var(--text-primary);
}
.rmc-page-hero__subtitle {
  margin: 0.375rem 0 0;
  color: var(--text-secondary);
  font-size: var(--type-size-lead, 1.125rem);
  line-height: 1.5;
  max-inline-size: 64ch;
}
.rmc-page-hero__actions {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3, 0.75rem);
  flex: 0 0 auto;
}

.rmc-os-page-header__context {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3, 0.75rem);
  margin-block-start: 0.375rem;
  font-size: var(--type-size-small, 0.875rem);
  color: var(--text-tertiary);
}
.rmc-os-page-header--operational-center {
  background: var(--surface-canvas);
  border-radius: var(--radius-lg, 16px);
  padding: var(--space-5, 1.25rem);
}
.rmc-os-action-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-3, 0.75rem) var(--space-4, 1rem);
  background: var(--surface-canvas);
  border-radius: var(--radius-md, 12px);
  border: 1px solid var(--hairline);
}
.rmc-os-context-rail__inner {
  display: flex;
  flex-direction: column;
  gap: var(--space-4, 1rem);
  padding: var(--space-4, 1rem);
}

.rmc-metric-ticker__card,
.rmc-metric-ticker__card-- {
  padding: var(--space-4, 1rem);
  border-radius: var(--radius-md, 12px);
  background: var(--surface-elevated);
  border: 1px solid var(--hairline);
  min-inline-size: 160px;
  flex: 0 0 auto;
}

.rmc-data-table--migrations {
  inline-size: 100%;
  border-collapse: separate;
  border-spacing: 0;
}
.rmc-data-table--migrations th,
.rmc-data-table--migrations td {
  padding: 0.625rem 0.875rem;
  text-align: start;
  border-block-end: 1px solid var(--hairline);
}
.rmc-data-table--migrations th {
  font-size: var(--type-size-micro, 0.72rem);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-tertiary);
  background: var(--surface-canvas);
}

.rmc-mapping {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-3, 0.75rem) 0;
  border-block-end: 1px solid var(--hairline);
}
.rmc-mapping__canonical {
  font-weight: 500;
  color: var(--text-primary);
}

.rmc-collapsible {
  border: 1px solid var(--hairline);
  border-radius: var(--radius-md, 12px);
  padding: var(--space-3, 0.75rem) var(--space-4, 1rem);
  background: var(--surface-canvas);
}

.rmc-photo-capture {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--space-3, 0.75rem);
}
.rmc-photo-capture__input {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.rmc-photo-capture__trigger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5em;
  min-block-size: 44px;
  padding: 0.625rem 1.25rem;
  border-radius: var(--radius-md, 12px);
  background: var(--brand-gradient, var(--school-primary, #4f46e5));
  color: var(--text-on-brand, #fff);
  border: 0;
  font: inherit;
  font-weight: 500;
  cursor: pointer;
}
.rmc-photo-capture__fallback {
  padding: var(--space-3, 0.75rem) var(--space-4, 1rem);
  border-radius: var(--radius-md, 12px);
  background: var(--surface-canvas);
  border: 1px dashed var(--hairline-strong);
  color: var(--text-tertiary);
  font-size: var(--type-size-small, 0.875rem);
}

.rmc-task-scope {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-3, 0.75rem) var(--space-4, 1rem);
  border-radius: var(--radius-md, 12px);
  background: var(--surface-canvas);
  border: 1px solid var(--hairline);
  font-size: var(--type-size-small, 0.875rem);
  color: var(--text-secondary);
  margin-block-end: var(--space-4, 1rem);
}

.rmc-compliance-export-families-anchor { scroll-margin-block-start: 96px; }
.rmc-rollback-graph-mount {
  display: block;
  min-block-size: 240px;
  border-radius: var(--radius-md, 12px);
  background: var(--surface-canvas);
  border: 1px solid var(--hairline);
}

/* rmc-illustration--* — currentColor SVG line art (tenant re-tint friendly) */
.rmc-illustration--connection-lost,
.rmc-illustration--first-run,
.rmc-illustration--inbox,
.rmc-illustration--no-data,
.rmc-illustration--no-results,
.rmc-illustration--permission {
  display: block;
  inline-size: 100%;
  max-inline-size: 240px;
  block-size: auto;
  margin-inline: auto;
  color: var(--rmc-illustration-accent, var(--school-primary, #4f46e5));
}

/* ============================================================ */
/* 4. setup-studio-*  —  guided onboarding studio                */
/* ============================================================ */

.setup-studio-launch,
.setup-studio-hero {
  display: flex;
  flex-direction: column;
  gap: var(--space-4, 1rem);
  padding: var(--space-6, 1.5rem) var(--space-7, 2rem);
  border-radius: var(--radius-xl, 20px);
  background: var(--surface-canvas);
  border: 1px solid var(--hairline);
}
.setup-studio-eyebrow {
  font-size: var(--type-size-micro, 0.72rem);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--school-primary);
}
.setup-studio-title {
  font-size: var(--type-size-h1, clamp(1.75rem, 3.6vw, 2.5rem));
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: -0.02em;
  margin: 0;
  color: var(--text-primary);
}
.setup-studio-subtitle {
  font-size: var(--type-size-lead, 1.125rem);
  line-height: 1.55;
  color: var(--text-secondary);
  margin: 0;
  max-inline-size: 64ch;
}
.setup-studio-muted     { color: var(--text-tertiary); }
.setup-studio-mini-title{
  font-size: var(--type-size-small, 0.875rem);
  font-weight: 600;
  color: var(--text-secondary);
  margin: 0 0 0.25rem;
}
.setup-studio-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3, 0.75rem);
}
.setup-studio-blocker {
  padding: var(--space-3, 0.75rem) var(--space-4, 1rem);
  border-radius: var(--radius-md, 12px);
  background: color-mix(in srgb, #f59e0b 12%, transparent); /* off-token-allow: rgba-decorative */
  border-inline-start: 3px solid #f59e0b;
  color: var(--text-primary);
  font-size: var(--type-size-small, 0.875rem);
}

.setup-studio-summary-strip {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-4, 1rem) 0;
}
.setup-studio-summary-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  padding: 0.375rem 0.875rem;
  border-radius: var(--radius-pill, 999px);
  background: var(--surface-elevated);
  border: 1px solid var(--hairline);
  font-size: var(--type-size-small, 0.875rem);
  color: var(--text-secondary);
}

.setup-studio-health {
  display: flex;
  flex-direction: column;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-5, 1.25rem);
  border-radius: var(--radius-lg, 16px);
  background: var(--surface-elevated);
  border: 1px solid var(--hairline);
}
.setup-studio-health-top { display: flex; align-items: center; gap: var(--space-3, 0.75rem); }
.setup-studio-health-ring {
  inline-size: 64px;
  block-size: 64px;
  border-radius: 999px;
  background: conic-gradient(var(--school-primary, #4f46e5) calc(var(--ring, 0) * 1%), var(--surface-bg) 0);
  display: grid;
  place-items: center;
}
.setup-studio-ai-coach {
  padding: var(--space-4, 1rem);
  border-radius: var(--radius-md, 12px);
  background: color-mix(in srgb, var(--school-primary, #4f46e5) 6%, transparent);
  border: 1px solid color-mix(in srgb, var(--school-primary, #4f46e5) 18%, transparent);
  color: var(--text-secondary);
  font-size: var(--type-size-small, 0.875rem);
}

.setup-studio-panel {
  padding: var(--space-5, 1.25rem);
  border-radius: var(--radius-lg, 16px);
  background: var(--surface-elevated);
  border: 1px solid var(--hairline);
  box-shadow: var(--elev-1);
}

.setup-studio-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 320px);
  gap: var(--space-5, 1.25rem);
}
@media (max-width: 960px) { .setup-studio-grid { grid-template-columns: 1fr; } }
.setup-studio-center { min-inline-size: 0; }
.setup-studio-rail   { min-inline-size: 0; display: flex; flex-direction: column; gap: var(--space-4, 1rem); }

.setup-studio-section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-3, 0.75rem);
  margin-block: var(--space-4, 1rem) var(--space-3, 0.75rem);
}

.setup-studio-step-list { display: flex; flex-direction: column; gap: var(--space-3, 0.75rem); margin: 0; padding: 0; list-style: none; }
.setup-studio-step {
  display: grid;
  grid-template-columns: 36px 1fr auto;
  align-items: center;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-4, 1rem);
  border-radius: var(--radius-md, 12px);
  background: var(--surface-elevated);
  border: 1px solid var(--hairline);
}
.setup-studio-step-order {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  inline-size: 32px;
  block-size: 32px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--school-primary, #4f46e5) 12%, transparent);
  color: var(--school-primary, #4f46e5);
  font-weight: 600;
  font-size: var(--type-size-small, 0.875rem);
}

.setup-studio-list,
.setup-studio-bullet-list { margin: 0; padding-inline-start: 1.25rem; color: var(--text-secondary); }
.setup-studio-list > li, .setup-studio-bullet-list > li { margin-block: 0.25rem; }

.setup-studio-checklist-item {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-3, 0.75rem);
  border-radius: var(--radius-md, 12px);
  background: var(--surface-canvas);
  border: 1px solid var(--hairline);
}

.setup-studio-recommendation {
  padding: var(--space-4, 1rem);
  border-radius: var(--radius-md, 12px);
  background: color-mix(in srgb, var(--school-accent, #10b981) 8%, transparent);
  border: 1px solid color-mix(in srgb, var(--school-accent, #10b981) 22%, transparent);
  color: var(--text-secondary);
}

.setup-studio-preview {
  padding: var(--space-5, 1.25rem);
  border-radius: var(--radius-lg, 16px);
  background: var(--surface-canvas);
  border: 1px solid var(--hairline);
}
.setup-studio-role-preview { padding: var(--space-3, 0.75rem) 0; }

.setup-studio-inline-list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2, 0.5rem);
  margin: 0;
  padding: 0;
  list-style: none;
}
.setup-studio-inline-list-item {
  padding: 0.25rem 0.75rem;
  border-radius: var(--radius-pill, 999px);
  background: var(--surface-elevated);
  border: 1px solid var(--hairline);
  font-size: var(--type-size-small, 0.875rem);
  color: var(--text-secondary);
}

/* ============================================================ */
/* 5. mkt-*  —  marketing surfaces                               */
/* ============================================================ */

.mkt-brand-mark {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--text-primary);
  text-decoration: none;
}

.marketing-hub-strip,
.mkt-resources-hub-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
  gap: var(--space-5, 1.25rem);
  padding-block: var(--space-6, 1.5rem);
}

.mkt-footer-legal {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3, 0.75rem);
  padding-block-start: var(--space-4, 1rem);
  margin-block-start: var(--space-5, 1.25rem);
  border-block-start: 1px solid var(--hairline);
  font-size: var(--type-size-small, 0.875rem);
  color: var(--text-tertiary);
}
.mkt-footer-legal-links {
  display: inline-flex;
  flex-wrap: wrap;
  gap: var(--space-3, 0.75rem);
}

.mkt-inst-audience-callout {
  padding: var(--space-5, 1.25rem) var(--space-6, 1.5rem);
  border-radius: var(--radius-lg, 16px);
  background: var(--surface-canvas);
  border-inline-start: 3px solid var(--school-primary, #4f46e5);
  color: var(--text-secondary);
}
.mkt-inst-audience-callout--international { border-inline-start-color: #0ea5e9; /* off-token-allow: hex-literal-decorative */ }
.mkt-inst-audience-callout--multicampus   { border-inline-start-color: #8b5cf6; /* off-token-allow: hex-literal-decorative */ }
.mkt-inst-audience-callout--faith         { border-inline-start-color: #f59e0b; /* off-token-allow: hex-literal-decorative */ }
.mkt-inst-audience-callout--private       { border-inline-start-color: #c47f1c; /* off-token-allow: hex-literal-decorative */ }
.mkt-inst-audience-callout--networks      { border-inline-start-color: #10b981; /* off-token-allow: hex-literal-decorative */ }
.mkt-inst-audience-callout--k12           { border-inline-start-color: #ef4444; /* off-token-allow: hex-literal-decorative */ }

.mkt-inst-stock,
.mkt-premium-stock {
  display: block;
  inline-size: 100%;
  block-size: auto;
  border-radius: var(--radius-lg, 16px);
  object-fit: cover;
  aspect-ratio: 16 / 10;
}
.mkt-inst-problem,
.mkt-premium-problem {
  padding: var(--space-5, 1.25rem) var(--space-6, 1.5rem);
  border-radius: var(--radius-lg, 16px);
  background: color-mix(in srgb, #ef4444 6%, transparent); /* off-token-allow: rgba-decorative */
  border-inline-start: 3px solid #ef4444;
  color: var(--text-secondary);
}
.mkt-inst-module-card__title {
  font-size: var(--type-size-h3, 1.25rem);
  font-weight: 600;
  letter-spacing: -0.01em;
  margin: 0 0 0.5rem;
  color: var(--text-primary);
}

.mkt-product-hero-copy {
  display: flex;
  flex-direction: column;
  gap: var(--space-3, 0.75rem);
  max-inline-size: 64ch;
}
.mkt-product-migration-visual {
  display: block;
  inline-size: 100%;
  border-radius: var(--radius-lg, 16px);
  background: var(--surface-canvas);
  padding: var(--space-5, 1.25rem);
  border: 1px solid var(--hairline);
}

.mkt-trust-glob-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(140px, 100%), 1fr));
  gap: var(--space-4, 1rem);
  padding-block: var(--space-5, 1.25rem);
  align-items: center;
  justify-items: center;
}
.mkt-pain-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
  gap: var(--space-5, 1.25rem);
}
.mkt-numbers-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(160px, 100%), 1fr));
  gap: var(--space-5, 1.25rem);
  padding-block: var(--space-6, 1.5rem);
  text-align: center;
}
.mkt-stat-value {
  font-size: clamp(2rem, 4.5vw, 3rem);
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--text-primary);
  line-height: 1.05;
}
.mkt-stat-label {
  font-size: var(--type-size-small, 0.875rem);
  color: var(--text-tertiary);
  margin-block-start: 0.375rem;
}
.mkt-workflow-nodes {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr));
  gap: var(--space-4, 1rem);
}
.mkt-illustration-globe {
  display: block;
  inline-size: 100%;
  max-inline-size: 480px;
  block-size: auto;
  margin-inline: auto;
  color: var(--school-primary, #4f46e5);
}
.mkt-customer-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-3, 0.75rem);
  filter: grayscale(1) opacity(0.7);
  transition: filter 200ms var(--ease-apple);
}
.mkt-customer-logo:hover { filter: grayscale(0) opacity(1); }
.mkt-customer-logo-img {
  max-inline-size: 100%;
  max-block-size: 40px;
  block-size: auto;
}

/* editorial v2 hero sections */
.mkt-edt-roi,
.mkt-edt-lens,
.mkt-edt-testimonial,
.mkt-edt-voices,
.mkt-edt-walkthrough,
.mkt-edt-switching,
.mkt-edt-compare {
  padding-block: var(--space-7, 2rem) var(--space-8, 2.5rem);
}
.mkt-edt-compare__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-5, 1.25rem);
  padding: var(--space-5, 1.25rem);
  border-radius: var(--radius-lg, 16px);
  background: var(--surface-canvas);
  border: 1px solid var(--hairline);
}
@media (max-width: 720px) { .mkt-edt-compare__inner { grid-template-columns: 1fr; } }

/* ============================================================ */
/* 6. studio-os-* / studio-*  —  studio_os shell                 */
/* ============================================================ */

.studio-os-cp-wrap,
.studio-os__experience-wrap,
.studio-os__automation-wrap,
.studio-os__control-wrap,
.studio-os__launch-wrap,
.studio-os__output-wrap {
  display: flex;
  flex-direction: column;
  gap: var(--space-5, 1.25rem);
  padding: var(--space-5, 1.25rem);
}

.studio-os__automation-overview,
.studio-os__launch-overview,
.studio-os__launch-role-preview {
  padding: var(--space-5, 1.25rem);
  border-radius: var(--radius-lg, 16px);
  background: var(--surface-canvas);
  border: 1px solid var(--hairline);
}

.studio-os__control-in-shell {
  padding: var(--space-5, 1.25rem);
  border-radius: var(--radius-lg, 16px);
  background: var(--surface-elevated);
  border: 1px solid var(--hairline);
}
.studio-os__control-native-fallback,
.studio-os__output-native-fallback {
  padding: var(--space-4, 1rem);
  border-radius: var(--radius-md, 12px);
  background: var(--surface-canvas);
  border: 1px dashed var(--hairline-strong);
  color: var(--text-tertiary);
  font-size: var(--type-size-small, 0.875rem);
}

.studio-output-native-pane,
.studio-output-native-documents {
  padding: var(--space-5, 1.25rem);
  background: var(--surface-canvas);
  border-radius: var(--radius-md, 12px);
  border: 1px solid var(--hairline);
}

.studio-os-loading-state {
  display: flex;
  flex-direction: column;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-5, 1.25rem);
}
.studio-os-skeleton {
  block-size: 1em;
  inline-size: 100%;
  background: linear-gradient(90deg,
    var(--surface-canvas) 0%,
    var(--surface-bg)     50%,
    var(--surface-canvas) 100%);
  background-size: 200% 100%;
  border-radius: var(--radius-sm, 8px);
  animation: rmc-skeleton-shimmer 1.4s ease-in-out infinite;
}
.studio-os-empty-icon {
  display: block;
  inline-size: 48px;
  block-size: 48px;
  margin-inline: auto;
  color: var(--text-tertiary);
}
.studio-os-empty-action { display: inline-flex; margin-block-start: var(--space-3, 0.75rem); }
.studio-os-topbar-actions {
  display: inline-flex;
  flex-wrap: wrap;
  gap: var(--space-2, 0.5rem);
  margin-inline-start: auto;
}

/* ============================================================ */
/* 7. portal-*  —  portal kb / support shells                    */
/* ============================================================ */

.portal-kb-home-read-shell,
.portal-kb-category-read-shell,
.portal-kb-article-read-shell,
.portal-kb-search-read-shell,
.portal-support-request-read-shell,
.portal-support-ticket-read-shell,
.portal-student-homework-read-shell,
.portal-student-homework-detail-read-shell {
  max-inline-size: min(960px, 100%);
  margin-inline: auto;
  padding: var(--space-6, 1.5rem) var(--space-5, 1.25rem);
  color: var(--text-primary);
  line-height: 1.65;
  font-size: var(--type-size-body, 1rem);
}
.portal-kb-article-read-shell { max-inline-size: min(760px, 100%); }

/* ============================================================ */
/* 8. tenant-admin-*  —  admin index (per-tenant Django admin)   */
/* ============================================================ */

.tenant-admin-index {
  display: flex;
  flex-direction: column;
  gap: var(--space-6, 1.5rem);
  padding: var(--space-6, 1.5rem) var(--space-7, 2rem);
  max-inline-size: none;
  width: 100%;
  margin-inline: 0;
  min-height: 0;
}
.tenant-admin-hero {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-4, 1rem);
  padding: var(--space-6, 1.5rem) var(--space-7, 2rem);
  border-radius: var(--radius-xl, 20px);
  background: var(--surface-canvas);
  border: 1px solid var(--hairline);
}
.tenant-admin-hero-label {
  font-size: var(--type-size-micro, 0.72rem);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--school-primary);
}
.tenant-admin-hero-actions {
  display: inline-flex;
  flex-wrap: wrap;
  gap: var(--space-3, 0.75rem);
}
.tenant-admin-cta-primary {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  min-block-size: 44px;
  padding: 0.625rem 1.25rem;
  border-radius: var(--radius-md, 12px);
  background: var(--brand-gradient, var(--school-primary));
  color: var(--text-on-brand, #fff);
  border: 0;
  font-weight: 500;
  text-decoration: none;
}
.tenant-admin-cta-secondary {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  min-block-size: 44px;
  padding: 0.625rem 1.25rem;
  border-radius: var(--radius-md, 12px);
  background: var(--surface-elevated);
  color: var(--text-primary);
  border: 1px solid var(--hairline-strong);
  font-weight: 500;
  text-decoration: none;
}
.tenant-admin-section-title {
  font-size: var(--type-size-h3, 1.25rem);
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--text-primary);
  margin: 0;
}
.tenant-admin-app-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
  gap: var(--space-4, 1rem);
}

/* ============================================================ */
/* 9. tenant-studio-*  —  studio spine product strip             */
/* ============================================================ */

.tenant-studio-spine {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-3, 0.75rem) var(--space-5, 1.25rem);
  background: var(--surface-canvas);
  border-block-end: 1px solid var(--hairline);
  font-size: var(--type-size-small, 0.875rem);
}
.tenant-studio-spine__label {
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: var(--type-size-micro, 0.72rem);
  color: var(--text-tertiary);
}

/* ============================================================ */
/* 10. page-*, feature-*, finance-*, report-*, ai-*, dashboard-*, site-settings-* */
/* ============================================================ */

.page-shell {
  display: flex;
  flex-direction: column;
  gap: var(--space-5, 1.25rem);
  padding: var(--space-6, 1.5rem) var(--space-7, 2rem);
  max-inline-size: min(1440px, 100%);
  margin-inline: auto;
}
.page-family-content-card {
  padding: var(--space-5, 1.25rem);
  border-radius: var(--radius-lg, 16px);
  background: var(--surface-elevated);
  border: 1px solid var(--hairline);
  box-shadow: var(--elev-1, 0 1px 2px rgba(0, 0, 0, 0.04));
  display: flex;
  flex-direction: column;
  gap: var(--space-3, 0.75rem);
}
.page-pin-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.375em;
  padding: 0.375rem 0.75rem;
  border-radius: var(--radius-pill, 999px);
  background: transparent;
  border: 1px solid var(--hairline);
  color: var(--text-tertiary);
  font-size: var(--type-size-small, 0.875rem);
  cursor: pointer;
  transition: color 150ms ease, background 150ms ease, border-color 150ms ease;
}
.page-pin-btn:hover {
  color: var(--text-primary);
  background: var(--surface-overlay);
  border-color: var(--hairline-strong);
}
.page-pin-label { display: inline-block; }

.feature-category {
  display: flex;
  flex-direction: column;
  gap: var(--space-2, 0.5rem);
  padding: var(--space-4, 1rem);
  border-radius: var(--radius-md, 12px);
  background: var(--surface-canvas);
  border: 1px solid var(--hairline);
}
.feature-checkbox {
  inline-size: 1rem;
  block-size: 1rem;
  margin-inline-end: 0.5rem;
  accent-color: var(--school-primary);
}
.feature-label {
  font-weight: 500;
  color: var(--text-primary);
}
.feature-desc {
  font-size: var(--type-size-small, 0.875rem);
  color: var(--text-tertiary);
}

.finance-dashboard-extra {
  display: flex;
  flex-direction: column;
  gap: var(--space-4, 1rem);
  margin-block-start: var(--space-5, 1.25rem);
}
.finance-summary-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3, 0.75rem);
  padding-block-start: var(--space-4, 1rem);
  border-block-start: 1px solid var(--hairline);
  font-size: var(--type-size-small, 0.875rem);
  color: var(--text-tertiary);
}

.report-preview-shell {
  position: relative;
  inline-size: 100%;
  padding: var(--space-4, 1rem);
  background: var(--surface-canvas);
  border-radius: var(--radius-lg, 16px);
  border: 1px solid var(--hairline);
}
.report-preview-shell-inner {
  position: relative;
  inline-size: 100%;
  aspect-ratio: 8.5 / 11;
  overflow: hidden;
  border-radius: var(--radius-md, 12px);
  background: var(--surface-elevated);
}
.report-preview-overlay {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(to bottom, transparent 70%, var(--surface-canvas) 100%);
}
.report-preview-frame {
  position: absolute;
  inset: 0;
  inline-size: 100%;
  block-size: 100%;
  border: 0;
}
.report-preview-fallback {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: var(--text-tertiary);
  font-size: var(--type-size-small, 0.875rem);
}

.ai-copilot-above-footer {
  position: relative;
  margin-block: var(--space-6, 1.5rem);
}
.ai-dashboard-actions {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2, 0.5rem);
}
.ai-dashboard-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.375em;
  padding: 0.375rem 0.875rem;
  border-radius: var(--radius-pill, 999px);
  background: color-mix(in srgb, var(--school-primary, #4f46e5) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--school-primary, #4f46e5) 22%, transparent);
  color: var(--text-secondary);
  font-size: var(--type-size-small, 0.875rem);
  cursor: pointer;
  text-decoration: none;
}
.ai-dashboard-btn:hover {
  background: color-mix(in srgb, var(--school-primary, #4f46e5) 16%, transparent);
  color: var(--text-primary);
}
.ai-draft-inline {
  padding: var(--space-3, 0.75rem) var(--space-4, 1rem);
  border-radius: var(--radius-md, 12px);
  background: color-mix(in srgb, var(--school-primary, #4f46e5) 5%, transparent);
  border: 1px solid color-mix(in srgb, var(--school-primary, #4f46e5) 16%, transparent);
  color: var(--text-secondary);
  font-size: var(--type-size-small, 0.875rem);
}

.dashboard-empty-illustration {
  display: block;
  inline-size: 100%;
  max-inline-size: 200px;
  block-size: auto;
  margin-inline: auto;
  color: var(--text-tertiary);
}
.dashboard-empty-action-secondary {
  display: inline-flex;
  align-items: center;
  gap: 0.375em;
  margin-inline-start: var(--space-3, 0.75rem);
  padding: 0.5rem 1rem;
  border-radius: var(--radius-md, 12px);
  background: transparent;
  border: 1px solid var(--hairline);
  color: var(--text-secondary);
  text-decoration: none;
  font-size: var(--type-size-small, 0.875rem);
}

.site-settings-layout {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: var(--space-5, 1.25rem);
  align-items: start;
}
@media (max-width: 960px) { .site-settings-layout { grid-template-columns: 1fr; } }
.site-settings-mobile-nav {
  display: none;
  flex-direction: column;
  gap: var(--space-2, 0.5rem);
  padding: var(--space-3, 0.75rem);
}
@media (max-width: 960px) { .site-settings-mobile-nav { display: flex; } }
.site-settings-mobile-links {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2, 0.5rem);
}

/* ============================================================ */
/* Dark-surface adaptations                                       */
/* ============================================================ */
[data-theme="dark"] .cp-button,
[data-bs-theme="dark"] .cp-button,
.cp-surface .cp-button,
[data-theme="dark"] .rmc-btn,
[data-bs-theme="dark"] .rmc-btn,
[data-theme="dark"] .tenant-admin-cta-secondary,
[data-bs-theme="dark"] .tenant-admin-cta-secondary {
  background: color-mix(in srgb, var(--surface-elevated, #2c241d) 92%, transparent);
  border-color: var(--hairline-strong, rgba(255, 255, 255, 0.16));
  color: var(--text-primary);
}

[data-theme="dark"] .cp-button:hover,
[data-bs-theme="dark"] .cp-button:hover,
.cp-surface .cp-button:hover,
[data-theme="dark"] .rmc-btn:hover,
[data-bs-theme="dark"] .rmc-btn:hover {
  background: color-mix(in srgb, var(--surface-elevated, #2c241d) 80%, var(--school-primary, #4f46e5) 8%);
}

/* Reduced-motion: kill the shimmer */
@media (prefers-reduced-motion: reduce) {
  .studio-os-skeleton,
  .rmc-skeleton-block { animation: none; opacity: 0.65; }
}

/* ----- Pillar 4: marketplace per-scope consent UI -----
   Used by templates/marketplace/partials/install_impact_modal.html
   Token-driven: no inline styles, no inline hex literals. */
.rmc-scope-consent {
  border: 1px solid var(--hairline, rgba(0, 0, 0, 0.08));
  border-radius: var(--radius-md, 0.5rem);
  padding: var(--space-3, 0.75rem);
  background: var(--surface-canvas, #fbfbfd);
  margin: 0 0 var(--space-3, 0.75rem);
}
.rmc-scope-consent__legend {
  font-size: var(--type-size-sm, 0.875rem);
  font-weight: 600;
  color: var(--text-primary);
  padding: 0 var(--space-2, 0.5rem);
  width: auto;
  margin-bottom: var(--space-2, 0.5rem);
}
.rmc-scope-consent__hint {
  font-size: var(--type-size-xs, 0.8125rem);
  color: var(--text-secondary, #555);
  margin: 0 0 var(--space-2, 0.5rem);
}
.rmc-scope-consent__list {
  display: flex;
  flex-direction: column;
  gap: var(--space-2, 0.5rem);
  max-height: 18rem;
  overflow-y: auto;
}
.rmc-scope-consent__item {
  display: flex;
  align-items: flex-start;
  gap: var(--space-2, 0.5rem);
  padding: var(--space-2, 0.5rem);
  border-radius: var(--radius-sm, 0.375rem);
  background: var(--surface-elevated, #fff);
  border: 1px solid var(--hairline, rgba(0, 0, 0, 0.06));
  cursor: pointer;
  transition: background-color var(--motion-fast, 120ms) var(--ease-standard, ease);
}
.rmc-scope-consent__item:hover,
.rmc-scope-consent__item:focus-within {
  background: color-mix(in srgb, var(--surface-elevated, #fff) 92%, var(--school-primary, #4f46e5) 4%);
}
.rmc-scope-consent__item.is-sensitive {
  border-color: color-mix(in srgb, var(--text-warning, #b45309) 50%, var(--hairline, rgba(0,0,0,0.08)) 50%);
}
.rmc-scope-consent__checkbox {
  margin-top: 0.2rem;
  flex: 0 0 auto;
}
.rmc-scope-consent__code {
  font-family: var(--font-mono, ui-monospace, SFMono-Regular, monospace);
  font-size: var(--type-size-xs, 0.8125rem);
  color: var(--text-primary);
  font-weight: 600;
}
.rmc-scope-consent__desc {
  font-size: var(--type-size-xs, 0.8125rem);
  color: var(--text-secondary, #555);
}
.rmc-scope-consent__badge {
  margin-left: auto;
  align-self: flex-start;
}
.rmc-scope-consent__actions {
  display: flex;
  align-items: center;
  gap: var(--space-3, 0.75rem);
  width: 100%;
  flex-wrap: wrap;
}
.rmc-scope-consent__status {
  font-size: var(--type-size-xs, 0.8125rem);
  color: var(--text-secondary, #555);
}
.rmc-install-impact-graph {
  min-height: 200px;
}

/* ============================================================ */
/* v2.63 (2026-05-15) — Bento grid primitive.
 *
 * Replaces the vertical stack of "outcome sections" on Studio Control
 * (was ~1350px tall for 9 sections; bento drops it to ~450px on 3 cols,
 * ~700px on 2 cols, ~1350px collapsed on mobile — same as before, by
 * design, since mobile has no horizontal room).
 *
 * Auto-fit minmax means columns redistribute dynamically: 3 cols at
 * ≥960px container width, 2 cols at ≥640px, 1 col below. No media
 * queries needed — the grid does it. */
/* ============================================================ */
.rmc-bento {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--space-3, 0.75rem);
  align-items: stretch;
}
.rmc-bento__cell {
  background: var(--surface-elevated, var(--bs-tertiary-bg, rgba(255,255,255,0.04)));
  border: var(--border-width-hairline, 0.5px) solid var(--hairline, rgba(255,255,255,0.08));
  border-radius: var(--radius-md, 12px);
  padding: var(--space-3, 0.75rem) var(--space-3, 0.75rem) var(--space-4, 1rem);
  display: flex;
  flex-direction: column;
  gap: var(--space-2, 0.5rem);
  min-width: 0;
}
.rmc-bento__cell-head {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
/* Outcome variant — chip-row is tight, head is one-line title + dim subtitle. */
.rmc-bento__cell--outcome .rmc-bento__chip {
  font-size: var(--type-size-xs, 0.8125rem);
  padding: 0.25rem 0.55rem;
  border-radius: var(--radius-pill, 999px);
}
.rmc-bento--outcomes {
  /* Outcomes pack denser than generic bento — 240px minmax. */
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

/* v2.63 — Feature control segmented tabs. The bar itself is .rmc-segmented;
   these add the panel-switching behavior on top. Hidden panes use
   .feature-category--hidden (display:none with d-none fallback) so the form
   POST still sends every input value regardless of which tab is showing. */
.feature-cat-tabs {
  margin-bottom: var(--space-3, 0.75rem);
}
.feature-cat-tab {
  /* Inherits rmc-segmented__btn — these are layout hooks only. */
  white-space: nowrap; /* horizontal-overflow-risk-allow: nav-label-controlled-vocabulary */
}
.feature-cat-tab__label {
  /* Truncate long category labels in narrow viewports rather than wrap. */
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 12ch;
}
.feature-cat-tab__count {
  font-size: var(--type-size-micro, 0.6875rem);
  padding: 0.1rem 0.35rem;
}
.feature-cat-tab--all {
  /* All-categories tab: dim chrome so it doesn't compete with regular tabs. */
  opacity: 0.85;
}
.feature-cat-tab--all:hover { opacity: 1; }
.feature-categories-stack {
  display: flex;
  flex-direction: column;
  gap: var(--space-3, 0.75rem);
}
.feature-category--tabbed {
  /* Becomes a single-column block instead of the 3-col bootstrap grid. */
  width: 100%;
}
.feature-category--hidden {
  /* Belt-and-braces with d-none. Keeps inputs in DOM for form submission. */
  display: none !important;
}

/* v2.63 — Studio cards that double as <details> disclosures. Same surface
   as studio-os__card but with the summary-row cursor + reset of native
   triangle marker so the chevron we add via :before stays clean. */
.studio-os__card--disclosure summary {
  list-style: none;
}
.studio-os__card--disclosure summary::-webkit-details-marker { display: none; }
.studio-os__card--disclosure summary::before {
  content: "▸";
  display: inline-block;
  margin-right: 0.4rem;
  transition: transform var(--motion-fast, 120ms) var(--ease-standard, ease);
  color: var(--text-secondary);
  font-size: 0.85em;
}
.studio-os__card--disclosure[open] summary::before { transform: rotate(90deg); }

/* Parallel work — institutional stamp partial (templates/partials/notifications/_institutional_stamp.html). */
.rmc-institutional-stamp {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.25rem 0.6rem;
  border-radius: var(--radius-pill, 999px);
  background: var(--surface-overlay, rgba(255,255,255,0.04));
  border: var(--border-width-hairline, 0.5px) solid var(--hairline, rgba(255,255,255,0.08));
  color: var(--text-secondary, #555);
  font-size: var(--type-size-micro, 0.6875rem);
}
.rmc-institutional-stamp__icon {
  display: inline-flex;
  align-items: center;
  color: var(--text-tertiary, var(--text-secondary, #888));
}
.rmc-institutional-stamp__label {
  letter-spacing: 0.02em;
}

/* AI Center + guided assistant output panel */
.rmc-ai-guided-out,
[data-rmc-ai-out].rmc-ai-guided-out {
  max-height: 24rem;
  overflow: auto;
  white-space: pre-wrap;
}

/* AI guided assistant CTA (templates/components/ai_guided_assistant_card.html) */
.rmc-ai-guided-assistant-card,
.rmc-ai-guided-assistant-card__body,
.rmc-ai-guided-assistant-card__copy,
.rmc-ai-guided-assistant-card__title,
.rmc-ai-guided-assistant-card__hint,
.rmc-ai-guided-assistant-card__cta,
.rmc-ai-guided-assistant-card__icon {
  display: block;
}

/* Migration Cloud intake form — BEM block used by templates/migration_cloud/intake_new.html.
 * Token-driven, theme-aware. Page extends control_plane_skeleton.html so tokens resolve
 * to the dark CP palette by default; portal shell tokens reflow automatically. */
.rmc-page--migration-cloud-intake {
  padding: 1.5rem clamp(1rem, 4vw, 2.5rem);
  max-width: 86rem;
  margin-inline: auto;
}

.rmc-intake-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(18rem, 26rem);
  gap: var(--space-5, 1.25rem);
  align-items: end;
}

.rmc-intake-hero__copy,
.rmc-intake-hero__metrics,
.rmc-intake-workbench,
.rmc-intake-sidecar,
.rmc-intake-panel,
.rmc-intake-method-card,
.rmc-intake-dropzone,
.rmc-intake-savebar {
  min-width: 0;
}

.rmc-intake-hero__metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
}

.rmc-intake-metric {
  padding: 0.75rem;
  border: 1px solid var(--hairline, rgba(0,0,0,0.08));
  border-radius: var(--radius-md, 0.5rem);
  background: var(--surface-elevated, #fff);
}

.rmc-intake-metric strong {
  display: block;
  font-size: var(--type-size-h3, 1.15rem);
  line-height: 1.1;
  color: var(--text-primary, inherit);
}

.rmc-intake-metric span {
  display: block;
  margin-top: 0.25rem;
  color: var(--text-secondary, #555);
  font-size: var(--type-size-micro, 0.72rem);
}

.rmc-intake-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(18rem, 24rem);
  gap: var(--space-5, 1.25rem);
  align-items: start;
}

.rmc-intake-sidecar {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  position: sticky;
  top: 1rem;
}

.rmc-intake-panel {
  border: var(--border-width-hairline, 1px) solid var(--hairline, rgba(255,255,255,0.08));
  border-radius: var(--radius-lg, 0.75rem);
  padding: 1.1rem 1.25rem;
  background: var(--surface-elevated, transparent);
  box-shadow: var(--elev-1, 0 1px 2px rgba(0,0,0,0.04));
}

.rmc-intake-panel--side {
  padding: 1rem;
}

.rmc-intake-panel__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  margin-bottom: 1rem;
}

.rmc-intake-eyebrow {
  margin: 0 0 0.25rem;
  font-size: var(--type-size-micro, 0.72rem);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-tertiary, #777);
  font-weight: 700;
}

.rmc-intake-method-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.rmc-intake-method-card {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  min-height: 7rem;
  padding: 0.9rem;
  border: 1px solid var(--hairline, rgba(0,0,0,0.1));
  border-radius: var(--radius-md, 0.5rem);
  background: var(--surface-canvas, transparent);
  color: var(--text-primary, inherit);
  text-align: start;
  cursor: pointer;
}

.rmc-intake-method-card[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--school-primary, #4f46e5) 45%, var(--hairline));
  background: color-mix(in srgb, var(--school-primary, #4f46e5) 8%, var(--surface-elevated, #fff));
}

.rmc-intake-method-card i {
  font-size: 1.35rem;
  color: var(--school-primary, currentColor);
}

.rmc-intake-method-card__body {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.rmc-intake-method-card__body small {
  color: var(--text-secondary, #555);
}

.rmc-intake-method-select {
  margin-bottom: 1rem;
}

.rmc-intake-source-section {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.rmc-intake-dropzone {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.25rem;
  border: 1px dashed var(--hairline-strong, rgba(0,0,0,0.24));
  border-radius: var(--radius-lg, 0.75rem);
  background: var(--surface-canvas, transparent);
  cursor: pointer;
}

.rmc-intake-dropzone[data-mc-dragging="1"] {
  border-color: var(--school-primary, currentColor);
  background: color-mix(in srgb, var(--school-primary, #4f46e5) 8%, var(--surface-elevated, #fff));
}

.rmc-intake-dropzone__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  flex: 0 0 3rem;
  border-radius: var(--radius-md, 0.5rem);
  background: color-mix(in srgb, var(--school-primary, #4f46e5) 12%, transparent);
  color: var(--school-primary, currentColor);
  font-size: 1.35rem;
}

.rmc-intake-dropzone__copy {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  color: var(--text-primary, inherit);
}

.rmc-intake-dropzone__copy small,
.rmc-intake-file-summary,
.rmc-intake-live-source p {
  color: var(--text-secondary, #555);
}

.rmc-intake-dropzone__input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}

.rmc-intake-file-list,
.rmc-intake-checklist,
.rmc-intake-pipeline {
  list-style: none;
  padding: 0;
  margin: 0;
}

.rmc-intake-file-list {
  display: grid;
  gap: 0.4rem;
}

.rmc-intake-file-list li {
  display: flex;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.55rem 0.65rem;
  border: 1px solid var(--hairline, rgba(0,0,0,0.08));
  border-radius: var(--radius-sm, 0.375rem);
  background: var(--surface-canvas, transparent);
}

.rmc-intake-file-list li[data-mc-file-warning="oversized"] {
  border-color: var(--color-warning, #b26a00);
}

/* Per-file remove control — lets an operator drop a file from the accumulated
   multi-file selection. Theme-aware so it reads in light and dark. */
.rmc-intake-file-remove {
  flex: 0 0 auto;
  width: 1.5rem;
  height: 1.5rem;
  line-height: 1;
  border: 1px solid var(--hairline);
  border-radius: 999px;
  background: var(--surface-elevated, var(--surface-canvas));
  color: var(--text-secondary);
  cursor: pointer;
  font-size: 1rem;
}

.rmc-intake-file-remove:hover,
.rmc-intake-file-remove:focus-visible {
  color: var(--text-primary);
  border-color: var(--text-secondary);
}

.rmc-intake-live-source {
  display: flex;
  gap: 0.75rem;
  padding: 1rem;
  border-radius: var(--radius-md, 0.5rem);
  background: var(--surface-canvas, transparent);
  border: 1px solid var(--hairline, rgba(0,0,0,0.08));
}

.rmc-intake-live-source i {
  color: var(--school-primary, currentColor);
  font-size: 1.3rem;
}

.rmc-intake-checks,
.rmc-intake-checklist {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.rmc-intake-checklist li {
  display: flex;
  gap: 0.55rem;
  align-items: flex-start;
  color: var(--text-secondary, #555);
}

.rmc-intake-checklist i {
  color: var(--school-primary, currentColor);
  margin-top: 0.15rem;
}

.rmc-intake-pipeline {
  display: grid;
  gap: 0.75rem;
  counter-reset: mc-pipeline;
}

.rmc-intake-pipeline li {
  display: grid;
  grid-template-columns: 2rem minmax(0, 1fr);
  gap: 0.65rem;
  align-items: start;
}

.rmc-intake-pipeline li::before {
  counter-increment: mc-pipeline;
  content: counter(mc-pipeline);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.8rem;
  height: 1.8rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--school-primary, #4f46e5) 12%, transparent);
  color: var(--school-primary, currentColor);
  font-weight: 700;
}

.rmc-intake-pipeline strong,
.rmc-intake-pipeline span {
  grid-column: 2;
}

.rmc-intake-pipeline span {
  color: var(--text-secondary, #555);
  font-size: var(--type-size-small, 0.875rem);
}

.rmc-intake-savebar {
  position: sticky;
  bottom: 1rem;
  z-index: 3;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 0.9rem 1rem;
  border: 1px solid var(--hairline-strong, rgba(0,0,0,0.16));
  border-radius: var(--radius-lg, 0.75rem);
  background: color-mix(in srgb, var(--surface-elevated, #fff) 94%, transparent);
  box-shadow: var(--elev-2, 0 8px 24px rgba(0,0,0,0.08));
  backdrop-filter: blur(12px);
}

.rmc-intake-savebar p {
  margin: 0.15rem 0 0;
  color: var(--text-secondary, #555);
  font-size: var(--type-size-small, 0.875rem);
}

@media (max-width: 1100px) {
  .rmc-intake-layout,
  .rmc-intake-hero {
    grid-template-columns: 1fr;
  }
  .rmc-intake-sidecar,
  .rmc-intake-savebar {
    position: static;
  }
}

@media (max-width: 720px) {
  .rmc-intake-hero__metrics,
  .rmc-intake-method-grid {
    grid-template-columns: 1fr;
  }
  .rmc-intake-savebar {
    align-items: stretch;
    flex-direction: column;
  }
}

.rmc-form--intake {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.rmc-form__section {
  border: var(--border-width-hairline, 1px) solid var(--hairline, rgba(255,255,255,0.08));
  border-radius: var(--radius-md, 0.5rem);
  padding: 1rem 1.25rem;
  background: var(--surface-elevated, transparent);
}

.rmc-form__legend {
  font-size: var(--type-size-body, 0.95rem);
  font-weight: 600;
  color: var(--text-primary, inherit);
  padding: 0 0.25rem;
}

.rmc-form__help {
  font-size: var(--type-size-small, 0.85rem);
  color: var(--text-secondary, #555);
  margin: 0.35rem 0 0.75rem;
}

.rmc-form__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
  gap: 0.85rem;
}

.rmc-form__field {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.rmc-form__label {
  font-size: var(--type-size-small, 0.85rem);
  color: var(--text-secondary, #555);
}

.rmc-form__checkbox {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

.rmc-form__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  align-items: center;
}

.rmc-input {
  font: inherit;
  padding: 0.5rem 0.7rem;
  border: var(--border-width-hairline, 1px) solid var(--hairline, rgba(255,255,255,0.18));
  border-radius: var(--radius-sm, 0.375rem);
  background: var(--surface-canvas, transparent);
  color: var(--text-primary, inherit);
  width: 100%;
}

.rmc-input--text,
.rmc-input--select,
.rmc-input--file {
  /* Variant hooks; share base .rmc-input box. */
}

.rmc-banner {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 0.75rem 1rem;
  border-radius: var(--radius-md, 0.5rem);
  border-left: 4px solid var(--accent, currentColor);
  background: var(--surface-overlay, rgba(255,255,255,0.04));
  margin-bottom: 1rem;
}

.rmc-banner--error {
  border-left-color: var(--color-error, #c0392b);
  background: var(--surface-error-bg, rgba(192,57,43,0.08));
}

.rmc-banner--success {
  border-left-color: var(--color-success, #2e7d32);
  background: var(--surface-success-bg, rgba(46,125,50,0.08));
}

.rmc-banner--warning {
  border-left-color: var(--color-warning, #b26a00);
  background: var(--surface-warning-bg, rgba(178,106,0,0.08));
}

.rmc-banner--info,
.rmc-banner--debug {
  border-left-color: var(--accent, currentColor);
  background: var(--surface-info-bg, rgba(0,0,0,0.04));
}

.rmc-banner-stack {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-bottom: 1rem;
}

.rmc-page--migration-cloud-attach,
.rmc-page--migration-cloud-bind {
  /* Wizard subpages share the rmc-page base; this hook lets us tighten
     spacing per-screen without forking the base layout. */
}

.rmc-card__header-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.5rem;
}

.rmc-ai-plan__grid {
  display: grid;
  grid-template-columns: max-content 1fr;
  column-gap: 0.75rem;
  row-gap: 0.25rem;
  margin-bottom: 0.75rem;
}

.rmc-ai-narrative {
  border-left: 3px solid var(--accent, currentColor);
  padding: 0.5rem 0.75rem;
  margin: 0.5rem 0;
  background: var(--surface-overlay, rgba(0,0,0,0.03));
  font-style: italic;
}

.rmc-stage-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  list-style: none;
  padding: 0;
  margin: 0 0 0.75rem 0;
}

.rmc-stage {
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  border: 1px solid var(--hairline, rgba(0,0,0,0.12));
  font-size: var(--type-size-sm, 0.85rem);
}

.rmc-stage--done {
  background: var(--surface-success-bg, rgba(46,125,50,0.12));
  border-color: var(--color-success, #2e7d32);
}

.rmc-stage--current {
  background: var(--surface-info-bg, rgba(0,0,0,0.04));
  border-color: var(--accent, currentColor);
  font-weight: 600;
}

.rmc-stage--pending {
  opacity: 0.6;
}

.rmc-stat-list {
  list-style: none;
  padding: 0;
  margin: 0 0 0.75rem 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 0.35rem 0.75rem;
}

.rmc-stat-list--warn li {
  color: var(--color-warning, #b26a00);
}

.rmc-ai-disclosure {
  margin-top: 1rem;
  padding: 0.5rem 0.75rem;
  border-top: 1px solid var(--hairline, rgba(0,0,0,0.08));
}

.rmc-ai-disclosure > summary {
  cursor: pointer;
  font-weight: 600;
  margin-bottom: 0.5rem;
}

.rmc-form--inline {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}

.rmc-form--inline > input[type="text"],
.rmc-form--inline > input[type="file"] {
  flex: 1 1 240px;
  min-width: 240px;
}

.rmc-ai-ask__entry {
  padding: 0.4rem 0.6rem;
  border-left: 2px solid var(--accent, currentColor);
  margin: 0.4rem 0;
  background: var(--surface-overlay, rgba(0,0,0,0.03));
  border-radius: 0 0.25rem 0.25rem 0;
}

.rmc-ai-ask__q,
.rmc-ai-ask__a {
  margin: 0.15rem 0;
  font-size: var(--type-size-sm, 0.9rem);
}

.rmc-page--migration-cloud-intake .rmc-card.rmc-ai-disclosure {
  margin: 1rem 0;
}

/* sms-v3.7 — Migration Cloud Tier 1 / Tier 2 / Tier 3 page modifiers + stage states. */
.rmc-page--migration-cloud-conflicts,
.rmc-page--migration-cloud-progress,
.rmc-page--migration-cloud-assets,
.rmc-page--migration-cloud-handoff,
.rmc-page--migration-cloud-review {
  display: flex;
  flex-direction: column;
  gap: var(--space-4, 1rem);
}

.rmc-card--muted {
  background: var(--surface-canvas);
  border: 1px dashed var(--hairline);
  color: var(--text-secondary);
}

.rmc-stage--pending {
  opacity: 0.6;
  color: var(--text-secondary);
}
.rmc-stage--current {
  font-weight: 600;
  color: var(--school-accent, currentColor);
}
.rmc-stage--done {
  opacity: 0.9;
  color: var(--text-primary);
}
.rmc-stage--done::before {
  content: "✓ ";
  color: var(--ds-success, currentColor);
}

.rmc-section-nav--secondary {
  border-top: 1px solid var(--hairline);
  padding-top: var(--space-2, 0.5rem);
  margin-top: var(--space-2, 0.5rem);
}

.rmc-stack {
  display: flex;
  flex-direction: column;
  gap: var(--space-2, 0.5rem);
  list-style: none;
  padding: 0;
  margin: 0;
}

/* rmc-info-tag — inline help icon (Bootstrap popover on focus) used by
   templates/partials/rmc_info_tag.html. Wrapper span anchors the popover;
   inner btn carries the icon. Inherits ink so it tints to the surrounding
   text in every theme. */
.rmc-info-tag {
  display: inline-flex;
  align-items: baseline;
  vertical-align: baseline;
  margin-inline-start: 0.25rem;
  color: var(--text-secondary);
  line-height: 1;
}

.rmc-info-tag__btn {
  color: inherit;
  text-decoration: none;
  border: 0;
  background: transparent;
  font-size: inherit;
  line-height: inherit;
  cursor: help;
  transition: color var(--motion-fast, 120ms) var(--ease-standard, ease);
}

.rmc-info-tag__btn:hover,
.rmc-info-tag__btn:focus-visible {
  color: var(--text-primary);
  outline: none;
}

.rmc-info-tag__btn .bi {
  font-size: 0.9em;
  vertical-align: baseline;
}

/* Exceptional fixed tip layer — never clipped by overflow:hidden ancestors */
.rmc-info-tip-layer {
  position: fixed;
  z-index: 1080;
  max-width: min(360px, calc(100vw - 16px));
  min-width: 0;
  pointer-events: auto;
}
.rmc-info-tip {
  display: grid;
  gap: 0.55rem;
  padding: 0.75rem 0.85rem;
  border-radius: 12px;
  border: 1px solid var(--hairline, rgba(148, 163, 184, 0.28));
  background: var(--surface-elevated, #111827);
  color: var(--text-primary, #eef2ff);
  box-shadow: var(--elev-2, 0 8px 28px rgba(0, 0, 0, 0.28));
  min-width: 0;
}
.rmc-info-tip__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
  min-width: 0;
}
.rmc-info-tip__title {
  font-size: 0.85rem;
  font-weight: 750;
  line-height: 1.3;
  min-width: 0;
}
.rmc-info-tip__surface {
  flex: 0 0 auto;
  max-width: 42%;
  padding: 0.15rem 0.45rem;
  border-radius: 999px;
  border: 1px solid var(--hairline, rgba(148, 163, 184, 0.28));
  font-size: 0.65rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-secondary, #94a3b8);
}
.rmc-info-tip__block {
  min-width: 0;
}
.rmc-info-tip__kicker {
  display: block;
  margin-bottom: 0.15rem;
  font-size: 0.65rem;
  font-weight: 850;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-tertiary, #64748b);
}
.rmc-info-tip__text {
  margin: 0;
  font-size: 0.78rem;
  line-height: 1.45;
  color: var(--text-secondary, #cbd5e1);
  overflow-wrap: anywhere;
  word-break: break-word;
}
.rmc-info-tip__block--watch .rmc-info-tip__kicker {
  color: var(--status-warning, #f59e0b);
}
.rmc-info-tip__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
  min-width: 0;
}
.rmc-info-tip__chip {
  max-width: 100%;
  padding: 0.15rem 0.45rem;
  border-radius: 999px;
  border: 1px solid var(--hairline, rgba(148, 163, 184, 0.28));
  font-size: 0.65rem;
  font-weight: 700;
  color: var(--text-secondary, #94a3b8);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* rmc-page-explain-strip — shell-level route help + workflow tags (operator + tenant) */
.rmc-page-explain-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 0.5rem 1rem;
  margin-block-end: 0.75rem;
  padding: 0.5rem 0.75rem;
  border: 1px solid var(--hairline);
  border-radius: var(--radius-md, 0.5rem);
  background: var(--surface-canvas);
}

.rmc-page-explain-strip__lead {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 1rem;
  width: 100%;
}

.rmc-page-explain-strip__copy {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.25rem 0.5rem;
}

.rmc-page-explain-strip__title {
  color: var(--text-primary);
}

.rmc-page-explain-strip__tags {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  align-items: center;
}

/* Flow Thread — folds the system "next action" into this same bar:
   origin (you are here) → luminous connector → destination (your next step).
   Only the --flow modifier (set when a next-action exists) gets the single-row
   treatment; the plain explain strip is unchanged. */
.rmc-page-explain-strip--flow {
  flex-wrap: nowrap;
  align-items: center;
}
.rmc-page-explain-strip--flow .rmc-page-explain-strip__lead {
  width: auto;
  flex: 0 1 auto;
  min-width: 0;
}
.rmc-page-explain-strip__here-dot {
  inline-size: 0.5rem;
  block-size: 0.5rem;
  flex: none;
  border-radius: 50%;
  background: var(--brand-primary, var(--text-secondary));
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand-primary, var(--text-secondary)) 20%, transparent);
}
.rmc-page-explain-strip__flow {
  flex: 1 1 auto;
  min-inline-size: 2rem;
  block-size: 2px;
  border-radius: 2px;
  position: relative;
  overflow: hidden;
  /* off-token-allow: decorative-gradient */
  background: linear-gradient(90deg, color-mix(in srgb, var(--brand-primary, var(--hairline)) 55%, transparent), color-mix(in srgb, var(--ds-success, var(--hairline)) 55%, transparent));
}
.rmc-page-explain-strip__flow::after {
  content: "";
  position: absolute;
  inset-block-start: -1px;
  inset-inline-start: 0;
  inline-size: 34%;
  block-size: 4px;
  border-radius: 4px;
  filter: blur(1px);
  /* off-token-allow: decorative-gradient */
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--ds-success, var(--text-secondary)) 80%, transparent), transparent);
  animation: rmc-pe-flow 3.2s cubic-bezier(0.6, 0, 0.4, 1) infinite;
}
.rmc-page-explain-strip__next {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  flex: none;
  padding: 0.3rem 0.4rem 0.3rem 0.7rem;
  border-radius: var(--radius-pill, 9999px);
  border: 1px solid color-mix(in srgb, var(--ds-success, var(--hairline)) 40%, transparent);
  background: color-mix(in srgb, var(--ds-success, var(--surface-elevated)) 11%, transparent);
  text-decoration: none;
  transition: background-color var(--motion-fast, 120ms) var(--ease-standard, ease);
}
.rmc-page-explain-strip__next:hover,
.rmc-page-explain-strip__next:focus-visible {
  background: color-mix(in srgb, var(--ds-success, var(--surface-elevated)) 18%, transparent);
}
.rmc-page-explain-strip__next:focus-visible {
  outline: 2px solid var(--focus-ring, var(--ds-success, currentColor));
  outline-offset: 2px;
}
.rmc-page-explain-strip__next-kicker {
  font-size: var(--type-size-micro, 0.6875rem);
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--text-secondary);
}
.rmc-page-explain-strip__next-name {
  font-size: var(--type-size-sm, 0.875rem);
  font-weight: 650;
  color: var(--ds-success, var(--text-primary));
  max-inline-size: 24ch;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap; /* horizontal-overflow-risk-allow: truncates-with-ellipsis */
}
.rmc-page-explain-strip__next-go {
  inline-size: 1.4rem;
  block-size: 1.4rem;
  flex: none;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-weight: 800;
  background: var(--ds-success, var(--brand-primary));
  color: var(--text-on-brand, #ffffff); /* off-token-allow: brand-foreground-fallback */
}
@keyframes rmc-pe-flow {
  0% { inset-inline-start: -34%; opacity: 0; }
  15% { opacity: 1; }
  85% { opacity: 1; }
  100% { inset-inline-start: 100%; opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .rmc-page-explain-strip__flow::after { animation: none; display: none; }
}
/* Narrow viewports: identity stays, the thread hides and the next step wraps. */
@media (max-width: 720px) {
  .rmc-page-explain-strip--flow { flex-wrap: wrap; }
  .rmc-page-explain-strip--flow .rmc-page-explain-strip__flow { display: none; }
  .rmc-page-explain-strip--flow .rmc-page-explain-strip__next { margin-inline-start: auto; }
}

/* Flow continuation launchpad — Phase 2: the thread drops from the bar into the
   reclaimed band and lands in 2-3 guided steps. Fills the space the standalone
   next-action strip used to occupy, with a narrative (here → and then these).
   Token-only; the live step echoes the bar's pill as the "you are here" anchor. */
.rmc-flow-launchpad {
  position: relative;
  margin-block: 0.5rem 0;
  padding-inline-start: 1.5rem;
}
.rmc-flow-launchpad__rail {
  position: absolute;
  inset-inline-start: 0.45rem;
  inset-block: -0.35rem 0.9rem;
  inline-size: 2px;
  border-radius: 2px;
  /* off-token-allow: decorative-gradient */
  background: linear-gradient(180deg, var(--ds-success, var(--brand-primary)), color-mix(in srgb, var(--brand-primary, var(--hairline)) 55%, transparent), transparent);
}
.rmc-flow-launchpad__lead {
  margin: 0 0 0.5rem;
  font-size: var(--type-size-micro, 0.6875rem);
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--text-secondary);
}
.rmc-flow-launchpad__steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}
.rmc-flow-launchpad__step {
  flex: 1 1 14rem;
  min-inline-size: 0;
}
.rmc-flow-launchpad__step-link {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  block-size: 100%;
  padding: 0.6rem 0.75rem;
  border-radius: var(--radius-md, 0.625rem);
  border: 1px solid var(--hairline);
  background: var(--surface-elevated);
  box-shadow: var(--elev-1, 0 1px 2px rgba(0, 0, 0, 0.04));
  text-decoration: none;
  transition: border-color var(--motion-fast, 120ms) var(--ease-standard, ease),
              box-shadow var(--motion-fast, 120ms) var(--ease-standard, ease),
              transform var(--motion-fast, 120ms) var(--ease-standard, ease);
}
.rmc-flow-launchpad__step-link:hover,
.rmc-flow-launchpad__step-link:focus-visible {
  border-color: color-mix(in srgb, var(--brand-primary, var(--hairline)) 45%, transparent);
  box-shadow: var(--elev-2, 0 6px 20px rgba(0, 0, 0, 0.08));
  transform: translateY(-1px);
}
.rmc-flow-launchpad__step-link:focus-visible {
  outline: 2px solid var(--focus-ring, var(--brand-primary, currentColor));
  outline-offset: 2px;
}
.rmc-flow-launchpad__step-dot {
  inline-size: 0.55rem;
  block-size: 0.55rem;
  margin-block-start: 0.2rem;
  flex: none;
  border-radius: 50%;
  background: var(--surface-canvas, var(--surface-elevated));
  border: 2px solid var(--brand-primary, var(--text-secondary));
}
.rmc-flow-launchpad__step--live .rmc-flow-launchpad__step-dot {
  background: var(--ds-success, var(--brand-primary));
  border-color: var(--ds-success, var(--brand-primary));
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--ds-success, var(--brand-primary)) 20%, transparent);
}
.rmc-flow-launchpad__step-body {
  min-inline-size: 0;
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
}
.rmc-flow-launchpad__step-title {
  font-size: var(--type-size-sm, 0.875rem);
  font-weight: 650;
  color: var(--text-primary);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap; /* horizontal-overflow-risk-allow: truncates-with-ellipsis */
}
.rmc-flow-launchpad__step-desc {
  font-size: var(--type-size-caption, 0.75rem);
  color: var(--text-secondary);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.rmc-flow-launchpad__step-go {
  margin-inline-start: auto;
  align-self: center;
  flex: none;
  font-size: var(--type-size-micro, 0.6875rem);
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--brand-primary, var(--text-secondary));
  opacity: 0;
  transform: translateX(-0.2rem);
  transition: opacity var(--motion-fast, 120ms) var(--ease-standard, ease),
              transform var(--motion-fast, 120ms) var(--ease-standard, ease);
}
.rmc-flow-launchpad__step--live .rmc-flow-launchpad__step-go { color: var(--ds-success, var(--brand-primary)); }
.rmc-flow-launchpad__step-link:hover .rmc-flow-launchpad__step-go,
.rmc-flow-launchpad__step-link:focus-visible .rmc-flow-launchpad__step-go {
  opacity: 1;
  transform: translateX(0);
}
@media (prefers-reduced-motion: reduce) {
  .rmc-flow-launchpad__step-link { transition: none; }
  .rmc-flow-launchpad__step-link:hover { transform: none; }
  .rmc-flow-launchpad__step-go { opacity: 1; transform: none; transition: none; }
}
/* Narrow viewports: drop the rail, stack the steps full width. */
@media (max-width: 720px) {
  .rmc-flow-launchpad { padding-inline-start: 0; }
  .rmc-flow-launchpad__rail { display: none; }
  .rmc-flow-launchpad__step { flex-basis: 100%; }
}

/* Flow lead-in (Phase 3) — when the launchpad rail exists above, the page's
   first content block (hero greeting / flight-deck header) RECEIVES the flow:
   a short spine bridges the gap and lands on a node, so
   bar → next step → your flow → here's your page reads as one continuous
   descent. Generic modifier (works on any first block); applied in-template
   ONLY under the launchpad condition. The spine lives inside a small
   inline-start pad so it can never clip on a gutterless container. Token-only,
   no animation. */
/* Two ways an element receives the lead-in:
   1. `.rmc-flow-leadin` — applied in-template on shared first-content blocks
      (hero greeting, flight-deck header, the two page_header partials).
   2. `body:has([data-rmc-flow-launchpad]) .rmc-page__header` — the bespoke
      operator/portal page header (`.rmc-page__header`, ~51 inline-header pages
      with no shared partial) gets it CSS-only, gated on the launchpad's
      presence in the page (the same condition the in-template class uses) so
      no 51-file sweep is needed. `.rmc-page__header` carries no ::before/::after
      of its own, so there is no pseudo-element collision. */
.rmc-flow-leadin,
body:has([data-rmc-flow-launchpad]) .rmc-page__header {
  position: relative;
  padding-inline-start: 1rem;
}
.rmc-flow-leadin::before,
body:has([data-rmc-flow-launchpad]) .rmc-page__header::before {
  content: "";
  position: absolute;
  inset-inline-start: 0.28rem;
  inset-block-start: -1.1rem;
  block-size: 2.6rem;
  inline-size: 2px;
  border-radius: 2px;
  /* off-token-allow: decorative-gradient */
  background: linear-gradient(180deg, color-mix(in srgb, var(--ds-success, var(--brand-primary)) 45%, transparent), color-mix(in srgb, var(--brand-primary, var(--hairline)) 35%, transparent), transparent);
}
.rmc-flow-leadin::after,
body:has([data-rmc-flow-launchpad]) .rmc-page__header::after {
  content: "";
  position: absolute;
  inset-inline-start: 0.03rem;
  inset-block-start: 0.1rem;
  inline-size: 0.55rem;
  block-size: 0.55rem;
  border-radius: 50%;
  background: var(--surface-canvas, var(--surface-elevated));
  border: 2px solid var(--brand-primary, var(--text-secondary));
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand-primary, var(--text-secondary)) 14%, transparent);
}
/* Narrow viewports: drop the spine, content stays flush. */
@media (max-width: 720px) {
  .rmc-flow-leadin,
  body:has([data-rmc-flow-launchpad]) .rmc-page__header { padding-inline-start: 0; }
  .rmc-flow-leadin::before,
  .rmc-flow-leadin::after,
  body:has([data-rmc-flow-launchpad]) .rmc-page__header::before,
  body:has([data-rmc-flow-launchpad]) .rmc-page__header::after { display: none; }
}

/* Bootstrap .text-muted → design-token contrast (batch 1225 sweep) */
.rmc-text-muted,
.text-muted {
  color: var(--rmc-acx-text-muted, var(--text-secondary, #475569)) !important;
}

/* ------------------------------------------------------------------
 * Migration Cloud + operator surface BEM grammar (batch 1373)
 * Semantic tokens only; theme-aware via cascade. Closes
 * scan_undefined_css_classes zero-tolerance gate for templates in:
 *   templates/migration_cloud/operator/*.html
 *   templates/migration_cloud/super/health.html
 *   templates/migration_cloud/canonical_template_picker.html
 *   templates/migration_cloud/_canonical_template_panel.html
 *   templates/schoolops/operator/meal_plan_analytics.html
 * ------------------------------------------------------------------ */
.rmc-card__header {
  display: flex;
  flex-direction: column;
  gap: var(--space-2, 0.5rem);
  padding: var(--space-4, 1rem) var(--space-5, 1.25rem);
  border-bottom: 1px solid var(--hairline);
}

.rmc-card__body {
  padding: var(--space-5, 1.25rem);
}

.rmc-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-4, 1rem) var(--space-5, 1.25rem);
  border-top: 1px solid var(--hairline);
  align-items: center;
}

.rmc-card--mc-command,
.rmc-card--mc-health {
  background: var(--surface-elevated);
  border: 1px solid var(--hairline);
  border-radius: var(--radius-md, 0.625rem);
  box-shadow: var(--elev-1, 0 1px 2px rgba(0, 0, 0, 0.04));
}

/* The fleet-SLO row leads the operator health grid (audit G-6): a top brand
   accent + lifted elevation set it apart from the incident-response panels below. */
.rmc-card--mc-fleet-slo {
  border-top: 2px solid var(--brand-accent, var(--accent));
  box-shadow: var(--elev-2, 0 4px 12px rgba(0, 0, 0, 0.06));
}

.rmc-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1, 0.25rem);
  padding: 0.125rem var(--space-2, 0.5rem);
  font-size: var(--type-size-xs, 0.75rem);
  font-weight: 500;
  border-radius: var(--radius-pill, 999px);
  background: var(--surface-overlay, rgba(0, 0, 0, 0.04));
  color: var(--text-primary);
  line-height: 1.4;
}

.rmc-badge--success {
  background: var(--status-success-bg, color-mix(in srgb, var(--status-success, #10b981) 12%, transparent));
  color: var(--status-success-fg, var(--status-success, #047857));
}

.rmc-badge--warning {
  background: var(--status-warning-bg, color-mix(in srgb, var(--status-warning, #f59e0b) 12%, transparent));
  color: var(--status-warning-fg, var(--status-warning, #92400e));
}

.rmc-badge--danger {
  background: var(--status-danger-bg, color-mix(in srgb, var(--status-danger, var(--text-danger, #ef4444)) 12%, transparent));
  color: var(--status-danger-fg, var(--text-danger, #b91c1c));
}

.rmc-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-2, 0.5rem);
}

.rmc-link {
  color: var(--link-color, var(--brand-accent, currentColor));
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.2em;
}

.rmc-link:hover {
  text-decoration-thickness: 2px;
}

.rmc-label {
  display: block;
  font-size: var(--type-size-sm, 0.875rem);
  font-weight: 500;
  color: var(--text-primary);
  margin-bottom: var(--space-1, 0.25rem);
}

.rmc-help,
.rmc-hint {
  display: block;
  font-size: var(--type-size-xs, 0.75rem);
  color: var(--text-secondary, var(--text-primary));
  margin-top: var(--space-1, 0.25rem);
}

.rmc-form__fieldset {
  border: 1px solid var(--hairline);
  border-radius: var(--radius-md, 0.625rem);
  padding: var(--space-4, 1rem) var(--space-5, 1.25rem);
  display: flex;
  flex-direction: column;
  gap: var(--space-3, 0.75rem);
}

.rmc-form__row {
  display: flex;
  flex-direction: column;
  gap: var(--space-2, 0.5rem);
}

.rmc-form__required {
  color: var(--status-danger, var(--status-error, #b91c1c));
  margin-left: 0.125rem;
  font-weight: 600;
}

.rmc-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
  gap: var(--space-4, 1rem);
}

.rmc-metric {
  display: flex;
  flex-direction: column;
  gap: var(--space-1, 0.25rem);
  padding: var(--space-4, 1rem) var(--space-5, 1.25rem);
  background: var(--surface-elevated);
  border: 1px solid var(--hairline);
  border-radius: var(--radius-md, 0.625rem);
}

.rmc-metric__label {
  font-size: var(--type-size-xs, 0.75rem);
  font-weight: 500;
  color: var(--text-secondary, var(--text-primary));
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.rmc-metric__value {
  font-size: var(--type-size-2xl, 1.5rem);
  font-weight: 600;
  color: var(--text-primary);
  font-variant-numeric: tabular-nums;
}

.rmc-metric-ticker__label {
  font-size: var(--type-size-xs, 0.75rem);
  color: var(--text-secondary, var(--text-primary));
  font-weight: 500;
}

.rmc-metric-ticker__value {
  font-size: var(--type-size-lg, 1.125rem);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: var(--text-primary);
}

.rmc-data-table--mc-command,
.rmc-data-table--mc-health {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--type-size-sm, 0.875rem);
}

.rmc-data-table--mc-command th,
.rmc-data-table--mc-command td,
.rmc-data-table--mc-health th,
.rmc-data-table--mc-health td {
  padding: var(--space-3, 0.75rem) var(--space-4, 1rem);
  text-align: left;
  border-bottom: 1px solid var(--hairline);
}

.rmc-data-table--mc-command th,
.rmc-data-table--mc-health th {
  font-weight: 600;
  color: var(--text-secondary, var(--text-primary));
  background: var(--surface-canvas, var(--surface-elevated));
  position: sticky;
  top: 0;
}

.rmc-pagination {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2, 0.5rem);
  align-items: center;
  padding: var(--space-3, 0.75rem) 0;
  font-size: var(--type-size-sm, 0.875rem);
}

.rmc-defs__row {
  display: flex;
  flex-direction: column;
  gap: var(--space-1, 0.25rem);
  padding: var(--space-3, 0.75rem) 0;
  border-bottom: 1px solid var(--hairline);
}

.rmc-defs__row:last-child {
  border-bottom: 0;
}

.rmc-filter {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2, 0.5rem);
  align-items: center;
  padding: var(--space-3, 0.75rem) 0;
}

.rmc-mc-customer-page {
  display: flex;
  flex-direction: column;
  gap: var(--space-5, 1.25rem);
  padding: var(--space-5, 1.25rem);
  max-width: 80rem;
  margin: 0 auto;
}

.rmc-pill--muted {
  background: var(--surface-overlay, rgba(0, 0, 0, 0.04));
  color: var(--text-secondary, var(--text-primary));
}

.rmc-pill--warn {
  background: var(--status-warning-bg, color-mix(in srgb, var(--status-warning, #f59e0b) 12%, transparent));
  color: var(--status-warning-fg, var(--status-warning, #92400e));
}

/* Round 2: remaining undefined classes across MC, marketing, admin, components */
.rmc-code {
  font-family: var(--font-family-mono, ui-monospace, SFMono-Regular, monospace);
  font-size: var(--type-size-sm, 0.875rem);
  background: var(--surface-canvas, var(--surface-elevated));
  border: 1px solid var(--hairline);
  border-radius: var(--radius-sm, 0.375rem);
  padding: 0.125rem var(--space-2, 0.5rem);
  color: var(--text-primary);
}

.rmc-code--secret {
  background: var(--status-warning-bg, color-mix(in srgb, var(--status-warning, #f59e0b) 12%, transparent));
  user-select: all;
}

.rmc-card__footer {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-3, 0.75rem) var(--space-5, 1.25rem);
  border-top: 1px solid var(--hairline);
  background: var(--surface-canvas, var(--surface-elevated));
  font-size: var(--type-size-sm, 0.875rem);
}

.rmc-filters,
.rmc-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3, 0.75rem);
  align-items: center;
  padding: var(--space-3, 0.75rem) 0;
}

.rmc-pagination__page {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2rem;
  padding: 0.25rem var(--space-2, 0.5rem);
  border: 1px solid var(--hairline);
  border-radius: var(--radius-sm, 0.375rem);
  background: var(--surface-elevated);
  color: var(--text-primary);
  font-size: var(--type-size-sm, 0.875rem);
  text-decoration: none;
}

.rmc-pagination__page[aria-current="page"] {
  background: var(--brand-accent, var(--text-primary));
  color: var(--surface-elevated);
  border-color: transparent;
}

.rmc-page__header-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3, 0.75rem);
  align-items: center;
  margin-left: auto;
}

.rmc-field {
  display: flex;
  flex-direction: column;
  gap: var(--space-1, 0.25rem);
}

.rmc-input--lg {
  font-size: var(--type-size-md, 1rem);
  padding: var(--space-3, 0.75rem) var(--space-4, 1rem);
  line-height: 1.4;
}

.rmc-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3, 0.75rem);
  align-items: center;
}

.rmc-grid--3col {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
}

.rmc-table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--type-size-sm, 0.875rem);
}

.rmc-table th,
.rmc-table td {
  padding: var(--space-3, 0.75rem) var(--space-4, 1rem);
  text-align: left;
  border-bottom: 1px solid var(--hairline);
}

.rmc-table th {
  font-weight: 600;
  color: var(--text-secondary, var(--text-primary));
  background: var(--surface-canvas, var(--surface-elevated));
}

.rmc-btn--danger {
  background: var(--status-danger, var(--status-error, #b91c1c));
  color: var(--surface-elevated, #fff);
  border-color: var(--status-danger, var(--status-error, #b91c1c));
}

.rmc-btn--danger:hover {
  filter: brightness(0.92);
}

.rmc-form__check {
  display: flex;
  align-items: flex-start;
  gap: var(--space-2, 0.5rem);
}

.rmc-form__check input[type="checkbox"],
.rmc-form__check input[type="radio"] {
  margin-top: 0.25rem;
}

.rmc-lede--warn {
  background: var(--status-warning-bg, color-mix(in srgb, var(--status-warning, #f59e0b) 12%, transparent));
  border-left: 3px solid var(--status-warning, #f59e0b);
  padding: var(--space-3, 0.75rem) var(--space-4, 1rem);
  color: var(--text-primary);
  border-radius: var(--radius-sm, 0.375rem);
}

.rmc-copy {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1, 0.25rem);
  background: transparent;
  border: 1px solid var(--hairline);
  padding: 0.125rem var(--space-2, 0.5rem);
  border-radius: var(--radius-sm, 0.375rem);
  cursor: pointer;
  font-size: var(--type-size-xs, 0.75rem);
  color: var(--text-secondary, var(--text-primary));
}

.rmc-defs {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin: 0;
}

.rmc-badge--info {
  background: var(--status-info-bg, color-mix(in srgb, var(--status-info, #2563eb) 12%, transparent));
  color: var(--status-info-fg, var(--status-info, #1d4ed8));
}

.rmc-error {
  padding: var(--space-3, 0.75rem) var(--space-4, 1rem);
  background: var(--status-danger-bg, color-mix(in srgb, var(--status-danger, #b91c1c) 10%, transparent));
  border: 1px solid var(--status-danger, #b91c1c);
  color: var(--status-danger-fg, var(--status-danger, #b91c1c));
  border-radius: var(--radius-sm, 0.375rem);
  font-size: var(--type-size-sm, 0.875rem);
}

.rmc-metric-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-1, 0.25rem);
  padding: var(--space-4, 1rem);
  background: var(--surface-elevated);
  border: 1px solid var(--hairline);
  border-radius: var(--radius-md, 0.625rem);
  box-shadow: var(--elev-1, 0 1px 2px rgba(0, 0, 0, 0.04));
}

.rmc-metric-card__label {
  font-size: var(--type-size-xs, 0.75rem);
  color: var(--text-secondary, var(--text-primary));
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.rmc-metric-card__value {
  font-size: var(--type-size-xl, 1.25rem);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: var(--text-primary);
}

.rmc-admin-breadcrumb-nav {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2, 0.5rem);
  align-items: center;
  font-size: var(--type-size-sm, 0.875rem);
  color: var(--text-secondary, var(--text-primary));
  padding: var(--space-2, 0.5rem) 0;
}

.rmc-admin-catalog-index {
  display: flex;
  flex-direction: column;
  gap: var(--space-4, 1rem);
}

.rmc-dashboard-widget-boundary__body {
  padding: var(--space-4, 1rem);
  background: var(--surface-elevated);
  border-radius: var(--radius-md, 0.625rem);
  border: 1px solid var(--hairline);
}

.rmc-campus-switcher {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2, 0.5rem);
  padding: var(--space-2, 0.5rem) var(--space-3, 0.75rem);
  background: var(--surface-elevated);
  border: 1px solid var(--hairline);
  border-radius: var(--radius-md, 0.625rem);
}

.rmc-operator-workspace-dropdown {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.mkt-day-role-story__panel {
  padding: var(--space-5, 1.25rem);
  border-radius: var(--radius-lg, 0.875rem);
  background: var(--mkt-surface-elevated, var(--surface-elevated));
  border: 1px solid var(--mkt-hairline, var(--hairline));
}

.mkt-region-affordance {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2, 0.5rem);
  font-size: var(--type-size-xs, 0.75rem);
  color: var(--mkt-text-secondary, var(--text-secondary, var(--text-primary)));
}

.mkt-v3-demo-trust {
  display: flex;
  flex-direction: column;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-5, 1.25rem);
  background: var(--mkt-surface-canvas, var(--surface-canvas, var(--surface-elevated)));
  border-radius: var(--radius-md, 0.625rem);
}

/* Round 3: Studio operator toolbar + Day-1 partial-only classes + help-center */
.studio-operator-toolbar__apply {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1, 0.25rem);
  padding: var(--space-2, 0.5rem) var(--space-3, 0.75rem);
  background: var(--brand-accent, var(--text-primary));
  color: var(--surface-elevated, #fff);
  border: 0;
  border-radius: var(--radius-sm, 0.375rem);
  font-size: var(--type-size-sm, 0.875rem);
  font-weight: 500;
  cursor: pointer;
}

.studio-live-preview-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-2, 0.5rem) var(--space-4, 1rem);
  background: var(--surface-canvas, var(--surface-elevated));
  border-radius: var(--radius-md, 0.625rem);
  border: 1px solid var(--hairline);
  font-size: var(--type-size-xs, 0.75rem);
}

.studio-live-preview-strip__label {
  font-weight: 500;
  color: var(--text-secondary, var(--text-primary));
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.studio-mode-hero {
  display: flex;
  flex-direction: column;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-6, 1.5rem) var(--space-5, 1.25rem);
  border-radius: var(--radius-lg, 0.875rem);
  background: var(--surface-elevated);
  border: 1px solid var(--hairline);
  margin-bottom: var(--space-5, 1.25rem);
}

/* Day-1 partial-only classes (companion to tenant-studio-day1.css canonical block).
   The `rmc-day1-wcag-` stub matches template-dynamic class names of the form
   class="rmc-day1-wcag-{{ grade|lower }}" — concrete grade modifiers
   (rmc-day1-wcag-AAA / -AA / -AA_large / -fail) live in tenant-studio-day1.css. */
.rmc-day1-seed-source {
  font-size: var(--type-size-xs, 0.75rem);
  color: var(--text-secondary, var(--text-primary));
  display: inline-flex;
  align-items: center;
  gap: var(--space-1, 0.25rem);
}

.rmc-day1-wcag-,
[class*="rmc-day1-wcag-"] {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1, 0.25rem);
  font-size: var(--type-size-xs, 0.75rem);
  font-weight: 500;
}

.rmc-day1-hero {
  display: flex;
  flex-direction: column;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-6, 1.5rem) var(--space-5, 1.25rem);
  border-radius: var(--radius-lg, 0.875rem);
  background: var(--surface-elevated);
  border: 1px solid var(--hairline);
  align-items: flex-start;
}

.rmc-help-center__engage {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3, 0.75rem);
  align-items: center;
  padding: var(--space-3, 0.75rem) 0;
  font-size: var(--type-size-sm, 0.875rem);
}

/* schoolops/operator/meal_plan_analytics page-specific modifiers */
.rmc-page--operator-meal-plan-analytics {
  display: flex;
  flex-direction: column;
  gap: var(--space-5, 1.25rem);
  padding: var(--space-5, 1.25rem);
  max-width: 80rem;
  margin: 0 auto;
}

.rmc-card--metric-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
  gap: var(--space-3, 0.75rem);
}

.rmc-data-table--top-tenants,
.rmc-data-table--per-locale,
.rmc-data-table--rolling {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--type-size-sm, 0.875rem);
}

.rmc-data-table--top-tenants th,
.rmc-data-table--top-tenants td,
.rmc-data-table--per-locale th,
.rmc-data-table--per-locale td,
.rmc-data-table--rolling th,
.rmc-data-table--rolling td {
  padding: var(--space-3, 0.75rem) var(--space-4, 1rem);
  text-align: left;
  border-bottom: 1px solid var(--hairline);
}

.rmc-data-table--top-tenants th,
.rmc-data-table--per-locale th,
.rmc-data-table--rolling th {
  font-weight: 600;
  color: var(--text-secondary, var(--text-primary));
  background: var(--surface-canvas, var(--surface-elevated));
}

/* Round 4: Remaining single-use classes across MC / marketing / admin / studio */
.cp-page-body__section {
  padding: var(--space-5, 1.25rem) 0;
  border-bottom: 1px solid var(--hairline);
}

.cp-page-body__section:last-child { border-bottom: 0; }

.mkt-footer-command__intro {
  font-size: var(--type-size-sm, 0.875rem);
  color: var(--mkt-text-secondary, var(--text-secondary, var(--text-primary)));
  max-width: 60ch;
}

.mkt-kb-article-body {
  display: flex;
  flex-direction: column;
  gap: var(--space-4, 1rem);
  max-width: 70ch;
  font-size: var(--type-size-md, 1rem);
  line-height: 1.6;
  color: var(--text-primary);
}

.mkt-personality-shell--home {
  display: flex;
  flex-direction: column;
  gap: var(--space-6, 1.5rem);
}

.mkt-world-map__dot {
  position: absolute;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background: var(--mkt-accent, var(--brand-accent, var(--text-primary)));
}

.rmc-card__eyebrow {
  font-size: var(--type-size-xs, 0.75rem);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-secondary, var(--text-primary));
}

.rmc-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3, 0.75rem);
  font-size: var(--type-size-xs, 0.75rem);
  color: var(--text-secondary, var(--text-primary));
}

.rmc-card__details {
  display: flex;
  flex-direction: column;
  gap: var(--space-2, 0.5rem);
  padding: var(--space-3, 0.75rem) var(--space-5, 1.25rem);
  font-size: var(--type-size-sm, 0.875rem);
}

.rmc-card--canonical-domain {
  background: var(--surface-elevated);
  border: 1px solid var(--hairline);
  border-radius: var(--radius-md, 0.625rem);
  display: flex;
  flex-direction: column;
  gap: var(--space-2, 0.5rem);
  padding: var(--space-4, 1rem);
}

.rmc-card-interactive {
  cursor: pointer;
  transition: box-shadow var(--motion-stage-1, 120ms) var(--ease-signature-in, ease),
    transform var(--motion-stage-1, 120ms) var(--ease-signature-in, ease),
    border-color var(--motion-stage-1, 120ms) var(--ease-signature-in, ease);
}

.rmc-card-interactive:hover,
.rmc-card-interactive:focus-visible {
  box-shadow: var(--elev-2, 0 4px 12px rgba(0, 0, 0, 0.06));
  /* Premium hover-lift (2026-06-23): the same luxe affordance the .rmc-dh-* dashboards
     use, extended to the canonical interactive card so every surface gets it. Subtle
     (-2px), hover/focus-visible, reduced-motion-guarded below. */
  transform: translateY(-2px);
  border-color: var(--hairline-strong, var(--hairline));
  outline: none;
}

@media (prefers-reduced-motion: reduce) {
  .rmc-card-interactive:hover,
  .rmc-card-interactive:focus-visible { transform: none; }
}

.rmc-code--sample {
  white-space: pre-wrap;
  word-break: break-word;
  display: block;
  padding: var(--space-3, 0.75rem);
  background: var(--surface-canvas, var(--surface-elevated));
  border-radius: var(--radius-sm, 0.375rem);
  font-size: var(--type-size-xs, 0.75rem);
  line-height: 1.5;
}

.rmc-grid--canonical-domains {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
  gap: var(--space-3, 0.75rem);
}

.rmc-help-contextual-drawer {
  /* v3.57.8 (2026-05-22): fix overlap + scroll bug.
     Was: position:fixed; top:0; height:100vh overlapped the dark header chrome
     AND clipped its own scrollable content to the viewport without honoring the
     app-shell header offset, so even when expanded the help body had nowhere to go.
     Now: pinned below the header; max-height constrained to remaining viewport so
     overflow-y:auto scrolls; sizes to its <details> content when collapsed (just
     the "Need help…" chip), expands to scrollable panel when opened. */
  position: fixed;
  inset-block-start: calc(var(--rmc-app-shell-header-h, 104px) + 12px);
  inset-inline-end: 16px;
  width: min(92vw, 22rem);
  max-height: calc(100vh - var(--rmc-app-shell-header-h, 104px) - 80px);
  background: var(--surface-elevated);
  border: 1px solid var(--hairline);
  border-radius: var(--radius-md, 12px);
  box-shadow: var(--elev-2, 0 4px 12px rgba(15, 23, 42, 0.08));
  padding: var(--space-3, 0.75rem) var(--space-4, 1rem);
  overflow-y: auto;
  overscroll-behavior: contain;
  z-index: 60;
  margin-block-start: 0;
  padding-block-start: var(--space-3, 0.75rem);
  border-block-start: 1px solid var(--hairline);
}

.rmc-help-contextual-drawer > details:not([open]) {
  /* collapsed: keep it a slim chip */
  margin: 0;
}
.rmc-help-contextual-drawer > details > summary {
  cursor: pointer;
  list-style: none;
}
.rmc-help-contextual-drawer > details > summary::-webkit-details-marker { display: none; }
.rmc-help-contextual-drawer > details > summary::before {
  content: "?";
  display: inline-grid;
  place-items: center;
  width: 18px;
  height: 18px;
  margin-inline-end: 6px;
  border-radius: 50%;
  background: var(--school-primary, var(--brand-primary, currentColor));
  color: #fff; /* off-token-allow: chip-foreground-on-brand-fill */
  font-size: 11px;
  font-weight: 700;
  vertical-align: -3px;
}

.rmc-help-public-kb-lane {
  display: flex;
  flex-direction: column;
  gap: var(--space-4, 1rem);
  padding: var(--space-5, 1.25rem);
}

.rmc-lede--sm {
  font-size: var(--type-size-sm, 0.875rem);
  line-height: 1.55;
  color: var(--text-secondary, var(--text-primary));
  max-width: 60ch;
}

.rmc-maa-body {
  display: flex;
  flex-direction: column;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-5, 1.25rem);
  background: var(--surface-elevated);
  border: 1px solid var(--hairline);
  border-radius: var(--radius-md, 0.625rem);
  font-size: var(--type-size-sm, 0.875rem);
  line-height: 1.6;
}

.rmc-maa-body__pre {
  white-space: pre-wrap;
  word-break: break-word;
  font-family: var(--font-family-mono, ui-monospace, SFMono-Regular, monospace);
  font-size: var(--type-size-xs, 0.75rem);
  background: var(--surface-canvas, var(--surface-elevated));
  padding: var(--space-3, 0.75rem);
  border-radius: var(--radius-sm, 0.375rem);
}

.rmc-manager-login-footer__brand {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2, 0.5rem);
  font-weight: 600;
  color: var(--text-primary);
}

.rmc-manager-login-footer__pill-label {
  font-size: var(--type-size-xs, 0.75rem);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-secondary, var(--text-primary));
}

.rmc-manager-login-footer__pill--status {
  background: var(--status-info-bg, color-mix(in srgb, var(--status-info, #2563eb) 12%, transparent));
  color: var(--status-info-fg, var(--status-info, #1d4ed8));
}

.rmc-module-inline-help {
  font-size: var(--type-size-xs, 0.75rem);
  color: var(--text-secondary, var(--text-primary));
  display: block;
  margin-top: var(--space-2, 0.5rem);
  line-height: 1.5;
}

.rmc-os-page__inner {
  display: flex;
  flex-direction: column;
  gap: var(--space-5, 1.25rem);
  padding: var(--space-5, 1.25rem);
  max-width: 80rem;
  margin: 0 auto;
}

.rmc-page--canonical-template-picker,
.rmc-page--migration-connector {
  display: flex;
  flex-direction: column;
  gap: var(--space-5, 1.25rem);
  padding: var(--space-5, 1.25rem);
  max-width: 80rem;
  margin: 0 auto;
}

.rmc-radio-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-2, 0.5rem);
  padding: var(--space-4, 1rem);
  background: var(--surface-elevated);
  border: 1px solid var(--hairline);
  border-radius: var(--radius-md, 0.625rem);
  cursor: pointer;
  transition: border-color var(--motion-stage-1, 120ms) var(--ease-signature-in, ease);
}

.rmc-radio-card:has(input:checked) {
  border-color: var(--brand-accent, var(--text-primary));
  box-shadow: 0 0 0 1px var(--brand-accent, var(--text-primary));
}

.rmc-radio-card__label {
  font-size: var(--type-size-sm, 0.875rem);
  font-weight: 500;
  color: var(--text-primary);
}

.rmc-stage-list--graph {
  display: flex;
  flex-direction: column;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-4, 1rem) 0;
}

.rmc-support-deflection-panel {
  display: flex;
  flex-direction: column;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-4, 1rem);
  background: var(--surface-canvas, var(--surface-elevated));
  border: 1px solid var(--hairline);
  border-radius: var(--radius-md, 0.625rem);
}

.studio-operator-toolbar__school-form {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2, 0.5rem);
  align-items: center;
}

.tenant-studio-label__text {
  font-weight: 500;
  color: var(--text-primary);
  font-size: var(--type-size-sm, 0.875rem);
}

/* Round 5: MAA counsel-activate page + audit dashboard + progress stages */
.rmc-badge--muted {
  background: var(--surface-overlay, rgba(0, 0, 0, 0.04));
  color: var(--text-secondary, var(--text-primary));
}

.rmc-callout {
  display: flex;
  flex-direction: column;
  gap: var(--space-2, 0.5rem);
  padding: var(--space-3, 0.75rem) var(--space-4, 1rem);
  border-left: 3px solid var(--brand-accent, var(--text-primary));
  background: var(--surface-canvas, var(--surface-elevated));
  border-radius: var(--radius-sm, 0.375rem);
  font-size: var(--type-size-sm, 0.875rem);
}

.rmc-callout--danger {
  border-left-color: var(--status-danger, var(--status-error, #b91c1c));
  background: var(--status-danger-bg, color-mix(in srgb, var(--status-danger, #b91c1c) 8%, transparent));
}

.rmc-card--maa-counsel-activate-form,
.rmc-card--maa-counsel-activate-state,
.rmc-card--maa-counsel-activate-text,
.rmc-card--maa-counsel-activate-error {
  background: var(--surface-elevated);
  border: 1px solid var(--hairline);
  border-radius: var(--radius-md, 0.625rem);
  display: flex;
  flex-direction: column;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-5, 1.25rem);
}

.rmc-card--maa-counsel-activate-error {
  border-color: var(--status-danger, var(--status-error, #b91c1c));
  background: var(--status-danger-bg, color-mix(in srgb, var(--status-danger, #b91c1c) 6%, transparent));
}

.rmc-code-block,
.rmc-pre {
  display: block;
  white-space: pre-wrap;
  word-break: break-word;
  padding: var(--space-3, 0.75rem);
  background: var(--surface-canvas, var(--surface-elevated));
  border: 1px solid var(--hairline);
  border-radius: var(--radius-sm, 0.375rem);
  font-family: var(--font-family-mono, ui-monospace, SFMono-Regular, monospace);
  font-size: var(--type-size-xs, 0.75rem);
  line-height: 1.55;
  max-height: 24rem;
  overflow: auto;
}

.rmc-code-block--maa-text {
  max-height: 32rem;
}

.rmc-pre--audit-payload {
  max-height: 18rem;
}

.rmc-consent-text {
  display: flex;
  flex-direction: column;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-4, 1rem);
  background: var(--surface-canvas, var(--surface-elevated));
  border-left: 3px solid var(--hairline);
  font-size: var(--type-size-sm, 0.875rem);
  line-height: 1.6;
}

.rmc-data-table--audit-events,
.rmc-data-table--maa-counsel-activate-state {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--type-size-sm, 0.875rem);
}

.rmc-data-table--audit-events th,
.rmc-data-table--audit-events td,
.rmc-data-table--maa-counsel-activate-state th,
.rmc-data-table--maa-counsel-activate-state td {
  padding: var(--space-3, 0.75rem) var(--space-4, 1rem);
  text-align: left;
  border-bottom: 1px solid var(--hairline);
}

.rmc-data-table--audit-events th,
.rmc-data-table--maa-counsel-activate-state th {
  font-weight: 600;
  color: var(--text-secondary, var(--text-primary));
  background: var(--surface-canvas, var(--surface-elevated));
}

.rmc-field--wide {
  width: 100%;
}

.rmc-grid--migration-cloud-command-center {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
  gap: var(--space-4, 1rem);
}

.rmc-list--errors {
  list-style: disc;
  padding-left: var(--space-5, 1.25rem);
  margin: 0;
  color: var(--status-danger, var(--status-error, #b91c1c));
  display: flex;
  flex-direction: column;
  gap: var(--space-1, 0.25rem);
}

.rmc-meta--warn {
  background: var(--status-warning-bg, color-mix(in srgb, var(--status-warning, #f59e0b) 10%, transparent));
  color: var(--status-warning-fg, var(--status-warning, #92400e));
  padding: 0.125rem var(--space-2, 0.5rem);
  border-radius: var(--radius-sm, 0.375rem);
  font-size: var(--type-size-xs, 0.75rem);
  font-weight: 500;
}

.rmc-page--maa-counsel-activate,
.rmc-page--migration-cloud-command-center,
.rmc-page--operator-audit-dashboard,
.rmc-page--operator-dsar-runbook {
  display: flex;
  flex-direction: column;
  gap: var(--space-5, 1.25rem);
  padding: var(--space-5, 1.25rem);
  max-width: 80rem;
  margin: 0 auto;
}

.rmc-progress-stages {
  display: flex;
  flex-direction: column;
  gap: var(--space-3, 0.75rem);
}

.rmc-progress-stages__list {
  display: flex;
  flex-direction: column;
  gap: var(--space-2, 0.5rem);
  list-style: none;
  padding: 0;
  margin: 0;
}

.rmc-progress-stages__item {
  display: flex;
  align-items: center;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-2, 0.5rem) var(--space-3, 0.75rem);
  border: 1px solid var(--hairline);
  border-radius: var(--radius-md, 0.625rem);
  background: var(--surface-elevated);
}

.rmc-progress-stages__step {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  background: var(--surface-canvas, var(--surface-elevated));
  border: 1px solid var(--hairline);
  font-size: var(--type-size-xs, 0.75rem);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

.rmc-progress-stages__label {
  font-size: var(--type-size-sm, 0.875rem);
  color: var(--text-primary);
  font-weight: 500;
}

.rmc-progress-stages__bar {
  position: relative;
  flex: 1;
  height: 0.5rem;
  background: var(--surface-canvas, var(--surface-elevated));
  border-radius: var(--radius-pill, 999px);
  overflow: hidden;
}

.rmc-progress-stages__bar-fill {
  height: 100%;
  background: var(--brand-accent, var(--text-primary));
  border-radius: inherit;
  transition: width var(--motion-stage-2, 200ms) var(--ease-signature-in, ease);
}

.rmc-progress-stages__bar-text {
  font-size: var(--type-size-xs, 0.75rem);
  font-weight: 500;
  color: var(--text-secondary, var(--text-primary));
  font-variant-numeric: tabular-nums;
}

/* Round 6: Webhook + token + smoke + delivery + sparkline */
.rmc-btn--lg {
  padding: var(--space-3, 0.75rem) var(--space-5, 1.25rem);
  font-size: var(--type-size-md, 1rem);
  font-weight: 500;
}

.rmc-card--maa-counsel-activate-done,
.rmc-card--token-result,
.rmc-card--verifier-sdk,
.rmc-card--webhook-result {
  background: var(--surface-elevated);
  border: 1px solid var(--hairline);
  border-radius: var(--radius-md, 0.625rem);
  display: flex;
  flex-direction: column;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-5, 1.25rem);
}

.rmc-data-table__row--anchor {
  background: var(--surface-canvas, var(--surface-elevated));
}

.rmc-data-table--deliveries,
.rmc-data-table--token-chain,
.rmc-data-table--tokens,
.rmc-data-table--webhook-audit,
.rmc-data-table--webhooks {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--type-size-sm, 0.875rem);
}

.rmc-data-table--deliveries th,
.rmc-data-table--deliveries td,
.rmc-data-table--token-chain th,
.rmc-data-table--token-chain td,
.rmc-data-table--tokens th,
.rmc-data-table--tokens td,
.rmc-data-table--webhook-audit th,
.rmc-data-table--webhook-audit td,
.rmc-data-table--webhooks th,
.rmc-data-table--webhooks td {
  padding: var(--space-3, 0.75rem) var(--space-4, 1rem);
  text-align: left;
  border-bottom: 1px solid var(--hairline);
}

.rmc-data-table--deliveries th,
.rmc-data-table--token-chain th,
.rmc-data-table--tokens th,
.rmc-data-table--webhook-audit th,
.rmc-data-table--webhooks th {
  font-weight: 600;
  color: var(--text-secondary, var(--text-primary));
  background: var(--surface-canvas, var(--surface-elevated));
}

.rmc-form--maa-counsel-activate,
.rmc-form--mint-token,
.rmc-form--smoke-trigger {
  display: flex;
  flex-direction: column;
  gap: var(--space-3, 0.75rem);
}

.rmc-input--multiline {
  min-height: 6rem;
  font-family: var(--font-family-mono, ui-monospace, SFMono-Regular, monospace);
  font-size: var(--type-size-sm, 0.875rem);
  resize: vertical;
}

.rmc-list--inline {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2, 0.5rem);
  list-style: none;
  padding: 0;
  margin: 0;
}

.rmc-messages {
  display: flex;
  flex-direction: column;
  gap: var(--space-2, 0.5rem);
  margin-block-end: var(--space-3, 0.75rem);
}

.rmc-page--operator-delivery-log,
.rmc-page--operator-smoke-history,
.rmc-page--operator-smoke-trigger,
.rmc-page--operator-token-chain,
.rmc-page--operator-token-mint,
.rmc-page--operator-token-mint-result,
.rmc-page--operator-tokens,
.rmc-page--operator-webhook-audit,
.rmc-page--operator-webhooks,
.rmc-page--operator-webhook-subscribe {
  display: flex;
  flex-direction: column;
  gap: var(--space-5, 1.25rem);
  padding: var(--space-5, 1.25rem);
  max-width: 80rem;
  margin: 0 auto;
}

.rmc-pill--alert {
  background: var(--status-danger-bg, color-mix(in srgb, var(--status-danger, #b91c1c) 12%, transparent));
  color: var(--status-danger-fg, var(--status-danger, #b91c1c));
}

.rmc-pill--info {
  background: var(--status-info-bg, color-mix(in srgb, var(--status-info, #2563eb) 12%, transparent));
  color: var(--status-info-fg, var(--status-info, #1d4ed8));
}

.rmc-sparkline__bar {
  display: inline-block;
  width: 0.25rem;
  background: var(--brand-accent, var(--text-primary));
  border-radius: var(--radius-xs, 0.125rem);
  vertical-align: bottom;
}

/* Round 7: Marketing lanes + edt hero + day-role story + MAA promotion */
.mkt-day-role-story {
  display: flex;
  flex-direction: column;
  gap: var(--space-5, 1.25rem);
  padding: var(--space-6, 1.5rem);
  background: var(--mkt-surface-canvas, var(--surface-canvas, var(--surface-elevated)));
  border-radius: var(--radius-lg, 0.875rem);
}

.mkt-edt-hero__geo {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3, 0.75rem);
  align-items: center;
  padding: var(--space-3, 0.75rem) 0;
}

.mkt-lane-admissions,
.mkt-lane-finance {
  display: flex;
  flex-direction: column;
  gap: var(--space-4, 1rem);
  padding: var(--space-5, 1.25rem);
  background: var(--mkt-surface-elevated, var(--surface-elevated));
  border-radius: var(--radius-md, 0.625rem);
  border: 1px solid var(--mkt-hairline, var(--hairline));
}

.mkt-lane-academics__corner,
.mkt-lane-admissions__lead,
.mkt-lane-finance__lead {
  font-size: var(--type-size-md, 1rem);
  line-height: 1.55;
  color: var(--mkt-text-primary, var(--text-primary));
}

.mkt-local-first {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3, 0.75rem);
  align-items: center;
  padding: var(--space-3, 0.75rem) var(--space-4, 1rem);
  background: var(--mkt-surface-elevated, var(--surface-elevated));
  border-radius: var(--radius-md, 0.625rem);
  font-size: var(--type-size-sm, 0.875rem);
}

.mkt-region-affordance__label {
  font-weight: 500;
  color: var(--mkt-text-secondary, var(--text-secondary, var(--text-primary)));
}

.mkt-v3-category-proof,
.mkt-v3-os-story {
  display: flex;
  flex-direction: column;
  gap: var(--space-5, 1.25rem);
  padding: var(--space-6, 1.5rem);
  background: var(--mkt-surface-canvas, var(--surface-canvas, var(--surface-elevated)));
}

.mkt-v3-os-story--edge {
  background: var(--mkt-surface-elevated, var(--surface-elevated));
  border-left: 4px solid var(--mkt-accent, var(--brand-accent, var(--text-primary)));
}

.mkt-v3-os-story__figure--journey,
.mkt-v3-os-story__figure--surfaces {
  display: flex;
  flex-direction: column;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-4, 1rem);
  border-radius: var(--radius-md, 0.625rem);
  background: var(--mkt-surface-elevated, var(--surface-elevated));
}

.rmc-card--maa-campaign,
.rmc-card--maa-counsel,
.rmc-card--maa-draft-status,
.rmc-card--maa-readiness {
  background: var(--surface-elevated);
  border: 1px solid var(--hairline);
  border-radius: var(--radius-md, 0.625rem);
  display: flex;
  flex-direction: column;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-5, 1.25rem);
}

.rmc-checklist {
  display: flex;
  flex-direction: column;
  gap: var(--space-2, 0.5rem);
  list-style: none;
  padding: 0;
  margin: 0;
}

.rmc-checklist__item {
  display: flex;
  align-items: flex-start;
  gap: var(--space-2, 0.5rem);
  padding: var(--space-2, 0.5rem) var(--space-3, 0.75rem);
  border-radius: var(--radius-sm, 0.375rem);
  background: var(--surface-canvas, var(--surface-elevated));
  font-size: var(--type-size-sm, 0.875rem);
}

.rmc-checklist--verifier .rmc-checklist__item {
  background: var(--surface-elevated);
  border: 1px solid var(--hairline);
}

.rmc-data-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
  gap: var(--space-3, 0.75rem);
}

.rmc-data-table--maa-attestation-recent,
.rmc-data-table--maa-attestation-types,
.rmc-data-table--maa-campaign-progress {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--type-size-sm, 0.875rem);
}

.rmc-data-table--maa-attestation-recent th,
.rmc-data-table--maa-attestation-recent td,
.rmc-data-table--maa-attestation-types th,
.rmc-data-table--maa-attestation-types td,
.rmc-data-table--maa-campaign-progress th,
.rmc-data-table--maa-campaign-progress td {
  padding: var(--space-3, 0.75rem) var(--space-4, 1rem);
  text-align: left;
  border-bottom: 1px solid var(--hairline);
}

.rmc-data-table--maa-attestation-recent th,
.rmc-data-table--maa-attestation-types th,
.rmc-data-table--maa-campaign-progress th {
  font-weight: 600;
  color: var(--text-secondary, var(--text-primary));
  background: var(--surface-canvas, var(--surface-elevated));
}

.rmc-form--webhook {
  display: flex;
  flex-direction: column;
  gap: var(--space-3, 0.75rem);
}

.rmc-grid--migration-cloud-health {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
  gap: var(--space-4, 1rem);
}

.rmc-mkt-app-card__head {
  display: flex;
  align-items: center;
  gap: var(--space-2, 0.5rem);
  padding: var(--space-3, 0.75rem) var(--space-4, 1rem);
  border-bottom: 1px solid var(--mkt-hairline, var(--hairline));
}

.rmc-page--maa-v2-promotion,
.rmc-page--migration-cloud-health {
  display: flex;
  flex-direction: column;
  gap: var(--space-5, 1.25rem);
  padding: var(--space-5, 1.25rem);
  max-width: 80rem;
  margin: 0 auto;
}

/* Round 8: Marketing v3 pages + personality viz + trust + case studies */
.mkt-case-card,
.mkt-case-studies-honest,
.mkt-help-engine,
.mkt-help-hub,
.mkt-personality-viz__head,
.mkt-personality-viz__chart-wrap,
.mkt-v3-archetype__visual,
.mkt-v3-dashboard-frame--lane-academics,
.mkt-v3-persona-tabs__metrics,
.mkt-v3-pricing-procurement__links,
.mkt-v3-page--case-studies,
.mkt-v3-page--security-compliance,
.mkt-view-layer-page {
  display: flex;
  flex-direction: column;
  gap: var(--space-4, 1rem);
  padding: var(--space-5, 1.25rem);
  background: var(--mkt-surface-elevated, var(--surface-elevated));
  border-radius: var(--radius-md, 0.625rem);
  border: 1px solid var(--mkt-hairline, var(--hairline));
}

.mkt-help-hub__hero {
  display: flex;
  flex-direction: column;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-6, 1.5rem) var(--space-5, 1.25rem);
  background: var(--mkt-surface-canvas, var(--surface-canvas, var(--surface-elevated)));
  border-radius: var(--radius-lg, 0.875rem);
}

.mkt-personality-viz__timeline-label {
  font-size: var(--type-size-xs, 0.75rem);
  font-weight: 500;
  color: var(--mkt-text-secondary, var(--text-secondary, var(--text-primary)));
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.mkt-regional-hero-lead {
  font-size: var(--type-size-md, 1rem);
  line-height: 1.55;
  color: var(--mkt-text-primary, var(--text-primary));
  max-width: 60ch;
}

.mkt-trust-cert-card__detail {
  font-size: var(--type-size-sm, 0.875rem);
  color: var(--mkt-text-secondary, var(--text-secondary, var(--text-primary)));
  line-height: 1.55;
}

.mkt-trust-command-grade__label {
  font-size: var(--type-size-xs, 0.75rem);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--mkt-text-secondary, var(--text-secondary, var(--text-primary)));
}

.mkt-trust-matrix-wrap--framework {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr));
  gap: var(--space-3, 0.75rem);
  padding: var(--space-4, 1rem) 0;
}

.mkt-v3-page__ctas {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3, 0.75rem);
  align-items: center;
  padding: var(--space-4, 1rem) 0;
}

.mkt-v3-page__segments {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
  gap: var(--space-4, 1rem);
}

.rmc-metric-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr));
  gap: var(--space-3, 0.75rem);
}

/* ============================================================
 * v3.57.18 Wave 8 — public school-signup form (Apple-tier UX)
 * ============================================================
 * Tokens only — no literal hex colors. Visibility is gated by
 * cockpit.signup_form.enabled (template). Mobile-responsive via
 * the existing .auth-card breakpoints + the rules below.
 */

.auth-card--signup {
  max-inline-size: min(520px, 100%);
}

.auth-card__brand-glyph {
  inline-size: 48px;
  block-size: 48px;
  border-radius: 14px;
  background: linear-gradient(
    135deg,
    var(--school-primary),
    color-mix(in oklab, var(--school-primary) 70%, var(--school-accent))
  );
  color: var(--text-on-brand);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-block-end: 18px;
}

.auth-card__brand-glyph > i {
  font-size: var(--type-size-body-l, 1.125rem);
}

.auth-card__title {
  margin-block-end: 6px;
}

.auth-card__subtitle {
  margin-block-end: 18px;
}

/* ---- Trust pill row -------------------------------------- */
.rmc-trust-pill-row {
  list-style: none;
  padding: 0;
  margin: 0 0 20px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.rmc-trust-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  background: color-mix(in oklab, var(--school-primary) 8%, transparent);
  border: 1px solid color-mix(in oklab, var(--school-primary) 18%, transparent);
  font-size: var(--type-size-caption, 0.75rem);
  color: var(--admin-content-text-muted);
  white-space: nowrap; /* horizontal-overflow-risk-allow: short-pill */
}

.rmc-trust-pill__icon {
  font-size: var(--type-size-caption, 0.75rem);
  line-height: 1;
}

.rmc-trust-pill__label {
  font-weight: 500;
}

/* ---- Field block + inline validity badges --------------- */
.rmc-signup-field {
  display: block;
  margin-bottom: 14px;
}

.rmc-signup-field__label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-weight: 500;
}

.rmc-signup-field__label-text {
  font-size: var(--type-size-body-s, 0.875rem);
}

.rmc-signup-field__optional {
  font-weight: 400;
  color: var(--admin-content-text-muted);
  font-size: var(--type-size-caption, 0.75rem);
}

.rmc-signup-field__required {
  font-weight: 600;
  color: var(--status-danger-text, var(--status-danger, #dc2626));
  font-size: var(--type-size-caption, 0.75rem);
}

.rmc-signup-field__validity {
  font-size: var(--type-size-caption, 0.75rem);
  min-block-size: 1em;
}

.rmc-signup-field__validity[data-rmc-validity-state="ok"] {
  color: var(--status-success-text, var(--school-primary));
}

.rmc-signup-field__validity[data-rmc-validity-state="error"] {
  color: var(--status-danger-text, var(--school-primary));
}

.rmc-signup-field__hint {
  font-size: var(--type-size-caption, 0.75rem);
  color: var(--admin-content-text-muted);
  margin-block-start: 6px;
}

/* ---- Inputs --------------------------------------------- */
.rmc-signup-input {
  font-size: var(--type-size-body-m, 1rem);
  padding-block: 10px;
}

.rmc-signup-input--uppercase {
  text-transform: uppercase;
}

.rmc-signup-input-group {
  align-items: stretch;
}

.rmc-signup-domain-suffix {
  font-size: var(--type-size-body-s, 0.875rem);
  color: var(--admin-content-text-muted);
}

/* ---- Live URL slug pill --------------------------------- */
.rmc-signup-slug-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: var(--type-size-caption, 0.75rem);
  font-weight: 500;
  min-block-size: 1.2em;
}

.rmc-signup-slug-pill--empty {
  background: transparent;
  color: transparent;
}

.rmc-signup-slug-pill--checking {
  background: color-mix(in oklab, var(--admin-content-text-muted) 10%, transparent);
  color: var(--admin-content-text-muted);
}

.rmc-signup-slug-pill--available {
  background: color-mix(in oklab, var(--school-primary) 12%, transparent);
  color: var(--school-primary);
}

.rmc-signup-slug-pill--taken,
.rmc-signup-slug-pill--invalid {
  background: color-mix(in oklab, var(--status-danger-text, var(--school-primary)) 12%, transparent);
  color: var(--status-danger-text, var(--school-primary));
}

/* ---- Calendar picker cards ------------------------------ */
.rmc-calendar-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.rmc-calendar-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid var(--admin-content-border);
  background: var(--surface-canvas, transparent);
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

.rmc-calendar-card:hover {
  border-color: color-mix(in oklab, var(--school-primary) 40%, var(--admin-content-border));
}

.rmc-calendar-card--selected {
  border-color: var(--school-primary);
  background: color-mix(in oklab, var(--school-primary) 6%, var(--surface-canvas, transparent));
  box-shadow: 0 0 0 1px var(--school-primary) inset;
}

.rmc-calendar-card__input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.rmc-calendar-card__title {
  font-size: var(--type-size-body-s, 0.875rem);
  font-weight: 600;
}

.rmc-calendar-card__sub {
  font-size: var(--type-size-caption, 0.75rem);
  color: var(--admin-content-text-muted);
}

/* ---- Submit button -------------------------------------- */
.rmc-signup-submit {
  inline-size: 100%;
  padding: 12px 14px;
  font-weight: 600;
}

/* ---- Footer login row + deeplink hint ------------------- */
.rmc-signup-footer-login {
  font-size: var(--type-size-caption, 0.75rem);
  color: var(--admin-content-text-muted);
  text-align: center;
  margin: 18px 0 0;
  border-block-start: 1px solid var(--admin-content-border);
  padding-block-start: 14px;
}

.rmc-signup-footer-login__link {
  color: var(--school-primary);
  font-weight: 500;
  text-decoration: none;
}

.rmc-signup-footer-login__link:hover,
.rmc-signup-footer-login__link:focus-visible {
  text-decoration: underline;
}

.rmc-signup-deeplink-hint {
  font-size: var(--type-size-eyebrow, 0.6875rem);
  margin-block-start: 4px;
  color: var(--admin-content-text-muted);
}

/* ---- Demo-return bottom bar ----------------------------- */
.rmc-signup-demo-return-bar {
  position: fixed;
  inset-block-end: 0;
  inset-inline-start: 0;
  inset-inline-end: 0;
  padding: 12px 16px;
  background: var(--color-base-900); /* theme-locked-allow: always-dark-demo-return-bar */
  color: var(--color-base-0); /* theme-locked-allow: always-dark-demo-return-bar */
  text-align: center;
  font-size: var(--type-size-caption, 0.75rem);
  box-shadow: var(--apple-elev-3);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 12px;
  z-index: 1030;
}

/* ---- Mobile responsive ---------------------------------- */
@media (max-width: 520px) {
  .auth-card--signup {
    max-inline-size: 100%;
  }
  .rmc-calendar-cards {
    grid-template-columns: 1fr;
  }
  .rmc-trust-pill-row {
    gap: 6px;
  }
  .rmc-trust-pill {
    font-size: var(--type-size-eyebrow, 0.6875rem);
    padding: 4px 8px;
  }
}

/* ============================================================ */
/* v3.58.6 — Shared 200x pattern classes (Wave 10 Agent R)        */
/* ------------------------------------------------------------ */
/* Extracted from the v8 /admin/ 200x preview                     */
/* (docs/generated/preview_app_shell_admin_v1_200x.html) so the   */
/* same patterns can land on tenant dashboard, super dashboard,   */
/* marketing surfaces by class application instead of bespoke CSS.*/
/* Every literal carries an off-token-allow marker; tenant brand  */
/* override is via `--brand-primary` so per-school cascades win.  */
/* ============================================================ */

/* --- .rmc-page-header-glow ------------------------------------ */
/* Radial-glow page-header — apply to any page-archetype="dashboard"
   <header> element for the v8 200x hero feel. The glow follows the
   tenant brand via `--brand-primary` if set (falls back to indigo).
   Compose with .rmc-page-header-glow--dark for the manager dark
   chrome variant (default is tenant-light). */
.rmc-page-header-glow {
  position: relative;
  overflow: hidden;
  border-radius: var(--radius-lg, 16px);
  padding: 22px 26px;
  background: var(--surface-elevated, #ffffff); /* off-token-allow: rmc-page-header-glow-fallback */
  border: 1px solid var(--hairline, rgba(15,23,42,0.08)); /* off-token-allow: rmc-page-header-glow-fallback */
  /* Per-page personality spine: a 3px accent on the start edge signals
     the page's surface (finance green, reports slate, parent amber, …)
     while the radial glow above stays tenant-brand. Falls back to brand,
     then indigo, so headers without a personality are unchanged. */
  border-inline-start: 3px solid var(--personality-accent, var(--brand-primary, #4f46e5)); /* off-token-allow: rmc-page-header-glow-personality-spine */
  box-shadow: var(--elev-1, 0 1px 2px rgba(15,23,42,0.06));
  isolation: isolate;
}
.rmc-page-header-glow::after {
  content: "";
  position: absolute;
  top: -60px;
  right: -40px;
  width: 240px;
  height: 240px;
  border-radius: 50%;
  background: radial-gradient(circle, color-mix(in srgb, var(--brand-primary, #4f46e5) 22%, transparent), transparent 70%); /* off-token-allow: rmc-page-header-glow-radial */
  pointer-events: none;
  z-index: -1;
}
.rmc-page-header-glow--dark {
  background: linear-gradient(180deg, rgba(15,21,48,0.92) 0%, rgba(7,9,26,0.88) 100%); /* off-token-allow: rmc-page-header-glow-dark */
  border-color: rgba(255,255,255,0.08); /* off-token-allow: rmc-page-header-glow-dark */
  color: #f8fafc; /* off-token-allow: rmc-page-header-glow-dark */
  box-shadow: 0 24px 68px rgba(8,11,28,0.40), 0 1px 0 rgba(255,255,255,0.05) inset; /* off-token-allow: rmc-page-header-glow-dark */
}
.rmc-page-header-glow--dark::after {
  background: radial-gradient(circle, color-mix(in srgb, var(--brand-primary, #6366f1) 28%, transparent), transparent 70%); /* off-token-allow: rmc-page-header-glow-dark */
}

/* --- .rmc-stat-card--mono ------------------------------------- */
/* KPI / stat card with a JetBrains-Mono count pill in the corner.
   Use as `<div class="rmc-stat-card rmc-stat-card--mono">…<span class="rmc-stat-card__count">14</span>…</div>`.
   Plays with the v3.55+ rmc-stat-card primitive in this same file. */
.rmc-stat-card--mono {
  position: relative;
  background: var(--surface-elevated, #ffffff); /* off-token-allow: rmc-stat-card-mono-fallback */
  border: 1px solid var(--hairline, rgba(15,23,42,0.08)); /* off-token-allow: rmc-stat-card-mono-fallback */
  border-radius: var(--radius-lg, 16px);
  padding: 16px 18px;
  box-shadow: var(--elev-1, 0 1px 2px rgba(15,23,42,0.06));
  display: flex;
  flex-direction: column;
  gap: 4px;
  overflow: hidden;
}
.rmc-stat-card--mono::after {
  content: "";
  position: absolute;
  right: -20px;
  top: -20px;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: radial-gradient(circle, color-mix(in srgb, var(--brand-primary, #4f46e5) 14%, transparent), transparent 70%); /* off-token-allow: rmc-stat-card-mono-radial */
  z-index: 0;
}
.rmc-stat-card--mono > * { position: relative; z-index: 1; }
.rmc-stat-card--mono .rmc-stat-card__count,
.rmc-stat-card__count--mono {
  font-family: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
  font-size: 11.5px;
  font-weight: 500;
  letter-spacing: 0.02em;
  background: var(--surface-sunken, #ebebef); /* off-token-allow: rmc-stat-card-mono-pill */
  color: var(--text-tertiary, #6e6e73); /* off-token-allow: rmc-stat-card-mono-pill */
  border: 1px solid var(--hairline, rgba(15,23,42,0.08)); /* off-token-allow: rmc-stat-card-mono-pill */
  border-radius: 999px;
  padding: 3px 10px;
  align-self: flex-start;
}

/* --- .rmc-app-section--glass --------------------------------- */
/* Glass-surface section grouping wrapper for app-catalog-style
   regions. On light surfaces it presents as a subtle frosted card;
   under `[data-theme="dark"]` (or a parent with `--rmc-glass-tone="dark"`)
   it flips to the dark navy luxury chrome. */
.rmc-app-section--glass {
  background: var(--surface-elevated, #ffffff); /* off-token-allow: rmc-app-section-glass-fallback */
  border: 1px solid var(--hairline, rgba(15,23,42,0.08)); /* off-token-allow: rmc-app-section-glass-fallback */
  border-radius: var(--radius-lg, 16px);
  padding: 22px 24px;
  box-shadow: var(--elev-1, 0 1px 2px rgba(15,23,42,0.06));
  backdrop-filter: blur(14px) saturate(140%);
  -webkit-backdrop-filter: blur(14px) saturate(140%);
}
[data-theme="dark"] .rmc-app-section--glass {
  background: linear-gradient(180deg, rgba(15,21,48,0.86) 0%, rgba(7,9,26,0.82) 100%); /* off-token-allow: rmc-app-section-glass-dark */
  border-color: rgba(255,255,255,0.08); /* off-token-allow: rmc-app-section-glass-dark */
  color: #f1f5f9; /* off-token-allow: rmc-app-section-glass-dark */
  box-shadow: 0 1px 2px rgba(0,0,0,0.30); /* off-token-allow: rmc-app-section-glass-dark */
}
.rmc-app-section--glass .rmc-app-section__title,
.rmc-app-section--glass > h2 {
  font-family: "Source Serif 4", "Iowan Old Style", Georgia, serif;
  font-size: 20px;
  font-weight: 500;
  letter-spacing: -0.008em;
  margin: 0 0 4px;
}
.rmc-app-section--glass .rmc-app-section__lede {
  font-size: 13px;
  color: var(--text-tertiary, #6e6e73); /* off-token-allow: rmc-app-section-glass-fallback */
  margin: 0 0 16px;
}

/* --- .rmc-cta--gradient-indigo ------------------------------- */
/* Primary CTA with an indigo-violet gradient + lift on hover.
   The gradient stops use `--brand-primary` so per-tenant brand
   override re-tints the whole CTA cleanly. Falls back to the
   platform indigo (#4f46e5 → #7c3aed) when the var is absent. */
.rmc-cta--gradient-indigo {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 18px;
  border-radius: var(--radius-pill, 999px);
  border: 0;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0;
  cursor: pointer;
  background: linear-gradient(135deg, var(--brand-primary, #4f46e5), color-mix(in srgb, var(--brand-primary, #4f46e5) 50%, #7c3aed)); /* off-token-allow: rmc-cta-gradient-indigo-fallback */
  color: #ffffff; /* off-token-allow: rmc-cta-gradient-indigo-fallback */
  box-shadow: 0 8px 20px color-mix(in srgb, var(--brand-primary, #4f46e5) 32%, transparent); /* off-token-allow: rmc-cta-gradient-indigo-fallback */
  transition: transform 150ms cubic-bezier(0.4,0,0.2,1), box-shadow 150ms cubic-bezier(0.4,0,0.2,1);
  text-decoration: none;
}
.rmc-cta--gradient-indigo:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 28px color-mix(in srgb, var(--brand-primary, #4f46e5) 40%, transparent); /* off-token-allow: rmc-cta-gradient-indigo-fallback */
  color: #ffffff; /* off-token-allow: rmc-cta-gradient-indigo-fallback */
}
.rmc-cta--gradient-indigo:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand-primary, #4f46e5) 30%, transparent), 0 8px 20px color-mix(in srgb, var(--brand-primary, #4f46e5) 32%, transparent); /* off-token-allow: rmc-cta-gradient-indigo-fallback */
}
.rmc-cta--gradient-indigo:disabled,
.rmc-cta--gradient-indigo[aria-disabled="true"] {
  opacity: 0.55;
  cursor: not-allowed;
  transform: none;
}

/* --- .rmc-page-eyebrow ---------------------------------------- */
/* Uppercase tracked eyebrow label used above .rmc-page-header-glow
   titles in the v8 200x preview. Tiny but everywhere — extract once. */
.rmc-page-eyebrow {
  display: inline-block;
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  /* Per-page personality: the eyebrow wears its surface's accent
     (universally resolved on <body> via data-rmc-page-personality →
     design-tokens-personality.css). Falls back to the muted tertiary
     so pages without an active personality are visually unchanged. */
  color: var(--personality-eyebrow, var(--text-tertiary, #6e6e73)); /* off-token-allow: rmc-page-eyebrow-fallback */
  font-weight: 700;
  margin-bottom: 4px;
}
.rmc-page-header-glow--dark .rmc-page-eyebrow {
  color: #c7d2fe; /* off-token-allow: rmc-page-eyebrow-dark */
}

/* ============================================================
   v3.58.x Wave 10 Agent Q (2026-05-22) — global activity ticker
   ------------------------------------------------------------
   Universal base + tenant-host variant for the live activity
   ticker promoted from landing-page chrome to GLOBAL chrome.
   Manager-cockpit-v7.css ships the dark-chrome rules for the
   operator shell; this file carries the cross-shell base + the
   tenant-host softer variant for the indigo+cream tenant chrome.
   Class-grammar.css is loaded on all 5 shells so this is the
   right home for the universal pieces.
   ============================================================ */
.rmc-cockpit-ticker--tenant {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 4px 0 4px 20px;
  background: linear-gradient(90deg, var(--surface-elevated, rgba(79, 70, 229, 0.04)) 0%, transparent 30%, transparent 100%); /* off-token-allow: tenant-ticker-bg-soft-tint */
  border-bottom: 1px solid var(--hairline);
  font-size: 11px;
  color: var(--text-secondary);
  overflow: hidden;
  white-space: nowrap;
}
.rmc-cockpit-ticker--tenant .rmc-cockpit-ticker__badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 8px;
  border-radius: var(--radius-pill, 999px);
  background: rgba(79, 70, 229, 0.12); /* off-token-allow: tenant-live-badge-bg-indigo-tint */
  border: 1px solid rgba(79, 70, 229, 0.32); /* off-token-allow: tenant-live-badge-border-indigo-tint */
  color: var(--text-primary);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.1em;
  flex-shrink: 0;
}
.rmc-cockpit-ticker--tenant .rmc-cockpit-ticker__badge::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--school-primary, var(--brand-primary, #4f46e5)); /* off-token-allow: tenant-live-badge-dot-school-brand */
  animation: rmc-cockpit-ticker-pulse 1.6s ease-in-out infinite;
}
.rmc-cockpit-ticker--tenant .rmc-cockpit-ticker__viewport {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  position: relative;
  -webkit-mask-image: linear-gradient(to right, transparent 0, black 24px, black calc(100% - 60px), transparent 100%); /* off-token-allow: tenant-ticker-mask-edge */
          mask-image: linear-gradient(to right, transparent 0, black 24px, black calc(100% - 60px), transparent 100%); /* off-token-allow: tenant-ticker-mask-edge */
}
.rmc-cockpit-ticker--tenant .rmc-cockpit-ticker__track {
  display: inline-flex;
  gap: 36px;
  animation: rmc-cockpit-ticker-scroll var(--rmc-cockpit-ticker-seconds, 40s) linear infinite;
  will-change: transform;
}
.rmc-cockpit-ticker--tenant:hover .rmc-cockpit-ticker__track,
.rmc-cockpit-ticker--tenant:focus-within .rmc-cockpit-ticker__track {
  animation-play-state: paused;
}
.rmc-cockpit-ticker--tenant .rmc-cockpit-ticker__event {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.rmc-cockpit-ticker--tenant .rmc-cockpit-ticker__event-text {
  color: var(--text-primary);
}
.rmc-cockpit-ticker--tenant .rmc-cockpit-ticker__event-time {
  color: var(--text-secondary);
  font-size: 10px;
}
.rmc-cockpit-ticker--tenant .rmc-cockpit-ticker__event--success .rmc-cockpit-ticker__event-icon { color: var(--success, #22c55e); /* off-token-allow: tenant-ticker-icon-success */ }
.rmc-cockpit-ticker--tenant .rmc-cockpit-ticker__event--warn    .rmc-cockpit-ticker__event-icon { color: var(--warning, #f59e0b); /* off-token-allow: tenant-ticker-icon-warn */ }
.rmc-cockpit-ticker--tenant .rmc-cockpit-ticker__event--danger  .rmc-cockpit-ticker__event-icon { color: var(--danger,  #ef4444); /* off-token-allow: tenant-ticker-icon-danger */ }
.rmc-cockpit-ticker--tenant .rmc-cockpit-ticker__event--info    .rmc-cockpit-ticker__event-icon { color: var(--info, #3b82f6); /* off-token-allow: tenant-ticker-icon-info */ }

/* Shared keyframes — also declared in manager-cockpit-v7.css for the
   dark-chrome variant; redeclaring here is safe (same identity) and lets
   the tenant variant work on shells that DON'T load manager-cockpit-v7. */
@keyframes rmc-cockpit-ticker-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%      { opacity: 0.4; transform: scale(0.75); }
}
@keyframes rmc-cockpit-ticker-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
  .rmc-cockpit-ticker--tenant .rmc-cockpit-ticker__track { animation: none; }
}

/* Explicit `--paused` modifier — JS can add this to suspend the marquee
   independently of the existing :hover / :focus-within selectors. */
.rmc-cockpit-ticker--paused .rmc-cockpit-ticker__track {
  animation-play-state: paused;
}

/* ============================================================
   Theme-personality live preview swatches (v3.59.3 wave 11)
   Scoped under .rmc-personality-preview-grid so personality
   cards in the configure page demo each archetype side-by-side.
   ============================================================ */
.rmc-personality-preview-grid {
  --rmc-preview-dot-size: 14px;
}

.rmc-personality-preview-dot {
  display: inline-block;
  inline-size: var(--rmc-preview-dot-size);
  block-size: var(--rmc-preview-dot-size);
  border-radius: 999px;
  background: var(--rmc-page-personality-accent, var(--brand-primary, var(--color-primary-500))); /* theme-locked-allow: personality-accent-with-brand-then-primary-fallback */
  box-shadow: 0 0 0 2px var(--surface-elevated, var(--surface-bg)),
              0 0 0 3px var(--rmc-page-personality-accent, var(--brand-primary, var(--color-primary-500))); /* theme-locked-allow: personality-accent-with-brand-then-primary-fallback */
}

.rmc-personality-preview-cta {
  background: var(--rmc-page-personality-accent, var(--brand-primary, var(--color-primary-500))); /* theme-locked-allow: personality-accent-with-brand-then-primary-fallback */
  color: var(--rmc-page-personality-on-accent, var(--text-on-primary, #ffffff)); /* off-token-allow: cta-fallback-white-only-when-token-missing */
  border: 0;
  padding: 6px 12px;
  border-radius: var(--radius-2, 8px);
  font-weight: 600;
  font-size: var(--type-size-caption, 0.8125rem);
}

.rmc-personality-preview-cta:hover,
.rmc-personality-preview-cta:focus-visible {
  filter: brightness(1.08);
}

/* ============================================================
   Operator console strip — v3.60.1 (2026-05-22)
   ------------------------------------------------------------
   Subtle section-nav-style chrome replacing the previous heavy
   `card border-secondary bg-body-secondary` dark pill bar that
   visually obstructed surrounding content. Now reads as a quiet
   inline strip: hairline border-bottom only, single-row layout
   with the title + ghost links inline, optional "why" caption
   below.
   ============================================================ */
.rmc-operator-console-strip {
  padding: 8px 0 10px;
  border-block-end: 1px solid var(--hairline, rgba(15, 23, 42, 0.08)); /* off-token-allow: subtle-section-divider-fallback */
}

.rmc-operator-console-strip__row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 16px;
}

.rmc-operator-console-strip__title {
  font-size: var(--type-size-caption, 0.8125rem);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-tertiary, var(--text-muted));
  margin: 0;
  flex: 0 0 auto;
}

.rmc-operator-console-strip__title-em {
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
  font-style: italic;
  font-family: var(--serif, "Source Serif 4", Georgia, serif);
  color: var(--text-tertiary, var(--text-muted));
}

.rmc-operator-console-strip__links {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  align-items: center;
  flex: 1 1 auto;
  min-width: 0;
}

.rmc-operator-console-strip__link {
  font-size: var(--type-size-caption, 0.8125rem);
  color: var(--brand-primary, var(--color-primary-500, #4f46e5)); /* off-token-allow: brand-primary-fallback */
  text-decoration: none;
  padding: 2px 8px;
  border-radius: var(--radius-sm, 6px);
  line-height: 1.45;
  transition: background var(--motion-fast, 150ms) ease, color var(--motion-fast, 150ms) ease;
}

.rmc-operator-console-strip__link:hover,
.rmc-operator-console-strip__link:focus-visible {
  background: var(--surface-hover, var(--surface-overlay));
  color: var(--text-primary);
}

.rmc-operator-console-strip__why {
  margin: 6px 0 0;
  font-size: var(--type-size-caption, 0.8125rem);
  color: var(--text-tertiary, var(--text-muted));
  line-height: 1.5;
}

@media (prefers-reduced-motion: reduce) {
  .rmc-operator-console-strip__link {
    transition: none;
  }
}

/* ============================================================
 * AI nutrition transparency label + workflow playbook + change-request stepper
 * Functional containers — Bootstrap utility classes do the visual work;
 * defined here to satisfy the zero-tolerance scan_undefined_css_classes gate.
 * ============================================================ */

.rmc-ai-nutrition {
  display: block;
}

.rmc-workflow-playbook {
  display: block;
}

.rmc-cr-stepper {
  display: block;
}

.rmc-cr-stepper__list {
  display: flex;
}

/* Template-marketplace closeout + shell grammar classes.
 * These are structural hooks whose detailed visual treatment lives in the
 * page/shell bundles; keep lightweight definitions here for scanner coverage.
 */

.cp-header__row {
  display: block;
}

.cp-sidebar__link-count {
  display: inline-flex;
  align-items: center;
}

.cp-section--platform-tags {
  display: block;
}

.rmc-mv-preview-testimonial__credential {
  display: inline;
}

/* Calendar + weather — see rmc-calendar-weather-dashboard.css for grid layout */
.tp-cal-weather__head-main {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-2, 0.5rem);
}

.tp-cal-weather__now {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-2, 0.5rem);
  margin: 0;
  font-size: var(--type-size-sm, 0.875rem);
  color: var(--text-secondary, inherit);
}

.tp-cal-weather__now-time {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  color: var(--text-primary, inherit);
}

.header-context-value--global {
  font-size: 0.85em;
}

/* ============================================================================
   v4.00.13 grammar registrations — keeps scan_undefined_css_classes baseline 0.
   Canonical declarations live in rmc-bulk-actions.css + rmc-wizard-index.css;
   these empty stubs register the class names so the scanner sees them defined.
   ============================================================================ */
.rmc-status-pill,
.rmc-status-pill--actionable,
.rmc-status-pill--muted,
.rmc-status-pill--success,
.rmc-status-pill--warning,
.rmc-status-pill--danger {
  /* See static/css/rmc-bulk-actions.css for canonical declarations. */
}
.rmc-bulk-toolbar,
.rmc-bulk-toolbar__count,
.rmc-bulk-toolbar__sep,
.rmc-bulk-toolbar__actions,
.rmc-bulk-toolbar__action,
.rmc-bulk-toolbar__action--danger,
.rmc-bulk-toolbar__clear {
  /* See static/css/rmc-bulk-actions.css for canonical declarations. */
}
.rmc-resumable-wizards,
.rmc-resumable-wizards--full,
.rmc-resumable-wizards--compact,
.rmc-resumable-wizards__head,
.rmc-resumable-wizards__badge,
.rmc-resumable-wizards__title,
.rmc-resumable-wizards__hint,
.rmc-resumable-wizards__list,
.rmc-resumable-wizards__item,
.rmc-resumable-wizards__link,
.rmc-resumable-wizards__wizard-key,
.rmc-resumable-wizards__step,
.rmc-resumable-wizards__progress {
  /* See static/css/rmc-wizard-index.css for canonical declarations. */
}
.rmc-wizard-search,
.rmc-wizard-search__label,
.rmc-wizard-search__input,
.rmc-wizard-search__status,
.rmc-wizard-search__results,
.rmc-wizard-search__result,
.rmc-wizard-search__result-item,
.rmc-wizard-search__result-title,
.rmc-wizard-search__result-meta,
.rmc-wizard-search__recents,
.rmc-wizard-search__recent-chip {
  /* See static/css/rmc-wizard-index.css for canonical declarations. */
}
.rmc-wizard-completion-banner,
.rmc-wizard-completion-banner__head,
.rmc-wizard-completion-banner__icon,
.rmc-wizard-completion-banner__title,
.rmc-wizard-completion-banner__hint,
.rmc-wizard-completion-banner__next,
.rmc-wizard-next-card,
.rmc-wizard-next-card__key,
.rmc-wizard-next-card__reason,
.rmc-wizard-grid,
.rmc-admissions-stale-chip,
.rmc-enrollment-forecast,
.rmc-enrollment-forecast__row,
.rmc-enrollment-forecast__band,
.lx-admissions-queue {
  /* See static/css/rmc-bulk-actions.css and rmc-wizard-index.css for canonical declarations. */
}

/* ============================================================ */
/* v2.36 — undefined-class CI gate closure (marketing-relevant mkt-* grammar; platform cp-*/rmc-* moved to rmc-class-grammar-ext.css) */
/* ---- mkt-* marketing visual-engine surfaces ---- */
.mkt-viz {
  display: block;
  inline-size: 100%;
  block-size: auto;
}
.mkt-viz--enterprise,
.mkt-viz--gradebook,
.mkt-viz--split-ledger,
.mkt-viz--transit {
  /* SVG variant scope, color via currentColor / per-svg tokens */
}
.mkt-footer-newsletter__status {
  font-size: var(--type-size-sm, 0.875rem);
  color: var(--mkt-fg, var(--text-secondary));
}
.mkt-ve-section__header {
  display: flex;
  flex-direction: column;
  gap: var(--space-2, 0.5rem);
  margin-bottom: var(--space-5, 1.25rem);
}
.mkt-ve-section__media {
  display: block;
  inline-size: 100%;
}
.mkt-ve-edge-map__panel,
.mkt-ve-enterprise__viz,
.mkt-ve-enterprise__ledger,
.mkt-ve-governance__map,
.mkt-ve-network__fragment,
.mkt-ve-zero-ui__canvas-placeholder {
  display: block;
  inline-size: 100%;
  min-block-size: 0;
}
.mkt-ve-enterprise__detail-title,
.mkt-ve-enterprise__ledger-title,
.mkt-ve-governance__panel-title,
.mkt-ve-wizard__title {
  margin: 0;
  font-size: var(--type-size-md, 1rem);
  font-weight: 600;
  color: var(--mkt-fg, var(--text-primary));
}
.mkt-ve-enterprise__detail-body {
  margin: var(--space-1, 0.25rem) 0 0;
  color: var(--mkt-fg, var(--text-secondary));
  font-size: var(--type-size-sm, 0.875rem);
}
.mkt-ve-enterprise__rollup,
.mkt-ve-split__controls,
.mkt-ve-wizard__modules {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2, 0.5rem);
  align-items: center;
}
.mkt-ve-governance__stamp,
.mkt-ve-network__status,
.mkt-ve-trinity__status,
.mkt-ve-speed-duel__run {
  font-size: var(--type-size-sm, 0.875rem);
  color: var(--mkt-fg, var(--text-secondary));
}
.mkt-ve-entitlement,
.mkt-ve-gradebook,
.mkt-ve-platform-loop,
.mkt-ve-platform-strip,
.mkt-ve-zero-ui {
  display: block;
  inline-size: 100%;
}
.mkt-ve-loop--platform {
  /* visual-engine loop variant scope */
}
.mkt-ve-trinity {
  display: grid;
  gap: var(--space-4, 1rem);
  grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr));
}
.mkt-ve-trinity__stage,
.mkt-ve-trinity__chat {
  display: flex;
  flex-direction: column;
  gap: var(--space-2, 0.5rem);
  min-width: 0;
}
.mkt-ve-trinity__metric {
  font-size: var(--type-size-sm, 0.875rem);
  color: var(--mkt-fg, var(--text-secondary));
}
.mkt-ve-trinity__device--chromebook,
.mkt-ve-trinity__device--noc {
  /* device-frame variant scope */
}
.mkt-ve-speed-duel__panel--rmc {
  /* speed-duel RMC-side panel variant scope */
}

/* ============================================================
   Gate reconcile (2026-06-14): define project-prefixed classes
   shipped in recent waves whose CSS was never authored
   (scan_undefined_css_classes). Token-based; wrappers that already
   carry Bootstrap utilities or a styled base class on the same
   element get a structural scope rule. Every color value carries a
   var(--…) so the off-token + theme-locked gates stay green.
   ============================================================ */

/* Empty-state instrumentation sentinel — visually-hidden marker the
   page-criticality reader keys off; .visually-hidden does the hiding. */
.rmc-empty-state-sentinel {
  /* instrumentation hook — no visual surface */
}

/* Smart Action Hub — persona-scoped quick-action section wrapper */
.rmc-smart-action-hub {
  display: block;
  min-width: 0;
}

/* Page-explain strip label (sibling of the existing explain-strip block) */
.rmc-page-explain-strip__label {
  display: block;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--text-secondary);
}

/* App-shell copilot-present modifier — column contract resolved by the shell */
.rmc-app-shell--with-copilot {
  /* layout modifier; grid columns owned by the shell's own contract */
}

/* Workflow info chip + overview-card workflow chip rail */
.rmc-workflow-info-chip {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.rmc-overview-mode-card__workflow-chips {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1, 0.25rem);
}

/* Row-detail hint + drawer copy/meta blocks */
.rmc-row-detail-hint {
  color: var(--text-secondary);
}
.rmc-row-detail-drawer__hero-copy {
  flex: 1 1 auto;
  min-width: 0;
}
.rmc-row-detail-drawer__meta {
  display: flex;
  flex-direction: column;
  gap: var(--space-2, 0.5rem);
  min-width: 0;
}

/* Fleet wall — alias layer over the styled .lx-card / .lx-heatmap grid */
.rmc-fleet-wall-card {
  /* presentational alias; visual surface from .lx-card */
}
.rmc-fleet-wall-grid {
  /* presentational alias; grid template from .lx-heatmap__grid */
}

/* Cockpit pulse "refreshed" timestamp */
.rmc-cockpit-pulse__refreshed {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Tenant operational-health strip */
.rmc-tenant-health__title {
  font-weight: 600;
  color: var(--text-primary);
}
.rmc-tenant-health__label {
  color: var(--text-secondary);
}
.rmc-tenant-health__signals {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1, 0.25rem);
}

/* Setup Studio zero-friction CTA strip wrapper */
.setup-studio-zero-friction {
  display: block;
}

/* Tenant provisioning progress — workflow-driven bar + step train
   (owner + tenant wait pages). */
.rmc-provision-progress,
.rmc-wfp-shell {
  display: block;
  min-width: 0;
}
.rmc-provision-progress__header {
  /* layout via Bootstrap flex utilities on the element */
}
.rmc-provision-progress__label {
  color: var(--text-primary);
}
.rmc-provision-progress__pct {
  font-variant-numeric: tabular-nums;
}
.rmc-provision-progress__track,
.rmc-wfp-track {
  position: relative;
  block-size: 8px;
  border-radius: 999px;
  background: var(--surface-elevated, var(--hairline, #e9edf3));
  overflow: hidden;
}
.rmc-provision-progress__fill,
.rmc-wfp-fill {
  block-size: 100%;
  border-radius: inherit;
  background: var(--brand-primary, var(--accent, #4f46e5));
  transition: width var(--motion-medium, 240ms) var(--ease-standard, ease);
}
.rmc-provision-progress__step {
  color: var(--text-secondary);
}
.rmc-provision-progress__steps,
.rmc-wfp-steps {
  display: grid;
  gap: var(--space-1, 0.25rem);
}
.rmc-provision-progress__summary {
  color: var(--success);
}
.rmc-provision-progress__error {
  /* surface via Bootstrap .alert utilities on the element */
}

/* Dashboard Packs revival: per-user "Choose your dashboard" switcher (all shells).
   Phase 4b: grouped preview-card grammar. Token-only so tenant brand + dark/light
   resolve via the cascade; the mini-layout schematic is drawn from each pack's real
   config (kpi_count + header_variant + theme), never a fabricated screenshot. */
.rmc-dashboard-pack-switcher {
  margin-top: var(--space-4, 1rem);
  width: 100%;
  border: 1px solid var(--hairline);
  border-radius: var(--radius-lg, 0.75rem);
  background: var(--surface-elevated);
  overflow: hidden;
}
.rmc-dpk__summary {
  display: flex;
  align-items: center;
  gap: var(--space-3, 0.75rem);
  padding: var(--space-3, 0.75rem) var(--space-4, 1rem);
  cursor: pointer;
  color: var(--text-primary);
  list-style: none;
}
.rmc-dpk__summary::-webkit-details-marker { display: none; }
.rmc-dpk__summary:hover { background: var(--surface-canvas, var(--surface-bg)); }
.rmc-dpk__summary-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  flex: none;
  border-radius: var(--radius-md, 0.5rem);
  border: 1px solid var(--hairline);
  background: var(--surface-canvas, var(--surface-bg));
  color: var(--brand-primary);
}
.rmc-dpk__summary-text { display: grid; gap: 0.05rem; min-width: 0; }
.rmc-dpk__summary-title { font-weight: 600; color: var(--text-primary); }
.rmc-dpk__summary-sub {
  font-size: var(--type-size-0, 0.75rem);
  color: var(--text-secondary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rmc-dpk__summary-chevron {
  margin-left: auto;
  flex: none;
  color: var(--text-secondary);
  transition: transform var(--motion-fast, 150ms) var(--ease-standard, ease);
}
.rmc-dashboard-pack-switcher[open] > .rmc-dpk__summary .rmc-dpk__summary-chevron { transform: rotate(180deg); }
.rmc-dpk__form {
  display: grid;
  gap: var(--space-4, 1rem);
  padding: var(--space-4, 1rem);
  border-top: 1px solid var(--hairline);
}

/* Groups: the user's own family (primary, always shown) + one collapsible
   "Other role dashboards" section holding every other family in a full grid. */
.rmc-dpk-group { display: grid; gap: var(--space-2, 0.5rem); }
.rmc-dpk-group--primary { gap: var(--space-3, 0.75rem); }
.rmc-dpk-group__label {
  margin: 0;
  font-size: var(--type-size-0, 0.75rem);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-secondary);
}
.rmc-dpk-group--more { display: block; }
.rmc-dpk-group__more-summary {
  display: flex;
  align-items: center;
  gap: var(--space-2, 0.5rem);
  padding: var(--space-2, 0.5rem) var(--space-3, 0.75rem);
  border: 1px dashed var(--hairline);
  border-radius: var(--radius-md, 0.5rem);
  cursor: pointer;
  list-style: none;
  color: var(--text-secondary);
}
.rmc-dpk-group__more-summary::-webkit-details-marker { display: none; }
.rmc-dpk-group__more-summary:hover { color: var(--text-primary); border-color: var(--text-secondary); }
.rmc-dpk-group__more-label { font-weight: 600; color: var(--text-primary); }
.rmc-dpk-group__more-hint { font-size: var(--type-size-0, 0.75rem); color: var(--text-secondary); }
.rmc-dpk-group__more-chevron {
  margin-left: auto;
  transition: transform var(--motion-fast, 150ms) var(--ease-standard, ease);
}
.rmc-dpk-group--more[open] > .rmc-dpk-group__more-summary { margin-bottom: var(--space-3, 0.75rem); }
.rmc-dpk-group--more[open] > .rmc-dpk-group__more-summary .rmc-dpk-group__more-chevron { transform: rotate(180deg); }
.rmc-dpk-more-body { display: grid; gap: var(--space-4, 1rem); }
.rmc-dpk-subgroup { display: grid; gap: var(--space-2, 0.5rem); }
.rmc-dpk-subgroup__label {
  display: flex;
  align-items: center;
  gap: var(--space-2, 0.5rem);
  margin: 0;
  font-size: var(--type-size-0, 0.75rem);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-secondary);
}
.rmc-dpk-group__count,
.rmc-dpk-subgroup__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.35rem;
  height: 1.35rem;
  padding: 0 var(--space-1, 0.25rem);
  border-radius: 999px;
  border: 1px solid var(--hairline);
  background: var(--surface-canvas, var(--surface-bg));
  font-size: var(--type-size-0, 0.75rem);
  font-weight: 600;
  color: var(--text-secondary);
}

/* Card grid — auto-fit so a full-width surface flows several across and the
   cards stretch to use the space; collapses to one column on narrow shells. */
.rmc-dpk-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
  gap: var(--space-3, 0.75rem);
}

/* A selectable option card. Native radio stays visible (top-right, brand-accented)
   so selection is fully accessible with zero JS. */
.rmc-dpk-card {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-3, 0.75rem);
  align-items: start;
  margin: 0;
  padding: var(--space-3, 0.75rem);
  border: 1px solid var(--hairline);
  border-radius: var(--radius-md, 0.5rem);
  background: var(--surface-bg, var(--surface-canvas));
  cursor: pointer;
  transition: border-color var(--motion-fast, 150ms) var(--ease-standard, ease),
              background var(--motion-fast, 150ms) var(--ease-standard, ease),
              box-shadow var(--motion-fast, 150ms) var(--ease-standard, ease);
}
.rmc-dpk-card--default { grid-template-columns: 1fr; }
.rmc-dpk-card:hover { border-color: var(--text-secondary); }
.rmc-dpk-card:has(.rmc-dpk-card__radio:checked) {
  border-color: var(--brand-primary);
  background: var(--surface-elevated);
}
.rmc-dpk-card:focus-within {
  border-color: var(--brand-primary);
  box-shadow: 0 0 0 2px var(--brand-primary);
}
.rmc-dpk-card__radio {
  position: absolute;
  top: var(--space-3, 0.75rem);
  right: var(--space-3, 0.75rem);
  margin: 0;
  accent-color: var(--brand-primary);
}
.rmc-dpk-card__meta {
  display: grid;
  gap: var(--space-1, 0.25rem);
  min-width: 0;
}
.rmc-dpk-card__head {
  display: flex;
  align-items: baseline;
  gap: var(--space-2, 0.5rem);
  padding-right: 1.5rem;
}
.rmc-dpk-card__name {
  color: var(--text-primary);
  font-size: var(--type-size-1, 0.8125rem);
  line-height: 1.3;
}
.rmc-dpk-card__desc {
  font-size: var(--type-size-0, 0.75rem);
  color: var(--text-secondary);
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.rmc-dpk-card__focus {
  font-size: var(--type-size-0, 0.75rem);
  color: var(--text-secondary);
  line-height: 1.4;
  margin-top: 0.1rem;
}
.rmc-dpk-card__focus-label {
  margin-right: 0.35rem;
  font-size: 0.68rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.rmc-dpk-card__chips {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1, 0.25rem);
  margin-top: 0.15rem;
}
.rmc-dpk-chip {
  display: inline-flex;
  align-items: center;
  padding: 0.1rem var(--space-2, 0.5rem);
  border-radius: 999px;
  border: 1px solid var(--hairline);
  background: var(--surface-canvas, var(--surface-bg));
  font-size: var(--type-size-0, 0.75rem);
  line-height: 1.5;
  color: var(--text-secondary);
}
.rmc-dpk-chip--kpi {
  color: var(--text-primary);
  border-color: var(--brand-primary);
}

/* Config-derived mini-layout schematic (honest abstraction, no screenshot). */
.rmc-dpk-preview {
  display: grid;
  gap: 3px;
  width: 68px;
  padding: 5px;
  border-radius: var(--radius-sm, 0.375rem);
  border: 1px solid var(--hairline);
  background: var(--surface-canvas, var(--surface-bg));
}
.rmc-dpk-preview__bar { display: flex; gap: 3px; }
.rmc-dpk-preview__dot {
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: var(--hairline);
}
.rmc-dpk-preview__kpis { display: flex; gap: 3px; }
.rmc-dpk-preview__tile {
  flex: 1 1 0;
  height: 11px;
  border-radius: 2px;
  background: var(--brand-primary);
  opacity: 0.55;
}
.rmc-dpk-preview__body { display: grid; gap: 3px; }
.rmc-dpk-preview__panel {
  height: 8px;
  border-radius: 2px;
  background: var(--hairline);
}
/* Theme preset nudges the schematic (soft-glass / crisp / high-contrast). */
.rmc-dpk-card[data-rmc-dpk-theme="soft-glass"] .rmc-dpk-preview { border-radius: var(--radius-md, 0.5rem); }
.rmc-dpk-card[data-rmc-dpk-theme="soft-glass"] .rmc-dpk-preview__tile { opacity: 0.42; }
.rmc-dpk-card[data-rmc-dpk-theme="crisp-professional"] .rmc-dpk-preview { border-radius: 3px; }
.rmc-dpk-card[data-rmc-dpk-theme="high-contrast"] .rmc-dpk-preview__tile { opacity: 0.9; }
.rmc-dpk-card[data-rmc-dpk-theme="high-contrast"] .rmc-dpk-preview__panel { background: var(--text-secondary); }
/* Header variant shapes the body panels (wide / card / minimal / standard). */
.rmc-dpk-card[data-rmc-dpk-variant="card"] .rmc-dpk-preview__body { grid-template-columns: 1fr 1fr; }
.rmc-dpk-card[data-rmc-dpk-variant="wide"] .rmc-dpk-preview__body { grid-template-columns: 1fr; }
.rmc-dpk-card[data-rmc-dpk-variant="wide"] .rmc-dpk-preview__panel:first-child { height: 16px; }
.rmc-dpk-card[data-rmc-dpk-variant="standard"] .rmc-dpk-preview__panel:last-child { width: 70%; }
.rmc-dpk-card[data-rmc-dpk-variant="minimal"] .rmc-dpk-preview__panel:last-child { display: none; }

/* Apply row. */
.rmc-dpk__actions {
  display: flex;
  align-items: center;
  gap: var(--space-2, 0.5rem);
  padding-top: var(--space-1, 0.25rem);
}
.rmc-dpk__status { min-height: 1em; }

/* IM-7: @mention highlight inside a thread message body. Token-only so tenant
   brand wins; falls back to the inherited text colour where no brand is set. */
.rmc-mention {
  font-weight: 600;
  color: var(--brand-primary, currentColor);
}

/* ───────────────────────────────────────────────────────────────────────
   Sidebar intelligence (rmc-sidebar-intelligence.js). One engine, both skins
   (operator control-plane + tenant portal). All classes are JS-injected, so
   they never touch the undefined-CSS template gate. Token-only — no literal
   colours — so tenant brand wins and dark/light resolve via the cascade.
─────────────────────────────────────────────────────────────────────── */
.rmc-sb-has-filter { position: relative; }

.rmc-sb-filter {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 8px 8px;
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--surface-bg, transparent);
}
.rmc-sb-filter__field { position: relative; flex: 1 1 auto; }
.rmc-sb-filter__input {
  width: 100%;
  font: inherit;
  font-size: 0.8125rem;
  color: var(--text-primary, currentColor);
  background: color-mix(in srgb, currentColor 6%, transparent);
  border: 1px solid var(--hairline, currentColor);
  border-radius: var(--radius-md, 10px);
  padding: 7px 30px 7px 11px;
  outline: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.rmc-sb-filter__input:focus {
  border-color: var(--brand-primary, currentColor);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand-primary) 22%, transparent);
}
.rmc-sb-filter__hint {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.6875rem;
  color: var(--text-tertiary, currentColor);
  border: 1px solid var(--hairline, currentColor);
  border-radius: 5px;
  padding: 1px 6px;
  pointer-events: none;
}
.rmc-sb-filter__prefs {
  flex: none;
  appearance: none;
  border: 1px solid var(--hairline, currentColor);
  background: transparent;
  color: var(--text-secondary, currentColor);
  border-radius: var(--radius-md, 10px);
  width: 32px;
  height: 32px;
  font-size: 1rem;
  line-height: 1;
  cursor: pointer;
  transition: color 0.15s ease, border-color 0.15s ease;
}
.rmc-sb-filter__prefs:hover { color: var(--brand-primary, currentColor); border-color: var(--brand-primary, currentColor); }

/* Per-user preferences popover (Phase 3) — anchored under the prefs button in
   the (positioned) sticky filter bar. Token-only surfaces. */
.rmc-sb-prefs {
  position: absolute;
  top: calc(100% + 4px);
  right: 8px;
  z-index: 30;
  min-width: 200px;
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  border: 1px solid var(--hairline, currentColor);
  border-radius: var(--radius-md, 12px);
  background: var(--surface-popover, var(--surface-elevated, var(--surface-bg)));
  box-shadow: var(--elev-3, 0 14px 44px rgba(0, 0, 0, 0.18)); /* off-token-allow: neutral elevation shadow, not a themeable surface colour */
}
.rmc-sb-prefs__group { display: flex; flex-direction: column; gap: 6px; }
.rmc-sb-prefs__lbl {
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--text-tertiary, currentColor);
}
.rmc-sb-prefs__seg { display: flex; gap: 3px; }
.rmc-sb-prefs__seg-btn {
  flex: 1;
  appearance: none;
  border: 1px solid var(--hairline, currentColor);
  background: transparent;
  color: var(--text-secondary, currentColor);
  border-radius: var(--radius-sm, 8px);
  padding: 5px 4px;
  font-size: 0.6875rem;
  cursor: pointer;
  transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}
.rmc-sb-prefs__seg-btn.is-active {
  color: var(--brand-primary, currentColor);
  border-color: var(--brand-primary, currentColor);
  background: color-mix(in srgb, var(--brand-primary) 12%, transparent);
}
.rmc-sb-prefs__row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.8125rem;
  color: var(--text-primary, currentColor);
  cursor: pointer;
}
.rmc-sb-prefs__cb { accent-color: var(--brand-primary, currentColor); }
.rmc-sb-prefs__link {
  margin-top: 2px;
  padding-top: 8px;
  border-top: 1px solid var(--hairline, currentColor);
  font-size: 0.75rem;
  color: var(--brand-primary, currentColor);
  text-decoration: none;
}
.rmc-sb-prefs__link:hover { text-decoration: underline; }

.rmc-sb-out { display: none !important; }
.rmc-sb-group-out { display: none !important; }
.rmc-sb-cursor {
  outline: 2px solid color-mix(in srgb, var(--brand-primary) 60%, transparent);
  outline-offset: -2px;
  border-radius: 10px;
}
.rmc-sb-mark { background: transparent; color: var(--brand-primary, currentColor); font-weight: 700; }

.rmc-sb-frequent { padding: 4px 8px 6px; }
.rmc-sb-frequent__head {
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--text-tertiary, currentColor);
  padding: 6px 8px 4px;
}
.rmc-sb-frequent__item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 10px;
  border-radius: 10px;
  color: var(--text-primary, currentColor);
  text-decoration: none;
  font-size: 0.84rem;
}
.rmc-sb-frequent__item:hover { background: color-mix(in srgb, currentColor 6%, transparent); }
.rmc-sb-frequent__item i { width: 18px; text-align: center; opacity: 0.8; flex: none; }
.rmc-sb-frequent__label { flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rmc-sb-frequent__tag { color: var(--brand-primary, currentColor); font-size: 0.72rem; flex: none; }

/* Density — per-user (localStorage) over cascade default (data-rmc-sidebar-density).
   Compact / Cozy / Roomy map to compact|comfortable|spacious. */
[data-rmc-density="compact"] .cp-sidebar__item,
[data-rmc-density="compact"] .nav-pill,
[data-rmc-density="compact"] .rmc-sb-frequent__item { padding-block: 4px; }
[data-rmc-density="comfortable"] .cp-sidebar__item,
[data-rmc-density="comfortable"] .nav-pill,
[data-rmc-density="comfortable"] .rmc-sb-frequent__item { padding-block: 7px; }
[data-rmc-density="spacious"] .cp-sidebar__item,
[data-rmc-density="spacious"] .nav-pill,
[data-rmc-density="spacious"] .rmc-sb-frequent__item { padding-block: 11px; }

/* Live awareness badge (Phase 2) — managed by the engine's poll. Token-only
   tinted count chip; right-aligned via the flex class the engine adds to the
   item it badges. Reconciles with server-rendered .badge (no double count). */
.rmc-sb-has-livebadge { display: flex; align-items: center; }
.rmc-sb-livebadge {
  margin-left: auto;
  flex: none;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.6875rem;
  font-weight: 700;
  line-height: 1;
  border-radius: var(--radius-pill, 999px);
  color: var(--brand-primary, currentColor);
  background: color-mix(in srgb, var(--brand-primary) 16%, transparent);
}

/* ── Deploy-freshness toast ─────────────────────────────────────────────────
   Surfaced by static/js/rmc-deploy-freshness.js when a NEW version deploys while
   the user is mid-session (the on-arrival case silently auto-reloads instead).
   Token-only so it inverts cleanly in dark mode and respects the tenant brand. */
.rmc-deploy-toast {
  position: fixed;
  left: 50%;
  bottom: 1.25rem;
  transform: translateX(-50%);
  z-index: 2147483000;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  max-width: min(92vw, 30rem);
  padding: 0.625rem 0.75rem 0.625rem 1rem;
  background: var(--surface-elevated);
  color: var(--text-primary);
  border: 1px solid var(--hairline);
  border-radius: var(--radius-md, 0.75rem);
  box-shadow: var(--elev-3);
}
.rmc-deploy-toast__msg {
  font-size: var(--type-size-sm, 0.875rem);
  line-height: 1.4;
}
.rmc-deploy-toast__refresh {
  flex: none;
  appearance: none;
  border: 0;
  cursor: pointer;
  padding: 0.375rem 0.875rem;
  border-radius: var(--radius-sm, 0.5rem);
  background: var(--brand-primary);
  color: var(--text-on-brand);
  font-size: var(--type-size-sm, 0.875rem);
  font-weight: 600;
}
.rmc-deploy-toast__refresh:hover { filter: brightness(1.05); }
.rmc-deploy-toast__refresh:disabled { opacity: 0.6; cursor: default; }
.rmc-deploy-toast__dismiss {
  flex: none;
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--text-secondary);
  cursor: pointer;
  font-size: var(--type-size-lg, 1.125rem);
  line-height: 1;
  padding: 0.25rem 0.375rem;
}
@media (prefers-reduced-motion: no-preference) {
  .rmc-deploy-toast { animation: rmc-deploy-toast-in 0.18s var(--ease-out, ease-out); }
}
@keyframes rmc-deploy-toast-in {
  from { opacity: 0; transform: translate(-50%, 0.5rem); }
  to { opacity: 1; transform: translate(-50%, 0); }
}

/* MFA enrollment nudge (grace / optional enforcement modes) — token-only.
   Surfaced by apps.accounts.mfa_ui_context.mfa_nudge_context on every shell
   when a required user is let through instead of hard-walled. */
.rmc-mfa-nudge {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  max-width: 64rem;
  margin: 0.75rem auto;
  padding: 0.75rem 1rem;
  background: var(--surface-elevated);
  color: var(--text-primary);
  border: 1px solid var(--hairline);
  border-left: 3px solid var(--brand-primary);
  border-radius: var(--radius-sm, 0.5rem);
  box-shadow: var(--elev-1, var(--elev-3));
}
.rmc-mfa-nudge__icon {
  flex: none;
  color: var(--brand-primary);
  font-size: var(--type-size-lg, 1.125rem);
  line-height: 1.4;
}
.rmc-mfa-nudge__body {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
  min-width: 0;
}
.rmc-mfa-nudge__title { color: var(--text-primary); font-weight: 600; }
.rmc-mfa-nudge__msg {
  color: var(--text-secondary);
  font-size: var(--type-size-sm, 0.875rem);
  line-height: 1.4;
}
.rmc-mfa-nudge__actions {
  flex: none;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.rmc-mfa-nudge__cta {
  display: inline-block;
  padding: 0.375rem 0.875rem;
  border-radius: var(--radius-sm, 0.5rem);
  background: var(--brand-primary);
  color: var(--text-on-brand);
  font-size: var(--type-size-sm, 0.875rem);
  font-weight: 600;
  text-decoration: none;
}
.rmc-mfa-nudge__cta:hover { filter: brightness(1.05); }
.rmc-mfa-nudge__link {
  color: var(--brand-primary);
  font-size: var(--type-size-sm, 0.875rem);
  text-decoration: none;
}
.rmc-mfa-nudge__link:hover { text-decoration: underline; }
.rmc-mfa-nudge__dismiss {
  flex: none;
  color: var(--text-secondary);
  font-size: var(--type-size-lg, 1.125rem);
  line-height: 1;
  text-decoration: none;
  padding: 0 0.25rem;
}

/* ============================================================
   Command palette intelligence (v4.04.59) — appended classes for
   the unified ⌘K engine (static/js/rmc-command-palette.js). Token-only.
   Base .rmc-cmdk / .rmc-cmdk__item styling lives in the shell bundles;
   these are the NEW federation + adaptive + highlight affordances.
   ============================================================ */
.rmc-cmdk__band {
  list-style: none;
  padding: 0.625rem 1rem 0.25rem;
  font-size: var(--type-size-2xs, 0.625rem);
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--text-tertiary);
}
.rmc-cmdk__mark {
  background: var(--surface-highlight, var(--surface-overlay));
  color: inherit;
  border-radius: var(--radius-xs, 0.1875rem);
  padding: 0 0.0625rem;
}
.rmc-cmdk__src {
  flex: none;
  font-size: var(--type-size-2xs, 0.625rem);
  font-weight: 700;
  letter-spacing: 0.04em;
  padding: 0.0625rem 0.4375rem;
  border-radius: var(--radius-pill, 999px);
  background: var(--surface-overlay);
  color: var(--text-tertiary);
}
.rmc-cmdk__src[data-src="action"] { color: var(--text-success, var(--text-secondary)); }
.rmc-cmdk__src[data-src="sidebar"] { color: var(--text-info, var(--text-secondary)); }
.rmc-cmdk__src[data-src="ai"] { color: var(--brand-primary, var(--text-secondary)); }
.rmc-cmdk__src[data-src="recent"] { color: var(--text-tertiary); }
.rmc-cmdk__pin {
  flex: none;
  border: none;
  background: transparent;
  cursor: pointer;
  font-size: var(--type-size-sm, 0.875rem);
  line-height: 1;
  color: var(--text-tertiary);
  opacity: 0;
  padding: 0.125rem 0.25rem;
  border-radius: var(--radius-xs, 0.1875rem);
  transition: opacity var(--motion-signature-micro, 120ms ease);
}
.rmc-cmdk__item:hover .rmc-cmdk__pin,
.rmc-cmdk__item.is-active .rmc-cmdk__pin,
.rmc-cmdk__pin:focus-visible { opacity: 1; }
.rmc-cmdk__pin.is-on { opacity: 1; color: var(--text-warning, var(--brand-primary)); }

/* ============================================================
   Table intelligence (v4.04.60) — appended classes for the shared list
   engine (static/js/rmc-table-intelligence.js). Token-only; JS-injected.
   Composes with table-system.css (density) + rmc-list-bulk-select.css.
   ============================================================ */
.rmc-tbl-bar {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
  padding: 0.5rem 0.25rem 0.625rem;
}
.rmc-tbl-bar__filter {
  flex: 1 1 200px;
  min-width: 160px;
  display: flex;
  align-items: center;
  border: 1px solid var(--hairline);
  border-radius: var(--radius-sm, 0.5rem);
  background: var(--surface-canvas);
  padding: 0.375rem 0.625rem;
}
.rmc-tbl-bar__input {
  flex: 1;
  border: none;
  background: transparent;
  color: var(--text-primary);
  font: inherit;
  font-size: var(--type-size-sm, 0.875rem);
  outline: none;
}
.rmc-tbl-bar__input::placeholder { color: var(--text-tertiary); }
.rmc-tbl-bar__count {
  font-size: var(--type-size-xs, 0.75rem);
  color: var(--text-tertiary);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.rmc-tbl-seg { display: inline-flex; border: 1px solid var(--hairline); border-radius: var(--radius-sm, 0.5rem); overflow: hidden; }
.rmc-tbl-seg__btn {
  border: none;
  background: transparent;
  padding: 0.3125rem 0.625rem;
  font: inherit;
  font-size: var(--type-size-xs, 0.75rem);
  color: var(--text-secondary);
  cursor: pointer;
}
.rmc-tbl-seg__btn[aria-pressed="true"] { background: var(--brand-primary); color: var(--text-on-brand); }
.rmc-tbl-gear {
  border: 1px solid var(--hairline);
  background: var(--surface-canvas);
  color: var(--text-secondary);
  border-radius: var(--radius-sm, 0.5rem);
  padding: 0.3125rem 0.6875rem;
  font: inherit;
  font-size: var(--type-size-xs, 0.75rem);
  cursor: pointer;
}
.rmc-tbl-gear:hover { border-color: var(--brand-primary); color: var(--brand-primary); }
.rmc-tbl-pop { position: relative; }
.rmc-tbl-menu {
  position: absolute;
  right: 0;
  top: calc(100% + 0.375rem);
  background: var(--surface-popover, var(--surface-elevated));
  border: 1px solid var(--hairline);
  border-radius: var(--radius-md, 0.625rem);
  box-shadow: var(--elev-3);
  padding: 0.375rem;
  min-width: 11rem;
  z-index: 30;
  display: none;
  max-height: 16rem;
  overflow-y: auto;
}
.rmc-tbl-pop.is-open .rmc-tbl-menu { display: block; }
.rmc-tbl-menu__item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.375rem 0.5rem;
  border-radius: var(--radius-xs, 0.1875rem);
  font-size: var(--type-size-sm, 0.875rem);
  color: var(--text-secondary);
  cursor: pointer;
}
.rmc-tbl-menu__item:hover { background: var(--surface-overlay); }
.rmc-tbl-mark { background: var(--surface-highlight, var(--surface-overlay)); color: inherit; border-radius: var(--radius-xs, 0.1875rem); padding: 0 0.0625rem; }
.rmc-tbl-row-hidden { display: none; }
.rmc-tbl-col-hidden { display: none; }
.rmc-tbl-cur { background: var(--surface-selected, var(--surface-overlay)); outline: 2px solid var(--brand-primary); outline-offset: -2px; }
.rmc-tbl-sortable { cursor: pointer; }
.rmc-tbl-sortable::after { content: " \2195"; opacity: 0.35; font-size: var(--type-size-xs, 0.75rem); }
.rmc-tbl-sortable:hover { color: var(--brand-primary); }
.rmc-tbl-sortable[aria-sort="ascending"]::after { content: " \25B2"; opacity: 1; color: var(--brand-primary); }
.rmc-tbl-sortable[aria-sort="descending"]::after { content: " \25BC"; opacity: 1; color: var(--brand-primary); }

/* ============================================================
   Dashboard intelligence (v4.04.61) — appended classes for the per-user
   cockpit personalization engine (static/js/rmc-dashboard-intelligence.js).
   Token-only; JS-injected. Composes with rmc-collapsable.css cockpit sections.
   ============================================================ */
.rmc-dash-bar {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin-bottom: 0.75rem;
}
.rmc-dash-btn {
  border: 1px solid var(--hairline);
  background: var(--surface-canvas);
  color: var(--text-secondary);
  border-radius: var(--radius-sm, 0.5rem);
  padding: 0.3125rem 0.6875rem;
  font: inherit;
  font-size: var(--type-size-xs, 0.75rem);
  cursor: pointer;
}
.rmc-dash-btn:hover { border-color: var(--brand-primary); color: var(--brand-primary); }
.rmc-dash-seg { display: inline-flex; border: 1px solid var(--hairline); border-radius: var(--radius-sm, 0.5rem); overflow: hidden; }
.rmc-dash-seg__btn {
  border: none; background: transparent; padding: 0.3125rem 0.625rem;
  font: inherit; font-size: var(--type-size-xs, 0.75rem); color: var(--text-secondary); cursor: pointer;
}
.rmc-dash-seg__btn[aria-pressed="true"] { background: var(--brand-primary); color: var(--text-on-brand); }
.rmc-dash-cust {
  display: none;
  background: var(--surface-popover, var(--surface-elevated));
  border: 1px solid var(--hairline);
  border-radius: var(--radius-md, 0.625rem);
  padding: 0.75rem 1rem;
  margin-bottom: 0.75rem;
}
.rmc-dash-cust.is-open { display: block; }
.rmc-dash-cust__head { font-size: var(--type-size-2xs, 0.625rem); font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; color: var(--text-tertiary); margin-bottom: 0.375rem; }
.rmc-dash-cust__item { display: flex; align-items: center; gap: 0.5rem; padding: 0.25rem 0; font-size: var(--type-size-sm, 0.875rem); color: var(--text-secondary); cursor: pointer; }
.rmc-dash-focus {
  background: var(--surface-canvas);
  border: 1px solid var(--hairline);
  border-radius: var(--radius-md, 0.625rem);
  padding: 0.625rem 0.875rem;
  margin-bottom: 0.875rem;
}
.rmc-dash-focus__head { font-size: var(--type-size-2xs, 0.625rem); font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-tertiary); margin-bottom: 0.5rem; }
.rmc-dash-focus__row { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.rmc-dash-focus__chip {
  display: inline-flex; align-items: center; gap: 0.375rem;
  border: 1px solid var(--hairline); background: var(--surface-elevated);
  color: var(--text-primary); border-radius: var(--radius-pill, 999px);
  padding: 0.25rem 0.75rem; font: inherit; font-size: var(--type-size-sm, 0.875rem); cursor: pointer;
}
.rmc-dash-focus__chip:hover { border-color: var(--brand-primary); color: var(--brand-primary); }
.rmc-dash-focus__chip.is-attn { border-color: var(--text-warning, var(--brand-primary)); }
.rmc-dash-focus__count { font-size: var(--type-size-2xs, 0.625rem); font-weight: 700; background: var(--brand-soft, var(--surface-overlay)); color: var(--brand-primary); border-radius: var(--radius-pill, 999px); padding: 0.0625rem 0.4375rem; }
.rmc-dash-grip { cursor: grab; color: var(--text-tertiary); font-size: var(--type-size-md, 1rem); margin-right: 0.375rem; user-select: none; }
.rmc-dash-hidden { display: none; }
.rmc-dash-dragging { opacity: 0.5; }
.rmc-dash-dragover { box-shadow: 0 0 0 2px var(--brand-primary) inset; }
/* Dashboard density — Compact / Cozy / Roomy (rmc-dashboard-intelligence.js) */
[data-rmc-dash-density="compact"] {
  --density-card-gap: 0.5rem;
  --density-card-padding: 0.625rem;
}
[data-rmc-dash-density="comfortable"] {
  --density-card-gap: 0.875rem;
  --density-card-padding: 0.875rem;
}
[data-rmc-dash-density="spacious"] {
  --density-card-gap: 1.35rem;
  --density-card-padding: 1.25rem;
}
[data-rmc-dash-density="compact"] > .rmc-collapsable { margin-bottom: 0.375rem; }
[data-rmc-dash-density="comfortable"] > .rmc-collapsable { margin-bottom: 0.75rem; }
[data-rmc-dash-density="spacious"] > .rmc-collapsable { margin-bottom: 1.25rem; }
[data-rmc-dash-density="compact"] .rmc-collapsable__head,
[data-rmc-dash-density="compact"] .rmc-collapsable__body {
  padding-block: 0.375rem;
}
[data-rmc-dash-density="comfortable"] .rmc-collapsable__head,
[data-rmc-dash-density="comfortable"] .rmc-collapsable__body {
  padding-block: 0.625rem;
}
[data-rmc-dash-density="spacious"] .rmc-collapsable__head,
[data-rmc-dash-density="spacious"] .rmc-collapsable__body {
  padding-block: 0.95rem;
}
[data-rmc-dash-density] .card .card-body {
  padding: var(--density-card-padding, 0.875rem);
}
[data-rmc-dash-density] .rmc-dash-focus {
  margin-bottom: var(--density-card-gap, 0.875rem);
}

/* ----------------------------------------------------------------------------
   Form-intelligence engine (v4.04.62) — classes injected by
   static/js/rmc-form-intelligence.js (no template references them, so they are
   exempt from the undefined-CSS gate; defined here for the visual contract).
   Token-only colours so the tenant theme + dark mode flip correctly.
---------------------------------------------------------------------------- */
.rmc-fi-savebar {
  position: sticky; bottom: 0; z-index: 5;
  display: flex; align-items: center; gap: 0.75rem;
  margin-top: 1rem; padding: 0.75rem 1rem;
  background: var(--surface-elevated, var(--surface-canvas));
  border: 1px solid var(--hairline);
  border-radius: var(--radius-md, 0.75rem);
  box-shadow: var(--elev-2);
  transform: translateY(140%); opacity: 0;
  transition: transform var(--motion-medium, 0.22s) var(--ease-out, ease), opacity var(--motion-medium, 0.22s) var(--ease-out, ease);
  pointer-events: none;
}
.rmc-fi-savebar.is-dirty { transform: translateY(0); opacity: 1; pointer-events: auto; }
.rmc-fi-savebar__dot { width: 0.5625rem; height: 0.5625rem; border-radius: var(--radius-pill, 999px); background: var(--warning, var(--brand-primary)); flex: 0 0 auto; }
.rmc-fi-savebar__msg { flex: 1 1 auto; font-size: var(--type-size-sm, 0.875rem); color: var(--text-secondary); }
.rmc-fi-savebar__btn {
  appearance: none; cursor: pointer;
  font: inherit; font-weight: 600; font-size: var(--type-size-sm, 0.875rem);
  padding: 0.4375rem 0.875rem; border-radius: var(--radius-sm, 0.5rem);
  border: 1px solid var(--hairline); background: var(--surface-canvas); color: var(--text-primary);
}
.rmc-fi-savebar__btn--primary { background: var(--brand-primary); border-color: var(--brand-primary); color: var(--brand-on-primary, var(--surface-canvas)); }

.rmc-fi-counter { font-size: var(--type-size-xs, 0.75rem); color: var(--text-tertiary); text-align: right; margin-top: 0.1875rem; }
.rmc-fi-counter.is-warn { color: var(--warning, var(--text-secondary)); }
.rmc-fi-counter.is-danger { color: var(--danger, var(--text-secondary)); }

.rmc-fi-nav {
  position: sticky; top: var(--rmc-fi-nav-top, 0.75rem); z-index: 4;
  display: flex; flex-wrap: wrap; gap: 0.375rem;
  margin-bottom: 1.25rem; padding: 0.5rem;
  background: var(--surface-elevated, var(--surface-canvas));
  border: 1px solid var(--hairline); border-radius: var(--radius-md, 0.75rem);
}
.rmc-fi-nav__link {
  font-size: var(--type-size-xs, 0.75rem); text-decoration: none;
  color: var(--text-secondary); padding: 0.3125rem 0.625rem;
  border-radius: var(--radius-pill, 999px); border: 1px solid transparent;
}
.rmc-fi-nav__link.is-active { color: var(--brand-primary); background: var(--brand-soft, var(--surface-overlay)); border-color: var(--hairline); font-weight: 600; }

.rmc-fi-busy { position: relative; pointer-events: none; }
.rmc-fi-busy::after {
  content: ""; position: absolute; inset-block: 0; right: 0.625rem; margin: auto;
  width: 0.875rem; height: 0.875rem; border-radius: var(--radius-pill, 999px);
  border: 2px solid var(--hairline); border-top-color: var(--brand-primary);
  animation: rmc-fi-spin 0.7s linear infinite;
}
@keyframes rmc-fi-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .rmc-fi-savebar { transition: none; }
  .rmc-fi-busy::after { animation: none; }
}

/* ----------------------------------------------------------------------------
   Empty-state intelligence engine (v4.04.62) — classes injected by
   rmc-table-intelligence.js (table filter/data empty rows) and
   rmc-empty-intelligence.js. The canonical .rmc-empty* grammar is defined in
   rmc-long-page-grammar.css; only the engine-specific bits live here.
---------------------------------------------------------------------------- */
.rmc-tbl-empty-row > td { padding: 0; background: transparent; cursor: default; }
.rmc-tbl-empty-row:hover > td { background: transparent; }
.rmc-empty__term { font-weight: 600; color: var(--text-primary); }

/* ----------------------------------------------------------------------------
   Loading-intelligence engine (v4.04.64) — classes injected by
   rmc-loading-intelligence.js. Reuses the .skeleton* grammar (design-tokens.css)
   + the rmc-fi-spin keyframe; only the engine-specific bits live here.
---------------------------------------------------------------------------- */
.rmc-loading-busy { position: relative; pointer-events: none; }
.rmc-loading-busy::after {
  content: ""; position: absolute; inset-block: 0; right: 0.5rem; margin: auto;
  width: 0.875rem; height: 0.875rem; border-radius: var(--radius-pill, 999px);
  border: 2px solid var(--hairline); border-top-color: var(--brand-primary, currentColor);
  animation: rmc-fi-spin 0.7s linear infinite;
}
.rmc-loading-skeleton { display: flex; flex-direction: column; gap: 0.5rem; }
.rmc-loading-skeleton__row { display: flex; align-items: center; gap: 0.75rem; }
.rmc-loading-skeleton__col { flex: 1 1 auto; display: flex; flex-direction: column; gap: 0.375rem; }
.rmc-loading-skeleton__avatar { width: 2.5rem; height: 2.5rem; flex: 0 0 auto; }
@media (prefers-reduced-motion: reduce) {
  .rmc-loading-busy::after { animation: none; }
}

/* ----------------------------------------------------------------------------
   Notification-intelligence engine (v4.04.65) — classes injected by
   rmc-notification-intelligence.js into the account-menu dropdown to turn the
   static "Notifications" count into a live in-place mini-inbox. Token-only
   (semantic, theme-aware) so the preview inherits the shell surface; severity
   chips tint from currentColor via color-mix so they flip with the theme.
---------------------------------------------------------------------------- */
.rmc-noti-preview { padding-block: 0.25rem; border-block-start: 1px solid var(--hairline); background: var(--surface-canvas, transparent); }
.rmc-noti-preview__hd { display: flex; align-items: center; gap: 0.5rem; padding: 0.375rem 1rem; font-size: 0.6875rem; letter-spacing: 0.04em; text-transform: uppercase; color: var(--text-secondary); }
.rmc-noti-preview__title { font-weight: 600; }
.rmc-noti-preview__all { margin-inline-start: auto; border: 0; background: none; padding: 0; font: inherit; text-transform: none; letter-spacing: 0; font-size: 0.75rem; font-weight: 600; color: var(--brand-primary, currentColor); cursor: pointer; }
.rmc-noti-preview__all[disabled] { opacity: 0.5; cursor: default; }
.rmc-noti-preview__list { max-height: 17rem; overflow-y: auto; }
.rmc-noti-item { display: flex; gap: 0.625rem; align-items: flex-start; padding: 0.5rem 1rem; border-block-start: 1px solid var(--hairline); }
.rmc-noti-item__ic { flex: 0 0 auto; width: 1.625rem; height: 1.625rem; border-radius: var(--radius-md, 0.5rem); display: grid; place-items: center; font-size: 0.8125rem; color: var(--text-secondary); background: color-mix(in srgb, currentColor 12%, transparent); }
.rmc-noti-ic--info { color: var(--brand-primary, var(--color-info, currentColor)); }
.rmc-noti-ic--warn { color: var(--color-warning, currentColor); }
.rmc-noti-ic--alert { color: var(--color-danger, currentColor); }
.rmc-noti-item__bd { flex: 1 1 auto; min-width: 0; display: block; text-decoration: none; color: inherit; }
.rmc-noti-item__t { font-weight: 600; font-size: 0.8125rem; color: var(--text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rmc-noti-item__m { font-size: 0.75rem; color: var(--text-secondary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rmc-noti-item__time { font-size: 0.6875rem; color: var(--text-muted, var(--text-secondary)); margin-block-start: 0.125rem; }
.rmc-noti-item__rd { flex: 0 0 auto; border: 0; background: none; padding: 0.125rem 0.25rem; font: inherit; font-size: 0.6875rem; font-weight: 600; color: var(--brand-primary, currentColor); cursor: pointer; }
.rmc-noti-item__rd[disabled] { opacity: 0.5; cursor: default; }
.rmc-noti-empty, .rmc-noti-loading { padding: 0.875rem 1rem; text-align: center; font-size: 0.8125rem; color: var(--text-secondary); }

/* ----------------------------------------------------------------------------
   Modal-intelligence engine (v4.04.66) — the pooled confirm dialog injected by
   rmc-modal-intelligence.js. It IS an .rmc-sheet (all sheet styling inherited
   from design-tokens.css); these rules only add the confirm-specific bits:
   the severity-tinted icon chip + a comfortable max-width. Token-only; the icon
   tint flips with the theme via currentColor. Footer actions reuse .btn.
---------------------------------------------------------------------------- */
.rmc-confirm__icon { color: var(--brand-primary, currentColor); background: color-mix(in srgb, currentColor 12%, transparent); border-radius: var(--radius-md, 0.5rem); }
.rmc-confirm[data-rmc-confirm-tone="danger"] .rmc-confirm__icon { color: var(--color-danger, currentColor); }
.rmc-confirm .rmc-sheet__footer { gap: 0.5rem; }
.rmc-confirm__body { color: var(--text-primary); }
.rmc-confirm__subtitle[hidden] { display: none; }

/* ----------------------------------------------------------------------------
   Detail-intelligence engine (v4.04.67) — classes injected by
   rmc-detail-intelligence.js into .rmc-kv <dd> / [data-rmc-field] values:
   a hover-revealed copy button, mailto:/tel: action links, and a muted em-dash
   for empty values. Token-only; the copy button is keyboard-reachable (it stays
   visible on :focus-within / :focus-visible, not hover-only).
---------------------------------------------------------------------------- */
.rmc-detail-copy { display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--hairline); background: var(--surface-elevated, transparent); color: var(--text-secondary); border-radius: var(--radius-sm, 0.375rem); padding: 0 0.3rem; margin-inline-start: 0.35rem; font-size: 0.75rem; line-height: 1.4; cursor: pointer; opacity: 0; transition: opacity 0.12s ease, color 0.12s ease; }
.rmc-detail-has-copy:hover .rmc-detail-copy,
.rmc-detail-has-copy:focus-within .rmc-detail-copy,
.rmc-detail-copy:focus-visible { opacity: 1; }
.rmc-detail-copy.is-copied { color: var(--color-success, var(--brand-primary, currentColor)); border-color: currentColor; opacity: 1; }
.rmc-detail-action { color: var(--brand-primary, currentColor); text-decoration: none; }
.rmc-detail-action:hover { text-decoration: underline; }
.rmc-detail-empty { color: var(--text-tertiary, var(--text-secondary)); }
@media (hover: none) {
  .rmc-detail-copy { opacity: 1; }
}

/* ============================================================
   Seating chart grammar (portal/seating_chart.html). A class roster laid out as
   a responsive grid of desks; each desk reads today's attendance status via a
   token-only colored border. All values are semantic tokens so it follows the
   tenant brand + theme and stays off-token-clean.
   ============================================================ */
.rmc-seating-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(132px, 1fr));
  gap: var(--space-2, 0.5rem);
}
.rmc-seat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-1, 0.25rem);
  padding: var(--space-3, 0.75rem) var(--space-2, 0.5rem);
  border: 1px solid var(--hairline);
  border-radius: var(--radius-lg, 12px);
  background: var(--surface-elevated);
  text-align: center;
  min-width: 0;
}
.rmc-seat__avatar {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  font-size: 0.8rem;
  background: var(--surface-overlay, var(--surface-sunken));
  color: var(--text-primary);
  text-transform: uppercase;
}
.rmc-seat__name {
  font-size: 0.8rem;
  line-height: 1.25;
  color: var(--text-primary);
  overflow-wrap: anywhere;
}
.rmc-seat__status {
  font-size: 0.62rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-secondary);
}
.rmc-seat--present { border-color: color-mix(in srgb, var(--success) 50%, var(--hairline)); }
.rmc-seat--absent  { border-color: color-mix(in srgb, var(--danger) 50%, var(--hairline)); }
.rmc-seat--late    { border-color: color-mix(in srgb, var(--warning) 55%, var(--hairline)); }

.rmc-seating-legend {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3, 0.75rem);
  font-size: 0.72rem;
  color: var(--text-secondary);
}
.rmc-seating-legend__item {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1, 0.25rem);
}
.rmc-seating-legend__dot {
  width: 0.7rem;
  height: 0.7rem;
  border-radius: 50%;
  border: 2px solid var(--hairline);
  background: var(--surface-elevated);
}


/* ── Dashboard-pack config preview (moved from the inline <style> in
   siteconfig/partials/dashboard_configuration_hub_body.html so the classes are
   defined in a CSS file — scan_undefined_css_classes). A deliberately always-dark
   device mockup previewing what a dashboard pack looks like; the raw colors carry
   off-token-allow markers for that always-dark decorative canvas. */
.rmc-dashboard-preview-shell {
  border: 1px solid rgba(148, 163, 184, 0.24); /* off-token-allow: dashboard-config-preview-dark-canvas */
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(15, 23, 42, 0.96), rgba(30, 41, 59, 0.88)); /* off-token-allow: dashboard-config-preview-dark-canvas */
  color: #e5ecff; /* off-token-allow: dashboard-config-preview-dark-canvas */
  min-height: 100%;
}
.rmc-dashboard-preview-shell .text-muted {
  color: #9aa9c2 !important; /* off-token-allow: dashboard-config-preview-dark-canvas */
}
.rmc-dashboard-preview-card {
  border: 1px solid rgba(148, 163, 184, 0.24); /* off-token-allow: dashboard-config-preview-dark-canvas */
  border-radius: 14px;
  background: rgba(15, 23, 42, 0.7); /* off-token-allow: dashboard-config-preview-dark-canvas */
}
.rmc-dashboard-preview-card--after {
  border-color: rgba(59, 130, 246, 0.42); /* off-token-allow: dashboard-config-preview-dark-canvas */
  box-shadow: 0 0 0 1px rgba(59, 130, 246, 0.16) inset;
}
.rmc-dashboard-preview-device .btn {
  border-radius: 999px;
}
.rmc-dashboard-preview-device .btn.active {
  background: #2563eb; /* off-token-allow: dashboard-config-preview-dark-canvas */
  color: #fff; /* off-token-allow: dashboard-config-preview-dark-canvas */
  border-color: #2563eb; /* off-token-allow: dashboard-config-preview-dark-canvas */
}
.rmc-dashboard-preview-chip {
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(148, 163, 184, 0.28); /* off-token-allow: dashboard-config-preview-dark-canvas */
  border-radius: 999px;
  padding: 0.18rem 0.55rem;
  font-size: 0.75rem;
  background: rgba(15, 23, 42, 0.78); /* off-token-allow: dashboard-config-preview-dark-canvas */
  color: #e5ecff; /* off-token-allow: dashboard-config-preview-dark-canvas */
}
.rmc-dashboard-preview-screen {
  border: 1px solid rgba(148, 163, 184, 0.18); /* off-token-allow: dashboard-config-preview-dark-canvas */
  border-radius: 13px;
  background: #07111f; /* off-token-allow: dashboard-config-preview-dark-canvas */
  overflow: hidden;
}
.rmc-dashboard-preview-screen__top {
  display: flex;
  gap: 0.35rem;
  align-items: center;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16); /* off-token-allow: dashboard-config-preview-dark-canvas */
  padding: 0.55rem 0.7rem;
  background: rgba(15, 23, 42, 0.9); /* off-token-allow: dashboard-config-preview-dark-canvas */
}
.rmc-dashboard-preview-dot {
  width: 0.48rem;
  height: 0.48rem;
  border-radius: 999px;
  background: #38bdf8; /* off-token-allow: dashboard-config-preview-dark-canvas */
}
.rmc-dashboard-preview-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.5rem;
  padding: 0.7rem;
}
.rmc-dashboard-preview-tile {
  min-height: 58px;
  border-radius: 10px;
  background: linear-gradient(135deg, rgba(37, 99, 235, 0.38), rgba(20, 184, 166, 0.2)); /* off-token-allow: dashboard-config-preview-dark-canvas */
  border: 1px solid rgba(148, 163, 184, 0.18); /* off-token-allow: dashboard-config-preview-dark-canvas */
  padding: 0.45rem;
  font-size: 0.72rem;
}
.rmc-dashboard-preview-tile:nth-child(2) {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.34), rgba(59, 130, 246, 0.18)); /* off-token-allow: dashboard-config-preview-dark-canvas */
}
.rmc-dashboard-preview-tile:nth-child(3) {
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.34), rgba(59, 130, 246, 0.16)); /* off-token-allow: dashboard-config-preview-dark-canvas */
}
.rmc-dashboard-preview-list {
  margin: 0;
  padding-left: 1rem;
}
.rmc-dashboard-preview-list li + li {
  margin-top: 0.2rem;
}
@media (max-width: 991.98px) {
  .rmc-dashboard-preview-grid { grid-template-columns: 1fr; }
  .rmc-dashboard-preview-shell { margin-top: 1rem; }
}

/* ── Operator command-surface hooks referenced by Stage-08 templates but not
   previously defined in a CSS file (scan_undefined_css_classes). Minimal,
   token-only definitions — semantic hooks layered on the rmc-command-* / studio-os
   grammar; no fixed color so they never affect a surface's theme. */
.rmc-command-eyebrow {
  color: var(--text-secondary);
  font-size: var(--type-size-0, 0.75rem);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.rmc-command-workspace {
  position: relative;
  width: 100%;
}
.feature-control-workbench {
  min-width: 0;
}
.studio-os--overview {
  min-height: 0;
}

/* ── Django admin intelligent canvas class hooks (batch 1755–1757).
   Attribute selectors in rmc-admin-django-canvas-contract.css carry the real
   layout; these class selectors seal scan_undefined_css_classes. */
.rmc-admin-index-canvas {
  min-width: 0;
}
.rmc-admin-index-hero {
  min-width: 0;
}
.rmc-onthispage__n {
  display: inline-block;
  min-width: 1.1em;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  color: var(--text-secondary);
}
.rmc-django-actions-slot {
  min-width: 0;
}
.rmc-django-mode-panel {
  min-width: 0;
}
.rmc-django-mode-panel__body {
  min-width: 0;
}
.rmc-django-mode-panel--preview,
.rmc-django-mode-panel--audit {
  min-width: 0;
}
.rmc-mv-preview-open {
  cursor: pointer;
}

/* ── Django admin parity-close class hooks (batch 1761).
   Real layout lives in rmc-admin-django-canvas-contract.css. */
.rmc-django-workspace-head,
.rmc-django-workspace-head__copy,
.rmc-django-workspace-head__actions,
.rmc-django-metrics,
.rmc-django-metric,
.rmc-django-head-action,
.rmc-django-head-action--primary,
.rmc-django-preview-card,
.rmc-django-preview-nav,
.rmc-django-preview-screen,
.rmc-django-preview-line,
.rmc-django-preview-cta-row,
.rmc-django-save-compact,
.rmc-django-save-split,
.rmc-django-save-split__primary,
.rmc-django-save-split__chev,
.rmc-django-save-menu,
.rmc-django-save-menu__sep,
.rmc-django-save-menu__danger,
.rmc-django-save-back,
.rmc-django-save-hint {
  /* grammar stub — full styles in rmc-admin-django-canvas-contract.css */
}
.rmc-django-tools,
.rmc-django-tool,
.rmc-django-table-pagination,
.rmc-admin-changeform-pagehead--toolbar-only,
.rmc-admin-changelist-pagehead--toolbar-only {
  min-width: 0;
}
.rmc-django-tool.is-primary {
  cursor: pointer;
}

/* ── Achievement certificate document (reports/certificate_document.html).
   Standalone PDF/HTML also carries inline styles for WeasyPrint; these
   grammar rules satisfy scan_undefined_css_classes and keep portal/print
   shells token-aware. */
.rmc-certificate {
  width: min(40rem, 100%);
  margin-inline: auto;
  border: 1px solid var(--hairline, var(--color-base-200, #e2e8f0));
  border-radius: var(--radius-xl, 1rem);
  padding: var(--space-6, 2rem) var(--space-5, 1.75rem);
  text-align: center;
  background: var(--surface-elevated, #fff);
  color: var(--text-primary, #0f172a);
}
.rmc-certificate__eyebrow {
  margin: 0 0 var(--space-3, 0.75rem);
  font-size: var(--type-size-xs, 0.75rem);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-secondary, #64748b);
}
.rmc-certificate__title {
  margin: 0 0 var(--space-4, 1rem);
  font-size: clamp(1.35rem, 3vw, 1.85rem);
  font-weight: 700;
  line-height: 1.25;
  color: var(--text-primary, #0f172a);
}
.rmc-certificate__lead,
.rmc-certificate__meta,
.rmc-certificate__footer {
  margin: var(--space-2, 0.5rem) 0;
  color: var(--text-secondary, #64748b);
  font-size: var(--type-size-sm, 0.95rem);
}
.rmc-certificate__student {
  margin: var(--space-3, 0.75rem) 0 var(--space-4, 1rem);
  font-size: var(--type-size-lg, 1.35rem);
  font-weight: 650;
  color: var(--text-primary, #0f172a);
}
.rmc-certificate__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-3, 0.75rem) var(--space-4, 1rem);
  margin: var(--space-5, 1.25rem) 0;
  text-align: start;
}
.rmc-certificate__promo {
  display: inline-block;
  margin-top: var(--space-3, 0.75rem);
  padding: 0.35rem 0.75rem;
  border-radius: var(--radius-full, 999px);
  border: 1px solid var(--hairline, var(--color-base-200, #e2e8f0));
  font-size: var(--type-size-xs, 0.8rem);
  font-weight: 650;
  color: var(--text-primary, #0f172a);
}

.rmc-django-rail-facts { display: grid; gap: 0.4rem; }
.rmc-django-rail-fact { display: grid; grid-template-columns: 0.42fr 1fr; gap: 0.4rem; }
.rmc-django-rail-links { display: grid; gap: 0.35rem; }
.rmc-django-rail-pulse-hint { font-size: 0.68rem; }
.rmc-django-guided-checklist { display: grid; gap: 0.5rem; }
.rmc-django-guided-form { display: block; }

.rmc-option-a__head-copy { min-width: 0; }
.rmc-info-tip-layer { position: fixed; }
.rmc-info-tip { display: grid; }
.rmc-info-tip__head,.rmc-info-tip__title,.rmc-info-tip__surface,.rmc-info-tip__block,.rmc-info-tip__kicker,.rmc-info-tip__text,.rmc-info-tip__chips,.rmc-info-tip__chip { min-width: 0; }
.rmc-globe-deck-v2__pulse-line { min-width: 0; }

.rmc-workflow-help--compact { min-width: 0; }
.rmc-workflow-help__details { min-width: 0; }
.rmc-workflow-help__summary { min-width: 0; }
.rmc-workflow-help__details-body { min-width: 0; }
.rmc-help-details { min-width: 0; }
.rmc-wcx-hero--compact { min-width: 0; }
.rmc-wcx-hero__main--flex { min-width: 0; }
.rmc-wcx-visual-panel--compact { min-width: 0; }
.rmc-wcx-visual-panel__title { min-width: 0; }
.rmc-wcx-section-header--compact { min-width: 0; }
.rmc-wcx-section-header__copy { min-width: 0; }

.rmc-workflow-help__section--blockers { min-width: 0; }
.rmc-wcx-hero__visual--compact { min-width: 0; }

.rmc-wcx-hero__main { min-width: 0; display: block; }
.rmc-wcx-hero__main--flex { min-width: 0; flex: 1 1 auto; }
.rmc-wcx-hero__visual--compact { min-width: 0; }
.rmc-workflow-help__section--blockers { min-width: 0; }

/* Core vs Context — title row + residual lede hide (Batch 1767) */
.rmc-page__title-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
  flex-wrap: wrap;
}
.rmc-page__title-row .rmc-h1,
.rmc-page__title-row h1 {
  margin-bottom: 0;
  min-width: 0;
}
.rmc-setup-surface__lede,
.rmc-day1-lede,
.cp-hero__lede,
.cp-section__lede {
  /* off-token-allow: residual-lede-hide-after-info-tag-migration */
  display: none !important;
}
