.survey-shell { max-width: 640px; font-size: 1rem; }
.survey-shell [hidden] { display: none !important; }
.survey-step { min-width: 0; margin: 0 0 24px; padding: 0; border: 0; }
.survey-step legend { font-size: 1.125rem; font-weight: 700; line-height: 1.5; margin-bottom: 16px; }
.survey-options { display: grid; gap: 8px; }
.survey-option { display: flex; align-items: center; gap: 12px; min-height: 44px; margin: 0; padding: 10px 12px; border: 1px solid #ced4da; border-radius: .25rem; cursor: pointer; line-height: 1.4; }
.survey-option input { flex: 0 0 auto; width: 18px; height: 18px; accent-color: var(--primary); }
.survey-option:has(input:checked) { border-color: var(--primary); box-shadow: inset 0 0 0 1px var(--primary); }
.survey-option:has(input:disabled) { opacity: .6; cursor: default; }
.survey-option:focus-within, .survey-shell :focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }
.survey-shell textarea.form-control { height: auto; font-size: 1rem; resize: vertical; }
.survey-rating { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.survey-rating .survey-option { position: relative; justify-content: center; min-height: 48px; padding: 10px 8px; }
.survey-rating input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.survey-navigation { display: flex; justify-content: flex-end; gap: 12px; margin-top: 20px; }
.survey-navigation .btn { min-height: 44px; font-size: 1rem; }
#survey-back { margin-right: auto; }
.survey-dots { display: flex; gap: 8px; margin-bottom: 20px; }
.survey-dots span { width: 8px; height: 8px; border-radius: 50%; border: 1px solid var(--primary); }
.survey-dots .is-current { background: var(--primary); }
#survey-step-error { color: #9e3000; }
@media (min-width: 576px) { .survey-rating { grid-template-columns: repeat(6, minmax(0, 1fr)); } }