/* Additive shared roles; colors remain owned by tokens.css. */
.mc-learning-bottom-nav { position:fixed; left:0; right:0; bottom:0; min-height:60px; padding-bottom:env(safe-area-inset-bottom,0px); background:var(--card); border-top:1px solid var(--hairline); z-index:30; }
/* Issue #689: the area tabs share the row equally. Only under 960px: an unconditional display here
   would override .mobile-only's desktop display:none and show the tab bar on desktop too. */
@media (max-width:959px) { .mc-learning-bottom-nav { display:flex; } }
.mc-learning-bottom-nav a { flex:1 1 0; min-width:0; display:inline-flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; min-height:60px; box-sizing:border-box; padding:.25rem 2px; font:500 .75rem/1.2 var(--font-sans); color:var(--text-muted); background:transparent; border:0; border-top:3px solid transparent; text-decoration:none; cursor:pointer; }
.mc-learning-bottom-nav a span { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mc-learning-bottom-nav .is-active { border-top-color:var(--accent); color:var(--text-heading); font-weight:600; }
.mc-study-tools { display:flex; flex-wrap:wrap; gap:.5rem 1.5rem; margin-bottom:1rem; }
.mc-study-tools a { display:inline-flex; align-items:center; min-height:var(--control-height); font-size:1rem; }
/* Issue #724: official resources as a visible card with an accent edge. */
.mc-study-resources { margin-bottom:1.5rem; padding:1rem 1.25rem; border:1px solid var(--hairline); border-left:3px solid var(--accent); border-radius:var(--radius-card); background:var(--raised); font-size:1rem; }
.mc-study-resources h2 { margin:0 0 .35rem; font:600 1.0625rem/1.4 var(--font-sans); color:var(--text-heading); }
.mc-study-resources p { margin:0; max-width:68ch; color:var(--text-muted); }
.mc-study-resources ul { display:flex; flex-wrap:wrap; gap:.25rem 1.5rem; margin:.5rem 0 0; padding:0; list-style:none; }
.mc-study-resources li a { display:inline-flex; align-items:center; min-height:var(--control-height); font-weight:600; }
.mc-deck-select { display:grid; gap:.5rem; min-width:0; flex:1; font-size:1rem; }
.mc-deck-select select { width:100%; max-width:100%; min-height:var(--control-height); padding:.5rem; border:1px solid var(--border-control); border-radius:var(--radius-control); background:var(--card); color:var(--text-body); font:inherit; }
/* Account controls also serve the generated pages through public-foundations.css. */
.mc-account-trigger > span:not(:first-child) { font-size: var(--control-font) !important; }
.mc-account-menu > div:first-child { padding: 1rem !important; }
.mc-account-menu > div:first-child > div:first-child { font-size: 1rem !important; }
.mc-account-menu > div:first-child > div + div { font-size: .8125rem !important; }
.mc-account-menu [role="menuitem"]:is(:hover, :focus-visible) {
  background: var(--card) !important;
  outline: 2px solid var(--focus);
  outline-offset: -3px;
}
.mc-account-trigger:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.mc-account-name-first{display:none}
.mc-account-mobile-only{display:none!important}
.mc-account-menu .mc-theme-menu-action{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:var(--control-height);box-sizing:border-box;padding:10px 16px;border:0;background:transparent;color:var(--text-body);font:400 1rem/1.5 var(--font-sans);text-align:left;cursor:pointer}
.mc-account-menu .mc-theme-menu-action:hover{background:var(--card)}
.track-hub .mc-public-header[data-authenticated="true"] .mc-desktop-theme{display:none}
:root {
  --type-body: 1rem; --type-reading: 1.125rem; --type-meta: .8125rem; --type-dense: .875rem;
  /* Standard scale (issue #760): hero 32-48px, page title 28-32px, section 22-24px. Size headings
     from these tokens; never a one-off larger size. */
  --type-display: clamp(2rem, 1.2rem + 2.2vw, 3rem); --type-page: clamp(1.75rem, 1.5rem + .6vw, 2rem); --type-section: clamp(1.375rem, 1.2rem + .5vw, 1.5rem);
  --reading-measure: 68ch; --layout-wide: 80rem;
  /* Control sizes (issue #760): every button, field, menu item and header control uses these.
     Touch screens get 44px targets from the media query below. */
  --control-height: 40px; --control-height-compact: 36px; --control-font: .9375rem;
  /* Issue #677: one-sentence subtitles, ledes and intros stay on one line whenever the container
     has room; only multi-sentence prose keeps --reading-measure. */
  --measure-lede: 90ch;
  --space-grid: .25rem; --space-small: .5rem; --space-inline: .75rem; --space-content: 1rem;
  --space-group: 1.5rem; --space-section: 3rem; --space-page: 4rem;
}
.mc-public {font-size:var(--type-body);line-height:1.5;background:var(--canvas);color:var(--text-body)}
.mc-public-header {max-width:var(--layout-wide);margin:auto;padding:1rem 2rem;display:flex;gap:1.5rem;align-items:center;flex-wrap:wrap;border-bottom:1px solid var(--hairline)}
.mc-public-header nav {display:flex;gap:1.5rem;align-items:center;margin-left:auto}
.mc-public-header a {text-decoration:none;color:var(--text-body)}
.mc-header-utilities {display:flex;gap:1rem;align-items:center}
.mc-my-mockcert-link {display:inline-flex;align-items:center;justify-content:center;min-height:var(--control-height-compact);padding:.375rem .875rem;font-size:var(--control-font);border:1px solid var(--accent);border-radius:var(--radius-control);background:transparent;color:var(--accent)!important;font-weight:600;text-decoration:none;white-space:nowrap}
.mc-my-mockcert-link:hover {background:color-mix(in srgb,var(--accent) 10%,transparent)}
.mc-my-mockcert-link:focus-visible {outline:3px solid var(--focus);outline-offset:2px}
.mc-learning-path-action {display:inline-flex;align-items:center;gap:.75rem;flex-wrap:wrap}
.mc-learning-path-action [role="status"] {font-size:.875rem;color:var(--text-muted)}
/* Issue #677: the added state is a distinct success link (tint + check), same size as its siblings. */
.mc-learning-path-added-note {color:var(--success-text);font-weight:600;font-size:var(--type-meta)}
.mc-try-page {max-width:860px;margin:0 auto;padding:2rem 1.25rem 5rem;color:var(--text-body)}
.mc-try-brand {display:inline-flex;align-items:center;gap:.5rem;margin-bottom:3rem;color:var(--text-heading);font-weight:700;text-decoration:none}
.mc-try-page h1 {font:500 var(--type-display)/1.1 var(--font-serif);color:var(--text-heading);margin:0 0 .75rem}
.mc-try-intro,.mc-try-mock-note {color:var(--text-muted);max-width:var(--measure-lede);text-wrap:pretty}
.mc-try-domain {display:flex;align-items:center;gap:.75rem;margin:2rem 0 1rem;font-weight:600}
.mc-try-domain select {min-height:var(--control-height);max-width:100%;padding:.5rem .75rem;background:var(--card);color:var(--text-body);border:1px solid var(--border-control);border-radius:var(--radius-control);font:inherit}
.mc-try-card {padding:clamp(1.25rem,4vw,2.5rem);background:var(--card);border:1px solid var(--hairline);border-radius:var(--radius-card);box-shadow:var(--card-shadow,none)}
.mc-try-card h2 {font:500 1.4rem/1.4 var(--font-sans);color:var(--text-heading);margin:0 0 1.5rem}
.mc-try-options {display:grid;gap:.75rem}
.mc-try-options button,.mc-flashcard {text-align:left;padding:1rem;background:var(--raised);color:var(--text-body);border:1px solid var(--hairline);border-radius:var(--radius-control);font:inherit;cursor:pointer}
.mc-try-options button[aria-pressed="true"] {border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
/* Issue #677: checked answers show their outcome on the option itself, not only in the explanation. */
.mc-try-options button {display:flex;align-items:center;justify-content:space-between;gap:1rem}
.mc-try-option-mark {display:inline-flex;flex:0 0 auto}
.mc-try-options button[data-state="correct"],.mc-try-options button[data-state="missed"] {border-color:var(--success-text);background:var(--success-tint);color:var(--text-heading);box-shadow:0 0 0 1px var(--success-text)}
.mc-try-options button[data-state="correct"] .mc-try-option-mark,.mc-try-options button[data-state="missed"] .mc-try-option-mark {color:var(--success-text)}
.mc-try-options button[data-state="incorrect"] {border-color:var(--danger-text);background:var(--danger-tint);color:var(--text-heading);box-shadow:0 0 0 1px var(--danger-text)}
.mc-try-options button[data-state="incorrect"] .mc-try-option-mark {color:var(--danger-text)}
.mc-try-options button:disabled:not([data-state]) {opacity:.72}
.mc-try-result {display:flex;align-items:center;gap:.5rem;font-size:1.0625rem}
.mc-try-explanation.is-correct {background:var(--success-tint);border-left:4px solid var(--success-text)}
.mc-try-explanation.is-correct .mc-try-result {color:var(--success-text)}
.mc-try-explanation.is-incorrect {background:var(--danger-tint);border-left:4px solid var(--danger-text)}
.mc-try-explanation.is-incorrect .mc-try-result {color:var(--danger-text)}
.mc-try-explanation p {color:var(--text-body)}
.mc-try-options button:disabled {cursor:default}
.mc-try-explanation {margin-top:1.25rem;padding:1rem;background:var(--surface-subtle);border-radius:var(--radius-control)}
.mc-try-actions {display:flex;justify-content:flex-end;gap:.75rem;margin-top:1.5rem;flex-wrap:wrap}
.mc-flashcard {display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;width:100%;min-height:260px;font-size:1.35rem;line-height:1.5}
.mc-flashcard small {margin-top:2rem;color:var(--text-muted);font-size:.8rem}
.mc-try-mock-note {margin-top:1.5rem}
.mc-theme-toggle,.mc-menu-toggle {align-items:center;justify-content:center;background:transparent;color:var(--text-body);border-radius:var(--radius-control);min-width:44px;min-height:var(--control-height);padding:.5rem;font:inherit;cursor:pointer}
.mc-theme-toggle {display:inline-flex;border:0}
.mc-menu-toggle {display:none;border:1px solid var(--border-control)}
.mc-theme-toggle:hover,.mc-menu-toggle:hover {background:var(--raised)}
.mc-button {display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:var(--control-height);padding:.5rem 1rem;border:1px solid var(--accent);border-radius:var(--radius-control);background:var(--accent);color:var(--on-action);text-decoration:none;font:600 .9375rem/1.25 var(--font-sans);cursor:pointer}
.mc-button:hover {background:var(--accent-hover);color:var(--on-action)}
@media (pointer:coarse) {:root {--control-height:44px; --control-height-compact:44px}}
.mc-button-secondary {background:transparent;color:var(--accent)}
.mc-public :is(a,button,input,select,summary):focus-visible {outline:3px solid var(--focus);outline-offset:4px}
.mc-public .mc-home-search input:focus-visible {outline:none}
.mc-container {max-width:var(--layout-wide);margin:auto;padding:0 2rem}
.mc-hero {display:grid;grid-template-columns:1.05fr 1fr;gap:4rem;align-items:center;padding-block:4rem}
.mc-home-search {display:flex;align-items:center;gap:.75rem;width:min(100%,46rem);min-height:48px;margin:2rem 0 0;padding:0 1rem;border:1px solid var(--hairline-strong);border-radius:var(--radius-control);background:var(--raised);color:var(--text-muted)}
.mc-home-search:focus-within {border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 28%,transparent)}
.mc-home-search input {width:100%;min-width:0;min-height:44px;padding:0;border:0;outline:none;background:transparent;color:var(--text-heading);font:400 1rem/1.4 var(--font-sans)}
.mc-home-search input::placeholder {color:var(--text-muted);opacity:1}
.mc-eyebrow {font:600 var(--type-meta)/1.4 var(--font-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--eyebrow-color);margin:0 0 1rem}
.mc-public h1 {font:500 var(--type-display)/1.12 var(--font-serif);letter-spacing:-.035em;max-width:none;margin:0 0 1.5rem;text-wrap:balance}
.mc-public h2 {font:500 var(--type-section)/1.22 var(--font-serif);letter-spacing:-.025em;margin:0 0 1.5rem}
.mc-public h3 {font:600 1.125rem/1.4 var(--font-sans);margin:0 0 .5rem}
p {text-wrap:pretty}
.mc-lede {font-size:1.0625rem;line-height:1.6;max-width:var(--measure-lede);color:var(--text-muted);text-wrap:pretty}
.mc-actions {display:flex;gap:.75rem;flex-wrap:wrap;margin-top:1.5rem}
.mc-evidence {background:var(--raised);border:1px solid var(--hairline);border-radius:var(--radius-card);padding:2rem}
.mc-evidence ol {padding:0;margin:0;list-style:none;counter-reset:steps}
.mc-evidence li {counter-increment:steps;padding:1rem 0;border-top:1px solid var(--hairline);display:grid;grid-template-columns:2rem 1fr;gap:1rem}
.mc-evidence li:before {content:counter(steps,decimal-leading-zero);color:var(--accent);font-variant-numeric:tabular-nums}
.mc-evidence p {margin:.25rem 0;color:var(--text-muted)}
.mc-value-row {display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:2rem;font-size:var(--type-meta)}
.mc-value-row strong {display:block;font-size:1rem;margin-bottom:.25rem}
.mc-section {padding-block:3rem;border-top:1px solid var(--hairline)}
.mc-section-heading {display:flex;justify-content:space-between;align-items:baseline;gap:1.5rem;flex-wrap:wrap}
.mc-steps {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2rem;padding:0;list-style:none;counter-reset:journey}
.mc-steps li {counter-increment:journey;border-left:1px solid var(--hairline);padding-left:1.5rem}
.mc-steps li:before {content:counter(journey,decimal-leading-zero);display:block;color:var(--accent);font-variant-numeric:tabular-nums;margin-bottom:1rem}
.mc-steps p,.mc-resources p {color:var(--text-muted);margin:0;max-width:var(--reading-measure)}
.mc-resources {display:grid;grid-template-columns:1fr 1fr;gap:3rem}
.mc-resource-list {list-style:none;margin:0;padding:0}
.mc-resource-list li {border-bottom:1px solid var(--hairline);padding:1rem 0}
.mc-resource-list a {color:var(--accent)}
.mc-signin {border-top:1px solid var(--hairline);padding-block:3rem;display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:start}
.mc-signin>div {min-width:0}
.mc-signin[hidden] {display:none}
.mc-signin>div:last-child {display:flex;justify-content:center}
.mc-auth-page{min-height:100vh;display:flex;flex-direction:column;background:var(--canvas);color:var(--text-body)}
.mc-auth-header{width:100%;box-sizing:border-box;max-width:none;padding-inline:max(1.25rem,calc((100vw - var(--layout-wide))/2 + 2rem))}
.mc-auth-header nav{display:flex;gap:1.5rem;align-items:center;margin-left:auto}
.mc-auth-main{flex:1;display:grid;place-items:center;padding:4rem 1.25rem}
.mc-auth-card{width:min(100%,26rem)!important;max-width:26rem!important;padding:2rem!important;border-radius:var(--radius-card)!important}
.mc-auth-intro{text-align:center;margin-bottom:1.5rem}
.mc-auth-intro .mc-eyebrow{margin-bottom:.5rem}
.mc-auth-intro .mc-auth-title{font:500 var(--type-page)/1.15 var(--font-serif);letter-spacing:-.035em;margin:0 0 .5rem;color:var(--text-heading)}
.mc-auth-intro p:last-child{margin:0;color:var(--text-muted);font-size:.9375rem}
.mc-auth-card [role="group"]{border-bottom:1px solid var(--hairline);padding-bottom:1rem}
.mc-auth-card [role="group"] button{border:0!important;border-bottom:2px solid transparent!important;border-radius:0!important;background:transparent!important;color:var(--text-muted)!important;font-weight:600!important}
.mc-auth-card [role="group"] button:first-child[aria-pressed="true"],.mc-auth-card [role="group"] button:last-child[aria-pressed="true"]{border-bottom-color:var(--accent)!important;color:var(--text-heading)!important}
.mc-auth-card input{min-height:var(--control-height)}
.mc-auth-card button[type="submit"]{border-radius:var(--radius-control);font-weight:600}
.mc-public .track-grid {grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr));gap:1rem}
.mc-public .track-tile {background:var(--card);padding:1.5rem;min-height:12rem;border-radius:var(--radius-card);animation:none}
.mc-public .track-tile h3 {font-size:1.125rem}
.mc-public .track-tile p {font-size:1rem;line-height:1.5;display:block;-webkit-line-clamp:unset;overflow:visible}
.mc-public .track-tile-guest-button {font-size:var(--type-meta);min-height:var(--control-height)}
.mc-public .brand-lockup {background:none;padding:0;display:inline-flex;border-radius:0}
.mc-public .brand-lockup img {width:100%;height:auto}
.mc-shell-context {display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;margin-bottom:1.5rem}
.mc-shell-context strong {font-size:var(--type-body)}
.mc-brand-image{display:inline-block;vertical-align:middle;line-height:0}
.mc-brand-image img{width:100%;height:auto}
.mc-brand-image .mc-art-light{display:none}
:root[data-theme="light"] .mc-brand-image .mc-art-light{display:block}
:root[data-theme="light"] .mc-brand-image .mc-art-dark{display:none}
@media(prefers-color-scheme:light){:root:not([data-theme]) .mc-brand-image .mc-art-light{display:block}:root:not([data-theme]) .mc-brand-image .mc-art-dark{display:none}}
.mc-hero-visual{position:relative;min-width:0;border-radius:var(--radius-card);overflow:hidden;background:var(--raised)}
.mc-hero-visual>img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.mc-hero-visual>.mc-art-light{display:none}
.mc-hero-note{position:absolute;right:1.5rem;bottom:1.5rem;max-width:16rem;padding:1rem;background:var(--card);border:1px solid var(--hairline);border-radius:var(--radius-control)}
.mc-hero-note p{font-size:var(--type-meta);margin:.5rem 0 0;color:var(--text-muted)}
/* Existing branded navigation is an inverse surface in both document themes. */
.brand-chrome .mc-brand-image .mc-art-light{display:none!important}
.brand-chrome .mc-brand-image .mc-art-dark{display:block!important}
:root[data-theme="light"] .mc-art-dark{display:none}
:root[data-theme="light"] .mc-art-light{display:block}
@media(prefers-color-scheme:light){:root:not([data-theme]) .mc-art-dark{display:none}:root:not([data-theme]) .mc-art-light{display:block}}
@media(max-width:959px){.mc-public-header{gap:1rem}.mc-menu-toggle{display:block;margin-left:auto}.mc-public-header nav{display:none;order:3;width:100%;flex-wrap:wrap;margin:0}.mc-public-header nav[data-open="true"]{display:flex}.mc-hero{gap:2rem}.mc-steps{grid-template-columns:repeat(2,minmax(0,1fr))}.mc-header-utilities{margin-left:auto}}
@media(max-width:639px){.mc-container,.mc-public-header{padding-inline:1.25rem}.mc-hero{grid-template-columns:1fr;padding-block:2.5rem}.mc-evidence{padding:1.5rem}.mc-header-utilities{width:100%;justify-content:space-between}.mc-resources,.mc-signin{grid-template-columns:1fr;gap:1.5rem}.mc-steps{gap:1.5rem}.mc-value-row{gap:.75rem}.mc-section{padding-block:2rem}.mc-auth-main{padding:2rem 1rem}.mc-auth-header{flex-wrap:wrap}.mc-auth-header nav{order:3;width:100%;margin-left:0;justify-content:center;gap:1rem}.mc-auth-header .mc-header-utilities{margin-left:auto;width:auto}}
@media(prefers-reduced-motion:reduce){.mc-public *{animation:none!important;scroll-behavior:auto!important;transition:none!important}}
/* Shared layout boundaries: compact <640, medium <960, wide <1280 CSS px. */
@media(max-width:1279px){.mc-hero{gap:3rem}}
@media(max-width:959px){.mc-hero{gap:2rem}}
@media(max-width:380px){.mc-my-mockcert-compact span{font-size:0}.mc-my-mockcert-compact span::after{content:"My";font-size:13px}.mobile-only .mc-brand-image{max-width:124px!important}}
@media(max-width:959px){.mc-hero-note{position:static;max-width:none;border:0;border-top:1px solid var(--hairline);border-radius:0}}
@media(max-width:639px){.mc-hero-note{position:static;max-width:none;border:0;border-top:1px solid var(--hairline);border-radius:0}.mc-steps{grid-template-columns:1fr}}
/* MC-081 Reference 13 refinement: layered landscapes, compact catalog and section rhythm. */
.mc-icon{flex:none;vertical-align:middle;color:var(--icon-color)}
.mc-public-header{width:100%;box-sizing:border-box;max-width:90rem;gap:1.25rem;padding-block:.5rem;flex-wrap:nowrap}
.mc-public-header nav{gap:1.25rem;font-size:.9375rem}
.mc-public-header nav a{padding-block:.5rem;white-space:nowrap}
.mc-header-utilities{gap:.75rem}
.mc-header-utilities .mc-theme-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.mc-signin-link{display:inline-flex;align-items:center;gap:.375rem;min-height:var(--control-height);background:none;border:0;color:var(--text-body);font:inherit;white-space:nowrap;cursor:pointer}
.mc-header-cta{padding-inline:1rem;white-space:nowrap}
.mc-hero-scene{position:relative;isolation:isolate;overflow:hidden;background:var(--canvas)}
.mc-landscape{display:block;pointer-events:none}
.mc-landscape img{display:block;width:100%;height:100%;object-fit:cover}
.mc-landscape-hero{position:absolute;z-index:-1;inset:0;opacity:.6;mask-image:linear-gradient(90deg,transparent 22%,#000 70%)}
.mc-landscape-hero img{object-position:center 62%}
.mc-hero{min-height:38rem;display:block;padding-block:4rem}
.mc-hero-copy{width:47%;max-width:36rem}
.mc-public h1{font-size:var(--type-page);line-height:1.15;letter-spacing:-.02em;margin-bottom:1rem}
.mc-hero-copy h1{font-size:var(--type-display);line-height:1.1;letter-spacing:-.045em;margin-bottom:1.5rem}
.mc-hero .mc-lede{max-width:39ch}
.mc-value-row{margin-top:2.5rem;gap:1.25rem}
.mc-value-row>div{display:flex;gap:.625rem;align-items:flex-start}
.mc-value-row .mc-icon{margin-top:.25rem}
.mc-value-row span{display:block;color:var(--text-muted);max-width:none}
.mc-hero-note{position:absolute;right:1.5rem;bottom:2.5rem;width:13.75rem;max-width:none;background:var(--card);border:1px solid var(--hairline);border-radius:var(--radius-control);padding:1.25rem;box-sizing:border-box}
.mc-hero-note>div{display:flex;gap:.75rem;align-items:flex-start}
.mc-hero-note>div+div{margin-top:1.5rem}
.mc-hero-note strong{font-size:.9375rem}
.mc-hero-note p{margin:.25rem 0 0;line-height:1.4}
.mc-section{border-top:0;padding-block:3.25rem}
.mc-section-heading{align-items:center;margin-bottom:1.5rem}
.mc-section-heading h2{margin-bottom:0}
.mc-section-heading>a,.mc-text-link{display:inline-flex;align-items:center;gap:.5rem;min-height:var(--control-height);font-size:.9375rem}
.mc-section-heading>p{color:var(--text-muted);margin:0;font-size:1rem}
.mc-public .track-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin:0}
.mc-catalog-card,.mc-catalog-explore{display:flex;flex-direction:column;min-width:0;list-style:none;padding:1.5rem;background:var(--card);border:1px solid var(--hairline);border-radius:var(--radius-card)}
/* A soft lift under cards in light theme (--card-shadow is none in dark). */
.mc-catalog-card,.mc-catalog-explore,.ls-card,.pricing-card,.track-domain-card,.mc-verification-feature{box-shadow:var(--card-shadow)}.mc-catalog-vendor{display:flex;align-items:center;gap:.75rem;color:var(--text-muted);font-size:.875rem;margin-bottom:1.25rem}
.mc-catalog-vendor .mc-icon{width:24px;height:24px}
.mc-public .mc-catalog-card h3{font-size:1.125rem;max-width:30ch}
.mc-catalog-code{font-size:.875rem;color:var(--text-muted);margin:.125rem 0 .75rem}
/* Owner, 2026-09-29: the exam code sits next to the certification name everywhere it is named. */
.mc-code-chip{display:inline-block;margin-left:.5rem;vertical-align:middle;font:500 .75rem/1.4 var(--font-mono);letter-spacing:0;color:var(--text-muted);border:1px solid var(--hairline);border-radius:var(--radius-badge);padding:1px 7px;white-space:nowrap}
.mc-catalog-tags{display:flex;gap:.375rem;flex-wrap:wrap;margin-top:auto;padding-top:.75rem}
.mc-catalog-tags span{border-radius:var(--radius-badge);padding:.125rem .5rem;background:var(--raised);font-size:.8125rem;color:var(--text-muted)}
.mc-catalog-actions{margin-top:1rem;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.25rem .75rem;border-top:1px solid var(--hairline);padding-top:.5rem}
.mc-catalog-actions a{display:flex;align-items:center;gap:.375rem;min-height:var(--control-height);font-weight:600;font-size:.9375rem}
.mc-catalog-actions button{border:0;background:none;color:var(--text-muted);font:inherit;font-size:.875rem;text-decoration:none;font-weight:600;min-height:var(--control-height);padding:0;cursor:pointer}
.mc-catalog-actions button:disabled{cursor:wait}
.mc-catalog-explore{background:var(--raised);justify-content:center;align-items:flex-start}
.mc-catalog-explore>svg{margin-bottom:1rem}
.mc-catalog-explore p{max-width:29ch;font-size:.9375rem;color:var(--text-muted);margin:.25rem 0 1rem}
.mc-catalog-explore h3 a{display:inline-flex;align-items:center;gap:.5rem;min-height:var(--control-height);font-weight:600}
.mc-how{padding-top:1.5rem}
.mc-steps{margin:2rem 0 0;gap:1.5rem}
.mc-steps li{padding-left:1.5rem;position:relative}
.mc-steps li:first-child{border-left:0;padding-left:0}
.mc-steps li:before{content:none}
.mc-step-top{display:flex;align-items:center;gap:1.5rem;margin-bottom:1rem}
.mc-step-top span{display:grid;place-items:center;width:2.25rem;height:2.25rem;border-radius:50%;background:var(--raised);color:var(--accent);font-weight:600}
.mc-steps p{font-size:1rem;max-width:25ch}
/* Issue #671: the capability artwork now sits behind "How MockCert works" (the section that
   restated these steps was removed). */
.mc-how-scene{position:relative;isolation:isolate;overflow:hidden;background:var(--raised)}
/* Step copy sits directly over the artwork here (unlike the old split layout): light theme uses a
   lighter wash than the hero's .42, and the step descriptions use body text rather than muted text,
   which keeps them above WCAG AA (4.5:1) against the darkest part of the artwork in both themes. */
.mc-how-scene .mc-steps p{color:var(--text-body)}
:root[data-theme="light"] .mc-how-scene .mc-landscape-capability{opacity:.26}
@media(prefers-color-scheme:light){:root:not([data-theme]) .mc-how-scene .mc-landscape-capability{opacity:.26}}
.mc-landscape-capability{position:absolute;inset:0;z-index:-1;opacity:.18;mask-image:linear-gradient(90deg,#000,transparent 88%)}
.mc-trust-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.mc-trust-grid article{background:var(--card);border:1px solid var(--hairline);border-radius:var(--radius-card);padding:1.5rem}
.mc-trust-grid article>svg{margin-bottom:1rem}
.mc-trust-grid p{font-size:1rem;color:var(--text-muted);margin:.75rem 0 0}
.mc-resources{padding-top:1rem;padding-bottom:3.25rem;align-items:start}
.mc-resource-list a{display:flex;gap:.75rem;align-items:center;min-height:var(--control-height);text-decoration:none}
.mc-resource-list a span{flex:1}
.mc-text-link{margin-top:1rem}
.mc-closing{background:var(--brand-surface);color:var(--brand-on-surface);padding-block:3rem;border-block:1px solid var(--brand-surface-line)}
.mc-closing>.mc-container{display:flex;justify-content:space-between;align-items:center;gap:2rem}
.mc-closing h2{margin-bottom:.5rem;color:var(--brand-on-surface)}
.mc-closing p{margin:0;color:var(--brand-on-surface-muted)}
.mc-closing .mc-eyebrow{margin-bottom:1rem}
.mc-closing .mc-button{background:var(--brand-on-surface);border-color:var(--brand-on-surface);color:var(--brand-surface)}
.mc-closing .mc-icon{color:inherit}
.mc-closing>div>div:last-child{display:grid;justify-items:center;gap:.75rem}
.mc-closing a{color:var(--brand-on-surface);min-height:var(--control-height);display:inline-flex;align-items:center}
.mc-home-footer{background:var(--card);padding-block:3rem 1.5rem;color:var(--text-muted)}
.mc-footer-grid{display:grid;grid-template-columns:1.7fr repeat(4,1fr);gap:2rem}
.mc-footer-brand p{font-size:.9375rem;max-width:28ch}
.mc-home-footer h2{font:600 1rem/1.4 var(--font-sans);margin:0 0 .75rem;color:var(--text-body)}
.mc-home-footer nav a{display:flex;align-items:center;gap:.375rem;min-height:32px;padding-block:.25rem;color:var(--text-muted);text-decoration:none;font-size:.875rem}
.mc-home-footer a:hover{color:var(--accent)}
.mc-footer-bottom{display:flex;align-items:start;justify-content:space-between;gap:2rem;border-top:1px solid var(--hairline);margin-top:2rem;padding-top:1.5rem;font-size:.8125rem}
.mc-footer-bottom p{margin:0;max-width:64ch}
:root[data-theme="light"] .mc-landscape-hero{opacity:1}
:root[data-theme="light"] .mc-landscape-capability{opacity:.42}
@media(prefers-color-scheme:light){:root:not([data-theme]) .mc-landscape-hero{opacity:1}:root:not([data-theme]) .mc-landscape-capability{opacity:.42}}
@media(max-width:1279px){.mc-public-header{flex-wrap:wrap}.mc-public-header nav{gap:1rem}.mc-header-utilities{gap:.5rem}.mc-header-cta{display:none}.mc-hero-copy{width:50%}.mc-hero-note{width:12rem;right:1rem;font-size:.875rem}.mc-footer-grid{gap:1.5rem;grid-template-columns:1.5fr repeat(4,1fr)}}
@media(max-width:959px){.mc-public-header{flex-wrap:wrap}.mc-menu-toggle{display:flex;align-items:center;gap:.5rem}.mc-public-header nav{order:3}.mc-header-utilities{margin-left:0}.mc-hero{min-height:36rem;padding-block:3rem}.mc-hero-copy{width:65%}.mc-hero-note{position:relative;right:auto;bottom:auto;width:auto;display:flex;gap:1rem;margin-top:2rem;padding:1rem;background:var(--card);border:1px solid var(--hairline)}.mc-hero-note>div{flex:1}.mc-hero-note>div+div{margin:0}.mc-hero-note>div:nth-child(3){display:none}.mc-public .track-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mc-catalog-explore{grid-column:1/-1;display:grid;grid-template-columns:auto 1fr auto;gap:0 1rem;align-items:center}.mc-catalog-explore>svg{grid-row:1/3;margin:0}.mc-catalog-explore p{grid-column:2;margin:0;max-width:none}.mc-catalog-explore a{grid-column:3;grid-row:1/3}.mc-footer-grid{grid-template-columns:repeat(4,1fr)}.mc-footer-brand{grid-column:1/-1}.mc-footer-brand p{max-width:none}.mc-landscape-hero{mask-image:linear-gradient(90deg,transparent 30%,#000 100%)}.mc-steps{grid-template-columns:repeat(2,minmax(0,1fr))}.mc-steps li:nth-child(3){padding-left:0;border-left:0}}
@media(max-width:639px){.mc-public-header{gap:.5rem 1rem}.mc-header-utilities{width:100%;justify-content:space-between}.mc-header-cta{display:inline-flex}.mc-signin-link .mc-icon{display:none}.mc-header-cta{padding-inline:.75rem;font-size:.875rem}.mc-hero{padding-block:2.5rem;min-height:0}.mc-hero-copy{width:100%;max-width:none}.mc-public h1{font-size:2rem;max-width:100%}.mc-hero .mc-lede{font-size:1.0625rem;max-width:32ch}.mc-value-row{margin-top:2rem;gap:.75rem}.mc-value-row>div{display:block}.mc-value-row .mc-icon{margin-bottom:.5rem}.mc-hero .mc-actions{gap:.5rem}.mc-hero .mc-button{font-size:.9375rem;padding-inline:.875rem}.mc-hero .mc-button-secondary{background:var(--canvas)}.mc-landscape-hero{position:absolute;inset:0 0 auto;height:32rem;mask-image:linear-gradient(#000 55%,transparent);margin:0}.mc-landscape-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,color-mix(in srgb,var(--canvas) 92%,transparent),color-mix(in srgb,var(--canvas) 62%,transparent) 55%,color-mix(in srgb,var(--canvas) 22%,transparent))}.mc-hero-scene{display:block}.mc-landscape-hero img{object-position:72% 50%}.mc-hero-note{margin-top:2rem;padding:1rem;gap:1rem;position:relative;z-index:1}.mc-hero-note>div{gap:.5rem}.mc-hero-note strong{font-size:.875rem}.mc-hero-note p{font-size:.8125rem}.mc-hero-note .mc-icon{width:20px;height:20px}.mc-section{padding-block:2.5rem}.mc-section-heading{gap:.5rem;margin-bottom:1.25rem}.mc-public .track-grid{grid-template-columns:1fr}.mc-catalog-card,.mc-catalog-explore{padding:1.25rem}.mc-catalog-explore{display:flex;gap:0;align-items:flex-start}.mc-catalog-explore>svg{margin-bottom:.75rem}.mc-catalog-explore p{margin:.25rem 0 .5rem}.mc-catalog-vendor{margin-bottom:1rem}.mc-how{padding-top:.5rem}.mc-steps{grid-template-columns:1fr;gap:1.5rem}.mc-steps li,.mc-steps li:first-child,.mc-steps li:nth-child(3){padding:0 0 0 4rem;border:0}.mc-step-top{position:absolute;left:0;top:0;display:grid;gap:.5rem;justify-items:center}.mc-steps li{min-height:6rem}.mc-steps h3{padding-top:.25rem}.mc-steps p{max-width:none}.mc-landscape-capability{mask-image:linear-gradient(0deg,#000,transparent 90%);opacity:.15}.mc-trust-grid{grid-template-columns:1fr}.mc-trust-grid article{padding:1.25rem}.mc-resources{grid-template-columns:1fr;gap:1.5rem;padding-top:.5rem}.mc-closing>.mc-container{display:block}.mc-closing>div>div:last-child{justify-items:start;margin-top:1.5rem}.mc-footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.75rem 1rem}.mc-footer-brand{grid-column:1/-1}.mc-footer-bottom{display:block}.mc-footer-bottom p+p{margin-top:1rem}.mc-home-footer{padding-top:2.5rem}.mc-home-footer nav a{min-height:36px}.mc-home-footer nav a .mc-icon{display:none}}
.mc-account-benefits{list-style:none;padding:0;margin:1.5rem 0;display:grid;gap:1rem;color:var(--text-muted)}
.mc-account-benefits li{display:flex;gap:.75rem;align-items:flex-start}
/* Step indices are quiet wayfinding; larger editorial icons carry recognition. */
.mc-step-top{gap:1rem;align-items:flex-start;min-height:2rem}
.mc-step-top span{width:auto;height:auto;min-width:1.25rem;padding-top:.125rem;background:none;border-radius:0;font-size:.75rem;line-height:1.5;letter-spacing:.08em;color:var(--text-muted);font-weight:600}
.mc-step-top .mc-icon{width:32px;height:32px}
@media(max-width:639px){.mc-step-top{gap:.375rem;align-items:center}.mc-step-top span{padding:0}}
.mc-pricing-note{font-size:.9375rem;color:var(--text-muted);margin:1.25rem 0 0;scroll-margin-top:1.5rem}
.mc-pricing-note strong{color:var(--text-body)}

/* Header utilities are secondary to the account creation action. */
.mc-header-utilities .mc-signin-link{font-size:.9375rem;padding:.5rem;min-height:var(--control-height)}
.mc-header-utilities .mc-header-cta{min-height:var(--control-height-compact);padding:.375rem 1rem;font-size:var(--control-font)}

/* Owner homepage simplification: shared type, direct catalog links, verification feature. */
.mc-value-row strong{font-family:var(--font-sans);font-size:1rem;font-weight:600;letter-spacing:normal;line-height:1.5}
/* The name, exam code and arrow flow as one line that wraps naturally (a flex row left the code and
   arrow floating mid-card when a long name wrapped), and the link covers the whole card. */
.mc-catalog-card{position:relative}
.mc-catalog-title{display:block;min-height:var(--control-height);padding-block:.375rem;color:var(--text-heading);text-decoration:none}
.mc-catalog-title .mc-code-chip{margin-left:.5rem}
.mc-catalog-title>.mc-icon{margin-left:.375rem;vertical-align:-4px}
a.mc-catalog-title::after{content:"";position:absolute;inset:0;border-radius:var(--radius-card)}
.mc-catalog-card:has(a.mc-catalog-title:hover){border-color:var(--accent)}
.mc-catalog-title:hover{color:var(--accent)}.mc-catalog-title--soon:hover{color:var(--text-heading)}
.mc-catalog-title .mc-icon{flex-shrink:0;color:var(--accent)}
.mc-verification-feature{display:flex;align-items:center;gap:2rem;padding:2rem;border:1px solid var(--hairline);border-radius:var(--radius-card);background:var(--card)}
.mc-verification-feature>svg{flex-shrink:0;color:var(--accent)}
.mc-verification-feature>div{flex:1}
.mc-verification-feature h2{font-size:var(--type-section);margin:0 0 .75rem}
.mc-verification-feature p{margin:.5rem 0;color:var(--text-muted)}
.mc-verification-feature .mc-eyebrow{margin:0 0 .5rem}
.mc-verification-feature .mc-verification-note{font-size:.875rem}
.mc-verification-feature>a{flex-shrink:0}
@media(min-width:1280px){.mc-hero-copy{width:55%;max-width:42rem}.mc-hero .mc-lede{max-width:none}.mc-hero .mc-lede span{display:block}.mc-footer-bottom p:last-child{max-width:88ch;flex:0 1 88ch}}
@media(max-width:959px){.mc-verification-feature{flex-wrap:wrap;gap:1rem}.mc-verification-feature>div{flex-basis:calc(100% - 4rem)}.mc-verification-feature>a{margin-left:3.5rem}}
@media(max-width:639px){.mc-verification-feature{padding:1.25rem}.mc-verification-feature>div{flex-basis:100%}.mc-verification-feature>a{margin-left:0}}

/* Approved two-line hero statement, including mobile. */
.mc-hero .mc-lede span{display:block}

/* Shared public footer and closing CTA own their typography in every page shell. */
.mc-public .mc-home-footer{font:400 1rem/1.5 var(--font-sans)}
.mc-public .mc-home-footer h2{font:600 1rem/1.4 var(--font-sans);letter-spacing:normal;margin:0 0 .75rem}
.mc-public .mc-footer-brand p{margin:.9375rem 0;font-size:.9375rem}
.mc-public .mc-footer-bottom p{margin:0}
.mc-public .mc-closing .mc-button{background:var(--brand-on-surface);border-color:var(--brand-on-surface);color:var(--brand-surface)}
.mc-public.track-hub>main{max-width:var(--layout-wide);margin:0 auto;padding-inline:2rem}.mc-public .guide-index-content,.mc-public .faq-page-content{max-width:none;padding-block:2rem 5rem}.mc-public .guide-index-content table{margin-top:1.5rem}.mc-public .faq-page-content dl{margin:2rem 0}.mc-public .faq-page-content dt{font:600 1.125rem/1.4 var(--font-sans);margin-top:1.5rem}.mc-public .faq-page-content dd{margin:.5rem 0 0;color:var(--text-muted);max-width:var(--measure-lede)}
/* Issue #708: legal and information pages (pipeline/src/write/readingLayout.ts). Title across the
   full width; with a contents rail, the rail on the left and the text beside it (the documentation
   pattern: one block, no empty band between them); otherwise one centred column. Reading text is
   17px in a 46rem column, about 75 characters a line. */
.mc-public .legal-page,.mc-public .static-reading-page{max-width:none}
.mc-public .mc-reading{padding-block:3rem 5rem}
.mc-public .mc-reading-head{padding-bottom:1.5rem;margin-bottom:2rem;border-bottom:1px solid var(--hairline)}
.mc-public .mc-reading-head h1{max-width:none;margin-bottom:.5rem}
.mc-public .mc-reading-head .lede{margin:0;color:var(--text-muted)}
.mc-public .mc-reading-body{max-width:46rem;min-width:0;font-size:1.0625rem;line-height:1.7}
.mc-public .mc-reading-body>:first-child{margin-top:0}
.mc-public .mc-reading--single .mc-reading-head,.mc-public .mc-reading--single .mc-reading-body{max-width:46rem;margin-inline:auto}
.mc-public .mc-reading-grid{display:grid;grid-template-columns:minmax(12rem,15rem) minmax(0,46rem);grid-template-areas:"toc body";justify-content:start;column-gap:clamp(2.5rem,5vw,5rem);align-items:start}
.mc-public .mc-reading-grid>.mc-reading-body{grid-area:body}
.mc-public .mc-reading-toc{grid-area:toc;position:sticky;top:1.5rem;max-height:calc(100vh - 3rem);overflow:auto;font-size:var(--type-meta)}
.mc-public .mc-reading-toc summary{list-style:none;font:600 .75rem/1.4 var(--font-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--text-dim);margin-bottom:.75rem}
.mc-public .mc-reading-toc summary::-webkit-details-marker{display:none}
.mc-public .mc-reading-toc ol{list-style:none;margin:0;padding:0 0 0 .25rem;border-left:1px solid var(--hairline)}
.mc-public .mc-reading-toc a{display:block;padding:.375rem .75rem;margin-left:-1px;border-left:2px solid transparent;color:var(--text-muted);line-height:1.4}
.mc-public .mc-reading-toc a:hover{color:var(--text-heading)}
.mc-public .mc-reading-toc a[aria-current="true"]{color:var(--text-heading);font-weight:600;border-left-color:var(--accent)}
.mc-public .mc-reading-body h2{scroll-margin-top:1.5rem}
@media(min-width:960px){.mc-public .mc-reading-toc summary{pointer-events:none}}
@media(max-width:959px){
  .mc-public .mc-reading{padding-block:2rem 4rem}
  .mc-public .mc-reading-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"toc" "body"}
  .mc-public .mc-reading-toc{position:static;max-height:none;margin-bottom:1.5rem;padding:.75rem 1rem;border:1px solid var(--hairline);border-radius:var(--radius-control)}
  .mc-public .mc-reading-toc summary{margin:0;cursor:pointer;list-style:revert}
  .mc-public .mc-reading-toc details[open] summary{margin-bottom:.75rem}
}
.mc-public .catalog-hero{padding-top:3rem}
.mc-public-page-frame{min-height:100vh;background:var(--canvas);color:var(--text-body);display:flex;flex-direction:column}.mc-public-page-main{flex:1}
.mc-public .mc-closing .mc-button .mc-icon{color:inherit}
.mc-auth-dialog{width:min(26rem,calc(100vw - 2rem));max-height:calc(100dvh - 2rem);overflow:auto;border:0;padding:0;background:transparent;color:var(--text-body)}
.mc-auth-dialog::backdrop{background:rgb(0 0 0 / .55)}
/* Issue #661 purchase flow: same dialog frame, but a raised surface and room for a mock list. */
.mc-purchase-dialog{width:min(34rem,calc(100vw - 2rem));background:var(--raised);border:1px solid var(--hairline);border-radius:var(--radius-card)}
.mc-auth-dialog .mc-auth-card{width:100%!important;max-width:100%;box-sizing:border-box}
.mc-auth-dialog{position:fixed}
/* Visible close control for input dialogs (issue #677). */
.mc-dialog-close{position:absolute;top:.5rem;right:.5rem;z-index:1;display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:var(--radius-control);background:transparent;color:var(--text-muted);cursor:pointer}
.mc-dialog-close:hover{background:var(--surface-subtle);color:var(--text-heading)}
.mc-dialog-close:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
#public-account{display:flex;align-items:center;gap:1rem}
@media(max-width:639px){.mc-public.track-hub>main{padding-inline:1.25rem}.mc-public .mc-footer-bottom p+p{margin-top:1rem}}

/* Keep discovery close to its search field and the product cues at the outer edge of the hero. */
.mc-home-hero{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(14rem,.65fr);column-gap:clamp(2rem,5vw,5rem);align-items:center;min-height:0;padding-block:3rem 1.5rem}
.mc-home-hero .mc-hero-copy{width:100%;max-width:none}
.mc-home-hero .mc-home-search{width:100%;margin-top:1.5rem}
.mc-home-hero .mc-value-row{display:grid;grid-template-columns:1fr;gap:1.5rem;justify-self:end;width:min(100%,19rem);margin:0}
.mc-home-hero .mc-value-row>div{display:flex;gap:.85rem;align-items:flex-start}
.mc-home-hero .mc-value-row .mc-icon{width:24px;height:24px;margin:.12rem 0 0}
.mc-home-hero .mc-value-row span{line-height:1.45}
.mc-discovery{padding-top:1rem}
.mc-discovery .mc-catalog-card,.mc-discovery .mc-catalog-explore{padding:1rem 1.25rem}
.mc-discovery .mc-catalog-vendor{margin-bottom:.5rem}
.mc-discovery .mc-catalog-code{margin:.125rem 0 .375rem}
.mc-discovery .mc-catalog-tags{padding-top:.5rem}
.mc-discovery .mc-catalog-explore>svg{margin-bottom:.375rem}
.mc-discovery .mc-catalog-explore p{margin:.125rem 0 0}
.mc-account-main{width:min(100% - 2.5rem,60rem);margin:0 auto;padding:3rem 0;flex:1}
.mc-public:is([data-shell="account"],[data-shell="learner-overview"]){min-height:100vh;display:flex;flex-direction:column}
.mc-public[data-shell="learner-overview"]>main{flex:1}
@media(min-width:960px){
  /* In the hero grid's right column, not pinned to the full-width artwork: its right edge then
     lines up with the page content below (owner report, 2026-09-27). */
  .mc-home-hero .mc-value-row{position:relative;z-index:1;width:max-content}
  .mc-landscape-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 55%,color-mix(in srgb,var(--canvas) 72%,transparent) 78%,color-mix(in srgb,var(--canvas) 82%,transparent))}
}
@media(max-width:959px){
  .mc-home-hero{grid-template-columns:1fr;gap:1.5rem;padding-block:2.5rem 1.5rem}
  .mc-home-hero .mc-hero-copy{max-width:42rem}
  .mc-home-hero .mc-value-row{grid-template-columns:repeat(3,minmax(0,1fr));justify-self:stretch;width:100%;padding-top:1rem;border-top:1px solid var(--hairline);gap:1rem}
}
@media(max-width:639px){
  .mc-account-mobile-only{display:block!important}
  .mc-home-hero{gap:1.25rem;padding-block:2rem 1rem}
  .mc-home-hero .mc-home-search{margin-top:1.25rem}
  .mc-home-hero .mc-value-row{gap:.5rem}
  .mc-home-hero .mc-value-row>div{display:flex;flex-direction:column;gap:.35rem}
  .mc-home-hero .mc-value-row .mc-icon{margin:0}
  .mc-home-hero .mc-value-row strong{font-size:.875rem}
  .mc-home-hero .mc-value-row span{display:none}
  .mc-discovery{padding-top:1rem}
}

/* At phone widths, keep brand, account action and menu on one row. */
.mc-mobile-login,.mc-mobile-workspace,.mc-mobile-theme,.mc-account-mobile-public-nav{display:none}
@media(max-width:639px){
  .mc-public-header{position:relative;z-index:20;display:flex;flex-wrap:nowrap;gap:.25rem;min-height:64px;padding:.625rem .75rem}
  .mc-public-header>a:first-child{flex:0 1 auto;min-width:0;margin-right:auto;line-height:0}
  .mc-public-header>a:first-child .mc-brand-image{width:clamp(112px,31vw,132px)!important}
  .track-hub .mc-public-header>a:first-child img{width:clamp(112px,31vw,132px)!important;height:auto}
  .mc-public-header .mc-header-utilities{order:1;flex:0 0 auto;width:auto;margin:0;gap:.125rem;justify-content:flex-end}
  .track-hub .mc-public-header .mc-header-utilities{width:auto;margin:0}
  .mc-public-header .mc-header-utilities>.mc-theme-toggle,
  .mc-public-header .mc-desktop-theme{display:none}
  .mc-public-header .mc-header-utilities>.mc-my-mockcert-link,
  .mc-public-header #public-account>.mc-my-mockcert-link{display:none}
  .mc-public-header .mc-account-trigger{width:auto;max-width:10rem!important;padding:4px 8px!important;justify-content:center}
  .mc-public-header #public-account{gap:.125rem}
  .mc-public-header .mc-header-utilities .mc-signin-link{display:none}
  .mc-public-header .mc-header-cta{display:inline-flex;min-height:var(--control-height-compact);padding:.5rem .625rem;font-size:.875rem}
  .mc-public-header .mc-menu-toggle,
  .track-hub .track-mobile-menu{order:2;flex:0 0 44px;margin:0}
  .mc-public-header[data-authenticated="true"] .mc-menu-toggle,
  .track-hub .mc-public-header .track-mobile-menu[hidden]{display:none!important}
  .mc-public-header .mc-menu-toggle,
  .track-hub .track-mobile-menu>summary{display:flex;align-items:center;justify-content:center;width:44px;height:44px;min-height:var(--control-height);padding:0;border:0;border-radius:var(--radius-control);background:transparent;color:var(--text-body);cursor:pointer;list-style:none}
  .track-hub .mc-public-header .track-mobile-menu{position:static;margin:0}
  .track-hub .track-mobile-menu>summary::-webkit-details-marker{display:none}
  .mc-public-header .mc-menu-label{display:none}
  .mc-public-header nav,
  .track-hub .mc-public-header .track-mobile-menu nav{position:absolute;z-index:30;top:calc(100% - 1px);left:auto;right:.75rem;width:min(15rem,calc(100vw - 1.5rem));min-width:0;box-sizing:border-box;margin:0;padding:.5rem;background:var(--card);border:1px solid var(--hairline);border-radius:var(--radius-control);box-shadow:0 14px 32px rgb(0 0 0 / .18);flex-direction:column;align-items:stretch;gap:0}
  .mc-public-header nav[data-open="true"],.track-hub .track-mobile-menu[open] nav{display:flex}
  .track-hub .track-mobile-menu:not([open]) nav{display:none!important}
  .mc-public-header nav a,.track-hub .track-mobile-menu nav a{display:flex;align-items:center;width:100%;min-height:var(--control-height);box-sizing:border-box;padding:.625rem .75rem;border-radius:var(--radius-control)}
  .mc-public-header nav .mc-mobile-login{display:flex;align-items:center;width:100%;min-height:var(--control-height);box-sizing:border-box;padding:.625rem .75rem;border:0;border-radius:var(--radius-control);background:transparent;color:var(--text-body);font:inherit;text-align:left;cursor:pointer}
  .mc-public-header nav a:hover,.track-hub .track-mobile-menu nav a:hover{background:var(--raised)}
  .mc-public-header nav .mc-mobile-login:hover{background:var(--raised)}
  .mc-public-header .mc-mobile-workspace{display:block}
  .mc-public-header .mc-mobile-workspace .mc-my-mockcert-link{justify-content:flex-start;border:0;color:var(--text-body)!important;font-weight:400}
  .mc-public-header .mc-mobile-account-link[hidden],.mc-public-header .mc-mobile-login[hidden]{display:none}
  .mc-public-header .mc-mobile-theme{display:block;margin-top:.25rem;padding-top:.25rem;border-top:1px solid var(--hairline)}
  .mc-public-header .mc-mobile-theme button{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:var(--control-height);padding:.625rem .75rem;border:0;background:transparent;color:var(--text-body);font:inherit;text-align:left;cursor:pointer}
  .mc-public-header .mc-mobile-theme button:hover{background:var(--raised)}
  .mc-account-trigger .mc-account-name-full,.mc-account-trigger .mc-account-chevron{display:none}
  .mc-account-trigger .mc-account-name-first{display:block;min-width:0;max-width:7rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.8125rem}
  .mc-home-hero .mc-value-row>div{align-items:center;justify-content:flex-start;text-align:center}
  .mc-home-hero .mc-value-row .mc-icon{margin:0 auto}
}
/* Issue #661: public Pricing page (SPA route). */
.pricing-page{max-width:1080px;margin:0 auto;padding:3rem 1rem 4rem}.pricing-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin:2rem 0 1rem;align-items:stretch}.pricing-card{position:relative;display:flex;flex-direction:column;padding:1.5rem;background:var(--raised);border:1px solid var(--hairline);border-radius:var(--radius-card)}.pricing-card{cursor:pointer}.pricing-card.is-unavailable{cursor:default;opacity:.8}.pricing-card.is-selected{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent),0 10px 28px rgb(0 0 0 / .08)}.pricing-badge{position:absolute;top:-.7rem;left:1.5rem;padding:.1rem .6rem;border-radius:999px;background:var(--accent);color:var(--on-action);font-size:.75rem;font-weight:650}.pricing-page .pricing-card h2{margin:0;font:600 1rem/1.3 var(--font-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}.pricing-price{display:flex;align-items:baseline;flex-wrap:wrap;gap:.25rem .6rem;margin:.4rem 0 .2rem;font-size:2rem;font-weight:650;color:var(--text-heading)}.pricing-price-note{font-size:.875rem;font-weight:500;color:var(--text-muted)}.pricing-summary{margin:0 0 .75rem}.pricing-includes{margin:.25rem 0 0;font-weight:600;color:var(--text-heading)}.pricing-card ul.pricing-points{list-style:none;margin:.25rem 0 1.5rem;padding:0;color:var(--text-body);flex:1}.pricing-points li{display:flex;align-items:flex-start;gap:.6rem;margin:.6rem 0;line-height:1.45}.pricing-points .mc-icon{flex:0 0 auto;margin-top:.1rem;padding:2px;border-radius:50%;background:var(--success-tint);color:var(--accent);box-sizing:content-box;width:16px;height:16px}.pricing-card .mc-button{align-self:stretch;text-align:center;margin-top:auto}.pricing-for{display:flex;align-items:flex-start;gap:1rem;margin:1.75rem 0 0;padding:1.25rem 1.5rem;background:var(--raised);border:1px solid var(--accent);border-left-width:4px;border-radius:var(--radius-card)}.pricing-for-icon{display:grid;place-items:center;flex:0 0 auto;width:48px;height:48px;border-radius:var(--radius-control);background:var(--success-tint);color:var(--accent)}.pricing-for-body{display:grid;gap:.35rem;flex:1;min-width:0}.pricing-for-label{font:600 var(--type-meta)/1.4 var(--font-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}.pricing-for select{width:100%;max-width:100%;min-height:var(--control-height);padding:0 2.5rem 0 .9rem;border:1px solid var(--border-control,var(--hairline));border-radius:var(--radius-control);background:var(--canvas);color:var(--text-heading);font:650 1rem/1.3 var(--font-sans);cursor:pointer}@supports (field-sizing:content){.pricing-for select{width:auto;field-sizing:content;min-width:min(100%,20rem)}}.pricing-for select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.pricing-for-name{font:650 1.25rem/1.3 var(--font-sans);color:var(--text-heading)}.pricing-for-scope{margin:.15rem 0 0;color:var(--text-body)}.pricing-fineprint{color:var(--text-muted);font-size:.9rem}.mc-button:disabled,.mc-button[disabled]{opacity:.55;cursor:not-allowed;pointer-events:none}.pricing-notice{display:flex;align-items:center;gap:.75rem;margin:1rem 0 0;padding:.9rem 1.25rem;background:var(--success-tint);border:1px solid var(--accent);border-left-width:4px;border-radius:var(--radius-card);color:var(--text-heading);font-weight:600}.pricing-notice .mc-icon{flex:0 0 auto;color:var(--accent)}@media (max-width:900px){.pricing-grid{grid-template-columns:1fr}.pricing-page{padding:2rem 1rem 3rem}}

/* Issue #661: AuthForm embedded in another surface (purchase dialog): no second card frame. */
.mc-auth-card.mc-auth-card-embedded{width:100%!important;max-width:100%!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
/* Issue #661 purchase dialog: one surface, clear hierarchy, no nested cards. */
.mc-purchase-body{padding:1.5rem}.mc-purchase-head{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1rem}.mc-purchase-head h2{margin:0;font-size:1.25rem;color:var(--text-heading)}.mc-purchase-head p{margin:.2rem 0 0;color:var(--text-muted);font-size:.875rem}.mc-purchase-close{min-width:44px;min-height:var(--control-height);margin:-.5rem -.5rem 0 0;border:0;background:transparent;color:var(--text-muted);font-size:1.5rem;line-height:1;cursor:pointer}.mc-purchase-options{display:grid;gap:.5rem;margin:0;padding:0;border:0}.mc-purchase-options label{display:flex;align-items:center;gap:.75rem;min-height:var(--control-height);padding:.6rem .85rem;border:1px solid var(--hairline);border-radius:var(--radius-control);cursor:pointer}.mc-purchase-options label:has(input:checked):not(.is-owned){border-color:var(--accent)}.mc-purchase-options label.is-owned{cursor:default;opacity:.7}.mc-purchase-options label.is-included{cursor:default}.mc-purchase-options label.mc-purchase-bundle-option{margin-bottom:.25rem;background:var(--success-tint);border-color:var(--accent)}.mc-purchase-bundle-option .mc-purchase-option-meta{color:var(--text-heading)}.mc-purchase-option-title{flex:1;color:var(--text-heading)}.mc-purchase-option-meta{color:var(--text-muted);font-size:.875rem}.mc-purchase-coupon{display:flex;gap:.5rem;margin:1rem 0 .5rem}.mc-purchase-coupon input{flex:1;min-height:var(--control-height);padding:0 .75rem;border:1px solid var(--hairline);border-radius:var(--radius-control);background:var(--canvas);color:var(--text-heading);font:inherit}.mc-purchase-error{color:var(--status-incorrect);font-size:.875rem;margin:.25rem 0}

.mc-purchase-coupon-applied{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin:1rem 0 .5rem;padding:.7rem .85rem;border:1px solid var(--status-correct);border-radius:var(--radius-control);color:var(--text-heading)}
/* Issue #661 mobile fix: a <select> sizes to its longest option, which pushed the page past the phone
   viewport (477px on 390px) and shifted the centred dialog. Let it shrink, and stack it on phones. */
.mc-purchase-dialog{max-width:calc(100vw - 2rem)}.mc-purchase-options label{min-width:0}.mc-purchase-option-title{min-width:0;overflow-wrap:anywhere}.mc-purchase-option-meta{flex-shrink:0;text-align:right}
@media (max-width:600px){.pricing-for{padding:1rem}.pricing-for-icon{display:none}.pricing-for select{width:100%}.mc-purchase-body{padding:1.25rem 1rem}.mc-purchase-coupon .mc-button{padding-inline:1rem}}

/* Issue #665 (owner preference): no underlined text anywhere, in any state including hover. Links stay
   identifiable without an underline (WCAG 1.4.1): text links and links inside running text are bold, hover
   changes colour, and keyboard focus gets a visible ring. !important also overrides legacy inline styles. */
a,a:hover,a:focus,a:active,a:visited,button,button:hover,[role="link"]{text-decoration:none!important}
p a:not([class*="button"]),.mc-text-link,.track-muted a,.pricing-fineprint a{font-weight:600}
a:not([class*="button"]):hover{color:var(--accent)}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* Issue #667 motion system (MC-081): subtle and purposeful. UI transitions stay <=250ms and animate only
   opacity/transform (no layout shift); the two "meaningful moment" fills (progress bars, results score
   count-up) run once per view at ~450ms. Everything is opt-in behind prefers-reduced-motion: no-preference,
   and a global reduce block below switches all motion off for people who ask for less. */
:root{--motion-fast:140ms;--motion-base:200ms;--motion-slow:240ms;--motion-moment:450ms;--ease-out-soft:cubic-bezier(.2,.8,.2,1)}
@media (prefers-reduced-motion:no-preference){
  @keyframes mcFadeUp{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
  @keyframes mcDialogIn{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
  @keyframes mcFadeIn{from{opacity:0}to{opacity:1}}
  @keyframes mcMenuIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
  @keyframes mcCheckPop{0%{opacity:0;transform:scale(.6)}70%{opacity:1;transform:scale(1.12)}100%{transform:scale(1)}}
  @keyframes mcBarGrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
  @keyframes mcNudge{0%,100%{transform:none}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
  /* Issue #677: answer feedback -- the outcome mark pops in, a wrong pick nudges once. */
  .mc-try-option-mark,.mc-try-result .mc-icon{animation:mcCheckPop var(--motion-moment) var(--ease-out-soft) backwards}
  .mc-try-options button[data-state="incorrect"]{animation:mcNudge 320ms var(--ease-out-soft) 1}
  .mc-try-explanation{animation:mcFadeUp var(--motion-slow) var(--ease-out-soft) backwards}
  /* Page entrance: key blocks fade up once; cards stagger lightly. Route changes in the app remount
     .app-main's child, so each page gets the same gentle entrance. */
  .app-main>*,.mc-public-page-main>*,.pricing-page>*,.track-hero,.track-nav,.track-section,.track-sidebar>section{animation:mcFadeUp var(--motion-slow) var(--ease-out-soft) both}
  /* Card entrances fill "backwards" (hold the start state only during the stagger delay), never
     "both": a forwards fill would keep the final keyframe's transform applied after the entrance and
     silently override the hover lift below (issue #673). */
  .pricing-grid>.pricing-card,.track-domain-grid>li{animation:mcFadeUp var(--motion-slow) var(--ease-out-soft) backwards}
  .pricing-grid>.pricing-card:nth-child(2),.track-domain-grid>li:nth-child(2){animation-delay:50ms}
  .pricing-grid>.pricing-card:nth-child(3),.track-domain-grid>li:nth-child(3){animation-delay:100ms}
  .track-domain-grid>li:nth-child(4){animation-delay:150ms}
  .track-domain-grid>li:nth-child(n+5){animation-delay:200ms}
  /* Issue #673: every card surface gets the catalog's entrance. `.mc-card` marks inline-styled app
     cards; account, homepage-catalog and verification cards use their own classes. Siblings stagger
     lightly (50ms steps, capped at 200ms) so a list reads as one gentle cascade. */
  .mc-card,.mc-catalog-card,.mc-account-content>.mc-account-section,.settings-panel--page>.mc-settings-group,.mc-verification-feature,.mc-account-items>li{animation:mcFadeUp var(--motion-slow) var(--ease-out-soft) backwards}
  :is(.mc-card,.mc-catalog-card,.mc-account-section,.mc-settings-group,.mc-account-items>li):nth-child(2){animation-delay:50ms}
  :is(.mc-card,.mc-catalog-card,.mc-account-section,.mc-settings-group,.mc-account-items>li):nth-child(3){animation-delay:100ms}
  :is(.mc-card,.mc-catalog-card,.mc-account-section,.mc-settings-group,.mc-account-items>li):nth-child(4){animation-delay:150ms}
  :is(.mc-card,.mc-catalog-card,.mc-account-section,.mc-settings-group,.mc-account-items>li):nth-child(n+5){animation-delay:200ms}
  /* Interactive feedback: colour/border transitions everywhere; a small lift only on cards, and only
     for real pointers (no sticky hover on touch). */
  a,button,.mc-button,input,select{transition:color var(--motion-fast) ease-out,background-color var(--motion-fast) ease-out,border-color var(--motion-fast) ease-out,box-shadow var(--motion-fast) ease-out,transform var(--motion-fast) ease-out}
  .pricing-card,.track-domain-card,.catalog-card,.mc-catalog-card,.mc-card-link,a.mc-account-item,.mc-purchase-options label{transition:transform var(--motion-base) var(--ease-out-soft),box-shadow var(--motion-base) var(--ease-out-soft),border-color var(--motion-fast) ease-out}
  .mc-button:active:not(:disabled),.mc-button-secondary:active:not(:disabled){transform:scale(.98)}
  /* Dialogs and menus open softly instead of popping. */
  dialog[open].mc-auth-dialog{animation:mcDialogIn var(--motion-base) var(--ease-out-soft)}
  dialog[open].mc-auth-dialog::backdrop{animation:mcFadeIn var(--motion-base) ease-out}
  .mc-account-menu,.track-mobile-menu[open] nav{animation:mcMenuIn var(--motion-fast) var(--ease-out-soft)}
  /* Meaningful moments. */
  .mc-check-pop{display:inline-block;animation:mcCheckPop var(--motion-slow) var(--ease-out-soft) both}
  .mc-bar-fill{transform-origin:left center;animation:mcBarGrow var(--motion-moment) var(--ease-out-soft) both}
}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  /* Issue #673: the same lift for every clickable card. Static cards deliberately do not lift --
     hover motion signals "this is clickable". */
  .pricing-card:hover,.track-domain-card:hover,.catalog-card:hover,.mc-catalog-card:hover,.mc-card-link:hover,a.mc-account-item:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgb(0 0 0 / .08)}
  .mc-purchase-options label:not(.is-owned):hover{border-color:var(--accent)}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after,::backdrop{animation-duration:.01ms!important;animation-iteration-count:1!important;animation-delay:0ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
.mc-purchase-done-mark{margin:0 0 .75rem;font-size:2rem;line-height:1;color:var(--status-correct)}
/* Learning space pages (issue #689; design docs/architecture/track-dashboard-redesign.md): one
   feature card per page plus two or three supporting pieces, every fact in one place. */
.ls-page{display:flex;flex-direction:column;gap:18px;max-width:1040px}
.ls-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px 24px;margin-bottom:6px}
.ls-head h1{margin:0 0 8px;font:600 var(--type-page)/1.2 var(--font-serif);color:var(--text-heading);text-wrap:balance}
.ls-head p{margin:0;color:var(--text-muted)}
.ls-exam{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;font-size:var(--type-dense)}
.ls-exam label{font-weight:600;color:var(--text-heading)}
.ls-exam input{min-height:40px;padding:0 10px;border:1px solid var(--hairline);border-radius:var(--radius-control);background:var(--card);color:var(--text-body);font:inherit}
.ls-exam-days{color:var(--accent);font-weight:600}
.ls-meta{margin:0;color:var(--text-muted);font-size:var(--type-dense)}
.ls-grid-main{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:18px}
.ls-grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.ls-card{background:var(--card);border:1px solid var(--hairline);border-radius:14px;padding:22px;min-width:0;display:flex;flex-direction:column;gap:10px}
.ls-card .mc-eyebrow{margin:0}
.ls-card .mc-button{align-self:flex-start}
.ls-feature{background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 12%,var(--card)),var(--card) 70%)}
.ls-feature-title{margin:0;font:600 var(--type-section)/1.25 var(--font-serif);color:var(--text-heading)}
.ls-feature-copy{margin:0;color:var(--text-body);max-width:78ch}
.ls-card-title{margin:0;font:600 1.25rem/1.3 var(--font-sans);color:var(--text-heading)}
.ls-card-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px 16px}
.ls-card-head h2{margin:0}
.ls-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin-top:4px}
.ls-range{position:relative;height:8px;margin:18px 0 4px;border-radius:999px;background:var(--raised)}
.ls-range-band{position:absolute;top:0;bottom:0;border-radius:999px;background:var(--accent);opacity:.35}
.ls-range-dot{position:absolute;top:-4px;width:16px;height:16px;border-radius:50%;background:var(--accent);transform:translateX(-8px)}
.ls-range-pass{position:absolute;top:-8px;bottom:-8px;width:2px;background:var(--text-heading);transform:translateX(-1px)}
.ls-scale{display:flex;justify-content:space-between;font-size:var(--type-meta);color:var(--text-muted)}
.ls-meter{height:8px;border-radius:999px;background:var(--raised);overflow:hidden;margin-top:6px}
.ls-meter i{display:block;height:100%;border-radius:999px;background:var(--accent)}
.ls-outcome p{margin:0;font-weight:600;color:var(--text-heading)}
.ls-tasks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.ls-task{display:flex;gap:12px;align-items:flex-start;width:100%;min-height:var(--control-height);padding:10px 12px;border:1px solid var(--hairline);border-radius:var(--radius-control);background:transparent;text-align:left;color:var(--text-body);font:inherit;font-size:var(--type-dense);cursor:pointer}
.ls-task:hover{border-color:var(--accent)}
.ls-task small{display:block;margin-top:2px;color:var(--text-muted);font-size:var(--type-meta)}
.ls-tick{flex:0 0 18px;height:18px;margin-top:1px;border-radius:5px;border:2px solid var(--hairline);display:grid;place-items:center;font-size:12px;line-height:1;color:var(--on-action)}
.ls-tick.is-on{background:var(--accent);border-color:var(--accent)}
.ls-task-done{color:var(--text-muted);text-decoration:line-through}
.ls-more{align-self:flex-start;background:none;border:0;padding:4px 0;cursor:pointer;font:inherit;font-size:var(--type-dense)}
.ls-rows{list-style:none;margin:0;padding:0}
.ls-rows li{display:flex;align-items:center;gap:14px;padding:12px 0;border-top:1px solid var(--hairline-faint)}
.ls-rows li:first-child{border-top:0}
.ls-rows .grow{flex:1;min-width:0}
.ls-rows .num{font-variant-numeric:tabular-nums;font-weight:600;color:var(--text-heading)}
/* Progress page (issue #754): domain rows as a percentage against the pass line, red below it. */
.pr-domain .grow{display:flex;flex-direction:column;gap:2px}
.pr-domain-title{color:var(--text-heading);font-weight:600}
.pr-bar{position:relative;flex:0 0 28%;height:8px;border-radius:999px;background:var(--raised)}
.pr-bar-fill{position:absolute;inset:0 auto 0 0;border-radius:999px;background:var(--accent)}
.pr-bar-fill[data-below="true"]{background:var(--status-incorrect)}
.pr-bar-pass{position:absolute;top:-5px;bottom:-5px;width:2px;background:var(--text-heading);transform:translateX(-1px)}
.pr-pct{flex:0 0 3.5rem;text-align:right;font-variant-numeric:tabular-nums;font-weight:700;font-size:1.0625rem;color:var(--text-heading)}
.pr-pct[data-below="true"]{color:var(--status-incorrect)}
.pr-action{flex:0 0 6.5rem;display:inline-flex;justify-content:center}
.pr-action.mc-button{min-height:36px;padding:.25rem .75rem;font-size:.875rem}
.pr-mock-score{display:flex;flex-direction:column;align-items:flex-end;gap:2px}
.pr-verdict{font-size:.8125rem;font-weight:600;color:var(--status-incorrect)}
.pr-verdict[data-passed="true"]{color:var(--status-correct)}
.pr-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:0}
.pr-tile{margin:0;padding:16px 18px;border:1px solid var(--hairline);border-radius:14px;background:var(--card)}
.pr-tile dt{font-size:.875rem;color:var(--text-muted)}
.pr-tile dd{margin:4px 0 0;font:700 1.5rem/1.2 var(--font-sans);color:var(--text-heading);font-variant-numeric:tabular-nums}
.pr-tile[data-good="true"] dd{color:var(--status-correct)}
.pr-weeks{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:repeat(8,1fr);gap:8px;height:150px;align-items:end}
.pr-weeks li{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:4px}
.pr-week-count{font-size:.75rem;color:var(--text-muted);font-variant-numeric:tabular-nums}
.pr-week-bar{width:100%;max-width:28px;border-radius:4px 4px 0 0;background:var(--accent);opacity:.55}
.pr-week-bar[data-current="true"]{opacity:1}
.pr-week-label{font-size:.6875rem;color:var(--text-dim);white-space:nowrap}
.pr-practice summary{display:flex;justify-content:space-between;align-items:center;cursor:pointer;list-style:none;min-height:var(--control-height)}
.pr-practice[open] summary{margin-bottom:8px}
@media (max-width:639px){
  .pr-domain{flex-wrap:wrap}
  .pr-domain .grow{flex:1 1 100%}
  .pr-bar{flex:1 1 auto}
  .pr-action:empty{display:none}
  .pr-week-label{font-size:.625rem}
  .pr-tiles{grid-template-columns:1fr}
}
.ls-state{display:inline-flex;align-items:center;gap:6px;font-size:var(--type-meta);color:var(--text-muted);white-space:nowrap}
.ls-state::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--text-dim)}
.ls-state[data-state="Needs work"]::before{background:var(--danger-text)}
.ls-state[data-state="Getting close"]::before{background:var(--warning-text)}
.ls-state[data-state="Exam-ready"]::before{background:var(--success-text)}
.ls-bandbar{position:relative;flex:0 0 36%;height:6px;border-radius:999px;background:var(--raised)}
.ls-bandbar .ls-range-band{top:0;bottom:0}
.ls-bandbar .ls-range-dot{top:-4px;width:12px;height:12px;transform:translateX(-6px)}
.ls-bandbar .ls-range-pass{top:-5px;bottom:-5px}
@media (max-width:860px){.ls-grid-main,.ls-grid-2{grid-template-columns:1fr}.ls-bandbar{flex-basis:30%}}
/* Domain reading layout, shared by public domain pages (staticPages.ts) and the in-app Study hub
   (StudyHub.tsx) so the two can't drift (issues #677/#679): top actions, a sticky "On this page"
   list, section cards with strong headings, and previous/next domain tiles. */
.domain-actions{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem;margin-top:1.5rem}
.domain-layout{display:grid;grid-template-columns:16rem minmax(0,1fr);gap:3rem;align-items:start}
.domain-layout-single{grid-template-columns:minmax(0,1fr)}
.domain-toc{position:sticky;top:1.5rem;max-height:calc(100vh - 3rem);overflow-y:auto;padding:1rem 0;border-top:2px solid var(--accent)}
.domain-toc-title{margin:0 0 .5rem;font:600 var(--type-meta)/1.4 var(--font-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}
.domain-toc ol{list-style:none;margin:0;padding:0}
.domain-toc li{margin:0}
.domain-toc a{display:block;padding:.4rem .6rem;border-radius:var(--radius-control);color:var(--text-body);font-size:.875rem;line-height:1.4;text-decoration:none}
.domain-toc a:hover{background:var(--surface-subtle);color:var(--text-heading)}
.domain-toc a:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.domain-notes{min-width:0}
.domain-section{padding:1.75rem 1.75rem 1.25rem;margin:0 0 1.25rem;background:var(--raised);border:1px solid var(--hairline);border-radius:var(--radius-card);scroll-margin-top:1.5rem}
.domain-notes h2,.mc-public .domain-notes h2{position:relative;font:700 1.5rem/1.3 var(--font-sans);letter-spacing:-.015em;color:var(--text-heading);max-width:none;margin:-1.75rem -1.75rem 1.25rem;padding:1.1rem 1.75rem 1rem 2rem;background:var(--success-tint);border-bottom:1px solid var(--hairline);border-radius:var(--radius-card) var(--radius-card) 0 0}.domain-notes h2::before{content:"";position:absolute;left:0;top:.9rem;bottom:.9rem;width:4px;border-radius:0 4px 4px 0;background:var(--accent)}.domain-notes h3{font:650 1.125rem/1.35 var(--font-sans);color:var(--accent);margin:1.25rem 0 .5rem}
.domain-notes p,.domain-notes li{font-size:1.0625rem;line-height:1.7;color:var(--text-body)}
.domain-notes p{margin:0 0 1rem}
.domain-notes ul,.domain-notes ol{margin:0 0 1rem;padding-left:1.25rem}
.domain-notes li{margin:.35rem 0}
.domain-notes li::marker{color:var(--accent)}
.domain-notes strong{color:var(--text-heading);font-weight:650}
.domain-notes code{padding:.1rem .35rem;border-radius:4px;background:var(--surface-subtle);font-size:.875em;overflow-wrap:anywhere}
.domain-notes table{width:100%;border-collapse:collapse;margin:0 0 1rem;font-size:.9375rem}
.domain-notes th,.domain-notes td{padding:.5rem .6rem;border-bottom:1px solid var(--hairline);text-align:left;vertical-align:top}
.domain-notes blockquote{margin:0 0 1rem;padding:.75rem 1rem;border-left:3px solid var(--accent);background:var(--surface-subtle);border-radius:var(--radius-control)}
.domain-pager{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:2rem}.domain-pager-top{margin:0 0 1.25rem}
.domain-pager-link{display:grid;gap:.25rem;padding:1rem 1.25rem;border:1px solid var(--hairline);border-radius:var(--radius-card);background:var(--raised);text-decoration:none}
.domain-pager-link span{font-size:var(--type-meta);color:var(--text-muted)}
.domain-pager-link strong{color:var(--accent);font-weight:650}
.domain-pager-next{text-align:right}
.domain-pager-link:hover{border-color:var(--accent)}
@media (max-width:1023px){.domain-layout{grid-template-columns:minmax(0,1fr)}.domain-toc{display:none}}
@media (max-width:639px){.mc-public .domain-page{padding-block:1.5rem 3rem}.domain-section{padding:1.25rem 1rem 1rem}.domain-notes h2,.mc-public .domain-notes h2{margin:-1.25rem -1rem 1rem;padding:.9rem 1rem .8rem 1.25rem;font-size:1.25rem}.domain-actions .mc-button{width:100%;justify-content:center}.domain-pager{grid-template-columns:1fr}.domain-pager-next{text-align:left}}
/* In-app Study hub header (issue #679). */
.study-hub-head{margin-bottom:2rem}
.study-hub-head h1{margin:.25rem 0 0;font:600 var(--type-page)/1.2 var(--font-sans);letter-spacing:-.02em;color:var(--text-heading);text-wrap:balance}
.study-hub-head .mc-study-tools{margin:1.25rem 0 .5rem}
.study-hub-domains{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}
.study-hub-domains a{display:inline-flex;align-items:center;gap:.4rem;min-height:40px;padding:.4rem .8rem;border:1px solid var(--hairline);border-radius:var(--radius-control);color:var(--text-body);font-size:.875rem;text-decoration:none}
.study-hub-domains a span{font:600 .75rem/1 var(--font-mono);color:var(--text-muted)}
.study-hub-domains a:hover{border-color:var(--accent)}
.study-hub-domains a[aria-current="page"]{border-color:var(--accent);background:var(--success-tint);color:var(--text-heading);font-weight:600}
.study-hub .domain-section{scroll-margin-top:5rem}
.study-hub .quizme-btn{display:inline-block;margin:-.5rem 0 .75rem}
.domain-toc a[aria-current="location"]{background:var(--success-tint);color:var(--text-heading);font-weight:600;box-shadow:inset 3px 0 0 var(--accent)}
/* Learn landing (issue #691): one card per domain. */
.ls-domain-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:16px}
.ls-domain-card{display:flex;flex-direction:column;gap:10px;height:100%;box-sizing:border-box;padding:20px;border:1px solid var(--hairline);border-radius:14px;background:var(--card);color:inherit;text-decoration:none;transition:border-color var(--motion-fast,.15s) ease-out,transform var(--motion-base,.2s) ease,box-shadow var(--motion-base,.2s) ease}
.ls-domain-card:hover{border-color:var(--accent)}
.ls-domain-card:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.ls-domain-title{font:600 1.125rem/1.3 var(--font-sans);color:var(--text-heading)}
@media (hover:hover) and (prefers-reduced-motion:no-preference){.ls-domain-card:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgb(0 0 0 / .08)}}
/* Domain page back link and self-check (issue #691). */
.ls-back{display:inline-block;margin-bottom:10px;color:var(--text-muted);text-decoration:none;font-size:var(--type-dense)}
.ls-back:hover{color:var(--accent)}
.ls-check .ls-check-q{font:600 1.0625rem/1.5 var(--font-sans);color:var(--text-heading);margin:6px 0 14px}
.ls-check .ls-actions{margin-top:14px}
button.ls-domain-card{width:100%;text-align:left;font:inherit;cursor:pointer}
/* Issue #752: a domain card holding its own Practice and Flashcards actions is not itself a link,
   so it does not lift or highlight on hover; its buttons do. */
.ls-domain-card-static:hover{border-color:var(--hairline);transform:none;box-shadow:none}
.ls-domain-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto;padding-top:6px}
.ls-domain-actions .mc-button{min-height:40px;padding:.375rem 1rem;font-size:.9375rem}
.ls-back-button{background:none;border:0;padding:0;cursor:pointer;font:inherit;font-size:var(--type-dense);align-self:flex-start}
/* Mock exams grid (issue #691). */
.ls-mock-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:16px;align-items:stretch}
.ls-mock-card>div{flex:1}
.ls-mock-bundle{border-color:var(--accent)}

