/* Plain CSS. The content and forms work without JavaScript. */
:root {
  --dashboard-paper: #fafbf8;
  --dashboard-surface: #ffffff;
  --dashboard-ink: #25343b;
  --dashboard-muted: #56666c;
  --dashboard-line: #dbe2df;
  --dashboard-field-line: #79877f;
  --dashboard-lime: #ddeb91;
  --dashboard-sage: #eaf0eb;
  --dashboard-radius: 10px;
}
:root { color-scheme: light; --paper: #f8f7f0; --ink: #253d35; --muted: #59625b; --line: #c9cdc1; --green: #285543; --wash: #e9eddf; --error: #9a3029; --peach: #f6d9c9; --sky: #dceaf2; --citrus: #e7edbe; --yellow: #f5e5a7; --green-dark: #203c30; --line-strong: #7b877a; --field: #fffef9; --card: #f0f2db; --question: #f0f0e4; --sky-edge: #6f96b2; --peach-edge: #bc6348; --citrus-edge: #819947; --yellow-edge: #c5a544; --on-green: #ffffff; --on-green-accent: #c9dc86; --on-green-muted: #ffffffcc; --on-green-line: #ffffff30; --focus: #ad4c25; --text-xs: .75rem; --text-sm: .875rem; --text-base: 1rem; --text-md: 1.1875rem; --text-lg: 1.35rem; --text-xl: 1.75rem; --text-lead: clamp(1.2rem, 2vw, 1.6rem); --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 20px; --space-6: 24px; --space-7: 32px; --space-8: 40px; --space-9: 48px; --space-10: 64px; --space-11: 80px; --radius: 4px; --leaf-card: 4px 24px 4px 4px; --leaf-panel: 4px 48px 4px 4px; --heading-display: clamp(2.6rem, 5.2vw, 4.5rem); --heading-1: clamp(2.3rem, 4.5vw, 3.5rem); --heading-2: clamp(1.6rem, 2.6vw, 2.2rem); --heading-3: 1.35rem; --heading-4: 1.1rem; }
* { box-sizing: border-box; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: var(--text-md); line-height: 1.6; }
a { color: var(--green); text-underline-offset: .22em; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
a, button, input, textarea, select { touch-action: manipulation; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 5px; }
.wrap { width: min(1120px, calc(100% - 96px)); margin-inline: auto; }
.narrow { max-width: 720px; margin-inline: auto; }
p { margin: 0 0 1.2em; }
h1, h2, h3, h4 { margin: 0 0 .5em; text-wrap: balance; }
h1 { font-family: Georgia, "Times New Roman", serif; font-weight: 400; font-size: var(--heading-1); line-height: 1.1; letter-spacing: -.045em; }
h1 em { font-weight: 400; }
h2, h3, h4 { font-weight: 600; }
h2 { font-size: var(--heading-2); line-height: 1.2; letter-spacing: -.03em; }
h3 { font-size: var(--heading-3); line-height: 1.3; letter-spacing: -.02em; }
h4 { font-size: var(--heading-4); line-height: 1.35; letter-spacing: -.01em; }
/* Serif marks a human, conversational moment. Page titles (h1) are always serif. */
.heading-serif { font-family: Georgia, "Times New Roman", serif; font-weight: 400; letter-spacing: -.04em; }
.site-header { min-height: 120px; display: flex; gap: var(--space-6); align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }
.wordmark { display: inline-flex; align-items: center; gap: var(--space-4); color: var(--ink); text-decoration: none; font-size: var(--text-md); font-weight: 600; letter-spacing: -.025em; }
.brand-mark { display: block; width: 44px; height: 44px; border-radius: var(--radius); object-fit: cover; flex-shrink: 0; }
.pilot-label, .eyebrow, .small-note, .hint { color: var(--muted); font-size: var(--text-base); }
.pilot-label { text-align: right; }
.eyebrow { letter-spacing: .09em; text-transform: uppercase; font-size: var(--text-sm); font-weight: 600; margin-bottom: var(--space-6); }
.intro { font-size: var(--text-lg); line-height: 1.5; max-width: 720px; }
.actions { display: flex; flex-wrap: wrap; gap: var(--space-4) var(--space-7); align-items: center; margin: var(--space-7) 0 var(--space-5); }
.button { display: inline-block; font: inherit; font-weight: 500; text-decoration: none; text-align: center; padding: var(--space-4) var(--space-6); min-height: 54px; border: 1px solid var(--green); border-radius: var(--radius); background: var(--green); color: var(--on-green); cursor: pointer; }
.button:hover { background: var(--green-dark); text-decoration: none; }
.button.secondary { color: var(--green); background: transparent; }
.button.secondary:hover { background: var(--wash); }
/* Small: compact header actions such as "Edit profile". Ghost: back links, border shows on hover only. */
.button.small { font-size: var(--text-sm); padding: var(--space-2) var(--space-4); min-height: 44px; display: inline-flex; align-items: center; }
.button.small.secondary { border-color: var(--line); }
.button.ghost { color: var(--green); background: transparent; border-color: transparent; }
.button.ghost:hover { background: transparent; border-color: var(--line); }
.button.ghost.back { margin-inline-start: calc(-1 * var(--space-4)); }
.prose p { max-width: 65ch; }
.prose h2 { font-size: var(--heading-2); margin-top: 1.5em; }
.how-section { padding: var(--space-10) 0 var(--space-11); border-top: 1px solid var(--line); }
.steps { margin: var(--space-9) 0 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-8); counter-reset: steps; }
.steps li { counter-increment: steps; }
.steps li::before { content: "0" counter(steps); display: block; color: var(--muted); font-family: Georgia, serif; font-size: var(--text-xl); margin-bottom: var(--space-6); }
.steps p { margin: 0; }
.closing { padding: var(--space-9); background: var(--wash); border-radius: var(--radius); margin-bottom: var(--space-11); }
.closing p { max-width: 720px; }
.closing .actions { margin-bottom: 0; }
.site-footer { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-4); padding: var(--space-7) 0 var(--space-8); border-top: 1px solid var(--line); font-size: var(--text-base); color: var(--muted); }
.site-footer p { margin: 0; }
.page-intro { padding: var(--space-10) 0; }
.page-intro.compact { padding: var(--space-7) 0; }
.form-page { padding-bottom: var(--space-11); }
.back-link { font-size: var(--text-base); margin: var(--space-7) 0 0; }
.form-page form + p { margin-top: var(--space-6); }
.company-wizard [hidden] { display: none !important; }
.company-wizard [data-company-step]:focus { outline: none; }
.company-progress { scroll-margin-top: var(--space-5); }
.company-progress .eyebrow { margin-bottom: var(--space-3); }
.company-progress ol { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--space-2); list-style: none; padding: 0; margin: 0; }
.company-progress li { border-top: 4px solid var(--line); padding-top: var(--space-2); font-size: var(--text-sm); color: var(--muted); }
.company-progress li[aria-current], .company-progress li.is-complete { border-color: var(--green); color: var(--green); }
.company-progress li[aria-current] { font-weight: 700; }
.company-wizard-actions { justify-content: space-between; }
.company-wizard-actions [data-company-next], .company-wizard-actions [data-company-submit] { margin-left: auto; }
@media (max-width: 480px) { .company-progress li { font-size: var(--text-xs); } }
fieldset { border: 0; border-top: 1px solid var(--line); padding: var(--space-7) 0 var(--space-3); margin: var(--space-7) 0 0; min-width: 0; }
legend { font-size: var(--text-lg); font-weight: 600; padding: 0 var(--space-5) 0 0; }
.section-number { font-weight: 400; color: var(--muted); margin-right: var(--space-3); font-family: Georgia, serif; }
.field { margin-bottom: var(--space-7); }
label { display: block; font-weight: 500; margin-bottom: var(--space-2); }
.hint { margin-bottom: var(--space-3); line-height: 1.5; }
input:not([type=submit], [type=checkbox], [type=radio]), textarea, select { display: block; width: 100%; font: inherit; color: var(--ink); background: var(--field); border: 1px solid var(--line-strong); border-radius: var(--radius); padding: var(--space-3) var(--space-4); min-height: 54px; }
textarea { resize: vertical; }
select { white-space: normal; }
[aria-invalid=true] { border-color: var(--error) !important; border-width: 2px !important; }
.consent { display: grid; grid-template-columns: 25px 1fr; gap: var(--space-2) var(--space-4); margin: var(--space-5) 0; }
.consent input { width: 23px; height: 23px; margin: var(--space-1) 0 0; accent-color: var(--green); }
.consent label { font-weight: 400; }
.consent .field-error { grid-column: 2; }
.honeypot { display: none; }
.field-error { font-size: var(--text-base); color: var(--error); margin: var(--space-2) 0 0; }
.error-summary { border: 2px solid var(--error); padding: var(--space-6); margin-bottom: var(--space-7); }
.error-summary h2 { font-size: var(--heading-2); }
.error-summary a { color: var(--error); }
.notice { margin-top: var(--space-6); padding: var(--space-5); background: var(--wash); }
.skip-link { position: absolute; left: 16px; top: -200px; background: white; padding: var(--space-3); z-index: 10; }
.skip-link:focus { top: 16px; }
.filters { display: flex; flex-wrap: wrap; gap: var(--space-5); align-items: end; margin-bottom: var(--space-7); }
.filters > div { flex: 1; min-width: 220px; }
.application-list { padding: 0; list-style: none; }
.application-list li { border-top: 1px solid var(--line); padding: var(--space-7) 0; display: flex; justify-content: space-between; align-items: start; gap: var(--space-6); }
.application-list .eyebrow { margin-bottom: var(--space-3); }
.application-list h2 { font-size: var(--heading-2); overflow-wrap: anywhere; }
.application-list p { margin-bottom: 0; }
.status { display: inline-block; background: var(--wash); font-size: var(--text-base); padding: var(--space-1) var(--space-3); border-radius: var(--radius); white-space: nowrap; }
.answers { margin: 0 0 var(--space-9); }
.answers dt { font-weight: 600; border-top: 1px solid var(--line); padding-top: var(--space-6); margin-top: var(--space-6); }
.answers dd { margin: var(--space-2) 0 0; overflow-wrap: anywhere; }
.answers p { margin-bottom: .7em; }
.review { padding: var(--space-7) 0 var(--space-10); border-top: 1px solid var(--line); }
.empty-state { padding: var(--space-8) 0; border-block: 1px solid var(--line); }
@media (max-width: 760px) {
  .wrap { width: calc(100% - 40px); }
  .site-header { min-height: 90px; }
  .pilot-label { max-width: 145px; font-size: var(--text-sm); }
  .wordmark { font-size: var(--text-base); gap: var(--space-2); }
  .brand-mark { width: 36px; height: 36px; }
  .intro { font-size: var(--text-lg); }
  .steps { grid-template-columns: 1fr; gap: var(--space-7); }
  .steps li::before { margin-bottom: var(--space-3); }
  .how-section { padding: var(--space-8) 0; }
  .closing { padding: var(--space-7) var(--space-6); margin-bottom: var(--space-8); }
  .application-list li { flex-direction: column; gap: var(--space-3); }
  .page-intro { padding: var(--space-9) 0; }
}
@media (max-width: 380px) {
  .pilot-label { display: none; }
  .actions .button { width: 100%; }
}

/* The home page opens like a practical invitation, with two equal ways in. */
.home-header { min-height: 102px; border-bottom: 2px solid var(--ink); }
.home-header .pilot-label { color: var(--muted); }
.home-opening { color: var(--ink); display: grid; grid-template-columns: 1fr 1.15fr; gap: 100px; padding: var(--space-9) 0 var(--space-10); }
.opening-label { font-size: var(--text-base); margin-bottom: var(--space-6); color: var(--muted); }
.home-opening h1 { font-size: var(--heading-1); text-wrap: initial; }
.opening-context > p:not(.opening-label) { max-width: 38ch; }
.opening-note { font-size: var(--text-base); color: var(--muted); padding-top: var(--space-5); margin-bottom: 0; }
.opening-invitation { padding-top: var(--space-9); }
.opening-questions { font-size: var(--heading-2); line-height: 1.25; letter-spacing: -.035em; margin-bottom: var(--space-8); }
.opening-questions span { display: block; margin-bottom: var(--space-3); }
.opening-links { border-top: 1px solid var(--line-strong); }
.opening-links a { color: var(--green); display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-5); padding: var(--space-5) 0; border-bottom: 1px solid var(--line-strong); text-decoration: none; font-size: var(--text-md); }
.opening-links a:hover span:first-child { text-decoration: underline; text-underline-offset: .22em; }
.opening-links a > span:last-child { font-size: var(--text-lg); }
.home-purpose { display: grid; grid-template-columns: 1fr 1.15fr; gap: 100px; color: var(--ink); padding: var(--space-9) 0 var(--space-9); border-top: 2px solid var(--ink); }
.home-purpose h2 { font-size: var(--heading-2); }
.home-purpose .prose { padding-top: var(--space-9); }
@media (max-width: 900px) {
  .home-opening, .home-purpose { gap: var(--space-9); }
}
@media (max-width: 650px) {
  .home-header { min-height: 90px; gap: var(--space-5); }
  .home-header .pilot-label { max-width: 130px; }
  .home-opening, .home-purpose { grid-template-columns: 1fr; gap: var(--space-7); }
  .home-opening { padding: var(--space-7) 0 var(--space-8); }
  .opening-label { margin-bottom: var(--space-5); }
  .opening-note { padding-top: 0; }
  .opening-invitation, .home-purpose .prose { padding-top: 0; }
  .opening-questions { font-size: var(--text-xl); margin-bottom: var(--space-7); }
  .home-purpose { padding: var(--space-7) 0; gap: var(--space-3); }
}
.about-page { padding: var(--space-9) 0 var(--space-11); }
.about-page h1 { font-size: var(--heading-1); }
.about-page p { max-width: 65ch; }
.about-page .opening-links { margin-top: var(--space-8); }
.campaign-opening { padding-top: var(--space-10); }
.campaign-opening .opening-invitation { padding-top: 0; }
.campaign-opening .opening-questions { font-size: var(--text-lead); margin-top: var(--space-8); }
.join-heading { font-size: var(--heading-3); margin-top: var(--space-7); }
@media (max-width: 650px) {
  .campaign-opening { padding-top: var(--space-7); gap: var(--space-3); }
}

