/* Match Desk, deck skin (2026-10-11). Per the founder: "improve the font and
   feel of the questionnaire". It takes the pitch deck's look: one family
   (Avenir Next; Nunito Sans where it is not installed), bold black
   questions, grey help text, the brand red as the one accent, rounded cards
   with round checks, and no newsprint texture or double rules.
   Loaded after the inline desk styles in spar.html, so every rule here is a
   skin over them: steps, layout and behaviour stay where they are. Colours
   go through the --mp-* tokens so the dark desk keeps working; sizes are
   set inside media queries so the phone sizes in spar.html still apply. */
.afl.match-profile-flow,
.match-profile-card{
  --mp-font:Avenir Next,Avenir,Nunito Sans,Inter,system-ui,sans-serif;
}
.afl.match-profile-flow{
  --mp-paper:#ffffff;--mp-tint:#f6f5f2;--mp-tint-deep:#ecebe6;
  --mp-ink:#111111;--mp-ink-2:#4b4b4b;--mp-muted:#6b6b6b;
  --mp-rule:#e4e2dc;--mp-rule-mid:#c9c6bd;
  --mp-red:#d9272e;--mp-red-fill:#d9272e;--mp-red-fill-hover:#b91f25;
  --mp-select:#fdf0ef;--mp-rail:rgba(255,255,255,.94);
  --mp-blue:var(--mp-ink);
  font-family:var(--mp-font);
}
html:not([data-theme="light"]) .afl.match-profile-flow{--mp-blue:var(--mp-ink)}
.afl.match-profile-flow::before,
.afl.match-profile-flow::after{display:none}

/* Masthead: one hairline, no newspaper rules. */
.match-profile-flow .mp-masthead{border-top:0;border-bottom:1px solid var(--mp-rule)}
.mp-masthead__name{font-family:var(--mp-font);font-weight:700;letter-spacing:-.01em}
.mp-masthead__live{font-family:var(--mp-font);font-weight:600;letter-spacing:.01em;text-transform:none;color:var(--mp-muted)}
.mp-masthead__privacy{font-family:var(--mp-font);letter-spacing:.04em}
.mp-masthead__line{border-top:1px solid var(--mp-rule);letter-spacing:.02em;text-transform:none}
.mp-masthead__line em{font-family:var(--mp-font);font-style:normal;font-weight:600}
.mp-lighting{border-radius:12px}
.mp-lighting__row{border-radius:999px;overflow:hidden}
.mp-lighting__btn{font-family:var(--mp-font);letter-spacing:.02em;text-transform:none}

/* Progress rail. */
.match-profile-flow .afl-dot{height:4px;border-radius:999px}
.match-profile-flow .afl-btn{border-radius:999px;font-family:var(--mp-font);font-weight:600;letter-spacing:0}

/* Step label: a quiet count, not a red masthead. */
.match-profile-flow .afl-step{font-family:var(--mp-font);font-weight:600;letter-spacing:.01em;text-transform:none;
  color:var(--mp-muted);border-bottom:0;padding-bottom:0}
.match-profile-flow .afl-step::before{content:none}

/* The question reads like a deck headline. */
.match-profile-flow .afl-q{font-family:var(--mp-font) !important;font-weight:700;letter-spacing:-.015em;line-height:1.1}
.match-profile-flow .afl-hint{font-family:var(--mp-font);color:var(--mp-muted)}

/* Options: separate rounded cards with round checks. */
.match-profile-flow .afl-opts{gap:10px;background:none;border:0}
.match-profile-flow .afl-opt{border:1px solid var(--mp-rule);border-radius:14px;background:var(--mp-paper);
  transition:border-color .12s,box-shadow .12s,background .12s}
.match-profile-flow .afl-opt:hover{background:var(--mp-paper);border-color:var(--mp-ink);box-shadow:none}
.match-profile-flow .afl-opt[aria-checked="true"]{background:var(--mp-select);border-color:var(--mp-red);box-shadow:0 0 0 1px var(--mp-red)}
.match-profile-flow .afl-opt-t{font-family:var(--mp-font);font-weight:700;letter-spacing:-.005em}
.match-profile-flow .afl-opt-s{color:var(--mp-muted)}
.match-profile-flow .afl-opt-mark{border-radius:50%;border-width:2px;font-family:var(--mp-font)}
.match-profile-flow .afl-opt[aria-checked="true"] .afl-opt-mark{background:var(--mp-red);border-color:var(--mp-red);color:#fff}
.match-profile-flow .mp-opt--custom{background:var(--mp-tint)}
.match-profile-flow .mp-opt--skip{background:var(--mp-tint)}
.match-profile-flow .mp-opt--skip .afl-opt-t{font-family:var(--mp-font);font-weight:600;letter-spacing:.01em;text-transform:none}
.match-profile-flow .mp-opt--skip[aria-checked="true"]{border-color:var(--mp-muted);box-shadow:0 0 0 1px var(--mp-muted)}
.match-profile-flow .afl-aside .mp-opt--skip{border-radius:999px;border:1px solid var(--mp-rule-mid);background:var(--mp-paper)}
.match-profile-flow .afl-aside .mp-opt--skip:hover{background:var(--mp-tint);box-shadow:none;border-color:var(--mp-ink)}
.match-profile-flow .afl-write-area{border-radius:12px;font-family:var(--mp-font)}

/* Buttons. */
.match-profile-flow .afl-next{border-radius:14px;font-family:var(--mp-font)}
.match-profile-flow .afl-next b{font-weight:700;letter-spacing:0;text-transform:none}
.match-profile-flow .afl-back{font-family:var(--mp-font)}
.match-profile-flow .mp-skip-bar{border-top-color:var(--mp-rule)}
.match-profile-flow .mp-skip-big{border-radius:14px;font-family:var(--mp-font);box-shadow:0 8px 20px rgba(217,39,46,.2)}
.match-profile-flow .mp-skip-big b{font-weight:700;letter-spacing:0}
.match-profile-flow .mp-wait__status,
.match-profile-flow .mp-wait__dismiss{font-family:var(--mp-font)}

/* The review step. */
.match-profile-flow .afl-panel--launch .afl-hint{font-family:var(--mp-font);font-style:normal}
.match-profile-flow .afl-summary{gap:8px;background:none;border:0}
.match-profile-flow .afl-summary li{border:1px solid var(--mp-rule);border-radius:12px}
.match-profile-flow .afl-summary b{font-family:var(--mp-font);font-weight:700}
.mp-ai-summary{border-left:0;border-radius:14px}
.mp-ai-summary h3{font-family:var(--mp-font);font-weight:700}
.mp-ai-summary__copy{border-radius:999px}
.match-profile-flow .afl-go{border-radius:14px;background:var(--mp-red)}
.match-profile-flow .afl-go:hover{background:var(--mp-red-fill-hover)}

/* The profile card on /spar that reopens the desk. */
.match-profile-title strong{font-family:var(--mp-font)}

/* Sizes. Desktop gets a deck-sized question; the phone keeps spar.html's
   px sizes (see the 16px-floor note there) and only loses the caps. */
@media(min-width:621px){
  .match-profile-flow .afl-q{font-size:clamp(32px,3.6vw,54px)}
  .match-profile-flow .afl-step{font-size:14px}
  .match-profile-flow .afl-opt-t{font-size:19px}
}
@media(max-width:620px){
  .match-profile-flow .afl-step{font-size:13px;letter-spacing:.01em}
  .match-profile-flow .afl-opts{gap:8px}
}