/* Issue #697: the site header and footer inside the learning space. */
.mc-header-search{display:inline-flex;align-items:center;gap:.5rem;min-height:var(--control-height);padding:.5rem .75rem;border:1px solid var(--hairline);border-radius:var(--radius-control);background:transparent;color:var(--text-muted);font:inherit;font-size:.9375rem;cursor:pointer}
.mc-header-search:hover{color:var(--text-heading);border-color:var(--text-dim)}
.mc-header-search kbd{font-family:var(--font-mono);font-size:.6875rem;color:var(--text-dim)}
@media(max-width:959px){.mc-header-search kbd{display:none}[data-shell="learner"]>.mc-site-footer,[data-shell="administration"]>.mc-site-footer{padding-bottom:72px}}
@media(max-width:639px){.mc-header-search-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}}
/* The sidebar is a brand-coloured band: accent-coloured icons would vanish into it. */
.sidebar-link .mc-icon{color:inherit}
/* Issue #701: the certification title at the top of the track sidebar. */
.mc-sidebar-title{display:flex;flex-direction:column;gap:2px;padding:6px 12px 16px;margin-bottom:10px;border-bottom:1px solid var(--hairline-faint);text-decoration:none;min-height:var(--control-height);border-radius:8px}
.mc-sidebar-title:hover .mc-sidebar-title-name{color:var(--text-heading)}
.mc-sidebar-title-vendor{font:600 .6875rem/1.4 var(--font-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--text-dim)}
.mc-sidebar-title-name{font:500 1.375rem/1.2 var(--font-serif);letter-spacing:-.015em;color:var(--text-heading);overflow-wrap:anywhere}
.mc-sidebar-title-code{margin-top:4px;align-self:flex-start;font:500 .75rem/1.4 var(--font-mono);color:var(--text-muted);border:1px solid var(--hairline);border-radius:var(--radius-badge);padding:1px 7px}
/* Issue #710: the home page's collapsible FAQ. A plus turns into a minus when an answer is open. */
.mc-home-faq-all{display:inline-flex;align-items:center;gap:.375rem;font-weight:600;color:var(--accent);text-decoration:none}
.mc-faq-list{border-top:1px solid var(--hairline)}
.mc-faq-list details{border-bottom:1px solid var(--hairline)}
.mc-faq-list summary{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.875rem 0;cursor:pointer;list-style:none;font:600 1rem/1.45 var(--font-sans);color:var(--text-heading)}
.mc-faq-list summary::-webkit-details-marker{display:none}
.mc-faq-list summary::after{content:"+";flex:none;width:1.5rem;text-align:center;font:400 1.5rem/1 var(--font-sans);color:var(--accent)}
.mc-faq-list details[open] summary::after{content:"−"}
.mc-faq-list summary:hover{color:var(--accent)}
.mc-faq-list summary:focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:4px}
.mc-faq-list details p{margin:0 0 1.25rem;max-width:72ch;color:var(--text-muted);line-height:1.65}