/* Profile choices stay readable and usable without JavaScript. */
.check-choice { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: var(--space-3); padding: var(--space-3) 0; }
.check-choice input { width: 22px; height: 22px; margin: var(--space-1) 0 0; accent-color: var(--green); }
.check-choice label { font-weight: 400; margin: 0; overflow-wrap: anywhere; }
summary { cursor: pointer; padding: var(--space-4) 0; font-weight: 600; }
.sdg-goal, .optional-section { border-bottom: 1px solid var(--line); }
.sdg-goal .check-choice { padding: var(--space-4) 0; }
.repeat-entry { border-left: 2px solid var(--line); padding: var(--space-5); margin-bottom: var(--space-6); }
.repeat-entry legend { font-size: var(--text-md); }
.add-hint { margin-top: var(--space-3); }
.feeling-choices { display: flex; flex-wrap: wrap; gap: var(--space-3); }
.feeling-choices label { display: inline-flex; align-items: center; gap: var(--space-3); padding: var(--space-3); border: 1px solid var(--line); border-radius: var(--radius); }
input[type=radio] { width: 22px; height: 22px; accent-color: var(--green); }
.answers ul { padding-left: var(--space-6); }
.feeling-choice { display: flex; align-items: center; gap: var(--space-2); }
.feeling-choice label { margin: 0; }
.optional-sections { margin: var(--space-8) 0; }
.public-profile { padding: var(--space-6) 0 var(--space-11); overflow-wrap: anywhere; }
.profile-opening { display: grid; padding-bottom: var(--space-9); grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-9); border-bottom: 1px solid var(--line); }
.profile-location { color: var(--muted); font-size: var(--text-base); margin-bottom: var(--space-3); }
.profile-website { font-size: var(--text-base); }
.profile-purpose { padding: var(--space-7); align-self: start; border-radius: var(--leaf-panel); border-top: 4px solid var(--peach-edge); }
.public-profile h2 { font-size: var(--heading-3); }
.profile-body { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: var(--space-11); padding-top: var(--space-8); }
.profile-section { margin-bottom: var(--space-8); }
.profile-section p:last-child { margin-bottom: 0; }
.profile-evidence { padding: var(--space-6); border: 1px solid var(--line); margin-top: var(--space-4); }
.profile-evidence h4 { font-size: var(--heading-4); margin-top: var(--space-6); }
.portfolio-figure { margin: var(--space-5) 0; }
.portfolio-image { display: block; width: 100%; max-height: 480px; object-fit: contain; background: var(--wash); }
.portfolio-figure figcaption { font-size: var(--text-sm); color: var(--muted); margin-top: var(--space-2); }
.project-role { margin-bottom: var(--space-2); }
.project-story { border-top: 1px solid var(--line); margin-top: var(--space-5); }
input[type=file] { max-width: 100%; font-size: var(--text-base); }
.profile-tags { display: flex; flex-wrap: wrap; gap: var(--space-2); padding: 0; list-style: none; }
.profile-tags li { font-size: var(--text-base); padding: var(--space-1) var(--space-3); border: 1px solid var(--line); border-radius: var(--radius); }
.profile-targets .eyebrow { margin-bottom: var(--space-3); }
.profile-goals { max-width: 820px; }
.profile-goals li { margin: 0 0 var(--space-5); font-size: var(--text-base); }
@media (max-width: 760px) {
  .public-profile { padding-top: var(--space-5); }
  .profile-opening, .profile-body { grid-template-columns: minmax(0, 1fr); gap: var(--space-7); }
  .profile-opening { padding-bottom: var(--space-7); }
  .profile-purpose { padding: var(--space-6); }
  .profile-body { gap: 0; }
}
.profile-main { min-width: 0; }
.skill-carousel { display: flex; gap: var(--space-4); overflow-x: auto; scroll-snap-type: x mandatory; padding: var(--space-2) var(--space-2) var(--space-4); margin-inline: -6px; }
.skill-card { flex: 0 0 100%; min-width: 0; border: 1px solid var(--line); padding: var(--space-6); scroll-snap-align: start; scroll-margin-top: 24px; display: flex; flex-direction: column; }
.skill-carousel.has-many .skill-card { flex-basis: 88%; }
.skill-card h3 a { color: var(--ink); text-decoration: none; }
.skill-card h3 a:hover { text-decoration: underline; }
.skill-preview { font-size: var(--text-base); }
.skill-read-more { margin-top: auto; font-size: var(--text-base); align-self: start; }
.skill-controls { display: grid; grid-template-columns: 44px 1fr 44px; align-items: center; text-align: center; border-top: 1px solid var(--line); margin-top: var(--space-5); padding-top: var(--space-3); }
.skill-controls a { display: grid; place-items: center; min-height: 44px; text-decoration: none; border: 1px solid var(--line); }
.skill-detail { padding-bottom: var(--space-10); overflow-wrap: anywhere; }
.skill-detail h1 { font-size: var(--heading-1); }
.skill-detail-navigation { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-6); border-top: 1px solid var(--line); padding-top: var(--space-6); margin-top: var(--space-8); font-size: var(--text-base); }
.project-thumbnail { height: 180px; object-fit: cover; margin-bottom: var(--space-5); }
.project-detail .portfolio-image { max-height: 600px; }
.quiz-page { padding: var(--space-8) 0 var(--space-10); }
.quiz-page h1 { font-size: var(--heading-1); }
.quiz-progress { display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-6); margin-bottom: var(--space-8); font-size: var(--text-base); color: var(--muted); }
.quiz-progress [aria-current] { color: var(--ink); font-weight: 650; border-bottom: 2px solid var(--green); }
.quiz-topics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); margin-bottom: var(--space-6); }
.quiz-choice { border: 1px solid var(--line); padding: var(--space-4); }
.quiz-choice:has(input:checked) { background: var(--wash); border-color: var(--green); }
.quiz-target { border-bottom: 1px solid var(--line); padding: var(--space-2) 0; }
.quiz-target details { margin-left: var(--space-8); }
.quiz-target summary, .quiz-answer summary { font-size: var(--text-base); font-weight: 400; padding: var(--space-2) 0; }
.quiz-target details p, .quiz-answer details p { font-size: var(--text-base); }
.quiz-answer { border: 1px solid var(--line); padding: var(--space-6); margin: var(--space-5) 0; }
.quiz-answer .eyebrow { margin-bottom: var(--space-3); }
.quiz-footnote { margin-top: var(--space-7); }
@media (max-width: 600px) {
  .quiz-topics { grid-template-columns: minmax(0, 1fr); }
}
.quiz-wizard { max-width: 680px; }
.quiz-wizard h1 { font-size: var(--heading-2); }
.quiz-wizard progress { width: 100%; height: 6px; accent-color: var(--green); display: block; margin: 0 0 var(--space-6); }
.wizard-options { border: 0; padding: 0; margin-top: var(--space-5); }
.wizard-options legend { margin-bottom: var(--space-3); }
.wizard-option { display: flex; align-items: center; gap: var(--space-4); padding: var(--space-4); border: 1px solid var(--line); cursor: pointer; font-size: var(--text-base); font-weight: 400; line-height: 1.4; margin-bottom: var(--space-3); }
.wizard-option input, .wizard-skip input { flex-shrink: 0; margin: 0; }
.wizard-skip { display: flex; align-items: center; gap: var(--space-4); font-size: var(--text-base); font-weight: 400; padding: var(--space-3) var(--space-4); cursor: pointer; }
.quiz-reasons { font-size: var(--text-base); padding-left: var(--space-6); }
.quiz-restart { background: none; border: 0; color: var(--green); text-decoration: underline; font: inherit; cursor: pointer; padding: 0; }
@media (max-width: 600px) {
  .quiz-wizard { padding-top: var(--space-6); }
  .quiz-wizard .eyebrow { margin-bottom: var(--space-3); }
  .quiz-wizard progress { margin-bottom: var(--space-4); }
  .wizard-options { margin-top: var(--space-4); }
  .wizard-option { padding: var(--space-3); font-size: var(--text-base); }
  .quiz-wizard .actions { margin-top: var(--space-4); }
}

