.kmsm-funnel-runtime {
    --kmsm-funnel-bg: #0e1723;
    --kmsm-funnel-panel: #132133;
    --kmsm-funnel-border: rgba(151, 178, 209, 0.35);
    --kmsm-funnel-accent: #f0a246;
    --kmsm-funnel-text: #eef4fb;
    --kmsm-funnel-soft: #c0d0e3;
    margin: 20px 0;
    border: 1px solid var(--kmsm-funnel-border);
    border-radius: 16px;
    background: radial-gradient(circle at 15% 5%, #1c2d42, var(--kmsm-funnel-bg) 58%);
    color: var(--kmsm-funnel-text);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.18);
}

.kmsm-funnel-runtime__inner {
    padding: 18px;
}

.kmsm-funnel-runtime__title {
    margin: 0;
    font-size: 28px;
}

.kmsm-funnel-runtime__step {
    margin: 6px 0 0;
    color: var(--kmsm-funnel-soft);
    font-size: 14px;
}

.kmsm-funnel-runtime__live {
    min-height: 1px;
}

.kmsm-funnel-runtime__question-title {
    margin: 14px 0 8px;
    font-size: 24px;
}

.kmsm-funnel-runtime__help {
    margin: 0 0 12px;
    color: var(--kmsm-funnel-soft);
}

.kmsm-funnel-runtime__answers-grid {
    display: grid;
    gap: 12px;
}

.kmsm-funnel-runtime--image-cards .kmsm-funnel-runtime__answers-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.kmsm-funnel-runtime__answer {
    border: 1px solid var(--kmsm-funnel-border);
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(18, 29, 44, 0.9), rgba(14, 22, 34, 0.9));
    color: var(--kmsm-funnel-text);
    padding: 12px;
    text-align: left;
    cursor: pointer;
}

.kmsm-funnel-runtime__answer.is-selected {
    border-color: var(--kmsm-funnel-accent);
    box-shadow: 0 0 0 2px rgba(240, 162, 70, 0.25) inset;
}

.kmsm-funnel-runtime__answer-badge {
    display: inline-block;
    margin-top: 8px;
    font-size: 12px;
    border-radius: 999px;
    border: 1px solid rgba(255, 203, 137, 0.65);
    color: #ffd59f;
    padding: 2px 8px;
}

.kmsm-funnel-runtime__answer-image {
    margin: -12px -12px 10px;
    border-radius: 14px 14px 0 0;
    overflow: hidden;
    min-height: 118px;
    background: linear-gradient(135deg, rgba(48, 103, 157, 0.42), rgba(24, 42, 64, 0.42));
}

.kmsm-funnel-runtime__answer-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.kmsm-funnel-runtime__freetext {
    margin-top: 10px;
}

.kmsm-funnel-runtime__freetext label {
    display: block;
    margin-bottom: 6px;
    font-size: 14px;
}

.kmsm-funnel-runtime__freetext input,
.kmsm-funnel-runtime__freetext textarea,
.kmsm-funnel-runtime__select {
    width: 100%;
    border-radius: 10px;
    border: 1px solid var(--kmsm-funnel-border);
    background: #0e1a29;
    color: var(--kmsm-funnel-text);
    padding: 10px 12px;
}

