body.xps-contribute-page{
  --contribute-accent: var(--xps-color-accent);
  --contribute-accent-strong: var(--xps-color-accent);
  --contribute-ink: var(--xps-ds-text, var(--xps-color-text));
  --contribute-muted: var(--xps-ds-text-muted, var(--xps-color-text-muted));
  --contribute-border: color-mix(in srgb, var(--xps-ds-border, var(--xps-color-border)) 78%, transparent);
  --contribute-surface: color-mix(in srgb, var(--xps-ds-surface, var(--xps-color-surface)) 94%, transparent);
  --contribute-surface-strong: var(--xps-ds-surface-raised, var(--xps-color-surface));
  --contribute-canvas: var(--xps-ds-canvas, var(--xps-color-canvas));
  --contribute-radius: 1.25rem;
  --contribute-shadow: 0 1.5rem 4rem var(--xps-shadow-color);
}

html{ scroll-behavior: smooth; scroll-padding-top: 6rem; }
body.xps-contribute-page{ background: var(--contribute-canvas); color: var(--contribute-ink); overflow-x: clip; }
.xps-contribute-page :where(h1,h2,h3,p){ text-wrap: pretty; }
.xps-contribute-page :where(button,a,input,select){ font: inherit; }
.contribute-shell{ width: min(100% - 2rem, 78rem); margin-inline: auto; }

.contributor-context-nav{ position: sticky; inset-block-start: var(--xps-public-header-height, 4.25rem); z-index: 24; border-block-end: 1px solid var(--contribute-border); background: color-mix(in srgb, var(--contribute-canvas) 94%, transparent); backdrop-filter: blur(14px); }
.contributor-context-nav__inner{ min-block-size: 3.1rem; display: flex; align-items: center; gap: 1.15rem; }
.contributor-context-nav__home{ color: var(--contribute-ink); text-decoration: none; white-space: nowrap; }
.contributor-context-nav__home strong{ font-size: .82rem; letter-spacing: .01em; }
.contributor-context-nav__links{ display: flex; align-items: center; gap: 1rem; min-inline-size: 0; flex: 1; }
.contributor-context-nav__links a,.contributor-context-nav__signin{ color: var(--contribute-muted); text-decoration: none; font-size: .78rem; font-weight: 760; }
.contributor-context-nav__links a:hover,.contributor-context-nav__links a:focus-visible,.contributor-context-nav__signin:hover,.contributor-context-nav__signin:focus-visible{ color: var(--contribute-ink); }
.contributor-context-nav__home[aria-current="page"]{ text-decoration: underline; text-decoration-color: var(--contribute-accent); text-underline-offset: .75rem; text-decoration-thickness: 2px; }
.contributor-context-nav__signin{ min-block-size: 2.2rem; display: inline-flex; align-items: center; padding-inline: .75rem; border: 1px solid var(--contribute-border); border-radius: .65rem; color: var(--contribute-ink); }
.contribute-link-button,
.contribute-icon-button,
.contribute-primary-button,
.contribute-secondary-button{ min-block-size: 2.75rem; border-radius: .75rem; padding: .7rem 1rem; display: inline-flex; align-items: center; justify-content: center; gap: .45rem; text-decoration: none; font-weight: 800; cursor: pointer; }
.contribute-link-button,
.contribute-icon-button,
.contribute-secondary-button{ border: 1px solid var(--contribute-border); background: color-mix(in srgb, var(--contribute-surface) 75%, transparent); color: var(--contribute-ink); }
.contribute-primary-button{ border: 1px solid var(--contribute-accent); background: var(--contribute-accent); color: var(--xps-color-on-accent); box-shadow: 0 .7rem 1.6rem var(--xps-shadow-color); }
.contribute-primary-button:hover{ filter: brightness(1.06); transform: translateY(-1px); }
.contribute-secondary-button:hover,
.contribute-link-button:hover,
.contribute-icon-button:hover{ border-color: color-mix(in srgb, var(--contribute-accent) 60%, var(--contribute-border)); background: color-mix(in srgb, var(--contribute-accent) 10%, var(--contribute-surface)); }

