/*
 * KGE Tutor Premium Quiz Design v1.3.6
 * Restores the premium quiz overview/results design and keeps the compact live quiz layout.
 * Live quiz navigation stays in Tutor's native footer at the bottom.
 */

/* KGE Tutor Premium Quiz Design v1.0.2
   Scoped to Tutor LMS quiz pages only. No sidebar, video or H5P changes. */

body.single-tutor_quiz.kge-premium-quiz-active {
    --kge-dark: #001F18;
    --kge-green: #3B7543;
    --kge-gold: #C5A059;
    --kge-gold-light: #E5C98D;
    --kge-cream: #FBF8EF;
    --kge-soft: #F4F7F5;
    --kge-text: #14221D;
    --kge-muted: #63736C;
    --kge-border: #DFE7E2;
}

body.single-tutor_quiz.kge-premium-quiz-active .tutor-learning-area-content {
    background: #F5F7F6 !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .tutor-learning-area-container {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 22px 22px 40px !important;
    box-sizing: border-box !important;
}

/* Tutor normally keeps quiz content in a narrower reading column. For KGE quizzes,
   let the quiz use the full width of the learning area beside the sidebar. */
html body.single-tutor_quiz.kge-premium-quiz-active .tutor-learning-area-content {
    min-width: 0 !important;
    width: auto !important;
    max-width: none !important;
}

html body.single-tutor_quiz.kge-premium-quiz-active .tutor-learning-area-content > .tutor-learning-area-container {
    width: 100% !important;
    max-width: none !important;
}