.kmsm-funnel-runtime__nav {
    margin-top: 14px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.kmsm-funnel-runtime__button {
    border: 1px solid var(--kmsm-funnel-border);
    border-radius: 10px;
    background: #1a2940;
    color: var(--kmsm-funnel-text);
    padding: 10px 14px;
    cursor: pointer;
}

.kmsm-funnel-runtime__button--primary {
    background: linear-gradient(180deg, #f4ae5f, #e49337);
    color: #1c1104;
    border-color: rgba(244, 174, 95, 0.8);
    font-weight: 700;
}

.kmsm-funnel-runtime__error {
    margin-top: 10px;
    padding: 9px 11px;
    border-left: 3px solid #ff9487;
    border-radius: 10px;
    background: rgba(64, 27, 24, 0.64);
    color: #ffd2cb;
}

.kmsm-funnel-runtime__outcome {
    border: 1px solid rgba(250, 196, 133, 0.48);
    border-radius: 12px;
    padding: 14px;
    background: linear-gradient(180deg, rgba(33, 40, 22, 0.7), rgba(20, 28, 17, 0.7));
}

.kmsm-funnel-runtime__submission {
    margin-top: 14px;
    border: 1px solid rgba(140, 198, 160, 0.4);
    border-radius: 12px;
    padding: 12px;
    background: linear-gradient(180deg, rgba(15, 35, 26, 0.7), rgba(12, 25, 20, 0.7));
}

.kmsm-funnel-runtime__submission-title {
    margin: 0 0 6px;
    font-size: 19px;
}

.kmsm-funnel-runtime__submission-description {
    margin: 0 0 12px;
    color: var(--kmsm-funnel-soft);
}

.kmsm-funnel-runtime__submission-field {
    margin-bottom: 10px;
}

.kmsm-funnel-runtime__submission-label {
    display: block;
    margin-bottom: 6px;
    font-size: 14px;
}

.kmsm-funnel-runtime__submission-required {
    color: #ffc5bc;
}

.kmsm-funnel-runtime__submission-control {
    width: 100%;
    border-radius: 10px;
    border: 1px solid var(--kmsm-funnel-border);
    background: #0e1a29;
    color: var(--kmsm-funnel-text);
    padding: 10px 12px;
}

.kmsm-funnel-runtime__submission-help {
    margin: 6px 0 0;
    font-size: 13px;
    color: var(--kmsm-funnel-soft);
}

.kmsm-funnel-runtime__submission-actions {
    margin-top: 10px;
}

.kmsm-funnel-runtime__submission-form[data-kmsm-submitting="1"] {
    opacity: 0.92;
}

.kmsm-funnel-runtime__submission-status {
    margin-top: 10px;
}

.kmsm-funnel-runtime__submission-error {
    margin: 6px 0 0;
    color: #ffd2cb;
    font-size: 13px;
}

.kmsm-funnel-runtime__submission-success-title {
    margin: 10px 0 4px;
    color: #c3f2d1;
    font-weight: 700;
}

.kmsm-funnel-runtime__submission-success-text {
    margin: 0;
    color: #d5f6df;
}

.kmsm-funnel-runtime__noscript,
.kmsm-funnel-runtime-unavailable {
    margin: 0;
    padding: 12px;
    border: 1px solid rgba(255, 172, 128, 0.55);
    border-radius: 10px;
    background: rgba(56, 31, 18, 0.62);
    color: #ffd7c0;
}

.kmsm-funnel-runtime__answer:focus,
.kmsm-funnel-runtime__button:focus,
.kmsm-funnel-runtime__button:focus-visible,
.kmsm-funnel-runtime__select:focus,
.kmsm-funnel-runtime__freetext input:focus,
.kmsm-funnel-runtime__freetext textarea:focus {
    outline: 2px solid #ffc886;
    outline-offset: 2px;
}

@media (max-width: 980px) {
    .kmsm-funnel-runtime--image-cards .kmsm-funnel-runtime__answers-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .kmsm-funnel-runtime__inner {
        padding: 14px;
    }

    .kmsm-funnel-runtime__title {
        font-size: 24px;
    }

    .kmsm-funnel-runtime__question-title {
        font-size: 21px;
    }

    .kmsm-funnel-runtime--image-cards .kmsm-funnel-runtime__answers-grid {
        grid-template-columns: 1fr;
    }
}

@media (prefers-reduced-motion: no-preference) {
    .kmsm-funnel-runtime__stage {
        animation: kmsm-funnel-fade-in 180ms ease;
    }

    @keyframes kmsm-funnel-fade-in {
        from {
            opacity: 0;
            transform: translateY(5px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }
}