:root {
  color-scheme: light;
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
  background: #fff;
  color: #172033;
  --action: #174ea6;
  --action-soft: #eef5ff;
  --line: #cbd5e1;
  --muted: #526077;
  --surface-soft: #f8fafc;
  --danger: #b42318;
}

* { box-sizing: border-box; }
html, body { min-width: 0; min-height: 100%; }
body { margin: 0; padding: clamp(.625rem, 3vw, 1.25rem); overflow-x: hidden; }
body.modal-open { overflow: hidden; }
main { width: auto; max-width: 48rem; margin: 0 auto; overflow-wrap: anywhere; }
h1 { margin: 0; font-size: clamp(1.35rem, 4.6vw, 2rem); line-height: 1.15; }
h2 { margin: 0; font-size: 1rem; }

.accessibility-toolbar { display: flex; width: auto; max-width: 48rem; min-width: 0; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .45rem .7rem; margin: 0 auto .7rem; }
.accessibility-toolbar > strong { margin-right: auto; color: var(--muted); font-size: .78rem; }
.accessibility-actions, .font-size-controls { display: flex; align-items: center; gap: .35rem; }
.accessibility-toolbar button { min-width: 2.55rem; min-height: 2.55rem; border: 1px solid var(--line); border-radius: .5rem; padding: .45rem .65rem; background: #fff; color: inherit; font: inherit; font-weight: 750; cursor: pointer; }
.accessibility-toolbar button:hover, .accessibility-toolbar button[aria-pressed="true"] { border-color: var(--action); background: var(--action-soft); color: var(--action); }
.accessibility-toolbar button:disabled { cursor: not-allowed; opacity: .5; }
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; clip-path: inset(50%) !important; white-space: nowrap !important; }

