/* A calm, lightweight companion to the HYPRX landing page. */
body.hyprx-survey-page {
  min-width: 0;
  margin: 0;
  background: #080a12;
  color: #f3f5ff;
  font: 17px/1.65 'Space Grotesk', Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}

.hyprx-survey-page *, .hyprx-survey-page *::before, .hyprx-survey-page *::after { box-sizing: border-box; }
.hyprx-survey-page [hidden] { display: none !important; }
.hyprx-survey-page :focus-visible { outline: 2px solid #b7c5ff; outline-offset: 5px; }
.hyprx-survey-page a { color: inherit; text-decoration: none; }
:where(.hyprx-survey-page) button, :where(.hyprx-survey-page) input, :where(.hyprx-survey-page) textarea { font: inherit; }
.hyprx-survey-page button, .hyprx-survey-page a, .hyprx-survey-page label { -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
.hyprx-survey-page h1, .hyprx-survey-page h2, .hyprx-survey-page p { margin-top: 0; }
.hyprx-survey-page svg { display: block; width: 22px; height: 22px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.hyprx-survey-page .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.survey-skip {
  position: absolute;
  z-index: 100;
  top: 12px;
  left: 16px;
  padding: 12px 20px;
  border-radius: 7px;
  background: #123bff;
  transform: translateY(-160%);
}
.survey-skip:focus { transform: none; }
.survey-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  width: min(1160px, calc(100% - 80px));
  min-height: 108px;
  margin: 0 auto;
  border-bottom: 1px solid #a2b4ee26;
}
.survey-brand { display: inline-flex; align-items: center; min-height: 44px; flex: none; }
.survey-brand img { display: block; width: 141px; max-width: 100%; height: auto; }
.survey-home-link { display: inline-flex; align-items: center; gap: 11px; min-height: 44px; font-size: 15px; color: #c3cce4 !important; }
.survey-home-link svg { width: 18px; height: 18px; }
.survey-home-link:hover { color: #fff !important; }
.survey-shell { width: min(1032px, calc(100% - 80px)); margin: 0 auto; padding-bottom: 36px; }
.survey-introduction { display: grid; grid-template-columns: minmax(0, 1fr) 220px; align-items: center; gap: 64px; padding: 64px 0 49px; }
.survey-kicker { display: flex; align-items: center; gap: 10px; margin-bottom: 23px; color: #a8b9ef; font: 11px/1.6 'IBM Plex Mono', monospace; letter-spacing: .095em; }
.survey-kicker > span { width: 5px; height: 5px; flex: none; border-radius: 50%; background: #9db2ff; box-shadow: 0 0 0 4px #123bff22; }
#survey-title { margin-bottom: 24px; font-size: clamp(40px, 4.6vw, 64px); font-weight: 500; line-height: 1.05; letter-spacing: -.05em; }
#survey-title em { color: #b7c5ff; font-style: normal; }
#survey-intro { max-width: 660px; margin-bottom: 0; color: #bfc7dd; font-size: 17px; line-height: 1.8; }
.survey-at-a-glance { align-self: center; padding-bottom: 8px; }
.survey-orbit-mark { width: 120px; height: 120px; margin: 0 0 13px 8px; }
.survey-orbit-mark svg { width: 100%; height: 100%; stroke: none; }
.survey-duration { display: flex; align-items: center; gap: 9px; margin-bottom: 5px; font-size: 15px; color: #e6ebff; white-space: nowrap; }
.survey-duration svg { width: 18px; height: 18px; color: #acbbeb; }
.survey-glance-note { max-width: 195px; margin-bottom: 0; color: #97a4c1; font-size: 14px; line-height: 1.6; }

.survey-workspace { position: relative; overflow: clip; border: 1px solid #a6b8ff30; border-radius: 18px; background: linear-gradient(145deg, #12192b, #0d1221 55%, #101326); box-shadow: 0 18px 70px #00000029; }
.survey-workspace::before { content: ''; position: absolute; top: 0; left: 8%; width: 65%; height: 1px; background: linear-gradient(90deg, transparent, #637effaa, #9f65ff66, transparent); pointer-events: none; }
.survey-progress-panel { padding: 32px 40px 25px; border-bottom: 1px solid #a2b4ee20; background: #9dafff03; }
.survey-progress-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 13px; }
#survey-step-label { margin: 0; color: #b8c6f4; font: 12px/1.6 'IBM Plex Mono', monospace; letter-spacing: .04em; }
.survey-progress-note { color: #a0adc8; font-size: 13px; }
#survey-progress { appearance: none; display: block; width: 100%; height: 3px; border: 0; border-radius: 99px; overflow: hidden; background: #7f98e124; color: #647eff; }
#survey-progress::-webkit-progress-bar { background: #7f98e124; border-radius: 99px; }
#survey-progress::-webkit-progress-value { background: linear-gradient(90deg, #4065ff, #9971ff); border-radius: 99px; }
#survey-progress::-moz-progress-bar { background: linear-gradient(90deg, #4065ff, #9971ff); border-radius: 99px; }
#survey-step-title { margin: 26px 0 0; font-size: 27px; font-weight: 500; line-height: 1.3; letter-spacing: -.035em; }
.survey-form { padding: 0 40px 28px; }
.survey-step { padding-top: 25px; }
.survey-section-description { margin: 0 0 8px; color: #bfc7dd; font-size: 16px; }
.survey-reference-period { margin: 0 0 0; color: #aab7d3; font-size: 14px; line-height: 1.7; }
.survey-question { min-width: 0; margin: 0; padding: 31px 0 32px; border: 0; border-bottom: 1px solid #a2b4ee20; }
.survey-question:last-child { padding-bottom: 27px; }
.survey-question legend { float: left; width: 100%; margin: 0 0 8px; padding: 0; color: #f1f4ff; font-size: 19px; font-weight: 500; line-height: 1.5; letter-spacing: -.02em; }
.survey-question legend + * { clear: both; }
.survey-question-number { margin-right: 9px; color: #8097d9; font: 12px/1.6 'IBM Plex Mono', monospace; letter-spacing: 0; }
.survey-question-help { margin: 0 0 17px; color: #aab7d3; font-size: 14px; line-height: 1.65; }
.survey-question-help:empty { display: none; }
.survey-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.survey-option { display: flex; align-items: flex-start; gap: 12px; min-width: 0; min-height: 57px; margin: 0; padding: 15px 16px; border: 1px solid #a6b8ff2b; border-radius: 8px; background: #090e1a55; color: #d8e0f4; font-size: 16px; line-height: 1.55; cursor: pointer; transition: border-color .16s ease, background-color .16s ease; }
.survey-option:hover { border-color: #a6b8ff75; background: #a6b8ff08; }
.survey-option:has(input:checked) { border-color: #7e96ff; background: #123bff19; color: #f4f6ff; box-shadow: inset 0 0 0 1px #7e96ff22; }
.survey-option:has(input:focus-visible) { outline: 2px solid #b7c5ff; outline-offset: 3px; }
.survey-option input[type="radio"], .survey-option input[type="checkbox"] { appearance: none; width: 19px; height: 19px; min-width: 19px; margin: 3px 0 0; border: 1px solid #97a9d879; border-radius: 5px; background: #080d18; cursor: pointer; }
.survey-option input[type="radio"] { border-radius: 50%; }
.survey-option input:checked { border-color: #a4b5ff; background: #5272ff; box-shadow: inset 0 0 0 3px #18264b; }
.survey-option input[type="checkbox"]:checked { background-color: #5272ff; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='m5 10 3.3 3.3L15 6.7' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); box-shadow: none; }
.survey-option input:focus-visible { outline-offset: 4px; }
.survey-option-label { display: block; min-width: 0; overflow-wrap: anywhere; }
.survey-option-label small { display: block; margin-top: 3px; color: #aab7d3; font-size: 13px; line-height: 1.5; }
.survey-option-other { display: block; width: 100%; margin-top: 13px; }
.survey-option-other label, .survey-text-label { display: block; margin-bottom: 7px; color: #c6d0e9; font-size: 14px; }
.survey-option-other input, .survey-option-other textarea, .survey-question textarea, .survey-question input[type="text"] { display: block; width: 100%; min-height: 50px; padding: 12px 14px; border: 1px solid #a6b8ff45; border-radius: 7px; background: #080d18; color: #f1f4ff; font-size: 16px; line-height: 1.65; caret-color: #b7c5ff; }
.survey-question textarea { min-height: 122px; resize: vertical; }
.survey-question textarea::placeholder, .survey-question input::placeholder { color: #8d9cbb; opacity: 1; }
.survey-character-count { display: block; margin: 7px 0 0; color: #9facc8; font-size: 12px; text-align: right; }
.survey-question-error { margin: 12px 0 0; color: #ffb7c7; font-size: 14px; }
.survey-question-error:empty { display: none; }
.survey-question[aria-invalid="true"] legend { color: #ffcfdb; }
.survey-error-summary { margin: 26px 0 0; padding: 16px 19px; border: 1px solid #f291a452; border-radius: 8px; background: #c2274110; color: #ffd0dc; font-size: 15px; }
.survey-error-summary p:last-child { margin-bottom: 0; }
.survey-error-summary ul { margin: 7px 0 0; padding-left: 21px; }
.survey-error-summary a { text-decoration: underline; text-underline-offset: 3px; }
.survey-loading { margin: 0; padding: 32px 0; color: #b7c5e0; }
.survey-navigation { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 27px; }
.survey-button { display: inline-flex; align-items: center; justify-content: center; gap: 18px; min-height: 52px; max-width: 100%; padding: 13px 21px; border: 1px solid transparent; border-radius: 7px; color: #fff; font-size: 15px; font-weight: 500; line-height: 1.6; cursor: pointer; transition: background-color .16s, border-color .16s; }
.survey-button svg { width: 19px; height: 19px; }
.survey-button-primary { background: linear-gradient(115deg, #123bff, #392be9); border-color: #697fff; box-shadow: inset 0 1px 0 #ffffff1a; }
.survey-button-primary:hover { background: linear-gradient(115deg, #274dff, #5040f2); border-color: #9aaaff; }
.survey-button-back { padding-left: 15px; padding-right: 18px; background: transparent; border-color: #a6b8ff30; color: #c6d2ee; }
.survey-button-back:hover { background: #a6b8ff08; border-color: #a6b8ff70; }
.survey-button:disabled { opacity: .42; cursor: default; }
.survey-form[aria-busy="true"] .survey-button { cursor: progress; }
.survey-status { margin: 17px 0 0; color: #b8c7e7; font-size: 14px; line-height: 1.7; overflow-wrap: anywhere; }
.survey-status:empty { margin-top: 0; }
.survey-status a { text-decoration: underline; text-underline-offset: 3px; }
.survey-footer { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; padding: 25px 2px 0; color: #96a3c0; font-size: 12px; line-height: 1.7; }
.survey-footer p { margin-bottom: 0; }
.survey-footer a { color: #b4c4eb; text-decoration: underline; text-decoration-color: #b4c4eb66; text-underline-offset: 3px; }
.survey-success { padding: 54px 40px 57px; text-align: center; }
.survey-success-mark { display: flex; align-items: center; justify-content: center; width: 58px; height: 58px; margin: 0 auto 23px; border: 1px solid #93acff66; border-radius: 50%; background: #123bff20; color: #c0d0ff; }
.survey-success-mark svg { width: 27px; height: 27px; }
.survey-success .survey-kicker { justify-content: center; margin-bottom: 18px; }
.survey-success h2 { margin-bottom: 18px; font-size: clamp(28px, 4vw, 40px); font-weight: 500; line-height: 1.2; letter-spacing: -.04em; }
.survey-success > p:not(.survey-kicker) { max-width: 510px; margin: 0 auto 27px; color: #b9c5df; font-size: 17px; line-height: 1.75; }
.survey-noscript { padding: 30px 40px; border-top: 1px solid #a2b4ee26; }
.survey-noscript h2 { font-size: 22px; }
.survey-noscript p { margin-bottom: 0; color: #c0cbe0; }
.survey-noscript a { text-decoration: underline; text-underline-offset: 3px; }

@media (min-width: 1100px) { .survey-form { min-height: 340px; } }
@media (max-width: 850px) {
  .survey-header { width: calc(100% - 56px); min-height: 92px; }
  .survey-shell { width: calc(100% - 56px); }
  .survey-introduction { grid-template-columns: minmax(0, 1fr) 180px; gap: 28px; padding: 49px 0 38px; }
  .survey-kicker { font-size: 10px; letter-spacing: .05em; }
  #survey-title { font-size: 48px; }
  .survey-orbit-mark { width: 100px; height: 100px; }
  .survey-progress-panel { padding: 28px 28px 23px; }
  .survey-form { padding: 0 28px 26px; }
  .survey-options { gap: 9px; }
  .survey-option { padding: 13px; }
  .survey-success { padding: 45px 28px; }
}
@media (max-width: 640px) {
  .survey-header { width: calc(100% - 36px); min-height: 80px; gap: 14px; }
  .survey-brand img { width: 117px; }
  .survey-home-link { gap: 7px; font-size: 13px; }
  .survey-home-link svg { width: 16px; height: 16px; }
  .survey-shell { width: calc(100% - 36px); padding-bottom: 28px; }
  .survey-introduction { display: block; padding: 37px 0 30px; }
  .survey-kicker { margin-bottom: 21px; font-size: 10px; letter-spacing: .045em; gap: 9px; }
  #survey-title { margin-bottom: 22px; font-size: clamp(37px, 10.4vw, 54px); line-height: 1.07; }
  #survey-intro { font-size: 16px; line-height: 1.8; }
  .survey-at-a-glance { padding: 0; margin-top: 23px; }
  .survey-orbit-mark, .survey-glance-note { display: none; }
  .survey-duration { display: inline-flex; min-height: 34px; margin: 0; padding: 5px 11px; border: 1px solid #a6b8ff2e; border-radius: 99px; background: #a6b8ff05; font-size: 13px; }
  .survey-duration svg { width: 16px; height: 16px; }
  .survey-workspace { border-radius: 13px; }
  .survey-progress-panel { padding: 23px 20px 21px; }
  .survey-progress-heading { margin-bottom: 12px; }
  #survey-step-label { font-size: 11px; }
  .survey-progress-note { display: none; }
  #survey-step-title { margin-top: 22px; font-size: 24px; }
  .survey-form { padding: 0 20px 23px; }
  .survey-question { padding: 26px 0; }
  .survey-question legend { font-size: 18px; line-height: 1.5; }
  .survey-question-help { font-size: 14px; margin-bottom: 15px; }
  .survey-options { grid-template-columns: 1fr; gap: 8px; }
  .survey-option { min-height: 54px; padding: 13px 14px; font-size: 16px; }
  .survey-option input[type="radio"], .survey-option input[type="checkbox"] { margin-top: 3px; }
  .survey-navigation { padding-top: 23px; gap: 10px; }
  .survey-button { min-height: 51px; padding: 12px 16px; gap: 12px; font-size: 14px; }
  .survey-button-back { gap: 9px; padding: 12px; }
  .survey-button svg { width: 18px; height: 18px; }
  .survey-footer { display: block; padding: 21px 2px 0; font-size: 12px; }
  .survey-footer p + p { margin-top: 5px; }
  .survey-success { padding: 40px 20px; }
  .survey-success > p:not(.survey-kicker) { font-size: 16px; }
  .survey-noscript { padding: 26px 20px; }
}
@media (max-width: 359px) {
  .survey-header, .survey-shell { width: calc(100% - 28px); }
  .survey-brand img { width: 105px; }
  .survey-home-link { font-size: 12px; gap: 5px; }
  .survey-kicker { max-width: 265px; font-size: 9px; letter-spacing: .025em; }
  .survey-progress-panel { padding-left: 16px; padding-right: 16px; }
  .survey-form { padding-left: 16px; padding-right: 16px; }
  .survey-option { gap: 10px; padding-left: 12px; padding-right: 12px; }
  .survey-button { gap: 10px; padding-left: 13px; padding-right: 13px; }
}
@media (prefers-reduced-motion: reduce) { .hyprx-survey-page * { scroll-behavior: auto; transition: none !important; } }
@media (forced-colors: active) {
  .survey-option, .survey-button, .survey-workspace, .survey-error-summary { border: 1px solid ButtonText; }
  .survey-option input[type="radio"], .survey-option input[type="checkbox"] { appearance: auto; }
  .survey-option:has(input:checked) { outline: 1px solid Highlight; }
}
