/* assets/memb.css · the membership pages (Pro, Max, Infinite, /community, Teams) on one product-launch template.
   Light mode (members). Every class is mb-; every rule is scoped under main.mb. Markup contract: memb2 components.md,
   partials/sections/README.md. Motion: assets/memb.js (html.mb-js gates every pre-animation state; without JS or with
   reduced motion every component shows its final frame). Logical properties only; RTL overrides at the end.
   Gradients are registered duos on bounded plates only. Magenta: the .btn--magenta action and the .mb-pill--hot insight. */

/* ============ 0. Base ============ */
main.mb{
  --mb-w:1200px; --mb-pad:clamp(64px, 8vw, 120px); --mb-dir:1; --mb-top:64px;
  --mb-ink:#000; --mb-slate:var(--slate); --mb-line:var(--silver); --mb-hair:var(--slate-100); --mb-ghost:var(--ghost-white);
  --mb-psub:var(--purple-50); --mb-p100:var(--purple-100); --mb-p200:var(--purple-200); --mb-p600:var(--purple-600); --mb-purple:var(--purple);
  --mb-sh:0 1px 2px rgba(0,0,0,.06), 0 8px 24px rgba(0,0,0,.06);
  --mb-sh-lg:0 1px 2px rgba(0,0,0,.06), 0 12px 32px -8px rgba(17,12,46,.16), 0 40px 80px -40px rgba(17,12,46,.32);
  --mb-ease:var(--ease-standard, cubic-bezier(.2,0,0,1)); --mb-emph:var(--ease-emphasized, cubic-bezier(.3,0,0,1));
  --mb-exit:var(--ease-exit, cubic-bezier(.3,0,1,1));
  --mb-t1:var(--dur-instant, 120ms); --mb-t2:var(--dur-quick, 200ms); --mb-t3:var(--dur-base, 320ms); --mb-t4:var(--dur-slow, 560ms);
  display:block; overflow-x:clip; color:var(--mb-ink); background:#fff;
}
[dir="rtl"] main.mb{ --mb-dir:-1; }
main.mb [id]{ scroll-margin-top:calc(var(--mb-top) + 72px); }
main.mb .mb-sec{ position:relative; padding-block:var(--mb-pad); background:#fff; }
main.mb .mb-sec--ghost{ background:var(--mb-ghost); }
main.mb .mb-sec--tight{ padding-block:clamp(40px, 5vw, 72px); }
main.mb .mb-wrap{ box-sizing:border-box; max-width:var(--mb-w); margin-inline:auto; padding-inline:24px; }
main.mb .mb-wrap--narrow{ max-width:848px; }
main.mb .meta, main.mb .mb-k{ font:500 12px/1.4 var(--font-mono); letter-spacing:.08em; text-transform:uppercase; color:var(--mb-slate); }
main.mb :is(.eyebrow, .logorot__k){ color:var(--mb-slate); }
main.mb :is(h1,h2,h3,h4) :is(.hl,.h-tail){ color:var(--mb-slate); }
main.mb .sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
main.mb :focus-visible{ outline:3px solid var(--mb-purple); outline-offset:2px; }
main.mb svg.mb-i, main.mb .mb-i{ width:20px; height:20px; flex:none; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
main.mb .mb-illus{ margin:16px 0 0; font-size:12px; line-height:1.4; color:var(--mb-slate); text-align:center; }
main.mb .mb-more{ margin:32px 0 0; text-align:center; font-weight:600; }
main.mb .mb-more a, main.mb .mb-link{ color:var(--mb-ink); font-weight:600; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:4px;
  text-decoration-color:var(--mb-line); transition:text-decoration-color var(--mb-t1) var(--mb-ease); background:none; border:0; padding:0; font-size:inherit; font-family:inherit; cursor:pointer; }
main.mb .mb-more a:hover, main.mb .mb-link:hover{ text-decoration-color:currentColor; }
main.mb .mb-link--arr::after{ content:" →"; }
[dir="rtl"] main.mb .mb-link--arr::after{ content:" ←"; }

/* reveal (memb.js adds .is-in once at 20% in view) */
html.mb-js main.mb [data-mb-reveal]:not(.is-in){ opacity:0; transform:translateY(16px); }
main.mb [data-mb-reveal]{ transition:opacity var(--mb-t4) var(--mb-emph), transform var(--mb-t4) var(--mb-emph); }

/* buttons: the site's .btn plus two local skins */
main.mb .btn--ink{ background:#000; border-color:#000; color:#fff; }
main.mb .btn--ink:hover{ background:var(--slate-900); border-color:var(--slate-900); }
main.mb .btn--ink-line{ background:transparent; border-color:#000; color:#000; }
main.mb .btn--ink-line:hover{ background:#000; color:#fff; }
main.mb .mb-btn--white{ background:#fff; border-color:#fff; color:#000; }
main.mb .mb-btn--white:hover{ background:var(--slate-100); border-color:var(--slate-100); }
main.mb .mb-btn--white:focus-visible, main.mb .mb-on-duo :focus-visible{ outline-color:var(--focus-ring-on-duo, #fff); }
main.mb .btn .mb-i{ width:20px; height:20px; transition:transform var(--mb-t1) var(--mb-ease); }
main.mb .btn:hover .mb-i--arr{ transform:translateX(calc(3px * var(--mb-dir))); }
[dir="rtl"] main.mb .mb-i--arr{ transform:scaleX(-1); }
[dir="rtl"] main.mb .btn:hover .mb-i--arr{ transform:scaleX(-1) translateX(3px); }

/* plates: one registered duo per bounded surface (RTL angles at the end of this file) */
main.mb .mb-plate{ position:relative; border-radius:var(--radius-base, 24px); overflow:hidden; isolation:isolate; }
main.mb .mb-plate--honor{ background:linear-gradient(160deg, var(--purple) 0 38%, var(--gold) 100%); }
main.mb .mb-plate--haze{ background:linear-gradient(135deg, var(--ghost-white) 0 40%, var(--purple) 100%); }
main.mb .mb-plate--dew{ background:linear-gradient(135deg, var(--ghost-white) 0 30%, var(--cyan) 100%); }
main.mb .mb-plate--dawn{ background:linear-gradient(135deg, var(--ghost-white) 0 30%, var(--gold) 100%); }
main.mb .mb-plate--mist{ background:linear-gradient(135deg, var(--white) 0%, var(--silver) 100%); }
main.mb .mb-plate--ascent{ background:linear-gradient(160deg, var(--purple) 0 38%, var(--green) 100%); }
main.mb .mb-plate--graphite{ background:linear-gradient(160deg, var(--black) 0 30%, var(--slate) 100%); }
main.mb .mb-plate--prestige{ background:linear-gradient(135deg, var(--black) 0 30%, var(--gold) 100%); }
main.mb .mb-on-duo, main.mb .mb-on-duo :is(h1,h2,h3,p,.eyebrow,.meta){ color:var(--on-duo-ink, #fff); }
main.mb :is(h1,h2,h3).mb-on-duo :is(.hl,.h-tail), main.mb .mb-on-duo :is(h1,h2,h3) :is(.hl,.h-tail){ color:var(--on-duo-ink, #fff); opacity:1; }

/* ============ 1. mb-head: eyebrow, H2 with a slate tail, one lead line ============ */
main.mb .mb-head{ display:flex; flex-direction:column; gap:16px; max-width:820px; margin:0 0 48px; }
main.mb .mb-head--center{ align-items:center; text-align:center; margin-inline:auto; }
main.mb .mb-head > :is(h2,h3){ max-width:26ch; margin:0; }
main.mb .mb-head > p{ max-width:60ch; margin:0; }
main.mb .mb-head > .eyebrow{ margin:0; }

/* ============ 2. mb-subnav: sticky in-page nav under the header (never at the bottom) ============ */
main.mb .mb-subnav{ position:sticky; top:var(--mb-top); z-index:90; height:56px; margin-bottom:-56px;
  background:rgba(255,255,255,.96); box-shadow:inset 0 -1px 0 var(--mb-hair), var(--mb-sh);
  -webkit-backdrop-filter:saturate(1.4) blur(12px); backdrop-filter:saturate(1.4) blur(12px);
  transition:transform var(--mb-t2) var(--mb-ease), opacity var(--mb-t2) var(--mb-ease); }
html:not(.mb-js) main.mb .mb-subnav{ display:none; }
main.mb .mb-subnav[data-state="off"]{ transform:translateY(-100%); opacity:0; pointer-events:none; }
main.mb .mb-subnav__in{ height:100%; display:flex; align-items:center; gap:24px; }
main.mb .mb-subnav__id{ display:flex; align-items:center; gap:10px; margin:0; font-size:14px; white-space:nowrap; }
main.mb .mb-subnav__id b{ font-weight:600; font-size:16px; }
main.mb .mb-subnav__dot{ width:10px; height:10px; border-radius:50%; background:linear-gradient(135deg, var(--purple), var(--gold)); flex:none; }
main.mb .mb-subnav__price{ color:var(--mb-slate); font-variant-numeric:tabular-nums; }
main.mb .mb-subnav__links{ display:flex; gap:4px; list-style:none; margin:0 auto; padding:0; }
main.mb .mb-subnav__links a{ display:block; padding:8px 12px; font-size:14px; font-weight:500; color:var(--mb-slate); text-decoration:none; border-radius:8px;
  box-shadow:inset 0 -2px 0 transparent; transition:color var(--mb-t1) var(--mb-ease), box-shadow var(--mb-t1) var(--mb-ease); }
main.mb .mb-subnav__links a:hover{ color:var(--mb-ink); }
main.mb .mb-subnav__links a[aria-current="true"]{ color:var(--mb-ink); box-shadow:inset 0 -2px 0 var(--mb-ink); border-radius:0; }
main.mb .mb-subnav__cta.btn{ min-height:40px; padding:0 18px; font-size:14px; }

/* ============ 3. mb-hero: centred launch hero ============ */
main.mb .mb-hero{ padding-block:clamp(32px, 4.5vw, 64px) var(--mb-pad); overflow:hidden; }
main.mb .mb-hero__copy{ max-width:780px; margin-inline:auto; display:flex; flex-direction:column; align-items:center; text-align:center; }
main.mb .mb-hero__copy > .eyebrow{ margin:0 0 20px; }
main.mb .mb-hero__copy h1{ margin:0 0 24px; max-width:20ch; }
main.mb .mb-hero__copy .t-lead-hero, main.mb .mb-hero__copy .t-lead{ margin:0; max-width:60ch; }
main.mb .mb-hero__for{ margin:16px 0 0; font-size:16px; color:var(--mb-slate); }
main.mb .mb-hero__for .meta{ display:inline; margin-inline-end:8px; }
main.mb .mb-hero__cta{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:16px 24px; margin-top:32px; }
main.mb .mb-hero__price{ margin:20px 0 0; font-size:14px; color:var(--mb-slate); font-variant-numeric:tabular-nums; }
main.mb .mb-hero__price strong{ color:var(--mb-ink); font-weight:600; }
main.mb .mb-hero__price s{ text-decoration-thickness:1px; }
main.mb .mb-hero__risk{ display:flex; flex-wrap:wrap; justify-content:center; gap:8px 24px; list-style:none; margin:16px 0 0; padding:0; font-size:14px; color:var(--mb-slate); }
main.mb .mb-hero__risk li{ display:flex; align-items:center; gap:8px; }
main.mb .mb-hero__risk li::before, main.mb .mb-check-li::before{ content:""; width:16px; height:16px; flex:none;
  background:currentColor; color:var(--mb-ink);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat; }

/* ============ 4. mb-stage: the product stage (plate + window + phone + member card) ============ */
main.mb .mb-stage{ position:relative; box-sizing:border-box; width:100%; max-width:1200px; margin:64px auto 0; aspect-ratio:16 / 9.4;
  border-radius:var(--radius-base, 24px); overflow:hidden; isolation:isolate; padding:56px 56px 0;
  background:linear-gradient(160deg, var(--purple) 0 38%, var(--gold) 100%); }
main.mb .mb-stage--ascent{ background:linear-gradient(160deg, var(--purple) 0 38%, var(--green) 100%); }
main.mb .mb-stage--graphite{ background:linear-gradient(160deg, var(--black) 0 30%, var(--slate) 100%); }
main.mb .mb-stage > .mb-win{ position:absolute; inset-block-start:56px; inset-inline-start:3%; width:76%; height:calc(100% - 20px);
  -webkit-mask-image:linear-gradient(to bottom, #000 88%, transparent); mask-image:linear-gradient(to bottom, #000 88%, transparent); }
main.mb .mb-stage > .iphone{ --iphone-w:230px; --iphone-fit:.552; position:absolute; z-index:3; inset-inline-end:2.5%; inset-block-end:48px; }
main.mb .mb-stage > .mb-stage__card{ position:absolute; z-index:4; inset-inline-start:2.5%; inset-block-end:36px; width:220px; transform:rotate(-6deg); }
main.mb .mb-stage > .mb-stage__card .mcardobj{ width:100%; }
main.mb .mb-stage > .mb-toast{ position:absolute; z-index:5; inset-block-start:14px; inset-inline:0; margin-inline:auto; width:max-content; }
html.mb-js main.mb .mb-stage:not(.is-in) > .mb-win{ transform:translateY(32px) perspective(1600px) rotateX(10deg); opacity:.4; }
html.mb-js main.mb .mb-stage:not(.is-in) > :is(.iphone, .mb-stage__card){ opacity:0; translate:0 24px; }
main.mb .mb-stage > .mb-win{ transform-origin:50% 0; transition:transform var(--mb-t4) var(--mb-emph), opacity var(--mb-t4) var(--mb-emph); }
main.mb .mb-stage > .iphone{ transition:opacity var(--mb-t4) var(--mb-emph) 120ms, translate var(--mb-t4) var(--mb-emph) 120ms; }
main.mb .mb-stage > .mb-stage__card{ transition:opacity var(--mb-t4) var(--mb-emph) 240ms, translate var(--mb-t4) var(--mb-emph) 240ms; }

/* key facts under the stage */
main.mb .mb-keyfacts{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:0; list-style:none; margin:40px 0 0; padding:0; text-align:start; }
main.mb .mb-keyfacts--3{ grid-template-columns:repeat(3, minmax(0,1fr)); }
main.mb .mb-keyfacts > li{ padding:4px 24px; display:flex; flex-direction:column; gap:8px; }
main.mb .mb-keyfacts > li + li{ border-inline-start:1px solid var(--mb-line); }
main.mb .mb-keyfacts > li:first-child{ padding-inline-start:0; }
main.mb .mb-keyfacts p{ margin:0; font-size:16px; line-height:1.5; color:var(--mb-ink); }
main.mb .mb-keyfacts b{ font-weight:600; }

/* ============ 5. mb-win: the web member space window ============ */
main.mb .mb-win{ box-sizing:border-box; background:#fff; border-radius:12px; overflow:hidden; text-align:start;
  box-shadow:0 1px 2px rgba(0,0,0,.08), 0 40px 80px -40px rgba(0,0,0,.45); font:400 14px/1.4 var(--font-sans); color:#000; }
main.mb .mb-win__bar{ height:40px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding-inline:14px; border-bottom:1px solid var(--mb-hair); background:#fff; }
main.mb .mb-win__dots{ display:flex; gap:6px; }
main.mb .mb-win__dots i{ width:10px; height:10px; border-radius:50%; background:var(--slate-300); }
main.mb .mb-win__logo{ display:block; height:14px; width:auto; }
main.mb .mb-win__search{ justify-self:end; display:flex; align-items:center; gap:6px; width:180px; height:26px; padding-inline:10px; border-radius:8px; background:var(--mb-ghost); color:var(--mb-slate); font-size:12px; }
main.mb .mb-win__search .mb-i{ width:13px; height:13px; }
main.mb .mb-win__body{ display:grid; grid-template-columns:184px minmax(0,1fr) 248px; height:calc(100% - 40px); min-height:420px; }
main.mb .mb-win--noside .mb-win__body{ grid-template-columns:184px minmax(0,1fr); }
main.mb .mb-win__rail{ background:var(--mb-ghost); padding:14px 10px; display:flex; flex-direction:column; gap:2px; border-inline-end:1px solid var(--mb-hair); }
main.mb .mb-win__rail .mb-k{ padding:10px 10px 6px; font-size:11px; }
main.mb .mb-rail__i{ position:relative; display:flex; align-items:center; gap:10px; height:32px; padding-inline:10px; border-radius:8px; color:var(--mb-slate); font-weight:500; font-size:14px; }
main.mb .mb-rail__i .mb-i{ width:16px; height:16px; }
main.mb .mb-rail__i.is-on{ background:#fff; color:#000; box-shadow:0 1px 2px rgba(0,0,0,.06); }
main.mb .mb-rail__i.is-on::before{ content:""; position:absolute; inset-inline-start:-10px; inset-block:6px; width:4px; border-radius:0 4px 4px 0; background:var(--mb-purple); }
main.mb .mb-rail__i .mb-pill{ margin-inline-start:auto; }
main.mb .mb-rail__sub{ display:flex; align-items:center; gap:8px; height:28px; padding-inline:10px 6px; font-size:12px; color:var(--mb-slate); }
main.mb .mb-rail__sub .mb-tile{ width:18px; height:18px; font-size:8px; border-radius:5px; }
main.mb .mb-win__main{ padding:20px 24px; min-width:0; display:flex; flex-direction:column; gap:14px; overflow:hidden; }
main.mb .mb-win__side{ padding:16px; border-inline-start:1px solid var(--mb-hair); background:var(--ghost-white); display:flex; flex-direction:column; gap:12px; min-width:0; overflow:hidden; }
main.mb .mb-win__h{ display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; margin:0; }
main.mb .mb-win__h b{ font-size:17px; font-weight:600; letter-spacing:-.01em; }

/* ============ 6. UI kit: primitives shared by every mockup (aria-hidden, real RIVET facts only) ============ */
main.mb .mb-ui{ box-sizing:border-box; background:#fff; border-radius:12px; box-shadow:var(--mb-sh); padding:14px 16px; font:400 14px/1.45 var(--font-sans); color:#000; text-align:start; min-width:0; }
main.mb .mb-ui--flat{ box-shadow:none; background:var(--mb-ghost); }
main.mb .mb-ui--lift{ box-shadow:var(--mb-sh-lg); }
main.mb .mb-ui p{ margin:0; }
main.mb .mb-ui b, main.mb .mb-ps b{ font-weight:600; }
main.mb .mb-ui__hd{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 8px; margin:0 0 10px; }
main.mb .mb-ui__hd > b{ font-size:14px; }
main.mb .mb-ui__hd > .mb-k:not(:first-child), main.mb .mb-ui__hd > .mb-pill:last-child:not(:first-child){ margin-inline-start:auto; }
main.mb .mb-ui__meta{ color:var(--mb-slate); font-size:12px; }
main.mb .mb-ui .mb-k, main.mb .mb-ps .mb-k{ font-size:11px; letter-spacing:.08em; }
main.mb .mb-ui__stack{ display:flex; flex-direction:column; gap:8px; }
main.mb .mb-ui__grid2{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:10px; }

/* pills and chips inside UI */
main.mb .mb-pill{ display:inline-flex; align-items:center; gap:6px; min-height:24px; max-width:100%; box-sizing:border-box; padding:3px 10px; border-radius:999px; background:var(--mb-ghost); color:var(--mb-slate);
  font:500 12px/1.25 var(--font-sans); flex:none; }
main.mb .mb-pill .mb-i{ width:12px; height:12px; }
main.mb .mb-pill--on{ background:#000; color:#fff; }
main.mb .mb-pill--line{ background:#fff; box-shadow:inset 0 0 0 1px var(--mb-line); color:#000; }
main.mb .mb-pill--purple{ background:var(--mb-p100); color:var(--purple); }
main.mb .mb-pill--ok{ background:var(--green); color:#000; }
main.mb .mb-pill--soon{ background:var(--gold-50); color:var(--gold-700); }
main.mb .mb-pill--dev{ background:var(--cyan-50); color:var(--cyan-800); }
main.mb .mb-pill--scrim{ background:var(--scrim); color:#fff; font-family:var(--font-mono); letter-spacing:.06em; text-transform:uppercase; font-size:11px; }
main.mb .mb-pill--mono{ font-family:var(--font-mono); letter-spacing:.06em; text-transform:uppercase; font-size:11px; }
/* the one insight per screen: magenta, white text, 14px semibold */
main.mb .mb-pill--hot{ min-height:28px; white-space:nowrap; padding-inline:12px; background:var(--magenta); color:#fff; font:600 14px/1 var(--font-sans); }
main.mb .mb-pill--new{ height:20px; padding-inline:8px; background:var(--mb-purple); color:#fff; font-size:11px; }

/* avatars and tiles */
main.mb .mb-av{ display:inline-grid; place-items:center; width:28px; height:28px; border-radius:50%; flex:none; background:var(--mb-p100); color:var(--purple-900); font:600 11px/1 var(--font-sans); letter-spacing:.02em; overflow:hidden; }
main.mb .mb-av--b{ background:var(--gold-100); color:var(--gold-800); }
main.mb .mb-av--c{ background:var(--cyan-100); color:var(--cyan-800); }
main.mb .mb-av--d{ background:var(--slate-100); color:var(--slate-900); }
main.mb .mb-av--lg{ width:40px; height:40px; font-size:14px; }
main.mb .mb-av img{ width:100%; height:100%; object-fit:cover; display:block; }
main.mb .mb-avs{ display:flex; align-items:center; }
main.mb .mb-avs > *{ box-shadow:0 0 0 2px #fff; }
main.mb .mb-avs > * + *{ margin-inline-start:-8px; }
main.mb .mb-tile{ display:inline-grid; place-items:center; width:30px; height:30px; border-radius:8px; flex:none; background:var(--mb-ghost); color:#000; font:600 11px/1 var(--font-mono); letter-spacing:.04em; }
main.mb .mb-tile--ink{ background:#000; color:#fff; }
main.mb .mb-tile--purple{ background:var(--mb-p100); color:var(--purple); }

/* rows, buttons, toggles, ticks, bars, toasts, cursor */
main.mb .mb-li{ display:flex; align-items:center; gap:10px; min-height:36px; padding:6px 8px; border-radius:8px; }
main.mb .mb-li > span:not([class]){ display:flex; flex-direction:column; min-width:0; }
main.mb .mb-li small, main.mb .mb-ui small{ color:var(--mb-slate); font-size:12px; }
main.mb .mb-li > :last-child:not(:first-child):is(.mb-pill,.mb-ubtn,.mb-toggle,.mb-dot,em){ margin-inline-start:auto; }
main.mb .mb-li.is-sel, main.mb [data-mb-fx="sel"]{ background:var(--mb-psub); box-shadow:inset 3px 0 0 var(--mb-purple); }
[dir="rtl"] main.mb .mb-li.is-sel, [dir="rtl"] main.mb [data-mb-fx="sel"]{ box-shadow:inset -3px 0 0 var(--mb-purple); }
main.mb .mb-ubtn{ display:inline-flex; align-items:center; justify-content:center; gap:6px; height:28px; padding-inline:12px; border-radius:8px; background:#000; color:#fff; font:600 12px/1 var(--font-sans); font-style:normal; white-space:nowrap; }
main.mb .mb-ubtn--ghost{ background:#fff; color:#000; box-shadow:inset 0 0 0 1px var(--mb-line); }
main.mb .mb-ubtn--done{ background:var(--mb-p100); color:var(--purple); }
main.mb .mb-ubtn .mb-i{ width:13px; height:13px; }
main.mb .mb-toggle{ position:relative; width:34px; height:20px; border-radius:999px; background:var(--mb-purple); flex:none; transition:background-color var(--mb-t2) var(--mb-ease); }
main.mb .mb-toggle::after{ content:""; position:absolute; inset-block-start:2px; inset-inline-start:16px; width:16px; height:16px; border-radius:50%; background:#fff; box-shadow:0 1px 2px rgba(0,0,0,.2); transition:inset-inline-start var(--mb-t2) var(--mb-ease); }
main.mb .mb-toggle.is-off{ background:var(--slate-300); }
main.mb .mb-toggle.is-off::after{ inset-inline-start:2px; }
main.mb .mb-tick{ display:inline-grid; place-items:center; width:18px; height:18px; border-radius:50%; flex:none; background:var(--green); color:#000; transition:background-color var(--mb-t3) var(--mb-ease); }
main.mb .mb-tick svg{ width:11px; height:11px; fill:none; stroke:currentColor; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:24; stroke-dashoffset:0; transition:stroke-dashoffset var(--mb-t3) var(--mb-ease); }
main.mb .mb-tick--todo{ background:#fff; box-shadow:inset 0 0 0 1.5px var(--mb-line); color:transparent; }
main.mb .mb-dot{ width:8px; height:8px; border-radius:50%; background:var(--mb-slate); flex:none; }
main.mb .mb-dot--purple{ background:var(--mb-purple); }
main.mb .mb-bar{ position:relative; display:block; height:6px; border-radius:999px; background:var(--mb-hair); overflow:hidden; }
main.mb .mb-bar > i{ position:absolute; inset:0; border-radius:inherit; background:var(--mb-purple); transform-origin:0 50%; transform:scaleX(var(--v, 1)); transition:transform var(--mb-t4) var(--mb-emph); }
[dir="rtl"] main.mb .mb-bar > i{ transform-origin:100% 50%; }
main.mb .mb-toast{ display:inline-flex; align-items:center; gap:10px; padding:10px 14px; border-radius:12px; background:#fff; box-shadow:var(--mb-sh-lg); font:500 14px/1.3 var(--font-sans); color:#000; }
main.mb .mb-toast .mb-i{ width:16px; height:16px; color:var(--mb-purple); }
main.mb .mb-toast--ink{ background:#000; color:#fff; }
main.mb .mb-toast--ink .mb-i{ color:#fff; }
main.mb .mb-cursor{ position:absolute; z-index:9; width:20px; height:20px; inset-block-start:var(--mb-cy, 50%); inset-inline-start:var(--mb-cx, 50%); pointer-events:none;
  transition:inset-block-start var(--mb-t4) var(--mb-emph), inset-inline-start var(--mb-t4) var(--mb-emph); }
main.mb .mb-cursor svg{ width:20px; height:20px; display:block; fill:var(--mb-purple); stroke:#fff; stroke-width:1.5; filter:drop-shadow(0 2px 3px rgba(0,0,0,.25)); }
[dir="rtl"] main.mb .mb-cursor svg{ transform:scaleX(-1); }
main.mb .mb-cursor::after{ content:""; position:absolute; inset-block-start:-12px; inset-inline-start:-12px; width:24px; height:24px; border-radius:50%; box-shadow:0 0 0 2px var(--mb-purple); opacity:0; }
main.mb .mb-cursor.is-click::after{ animation:mb-ripple var(--mb-t3) var(--mb-ease) 1; }
@keyframes mb-ripple{ from{ opacity:1; transform:scale(.6); } to{ opacity:0; transform:scale(1.4); } }

/* ============ 7. Steps: final frame is the base style; html.mb-js + no .is-on is the before-state ============ */
main.mb [data-mb-step]{ transition:opacity var(--mb-t3) var(--mb-ease), transform var(--mb-t3) var(--mb-ease), background-color var(--mb-t3) var(--mb-ease), box-shadow var(--mb-t3) var(--mb-ease), color var(--mb-t3) var(--mb-ease); }
html.mb-js main.mb [data-mb-steps] [data-mb-step]:not(.is-on){ opacity:0; transform:translateY(12px); }
html.mb-js main.mb [data-mb-steps] [data-mb-step][data-mb-fx="pop"]:not(.is-on){ transform:scale(.96); }
main.mb [data-mb-step][data-mb-fx="pop"]{ transition-duration:var(--mb-t2); }
main.mb [data-mb-step][data-mb-fx="fill"]{ transform-origin:0 50%; transition:transform var(--mb-t4) var(--mb-emph); }
[dir="rtl"] main.mb [data-mb-step][data-mb-fx="fill"]{ transform-origin:100% 50%; }
html.mb-js main.mb [data-mb-steps] [data-mb-step][data-mb-fx="fill"]:not(.is-on){ opacity:1; transform:scaleX(0); }
main.mb [data-mb-step][data-mb-fx="move"]{ transform:translateX(calc(var(--mb-dir) * var(--mb-dx, 0px))); transition:transform var(--mb-t4) var(--mb-emph); }
html.mb-js main.mb [data-mb-steps] [data-mb-step][data-mb-fx="move"]:not(.is-on){ opacity:1; transform:none; }
html.mb-js main.mb [data-mb-steps] [data-mb-step]:is([data-mb-fx="sel"],[data-mb-fx="lit"],[data-mb-fx="swap"],[data-mb-fx="tick"],[data-mb-fx="none"]):not(.is-on){ opacity:1; transform:none; }
html.mb-js main.mb [data-mb-steps] [data-mb-step][data-mb-fx="sel"]:not(.is-on){ background:transparent; box-shadow:none; }
html.mb-js main.mb [data-mb-steps] [data-mb-step][data-mb-fx="tick"]:not(.is-on){ background:#fff; box-shadow:inset 0 0 0 1.5px var(--mb-line); color:transparent; }
html.mb-js main.mb [data-mb-steps] [data-mb-step][data-mb-fx="tick"]:not(.is-on) svg{ stroke-dashoffset:24; }
/* swap: two children; the second is the final frame */
main.mb [data-mb-fx="swap"]{ display:inline-grid; }
main.mb [data-mb-fx="swap"] > *{ grid-area:1 / 1; transition:opacity var(--mb-t2) var(--mb-ease); }
main.mb [data-mb-fx="swap"] > :first-child{ opacity:0; }
html.mb-js main.mb [data-mb-steps] [data-mb-fx="swap"]:not(.is-on) > :first-child{ opacity:1; }
html.mb-js main.mb [data-mb-steps] [data-mb-fx="swap"]:not(.is-on) > :last-child{ opacity:0; }
/* ticks outside a stage follow a runner */
main.mb [data-mb-tick]{ transition:color var(--mb-t3) var(--mb-ease); }
html.mb-js main.mb [data-mb-ticks-for] [data-mb-tick]:not(.is-done){ color:var(--mb-slate); }
html.mb-js main.mb [data-mb-ticks-for] [data-mb-tick]:not(.is-done) .mb-tick{ background:#fff; box-shadow:inset 0 0 0 1.5px var(--mb-line); color:transparent; }
html.mb-js main.mb [data-mb-ticks-for] [data-mb-tick]:not(.is-done) .mb-tick svg{ stroke-dashoffset:24; }

/* ============ 8. Phone screens (390 x 848 HTML inside .iphone > .iphone__screen > .iphone__fit) ============ */
main.mb .mb-ps{ position:relative; box-sizing:border-box; width:390px; height:848px; padding:58px 0 96px; background:#fff; color:#000; font:400 16px/1.4 var(--font-sans); text-align:start; overflow:hidden; }
main.mb .mb-ps__bar{ position:absolute; inset-block-start:0; inset-inline:0; height:50px; display:flex; align-items:center; justify-content:space-between; padding-inline:34px 30px; font:600 16px/1 var(--font-sans); }
main.mb .mb-ps__bar i{ width:42px; height:12px; border-radius:3px; background:linear-gradient(90deg, #000 0 70%, transparent 70%); box-shadow:inset 0 0 0 1px #000; }
main.mb .mb-ps__top{ display:flex; align-items:center; gap:10px; padding:6px 20px 12px; }
main.mb .mb-ps__top > b{ font-size:26px; font-weight:600; letter-spacing:-.02em; }
main.mb .mb-ps__top > :last-child:not(:first-child){ margin-inline-start:auto; }
main.mb .mb-ps__body{ display:flex; flex-direction:column; gap:12px; padding-inline:18px; }
main.mb .mb-ps__chips{ display:flex; gap:8px; padding:0 18px 14px; }
main.mb .mb-ps__chips .mb-pill{ height:34px; padding-inline:16px; font-size:14px; }
main.mb .mb-ps__card{ display:flex; flex-direction:column; gap:4px; padding:14px 16px; border-radius:16px; background:var(--mb-ghost); }
main.mb .mb-ps__card small{ color:var(--mb-slate); font-size:14px; }
main.mb .mb-ps__card b{ font-size:17px; }
main.mb .mb-ps__card > span{ color:var(--mb-slate); font-size:14px; }
main.mb .mb-ps__card--tint{ background:var(--mb-p100); }
main.mb .mb-ps__card .mb-ubtn{ align-self:flex-start; height:34px; margin-top:6px; padding-inline:16px; font-size:14px; border-radius:10px; }
main.mb .mb-ps__who{ display:flex; align-items:center; gap:10px; margin-bottom:6px; }
main.mb .mb-ps__who .mb-av{ width:36px; height:36px; font-size:12px; }
main.mb .mb-ps__who > span{ display:flex; flex-direction:column; }
main.mb .mb-ps__tabs{ position:absolute; inset-block-end:0; inset-inline:0; height:84px; display:grid; grid-template-columns:repeat(4, 1fr); padding:8px 12px 0; border-top:1px solid var(--mb-hair); background:#fff; }
main.mb .mb-ps__tabs > span{ display:flex; flex-direction:column; align-items:center; gap:4px; color:var(--slate-500); font:500 11px/1 var(--font-sans); }
main.mb .mb-ps__tabs > span.is-on{ color:#000; }
main.mb .mb-ps__tabs svg{ width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
main.mb .mb-ps__tabs::after{ content:""; position:absolute; inset-block-end:9px; inset-inline:0; margin-inline:auto; width:134px; height:5px; border-radius:999px; background:#000; }
main.mb .mb-ps .mb-pill{ font-size:14px; height:28px; }
main.mb .mb-ps .mb-pill--new{ height:24px; }
main.mb .mb-ps .mb-li{ min-height:52px; padding:8px 12px; border-radius:12px; font-size:16px; }
main.mb .mb-ps .mb-tile{ width:40px; height:40px; border-radius:12px; font-size:14px; }
main.mb .mb-ps .mb-ubtn{ height:34px; font-size:14px; }

/* ============ 9. The UI catalogue (UI-1 ... UI-20) ============ */
/* UI-1 course player */
main.mb .mb-ui-course{ display:flex; flex-direction:column; gap:12px; min-width:0; }
main.mb .mb-ui-course__hd{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; }
main.mb .mb-ui-course__hd b{ font-size:16px; letter-spacing:-.01em; }
main.mb .mb-parts{ display:flex; flex-direction:column; gap:2px; list-style:none; margin:0; padding:0; }
main.mb .mb-part{ display:grid; grid-template-columns:18px minmax(0,1fr) auto; align-items:center; gap:10px; min-height:32px; padding:4px 10px; border-radius:8px; font-size:12px; }
main.mb .mb-part .mb-k{ font-size:11px; white-space:nowrap; }
main.mb .mb-part > span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* UI-2 feed, UI-3 rooms, UI-4 events: phone screens use .mb-ps; web variants use .mb-ui */
main.mb .mb-rooms{ display:flex; flex-direction:column; gap:2px; list-style:none; margin:0; padding:0; }
main.mb .mb-rooms .is-locked{ color:var(--mb-slate); }
main.mb .mb-week{ display:grid; grid-template-columns:repeat(7, 1fr); gap:6px; padding:0 18px 14px; }
main.mb .mb-week > span{ display:grid; place-items:center; height:44px; border-radius:12px; background:var(--mb-ghost); font:600 14px/1 var(--font-sans); color:var(--mb-slate); }
main.mb .mb-week > span.is-on{ background:#000; color:#fff; }
main.mb .mb-ev{ display:flex; flex-direction:column; gap:6px; }
main.mb .mb-ev__row{ display:flex; align-items:center; gap:10px; margin-top:6px; }
main.mb .mb-ev__row > :last-child:not(:first-child){ margin-inline-start:auto; }

/* UI-5 chapter thread */
main.mb .mb-thread{ display:flex; flex-direction:column; gap:12px; }
main.mb .mb-msg{ display:flex; gap:10px; align-items:flex-start; }
main.mb .mb-msg > p{ display:flex; flex-direction:column; gap:2px; padding:10px 12px; border-radius:4px 12px 12px 12px; background:var(--mb-ghost); font-size:14px; line-height:1.45; }
[dir="rtl"] main.mb .mb-msg > p{ border-radius:12px 4px 12px 12px; }
main.mb .mb-msg small{ font-size:11px; color:var(--mb-slate); }
main.mb .mb-thread__ft{ display:flex; align-items:center; gap:8px; color:var(--mb-slate); font-size:12px; padding-inline-start:38px; }

/* UI-6 credential share card */
main.mb .mb-cred{ position:relative; display:flex; flex-direction:column; gap:4px; padding:16px; border-radius:12px; background:#fff; box-shadow:var(--mb-sh); }
main.mb .mb-cred b{ font-size:16px; line-height:1.3; }
main.mb .mb-cred__seal{ position:absolute; inset-block-start:14px; inset-inline-end:14px; width:34px; height:34px; border-radius:50%; background:var(--gold); color:#000; display:grid; place-items:center; }
main.mb .mb-cred__seal svg{ width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; }
main.mb .mb-cred__acts{ display:flex; gap:8px; margin-top:10px; }

/* UI-7 agent library */
main.mb .mb-agents{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:8px; align-items:start; }
main.mb .mb-agent{ display:flex; flex-direction:column; gap:4px; padding:10px 12px; border-radius:10px; background:#fff; box-shadow:var(--mb-sh); min-width:0; }
main.mb .mb-agent__hd{ display:flex; align-items:center; gap:8px; }
main.mb .mb-agent__hd b{ font-size:14px; line-height:1.2; }
main.mb .mb-agent__ic{ display:grid; place-items:center; width:24px; height:24px; border-radius:7px; background:#000; color:#fff; flex:none; }
main.mb .mb-agent__ic svg{ width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
main.mb .mb-agent p{ font-size:12px; line-height:1.4; color:var(--mb-slate); }
main.mb .mb-agent .mb-k{ font-size:11px; }
main.mb .mb-agent__toast{ position:relative; margin-top:6px; padding:8px 10px; border-radius:10px; background:#000; color:#fff; font-size:12px; line-height:1.4; }
main.mb .mb-agent__toast::before{ content:""; position:absolute; inset-block-start:-5px; inset-inline-start:14px; width:10px; height:10px; background:#000; transform:rotate(45deg); }

/* UI-8 one-page system (CRGA canvas) */
main.mb .mb-canvas{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:8px; }
main.mb .mb-model{ position:relative; display:flex; flex-direction:column; justify-content:space-between; gap:10px; min-height:68px; padding:10px 12px; border-radius:10px; background:var(--mb-ghost); font-weight:600; font-size:14px; overflow-wrap:anywhere; min-width:0; }
main.mb .mb-model .mb-k{ font-size:11px; font-weight:500; }
main.mb .mb-model.is-kernel{ background:#fff; box-shadow:inset 0 0 0 1.5px #000; }
main.mb .mb-model[data-mb-fx="lit"], main.mb .mb-model.is-start{ background:var(--mb-purple); color:#fff; box-shadow:none; }
main.mb .mb-model[data-mb-fx="lit"] .mb-k, main.mb .mb-model.is-start .mb-k{ color:var(--purple-200); }
html.mb-js main.mb [data-mb-steps] .mb-model[data-mb-fx="lit"]:not(.is-on){ background:var(--mb-ghost); color:#000; }
html.mb-js main.mb [data-mb-steps] .mb-model[data-mb-fx="lit"]:not(.is-on) .mb-k{ color:var(--mb-slate); }
main.mb .mb-model.is-kernel[data-mb-fx="lit"]{ box-shadow:none; }
main.mb .mb-model .mb-pill--hot{ position:absolute; inset-block-start:-12px; inset-inline-end:8px; }
main.mb .mb-loop{ display:block; width:100%; height:auto; margin-top:6px; }
main.mb .mb-loop path{ fill:none; stroke:var(--mb-purple); stroke-width:2; stroke-linecap:round; }
main.mb .mb-loop .mb-loop__back{ stroke:var(--mb-line); stroke-dasharray:4 5; }
main.mb .mb-loop circle{ fill:#fff; stroke:#000; stroke-width:2; }
main.mb .mb-loop text{ font:500 11px var(--font-sans); fill:var(--mb-slate); }
main.mb .mb-loop .mb-loop__t{ font-weight:600; fill:#000; }
main.mb [data-mb-step][data-mb-fx="draw"] path{ stroke-dasharray:var(--len, 600); stroke-dashoffset:0; transition:stroke-dashoffset 900ms var(--mb-emph); }
html.mb-js main.mb [data-mb-steps] [data-mb-step][data-mb-fx="draw"]:not(.is-on){ opacity:1; transform:none; }
html.mb-js main.mb [data-mb-steps] [data-mb-step][data-mb-fx="draw"]:not(.is-on) path{ stroke-dashoffset:var(--len, 600); }

/* UI-9 the agent board (columns that hand work on) */
main.mb .mb-board{ display:grid; grid-template-columns:repeat(var(--cols, 4), minmax(0,1fr)); gap:10px; }
main.mb .mb-col{ display:flex; flex-direction:column; gap:8px; min-height:300px; padding:10px; border-radius:12px; background:var(--mb-ghost); min-width:0; }
main.mb .mb-col__hd{ display:flex; flex-direction:column; gap:6px; padding-bottom:6px; }
main.mb .mb-col__hd b{ font-size:14px; }
main.mb .mb-col__hd .mb-pill{ align-self:flex-start; height:20px; font-size:11px; padding-inline:8px; max-width:100%; overflow:hidden; text-overflow:ellipsis; }
main.mb .mb-acct{ display:flex; flex-direction:column; gap:6px; padding:10px; border-radius:10px; background:#fff; box-shadow:var(--mb-sh); font-size:12px; font-weight:600; }
main.mb .mb-acct .mb-bar{ height:4px; }
main.mb .mb-acct--ghost{ background:transparent; box-shadow:inset 0 0 0 1.5px var(--mb-line); box-shadow:none; outline:1.5px dashed var(--mb-line); outline-offset:-1.5px; color:var(--mb-slate); font-weight:500; min-height:58px; }
main.mb .mb-handoff{ display:flex; align-items:center; gap:8px; justify-content:center; margin-top:10px; color:var(--mb-slate); font:500 11px/1.2 var(--font-mono); letter-spacing:.06em; text-transform:uppercase; }
main.mb .mb-handoff svg{ width:56px; height:12px; fill:none; stroke:var(--mb-purple); stroke-width:2; stroke-linecap:round; }
[dir="rtl"] main.mb .mb-handoff svg{ transform:scaleX(-1); }

/* UI-10 five checks */
main.mb .mb-checks{ display:grid; grid-template-columns:repeat(5, 1fr); gap:6px; margin-top:8px; }
main.mb .mb-checks > i{ height:10px; border-radius:999px; background:var(--mb-purple); }
html.mb-js main.mb [data-mb-steps] .mb-checks > i[data-mb-step]:not(.is-on){ opacity:1; transform:none; background:var(--mb-hair); }

/* UI-11 lifecycle */
main.mb .mb-flow{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
main.mb .mb-flow > .mb-sep{ width:16px; height:2px; border-radius:2px; background:var(--mb-line); }
main.mb .mb-day{ display:grid; grid-template-columns:repeat(3, 1fr); gap:6px; }
main.mb .mb-day > span{ display:flex; flex-direction:column; gap:4px; padding:8px 10px; border-radius:8px; background:var(--mb-psub); font-size:12px; color:var(--mb-slate); }
main.mb .mb-day > span b{ color:#000; font-size:12px; }

/* UI-12 leader's week */
main.mb .mb-lanes{ display:flex; flex-direction:column; gap:8px; }
main.mb .mb-lane{ display:grid; grid-template-columns:96px minmax(0,1fr); align-items:center; gap:10px; }
main.mb .mb-lane > b{ font-size:12px; }
main.mb .mb-lane__track{ display:grid; grid-template-columns:repeat(5, 1fr); gap:4px; }
main.mb .mb-lane__track > i{ height:22px; border-radius:6px; background:var(--mb-hair); }
main.mb .mb-lane__track > i.is-a{ background:var(--mb-purple); }
main.mb .mb-lane__track > i.is-r{ background:var(--mb-p200); }
main.mb .mb-lane__track > i.is-y{ background:#000; }
main.mb .mb-rule{ display:flex; flex-direction:column; gap:2px; }
main.mb .mb-rule > span{ display:flex; align-items:center; gap:8px; padding:6px 0; border-top:1px solid var(--mb-hair); font-size:12px; }
main.mb .mb-rule > span:first-child{ border-top:0; }

/* UI-13 GTM Engineering (coming) */
main.mb .mb-pipe{ display:block; width:100%; height:auto; }
main.mb .mb-pipe path{ fill:none; stroke:var(--mb-purple); stroke-width:2; stroke-linecap:round; }
main.mb .mb-pipe rect{ fill:#fff; stroke:#000; stroke-width:1.5; }
main.mb .mb-pipe text{ font:600 12px var(--font-sans); fill:#000; }
main.mb .mb-answers{ display:flex; align-items:center; gap:8px; }
main.mb .mb-answers img{ width:22px; height:22px; border-radius:6px; background:#fff; padding:3px; box-shadow:var(--mb-sh); object-fit:contain; }
main.mb .mb-seg{ display:inline-flex; padding:2px; border-radius:8px; background:var(--mb-ghost); margin-inline-start:auto; }
main.mb .mb-seg > span{ padding:4px 10px; border-radius:6px; font:600 11px/1 var(--font-mono); color:var(--mb-slate); }
main.mb .mb-seg > span.is-on, main.mb .mb-seg [data-mb-fx="swap"] > :last-child{ background:#fff; color:#000; box-shadow:var(--mb-sh); }

/* UI-14 team space */
main.mb .mb-seats{ display:flex; flex-wrap:wrap; gap:6px; }
main.mb .mb-seat{ display:grid; place-items:center; width:32px; height:32px; border-radius:50%; background:var(--mb-ghost); box-shadow:inset 0 0 0 1.5px var(--mb-line); color:var(--mb-slate); font:600 11px/1 var(--font-sans); }
main.mb .mb-seat.is-on, main.mb .mb-seat[data-mb-step]{ background:var(--mb-p100); color:var(--purple-900); box-shadow:none; }
html.mb-js main.mb [data-mb-steps] .mb-seat[data-mb-step]:not(.is-on){ opacity:1; transform:none; background:var(--mb-ghost); box-shadow:inset 0 0 0 1.5px var(--mb-line); color:transparent; }

/* UI-15 streaks, UI-18 leaderboard, UI-19 alerts, UI-20 start here */
main.mb .mb-streak{ display:flex; gap:12px; align-items:stretch; }
main.mb .mb-streak__card{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; padding:14px; border-radius:14px; background:linear-gradient(160deg, var(--black) 0 40%, var(--purple) 100%); color:#fff; }
main.mb .mb-streak__card b{ font:600 20px/1 var(--font-sans); }
main.mb .mb-streak__card img{ width:36px; height:36px; border-radius:50%; object-fit:cover; box-shadow:0 0 0 2px #fff; }
main.mb .mb-streak__dots{ display:flex; gap:5px; }
main.mb .mb-streak__dots i{ width:12px; height:12px; border-radius:50%; background:var(--gold); }
main.mb .mb-streak__dots i:nth-child(2){ background:var(--purple-500, var(--purple-500)); }
main.mb .mb-streak__dots i:nth-child(3){ background:var(--cyan); }
main.mb .mb-ladder{ flex:1.25; display:grid; grid-template-columns:1fr 1fr; gap:6px; align-content:center; }
main.mb .mb-ladder > span{ display:flex; align-items:center; gap:6px; height:28px; padding-inline:10px; border-radius:999px; background:#fff; box-shadow:var(--mb-sh); font-size:12px; white-space:nowrap; }
main.mb .mb-ladder > span::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--mb-purple); }
main.mb .mb-lb{ display:flex; flex-direction:column; gap:14px; list-style:none; margin:0; padding:0; }
main.mb .mb-lb > li{ display:grid; grid-template-columns:36px minmax(0,1fr); align-items:center; gap:10px; font:500 12px/1 var(--font-mono); color:var(--mb-slate); }
main.mb .mb-start{ display:grid; grid-template-columns:repeat(2, 1fr); gap:10px; }
main.mb .mb-start > span{ display:flex; flex-direction:column; justify-content:flex-end; gap:6px; min-height:84px; padding:14px; border-radius:14px; background:var(--mb-ghost); font-weight:600; font-size:16px; }
main.mb .mb-start > span .mb-i{ width:22px; height:22px; }
main.mb .mb-start > .mb-start__wide{ grid-column:1 / -1; min-height:72px; background:#000; color:#fff; font:600 14px/1.2 var(--font-mono); letter-spacing:.08em; text-transform:uppercase; }

/* ============ 10. mb-painfix: pain, a line that fills on scroll, then the fix ============ */
main.mb .mb-painfix{ --mb-p:1; }
html.mb-js main.mb .mb-painfix{ --mb-p:0; }
main.mb .mb-painfix__grid{ display:grid; grid-template-columns:40px repeat(11, minmax(0,1fr)); column-gap:24px; row-gap:32px; }
main.mb .mb-painfix__line{ grid-column:1; grid-row:1 / span 3; justify-self:center; position:relative; width:2px; margin-block:40px 16px; border-radius:2px; background:var(--mb-line); }
main.mb .mb-painfix__fill{ position:absolute; inset:0; border-radius:inherit; background:var(--mb-purple); transform-origin:50% 0; transform:scaleY(var(--mb-p)); }
main.mb .mb-painfix__a{ grid-column:2 / span 5; grid-row:1; display:flex; flex-direction:column; gap:16px; align-self:end; }
main.mb .mb-painfix__a > *{ margin:0; }
main.mb .mb-painfix__voices{ grid-column:2 / span 5; grid-row:2; list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:20px; }
main.mb .mb-painfix__voices li{ display:flex; flex-direction:column; gap:6px; padding-inline-start:20px; border-inline-start:2px solid var(--mb-hair); }
main.mb .mb-painfix__voices p{ margin:0; font-size:18px; line-height:1.45; color:#000; }
main.mb .mb-sprawl{ grid-column:7 / span 6; grid-row:1 / span 2; align-self:center; }
main.mb .mb-painfix__b{ grid-column:2 / span 11; grid-row:3; display:flex; flex-direction:column; gap:20px; padding-top:24px; }
main.mb .mb-painfix__b > h3{ margin:0; max-width:30ch; }
main.mb .mb-painfix__b > .meta{ margin:0; }
main.mb .mb-mark{ position:relative; display:grid; place-items:center; width:32px; height:32px; border-radius:50%; background:var(--mb-ghost); color:var(--mb-slate); }
main.mb .mb-mark svg{ width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; }
main.mb .mb-mark--ok{ background:var(--green); color:#000; transition:background-color var(--mb-t2) var(--mb-ease), transform var(--mb-t2) var(--mb-ease); }
html.mb-js main.mb .mb-painfix:not(.is-done) .mb-mark--ok{ background:var(--mb-ghost); color:var(--mb-slate); transform:scale(.92); }
main.mb .mb-painfix__a .mb-mark, main.mb .mb-painfix__b .mb-mark{ margin-inline-start:calc(-40px - 24px + 4px); margin-block-end:-48px; }
main.mb .mb-fixlist{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:16px 32px; list-style:none; margin:0; padding:0; }
main.mb .mb-fixlist li{ display:flex; gap:12px; align-items:flex-start; font-size:16px; line-height:1.5; color:var(--mb-slate); }
main.mb .mb-fixlist li b{ color:#000; font-weight:600; }
main.mb .mb-fixlist li > .mb-tick{ margin-top:2px; }
/* ============ 11. mb-player: tab cards drive one big stage ============ */
main.mb .mb-player__bar{ display:flex; align-items:stretch; gap:12px; }
main.mb .mb-player__tabs{ flex:1; display:grid; grid-template-columns:repeat(var(--n, 4), minmax(0,1fr)); gap:12px; }
main.mb .mb-tab{ position:relative; display:flex; flex-direction:column; align-items:flex-start; gap:6px; padding:18px 20px 22px; border:0; border-radius:12px; background:var(--mb-ghost); color:var(--mb-slate);
  font:inherit; text-align:start; cursor:pointer; overflow:hidden; transition:background-color var(--mb-t2) var(--mb-ease), box-shadow var(--mb-t2) var(--mb-ease), color var(--mb-t2) var(--mb-ease); }
main.mb .mb-tab:hover{ background:var(--slate-100); }
main.mb .mb-tab > .mb-i{ width:20px; height:20px; color:var(--mb-slate); }
main.mb .mb-tab > b{ font-size:16px; font-weight:600; color:#000; line-height:1.3; }
main.mb .mb-tab__d{ font-size:14px; line-height:1.45; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
main.mb .mb-tab[aria-selected="true"]{ background:#fff; box-shadow:var(--mb-sh); color:var(--mb-slate); }
main.mb .mb-tab[aria-selected="true"] > .mb-i{ color:var(--mb-purple); }
main.mb .mb-tab__bar{ position:absolute; inset-inline:20px; inset-block-end:10px; height:3px; border-radius:2px; background:var(--mb-hair); overflow:hidden; opacity:0; }
main.mb .mb-tab__bar::after{ content:""; position:absolute; inset:0; background:var(--mb-purple); transform-origin:0 50%; transform:scaleX(0); }
[dir="rtl"] main.mb .mb-tab__bar::after{ transform-origin:100% 50%; }
main.mb [data-mb-player].is-auto .mb-tab[aria-selected="true"] .mb-tab__bar{ opacity:1; }
main.mb [data-mb-player].is-auto .mb-tab[aria-selected="true"] .mb-tab__bar::after{ animation:mb-fill var(--mb-auto, 9000ms) linear forwards; }
main.mb [data-mb-player].is-held .mb-tab[aria-selected="true"] .mb-tab__bar::after{ animation-play-state:paused; }
@keyframes mb-fill{ to{ transform:scaleX(1); } }
main.mb .mb-pause{ align-self:flex-start; display:inline-flex; align-items:center; gap:6px; height:32px; padding-inline:12px; border:0; border-radius:999px; background:#fff; color:#000; box-shadow:inset 0 0 0 1px #000; font:600 14px/1 var(--font-sans); cursor:pointer; flex:none; }
main.mb .mb-pause .mb-i{ width:14px; height:14px; }
main.mb .mb-pause__r, main.mb .mb-pause.is-paused .mb-pause__p{ display:none; }
main.mb .mb-pause.is-paused .mb-pause__r{ display:inline-flex; align-items:center; gap:6px; }
main.mb .mb-pause__p{ display:inline-flex; align-items:center; gap:6px; }
html:not(.mb-js) main.mb .mb-pause{ display:none; }
main.mb .mb-player__panels{ margin-top:24px; }
main.mb .mb-panel{ outline:none; }
main.mb .mb-panel + .mb-panel{ margin-top:24px; }
html.mb-js main.mb .mb-panel + .mb-panel{ margin-top:0; }
main.mb .mb-panel[hidden]{ display:none; }
main.mb .mb-panel__h{ margin:0 0 12px; font-size:var(--role-card, 22px); font-weight:600; }
html.mb-js main.mb .mb-panel__h{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
main.mb .mb-panel__stage{ display:grid; grid-template-columns:360px minmax(0,1fr); gap:32px; align-items:start; min-height:560px; padding:40px; box-sizing:border-box; }
main.mb .mb-panel__text{ display:flex; flex-direction:column; gap:16px; padding:24px; border-radius:12px; background:#fff; box-shadow:var(--mb-sh); }
main.mb .mb-panel__text > *{ margin:0; }
main.mb .mb-panel__become{ display:flex; flex-direction:column; gap:6px; font-size:18px; line-height:1.4; font-weight:600; }
main.mb .mb-panel__rows{ display:flex; flex-direction:column; gap:12px; margin:0; }
main.mb .mb-panel__rows > div{ display:flex; flex-direction:column; gap:2px; }
main.mb .mb-panel__rows dt{ font:500 11px/1.4 var(--font-mono); letter-spacing:.08em; text-transform:uppercase; color:var(--mb-slate); }
main.mb .mb-panel__rows dd{ margin:0; font-size:14px; line-height:1.5; }
main.mb .mb-panel__desc{ font-size:14px; color:var(--mb-slate); }
main.mb .mb-ticks{ display:flex; flex-direction:column; gap:10px; list-style:none; margin:0; padding:0; }
main.mb .mb-ticks li{ display:flex; gap:10px; align-items:flex-start; font-size:14px; line-height:1.45; color:#000; }
main.mb .mb-ticks .mb-tick{ margin-top:1px; }
main.mb .mb-panel__ui{ position:relative; display:flex; flex-direction:column; gap:12px; min-width:0; }
main.mb .mb-player__note{ margin:24px auto 0; max-width:70ch; text-align:center; font-size:16px; color:var(--mb-slate); }
main.mb .mb-player--v .mb-player__tabs{ grid-template-columns:1fr; }

/* course player: vertical part tabs beside UI-1 */
main.mb .mb-player--course{ margin-top:32px; display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:32px; align-items:start; }
main.mb .mb-ptabs{ display:flex; flex-direction:column; gap:4px; }
main.mb .mb-ptab{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:2px 14px; align-items:baseline; padding:12px 16px; border:0; border-radius:10px; background:transparent; color:#000; font:inherit; text-align:start; cursor:pointer;
  transition:background-color var(--mb-t2) var(--mb-ease), box-shadow var(--mb-t2) var(--mb-ease); }
main.mb .mb-ptab:hover{ background:#fff; }
main.mb .mb-ptab .meta{ grid-column:1 / -1; font-size:11px; }
main.mb .mb-ptab b{ grid-column:1 / -1; font-size:16px; font-weight:600; line-height:1.35; }
main.mb .mb-ptab[aria-selected="true"]{ background:#fff; box-shadow:var(--mb-sh), inset 3px 0 0 var(--mb-purple); }
[dir="rtl"] main.mb .mb-ptab[aria-selected="true"]{ box-shadow:var(--mb-sh), inset -3px 0 0 var(--mb-purple); }
main.mb .mb-player--course .mb-plate{ padding:32px; }
main.mb .mb-leave{ display:flex; flex-direction:column; gap:6px; margin-top:12px; }
main.mb .mb-leave p{ margin:0; font-size:14px; line-height:1.5; }

/* ============ 12. mb-bento (partial memb-bento) and tier chips ============ */
main.mb .mb-bento{ display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:24px; }
main.mb .mb-card{ display:flex; flex-direction:column; gap:12px; padding:28px; border-radius:var(--radius-card, 12px); background:#fff; box-shadow:var(--mb-sh); min-width:0; }
main.mb .mb-card > *{ margin:0; }
main.mb .mb-card > p{ font-size:16px; line-height:1.55; color:var(--mb-slate); }
main.mb .mb-card--a{ grid-column:1 / span 7; grid-row:1 / span 2; }
main.mb .mb-card--b{ grid-column:8 / span 5; grid-row:1; }
main.mb .mb-card--c{ grid-column:8 / span 5; grid-row:2; }
main.mb .mb-card--d{ grid-column:1 / span 6; grid-row:3; }
main.mb .mb-card--e{ grid-column:7 / span 6; grid-row:3; }
main.mb .mb-card__well{ position:relative; order:-1; height:240px; border-radius:12px; overflow:hidden; padding:20px; box-sizing:border-box; display:flex; flex-direction:column; justify-content:center; gap:10px; }
main.mb .mb-card--a .mb-card__well{ height:auto; flex:1; min-height:400px; justify-content:center; }
main.mb .mb-card__well::after{ content:""; position:absolute; inset-inline:0; inset-block-end:0; height:32px; background:linear-gradient(to bottom, transparent, rgba(255,255,255,.0)); pointer-events:none; }
main.mb .mb-card__note{ font-size:14px; color:var(--mb-slate); }
main.mb .mb-tiers{ display:flex; flex-wrap:wrap; gap:6px; list-style:none; margin:0; padding:0; }
main.mb .mb-tier{ display:inline-flex; align-items:center; gap:6px; height:28px; padding-inline:10px; border-radius:999px; background:var(--mb-ghost); font:500 14px/1 var(--font-sans); color:#000; }
main.mb .mb-tier svg{ width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; }
main.mb .mb-tier[data-state="out"]{ color:var(--mb-slate); text-decoration:line-through; text-decoration-color:var(--mb-line); }
main.mb .mb-tier[data-state="soon"]{ color:var(--mb-slate); }
main.mb .mb-tier__soon{ font:500 11px/1 var(--font-mono); letter-spacing:.06em; text-transform:uppercase; padding:3px 5px; border-radius:4px; background:var(--gold-50); color:var(--gold-700); text-decoration:none; }
main.mb .mb-tier__you{ display:none; }
main.mb :is([data-mb-here="free"] .mb-tier[data-tier="free"], [data-mb-here="membership"] .mb-tier[data-tier="free"], [data-mb-here="pro"] .mb-tier[data-tier="pro"], [data-mb-here="max"] .mb-tier[data-tier="max"],
  [data-mb-here="infinite"] .mb-tier[data-tier="infinite"], [data-mb-here="teams"] .mb-tier:is([data-tier="pro"],[data-tier="max"],[data-tier="infinite"])){ background:#fff; box-shadow:inset 0 0 0 2px var(--mb-purple); }
main.mb :is([data-mb-here="membership"] .mb-tier[data-tier="free"], [data-mb-here="pro"] .mb-tier[data-tier="pro"], [data-mb-here="max"] .mb-tier[data-tier="max"],
  [data-mb-here="infinite"] .mb-tier[data-tier="infinite"], [data-mb-here="teams"] .mb-tier:is([data-tier="pro"],[data-tier="max"],[data-tier="infinite"])) .mb-tier__you{ display:inline; position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
main.mb .mb-trow{ display:grid; grid-template-columns:minmax(0,1fr); gap:10px; padding:16px 0; border-top:1px solid var(--mb-line); }
main.mb .mb-trow:first-child{ border-top:0; }
main.mb .mb-trow__k{ font-size:16px; font-weight:600; }
main.mb .mb-trow__k em{ font-style:normal; margin-inline-start:8px; }

/* ============ 13. #included: course boxes, plus line, system strip, ready ============ */
main.mb .mb-courses{ display:grid; grid-template-columns:repeat(var(--n, 2), minmax(0,1fr)); gap:24px; list-style:none; margin:0; padding:0; }
main.mb .mb-course{ display:flex; flex-direction:column; border-radius:var(--radius-card, 12px); background:#fff; box-shadow:var(--mb-sh); overflow:hidden; transition:transform var(--mb-t2) var(--mb-ease), box-shadow var(--mb-t2) var(--mb-ease); }
main.mb .mb-course:hover{ transform:translateY(-4px); box-shadow:var(--mb-sh-lg); }
main.mb .mb-course__cover{ position:relative; height:120px; display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding:16px; box-sizing:border-box;
  background:linear-gradient(135deg, var(--purple) 0 40%, var(--gold) 100%); color:#fff; }
main.mb .mb-course__cover--soon{ background:linear-gradient(135deg, var(--white) 0%, var(--silver) 100%); box-shadow:inset 0 -1px 0 var(--silver); color:#000; }
main.mb .mb-course__cover svg{ width:32px; height:32px; fill:none; stroke:currentColor; stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round; align-self:flex-end; }
main.mb .mb-course__b{ display:flex; flex-direction:column; gap:14px; padding:24px; flex:1; }
main.mb .mb-course__b > *{ margin:0; }
main.mb .mb-course__b h3 a{ color:inherit; text-decoration:none; }
main.mb .mb-course__b h3 a:hover{ text-decoration:underline; text-underline-offset:4px; text-decoration-thickness:1px; }
main.mb .mb-course__b ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
main.mb .mb-course__b li{ display:flex; gap:10px; align-items:flex-start; font-size:16px; line-height:1.5; }
main.mb .mb-course__b li.mb-check-li::before{ margin-top:3px; }
main.mb .mb-course__own{ margin-top:auto !important; padding-top:14px; border-top:1px solid var(--mb-hair); font-size:14px; color:var(--mb-slate); font-variant-numeric:tabular-nums; }
main.mb .mb-course__own strong{ color:#000; font-weight:600; }
main.mb .mb-plus{ display:flex; flex-direction:column; gap:12px; margin-top:24px; padding:24px 28px; border-radius:12px; background:#fff; box-shadow:var(--mb-sh); }
main.mb .mb-plus > *{ margin:0; }
main.mb .mb-plus__sum{ font-size:16px; font-variant-numeric:tabular-nums; }
main.mb .mb-plus__sum strong{ font-weight:600; }
main.mb .mb-system{ display:flex; flex-direction:column; gap:10px; list-style:none; margin:0; padding:0; }
main.mb .mb-layer{ display:grid; grid-template-columns:48px minmax(0,1fr) auto; align-items:center; gap:16px; padding:20px 24px; border-radius:16px; background:#fff; box-shadow:var(--mb-sh); }
main.mb .mb-layer:nth-child(2){ margin-inline:24px; } main.mb .mb-layer:nth-child(3){ margin-inline:48px; } main.mb .mb-layer:nth-child(4){ margin-inline:72px; }
main.mb .mb-layer__ic{ display:grid; place-items:center; width:48px; height:48px; border-radius:12px; background:var(--mb-purple); color:#fff; }
main.mb .mb-layer__ic svg{ width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
main.mb .mb-layer--soon{ background:linear-gradient(135deg, var(--white) 0%, var(--silver) 100%); }
main.mb .mb-layer--soon .mb-layer__ic{ background:#fff; color:#000; box-shadow:var(--mb-sh); }
main.mb .mb-layer > div{ display:flex; flex-direction:column; gap:4px; min-width:0; }
main.mb .mb-layer > div > *{ margin:0; }
main.mb .mb-layer p{ font-size:14px; color:var(--mb-slate); }
main.mb .mb-ready{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:32px; align-items:start; margin-top:clamp(56px, 6vw, 88px); }
main.mb .mb-ready__head{ grid-column:1 / -1; display:flex; flex-direction:column; gap:12px; }
main.mb .mb-ready__head > *{ margin:0; }
main.mb .mb-facts{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:16px; margin:0; }
main.mb .mb-facts > div{ display:flex; flex-direction:column; gap:6px; padding:20px; border-radius:12px; background:#fff; box-shadow:var(--mb-sh); }
main.mb .mb-facts dt{ font:500 12px/1.4 var(--font-mono); letter-spacing:.08em; text-transform:uppercase; color:var(--mb-slate); }
main.mb .mb-facts dd{ margin:0; font-size:16px; line-height:1.5; }
main.mb .mb-facts dd b{ display:block; font-size:18px; font-weight:600; }
main.mb .mb-need{ padding:24px; border-radius:12px; background:#fff; box-shadow:var(--mb-sh); }
main.mb .mb-need > .meta{ margin:0 0 12px; }
main.mb .mb-need ol{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; }
main.mb .mb-need ol > li{ display:grid; grid-template-columns:28px minmax(0,1fr); gap:12px; padding:14px 0; border-top:1px solid var(--mb-hair); font-size:16px; line-height:1.5; }
main.mb .mb-need ol > li:first-child{ border-top:0; padding-top:0; }
main.mb .mb-need .mb-n{ display:grid; place-items:center; width:24px; height:24px; border-radius:50%; background:var(--green); color:#000; font:600 11px/1 var(--font-mono); transition:background-color var(--mb-t3) var(--mb-ease); }
html.mb-js main.mb .mb-need:not(.is-in) .mb-n{ background:var(--mb-ghost); }
main.mb .mb-need ol > li:nth-child(2) .mb-n{ transition-delay:200ms; } main.mb .mb-need ol > li:nth-child(3) .mb-n{ transition-delay:400ms; }
main.mb .mb-need ol > li:nth-child(4) .mb-n{ transition-delay:600ms; } main.mb .mb-need ol > li:nth-child(5) .mb-n{ transition-delay:800ms; }

/* ============ 14. mb-row: alternating copy and visual ============ */
main.mb .mb-row__grid{ display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:64px; align-items:center; }
main.mb .mb-row--flip .mb-row__grid{ grid-template-columns:minmax(0,7fr) minmax(0,5fr); }
main.mb .mb-row--flip .mb-row__copy{ order:2; }
main.mb .mb-row__copy{ display:flex; flex-direction:column; gap:16px; }
main.mb .mb-row__copy > *{ margin:0; }
main.mb .mb-row__copy > .t-lead{ margin-bottom:8px; }
main.mb .mb-row__points{ list-style:none; margin:8px 0 0; padding:0; display:flex; flex-direction:column; gap:20px; }
main.mb .mb-row__points > li{ display:grid; grid-template-columns:40px minmax(0,1fr); gap:16px; }
main.mb .mb-row__points .mb-row__ic{ display:grid; place-items:center; width:40px; height:40px; border-radius:10px; background:#fff; box-shadow:var(--mb-sh); color:#000; }
main.mb .mb-sec:not(.mb-sec--ghost) .mb-row__points .mb-row__ic{ background:var(--mb-ghost); box-shadow:none; }
main.mb .mb-row__points h3, main.mb .mb-row__points p{ margin:0; }
main.mb .mb-row__points p{ margin-top:4px; font-size:16px; line-height:1.55; color:var(--mb-slate); }
main.mb .mb-row__visual{ display:flex; flex-direction:column; justify-content:center; align-items:center; gap:14px; min-height:440px; padding:40px; box-sizing:border-box; }
main.mb .mb-row__visual > .mb-ui, main.mb .mb-row__visual > .mb-stack{ width:100%; max-width:560px; }
main.mb .mb-stack{ display:flex; flex-direction:column; gap:12px; }
main.mb .mb-split{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px; width:100%; }
main.mb .mb-tag{ display:inline-flex; align-items:center; gap:6px; align-self:flex-start; height:24px; padding-inline:10px; border-radius:999px; background:var(--mb-p100); color:var(--purple); font:500 11px/1 var(--font-mono); letter-spacing:.06em; text-transform:uppercase; }

/* ============ 15. memb-phones: three whole phones and three claims ============ */
main.mb .mb-phones{ display:grid; grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:48px; align-items:center; }
main.mb .mb-phones__plate{ display:flex; flex-direction:column; justify-content:center; align-items:center; padding:64px 24px 48px; background:linear-gradient(to bottom, var(--ghost-white) 0 30%, var(--purple) 100%); box-shadow:inset 0 0 0 1px var(--mb-hair); }
main.mb .mb-phones__row{ display:flex; justify-content:center; align-items:flex-end; }
main.mb .mb-phone{ margin:0; display:flex; flex-direction:column; align-items:center; gap:14px; }
main.mb .mb-phone .iphone{ --iphone-w:220px; --iphone-fit:.528; }
main.mb .mb-phone--mid{ position:relative; z-index:2; margin-inline:-24px; translate:0 -32px; }
main.mb .mb-phone--mid .iphone{ --iphone-w:256px; --iphone-fit:.614; }
main.mb .mb-phone:first-child .iphone{ rotate:-4deg; } main.mb .mb-phone:last-child .iphone{ rotate:4deg; }
main.mb .mb-phones__caps{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:16px; list-style:none; margin:20px 0 0; padding:0; text-align:center; font-size:14px; line-height:1.45; color:var(--mb-slate); }
main.mb .mb-phones__caps b{ display:block; color:#000; font-weight:600; font-size:14px; }
main.mb .mb-claims{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:28px; }
main.mb .mb-claims > li{ display:grid; grid-template-columns:48px minmax(0,1fr); gap:16px; align-items:start; }
main.mb .mb-claims__ic{ display:grid; place-items:center; width:48px; height:48px; border-radius:12px; background:var(--mb-ghost); color:#000; }
main.mb .mb-claims__ic svg{ width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
main.mb .mb-claims b{ display:block; font-size:var(--role-card, 22px); line-height:1.25; font-weight:600; letter-spacing:-.01em; }
main.mb .mb-claims span{ display:block; margin-top:4px; font-size:16px; line-height:1.5; color:var(--mb-slate); }
html.mb-js main.mb [data-mb-phones]:not(.is-in) .mb-phone{ opacity:0; translate:0 32px; }
html.mb-js main.mb [data-mb-phones]:not(.is-in) .mb-phone--mid{ translate:0 0; }
main.mb [data-mb-phones] .mb-phone{ transition:opacity var(--mb-t4) var(--mb-emph), translate var(--mb-t4) var(--mb-emph); }
main.mb [data-mb-phones] .mb-phone:nth-child(2){ transition-delay:120ms; } main.mb [data-mb-phones] .mb-phone:nth-child(3){ transition-delay:240ms; }
main.mb .mb-scroll{ animation:mb-feed 16s var(--mb-ease) infinite; }
main.mb .mb-scroll.is-paused{ animation-play-state:paused; }
@keyframes mb-feed{ 0%,14%{ transform:none; } 25%,39%{ transform:translateY(-96px); } 50%,64%{ transform:translateY(-192px); } 75%,89%{ transform:translateY(-96px); } 100%{ transform:none; } }

/* ============ 16. mb-vs, mb-person, mb-quote ============ */
main.mb .mb-vs{ border-radius:12px; background:#fff; box-shadow:var(--mb-sh); overflow:hidden; }
main.mb .mb-vs > [role="row"]{ display:grid; grid-template-columns:200px minmax(0,1fr) minmax(0,1fr); }
main.mb .mb-vs > [role="row"] + [role="row"]{ border-top:1px solid var(--mb-hair); }
main.mb .mb-vs > [role="row"] > *{ display:flex; gap:10px; align-items:flex-start; padding:18px 24px; font-size:16px; line-height:1.5; }
main.mb .mb-vs > [role="row"] > :nth-child(3){ border-inline-start:1px solid var(--mb-line); }
main.mb .mb-vs__hd > *{ font-weight:600; font-size:16px; }
main.mb .mb-vs__hd > :nth-child(2){ color:var(--mb-slate); }
main.mb .mb-vs__hd > :nth-child(3) > span{ box-shadow:inset 0 -2px 0 var(--mb-purple); padding-bottom:4px; }
main.mb .mb-vs [role="rowheader"]{ font:500 12px/1.5 var(--font-mono); letter-spacing:.08em; text-transform:uppercase; color:var(--mb-slate); padding-top:20px; }
main.mb .mb-vs__no{ color:var(--mb-slate); }
main.mb .mb-vs__yes{ color:#000; }
main.mb .mb-vs svg{ width:18px; height:18px; flex:none; margin-top:2px; fill:none; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; }
main.mb .mb-vs__no svg{ stroke:var(--mb-slate); } main.mb .mb-vs__yes svg{ stroke:var(--mb-purple); }
main.mb .mb-vs__l{ display:none; }
main.mb .mb-voices{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto; gap:24px; align-items:stretch; margin-top:48px; }
main.mb .mb-person{ display:grid; grid-template-columns:120px minmax(0,1fr); gap:24px; align-items:center; margin-top:24px; padding:24px; border-radius:12px; background:#fff; box-shadow:var(--mb-sh); }
main.mb .mb-person img{ width:120px; height:120px; border-radius:12px; object-fit:cover; display:block; }
main.mb .mb-person > div{ display:flex; flex-direction:column; gap:6px; }
main.mb .mb-person > div > *{ margin:0; }
main.mb .mb-person__stats{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:12px; margin-top:12px !important; }
main.mb .mb-person__stats b{ display:block; font:500 22px/1.1 var(--font-mono); font-variant-numeric:tabular-nums; letter-spacing:-.01em; }
main.mb .mb-person__stats span{ font-size:14px; color:var(--mb-slate); }
main.mb .mb-quote{ display:flex; flex-direction:column; gap:20px; margin:0; padding:28px; border-radius:12px; background:#fff; box-shadow:var(--mb-sh); }
main.mb .mb-quote blockquote{ margin:0; }
main.mb .mb-quote blockquote p{ margin:0; font-size:20px; line-height:1.45; letter-spacing:-.01em; }
main.mb .mb-quote figcaption{ display:flex; align-items:center; gap:12px; margin-top:auto; }
main.mb .mb-quote figcaption img{ width:64px; height:64px; border-radius:50%; object-fit:cover; flex:none; }
main.mb .mb-quote figcaption > span{ display:flex; flex-direction:column; font-size:14px; color:var(--mb-slate); }
main.mb .mb-quote figcaption b{ color:#000; font-size:16px; }
main.mb .mb-quote figcaption a{ margin-inline-start:auto; color:var(--mb-slate); }

main.mb .mb-close{ text-align:center; }
main.mb .mb-close__copy{ display:flex; flex-direction:column; align-items:center; gap:20px; max-width:820px; margin-inline:auto; }
main.mb .mb-close__copy > *{ margin:0; }
main.mb .mb-close__cta{ display:flex; flex-wrap:wrap; gap:16px 24px; justify-content:center; align-items:center; }
main.mb .mb-close__plate{ position:relative; display:flex; align-items:flex-end; justify-content:space-between; gap:24px; height:280px; margin-top:64px; padding:0 48px; box-sizing:border-box; }
main.mb .mb-close__plate picture, main.mb .mb-close__plate > img{ display:block; align-self:flex-end; height:240px; }
main.mb .mb-close__plate picture img, main.mb .mb-close__plate > img{ height:100%; width:auto; border-radius:16px 16px 0 0; object-fit:cover; display:block; }
main.mb .mb-close__plate .mcardobj{ width:260px; align-self:center; rotate:6deg; }
main.mb .mb-proof{ display:flex; align-items:center; gap:12px; justify-content:center; font-size:14px; color:var(--mb-slate); }

/* ============ 18. mb-paths, mb-apply steps, mb-faq ============ */
main.mb .mb-paths{ display:grid; grid-template-columns:repeat(var(--n, 3), minmax(0,1fr)); gap:24px; }
main.mb .mb-path{ display:flex; flex-direction:column; gap:16px; padding:32px; border-radius:12px; background:#fff; box-shadow:var(--mb-sh); }
main.mb .mb-sec:not(.mb-sec--ghost) .mb-path{ background:var(--mb-ghost); box-shadow:none; }
main.mb .mb-path > *{ margin:0; }
main.mb .mb-path ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
main.mb .mb-path li{ display:flex; gap:10px; align-items:flex-start; font-size:16px; line-height:1.5; }
main.mb .mb-path li.mb-check-li::before{ margin-top:3px; }
main.mb .mb-path dl{ margin:0; display:flex; flex-direction:column; }
main.mb .mb-path dl > div{ display:grid; grid-template-columns:110px minmax(0,1fr); gap:12px; padding:10px 0; border-top:1px solid var(--mb-hair); font-size:14px; }
main.mb .mb-path dt{ font:500 11px/1.5 var(--font-mono); letter-spacing:.08em; text-transform:uppercase; color:var(--mb-slate); }
main.mb .mb-path dd{ margin:0; }
main.mb .mb-path__sub{ padding-top:16px; border-top:1px solid var(--mb-line); display:flex; flex-direction:column; gap:8px; }
main.mb .mb-path__sub > *{ margin:0; }
main.mb .mb-chips{ display:flex; flex-wrap:wrap; gap:8px; list-style:none; margin:0; padding:0; }
main.mb .mb-chip{ display:inline-flex; align-items:center; height:28px; padding-inline:12px; border-radius:999px; background:#fff; box-shadow:inset 0 0 0 1px var(--mb-line); font:500 12px/1 var(--font-mono); letter-spacing:.04em; color:#000; }
main.mb .mb-paths__cta{ display:flex; justify-content:center; margin-top:32px; }
main.mb .mb-steps3{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; }
main.mb .mb-steps3 > li{ position:relative; display:grid; grid-template-columns:32px minmax(0,1fr); gap:16px; padding-bottom:28px; }
main.mb .mb-steps3 > li:last-child{ padding-bottom:0; }
main.mb .mb-steps3 > li::before{ content:""; position:absolute; inset-block:36px 4px; inset-inline-start:15px; width:2px; border-radius:2px; background:var(--mb-line); }
main.mb .mb-steps3 > li:last-child::before{ content:none; }
main.mb .mb-steps3__n{ display:grid; place-items:center; width:32px; height:32px; border-radius:50%; background:#000; color:#fff; font:600 12px/1 var(--font-mono); }
main.mb .mb-steps3 > li > div{ display:flex; flex-direction:column; gap:4px; padding-top:4px; }
main.mb .mb-steps3 > li > div > *{ margin:0; }
main.mb .mb-steps3 .meta{ font-size:11px; }
main.mb .mb-steps3 p{ font-size:16px; line-height:1.5; color:var(--mb-slate); }
main.mb .mb-faq{ max-width:848px; }
main.mb .mb-faq__tabs{ display:flex; justify-content:center; gap:4px; margin:0 auto 32px; padding:4px; width:max-content; max-width:100%; border-radius:12px; background:var(--mb-ghost); }
main.mb .mb-faq__tab{ height:40px; padding-inline:18px; border:0; border-radius:9px; background:transparent; color:var(--mb-slate); font:600 14px/1 var(--font-sans); cursor:pointer; white-space:nowrap; transition:background-color var(--mb-t2) var(--mb-ease), color var(--mb-t2) var(--mb-ease); }
main.mb .mb-faq__tab:hover{ color:#000; }
main.mb .mb-faq__tab[aria-selected="true"]{ background:#fff; color:#000; box-shadow:var(--mb-sh); }
html:not(.mb-js) main.mb .mb-faq__tabs{ display:none; }
main.mb .mb-faq__panel + .mb-faq__panel{ margin-top:32px; }
html.mb-js main.mb .mb-faq__panel + .mb-faq__panel{ margin-top:0; }
main.mb .mb-faq__panel[hidden]{ display:none; }

/* ============ 19. memb-compare: compact strip and the collapsed matrix ============ */
main.mb .mb-v{ display:none; }
main.mb :is([data-mb-here="pro"] .mb-v--pro, [data-mb-here="max"] .mb-v--max, [data-mb-here="infinite"] .mb-v--infinite, [data-mb-here="membership"] .mb-v--free, [data-mb-here="teams"] .mb-v--teams){ display:revert; }
main.mb :is([data-mb-here="pro"], [data-mb-here="max"]) .mb-v--pm{ display:revert; }
main.mb .mb-cmp{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:16px; list-style:none; margin:0; padding:4px; }
main.mb .mb-cmp--3{ grid-template-columns:repeat(3, minmax(0,1fr)); }
main.mb .mb-cmpc{ display:flex; flex-direction:column; gap:16px; padding:24px; border-radius:12px; background:#fff; box-shadow:var(--mb-sh); }
main.mb .mb-cmpc > *{ margin:0; }
main.mb .mb-cmpc__hd{ display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:28px; }
main.mb .mb-cmpc__hd h3{ margin:0; }
main.mb .mb-here-tag{ display:none; align-items:center; height:24px; padding-inline:10px; border-radius:999px; background:var(--mb-psub); color:var(--purple-700); font:500 11px/1 var(--font-mono); letter-spacing:.06em; text-transform:uppercase; }
main.mb .mb-cmpc__price{ min-height:56px; font-size:14px; color:var(--mb-slate); font-variant-numeric:tabular-nums; line-height:1.5; }
main.mb .mb-cmpc__price strong{ display:block; color:#000; font:500 var(--role-price, 28px)/1.1 var(--font-mono); letter-spacing:-.02em; }
main.mb .mb-cmpc__price s{ text-decoration-thickness:1px; }
main.mb .mb-cmpc dl{ margin:0; display:flex; flex-direction:column; }
main.mb .mb-cmpc dl > div{ display:flex; flex-direction:column; gap:2px; padding:10px 0; border-top:1px solid var(--mb-hair); }
main.mb .mb-cmpc dt{ font:500 11px/1.5 var(--font-mono); letter-spacing:.08em; text-transform:uppercase; color:var(--mb-slate); }
main.mb .mb-cmpc dd{ margin:0; font-size:14px; line-height:1.5; }
main.mb .mb-cmpc__cta{ margin-top:auto !important; }
main.mb .mb-cmpc__cta .btn{ width:100%; box-sizing:border-box; white-space:normal; text-align:center; }
main.mb .mb-cmpc__apply{ display:none !important; }
main.mb :is([data-mb-here="pro"] .mb-cmpc[data-tier="pro"], [data-mb-here="max"] .mb-cmpc[data-tier="max"], [data-mb-here="infinite"] .mb-cmpc[data-tier="infinite"], [data-mb-here="membership"] .mb-cmpc[data-tier="free"]){ box-shadow:var(--mb-sh), inset 0 0 0 2px var(--mb-purple); }
main.mb :is([data-mb-here="pro"] .mb-cmpc[data-tier="pro"], [data-mb-here="max"] .mb-cmpc[data-tier="max"], [data-mb-here="infinite"] .mb-cmpc[data-tier="infinite"], [data-mb-here="membership"] .mb-cmpc[data-tier="free"]) .mb-here-tag{ display:inline-flex; }
main.mb :is([data-mb-here="pro"] .mb-cmpc[data-tier="pro"], [data-mb-here="max"] .mb-cmpc[data-tier="max"], [data-mb-here="infinite"] .mb-cmpc[data-tier="infinite"]) .mb-cmpc__apply{ display:block !important; }
main.mb :is([data-mb-here="pro"] .mb-cmpc[data-tier="pro"], [data-mb-here="max"] .mb-cmpc[data-tier="max"], [data-mb-here="infinite"] .mb-cmpc[data-tier="infinite"]) .mb-cmpc__see{ display:none !important; }
main.mb .mb-cmp__note{ margin:24px 0 0; text-align:center; font-size:16px; color:var(--mb-slate); }
main.mb .mb-mx{ margin-top:48px; text-align:center; }
main.mb .mb-mx > .eyebrow, main.mb .mb-mx > h3, main.mb .mb-mx > p{ margin:0 auto 12px; }
main.mb .mb-mx > p{ max-width:60ch; font-size:16px; color:var(--mb-slate); }
main.mb .mb-mx__btn{ display:inline-flex; align-items:center; gap:8px; margin-top:8px; height:44px; padding-inline:18px; border:0; border-radius:8px; background:#fff; box-shadow:inset 0 0 0 1px #000; color:#000; font:600 16px/1 var(--font-sans); cursor:pointer; }
main.mb .mb-mx__btn .mb-i{ width:18px; height:18px; transition:transform var(--mb-t2) var(--mb-ease); }
main.mb .mb-mx__btn[aria-expanded="true"] .mb-i{ transform:rotate(180deg); }
main.mb .mb-matrix{ margin-top:24px; text-align:start; border-radius:12px; background:#fff; box-shadow:var(--mb-sh); overflow:auto; max-height:min(80vh, 900px); }
main.mb .mb-matrix[hidden]{ display:none; }
main.mb .mb-matrix .pdp-mx{ margin:0; }
main.mb .mb-matrix thead :is(th,td){ position:sticky; top:0; z-index:2; background:#fff; }
main.mb .mb-matrix .pdp-mx__tag{ display:none; }
main.mb :is([data-mb-here="pro"] .mb-matrix thead th:nth-child(3), [data-mb-here="max"] .mb-matrix thead th:nth-child(4), [data-mb-here="infinite"] .mb-matrix thead th:nth-child(5)) .pdp-mx__tag{ display:inline-flex; }
main.mb :is([data-mb-here="pro"] .mb-matrix tr > :nth-child(3), [data-mb-here="max"] .mb-matrix tr > :nth-child(4), [data-mb-here="infinite"] .mb-matrix tr > :nth-child(5)):not([colspan]){ background:var(--mb-psub); }

/* ============ 20. memb-proof (logo strip) and memb-sibs ============ */
main.mb .mb-logos{ padding-block:40px; }
main.mb .mb-logos .logorot{ grid-template-columns:200px minmax(0,1fr) auto; }
main.mb .mb-proof__n{ margin:20px 0 0; text-align:center; font-size:14px; color:var(--mb-slate); }
main.mb .mb-proof__n b{ color:#000; font-weight:600; }
main.mb .mb-sibs{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:16px; list-style:none; margin:0; padding:0; }
main.mb .mb-sib > a{ display:grid; grid-template-columns:40px minmax(0,1fr); gap:4px 14px; align-items:start; height:100%; box-sizing:border-box; padding:20px; border-radius:12px; background:#fff; box-shadow:var(--mb-sh); color:#000; text-decoration:none;
  transition:transform var(--mb-t2) var(--mb-ease), box-shadow var(--mb-t2) var(--mb-ease); }
main.mb .mb-sib > a:hover{ transform:translateY(-2px); box-shadow:var(--mb-sh-lg); }
main.mb .mb-sib__ic{ grid-row:1 / span 2; display:grid; place-items:center; width:40px; height:40px; border-radius:10px; background:var(--mb-ghost); }
main.mb .mb-sib__ic svg{ width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
main.mb .mb-sib b{ font-size:16px; font-weight:600; line-height:1.3; }
main.mb .mb-sib span:not(.mb-sib__ic){ font-size:14px; line-height:1.45; color:var(--mb-slate); }
main.mb .mb-sib--all > a{ background:#000; color:#fff; }
main.mb .mb-sib--all .mb-sib__ic{ background:var(--slate-900); color:#fff; }
main.mb .mb-sib--all span:not(.mb-sib__ic){ color:var(--silver); }
main.mb :is([data-mb-here="membership"] .mb-sib[data-sib="free"], [data-mb-here="pro"] .mb-sib[data-sib="pro"], [data-mb-here="max"] .mb-sib[data-sib="max"], [data-mb-here="infinite"] .mb-sib[data-sib="infinite"], [data-mb-here="teams"] .mb-sib[data-sib="teams"]){ display:none; }

/* ============ 21. /community platform picker ============ */
main.mb .mb-picker{ display:grid; grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:48px; align-items:start; }
main.mb .mb-picker__grid{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:12px; }
main.mb .mb-pick{ display:flex; flex-direction:column; gap:6px; padding:18px; border:0; border-radius:12px; background:var(--mb-ghost); color:#000; font:inherit; text-align:start; cursor:pointer; transition:background-color var(--mb-t2) var(--mb-ease), box-shadow var(--mb-t2) var(--mb-ease); }
main.mb .mb-pick:hover{ background:var(--slate-100); }
main.mb .mb-pick b{ font-size:16px; font-weight:600; }
main.mb .mb-pick > span{ font-size:14px; line-height:1.45; color:var(--mb-slate); }
main.mb .mb-pick[aria-selected="true"]{ background:var(--purple-50); box-shadow:var(--mb-sh-lg); }
main.mb .mb-picker__phone{ position:sticky; top:calc(var(--mb-top) + 32px); display:flex; justify-content:center; padding:40px 24px; }
main.mb .mb-picker__phone .iphone{ --iphone-w:300px; --iphone-fit:.72; }
main.mb .mb-screens{ display:grid; }
main.mb .mb-screens > *{ grid-area:1/1; transition:opacity var(--mb-t3) var(--mb-ease); }
html.mb-js main.mb .mb-screens > :not(.is-on){ opacity:0; visibility:hidden; }

/* ============ 22. scroll-snap rows (phones) and dots ============ */
main.mb .mb-dots{ display:none; justify-content:center; gap:8px; margin-top:16px; }
main.mb .mb-dots > i{ width:8px; height:8px; border-radius:50%; background:var(--mb-line); transition:background-color var(--mb-t2) var(--mb-ease), width var(--mb-t2) var(--mb-ease); }
main.mb .mb-dots > i.is-on{ width:20px; border-radius:4px; background:#000; }

/* ============ 23. Tablet (768 to 1023) ============ */
@media (max-width:1023px){
  main.mb .mb-stage{ aspect-ratio:4 / 3; padding:40px 32px 0; }
  main.mb .mb-stage > .mb-win{ width:88%; inset-inline-start:3%; }
  main.mb .mb-stage > .iphone{ --iphone-w:180px; --iphone-fit:.432; inset-inline-end:3%; }
  main.mb .mb-stage > .mb-stage__card{ display:none; }
  main.mb .mb-win__body{ grid-template-columns:160px minmax(0,1fr); }
  main.mb .mb-win__side{ display:none; }
  main.mb .mb-painfix__grid{ grid-template-columns:40px minmax(0,1fr); }
  main.mb .mb-painfix__a, main.mb .mb-painfix__voices, main.mb .mb-painfix__b, main.mb .mb-sprawl{ grid-column:2; grid-row:auto; }
  main.mb .mb-painfix__line{ grid-row:1 / span 4; }
  main.mb .mb-panel__stage{ grid-template-columns:minmax(0,1fr); padding:24px; }
  main.mb .mb-panel__ui{ order:-1; }
  main.mb .mb-bento{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  main.mb .mb-bento > .mb-card{ grid-column:auto; grid-row:auto; }
  main.mb .mb-bento > .mb-card--a{ grid-column:1 / -1; }
  main.mb .mb-courses{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  main.mb .mb-player--course{ grid-template-columns:minmax(0,1fr); }
  main.mb .mb-ready, main.mb .mb-row__grid, main.mb .mb-row--flip .mb-row__grid, main.mb .mb-phones, main.mb .mb-picker{ grid-template-columns:minmax(0,1fr); gap:40px; }
  main.mb .mb-row--flip .mb-row__copy{ order:0; }
  main.mb .mb-cmp{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  main.mb .mb-paths{ grid-template-columns:minmax(0,1fr); }
  main.mb .mb-sibs{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  main.mb .mb-voices{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  main.mb .mb-voices > .mb-voices__phone{ grid-column:1 / -1; justify-self:center; }
  main.mb .mb-picker__phone{ position:static; }
}

/* ============ 24. Phones (under 768) ============ */
@media (max-width:767px){
  main.mb .mb-wrap{ padding-inline:16px; }
  main.mb .mb-head{ margin-bottom:32px; }
  main.mb .mb-subnav{ height:48px; margin-bottom:-48px; }
  main.mb .mb-subnav__in{ gap:12px; justify-content:space-between; }
  main.mb .mb-subnav__links{ display:none; }
  main.mb .mb-subnav__id{ font-size:14px; gap:8px; min-width:0; }
  main.mb .mb-subnav__price{ overflow:hidden; text-overflow:ellipsis; }
  main.mb .mb-subnav__cta.btn{ min-height:36px; padding:0 14px; }
  main.mb .mb-hero__copy{ align-items:flex-start; text-align:start; }
  main.mb .mb-hero__cta{ justify-content:flex-start; }
  main.mb .mb-hero__risk{ flex-direction:column; justify-content:flex-start; gap:8px; }
  main.mb .mb-stage{ aspect-ratio:auto; margin-top:40px; padding:24px 16px 32px; display:flex; flex-direction:column; align-items:center; gap:24px; }
  main.mb .mb-stage > .mb-win{ position:relative; inset:auto; width:100%; height:auto; -webkit-mask-image:none; mask-image:none; }
  main.mb .mb-stage > .iphone{ --iphone-w:min(260px, 72vw); position:relative; inset:auto; }
  main.mb .mb-stage > .mb-toast{ display:none; }
  main.mb .mb-win__bar{ grid-template-columns:auto 1fr; }
  main.mb .mb-win__search{ display:none; }
  main.mb .mb-win__logo{ justify-self:end; }
  main.mb .mb-win__body{ grid-template-columns:minmax(0,1fr); min-height:0; }
  main.mb .mb-win__rail{ display:none; }
  main.mb .mb-win__main{ padding:14px; }
  main.mb .mb-keyfacts, main.mb .mb-keyfacts--3{ grid-template-columns:repeat(2, minmax(0,1fr)); row-gap:20px; }
  main.mb .mb-keyfacts > li{ padding-inline:12px; }
  main.mb .mb-keyfacts > li:nth-child(odd){ border-inline-start:0; padding-inline-start:0; }
  main.mb .mb-painfix__grid{ grid-template-columns:24px minmax(0,1fr); column-gap:16px; }
  main.mb .mb-painfix__a .mb-mark, main.mb .mb-painfix__b .mb-mark{ margin-inline-start:calc(-24px - 16px - 4px); margin-block-end:-44px; width:28px; height:28px; }
  main.mb .mb-sprawl{ max-width:300px; }
  main.mb .mb-fixlist{ grid-template-columns:minmax(0,1fr); }
  main.mb .mb-painfix__voices p{ font-size:16px; }
  main.mb .mb-player__bar{ flex-direction:column; gap:12px; }
  main.mb .mb-player__tabs{ display:flex; gap:8px; overflow-x:auto; scroll-snap-type:x mandatory; margin-inline:-16px; padding:2px 16px 6px; scrollbar-width:none; }
  main.mb .mb-player__tabs::-webkit-scrollbar{ display:none; }
  main.mb .mb-tab{ flex:none; scroll-snap-align:start; flex-direction:row; align-items:center; min-height:44px; padding:0 16px; border-radius:999px; }
  main.mb .mb-tab > b{ font-size:14px; white-space:nowrap; }
  main.mb .mb-tab__d, main.mb .mb-tab__bar, main.mb .mb-tab > .mb-i{ display:none; }
  main.mb .mb-pause{ display:none; }
  main.mb .mb-panel__stage{ padding:16px; gap:16px; min-height:0; }
  main.mb .mb-panel__text{ padding:20px; }
  main.mb .mb-panel__ui{ overflow:hidden; }
  main.mb .mb-board{ gap:6px; }
  main.mb .mb-col{ min-height:200px; padding:6px; gap:6px; }
  main.mb .mb-col__hd .mb-pill--line{ display:none; }
  main.mb .mb-col__hd b{ font-size:11px; }
  main.mb .mb-acct{ padding:6px; font-size:11px; }
  main.mb .mb-board{ --mb-col:calc(100% + 18px); }
  main.mb .mb-canvas{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  main.mb .mb-agents{ grid-template-columns:minmax(0,1fr); }
  main.mb .mb-bento{ grid-template-columns:minmax(0,1fr); gap:16px; }
  main.mb .mb-card{ padding:20px; }
  main.mb .mb-card__well{ height:200px; padding:14px; }
  main.mb .mb-card--a .mb-card__well{ min-height:280px; }
  main.mb .mb-courses{ grid-template-columns:minmax(0,1fr); }
  main.mb .mb-ptabs{ flex-direction:row; overflow-x:auto; scroll-snap-type:x mandatory; margin-inline:-16px; padding:2px 16px 6px; gap:8px; scrollbar-width:none; }
  main.mb .mb-ptab{ flex:none; width:220px; scroll-snap-align:start; background:#fff; }
  main.mb .mb-player--course .mb-plate{ padding:16px; }
  main.mb .mb-layer{ grid-template-columns:40px minmax(0,1fr); padding:16px; }
  main.mb .mb-layer > :last-child:not(div){ grid-column:2; justify-self:start; }
  main.mb .mb-layer:nth-child(n){ margin-inline:0; }
  main.mb .mb-facts{ grid-template-columns:minmax(0,1fr); }
  main.mb .mb-row__visual{ min-height:0; padding:16px; }
  main.mb .mb-split{ grid-template-columns:minmax(0,1fr); }
  main.mb .mb-phones__plate{ padding:32px 0 24px; border-radius:var(--radius-base, 24px); }
  main.mb .mb-phones__row{ justify-content:flex-start; gap:16px; overflow-x:auto; scroll-snap-type:x mandatory; padding-inline:calc(50% - min(140px, 38vw)); scrollbar-width:none; align-items:flex-start; }
  main.mb .mb-phones__row::-webkit-scrollbar{ display:none; }
  main.mb .mb-phone, main.mb .mb-phone--mid{ flex:none; scroll-snap-align:center; margin-inline:0; translate:none; }
  main.mb .mb-phone .iphone, main.mb .mb-phone--mid .iphone{ --iphone-w:min(280px, 76vw); rotate:none; }
  main.mb .mb-phones__caps{ grid-template-columns:minmax(0,1fr); text-align:start; gap:12px; }
  main.mb .mb-dots{ display:flex; }
  main.mb .mb-vs > [role="row"]{ grid-template-columns:minmax(0,1fr); padding:16px 20px; }
  main.mb .mb-vs > [role="row"] > *{ padding:4px 0; }
  main.mb .mb-vs > [role="row"] > :nth-child(3){ border-inline-start:0; }
  main.mb .mb-vs__hd{ display:none !important; }
  main.mb .mb-vs__l{ display:inline; font-weight:600; }
  main.mb .mb-voices{ grid-template-columns:minmax(0,1fr); }
  main.mb .mb-person{ grid-template-columns:72px minmax(0,1fr); gap:16px; padding:20px; }
  main.mb .mb-person img{ width:72px; height:72px; }
  main.mb .mb-person__stats{ grid-template-columns:repeat(2, minmax(0,1fr)); grid-column:1 / -1; }
  main.mb .mb-quote blockquote p{ font-size:18px; }
  main.mb .mb-close__plate{ height:200px; padding:0 16px; }
  main.mb .mb-close__plate picture, main.mb .mb-close__plate > img{ height:180px; }
  main.mb .mb-close__plate .mcardobj{ display:none; }
  main.mb .mb-path{ padding:24px; }
  main.mb .mb-faq__tabs{ width:auto; justify-content:flex-start; overflow-x:auto; scrollbar-width:none; margin-inline:-16px; border-radius:0; padding-inline:16px; }
  main.mb .mb-cmp, main.mb .mb-cmp--3{ display:flex; overflow-x:auto; scroll-snap-type:x mandatory; margin-inline:-16px; padding:4px 16px 8px; gap:12px; scrollbar-width:none; }
  main.mb .mb-cmp::-webkit-scrollbar{ display:none; }
  main.mb .mb-cmp > .mb-cmpc{ flex:none; width:82vw; scroll-snap-align:center; }
  main.mb .mb-matrix{ max-height:70vh; }
  main.mb .mb-matrix tbody th[scope="row"]{ position:sticky; inset-inline-start:0; z-index:1; background:#fff; }
  main.mb .mb-logos .logorot{ grid-template-columns:minmax(0,1fr); }
  main.mb .mb-sibs{ grid-template-columns:minmax(0,1fr); gap:8px; }
  main.mb .mb-sib > a{ padding:14px 16px; }
  main.mb .mb-picker__grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  main.mb .mb-picker{ display:flex; flex-direction:column-reverse; gap:24px; }
  main.mb .mb-picker__phone{ padding:0; }
  main.mb .mb-picker__phone .iphone{ --iphone-w:260px; }
  main.mb .mb-trow{ grid-template-columns:minmax(0,1fr); }
}

/* ============ 25. Right to left: mirrored duo angles ============ */
[dir="rtl"] main.mb .mb-plate--honor, [dir="rtl"] main.mb .mb-stage{ background:linear-gradient(200deg, var(--purple) 0 38%, var(--gold) 100%); }
[dir="rtl"] main.mb .mb-plate--haze{ background:linear-gradient(225deg, var(--ghost-white) 0 40%, var(--purple) 100%); }
[dir="rtl"] main.mb .mb-plate--dew{ background:linear-gradient(225deg, var(--ghost-white) 0 30%, var(--cyan) 100%); }
[dir="rtl"] main.mb .mb-plate--dawn{ background:linear-gradient(225deg, var(--ghost-white) 0 30%, var(--gold) 100%); }
[dir="rtl"] main.mb .mb-plate--mist{ background:linear-gradient(225deg, var(--white) 0%, var(--silver) 100%); }
[dir="rtl"] main.mb .mb-plate--ascent, [dir="rtl"] main.mb .mb-stage--ascent{ background:linear-gradient(200deg, var(--purple) 0 38%, var(--green) 100%); }
[dir="rtl"] main.mb .mb-plate--graphite, [dir="rtl"] main.mb .mb-stage--graphite{ background:linear-gradient(200deg, var(--black) 0 30%, var(--slate) 100%); }
[dir="rtl"] main.mb .mb-plate--prestige{ background:linear-gradient(225deg, var(--black) 0 30%, var(--gold) 100%); }
[dir="rtl"] main.mb .mb-course__cover{ background:linear-gradient(225deg, var(--purple) 0 40%, var(--gold) 100%); }
[dir="rtl"] main.mb .mb-course__cover--soon, [dir="rtl"] main.mb .mb-layer--soon{ background:linear-gradient(225deg, var(--white) 0%, var(--silver) 100%); }
[dir="rtl"] main.mb .mb-streak__card{ background:linear-gradient(200deg, var(--black) 0 40%, var(--purple) 100%); }
[dir="rtl"] main.mb .mb-subnav__dot{ background:linear-gradient(225deg, var(--purple), var(--gold)); }
[dir="rtl"] main.mb .mb-stage > .mb-stage__card{ transform:rotate(6deg); }
[dir="rtl"] main.mb .mb-phone:first-child .iphone{ rotate:4deg; } [dir="rtl"] main.mb .mb-phone:last-child .iphone{ rotate:-4deg; }
[dir="rtl"] main.mb .mb-close__plate .mcardobj{ rotate:-6deg; }
[dir="rtl"] main.mb .mb-msg > p{ border-radius:12px 4px 12px 12px; }
:lang(ar) main.mb :is(.meta,.mb-k,.mb-pill--mono,.mb-pill--scrim,.mb-tag,.mb-chip,.mb-here-tag,.mb-tier__soon,.mb-handoff,.mb-video__lt){ letter-spacing:0; }
@media (max-width:767px){
    }

/* ============ 26. Reduced motion: no movement, final frames (memb.js also stops every loop and auto-advance) ============ */
@media (prefers-reduced-motion:reduce){
  main.mb *, main.mb *::before, main.mb *::after{ animation:none !important; transition-duration:1ms !important; transition-delay:0s !important; }
  html.mb-js main.mb [data-mb-reveal]:not(.is-in){ opacity:1; transform:none; }
  html.mb-js main.mb .mb-stage:not(.is-in) > .mb-win{ opacity:1 !important; transform:none !important; }
  html.mb-js main.mb .mb-stage:not(.is-in) > :is(.iphone, .mb-stage__card){ opacity:1 !important; translate:none !important; }
  main.mb .mb-painfix{ --mb-p:1 !important; }
}

/* ============ 27. Small parts used by the partials ============ */
main.mb .mb-chiprow{ display:flex; flex-wrap:wrap; gap:6px; }
main.mb .mb-li--flush{ padding:0; min-height:0; }
main.mb .mb-ubtn--sm{ height:26px; margin-top:8px; }
main.mb .mb-ui > .mb-ubtn{ display:flex; width:max-content; }
main.mb .mb-cred--in{ margin-top:12px; box-shadow:inset 0 0 0 1px var(--mb-hair); }
main.mb .mb-ui__row{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:10px; padding-top:10px; border-top:1px solid var(--mb-hair); font-size:14px; }
main.mb .mb-ui__row > span:first-child{ display:inline-flex; align-items:center; gap:8px; }
main.mb .mb-ui__row .mb-i{ width:15px; height:15px; }
main.mb .mb-trows{ margin-top:8px; }
main.mb .mb-card__well > .mb-toast{ position:absolute; z-index:2; inset-block-end:16px; inset-inline-end:16px; }
main.mb .mb-card__well > .mb-toast--ink{ inset-block-end:auto; inset-block-start:16px; }
main.mb .mb-card__well > .mb-ui{ position:relative; z-index:1; }
main.mb .mb-ui-agents .mb-ui__hd .mb-k{ margin-inline-start:auto; }
main.mb .mb-win{ position:relative; }
main.mb .mb-stage > .mb-win{ position:absolute; }
@media (max-width:767px){ main.mb .mb-stage > .mb-win{ position:relative; } }
main.mb .mb-win > .mb-toast--float{ position:absolute; z-index:6; inset-block-start:52px; inset-inline:0; margin-inline:auto; width:max-content; }
main.mb .mb-path .mb-chips{ flex-direction:row; flex-wrap:wrap; gap:8px; }
main.mb .mb-path .mb-chip{ display:inline-flex; font-size:12px; line-height:1; }
main.mb .mb-sec--ghost :is(.mb-pick, .mb-tab){ background:#fff; box-shadow:var(--mb-sh); }
main.mb .mb-sec--ghost .mb-tab[aria-selected="true"]{ background:var(--purple-50); box-shadow:var(--mb-sh-lg); }
main.mb .mb-sec--ghost .mb-pick[aria-selected="true"]{ background:var(--purple-50); box-shadow:var(--mb-sh-lg); }
main.mb .mb-ps .mb-ui{ padding:16px; border-radius:16px; }
main.mb .mb-ps .mb-ladder > span{ height:34px; font-size:14px; }
main.mb .mb-ps .mb-streak__card b{ font-size:24px; }
main.mb .mb-ps .mb-streak__card{ padding:20px 14px; }
main.mb .mb-ps .mb-start > span{ min-height:96px; }
main.mb .mb-canvas .mb-model{ font-size:12px; }
main.mb .mb-phones > .mb-phones__plate, main.mb .mb-phones > .mb-phones__caps{ grid-column:1; }
main.mb .mb-phones > .mb-claims{ grid-column:2; grid-row:1 / span 2; }
@media (max-width:1023px){ main.mb .mb-phones > *{ grid-column:auto !important; grid-row:auto !important; } }
main.mb .mb-board{ --mb-col:calc(100% + 30px); }
main.mb .mb-mv1{ --mb-dx:var(--mb-col); } main.mb .mb-mv2{ --mb-dx:calc(2 * var(--mb-col)); } main.mb .mb-mv3{ --mb-dx:calc(3 * var(--mb-col)); }

/* ============ 28. Pace: one product surface per screen (round 2) ============ */
/* the site header and the subnav are solid on these pages: nothing shows through them */
body:has(main.mb) #rivet-header::before{ background:#fff; -webkit-backdrop-filter:none; backdrop-filter:none; }
main.mb .mb-subnav{ background:#fff; -webkit-backdrop-filter:none; backdrop-filter:none; }

/* hero: copy, then the member space across the whole plate, then price and terms under it */
main.mb .mb-hero{ padding-block:clamp(24px, 3vw, 48px) clamp(48px, 6vw, 88px); }
main.mb .mb-hero__copy h1{ margin-bottom:16px; }
main.mb .mb-hero__cta{ margin-top:24px; }
main.mb .mb-stage:not(:has(> .iphone)){ aspect-ratio:auto; height:clamp(440px, 46vw, 620px); margin-top:40px; padding:0; }
main.mb .mb-stage:not(:has(> .iphone)) > .mb-win{ inset-block-start:40px; inset-inline:40px; width:auto; height:calc(100% - 40px); }
main.mb .mb-stage:not(:has(> .iphone)) > .mb-stage__card{ width:188px; inset-inline-start:24px; inset-block-end:24px; }
main.mb .mb-hero__after{ margin-top:28px; gap:0; }
main.mb .mb-hero__after .mb-hero__price{ margin:0; font-size:16px; }
main.mb .mb-hero__after .mb-hero__for{ margin-top:12px; font-size:14px; line-height:1.55; max-width:84ch; }
main.mb .mb-home{ gap:12px; }
main.mb .mb-home__grid{ display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:12px; align-items:start; }
main.mb .mb-home__course{ grid-row:span 3; display:flex; flex-direction:column; gap:10px; }
main.mb .mb-home__course .mb-ui__hd{ margin:0; }
main.mb .mb-home__course .mb-ubtn{ align-self:flex-start; }
main.mb .mb-home .mb-ps__card{ gap:2px; padding:12px 14px; border-radius:12px; }
main.mb .mb-home .mb-ps__card b{ font-size:14px; }
main.mb .mb-home .mb-ps__card :is(small, > span){ font-size:12px; }
main.mb .mb-home .mb-ps__card p{ margin:0; font-size:13px; line-height:1.45; }
main.mb .mb-home .mb-ps__card .mb-ubtn{ height:28px; margin-top:6px; font-size:12px; padding-inline:12px; border-radius:8px; }
main.mb .mb-home .mb-ps__who{ margin-bottom:4px; }
main.mb .mb-home .mb-ps__who .mb-av{ width:28px; height:28px; font-size:11px; }

/* a lesson is a slide, not a black rectangle */
main.mb .mb-slide{ position:relative; display:flex; flex-direction:column; justify-content:flex-end; gap:10px; aspect-ratio:16 / 8; padding:28px; box-sizing:border-box; border-radius:10px; background:var(--purple-50); overflow:hidden; }
main.mb .mb-slide::before{ content:""; position:absolute; inset-block-start:24px; inset-inline-start:28px; width:40px; height:4px; border-radius:2px; background:var(--mb-purple); }
main.mb .mb-slide b{ font:600 clamp(20px, 2.1vw, 28px)/1.2 var(--font-sans); letter-spacing:-.015em; max-width:20ch; }
main.mb .mb-slide__n{ position:absolute; inset-block-start:18px; inset-inline-end:20px; font:500 12px/1 var(--font-mono); color:var(--mb-slate); }
main.mb .mb-slide--sm{ aspect-ratio:auto; padding:30px 14px 14px; gap:4px; }
main.mb .mb-slide--sm::before{ inset-block-start:14px; inset-inline-start:14px; width:28px; height:3px; }
main.mb .mb-slide--sm b{ font-size:16px; }
main.mb .mb-ui-course > .mb-bar{ height:4px; }

/* pain then fix: the story on the left, one sticky visual on the right that gathers as you scroll */
main.mb .mb-painfix__grid{ grid-template-columns:40px minmax(0,5fr) minmax(0,6fr); column-gap:48px; row-gap:40px; }
main.mb .mb-painfix__a, main.mb .mb-painfix__voices, main.mb .mb-painfix__b{ grid-column:2; }
main.mb .mb-painfix__a{ grid-row:1; align-self:start; }
main.mb .mb-painfix__voices{ grid-row:2; }
main.mb .mb-painfix__b{ grid-row:3; padding-top:8px; }
main.mb .mb-painfix__line{ grid-row:1 / span 3; }
main.mb .mb-painfix__a .mb-mark, main.mb .mb-painfix__b .mb-mark{ margin-inline-start:calc(-40px - 48px + 4px); }
main.mb .mb-fixlist{ grid-template-columns:minmax(0,1fr); gap:14px; }
main.mb .mb-sprawl{ grid-column:3; grid-row:1 / span 3; align-self:start; position:sticky; top:calc(var(--mb-top) + 96px); width:100%; max-width:500px; aspect-ratio:1; margin-inline:auto;
  border-radius:50%; background:radial-gradient(closest-side, var(--ghost-white), var(--ghost-white) 98%, transparent 100%); }
main.mb .mb-scat{ position:absolute; inset:0; --s:1; }
main.mb .mb-scat > *{ position:absolute; top:50%; left:50%; translate:calc(-50% + var(--x) * var(--s) * (1 - var(--mb-p)) * var(--mb-dir)) calc(-50% + var(--y) * var(--s) * (1 - var(--mb-p)));
  scale:calc(1 - .45 * var(--mb-p)); opacity:calc(1 - var(--mb-p)); }
main.mb .mb-scat__i{ display:grid; place-items:center; width:52px; height:52px; border-radius:14px; background:#fff; box-shadow:var(--mb-sh); }
/* logos dimmed: the approved logo-strip exception */
main.mb .mb-scat__i img{ width:26px; height:26px; object-fit:contain; filter:grayscale(1); opacity:.6; }
main.mb .mb-scat__i svg{ width:22px; height:22px; fill:none; stroke:var(--mb-slate); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
main.mb .mb-scat__i .mb-av{ width:36px; height:36px; font-size:11px; }
main.mb .mb-scat__p{ padding:10px 14px; border-radius:12px; background:#fff; box-shadow:var(--mb-sh-lg); font:500 14px/1.35 var(--font-sans); color:#000; white-space:nowrap; }
main.mb .mb-sys{ position:absolute; inset:0; margin:auto; width:min(340px, 84%); height:max-content; border-radius:16px; background:#fff; box-shadow:var(--mb-sh-lg); overflow:hidden;
  opacity:var(--mb-p); scale:calc(.9 + .1 * var(--mb-p)); }
main.mb .mb-sys__bar{ height:40px; display:flex; align-items:center; padding-inline:16px; border-bottom:1px solid var(--mb-hair); }
main.mb .mb-sys__bar img{ height:14px; width:auto; display:block; }
main.mb .mb-sys ul{ list-style:none; margin:0; padding:12px; display:flex; flex-direction:column; gap:6px; }
main.mb .mb-sys li{ display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:10px; background:var(--mb-ghost); font:600 14px/1.3 var(--font-sans); color:#000; }

/* the GTM Engineer panel: a pipeline built into the stack */
main.mb .mb-stackmap{ display:flex; flex-direction:column; gap:12px; }
main.mb .mb-stackmap .mb-ui__hd{ margin:0; }
main.mb .mb-flowx{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:12px; }
main.mb .mb-flowx li{ position:relative; display:flex; flex-direction:column; gap:6px; min-height:72px; padding:12px; border-radius:10px; background:var(--mb-ghost); font:600 13px/1.3 var(--font-sans); }
main.mb .mb-flowx li + li::before{ content:""; position:absolute; inset-block-start:50%; inset-inline-start:-12px; width:12px; height:2px; background:var(--mb-purple); }
main.mb .mb-flowx li.is-end{ background:var(--purple-100); color:var(--purple-800); }
main.mb .mb-stackmap__base{ display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:2px 10px; padding:10px 12px; border-radius:10px; background:var(--purple-50); font:600 13px/1.3 var(--font-sans); }
main.mb .mb-stackmap__base small{ grid-column:2; font-weight:400; color:var(--mb-slate); }
main.mb .mb-stackmap__base .mb-tile{ grid-row:span 2; width:auto; padding-inline:8px; }

/* what's included: one tab per course, then how they fit and how it runs */
main.mb .mb-ctabs{ display:grid; grid-template-columns:repeat(var(--n, 3), minmax(0,1fr)); gap:12px; margin:0 0 20px; }
main.mb .mb-ctab{ display:flex; flex-direction:column; align-items:flex-start; gap:6px; padding:16px 18px 18px; border:0; border-radius:12px; background:#fff; box-shadow:var(--mb-sh); color:#000; font:inherit; text-align:start; cursor:pointer;
  transition:background-color var(--mb-t2) var(--mb-ease), box-shadow var(--mb-t2) var(--mb-ease); }
main.mb .mb-ctab:hover{ box-shadow:var(--mb-sh-lg); }
main.mb .mb-ctab .mb-i{ color:var(--mb-slate); }
main.mb .mb-ctab b{ font-size:16px; font-weight:600; line-height:1.3; }
main.mb .mb-ctab__s{ font:500 12px/1.4 var(--font-mono); letter-spacing:.06em; text-transform:uppercase; color:var(--mb-slate); }
main.mb .mb-ctab[aria-selected="true"]{ background:var(--purple-50); box-shadow:var(--mb-sh-lg); }
main.mb .mb-ctab[aria-selected="true"] .mb-i{ color:var(--mb-purple); }
main.mb .mb-cpanels > .mb-panel + .mb-panel{ margin-top:24px; }
html.mb-js main.mb .mb-cpanels > .mb-panel + .mb-panel{ margin-top:0; }
main.mb .mb-cpanel{ display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:32px; align-items:start; padding:32px; border-radius:var(--radius-base, 24px); background:#fff; box-shadow:var(--mb-sh); }
main.mb .mb-cpanel--stack, main.mb .mb-cpanel--one{ grid-template-columns:minmax(0,1fr); }
main.mb .mb-cpanel__top{ display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:32px; align-items:start; }
main.mb .mb-cpanel__copy, main.mb .mb-cpanel__cur{ display:flex; flex-direction:column; align-items:flex-start; gap:14px; }
main.mb .mb-cpanel__copy > *, main.mb .mb-cpanel__cur > *, main.mb .mb-cpanel__cur .mb-ready__head > *{ margin:0; }
main.mb .mb-cpanel__cur .mb-ready__head{ display:flex; flex-direction:column; gap:12px; }
main.mb .mb-cpanel__copy h3 a{ color:inherit; text-decoration:none; }
main.mb .mb-cpanel__copy h3 a:hover{ text-decoration:underline; text-underline-offset:4px; text-decoration-thickness:1px; }
main.mb .mb-cpanel__copy > p{ font-size:16px; line-height:1.55; color:var(--mb-slate); }
main.mb .mb-cpanel__copy ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
main.mb .mb-cpanel__copy li{ display:flex; gap:10px; align-items:flex-start; font-size:16px; line-height:1.5; }
main.mb .mb-cpanel__copy li.mb-check-li::before{ margin-top:4px; }
main.mb .mb-cpanel__copy .mb-course__own{ margin-top:4px !important; width:100%; }
main.mb .mb-cpanel__copy .mb-plus--next{ margin-top:4px; box-shadow:none; background:var(--mb-ghost); }
main.mb .mb-cpanel__vis{ min-width:0; display:flex; flex-direction:column; justify-content:center; padding:32px; min-height:400px; box-sizing:border-box; }
main.mb .mb-cpanel--stack .mb-cpanel__vis{ padding:0; min-height:0; }
main.mb .mb-cpanel--stack .mb-player--course{ margin-top:0; }
main.mb .mb-cpanel--one .mb-ready{ margin-top:0; grid-template-columns:minmax(0,1fr); }
main.mb .mb-cpanel--one .mb-facts{ grid-template-columns:repeat(4, minmax(0,1fr)); }
main.mb .mb-cpanel--one .mb-facts > div{ box-shadow:none; background:var(--mb-ghost); }
main.mb .mb-cpanel--one .mb-need{ box-shadow:none; padding:0; }
main.mb .mb-cpanel--one .mb-need ol{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); column-gap:32px; }
main.mb .mb-cpanel--one .mb-need ol > li:nth-child(2){ border-top:0; padding-top:0; }
main.mb .mb-cpanel--one .mb-layer{ box-shadow:none; background:var(--mb-ghost); }
main.mb .mb-incl{ display:grid; grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:24px; margin-top:24px; align-items:stretch; }
main.mb .mb-incl > .mb-plus, main.mb .mb-incl > .mb-person{ margin:0; }
main.mb .mb-incl > .mb-person{ grid-template-columns:96px minmax(0,1fr); }
main.mb .mb-incl > .mb-person img{ width:96px; height:96px; }
main.mb .mb-incl .mb-person__stats{ grid-template-columns:repeat(2, minmax(0,1fr)); }
main.mb .mb-builds{ display:flex; flex-direction:column; gap:12px; }
main.mb .mb-builds .mb-ui__hd{ margin:0; }
main.mb .mb-builds__l{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:8px; }
main.mb .mb-builds__l li{ display:flex; flex-direction:column; gap:4px; padding:10px 12px; border-radius:10px; background:var(--mb-ghost); font:600 13px/1.35 var(--font-sans); }
main.mb .mb-builds__ft{ display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 10px; padding:12px; border-radius:10px; background:var(--purple-50); font-size:13px; }
main.mb .mb-builds__ft small{ color:var(--mb-slate); }
main.mb .mb-ia{ display:flex; flex-direction:column; align-items:center; gap:12px; text-align:center; }
main.mb .mb-ia .mb-ui__hd{ align-self:stretch; margin:0; }
main.mb .mb-inf{ width:100%; max-width:360px; height:auto; }
main.mb .mb-inf path{ fill:none; stroke:var(--mb-purple); stroke-width:6; stroke-linecap:round; }

/* beyond the courses: six tiles, one surface each */
main.mb .mb-legend{ margin:0; font-size:14px; color:var(--mb-slate); }
main.mb .mb-bento > .mb-card--a{ grid-column:1 / span 7; grid-row:1 / span 2; }
main.mb .mb-bento > .mb-card--b{ grid-column:8 / span 5; grid-row:1; }
main.mb .mb-bento > .mb-card--c{ grid-column:8 / span 5; grid-row:2; }
main.mb .mb-bento > .mb-card--d{ grid-column:1 / span 7; grid-row:3; }
main.mb .mb-bento > .mb-card--e{ grid-column:8 / span 5; grid-row:3; }
main.mb .mb-bento > .mb-card--f{ grid-column:1 / -1; grid-row:4; display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:40px; align-items:center; }
main.mb [data-mb-here="membership"] .mb-card--f{ display:none; }
main.mb .mb-card > p{ font-size:16px; }
main.mb .mb-card__well{ height:auto; min-height:220px; }
main.mb .mb-card--a .mb-card__well{ min-height:0; padding:24px; }
main.mb .mb-win--room{ box-shadow:var(--mb-sh-lg); }
main.mb .mb-win--room .mb-win__body{ grid-template-columns:200px minmax(0,1fr); min-height:0; height:auto; }
main.mb .mb-win--room .mb-win__rail{ gap:0; }
main.mb .mb-win--room .mb-rail__sub{ height:30px; border-radius:8px; }
main.mb .mb-win--room .mb-rail__sub > span:not(.mb-tile){ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; }
main.mb .mb-win--room .mb-rail__sub.is-on{ background:#fff; color:#000; font-weight:600; box-shadow:0 1px 2px rgba(0,0,0,.06); }
main.mb .mb-win--room .mb-rail__sub.is-locked{ opacity:.7; }
main.mb .mb-win--room .mb-rail__sub .mb-pill{ display:none; }
main.mb .mb-win--room .mb-win__main{ gap:12px; padding:18px 20px; }
main.mb .mb-win--room .mb-ui__hd{ margin:0 0 4px; }
main.mb .mb-card--d .mb-card__well{ padding:24px; }
main.mb .mb-card--d .mb-ui-agents{ width:100%; }
main.mb .mb-avail{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:8px 24px; }
main.mb .mb-avail li{ display:flex; flex-direction:column; align-items:flex-start; gap:4px; font-size:14px; line-height:1.4; color:var(--mb-slate); }
main.mb .mb-avail b{ color:#000; font-weight:600; }
main.mb .mb-card--e .mb-card__well{ padding:0; min-height:0; }
main.mb .mb-card--e .pdp-cert{ border-radius:12px; }
main.mb .mb-pts{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; }
main.mb .mb-pts > li{ display:grid; grid-template-columns:32px minmax(0,1fr); gap:12px; }
main.mb .mb-pts__ic{ display:grid; place-items:center; width:32px; height:32px; border-radius:8px; background:var(--mb-ghost); color:#000; }
main.mb .mb-pts__ic svg{ width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
main.mb .mb-pts h4{ margin:0; font:600 16px/1.35 var(--font-sans); }
main.mb .mb-pts p{ margin:2px 0 0; font-size:14px; line-height:1.5; color:var(--mb-slate); }
main.mb .mb-card--f > .mb-card__well{ order:0; min-height:0; padding:40px 24px 0; align-items:center; justify-content:flex-end; overflow:hidden; }
main.mb .mb-card--f .iphone{ --iphone-w:260px; --iphone-fit:.624; margin-bottom:-120px; }
main.mb .mb-card__body{ display:flex; flex-direction:column; align-items:flex-start; gap:14px; }
main.mb .mb-card__body > *{ margin:0; }
main.mb .mb-card__body > p{ font-size:16px; line-height:1.55; color:var(--mb-slate); }
main.mb .mb-caps{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:16px; font-size:14px; line-height:1.5; color:var(--mb-slate); }
main.mb .mb-caps b{ display:block; color:#000; font-weight:600; }
main.mb .mb-card__body .mb-claims{ flex-direction:row; flex-wrap:wrap; gap:16px 24px; padding-top:16px; border-top:1px solid var(--mb-hair); width:100%; }
main.mb .mb-card__body .mb-claims > li{ flex:1 1 180px; grid-template-columns:40px minmax(0,1fr); gap:12px; }
main.mb .mb-card__body .mb-claims__ic{ width:40px; height:40px; }
main.mb .mb-card__body .mb-claims b{ font-size:16px; }
main.mb .mb-card__body .mb-claims span{ font-size:14px; }

/* compare: three tabs, one table */
main.mb .mb-seg2{ display:flex; gap:4px; margin:0 auto 28px; padding:4px; width:max-content; max-width:100%; box-sizing:border-box; border-radius:12px; background:#fff; box-shadow:var(--mb-sh); overflow-x:auto; scrollbar-width:none; }
main.mb .mb-seg2__t{ flex:none; height:40px; padding-inline:18px; border:0; border-radius:9px; background:transparent; color:var(--mb-slate); font:600 14px/1 var(--font-sans); white-space:nowrap; cursor:pointer; transition:background-color var(--mb-t2) var(--mb-ease), color var(--mb-t2) var(--mb-ease); }
main.mb .mb-seg2__t:hover{ color:#000; }
main.mb .mb-seg2__t[aria-selected="true"]{ background:#000; color:#fff; }
main.mb .mb-ctwrap{ border-radius:12px; background:#fff; box-shadow:var(--mb-sh); overflow-x:auto; }
main.mb .mb-ct{ width:100%; min-width:760px; border-collapse:collapse; font-size:14px; line-height:1.5; }
main.mb .mb-ct :is(th,td){ padding:14px 18px; vertical-align:top; text-align:start; border-top:1px solid var(--mb-hair); }
main.mb .mb-ct thead :is(th,td){ border-top:0; padding-block:22px 12px; vertical-align:bottom; }
main.mb .mb-ct thead th b{ display:block; font:600 20px/1.2 var(--font-sans); letter-spacing:-.01em; }
main.mb .mb-ct thead .mb-here-tag{ margin-bottom:8px; }
main.mb .mb-ct tbody th{ width:15%; font:500 12px/1.5 var(--font-mono); letter-spacing:.08em; text-transform:uppercase; color:var(--mb-slate); }
main.mb .mb-ct .mb-cmpc__price{ margin:0; min-height:0; }
main.mb .mb-ct .mb-cmpc__price strong{ font-size:24px; }
main.mb .mb-ct__cta td{ border-top:0; padding-block:8px 24px; vertical-align:bottom; }
main.mb .mb-ct__cta p{ margin:0; }
main.mb .mb-ct__cta .btn{ width:100%; box-sizing:border-box; white-space:normal; text-align:center; }
main.mb :is([data-mb-here="pro"] .mb-ct [data-tier="pro"], [data-mb-here="max"] .mb-ct [data-tier="max"], [data-mb-here="infinite"] .mb-ct [data-tier="infinite"]){ background:var(--purple-50); }
main.mb :is([data-mb-here="pro"] .mb-ct [data-tier="pro"], [data-mb-here="max"] .mb-ct [data-tier="max"], [data-mb-here="infinite"] .mb-ct [data-tier="infinite"]) .mb-here-tag{ display:inline-flex; background:#fff; }
main.mb :is([data-mb-here="pro"] .mb-ct [data-tier="pro"], [data-mb-here="max"] .mb-ct [data-tier="max"], [data-mb-here="infinite"] .mb-ct [data-tier="infinite"]) .mb-cmpc__apply{ display:block !important; }
main.mb :is([data-mb-here="pro"] .mb-ct [data-tier="pro"], [data-mb-here="max"] .mb-ct [data-tier="max"], [data-mb-here="infinite"] .mb-ct [data-tier="infinite"]) .mb-cmpc__see{ display:none !important; }
main.mb #compare .mb-mx{ margin-top:0; }
main.mb #compare .mb-mx > h3, main.mb #compare .mb-mx > .eyebrow{ display:none; }
html:not(.mb-js) main.mb #compare .mb-mx > h3{ display:block; }
main.mb #compare .mb-panel + .mb-panel{ margin-top:32px; }
html.mb-js main.mb #compare .mb-panel + .mb-panel{ margin-top:0; }
html:not(.mb-js) main.mb .mb-seg2{ display:none; }

/* fit: two short cards; the company note lives in the questions */
main.mb .mb-paths[style*="--n:2"]{ max-width:1040px; margin-inline:auto; }
main.mb .mb-company{ display:flex; flex-direction:column; gap:14px; }
main.mb .mb-company > *{ margin:0; }
main.mb .mb-company .pdp-company__send{ padding:20px; border-radius:12px; background:#fff; box-shadow:var(--mb-sh); }
main.mb .mb-company dl{ margin:0; display:flex; flex-direction:column; }
main.mb .mb-company dl > div{ display:grid; grid-template-columns:140px minmax(0,1fr); gap:12px; padding:10px 0; border-top:1px solid var(--mb-hair); font-size:14px; }
main.mb .mb-company dt{ font:500 12px/1.5 var(--font-mono); letter-spacing:.08em; text-transform:uppercase; color:var(--mb-slate); }
main.mb .mb-company dd{ margin:0; }

/* questions: the heading stays in view beside the list */
main.mb #faq > .mb-row__grid{ align-items:start; }
main.mb #faq > .mb-row__grid > .mb-row__copy{ position:sticky; top:calc(var(--mb-top) + 96px); }
main.mb .mb-faq__tabs{ flex-wrap:wrap; }

/* everything else: one row of links */
main.mb .mb-sibrow{ background:var(--mb-ghost); }
main.mb .mb-sibrow__in{ display:flex; align-items:center; gap:16px 28px; flex-wrap:wrap; }
main.mb .mb-sibrow__k{ margin:0; flex:none; }
main.mb .mb-sibrow .mb-sibs{ display:flex; flex-wrap:wrap; gap:8px; list-style:none; margin:0; padding:0; }
main.mb .mb-sibrow .mb-sib > a{ display:inline-flex; grid-template-columns:none; align-items:center; gap:8px; height:40px; padding:0 16px 0 10px; border-radius:999px; background:#fff; box-shadow:var(--mb-sh); color:#000; font:600 14px/1 var(--font-sans); text-decoration:none; }
main.mb .mb-sibrow .mb-sib > a:hover{ transform:none; box-shadow:var(--mb-sh-lg); }
main.mb .mb-sibrow .mb-sib__ic{ grid-row:auto; width:24px; height:24px; border-radius:6px; background:var(--mb-ghost); }
main.mb .mb-sibrow .mb-sib__ic svg{ width:16px; height:16px; }

/* the close: one band, one CTA, two members */
main.mb .mb-close__grid{ display:grid; grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:48px; align-items:center; text-align:start; }
main.mb .mb-close__grid .mb-close__copy{ align-items:flex-start; margin:0; max-width:none; }
main.mb .mb-close__grid .mb-close__cta, main.mb .mb-close__grid .mb-proof{ justify-content:flex-start; }
main.mb .mb-close__grid .mb-close__plate{ height:380px; margin-top:0; padding:0 32px; }
main.mb .mb-voices--2{ grid-template-columns:repeat(2, minmax(0,1fr)); margin-top:48px; }

/* the apply card is light on a light page */
main.mb .rfa__glow{ display:none; }
main.pdp.mb .pdp-apply .rfa__card, main.mb .rfa__card{ background:#fff; color:#000; box-shadow:var(--mb-sh-lg); }
main.mb .rfa .rfa__card .rf.rfa__form{ --rf-ink:#000; --rf-muted:var(--mb-slate); --rf-line:var(--mb-line); --rf-line-strong:var(--slate-400, #9A9BBD); --rf-field:#fff; --rf-surface:var(--mb-ghost);
  --rf-focus:var(--mb-purple); --rf-err:var(--danger-text, #E12C05); --rf-ok:var(--success-text, #00864F);
  --rf-chev:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234A4A68' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); }
main.mb .rfa__k, main.mb .rfa__kicker, main.mb .rfa__form .rf-opt, main.mb .rfa__form .rf-consent, main.mb .rfa__form .rf-price{ color:var(--mb-slate); }
main.mb .rfa__title, main.mb .rfa__form .rf-field label, main.mb .rfa__form .rf-label, main.mb .rfa__done h3{ color:#000; }
main.mb .rfa__fields, main.mb .rfa__done{ border-top-color:var(--mb-hair); }
main.mb .rfa__form :where(input, select, textarea):hover{ border-color:var(--mb-slate); }
main.mb .rfa__done p{ color:var(--mb-slate); }
main.mb .rfa__done-acts .btn{ color:#000; border-color:var(--mb-line); }
main.mb .rfa__done-acts .btn:hover{ background:var(--mb-ghost); border-color:#000; }
main.mb .rfa__form :focus-visible{ outline-color:var(--mb-purple); }

/* /community: the featured plan card and the maturity model stay light; no magenta glow */
main.mb .pp-plan--feat{ color:#000; background:#fff; box-shadow:var(--mb-sh-lg); }
main.mb .pp-plan--feat :is(.pp-plan__k, .pp-plan__price > span, .pp-plan__unit, .pp-plan__for, .pp-plan__fine, .pp-ticks small, .pp-plan__value, .pp-plan__note, .pp-plan__total, .pp-plan__cap, .pp-credit__t small){ color:var(--mb-slate); }
main.mb .pp-plan--feat :is(.pp-plan__for b, .pp-plan__name, .pp-plan__name a, .pp-link, .pp-ticks a, .pp-plan__plus, .pp-plan__total b, .pp-credit){ color:#000; }
main.mb .pp-plan--feat .pp-plan__inc{ border-top-color:var(--mb-hair); }
main.mb .pp-plan--feat .btn--primary{ background:#000; border-color:#000; color:#fff; }
main.mb .pp-plan--feat .btn--primary:hover{ background:var(--slate-900); border-color:var(--slate-900); }
main.mb .pp-plan--feat :where(a,button):focus-visible{ outline-color:var(--mb-purple); }
main.mb .pp-plan--feat :is(.pp-credits, .pp-fitnote){ background:var(--mb-ghost); color:#000; }
main.mb .pp-plan--feat .pp-soon-tag{ background:#fff; box-shadow:var(--mb-sh); color:#000; }
main.mb .gstage{ background:var(--mb-ghost); border:0; box-shadow:none; }
main.mb .gstage::after{ display:none; }
main.mb .gstage__tag{ border:0; background:#fff; box-shadow:var(--mb-sh); -webkit-backdrop-filter:none; backdrop-filter:none; color:var(--mb-purple); font-size:12px; }
main.mb .gnode{ border:0; }
main.mb .mlvl--5{ --gc:var(--mb-purple); }
main.mb .mlvl__pin{ border:0; box-shadow:var(--mb-sh); font-size:11px; }
main.mb .mlvl__pin--os{ color:var(--accent-text); }

/* the learning window on a phone: one column, no rail */
@media (max-width:767px){
  main.mb .mb-win--noside .mb-win__body{ grid-template-columns:minmax(0,1fr); }
}
@media (max-width:600px){
  main.mb .mb-row__visual .mb-ui__grid2{ grid-template-columns:minmax(0,1fr); }
}
/* /community hero: "Inside the membership" stays on tablets and phones, under the feed */
@media (max-width:1023px){
  main.mb[data-page="membership"] .mb-hero .mb-win__side{ display:flex; grid-column:1 / -1; border-inline-start:0; border-top:1px solid var(--mb-hair); }
}

/* RTL: the certificate plate mirrors too */
[dir="rtl"] main.pdp .pdp-cert{ background:linear-gradient(200deg, #000 0 42%, #F5C24B 100%); }

@media (max-width:1023px){
  main.mb .mb-painfix__grid{ grid-template-columns:40px minmax(0,1fr); column-gap:24px; }
  main.mb .mb-painfix__a, main.mb .mb-painfix__voices, main.mb .mb-painfix__b{ grid-column:2; grid-row:auto; }
  main.mb .mb-painfix__a .mb-mark, main.mb .mb-painfix__b .mb-mark{ margin-inline-start:calc(-40px - 24px + 4px); }
  main.mb .mb-sprawl{ grid-column:2; grid-row:auto; position:relative; top:auto; max-width:420px; }
  main.mb .mb-painfix__line{ grid-row:1 / span 4; }
  main.mb .mb-ctabs{ display:flex; overflow-x:auto; scroll-snap-type:x mandatory; margin-inline:-24px; padding:2px 24px 8px; scrollbar-width:none; }
  main.mb .mb-ctab{ flex:none; width:220px; scroll-snap-align:start; }
  main.mb .mb-cpanel, main.mb .mb-cpanel__top{ grid-template-columns:minmax(0,1fr); }
  main.mb .mb-cpanel--one .mb-facts{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  main.mb .mb-incl{ grid-template-columns:minmax(0,1fr); }
  main.mb .mb-bento > .mb-card{ grid-column:1 / -1 !important; grid-row:auto !important; }
  main.mb .mb-bento > .mb-card--f{ grid-template-columns:minmax(0,1fr); }
  main.mb .mb-close__grid{ grid-template-columns:minmax(0,1fr); }
  main.mb .mb-close__grid .mb-close__plate{ height:280px; }
  main.mb #faq > .mb-row__grid > .mb-row__copy{ position:static; }
  main.mb .mb-stage:not(:has(> .iphone)) > .mb-win{ inset-inline:24px; inset-block-start:24px; height:calc(100% - 24px); }
}
@media (max-width:767px){
  main.mb .mb-painfix__grid{ grid-template-columns:24px minmax(0,1fr); column-gap:16px; }
  main.mb .mb-painfix__a .mb-mark, main.mb .mb-painfix__b .mb-mark{ margin-inline-start:calc(-24px - 16px - 4px); }
  main.mb .mb-sprawl{ max-width:340px; }
  main.mb .mb-scat{ --s:.66; }
  main.mb .mb-scat__i{ width:40px; height:40px; border-radius:10px; }
  main.mb .mb-scat__i img{ width:20px; height:20px; }
  main.mb .mb-scat__p{ font-size:12px; padding:8px 10px; white-space:normal; width:max-content; max-width:150px; }
  main.mb .mb-stage:not(:has(> .iphone)){ height:auto; padding:16px 12px 24px; }
  main.mb .mb-stage:not(:has(> .iphone)) > .mb-win{ position:relative; inset:auto; height:auto; }
  main.mb .mb-stage:not(:has(> .iphone)) > .mb-stage__card{ position:relative; inset:auto; width:180px; margin:20px auto 0; transform:rotate(-4deg); }
  main.mb .mb-home__grid{ grid-template-columns:minmax(0,1fr); }
  main.mb .mb-home__course{ grid-row:auto; }
  main.mb .mb-home__grid > .mb-ps__card:nth-child(n+3){ display:none; }
  main.mb .mb-hero__copy .t-lead-hero{ font-size:16px; }
  main.mb .mb-flowx{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  main.mb .mb-flowx li + li::before{ display:none; }
  main.mb .mb-ctabs{ margin-inline:-16px; padding-inline:16px; }
  main.mb .mb-ctab{ width:180px; padding:12px 14px; }
  main.mb .mb-ctab b{ font-size:14px; }
  main.mb .mb-cpanel{ padding:20px 16px; gap:20px; border-radius:16px; }
  main.mb .mb-cpanel__vis{ padding:16px; min-height:0; }
  main.mb .mb-cpanel--one .mb-need ol{ grid-template-columns:minmax(0,1fr); }
  main.mb .mb-cpanel--one .mb-need ol > li:nth-child(2){ border-top:1px solid var(--mb-hair); padding-top:14px; }
  main.mb .mb-builds__l{ grid-template-columns:minmax(0,1fr); }
  main.mb .mb-slide{ padding:20px; }
  main.mb .mb-slide::before{ inset-inline-start:20px; inset-block-start:18px; }
  main.mb .mb-incl > .mb-person{ grid-template-columns:72px minmax(0,1fr); }
  main.mb .mb-incl > .mb-person img{ width:72px; height:72px; }
  main.mb .mb-win--room .mb-win__body{ grid-template-columns:minmax(0,1fr); }
  main.mb .mb-win--room .mb-win__rail{ display:none; }
  main.mb .mb-card--a .mb-card__well, main.mb .mb-card--d .mb-card__well{ padding:14px; }
  main.mb .mb-avail{ grid-template-columns:minmax(0,1fr); }
  main.mb .mb-caps{ grid-template-columns:minmax(0,1fr); gap:10px; }
  main.mb .mb-card--f .iphone{ --iphone-w:220px; --iphone-fit:.528; margin-bottom:-110px; }
  main.mb .mb-subnav{ height:44px; margin-bottom:-44px; }
  main.mb .mb-voices--2{ grid-template-columns:minmax(0,1fr); margin-top:32px; }
  main.mb .mb-company dl > div{ grid-template-columns:minmax(0,1fr); gap:2px; }
  main.mb .mb-sibrow__in{ flex-direction:column; align-items:flex-start; }
}
@media (prefers-reduced-motion:reduce){
  main.mb .mb-painfix{ --mb-p:1 !important; }
}

/* ============ 29. Pace, second pass ============ */
main.mb{ --mb-pad:clamp(56px, 6.5vw, 96px); }
main.mb .mb-hero__copy h1{ max-width:24ch; }
main.mb .mb-hero__copy .t-lead-hero{ max-width:66ch; }
main.mb .mb-ctab > svg{ width:20px; height:20px; flex:none; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; color:var(--mb-slate); }
main.mb .mb-ctab[aria-selected="true"] > svg{ color:var(--mb-purple); }
main.mb .mb-cpanel--aiws{ grid-template-columns:minmax(0,4fr) minmax(0,8fr); }
main.mb .mb-cpanel--aiws .mb-cpanel__vis{ padding:0; min-height:0; justify-content:flex-start; gap:16px; }
main.mb .mb-cpanel--aiws .mb-ready__head{ display:flex; flex-direction:column; gap:8px; }
main.mb .mb-cpanel--aiws .mb-ready__head .t-lead{ font-size:16px; line-height:1.55; }
main.mb .mb-cpanel--aiws .mb-player--course{ margin-top:4px; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:20px; }
main.mb .mb-cpanel--aiws .mb-ptab{ padding:9px 14px; }
main.mb .mb-cpanel--aiws .mb-player--course .mb-plate{ padding:24px; }
main.mb .mb-cpanel--aiws .mb-more{ margin:0; text-align:start; }
main.mb .mb-panel__stage{ min-height:500px; padding:32px; }
main.mb .mb-card--f > .mb-card__well{ height:380px; }
main.mb .mb-card--f .iphone{ margin-bottom:0; }
main.mb .mb-card--f{ padding:24px; }
@media (max-width:1023px){
  main.mb .mb-cpanel--aiws, main.mb .mb-cpanel--aiws .mb-player--course{ grid-template-columns:minmax(0,1fr); }
  main.mb .mb-card--f > .mb-card__well{ height:320px; }
}
main.mb .mb-teamrow{ display:grid; grid-template-columns:minmax(0,3fr) minmax(0,7fr); gap:8px 32px; align-items:start; max-width:1040px; margin:24px auto 0; padding:24px 28px; box-sizing:border-box; border-radius:12px; background:var(--mb-ghost); }
main.mb .mb-teamrow > *{ margin:0; grid-column:2; }
main.mb .mb-teamrow > .eyebrow, main.mb .mb-teamrow > h3{ grid-column:1; }
main.mb .mb-teamrow > h3{ grid-row:2; }
main.mb .mb-teamrow > p:first-of-type{ grid-row:1 / span 2; font-size:16px; line-height:1.55; color:var(--mb-slate); }
main.mb .mb-paths__cta{ margin-top:24px; }
main.mb .mb-card--e .pdp-cert{ padding:16px; gap:10px; }
main.mb .mb-card--e .mb-pts{ gap:10px; }
main.mb .mb-card--d .mb-card__well{ flex:1; }
main.mb .mb-card--d, main.mb .mb-card--e{ align-self:stretch; }
main.mb .mb-stage:not(:has(> .iphone)){ height:clamp(420px, 42vw, 580px); }
main.pdp.mb .pdp-apply .pdp-terms{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:8px; }
main.mb .mb-steps3 > li{ padding-bottom:18px; }
main.mb .mb-steps3 .meta{ display:none; }
main.mb .mb-close__grid .mb-close__plate{ height:320px; }
@media (max-width:767px){
  main.mb .mb-teamrow{ grid-template-columns:minmax(0,1fr); padding:20px; }
  main.mb .mb-teamrow > *{ grid-column:1 !important; grid-row:auto !important; }
  main.pdp.mb .pdp-apply .pdp-terms{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}
main.mb .mb-paths--faq{ grid-template-columns:minmax(0,1fr); gap:16px; }
main.mb .mb-paths--faq .mb-path{ padding:24px; }
main.mb .mb-faq__panel .mb-teamrow{ grid-template-columns:minmax(0,1fr); margin:16px 0 0; }
main.mb .mb-faq__panel .mb-teamrow > *{ grid-column:1; grid-row:auto; }
main.mb .mb-card--b .mb-card__well, main.mb .mb-card--c .mb-card__well{ min-height:180px; }
main.mb .mb-card--e .pdp-cert{ max-width:420px; align-self:center; width:100%; box-sizing:border-box; }
/* pain then fix: the fix runs the full width under the sticky visual */
main.mb .mb-painfix__b{ grid-column:2 / -1; }
main.mb .mb-sprawl{ grid-row:1 / span 2; }
main.mb .mb-painfix__b .mb-fixlist{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:16px 32px; }
main.mb .mb-painfix__b > h3{ max-width:34ch; }
main.mb .mb-quotes__hd{ display:flex; flex-direction:column; gap:8px; margin-top:56px; }
main.mb .mb-quotes__hd > *{ margin:0; }
main.mb .mb-quotes{ margin-top:24px; }
main.mb .mb-close .mb-quote{ background:#fff; }
@media (max-width:1023px){ main.mb .mb-painfix__b{ grid-column:2; } main.mb .mb-painfix__b .mb-fixlist{ grid-template-columns:minmax(0,1fr); } }
/* /community learning: the six points in two columns beside the window */
main.mb #learning .mb-row__grid{ grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:48px; align-items:start; }
main.mb #learning .mb-row__points{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:24px 28px; }
main.mb #learning .mb-row__points > li{ grid-template-columns:36px minmax(0,1fr); gap:12px; }
main.mb #learning .mb-row__points p{ font-size:14px; }
main.mb #learning .mb-row__visual{ min-height:0; padding:24px; position:sticky; top:calc(var(--mb-top) + 96px); }
main.mb #maturity .gstage{ padding:24px; }
main.mb[data-page="membership"] .mb-stage{ aspect-ratio:16 / 8.6; }
@media (max-width:1023px){ main.mb #learning .mb-row__grid{ grid-template-columns:minmax(0,1fr); } main.mb #learning .mb-row__visual{ position:static; } }
@media (max-width:767px){ main.mb #learning .mb-row__points{ grid-template-columns:minmax(0,1fr); } main.mb[data-page="membership"] .mb-stage{ aspect-ratio:auto; } }
@media (min-width:1024px){ main.mb #learning .mb-row__grid{ grid-template-columns:minmax(0,6fr) minmax(0,6fr); } }
main.mb #learning .mb-win--noside .mb-win__body{ grid-template-columns:minmax(0,1fr); min-height:0; }
main.mb #learning .mb-win__rail{ display:none; }
main.mb #learning .mb-row__visual{ padding:20px; }
@media (max-width:767px){
  main.mb .mb-slide__n{ display:none; }
  main.mb .mb-ct tbody th{ position:sticky; inset-inline-start:0; z-index:1; background:#fff; width:96px; min-width:96px; }
  main.mb .mb-ct{ min-width:680px; }
}
/* a long product name never breaks across lines */
main.mb bdi.mb-nw{ white-space:nowrap; }
/* the maturity model on a light plate (glass.css draws it dark by default) */
main.mb .gstage:not(.camelx-stage){ background:var(--mb-ghost); border:0; box-shadow:none; }
main.mb .gstage:not(.camelx-stage) .gstage__cap .label{ color:var(--mb-slate); }
main.mb .gstage:not(.camelx-stage) .gstage__tag{ color:var(--mb-purple); border:0; background:#fff !important; box-shadow:var(--mb-sh); }
main.mb .gstage:not(.camelx-stage) .gnode{ background:#fff; -webkit-backdrop-filter:none; backdrop-filter:none; border:0; box-shadow:var(--mb-sh); }
main.mb .gstage:not(.camelx-stage) .gnode::before{ opacity:0; }
main.mb .gstage:not(.camelx-stage) .gnode:hover{ box-shadow:var(--mb-sh-lg); }
main.mb .gstage:not(.camelx-stage) .mlvl b{ color:#000; }
main.mb .gstage:not(.camelx-stage) .mlvl small{ color:var(--mb-slate); font-size:12px; }
main.mb .gstage:not(.camelx-stage) .mlvl .num{ color:var(--mb-purple); }
main.mb .gstage:not(.camelx-stage) .mlvl--5{ background:var(--purple-50); }
main.mb .gstage:not(.camelx-stage) .mlvl .mlvl__pin{ background:#000; color:#fff; }
main.mb .gstage:not(.camelx-stage) .matur__note{ color:var(--mb-slate); font-size:14px; }
main.mb .gstage:not(.camelx-stage) .matur__note b{ color:var(--mb-purple); }
main.mb .pdp-mx__tag{ font-size:11px; }
/* phones: show the gist of each mockup, swipe the quotes */
@media (max-width:767px){
  main.mb .mb-card--d .mb-agent:nth-child(n+3){ display:none; }
  main.mb .mb-card--f > .mb-card__well{ height:260px; padding-top:24px; }
  main.mb[data-page="membership"] .mb-hero .mb-stage > .iphone{ display:none; }
  main.mb :is(.mb-voices--2, .mb-quotes){ display:flex; overflow-x:auto; scroll-snap-type:x mandatory; gap:12px; margin-inline:-16px; padding:4px 16px 12px; scrollbar-width:none; }
  main.mb :is(.mb-voices--2, .mb-quotes) > *{ flex:none; width:82%; scroll-snap-align:center; }
  main.mb .mb-close__grid .mb-close__plate{ height:220px; }
}