:root {
  color-scheme: light;
  --ink: light-dark(#243039, #edf2f5);
  --muted: light-dark(#53636a, #b4c2ca);
  --accent: light-dark(#176052, #9ed8c6);
  --accent-deep: light-dark(#12493f, #b9e7d9);
  --on-accent: light-dark(#fff, #142821);
  --paper: light-dark(#f7f6f1, #151e25);
  --card: light-dark(#fff, #202c35);
  --border: light-dark(#d8e0df, #3e505b);
  --highlight: light-dark(#edf3f0, #283941);
  --field-border: light-dark(#85978f, #8095a1);
  --focus: light-dark(#08658c, #88d5ff);
  --error: light-dark(#9d2830, #ffb0b4);
  --gold: light-dark(#855a22, #f6cc87);
  --green-bg: light-dark(#d7f1e4, #284d3e);
  --green-ink: light-dark(#054b41, #c2f2dd);
  --blue-bg: light-dark(#e0effa, #273f57);
  --blue-ink: light-dark(#194467, #cee6ff);
  --gold-bg: light-dark(#f7ead3, #463721);
  --violet-bg: light-dark(#eee8f8, #403451);
  --violet-ink: light-dark(#4a4269, #ebdcff);
  --radius: .95rem;
  --shadow: 0 .2rem .85rem color-mix(in srgb, var(--ink) 7%, transparent);
  font: 100%/1.55 system-ui, sans-serif;
  color: var(--ink);
  background: var(--paper);
}
:root[data-theme="light"] { color-scheme: light; }
:root[data-theme="dark"] { color-scheme: dark; }

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-padding-top: 1rem; }
body { margin: 0; min-height: 100vh; }
a { color: var(--accent-deep); text-underline-offset: .22em; }
:focus-visible { outline: .18rem solid var(--focus); outline-offset: .18rem; }
.shell { width: min(100% - 2rem, 76rem); margin-inline: auto; }
.site-header { background: var(--card); border-bottom: 1px solid var(--border); }
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: .7rem 1.2rem; padding-block: .8rem; flex-wrap: wrap; }
.wordmark { color: var(--ink); font-size: 1rem; font-weight: 720; line-height: 1.2; letter-spacing: -.025em; text-decoration: none; }
nav { display: flex; flex-wrap: wrap; gap: .2rem; font-size: .92rem; }
nav a { display: inline-flex; align-items: center; min-height: 2.5rem; padding: .4rem .7rem; border-radius: .55rem; color: var(--muted); font-weight: 600; text-decoration: none; }
nav a:hover, nav a[aria-current="page"] { color: var(--accent-deep); background: var(--highlight); }
.appearance { display: flex; flex-direction: column; align-items: center; gap: .2rem; padding: .1rem .25rem; color: var(--muted); font-size: .74rem; font-weight: 600; cursor: pointer; }
.appearance input[type="checkbox"] { appearance: none; position: relative; width: 2.65rem; height: 1.5rem; margin: 0; border: 1px solid var(--field-border); border-radius: 2rem; background: var(--highlight); cursor: pointer; transition: background .16s ease; }
.appearance input::before { content: ""; position: absolute; top: .16rem; left: .16rem; width: 1.05rem; height: 1.05rem; border-radius: 50%; background: var(--muted); transition: transform .16s ease; }
.appearance input:checked { background: var(--accent); border-color: var(--accent); }
.appearance input:checked::before { transform: translateX(1.1rem); background: var(--on-accent); }
.skip { position: absolute; left: 1rem; top: .75rem; padding: .6rem .9rem; background: var(--card); z-index: 1; }
.skip:not(:focus) { clip-path: inset(50%); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }

.intro { max-width: 49rem; padding-block: clamp(2rem, 5vw, 3.75rem) 1.75rem; }
.intro h1 { font-size: clamp(2.15rem, 4.7vw, 3.35rem); line-height: 1.08; letter-spacing: -.045em; margin: .4rem 0 .7rem; }
.intro p:not(.eyebrow) { font-size: 1.12rem; color: var(--muted); max-width: 43rem; margin: .75rem 0; }
.eyebrow { color: var(--accent-deep); font-size: .78rem; font-weight: 750; letter-spacing: .09em; margin: 0; text-transform: uppercase; }
h2 { font-size: clamp(1.45rem, 2.8vw, 2rem); line-height: 1.22; letter-spacing: -.02em; margin: 0; }
h3 { font-size: 1.11rem; margin: 1rem 0 .3rem; }
h4, h5 { font-size: 1rem; margin: 0; }
.section-head { margin-bottom: 1rem; }
.section-head p:not(.eyebrow) { color: var(--muted); margin: .35rem 0; }
.welcome { max-width: 42rem; margin-inline: auto; padding-top: clamp(1.65rem, 5vw, 3.3rem); }
.welcome-intro { margin-bottom: clamp(1.1rem, 3.25vw, 1.5rem); }
.welcome-intro h1 { margin: 0; max-width: 23ch; font: 500 clamp(2.35rem, 5.2vw, 3.5rem)/1.06 Georgia, serif; letter-spacing: -.044em; text-wrap: balance; }
.welcome-intro p { max-width: 36rem; margin: .8rem 0 0; color: var(--muted); font-size: clamp(1rem, 1.9vw, 1.13rem); }
.sample-examples { display: flex; align-items: center; flex-wrap: wrap; gap: 0 .85rem; margin-top: 1rem; padding: .15rem .1rem; }
.sample-examples h2 { margin: 0; font-size: .95rem; letter-spacing: 0; }
.sample-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0 1rem; }
.sample-actions .link-button { min-height: 2.75rem; text-align: left; }
[data-portable] .sample-actions { gap: .55rem; margin-top: .55rem; }
[data-portable] .sample-actions .link-button { border: 1px solid var(--border); border-radius: .55rem; padding: .5rem .8rem; background: var(--card); text-decoration: none; }
[data-portable] .sample-actions .link-button:hover { background: var(--highlight); }
.panel { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); padding: clamp(.9rem, 2.6vw, 1.6rem); box-shadow: var(--shadow); }
.browse-page .intro { padding-bottom: .45rem; }
.text-link { font-weight: 650; }
.footer { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .35rem 1rem; border-top: 1px solid var(--border); color: var(--muted); font-size: .86rem; margin-top: clamp(2rem, 6vw, 3.6rem); padding-block: 1rem; }
.footer p { margin: 0; }

label { display: block; font-weight: 650; }
.help { font-size: .88rem; color: var(--muted); margin: .25rem 0; }
textarea, select, input[type="search"], input[type="text"] {
  display: block;
  width: 100%;
  min-height: 2.6rem;
  border: 1px solid var(--field-border);
  border-radius: .45rem;
  padding: .55rem .7rem;
  color: var(--ink);
  background: var(--card);
  font: inherit;
}
textarea { max-width: 50rem; min-height: 5.75rem; margin-top: .4rem; resize: vertical; }
.intake-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem 1rem; }
.intake-grid .wide { grid-column: 1 / -1; }
.intake-grid label { margin-bottom: .2rem; }
.intake-grid textarea { max-width: none; min-height: 4.6rem; }
.intake-panel { border-radius: 1.1rem; padding: clamp(1rem, 3.5vw, 1.5rem); box-shadow: 0 .55rem 1.7rem color-mix(in srgb, var(--ink) 6%, transparent); }
#description-form label { font-family: inherit; font-size: 1rem; font-weight: 650; line-height: inherit; letter-spacing: normal; }
.business-name-field { margin-bottom: 1.1rem; }
.business-name-field input { margin-top: .4rem; }
#description { min-height: 6.15rem; margin-top: .65rem; padding: .7rem .85rem; border-radius: .7rem; }
textarea::placeholder, input::placeholder { color: var(--muted); opacity: .9; }
.intake-details { margin-top: .75rem; }
.intake-details > summary { padding: .45rem 0; color: var(--accent-deep); }
.intake-details > .intake-grid { margin: .55rem 0 1rem; }
.intake-details > button { margin-top: .5rem; }
.intake-actions { margin-top: .7rem; gap: .65rem 1rem; }
.intake-actions button { display: inline-flex; gap: .65rem; align-items: center; min-height: 2.85rem; padding-inline: .9rem; border-radius: .65rem; }
.intake-privacy { display: flex; align-items: center; gap: .35rem; margin: 0; color: var(--muted); font-size: .84rem; }
.intake-privacy svg { flex: none; }
.sample-filling { border-color: var(--accent) !important; outline: .16rem solid color-mix(in srgb, var(--accent) 22%, transparent); outline-offset: .1rem; background: var(--highlight) !important; }
#suggest.sample-pressed, #suggest:active { transform: translateY(2px); background: var(--accent-deep); box-shadow: 0 0 0 .24rem color-mix(in srgb, var(--accent) 22%, transparent); opacity: 1; }
.optional { color: var(--muted); font-size: .82rem; font-weight: 400; }
.split-head, .item-heading { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: .35rem .75rem; }
.split-head h3, .item-heading h3 { margin: 0; }
button, .button-link {
  min-height: 2.6rem;
  border: 1px solid var(--accent);
  border-radius: .45rem;
  background: var(--accent);
  color: var(--on-accent);
  font: inherit;
  font-weight: 650;
  cursor: pointer;
  padding: .5rem .8rem;
}
.button-link { display: inline-flex; align-items: center; text-decoration: none; }
button:hover, .button-link:hover { background: var(--accent-deep); color: var(--on-accent); }
button.secondary { background: var(--card); color: var(--accent-deep); }
button.secondary:hover { background: var(--highlight); }
button:disabled { opacity: .65; cursor: wait; }
button.link-button { background: transparent; color: var(--accent-deep); border: 0; min-height: auto; padding: .15rem .08rem; text-decoration: underline; text-underline-offset: .2em; }
button.link-button:hover { background: var(--highlight); }
.actions { display: flex; align-items: center; flex-wrap: wrap; gap: .6rem; margin: .75rem 0 .4rem; }
.status { font-size: .94rem; color: var(--muted); margin: .75rem 0 .4rem; }
.status:empty { margin: 0; }
.status.error { color: var(--error); font-weight: 650; }
.question { font-weight: 700; padding: .7rem; border-left: .24rem solid var(--accent); background: var(--highlight); }
.check-line { display: flex; align-items: center; gap: .45rem; min-height: 2.3rem; }
input[type="checkbox"] { width: 1.15rem; height: 1.15rem; accent-color: var(--accent); flex: none; margin: 0; }

.filters { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: .65rem; }
.tool-ai-filter { margin-top: .65rem; }
.catalog-details { margin-top: .75rem; }
.catalog-details > summary { padding: .4rem 0; color: var(--accent-deep); }
.catalog-details > .filters { margin-top: .35rem; }
.filters > *, .profile-filters > * { min-width: 0; }
.filters label, .profile-filters label { margin-bottom: .25rem; }
.profile-filters { display: flex; flex-wrap: wrap; align-items: end; gap: .5rem 1.2rem; margin-top: .9rem; }
.profile-filters a { padding-bottom: .45rem; }
summary { cursor: pointer; font-weight: 650; }
.function-group { margin-top: 1.3rem; }
.function-group h3 { margin-bottom: .15rem; }
.function-group > p { margin: 0 0 .45rem; }
.function { border: 1px solid var(--border); background: var(--card); border-radius: .5rem; margin: .4rem 0; }
.function summary { padding: .55rem .75rem; min-height: 2.6rem; }
.function summary:hover { background: var(--highlight); }
.function[open] summary { background: var(--highlight); border-bottom: 1px solid var(--border); }
.function-name { margin-inline: .25rem .45rem; }
.function-body { padding: .65rem .9rem .85rem; }
.function-body p { margin: .3rem 0 .65rem; }
.function-body ul { margin: .25rem 0 .65rem; padding-left: 1.15rem; }
.function-body li p { margin: .15rem 0 .35rem; }
.associations li { padding-block: .2rem; }
.weight { display: inline-block; margin-inline-start: .35rem; border-radius: 1rem; padding: .1rem .5rem; color: var(--ink); background: var(--highlight); font-size: .77rem; font-weight: 700; white-space: nowrap; }
.weight:is([data-weight="core"], [data-weight="high"]) { color: var(--green-ink); background: var(--green-bg); }
.weight:is([data-weight="routine"], [data-weight="medium"]) { color: var(--blue-ink); background: var(--blue-bg); }
.weight[data-weight="conditional"] { color: var(--gold); background: var(--gold-bg); }
.weight:is([data-weight="optional"], [data-weight="low"]) { color: var(--violet-ink); background: var(--violet-bg); }

.assessment-stage { max-width: 49rem; margin-inline: auto; }
.welcome:not([hidden]) + .assessment-stage { max-width: 42rem; }
.assessment-stage:has(.stage-back:not([hidden])) { margin-top: clamp(1rem, 4vw, 2.4rem); }
.stage-back { display: inline-flex; align-items: center; gap: .4rem; margin-bottom: .6rem; }
.assessment-status { margin-top: .55rem; }
.result-header { margin: .3rem 0 1rem; }
.result-header h1 { font: 500 clamp(2rem, 4.2vw, 3rem)/1.1 Georgia, serif; letter-spacing: -.035em; margin: .35rem 0 .55rem; overflow-wrap: anywhere; }
.result-header h1:focus-visible, .browse-page h1:focus-visible { outline: none; }
.result-category-summary { color: var(--muted); margin: 0; }
.business-type-picker { margin: 0 0 1rem; border: 1px solid var(--border); border-radius: .65rem; background: var(--card); }
.business-type-picker > summary { padding: .7rem .85rem; color: var(--accent-deep); }
.business-type-count { margin-left: .35rem; color: var(--muted); font-size: .82rem; font-weight: 400; white-space: nowrap; }
.business-type-menu { padding: 0 .85rem .8rem; }
.business-type-menu > label { font-size: .9rem; margin-bottom: .35rem; }
.business-type-options { max-height: 20rem; overflow-y: auto; overscroll-behavior: contain; margin-top: .6rem; }
.business-type-option { display: flex; align-items: center; gap: .6rem; min-height: 2.65rem; padding: .45rem .55rem; border-radius: .35rem; font-size: .93rem; font-weight: 500; cursor: pointer; }
.business-type-option:has(input:checked), .business-type-option:hover { background: var(--highlight); }
.business-type-option span { overflow-wrap: anywhere; }
.business-type-option input { flex: none; }
.assessment-needs { margin-top: 1rem; }
.assessment-needs[aria-busy="true"] { opacity: .65; }
.result-disclosure > summary { color: var(--accent-deep); padding: .4rem 0; }
.result-disclosure-body > p:first-child { margin-top: 0; }
.more-needs { border-top: 1px solid var(--border); margin-top: .8rem; padding-top: .3rem; }
.need-details { font-size: .88rem; margin-top: .4rem; }
.need-details > summary { color: var(--accent-deep); padding-block: .15rem; }
.needs-grid, #tool-results { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); gap: .7rem; }
.assessment-needs .needs-grid { grid-template-columns: minmax(0, 1fr); gap: 0; border: 1px solid var(--border); border-radius: var(--radius); background: var(--card); }
.need-card, .tool-card { min-width: 0; border: 1px solid var(--border); border-radius: .65rem; padding: .9rem; background: var(--card); overflow-wrap: anywhere; box-shadow: var(--shadow); }
.need-card h3 { margin: 0 0 .35rem; line-height: 1.28; }
.need-card p, .tool-card p, .comparison p { margin: .25rem 0 .4rem; }
.assessment-needs .needs-grid > .need-card { display: block; padding: .85rem 1.05rem; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.assessment-needs .needs-grid > .need-card + .need-card { border-top: 1px solid var(--border); }
.tool-option-actions { display: flex; flex-wrap: wrap; gap: .25rem .85rem; margin: .5rem 0; font-size: .91rem; }
.tool-card .tool-existing-fit { background: var(--highlight); border-radius: .5rem; color: var(--accent-deep); padding: .45rem .6rem; }
.outcome { font-weight: 650; }
.condition { border-left: .2rem solid var(--gold); padding-left: .55rem; color: var(--gold); }
.tool-shortlist, .tool-evidence, .additional-needs { padding-left: 1.15rem; margin: .35rem 0 .65rem; }
.tool-shortlist li, .tool-evidence li { margin-bottom: .3rem; }
.tool-shortlist li p, .tool-evidence li p, .additional-needs li p { margin: .1rem 0 .35rem; }
.need-details .tool-shortlist { display: grid; gap: .65rem; list-style: none; padding-left: 0; margin: .6rem 0 0 .65rem; }
.need-details .tool-shortlist > li { min-width: 0; margin: 0; padding: .75rem .85rem; border: 1px solid var(--border); border-inline-start: .2rem solid color-mix(in srgb, var(--accent) 45%, var(--border)); border-radius: .55rem; background: var(--highlight); }
.need-details .tool-shortlist > li:has(.inline-compare-choice input:checked) { border-color: var(--accent); }
.need-details .tool-shortlist h4 { font-size: .95rem; margin: 0 0 .35rem; }
.inline-tool-heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .35rem .85rem; margin-bottom: .35rem; }
.need-details .tool-shortlist .inline-tool-heading h4 { flex: 1 1 12rem; min-width: 0; margin: 0; }
.inline-compare-choice { display: inline-flex; align-items: center; gap: .5rem; min-height: 2.25rem; margin-top: .25rem; color: var(--accent-deep); font-size: .85rem; font-weight: 650; cursor: pointer; }
.inline-tool-heading .inline-compare-choice { flex: 0 0 auto; margin-top: 0; }
.inline-compare-choice input { margin: 0; flex: none; }
.inline-tool-comparison { min-width: 0; max-width: 100%; margin: .75rem 0 0 .65rem; }
.inline-comparison-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; padding: .6rem .75rem; border: 1px solid var(--border); border-radius: .55rem; background: var(--paper); }
.inline-comparison-actions button { min-height: 2.25rem; padding: .35rem .65rem; font-size: .85rem; }
.need-card .inline-comparison-status { flex: 1 1 12rem; margin: 0; color: var(--muted); font-size: .85rem; }
.need-card .inline-comparison-status.error { color: var(--error); }
.inline-comparison-output { min-width: 0; max-width: 100%; margin-top: .75rem; }
.inline-comparison-output .table-scroll { max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; border: 1px solid var(--border); border-radius: .55rem; background: var(--card); }
.inline-comparison-heading { margin: 0 0 .5rem; color: var(--accent-deep); font-size: .95rem; }
.label { display: inline-block; color: var(--ink); background: var(--highlight); border-radius: 1rem; padding: .08rem .45rem; font-size: .78rem; font-weight: 650; }
.ai-label { color: var(--blue-ink); background: var(--blue-bg); }
.tool-shortlist .label { margin-left: .3rem; }
.tool-detail { border-top: 1px solid var(--border); padding-top: .5rem; }
.tool-detail-body h4 { margin-top: .65rem; }
.compare-panel { margin: .75rem 0; }
.table-scroll { overflow-x: auto; }
.comparison { border-collapse: collapse; width: 100%; margin-top: .45rem; font-size: .9rem; }
.comparison :is(th, td) { text-align: left; vertical-align: top; border: 1px solid var(--border); padding: .5rem .65rem; }
.comparison th { background: var(--highlight); min-width: 6.5rem; }
.comparison th:first-child { position: sticky; left: 0; }
.comparison :is(thead th:not(:first-child), td) { min-width: 14rem; }
.comparison th button { display: block; font-size: .85rem; }
.inline-comparison-table { margin-top: 0; background: var(--card); font-size: .85rem; }
.inline-comparison-table th:first-child { min-width: 8rem; width: 8rem; z-index: 1; }
.inline-comparison-table :is(thead th:not(:first-child), td) { min-width: 12.5rem; }
.task-comparison-panel { margin: 1rem 0; }
.task-comparison-panel h2 { font-size: 1.35rem; }
.task-comparison-panel > .help { margin: .4rem 0 .85rem; }
.task-comparison { width: 100%; table-layout: fixed; border-collapse: collapse; font-size: .9rem; }
.task-comparison :is(th, td) { text-align: left; vertical-align: top; border: 1px solid var(--border); padding: .8rem; overflow-wrap: anywhere; }
.task-comparison thead th { background: var(--highlight); font-size: .8rem; }
.task-comparison thead th:first-child { width: 30%; }
.task-comparison thead th:nth-child(2) { width: 36%; }
.task-comparison tbody th { font-weight: 400; }
.task-comparison tbody th > .link-button { font-size: 1rem; font-weight: 700; text-align: left; }
.task-comparison p { margin: .2rem 0 .55rem; }
.task-comparison .tool-option-actions { font-size: .8rem; margin-bottom: .25rem; }
.task-comparison .help { font-size: .8rem; }
.comparison-detail { margin-top: .55rem; font-size: .8rem; }
.comparison-detail summary, .comparison-more > summary { color: var(--accent-deep); }
.comparison-detail[open] summary { margin-bottom: .5rem; }
.comparison-more { margin-top: .8rem; }
.comparison-more > summary { padding: .35rem 0; }
.comparison-more[open] > .table-scroll { margin-top: .5rem; }

@media (max-width: 42rem) {
  .filters { grid-template-columns: 1fr; }
  .intake-grid { grid-template-columns: 1fr; }
  .header-inner nav { order: 3; flex-basis: 100%; }
  .welcome-intro h1 { max-width: 17ch; }
  .task-comparison { min-width: 43rem; }
}

@media (max-width: 27rem) {
  .shell { width: calc(100% - 1.25rem); }
  .sample-actions { column-gap: .75rem; }
  .assessment-needs .needs-grid > .need-card { padding-inline: .85rem; }
  .need-details .tool-shortlist { margin-left: .2rem; }
  .need-details .tool-shortlist > li { padding: .65rem; }
  .inline-tool-comparison { margin-left: .2rem; }
}

@media (prefers-reduced-motion: reduce) {
  .appearance input, .appearance input::before { transition: none; }
  #suggest.sample-pressed, #suggest:active { transform: none; }
}

@media (forced-colors: active) {
  .appearance input[type="checkbox"] { appearance: auto; }
  .appearance input::before { display: none; }
}