.urgent { margin: .85rem 0 0; border-left: .25rem solid var(--danger); background: #fff4f2; padding: .65rem .75rem; }
form { display: grid; gap: .8rem; margin-top: .75rem; min-width: 0; }
.required-legend { margin: 0; color: var(--muted); font-size: .78rem; }
.required-legend span, .required-mark { color: var(--danger); font-weight: 800; }

.primary-section, .form-card, .optional-section, .feedback-section { min-width: 0; border: 1px solid var(--line); border-radius: .7rem; }
.primary-section { display: grid; gap: .75rem; border-color: #9bbcf1; padding: .8rem; background: #fff; box-shadow: 0 2px 10px rgba(15, 23, 42, .05); }
.form-card { display: grid; gap: .75rem; padding: .8rem; background: var(--surface-soft); }
.primary-section h2, .form-card h2 { display: flex; align-items: center; gap: .6rem; }
.person-section { border-color: #7fb18e; background: linear-gradient(180deg, #f8fdf9 0, #fff 5rem); }
.person-section .section-icon { background: #e5f5e9; color: #226538; }
.section-icon { display: inline-grid; width: 2rem; height: 2rem; flex: 0 0 2rem; place-items: center; border-radius: 999px; background: var(--action-soft); color: var(--action); font-weight: 800; }

.field { display: grid; gap: .35rem; min-width: 0; }
.field-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
.person-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .7rem; }
label, legend { font-weight: 700; }
textarea, input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, .picker-trigger, .search-field {
  display: flex; width: 100%; min-width: 0; min-height: 2.75rem; border: 1px solid #8a94a6; border-radius: .5rem; padding: .7rem; background: #fff; color: inherit; font: inherit;
}
textarea { display: block; height: clamp(6rem, 22dvh, 10rem); resize: none; overflow-y: auto; }
textarea:focus, input:focus, select:focus, summary:focus, button:focus-visible { outline: 3px solid #9dc5ff; outline-offset: 2px; }

.picker-trigger { align-items: center; gap: .55rem; cursor: pointer; text-align: left; }
.picker-trigger-centered { justify-content: center; border-color: #9bbcf1; color: var(--action); font-weight: 750; }
.picker-chevron { margin-left: auto; }
.selected-categories { display: flex; flex-wrap: wrap; gap: .4rem; }
.selected-category { display: inline-flex; align-items: center; gap: .35rem; border: 1px solid #9bbcf1; border-radius: 999px; padding: .35rem .55rem; background: var(--action-soft); color: var(--action); font-size: .78rem; font-weight: 700; }
.selected-category button { min-height: 1.25rem; min-width: 1.25rem; border: 0; padding: 0; border-radius: 999px; background: transparent; color: inherit; cursor: pointer; }

.choice-field { min-width: 0; margin: 0; border: 0; padding: 0; }
.choice-field legend { margin-bottom: .45rem; font-size: .9rem; }
.choice-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem; }
.choice-card { display: flex; align-items: center; gap: .5rem; min-height: 2.75rem; border: 1px solid var(--line); border-radius: .5rem; padding: .65rem; background: #fff; font-weight: 600; cursor: pointer; }
.choice-card:has(input:checked) { border-color: var(--action); background: var(--action-soft); color: var(--action); }

.optional-section { background: var(--surface-soft); }
.optional-section > summary { display: flex; min-height: 3.15rem; cursor: pointer; list-style: none; align-items: center; gap: .65rem; padding: .55rem .8rem; font-weight: 750; }
.optional-section > summary::-webkit-details-marker { display: none; }
.summary-title { display: grid; min-width: 0; gap: .1rem; }
.summary-title small { overflow: hidden; color: var(--muted); font-size: .74rem; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.optional-label { margin-left: auto; border-radius: 999px; padding: .22rem .48rem; background: #e9eef5; color: var(--muted); font-size: .68rem; font-weight: 750; letter-spacing: .01em; text-transform: uppercase; }
.summary-chevron { margin-left: auto; transition: transform .18s ease; }
.optional-label + .summary-chevron { margin-left: 0; }
.optional-section[open] .summary-chevron { transform: rotate(180deg); }
.section-content { display: grid; gap: .75rem; border-top: 1px solid var(--line); padding: .8rem; background: #fff; }
.field-group { display: grid; gap: .75rem; min-width: 0; }
.field-group + .field-group { border-top: 1px solid #e2e8f0; padding-top: 1rem; }
.field-group h3 { margin: 0; color: #344158; font-size: .86rem; text-transform: uppercase; letter-spacing: .035em; }
.inline-optional { border-top: 1px solid #dfe8e2; margin-top: .1rem; padding-top: .15rem; }
.inline-optional > summary { display: flex; align-items: center; gap: .45rem; min-height: 2.5rem; cursor: pointer; list-style: none; color: var(--action); font-size: .82rem; font-weight: 700; }
.inline-optional > summary::-webkit-details-marker { display: none; }
.inline-optional .optional-label { margin-left: .2rem; }
.inline-optional-content { padding: .25rem 0 .15rem 2rem; }
.feedback-section { display: grid; gap: .75rem; padding: .8rem; background: #fff; }
.feedback-choice-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem; }
.feedback-choice { display: flex; min-width: 0; align-items: flex-start; gap: .6rem; border: 1px solid var(--line); border-radius: .55rem; padding: .75rem; background: #fff; cursor: pointer; }
.feedback-choice:has(input:checked) { border-color: var(--action); background: var(--action-soft); color: var(--action); box-shadow: 0 0 0 1px var(--action); }
.feedback-choice input { width: 1.15rem; height: 1.15rem; flex: 0 0 auto; margin-top: .1rem; accent-color: var(--action); }
.feedback-choice span { display: grid; min-width: 0; gap: .2rem; }
.feedback-choice small { color: var(--muted); font-size: .76rem; font-weight: 500; line-height: 1.4; }
.feedback-fields { display: grid; gap: .75rem; border-top: 1px solid var(--line); padding-top: .75rem; }
.privacy-confirmation { display: grid; gap: .55rem; border-top: 1px solid var(--line); padding-top: .75rem; }
.privacy-confirmation h3 { margin: 0; font-size: .86rem; }
.consent-field { display: flex; align-items: flex-start; gap: .65rem; font-size: .82rem; line-height: 1.45; cursor: pointer; }
.consent-field input { width: 1.1rem; height: 1.1rem; flex: 0 0 auto; margin-top: .1rem; accent-color: var(--action); }
.consent-field a, .form-legal-links a, .legal-page a { color: var(--action); font-weight: 700; text-underline-offset: 2px; }
.consent-field a:hover, .form-legal-links a:hover, .legal-page a:hover { text-decoration: underline; }
.form-legal-links { display: flex; flex-wrap: wrap; justify-content: center; gap: .7rem 1.2rem; font-size: .82rem; }
.legal-page { max-width: 900px; }
.legal-back { display: inline-flex; margin-bottom: .2rem; }
.legal-document { display: grid; gap: .65rem; border: 1px solid var(--line); border-radius: 1rem; padding: clamp(1rem, 3vw, 1.6rem); background: var(--surface); box-shadow: 0 14px 34px rgba(15, 23, 42, .08); }
.legal-document + .legal-document { margin-top: 1rem; }
.legal-document h2 { margin: 0 0 .35rem; color: var(--text); font-size: 1.25rem; }
.legal-document h3 { margin: .45rem 0 0; color: var(--text); font-size: .95rem; }
.legal-document p { margin: 0; color: #334155; font-size: .9rem; line-height: 1.65; }
.legal-document .legal-version { color: var(--muted); font-size: .78rem; }
.legal-footer { display: flex; flex-wrap: wrap; gap: .75rem 1.25rem; padding: 1rem .2rem 0; font-size: .84rem; }
.is-hidden { display: none !important; }

.form-actions { display: grid; grid-template-columns: minmax(0, 19rem) minmax(12rem, 1fr); gap: .8rem; align-items: stretch; min-width: 0; margin-bottom: .75rem; padding-top: .15rem; }
.recaptcha-shell { width: 100%; min-width: 0; min-height: 78px; overflow: hidden; }
#recaptcha { width: 304px; transform-origin: left top; }
body[data-recaptcha-provider="local-test"] .form-actions { grid-template-columns: 1fr; }
body[data-recaptcha-provider="local-test"] .recaptcha-shell { display: none; }
.submit-button, .primary-button { border: 0; border-radius: .5rem; background: var(--action); color: #fff; font: inherit; font-weight: 750; cursor: pointer; }
.submit-button { width: 100%; min-height: 3rem; scroll-margin-bottom: 1rem; padding: .75rem 1rem; }
button:disabled { opacity: .6; cursor: wait; }

.modal-backdrop { position: fixed; z-index: 9000; inset: 0; display: grid; place-items: center; padding: 1rem; background: rgba(15, 23, 42, .58); }
.modal-panel { display: flex; width: min(100%, 60rem); max-height: calc(100dvh - 2rem); flex-direction: column; overflow: hidden; border: 1px solid var(--line); border-radius: .8rem; background: #fff; box-shadow: 0 1.5rem 4rem rgba(15, 23, 42, .3); }
.time-modal-panel { max-width: 27rem; }
.modal-header, .modal-footer { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .8rem 1rem; }
.modal-header { border-bottom: 1px solid var(--line); }
.modal-header h2 { font-size: 1.1rem; }
.modal-header p { margin: .2rem 0 0; color: var(--muted); font-size: .8rem; }
.modal-footer { border-top: 1px solid var(--line); }
.modal-footer > div { display: flex; gap: .45rem; }
.modal-body { display: grid; gap: 1rem; padding: 1rem; overflow-y: auto; }
.icon-button { display: grid; width: 2.35rem; height: 2.35rem; flex: 0 0 2.35rem; place-items: center; border: 1px solid var(--line); border-radius: .5rem; background: #fff; color: inherit; font-size: 1.4rem; cursor: pointer; }
.primary-button, .secondary-button { min-height: 2.55rem; border-radius: .5rem; padding: .55rem .85rem; font: inherit; font-weight: 700; cursor: pointer; }
.secondary-button { border: 1px solid var(--line); background: #fff; color: inherit; }

.time-grid { display: grid; grid-template-columns: 1fr auto 1fr; align-items: end; gap: .65rem; }
.time-grid label { display: grid; gap: .35rem; color: var(--muted); text-align: center; font-size: .75rem; text-transform: uppercase; }
.time-grid select { height: 4rem; text-align: center; font-size: 1.55rem; font-weight: 750; }
.time-grid > span { padding-bottom: .85rem; color: var(--muted); font-size: 1.8rem; }
.quick-times { display: grid; grid-template-columns: repeat(4, 1fr); gap: .4rem; }
.quick-times button { min-height: 2.55rem; border: 1px solid var(--line); border-radius: .5rem; background: #fff; color: inherit; font: inherit; cursor: pointer; }
.quick-times button.is-active { border-color: var(--action); background: var(--action-soft); color: var(--action); font-weight: 750; }
.current-time-button { justify-self: start; }

.category-toolbar { border-bottom: 1px solid var(--line); padding: .75rem 1rem; }
.search-field { align-items: center; gap: .55rem; }
.search-field input { min-width: 0; flex: 1; border: 0; outline: 0; font: inherit; }
.category-list { display: grid; min-height: 0; gap: .65rem; overflow-y: auto; padding: .75rem; background: var(--surface-soft); }
.category-group { border: 1px solid var(--line); border-radius: .6rem; background: #fff; }
.category-group h3 { display: flex; align-items: center; gap: .5rem; margin: 0; border-bottom: 1px solid var(--line); padding: .6rem .75rem; font-size: .9rem; }
.category-icon { display: grid; width: 1.8rem; height: 1.8rem; place-items: center; border-radius: 999px; background: var(--action-soft); color: var(--action); }
.category-options { display: grid; gap: .4rem; padding: .55rem; }
.category-option { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .6rem; min-height: 2.8rem; border: 1px solid var(--line); border-radius: .5rem; padding: .55rem .65rem; font-weight: 500; cursor: pointer; }
.category-option input { position: absolute; opacity: 0; pointer-events: none; }
.category-option:has(input:checked) { border-color: var(--action); background: var(--action-soft); color: var(--action); }
.category-check { display: grid; width: 1.35rem; height: 1.35rem; place-items: center; border: 1px solid var(--line); border-radius: 999px; color: transparent; }
.category-option:has(input:checked) .category-check { border-color: var(--action); background: var(--action); color: #fff; }

.status-toast { position: fixed; z-index: 10000; top: max(.75rem, env(safe-area-inset-top)); left: 50%; width: min(36rem, calc(100vw - 1.5rem)); margin: 0; border: 1px solid #93a4bd; border-radius: .65rem; padding: .8rem 1rem; background: #172033; color: #fff; box-shadow: 0 .75rem 2rem rgba(15, 23, 42, .28); font-size: .925rem; font-weight: 650; line-height: 1.4; opacity: 0; visibility: hidden; pointer-events: none; transform: translate(-50%, -1rem) scale(.98); transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s; }
.status-toast.is-visible { opacity: 1; visibility: visible; transform: translate(-50%, 0) scale(1); transition-delay: 0s; }
.status-toast.is-success { border-color: #15803d; background: #166534; }
.status-toast.is-error { border-color: #fca5a5; background: #991b1b; }
.status-toast.is-progress { border-color: #93c5fd; background: var(--action); }
.trap { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(1px, 1px, 1px, 1px) !important; white-space: nowrap !important; }

html.is-high-contrast { color-scheme: dark; background: #000; color: #fff; --action: #ffeb3b; --action-soft: #111; --line: #fff; --muted: #fff; --surface-soft: #000; --danger: #ff8080; }
html.is-high-contrast body, html.is-high-contrast .primary-section, html.is-high-contrast .form-card, html.is-high-contrast .optional-section, html.is-high-contrast .feedback-section, html.is-high-contrast .section-content, html.is-high-contrast .feedback-choice, html.is-high-contrast .choice-card, html.is-high-contrast .category-group, html.is-high-contrast .modal-panel, html.is-high-contrast .quick-times button, html.is-high-contrast .legal-document, html.is-high-contrast textarea, html.is-high-contrast input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), html.is-high-contrast select, html.is-high-contrast .picker-trigger, html.is-high-contrast .search-field, html.is-high-contrast .accessibility-toolbar button, html.is-high-contrast .icon-button, html.is-high-contrast .secondary-button { background: #000; color: #fff; border-color: #fff; }
html.is-high-contrast .person-section { background: #000; }
html.is-high-contrast .urgent { border-color: #ffeb3b; background: #000; color: #fff; }
html.is-high-contrast .legal-document p, html.is-high-contrast .legal-document h2, html.is-high-contrast .legal-document h3, html.is-high-contrast .field-group h3 { color: #fff; }
html.is-high-contrast .optional-label { border: 1px solid #ffeb3b; background: #ffeb3b; color: #000; }
html.is-high-contrast .section-icon, html.is-high-contrast .category-icon { border: 1px solid #ffeb3b; background: #111; color: #ffeb3b; }
html.is-high-contrast input[type="checkbox"], html.is-high-contrast input[type="radio"] { outline: 1px solid #fff; outline-offset: 1px; accent-color: #ffeb3b; }
html.is-high-contrast .feedback-choice:has(input:checked), html.is-high-contrast .choice-card:has(input:checked), html.is-high-contrast .category-option:has(input:checked), html.is-high-contrast .accessibility-toolbar button[aria-pressed="true"] { border-color: #ffeb3b; background: #111; color: #ffeb3b; }
html.is-high-contrast .category-option:has(input:checked) .category-check { border-color: #ffeb3b; background: #ffeb3b; color: #000; }
html.is-high-contrast .submit-button, html.is-high-contrast .primary-button { background: #ffeb3b; color: #000; }
html.is-high-contrast .icon-button:hover, html.is-high-contrast .secondary-button:hover { background: #fff; color: #000; }
html.is-high-contrast .modal-backdrop { background: rgba(0, 0, 0, .94); }
html.is-high-contrast textarea:focus, html.is-high-contrast input:focus, html.is-high-contrast select:focus, html.is-high-contrast summary:focus, html.is-high-contrast button:focus-visible { outline-color: #ffeb3b; }

@media (prefers-reduced-motion: reduce) { .status-toast, .summary-chevron { transition: none; } }
@media (max-width: 700px) { .person-grid { grid-template-columns: 1fr; } }
@media (max-width: 619px) { .form-actions, .field-row, .feedback-choice-row { grid-template-columns: 1fr; } .summary-title small { display: none; } .optional-label { font-size: .62rem; } .inline-optional-content { padding-left: 0; } .category-modal-panel { max-height: 100dvh; border-radius: 0; } .modal-backdrop { padding: 0; } }
@media (max-width: 390px) { .accessibility-toolbar > strong { width: 100%; } .accessibility-actions { width: 100%; justify-content: space-between; } }
@media (max-width: 380px) { .quick-times { grid-template-columns: repeat(2, 1fr); } .modal-footer { align-items: stretch; flex-direction: column; } .modal-footer > div { display: grid; grid-template-columns: 1fr 1fr; } }
@media (max-height: 520px) { body { padding-block: .4rem; } h1 { font-size: 1.3rem; } .urgent { margin-top: .45rem; padding: .4rem .6rem; font-size: .82rem; } form { margin-top: .45rem; gap: .5rem; } textarea { height: clamp(4.5rem, 20dvh, 6rem); } .optional-section > summary { min-height: 2.7rem; } }