/* Override the site's older 1100px Tutor quiz cap and use the available lesson area. */
html body.single-tutor_quiz.kge-premium-quiz-active .tutor-learning-area-content .tutor-quiz.kge-premium-quiz {
    width: 100% !important;
    max-width: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 10px !important;
    box-sizing: border-box !important;
    font-family: 'Montserrat', sans-serif !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-quiz .tutor-quiz-intro {
    background: transparent !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-original-quiz-overview {
    display: none !important;
}

/* Hero */
body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-quiz-hero {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: 88px 1fr auto;
    align-items: center;
    gap: 22px;
    min-height: 150px;
    margin: 0 0 20px;
    padding: 26px 30px;
    border: 1px solid rgba(197,160,89,.42);
    border-radius: 18px;
    background:
        radial-gradient(circle at 85% 5%, rgba(197,160,89,.18), transparent 30%),
        linear-gradient(135deg, #001F18 0%, #00382B 100%);
    box-shadow: 0 18px 45px rgba(0,31,24,.16);
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-quiz-hero::after {
    content: '';
    position: absolute;
    right: -70px;
    bottom: -88px;
    width: 320px;
    height: 180px;
    border: 1px solid rgba(229,201,141,.25);
    border-radius: 50%;
    transform: rotate(-12deg);
    pointer-events: none;
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-hero-icon {
    display: grid;
    place-items: center;
    width: 78px;
    height: 78px;
    border: 2px solid #F6E7B5;
    border-radius: 50%;
    background: linear-gradient(145deg, #E5C98D, #B98A32);
    color: #001F18;
    font-size: 42px;
    font-weight: 800;
    box-shadow: inset 0 2px 5px rgba(255,255,255,.45), 0 10px 24px rgba(0,0,0,.18);
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-hero-kicker {
    margin-bottom: 7px;
    color: #E5C98D;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .22em;
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-quiz-hero h1 {
    margin: 0 !important;
    color: #FFFFFF !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: clamp(28px, 3vw, 42px) !important;
    font-weight: 800 !important;
    line-height: 1.05 !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-quiz-hero p {
    max-width: 680px;
    margin: 9px 0 0 !important;
    color: rgba(255,255,255,.84) !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-hero-encouragement {
    position: relative;
    z-index: 1;
    color: #F7E9BB;
    font-size: 16px;
    font-style: italic;
    font-weight: 700;
    white-space: nowrap;
    transform: rotate(-3deg);
}

/* Quiz statistics */
body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-intro-params {
    margin: 0 0 18px !important;
    padding: 18px !important;
    border: 1px solid var(--kge-border) !important;
    border-radius: 18px !important;
    background: #FFFFFF !important;
    box-shadow: 0 10px 26px rgba(0,31,24,.07) !important;
    overflow: visible !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-intro-params table,
body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-intro-params tbody {
    display: block !important;
    width: 100% !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-intro-params thead {
    display: none !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-intro-params tbody {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(155px, 1fr)) !important;
    gap: 12px !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-intro-params tbody > tr {
    display: flex !important;
    min-width: 0 !important;
    min-height: 94px !important;
    padding: 15px 14px !important;
    flex-direction: column !important;
    justify-content: center !important;
    border: 1px solid #EBEFEC !important;
    border-radius: 14px !important;
    background: linear-gradient(180deg, #FFFFFF 0%, #F8FAF9 100%) !important;
    box-shadow: 0 5px 14px rgba(0,31,24,.04) !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-intro-params td {
    display: block !important;
    width: 100% !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-intro-params td:first-child > div {
    display: flex !important;
    gap: 8px !important;
    color: var(--kge-muted) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-intro-params td:first-child svg {
    width: 19px !important;
    height: 19px !important;
    color: var(--kge-gold) !important;
    flex: 0 0 auto !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-intro-params td:last-child {
    margin-top: 7px !important;
    color: var(--kge-dark) !important;
    font-size: 25px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
}

/* Actions */
body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-quiz-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin: 0 0 18px;
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-retry-button,
body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-continue-button {
    display: flex !important;
    min-height: 78px !important;
    padding: 14px 20px !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 14px !important;
    border-radius: 15px !important;
    text-decoration: none !important;
    font-family: 'Montserrat', sans-serif !important;
    cursor: pointer !important;
    transition: transform .18s ease, box-shadow .18s ease !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-retry-button {
    border: 1px solid #D7B661 !important;
    background: linear-gradient(135deg, #F0D997 0%, #C79D48 100%) !important;
    color: #001F18 !important;
    box-shadow: 0 10px 22px rgba(197,160,89,.22) !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-continue-button {
    border: 1px solid #001F18 !important;
    background: linear-gradient(135deg, #00382B 0%, #001F18 100%) !important;
    color: #FFFFFF !important;
    box-shadow: 0 10px 22px rgba(0,31,24,.15) !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-retry-button:hover,
body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-continue-button:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 14px 26px rgba(0,31,24,.18) !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-action-icon {
    display: grid !important;
    place-items: center !important;
    flex: 0 0 45px !important;
    width: 45px !important;
    height: 45px !important;
    border-radius: 50% !important;
    background: #00382B !important;
    color: #FFFFFF !important;
    font-size: 24px !important;
    font-weight: 700 !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-continue-button .kge-premium-action-icon {
    background: #FFFFFF !important;
    color: #00382B !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-action-copy {
    display: flex !important;
    min-width: 0 !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 3px !important;
    text-align: left !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-action-copy strong {
    color: inherit !important;
    font-size: 16px !important;
    font-weight: 800 !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-action-copy small {
    color: inherit !important;
    opacity: .78 !important;
    font-size: 11px !important;
    font-weight: 600 !important;
}

/* Top tip */
body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-top-tip {
    display: grid;
    grid-template-columns: 48px 1fr auto;
    align-items: center;
    gap: 14px;
    margin: 0 0 18px;
    padding: 18px 22px;
    border: 1px solid rgba(197,160,89,.38);
    border-radius: 16px;
    background: linear-gradient(90deg, #FFFDF7 0%, #FBF6E9 100%);
    box-shadow: 0 8px 20px rgba(0,31,24,.04);
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-tip-icon {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #F0D997;
    color: #001F18;
    font-size: 23px;
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-top-tip h3 {
    margin: 0 0 4px !important;
    color: var(--kge-dark) !important;
    font-size: 16px !important;
    font-weight: 800 !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-top-tip p {
    margin: 0 !important;
    color: #53625C !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-tip-motto {
    color: #335248;
    font-size: 13px;
    font-style: italic;
    font-weight: 700;
    line-height: 1.25;
    text-align: right;
    transform: rotate(-4deg);
}

/* Attempts */
body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-attempts {
    overflow: hidden !important;
    margin: 0 !important;
    border: 1px solid var(--kge-border) !important;
    border-radius: 18px !important;
    background: #FFFFFF !important;
    box-shadow: 0 12px 30px rgba(0,31,24,.07) !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-attempts-title {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 18px 20px 14px;
    color: var(--kge-dark);
    font-size: 17px;
    font-weight: 800;
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-attempts-title > span {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border-radius: 9px;
    background: #F1E2B7;
    color: #001F18;
}

body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-attempts-header {
    padding: 11px 18px !important;
    border-top: 1px solid #EFF2F0 !important;
    border-bottom: 1px solid #E8ECEA !important;
    background: #F7F9F8 !important;
    color: #596761 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: .04em !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-attempts-item-wrapper {
    border-bottom: 1px solid #EEF1EF !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-attempts-item-wrapper:last-child {
    border-bottom: 0 !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-attempts-item {
    padding: 17px 18px !important;
    background: #FFFFFF !important;
    transition: background .18s ease !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-attempts-item:hover {
    background: #FBFCFB !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-item-info-title {
    color: var(--kge-dark) !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    text-decoration: none !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .tutor-badge-success {
    background: #E8F5EA !important;
    color: #25723C !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .tutor-badge-error {
    background: #FDECEC !important;
    color: #A53939 !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-item-actions .tutor-btn,
body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-details-btn {
    border: 1px solid #DCE4DF !important;
    border-radius: 9px !important;
    background: #FFFFFF !important;
    color: #17362C !important;
    box-shadow: none !important;
    font-size: 11px !important;
    font-weight: 700 !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-item-actions .tutor-btn:hover,
body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-details-btn:hover {
    border-color: var(--kge-gold) !important;
    background: #FFFDF7 !important;
}

/* Bottom encouragement */
body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-motivation {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: 52px 1fr 52px;
    align-items: center;
    gap: 16px;
    margin-top: 18px;
    padding: 21px 24px;
    border-radius: 17px;
    background: linear-gradient(135deg, #00382B 0%, #001F18 100%);
    color: #FFFFFF;
    box-shadow: 0 12px 28px rgba(0,31,24,.16);
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-motivation strong,
body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-motivation span {
    display: block;
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-motivation strong {
    font-size: 17px;
    font-weight: 800;
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-motivation span {
    margin-top: 3px;
    color: rgba(255,255,255,.78);
    font-size: 12px;
}

body.single-tutor_quiz.kge-premium-quiz-active .kge-motivation-icon,
body.single-tutor_quiz.kge-premium-quiz-active .kge-target-icon {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    border: 1px solid rgba(229,201,141,.55);
    border-radius: 50%;
    color: #E5C98D;
    font-size: 25px;
}

/* Keep Tutor's original footer available as a functional fallback, but visually quiet. */
body.single-tutor_quiz.kge-premium-quiz-active .tutor-learning-area-footer {
    margin-top: 18px !important;
    padding: 14px 0 0 !important;
    border-top: 0 !important;
    background: transparent !important;
}

/* Question-taking screens: premium but non-invasive. */
body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-question,
body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-question-item,
body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-questions-wrap {
    border-radius: 16px !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-question-item {
    border-color: #E2E9E5 !important;
    background: #FFFFFF !important;
    box-shadow: 0 8px 22px rgba(0,31,24,.05) !important;
}

body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-question-item label:hover {
    border-color: var(--kge-gold) !important;
    background: #FFFDF7 !important;
}

@media (max-width: 900px) {
    body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-quiz-hero {
        grid-template-columns: 70px 1fr;
        padding: 22px;
    }
    body.single-tutor_quiz.kge-premium-quiz-active .kge-hero-encouragement {
        display: none;
    }
    body.single-tutor_quiz.kge-premium-quiz-active .kge-hero-icon {
        width: 62px;
        height: 62px;
        font-size: 34px;
    }
}

@media (max-width: 700px) {
    body.single-tutor_quiz.kge-premium-quiz-active .tutor-learning-area-content .kge-premium-quiz {
        width: calc(100% - 20px) !important;
    }
    body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-quiz-hero {
        grid-template-columns: 1fr;
        gap: 12px;
        text-align: left;
    }
    body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-quiz-actions {
        grid-template-columns: 1fr;
    }
    body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-top-tip {
        grid-template-columns: 42px 1fr;
    }
    body.single-tutor_quiz.kge-premium-quiz-active .kge-tip-motto {
        display: none;
    }
    body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-intro-params tbody {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 430px) {
    body.single-tutor_quiz.kge-premium-quiz-active .tutor-quiz-intro-params tbody {
        grid-template-columns: 1fr !important;
    }
    body.single-tutor_quiz.kge-premium-quiz-active .kge-premium-motivation {
        grid-template-columns: 44px 1fr;
    }
    body.single-tutor_quiz.kge-premium-quiz-active .kge-target-icon {
        display: none;
    }
}

/* v1.0.1 responsive width guard */
@media (max-width: 700px) {
    html body.single-tutor_quiz.kge-premium-quiz-active .tutor-learning-area-content .tutor-quiz.kge-premium-quiz {
        width: calc(100% - 16px) !important;
        max-width: none !important;
        padding: 4px !important;
    }
}


/* ===== LIVE QUIZ LAYOUT (v1.3.4 compact baseline) ===== */
/*
 * KGE Tutor Premium Quiz Design v1.3.6
 * Exact-flow rebuild based on Tutor LMS 4.0.8 live quiz DOM supplied by KGE.
 * CSS only. No DOM moving, no observers, no polling.
 */

body.single-tutor_quiz {
    --kge-dark: #001F18;
    --kge-green: #3B7543;
    --kge-gold: #C5A059;
    --kge-gold-light: #E5C98D;
    --kge-bg: #F5F7F6;
    --kge-border: #DFE7E2;
    --kge-text: #14221D;
    --kge-muted: #63736C;
    font-family: Montserrat, "Segoe UI", Arial, sans-serif !important;
}

body.single-tutor_quiz [x-cloak] { display: none !important; }

/* ------------------------------------------------------------------
   PAGE / FORM: keep Tutor's real DOM in ordinary document flow.
   ------------------------------------------------------------------ */
body.single-tutor_quiz #content,
body.single-tutor_quiz #content > .ast-container,
body.single-tutor_quiz .tutor-learning-page,
body.single-tutor_quiz .tutor-learning-area,
body.single-tutor_quiz .tutor-learning-area-content,
body.single-tutor_quiz .tutor-learning-area-container {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}

body.single-tutor_quiz #content > .ast-container {
    display: block !important;
    padding: 0 !important;
}

body.single-tutor_quiz .tutor-learning-area-content,
body.single-tutor_quiz .tutor-learning-area-container {
    padding: 0 !important;
    background: var(--kge-bg) !important;
}

body.single-tutor_quiz form.tutor-quiz.tutor-quiz-submission {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 12px !important;
    position: static !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 auto !important;
    padding: 14px 18px 22px !important;
    overflow: visible !important;
    transform: none !important;
    box-sizing: border-box !important;
}

/* Hard centre all three live-quiz siblings inside the full-width form. */
body.single-tutor_quiz form.tutor-quiz > .tutor-quiz-header,
body.single-tutor_quiz form.tutor-quiz > .tutor-quiz-questions,
body.single-tutor_quiz form.tutor-quiz > .tutor-quiz-footer {
    margin-left: auto !important;
    margin-right: auto !important;
    align-self: center !important;
}

/* Critical Tutor reset: header, question area and footer are siblings.
   None of them may float, stick, translate or overlap another sibling. */
body.single-tutor_quiz form.tutor-quiz > .tutor-quiz-header,
body.single-tutor_quiz form.tutor-quiz > .tutor-quiz-questions,
body.single-tutor_quiz form.tutor-quiz > .tutor-quiz-footer {
    position: static !important;
    inset: auto !important;
    float: none !important;
    clear: both !important;
    transform: none !important;
    translate: none !important;
    box-sizing: border-box !important;
}

body.single-tutor_quiz form.tutor-quiz > .tutor-quiz-header { order: 1 !important; }
body.single-tutor_quiz form.tutor-quiz > .tutor-quiz-questions { order: 2 !important; }
body.single-tutor_quiz form.tutor-quiz > .tutor-quiz-footer { order: 3 !important; }

/* ------------------------------------------------------------------
   COMPACT CENTRED HERO
   ------------------------------------------------------------------ */
body.single-tutor_quiz form.tutor-quiz > .tutor-quiz-header {
    width: min(760px, calc(100% - 36px)) !important;
    max-width: 760px !important;
    align-self: center !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
    z-index: auto !important;
}

body.single-tutor_quiz form.tutor-quiz .tutor-quiz-progress {
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 12px 16px 11px 62px !important;
    border: 1px solid rgba(197,160,89,.48) !important;
    border-radius: 14px !important;
    background: linear-gradient(135deg,#001F18 0%,#00382B 100%) !important;
    box-shadow: 0 10px 24px rgba(0,31,24,.10) !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

body.single-tutor_quiz form.tutor-quiz .tutor-quiz-progress::before {
    content: "?";
    position: absolute;
    left: 14px;
    top: 12px;
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border: 2px solid #F6E7B5;
    border-radius: 50%;
    background: linear-gradient(145deg,#E5C98D,#B98A32);
    color: var(--kge-dark);
    font-size: 21px;
    font-weight: 900;
    line-height: 1;
}

body.single-tutor_quiz form.tutor-quiz .tutor-quiz-progress-header {
    position: static !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) auto !important;
    align-items: start !important;
    gap: 18px !important;
    width: 100% !important;
    margin: 0 0 9px !important;
    padding: 0 !important;
    transform: none !important;
}

body.single-tutor_quiz form.tutor-quiz .tutor-quiz-progress-title {
    margin: 0 !important;
    color: #fff !important;
    font-size: clamp(26px,2.2vw,32px) !important;
    font-weight: 800 !important;
    line-height: 1.05 !important;
}

body.single-tutor_quiz form.tutor-quiz .tutor-quiz-progress-title::after {
    content: "Test your understanding and see how much you have learned.";
    display: block;
    margin-top: 5px;
    color: rgba(255,255,255,.82);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.35;
}

body.single-tutor_quiz form.tutor-quiz .tutor-quiz-progress-header .tutor-btn-outline {
    position: static !important;
    inset: auto !important;
    min-width: 76px !important;
    height: 38px !important;
    margin: 0 !important;
    padding: 0 15px !important;
    border: 1px solid rgba(229,201,141,.62) !important;
    border-radius: 10px !important;
    background: rgba(255,255,255,.06) !important;
    color: #fff !important;
    box-shadow: none !important;
    transform: none !important;
}

body.single-tutor_quiz form.tutor-quiz .tutor-quiz-progress-bar-wrapper,
body.single-tutor_quiz form.tutor-quiz .tutor-progress-bar {
    position: static !important;
    width: 100% !important;
    margin: 0 !important;
    transform: none !important;
}

body.single-tutor_quiz form.tutor-quiz .tutor-progress-bar {
    height: 6px !important;
    overflow: hidden !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.18) !important;
}
body.single-tutor_quiz form.tutor-quiz .tutor-progress-bar-fill {
    background: linear-gradient(90deg,var(--kge-gold),var(--kge-gold-light)) !important;
}

/* ------------------------------------------------------------------
   QUESTION AREA: one active Tutor wrapper, normal flow, no inner scroll.
   ------------------------------------------------------------------ */
body.single-tutor_quiz form.tutor-quiz > .tutor-quiz-questions {
    width: min(800px, calc(100% - 36px)) !important;
    max-width: 800px !important;
    align-self: center !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 auto !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    z-index: auto !important;
}

body.single-tutor_quiz form.tutor-quiz .tutor-quiz-question-meta {
    position: static !important;
    width: 100% !important;
    margin: 0 0 7px !important;
    padding: 0 2px !important;
    transform: none !important;
}

body.single-tutor_quiz form.tutor-quiz .tutor-quiz-question-indicator {
    color: var(--kge-muted) !important;
    font-size: 13px !important;
    font-weight: 700 !important;
}

/* Do NOT set display. Alpine x-show owns visibility. Only reset geometry. */
body.single-tutor_quiz form.tutor-quiz .tutor-quiz-question-wrapper,
body.single-tutor_quiz form.tutor-quiz .tutor-quiz-question-wrapper-active {
    position: static !important;
    inset: auto !important;
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    transform: none !important;
    translate: none !important;
    box-sizing: border-box !important;
}

body.single-tutor_quiz form.tutor-quiz .tutor-quiz-question-wrapper-active > .tutor-quiz-question {
    position: static !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 11px 13px 12px !important;
    overflow: visible !important;
    border: 1px solid var(--kge-border) !important;
    border-radius: 16px !important;
    background: #fff !important;
    box-shadow: 0 8px 20px rgba(0,31,24,.055) !important;
    transform: none !important;
    box-sizing: border-box !important;
}

body.single-tutor_quiz form.tutor-quiz .tutor-quiz-question-header {
    position: static !important;
    display: grid !important;
    grid-template-columns: 30px minmax(0,1fr) auto !important;
    align-items: start !important;
    gap: 8px !important;
    width: 100% !important;
    margin: 0 0 8px !important;
    padding: 0 !important;
    transform: none !important;
    box-sizing: border-box !important;
}

body.single-tutor_quiz form.tutor-quiz .tutor-quiz-question-number {
    width: 28px !important;
    height: 28px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 50% !important;
    background: #FFF2C8 !important;
    color: var(--kge-dark) !important;
    font-weight: 800 !important;
}

body.single-tutor_quiz form.tutor-quiz .tutor-quiz-question-title {
    min-width: 0 !important;
    margin: 0 !important;
    color: var(--kge-dark) !important;
    font-size: clamp(17px,1.45vw,21px) !important;
    font-weight: 800 !important;
    line-height: 1.24 !important;
    overflow-wrap: anywhere !important;
}

body.single-tutor_quiz form.tutor-quiz .tutor-quiz-question-header .tutor-badge {
    position: static !important;
    align-self: start !important;
    white-space: nowrap !important;
    margin: 0 !important;
    border-radius: 999px !important;
    background: #F7E2A1 !important;
    color: #5B4A1D !important;
    font-weight: 700 !important;
    transform: none !important;
}

/* ANSWERS: compact vertically, same readable font size. */
body.single-tutor_quiz form.tutor-quiz .tutor-quiz-question-options {
    position: static !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 5px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    box-sizing: border-box !important;
}

body.single-tutor_quiz form.tutor-quiz .tutor-quiz-question-option,
body.single-tutor_quiz form.tutor-quiz .tutor-input-field,
body.single-tutor_quiz form.tutor-quiz .tutor-input-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

body.single-tutor_quiz form.tutor-quiz .tutor-quiz-question-option {
    position: relative !important;
    min-height: 38px !important;
    padding: 0 !important;
    border: 1px solid #DCE5E0 !important;
    border-radius: 11px !important;
    background: #fff !important;
    cursor: pointer !important;
    overflow: hidden !important;
    transform: none !important;
}

body.single-tutor_quiz form.tutor-quiz .tutor-quiz-question-option:hover {
    border-color: rgba(197,160,89,.78) !important;
}
body.single-tutor_quiz form.tutor-quiz .tutor-quiz-question-option:has(input:checked) {
    border-color: var(--kge-green) !important;
    background: #F0F8F2 !important;
}

body.single-tutor_quiz form.tutor-quiz .tutor-quiz-question-option .tutor-input-wrapper {
    min-height: 38px !important;
    display: flex !important;
    align-items: center !important;
    gap: 11px !important;
    padding: 5px 10px !important;
}

body.single-tutor_quiz form.tutor-quiz .tutor-radio {
    flex: 0 0 auto !important;
    margin: 0 !important;
}

body.single-tutor_quiz form.tutor-quiz .tutor-label {
    display: block !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--kge-text) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.30 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
}

/* Students cannot use Tutor's Skip Question control. */
body.single-tutor_quiz form.tutor-quiz .tutor-quiz-skip-btn {
    display: none !important;
}

/* ------------------------------------------------------------------
   FOOTER: source HTML proves this is AFTER .tutor-quiz-questions.
   Force every footer layer into normal flow so Next can only render below
   the complete active question card.
   ------------------------------------------------------------------ */
body.single-tutor_quiz form.tutor-quiz > .tutor-quiz-footer {
    position: static !important;
    inset: auto !important;
    width: min(800px, calc(100% - 36px)) !important;
    max-width: 800px !important;
    align-self: center !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
    transform: none !important;
    translate: none !important;
    z-index: auto !important;
}

body.single-tutor_quiz form.tutor-quiz .tutor-quiz-footer-inner,
body.single-tutor_quiz form.tutor-quiz .tutor-quiz-footer-actions {
    position: static !important;
    inset: auto !important;
    float: none !important;
    transform: none !important;
    translate: none !important;
    box-sizing: border-box !important;
}

body.single-tutor_quiz form.tutor-quiz .tutor-quiz-footer-inner {
    width: 100% !important;
    min-height: 46px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.single-tutor_quiz form.tutor-quiz .tutor-quiz-footer-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    margin: 0 0 0 auto !important;
    padding: 0 !important;
}

body.single-tutor_quiz form.tutor-quiz .tutor-quiz-answer-previous-btn,
body.single-tutor_quiz form.tutor-quiz .tutor-quiz-answer-next-btn,
body.single-tutor_quiz form.tutor-quiz .tutor-quiz-submit-btn {
    position: static !important;
    inset: auto !important;
    min-width: 132px !important;
    width: auto !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 0 18px !important;
    border-radius: 11px !important;
    font-weight: 700 !important;
    transform: none !important;
    translate: none !important;
}

body.single-tutor_quiz form.tutor-quiz .tutor-quiz-answer-next-btn,
body.single-tutor_quiz form.tutor-quiz .tutor-quiz-submit-btn {
    border-color: var(--kge-dark) !important;
    background: var(--kge-dark) !important;
    color: #fff !important;
}

/* Remove any Tutor internal scrolling on the live quiz itself. */
body.single-tutor_quiz form.tutor-quiz .tutor-quiz-questions,
body.single-tutor_quiz form.tutor-quiz .tutor-quiz-question-wrapper,
body.single-tutor_quiz form.tutor-quiz .tutor-quiz-question,
body.single-tutor_quiz form.tutor-quiz .tutor-quiz-question-options {
    overflow-y: visible !important;
    max-height: none !important;
}

@media (max-width: 760px) {
    body.single-tutor_quiz form.tutor-quiz.tutor-quiz-submission {
        padding: 12px 10px 20px !important;
    }
    body.single-tutor_quiz form.tutor-quiz .tutor-quiz-progress {
        padding: 14px 14px 14px 67px !important;
    }
    body.single-tutor_quiz form.tutor-quiz .tutor-quiz-progress::before {
        left: 14px;
        top: 14px;
        width: 40px;
        height: 40px;
        font-size: 23px;
    }
    body.single-tutor_quiz form.tutor-quiz .tutor-quiz-question-wrapper-active > .tutor-quiz-question {
        padding: 15px !important;
    }
    body.single-tutor_quiz form.tutor-quiz .tutor-quiz-question-header {
        grid-template-columns: 36px minmax(0,1fr) !important;
    }
    body.single-tutor_quiz form.tutor-quiz .tutor-quiz-question-header .tutor-badge {
        grid-column: 2 !important;
        justify-self: start !important;
    }
}

@media (max-width: 520px) {
    body.single-tutor_quiz form.tutor-quiz .tutor-quiz-footer-inner {
        flex-direction: column !important;
        align-items: stretch !important;
    }
    body.single-tutor_quiz form.tutor-quiz .tutor-quiz-footer-actions,
    body.single-tutor_quiz form.tutor-quiz .tutor-quiz-answer-previous-btn,
    body.single-tutor_quiz form.tutor-quiz .tutor-quiz-answer-next-btn,
    body.single-tutor_quiz form.tutor-quiz .tutor-quiz-submit-btn {
        width: 100% !important;
    }
}

/* ==========================================================
   KGE v1.3.7 — COMPACT OVERVIEW PAGE ONLY
   Condenses the first/overview screen without changing the
   live quiz question layout or Tutor's bottom navigation.
   ========================================================== */
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .kge-premium-quiz-hero {
    grid-template-columns: 66px 1fr auto !important;
    gap: 16px !important;
    min-height: 118px !important;
    margin-bottom: 12px !important;
    padding: 18px 24px !important;
    border-radius: 16px !important;
}
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .kge-hero-icon {
    width: 62px !important;
    height: 62px !important;
    font-size: 34px !important;
}
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .kge-hero-kicker {
    margin-bottom: 4px !important;
    font-size: 9px !important;
}
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .kge-premium-quiz-hero h1 {
    font-size: clamp(25px, 2.5vw, 34px) !important;
}
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .kge-premium-quiz-hero p {
    margin-top: 5px !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
}
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .kge-hero-encouragement {
    font-size: 13px !important;
}
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .tutor-quiz-intro-params {
    margin-bottom: 12px !important;
    padding: 12px !important;
    border-radius: 16px !important;
}
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .tutor-quiz-intro-params tbody {
    gap: 9px !important;
}
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .tutor-quiz-intro-params tbody > tr {
    min-height: 74px !important;
    padding: 10px 12px !important;
    border-radius: 12px !important;
}
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .tutor-quiz-intro-params td:first-child > div {
    gap: 6px !important;
    font-size: 10px !important;
}
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .tutor-quiz-intro-params td:first-child svg {
    width: 16px !important;
    height: 16px !important;
}
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .tutor-quiz-intro-params td:last-child {
    margin-top: 5px !important;
    font-size: 21px !important;
}
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .kge-premium-quiz-actions {
    gap: 10px !important;
    margin-bottom: 12px !important;
}
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .kge-premium-retry-button,
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .kge-premium-continue-button {
    min-height: 62px !important;
    padding: 10px 16px !important;
    gap: 11px !important;
}
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .kge-premium-action-icon {
    flex-basis: 38px !important;
    width: 38px !important;
    height: 38px !important;
    font-size: 20px !important;
}
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .kge-action-copy strong {
    font-size: 14px !important;
}
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .kge-action-copy small {
    font-size: 10px !important;
}
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .kge-premium-top-tip {
    grid-template-columns: 38px 1fr auto !important;
    gap: 11px !important;
    margin-bottom: 12px !important;
    padding: 12px 16px !important;
    border-radius: 14px !important;
}
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .kge-tip-icon {
    width: 36px !important;
    height: 36px !important;
    font-size: 19px !important;
}
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .kge-premium-top-tip h3 {
    margin-bottom: 2px !important;
    font-size: 14px !important;
}
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .kge-premium-top-tip p,
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .kge-tip-motto {
    font-size: 10.5px !important;
}
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .tutor-quiz-attempts {
    border-radius: 16px !important;
}
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .kge-attempts-title {
    gap: 8px !important;
    padding: 12px 16px 10px !important;
    font-size: 15px !important;
}
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .kge-attempts-title > span {
    width: 26px !important;
    height: 26px !important;
}
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .tutor-quiz-attempts-header {
    padding: 8px 14px !important;
    font-size: 10px !important;
}
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .tutor-quiz-attempts-item {
    padding: 12px 14px !important;
}
body.single-tutor_quiz.kge-premium-quiz-active:not(.kge-premium-live-active) .tutor-quiz-item-info-title {
    font-size: 12px !important;
}


/* v1.3.8 — remove only Tutor's duplicate bottom Continue Lesson link on the premium overview/results screen.
   The top KGE Continue Lesson action remains. Native live-quiz Next/Back controls are untouched. */
body.single-tutor_quiz.kge-premium-quiz-active .tutor-learning-area-footer a.kge-hide-native-overview-continue {
    display: none !important;
}