/* Shared SDG reference pages. */
.site-header nav { display: flex; gap: var(--space-3) var(--space-6); font-size: var(--text-base); flex-wrap: wrap; align-items: center; }
.sdg-directory { padding-bottom: var(--space-10); overflow-wrap: anywhere; }
.sdg-intro { padding: var(--space-9) 0 var(--space-6); }
.sdg-intro h1 { font-size: var(--heading-1); }
.sdg-intro .intro { font-size: var(--text-lg); }
.sdg-search { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) auto; gap: var(--space-4); align-items: end; padding: var(--space-6); background: var(--wash); }
.sdg-search label { font-size: var(--text-base); }
.sdg-search input, .sdg-search select { font-size: var(--text-base); }
.sdg-prompts, .sdg-pagination, .sdg-results-heading { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3) var(--space-6); margin: var(--space-7) 0; font-size: var(--text-base); }
.sdg-results-heading { justify-content: space-between; }
.sdg-section-title, .sdg-results-heading h2 { font-size: var(--heading-3); }
.sdg-section-title { margin-top: var(--space-8); }
.sdg-goal-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); }
.sdg-goal-card { padding: var(--space-6); border-top: 5px solid var(--sdg-color); background: color-mix(in srgb, var(--sdg-color) 8%, var(--paper)); }
.sdg-goal-card h2 { font-size: var(--heading-3); margin-top: 0; }
.sdg-goal-card h2 a { text-decoration: none; }
.sdg-goal-card h2 a:hover { text-decoration: underline; }
.sdg-goal-card p, .sdg-target-card p { font-size: var(--text-base); }
.sdg-goal-card p:last-child, .sdg-target-card p:last-child { margin-bottom: 0; }
.sdg-goal-card .eyebrow, .sdg-target-card .eyebrow { font-size: var(--text-xs); margin-bottom: var(--space-4); }
.sdg-target-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); }
.sdg-target-card { padding: var(--space-6); border: 1px solid var(--line); }
.sdg-goal-opening { border-bottom: 5px solid var(--sdg-color); margin-bottom: var(--space-7); padding-top: var(--space-6); }
.sdg-source { margin-top: var(--space-9); border-top: 1px solid var(--line); padding-top: var(--space-6); color: var(--muted); max-width: 820px; }
.sdg-source h2, .sdg-context h2, .sdg-full-target h2 { font-size: var(--heading-4); }
.sdg-source p { font-size: var(--text-base); }
.sdg-full-target { padding: var(--space-7); background: var(--wash); margin-bottom: var(--space-8); }
.sdg-full-target p { margin-bottom: 0; }
.sdg-context { margin-bottom: var(--space-7); }
.sdg-pagination { border-top: 1px solid var(--line); padding-top: var(--space-6); justify-content: space-between; }
@media (max-width: 900px) {
  .sdg-goal-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sdg-search { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  .sdg-goal-grid, .sdg-target-grid { grid-template-columns: minmax(0, 1fr); }
  .sdg-intro { padding-top: var(--space-7); }
  .sdg-search, .sdg-full-target { padding: var(--space-5); }
  .site-header nav { gap: var(--space-3); }
}
.sdg-color-1 { --sdg-color: #e5243b; }
.sdg-color-2 { --sdg-color: #dda63a; }
.sdg-color-3 { --sdg-color: #4c9f38; }
.sdg-color-4 { --sdg-color: #c5192d; }
.sdg-color-5 { --sdg-color: #ff3a21; }
.sdg-color-6 { --sdg-color: #26bde2; }
.sdg-color-7 { --sdg-color: #fcc30b; }
.sdg-color-8 { --sdg-color: #a21942; }
.sdg-color-9 { --sdg-color: #fd6925; }
.sdg-color-10 { --sdg-color: #dd1367; }
.sdg-color-11 { --sdg-color: #fd9d24; }
.sdg-color-12 { --sdg-color: #bf8b2e; }
.sdg-color-13 { --sdg-color: #3f7e44; }
.sdg-color-14 { --sdg-color: #0a97d9; }
.sdg-color-15 { --sdg-color: #56c02b; }
.sdg-color-16 { --sdg-color: #00689d; }
.sdg-color-17 { --sdg-color: #19486a; }
.quiz-next-steps { border-top: 1px solid var(--line); margin-top: var(--space-8); padding-top: var(--space-7); }
.quiz-results .quiz-next-steps { background: var(--green); color: var(--paper); border: 0; border-radius: var(--leaf-panel); padding: clamp(24px, 4vw, 40px); }
.quiz-next-steps h2 { font-size: var(--heading-2); color: var(--paper); margin-top: 0; }
.quiz-next-steps h2 span { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; letter-spacing: 0; font-size: var(--text-md); font-weight: 400; color: var(--on-green-muted); margin-left: var(--space-2); }
.quiz-next-steps .wizard-options { margin-top: 0; }
.quiz-next-steps .next-step-option { background: var(--paper); color: var(--ink); border-color: transparent; }
.quiz-next-steps .button { background: var(--paper); color: var(--green); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.next-step-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); margin-bottom: var(--space-5); }
.next-step-tiles .wizard-option { flex-direction: column; align-items: flex-start; margin: 0; height: 100%; }
.next-step-tiles .wizard-option > span { display: flex; flex-direction: column; gap: var(--space-2); }
@media (max-width: 640px) {
  .next-step-tiles { grid-template-columns: 1fr; }
}
.next-step-options { display: grid; gap: var(--space-3); }
.next-step-option { display: flex; border: 1px solid var(--green); padding: var(--space-5); text-decoration: none; }
.next-step-option:hover { background: var(--wash); }
.next-step-option strong { display: block; margin-bottom: var(--space-2); }
.next-step-option span { display: block; font-size: var(--text-base); color: var(--muted); }
.contact-heading { margin-top: var(--space-7); }
.directory-filters { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); align-items: end; margin: var(--space-7) 0; }
.directory-filters .field { margin: 0; min-width: 0; }
.discovery-signup { margin: var(--space-7) 0; padding: var(--space-6); background: var(--wash); border-radius: var(--leaf-card); }
.discovery-signup h2 { margin-top: 0; }
.directory-filters select { width: 100%; }
.directory-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6); }
.directory-invitation { padding: var(--space-9) 0; }
@media (max-width: 600px) {
  .directory-filters, .directory-grid { grid-template-columns: 1fr; }
}
.dashboard-heading { margin: var(--space-8) 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-4) var(--space-6); align-items: center; }
.dashboard-heading .eyebrow { grid-column: 1 / -1; margin: 0; }
.dashboard-heading .dashboard-edit-profile { justify-self: end; }
.dashboard-heading h1 { margin-bottom: 0; font-size: var(--heading-1); overflow-wrap: anywhere; }
.dashboard-columns { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: var(--space-9); align-items: start; }
.dashboard-directories { padding-top: var(--space-6); min-width: 0; }
.dashboard-directory-links { list-style: none; margin: var(--space-6) 0 0; padding: 0; }
.dashboard-directory-links p { color: var(--muted); font-size: var(--text-base); margin: 0; }
.dashboard-priorities { padding-left: var(--space-5); margin: var(--space-6) 0; }
.dashboard-priorities li + li { margin-top: var(--space-3); }
.dashboard-retake { font-size: var(--text-base); margin: var(--space-6) 0 0; }
.dashboard-signup { margin-top: var(--space-6); font-size: var(--text-base); }
.dashboard-footer { margin-top: var(--space-8); }
@media (max-width: 760px) {
  .dashboard-columns { grid-template-columns: 1fr; gap: var(--space-6); }
  .dashboard-directories { padding-top: 0; }
  .dashboard-quiz .button { width: 100%; }
}

/* The alternate homepage is an isolated graphic design experiment. */
.bauhaus-page { --paper: #f2eee3; --ink: #20211f; --green: #20211f; --muted: #53534e; --line: #20211f; background: var(--paper); color: var(--ink); font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; }
.bauhaus-page .wrap { width: min(1320px, calc(100% - 96px)); }
.bauhaus-page .site-header { min-height: 106px; border-bottom: 2px solid var(--ink); }
.bauhaus-page .site-header nav { display: flex; gap: 30px; font-size: .9rem; }
.bauhaus-page .site-header nav a { color: var(--ink); text-decoration: none; }
.bauhaus-page .site-header nav a:hover { text-decoration: underline; }
.bauhaus-page h1, .bauhaus-page h2 { font-family: inherit; font-weight: 700; text-wrap: initial; }
.bauhaus-hero { display: grid; grid-template-columns: 1.15fr 1fr; align-items: center; gap: 32px; padding: 54px 0 48px; }
.bauhaus-kicker { font-size: .72rem; font-weight: 600; letter-spacing: .09em; text-transform: uppercase; line-height: 1.5; margin-bottom: 28px; }
.bauhaus-message .bauhaus-kicker { display: flex; align-items: center; gap: 10px; }
.bauhaus-message .bauhaus-kicker > span { width: 9px; height: 9px; background: #2d50bd; flex-shrink: 0; }
.bauhaus-hero h1 { font-size: clamp(3.2rem, 5.65vw, 5.4rem); line-height: .99; letter-spacing: -.065em; margin-bottom: 28px; }
.bauhaus-hero h1 span { color: #c33824; }
.bauhaus-intro { max-width: 37ch; font-size: 1.05rem; line-height: 1.65; margin-bottom: 26px; }
.bauhaus-jump { display: inline-flex; align-items: center; gap: 44px; padding: 13px 20px; background: var(--ink); color: var(--paper); font-size: .9rem; text-decoration: none; }
.bauhaus-jump span { font-size: 1.4rem; }
.bauhaus-jump:hover { background: #2d50bd; }
.bauhaus-art svg { display: block; width: 100%; height: auto; }
.bauhaus-art p { font-size: .68rem; letter-spacing: .035em; text-align: center; margin: 0; }
.bauhaus-join { border-top: 2px solid var(--ink); padding: 48px 0; display: grid; grid-template-columns: 1fr 1.65fr; gap: 60px; scroll-margin-top: 24px; }
.bauhaus-join .bauhaus-kicker { margin-bottom: 18px; }
.bauhaus-join h2 { font-size: clamp(2.6rem, 4vw, 3.8rem); line-height: 1; letter-spacing: -.055em; margin-bottom: 22px; }
.bauhaus-join-copy > p:not(.bauhaus-kicker) { font-size: .95rem; line-height: 1.6; max-width: 34ch; }
.bauhaus-join-copy > p:last-child { margin-bottom: 0; }
.bauhaus-choices { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.bauhaus-choice { display: flex; flex-direction: column; padding: 25px; color: #fff9ed; text-decoration: none; }
.bauhaus-person { background: #2d50bd; }
.bauhaus-company { background: #e74b32; color: #20211f; }
.bauhaus-choice-top { display: flex; justify-content: space-between; align-items: center; font-size: .75rem; gap: 12px; }
.bauhaus-choice-top > span:last-child { font-size: 1.8rem; line-height: 1; }
.bauhaus-choice-title { display: block; font-size: clamp(1.7rem, 2.5vw, 2.5rem); font-weight: 600; line-height: 1.05; letter-spacing: -.045em; margin: 40px 0 25px; }
.bauhaus-choice-note { font-size: .82rem; line-height: 1.5; max-width: 24ch; margin-top: auto; }
.bauhaus-choice:hover .bauhaus-choice-title { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .12em; }
.bauhaus-explore { display: grid; grid-template-columns: 170px 1fr; gap: 60px; padding: 44px 0 52px; border-top: 2px solid var(--ink); align-items: center; }
.bauhaus-explore-symbol { display: grid; grid-template-columns: 1fr 1fr; aspect-ratio: 1; }
.bauhaus-explore-symbol span { background: #f5ce43; border-radius: 100% 0 0 0; }
.bauhaus-explore-symbol span:nth-child(2) { transform: rotate(90deg); background: #2d50bd; }
.bauhaus-explore-symbol span:nth-child(3) { transform: rotate(-90deg); background: #e74b32; }
.bauhaus-explore-symbol span:nth-child(4) { transform: rotate(180deg); background: #20211f; }
.bauhaus-explore .bauhaus-kicker { margin-bottom: 12px; }
.bauhaus-explore h2 { font-size: clamp(1.7rem, 2.8vw, 2.5rem); letter-spacing: -.05em; margin-bottom: 12px; }
.bauhaus-explore p:not(.bauhaus-kicker) { font-size: .95rem; }
.bauhaus-explore nav { display: flex; flex-wrap: wrap; gap: 15px 28px; font-size: .85rem; }
.bauhaus-explore nav a:first-child { font-weight: 700; }
.bauhaus-page .site-footer { font-size: .75rem; padding-block: 24px; }
.bauhaus-page :focus-visible { outline: 3px solid #20211f; outline-offset: 5px; }
@media (max-width: 900px) {
  .bauhaus-page .wrap { width: calc(100% - 48px); }
  .bauhaus-hero { gap: 12px; }
  .bauhaus-hero h1 { font-size: clamp(2.7rem, 6vw, 4rem); }
  .bauhaus-join { gap: 28px; grid-template-columns: 1fr 1.6fr; }
  .bauhaus-choice { padding: 20px; }
  .bauhaus-choice-title { font-size: 1.8rem; }
}
@media (max-width: 650px) {
  .bauhaus-page .wrap { width: calc(100% - 40px); }
  .bauhaus-page .site-header { min-height: 100px; flex-wrap: wrap; justify-content: space-between; gap: 8px; padding-block: 16px; }
  .bauhaus-page .site-header nav { gap: 22px; font-size: .8rem; }
  .bauhaus-hero { grid-template-columns: 1fr; padding: 36px 0 28px; gap: 20px; }
  .bauhaus-hero h1 { font-size: clamp(2.8rem, 10.7vw, 4.5rem); }
  .bauhaus-kicker { font-size: .63rem; margin-bottom: 24px; }
  .bauhaus-intro { font-size: 1rem; }
  .bauhaus-art { max-width: 380px; width: 100%; justify-self: center; }
  .bauhaus-join { grid-template-columns: 1fr; gap: 26px; padding: 32px 0; }
  .bauhaus-join h2 br { display: none; }
  .bauhaus-join-copy > p:not(.bauhaus-kicker) { max-width: 100%; }
  .bauhaus-choices { gap: 12px; }
  .bauhaus-choice { padding: 18px 15px; }
  .bauhaus-choice-title { font-size: clamp(1.3rem, 5vw, 1.9rem); margin-block: 28px 20px; }
  .bauhaus-choice-note { font-size: .75rem; }
  .bauhaus-choice-top { font-size: .65rem; }
  .bauhaus-explore { grid-template-columns: 1fr; gap: 24px; padding-block: 32px; }
  .bauhaus-explore-symbol { width: 84px; }
}

/* Profile discovery and account navigation. */
.profile-contact { margin-top: var(--space-8); }
.directory-location { font-weight: 500; }
@media (min-width: 1000px) {
  .public-profile .skill-carousel.has-many .skill-card { flex-basis: calc((100% - 16px) / 2); }
}
@media (max-width: 760px) {
  .site-header { flex-wrap: wrap; gap: var(--space-4); padding-block: var(--space-5); }
  .site-header nav { width: 100%; gap: var(--space-3) var(--space-6); font-size: var(--text-base); }
}

/* Challenges, project outcomes and public discovery. */
.challenge-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-6); }
.challenge-card { display: flex; flex-direction: column; padding: var(--space-6); border: 1px solid var(--line); overflow-wrap: anywhere; border-top: 3px solid var(--citrus-edge); border-radius: var(--leaf-card); background: var(--card); border-color: var(--citrus-edge); }
.challenge-card p { font-size: var(--text-base); }
.challenge-location { font-weight: 600; }
.challenge-read-more { margin-top: auto; font-size: var(--text-base); }
.recent-work { padding-block: var(--space-9) var(--space-10); border-top: 1px solid var(--line); }
.challenge-detail { padding-bottom: var(--space-10); overflow-wrap: anywhere; }
.challenge-detail h1 { font-size: var(--heading-1); }
.challenge-help .hint { margin: var(--space-4) 0 0; }
.challenge-optional { padding: var(--space-6) 0; border-top: 1px solid var(--line); }
.challenge-optional > summary { font-size: var(--text-md); font-weight: 500; cursor: pointer; }
.challenge-optional[open] > summary { margin-bottom: var(--space-6); }
.challenge-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); }
.collaborator-choices { max-height: 320px; overflow-y: auto; border-block: 1px solid var(--line); padding-inline: var(--space-1); }
.project-collaborators { margin-block: var(--space-7); }
.collaborator-list { list-style: none; padding: 0; }
.collaborator-list li { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: var(--space-3); padding-block: var(--space-3); border-bottom: 1px solid var(--line); }
.collaborator-list li > span { overflow-wrap: anywhere; min-width: 0; }
.project-invites { border-top: 1px solid var(--line); margin-top: var(--space-7); padding-top: var(--space-6); }
.dashboard-work { margin-block: var(--space-6) var(--space-9); padding: var(--space-7); border-left: 4px solid var(--peach-edge); border-radius: var(--leaf-panel); background: var(--sky); border-left-color: var(--sky-edge); }
.dashboard-work .challenge-card { max-width: 720px; }
.work-archive { padding-left: var(--space-6); }
.work-archive li { margin-bottom: var(--space-4); }
.work-archive .status { margin-inline: var(--space-2); }
.current-challenge { padding-top: var(--space-7); }
@media (max-width: 1000px) {
  .challenge-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .challenge-grid, .challenge-choices { grid-template-columns: minmax(0, 1fr); }
  .dashboard-work { padding: var(--space-6) var(--space-5); }
  .challenge-card { padding: var(--space-6); }
  .work-archive .status { margin-inline: 0; }
}
.profile-editor { max-width: 1000px; margin-inline: auto; }
.profile-editor .back-link { margin-top: var(--space-6); }
.profile-editor .page-intro { padding: var(--space-5) 0 0; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: var(--space-4) var(--space-6); }
.profile-editor .page-intro h1 { font-size: var(--heading-1); margin-bottom: 0; }
.profile-editor .page-intro .button { margin-bottom: .4em; }
.profile-tabs { display: flex; gap: 0 var(--space-6); margin-block: var(--space-7); box-shadow: inset 0 -1px var(--line); overflow-x: auto; scrollbar-width: none; }
.profile-tabs a { flex-shrink: 0; white-space: nowrap; padding: var(--space-3) 0; border-bottom: 3px solid transparent; color: var(--muted); text-decoration: none; font-size: var(--text-base); }
.profile-tabs a[aria-current="page"] { color: var(--ink); font-weight: 700; border-bottom-color: var(--green); }
.profile-tabs a:hover { color: var(--ink); border-bottom-color: var(--line-strong); }
.profile-tabs a[aria-current="page"]:hover { border-bottom-color: var(--green); }
.profile-tabs a:focus-visible { outline: 3px solid var(--focus); outline-offset: -3px; }
.profile-panel { max-width: 760px; }
.profile-panel > h2 { font-size: var(--heading-2); }
@media (max-width: 600px) {
  .profile-tabs { gap: 0 var(--space-5); }
}
.discovery-page .site-header { border-bottom: 0; }
.site-header nav a[aria-current] { font-weight: 700; text-decoration-thickness: 3px; color: var(--ink); }
@media (max-width: 600px) {
  .dashboard-heading h1 { grid-column: 1 / -1; }
  .dashboard-heading .dashboard-edit-profile { grid-column: 2; }
}

/* A shared visual language for joining, choosing priorities and discovering work. */
.ambient-mark { display: block; width: 180px; height: 108px; margin: var(--space-6) 0; }
.onboarding-page { padding-top: var(--space-7); }
.onboarding-page h1 { font-size: var(--heading-1); }
.onboarding-page .eyebrow { letter-spacing: .04em; font-size: var(--text-xs); }
.onboarding-page form { margin-block: var(--space-7); }
.onboarding-reminder { padding: var(--space-6); border: 1px solid var(--line); border-radius: var(--radius); margin-bottom: var(--space-7); }
.onboarding-reminder h2 { font-size: var(--heading-2); }
.section-icon { width: 22px; height: 22px; flex: 0 0 auto; }
.profile-project-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6); }
.profile-project-grid > article { min-width: 0; width: auto; }
.profile-project-grid .project-card { border: 1px solid var(--line); border-radius: var(--radius); padding: var(--space-6); }
@media (max-width: 600px) {
  .profile-project-grid { grid-template-columns: 1fr; }
  .section-icon { width: 18px; height: 18px; }
  .ambient-mark { width: 140px; height: 84px; margin-block: var(--space-4); }
}

/* Overlapping forms give the shared Commonbound illustration its colour. */
.join-layout { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 5vw, 72px); padding-top: var(--space-8); }
.join-story { background: var(--green); color: var(--paper); padding: clamp(24px, 4vw, 48px); border-radius: var(--leaf-panel); --mark-centre: var(--green); }
.join-story .eyebrow { color: var(--on-green-accent); font-size: var(--text-xs); }
.join-story h1 { font-size: var(--heading-1); }
.join-story .ambient-mark { width: 100%; max-width: 360px; height: auto; margin: var(--space-6) auto; }
.join-steps { list-style: none; padding: 0; margin: 0; }
.join-steps li { display: flex; align-items: baseline; gap: var(--space-4); padding: var(--space-3) 0; border-top: 1px solid var(--on-green-line); font-size: var(--text-base); }
.join-steps span { color: var(--on-green-accent); font-size: var(--text-xs); font-variant-numeric: tabular-nums; }
.join-form { padding-block: var(--space-7); }
.join-form h2 { font-size: var(--heading-2); }
.join-form form { margin-block: var(--space-7); }
.join-form .button { width: 100%; }
.discovery-intro { position: relative; background: var(--yellow); padding: var(--space-5) 104px var(--space-5) var(--space-6); border-radius: var(--leaf-card); }
.discovery-intro > div { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-1) var(--space-5); }
.discovery-intro h1 { font-size: var(--heading-2); margin: 0; }
.discovery-intro p { margin-bottom: 0; }
.discovery-intro .ambient-mark { position: absolute; height: auto; margin: 0; right: var(--space-5); top: 50%; transform: translateY(-50%); width: 56px; }
.quiz-results { max-width: 1000px; margin-inline: auto; padding-top: var(--space-7); }
.quiz-results > .ambient-mark { float: right; width: 160px; height: auto; margin: 0 0 var(--space-6) var(--space-6); }
.quiz-results h1 { font-size: var(--heading-1); }
.priority-suggestions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); clear: both; margin-block: var(--space-7); }
.priority-suggestions .quiz-answer { margin: 0; border: 0; border-top: 4px solid var(--green); background: var(--wash); padding: var(--space-6); border-radius: var(--leaf-card); }
.priority-suggestions .quiz-answer h3 { font-size: var(--heading-3); }
.quiz-answer-label { display: flex; align-items: center; gap: var(--space-3); margin-bottom: var(--space-3); }
.quiz-answer-label .eyebrow { margin: 0; }
.priority-suggestions .quiz-reasons { padding-left: var(--space-5); font-size: var(--text-base); }
.quiz-results > form, .quiz-results > .quiz-next-steps { max-width: 720px; }
@media (max-width: 760px) {
  .join-layout { grid-template-columns: 1fr; gap: 0; padding-top: var(--space-6); }
  .join-story { padding: var(--space-6); }
  .join-story .ambient-mark { max-width: 210px; margin: var(--space-2) 0; }
  .join-steps { display: grid; grid-template-columns: 1fr 1fr; gap: 0 var(--space-4); }
  .join-steps li { font-size: var(--text-sm); gap: var(--space-2); }
  .discovery-intro .ambient-mark { display: none; }
  .priority-suggestions { grid-template-columns: 1fr; }
  .quiz-results > .ambient-mark { width: 100px; }
}
@media (max-width: 600px) {
  .join-story { display: grid; grid-template-columns: minmax(0, 1fr) 90px; gap: var(--space-3); align-items: center; }
  .join-story .eyebrow { grid-column: 1 / -1; margin: 0; }
  .join-story h1 { margin: 0; }
  .join-story .ambient-mark { width: 90px; margin: 0; }
  .join-steps { display: none; }
}

/* Homepage and account views. */
.common-home { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 80px); align-items: center; padding: var(--space-10) 0; }
.common-home h1 { font-size: var(--heading-display); }
.common-home .intro { max-width: 37ch; margin: var(--space-6) 0; }
.common-home .hint { margin-top: var(--space-5); }
.common-home-art { background: var(--green); color: var(--paper); --mark-centre: var(--green); border-radius: var(--leaf-panel); position: relative; overflow: hidden; padding: 0; }
.common-home-art .ambient-mark { width: 100%; height: auto; margin: var(--space-7) 0; }
.path-caption { display: block; font-size: var(--text-lead); }
.path-caption:last-child { text-align: right; }
.community-doors { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); margin: 0 0 var(--space-10); }
.community-door { position: relative; display: block; border-top: 4px solid var(--green); padding: var(--space-6); background: var(--wash); color: var(--ink); text-decoration: none; }
.community-door h2 { font-size: var(--heading-3); margin-top: var(--space-4); }
.community-door p { font-size: var(--text-base); margin: 0; max-width: 28ch; }
.community-door > span { position: absolute; right: 24px; top: 20px; font-size: var(--text-lg); }
.community-door p.door-note { margin-top: var(--space-3); font-size: var(--text-sm); font-weight: 600; }
.community-door:hover h2 { text-decoration: underline; text-underline-offset: .2em; }
.dashboard-work h2 { display: flex; align-items: center; gap: var(--space-3); font-size: var(--heading-2); }
.dashboard-columns h2 { font-size: var(--heading-2); }
.dashboard-quiz { border: 1px solid var(--line); padding: clamp(1.5rem, 3vw, 2.5rem); border-radius: var(--leaf-panel); }
.dashboard-quiz > .ambient-mark { width: 130px; height: auto; margin: 0 0 var(--space-6); }
.dashboard-directory-links h3 { display: flex; align-items: center; gap: var(--space-3); }
@media (max-width: 760px) {
  .common-home { grid-template-columns: 1fr; padding: var(--space-7) 0; gap: var(--space-6); }
  .common-home-art { display: grid; grid-template-columns: 1fr 130px; align-items: center; }
  .common-home-art .ambient-mark { grid-column: 2; grid-row: 1 / 3; margin: 0; }
  .path-caption:last-child { text-align: left; }
  .community-doors { grid-template-columns: 1fr; gap: var(--space-3); margin-bottom: var(--space-7); }
  .community-door { padding: var(--space-5); }
  .community-door h2 { margin-top: var(--space-2); }
  .community-door p { max-width: none; }
}

/* Public profiles and projects use the same visual language as discovery. */
.profile-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-2) var(--space-6); margin-bottom: var(--space-6); font-size: var(--text-base); }
[data-new-company] { margin-top: var(--space-4); }
.profile-toolbar > a:not(.button) { display: inline-flex; align-items: center; min-height: 44px; }
.profile-opening h1, .project-opening h1 { font-size: var(--heading-1); }
.profile-kind { display: flex; align-items: center; gap: var(--space-3); }
.profile-avatar { display: block; width: 128px; height: 128px; border-radius: 50%; object-fit: cover; background: var(--wash); }
.profile-photo-field { display: flex; align-items: flex-start; gap: var(--space-6); }
.profile-photo-field .profile-avatar { width: 88px; height: 88px; flex-shrink: 0; }
.profile-photo-controls { min-width: 0; flex: 1; }
.profile-photo-remove { display: flex; align-items: flex-start; gap: var(--space-2); margin-top: var(--space-4); }
.profile-photo-remove label { font-weight: 400; margin: 0; }
@media (max-width: 480px) {
  .profile-photo-field { flex-direction: column; gap: var(--space-4); }
}
.profile-purpose-images { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-5); }
.profile-purpose .ambient-mark { width: 100px; height: auto; margin: 0; }
.profile-purpose .profile-avatar { width: 100px; height: 100px; }
.profile-purpose p { margin-bottom: 0; font-family: inherit; font-size: var(--text-lead); line-height: 1.5; }
.profile-main > .profile-section + .profile-section, .profile-interests > .profile-section + .profile-section { border-top: 1px solid var(--line); padding-top: var(--space-7); }
.project-opening { border-bottom: 1px solid var(--line); padding-bottom: var(--space-7); }
.project-opening > .ambient-mark { width: 120px; height: auto; margin: var(--space-4) 0 var(--space-6); }
.challenge-detail .prose h2, .project-detail .prose h2 { font-size: var(--heading-2); }
.challenge-detail .prose > section, .project-detail .prose > section { margin-block: var(--space-7); }
.challenge-help { margin-block: var(--space-8); padding: var(--space-6); border-left: 4px solid var(--peach-edge); border-radius: var(--leaf-panel); }
.challenge-help h2 { margin-top: 0; display: flex; align-items: center; gap: var(--space-3); }
.help-options { display: flex; flex-wrap: wrap; gap: var(--space-2); list-style: none; padding: 0; margin: var(--space-5) 0 var(--space-6); }
.help-options li { padding: var(--space-2) var(--space-3); background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); font-size: var(--text-base); }
.challenge-card .eyebrow { margin-bottom: var(--space-4); font-size: var(--text-xs); display: flex; align-items: center; gap: var(--space-2); }
.challenge-card .eyebrow .section-icon { width: 18px; height: 18px; }
.challenge-card h3, .project-card h3 { font-size: var(--heading-3); }
@media (max-width: 760px) {
  .profile-opening { grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }
  .profile-purpose-images { margin-bottom: var(--space-4); }
  .profile-purpose .ambient-mark { width: 80px; }
  .profile-purpose .profile-avatar { width: 80px; height: 80px; }
  .project-opening > .ambient-mark { width: 90px; margin-bottom: var(--space-5); }
}

/* Colour marks places to explore and take part, while forms stay on paper. */
.community-door:nth-child(1) { background: var(--sky); border-color: var(--sky-edge); }
.community-door:nth-child(2) { background: var(--peach); border-color: var(--peach-edge); }
.community-door:nth-child(3) { background: var(--citrus); border-color: var(--citrus-edge); }
.directory-card { padding: var(--space-6); overflow-wrap: anywhere; background: var(--sky); border: 0; border-top: 4px solid var(--sky-edge); border-radius: var(--leaf-card); }
.directory-card:nth-child(3n + 2) { background: var(--peach); border-color: var(--peach-edge); }
.directory-card:nth-child(3n) { background: var(--citrus); border-color: var(--citrus-edge); }
.directory-card h2 { margin-top: 0; font-size: var(--heading-3); }
.challenge-grid > .challenge-card:nth-child(3n + 2), .directory-grid > .challenge-card:nth-child(3n + 2) { background: var(--sky); border-color: var(--sky-edge); }
.challenge-grid > .challenge-card:nth-child(3n), .directory-grid > .challenge-card:nth-child(3n) { background: var(--peach); border-color: var(--peach-edge); }
.dashboard-work + .dashboard-work { background: var(--peach); border-left-color: var(--peach-edge); }
.dashboard-quiz, .onboarding-reminder { background: var(--yellow); border-color: var(--yellow-edge); }
.dashboard-directory-links li { padding: var(--space-5) 0; padding-inline: var(--space-4); border-top: 0; border-left: 3px solid var(--sky-edge); background: var(--sky); margin-bottom: var(--space-3); }
.dashboard-directory-links li:nth-child(2) { background: var(--peach); border-color: var(--peach-edge); }
.dashboard-directory-links li:nth-child(3) { background: var(--citrus); border-color: var(--citrus-edge); }
.dashboard-directory-links li:nth-child(4) { background: var(--yellow); border-color: var(--yellow-edge); }
.profile-purpose, .challenge-help { background: var(--peach); }
.profile-targets { border-top: 2px solid var(--ink); padding-top: var(--space-8); margin: var(--space-3) 0 0; background: var(--sky); padding: var(--space-7); border-radius: var(--leaf-panel); }
.priority-suggestions .quiz-answer:nth-child(1) { background: var(--sky); border-color: var(--sky-edge); }
.priority-suggestions .quiz-answer:nth-child(2) { border-color: var(--peach-edge); background: var(--peach); }
.priority-suggestions .quiz-answer:nth-child(3) { border-color: var(--citrus-edge); background: var(--citrus); }
.wizard-option:has(input:checked) { background: var(--yellow); border-color: var(--green); }
@media (max-width: 760px) {
  .profile-targets { padding: var(--space-6) var(--space-5); }
}

/* The selected artwork retains its square composition at every size. */
.ambient-mark.brand-artwork { height: auto; border-radius: var(--radius); }
.profile-purpose-images .ambient-mark { border-radius: 50%; }
.common-home-art .brand-artwork { width: 100%; max-width: none; margin: 0; border-radius: 0; }
.common-home-art .path-caption { position: absolute; z-index: 1; padding: var(--space-1) var(--space-3); background: var(--green); border-radius: var(--radius); font-size: var(--text-base); }
.common-home-art .path-caption:first-child { top: 20px; left: 20px; }
.common-home-art .path-caption:last-child { bottom: 20px; right: 20px; }
@media (max-width: 760px) {
  .common-home-art { display: block; max-width: 440px; width: 100%; margin-inline: auto; }
}
#side-projects { margin-top: var(--space-10); }
.side-project-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6); }
.side-project-card { background: var(--peach); border-radius: var(--leaf-card); overflow: hidden; }
.side-project-card:nth-child(even) { background: var(--sky); }
.side-project-cover { width: 100%; height: 240px; object-fit: cover; background: var(--wash); display: block; }
.side-project-copy { padding: var(--space-6); overflow-wrap: anywhere; }
.side-project-copy summary { cursor: pointer; text-decoration: underline; margin: var(--space-4) 0; }
.side-project-gallery, .side-photo-editor { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); margin-block: var(--space-5); }
.side-project-gallery img, .side-photo-preview { width: 100%; height: 120px; object-fit: contain; background: var(--paper); }
.side-project-gallery img { display: block; object-fit: cover; }
.side-photo-editor label { display: block; font-size: var(--text-base); }
.side-project-summary { padding: var(--space-6) 0; border-bottom: 1px solid var(--line); }
@media (max-width: 600px) {
  #side-projects { margin-top: var(--space-8); }
  .side-project-grid { grid-template-columns: 1fr; }
  .side-photo-editor { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.provocations { background: var(--question); border: 1px solid var(--line); border-radius: var(--radius); padding: clamp(20px, 4vw, 36px); margin: var(--space-6) 0 var(--space-8); }
.provocation-form fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.provocation-form legend { font-size: var(--text-lead); line-height: 1.4; font-weight: 600; margin-bottom: var(--space-5); }
.provocation-choices { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-3); }
.provocation-choices button { width: 100%; min-height: 48px; padding: var(--space-3) var(--space-2); border: 1px solid var(--green-dark); border-radius: var(--radius); background: var(--field); color: var(--green-dark); font: inherit; font-weight: 600; cursor: pointer; }
.provocation-choices button:hover, .provocation-choices button[aria-pressed="true"] { background: var(--green-dark); color: var(--field); }
.provocation-choices button:focus-visible { outline: 3px solid var(--green-dark); outline-offset: 3px; }
.provocation-choices button[aria-pressed="true"] { outline: 3px solid var(--green-dark); outline-offset: 3px; }
.provocation-history-link { margin-top: var(--space-6); }
.answer-history { max-width: 900px; margin: 0 auto; }
.answer-pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: var(--space-6); margin: var(--space-7) 0; }
@media (max-width: 520px) {
  .provocation-choices { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.dashboard-overview { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: var(--space-7); margin-bottom: var(--space-7); }
.dashboard-overview > .provocations { margin: 0; padding: var(--space-6); }
.dashboard-overview .provocation-form legend { font-size: var(--text-md); margin-bottom: var(--space-4); }
.dashboard-overview .provocation-choices { gap: var(--space-2); }
.dashboard-overview .provocation-choices button { font-size: var(--text-sm); padding: var(--space-3) var(--space-1); }
.dashboard-overview .provocations > p { font-size: var(--text-base); margin: 0 0 var(--space-4); }
.dashboard-overview .provocations > p:has(a[href*="after_provocation"]), .dashboard-overview .provocations > .provocation-history-link { display: inline-block; margin: var(--space-4) var(--space-4) 0 0; }
.dashboard-meta { min-width: 0; padding: var(--space-2) 0; }
.dashboard-meta section + section { border-top: 1px solid var(--line); margin-top: var(--space-5); padding-top: var(--space-5); }
.dashboard-meta h2 { font-size: var(--heading-4); }
.dashboard-meta p, .dashboard-meta details { font-size: var(--text-base); line-height: 1.5; margin: var(--space-2) 0; overflow-wrap: anywhere; }
.dashboard-meta .dashboard-project-link { font-weight: 600; }
.dashboard-profile-switcher { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin: var(--space-2) 0; }
.dashboard-profile-switcher select { flex: 1 1 160px; min-width: 0; width: auto; font-size: var(--text-base); padding: var(--space-2); min-height: 44px; }
.dashboard-profile-switcher .button { font-size: var(--text-sm); padding: var(--space-2) var(--space-3); min-height: 44px; }
.dashboard-past-projects summary { cursor: pointer; }
.dashboard-overview-meta-only { grid-template-columns: 1fr; }
@media (max-width: 760px) {
  .dashboard-overview { grid-template-columns: 1fr; gap: var(--space-5); }
  .dashboard-overview > .provocations { padding: var(--space-5); }
}
.dashboard-profile-switcher .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }

/* Overview dashboard: one question, useful context, and compact paths onward. */
.dashboard-overview-design .dashboard-heading { margin: var(--space-7) 0 var(--space-7); gap: var(--space-3) var(--space-6); }
.dashboard-overview-design .dashboard-heading h1 { font-size: var(--heading-1); }
.dashboard-overview-design .dashboard-heading h1 a { color: var(--ink); text-decoration: none; }
.dashboard-overview-design .dashboard-heading h1 a:hover { text-decoration: underline; }
.dashboard-overview-design .dashboard-overview { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: var(--space-7); margin-bottom: var(--space-7); }
.dashboard-overview-design .dashboard-overview-meta-only { grid-template-columns: 1fr; }
.dashboard-overview-design .provocations { background: var(--question); border-color: var(--line); border-radius: var(--leaf-panel); padding: var(--space-4); }
.dashboard-question-heading { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); margin-bottom: var(--space-3); }
.dashboard-question-heading .eyebrow { font-size: var(--text-xs); margin: 0; }
.dashboard-question-count { font-size: var(--text-xs); color: var(--muted); white-space: nowrap; }
.dashboard-question-goal a { display: inline-flex; align-items: center; gap: var(--space-2); font-size: var(--text-xs); }
.dashboard-goal-number { display: inline-grid; place-items: center; flex: 0 0 25px; width: 25px; height: 25px; border-radius: var(--radius); background: var(--green); color: var(--on-green); font-size: var(--text-xs); font-weight: 600; text-decoration: none; }
.dashboard-overview-design .provocation-form legend { font-size: var(--text-lead); line-height: 1.3; letter-spacing: -.025em; margin: var(--space-1) 0 var(--space-3); }
.dashboard-overview-design .provocation-choices button { font-size: var(--text-sm); min-height: 44px; border-color: var(--line-strong); }
.dashboard-question-footer { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-3) var(--space-5); margin-top: var(--space-4); }
.dashboard-question-footer p { font-size: var(--text-xs); margin: 0; }
.dashboard-overview-design .dashboard-meta { padding: var(--space-2) 0; }
.dashboard-overview-design .dashboard-meta #current-work-title { font-size: var(--text-xs); letter-spacing: .1em; }
.dashboard-overview-design .dashboard-project-link { font-size: var(--text-lg); line-height: 1.25; margin: var(--space-3) 0; letter-spacing: -.025em; }
.dashboard-overview-design .dashboard-project-description { color: var(--muted); font-size: var(--text-sm); }
.dashboard-overview-design .dashboard-meta-actions { margin-top: var(--space-4); }
.dashboard-overview-design .dashboard-meta p, .dashboard-overview-design .dashboard-meta details { font-size: var(--text-sm); }
.dashboard-overview-design .dashboard-meta .dashboard-project-link { font-size: var(--text-lg); }
.dashboard-overview-design .dashboard-profile-switcher { gap: var(--space-3); margin: var(--space-4) 0; }
.dashboard-overview-design .dashboard-profile-switcher label { margin: 0; font-size: var(--text-xs); }
.dashboard-overview-design .dashboard-profile-switcher select { white-space: nowrap; text-overflow: ellipsis; flex: 1 1 130px; background: transparent; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; font-size: var(--text-sm); padding: var(--space-2) var(--space-1); }
.dashboard-overview-design .dashboard-profile-switcher .button { font-size: var(--text-xs); padding: var(--space-2) var(--space-3); border-color: var(--line); }
.dashboard-priorities-strip { border-top: 1px solid var(--line); padding-top: var(--space-6); }
.dashboard-section-heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3) var(--space-5); margin-bottom: var(--space-4); }
.dashboard-overview-design .dashboard-section-heading h2 { font-size: var(--heading-3); margin: 0; }
.dashboard-section-heading > a { font-size: var(--text-sm); }
.dashboard-priority-links { display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-5); list-style: none; padding: 0; margin: 0; }
.dashboard-priority-links li { font-size: var(--text-sm); padding-right: var(--space-5); border-right: 1px solid var(--line); max-width: 100%; }
.dashboard-priority-links li:last-child { border-right: 0; }
.dashboard-overview-design .small-note { font-size: var(--text-sm); }
.dashboard-discovery { margin-top: var(--space-7); }
.dashboard-discovery-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); }
.dashboard-discovery-card { display: block; padding: var(--space-5); background: var(--sky); border-top: 3px solid var(--sky-edge); border-radius: var(--leaf-card); color: var(--ink); text-decoration: none; }
.dashboard-discovery-card:nth-child(2) { background: var(--peach); border-color: var(--peach-edge); }
.dashboard-discovery-card:nth-child(3) { background: var(--citrus); border-color: var(--citrus-edge); }
.dashboard-discovery-card:hover { filter: brightness(.975); }
.dashboard-discovery-card h3 { display: flex; justify-content: space-between; gap: var(--space-3); font-size: var(--heading-4); margin: 0; }
.dashboard-discovery-card p { font-size: var(--text-sm); line-height: 1.5; color: var(--muted); margin: var(--space-3) 0 0; }
.dashboard-overview-design .recent-work { margin-top: var(--space-7); }
.dashboard-overview-design .recent-work > h2 { font-size: var(--heading-3); }
@media (max-width: 760px) {
  .dashboard-overview-design .dashboard-overview { grid-template-columns: 1fr; gap: var(--space-6); }
  .dashboard-overview-design .provocations { padding: var(--space-4); }
  .dashboard-discovery-cards { grid-template-columns: 1fr; gap: var(--space-3); }
  .dashboard-priority-links { display: grid; gap: var(--space-3); }
  .dashboard-priority-links li { border: 0; padding: 0; }
}
.provocations .provocation-feedback { font-size: var(--text-xs); color: var(--muted); margin: var(--space-3) 0 0; }
.provocations .provocation-feedback:empty { display: none; }
.provocations[aria-busy="true"] .provocation-choices button { opacity: .6; cursor: wait; }
.collaborator-search-result, [data-selected-collaborators] .check-choice { display: flex; justify-content: space-between; align-items: center; gap: var(--space-4); padding-block: var(--space-3); }
.collaborator-search-result > span, [data-selected-collaborators] label { flex: 1; min-width: 0; margin: 0; }
.collaborator-search-result .button, [data-selected-collaborators] .button { padding: var(--space-2) var(--space-4); min-height: 44px; flex-shrink: 0; }
.collaborator-search .button { margin-top: var(--space-3); }
[data-collaborator-status] { margin-top: var(--space-3); }
.journey { margin-bottom: var(--space-8); }
.journey-steps { list-style: none; padding: 0; margin: var(--space-6) 0 0; border-top: 1px solid var(--line); }
.journey-steps li { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; gap: var(--space-4); align-items: center; padding: var(--space-5) 0; border-bottom: 1px solid var(--line); color: var(--muted); }
.journey-steps h3 { margin: 0; font-size: var(--heading-4); font-weight: 400; color: inherit; }
.journey-steps p { margin: var(--space-1) 0 0; font-size: var(--text-base); }
.journey-num { font-variant-numeric: tabular-nums; }
.journey-done .journey-num { color: var(--green); font-weight: 600; }
.journey-current { background: var(--green); color: var(--paper) !important; padding-inline: var(--space-4) !important; margin-inline: -16px; border-radius: var(--leaf-card); border-bottom-color: transparent !important; }
.journey-current .journey-num { color: var(--on-green-accent); }
.journey-current h3 { font-weight: 600; }
.journey-current p { color: var(--on-green-muted); }
.journey-current .button { background: var(--paper); color: var(--green); }
.journey-bar { display: flex; align-items: center; gap: var(--space-3); margin: 0 0 var(--space-7); }
.journey-bar-label { margin: 0; font-size: var(--text-xs); color: var(--muted); white-space: nowrap; }
.journey-bar-track { flex: 1; display: flex; gap: var(--space-1); max-width: 160px; }
.journey-bar span { flex: 1; height: 4px; border-radius: var(--radius); background: var(--line); }
.journey-bar span.done { background: var(--green); }
@media (max-width: 640px) {
  .journey-steps li { grid-template-columns: 28px minmax(0, 1fr); }
  .journey-steps li > .button { grid-column: 2; justify-self: start; }
}
.priority-summary { margin: var(--space-7) 0 var(--space-2); }
.priority-edit { margin-bottom: var(--space-6); }
.priority-edit summary { color: var(--green); text-decoration: underline; cursor: pointer; font-size: var(--text-base); }
.priority-edit fieldset { margin-top: var(--space-4); }
.quiz-intro-lead { font-size: var(--text-lead); line-height: 1.5; }
.quiz-intro-points { margin: var(--space-8) 0; border-top: 1px solid var(--line); }
.quiz-intro-points dt { font-weight: 600; margin-top: var(--space-5); }
.quiz-intro-points dd { margin: var(--space-1) 0 var(--space-5); color: var(--muted); padding-bottom: var(--space-5); border-bottom: 1px solid var(--line); }
.quiz-intro .actions { align-items: center; }
.quiz-intro-skip { display: inline; }

/* Header groups: related links sit closer together than the groups do. */
.header-start { display: flex; align-items: center; gap: var(--space-7); flex-wrap: wrap; }
.site-header .nav-group { display: inline-flex; align-items: center; gap: var(--space-5); }
.site-header nav:has(> .nav-group) { gap: var(--space-3) var(--space-7); }
.site-header nav a:not([aria-current]):not(:hover) { text-decoration: none; }
.site-header .nav-account, .site-header .nav-login { color: var(--ink); text-decoration: none; }
.nav-account { font-weight: 700; }
.footer-links { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3) var(--space-6); }
.sdg-target-card h3 a { text-decoration: none; }
.sdg-target-card h3 a:hover { text-decoration: underline; }
.sdg-goal-summary { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-5) var(--space-8); }
.sdg-goal-summary > p { flex: 1 1 16rem; margin: 0; }
.sdg-goal-summary .button { flex: none; }
@media (max-width: 760px) {
  /* Logged in: logo on its own row, then the links and the account name share one row. */
  .header-start { display: contents; }
  .header-start .wordmark { width: 100%; }
  .site-header nav.nav-group { width: auto; }
  .site-header nav[aria-label="Account"] { margin-inline-start: auto; }
  .site-header .nav-account { padding-inline: var(--space-3); }
}

