/* Typography, composition and controls. Domain styles own activity layouts. */
*, *::before, *::after { box-sizing: border-box; }

html { background: var(--color-bg); scroll-padding-top: 5rem; }
body.mc-ui {
  margin: 0;
  background: var(--color-bg);
  color: var(--color-text);
  font: var(--type-body)/var(--leading-body) var(--font-body);
  -webkit-font-smoothing: antialiased;
}
:where(body.mc-ui) :where(button, input, select, textarea) { font: inherit; }
:where(body.mc-ui) :where(button, a, input, select, textarea, summary) { -webkit-tap-highlight-color: transparent; }
:where(body.mc-ui) :where(h1, h2, h3, h4) {
  margin: 0;
  color: var(--color-text);
  font-family: var(--font-display);
  font-weight: 600;
  line-height: var(--leading-heading);
  letter-spacing: -.025em;
  text-wrap: balance;
}
:where(body.mc-ui) :where(h1) { font-size: var(--type-h1); }
:where(body.mc-ui) :where(h2) { font-size: var(--type-h2); }
:where(body.mc-ui) :where(h3) { font-size: var(--type-h3); }
:where(body.mc-ui) :where(h4) { font-size: var(--type-h4); }
:where(body.mc-ui) :where(p, ul, ol, dl, figure) { margin: 0; }
:where(body.mc-ui) :where(p, li, dd) { text-wrap: pretty; }
:where(body.mc-ui) :where(a) { color: var(--color-link); text-underline-offset: .2em; }
:where(body.mc-ui) :where(button, summary) { cursor: pointer; }
:where(body.mc-ui) :where(button:disabled) { cursor: not-allowed; }
:where(body.mc-ui) :where(img, svg) { max-inline-size: 100%; }
:where(body.mc-ui) :where(img) { block-size: auto; }
:where(body.mc-ui) :where([hidden]) { display: none !important; }
:where(body.mc-ui) :where(:focus-visible) { outline: 2px solid var(--color-focus); outline-offset: 3px; }
:where(body.mc-ui) :where(:disabled) { color: var(--color-disabled); }

.mc-container { inline-size: min(calc(100% - var(--layout-gutter) * 2), var(--layout-content)); margin-inline: auto; }
.mc-container--wide { max-inline-size: var(--layout-wide); inline-size: calc(100% - var(--layout-gutter) * 2); }
.mc-prose { max-inline-size: var(--layout-prose); }
.mc-prose > * + * { margin-block-start: var(--space-4); }
.mc-prose :where(h2, h3) { margin-block-start: var(--space-8); }
.mc-prose :where(ul, ol) { padding-inline-start: var(--space-6); }
.mc-stack { display: flex; flex-direction: column; gap: var(--stack-gap, var(--space-4)); }
.mc-cluster { display: flex; flex-wrap: wrap; align-items: center; gap: var(--cluster-gap, var(--space-3)); }
.mc-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--layout-gap); }
.mc-grid > * { min-inline-size: 0; }
.mc-rule { border: 0; border-block-start: 1px solid var(--color-border-strong); }
.mc-section-space { padding-block: var(--section-space); }
.mc-section-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: var(--space-4); margin-block-end: var(--space-6); }
.mc-eyebrow { color: var(--color-text-secondary); font-size: var(--type-caption); font-weight: 500; }
.mc-display { font-size: var(--type-display); }
.mc-clinical { max-inline-size: var(--layout-reading); font-family: var(--font-clinical); font-size: var(--type-body-lg); line-height: var(--leading-clinical); }
.mc-meta { color: var(--color-text-secondary); font-size: var(--type-caption); }
.mc-numeric { font-variant-numeric: tabular-nums lining-nums; }

