.survey-title {
     margin: 0 0 30px;
     font-size: 24px;
     line-height: 1.4;
}

.rank-group:last-of-type {
     margin-bottom: 20px;
}

.rank-legend {
     margin: 0 0 8px;
     font-size: 18px;
     font-weight: 700;
}

.rank-description {
     margin: 0 0 14px;
     font-size: 14px;
}

.rank-list {
     display: flex;
     flex-direction: column;
     gap: 25px;
}

.rank-label {
     cursor: pointer;
     display: flex;
     align-items: center;
     gap: 10px;
     min-height: var(--rank-checkbox-size);
     --rank-checkbox-size: 30px;
}

.rank-checkbox {
     position: absolute;
     width: 1px;
     height: 1px;
     margin: -1px;
     padding: 0;
     overflow: hidden;
     clip: rect(0 0 0 0);
     clip-path: inset(50%);
     white-space: nowrap;
     border: 0;
}

.rank-control {
     display: inline-flex;
     flex: 0 0 var(--rank-checkbox-size);
     align-items: center;
     justify-content: center;
     width: var(--rank-checkbox-size);
     height: var(--rank-checkbox-size);
     border: 1px solid var(--gs-limestone-color);
     border-radius: 5px;
     background: #fff;
}

.rank-checkbox:checked+.rank-control {
     border-color: #1f199e;
     background: #1f199e;
}

.rank-checkbox:checked+.rank-control::after {
     content: "";
     width: 9px;
     height: 5px;
     margin-top: -2px;
     border-left: 2px solid #fff;
     border-bottom: 2px solid #fff;
     transform: rotate(-45deg);
}

.rank-label.is-selected .rank-control {
     display: none;
}

.rank-number {
     display: none;
     flex: 0 0 var(--rank-checkbox-size);
     align-items: center;
     justify-content: center;
     width: var(--rank-checkbox-size);
     height: var(--rank-checkbox-size);
     color: #fff;
     border-radius: 5px;
     font-size: 16px;
     font-weight: 700;
     line-height: 1;
     background: #1f199e;
}

.rank-label.is-selected .rank-number {
     display: inline-flex;
}

.rank-checkbox:focus-visible+.rank-control,
.rank-checkbox:focus-visible~.rank-number {
     outline: 3px solid rgba(19, 63, 145, 0.35);
     outline-offset: 2px;
}

.rank-text {
     font-size: 15px;
}

.rank-label.is-disabled {
     cursor: not-allowed;
}

.rank-label.is-disabled .rank-control {
     border-color: #cfcfcf;
     background: #f5f5f5;
}

.rank-label.is-disabled .rank-text {
     color: #aaa;
}

.required-mark {
     color: #ff0000;
}

.rank-status {
     min-height: 20px;
     margin: 10px 0 0;
     font-size: 13px;
}

.rank-status.is-complete {
     font-weight: 600;
     color: #1f199e;
}

.rank-error {
     margin: 4px 0 0;
     font-size: 13px;
     color: #ff0000;
}

.rank-error[hidden] {
     display: none;
}

.survey-submit {
     cursor: pointer;
     min-width: 100px;
     min-height: 44px;
     padding: 0 20px;
     color: #fff;
     background: #333;
     font-size: 15px;
     border: 1px solid #333;
     border-radius: 4px;
}

.survey-submit:focus-visible {
     outline: 3px solid rgba(19, 63, 145, 0.35);
     outline-offset: 2px;
}