/* Quiz results, logged out: one clear sign-up step, and a lighter conversation option below it. */
.quiz-signup { max-width: 720px; margin-top: var(--space-8); }
.quiz-signup h2 { margin-bottom: var(--space-3); }
.quiz-results .quiz-next-steps.quiet { background: transparent; color: var(--ink); border-radius: 0; border-top: 1px solid var(--line); padding: var(--space-7) 0 0; }
.quiz-next-steps.quiet h2 { color: var(--ink); font-size: var(--heading-3); }
.quiz-next-steps.quiet h2 span { color: var(--muted); }
.quiz-next-steps.quiet .next-step-option { border-color: var(--line); }
.quiz-next-steps.quiet .button { background: transparent; color: var(--green); border-color: var(--green); }
.quiz-next-steps.quiet .button:hover { background: var(--wash); }

/* Discovery draft: filters in 3 of 12 columns, results in the other 9. Search sits above the results. */
.discovery-layout { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--space-7); align-items: start; margin-top: var(--space-7); }
.discovery-sidebar { grid-column: span 3; position: sticky; top: var(--space-6); }
.discovery-results { grid-column: span 9; }
.discovery-sidebar-title { font-size: var(--text-base); margin: 0 0 var(--space-4); }
.discovery-sidebar .directory-filters { grid-template-columns: 1fr; gap: var(--space-3); margin: 0; font-size: var(--text-sm); }
.discovery-sidebar label { margin-bottom: var(--space-1); }
.discovery-sidebar input, .discovery-sidebar select { min-height: 40px; padding: var(--space-2) var(--space-3); font-size: var(--text-sm); }
.discovery-search { display: grid; gap: var(--space-2); margin-top: var(--space-6); padding-top: var(--space-5); border-top: 1px solid var(--line); }
.discovery-search .discovery-sidebar-title { margin-bottom: var(--space-1); }
.discovery-search .button { width: 100%; min-height: 40px; padding-block: var(--space-2); font-size: var(--text-sm); }
.discovery-count { margin: var(--space-2) 0 0; color: var(--muted); font-size: var(--text-sm); }
@media (max-width: 900px) {
  .discovery-sidebar, .discovery-results { grid-column: 1 / -1; position: static; }
}

