/* One question at a time (app/static/steps.js). */
form.st-on .st-hide { display: none !important; }
form.st-on { display: grid; gap: 16px; }
form.st-on > * { grid-column: 1 / -1; }
.st-head { display: grid; gap: 8px; }
.st-count { font-size: 13px; font-weight: 600; color: var(--muted, #667); }
.st-bar { display: block; height: 6px; border-radius: 99px; background: var(--surface-2, #eceaf6); overflow: hidden; }
.st-bar i { display: block; height: 100%; width: 0; border-radius: inherit; background: var(--accent, #5b4cf0); transition: width .3s ease; }
form.st-on > label, form.st-on > fieldset { font-size: 18px; font-weight: 600; }
form.st-on > label input, form.st-on > label select, form.st-on > label textarea { font-size: 17px; min-height: 52px; margin-top: 10px; }
form.st-on .ea-pills { gap: 10px; }
form.st-on .ea-pill span { min-height: 48px; display: inline-flex; align-items: center; }
form.st-on > label.check, form.st-on > label.ea-consent { font-size: 15px; font-weight: 400; }
.st-nav { display: flex; gap: 10px; justify-content: space-between; }
.st-nav .st-next { margin-left: auto; min-height: 48px; min-width: 140px; }
.st-nav .st-back { min-height: 48px; }
.st-nav:not(:has(:not([hidden]))) { display: none; }
.st-need { margin: 0; color: var(--bad, #c62828); font-size: 14px; }
@media (prefers-reduced-motion: reduce) { .st-bar i { transition: none; } }