.mc-icon { display: inline-block; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; vertical-align: middle; }
.mc-control {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  min-block-size: var(--control-height);
  padding: var(--space-2) var(--space-4);
  border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-sm);
  background: var(--color-surface);
  color: var(--color-text);
  font: 600 var(--type-label)/1.4 var(--font-body);
  text-align: center;
  text-decoration: none;
}
.mc-control--primary { border-color: var(--color-brand); background: var(--color-brand); color: var(--color-text-inverse); }
.mc-control:disabled { border-color: var(--color-border); background: var(--color-disabled-bg); color: var(--color-disabled); box-shadow: none; }
.mc-control:active:not(:disabled) { background: var(--color-bg-subtle); }
.mc-control--primary:active:not(:disabled) { border-color: var(--color-brand-hover); background: var(--color-brand-hover); }
.mc-field { inline-size: 100%; min-block-size: var(--control-height); padding: var(--space-2) var(--space-3); border: 1px solid var(--color-border-strong); border-radius: var(--radius-sm); background: var(--color-surface); color: var(--color-text); }
.mc-field::placeholder { color: var(--color-text-tertiary); opacity: 1; }
.mc-field:focus { border-color: var(--color-focus); }
.mc-field[aria-invalid='true'] { border-color: var(--color-error); }
.mc-field:disabled { background: var(--color-disabled-bg); }
.mc-field-label { display: block; margin-block-end: var(--space-2); color: var(--color-text); font-size: var(--type-label); font-weight: 600; }
.mc-field-hint { margin-block-start: var(--space-2); color: var(--color-text-secondary); font-size: var(--type-caption); }
.mc-field-error { margin-block-start: var(--space-2); color: var(--color-error); font-size: var(--type-caption); }
.mc-notice { padding: var(--space-4); border-inline-start: 3px solid var(--color-border-strong); background: var(--color-bg-subtle); }
.mc-notice--error { border-color: var(--color-error); background: var(--color-error-subtle); }
.mc-notice--success { border-color: var(--color-success); background: var(--color-success-subtle); }
.mc-sr-only { position: absolute; inline-size: 1px; block-size: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.mc-skip-link { position: fixed; z-index: 30; inset: var(--space-3) auto auto var(--space-3); padding: var(--space-3) var(--space-4); background: var(--color-surface-inverse); color: var(--color-text-inverse); translate: 0 -200%; }
.mc-skip-link:focus { translate: 0; }

@media (hover: hover) and (pointer: fine) {
  .mc-control:hover:not(:disabled) { border-color: var(--color-text-secondary); background: var(--color-bg-subtle); }
  .mc-control--primary:hover:not(:disabled) { border-color: var(--color-brand-hover); background: var(--color-brand-hover); color: var(--color-text-inverse); }
}
@media (prefers-reduced-motion: no-preference) {
  .mc-control, .mc-field { transition: color var(--duration-fast), background-color var(--duration-fast), border-color var(--duration-fast); }
}
@media (prefers-reduced-motion: reduce) {
  body.mc-ui *, body.mc-ui *::before, body.mc-ui *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
@media (forced-colors: active) {
  .mc-control, .mc-field { border-color: ButtonText; }
  .mc-control--primary { outline: 1px solid ButtonText; }
}

body.mc-ui :is(footer.av-foot, footer.foot, footer.folio-legal) {
  padding: var(--space-6) var(--space-6) var(--space-8);
  border-block-start: 1px solid var(--color-border-inverse);
  background: var(--color-surface-inverse);
  color: var(--color-text-inverse-secondary) !important;
}
body.mc-ui :is(footer.av-foot, footer.foot, footer.folio-legal) a {
  color: var(--color-text-inverse-secondary) !important;
}
body.mc-ui :is(footer.av-foot, footer.foot, footer.folio-legal) a:hover {
  color: var(--color-accent-inverse) !important;
}
body.mc-ui :is(footer.av-foot, footer.foot, footer.folio-legal) :focus-visible {
  outline-color: var(--color-focus-inverse);
}
@media print {
  body.mc-ui { color: CanvasText; background: Canvas; }
  .mc-skip-link { display: none; }
  body.mc-ui *, body.mc-ui *::before, body.mc-ui *::after { animation: none !important; transition: none !important; box-shadow: none !important; }
}