/* Certificate pages (issue #756): the public verify page and the holder's certificate page share
   CertificateDetail. The certificate itself is always white paper; everything around it follows the
   site theme. */
.mc-cert-page{box-sizing:border-box;width:100%;max-width:calc(max(560px,(100dvh - 260px) * 1.414) + 400px);margin:0 auto;padding:40px 16px 56px;display:flex;flex-direction:column;gap:24px}
.mc-cert-page-in-app{padding:0;max-width:none}
/* Scoped under .mc-cert-page: the site-wide `.mc-public h1` display style must not reach these headings. */
.mc-cert-page .mc-cert-page-title{margin:0;max-width:none;font:600 var(--type-page)/1.25 var(--font-serif);letter-spacing:-.01em;text-wrap:wrap;color:var(--text-heading)}
.mc-cert-page code,.mc-cert-card code{font-family:var(--font-mono);font-size:.95em}
.mc-cert-status{display:flex;align-items:center;gap:18px;padding:18px 24px;border:1px solid;border-radius:14px}
.mc-cert-status-valid{background:var(--success-tint);border-color:color-mix(in srgb,var(--accent) 45%,transparent)}
.mc-cert-status-revoked{background:var(--danger-tint);border-color:color-mix(in srgb,var(--danger-text) 45%,transparent);align-items:flex-start}
.mc-cert-status-icon{width:40px;height:40px;flex-shrink:0}
.mc-cert-status-icon circle{fill:var(--accent)}
.mc-cert-status-icon path{fill:none;stroke:var(--on-action);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.mc-cert-status-revoked .mc-cert-status-icon circle{fill:var(--danger-text)}
.mc-cert-status-revoked .mc-cert-status-icon path{stroke:var(--canvas)}
.mc-cert-status-text{flex:1;min-width:0}
.mc-cert-page .mc-cert-status-text h1{margin:0;max-width:none;font:700 1.25rem/1.3 var(--font-sans);letter-spacing:0;text-wrap:wrap;color:var(--accent)}
.mc-cert-page .mc-cert-status-revoked .mc-cert-status-text h1{color:var(--danger-text)}
.mc-cert-status-text p{margin:4px 0 0;font-size:.95rem;line-height:1.5;color:var(--text-heading)}
.mc-cert-status-id{text-align:right}
.mc-cert-status-id span{display:block;font-size:.8125rem;color:var(--text-muted)}
.mc-cert-status-id code{font-family:var(--font-mono);font-size:.95rem;color:var(--text-heading)}
.mc-cert-private{margin:0;padding:12px 16px;border-radius:10px;background:var(--warning-tint);color:var(--text-heading);font-size:.95rem}
/* Wide: certificate and About on the left, the actions beside them and kept in view while scrolling. */
/* The certificate column is also capped by the window height (A4 is 1.414:1, ~260px of header and
   status bar above it), so on a laptop the whole certificate shows without scrolling. */
.mc-cert-detail{display:grid;grid-template-columns:minmax(0,max(560px,calc((100dvh - 260px) * 1.414))) 340px;justify-content:center;grid-template-areas:"art side" "about side";gap:24px 28px;align-items:start}
.mc-cert-detail-art{grid-area:art}
.mc-cert-detail-about{grid-area:about}
.mc-cert-side{grid-area:side;position:sticky;top:24px}
/* Capped so the whole certificate fits a laptop screen at 100% zoom. `> div > svg` only: the logo and
   mountains are SVGs nested inside it and keep their own drawn sizes. */
.mc-cert-art{width:100%}
.mc-cert-art > div > svg{display:block;width:100%;height:auto;border-radius:4px;box-shadow:0 1px 3px rgba(22,36,31,.16),0 8px 24px rgba(22,36,31,.08)}
.mc-cert-art-narrow{display:none}
.mc-cert-side{display:flex;flex-direction:column;gap:16px}
.mc-cert-card{box-sizing:border-box;padding:20px 22px;background:var(--card);border:1px solid var(--hairline);border-radius:14px}
.mc-cert-page .mc-cert-card-title{margin:0 0 6px;max-width:none;font:600 1.375rem/1.25 var(--font-serif);letter-spacing:0;text-wrap:wrap;color:var(--text-heading)}
.mc-cert-page .mc-cert-card-title-spaced{margin-bottom:12px}
.mc-cert-page .mc-cert-card-subtitle{margin:16px 0 8px;max-width:none;font:700 .9375rem/1.4 var(--font-sans);letter-spacing:0;color:var(--text-heading)}
.mc-cert-card-note{margin:0 0 14px;font-size:.875rem;line-height:1.5;color:var(--text-muted)}
.mc-cert-card .mc-cert-card-note:last-child{margin:10px 0 0}
.mc-cert-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.mc-cert-sites .mc-cert-copy{grid-column:1/-1}
.mc-cert-grid .mc-button{min-height:var(--control-height);padding:.5rem .75rem;font-size:.9375rem}
.mc-cert-share-sheet{display:none}
.mc-cert-holder{background:var(--canvas);border-style:dashed;border-color:var(--hairline-strong)}
.mc-cert-holder-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.mc-cert-holder-head .mc-cert-card-note{margin:0}
.mc-cert-holder-linkedin{width:100%;margin:12px 0 4px}
.mc-cert-about{margin:14px 0 0;display:grid;grid-template-columns:150px minmax(0,1fr);gap:14px 20px;font-size:1rem;line-height:1.45}
.mc-cert-about dt{color:var(--text-muted)}
.mc-cert-about dd{margin:0;color:var(--text-heading)}
.mc-cert-about a{font-weight:600}
.mc-cert-about-note{margin:20px 0 0;padding-top:16px;border-top:1px solid var(--hairline-faint);font-size:.875rem;line-height:1.5;color:var(--text-muted)}
.mc-cert-lookup-copy{margin:8px 0 16px;line-height:1.5;color:var(--text-heading)}
.mc-cert-lookup label{display:block;margin-bottom:6px;font-weight:600;font-size:.875rem;color:var(--text-heading)}
.mc-cert-lookup-row{display:flex;gap:10px}
.mc-cert-lookup-row input{flex:1;min-width:0;min-height:var(--control-height);box-sizing:border-box;padding:0 14px;border:1px solid var(--hairline-strong);border-radius:10px;background:var(--card);color:var(--text-heading);font:500 .95rem var(--font-mono)}
.mc-cert-error{margin:10px 0 0;color:var(--danger-text);font-size:.875rem}
/* Mouse and trackpad screens: shorter controls keep the actions column within one screen; touch keeps 44px. */
@media (pointer:fine){.mc-cert-grid .mc-button,.mc-cert-holder-linkedin,.mc-cert-share-sheet{min-height:38px;padding-block:.375rem}.mc-cert-holder label{min-height:34px!important}.mc-cert-holder button{min-height:34px!important}}
@media (max-width:1100px){.mc-cert-detail{grid-template-columns:minmax(0,1fr);grid-template-areas:"art" "side" "about"}.mc-cert-side{position:static}}
@media (max-width:720px){
  .mc-cert-page{padding:16px 16px 40px;gap:16px}
  .mc-cert-art-wide{display:none}
  .mc-cert-art-narrow{display:block}
  .mc-cert-status{flex-wrap:wrap;padding:14px 16px;gap:12px;align-items:flex-start}
  .mc-cert-status-icon{width:30px;height:30px}
  .mc-cert-page .mc-cert-status-text h1{font-size:1.0625rem}
  .mc-cert-status-id{flex-basis:100%;text-align:left;padding-left:42px}
  .mc-cert-card{padding:18px 16px}
  .mc-cert-share-sheet{display:flex;width:100%;margin-bottom:10px}
  .mc-cert-sites-with-sheet .mc-cert-site{display:none}
  .mc-cert-sites-with-sheet .mc-cert-copy{grid-column:1/-1;background:transparent;color:var(--accent)}
  .mc-cert-about{grid-template-columns:minmax(0,1fr);gap:2px}
  .mc-cert-about dt{font-size:.8125rem}
  .mc-cert-about dd{margin-bottom:10px}
}
@media print{
  @page{size:A4 landscape;margin:0}
  body *{visibility:hidden}
  .mc-cert-art-wide,.mc-cert-art-wide *{visibility:visible}
  .mc-cert-art-wide{display:block!important;position:fixed;inset:0}
  .mc-cert-art{max-width:none}
  .mc-cert-art-wide > svg{box-shadow:none;border-radius:0}
  .mc-cert-art-narrow{display:none!important}
}

/* ===== Light theme: dark-mode chrome (owner, 2026-09-29) =====
   The owner's verdict: dark mode reads premium, light mode read dull. Light mode now borrows dark
   mode where attention matters: the header on every page, the home hero and certification tiles, the
   certification-page hero, the footer, and each page's featured card (Best value, Your readiness).
   Those regions are "dark islands": tokens.css applies its dark palette to them in every theme, so
   dark mode is unchanged. Light-mode brand surfaces (the learning sidebar, the closing band) use
   dark mode's ink instead of teal, so every dark area is one family.
   To revert: delete this section and the island selector list on the dark block in tokens.css. */
.mc-public-header,.mc-hero-scene,.mc-discovery,.track-hero,.pricing-card:has(.pricing-badge),.ls-feature{color:var(--text-body)}
/* Full-width dark bands without clipping the header's menus: a border-image paints the band past
   the content box on both sides; the inset shadow keeps the header's bottom hairline. */
.mc-public-header,.mc-discovery,.track-hero{background:var(--canvas);border-image:conic-gradient(var(--canvas) 0 0) fill 0//0 100vmax}
.mc-public-header{box-shadow:inset 0 -1px 0 var(--hairline)}
.mc-public .mc-hero-scene .mc-landscape-hero{opacity:.6}
/* The dark logo artwork inside dark regions, over the per-theme logo rules (public-track.css uses
   !important at five selectors deep, hence the repeated :root). */
:root:root:root :is(.mc-public-header,.mc-home-footer) :is(.mc-art-light,.brand-light){display:none!important}
:root:root:root :is(.mc-public-header,.mc-home-footer) :is(.mc-art-dark,.brand-dark){display:block!important}
:root[data-theme="light"]{--brand-surface:#18262c;--brand-surface-line:#34484f;--brand-on-surface:#eef3f0;--brand-on-surface-muted:#acbbb9;--brand-on-surface-dim:#78918f;--brand-raised:#213139}
@media(prefers-color-scheme:light){:root:not([data-theme]){--brand-surface:#18262c;--brand-surface-line:#34484f;--brand-on-surface:#eef3f0;--brand-on-surface-muted:#acbbb9;--brand-on-surface-dim:#78918f;--brand-raised:#213139}}