/* Project cards: tighter rhythm and no underline on the title until hover. */
.challenge-card h3 { margin: 0 0 var(--space-2); }
.challenge-card h3 a { text-decoration: none; }
.challenge-card h3 a:hover { text-decoration: underline; }
.challenge-card p { margin: 0 0 var(--space-2); }
.challenge-card .eyebrow { margin-bottom: var(--space-3); }
.challenge-card .challenge-location { margin-bottom: var(--space-3); }
.challenge-card .challenge-read-more { margin-top: auto; padding-top: var(--space-3); }
/* Sidebar dropdowns: our own chevron, inset to match the text padding. */
.discovery-sidebar select { appearance: none; padding-right: var(--space-8); background: var(--field) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23253d35' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right var(--space-3) center; white-space: nowrap; text-overflow: ellipsis; }

/* Discover tabs use the profile editor's tab style instead of looking like buttons. */
.discovery-nav.profile-tabs { flex-wrap: nowrap; gap: 0 var(--space-2); margin: 0 0 var(--space-7); }
.discovery-nav.profile-tabs a { display: inline-flex; align-items: center; padding: var(--space-3) var(--space-4); border: 0; border-bottom: 3px solid transparent; border-radius: 0; background: none; color: var(--muted); font-size: var(--text-base); gap: var(--space-2); }
.discovery-nav.profile-tabs a[aria-current="page"] { background: none; color: var(--ink); font-weight: 700; border-bottom-color: var(--green); }
.discovery-nav.profile-tabs a:hover { text-decoration: none; color: var(--ink); border-bottom-color: var(--line-strong); }
.discovery-nav.profile-tabs a[aria-current="page"]:hover { border-bottom-color: var(--green); }
.discovery-nav.profile-tabs .section-icon { width: 18px; height: 18px; }
.directory-card h2 a { text-decoration: none; }
.directory-card h2 a:hover { text-decoration: underline; }

@media (max-width: 760px) {
  .discovery-intro { padding: var(--space-5); }
}
@media (max-width: 600px) {
  .discovery-nav.profile-tabs { gap: 0; }
  .discovery-nav.profile-tabs a { padding-inline: var(--space-3); font-size: var(--text-sm); }
}

/* Provocation notes and the shared response temperature. */
.provocation-details { display: grid; gap: .7rem; margin: 1rem 0; }
.provocation-details textarea { width: 100%; min-height: 7rem; box-sizing: border-box; }
.provocation-details label, .shared-note label { line-height: 1.5; }
.provocation-details input[type="checkbox"], .shared-note input[type="checkbox"] { width: auto; margin-right: .5rem; }
.response-temperature { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .4rem; }
.temperature-cell { padding: 1rem .3rem; text-align: center; border-radius: .4rem; color: #25312d; }
.temperature-cell span, .temperature-cell small { display: block; }
.temperature-0 { background: #edf0ef; }
.temperature-1 { background: #d4e5df; }
.temperature-2 { background: #e8d6a8; }
.temperature-3 { background: #eab180; }
.shared-note { overflow-wrap: anywhere; margin: 1rem 0; }
.shared-note form { display: grid; gap: .8rem; }
.provocation-page h1 { overflow-wrap: anywhere; }

.provocation-note-options { margin: var(--space-2) 0 0; }
.provocation-note-options summary { font-size: var(--text-sm); padding: var(--space-1) 0; cursor: pointer; text-decoration: underline; text-underline-offset: .2em; }

.dashboard-overview-design .provocations > p { margin-bottom: var(--space-2); }

.provocation-permalink { display: inline-flex; width: 1em; height: 1em; min-width: 24px; min-height: 24px; margin-left: .3em; vertical-align: -.1em; }
.provocation-permalink svg { width: 100%; height: 100%; }

/* Ink & lime: scope the new visual treatment to the functional dashboard. */
.dashboard-theme {
  --paper: var(--dashboard-paper);
  --ink: var(--dashboard-ink);
  --muted: var(--dashboard-muted);
  --green: var(--dashboard-ink);
  --green-dark: var(--dashboard-ink);
  --line: var(--dashboard-line);
  --line-strong: var(--dashboard-field-line);
  --field: var(--dashboard-surface);
  --wash: var(--dashboard-sage);
  --question: var(--dashboard-lime);
  font-size: var(--text-base);
}
.dashboard-theme .site-header { min-height: var(--space-11); }
.dashboard-theme .dashboard-heading { margin-block: var(--space-8); }
.dashboard-theme .dashboard-heading h1 { font-size: var(--heading-display); }
.dashboard-theme .dashboard-heading .eyebrow { letter-spacing: normal; text-transform: none; font-weight: 400; }
.dashboard-theme .dashboard-overview { gap: var(--space-8); }
.dashboard-theme .dashboard-overview-design .provocations { border: 0; border-radius: var(--dashboard-radius); padding: var(--space-7); }
.dashboard-theme .dashboard-overview-design .provocation-form legend { font-family: Georgia, "Times New Roman", serif; font-weight: 400; letter-spacing: -.025em; }
.dashboard-theme .dashboard-question-heading { flex-wrap: wrap; }
.dashboard-theme .dashboard-overview-design .provocation-choices { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dashboard-theme .provocation-choices button { border-radius: var(--radius); font-weight: 500; }
.dashboard-theme .dashboard-meta { background: var(--field); border: 1px solid var(--line); border-radius: var(--dashboard-radius); padding: var(--space-6); }
.dashboard-theme .dashboard-overview-design .dashboard-meta { padding: var(--space-6); }
.dashboard-theme .dashboard-project-link a { text-decoration: none; }
.dashboard-theme .dashboard-project-link a:hover { text-decoration: underline; }
.dashboard-theme .dashboard-profile-switcher select { border: 1px solid var(--line-strong); border-radius: var(--radius); padding: var(--space-2); }
.dashboard-theme .dashboard-priorities-strip { padding-block: var(--space-6); }
.dashboard-theme .dashboard-priority-links li { border: 0; padding: var(--space-2) var(--space-3); border-radius: var(--radius); background: var(--wash); }
.dashboard-theme .dashboard-discovery { margin-top: var(--space-5); }
.dashboard-theme .dashboard-discovery-card { border: 1px solid var(--line); border-radius: var(--dashboard-radius); background: var(--field); }
.dashboard-theme .dashboard-discovery-card:hover { background: var(--wash); filter: none; }
.dashboard-theme .dashboard-discovery-card h3 { font-size: var(--heading-4); }
.dashboard-theme .dashboard-overview-design .recent-work { margin-top: var(--space-9); }
.dashboard-theme .recent-work > p { color: var(--muted); font-size: var(--text-base); }
.dashboard-theme .challenge-grid > .challenge-card { background: var(--field); border: 1px solid var(--line); border-radius: var(--dashboard-radius); }
.dashboard-theme .challenge-card h3 { font-size: var(--heading-4); }
.dashboard-theme .challenge-card .eyebrow { color: var(--ink); }
.dashboard-theme .dashboard-footer { margin-top: var(--space-8); padding-top: var(--space-6); border-top: 1px solid var(--line); }
@media (max-width: 760px) {
  .dashboard-theme .dashboard-heading h1 { font-size: var(--heading-1); }
  .dashboard-theme .dashboard-overview-design .provocations { padding: var(--space-5); }
  .dashboard-theme .dashboard-overview { gap: var(--space-6); }
}

/* Approved discovery and personal-profile treatment; marketing remains separate. */
.ink-lime-theme {
  --paper: var(--dashboard-paper);
  --ink: var(--dashboard-ink);
  --muted: var(--dashboard-muted);
  --green: var(--dashboard-ink);
  --green-dark: var(--dashboard-ink);
  --line: var(--dashboard-line);
  --line-strong: var(--dashboard-field-line);
  --field: var(--dashboard-surface);
  --wash: var(--dashboard-sage);
  font-size: var(--text-base);
}
.ink-lime-theme .site-header { min-height: var(--space-11); }
.member-identity { display: grid; place-items: center; flex-shrink: 0; width: var(--space-10); height: var(--space-10); overflow: hidden; border-radius: 50%; background: var(--wash); color: var(--ink); font-family: Georgia, serif; font-size: var(--text-lg); }
.member-identity img { width: 100%; height: 100%; object-fit: cover; }
.identity-tone-1 { background: var(--peach); }
.identity-tone-2 { background: var(--sky); }
.identity-tone-3 { background: var(--citrus); }
.organisation-identity { border-radius: var(--dashboard-radius); font-family: inherit; font-weight: 600; }
.discovery-theme .discovery-intro { background: transparent; border: 0; border-radius: 0; padding: var(--space-7) 0; }
.discovery-theme .discovery-intro .ambient-mark { display: none; }
.discovery-theme .discovery-layout { grid-template-columns: 240px minmax(0, 1fr); gap: var(--space-8); }
.discovery-theme .discovery-sidebar { grid-column: auto; position: static; background: transparent; border: 0; border-right: 1px solid var(--line); border-radius: 0; padding: 0 var(--space-6) 0 0; }
.discovery-theme .discovery-sidebar .field { margin-bottom: var(--space-5); }
.discovery-theme .discovery-sidebar input, .discovery-theme .discovery-sidebar select { font-size: var(--text-sm); min-height: 44px; padding: var(--space-3); }
.discovery-theme .discovery-search { border: 0; padding: 0; margin: 0 0 var(--space-6); }
.discovery-theme .discovery-search .button { background: var(--dashboard-lime); color: var(--ink); border-color: transparent; min-height: 44px; font-size: var(--text-sm); }
.discovery-theme .discovery-results { grid-column: auto; min-width: 0; }
.discovery-theme .discovery-count { margin: 0 0 var(--space-5); }
.discovery-theme .directory-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); }
.discovery-theme .directory-card, .discovery-theme .directory-grid > .challenge-card { display: flex; flex-direction: column; min-width: 0; background: var(--field); border: 1px solid var(--line); border-radius: var(--dashboard-radius); padding: var(--space-6); overflow-wrap: anywhere; }
.directory-identity { display: flex; align-items: start; gap: var(--space-4); margin-bottom: var(--space-5); }
.directory-identity > div:last-child { min-width: 0; }
.discovery-theme .directory-identity h2 { font-size: var(--heading-3); }
.discovery-theme .directory-identity p { margin-bottom: 0; }
.discovery-theme .directory-card > p { font-size: var(--text-base); }
.discovery-theme .directory-card .directory-goals { display: flex; flex-wrap: wrap; gap: var(--space-2); list-style: none; padding: 0; margin: var(--space-4) 0; }
.directory-goals li { display: flex; align-items: baseline; gap: var(--space-2); font-size: var(--text-sm); }
.goal-dot { width: var(--space-2); height: var(--space-2); border-radius: 50%; background: var(--sdg-color); flex-shrink: 0; }
.directory-read-more { margin-top: auto; padding-top: var(--space-4); font-size: var(--text-sm); }
.applied-filters { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-bottom: var(--space-5); }
.applied-filters a { background: var(--wash); border-radius: var(--dashboard-radius); padding: var(--space-2) var(--space-3); font-size: var(--text-sm); overflow-wrap: anywhere; }
.discovery-theme .directory-grid > .challenge-card h3 { background: var(--sky); margin: 0 calc(-1 * var(--space-6)) var(--space-5); padding: var(--space-5) var(--space-6); font-family: Georgia, serif; font-size: var(--heading-2); font-weight: 400; }
.discovery-theme .directory-grid > .challenge-card.project-tone-1 h3 { background: var(--peach); }
.member-opening { display: flex; align-items: center; gap: var(--space-6); padding: var(--space-7) 0 var(--space-8); }
.member-opening .member-identity { width: var(--space-11); height: var(--space-11); }
.member-heading { flex: 1; min-width: 0; }
.member-heading h1 { font-size: var(--heading-1); }
.member-contact { font-size: var(--text-sm); }
.member-theme .current-challenge { padding-top: 0; background: var(--field); border: 1px solid var(--line); border-radius: var(--dashboard-radius); overflow: hidden; }
.member-theme .current-challenge > h2 { margin: 0; padding: var(--space-5) var(--space-6); background: var(--dashboard-lime); }
.member-theme .current-challenge .challenge-card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: var(--space-7); background: var(--field); border: 0; border-radius: 0; }
.member-theme .current-challenge .challenge-card h3 { font-family: Georgia, serif; font-weight: 400; font-size: var(--heading-2); grid-row: span 3; }
.member-theme .current-challenge .challenge-card .eyebrow { grid-column: 1 / -1; }
.member-theme .side-project-card, .member-theme .skill-card { background: var(--field); border: 1px solid var(--line); border-radius: var(--dashboard-radius); }
.member-theme .side-project-card:nth-child(even) { background: var(--field); }
.member-theme .side-project-cover { max-height: 240px; object-fit: cover; }
.member-theme .profile-body { border-top: 1px solid var(--line); gap: var(--space-8); padding-top: var(--space-7); }
.member-theme .member-purpose { max-width: 65ch; margin-block: var(--space-8); }
.member-theme .profile-section > h2 { font-size: var(--heading-3); }
@media (max-width: 900px) {
  .discovery-theme .discovery-layout { grid-template-columns: 200px minmax(0, 1fr); gap: var(--space-6); }
  .discovery-theme .directory-grid { grid-template-columns: 1fr; }
}
@media (max-width: 650px) {
  .discovery-theme .discovery-layout { grid-template-columns: 1fr; }
  .discovery-theme .discovery-sidebar { border-right: 0; border-bottom: 1px solid var(--line); padding: 0 0 var(--space-6); }
  .member-opening { flex-wrap: wrap; gap: var(--space-4); }
  .member-contact { margin-left: 0; }
  .member-theme .current-challenge .challenge-card { display: flex; }
}

.discovery-theme .directory-grid > .challenge-card.project-tone-2 h3 { background: var(--citrus); }
.discovery-theme .directory-grid > .challenge-card.project-tone-3 h3 { background: var(--wash); }

/* Signed-in header: the links collapse behind a Menu button on small screens. */
.site-header:has(.site-menu) { gap: var(--space-7); }
.site-menu { display: flex; flex: 1; align-items: center; justify-content: space-between; gap: var(--space-3) var(--space-7); min-width: 0; }
.site-menu .nav-menu-only { display: none; }
.nav-toggle { display: inline-flex; align-items: center; gap: var(--space-2); min-height: 44px; min-width: 44px; padding: 0 var(--space-4); font: inherit; font-size: var(--text-base); font-weight: 600; color: var(--ink); background: var(--field); border: 1px solid var(--line); border-radius: var(--dashboard-radius); cursor: pointer; }
.nav-toggle:hover { border-color: var(--line-strong); }
.nav-toggle:active { background: var(--wash); }
.nav-toggle[aria-expanded="true"] { background: var(--dashboard-lime); border-color: transparent; }
.nav-toggle[hidden] { display: none; }
@media (min-width: 761px) { .nav-toggle { display: none; } }
@media (max-width: 760px) {
  .site-header:has(.site-menu), .ink-lime-theme .site-header:has(.site-menu), .dashboard-theme .site-header:has(.site-menu) { flex-wrap: wrap; gap: var(--space-3); min-height: 0; padding-block: var(--space-4); }
  .site-header:has(.site-menu) .wordmark { width: auto; }
  .site-header.has-menu-toggle .nav-toggle { margin-inline-start: auto; }
  .site-header.has-menu-toggle:not(.menu-open) .site-menu { display: none; }
  .site-menu { flex-basis: 100%; flex-direction: column; align-items: stretch; gap: 0; padding-bottom: var(--space-2); }
  .site-header .site-menu nav, .site-header .site-menu nav.nav-group { display: flex; flex-direction: column; align-items: stretch; gap: 0; width: 100%; margin: 0; }
  .site-header .site-menu a, .site-header .site-menu .nav-account { display: flex; align-items: center; justify-content: flex-start; min-height: 48px; padding: var(--space-2) var(--space-3); border: 0; border-top: 1px solid var(--line); border-radius: 0; font-size: var(--text-base); text-align: start; }
  .site-header .site-menu a[aria-current] { box-shadow: inset 3px 0 var(--green); }
  .site-menu .nav-menu-only { display: flex; }
}

/* Discovery on small screens: search stays in view, filters move into a sheet. */
.filter-sheet { position: static; inset: auto; width: auto; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: none; color: inherit; }
.filter-sheet-header, .filter-sheet:not(:modal) .filter-apply { display: none; }
.filter-open[hidden] { display: none; }
.filter-open { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); min-height: 44px; padding: var(--space-2) var(--space-5); font-size: var(--text-base); color: var(--ink); border-color: var(--line-strong); background: var(--field); }
.filter-count { display: inline-grid; place-items: center; min-width: 1.6em; height: 1.6em; padding: 0 .4em; border-radius: 999px; background: var(--ink); color: var(--field); font-size: var(--text-xs); font-weight: 700; }
.icon-button { display: inline-grid; place-items: center; width: 44px; height: 44px; padding: 0; color: var(--ink); background: transparent; border: 1px solid transparent; border-radius: var(--dashboard-radius); cursor: pointer; }
.icon-button:hover { border-color: var(--line); }
.icon-button:active { background: var(--wash); }
.filter-sheet:modal { position: fixed; inset: auto 0 0; display: flex; flex-direction: column; width: 100%; max-width: 100%; max-height: 85vh; max-height: 85dvh; margin: 0; padding: 0; background: var(--paper); color: var(--ink); border-radius: 16px 16px 0 0; box-shadow: 0 -8px 32px rgb(37 52 59 / .18); }
.filter-sheet::backdrop { background: rgb(37 52 59 / .45); }
.filter-sheet:modal .filter-sheet-header { display: flex; flex: none; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-3) var(--space-3) var(--space-3) var(--space-5); border-bottom: 1px solid var(--line); }
.filter-sheet:modal .filter-sheet-header h2 { margin: 0; font-size: var(--text-md); }
.discovery-theme .filter-sheet:modal .directory-filters { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; margin: 0; padding: var(--space-5); font-size: var(--text-base); }
.discovery-theme .filter-sheet:modal .field { margin-bottom: var(--space-5); }
.discovery-theme .filter-sheet:modal input, .discovery-theme .filter-sheet:modal select { min-height: 48px; font-size: var(--text-base); }
.filter-sheet:modal .filter-sheet-actions { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3); flex: none; padding: var(--space-4) var(--space-5) calc(var(--space-4) + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); background: var(--paper); }
.filter-sheet:modal .filter-apply { min-height: 48px; padding-block: var(--space-2); background: var(--dashboard-lime); color: var(--ink); border-color: transparent; font-size: var(--text-base); }
.filter-sheet:modal .filter-clear { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; border: 1px solid var(--line-strong); border-radius: var(--radius); color: var(--ink); text-decoration: none; font-size: var(--text-base); }
html.sheet-open, html.sheet-open body { overflow: hidden; }
@media (max-width: 650px) {
  .discovery-theme .discovery-layout { gap: var(--space-5); margin-top: var(--space-4); }
  .discovery-theme .discovery-sidebar { padding-bottom: var(--space-5); }
  .discovery-sidebar:has(.filter-open:not([hidden])) .filters-sidebar-title { display: none; }
  .discovery-theme .discovery-search { grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-2); margin-bottom: var(--space-3); }
  .discovery-theme .discovery-search .discovery-sidebar-title { display: none; }
  .discovery-theme .discovery-search .button { width: auto; padding-inline: var(--space-5); font-size: var(--text-base); }
  .discovery-theme .discovery-sidebar input, .discovery-theme .discovery-sidebar select { font-size: var(--text-base); }
  .discovery-theme .discovery-intro { padding: var(--space-5) 0 var(--space-3); }
  .discovery-nav.profile-tabs { margin-bottom: 0; }
  .discovery-nav.profile-tabs a { flex: 1 1 auto; justify-content: center; min-height: 48px; }
  .applied-filters a { display: inline-flex; align-items: center; min-height: 44px; padding: var(--space-2) var(--space-4); color: var(--ink); text-decoration: none; }
  .applied-filters a:active { background: var(--line); }
}
@media (max-width: 400px) {
  .discovery-nav.profile-tabs .section-icon { display: none; }
  .discovery-nav.profile-tabs a { padding-inline: var(--space-2); }
}

