/* Shared product tokens and controls. Page modules use these rather than a second theme. */
:root {
  color-scheme: light;
  --bg: #f8f9fb; --surface: #fff; --surface-subtle: #f1f3f5; --surface-elevated: #fff;
  --ink: #202832; --text-secondary: #495460; --muted: #65707c;
  --line: #e0e4e8; --border-strong: #b4bcc6;
  --primary: #235bd7; --primary-dark: #1747b5; --accent-soft: #edf2ff;
  --brand-yellow: #ffdd5d; --success: #24704e; --warning: #8c5910; --danger: #b33145;
  --blue: var(--primary); --amber: var(--warning); --ease-in-out: cubic-bezier(.4,0,.2,1);
  --radius-sm: 4px; --radius-md: 6px; --radius-lg: 8px;
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
  --space-5: 20px; --space-6: 24px; --space-8: 32px; --space-10: 40px; --space-12: 48px;
  --text-xs: .75rem; --text-sm: .875rem; --text-base: 1rem; --text-lg: 1.125rem;
  --text-xl: 1.375rem; --text-2xl: 1.75rem; --text-3xl: 2.25rem;
  --weight-normal: 400; --weight-medium: 600; --weight-bold: 700;
  --control-height: 44px; --icon-size: 20px; --content-width: 1160px; --reading-width: 760px;
  --shadow: none; --shadow-floating: 0 12px 40px #20283224;
  --duration-fast: 140ms; --duration-normal: 180ms; --ease-out: cubic-bezier(.2,.8,.2,1);
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #101722; --surface: #17212e; --surface-subtle: #202d3d; --surface-elevated: #1c2837;
  --ink: #edf3fb; --text-secondary: #c6d1df; --muted: #9cacbf;
  --line: #314358; --border-strong: #576d84;
  --primary: #9abaff; --primary-dark: #c0d4ff; --accent-soft: #263d63;
  --brand-yellow: #f7d55c; --success: #7dce9d; --warning: #f0c56d; --danger: #f18e9c;
  --shadow-floating: 0 14px 38px #00000080;
}
[hidden] { display: none !important; }
html { scroll-padding-top: 96px; scrollbar-color: var(--border-strong) var(--surface-subtle); }
body { font-family: "Trebuchet MS", Aptos, "Segoe UI", sans-serif; background: var(--bg); color: var(--ink); letter-spacing: 0; }
::selection { background: #ffed9a; color: #202832; }
:root[data-theme="dark"] ::selection { background: #4d6fa8; color: #fff; }
:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }
input, textarea, [contenteditable] { caret-color: var(--primary); }
input::placeholder, textarea::placeholder { color: var(--muted); opacity: 1; }
.auth-foot a, .consent-row a { text-decoration: underline; text-underline-offset: 3px; }
.consent-row { color: var(--text-secondary); }
.preregistration-controls legend { color: var(--text-secondary); }
h1 { font-size: var(--text-3xl); line-height: 1.2; overflow-wrap: anywhere; }
h2 { font-size: var(--text-xl); line-height: 1.3; }
h3 { font-size: var(--text-lg); line-height: 1.4; }
.page { width: min(var(--content-width), calc(100% - 48px)); padding: var(--space-10) 0 var(--space-12); }
.page-header { align-items: center; gap: var(--space-4); flex-wrap: wrap; }
.icon { width: var(--icon-size); height: var(--icon-size); flex: 0 0 auto; vertical-align: middle; }
.crest { width: 40px; height: 44px; object-fit: contain; flex-shrink: 0; }
.crest-fallback, .avatar { display: inline-grid; place-items: center; background: var(--surface-subtle); color: var(--text-secondary); font-weight: var(--weight-bold); }
.avatar { width: 32px; height: 32px; border-radius: 50%; font-size: var(--text-xs); flex-shrink: 0; }
.skip-link { position: fixed; top: -80px; left: 16px; z-index: 100; background: var(--surface); padding: 12px; }
.skip-link:focus { top: 12px; }
.topbar { min-height: 72px; padding: 12px 24px; background: var(--surface); border-bottom: 1px solid var(--line); box-shadow: none; backdrop-filter: none; z-index: 30; flex-direction: row; align-items: center; }
.nav { gap: var(--space-2); }
.nav a, .account-menu > summary { font-size: var(--text-sm); font-weight: var(--weight-medium); border-radius: var(--radius-md); }
.nav a { display: inline-flex; align-items: center; gap: 6px; min-height: var(--control-height); padding: 8px 12px; color: var(--text-secondary); }
.nav a:hover, .nav a.nav-active { color: var(--primary); background: var(--accent-soft); }
.account-menu { position: relative; }
.account-menu > summary { display: flex; align-items: center; gap: 8px; cursor: pointer; min-height: var(--control-height); padding: 4px 8px; list-style: none; }
.account-menu > summary::-webkit-details-marker { display: none; }
.account-menu > div { position: absolute; right: 0; top: calc(100% + 8px); width: 228px; padding: 8px; background: var(--surface-elevated); border-radius: var(--radius-lg); box-shadow: var(--shadow-floating); }
.account-menu a, .account-menu form button { display: flex; width: 100%; justify-content: flex-start; }
.primary-button, .secondary-button, .ghost-button, .danger-button, .icon-button, .city-hub-enter-button {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
  min-height: var(--control-height); padding: 9px 16px; border: 1px solid transparent; border-radius: var(--radius-md);
  font: inherit; font-size: var(--text-sm); font-weight: var(--weight-bold); line-height: 1.3; text-align: center;
  cursor: pointer; box-shadow: none; transform: none; transition: background-color var(--duration-fast), border-color var(--duration-fast), color var(--duration-fast);
}
.primary-button, .city-hub-enter-button { background: var(--primary); color: #fff; border-color: var(--primary); }
.primary-button:hover, .city-hub-enter-button:hover { background: var(--primary-dark); color: #fff; transform: none; box-shadow: none; }
.primary-button:active { transform: none; box-shadow: none; }
.secondary-button { background: var(--surface); color: var(--ink); border-color: var(--border-strong); }
.secondary-button:hover { background: var(--surface-subtle); border-color: var(--muted); }
.ghost-button, .icon-button { background: transparent; color: var(--text-secondary); border-color: transparent; }
.ghost-button:hover, .icon-button:hover { background: var(--surface-subtle); color: var(--ink); border-color: transparent; }
.danger-button { color: var(--danger); background: #fff1f3; border-color: #f1c5ce; }
.danger-button:hover { background: #fbe2e7; }
.icon-button { width: var(--control-height); padding: 10px; flex: 0 0 auto; }
.theme-toggle { position: relative; }
.theme-toggle-sun { display: none; }
:root[data-theme="dark"] .theme-toggle-moon { display: none; }
:root[data-theme="dark"] .theme-toggle-sun { display: inline-flex; }
button:disabled, .city-hub-enter-button:disabled, .city-hub-enter-button-disabled { color: #89929b; background: #e9ecef; border-color: var(--line); cursor: not-allowed; transform: none; box-shadow: none; }
[aria-busy="true"] { cursor: progress; }
input, select, textarea { min-height: var(--control-height); border: 1px solid var(--border-strong); border-radius: var(--radius-md); background: var(--surface); color: var(--ink); padding: 10px 12px; }
input:focus, select:focus, textarea:focus { outline: 2px solid var(--primary); outline-offset: 2px; border-color: var(--primary); }
textarea { resize: vertical; }
input[type="file"] { padding: 4px; color: var(--text-secondary); }
input[type="file"]::file-selector-button {
  min-height: 34px;
  margin: 0 10px 0 0;
  padding: 6px 10px;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  background: var(--surface-subtle);
  color: var(--ink);
  cursor: pointer;
  font: inherit;
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  transition: background-color var(--duration-fast), border-color var(--duration-fast), color var(--duration-fast);
}
input[type="file"]::-webkit-file-upload-button {
  min-height: 34px;
  margin: 0 10px 0 0;
  padding: 6px 10px;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  background: var(--surface-subtle);
  color: var(--ink);
  cursor: pointer;
  font: inherit;
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
}
input[type="file"]:hover::file-selector-button,
input[type="file"]:hover::-webkit-file-upload-button { background: var(--accent-soft); border-color: var(--primary); }
label { font-size: var(--text-sm); font-weight: var(--weight-medium); }
input[type="checkbox"], input[type="radio"] { accent-color: var(--primary); flex: 0 0 auto; }
fieldset { border-color: var(--line); border-radius: var(--radius-md); min-width: 0; }
.form-card, .metric-card, .match-card, .profile-card, .notification-row, .empty-state, .billing-status-card, .pricing-card, .stat-card, .dash-match-card, .billing-plan-card { box-shadow: none; border-color: var(--line); border-radius: var(--radius-lg); }
.split-layout > *, .form-grid > *, .detail-grid > * { min-width: 0; }
.split-layout .form-card { width: 100%; }
.empty-state { background: transparent; border: 0; padding: var(--space-12) var(--space-6); }
.alert { border-radius: var(--radius-md); font-weight: var(--weight-normal); line-height: 1.6; }
.ui-dialog { border: 0; border-radius: var(--radius-lg); padding: var(--space-6); width: min(480px, calc(100% - 32px)); max-height: calc(100dvh - 32px); overflow: auto; box-shadow: var(--shadow-floating); color: var(--ink); }
.ui-dialog[open] { animation: surface-in var(--duration-normal) var(--ease-out); }
.ui-dialog::backdrop { background: #17202a80; }
.ui-dialog h2 { margin-bottom: var(--space-4); }
.dialog-actions { display: flex; justify-content: flex-end; gap: var(--space-2); margin-top: var(--space-6); }
.toast { position: fixed; z-index: 80; bottom: 24px; left: 50%; transform: translateX(-50%); width: max-content; max-width: calc(100% - 32px); padding: 12px 20px; background: var(--ink); color: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow-floating); font-size: var(--text-sm); }
.toast.is-error { background: var(--danger); }
[data-tooltip] { position: relative; }
[data-tooltip]::after { content: attr(data-tooltip); position: absolute; bottom: calc(100% + 8px); left: 50%; transform: translateX(-50%); padding: 6px 8px; border-radius: var(--radius-sm); background: var(--ink); color: #fff; white-space: nowrap; font-size: var(--text-xs); font-weight: 400; pointer-events: none; opacity: 0; z-index: 25; }
.theme-toggle[data-tooltip]::after { left: auto; right: 0; transform: none; }
.hh-proof-list, .hh-showcase-copy > p:last-of-type { color: var(--text-secondary); }
.hh-steps li > span, .hh-number { color: #b64020; }
:root[data-theme="dark"] .hh-steps li > span,
:root[data-theme="dark"] .hh-number { color: #ffaa89; }
[data-tooltip]:focus-visible::after { opacity: 1; }
@media (hover: hover) { [data-tooltip]:hover::after { opacity: 1; } }
.auth-card h1, .auth-title h1 { font-size: var(--text-2xl); line-height: 1.25; }
.auth-card { border-top: 1px solid var(--line); }
.match-card { padding: var(--space-6); }
.match-card .match-topline h2 { font-size: var(--text-xl); }
.match-price { display: block; font-size: var(--text-2xl); line-height: 1.2; white-space: nowrap; margin-bottom: 8px; }
.match-price small { font-size: var(--text-sm); font-weight: var(--weight-normal); color: var(--muted); }
.match-score { display: inline-flex; align-items: center; gap: 4px; font-size: var(--text-xs); color: var(--muted); }
.match-explanation { border: 0; background: var(--surface-subtle); border-radius: var(--radius-md); color: var(--text-secondary); }
.match-explanation strong { text-transform: none; color: var(--ink); font-size: var(--text-sm); }
.match-filters { background: transparent; border: 0; box-shadow: none; padding: 0 0 var(--space-4); }
.profile-form { padding: 0; border: 0; background: transparent; }
.profile-form .profile-section { padding: var(--space-6) 0; border-bottom: 1px solid var(--line); }
.profile-form .profile-section > h2, .profile-form .profile-section > summary { font-size: var(--text-lg); font-weight: var(--weight-bold); margin-bottom: var(--space-5); }
.profile-form details > summary { cursor: pointer; }
.profile-form .stack { gap: 0; }
.profile-form .button-row { padding-top: var(--space-6); }
.profile-form fieldset { margin-top: var(--space-5); }
.account-settings-nav { display: flex; gap: var(--space-1); margin: 0 0 var(--space-8); overflow-x: auto; border-bottom: 1px solid var(--line); scrollbar-width: thin; }
.account-settings-nav a { flex: 0 0 auto; min-height: 42px; padding: 10px 12px 8px; border-bottom: 2px solid transparent; color: var(--text-secondary); font-size: var(--text-sm); font-weight: var(--weight-medium); text-decoration: none; transition: background-color var(--duration-fast) var(--ease-out), border-color var(--duration-fast) var(--ease-out), color var(--duration-fast) var(--ease-out); }
.account-settings-nav a:hover { color: var(--ink); background: var(--surface-subtle); }
.account-settings-nav a[aria-current="page"] { border-color: var(--primary); color: var(--primary); font-weight: var(--weight-bold); }
.account-delivery-settings { scroll-margin-top: 96px; }
.account-delivery-heading { margin-bottom: var(--space-5); }
.account-delivery-heading h2 { margin: var(--space-1) 0; }
.account-delivery-settings .split-layout { margin-top: var(--space-5); }
.billing-page-header { max-width: 760px; padding: 0 0 var(--space-6); border-bottom: 1px solid var(--line); }
.billing-page-heading h1 { margin: 0; font-size: var(--text-3xl); line-height: 1.08; }
.billing-page-heading p { max-width: 62ch; margin: var(--space-3) 0 0; color: var(--text-secondary); font-size: var(--text-lg); line-height: 1.55; }
.billing-eligibility-callout, .billing-action-card { display: flex; align-items: center; justify-content: space-between; gap: var(--space-5); margin-bottom: var(--space-6); padding: var(--space-5); border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); }
.billing-eligibility-callout { border-color: #d7c471; background: #fffbee; }
.billing-action-card h2, .billing-eligibility-callout h2 { margin: var(--space-1) 0 var(--space-2); font-size: var(--text-xl); }
.billing-plan-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); align-items: stretch; }
.billing-plan-card { display: flex; flex-direction: column; min-width: 0; gap: var(--space-5); padding: var(--space-8); background: var(--surface); border: 1px solid var(--line); }
.billing-plan-card-featured { border-color: var(--primary); border-top-width: 4px; background: #f7f9ff; }
.billing-plan-card-header { display: grid; gap: var(--space-3); }
.billing-plan-name { margin: 0; color: var(--primary); font-size: var(--text-base); font-weight: var(--weight-bold); line-height: 1.2; }
.billing-plan-card h2 { max-width: 23ch; margin: 0; font-size: var(--text-2xl); line-height: 1.14; }
.billing-plan-card .pricing-copy { max-width: 48ch; margin: 0; color: var(--text-secondary); line-height: 1.55; }
.billing-plan-card .pricing-price { display: flex; align-items: baseline; flex-wrap: wrap; gap: var(--space-2); margin: 0; padding: var(--space-5) 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.billing-plan-card .price-amount { color: var(--ink); font-size: 2.4rem; font-weight: var(--weight-bold); letter-spacing: 0; line-height: 1; }
.billing-plan-card .pricing-price > span:last-child { color: var(--text-secondary); font-size: var(--text-sm); }
.billing-plan-card .pricing-features { display: grid; flex: 1; gap: var(--space-3); margin: 0; padding: 0; color: var(--ink); font-size: var(--text-sm); line-height: 1.45; list-style: none; }
.billing-plan-card .pricing-features li { position: relative; padding-left: 18px; }
.billing-plan-card .pricing-features li::before { position: absolute; top: .48rem; left: 0; width: 7px; height: 7px; border-radius: 50%; background: var(--primary); content: ""; }
.billing-plan-footer { display: grid; gap: var(--space-3); margin-top: auto; }
.billing-plan-card .price-note { margin: 0; color: var(--muted); font-size: var(--text-xs); line-height: 1.45; }
.billing-plan-card .primary-button, .billing-plan-card .secondary-button { width: 100%; justify-content: center; }
.billing-checkout-form { display: grid; gap: var(--space-3); }
.billing-plan-card .consent-row { margin: 0; color: var(--text-secondary); font-size: var(--text-xs); line-height: 1.45; }
.pricing-current-note { display: flex; align-items: center; min-height: var(--control-height); margin: 0; padding: 9px 12px; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface-subtle); color: var(--text-secondary); font-size: var(--text-sm); line-height: 1.35; }
.billing-comparison-note { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-6); margin-top: var(--space-8); padding: var(--space-6) 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.billing-comparison-note > div { max-width: 650px; }
.billing-comparison-note h2 { margin: 0; font-size: var(--text-xl); line-height: 1.25; }
.billing-comparison-note .muted { margin-top: var(--space-2); line-height: 1.55; }
.eligibility-type-choice { display: grid; gap: var(--space-3); padding: var(--space-4); }
.eligibility-type-choice legend { padding: 0 var(--space-1); font-size: var(--text-sm); font-weight: var(--weight-bold); }
.eligibility-type-choice label { display: flex; align-items: flex-start; gap: var(--space-2); min-width: 0; font-weight: var(--weight-normal); line-height: 1.45; }
.eligibility-type-choice input[type="radio"] { width: 18px; min-width: 18px; min-height: 18px; margin: 2px 0 0; padding: 0; }
.eligibility-type-choice label span { min-width: 0; }
.enrolment-privacy a { color: var(--primary-dark); text-decoration: underline; text-underline-offset: 3px; }
.eligibility-banner { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); width: min(var(--content-width), calc(100% - 48px)); margin: var(--space-4) auto 0; padding: 12px 16px; border: 1px solid #e7c978; border-radius: var(--radius-md); background: #fff9df; color: #56420a; font-size: var(--text-sm); line-height: 1.45; }
.eligibility-banner a { color: #403000; font-weight: var(--weight-bold); white-space: nowrap; }
.account-delivery-settings h4 { margin: var(--space-3) 0 0; font-size: var(--text-sm); }
.inbox-list { margin-bottom: var(--space-8); }
.inbox-item { display: flex; align-items: flex-start; gap: var(--space-4); padding: var(--space-5) 0; border-bottom: 1px solid var(--line); color: var(--ink); }
.inbox-item > .icon { color: var(--primary); margin-top: 3px; }
.inbox-item > span { display: grid; gap: 4px; flex: 1; min-width: 0; }
.inbox-item p, .inbox-item time { color: var(--muted); font-size: var(--text-sm); }
.inbox-item.is-unread strong::after { content: ""; display: inline-block; width: 7px; height: 7px; margin-left: 8px; border-radius: 50%; background: var(--primary); }
.inbox-item:hover { background: var(--surface-subtle); }
.delivery-settings > summary { font-size: var(--text-xl); font-weight: var(--weight-bold); cursor: pointer; margin-bottom: var(--space-6); }
.about-body, .about-block { min-width: 0; overflow-wrap: anywhere; }
.privacy-table { table-layout: fixed; width: 100%; }
.privacy-table th, .privacy-table td { overflow-wrap: anywhere; }
.privacy-notice a { text-decoration: underline; text-underline-offset: 0.18em; }

/* Night mode keeps the existing product hierarchy while replacing page-level light surfaces. */
:root[data-theme="dark"] .primary-button,
:root[data-theme="dark"] .city-hub-enter-button,
:root[data-theme="dark"] .nav-cta,
:root[data-theme="dark"] .hh-button-primary {
  background: #4d73bd;
  border-color: #4d73bd;
  color: #fff;
}
:root[data-theme="dark"] .primary-button:hover,
:root[data-theme="dark"] .city-hub-enter-button:hover,
:root[data-theme="dark"] .nav-cta:hover,
:root[data-theme="dark"] .hh-button-primary:hover {
  background: #6389d2;
  border-color: #6389d2;
  color: #fff;
}
:root[data-theme="dark"] .secondary-button,
:root[data-theme="dark"] .hh-button-secondary,
:root[data-theme="dark"] .hh-button-light { background: var(--surface); color: var(--ink); border-color: var(--border-strong); }
:root[data-theme="dark"] .danger-button { background: #482530; border-color: #874656; color: #ffb4bd; }
:root[data-theme="dark"] button:disabled,
:root[data-theme="dark"] .city-hub-enter-button:disabled,
:root[data-theme="dark"] .city-hub-enter-button-disabled { background: #293647; border-color: #3b4e63; color: #8f9eb0; }
:root[data-theme="dark"] .topbar,
:root[data-theme="dark"] .site-footer,
:root[data-theme="dark"] .form-card,
:root[data-theme="dark"] .metric-card,
:root[data-theme="dark"] .match-card,
:root[data-theme="dark"] .profile-card,
:root[data-theme="dark"] .notification-row,
:root[data-theme="dark"] .billing-status-card,
:root[data-theme="dark"] .pricing-card,
:root[data-theme="dark"] .stat-card,
:root[data-theme="dark"] .dash-match-card,
:root[data-theme="dark"] .admin-table-wrap,
:root[data-theme="dark"] .admin-access-form,
:root[data-theme="dark"] .location-control,
:root[data-theme="dark"] .location-menu,
:root[data-theme="dark"] .location-option,
:root[data-theme="dark"] .ui-dialog { background: var(--surface); color: var(--ink); border-color: var(--line); }
:root[data-theme="dark"] .billing-eligibility-callout { background: #362f17; border-color: #826d2f; }
:root[data-theme="dark"] .billing-plan-card-featured { background: #1d2d43; }
:root[data-theme="dark"] .billing-plan-card .pricing-features,
:root[data-theme="dark"] .billing-plan-card .price-amount { color: var(--ink); }
:root[data-theme="dark"] .setup-card { background: #1b2d49; border-color: #486895; }
:root[data-theme="dark"] .hh-hero { background: #111b2a; }
:root[data-theme="dark"] .hh-search-showcase { background: #182637; }
:root[data-theme="dark"] .hh-kicker,
:root[data-theme="dark"] .hh-lede,
:root[data-theme="dark"] .hh-proof-list,
:root[data-theme="dark"] .hh-listing-copy p { color: var(--text-secondary); }
:root[data-theme="dark"] .hh-signal-grid b { color: #1c2837; }
:root[data-theme="dark"] .hh-hero-art > img { border-color: var(--surface); box-shadow: 18px 18px 0 #c79d31, 0 17px 42px #00000066; }
:root[data-theme="dark"] .hh-match-note { background: var(--surface-elevated); border-color: var(--border-strong); box-shadow: var(--shadow-floating); }
:root[data-theme="dark"] .hh-board,
:root[data-theme="dark"] .hh-preferences,
:root[data-theme="dark"] .hh-membership-card { background: var(--surface); border-color: var(--line); }
:root[data-theme="dark"] .hh-board { box-shadow: 12px 12px 0 #334e7e, 0 15px 34px #0000004d; }
:root[data-theme="dark"] .hh-board-top,
:root[data-theme="dark"] .hh-board-footer { border-color: var(--line); color: var(--text-secondary); }
:root[data-theme="dark"] .hh-reason { background: #382e20; }
:root[data-theme="dark"] .hh-reason span { color: #ffbb87; }
:root[data-theme="dark"] .hh-reason p,
:root[data-theme="dark"] .hh-membership-card > p,
:root[data-theme="dark"] .hh-membership-card ul { color: var(--text-secondary); }
:root[data-theme="dark"] .hh-membership-card { box-shadow: 0 15px 30px #00000052; }
:root[data-theme="dark"] .tag-filter.is-active { background: #294b7e; color: #fff; box-shadow: inset 0 0 0 1px #5e87ce; }
:root[data-theme="dark"] input[type="file"] { background: #152132; border-color: #42566d; color: var(--text-secondary); }
:root[data-theme="dark"] input[type="file"]::file-selector-button,
:root[data-theme="dark"] input[type="file"]::-webkit-file-upload-button { background: #2a3b51; border-color: #556d87; color: var(--ink); }
:root[data-theme="dark"] input[type="file"]:hover::file-selector-button,
:root[data-theme="dark"] input[type="file"]:hover::-webkit-file-upload-button { background: #354d69; border-color: #7596c3; }
:root[data-theme="dark"] .vote-control button.is-active { background: #294b7e; }
:root[data-theme="dark"] .tag-chip-question,
:root[data-theme="dark"] .tag-chip-questions,
:root[data-theme="dark"] .tag-questions { background: #203e69; color: #c7dcff; }
:root[data-theme="dark"] .tag-chip-tip,
:root[data-theme="dark"] .tag-chip-tips,
:root[data-theme="dark"] .tag-tips { background: #1d4b39; color: #b7eccb; }
:root[data-theme="dark"] .tag-chip-discussion,
:root[data-theme="dark"] .tag-chip-trades,
:root[data-theme="dark"] .tag-chip-events,
:root[data-theme="dark"] .tag-chip-services,
:root[data-theme="dark"] .tag-chip-social,
:root[data-theme="dark"] .tag-trades,
:root[data-theme="dark"] .tag-events,
:root[data-theme="dark"] .tag-services,
:root[data-theme="dark"] .tag-social { background: #40365d; color: #d8c8ff; }
:root[data-theme="dark"] .tag-chip-housing-lead { background: #1c4a50; color: #b6e8eb; }
:root[data-theme="dark"] .tag-chip-temporary-room { background: #3b4522; color: #daeaa5; }
:root[data-theme="dark"] .tag-chip-furniture,
:root[data-theme="dark"] .tag-furniture { background: #513b18; color: #ffe0a0; }
:root[data-theme="dark"] .tag-chip-roommate { background: #4a2d3d; color: #ffc7da; }
:root[data-theme="dark"] .tag-chip-warning,
:root[data-theme="dark"] .moderation-badge { background: #4a321e; color: #ffc68f; }
:root[data-theme="dark"] .social-profile,
:root[data-theme="dark"] .profile-contribution,
:root[data-theme="dark"] .profile-requests,
:root[data-theme="dark"] .social-list-entries,
:root[data-theme="dark"] .social-settings-form,
:root[data-theme="dark"] .profile-more-panel { background: var(--surface); border-color: var(--line); box-shadow: var(--shadow-floating); }
:root[data-theme="dark"] .profile-banner { background: #233b61; }
:root[data-theme="dark"] .profile-avatar { background: #233a60; border-color: var(--border-strong); color: var(--primary); }
:root[data-theme="dark"] .profile-avatar-large,
:root[data-theme="dark"] .media-preview .media-preview-avatar { border-color: var(--surface); }
:root[data-theme="dark"] .profile-more summary { border-color: var(--line); color: var(--ink); }
:root[data-theme="dark"] .profile-identity h1,
:root[data-theme="dark"] .profile-counts strong,
:root[data-theme="dark"] .profile-tabs a[aria-current="page"],
:root[data-theme="dark"] .profile-contribution h2 a,
:root[data-theme="dark"] .profile-about dd,
:root[data-theme="dark"] .profile-requests > div a,
:root[data-theme="dark"] .social-list-entry { color: var(--ink); }
:root[data-theme="dark"] .verification-badge,
:root[data-theme="dark"] .contribution-link,
:root[data-theme="dark"] .back-link,
:root[data-theme="dark"] .eyebrow { color: var(--primary); }
:root[data-theme="dark"] .profile-handle,
:root[data-theme="dark"] .profile-meta,
:root[data-theme="dark"] .profile-counts a,
:root[data-theme="dark"] .profile-private-copy p,
:root[data-theme="dark"] .profile-contribution p,
:root[data-theme="dark"] .contribution-meta,
:root[data-theme="dark"] .profile-empty p,
:root[data-theme="dark"] .profile-about dt,
:root[data-theme="dark"] .social-list-entry small,
:root[data-theme="dark"] .settings-page-heading p,
:root[data-theme="dark"] .settings-section > div > p,
:root[data-theme="dark"] .settings-fields small { color: var(--muted); }
:root[data-theme="dark"] .profile-bio,
:root[data-theme="dark"] .settings-fields label,
:root[data-theme="dark"] .social-report-dialog label,
:root[data-theme="dark"] .profile-tabs a { color: var(--text-secondary); }
:root[data-theme="dark"] .profile-tabs,
:root[data-theme="dark"] .profile-requests > div,
:root[data-theme="dark"] .social-list-entry,
:root[data-theme="dark"] .settings-section { border-color: var(--line); }
:root[data-theme="dark"] .profile-empty,
:root[data-theme="dark"] .media-preview { background: var(--surface-subtle); border-color: var(--border-strong); }
:root[data-theme="dark"] .social-list-entry:hover { background: var(--surface-subtle); }
:root[data-theme="dark"] .settings-fields input,
:root[data-theme="dark"] .settings-fields textarea,
:root[data-theme="dark"] .settings-fields select,
:root[data-theme="dark"] .social-report-dialog select,
:root[data-theme="dark"] .social-report-dialog textarea { background: var(--surface); border-color: var(--border-strong); color: var(--ink); }
:root[data-theme="dark"] .form-success { background: #1d4933; border-color: #4c916d; color: #b9efcf; }
:root[data-theme="dark"] .form-error { background: #4b2527; border-color: #925057; color: #ffc3c6; }
:root[data-theme="dark"] .alert { background: #4b2527; border-color: #925057; color: #ffc3c6; }
:root[data-theme="dark"] .alert-success,
:root[data-theme="dark"] .admin-run-state,
:root[data-theme="dark"] .success-message { background: #1d4933; border-color: #4c916d; color: #b9efcf; }
:root[data-theme="dark"] .admin-run-state-attention,
:root[data-theme="dark"] .notification-setup-prompt,
:root[data-theme="dark"] .enrolment-note { background: #4a351e; border-color: #8b6930; color: #ffdc9d; }
:root[data-theme="dark"] .badge,
:root[data-theme="dark"] .pill,
:root[data-theme="dark"] .score,
:root[data-theme="dark"] .location-chip { background: #263f68; border-color: #4e73b4; color: #c4d8ff; }
:root[data-theme="dark"] .score-lg { background: #1d4b39; border-color: #4c916d; color: #b7eccb; }
:root[data-theme="dark"] .match-removed { background: #2a2026; }
:root[data-theme="dark"] .notification-row.unread,
:root[data-theme="dark"] .notif-unread { background: #1e314e; border-color: #4d73bd; }
:root[data-theme="dark"] .connection-code,
:root[data-theme="dark"] .enrolment-upload-field,
:root[data-theme="dark"] .enrolment-proof-preview { background: var(--surface-subtle); border-color: var(--border-strong); }
:root[data-theme="dark"] .admin-signal-card,
:root[data-theme="dark"] .admin-signal-card-primary,
:root[data-theme="dark"] .admin-proof-card { background: var(--surface); border-color: var(--line); box-shadow: none; }
:root[data-theme="dark"] .admin-table thead th,
:root[data-theme="dark"] .admin-table tbody tr:hover td { background: var(--surface-subtle); color: var(--text-secondary); }
:root[data-theme="dark"] .admin-table th,
:root[data-theme="dark"] .admin-table td { border-color: var(--line); }
:root[data-theme="dark"] .admin-pill { background: #4d3b14; color: #ffe197; }
:root[data-theme="dark"] .beta-confidentiality-notice { background: #1d2f4c; border-color: #4d73bd; }
:root[data-theme="dark"] .proof-status-pending { background: #4d3b14; color: #ffe197; }
:root[data-theme="dark"] .proof-status-approved { background: #1d4b39; color: #b7eccb; }
:root[data-theme="dark"] .proof-status-rejected { background: #4b2527; color: #ffc3c6; }
:root[data-theme="dark"] .location-option:hover,
:root[data-theme="dark"] .location-option:focus-visible,
:root[data-theme="dark"] .mode-option:has(input:checked) { background: var(--accent-soft); }
:root[data-theme="dark"] .mode-option { background: var(--surface); border-color: var(--border-strong); }
:root[data-theme="dark"] .mobile-nav > summary { background: var(--surface); border-color: var(--border-strong); color: var(--ink); }
:root[data-theme="dark"] .mobile-nav-panel { background: var(--surface-elevated); border-color: var(--border-strong); box-shadow: var(--shadow-floating); }
:root[data-theme="dark"] .mobile-nav-panel a { color: var(--text-secondary); }
:root[data-theme="dark"] .mobile-nav-panel a:hover,
:root[data-theme="dark"] .mobile-nav-panel a.nav-active { background: var(--accent-soft); color: var(--primary); }
:root[data-theme="dark"] .footer-nav a { color: var(--muted); }
:root[data-theme="dark"] .pw-toggle { background: var(--surface-subtle); border-color: var(--border-strong); color: var(--primary); }
.preregistration-mark { object-fit: contain; flex: 0 0 auto; }
.preregistration-banner { background: var(--accent-soft); color: var(--ink); border-bottom: 1px solid var(--line); }
.preregistration-banner .hh-shell { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-block: 18px; }
.preregistration-banner .hh-shell > div { display: grid; gap: 4px; max-width: 850px; }
.preregistration-banner a { flex-shrink: 0; font-weight: 700; }
.preregistration-offer { padding: 20px 0; border-block: 1px solid var(--line); color: var(--ink); }
.preregistration-offer strong { color: var(--primary); font-size: 20px; }
.preregistration-offer p { margin-block: 8px; }
.preregistration-offer small { color: var(--muted); }
.preregistration-confirmation { max-width: 720px; margin: 48px auto 72px; display: grid; gap: 20px; }
.preregistration-confirmation h1 { font-size: 36px; line-height: 1.2; overflow-wrap: anywhere; }
.preregistration-lede { font-size: 18px; color: var(--muted); }
.preregistration-receipt { padding-block: 24px; border-block: 1px solid var(--line); display: grid; gap: 12px; }
.preregistration-receipt h2 { font-size: 26px; }
.preregistration-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.preregistration-controls { max-width: 720px; }
.preregistration-controls fieldset { display: grid; gap: 20px; }
.preregistration-controls button { align-self: flex-start; }
@media (max-width: 740px) {
  .preregistration-banner .hh-shell { flex-direction: column; align-items: flex-start; gap: 12px; }
  .preregistration-confirmation { margin-top: 24px; }
  .preregistration-confirmation h1 { font-size: 28px; }
}
@keyframes surface-in { from { opacity: 0; transform: translateY(4px) scale(.99); } to { opacity: 1; transform: none; } }
@media (max-width: 1100px) {
  .desktop-nav { display: none; }
  .nav { width: auto; max-width: none; margin-left: auto; }
  .mobile-nav { display: block; position: relative; }
  .mobile-nav > summary { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 12px; border: 1px solid var(--line); border-radius: var(--radius-md); cursor: pointer; list-style: none; }
  .mobile-nav-panel { position: absolute; right: 0; top: calc(100% + 10px); width: min(320px, calc(100vw - 32px)); max-height: calc(100dvh - 90px); overflow-y: auto; display: grid; padding: 8px; border-radius: var(--radius-lg); box-shadow: var(--shadow-floating); background: var(--surface-elevated); }
  .mobile-nav-panel .account-menu > div { position: static; width: 100%; box-shadow: none; }
  .mobile-nav-panel .account-menu > summary { justify-content: flex-start; width: 100%; border: 0; }
}
@media (max-width: 740px) {
  .page { width: calc(100% - 32px); padding-top: var(--space-6); }
  .topbar { padding: 10px 16px; min-height: 64px; }
  .split-layout { grid-template-columns: minmax(0, 1fr); }
  .match-card { padding: var(--space-4); }
  .match-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page-header { align-items: flex-start; }
  .account-settings-nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; margin-bottom: var(--space-6); overflow: visible; border: 1px solid var(--line); border-radius: var(--radius-md); }
  .account-settings-nav a { display: flex; align-items: center; min-height: 40px; padding: 9px 10px; border-bottom: 1px solid var(--line); font-size: var(--text-xs); }
  .account-settings-nav a:nth-child(odd) { border-right: 1px solid var(--line); }
  .account-settings-nav a:last-child { border-right: 0; border-bottom: 0; }
  .account-settings-nav a[aria-current="page"] { border-bottom-color: var(--line); box-shadow: inset 0 -2px 0 var(--primary); }
  .billing-plan-grid { grid-template-columns: 1fr; }
  .billing-plan-card { padding: var(--space-6); }
  .billing-plan-card h2 { font-size: var(--text-xl); }
  .billing-page-heading h1 { font-size: var(--text-2xl); }
  .billing-page-heading p { font-size: var(--text-base); }
  .billing-eligibility-callout, .billing-action-card, .billing-comparison-note, .eligibility-banner { align-items: flex-start; flex-direction: column; }
  .match-topline { flex-wrap: wrap; }
  .profile-form .form-grid { grid-template-columns: 1fr; }
  .account-menu > div { position: static; width: 100%; box-shadow: none; padding: 0; }
  .toast { bottom: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
:root .hh-membership h2, :root .hh-membership .hh-kicker,
.hh-membership-grid > div > p:last-child, .hh-membership-note,
.hh-board-top b { color: #202832; }