:root {
  --vym-navy: #17155f;
  --vym-blue: #1718a0;
  --vym-green: #92c617;
  --vym-button-hover: #272059;
  --vym-yellow: #ffd447;
  --vym-ink: #24233a;
  --vym-muted: #666578;
  --vym-line: #dedee8;
  --vym-soft: #f5f7f8;
  --vym-danger: #a42121;
  --vym-radius: 1rem;
  --vym-shadow: 0 1rem 2.5rem rgba(23, 21, 95, 0.1);
}

.vy-auth *, .vy-assessment *, .vy-result *, .vy-member-cta * { box-sizing: border-box; }
.vy-auth button, .vy-assessment button, .vy-auth input { font: inherit; }
.vy-auth :focus-visible, .vy-assessment :focus-visible, .vy-result :focus-visible { outline: 3px solid var(--vym-yellow); outline-offset: 3px; }
.vy-auth .screen-reader-text, .vy-assessment .screen-reader-text {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.vy-button, button.vy-button {
  display: inline-flex; align-items: center; justify-content: center; min-height: 3rem; padding: .72rem 1.2rem;
  border: 2px solid var(--vym-green); border-radius: 8px; color: #fff; background: var(--vym-green);
  font-family: "Poppins", Sans-serif; font-weight: 600; line-height: 1.1; text-decoration: none; cursor: pointer;
}
.vy-button:hover,
.vy-button:focus,
.vy-button:active,
button.vy-button:hover,
button.vy-button:focus,
button.vy-button:active,
a.vy-button:hover,
a.vy-button:focus,
a.vy-button:active {
  color: #fff !important;
  border-color: var(--vym-button-hover) !important;
  background-color: var(--vym-button-hover) !important;
}
.vy-button--secondary { color: #fff; border-color: var(--vym-green); background: var(--vym-green); }
.vy-card { padding: clamp(1.25rem, 3vw, 2rem); border: 1px solid var(--vym-line); border-radius: var(--vym-radius); background: #fff; box-shadow: var(--vym-shadow); }
.vy-auth { max-width: 64rem; margin-inline: auto; color: var(--vym-ink); }
.vy-auth__intro { max-width: 44rem; margin: 0 auto 2rem; text-align: center; }
.vy-auth__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; align-items: start; }
.vy-auth h2, .vy-assessment h2, .vy-result h2 { margin-top: 0; color: var(--vym-navy); }
.vy-field { margin-bottom: 1.15rem; }
.vy-field label { display: block; margin-bottom: .35rem; font-weight: 700; }
.vy-field input[type="text"], .vy-field input[type="email"], .vy-field input[type="password"] {
  width: 100%; min-height: 3rem; padding: .7rem .8rem; border: 1px solid #aaa9b7; border-radius: .45rem; color: var(--vym-ink); background: #fff;
}
.vy-check { display: flex; align-items: flex-start; gap: .55rem; margin: 1rem 0; }
.vy-check input { margin-top: .38rem; }
.vy-help { color: var(--vym-muted); font-size: .92rem; }
.vy-notice { max-width: 54rem; margin: 0 auto 1.5rem; padding: .85rem 1rem; border-left: .35rem solid var(--vym-blue); color: var(--vym-ink); background: #eef2fb; }
.vy-notice--error { border-color: var(--vym-danger); background: #fff0f0; }
.vy-member-cta { max-width: 40rem; margin-inline: auto; color: var(--vym-ink); text-align: center; }
.vy-assessment { max-width: 58rem; margin-inline: auto; color: var(--vym-ink); }
.vy-assessment__intro { margin-bottom: 2rem; }
.vy-question { margin: 0 0 1.4rem; padding: clamp(1.1rem, 3vw, 1.7rem); border: 1px solid var(--vym-line); border-radius: var(--vym-radius); background: #fff; }
.vy-question legend { width: 100%; padding: 0; color: var(--vym-navy); font-size: 1.08rem; font-weight: 760; line-height: 1.45; }
.vy-scale-labels { display: flex; justify-content: space-between; gap: 1rem; margin: .8rem 0 .45rem; color: var(--vym-muted); font-size: .82rem; }
.vy-scale { display: grid; grid-template-columns: repeat(10, minmax(2.2rem, 1fr)); gap: .35rem; }
.vy-scale input { position: absolute; opacity: 0; pointer-events: none; }
.vy-scale label { display: grid; place-items: center; aspect-ratio: 1; border: 1px solid #aaa9b7; border-radius: .45rem; background: var(--vym-soft); font-weight: 750; cursor: pointer; }
.vy-scale label:hover { border-color: var(--vym-blue); background: #ececfa; }
.vy-scale input:checked + label { color: #fff; border-color: var(--vym-blue); background: var(--vym-blue); }
.vy-scale input:focus-visible + label { outline: 3px solid var(--vym-yellow); outline-offset: 2px; }
.vy-assessment__actions { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.7rem; }
.vy-result { max-width: 58rem; margin-inline: auto; color: var(--vym-ink); }
.vy-result__score { display: flex; align-items: baseline; gap: .65rem; margin: 1rem 0; color: var(--vym-navy); }
.vy-result__score strong { font-size: clamp(3rem, 10vw, 5rem); line-height: 1; }
.vy-result-list { margin: 1.5rem 0; padding: 0; list-style: none; }
.vy-result-list li { display: grid; grid-template-columns: 2.25rem 1fr; gap: .8rem; padding: .85rem 0; border-top: 1px solid var(--vym-line); }
.vy-result-list strong { display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: 50%; color: #fff; background: var(--vym-blue); }

@media (max-width: 800px) {
  .vy-auth__grid { grid-template-columns: 1fr; }
  .vy-scale { grid-template-columns: repeat(5, 1fr); row-gap: .6rem; }
}

@media (max-width: 480px) {
  .vy-assessment__actions { align-items: stretch; flex-direction: column; }
}