/* Signed-in pages on small screens: smaller headings, one reading column, no sideways scrolling. */
@media (max-width: 650px) {
  .app-page { --heading-1: 2rem; --heading-2: 1.5rem; --heading-3: 1.2rem; --heading-display: 2.3rem; }
  .app-page main { overflow-wrap: anywhere; }
  .app-page h1 br, .app-page h2 br, .app-page .intro br { display: none; }
  .member-opening { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: var(--space-4); padding: var(--space-5) 0 var(--space-7); }
  .member-opening .member-identity { width: var(--space-10); height: var(--space-10); }
  .member-heading h1 { margin-bottom: var(--space-1); }
  .member-heading .profile-location { margin: 0; font-size: var(--text-base); }
  .member-opening .member-contact { grid-column: 1 / -1; width: 100%; min-height: 48px; display: inline-flex; align-items: center; justify-content: center; font-size: var(--text-base); }
  .member-theme .current-challenge > h2 { padding: var(--space-4) var(--space-5); }
  .member-theme .current-challenge .challenge-card { padding: var(--space-5); }
  .profile-toolbar .button.small { min-height: 44px; }
}

/* Dashboard on small screens: one reading column with comfortable tap targets. */
@media (max-width: 650px) {
  .dashboard-theme .dashboard-heading, .dashboard-overview-design .dashboard-heading { margin-block: var(--space-5) var(--space-6); }
  .dashboard-heading .dashboard-edit-profile { grid-column: 1 / -1; justify-self: start; }
  .dashboard-question-footer { gap: 0 var(--space-5); margin-top: var(--space-2); }
  .dashboard-question-footer p { font-size: var(--text-sm); }
  .dashboard-question-footer a, .dashboard-question-goal a, .dashboard-section-heading > a, .dashboard-meta-actions a, .dashboard-meta section > p > a { display: inline-flex; align-items: center; min-height: 44px; }
  .dashboard-theme .dashboard-priority-links li { padding: 0; }
  .dashboard-priority-links a { display: flex; align-items: center; min-height: 44px; padding: var(--space-2) var(--space-3); }
  .dashboard-theme .dashboard-meta, .dashboard-theme .dashboard-overview-design .dashboard-meta { padding: var(--space-5); }
  .dashboard-overview .provocation-choices button { font-size: var(--text-base); white-space: normal; }
  .provocation-permalink { min-width: 44px; min-height: 44px; padding: 10px; margin: -10px -10px -10px -4px; vertical-align: middle; box-sizing: border-box; }
}
@media (max-width: 340px) {
  .dashboard-theme .dashboard-overview-design .provocation-choices { grid-template-columns: 1fr; }
}