.contribute-hero{ position: relative; padding-block: clamp(4.5rem, 10vw, 8.5rem) clamp(4rem, 8vw, 7rem); isolation: isolate; }
.contribute-hero::before{ content: ""; position: absolute; inset: 0; z-index: -2; background: radial-gradient(circle at 14% 18%, var(--xps-color-canvas-deep), transparent 34%), radial-gradient(circle at 82% 20%, var(--xps-color-canvas-deep), transparent 28%), linear-gradient(180deg, color-mix(in srgb, var(--contribute-canvas) 82%, var(--xps-color-canvas-deep)), var(--contribute-canvas)); }
.contribute-hero::after{ content: ""; position: absolute; inset: 0; z-index: -1; opacity: .25; background-image: linear-gradient(var(--xps-color-canvas-deep) 1px, transparent 1px), linear-gradient(90deg, var(--xps-color-canvas-deep) 1px, transparent 1px); background-size: 3rem 3rem; mask-image: linear-gradient(to bottom, black, transparent 85%); }
.contribute-hero__grid{ display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(20rem, .72fr); gap: clamp(2rem, 6vw, 5.5rem); align-items: center; }
.contribute-eyebrow{ margin: 0 0 1rem; color: var(--contribute-accent); font-size: .77rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.contribute-hero h1{ margin: 0; max-inline-size: 14ch; font-size: clamp(2.65rem, 6.3vw, 5.65rem); line-height: .98; letter-spacing: -.045em; }
[dir="rtl"] .contribute-hero h1{ letter-spacing: 0; line-height: 1.13; max-inline-size: 16ch; }
.contribute-hero__lead{ max-inline-size: 44rem; margin-block: 1.65rem 0; color: var(--contribute-muted); font-size: clamp(1.05rem, 1.8vw, 1.28rem); line-height: 1.75; }
.contribute-hero__actions{ display: flex; flex-wrap: wrap; gap: .75rem; margin-block-start: 2rem; }
.contribute-proof-list{ list-style: none; padding: 0; margin: 2rem 0 0; display: flex; flex-wrap: wrap; gap: .65rem 1.25rem; color: var(--contribute-muted); font-size: .9rem; }
.contribute-proof-list li{ display: flex; align-items: center; gap: .45rem; }
.contribute-proof-list li > span:first-child{ display: grid; place-items: center; inline-size: 1.35rem; block-size: 1.35rem; border-radius: 50%; background: var(--xps-color-canvas-deep); color: var(--contribute-accent); font-weight: 900; }

.contribute-boundary-card{ border: 1px solid color-mix(in srgb, var(--contribute-accent) 26%, var(--contribute-border)); border-radius: var(--contribute-radius); padding: clamp(1.3rem, 3vw, 2rem); background: linear-gradient(145deg, color-mix(in srgb, var(--contribute-surface-strong) 92%, transparent), color-mix(in srgb, var(--contribute-surface) 86%, transparent)); box-shadow: var(--contribute-shadow); }
.contribute-boundary-card__topline{ display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.contribute-boundary-card h2{ margin: .35rem 0 1.5rem; font-size: clamp(1.45rem, 2.6vw, 2.15rem); line-height: 1.18; }
.contribute-state-pill{ border: 1px solid color-mix(in srgb, var(--contribute-accent) 48%, transparent); border-radius: 999px; padding: .32rem .65rem; background: var(--xps-color-canvas-deep); color: var(--contribute-accent); font-size: .72rem; font-weight: 900; white-space: nowrap; }
.contribute-boundary-list{ margin: 0; display: grid; }
.contribute-boundary-list > div{ display: grid; grid-template-columns: minmax(6rem,.38fr) minmax(0,1fr); gap: 1rem; padding-block: .9rem; border-block-start: 1px solid var(--contribute-border); }
.contribute-boundary-list dt{ font-weight: 900; }
.contribute-boundary-list dd{ margin: 0; color: var(--contribute-muted); }
.contribute-boundary-note{ margin: 1.25rem 0 0; padding: 1rem; border-radius: .8rem; background: color-mix(in srgb, var(--contribute-accent) 7%, var(--contribute-canvas)); color: var(--contribute-muted); font-size: .9rem; }

.contribute-section{ padding-block: clamp(4rem, 8vw, 7rem); }
.contribute-section--raised{ border-block: 1px solid var(--contribute-border); background: color-mix(in srgb, var(--contribute-surface) 43%, transparent); }
.contribute-section-heading{ display: grid; grid-template-columns: minmax(0, .9fr) minmax(18rem, .55fr); gap: 2rem 5rem; align-items: end; margin-block-end: 2.25rem; }
.contribute-section-heading--actions{ grid-template-columns: minmax(0,1fr) auto; align-items: end; }
.contribute-section-heading h2{ margin: 0; max-inline-size: 18ch; font-size: clamp(2rem, 4vw, 3.65rem); line-height: 1.06; letter-spacing: -.035em; }
[dir="rtl"] .contribute-section-heading h2{ letter-spacing: 0; line-height: 1.22; max-inline-size: 20ch; }
.contribute-section-heading > p,
.contribute-section-heading > div > p:last-child{ margin: 0; color: var(--contribute-muted); line-height: 1.75; }

.contribute-path-grid{ display: grid; grid-template-columns: repeat(12, minmax(0,1fr)); gap: 1rem; }
.contribute-path-card{ grid-column: span 4; min-block-size: 18rem; position: relative; overflow: hidden; border: 1px solid var(--contribute-border); border-radius: var(--contribute-radius); padding: 1.5rem; background: linear-gradient(145deg, color-mix(in srgb, var(--contribute-surface-strong) 87%, transparent), color-mix(in srgb, var(--contribute-surface) 95%, transparent)); transition: transform .18s ease, border-color .18s ease; }
.contribute-path-card:nth-child(4),
.contribute-path-card:nth-child(5){ grid-column: span 6; }
.contribute-path-card::after{ content: ""; position: absolute; inset-inline-end: -3rem; inset-block-end: -4rem; inline-size: 10rem; block-size: 10rem; border-radius: 50%; background: var(--xps-color-surface-raised); }
.contribute-path-card:hover{ transform: translateY(-4px); border-color: color-mix(in srgb, var(--contribute-accent) 50%, var(--contribute-border)); }
.contribute-path-icon{ display: grid; place-items: center; inline-size: 3.1rem; block-size: 3.1rem; border: 1px solid color-mix(in srgb, var(--contribute-accent) 34%, var(--contribute-border)); border-radius: .9rem; background: var(--xps-color-canvas-deep); color: var(--contribute-accent); font-family: var(--xps-ds-font-mono, monospace); font-size: 1.15rem; font-weight: 900; }
.contribute-path-code{ margin: 2.15rem 0 .35rem; color: var(--contribute-accent); font: 800 .7rem/1.4 var(--xps-ds-font-mono, monospace); letter-spacing: .08em; }
.contribute-path-card h3{ margin: 0; font-size: 1.35rem; }
.contribute-path-card p:last-child{ color: var(--contribute-muted); line-height: 1.7; }

.contribute-opportunity-filter{ min-inline-size: min(100%, 21rem); }
.contribute-opportunity-filter label{ display: block; margin-block-end: .4rem; color: var(--contribute-muted); font-size: .82rem; font-weight: 800; }
.contribute-opportunity-filter > div{ display: flex; gap: .6rem; }
.contribute-opportunity-filter select{ min-block-size: 2.75rem; flex: 1; border: 1px solid var(--contribute-border); border-radius: .75rem; padding-inline: .8rem; background: var(--contribute-surface-strong); color: var(--contribute-ink); }
.contribute-status{ min-block-size: 3rem; display: flex; align-items: center; gap: .7rem; color: var(--contribute-muted); }
.contribute-status__dot{ inline-size: .65rem; block-size: .65rem; border-radius: 50%; background: var(--contribute-accent); box-shadow: 0 0 0 .35rem var(--xps-shadow-color); }
.contribute-opportunity-grid{ display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }
.contribute-opportunity-card{ min-inline-size: 0; display: flex; flex-direction: column; border: 1px solid var(--contribute-border); border-radius: var(--contribute-radius); padding: 1.35rem; background: var(--contribute-surface); }
.contribute-opportunity-card__meta{ display: flex; flex-wrap: wrap; gap: .45rem; margin-block-end: 1rem; }
.contribute-opportunity-card__badge{ border: 1px solid var(--contribute-border); border-radius: 999px; padding: .28rem .55rem; color: var(--contribute-muted); font: 800 .7rem/1.2 var(--xps-ds-font-mono, monospace); }
.contribute-opportunity-card h3{ margin: 0; font-size: 1.28rem; line-height: 1.25; }
.contribute-opportunity-card__objective{ color: var(--contribute-muted); line-height: 1.65; }
.contribute-opportunity-card dl{ display: grid; grid-template-columns: auto minmax(0,1fr); gap: .3rem .8rem; margin-block: auto 1.2rem; font-size: .85rem; }
.contribute-opportunity-card dt{ color: var(--contribute-muted); }
.contribute-opportunity-card dd{ margin: 0; font-weight: 800; overflow-wrap: anywhere; }
.contribute-opportunity-card .contribute-secondary-button{ inline-size: 100%; }
.contribute-empty-state{ display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 1.25rem; border: 1px dashed color-mix(in srgb, var(--contribute-accent) 40%, var(--contribute-border)); border-radius: var(--contribute-radius); padding: 1.5rem; background: color-mix(in srgb, var(--contribute-accent) 4%, var(--contribute-surface)); }
.contribute-empty-state__mark{ display: grid; place-items: center; inline-size: 3rem; block-size: 3rem; border-radius: 50%; border: 1px solid var(--contribute-border); color: var(--contribute-accent); font-size: 1.5rem; }
.contribute-empty-state h3{ margin: 0; }
.contribute-empty-state p{ margin: .4rem 0 0; color: var(--contribute-muted); }
.contribute-inline-error{ margin-block: 1rem; border: 1px solid var(--xps-ds-danger, var(--xps-color-border-strong)); border-radius: .8rem; padding: 1rem; background: color-mix(in srgb, var(--xps-ds-danger, var(--xps-color-status-danger-surface)) 8%, var(--contribute-surface)); }

.contribute-process{ list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); border-block: 1px solid var(--contribute-border); }
.contribute-process li{ display: grid; gap: 1.75rem; align-content: start; padding: 1.5rem; border-inline-end: 1px solid var(--contribute-border); }
.contribute-process li:last-child{ border-inline-end: 0; }
.contribute-process li > span{ color: var(--contribute-accent); font: 900 .78rem/1 var(--xps-ds-font-mono, monospace); }
.contribute-process h3{ margin: 0; font-size: 1.2rem; }
.contribute-process p{ color: var(--contribute-muted); line-height: 1.7; }

.contribute-section--registration{ position: relative; border-block-start: 1px solid var(--contribute-border); background: radial-gradient(circle at 20% 0%, var(--xps-color-canvas-deep), transparent 32%), color-mix(in srgb, var(--contribute-surface) 42%, var(--contribute-canvas)); }
.contribute-registration-layout{ display: grid; grid-template-columns: minmax(0,.75fr) minmax(22rem,1fr); gap: clamp(2rem,7vw,6rem); align-items: start; }
.contribute-registration-intro h2{ margin: 0; max-inline-size: 13ch; font-size: clamp(2.2rem,4.5vw,4rem); line-height: 1.05; }
.contribute-registration-intro > p:not(.contribute-eyebrow){ color: var(--contribute-muted); line-height: 1.75; }
.contribute-mini-steps{ list-style: none; padding: 0; margin: 2rem 0; display: grid; gap: .85rem; }
.contribute-mini-steps li{ display: grid; grid-template-columns: 2rem minmax(0,1fr); gap: .8rem; align-items: center; }
.contribute-mini-steps strong{ display: grid; place-items: center; inline-size: 2rem; block-size: 2rem; border: 1px solid color-mix(in srgb, var(--contribute-accent) 40%, var(--contribute-border)); border-radius: 50%; color: var(--contribute-accent); font-size: .78rem; }
.contribute-resume-card{ margin-block-start: 1.5rem; border: 1px solid color-mix(in srgb, var(--contribute-accent) 45%, var(--contribute-border)); border-radius: 1rem; padding: 1.2rem; background: var(--xps-color-surface-raised); }
.contribute-resume-card p{ color: var(--contribute-muted); }
.contribute-registration-card{ border: 1px solid color-mix(in srgb, var(--contribute-accent) 20%, var(--contribute-border)); border-radius: var(--contribute-radius); padding: clamp(1rem,3vw,1.75rem); background: color-mix(in srgb, var(--contribute-surface-strong) 95%, transparent); box-shadow: var(--contribute-shadow); }
.contribute-mode-switch{ display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .35rem; margin-block-end: 1.25rem; padding: .35rem; border-radius: .9rem; background: var(--contribute-canvas); }
.contribute-mode-switch button{ min-block-size: 2.85rem; border: 0; border-radius: .68rem; background: transparent; color: var(--contribute-muted); font-weight: 850; cursor: pointer; }
.contribute-mode-switch button[aria-selected="true"]{ background: var(--contribute-surface-strong); color: var(--contribute-ink); box-shadow: 0 .25rem .8rem var(--xps-shadow-color); }
.contribute-form{ gap: 1rem; }
.contribute-form label span{ font-size: .88rem; }
.contribute-form input{ background: color-mix(in srgb, var(--contribute-canvas) 70%, var(--contribute-surface)); }
.contribute-form .contribute-primary-button{ inline-size: 100%; margin-block-start: .35rem; }
.contribute-field-help,
.contribute-privacy-note{ margin: -.3rem 0 .3rem; color: var(--contribute-muted); font-size: .8rem; line-height: 1.6; }
.contribute-verification-callout{ border-inline-start: .25rem solid var(--contribute-accent); padding-inline-start: 1rem; }
.contribute-verification-callout p{ margin: .35rem 0 0; color: var(--contribute-muted); }
.contribute-form-message{ min-block-size: .5rem; margin-block-end: .75rem; }
.contribute-form-message:empty{ display: none; }
.contribute-form-message .xps-ds{ inline-size: 100%; }

@media (max-width: 68rem) {
  .contribute-hero__grid,
.contribute-registration-layout{ grid-template-columns: 1fr; }
  .contribute-boundary-card{ max-inline-size: 42rem; }
  .contribute-path-card{ grid-column: span 6; }
  .contribute-path-card:last-child{ grid-column: span 12; }
  .contribute-opportunity-grid{ grid-template-columns: repeat(2,minmax(0,1fr)); }
  .contribute-process{ grid-template-columns: repeat(2,minmax(0,1fr)); }
  .contribute-process li:nth-child(2){ border-inline-end: 0; }
  .contribute-process li:nth-child(-n/**/+2){ border-block-end: 1px solid var(--contribute-border); }
}

@media (max-width: 48rem) {
  .contribute-shell{ width: min(100% - 1rem, 78rem); }
  .contribute-link-button{ display: none; }
  .contribute-hero{ padding-block-start: 3.25rem; }
  .contribute-hero h1{ font-size: clamp(2.55rem, 13vw, 4rem); }
  .contribute-hero__actions > *{ inline-size: 100%; }
  .contribute-section-heading,
.contribute-section-heading--actions{ grid-template-columns: 1fr; align-items: start; }
  .contribute-path-grid,
.contribute-opportunity-grid{ grid-template-columns: 1fr; }
  .contribute-path-card,
.contribute-path-card:nth-child(4),
.contribute-path-card:nth-child(5),
.contribute-path-card:last-child{ grid-column: auto; min-block-size: auto; }
  .contribute-opportunity-filter{ min-inline-size: 0; inline-size: 100%; }
  .contribute-opportunity-filter > div{ flex-direction: column; }
  .contribute-empty-state{ grid-template-columns: 1fr; }
  .contribute-empty-state .contribute-secondary-button{ inline-size: 100%; }
  .contribute-process{ grid-template-columns: 1fr; }
  .contribute-process li{ border-inline-end: 0; border-block-end: 1px solid var(--contribute-border); }
  .contribute-process li:last-child{ border-block-end: 0; }
  .contribute-mode-switch{ grid-template-columns: 1fr; }
}

@media (max-width: 23rem) {
  .contribute-icon-button{ inline-size: 100%; }
  .contribute-boundary-list > div{ grid-template-columns: 1fr; gap: .25rem; }
}


@media (max-width: 48rem) {
  .contributor-context-nav{ position: static; }
  .contributor-context-nav__inner{ min-block-size: auto; padding-block: .55rem; gap: .65rem; flex-wrap: wrap; }
  .contributor-context-nav__home{ flex: 1 1 auto; }
  .contributor-context-nav__links{ order: 3; flex: 1 0 100%; overflow-x: auto; padding-block-end: .2rem; scrollbar-width: thin; }
  .contributor-context-nav__links a{ white-space: nowrap; }
  .contributor-context-nav__signin{ margin-inline-start: auto; }
}
@media (prefers-reduced-motion: reduce) {
  html{ scroll-behavior: auto; }
  .contribute-primary-button,
.contribute-path-card{ transition: none; }
  .contribute-primary-button:hover,
.contribute-path-card:hover{ transform: none; }
}

@media (forced-colors: active) {
  .contribute-boundary-card,
.contribute-path-card,
.contribute-opportunity-card,
.contribute-registration-card,
.contribute-empty-state{ border-color: CanvasText; }
  .contribute-primary-button{ background: ButtonFace; color: ButtonText; }
}

/* Public registration R01: account availability and optional invitation
   context are projected independently from the live runtime policy. */
.contribute-registration-policy{
  display: grid;
  gap: .55rem;
  margin-block-end: 1rem;
  padding: .9rem 1rem;
  border: 1px solid var(--contribute-border);
  border-radius: calc(var(--contribute-radius) * .7);
  background: color-mix(in srgb, var(--contribute-surface) 88%, transparent);
}
.contribute-registration-policy__badge{
  justify-self: start;
  display: inline-flex;
  align-items: center;
  min-block-size: 1.75rem;
  padding-inline: .65rem;
  border: 1px solid currentColor;
  border-radius: 999px;
  font-size: .74rem;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.contribute-registration-policy p{ margin: 0; color: var(--contribute-muted); line-height: 1.55; }
.contribute-registration-card[data-registration-mode="open"] .contribute-registration-policy__badge{ color: var(--contribute-accent); }
.contribute-registration-card[data-registration-mode="closed"] .contribute-registration-policy__badge,
.contribute-registration-card[data-registration-mode="unavailable"] .contribute-registration-policy__badge{ color: var(--contribute-danger, var(--xps-color-text-inverse)); }
.contribute-registration-card button:disabled{ cursor: not-allowed; opacity: .55; }
#invite-token-field input{ direction: ltr; text-align: start; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }

.contribute-invitation-option{
  display:flex; align-items:flex-start; gap:.7rem; padding:.85rem 1rem;
  border:1px solid var(--contribute-border); border-radius:calc(var(--contribute-radius) * .62);
  background:color-mix(in srgb, var(--contribute-surface) 90%, transparent); cursor:pointer;
}
.contribute-invitation-option input{ inline-size:1.15rem; block-size:1.15rem; margin-block-start:.15rem; flex:0 0 auto; }
.contribute-invitation-option span{ line-height:1.5; font-weight:700; }

/* PRODUCT-UX-R01: explicit contributor entry lanes without changing authority. */
.contribute-entry-actions{align-items:stretch}
.contribute-entry-actions>a{min-inline-size:10.5rem}
.contribute-existing-account-callout{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-block-end:1.25rem;padding:1rem;border:1px solid var(--contribute-border);border-radius:.9rem;background:color-mix(in srgb,var(--contribute-accent) 5%,var(--contribute-surface))}
.contribute-existing-account-callout strong{display:block}.contribute-existing-account-callout p{margin:.3rem 0 0;color:var(--contribute-muted);font-size:.9rem;line-height:1.55;max-inline-size:33rem}
@media(max-width:42rem){.contribute-existing-account-callout{align-items:stretch;flex-direction:column}.contribute-existing-account-callout>a{inline-size:100%}.contribute-entry-actions>a{flex:1 1 100%}}