/* Shared touch and state details for signed-in pages on small screens. */
@media (max-width: 760px) {
  .app-page main summary { padding-block: 10px; cursor: pointer; }
  .app-page main label:has(> input[type=checkbox]), .app-page main label:has(> input[type=radio]) { display: flex; align-items: flex-start; gap: var(--space-2); min-height: 44px; padding-block: var(--space-2); }
  .app-page main input[type=checkbox], .app-page main input[type=radio] { flex: none; width: 22px; height: 22px; margin-top: .15em; }
  .app-page main input:not([type=submit], [type=checkbox], [type=radio], [type=file], [type=hidden]), .app-page main textarea, .app-page main select { font-size: max(16px, 1em); min-height: 48px; }
  .app-page main .button { min-height: 48px; }
  .app-page main .actions { gap: var(--space-3); }
  .app-page main a[href^="mailto:"], .app-page main a[href^="http"] { overflow-wrap: anywhere; }
  .app-page .site-footer a { display: inline-flex; align-items: center; min-height: 44px; }
}
.app-page button:disabled, .app-page .button[aria-disabled="true"] { opacity: .55; cursor: not-allowed; }
.app-page button[aria-busy="true"], .app-page form[aria-busy="true"] button { cursor: progress; }
.app-page main .button:active, .app-page main button:active { transform: translateY(1px); }

/* Long profile forms: keep Save in reach without covering the field being edited. */
@media (max-width: 650px) {
  html:has(.profile-editor) { scroll-padding-bottom: 96px; }
  .profile-editor form > .actions:last-child { position: sticky; bottom: 0; z-index: 2; margin-inline: -20px; padding: var(--space-3) 20px calc(var(--space-3) + env(safe-area-inset-bottom)); background: var(--paper); border-top: 1px solid var(--line); }
  .profile-editor form > .actions:last-child .button { width: 100%; }
  .profile-editor .page-intro { padding-block: var(--space-5); }
}

/* Profiles, empty states and the header mark on small screens. */
@media (max-width: 650px) {
  .app-page .member-opening { align-items: start; }
  .app-page .member-heading h1 { hyphens: auto; }
  .app-page .public-profile { padding-bottom: var(--space-9); }
  .app-page .empty-state { padding: var(--space-6) 0; }
  .app-page .empty-state p:last-child { margin-bottom: 0; }
  .site-header:has(.site-menu) .wordmark { min-height: 44px; }
  .app-page main summary { padding-block: 12px; }
}
.filter-sheet:not(:modal) .filter-sheet-actions { display: grid; margin-top: var(--space-3); font-size: var(--text-sm); }

/* Personal & editorial. Builds on the shared mobile rules from PR #16. */
.editorial-profile .member-opening { display: grid; grid-template-columns: minmax(0, 1fr) 174px; gap: var(--space-5) var(--space-8); align-items: start; }
.editorial-profile .member-heading { min-width: 0; }
.editorial-profile .member-heading h1 { margin-block: var(--space-3) var(--space-4); }
.editorial-profile .member-opening .member-identity { grid-column: 2; grid-row: 1 / 3; width: 174px; height: 205px; border-radius: 8px 44px 8px 8px; font-size: 3rem; overflow: hidden; }
.editorial-profile .member-identity .profile-avatar { width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }
.editorial-profile .member-introduction { max-width: 58ch; font-size: var(--text-md); }
.editorial-profile .member-actions { display: flex; flex-wrap: wrap; gap: var(--space-5); align-items: center; min-width: 0; }
.editorial-profile .member-contact { margin: 0; }
.member-availability { display: flex; align-items: baseline; flex-wrap: wrap; gap: var(--space-2) var(--space-3); font-size: var(--text-sm); margin: var(--space-4) 0 0; }
.availability-dot { width: 8px; height: 8px; flex: none; border-radius: 50%; background: var(--muted); }
.availability-dot.is-open { background: #278349; }
.editorial-profile .member-purpose { max-width: 640px; margin: 0 0 var(--space-7); border-top: 1px solid var(--line); padding-top: var(--space-6); font: 400 clamp(1.4rem, 2.5vw, 1.75rem)/1.55 Georgia, serif; }
.editorial-profile .member-purpose p:last-child { margin-bottom: 0; }
.editorial-current-project { background: var(--dashboard-lime); padding: var(--space-7); border-radius: var(--dashboard-radius); }
.editorial-profile .editorial-current-project > h2 { font: 400 var(--heading-2)/1.2 Georgia, serif; }
.editorial-current-project h2 a { text-decoration: none; }
.editorial-current-project .eyebrow { margin-bottom: var(--space-3); }
.member-project-need { padding-top: var(--space-4); border-top: 1px solid #a8b66e; }
.editorial-current-project .actions { margin-bottom: 0; }
/* Independent collections: a long side-project list must never hold up the story. */
.editorial-profile .profile-body { margin-top: 0; align-items: start; }
.editorial-profile .profile-body.without-interests { grid-template-columns: minmax(0, 1fr); }
.editorial-profile .profile-body.without-interests .profile-main { max-width: 820px; width: 100%; }
.editorial-profile .profile-main > .editorial-current-project:first-child { margin-top: 0; }
.editorial-profile .public-profile > #side-projects { margin-top: var(--space-8); }
.editorial-profile #side-projects .side-project-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: var(--space-7); }
.editorial-profile .side-project-card { min-width: 0; }
.editorial-profile .side-project-copy h3 { font: 400 1.5rem/1.25 Georgia, serif; }
.editorial-profile .side-project-cover { height: auto; max-height: none; aspect-ratio: 16 / 9; }
.editorial-profile .side-project-excerpt { max-width: 60ch; }
.editorial-profile .side-project-card details { margin-block: var(--space-3); }
.editorial-profile .side-project-card summary { min-height: 44px; margin: 0; padding-block: var(--space-2); }
@media (max-width: 650px) {
  .editorial-profile .member-opening { grid-template-columns: minmax(0, 1fr) 76px; gap: var(--space-4); }
  .editorial-profile .member-opening .member-identity { width: 76px; height: 100px; grid-row: 1; border-radius: 7px 24px 7px 7px; font-size: 1.6rem; }
  .editorial-profile .member-actions { grid-column: 1 / -1; }
  .editorial-profile .member-actions .member-contact { width: 100%; }
  .editorial-profile .member-actions .profile-website, .member-availability a { display: inline-flex; align-items: center; min-height: 44px; }
  .editorial-profile #side-projects .side-project-grid { grid-template-columns: minmax(0, 1fr); }
  .editorial-current-project { padding: var(--space-5); }
  .editorial-current-project .actions a { min-height: 44px; display: inline-flex; align-items: center; }
}
/* Project story with an identity-led sidebar; no cover image required. */
.project-editorial-layout { display: grid; grid-template-columns: minmax(0, 1fr) 240px; gap: var(--space-9); align-items: start; }
.project-editorial-layout > * { min-width: 0; overflow-wrap: anywhere; }
.project-editorial-heading h1 { margin-bottom: var(--space-5); }
.project-state { font-size: var(--text-sm); color: var(--muted); margin-bottom: var(--space-3); }
.project-state.is-active { color: #25643b; }
.project-state.is-active::before { content: ''; display: inline-block; width: 7px; height: 7px; background: currentColor; border-radius: 50%; margin-right: 8px; }
.project-about-label { font-size: var(--text-sm); color: var(--muted); font-weight: 500; }
.project-lead { font-size: var(--text-md); }
.project-editorial .challenge-help { background: var(--dashboard-lime); padding: var(--space-6); border: 0; border-radius: var(--dashboard-radius); margin: var(--space-6) 0 var(--space-7); }
.project-editorial .challenge-help h2 { margin: 0 0 var(--space-3); font-size: var(--text-sm); }
.project-editorial .help-options { font: 400 1.6rem/1.3 Georgia, serif; }
.project-editorial .challenge-help .hint { margin: var(--space-4) 0 0; font-size: var(--text-sm); }
.project-identity .member-identity { width: 104px; height: 120px; border-radius: 7px 30px 7px 7px; margin-bottom: var(--space-5); overflow: hidden; }
.project-identity .profile-avatar { width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }
.project-identity h2 { font: 400 1.5rem/1.3 Georgia, serif; }
.project-identity h2 a { text-decoration: none; }
.project-identity > .small-note { margin-bottom: var(--space-2); }
.project-identity .project-organisation { margin-block: var(--space-4) var(--space-5); }
.project-identity section { margin-top: var(--space-7); }
.project-identity section h2 { font-family: inherit; font-size: var(--text-sm); font-weight: 500; line-height: 1.4; }
.project-identity ul { list-style: none; padding: 0; font-size: var(--text-sm); }
.project-identity li { margin-bottom: var(--space-3); }
.project-place { font-size: var(--text-sm); margin-bottom: var(--space-2); }
@media (max-width: 650px) {
  .project-editorial-layout { grid-template-columns: minmax(0, 1fr); gap: var(--space-7); }
  .project-editorial .project-editorial-heading h1 { font-size: 2.2rem; }
  .project-editorial .challenge-help .button { width: 100%; min-height: 48px; }
  .project-editorial .actions a { min-height: 44px; }
  .project-identity a { display: inline-block; padding-block: 8px; }
}

.project-goal { display: flex; align-items: baseline; gap: 10px; }
.project-goal-number { flex: none; background: var(--sdg-color); color: #17231d; border-radius: 4px; padding: 5px 9px; font-weight: 600; }
.project-editorial .project-editorial-heading { border: 0; padding-top: 0; }

/* Editorial organisation profiles: real work first, compact identity alongside. */
.company-layout { display: grid; grid-template-columns: minmax(0, 1fr) 240px; gap: var(--space-9); align-items: start; padding-top: var(--space-6); }
.company-layout > * { min-width: 0; overflow-wrap: anywhere; }
.company-opening h1 { margin-bottom: var(--space-5); }
.company-lead { font-size: var(--text-lg); max-width: 58ch; }
.company-current-work { margin-top: var(--space-7); padding: var(--space-6); background: var(--dashboard-lime); border-radius: var(--dashboard-radius); }
.company-current-work h2 { font: 400 var(--heading-2)/1.2 Georgia, serif; }
.company-current-work h2 a { text-decoration: none; }
.company-current-work .actions { margin-bottom: 0; }
.company-need { border-top: 1px solid #a8b66e; padding-top: var(--space-4); }
.company-section { border-top: 1px solid var(--line); padding-top: var(--space-6); margin-top: var(--space-7); }
.company-section > h2 { font-size: var(--heading-3); }
.company-products { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6); }
.company-product h3 { font-size: var(--text-md); }
.company-product h4 { font-size: var(--text-base); }
.company-product p { font-size: var(--text-base); }
.company-identity .member-identity { width: 104px; height: 104px; border-radius: 9px; margin-bottom: var(--space-6); font-size: 2rem; }
.company-identity p { font-size: var(--text-sm); }
.company-identity .company-location { margin-bottom: var(--space-2); }
.company-contact, .company-goals { margin-top: var(--space-7); }
.company-goals h2 { font-size: var(--text-sm); font-weight: 500; color: var(--muted); }
.company-goals ul { list-style: none; padding: 0; }
.company-goal { display: flex; gap: var(--space-3); align-items: baseline; margin-top: var(--space-4); font-size: var(--text-sm); }
.company-goal-number { flex: none; border-left: 5px solid var(--sdg-color); padding: 2px 8px; font-weight: 600; }
.company-direct-contact { margin-block: var(--space-6); }
.company-story .profile-project-grid { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 650px) {
  .company-layout { grid-template-columns: minmax(0, 1fr); gap: var(--space-7); }
  .company-products { grid-template-columns: minmax(0, 1fr); }
  .company-opening h1 { font-size: 2.3rem; }
  .company-identity { padding-top: var(--space-6); border-top: 1px solid var(--line); }
  .company-editorial .actions a, .company-identity a { min-height: 44px; display: inline-flex; align-items: center; }
  .company-current-work .button, .company-direct-contact .button { width: 100%; }
}
.company-identity .company-goals { background: transparent; border: 0; padding: 0; border-radius: 0; }

/* Work first, reflection second; same reading order at every width. */
.dashboard-theme .dashboard-overview { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); }
.dashboard-theme .dashboard-overview-meta-only { grid-template-columns: minmax(0, 1fr); }
.dashboard-theme .dashboard-project-link { font: 400 var(--heading-2)/1.2 Georgia, serif; }
.dashboard-next-actions { display: flex; flex-wrap: wrap; gap: var(--space-5); margin-block: var(--space-5); }
.dashboard-next-actions a { min-height: 44px; display: inline-flex; align-items: center; }
.sdg-projects { margin-block: var(--space-8); padding-top: var(--space-6); border-top: 1px solid var(--line); }
.sdg-projects .challenge-card { min-width: 0; overflow-wrap: anywhere; }
.sdg-projects > p:last-child { margin-top: var(--space-5); }
.editing-theme .profile-panel { max-width: 820px; }
.editing-theme .profile-tabs { flex-wrap: wrap; }
.editing-theme .profile-tabs a { min-height: 44px; }
.editing-theme .onboarding-page > h1 { margin-top: var(--space-5); }
@media (max-width: 650px) {
  .dashboard-theme .dashboard-overview { grid-template-columns: minmax(0, 1fr); }
  .sdg-projects .challenge-grid { grid-template-columns: minmax(0, 1fr); }
  .editing-theme .profile-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: visible; }
  .editing-theme .profile-tabs a { white-space: normal; padding: var(--space-3); }
  .editing-theme .profile-editor .actions > a { min-height: 44px; display: inline-flex; align-items: center; }
}
.dashboard-theme .dashboard-meta .dashboard-project-link { font: 400 var(--heading-2)/1.2 Georgia, serif; }
.goals-theme .sdg-goal-summary .button { white-space: normal; max-width: 100%; }
@media (max-width: 650px) {
  .goals-theme .sdg-goal-summary .button { width: 100%; }
}

/* Personal profile editor: the same editorial language as the public profile. */
.story-editor { max-width: 1120px; margin: 0 auto; padding: var(--space-6) 0; }
.story-editor .page-intro { display: flex; justify-content: space-between; align-items: start; gap: var(--space-6); padding: var(--space-4) 0; margin: var(--space-6) 0 var(--space-8); }
.story-editor .page-intro h1 { margin: var(--space-2) 0; }
.story-editor-layout { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: var(--space-10); align-items: start; }
.story-editor .story-nav { display: flex; flex-direction: column; border: 0; gap: var(--space-2); margin: 0; white-space: normal; overflow: visible; }
.story-editor .story-nav a { border: 0; border-radius: 7px; padding: var(--space-4); color: var(--ink); min-height: 44px; text-decoration: none; }
.story-editor .story-nav a[aria-current] { background: var(--dashboard-lime); }
.story-nav small { display: block; font-size: var(--text-xs); font-weight: 400; color: var(--muted); margin-top: var(--space-1); }
.story-account { margin-top: var(--space-6); font-size: var(--text-sm); overflow-wrap: anywhere; }
.story-editor .profile-panel { width: 100%; min-width: 0; max-width: none; }
.story-section-intro { margin-bottom: var(--space-6); }
.story-save-state { display: flex; justify-content: space-between; align-items: center; gap: var(--space-4); padding: var(--space-4); background: var(--dashboard-sage); border-radius: 6px; margin: var(--space-6) 0; }
.story-editor [data-save-state] small { display: block; font-size: var(--text-xs); }
.story-editor [data-save-state] strong { font-size: var(--text-sm); }
.story-editor [data-save-state].is-dirty { background: #fff0d8; color: #704810; }
.story-editor .story-save-bar { display: flex; justify-content: space-between; align-items: center; padding: var(--space-4); border-top: 2px solid var(--dashboard-line); background: var(--dashboard-paper); position: sticky; bottom: 0; z-index: 5; }
.story-editor .story-save-bar > div { min-width: 0; }
.story-identity-row { display: grid; grid-template-columns: minmax(0, 1fr) 128px; gap: var(--space-6); align-items: start; }
.story-identity-row input[name="submission[name]"] { font-family: Georgia, serif; font-size: clamp(26px, 3.5vw, 40px); letter-spacing: -1px; }
.story-photo-frame { position: relative; width: 128px; height: 150px; overflow: hidden; border-radius: 6px 32px 6px 6px; background: var(--peach); display: grid; place-items: center; }
.story-photo-initials { font: 36px Georgia, serif; }
.story-photo-frame .profile-avatar { position: absolute; inset: 0; width: 100%; height: 100%; border-radius: 0; object-fit: cover; }
.story-photo-label { position: absolute; bottom: 0; left: 0; right: 0; text-align: center; background: var(--dashboard-ink); color: white; padding: 10px 0; font-size: var(--text-sm); margin: 0; min-height: 44px; }
.story-photo-frame input[type=file] { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.story-photo-frame:focus-within { outline: 3px solid var(--focus); outline-offset: 3px; }
.story-photo .hint, .story-photo .profile-photo-remove { font-size: var(--text-xs); }
.story-photo .profile-photo-remove { display: flex; align-items: start; gap: var(--space-1); }
.story-photo .profile-photo-remove input { width: auto; }
.story-photo .profile-photo-remove label { font-size: var(--text-xs); }
.story-public-field { margin: var(--space-6) 0; }
.story-visibility { font-size: var(--text-xs); color: var(--muted); margin-bottom: var(--space-1); }
.story-purpose { background: var(--dashboard-sage); padding: var(--space-6); border-radius: 4px 26px 4px 4px; margin: var(--space-8) 0; }
.story-purpose .story-public-field { margin: 0; }
.story-purpose textarea { font-family: Georgia, serif; font-size: var(--text-xl); line-height: 1.45; background: transparent; min-height: 180px; }
.story-editor textarea[name="submission[skills_summary]"], .story-editor textarea[name="submission[current_focus]"] { font-size: var(--text-lg); min-height: 145px; }
.story-project { padding: var(--space-6); background: var(--dashboard-lime); border-radius: 6px 30px 6px 6px; margin: var(--space-6) 0; }
.story-project h3 { font-family: Georgia, serif; font-size: var(--text-xl); }
.story-side-projects { margin-top: var(--space-8); }
.story-editor ::placeholder { color: var(--dashboard-muted); opacity: 1; }
@media (max-width: 750px) {
  .story-editor-layout { grid-template-columns: 1fr; gap: var(--space-6); }
  .story-editor .story-nav { display: grid; grid-template-columns: 1fr 1fr; }
  .story-editor .story-nav a { padding: var(--space-3); }
  .story-editor .page-intro { flex-wrap: wrap; gap: var(--space-4); }
  .story-identity-row { grid-template-columns: minmax(0, 1fr) 86px; gap: var(--space-3); }
  .story-photo-frame { width: 86px; height: 112px; }
  .story-save-state { flex-wrap: wrap; }
  .story-editor .story-save-bar { flex-wrap: wrap; }
  .story-editor .story-save-bar .button { width: 100%; }
  .story-purpose { padding: var(--space-4); }
}
.story-photo-frame .profile-avatar[hidden] { display: none; }