:root {
    --green-950: #07362f;
    --green-900: #0b4f43;
    --green-700: #11705e;
    --green-100: #e5f3ee;
    --gold: #efb85e;
    --gold-soft: #fff1cf;
    --ink: #15201e;
    --muted: #66736f;
    --line: #dce6e2;
    --surface: #ffffff;
    --canvas: #f2f6f4;
    --radius: 18px;
    --shadow: 0 18px 42px rgba(8, 65, 55, .12);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }

html, body { margin: 0; min-height: 100%; color: var(--ink); background: var(--canvas); }

body { min-height: 100vh; }

a { color: inherit; }

button, input, select { font: inherit; }

.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 11px 18px;
    border: 1px solid transparent;
    border-radius: 12px;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
}

.button.primary { color: #fff; background: linear-gradient(135deg, var(--green-900), var(--green-700)); }
.button.secondary { color: var(--green-900); border-color: var(--line); background: #fff; }
.button.small { min-height: 40px; padding: 8px 14px; }
.button.full { width: 100%; }

.eyebrow { color: var(--green-700); font-size: .72rem; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }

.alert { margin-bottom: 14px; padding: 13px 15px; border-radius: 12px; }
.alert.success { color: #0b5d42; background: #dff4e8; }
.alert.danger { color: #8a2424; background: #fde5e5; }

.topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 72px;
    padding: 12px 28px;
    border-bottom: 1px solid var(--line);
    background: rgba(255,255,255,.95);
    backdrop-filter: blur(12px);
}

.mobile-brand { display: flex; align-items: center; gap: 9px; text-decoration: none; }
.mobile-brand img { width: 40px; height: 40px; border-radius: 11px; }

.language-switcher { display: flex; gap: 5px; padding: 4px; border-radius: 999px; background: #edf3f1; }
.language-switcher a { padding: 7px 10px; border-radius: 999px; font-size: .7rem; font-weight: 900; text-decoration: none; }
.language-switcher a.active { color: #fff; background: var(--green-900); }

.topbar-actions { display: flex; align-items: center; gap: 12px; }
.topbar-actions > a:not(.button) { font-size: .85rem; font-weight: 800; text-decoration: none; }

.page { width: min(1480px, calc(100% - 40px)); margin: 0 auto; padding: 32px 0 60px; }

.hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(360px, .8fr);
    align-items: center;
    gap: 50px;
    min-height: calc(100vh - 150px);
}

.hero-copy h1 {
    max-width: 850px;
    margin: 12px 0 18px;
    font-size: clamp(3.2rem, 7vw, 6.8rem);
    line-height: .94;
    letter-spacing: -.055em;
}

.hero-subtitle { max-width: 760px; color: var(--muted); font-size: 1.15rem; line-height: 1.7; }

.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }

.feature-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 44px; }
.feature-row article { padding: 18px; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,.72); }
.feature-row article > span { color: var(--green-700); font-size: 1.2rem; }
.feature-row h3 { margin: 12px 0 6px; }
.feature-row p { margin: 0; color: var(--muted); line-height: 1.55; }

.hero-visual { display: grid; place-items: center; }
.phone-frame { width: 310px; padding: 14px; border: 12px solid #102823; border-radius: 46px; background: #091814; box-shadow: var(--shadow); transform: rotate(2deg); }
.phone-screen { min-height: 570px; padding: 28px 20px; border-radius: 28px; background: linear-gradient(180deg, #f8fcfa, #eaf5f1); }
.phone-screen img { width: 72px; height: 72px; border-radius: 20px; }
.phone-screen strong, .phone-screen small { display: block; }
.phone-screen strong { margin-top: 12px; font-size: 1.25rem; }
.phone-screen small { color: var(--muted); }
.phone-trip-card { margin-top: 30px; padding: 28px 18px; border-radius: 20px; color: #fff; background: linear-gradient(135deg, var(--green-900), var(--green-700)); font-size: 1.6rem; font-weight: 900; }
.phone-action { margin-top: 14px; padding: 16px; border-radius: 15px; background: var(--gold-soft); font-weight: 900; }
.phone-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 14px; }
.phone-grid span { padding: 14px 8px; border-radius: 13px; background: #fff; text-align: center; font-size: .75rem; font-weight: 850; }

.auth-layout {
    display: grid;
    grid-template-columns: minmax(320px, .9fr) minmax(460px, 1.1fr);
    min-height: calc(100vh - 140px);
    overflow: hidden;
    border-radius: 24px;
    background: #fff;
    box-shadow: var(--shadow);
}

.auth-story { padding: 50px; color: #fff; background: radial-gradient(circle at 70% 10%, rgba(239,184,94,.2), transparent 34%), linear-gradient(155deg, var(--green-950), var(--green-700)); }
.auth-story img { width: min(320px, 100%); }
.auth-story h2 { margin-top: 70px; font-size: clamp(2.4rem, 4vw, 4.4rem); line-height: 1.03; }
.auth-story p { color: rgba(255,255,255,.72); line-height: 1.7; }

.auth-card { align-self: center; width: min(620px, calc(100% - 40px)); margin: 30px auto; padding: 42px; }
.auth-card.compact { max-width: 560px; }
.auth-card h1 { margin: 8px 0; font-size: clamp(2.1rem, 4vw, 3.7rem); letter-spacing: -.045em; }
.auth-card > p { color: var(--muted); }

.auth-card form, .onboarding-card form { display: grid; gap: 15px; margin-top: 24px; }
label { display: grid; gap: 7px; font-weight: 800; }
input, select { width: 100%; min-height: 48px; padding: 11px 13px; border: 1px solid var(--line); border-radius: 11px; background: #fff; }
.check-row { grid-template-columns: auto 1fr; align-items: start; gap: 10px; font-size: .82rem; font-weight: 600; }
.check-row input { width: 20px; min-height: 20px; margin: 0; accent-color: var(--green-700); }
.auth-switch { text-align: center; }
.auth-switch a { color: var(--green-700); font-weight: 900; }

.onboarding-wrap { width: min(760px, 100%); margin: 20px auto; }
.onboarding-brand { display: flex; align-items: center; gap: 10px; margin-bottom: 25px; }
.onboarding-brand img { width: 52px; height: 52px; border-radius: 14px; }
.onboarding-brand strong, .onboarding-brand small { display: block; }
.onboarding-brand small { color: var(--muted); }

.progress-head { margin-bottom: 14px; color: var(--green-700); font-weight: 900; }
.progress-track { height: 7px; margin-top: 9px; overflow: hidden; border-radius: 999px; background: #dce9e4; }
.progress-track i { display: block; height: 100%; background: linear-gradient(90deg, var(--green-900), var(--green-700)); }

.onboarding-card { padding: 34px; border-radius: 20px; background: #fff; box-shadow: var(--shadow); }
.onboarding-card h1 { margin: 0 0 8px; font-size: 2.4rem; }
.onboarding-card > form > p { color: var(--muted); }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

.app-shell { display: grid; grid-template-columns: 250px minmax(0,1fr); }
.app-sidebar { position: sticky; top: 0; display: flex; flex-direction: column; min-height: 100vh; padding: 18px 14px; color: #fff; background: linear-gradient(180deg, var(--green-950), #092d28); }
.app-brand { display: flex; align-items: center; gap: 10px; color: #fff; text-decoration: none; }
.app-brand img { width: 48px; height: 48px; border-radius: 13px; }
.app-brand strong, .app-brand small { display: block; }
.app-brand small { color: rgba(255,255,255,.58); font-size: .68rem; }
.app-sidebar nav { display: grid; gap: 5px; margin-top: 30px; }
.app-sidebar nav a, .sidebar-bottom a, .sidebar-bottom button { display: block; width: 100%; padding: 12px 14px; border: 0; border-radius: 12px; color: rgba(255,255,255,.78); background: transparent; text-align: left; text-decoration: none; cursor: pointer; }
.app-sidebar nav a.active { color: #fff; background: rgba(255,255,255,.13); }
.sidebar-bottom { margin-top: auto; }
.sidebar-bottom form { margin: 0; }

.app-content { min-width: 0; }
.app-content .mobile-brand { visibility: hidden; }

.dashboard-hero { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 30px; border-radius: 22px; color: #fff; background: linear-gradient(135deg, var(--green-950), var(--green-700)); box-shadow: var(--shadow); }
.dashboard-hero h1 { margin: 8px 0; font-size: clamp(2.4rem, 5vw, 4.6rem); }
.dashboard-hero p { color: rgba(255,255,255,.75); }
.dashboard-hero img { width: 120px; height: 120px; border-radius: 28px; }

.dashboard-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 16px; margin-top: 18px; }
.dashboard-grid article { padding: 22px; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.dashboard-grid article > span { color: var(--green-700); font-size: 1.4rem; }
.dashboard-grid h2 { margin: 12px 0 8px; }
.dashboard-grid strong { font-size: 1.4rem; }
.dashboard-grid p { color: var(--muted); line-height: 1.55; }

.installer-page { display: grid; place-items: center; padding: 30px; background: linear-gradient(135deg, var(--green-950), var(--green-700)); }
.installer-card { width: min(720px, 100%); padding: 42px; border-radius: 24px; background: #fff; box-shadow: var(--shadow); }
.installer-logo { display: flex; align-items: center; gap: 10px; }
.installer-logo img { width: 60px; height: 60px; border-radius: 16px; }
.installer-logo strong, .installer-logo small { display: block; }
.installer-logo small, .muted { color: var(--muted); }

.empty-card { padding: 40px; border-radius: 20px; background: #fff; box-shadow: var(--shadow); text-align: center; }

@media (max-width: 900px) {
    .hero-grid, .auth-layout { grid-template-columns: 1fr; }
    .hero-visual { display: none; }
    .feature-row { grid-template-columns: 1fr; }
    .auth-story { display: none; }
    .app-shell { display: block; }
    .app-sidebar { display: none; }
    .app-content .mobile-brand { visibility: visible; }
    .dashboard-grid { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
    .topbar { position: sticky; top: 0; z-index: 30; padding: 10px 12px; }
    .topbar-actions > a:not(.button) { display: none; }
    .page { width: 100%; padding: 18px 14px 90px; }
    .hero-copy h1 { font-size: 3.2rem; }
    .hero-actions { display: grid; }
    .auth-card { width: 100%; padding: 24px 6px; }
    .onboarding-card { padding: 22px 16px; }
    .form-grid { grid-template-columns: 1fr; }
    .dashboard-hero { align-items: flex-start; flex-direction: column; padding: 22px; }
    .dashboard-hero img { width: 76px; height: 76px; }
    .language-switcher a { padding: 6px 8px; }
}


/* Voyara Core 1.1 – language and country selection */
.country-select {
    min-height: 280px;
    padding: 8px;
}

.country-select option {
    min-height: 42px;
    padding: 10px 12px;
    border-radius: 9px;
    line-height: 1.5;
}

.country-select option:checked {
    color: #fff;
    background:
        linear-gradient(135deg, var(--green-900), var(--green-700));
}

.country-language-suggestion {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px;
    border: 1px solid rgba(17,112,94,.16);
    border-radius: 13px;
    background: var(--green-100);
}

.country-language-suggestion small,
.country-language-suggestion strong {
    display: block;
}

.country-language-suggestion small {
    color: var(--muted);
}

.country-language-suggestion strong {
    margin-top: 4px;
}

.suggestion-check {
    display: flex;
    grid-template-columns: none;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
    font-size: .82rem;
}

.suggestion-check input {
    width: 20px;
    min-height: 20px;
    margin: 0;
    accent-color: var(--green-700);
}

@media (max-width: 640px) {
    .country-select {
        min-height: 250px;
    }

    .country-language-suggestion {
        align-items: flex-start;
        flex-direction: column;
    }
}


/* Voyara Core 1.2 – profile, trips and dashboard */
.section-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 20px;
}

.section-heading h1 {
    margin: 5px 0 6px;
    font-size: clamp(2.2rem, 4vw, 4rem);
    letter-spacing: -.045em;
}

.section-heading p {
    margin: 0;
    color: var(--muted);
}

.section-heading.split {
    align-items: center;
}

.profile-grid {
    display: grid;
    grid-template-columns: 310px minmax(0, 1fr);
    gap: 18px;
}

.profile-photo-card,
.profile-form-card,
.trip-edit-card {
    padding: 24px;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: #fff;
    box-shadow: var(--shadow);
}

.profile-photo-card {
    align-self: start;
    text-align: center;
}

.profile-photo-preview {
    display: grid;
    place-items: center;
    width: 150px;
    height: 150px;
    margin: 0 auto 18px;
    overflow: hidden;
    border: 4px solid #fff;
    border-radius: 50%;
    color: #fff;
    background: linear-gradient(135deg, var(--green-900), var(--green-700));
    box-shadow: 0 10px 26px rgba(8,65,55,.18);
    font-size: 3.4rem;
    font-weight: 900;
}

.profile-photo-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.profile-photo-card h2 {
    margin: 0;
}

.profile-photo-card > p {
    margin: 5px 0 18px;
    color: var(--muted);
}

.photo-upload-form {
    display: grid;
    gap: 10px;
}

.file-button input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.file-button span {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 10px 14px;
    border: 1px dashed #9cb5ad;
    border-radius: 11px;
    color: var(--green-900);
    background: var(--green-100);
    cursor: pointer;
}

.profile-form-card {
    display: grid;
    gap: 24px;
}

.profile-form-card section {
    display: grid;
    gap: 14px;
}

.card-title-row {
    display: flex;
    align-items: center;
    gap: 9px;
}

.card-title-row h2 {
    margin: 0;
}

.card-title-row > span {
    color: var(--green-700);
}

textarea {
    width: 100%;
    padding: 12px 13px;
    border: 1px solid var(--line);
    border-radius: 11px;
    resize: vertical;
    font: inherit;
}

.trip-list {
    display: grid;
    gap: 14px;
}

.trip-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
    padding: 20px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: #fff;
}

.trip-card.active {
    border-color: var(--green-700);
    box-shadow: inset 4px 0 0 var(--green-700);
}

.trip-card-flag {
    display: grid;
    place-items: center;
    width: 62px;
    height: 62px;
    border-radius: 16px;
    background: var(--green-100);
    font-size: 2rem;
}

.trip-title-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.trip-title-row h2 {
    margin: 0;
}

.trip-title-row span {
    padding: 5px 8px;
    border-radius: 999px;
    color: #fff;
    background: var(--green-700);
    font-size: .65rem;
    font-weight: 900;
}

.trip-card-copy > p {
    margin: 5px 0 12px;
    color: var(--muted);
}

.trip-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    color: var(--muted);
    font-size: .78rem;
}

.trip-edit-card {
    display: grid;
    gap: 16px;
}

.form-grid.three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

.button.danger {
    color: #8b2020;
    border-color: #efcaca;
    background: #fff1f1;
}

.danger-zone {
    display: flex;
    justify-content: flex-end;
    margin-top: 16px;
}

.dashboard-hero-release {
    min-height: 250px;
}

.hero-account {
    display: grid;
    justify-items: center;
    gap: 9px;
}

.hero-account img,
.hero-account > span {
    display: grid;
    place-items: center;
    width: 90px;
    height: 90px;
    border: 3px solid rgba(255,255,255,.6);
    border-radius: 50%;
    object-fit: cover;
    color: var(--green-900);
    background: var(--gold);
    font-size: 2rem;
    font-weight: 900;
}

.hero-account a {
    color: #fff;
    font-size: .75rem;
    font-weight: 850;
}

.dashboard-stat-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-top: 16px;
}

.dashboard-stat-row article {
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
}

.dashboard-stat-row small,
.dashboard-stat-row strong {
    display: block;
}

.dashboard-stat-row small {
    color: var(--muted);
}

.dashboard-stat-row strong {
    margin-top: 7px;
    font-size: 1.15rem;
}

.dashboard-main-grid {
    display: grid;
    grid-template-columns: 1.25fr .75fr;
    gap: 16px;
    margin-top: 16px;
}

.dashboard-trip-card,
.dashboard-learning-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 16px;
    min-height: 240px;
    padding: 24px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: #fff;
}

.dashboard-card-icon {
    display: grid;
    place-items: center;
    width: 56px;
    height: 56px;
    border-radius: 15px;
    background: var(--green-100);
    font-size: 1.7rem;
}

.dashboard-trip-card h2,
.dashboard-learning-card h2 {
    margin: 7px 0;
    font-size: 1.8rem;
}

.dashboard-trip-card p,
.dashboard-learning-card p {
    color: var(--muted);
}

.countdown {
    display: block;
    margin: 14px 0;
    color: var(--green-700);
}

@media (max-width: 960px) {
    .profile-grid,
    .dashboard-main-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-stat-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .section-heading,
    .section-heading.split {
        align-items: stretch;
        flex-direction: column;
    }

    .section-heading .button {
        width: 100%;
    }

    .profile-photo-card,
    .profile-form-card,
    .trip-edit-card {
        padding: 18px 14px;
    }

    .trip-card {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .trip-card-actions {
        grid-column: 1 / -1;
    }

    .trip-card-actions .button {
        width: 100%;
    }

    .form-grid.three,
    .dashboard-stat-row {
        grid-template-columns: 1fr;
    }

    .form-actions {
        flex-direction: column-reverse;
    }

    .form-actions .button {
        width: 100%;
    }

    .dashboard-trip-card,
    .dashboard-learning-card {
        grid-template-columns: 1fr;
    }
}


/* Voyara Core 1.3 – learning and phrasebook */
.lesson-shell {
    width: min(820px, 100%);
    margin: 0 auto;
}

.lesson-progress {
    margin-bottom: 14px;
    color: var(--green-700);
    font-size: .82rem;
    font-weight: 850;
}

.lesson-progress > div {
    height: 8px;
    margin-top: 8px;
    overflow: hidden;
    border-radius: 999px;
    background: #dce9e4;
}

.lesson-progress i {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, var(--green-900), var(--green-700));
    transition: width .2s ease;
}

.lesson-card,
.lesson-complete {
    min-height: 480px;
    padding: 42px;
    border: 1px solid var(--line);
    border-radius: 24px;
    background:
        radial-gradient(circle at 50% 100%, rgba(229,243,238,.9), transparent 45%),
        #fff;
    box-shadow: var(--shadow);
    text-align: center;
}

.lesson-question {
    color: var(--muted);
    font-weight: 750;
}

.lesson-card > h2 {
    margin: 42px auto;
    font-size: clamp(2.3rem, 5vw, 4.8rem);
    line-height: 1.05;
    letter-spacing: -.04em;
}

.lesson-answer {
    margin-top: 34px;
    padding-top: 28px;
    border-top: 1px solid var(--line);
}

.lesson-answer small,
.lesson-answer strong {
    display: block;
}

.lesson-answer > strong {
    margin-top: 7px;
    color: var(--green-700);
    font-size: clamp(1.9rem, 4vw, 3.3rem);
}

.pronunciation-box {
    margin: 16px auto 0;
    padding: 12px;
    border-radius: 12px;
    background: var(--gold-soft);
}

.pronunciation-box span,
.pronunciation-box b {
    display: block;
}

.pronunciation-box span {
    color: var(--muted);
    font-size: .72rem;
}

.lesson-rating {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-top: 24px;
}

.button.success {
    color: #0c6848;
    background: #ddf5e8;
}

.button.warning {
    color: #8b5b00;
    background: #fff0c7;
}

.lesson-complete {
    display: grid;
    place-items: center;
    align-content: center;
}

.lesson-complete > span {
    display: grid;
    place-items: center;
    width: 86px;
    height: 86px;
    border-radius: 50%;
    color: #fff;
    background: var(--green-700);
    font-size: 2.8rem;
}

.phrasebook-toolbar {
    display: grid;
    gap: 13px;
    margin-bottom: 18px;
}

.category-tabs {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding-bottom: 3px;
}

.category-tabs a {
    flex: 0 0 auto;
    padding: 10px 13px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    font-size: .78rem;
    font-weight: 800;
    text-decoration: none;
}

.category-tabs a.active {
    color: #fff;
    border-color: var(--green-700);
    background: var(--green-700);
}

.phrase-list {
    display: grid;
    gap: 12px;
}

.phrase-card {
    position: relative;
    display: grid;
    grid-template-columns: 150px minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
    padding: 20px;
    border: 1px solid var(--line);
    border-radius: 17px;
    background: #fff;
}

.phrase-category-mark {
    display: grid;
    justify-items: center;
    gap: 7px;
    color: var(--muted);
    text-align: center;
}

.phrase-category-mark > span {
    display: grid;
    place-items: center;
    width: 60px;
    height: 60px;
    border-radius: 16px;
    background: var(--green-100);
    font-size: 1.8rem;
}

.phrase-copy small {
    color: var(--muted);
}

.phrase-copy p {
    margin: 4px 0 13px;
}

.phrase-copy h2 {
    margin: 4px 0 0;
    color: var(--green-700);
    font-size: 1.6rem;
}

.phrase-pronunciation {
    margin-top: 9px;
    color: var(--muted);
    font-size: .78rem;
}

.favorite-button {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border: 1px solid var(--line);
    border-radius: 50%;
    color: #9aa6a2;
    background: #fff;
    cursor: pointer;
    font-size: 1.15rem;
}

.favorite-button.active {
    color: #b47500;
    border-color: #e8c36f;
    background: var(--gold-soft);
}

.quick-help-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 30px;
    border-radius: 22px;
    color: #fff;
    background: linear-gradient(135deg, #5a1717, #a83232);
    box-shadow: var(--shadow);
}

.quick-help-hero h1 {
    margin: 8px 0;
    font-size: clamp(2.4rem, 5vw, 4.6rem);
}

.quick-help-hero p {
    max-width: 780px;
    color: rgba(255,255,255,.78);
}

.quick-help-hero > span {
    font-size: 4rem;
}

.quick-warning {
    margin: 16px 0;
    padding: 14px 16px;
    border: 1px solid #f0c7c7;
    border-radius: 13px;
    color: #7c2424;
    background: #fff1f1;
    font-weight: 750;
}

.quick-phrase-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.quick-phrase-grid article {
    padding: 22px;
    border: 1px solid var(--line);
    border-left: 5px solid #a83232;
    border-radius: 16px;
    background: #fff;
}

.quick-phrase-grid small {
    color: var(--muted);
}

.quick-phrase-grid h2 {
    margin: 7px 0;
    font-size: 1.75rem;
}

.quick-phrase-grid p {
    color: var(--muted);
}

.dashboard-stat-row {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

@media (max-width: 1100px) {
    .dashboard-stat-row {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .lesson-card,
    .lesson-complete {
        min-height: 430px;
        padding: 28px 18px;
    }

    .lesson-rating {
        grid-template-columns: 1fr;
    }

    .phrase-card {
        grid-template-columns: 1fr auto;
    }

    .phrase-category-mark {
        grid-column: 1 / -1;
        grid-template-columns: auto 1fr;
        justify-items: start;
        text-align: left;
    }

    .quick-phrase-grid {
        grid-template-columns: 1fr;
    }

    .quick-help-hero {
        align-items: flex-start;
        flex-direction: column;
    }

    .dashboard-stat-row {
        grid-template-columns: 1fr 1fr;
    }
}

.placement-test{display:grid;gap:16px}.placement-question{padding:24px;border:1px solid var(--line);border-radius:18px;background:#fff}.placement-question>small{color:var(--green-700);font-weight:900}.placement-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.placement-options label{position:relative}.placement-options input{position:absolute;opacity:0}.placement-options span{display:flex;align-items:center;min-height:64px;padding:14px;border:1px solid var(--line);border-radius:13px;cursor:pointer}.placement-options input:checked+span{color:#fff;background:var(--green-700)}.sticky-submit{position:sticky;bottom:14px;display:flex;justify-content:flex-end;padding:12px;border:1px solid var(--line);border-radius:15px;background:rgba(255,255,255,.94);box-shadow:var(--shadow)}.placement-result{display:grid;justify-items:center;width:min(760px,100%);margin:40px auto;padding:50px 30px;border-radius:24px;background:#fff;box-shadow:var(--shadow);text-align:center}.placement-result-icon{display:grid;place-items:center;width:90px;height:90px;border-radius:50%;color:#fff;background:var(--green-700);font-size:2.8rem}.placement-result>strong{color:var(--green-700);font-size:2rem}.learning-plan-timeline{display:grid;gap:12px}.learning-plan-timeline article{display:grid;grid-template-columns:80px 58px minmax(0,1fr) auto;align-items:center;gap:15px;padding:18px;border:1px solid var(--line);border-radius:17px;background:#fff}.learning-plan-timeline article.today{border-color:var(--green-700);box-shadow:inset 4px 0 0 var(--green-700)}.plan-date{text-align:center}.plan-date strong,.plan-date small{display:block}.plan-icon{display:grid;place-items:center;width:52px;height:52px;border-radius:14px;background:var(--green-100);font-size:1.5rem}.plan-copy h2{margin:4px 0}.audio-controls{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin:14px 0}@media(max-width:760px){.placement-options{grid-template-columns:1fr}.learning-plan-timeline article{grid-template-columns:62px minmax(0,1fr)}.plan-icon{display:none}.learning-plan-timeline article .button{grid-column:1/-1;width:100%}}


/* Voyara Core 1.5 – mobile application shell */
.mobile-menu-button,
.mobile-sidebar-close,
.mobile-bottom-nav {
    display: none;
}

.mobile-sidebar-overlay {
    display: none;
}

.install-banner {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 80;
    display: flex;
    align-items: center;
    gap: 14px;
    width: min(460px, calc(100% - 32px));
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 17px;
    background: #fff;
    box-shadow: var(--shadow);
}

.install-banner[hidden] {
    display: none;
}

.install-banner strong,
.install-banner small {
    display: block;
}

.install-banner small {
    margin-top: 3px;
    color: var(--muted);
}

.install-dismiss {
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 50%;
    background: #eef3f1;
    cursor: pointer;
}

.choice-answer {
    width: min(720px, 100%);
    margin: 20px auto;
}

.choice-answer > p {
    color: var(--muted);
    font-weight: 800;
}

.choice-options {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.choice-options button {
    min-height: 72px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: #fff;
    cursor: pointer;
    font-weight: 800;
}

.choice-options button:hover {
    border-color: var(--green-700);
}

.choice-options button.correct {
    color: #0b6848;
    border-color: #8bd2b0;
    background: #e0f5e9;
}

.choice-options button.incorrect {
    color: #9a2525;
    border-color: #e7aaaa;
    background: #fff0f0;
}

.choice-feedback {
    margin-top: 12px;
    font-weight: 900;
}

.choice-feedback.correct {
    color: #0b6848;
}

.choice-feedback.incorrect {
    color: #9a2525;
}

@media (max-width: 900px) {
    body.menu-open {
        overflow: hidden;
    }

    .app-sidebar {
        position: fixed;
        inset: 0 auto 0 0;
        z-index: 100;
        display: flex;
        width: min(310px, 88vw);
        min-height: 100dvh;
        transform: translateX(-105%);
        transition: transform .22s ease;
        box-shadow: 18px 0 50px rgba(0,0,0,.22);
    }

    .app-sidebar.open {
        transform: translateX(0);
    }

    .mobile-sidebar-close {
        position: absolute;
        top: 12px;
        right: 12px;
        display: grid;
        place-items: center;
        width: 38px;
        height: 38px;
        border: 0;
        border-radius: 50%;
        color: #fff;
        background: rgba(255,255,255,.13);
        cursor: pointer;
        font-size: 1.45rem;
    }

    .mobile-sidebar-overlay {
        position: fixed;
        inset: 0;
        z-index: 90;
        display: block;
        visibility: hidden;
        opacity: 0;
        background: rgba(2,25,21,.58);
        transition: opacity .2s ease, visibility .2s ease;
    }

    .mobile-sidebar-overlay.visible {
        visibility: visible;
        opacity: 1;
    }

    .mobile-menu-button {
        display: grid;
        place-items: center;
        width: 42px;
        height: 42px;
        border: 1px solid var(--line);
        border-radius: 12px;
        background: #fff;
        cursor: pointer;
        font-size: 1.25rem;
    }

    .topbar {
        gap: 8px;
    }

    .topbar .mobile-brand {
        margin-right: auto;
    }

    .mobile-bottom-nav {
        position: fixed;
        left: 10px;
        right: 10px;
        bottom: max(10px, env(safe-area-inset-bottom));
        z-index: 75;
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        padding: 7px;
        border: 1px solid rgba(220,230,226,.9);
        border-radius: 20px;
        background: rgba(255,255,255,.94);
        box-shadow: 0 14px 40px rgba(8,65,55,.2);
        backdrop-filter: blur(18px);
    }

    .mobile-bottom-nav a {
        display: grid;
        justify-items: center;
        gap: 2px;
        padding: 6px 3px;
        border-radius: 13px;
        color: var(--muted);
        text-decoration: none;
    }

    .mobile-bottom-nav a span {
        font-size: 1rem;
    }

    .mobile-bottom-nav a small {
        max-width: 100%;
        overflow: hidden;
        font-size: .57rem;
        font-weight: 800;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .mobile-bottom-nav a.quick {
        color: #fff;
        background: linear-gradient(135deg, #8b2626, #c44835);
    }

    .app-content .page {
        padding-bottom: 110px;
    }

    .install-banner {
        right: 12px;
        bottom: 92px;
        width: calc(100% - 24px);
    }
}

@media (max-width: 640px) {
    .topbar .language-switcher {
        max-width: 120px;
        overflow-x: auto;
    }

    .topbar .mobile-brand strong {
        display: none;
    }

    .choice-options {
        grid-template-columns: 1fr;
    }

    .choice-options button {
        min-height: 58px;
    }
}


/* Voyara Core 1.6 – account, subscription and privacy */
.settings-tabs {
    position: sticky;
    top: 76px;
    z-index: 20;
    display: flex;
    gap: 8px;
    margin-bottom: 16px;
    padding: 8px;
    overflow-x: auto;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: rgba(255,255,255,.93);
    backdrop-filter: blur(14px);
}

.settings-tabs a {
    flex: 0 0 auto;
    padding: 9px 12px;
    border-radius: 999px;
    color: var(--green-900);
    background: var(--green-100);
    font-size: .75rem;
    font-weight: 850;
    text-decoration: none;
}

.settings-card {
    margin-bottom: 18px;
    padding: 24px;
    scroll-margin-top: 145px;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: #fff;
    box-shadow: var(--shadow);
}

.settings-card-head {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 20px;
}

.settings-card-head h2 {
    margin: 4px 0;
    font-size: 1.8rem;
}

.settings-card-head p {
    margin: 0;
    color: var(--muted);
}

.plan-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.plan-card {
    position: relative;
    display: block;
    min-height: 310px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 17px;
    background: #fff;
    cursor: pointer;
}

.plan-card.current {
    border: 2px solid var(--green-700);
    background: linear-gradient(180deg, #f4fcf8, #fff);
}

.plan-card > input {
    position: absolute;
    top: 18px;
    right: 18px;
    width: 18px;
    height: 18px;
    accent-color: var(--green-700);
}

.plan-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding-right: 25px;
}

.plan-card-top > span {
    padding: 4px 7px;
    border-radius: 999px;
    color: #0b6848;
    background: #dcf4e8;
    font-size: .62rem;
    font-weight: 900;
}

.plan-price {
    margin-top: 22px;
    font-size: 2.1rem;
    font-weight: 900;
}

.plan-price small {
    color: var(--muted);
    font-size: .72rem;
    font-weight: 600;
}

.plan-card ul {
    margin: 18px 0 0;
    padding: 0;
    list-style: none;
}

.plan-card li {
    margin: 8px 0;
    color: var(--muted);
    font-size: .82rem;
}

.trial-label {
    color: #b87800;
    font-size: .75rem;
    font-weight: 850;
}

.toggle-row {
    display: flex;
    grid-template-columns: none;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin: 10px 0;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: #f7faf9;
}

.toggle-row span,
.toggle-row strong,
.toggle-row small {
    display: block;
}

.toggle-row small {
    margin-top: 3px;
    color: var(--muted);
}

.toggle-row input {
    width: 48px;
    min-width: 48px;
    height: 26px;
    margin: 0;
    accent-color: var(--green-700);
}

.settings-two-column {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

.settings-two-column form {
    display: grid;
    align-content: start;
    gap: 12px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: #f9fbfa;
}

.settings-two-column h3 {
    margin: 0 0 4px;
}

.legal-status-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin: 14px 0;
}

.legal-status-grid article {
    padding: 14px;
    border-radius: 13px;
    background: var(--green-100);
}

.legal-status-grid small,
.legal-status-grid strong {
    display: block;
}

.legal-status-grid small {
    color: var(--muted);
}

.legal-status-grid strong {
    margin-top: 4px;
}

.time-row {
    display: grid;
    grid-template-columns: minmax(0,1fr) 180px;
    align-items: center;
    gap: 14px;
    margin: 14px 0;
}

.danger-settings {
    border-color: #efc4c4;
    background: #fffafa;
}

.danger-settings .eyebrow,
.danger-settings h2 {
    color: #9b2d2d;
}

@media (max-width: 900px) {
    .plan-grid,
    .settings-two-column {
        grid-template-columns: 1fr;
    }

    .plan-card {
        min-height: 0;
    }
}

@media (max-width: 640px) {
    .settings-card {
        padding: 18px 14px;
    }

    .settings-tabs {
        top: 68px;
    }

    .legal-status-grid,
    .time-row {
        grid-template-columns: 1fr;
    }

    .toggle-row {
        align-items: flex-start;
    }
}


/* Voyara Core 1.7 – professional vocabulary and sentence test */
.quiz-setup-card {
    display: grid;
    gap: 26px;
    max-width: 1050px;
    padding: 28px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: #fff;
    box-shadow: var(--shadow);
}

.quiz-setup-card section > h2 {
    margin-top: 0;
}

.quiz-choice-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 10px;
}

.quiz-choice-grid label,
.quiz-scope-grid label {
    position: relative;
}

.quiz-choice-grid input,
.quiz-scope-grid input {
    position: absolute;
    opacity: 0;
}

.quiz-choice-grid span {
    display: grid;
    align-content: center;
    justify-items: center;
    min-height: 130px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: #fff;
    cursor: pointer;
    text-align: center;
}

.quiz-choice-grid b {
    margin-bottom: 10px;
    color: var(--green-700);
    font-size: 1.8rem;
}

.quiz-choice-grid input:checked + span,
.quiz-scope-grid input:checked + span {
    color: #fff;
    border-color: var(--green-700);
    background: linear-gradient(135deg, var(--green-900), var(--green-700));
}

.quiz-choice-grid input:checked + span b {
    color: #fff;
}

.quiz-scope-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 10px;
}

.quiz-scope-grid span {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 58px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: #fff;
    cursor: pointer;
    text-align: center;
    font-weight: 800;
}

.quiz-progress-head {
    width: min(920px, 100%);
    margin: 0 auto 14px;
    color: var(--green-700);
    font-weight: 900;
}

.quiz-progress-head > div {
    height: 8px;
    margin-top: 8px;
    overflow: hidden;
    border-radius: 999px;
    background: #dce9e4;
}

.quiz-progress-head i {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, var(--green-900), var(--green-700));
}

.quiz-question-card {
    width: min(920px, 100%);
    min-height: 580px;
    margin: 0 auto;
    padding: 34px;
    border: 1px solid var(--line);
    border-radius: 24px;
    background:
        radial-gradient(circle at 50% 100%, rgba(229,243,238,.9), transparent 48%),
        #fff;
    box-shadow: var(--shadow);
    text-align: center;
}

.quiz-type-badge {
    display: inline-flex;
    padding: 7px 11px;
    border-radius: 999px;
    color: var(--green-900);
    background: var(--green-100);
    font-size: .72rem;
    font-weight: 900;
}

.quiz-question-card > small {
    display: block;
    margin-top: 18px;
    color: var(--muted);
}

.quiz-question-card > h1 {
    margin: 24px auto 38px;
    max-width: 760px;
    font-size: clamp(2rem, 5vw, 4.4rem);
    line-height: 1.08;
    letter-spacing: -.04em;
}

.professional-answer-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    max-width: 780px;
    margin: 0 auto;
}

.professional-answer-grid label {
    position: relative;
}

.professional-answer-grid input {
    position: absolute;
    opacity: 0;
}

.professional-answer-grid span {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 78px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    cursor: pointer;
    font-weight: 800;
}

.professional-answer-grid input:checked + span {
    color: #fff;
    border-color: var(--green-700);
    background: var(--green-700);
}

.quiz-actions {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 28px;
}

.word-order-builder {
    max-width: 800px;
    margin: 0 auto;
}

.word-order-answer {
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    justify-content: center;
    gap: 8px;
    min-height: 110px;
    padding: 14px;
    border: 2px dashed #aac2ba;
    border-radius: 16px;
    background: #f7fbf9;
}

.word-order-answer button,
.word-order-tokens button {
    padding: 10px 13px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
    cursor: pointer;
    font-weight: 800;
}

.word-order-tokens {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin-top: 18px;
}

.word-order-tokens button.used {
    opacity: .35;
}

.quiz-feedback-card,
.quiz-result-card {
    display: grid;
    justify-items: center;
    width: min(760px, 100%);
    margin: 35px auto;
    padding: 44px 30px;
    border-radius: 24px;
    background: #fff;
    box-shadow: var(--shadow);
    text-align: center;
}

.quiz-feedback-card.correct {
    border: 2px solid #7dc8a6;
}

.quiz-feedback-card.incorrect {
    border: 2px solid #df9e9e;
}

.quiz-feedback-icon {
    display: grid;
    place-items: center;
    width: 86px;
    height: 86px;
    border-radius: 50%;
    color: #fff;
    background: var(--green-700);
    font-size: 2.8rem;
    font-weight: 900;
}

.quiz-feedback-card.incorrect .quiz-feedback-icon {
    background: #a73a3a;
}

.quiz-feedback-card h1 {
    margin: 16px 0;
    color: var(--green-700);
    font-size: clamp(2rem, 5vw, 3.8rem);
}

.quiz-expected-answer {
    min-width: min(560px, 100%);
    padding: 15px;
    border-radius: 14px;
    background: var(--gold-soft);
}

.quiz-expected-answer small,
.quiz-expected-answer strong {
    display: block;
}

.quiz-expected-answer strong {
    margin-top: 5px;
    font-size: 1.4rem;
}

.quiz-pronunciation,
.response-time {
    color: var(--muted);
}

.quiz-result-score {
    display: grid;
    place-items: center;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    color: #fff;
    background: linear-gradient(135deg, var(--green-900), var(--green-700));
}

.quiz-result-score strong,
.quiz-result-score span {
    display: block;
}

.quiz-result-score strong {
    font-size: 2.5rem;
}

.quiz-result-score span {
    font-size: .72rem;
}

.quiz-review {
    width: min(920px, 100%);
    margin: 25px auto;
}

.quiz-review article {
    display: grid;
    grid-template-columns: 1fr 1fr auto;
    gap: 14px;
    align-items: center;
    margin-bottom: 10px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
}

.quiz-review small {
    color: var(--muted);
}

.quiz-review strong {
    color: var(--green-700);
}

.quiz-review span {
    color: #9a3838;
}

@media (max-width: 1000px) {
    .quiz-choice-grid {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }

    .quiz-scope-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 680px) {
    .quiz-setup-card,
    .quiz-question-card {
        padding: 20px 14px;
    }

    .quiz-choice-grid,
    .quiz-scope-grid,
    .professional-answer-grid {
        grid-template-columns: 1fr;
    }

    .quiz-choice-grid span {
        min-height: 84px;
        grid-template-columns: auto 1fr;
        justify-items: start;
        gap: 10px;
        text-align: left;
    }

    .quiz-choice-grid b {
        margin: 0;
    }

    .quiz-question-card {
        min-height: 520px;
    }

    .quiz-actions {
        flex-direction: column-reverse;
    }

    .quiz-actions .button {
        width: 100%;
    }

    .quiz-review article {
        grid-template-columns: 1fr;
    }
}


/* Voyara Core 1.7.2 – free written translation */
.quiz-choice-grid span small {
    display: block;
    margin-top: 7px;
    color: var(--muted);
    font-size: .68rem;
    line-height: 1.35;
}

.quiz-choice-grid input:checked + span small {
    color: rgba(255,255,255,.78);
}

.free-translation-answer {
    width: min(780px, 100%);
    margin: 0 auto;
    text-align: left;
}

.free-translation-answer label > span {
    display: block;
    margin-bottom: 9px;
    color: var(--muted);
    font-size: .8rem;
    font-weight: 850;
}

.free-translation-answer textarea {
    min-height: 150px;
    padding: 20px;
    border: 2px solid #b9ccc5;
    border-radius: 16px;
    background: #fff;
    font-size: clamp(1.25rem, 3vw, 2rem);
    font-weight: 750;
    line-height: 1.45;
}

.free-translation-answer textarea:focus {
    border-color: var(--green-700);
    outline: 4px solid rgba(20,124,101,.12);
}

.free-translation-result {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 12px;
    width: min(640px, 100%);
    margin: 0 0 16px;
}

.free-translation-result article {
    padding: 14px;
    border-radius: 13px;
    background: #f4f8f6;
}

.free-translation-result small,
.free-translation-result strong {
    display: block;
}

.free-translation-result small {
    color: var(--muted);
}

.free-translation-result strong {
    margin-top: 5px;
}

.spelling-difference-list {
    width: min(650px, 100%);
    margin: 18px 0;
    padding: 18px;
    border: 1px solid #e5c98e;
    border-radius: 16px;
    background: var(--gold-soft);
    text-align: left;
}

.spelling-difference-list h2 {
    margin: 0 0 12px;
    font-size: 1.2rem;
}

.spelling-difference-list article {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 8px;
    padding: 11px;
    border-radius: 11px;
    background: rgba(255,255,255,.72);
}

.spelling-difference-list small,
.spelling-difference-list strong {
    display: block;
}

.spelling-difference-list small {
    color: var(--muted);
}

.spelling-difference-list p {
    margin-bottom: 0;
    color: #8a5d00;
    font-size: .78rem;
    font-weight: 800;
}

@media (max-width: 760px) {
    .quiz-choice-grid {
        grid-template-columns: 1fr;
    }

    .free-translation-result,
    .spelling-difference-list article {
        grid-template-columns: 1fr;
    }
}


/* Voyara Core 1.7.3 – reusable premium UI system */
body {
    background: var(--vx-page);
}

.vx-kicker {
    display: inline-block;
    color: var(--vx-brand-700);
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .16em;
}

.vx-page-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--vx-space-6);
    margin-bottom: var(--vx-space-6);
}

.vx-page-head h1 {
    margin: var(--vx-space-2) 0 var(--vx-space-2);
    color: var(--vx-ink-950);
    font-size: clamp(2.4rem, 5vw, 4.6rem);
    line-height: .98;
    letter-spacing: -.05em;
}

.vx-page-head p {
    max-width: 760px;
    margin: 0;
    color: var(--vx-ink-600);
    line-height: 1.55;
}

.vx-page-head-meta {
    display: grid;
    place-items: center;
    min-width: 112px;
    min-height: 112px;
    border: 1px solid var(--vx-line-200);
    border-radius: 50%;
    background: linear-gradient(145deg, var(--vx-surface), var(--vx-brand-050));
    box-shadow: var(--vx-shadow-sm);
}

.vx-page-head-meta span,
.vx-page-head-meta small {
    display: block;
}

.vx-page-head-meta span {
    color: var(--vx-brand-700);
    font-size: 2rem;
    font-weight: 900;
}

.vx-page-head-meta small {
    color: var(--vx-ink-600);
    font-size: .68rem;
    font-weight: 800;
}

.vx-panel {
    border: 1px solid rgba(219, 230, 226, .95);
    border-radius: var(--vx-radius-xl);
    background: rgba(255,255,255,.96);
    box-shadow: var(--vx-shadow-md);
}

.vx-quiz-config {
    width: min(1120px, 100%);
    overflow: hidden;
}

.vx-config-section {
    padding: var(--vx-space-7);
    border-bottom: 1px solid var(--vx-line-200);
}

.vx-config-section--compact {
    padding-bottom: var(--vx-space-6);
}

.vx-section-head {
    margin-bottom: var(--vx-space-5);
}

.vx-section-head > div {
    display: flex;
    align-items: center;
    gap: var(--vx-space-3);
}

.vx-step-badge {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    color: #fff;
    background: linear-gradient(135deg, var(--vx-brand-900), var(--vx-brand-700));
    box-shadow: 0 8px 20px rgba(19,117,97,.22);
    font-size: .8rem;
    font-weight: 900;
}

.vx-section-head h2 {
    margin: 0;
    color: var(--vx-ink-950);
    font-size: 1.45rem;
}

.vx-section-head p {
    margin: 3px 0 0;
    color: var(--vx-ink-600);
    font-size: .78rem;
}

.vx-option-grid {
    display: grid;
    gap: var(--vx-space-3);
}

.vx-option-grid--three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.vx-option-card {
    position: relative;
}

.vx-option-card input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.vx-option-card__body {
    position: relative;
    display: grid;
    align-content: center;
    justify-items: center;
    min-height: 162px;
    padding: var(--vx-space-5);
    overflow: hidden;
    border: 1px solid var(--vx-line-200);
    border-radius: var(--vx-radius-lg);
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,252,250,.98));
    box-shadow: var(--vx-shadow-sm);
    cursor: pointer;
    text-align: center;
    transition:
        transform var(--vx-ease),
        border-color var(--vx-ease),
        box-shadow var(--vx-ease),
        background var(--vx-ease);
}

.vx-option-card__body:hover {
    transform: translateY(-3px);
    border-color: rgba(19,117,97,.45);
    box-shadow: var(--vx-shadow-md);
}

.vx-option-card__icon {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    margin-bottom: var(--vx-space-3);
    border-radius: 14px;
    color: var(--vx-brand-700);
    background: var(--vx-brand-100);
    font-size: 1.45rem;
    font-weight: 900;
}

.vx-option-card strong {
    color: var(--vx-ink-950);
    line-height: 1.25;
}

.vx-option-card small {
    max-width: 230px;
    margin-top: var(--vx-space-2);
    color: var(--vx-ink-600);
    font-size: .7rem;
    line-height: 1.4;
}

.vx-option-card__check {
    position: absolute;
    top: 12px;
    right: 12px;
    display: grid;
    place-items: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    color: transparent;
    border: 1px solid var(--vx-line-200);
    background: #fff;
    font-size: .7rem;
}

.vx-option-card input:checked + .vx-option-card__body {
    transform: translateY(-2px);
    color: #fff;
    border-color: var(--vx-brand-700);
    background:
        radial-gradient(circle at 80% 0%, rgba(255,255,255,.18), transparent 34%),
        linear-gradient(135deg, var(--vx-brand-900), var(--vx-brand-700));
    box-shadow: 0 18px 40px rgba(13,92,78,.24);
}

.vx-option-card input:checked + .vx-option-card__body strong,
.vx-option-card input:checked + .vx-option-card__body small {
    color: #fff;
}

.vx-option-card input:checked + .vx-option-card__body small {
    color: rgba(255,255,255,.78);
}

.vx-option-card input:checked + .vx-option-card__body .vx-option-card__icon {
    color: var(--vx-brand-950);
    background: rgba(255,255,255,.88);
}

.vx-option-card input:checked + .vx-option-card__body .vx-option-card__check {
    color: var(--vx-brand-700);
    border-color: #fff;
}

.vx-segmented-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: var(--vx-space-3);
}

.vx-segmented-grid label,
.vx-count-selector label {
    position: relative;
}

.vx-segmented-grid input,
.vx-count-selector input {
    position: absolute;
    opacity: 0;
}

.vx-segmented-grid span {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 58px;
    padding: 12px 14px;
    border: 1px solid var(--vx-line-200);
    border-radius: var(--vx-radius-md);
    background: var(--vx-surface);
    cursor: pointer;
    font-size: .82rem;
    font-weight: 850;
    text-align: center;
    transition: all var(--vx-ease);
}

.vx-segmented-grid input:checked + span {
    color: #fff;
    border-color: var(--vx-brand-700);
    background: linear-gradient(135deg, var(--vx-brand-900), var(--vx-brand-700));
    box-shadow: 0 10px 24px rgba(19,117,97,.2);
}

.vx-count-selector {
    display: flex;
    flex-wrap: wrap;
    gap: var(--vx-space-3);
}

.vx-count-selector span {
    display: grid;
    place-items: center;
    width: 68px;
    height: 48px;
    border: 1px solid var(--vx-line-200);
    border-radius: var(--vx-radius-pill);
    background: #fff;
    cursor: pointer;
    font-weight: 900;
    transition: all var(--vx-ease);
}

.vx-count-selector input:checked + span {
    color: #fff;
    border-color: var(--vx-brand-700);
    background: var(--vx-brand-700);
    box-shadow: 0 8px 20px rgba(19,117,97,.22);
}

.vx-panel-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--vx-space-5);
    padding: var(--vx-space-6) var(--vx-space-7);
    background:
        linear-gradient(90deg, rgba(230,243,239,.7), rgba(255,255,255,.9));
}

.vx-panel-footer strong,
.vx-panel-footer small {
    display: block;
}

.vx-panel-footer strong {
    color: var(--vx-ink-950);
}

.vx-panel-footer small {
    margin-top: 3px;
    color: var(--vx-ink-600);
    font-size: .75rem;
}

.vx-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--vx-space-3);
    min-height: 46px;
    padding: 11px 18px;
    border: 0;
    border-radius: var(--vx-radius-md);
    cursor: pointer;
    font-weight: 900;
    transition: transform var(--vx-ease), box-shadow var(--vx-ease);
}

.vx-button:hover {
    transform: translateY(-2px);
}

.vx-button--primary {
    color: #fff;
    background: linear-gradient(135deg, var(--vx-brand-900), var(--vx-brand-700));
    box-shadow: 0 12px 28px rgba(13,92,78,.24);
}

.vx-button--large {
    min-width: 240px;
    min-height: 56px;
}

.vx-button b {
    font-size: 1.15rem;
}

@media (max-width: 980px) {
    .vx-option-grid--three {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }

    .vx-segmented-grid {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }

    .vx-page-head-meta {
        display: none;
    }
}

@media (max-width: 640px) {
    .vx-page-head h1 {
        font-size: 2.35rem;
    }

    .vx-config-section {
        padding: var(--vx-space-5) var(--vx-space-4);
    }

    .vx-option-grid--three,
    .vx-segmented-grid {
        grid-template-columns: 1fr;
    }

    .vx-option-card__body {
        min-height: 118px;
        grid-template-columns: auto minmax(0,1fr);
        justify-items: start;
        align-items: center;
        gap: 12px;
        text-align: left;
    }

    .vx-option-card__icon {
        margin-bottom: 0;
    }

    .vx-option-card small {
        grid-column: 2;
    }

    .vx-panel-footer {
        align-items: stretch;
        flex-direction: column;
        padding: var(--vx-space-5) var(--vx-space-4);
    }

    .vx-button--large {
        width: 100%;
        min-width: 0;
    }

    .vx-count-selector {
        justify-content: space-between;
    }

    .vx-count-selector label {
        flex: 1;
    }

    .vx-count-selector span {
        width: 100%;
    }
}


/* Voyara Core 1.7.4 – reliable hidden state */
[hidden] {
    display: none !important;
}

/* Voyara Core 1.7.4 – premium learning components */
.vx-page-head--learn {
    width: min(980px, 100%);
    margin-inline: auto;
}

.vx-route-card {
    display: grid;
    min-width: 170px;
    padding: var(--vx-space-4);
    border: 1px solid var(--vx-line-200);
    border-radius: var(--vx-radius-lg);
    background: var(--vx-surface);
    box-shadow: var(--vx-shadow-sm);
}

.vx-route-card small {
    color: var(--vx-ink-600);
    font-size: .68rem;
    font-weight: 800;
}

.vx-route-card strong {
    display: flex;
    align-items: center;
    gap: var(--vx-space-2);
    margin-top: 5px;
    color: var(--vx-brand-700);
    font-size: 1.2rem;
}

.vx-learning-shell {
    width: min(820px, 100%);
    margin: 0 auto;
}

.vx-learning-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--vx-space-4);
    margin-bottom: var(--vx-space-3);
}

.vx-learning-progress-copy strong,
.vx-learning-progress-copy small {
    display: block;
}

.vx-learning-progress-copy strong {
    color: var(--vx-brand-700);
}

.vx-learning-progress-copy small {
    margin-top: 3px;
    color: var(--vx-ink-600);
    font-size: .72rem;
}

.vx-progress-track {
    height: 9px;
    margin-bottom: var(--vx-space-4);
    overflow: hidden;
    border-radius: var(--vx-radius-pill);
    background: #dce9e4;
}

.vx-progress-track i {
    display: block;
    width: 0;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--vx-brand-900), var(--vx-brand-600));
    transition: width var(--vx-ease);
}

.vx-learning-card {
    min-height: 520px;
    padding: var(--vx-space-8);
    text-align: center;
    background:
        radial-gradient(circle at 50% 100%, rgba(230,243,239,.86), transparent 48%),
        var(--vx-surface);
}

.vx-learning-card__top {
    display: flex;
    justify-content: center;
}

.vx-learning-badge {
    display: inline-flex;
    padding: 8px 12px;
    border-radius: var(--vx-radius-pill);
    color: var(--vx-brand-900);
    background: var(--vx-brand-100);
    font-size: .75rem;
    font-weight: 850;
}

.vx-learning-card > h2 {
    max-width: 720px;
    margin: var(--vx-space-8) auto var(--vx-space-6);
    color: var(--vx-ink-950);
    font-size: clamp(2.5rem, 6vw, 4.6rem);
    line-height: 1.05;
    letter-spacing: -.045em;
}

.vx-learning-answer {
    margin-top: var(--vx-space-6);
    padding-top: var(--vx-space-6);
    border-top: 1px solid var(--vx-line-200);
}

.vx-learning-answer > small,
.vx-learning-answer > strong {
    display: block;
}

.vx-learning-answer > small {
    color: var(--vx-ink-600);
}

.vx-learning-answer > strong {
    margin-top: var(--vx-space-2);
    color: var(--vx-brand-700);
    font-size: clamp(2rem, 5vw, 3.5rem);
}

.vx-button--ghost {
    color: var(--vx-brand-800);
    border: 1px solid var(--vx-line-200);
    background: #fff;
}

.vx-button--success {
    color: var(--vx-success);
    background: var(--vx-success-soft);
}

.vx-button--warning {
    color: #8a5d00;
    background: var(--vx-gold-100);
}

.vx-lesson-complete {
    display: grid;
    justify-items: center;
    min-height: 520px;
    padding: var(--vx-space-8);
    align-content: center;
    text-align: center;
}

.vx-lesson-complete__icon {
    display: grid;
    place-items: center;
    width: 96px;
    height: 96px;
    margin-bottom: var(--vx-space-5);
    border-radius: 50%;
    color: #fff;
    background: linear-gradient(135deg, var(--vx-brand-900), var(--vx-brand-600));
    box-shadow: 0 18px 40px rgba(13,92,78,.24);
    font-size: 3rem;
}

.vx-lesson-complete h2 {
    margin: var(--vx-space-3) 0 var(--vx-space-2);
    font-size: 2.2rem;
}

.vx-lesson-complete p {
    max-width: 520px;
    margin: 0 0 var(--vx-space-6);
    color: var(--vx-ink-600);
}

.vx-empty-state {
    display: grid;
    justify-items: center;
    width: min(720px, 100%);
    margin: 40px auto;
    padding: var(--vx-space-8);
    text-align: center;
}

.vx-empty-state__icon {
    display: grid;
    place-items: center;
    width: 84px;
    height: 84px;
    border-radius: 50%;
    color: var(--vx-brand-700);
    background: var(--vx-brand-100);
    font-size: 2.4rem;
}

@media (max-width: 760px) {
    .vx-page-head--learn,
    .vx-learning-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .vx-route-card {
        min-width: 0;
    }

    .vx-learning-card,
    .vx-lesson-complete {
        min-height: 470px;
        padding: var(--vx-space-6) var(--vx-space-4);
    }

    .vx-learning-card > h2 {
        margin-top: var(--vx-space-6);
    }

    .lesson-mode-switch {
        width: 100%;
    }

    .lesson-mode-switch button {
        flex: 1;
    }

    .lesson-rating {
        grid-template-columns: 1fr;
    }
}


/* Voyara Core 1.7.4.1 – reusable learning mode selector */
.lesson-mode-switch {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px;
    border: 1px solid var(--vx-line-200);
    border-radius: var(--vx-radius-pill);
    background: rgba(255,255,255,.92);
    box-shadow: var(--vx-shadow-sm);
}

.lesson-mode-switch button {
    position: relative;
    min-height: 38px;
    padding: 8px 15px;
    border: 0;
    border-radius: var(--vx-radius-pill);
    color: var(--vx-ink-600);
    background: transparent;
    cursor: pointer;
    font: inherit;
    font-size: .76rem;
    font-weight: 850;
    white-space: nowrap;
    transition:
        color var(--vx-ease),
        background var(--vx-ease),
        box-shadow var(--vx-ease),
        transform var(--vx-ease);
}

.lesson-mode-switch button:hover {
    color: var(--vx-brand-800);
    background: var(--vx-brand-050);
}

.lesson-mode-switch button.active {
    color: #fff;
    background: linear-gradient(
        135deg,
        var(--vx-brand-900),
        var(--vx-brand-700)
    );
    box-shadow: 0 8px 20px rgba(13,92,78,.22);
}

.lesson-mode-switch button:focus-visible {
    outline: 3px solid rgba(27,138,114,.22);
    outline-offset: 2px;
}

@media (max-width: 760px) {
    .lesson-mode-switch {
        display: grid;
        grid-template-columns: repeat(3, minmax(0,1fr));
        width: 100%;
        border-radius: var(--vx-radius-lg);
    }

    .lesson-mode-switch button {
        width: 100%;
        padding-inline: 8px;
        white-space: normal;
    }
}


/* Voyara Core 1.7.5 – premium quiz builder */
.vx-builder-head {
    width: min(1180px, 100%);
    margin: 0 auto var(--vx-space-6);
}

.vx-builder-head h1 {
    max-width: 980px;
    margin: var(--vx-space-2) 0;
    color: var(--vx-ink-950);
    font-size: clamp(2.6rem, 5vw, 4.8rem);
    line-height: 1;
    letter-spacing: -.055em;
}

.vx-builder-head p {
    max-width: 760px;
    margin: 0;
    color: var(--vx-ink-600);
    line-height: 1.55;
}

.vx-feature-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: var(--vx-space-4);
}

.vx-feature-pills span {
    padding: 7px 11px;
    border: 1px solid var(--vx-line-200);
    border-radius: var(--vx-radius-pill);
    color: var(--vx-brand-800);
    background: rgba(255,255,255,.75);
    font-size: .7rem;
    font-weight: 850;
}

.vx-quiz-builder {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: var(--vx-space-5);
    width: min(1180px, 100%);
    margin: 0 auto;
    align-items: start;
}

.vx-quiz-builder__main {
    display: grid;
    gap: var(--vx-space-4);
}

.vx-builder-step {
    padding: var(--vx-space-6);
    border: 1px solid var(--vx-line-200);
    border-radius: var(--vx-radius-xl);
    background: rgba(255,255,255,.96);
    box-shadow: var(--vx-shadow-sm);
}

.vx-builder-step > header {
    display: flex;
    align-items: center;
    gap: var(--vx-space-3);
    margin-bottom: var(--vx-space-5);
}

.vx-builder-step h2 {
    margin: 0;
    color: var(--vx-ink-950);
    font-size: 1.35rem;
}

.vx-builder-step header p {
    margin: 3px 0 0;
    color: var(--vx-ink-600);
    font-size: .77rem;
}

.vx-mode-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: var(--vx-space-3);
}

.vx-mode-card {
    position: relative;
}

.vx-mode-card input {
    position: absolute;
    opacity: 0;
}

.vx-mode-card__body {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0,1fr);
    align-items: center;
    gap: var(--vx-space-3);
    min-height: 112px;
    padding: var(--vx-space-4);
    border: 1px solid var(--vx-line-200);
    border-radius: var(--vx-radius-lg);
    background: linear-gradient(180deg, #fff, #f9fcfb);
    cursor: pointer;
    transition: all var(--vx-ease);
}

.vx-mode-card__body:hover {
    transform: translateY(-2px);
    border-color: rgba(19,117,97,.45);
    box-shadow: var(--vx-shadow-sm);
}

.vx-mode-card__icon {
    display: grid;
    place-items: center;
    width: 50px;
    height: 50px;
    border-radius: 15px;
    color: var(--vx-brand-700);
    background: var(--vx-brand-100);
    font-size: 1.35rem;
    font-weight: 900;
}

.vx-mode-card__copy strong,
.vx-mode-card__copy small {
    display: block;
}

.vx-mode-card__copy strong {
    color: var(--vx-ink-950);
}

.vx-mode-card__copy small {
    margin-top: 4px;
    color: var(--vx-ink-600);
    font-size: .68rem;
    line-height: 1.35;
}

.vx-mode-card__check {
    position: absolute;
    top: 10px;
    right: 10px;
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    border: 1px solid var(--vx-line-200);
    border-radius: 50%;
    color: transparent;
    background: #fff;
}

.vx-mode-card input:checked + .vx-mode-card__body {
    color: #fff;
    border-color: var(--vx-brand-700);
    background:
        radial-gradient(circle at 90% 0%, rgba(255,255,255,.18), transparent 36%),
        linear-gradient(135deg, var(--vx-brand-900), var(--vx-brand-700));
    box-shadow: 0 16px 36px rgba(13,92,78,.22);
}

.vx-mode-card input:checked + .vx-mode-card__body strong {
    color: #fff;
}

.vx-mode-card input:checked + .vx-mode-card__body small {
    color: rgba(255,255,255,.78);
}

.vx-mode-card input:checked + .vx-mode-card__body .vx-mode-card__icon {
    color: var(--vx-brand-900);
    background: rgba(255,255,255,.9);
}

.vx-mode-card input:checked + .vx-mode-card__body .vx-mode-card__check {
    color: var(--vx-brand-700);
    border-color: #fff;
}

.vx-scope-list {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: var(--vx-space-3);
}

.vx-scope-list label {
    position: relative;
}

.vx-scope-list input {
    position: absolute;
    opacity: 0;
}

.vx-scope-list span {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 58px;
    padding: 12px;
    border: 1px solid var(--vx-line-200);
    border-radius: var(--vx-radius-md);
    background: #fff;
    cursor: pointer;
    text-align: center;
}

.vx-scope-list b {
    font-size: .78rem;
}

.vx-scope-list i {
    position: absolute;
    top: 7px;
    right: 7px;
    display: grid;
    place-items: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    color: transparent;
    background: transparent;
    font-style: normal;
    font-size: .65rem;
}

.vx-scope-list input:checked + span {
    color: #fff;
    border-color: var(--vx-brand-700);
    background: linear-gradient(135deg, var(--vx-brand-900), var(--vx-brand-700));
    box-shadow: 0 10px 24px rgba(13,92,78,.18);
}

.vx-scope-list input:checked + span i {
    color: var(--vx-brand-700);
    background: #fff;
}

.vx-duration-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0,1fr));
    gap: var(--vx-space-3);
}

.vx-duration-grid label {
    position: relative;
}

.vx-duration-grid input {
    position: absolute;
    opacity: 0;
}

.vx-duration-grid span {
    position: relative;
    display: grid;
    place-items: center;
    min-height: 88px;
    padding: 12px;
    border: 1px solid var(--vx-line-200);
    border-radius: var(--vx-radius-lg);
    background: #fff;
    cursor: pointer;
}

.vx-duration-grid strong {
    color: var(--vx-ink-950);
    font-size: 1.35rem;
}

.vx-duration-grid small {
    color: var(--vx-ink-600);
    font-size: .67rem;
}

.vx-duration-grid em {
    position: absolute;
    top: 7px;
    right: 7px;
    padding: 3px 6px;
    border-radius: var(--vx-radius-pill);
    color: #8a5d00;
    background: var(--vx-gold-100);
    font-size: .55rem;
    font-style: normal;
    font-weight: 900;
}

.vx-duration-grid input:checked + span {
    border-color: var(--vx-brand-700);
    background: var(--vx-brand-100);
    box-shadow: inset 0 0 0 2px var(--vx-brand-700);
}

.vx-duration-grid input:checked + span strong {
    color: var(--vx-brand-800);
}

.vx-quiz-summary {
    position: sticky;
    top: 92px;
    padding: var(--vx-space-6);
    border: 1px solid var(--vx-line-200);
    border-radius: var(--vx-radius-xl);
    background:
        radial-gradient(circle at 100% 0%, rgba(200,154,61,.14), transparent 28%),
        linear-gradient(160deg, #fff, #f5faf8);
    box-shadow: var(--vx-shadow-md);
}

.vx-quiz-summary__head {
    margin-bottom: var(--vx-space-5);
}

.vx-quiz-summary h2 {
    margin: 5px 0 0;
    font-size: 1.6rem;
}

.vx-quiz-summary dl {
    display: grid;
    gap: 0;
    margin: 0 0 var(--vx-space-6);
}

.vx-quiz-summary dl > div {
    display: grid;
    gap: 4px;
    padding: 14px 0;
    border-bottom: 1px solid var(--vx-line-200);
}

.vx-quiz-summary dt {
    color: var(--vx-ink-600);
    font-size: .68rem;
    font-weight: 800;
}

.vx-quiz-summary dd {
    margin: 0;
    color: var(--vx-ink-950);
    font-weight: 900;
}

.vx-button--full {
    width: 100%;
}

@media (max-width: 1080px) {
    .vx-quiz-builder {
        grid-template-columns: 1fr;
    }

    .vx-quiz-summary {
        position: static;
    }

    .vx-quiz-summary dl {
        grid-template-columns: repeat(5, minmax(0,1fr));
        gap: 10px;
    }

    .vx-quiz-summary dl > div {
        border: 0;
        padding: 10px;
        border-radius: var(--vx-radius-md);
        background: rgba(255,255,255,.75);
    }
}

@media (max-width: 760px) {
    .vx-builder-head h1 {
        font-size: 2.45rem;
    }

    .vx-builder-step {
        padding: var(--vx-space-5) var(--vx-space-4);
    }

    .vx-mode-grid,
    .vx-scope-list,
    .vx-duration-grid {
        grid-template-columns: 1fr;
    }

    .vx-quiz-summary dl {
        grid-template-columns: 1fr 1fr;
    }

    .vx-mode-card__body {
        min-height: 96px;
    }
}


/* Voyara Core 1.8 – spelling and history */
.vx-spelling-stats {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: var(--vx-space-4);
    width: min(720px,100%);
    margin-bottom: var(--vx-space-5);
}

.vx-spelling-stats article {
    padding: var(--vx-space-5);
    border: 1px solid var(--vx-line-200);
    border-radius: var(--vx-radius-lg);
    background: #fff;
    box-shadow: var(--vx-shadow-sm);
}

.vx-spelling-stats small,
.vx-spelling-stats strong {
    display:block;
}

.vx-spelling-stats small {
    color:var(--vx-ink-600);
}

.vx-spelling-stats strong {
    margin-top:6px;
    color:var(--vx-brand-700);
    font-size:2.2rem;
}

.vx-spelling-list {
    display:grid;
    gap:12px;
    width:min(900px,100%);
    margin-top:var(--vx-space-6);
}

.vx-spelling-list article {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    padding:18px;
    border:1px solid var(--vx-line-200);
    border-radius:var(--vx-radius-lg);
    background:#fff;
}

.vx-spelling-list small,
.vx-spelling-list strong,
.vx-spelling-list span {
    display:block;
}

.vx-spelling-list small {
    color:var(--vx-danger);
    text-decoration:line-through;
}

.vx-spelling-list strong {
    margin-top:3px;
    color:var(--vx-brand-700);
    font-size:1.3rem;
}

.vx-spelling-list span {
    margin-top:4px;
    color:var(--vx-ink-600);
    font-size:.72rem;
}

.vx-spelling-question {
    display:grid;
    justify-items:center;
    width:min(760px,100%);
    min-height:460px;
    margin:0 auto;
    padding:var(--vx-space-8);
    align-content:center;
    text-align:center;
}

.vx-spelling-question h1 {
    margin:20px 0 30px;
    color:var(--vx-danger);
    font-size:clamp(2.5rem,6vw,4.5rem);
    text-decoration:line-through;
}

.vx-spelling-question form {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:10px;
    width:min(620px,100%);
}

.vx-spelling-question input {
    min-height:56px;
    font-size:1.25rem;
    font-weight:800;
}

.vx-history-table {
    width:min(1100px,100%);
    overflow:hidden;
    border:1px solid var(--vx-line-200);
    border-radius:var(--vx-radius-xl);
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-history-table header,
.vx-history-table article {
    display:grid;
    grid-template-columns:1.4fr 1.4fr 1.4fr .8fr .8fr;
    gap:12px;
    align-items:center;
    padding:16px 18px;
}

.vx-history-table header {
    color:var(--vx-ink-600);
    background:var(--vx-brand-050);
    font-size:.72rem;
    font-weight:900;
}

.vx-history-table article {
    border-top:1px solid var(--vx-line-200);
}

.vx-history-table article strong {
    color:var(--vx-brand-700);
}

@media (max-width:760px) {
    .vx-spelling-stats {
        grid-template-columns:1fr 1fr;
    }

    .vx-spelling-list article {
        align-items:stretch;
        flex-direction:column;
    }

    .vx-spelling-question form {
        grid-template-columns:1fr;
    }

    .vx-history-table header {
        display:none;
    }

    .vx-history-table article {
        grid-template-columns:1fr 1fr;
    }
}


/* Voyara Core 1.9 – learning analytics */
.vx-progress-overview {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: var(--vx-space-4);
    width: min(1180px,100%);
    margin: 0 auto var(--vx-space-5);
}

.vx-progress-overview > article {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 18px;
    border: 1px solid var(--vx-line-200);
    border-radius: var(--vx-radius-lg);
    background: #fff;
    box-shadow: var(--vx-shadow-sm);
}

.vx-progress-overview > article > span {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border-radius: 14px;
    color: var(--vx-brand-700);
    background: var(--vx-brand-100);
    font-weight: 900;
}

.vx-progress-overview small,
.vx-progress-overview strong {
    display: block;
}

.vx-progress-overview small {
    color: var(--vx-ink-600);
    font-size: .7rem;
}

.vx-progress-overview strong {
    margin-top: 4px;
    color: var(--vx-ink-950);
    font-size: 1.7rem;
}

.vx-progress-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--vx-space-5);
    width: min(1180px,100%);
    margin: 0 auto var(--vx-space-5);
}

.vx-goal-card,
.vx-activity-card,
.vx-recommendation-card,
.vx-weak-card,
.vx-recent-tests,
.vx-goal-settings {
    padding: var(--vx-space-6);
}

.vx-goal-card > header,
.vx-activity-card > header,
.vx-recent-tests > header,
.vx-goal-settings > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: var(--vx-space-5);
}

.vx-goal-card h2,
.vx-activity-card h2,
.vx-recent-tests h2,
.vx-goal-settings h2 {
    margin: 4px 0 0;
}

.vx-goal-ring {
    display: grid;
    place-items: center;
    width: 220px;
    height: 220px;
    margin: 10px auto 0;
    border-radius: 50%;
    background:
        radial-gradient(circle closest-side, #fff 76%, transparent 77% 100%),
        conic-gradient(
            var(--vx-brand-700) var(--goal),
            var(--vx-brand-100) 0
        );
}

.vx-goal-ring > div {
    display: grid;
    justify-items: center;
    max-width: 150px;
    text-align: center;
}

.vx-goal-ring strong {
    color: var(--vx-brand-700);
    font-size: 2.3rem;
}

.vx-goal-ring small {
    margin-top: 7px;
    color: var(--vx-ink-600);
    line-height: 1.35;
}

.vx-week-goal-bar {
    height: 14px;
    overflow: hidden;
    border-radius: var(--vx-radius-pill);
    background: var(--vx-brand-100);
}

.vx-week-goal-bar i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,var(--vx-brand-900),var(--vx-brand-600));
}

.vx-streak-line {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: var(--vx-space-6);
    padding: 16px;
    border-radius: var(--vx-radius-lg);
    background: var(--vx-gold-100);
}

.vx-streak-line > span {
    font-size: 2rem;
}

.vx-streak-line small,
.vx-streak-line strong {
    display: block;
}

.vx-streak-line small {
    color: #8a5d00;
}

.vx-activity-card {
    width: min(1180px,100%);
    margin: 0 auto var(--vx-space-5);
}

.vx-activity-chart {
    display: grid;
    grid-template-columns: repeat(7,1fr);
    gap: 12px;
    min-height: 260px;
    align-items: end;
}

.vx-activity-chart article {
    display: grid;
    justify-items: center;
    gap: 6px;
}

.vx-activity-bar {
    display: flex;
    align-items: end;
    width: min(44px,100%);
    height: 180px;
    overflow: hidden;
    border-radius: var(--vx-radius-pill);
    background: var(--vx-brand-100);
}

.vx-activity-bar i {
    display: block;
    width: 100%;
    min-height: 4px;
    border-radius: inherit;
    background: linear-gradient(180deg,var(--vx-brand-600),var(--vx-brand-900));
}

.vx-activity-chart small {
    color: var(--vx-ink-600);
}

.vx-activity-chart strong {
    font-size: .75rem;
}

.vx-recommendation-card {
    display: grid;
    grid-template-columns: auto minmax(0,1fr);
    gap: 18px;
    align-items: center;
    background:
        radial-gradient(circle at 100% 0%, rgba(200,154,61,.16), transparent 28%),
        #fff;
}

.vx-recommendation-card .vx-button {
    grid-column: 1 / -1;
}

.vx-recommendation-icon {
    display: grid;
    place-items: center;
    width: 62px;
    height: 62px;
    border-radius: 18px;
    color: #fff;
    background: linear-gradient(135deg,var(--vx-brand-900),var(--vx-brand-700));
    font-size: 1.6rem;
}

.vx-recommendation-card h2 {
    margin: 4px 0;
}

.vx-recommendation-card p {
    margin: 0;
    color: var(--vx-ink-600);
}

.vx-weak-card > div {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 10px;
    margin-top: 18px;
}

.vx-weak-card article {
    padding: 14px;
    border-radius: var(--vx-radius-md);
    background: var(--vx-brand-050);
}

.vx-weak-card small,
.vx-weak-card strong {
    display: block;
}

.vx-weak-card small {
    color: var(--vx-ink-600);
}

.vx-weak-card strong {
    margin-top: 5px;
    color: var(--vx-brand-700);
    font-size: 1.7rem;
}

.vx-recent-tests,
.vx-goal-settings {
    width: min(1180px,100%);
    margin: 0 auto var(--vx-space-5);
}

.vx-recent-tests > div {
    display: grid;
    gap: 8px;
}

.vx-recent-tests article {
    display: grid;
    grid-template-columns: 120px minmax(0,1fr) auto;
    gap: 14px;
    padding: 13px;
    border-radius: var(--vx-radius-md);
    background: var(--vx-brand-050);
}

.vx-recent-tests article span {
    color: var(--vx-ink-600);
}

.vx-recent-tests article b {
    color: var(--vx-brand-700);
}

.vx-goal-settings form {
    display: grid;
    grid-template-columns: 1fr 1fr auto;
    gap: 14px;
    align-items: end;
}

@media (max-width: 900px) {
    .vx-progress-overview {
        grid-template-columns: repeat(2,1fr);
    }

    .vx-progress-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .vx-progress-overview {
        grid-template-columns: 1fr 1fr;
    }

    .vx-goal-card,
    .vx-activity-card,
    .vx-recommendation-card,
    .vx-weak-card,
    .vx-recent-tests,
    .vx-goal-settings {
        padding: var(--vx-space-5) var(--vx-space-4);
    }

    .vx-activity-chart {
        gap: 6px;
    }

    .vx-activity-bar {
        width: 28px;
        height: 140px;
    }

    .vx-recent-tests article {
        grid-template-columns: 1fr auto;
    }

    .vx-recent-tests article span {
        grid-column: 1 / -1;
    }

    .vx-goal-settings form {
        grid-template-columns: 1fr;
    }
}


/* Voyara Core 2.0 – intelligent dashboard */
.vx-dashboard-hero {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:var(--vx-space-6);
    width:min(1180px,100%);
    margin:0 auto var(--vx-space-5);
    padding:var(--vx-space-7);
    overflow:hidden;
    border-radius:var(--vx-radius-xl);
    color:#fff;
    background:
        radial-gradient(circle at 92% 10%,rgba(255,255,255,.14),transparent 25%),
        linear-gradient(135deg,var(--vx-brand-950),var(--vx-brand-700));
    box-shadow:var(--vx-shadow-lg);
}

.vx-dashboard-hero .vx-kicker,
.vx-dashboard-hero p {
    color:rgba(255,255,255,.78);
}

.vx-dashboard-hero h1 {
    margin:7px 0 8px;
    font-size:clamp(2.3rem,5vw,4.4rem);
    line-height:1;
    letter-spacing:-.05em;
}

.vx-dashboard-profile {
    display:grid;
    justify-items:center;
    gap:7px;
    color:#fff;
    text-decoration:none;
}

.vx-dashboard-profile img,
.vx-dashboard-profile > span {
    display:grid;
    place-items:center;
    width:84px;
    height:84px;
    border:3px solid rgba(255,255,255,.7);
    border-radius:50%;
    object-fit:cover;
    color:var(--vx-brand-900);
    background:#fff;
    font-size:2rem;
    font-weight:900;
}

.vx-dashboard-profile small {
    color:rgba(255,255,255,.82);
}

.vx-dashboard-kpis {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:var(--vx-space-4);
    width:min(1180px,100%);
    margin:0 auto var(--vx-space-5);
}

.vx-dashboard-kpis article {
    display:flex;
    align-items:center;
    gap:13px;
    padding:17px;
    border:1px solid var(--vx-line-200);
    border-radius:var(--vx-radius-lg);
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-dashboard-kpis article > span,
.vx-dashboard-card-icon {
    display:grid;
    place-items:center;
    width:46px;
    height:46px;
    border-radius:14px;
    color:var(--vx-brand-700);
    background:var(--vx-brand-100);
    font-weight:900;
}

.vx-dashboard-kpis small,
.vx-dashboard-kpis strong {
    display:block;
}

.vx-dashboard-kpis small {
    color:var(--vx-ink-600);
    font-size:.68rem;
}

.vx-dashboard-kpis strong {
    margin-top:4px;
    color:var(--vx-ink-950);
}

.vx-dashboard-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:var(--vx-space-5);
    width:min(1180px,100%);
    margin:0 auto var(--vx-space-5);
}

.vx-dashboard-goal,
.vx-dashboard-recommendation,
.vx-dashboard-trip,
.vx-dashboard-quick {
    padding:var(--vx-space-6);
}

.vx-dashboard-goal > header {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
}

.vx-dashboard-goal h2,
.vx-dashboard-recommendation h2,
.vx-dashboard-trip h2,
.vx-dashboard-quick h2 {
    margin:5px 0;
}

.vx-dashboard-goal-bar {
    height:14px;
    margin:var(--vx-space-6) 0;
    overflow:hidden;
    border-radius:var(--vx-radius-pill);
    background:var(--vx-brand-100);
}

.vx-dashboard-goal-bar i {
    display:block;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,var(--vx-brand-900),var(--vx-brand-600));
}

.vx-dashboard-goal-actions {
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}

.vx-dashboard-recommendation {
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    gap:17px;
    align-items:center;
    background:
        radial-gradient(circle at 100% 0%,rgba(200,154,61,.17),transparent 30%),
        #fff;
}

.vx-dashboard-recommendation .vx-button {
    grid-column:1 / -1;
}

.vx-dashboard-recommendation p,
.vx-dashboard-trip p {
    margin:0;
    color:var(--vx-ink-600);
}

.vx-dashboard-trip {
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    gap:16px;
    align-items:start;
}

.vx-dashboard-card-icon {
    width:58px;
    height:58px;
    font-size:1.55rem;
}

.vx-dashboard-quick-links {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin-top:var(--vx-space-4);
}

.vx-dashboard-quick-links a {
    display:flex;
    align-items:center;
    gap:10px;
    min-height:58px;
    padding:12px;
    border:1px solid var(--vx-line-200);
    border-radius:var(--vx-radius-md);
    color:var(--vx-ink-950);
    background:var(--vx-brand-050);
    text-decoration:none;
    font-weight:850;
}

.vx-dashboard-quick-links a:hover {
    border-color:var(--vx-brand-700);
}

.vx-dashboard-quick-links span {
    color:var(--vx-brand-700);
}

@media (max-width:900px) {
    .vx-dashboard-kpis {
        grid-template-columns:repeat(2,1fr);
    }

    .vx-dashboard-grid {
        grid-template-columns:1fr;
    }
}

@media (max-width:640px) {
    .vx-dashboard-hero {
        align-items:flex-start;
        padding:var(--vx-space-6) var(--vx-space-4);
    }

    .vx-dashboard-profile img,
    .vx-dashboard-profile > span {
        width:58px;
        height:58px;
    }

    .vx-dashboard-profile small {
        display:none;
    }

    .vx-dashboard-kpis {
        grid-template-columns:1fr 1fr;
        gap:10px;
    }

    .vx-dashboard-kpis article {
        align-items:flex-start;
        flex-direction:column;
    }

    .vx-dashboard-goal,
    .vx-dashboard-recommendation,
    .vx-dashboard-trip,
    .vx-dashboard-quick {
        padding:var(--vx-space-5) var(--vx-space-4);
    }
}


/* Voyara Core 2.1 – listening and pronunciation */
.vx-training-launch{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:var(--vx-space-5);width:min(900px,100%);padding:var(--vx-space-7)}
.vx-training-launch__icon{display:grid;place-items:center;width:78px;height:78px;border-radius:22px;color:#fff;background:linear-gradient(135deg,var(--vx-brand-900),var(--vx-brand-600));box-shadow:0 16px 34px rgba(13,92,78,.24);font-size:2rem}
.vx-training-launch h2{margin:0 0 5px}.vx-training-launch p{margin:0;color:var(--vx-ink-600)}
.vx-listening-card{display:grid;justify-items:center;width:min(850px,100%);min-height:600px;margin:0 auto;padding:var(--vx-space-8);align-content:center;text-align:center;background:radial-gradient(circle at 50% 100%,rgba(230,243,239,.85),transparent 48%),#fff}
.vx-listening-card>h1{margin:20px 0 8px;color:var(--vx-brand-700);font-size:4rem;letter-spacing:.12em}.vx-listening-card>p{color:var(--vx-ink-600)}.vx-listening-card form{display:grid;gap:18px;width:100%;margin-top:26px}
.vx-pronunciation-card{width:min(900px,100%);margin:0 auto;padding:var(--vx-space-8);text-align:center;background:radial-gradient(circle at 50% 100%,rgba(230,243,239,.8),transparent 48%),#fff}
.vx-pronunciation-progress{margin-bottom:var(--vx-space-6);color:var(--vx-brand-700);font-weight:900}.vx-pronunciation-progress>div{height:9px;margin-top:8px;overflow:hidden;border-radius:var(--vx-radius-pill);background:var(--vx-brand-100)}.vx-pronunciation-progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--vx-brand-900),var(--vx-brand-600))}
.vx-pronunciation-card>small{color:var(--vx-ink-600)}.vx-pronunciation-card>h2{margin:18px auto 10px;max-width:760px;color:var(--vx-ink-950);font-size:clamp(2.2rem,5vw,4rem);line-height:1.08}.vx-pronunciation-card>p{color:var(--vx-brand-700);font-weight:800}
.vx-pronunciation-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin:28px 0}.vx-pronunciation-status{min-height:28px;color:var(--vx-brand-700);font-weight:900}
.vx-pronunciation-result{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px;padding-top:22px;border-top:1px solid var(--vx-line-200)}.vx-pronunciation-result article{padding:15px;border-radius:var(--vx-radius-md);background:var(--vx-brand-050);text-align:left}.vx-pronunciation-result small,.vx-pronunciation-result strong{display:block}.vx-pronunciation-result small{color:var(--vx-ink-600)}.vx-pronunciation-result strong{margin-top:5px}.vx-pronunciation-score{grid-column:1/-1;display:grid;justify-items:center;padding:18px;border-radius:var(--vx-radius-lg);background:var(--vx-gold-100)}.vx-pronunciation-score strong{margin-top:4px;color:var(--vx-brand-700);font-size:2.4rem}.vx-pronunciation-result>button{grid-column:1/-1;justify-self:center}.vx-pronunciation-complete{display:grid;justify-items:center;min-height:420px;align-content:center}
@media(max-width:760px){.vx-training-launch{grid-template-columns:1fr;justify-items:start;padding:var(--vx-space-5)}.vx-listening-card,.vx-pronunciation-card{min-height:520px;padding:var(--vx-space-6) var(--vx-space-4)}.vx-pronunciation-result{grid-template-columns:1fr}.vx-pronunciation-score,.vx-pronunciation-result>button{grid-column:1}}


/* Voyara Core 2.2 – travel scenario learning paths */
.vx-scenario-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:var(--vx-space-5);
    width:min(1180px,100%);
    margin:0 auto;
}

.vx-scenario-card {
    display:grid;
    gap:var(--vx-space-5);
    padding:var(--vx-space-6);
    border:1px solid var(--vx-line-200);
    border-radius:var(--vx-radius-xl);
    background:
        radial-gradient(circle at 100% 0%,rgba(230,243,239,.9),transparent 34%),
        #fff;
    box-shadow:var(--vx-shadow-sm);
    transition:transform var(--vx-ease),box-shadow var(--vx-ease);
}

.vx-scenario-card:hover {
    transform:translateY(-3px);
    box-shadow:var(--vx-shadow-md);
}

.vx-scenario-card--emergency {
    border-color:rgba(165,59,59,.28);
    background:
        radial-gradient(circle at 100% 0%,rgba(255,240,240,.95),transparent 36%),
        #fff;
}

.vx-scenario-card > header {
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    gap:var(--vx-space-4);
    align-items:start;
}

.vx-scenario-icon {
    display:grid;
    place-items:center;
    width:64px;
    height:64px;
    border-radius:19px;
    color:var(--vx-brand-800);
    background:var(--vx-brand-100);
    font-size:1.75rem;
}

.vx-scenario-card--emergency .vx-scenario-icon {
    color:var(--vx-danger);
    background:var(--vx-danger-soft);
}

.vx-scenario-card h2 {
    margin:0 0 5px;
    color:var(--vx-ink-950);
}

.vx-scenario-card p {
    margin:0;
    color:var(--vx-ink-600);
    line-height:1.45;
}

.vx-emergency-label {
    display:inline-flex;
    margin-bottom:6px;
    padding:4px 8px;
    border-radius:var(--vx-radius-pill);
    color:var(--vx-danger);
    background:var(--vx-danger-soft);
    font-weight:850;
}

.vx-scenario-progress > div:first-child {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:8px;
}

.vx-scenario-progress span {
    color:var(--vx-ink-600);
    font-size:.72rem;
    font-weight:800;
}

.vx-scenario-progress strong {
    color:var(--vx-brand-700);
}

.vx-scenario-progress__track {
    height:10px;
    overflow:hidden;
    border-radius:var(--vx-radius-pill);
    background:var(--vx-brand-100);
}

.vx-scenario-progress__track i {
    display:block;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,var(--vx-brand-900),var(--vx-brand-600));
}

.vx-scenario-card dl {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:10px;
    margin:0;
}

.vx-scenario-card dl > div {
    padding:12px;
    border-radius:var(--vx-radius-md);
    background:var(--vx-brand-050);
}

.vx-scenario-card dt {
    color:var(--vx-ink-600);
    font-size:.64rem;
    font-weight:800;
}

.vx-scenario-card dd {
    margin:5px 0 0;
    color:var(--vx-ink-950);
    font-size:1.15rem;
    font-weight:900;
}

.vx-scenario-card footer {
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}

.vx-scenario-focus-chip {
    display:inline-flex;
    align-items:center;
    gap:10px;
    margin-top:var(--vx-space-4);
    padding:9px 13px;
    border:1px solid rgba(255,255,255,.24);
    border-radius:var(--vx-radius-pill);
    color:var(--vx-brand-800);
    background:var(--vx-brand-100);
}

.vx-scenario-focus-chip > span {
    font-size:1.25rem;
}

.vx-scenario-focus-chip small,
.vx-scenario-focus-chip strong {
    display:block;
}

.vx-scenario-focus-chip small {
    color:var(--vx-ink-600);
    font-size:.62rem;
}

.vx-scenario-focus-chip strong {
    text-transform:capitalize;
}

@media (max-width:860px) {
    .vx-scenario-grid {
        grid-template-columns:1fr;
    }
}

@media (max-width:560px) {
    .vx-scenario-card {
        padding:var(--vx-space-5) var(--vx-space-4);
    }

    .vx-scenario-card > header {
        grid-template-columns:1fr;
    }

    .vx-scenario-card dl {
        grid-template-columns:1fr 1fr 1fr;
    }

    .vx-scenario-card footer .vx-button {
        width:100%;
    }
}


/* Voyara Core 2.3 – CEFR assessment */
.vx-cefr-dashboard-card {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:var(--vx-space-6);
    width:min(1180px,100%);
    margin:0 auto var(--vx-space-5);
    padding:var(--vx-space-6);
    border:1px solid rgba(200,154,61,.28);
    border-radius:var(--vx-radius-xl);
    background:
        radial-gradient(circle at 95% 0%,rgba(200,154,61,.18),transparent 30%),
        linear-gradient(135deg,#fff,#f7fbf9);
    box-shadow:var(--vx-shadow-md);
}

.vx-cefr-dashboard-card__level {
    display:grid;
    place-items:center;
    width:112px;
    height:112px;
    border-radius:28px;
    color:#fff;
    background:linear-gradient(145deg,var(--vx-brand-950),var(--vx-brand-700));
    box-shadow:0 18px 38px rgba(13,92,78,.25);
}

.vx-cefr-dashboard-card__level span {
    font-size:2rem;
    font-weight:950;
}

.vx-cefr-dashboard-card__level small {
    color:rgba(255,255,255,.75);
    font-size:.62rem;
}

.vx-cefr-dashboard-card h2 {
    margin:5px 0;
    font-size:1.7rem;
}

.vx-cefr-dashboard-card p {
    margin:0;
    color:var(--vx-ink-600);
}

.vx-cefr-dashboard-card__action {
    display:grid;
    gap:9px;
    justify-items:stretch;
    min-width:220px;
}

.vx-cefr-dashboard-card__action small {
    color:var(--vx-ink-600);
    text-align:center;
}

.vx-cefr-intro-grid {
    display:grid;
    grid-template-columns:minmax(0,1fr) 300px;
    gap:var(--vx-space-5);
    width:min(1180px,100%);
    margin:0 auto var(--vx-space-5);
}

.vx-cefr-launch,
.vx-cefr-current,
.vx-cefr-history,
.vx-cefr-competencies,
.vx-cefr-report-notice {
    padding:var(--vx-space-6);
}

.vx-cefr-launch {
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    gap:var(--vx-space-5);
    align-items:center;
}

.vx-cefr-launch form,
.vx-cefr-launch .flash {
    grid-column:1 / -1;
}

.vx-cefr-level-orbit {
    display:grid;
    grid-template-columns:repeat(3,44px);
    gap:7px;
}

.vx-cefr-level-orbit span {
    display:grid;
    place-items:center;
    width:44px;
    height:44px;
    border-radius:14px;
    color:var(--vx-brand-800);
    background:var(--vx-brand-100);
    font-weight:950;
}

.vx-cefr-current {
    display:grid;
    align-content:center;
    justify-items:center;
    text-align:center;
}

.vx-cefr-current > strong {
    margin:12px 0;
    color:var(--vx-brand-700);
    font-size:5rem;
    line-height:1;
}

.vx-cefr-history {
    width:min(1180px,100%);
    margin:0 auto;
}

.vx-cefr-history h2 {
    margin:5px 0 18px;
}

.vx-cefr-history > div {
    display:grid;
    gap:8px;
}

.vx-cefr-history a {
    display:grid;
    grid-template-columns:140px 1fr 1fr auto;
    gap:14px;
    align-items:center;
    padding:14px;
    border-radius:var(--vx-radius-md);
    color:var(--vx-ink-950);
    background:var(--vx-brand-050);
    text-decoration:none;
}

.vx-cefr-history a strong,
.vx-cefr-history a b {
    color:var(--vx-brand-700);
}

.vx-cefr-question {
    display:grid;
    justify-items:center;
    width:min(880px,100%);
    min-height:600px;
    margin:0 auto;
    padding:var(--vx-space-8);
    align-content:center;
    text-align:center;
}

.vx-cefr-question > header {
    display:flex;
    align-items:center;
    gap:10px;
    color:var(--vx-ink-600);
    font-weight:850;
}

.vx-level-badge {
    display:grid;
    place-items:center;
    width:48px;
    height:48px;
    border-radius:15px;
    color:#fff;
    background:linear-gradient(135deg,var(--vx-brand-900),var(--vx-brand-700));
    font-weight:950;
}

.vx-cefr-question h1 {
    max-width:760px;
    margin:28px auto;
    font-size:clamp(2rem,4.5vw,3.8rem);
    line-height:1.1;
}

.vx-cefr-question form {
    display:grid;
    gap:18px;
    width:100%;
    margin-top:22px;
}

.vx-cefr-options {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
}

.vx-cefr-options label {
    position:relative;
}

.vx-cefr-options input {
    position:absolute;
    opacity:0;
}

.vx-cefr-options span {
    display:grid;
    place-items:center;
    min-height:78px;
    padding:15px;
    border:1px solid var(--vx-line-200);
    border-radius:var(--vx-radius-lg);
    background:#fff;
    cursor:pointer;
    font-weight:800;
    transition:all var(--vx-ease);
}

.vx-cefr-options input:checked + span {
    color:#fff;
    border-color:var(--vx-brand-700);
    background:linear-gradient(135deg,var(--vx-brand-900),var(--vx-brand-700));
    box-shadow:0 12px 28px rgba(13,92,78,.2);
}

.vx-cefr-result-hero {
    display:grid;
    justify-items:center;
    width:min(900px,100%);
    margin:0 auto var(--vx-space-5);
    padding:var(--vx-space-8);
    border-radius:var(--vx-radius-xl);
    color:#fff;
    text-align:center;
    background:
        radial-gradient(circle at 50% 0%,rgba(255,255,255,.18),transparent 30%),
        linear-gradient(135deg,var(--vx-brand-950),var(--vx-brand-700));
    box-shadow:var(--vx-shadow-lg);
}

.vx-cefr-result-hero .vx-kicker,
.vx-cefr-result-hero p {
    color:rgba(255,255,255,.76);
}

.vx-cefr-result-level {
    display:grid;
    place-items:center;
    width:150px;
    height:150px;
    margin:20px 0;
    border:3px solid rgba(255,255,255,.5);
    border-radius:50%;
    background:rgba(255,255,255,.12);
    font-size:4.5rem;
    font-weight:950;
}

.vx-cefr-result-hero h1 {
    margin:0;
}

.vx-cefr-result-kpis {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:var(--vx-space-4);
    width:min(900px,100%);
    margin:0 auto var(--vx-space-5);
}

.vx-cefr-result-kpis article {
    padding:17px;
    border:1px solid var(--vx-line-200);
    border-radius:var(--vx-radius-lg);
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-cefr-result-kpis small,
.vx-cefr-result-kpis strong {
    display:block;
}

.vx-cefr-result-kpis small {
    color:var(--vx-ink-600);
}

.vx-cefr-result-kpis strong {
    margin-top:6px;
    color:var(--vx-brand-700);
    font-size:1.35rem;
}

.vx-cefr-competencies,
.vx-cefr-report-notice {
    width:min(900px,100%);
    margin:0 auto var(--vx-space-5);
}

.vx-cefr-competencies > div {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px;
    margin-top:18px;
}

.vx-cefr-competencies article > div:first-child {
    display:flex;
    justify-content:space-between;
    gap:12px;
}

.vx-cefr-skill-track {
    height:10px;
    margin-top:8px;
    overflow:hidden;
    border-radius:var(--vx-radius-pill);
    background:var(--vx-brand-100);
}

.vx-cefr-skill-track i {
    display:block;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,var(--vx-brand-900),var(--vx-brand-600));
}

.vx-cefr-report-notice {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:var(--vx-space-5);
}

.vx-cefr-report-notice h2 {
    margin:5px 0;
}

.vx-cefr-report-notice p {
    margin:0;
    max-width:680px;
    color:var(--vx-ink-600);
}

@media (max-width:900px) {
    .vx-cefr-dashboard-card,
    .vx-cefr-intro-grid {
        grid-template-columns:1fr;
    }

    .vx-cefr-dashboard-card__action {
        min-width:0;
    }

    .vx-cefr-result-kpis {
        grid-template-columns:1fr 1fr;
    }
}

@media (max-width:640px) {
    .vx-cefr-dashboard-card,
    .vx-cefr-launch,
    .vx-cefr-current,
    .vx-cefr-history,
    .vx-cefr-question,
    .vx-cefr-competencies,
    .vx-cefr-report-notice {
        padding:var(--vx-space-5) var(--vx-space-4);
    }

    .vx-cefr-launch,
    .vx-cefr-options,
    .vx-cefr-competencies > div {
        grid-template-columns:1fr;
    }

    .vx-cefr-level-orbit {
        grid-template-columns:repeat(6,1fr);
        width:100%;
    }

    .vx-cefr-level-orbit span {
        width:100%;
    }

    .vx-cefr-history a {
        grid-template-columns:1fr auto;
    }

    .vx-cefr-history a span,
    .vx-cefr-history a small {
        grid-column:1 / -1;
    }

    .vx-cefr-result-kpis {
        grid-template-columns:1fr 1fr;
    }

    .vx-cefr-report-notice {
        align-items:stretch;
        flex-direction:column;
    }
}


/* Voyara Core 2.4 – Content Studio */
.vx-content-tabs {
    display:flex;
    gap:8px;
    width:min(1180px,100%);
    margin:0 auto var(--vx-space-5);
    padding:5px;
    border:1px solid var(--vx-line-200);
    border-radius:var(--vx-radius-pill);
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-content-tabs a {
    flex:1;
    padding:11px 16px;
    border-radius:var(--vx-radius-pill);
    color:var(--vx-ink-600);
    text-align:center;
    text-decoration:none;
    font-weight:900;
}

.vx-content-tabs a.active {
    color:#fff;
    background:linear-gradient(135deg,var(--vx-brand-900),var(--vx-brand-700));
}

.vx-content-summary {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:var(--vx-space-4);
    width:min(1180px,100%);
    margin:0 auto var(--vx-space-5);
}

.vx-content-summary article {
    padding:18px;
    border:1px solid var(--vx-line-200);
    border-radius:var(--vx-radius-lg);
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-content-summary small,
.vx-content-summary strong {
    display:block;
}

.vx-content-summary small {
    color:var(--vx-ink-600);
}

.vx-content-summary strong {
    margin-top:5px;
    color:var(--vx-brand-700);
    font-size:1.8rem;
}

.vx-content-toolbar,
.vx-content-import {
    width:min(1180px,100%);
    margin:0 auto var(--vx-space-4);
    padding:var(--vx-space-4);
}

.vx-content-toolbar,
.vx-content-toolbar form,
.vx-content-toolbar > div,
.vx-content-import form {
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}

.vx-content-toolbar {
    justify-content:space-between;
}

.vx-content-toolbar input,
.vx-content-toolbar select {
    min-height:44px;
}

.vx-content-import form {
    justify-content:space-between;
}

.vx-content-import small {
    display:block;
    margin-top:3px;
    color:var(--vx-ink-600);
}

.vx-content-list,
.vx-content-question-list {
    display:grid;
    gap:var(--vx-space-3);
    width:min(1180px,100%);
    margin:0 auto;
}

.vx-content-list > article,
.vx-content-question-list > article {
    padding:var(--vx-space-5);
}

.vx-content-list header,
.vx-content-question-list header {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;
}

.vx-content-list h2,
.vx-content-question-list h2 {
    margin:8px 0 4px;
}

.vx-content-list p,
.vx-content-question-list p {
    margin:0;
    color:var(--vx-ink-600);
}

.vx-content-list dl {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:10px;
    margin:18px 0 0;
}

.vx-content-list dl > div {
    padding:12px;
    border-radius:var(--vx-radius-md);
    background:var(--vx-brand-050);
}

.vx-content-list dt {
    color:var(--vx-ink-600);
    font-size:.66rem;
    font-weight:850;
}

.vx-content-list dd {
    margin:4px 0 0;
    font-weight:900;
}

.vx-content-status {
    display:inline-flex;
    padding:5px 9px;
    border-radius:var(--vx-radius-pill);
    font-size:.62rem;
    font-weight:900;
}

.vx-content-status--draft,
.vx-content-status--translation_open {
    color:#8a5d00;
    background:var(--vx-gold-100);
}

.vx-content-status--review_required,
.vx-content-status--audio_open {
    color:var(--vx-danger);
    background:var(--vx-danger-soft);
}

.vx-content-status--approved,
.vx-content-status--complete {
    color:var(--vx-success);
    background:var(--vx-success-soft);
}

.vx-content-status--archived {
    color:var(--vx-ink-600);
    background:#edf1ef;
}

.vx-content-editor {
    display:grid;
    gap:var(--vx-space-5);
    width:min(1180px,100%);
    margin:0 auto;
}

.vx-content-editor > .vx-panel,
.vx-content-translations > article {
    padding:var(--vx-space-6);
}

.vx-content-editor > .vx-panel > header {
    margin-bottom:var(--vx-space-5);
}

.vx-content-editor h2 {
    margin:4px 0 0;
}

.vx-form-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
}

.vx-content-editor label {
    display:grid;
    gap:6px;
    margin-bottom:14px;
}

.vx-content-editor label > span {
    color:var(--vx-ink-600);
    font-size:.72rem;
    font-weight:850;
}

.vx-content-translations {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:var(--vx-space-4);
}

.vx-content-translations article > header {
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:var(--vx-space-4);
}

.vx-language-code {
    display:grid;
    place-items:center;
    width:48px;
    height:48px;
    border-radius:14px;
    color:#fff;
    background:linear-gradient(135deg,var(--vx-brand-900),var(--vx-brand-700));
    font-weight:950;
}

.vx-content-editor__footer {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    padding:var(--vx-space-5);
    border:1px solid var(--vx-line-200);
    border-radius:var(--vx-radius-xl);
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-content-danger {
    width:min(1180px,100%);
    margin:var(--vx-space-4) auto 0;
    text-align:right;
}

.vx-content-question-list header {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
}

.vx-checkbox-field {
    align-content:center;
    grid-template-columns:auto 1fr;
    align-items:center;
}

@media (max-width:900px) {
    .vx-content-summary,
    .vx-content-list dl,
    .vx-form-grid,
    .vx-content-translations {
        grid-template-columns:1fr 1fr;
    }
}

@media (max-width:640px) {
    .vx-content-tabs,
    .vx-content-toolbar,
    .vx-content-toolbar form,
    .vx-content-toolbar > div,
    .vx-content-import form,
    .vx-content-editor__footer {
        align-items:stretch;
        flex-direction:column;
    }

    .vx-content-summary,
    .vx-content-list dl,
    .vx-form-grid,
    .vx-content-translations {
        grid-template-columns:1fr;
    }

    .vx-content-list header,
    .vx-content-question-list header {
        grid-template-columns:1fr;
        flex-direction:column;
    }

    .vx-content-toolbar input,
    .vx-content-toolbar select,
    .vx-content-toolbar .vx-button {
        width:100%;
    }
}


/* Voyara Core 2.5 – pilot content card */
.vx-pilot-card {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:var(--vx-space-5);
    width:min(1180px,100%);
    margin:0 auto var(--vx-space-5);
    padding:var(--vx-space-5);
    border:1px solid var(--vx-line-200);
    border-radius:var(--vx-radius-xl);
    background:
        radial-gradient(circle at 100% 0%,rgba(230,243,239,.95),transparent 36%),
        #fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-pilot-card__icon {
    display:grid;
    place-items:center;
    width:72px;
    height:72px;
    border-radius:21px;
    color:#fff;
    background:linear-gradient(135deg,var(--vx-brand-950),var(--vx-brand-700));
    font-size:1.4rem;
    font-weight:950;
}

.vx-pilot-card h2 {
    margin:4px 0;
}

.vx-pilot-card p {
    margin:0;
    color:var(--vx-ink-600);
}

.vx-pilot-card__actions {
    display:grid;
    gap:8px;
    min-width:230px;
}

@media (max-width:760px) {
    .vx-pilot-card {
        grid-template-columns:1fr;
        justify-items:start;
    }

    .vx-pilot-card__actions {
        width:100%;
        min-width:0;
    }
}


/* Voyara Core 2.6 – hotel pilot content */
.vx-hotel-pilot-card {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:var(--vx-space-5);
    width:min(1180px,100%);
    margin:0 auto var(--vx-space-5);
    padding:var(--vx-space-5);
    border:1px solid var(--vx-line-200);
    border-radius:var(--vx-radius-xl);
    background:
        radial-gradient(circle at 100% 0%,rgba(200,154,61,.15),transparent 34%),
        #fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-hotel-pilot-card__icon {
    display:grid;
    place-items:center;
    width:72px;
    height:72px;
    border-radius:21px;
    color:#fff;
    background:linear-gradient(135deg,#8b6321,var(--vx-gold-500));
    font-size:1.7rem;
    font-weight:950;
}

.vx-hotel-pilot-card h2 {
    margin:4px 0;
}

.vx-hotel-pilot-card p {
    margin:0;
    color:var(--vx-ink-600);
}

@media (max-width:760px) {
    .vx-hotel-pilot-card {
        grid-template-columns:1fr;
        justify-items:start;
    }

    .vx-hotel-pilot-card .vx-button {
        width:100%;
    }
}


/* Voyara Core 2.7 – restaurant pilot content */
.vx-restaurant-pilot-card {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:var(--vx-space-5);
    width:min(1180px,100%);
    margin:0 auto var(--vx-space-5);
    padding:var(--vx-space-5);
    border:1px solid var(--vx-line-200);
    border-radius:var(--vx-radius-xl);
    background:
        radial-gradient(circle at 100% 0%,rgba(230,243,239,.95),transparent 36%),
        #fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-restaurant-pilot-card__icon {
    display:grid;
    place-items:center;
    width:72px;
    height:72px;
    border-radius:21px;
    color:#fff;
    background:linear-gradient(135deg,#6d3a20,#b56d35);
    font-size:1.7rem;
    font-weight:950;
}

.vx-restaurant-pilot-card h2 {
    margin:4px 0;
}

.vx-restaurant-pilot-card p {
    margin:0;
    color:var(--vx-ink-600);
}

@media (max-width:760px) {
    .vx-restaurant-pilot-card {
        grid-template-columns:1fr;
        justify-items:start;
    }

    .vx-restaurant-pilot-card .vx-button {
        width:100%;
    }
}


/* Voyara Core 2.8 – transport pilot content */
.vx-transport-pilot-card {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:var(--vx-space-5);
    width:min(1180px,100%);
    margin:0 auto var(--vx-space-5);
    padding:var(--vx-space-5);
    border:1px solid var(--vx-line-200);
    border-radius:var(--vx-radius-xl);
    background:
        radial-gradient(circle at 100% 0%,rgba(217,235,247,.95),transparent 36%),
        #fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-transport-pilot-card__icon {
    display:grid;
    place-items:center;
    width:72px;
    height:72px;
    border-radius:21px;
    color:#fff;
    background:linear-gradient(135deg,#23556a,#3c86a5);
    font-size:1.8rem;
    font-weight:950;
}

.vx-transport-pilot-card h2 {
    margin:4px 0;
}

.vx-transport-pilot-card p {
    margin:0;
    color:var(--vx-ink-600);
}

@media (max-width:760px) {
    .vx-transport-pilot-card {
        grid-template-columns:1fr;
        justify-items:start;
    }

    .vx-transport-pilot-card .vx-button {
        width:100%;
    }
}


/* Voyara Core 2.9 – shopping pilot content */
.vx-shopping-pilot-card {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:var(--vx-space-5);
    width:min(1180px,100%);
    margin:0 auto var(--vx-space-5);
    padding:var(--vx-space-5);
    border:1px solid var(--vx-line-200);
    border-radius:var(--vx-radius-xl);
    background:
        radial-gradient(circle at 100% 0%,rgba(244,232,214,.95),transparent 36%),
        #fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-shopping-pilot-card__icon {
    display:grid;
    place-items:center;
    width:72px;
    height:72px;
    border-radius:21px;
    color:#fff;
    background:linear-gradient(135deg,#73512b,#bd8a4a);
    font-size:1.7rem;
    font-weight:950;
}

.vx-shopping-pilot-card h2 {
    margin:4px 0;
}

.vx-shopping-pilot-card p {
    margin:0;
    color:var(--vx-ink-600);
}

@media (max-width:760px) {
    .vx-shopping-pilot-card {
        grid-template-columns:1fr;
        justify-items:start;
    }

    .vx-shopping-pilot-card .vx-button {
        width:100%;
    }
}


/* Voyara Core 3.0 – directions pilot content */
.vx-directions-pilot-card {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:var(--vx-space-5);
    width:min(1180px,100%);
    margin:0 auto var(--vx-space-5);
    padding:var(--vx-space-5);
    border:1px solid var(--vx-line-200);
    border-radius:var(--vx-radius-xl);
    background:
        radial-gradient(circle at 100% 0%,rgba(224,239,232,.95),transparent 36%),
        #fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-directions-pilot-card__icon {
    display:grid;
    place-items:center;
    width:72px;
    height:72px;
    border-radius:21px;
    color:#fff;
    background:linear-gradient(135deg,#285f4a,#4c9c78);
    font-size:1.8rem;
    font-weight:950;
}

.vx-directions-pilot-card h2 {
    margin:4px 0;
}

.vx-directions-pilot-card p {
    margin:0;
    color:var(--vx-ink-600);
}

@media (max-width:760px) {
    .vx-directions-pilot-card {
        grid-template-columns:1fr;
        justify-items:start;
    }

    .vx-directions-pilot-card .vx-button {
        width:100%;
    }
}


/* Voyara Core 3.1 – emergency pilot content */
.vx-emergency-pilot-card {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:var(--vx-space-5);
    width:min(1180px,100%);
    margin:0 auto var(--vx-space-5);
    padding:var(--vx-space-5);
    border:1px solid rgba(165,59,59,.30);
    border-radius:var(--vx-radius-xl);
    background:
        radial-gradient(circle at 100% 0%,rgba(255,232,232,.95),transparent 38%),
        #fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-emergency-pilot-card__icon {
    display:grid;
    place-items:center;
    width:72px;
    height:72px;
    border-radius:21px;
    color:#fff;
    background:linear-gradient(135deg,#7a2020,#b94343);
    font-size:2rem;
    font-weight:950;
}

.vx-emergency-pilot-card h2 {
    margin:4px 0;
}

.vx-emergency-pilot-card p {
    margin:0;
    color:var(--vx-ink-600);
}

.vx-emergency-pilot-card__actions {
    display:grid;
    gap:8px;
    min-width:230px;
}

@media (max-width:760px) {
    .vx-emergency-pilot-card {
        grid-template-columns:1fr;
        justify-items:start;
    }

    .vx-emergency-pilot-card__actions {
        width:100%;
        min-width:0;
    }
}


/* Voyara Core 3.2 – leisure pilot content */
.vx-leisure-pilot-card {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:var(--vx-space-5);
    width:min(1180px,100%);
    margin:0 auto var(--vx-space-5);
    padding:var(--vx-space-5);
    border:1px solid var(--vx-line-200);
    border-radius:var(--vx-radius-xl);
    background:
        radial-gradient(circle at 100% 0%,rgba(241,235,206,.95),transparent 36%),
        #fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-leisure-pilot-card__icon {
    display:grid;
    place-items:center;
    width:72px;
    height:72px;
    border-radius:21px;
    color:#fff;
    background:linear-gradient(135deg,#76641d,#c2a638);
    font-size:1.7rem;
    font-weight:950;
}

.vx-leisure-pilot-card h2 {
    margin:4px 0;
}

.vx-leisure-pilot-card p {
    margin:0;
    color:var(--vx-ink-600);
}

@media (max-width:760px) {
    .vx-leisure-pilot-card {
        grid-template-columns:1fr;
        justify-items:start;
    }

    .vx-leisure-pilot-card .vx-button {
        width:100%;
    }
}


/* Voyara Core 3.3 – social pilot content */
.vx-social-pilot-card {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:var(--vx-space-5);
    width:min(1180px,100%);
    margin:0 auto var(--vx-space-5);
    padding:var(--vx-space-5);
    border:1px solid var(--vx-line-200);
    border-radius:var(--vx-radius-xl);
    background:
        radial-gradient(circle at 100% 0%,rgba(232,224,244,.95),transparent 36%),
        #fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-social-pilot-card__icon {
    display:grid;
    place-items:center;
    width:72px;
    height:72px;
    border-radius:21px;
    color:#fff;
    background:linear-gradient(135deg,#5b3f77,#8d6bb1);
    font-size:1.8rem;
    font-weight:950;
}

.vx-social-pilot-card h2 {
    margin:4px 0;
}

.vx-social-pilot-card p {
    margin:0;
    color:var(--vx-ink-600);
}

@media (max-width:760px) {
    .vx-social-pilot-card {
        grid-template-columns:1fr;
        justify-items:start;
    }

    .vx-social-pilot-card .vx-button {
        width:100%;
    }
}


/* Voyara Core 3.4 – airport pilot content */
.vx-airport-pilot-card {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:var(--vx-space-5);
    width:min(1180px,100%);
    margin:0 auto var(--vx-space-5);
    padding:var(--vx-space-5);
    border:1px solid var(--vx-line-200);
    border-radius:var(--vx-radius-xl);
    background:
        radial-gradient(circle at 100% 0%,rgba(224,236,248,.95),transparent 36%),
        #fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-airport-pilot-card__icon {
    display:grid;
    place-items:center;
    width:72px;
    height:72px;
    border-radius:21px;
    color:#fff;
    background:linear-gradient(135deg,#315a7a,#5b8fb5);
    font-size:1.7rem;
    font-weight:950;
}

.vx-airport-pilot-card h2 {
    margin:4px 0;
}

.vx-airport-pilot-card p {
    margin:0;
    color:var(--vx-ink-600);
}

@media (max-width:760px) {
    .vx-airport-pilot-card {
        grid-template-columns:1fr;
        justify-items:start;
    }

    .vx-airport-pilot-card .vx-button {
        width:100%;
    }
}


/* Voyara Core 3.5 – camping pilot content */
.vx-camping-pilot-card {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:var(--vx-space-5);
    width:min(1180px,100%);
    margin:0 auto var(--vx-space-5);
    padding:var(--vx-space-5);
    border:1px solid var(--vx-line-200);
    border-radius:var(--vx-radius-xl);
    background:
        radial-gradient(circle at 100% 0%,rgba(226,239,220,.95),transparent 36%),
        #fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-camping-pilot-card__icon {
    display:grid;
    place-items:center;
    width:72px;
    height:72px;
    border-radius:21px;
    color:#fff;
    background:linear-gradient(135deg,#426638,#729c61);
    font-size:1.8rem;
    font-weight:950;
}

.vx-camping-pilot-card h2 {
    margin:4px 0;
}

.vx-camping-pilot-card p {
    margin:0;
    color:var(--vx-ink-600);
}

@media (max-width:760px) {
    .vx-camping-pilot-card {
        grid-template-columns:1fr;
        justify-items:start;
    }

    .vx-camping-pilot-card .vx-button {
        width:100%;
    }
}


/* Voyara Core 3.6 – services pilot content */
.vx-services-pilot-card {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:var(--vx-space-5);
    width:min(1180px,100%);
    margin:0 auto var(--vx-space-5);
    padding:var(--vx-space-5);
    border:1px solid var(--vx-line-200);
    border-radius:var(--vx-radius-xl);
    background:
        radial-gradient(circle at 100% 0%,rgba(231,234,241,.95),transparent 36%),
        #fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-services-pilot-card__icon {
    display:grid;
    place-items:center;
    width:72px;
    height:72px;
    border-radius:21px;
    color:#fff;
    background:linear-gradient(135deg,#4a5568,#758196);
    font-size:1.7rem;
    font-weight:950;
}

.vx-services-pilot-card h2 {
    margin:4px 0;
}

.vx-services-pilot-card p {
    margin:0;
    color:var(--vx-ink-600);
}

@media (max-width:760px) {
    .vx-services-pilot-card {
        grid-template-columns:1fr;
        justify-items:start;
    }

    .vx-services-pilot-card .vx-button {
        width:100%;
    }
}


/* Voyara Core 3.7 – housing pilot content */
.vx-housing-pilot-card {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:var(--vx-space-5);
    width:min(1180px,100%);
    margin:0 auto var(--vx-space-5);
    padding:var(--vx-space-5);
    border:1px solid var(--vx-line-200);
    border-radius:var(--vx-radius-xl);
    background:
        radial-gradient(circle at 100% 0%,rgba(236,229,218,.95),transparent 36%),
        #fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-housing-pilot-card__icon {
    display:grid;
    place-items:center;
    width:72px;
    height:72px;
    border-radius:21px;
    color:#fff;
    background:linear-gradient(135deg,#6a4d36,#9a7655);
    font-size:1.8rem;
    font-weight:950;
}

.vx-housing-pilot-card h2 {
    margin:4px 0;
}

.vx-housing-pilot-card p {
    margin:0;
    color:var(--vx-ink-600);
}

@media (max-width:760px) {
    .vx-housing-pilot-card {
        grid-template-columns:1fr;
        justify-items:start;
    }

    .vx-housing-pilot-card .vx-button {
        width:100%;
    }
}


/* ================================================================
   VOYARA CORE 3.8 — PREMIUM MOBILE UI
   ================================================================ */

html {
    background: var(--vx-page);
    scroll-behavior: smooth;
}

body {
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

button,
a,
input,
select {
    -webkit-tap-highlight-color: transparent;
}

.app-content {
    min-height: 100dvh;
    background:
        radial-gradient(circle at 90% -10%, rgba(200,154,61,.08), transparent 28rem),
        var(--vx-page);
}

.app-sidebar {
    width: 264px;
    padding: 20px 14px max(20px, env(safe-area-inset-bottom));
    border-right: 1px solid rgba(255,255,255,.07);
    box-shadow: 16px 0 48px rgba(7,59,51,.08);
}

.app-sidebar nav {
    gap: 3px;
    overflow-y: auto;
    scrollbar-width: none;
}

.app-sidebar nav::-webkit-scrollbar {
    display: none;
}

.app-sidebar nav a {
    display: flex;
    align-items: center;
    gap: 11px;
    min-height: 46px;
    padding: 10px 12px;
    font-size: .88rem;
    font-weight: 760;
    transition: background var(--vx-ease), color var(--vx-ease), transform var(--vx-ease);
}

.app-sidebar nav a > span {
    display: grid;
    place-items: center;
    width: 25px;
    height: 25px;
    border-radius: 8px;
    font-size: .85rem;
    background: rgba(255,255,255,.08);
}

.app-sidebar nav a:hover {
    color: #fff;
    background: rgba(255,255,255,.08);
    transform: translateX(2px);
}

.app-sidebar nav a.active {
    color: #fff;
    background: linear-gradient(135deg, rgba(255,255,255,.18), rgba(255,255,255,.09));
    box-shadow: inset 3px 0 0 var(--vx-gold-500);
}

.vx-sidebar-label {
    margin: 18px 12px 5px;
    color: rgba(255,255,255,.38);
    font-size: .62rem;
    font-weight: 900;
    letter-spacing: .16em;
}

.topbar {
    position: sticky;
    top: 0;
    z-index: 25;
    min-height: 68px;
    padding-top: max(10px, env(safe-area-inset-top));
    border-bottom-color: rgba(7,59,51,.08);
    background: rgba(255,255,255,.86);
    backdrop-filter: blur(22px) saturate(150%);
}

.page {
    width: min(1240px, calc(100% - 48px));
    padding-top: 26px;
}

.vx-dashboard-hero {
    position: relative;
    overflow: hidden;
    min-height: 250px;
    padding: clamp(26px, 4vw, 46px);
    border-radius: 30px;
    background:
        radial-gradient(circle at 88% 18%, rgba(239,184,94,.25), transparent 22rem),
        radial-gradient(circle at 64% 120%, rgba(255,255,255,.10), transparent 20rem),
        linear-gradient(135deg, #073b33, #137561);
    box-shadow: 0 24px 70px rgba(7,59,51,.20);
}

.vx-dashboard-hero::after {
    content: "";
    position: absolute;
    inset: auto -80px -110px auto;
    width: 280px;
    height: 280px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 50%;
}

.vx-dashboard-hero h1 {
    max-width: 740px;
    font-size: clamp(2.35rem, 5vw, 4.8rem);
    line-height: .98;
}

.vx-dashboard-profile {
    position: relative;
    z-index: 2;
}

.vx-mobile-action-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 14px;
    margin: 18px 0;
}

.vx-mobile-action-card {
    display: grid;
    grid-template-columns: auto minmax(0,1fr) auto;
    align-items: center;
    gap: 14px;
    min-height: 108px;
    padding: 20px;
    border: 1px solid var(--vx-line-200);
    border-radius: 22px;
    background: #fff;
    box-shadow: var(--vx-shadow-sm);
    text-decoration: none;
    transition: transform var(--vx-ease), box-shadow var(--vx-ease);
}

.vx-mobile-action-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--vx-shadow-md);
}

.vx-mobile-action-card__icon {
    display: grid;
    place-items: center;
    width: 50px;
    height: 50px;
    border-radius: 16px;
    color: #fff;
    background: var(--vx-brand-800);
}

.vx-mobile-action-card__icon svg {
    width: 23px;
    height: 23px;
    fill: currentColor;
}

.vx-mobile-action-card small,
.vx-mobile-action-card strong {
    display: block;
}

.vx-mobile-action-card small {
    margin-bottom: 4px;
    color: var(--vx-brand-700);
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.vx-mobile-action-card strong {
    color: var(--vx-ink-800);
    font-size: .96rem;
    line-height: 1.45;
}

.vx-mobile-action-card > b {
    color: var(--vx-brand-700);
    font-size: 1.25rem;
}

.vx-mobile-action-card--urgent .vx-mobile-action-card__icon {
    background: linear-gradient(135deg, #8d2828, #c54d4d);
}

.vx-mobile-action-card--urgent small,
.vx-mobile-action-card--urgent > b {
    color: var(--vx-danger);
}

.vx-worlds-feature {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(300px,.62fr);
    align-items: center;
    gap: 30px;
    min-height: 330px;
    margin-bottom: 18px;
    padding: clamp(26px, 4vw, 44px);
    overflow: hidden;
    border: 1px solid rgba(13,92,78,.12);
    border-radius: 30px;
    background:
        radial-gradient(circle at 90% 15%, rgba(200,154,61,.16), transparent 18rem),
        linear-gradient(145deg, #fff, #f1f8f5);
    box-shadow: var(--vx-shadow-sm);
}

.vx-worlds-feature h2 {
    max-width: 650px;
    margin: 8px 0 12px;
    font-size: clamp(2rem, 4vw, 3.5rem);
    letter-spacing: -.045em;
}

.vx-worlds-feature p {
    max-width: 650px;
    color: var(--vx-ink-600);
    font-size: 1.02rem;
    line-height: 1.7;
}

.vx-worlds-feature__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 20px 0;
}

.vx-worlds-feature__meta span {
    padding: 7px 11px;
    border-radius: 999px;
    color: var(--vx-brand-800);
    background: var(--vx-brand-100);
    font-size: .76rem;
    font-weight: 850;
}

.vx-worlds-preview {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    transform: rotate(2deg);
}

.vx-world-tile {
    display: grid;
    place-items: center;
    min-height: 118px;
    padding: 18px;
    border: 1px solid rgba(7,59,51,.08);
    border-radius: 24px;
    background: rgba(255,255,255,.92);
    box-shadow: 0 14px 34px rgba(7,59,51,.09);
}

.vx-world-tile b {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border-radius: 15px;
    color: #fff;
    background: var(--vx-brand-700);
    font-size: 1.15rem;
}

.vx-world-tile small {
    margin-top: 10px;
    color: var(--vx-ink-800);
    font-weight: 850;
}

.vx-world-tile--food b { background: #a85d31; }
.vx-world-tile--travel b { background: #356f8d; }
.vx-world-tile--emergency b { background: #a53b3b; }

.vx-dashboard-kpis {
    gap: 12px;
}

.vx-dashboard-kpis article {
    border-radius: 20px;
    box-shadow: none;
}

.vx-worlds-hero {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 30px;
    min-height: 240px;
    padding: clamp(28px, 5vw, 52px);
    border-radius: 30px;
    color: #fff;
    background:
        radial-gradient(circle at 92% 10%, rgba(239,184,94,.25), transparent 20rem),
        linear-gradient(135deg, #073b33, #137561);
    box-shadow: var(--vx-shadow-md);
}

.vx-worlds-hero h1 {
    max-width: 760px;
    margin: 8px 0 12px;
    font-size: clamp(2.4rem, 6vw, 5rem);
    line-height: .96;
    letter-spacing: -.055em;
}

.vx-worlds-hero p {
    max-width: 760px;
    margin: 0;
    color: rgba(255,255,255,.72);
    font-size: 1.05rem;
    line-height: 1.65;
}

.vx-worlds-route {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
    padding: 10px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 18px;
    background: rgba(255,255,255,.10);
    backdrop-filter: blur(12px);
}

.vx-worlds-route span {
    display: grid;
    place-items: center;
    min-width: 52px;
    height: 42px;
    border-radius: 12px;
    background: #fff;
    color: var(--vx-brand-900);
    font-size: .78rem;
    font-weight: 950;
}

.vx-worlds-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin: 18px 0;
    padding: 12px;
    border: 1px solid var(--vx-line-200);
    border-radius: 20px;
    background: rgba(255,255,255,.88);
    box-shadow: var(--vx-shadow-sm);
    backdrop-filter: blur(16px);
}

.vx-worlds-search {
    position: relative;
    display: flex;
    align-items: center;
    width: min(420px, 100%);
}

.vx-worlds-search > span {
    position: absolute;
    left: 15px;
    z-index: 1;
    display: grid;
    place-items: center;
    color: var(--vx-ink-600);
}

.vx-worlds-search svg {
    width: 19px;
    height: 19px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
}

.vx-worlds-search input {
    min-height: 48px;
    padding-left: 44px;
    border: 0;
    border-radius: 14px;
    background: var(--vx-page);
}

.vx-worlds-filters {
    display: flex;
    gap: 5px;
    padding: 4px;
    overflow-x: auto;
    border-radius: 15px;
    background: var(--vx-page);
    scrollbar-width: none;
}

.vx-worlds-filters::-webkit-scrollbar {
    display: none;
}

.vx-worlds-filters button {
    min-height: 40px;
    padding: 8px 14px;
    border: 0;
    border-radius: 11px;
    color: var(--vx-ink-600);
    background: transparent;
    font-size: .8rem;
    font-weight: 850;
    white-space: nowrap;
    cursor: pointer;
}

.vx-worlds-filters button.active {
    color: #fff;
    background: var(--vx-brand-800);
    box-shadow: 0 6px 16px rgba(13,92,78,.18);
}

.vx-world-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 16px;
}

.vx-world-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 20px;
    border: 1px solid var(--vx-line-200);
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 8px 26px rgba(7,59,51,.06);
    transition: transform var(--vx-ease), box-shadow var(--vx-ease), border-color var(--vx-ease);
}

.vx-world-card:hover {
    transform: translateY(-4px);
    border-color: rgba(13,92,78,.25);
    box-shadow: var(--vx-shadow-md);
}

.vx-world-card--emergency {
    border-color: rgba(165,59,59,.25);
    background:
        radial-gradient(circle at 100% 0%, rgba(255,228,228,.75), transparent 14rem),
        #fff;
}

.vx-world-card__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.vx-world-card__icon {
    display: grid;
    place-items: center;
    width: 52px;
    height: 52px;
    border-radius: 17px;
    color: #fff;
    background: linear-gradient(135deg, var(--vx-brand-900), var(--vx-brand-600));
    font-size: 1.2rem;
    font-weight: 950;
    box-shadow: 0 10px 22px rgba(13,92,78,.19);
}

.vx-world-card--emergency .vx-world-card__icon {
    background: linear-gradient(135deg, #7f2020, #bd4747);
}

.vx-world-card__badge {
    padding: 7px 10px;
    border-radius: 999px;
    color: var(--vx-brand-800);
    background: var(--vx-brand-100);
    font-size: .72rem;
    font-weight: 850;
}

.vx-world-card__copy {
    min-height: 146px;
    padding: 20px 0 10px;
}

.vx-world-card__copy h2 {
    margin: 5px 0 8px;
    font-size: 1.25rem;
    letter-spacing: -.02em;
}

.vx-world-card__copy p {
    margin: 0;
    color: var(--vx-ink-600);
    font-size: .88rem;
    line-height: 1.55;
}

.vx-world-card__progress {
    margin-top: auto;
}

.vx-world-card__progress > div:first-child {
    display: flex;
    justify-content: space-between;
    margin-bottom: 7px;
    color: var(--vx-ink-600);
    font-size: .74rem;
    font-weight: 800;
}

.vx-world-card__progress strong {
    color: var(--vx-ink-800);
}

.vx-world-card__track {
    height: 7px;
    overflow: hidden;
    border-radius: 999px;
    background: #e9efed;
}

.vx-world-card__track i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--vx-brand-800), var(--vx-gold-500));
}

.vx-world-card__stats {
    display: flex;
    gap: 14px;
    margin: 15px 0;
    color: var(--vx-ink-600);
    font-size: .72rem;
}

.vx-world-card__stats b {
    margin-right: 3px;
    color: var(--vx-ink-800);
}

.vx-world-card footer {
    display: grid;
    grid-template-columns: minmax(0,1fr) 46px;
    gap: 8px;
}

.vx-world-card footer .vx-button {
    min-width: 0;
}

.vx-world-card__phrasebook {
    display: grid;
    place-items: center;
    min-height: 46px;
    border: 1px solid var(--vx-line-200);
    border-radius: 13px;
    color: var(--vx-brand-800);
    background: #fff;
    text-decoration: none;
}

.vx-worlds-empty {
    padding: 70px 20px;
    text-align: center;
}

.vx-worlds-empty > span {
    font-size: 2rem;
}

.vx-worlds-empty h2 {
    margin-top: 12px;
}

.mobile-bottom-nav a.active {
    color: var(--green-900);
}

.mobile-bottom-nav a.active:not(.quick)::before {
    content: "";
    position: absolute;
    top: -1px;
    left: 30%;
    right: 30%;
    height: 3px;
    border-radius: 0 0 4px 4px;
    background: var(--green-700);
}

.mobile-bottom-nav a {
    position: relative;
}

@media (max-width: 1080px) {
    .vx-world-grid {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
}

@media (max-width: 760px) {
    .page {
        width: 100%;
        padding: 14px 12px calc(106px + env(safe-area-inset-bottom));
    }

    .topbar {
        min-height: 60px;
        padding-right: 12px;
        padding-left: 12px;
    }

    .vx-dashboard-hero {
        min-height: 220px;
        padding: 24px 20px;
        border-radius: 24px;
    }

    .vx-dashboard-hero h1 {
        padding-right: 72px;
        font-size: clamp(2.15rem, 11vw, 3.35rem);
    }

    .vx-dashboard-profile {
        position: absolute;
        top: 22px;
        right: 20px;
    }

    .vx-dashboard-profile small {
        display: none;
    }

    .vx-dashboard-profile img,
    .vx-dashboard-profile > span {
        width: 54px;
        height: 54px;
    }

    .vx-feature-pills {
        gap: 6px;
    }

    .vx-feature-pills span {
        font-size: .67rem;
    }

    .vx-cefr-dashboard-card {
        grid-template-columns: auto minmax(0,1fr);
        padding: 18px;
        border-radius: 22px;
    }

    .vx-cefr-dashboard-card__action {
        grid-column: 1 / -1;
        width: 100%;
    }

    .vx-mobile-action-grid {
        grid-template-columns: 1fr;
        gap: 10px;
        margin: 12px 0;
    }

    .vx-mobile-action-card {
        min-height: 88px;
        padding: 14px;
        border-radius: 19px;
    }

    .vx-mobile-action-card__icon {
        width: 46px;
        height: 46px;
    }

    .vx-worlds-feature {
        grid-template-columns: 1fr;
        min-height: 0;
        padding: 24px 20px;
        border-radius: 24px;
    }

    .vx-worlds-feature h2 {
        font-size: 2rem;
    }

    .vx-worlds-preview {
        grid-template-columns: repeat(4, minmax(0,1fr));
        gap: 7px;
        transform: none;
    }

    .vx-world-tile {
        min-height: 82px;
        padding: 9px 5px;
        border-radius: 17px;
    }

    .vx-world-tile b {
        width: 36px;
        height: 36px;
        border-radius: 12px;
    }

    .vx-world-tile small {
        max-width: 100%;
        overflow: hidden;
        font-size: .62rem;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .vx-dashboard-kpis {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }

    .vx-worlds-hero {
        display: block;
        min-height: 230px;
        padding: 26px 21px;
        border-radius: 24px;
    }

    .vx-worlds-hero h1 {
        font-size: clamp(2.25rem, 12vw, 3.4rem);
    }

    .vx-worlds-hero p {
        font-size: .94rem;
    }

    .vx-worlds-route {
        width: fit-content;
        margin-top: 22px;
    }

    .vx-worlds-toolbar {
        position: sticky;
        top: calc(60px + env(safe-area-inset-top));
        z-index: 20;
        display: grid;
        margin: 12px 0;
        padding: 9px;
        border-radius: 17px;
    }

    .vx-worlds-search {
        width: 100%;
    }

    .vx-worlds-filters {
        width: 100%;
    }

    .vx-world-grid {
        grid-template-columns: 1fr;
        gap: 11px;
    }

    .vx-world-card {
        padding: 17px;
        border-radius: 21px;
    }

    .vx-world-card__copy {
        min-height: 0;
        padding: 16px 0 11px;
    }

    .vx-world-card__copy h2 {
        font-size: 1.18rem;
    }

    .vx-world-card__copy p {
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    .mobile-bottom-nav {
        min-height: calc(72px + env(safe-area-inset-bottom));
        padding-bottom: env(safe-area-inset-bottom);
        border-radius: 22px 22px 0 0;
        box-shadow: 0 -12px 36px rgba(7,59,51,.10);
        background: rgba(255,255,255,.96);
        backdrop-filter: blur(22px) saturate(150%);
    }

    .mobile-bottom-nav a.quick {
        transform: translateY(-12px);
    }
}

@media (max-width: 430px) {
    .vx-dashboard-kpis article {
        padding: 13px;
    }

    .vx-dashboard-kpis article > span {
        display: none;
    }

    .vx-dashboard-kpis strong {
        font-size: 1rem;
    }
}


/* ================================================================
   VOYARA CORE 3.9 — PREMIUM ONBOARDING & AUTH
   ================================================================ */

.vx-onboarding-shell {
    display: grid;
    grid-template-columns: minmax(320px,.82fr) minmax(540px,1.18fr);
    min-height: calc(100dvh - 130px);
    overflow: hidden;
    border: 1px solid rgba(7,59,51,.08);
    border-radius: 30px;
    background: #fff;
    box-shadow: var(--vx-shadow-lg);
}

.vx-onboarding-story {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100%;
    overflow: hidden;
    padding: 36px;
    color: #fff;
    background:
        radial-gradient(circle at 82% 10%, rgba(239,184,94,.28), transparent 18rem),
        radial-gradient(circle at 15% 88%, rgba(255,255,255,.08), transparent 20rem),
        linear-gradient(150deg, #073b33, #0d5c4e 62%, #137561);
}

.vx-onboarding-logo {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 11px;
    width: fit-content;
    color: #fff;
    text-decoration: none;
}

.vx-onboarding-logo img {
    width: 54px;
    height: 54px;
    border-radius: 17px;
    box-shadow: 0 12px 28px rgba(0,0,0,.16);
}

.vx-onboarding-logo strong,
.vx-onboarding-logo small {
    display: block;
}

.vx-onboarding-logo small {
    color: rgba(255,255,255,.62);
    font-size: .69rem;
}

.vx-onboarding-story__copy {
    position: relative;
    z-index: 2;
    margin: auto 0;
}

.vx-onboarding-badge {
    display: inline-flex;
    padding: 8px 12px;
    border: 1px solid rgba(255,255,255,.15);
    border-radius: 999px;
    background: rgba(255,255,255,.09);
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .12em;
}

.vx-onboarding-story h1 {
    max-width: 620px;
    margin: 20px 0 16px;
    font-size: clamp(3rem, 5vw, 5.6rem);
    line-height: .94;
    letter-spacing: -.06em;
}

.vx-onboarding-story p {
    max-width: 520px;
    margin: 0;
    color: rgba(255,255,255,.72);
    font-size: 1.05rem;
    line-height: 1.7;
}

.vx-onboarding-benefits {
    display: grid;
    gap: 9px;
    margin-top: 30px;
    font-size: .82rem;
    font-weight: 800;
}

.vx-onboarding-benefits span {
    width: fit-content;
    padding: 8px 11px;
    border-radius: 12px;
    background: rgba(255,255,255,.08);
}

.vx-onboarding-orbit {
    position: absolute;
    right: -55px;
    bottom: -65px;
    width: 280px;
    height: 280px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 50%;
}

.vx-onboarding-orbit::before {
    content: "";
    position: absolute;
    inset: 45px;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 50%;
}

.vx-onboarding-orbit span {
    position: absolute;
    display: grid;
    place-items: center;
    min-width: 70px;
    height: 38px;
    padding: 0 12px;
    border-radius: 999px;
    color: var(--vx-brand-900);
    background: #fff;
    font-size: .75rem;
    font-weight: 900;
    box-shadow: 0 10px 26px rgba(0,0,0,.16);
}

.vx-onboarding-orbit span:nth-child(1) { top: 28px; left: 18px; }
.vx-onboarding-orbit span:nth-child(2) { top: 88px; right: 5px; }
.vx-onboarding-orbit span:nth-child(3) { bottom: 20px; left: 58px; }

.vx-onboarding-main {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: clamp(28px,5vw,58px);
}

.vx-onboarding-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding-bottom: 24px;
    border-bottom: 1px solid var(--vx-line-200);
}

.vx-onboarding-head span,
.vx-onboarding-head strong {
    display: block;
}

.vx-onboarding-head span {
    color: var(--vx-ink-600);
    font-size: .72rem;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.vx-onboarding-head strong {
    margin-top: 5px;
    font-size: 1rem;
}

.vx-onboarding-progress {
    display: flex;
    gap: 7px;
}

.vx-onboarding-progress i {
    width: 32px;
    height: 6px;
    border-radius: 999px;
    background: #e5ece9;
}

.vx-onboarding-progress i.active {
    background: linear-gradient(90deg, var(--vx-brand-800), var(--vx-gold-500));
}

.vx-onboarding-form {
    display: flex;
    flex: 1;
    flex-direction: column;
    margin-top: 32px;
}

.vx-onboarding-title {
    margin-bottom: 28px;
}

.vx-onboarding-title h2 {
    max-width: 720px;
    margin: 7px 0 10px;
    font-size: clamp(2rem,4vw,3.6rem);
    line-height: 1;
    letter-spacing: -.05em;
}

.vx-onboarding-title p {
    max-width: 620px;
    margin: 0;
    color: var(--vx-ink-600);
    line-height: 1.65;
}

.vx-premium-field {
    display: grid;
    gap: 8px;
    font-size: .8rem;
    font-weight: 850;
}

.vx-premium-field > span {
    color: var(--vx-ink-800);
}

.vx-premium-field input,
.vx-premium-field select {
    min-height: 54px;
    padding: 13px 15px;
    border: 1px solid var(--vx-line-200);
    border-radius: 15px;
    background: #f9fbfa;
    outline: none;
    transition: border-color var(--vx-ease), box-shadow var(--vx-ease), background var(--vx-ease);
}

.vx-premium-field input:focus,
.vx-premium-field select:focus {
    border-color: var(--vx-brand-600);
    background: #fff;
    box-shadow: 0 0 0 4px rgba(27,138,114,.11);
}

.vx-language-selection-grid {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto minmax(0,1fr);
    align-items: end;
    gap: 14px;
}

.vx-language-selection-grid > .vx-premium-field:first-child {
    grid-column: 1 / -1;
}

.vx-language-arrow {
    display: grid;
    place-items: center;
    width: 48px;
    height: 54px;
    border-radius: 15px;
    color: var(--vx-brand-800);
    background: var(--vx-brand-100);
    font-size: 1.3rem;
    font-weight: 900;
}

.vx-country-premium {
    min-height: 260px !important;
    padding: 8px !important;
    border-radius: 17px !important;
}

.vx-country-premium option {
    margin-bottom: 4px;
    padding: 12px 13px;
    border-radius: 11px;
}

.vx-country-suggestion {
    margin: 14px 0;
}

.vx-onboarding-fields {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr;
    gap: 12px;
    margin-top: 14px;
}

.vx-learning-pace-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 12px;
    margin: 18px 0 26px;
}

.vx-learning-pace-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 180px;
    padding: 20px;
    overflow: hidden;
    border: 1px solid var(--vx-line-200);
    border-radius: 20px;
    background: #fff;
    cursor: pointer;
    transition: transform var(--vx-ease), border-color var(--vx-ease), box-shadow var(--vx-ease);
}

.vx-learning-pace-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--vx-shadow-sm);
}

.vx-learning-pace-card input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.vx-learning-pace-card:has(input:checked) {
    border-color: var(--vx-brand-600);
    background:
        radial-gradient(circle at 100% 0%, rgba(230,243,239,.95), transparent 10rem),
        #fff;
    box-shadow: 0 0 0 3px rgba(27,138,114,.11);
}

.vx-learning-pace-card__icon {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    margin-bottom: 18px;
    border-radius: 14px;
    color: #fff;
    background: var(--vx-brand-800);
}

.vx-learning-pace-card strong {
    margin-bottom: 7px;
    font-size: 1rem;
}

.vx-learning-pace-card small {
    color: var(--vx-ink-600);
    font-size: .78rem;
    line-height: 1.5;
}

.vx-minutes-picker {
    display: grid;
    gap: 12px;
}

.vx-minutes-picker > span {
    font-size: .8rem;
    font-weight: 850;
}

.vx-minutes-picker > div {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.vx-minutes-picker label {
    cursor: pointer;
}

.vx-minutes-picker input {
    position: absolute;
    opacity: 0;
}

.vx-minutes-picker label span {
    display: grid;
    place-items: center;
    width: 58px;
    height: 50px;
    border: 1px solid var(--vx-line-200);
    border-radius: 14px;
    background: #fff;
    font-weight: 900;
}

.vx-minutes-picker label:has(input:checked) span {
    color: #fff;
    border-color: var(--vx-brand-800);
    background: var(--vx-brand-800);
    box-shadow: 0 8px 20px rgba(13,92,78,.19);
}

.vx-onboarding-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: auto;
    padding-top: 30px;
}

.vx-onboarding-footer small {
    max-width: 420px;
    color: var(--vx-ink-600);
    font-size: .75rem;
    line-height: 1.5;
}

.auth-layout {
    border-radius: 30px;
}

.auth-story {
    background:
        radial-gradient(circle at 72% 8%, rgba(239,184,94,.25), transparent 20rem),
        linear-gradient(150deg, var(--green-950), var(--green-700));
}

.auth-card {
    max-width: 590px;
    padding: 48px;
}

.auth-card h1 {
    font-size: clamp(2.4rem,4vw,4rem);
}

.auth-card input {
    min-height: 54px;
    border-radius: 14px;
    background: #f9fbfa;
}

.auth-card input:focus {
    border-color: var(--vx-brand-600);
    background: #fff;
    outline: none;
    box-shadow: 0 0 0 4px rgba(27,138,114,.11);
}

@media (max-width: 980px) {
    .vx-onboarding-shell {
        grid-template-columns: 1fr;
    }

    .vx-onboarding-story {
        min-height: 310px;
        padding: 28px;
    }

    .vx-onboarding-story__copy {
        margin-top: 65px;
    }

    .vx-onboarding-story h1 {
        max-width: 760px;
        font-size: clamp(2.7rem,7vw,4.5rem);
    }

    .vx-onboarding-benefits,
    .vx-onboarding-orbit {
        display: none;
    }
}

@media (max-width: 680px) {
    .vx-onboarding-shell {
        min-height: 0;
        margin: -2px;
        overflow: visible;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .vx-onboarding-story {
        min-height: 250px;
        margin: -14px -12px 0;
        padding: calc(20px + env(safe-area-inset-top)) 20px 28px;
        border-radius: 0 0 28px 28px;
    }

    .vx-onboarding-logo img {
        width: 46px;
        height: 46px;
        border-radius: 14px;
    }

    .vx-onboarding-story__copy {
        margin-top: 40px;
    }

    .vx-onboarding-badge {
        font-size: .58rem;
    }

    .vx-onboarding-story h1 {
        max-width: 520px;
        margin: 14px 0 10px;
        font-size: clamp(2.4rem,13vw,3.45rem);
    }

    .vx-onboarding-story p {
        font-size: .9rem;
        line-height: 1.55;
    }

    .vx-onboarding-main {
        padding: 24px 7px 12px;
    }

    .vx-onboarding-head {
        padding: 0 4px 18px;
    }

    .vx-onboarding-progress i {
        width: 24px;
    }

    .vx-onboarding-form {
        margin-top: 24px;
    }

    .vx-onboarding-title {
        margin-bottom: 22px;
    }

    .vx-onboarding-title h2 {
        font-size: 2.1rem;
    }

    .vx-language-selection-grid,
    .vx-onboarding-fields,
    .vx-learning-pace-grid {
        grid-template-columns: 1fr;
    }

    .vx-language-arrow {
        width: 100%;
        height: 38px;
        transform: rotate(90deg);
    }

    .vx-learning-pace-card {
        min-height: 0;
        display: grid;
        grid-template-columns: auto minmax(0,1fr);
        gap: 4px 13px;
        padding: 16px;
    }

    .vx-learning-pace-card__icon {
        grid-row: 1 / 3;
        margin: 0;
    }

    .vx-learning-pace-card strong,
    .vx-learning-pace-card small {
        grid-column: 2;
    }

    .vx-onboarding-footer {
        position: sticky;
        bottom: calc(72px + env(safe-area-inset-bottom));
        z-index: 15;
        display: grid;
        margin: 24px -5px -6px;
        padding: 13px;
        border: 1px solid var(--vx-line-200);
        border-radius: 19px;
        background: rgba(255,255,255,.96);
        box-shadow: 0 -10px 30px rgba(7,59,51,.08);
        backdrop-filter: blur(18px);
    }

    .vx-onboarding-footer small {
        display: none;
    }

    .vx-onboarding-footer .vx-button {
        width: 100%;
    }

    .auth-card {
        padding: 24px 8px;
    }
}


.vx-learning-pace-card.is-selected {
    border-color: var(--vx-brand-600);
    background:
        radial-gradient(circle at 100% 0%, rgba(230,243,239,.95), transparent 10rem),
        #fff;
    box-shadow: 0 0 0 3px rgba(27,138,114,.11);
}

.vx-minutes-picker label.is-selected span {
    color: #fff;
    border-color: var(--vx-brand-800);
    background: var(--vx-brand-800);
    box-shadow: 0 8px 20px rgba(13,92,78,.19);
}


/* ================================================================
   VOYARA CORE 4.0 — PRICING, PREMIUM & ENTITLEMENTS
   ================================================================ */

.vx-button--gold {
    color: #17332c;
    border-color: transparent;
    background: linear-gradient(135deg, #f5cf7b, #d5a747);
    box-shadow: 0 10px 24px rgba(200,154,61,.22);
}

.vx-button:disabled {
    opacity: .62;
    cursor: default;
}

.vx-pricing-hero {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(300px,.55fr);
    align-items: end;
    gap: 30px;
    min-height: 310px;
    padding: clamp(30px,5vw,58px);
    border-radius: 32px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 10%, rgba(239,184,94,.35), transparent 22rem),
        radial-gradient(circle at 0% 120%, rgba(255,255,255,.09), transparent 22rem),
        linear-gradient(135deg, #073b33, #116a59);
    box-shadow: var(--vx-shadow-lg);
}

.vx-pricing-hero h1 {
    max-width: 880px;
    margin: 9px 0 14px;
    font-size: clamp(2.65rem,6vw,5.7rem);
    line-height: .94;
    letter-spacing: -.06em;
}

.vx-pricing-hero p {
    max-width: 760px;
    margin: 0;
    color: rgba(255,255,255,.72);
    font-size: 1.08rem;
    line-height: 1.7;
}

.vx-pricing-trust {
    display: grid;
    gap: 10px;
}

.vx-pricing-trust span {
    padding: 12px 14px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(255,255,255,.08);
    font-size: .78rem;
    font-weight: 800;
    line-height: 1.45;
}

.vx-pricing-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    align-items: stretch;
    gap: 16px;
    margin-top: 20px;
}

.vx-price-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 25px;
    border: 1px solid var(--vx-line-200);
    border-radius: 27px;
    background: #fff;
    box-shadow: 0 12px 36px rgba(7,59,51,.07);
}

.vx-price-card--featured {
    border-color: rgba(200,154,61,.55);
    background:
        radial-gradient(circle at 100% 0%, rgba(247,236,212,.95), transparent 15rem),
        #fff;
    box-shadow: 0 22px 58px rgba(7,59,51,.14);
    transform: translateY(-8px);
}

.vx-price-card__recommended {
    position: absolute;
    top: 15px;
    right: 15px;
    padding: 7px 10px;
    border-radius: 999px;
    color: #17332c;
    background: var(--vx-gold-100);
    font-size: .63rem;
    font-weight: 950;
    letter-spacing: .1em;
}

.vx-price-card header {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    min-height: 105px;
}

.vx-price-card__mark {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 48px;
    height: 48px;
    border-radius: 15px;
    color: #fff;
    background: var(--vx-brand-800);
    font-size: 1.05rem;
}

.vx-price-card--featured .vx-price-card__mark {
    color: #17332c;
    background: linear-gradient(135deg, #f5cf7b, #d5a747);
}

.vx-price-card h2 {
    margin: 2px 0 7px;
    font-size: 1.35rem;
}

.vx-price-card header p {
    margin: 0;
    color: var(--vx-ink-600);
    font-size: .82rem;
    line-height: 1.5;
}

.vx-price-card__price {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 18px 0 10px;
}

.vx-price-card__price strong {
    font-size: clamp(2.45rem,4vw,3.7rem);
    line-height: 1;
    letter-spacing: -.05em;
}

.vx-price-card__price small {
    color: var(--vx-ink-600);
    font-size: .78rem;
}

.vx-price-card__saving,
.vx-price-card__trial {
    min-height: 38px;
    padding: 9px 11px;
    border-radius: 12px;
    color: var(--vx-brand-800);
    background: var(--vx-brand-100);
    font-size: .72rem;
    font-weight: 850;
}

.vx-price-card__saving {
    color: #64480d;
    background: var(--vx-gold-100);
}

.vx-price-card ul {
    display: grid;
    gap: 10px;
    min-height: 190px;
    margin: 22px 0;
    padding: 0;
    list-style: none;
}

.vx-price-card li {
    color: var(--vx-ink-800);
    font-size: .82rem;
    line-height: 1.45;
}

.vx-price-card li.disabled {
    color: #97a39f;
}

.vx-price-card form,
.vx-price-card form .vx-button {
    width: 100%;
}

.vx-pricing-development-note {
    margin: 15px 0 0;
    padding: 12px 15px;
    border-radius: 14px;
    color: var(--vx-ink-600);
    background: #fff;
    text-align: center;
    font-size: .74rem;
}

.vx-plan-comparison,
.vx-pricing-faq {
    margin-top: 22px;
    padding: clamp(22px,4vw,38px);
    border: 1px solid var(--vx-line-200);
    border-radius: 28px;
    background: #fff;
    box-shadow: var(--vx-shadow-sm);
}

.vx-plan-comparison h2,
.vx-pricing-faq h2 {
    margin: 6px 0 22px;
    font-size: clamp(1.8rem,3vw,2.8rem);
}

.vx-comparison-table {
    display: grid;
    grid-template-columns: minmax(180px,1.35fr) repeat(3,minmax(110px,1fr));
    overflow: hidden;
    border: 1px solid var(--vx-line-200);
    border-radius: 18px;
}

.vx-comparison-table > div {
    min-height: 56px;
    padding: 16px;
    border-right: 1px solid var(--vx-line-200);
    border-bottom: 1px solid var(--vx-line-200);
    font-size: .79rem;
    text-align: center;
}

.vx-comparison-table > div:nth-child(4n) {
    border-right: 0;
}

.vx-comparison-table .head {
    color: #fff;
    background: var(--vx-brand-900);
    font-weight: 900;
}

.vx-comparison-table .feature {
    color: var(--vx-ink-800);
    background: var(--vx-brand-050);
    text-align: left;
    font-weight: 850;
}

.vx-pricing-faq details {
    border-top: 1px solid var(--vx-line-200);
}

.vx-pricing-faq summary {
    padding: 18px 0;
    font-weight: 850;
    cursor: pointer;
}

.vx-pricing-faq details p {
    max-width: 850px;
    margin: -5px 0 20px;
    color: var(--vx-ink-600);
    line-height: 1.65;
}

.vx-premium-label {
    display: inline-flex;
    width: fit-content;
    padding: 6px 9px;
    border-radius: 999px;
    color: #654910;
    background: var(--vx-gold-100);
    font-size: .62rem;
    font-weight: 950;
    letter-spacing: .09em;
}

.vx-world-card:has(.vx-premium-label) {
    border-color: rgba(200,154,61,.35);
    background:
        radial-gradient(circle at 100% 0%, rgba(247,236,212,.78), transparent 12rem),
        #fff;
}

.vx-world-card__lock {
    cursor: default;
}

.vx-subscription-mode {
    display: inline-flex;
    margin-top: 7px;
    padding: 7px 10px;
    border-radius: 999px;
    color: var(--vx-brand-800);
    background: var(--vx-brand-100);
    font-size: .68rem;
    font-weight: 800;
}

@media (max-width: 980px) {
    .vx-pricing-grid {
        grid-template-columns: 1fr;
    }

    .vx-price-card--featured {
        transform: none;
    }

    .vx-price-card header,
    .vx-price-card ul {
        min-height: 0;
    }
}

@media (max-width: 720px) {
    .vx-pricing-hero {
        grid-template-columns: 1fr;
        min-height: 0;
        padding: 28px 21px;
        border-radius: 24px;
    }

    .vx-pricing-hero h1 {
        font-size: clamp(2.55rem,13vw,4rem);
    }

    .vx-pricing-hero p {
        font-size: .94rem;
    }

    .vx-pricing-grid {
        gap: 12px;
        margin-top: 12px;
    }

    .vx-price-card {
        padding: 20px;
        border-radius: 23px;
    }

    .vx-plan-comparison,
    .vx-pricing-faq {
        margin-top: 12px;
        padding: 20px 16px;
        border-radius: 23px;
    }

    .vx-comparison-table {
        grid-template-columns: minmax(145px,1.2fr) repeat(3,minmax(86px,1fr));
        overflow-x: auto;
    }

    .vx-comparison-table > div {
        padding: 13px 8px;
        font-size: .68rem;
    }
}


/* ================================================================
   VOYARA CORE 4.1 — SUBSCRIPTION CENTER & PREMIUM JOURNEY
   ================================================================ */

.vx-subscription-hero {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    min-height: 245px;
    padding: clamp(28px,5vw,50px);
    border-radius: 30px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 12%, rgba(239,184,94,.30), transparent 20rem),
        linear-gradient(135deg, #073b33, #126c5a);
    box-shadow: var(--vx-shadow-md);
}

.vx-subscription-hero h1 {
    max-width: 760px;
    margin: 8px 0 12px;
    font-size: clamp(2.45rem,5vw,4.8rem);
    line-height: .96;
    letter-spacing: -.055em;
}

.vx-subscription-hero p {
    max-width: 720px;
    margin: 0;
    color: rgba(255,255,255,.72);
    line-height: 1.65;
}

.vx-subscription-status {
    flex: 0 0 auto;
    padding: 10px 14px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 999px;
    color: #fff;
    background: rgba(255,255,255,.10);
    font-size: .74rem;
    font-weight: 900;
    text-transform: uppercase;
}

.vx-subscription-status--trialing {
    color: #2a341c;
    background: #f5cf7b;
}

.vx-subscription-layout {
    display: grid;
    grid-template-columns: minmax(0,1.25fr) minmax(280px,.75fr);
    gap: 16px;
    margin-top: 18px;
}

.vx-current-plan-card,
.vx-subscription-next,
.vx-subscription-history {
    border: 1px solid var(--vx-line-200);
    border-radius: 27px;
    background: #fff;
    box-shadow: var(--vx-shadow-sm);
}

.vx-current-plan-card {
    padding: clamp(22px,4vw,36px);
}

.vx-current-plan-card header {
    display: flex;
    align-items: center;
    gap: 14px;
}

.vx-current-plan-card__icon {
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    border-radius: 18px;
    color: #17332c;
    background: linear-gradient(135deg, #f5cf7b, #d5a747);
    font-size: 1.3rem;
    box-shadow: 0 12px 25px rgba(200,154,61,.23);
}

.vx-current-plan-card header small,
.vx-current-plan-card header h2 {
    display: block;
}

.vx-current-plan-card header small {
    color: var(--vx-ink-600);
    font-size: .7rem;
    font-weight: 850;
    text-transform: uppercase;
}

.vx-current-plan-card header h2 {
    margin: 4px 0 0;
    font-size: 1.45rem;
}

.vx-current-plan-card__price {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 28px 0 20px;
}

.vx-current-plan-card__price strong {
    font-size: clamp(2.7rem,5vw,4.5rem);
    line-height: 1;
    letter-spacing: -.055em;
}

.vx-current-plan-card__price small {
    color: var(--vx-ink-600);
}

.vx-subscription-facts {
    display: grid;
    gap: 9px;
    margin-bottom: 24px;
}

.vx-subscription-facts span {
    padding: 11px 13px;
    border-radius: 13px;
    color: var(--vx-ink-800);
    background: var(--vx-page);
    font-size: .8rem;
    font-weight: 750;
}

.vx-subscription-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

.vx-subscription-actions form {
    margin: 0;
}

.vx-subscription-next {
    display: flex;
    flex-direction: column;
    padding: 28px;
    background:
        radial-gradient(circle at 100% 0%, rgba(247,236,212,.95), transparent 14rem),
        #fff;
}

.vx-subscription-next h2 {
    margin: 8px 0 10px;
    font-size: 1.8rem;
}

.vx-subscription-next p {
    margin: 0;
    color: var(--vx-ink-600);
    line-height: 1.65;
}

.vx-subscription-next__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin: 22px 0;
}

.vx-subscription-next__meta span {
    padding: 7px 9px;
    border-radius: 999px;
    color: var(--vx-brand-800);
    background: var(--vx-brand-100);
    font-size: .68rem;
    font-weight: 850;
}

.vx-subscription-next .vx-button {
    margin-top: auto;
}

.vx-subscription-history {
    margin-top: 16px;
    padding: clamp(22px,4vw,36px);
}

.vx-subscription-history h2 {
    margin: 6px 0 22px;
    font-size: clamp(1.8rem,3vw,2.7rem);
}

.vx-subscription-history__empty {
    padding: 28px;
    border-radius: 16px;
    color: var(--vx-ink-600);
    background: var(--vx-page);
    text-align: center;
}

.vx-subscription-timeline {
    display: grid;
    gap: 4px;
}

.vx-subscription-timeline article {
    display: grid;
    grid-template-columns: 18px minmax(0,1fr);
    gap: 12px;
    padding: 13px 0;
    border-bottom: 1px solid var(--vx-line-200);
}

.vx-subscription-timeline article > span {
    width: 10px;
    height: 10px;
    margin-top: 5px;
    border-radius: 50%;
    background: var(--vx-brand-600);
    box-shadow: 0 0 0 5px var(--vx-brand-100);
}

.vx-subscription-timeline strong,
.vx-subscription-timeline small {
    display: block;
}

.vx-subscription-timeline strong {
    font-size: .86rem;
}

.vx-subscription-timeline small {
    margin-top: 4px;
    color: var(--vx-ink-600);
    font-size: .7rem;
}

.vx-subscription-provider-note {
    margin: 22px 0 0;
    padding: 12px 14px;
    border-radius: 13px;
    color: var(--vx-ink-600);
    background: var(--vx-page);
    font-size: .73rem;
}

.vx-premium-preview-label {
    display: inline-flex;
    width: fit-content;
    margin-left: 5px;
    padding: 6px 9px;
    border-radius: 999px;
    color: var(--vx-ink-600);
    background: #edf1ef;
    font-size: .60rem;
    font-weight: 900;
    letter-spacing: .07em;
}

.vx-dashboard-premium-card {
    display: grid;
    grid-template-columns: auto minmax(0,1fr) auto;
    align-items: center;
    gap: 18px;
    margin: 18px 0;
    padding: 24px;
    border: 1px solid rgba(200,154,61,.36);
    border-radius: 25px;
    background:
        radial-gradient(circle at 100% 0%, rgba(247,236,212,.95), transparent 17rem),
        #fff;
    box-shadow: var(--vx-shadow-sm);
}

.vx-dashboard-premium-card__icon {
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    border-radius: 18px;
    color: #17332c;
    background: linear-gradient(135deg, #f5cf7b, #d5a747);
    font-size: 1.3rem;
}

.vx-dashboard-premium-card h2 {
    margin: 5px 0;
    font-size: 1.35rem;
}

.vx-dashboard-premium-card p {
    margin: 0;
    color: var(--vx-ink-600);
    line-height: 1.5;
}

@media (max-width: 820px) {
    .vx-subscription-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 680px) {
    .vx-subscription-hero {
        display: block;
        min-height: 0;
        padding: 27px 21px;
        border-radius: 24px;
    }

    .vx-subscription-hero h1 {
        font-size: clamp(2.45rem,13vw,3.8rem);
    }

    .vx-subscription-status {
        display: inline-flex;
        margin-top: 20px;
    }

    .vx-subscription-layout {
        gap: 11px;
        margin-top: 12px;
    }

    .vx-current-plan-card,
    .vx-subscription-next,
    .vx-subscription-history {
        border-radius: 22px;
    }

    .vx-subscription-actions {
        display: grid;
    }

    .vx-subscription-actions form,
    .vx-subscription-actions .vx-button {
        width: 100%;
    }

    .vx-dashboard-premium-card {
        grid-template-columns: auto minmax(0,1fr);
        gap: 13px;
        padding: 18px;
        border-radius: 21px;
    }

    .vx-dashboard-premium-card .vx-button {
        grid-column: 1 / -1;
        width: 100%;
    }
}


/* ================================================================
   VOYARA CORE 4.2 — UI FIXES & CHECKOUT
   ================================================================ */

.vx-button,
.vx-button:link,
.vx-button:visited,
.button,
.button:link,
.button:visited {
    text-decoration: none !important;
}

.language-switcher {
    flex: 0 0 auto;
    margin-right: max(0px, env(safe-area-inset-right));
}

.language-switcher a {
    text-decoration: none !important;
}

.vx-subscription-next {
    justify-content: flex-start;
}

.vx-subscription-next .vx-button {
    margin-top: 22px;
}

.vx-subscription-preview-list {
    display: grid;
    gap: 9px;
    margin-top: 20px;
    padding: 15px;
    border: 1px solid var(--vx-line-200);
    border-radius: 15px;
    background: rgba(255,255,255,.72);
}

.vx-subscription-preview-list strong {
    margin-bottom: 2px;
    font-size: .78rem;
}

.vx-subscription-preview-list span {
    color: var(--vx-ink-600);
    font-size: .73rem;
    line-height: 1.45;
}

.vx-checkout-shell {
    display: grid;
    grid-template-columns: minmax(0,1.25fr) minmax(320px,.75fr);
    gap: 18px;
}

.vx-checkout-main,
.vx-checkout-summary {
    border: 1px solid var(--vx-line-200);
    border-radius: 28px;
    background: #fff;
    box-shadow: var(--vx-shadow-sm);
}

.vx-checkout-main {
    padding: clamp(25px,5vw,46px);
}

.vx-checkout-main > h1 {
    margin: 8px 0 12px;
    font-size: clamp(2.5rem,5vw,4.8rem);
    line-height: .96;
    letter-spacing: -.055em;
}

.vx-checkout-main > p {
    max-width: 700px;
    margin: 0 0 25px;
    color: var(--vx-ink-600);
    line-height: 1.65;
}

.vx-checkout-plan {
    padding: 22px;
    border: 1px solid rgba(200,154,61,.36);
    border-radius: 22px;
    background:
        radial-gradient(circle at 100% 0%, rgba(247,236,212,.95), transparent 15rem),
        #fff;
}

.vx-checkout-plan header {
    display: flex;
    align-items: center;
    gap: 13px;
}

.vx-checkout-plan header > span {
    display: grid;
    place-items: center;
    width: 50px;
    height: 50px;
    border-radius: 16px;
    color: #17332c;
    background: linear-gradient(135deg,#f5cf7b,#d5a747);
    font-size: 1.1rem;
}

.vx-checkout-plan header small,
.vx-checkout-plan header h2 {
    display: block;
}

.vx-checkout-plan header small {
    color: var(--vx-ink-600);
    font-size: .69rem;
    font-weight: 850;
    text-transform: uppercase;
}

.vx-checkout-plan header h2 {
    margin: 4px 0 0;
    font-size: 1.3rem;
}

.vx-checkout-price {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin: 24px 0 12px;
}

.vx-checkout-price strong {
    font-size: clamp(2.6rem,5vw,4rem);
    line-height: 1;
    letter-spacing: -.05em;
}

.vx-checkout-price small {
    color: var(--vx-ink-600);
}

.vx-checkout-trial {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 14px;
    border-radius: 13px;
    color: var(--vx-brand-800);
    background: var(--vx-brand-100);
    font-size: .78rem;
    font-weight: 850;
}

.vx-checkout-trial small {
    color: var(--vx-ink-600);
    font-weight: 750;
}

.vx-checkout-methods {
    display: grid;
    gap: 10px;
    margin: 25px 0 0;
    padding: 0;
    border: 0;
}

.vx-checkout-methods legend {
    margin-bottom: 12px;
    font-size: .8rem;
    font-weight: 900;
}

.vx-checkout-methods label {
    cursor: pointer;
}

.vx-checkout-methods input {
    position: absolute;
    opacity: 0;
}

.vx-checkout-methods label > span {
    display: grid;
    grid-template-columns: auto minmax(0,1fr);
    gap: 3px 13px;
    padding: 15px;
    border: 1px solid var(--vx-line-200);
    border-radius: 16px;
    background: #fff;
}

.vx-checkout-methods label b {
    display: grid;
    grid-row: 1 / 3;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 13px;
    color: #fff;
    background: var(--vx-brand-800);
}

.vx-checkout-methods label strong {
    font-size: .86rem;
}

.vx-checkout-methods label small {
    color: var(--vx-ink-600);
    font-size: .7rem;
}

.vx-checkout-methods label.active > span {
    border-color: var(--vx-brand-600);
    box-shadow: 0 0 0 3px rgba(27,138,114,.10);
}

.vx-checkout-methods label.disabled {
    opacity: .48;
    cursor: not-allowed;
}

.vx-checkout-actions {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin-top: 25px;
}

.vx-checkout-summary {
    display: flex;
    flex-direction: column;
    padding: 30px;
    color: #fff;
    background:
        radial-gradient(circle at 100% 0%, rgba(239,184,94,.26), transparent 17rem),
        linear-gradient(145deg,#073b33,#116a59);
}

.vx-checkout-summary h2 {
    margin: 8px 0 12px;
    font-size: 2rem;
}

.vx-checkout-summary p {
    margin: 0;
    color: rgba(255,255,255,.72);
    line-height: 1.65;
}

.vx-checkout-summary ul {
    display: grid;
    gap: 11px;
    margin: 25px 0;
    padding: 0;
    list-style: none;
}

.vx-checkout-summary li {
    font-size: .82rem;
}

.vx-checkout-security {
    margin-top: auto;
    padding: 13px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 14px;
    background: rgba(255,255,255,.08);
    font-size: .72rem;
    line-height: 1.45;
}

@media (max-width: 860px) {
    .vx-checkout-shell {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 680px) {
    .topbar {
        overflow: visible;
    }

    .language-switcher {
        margin-right: 2px;
    }

    .vx-subscription-preview-list {
        margin-top: 16px;
    }

    .vx-checkout-main,
    .vx-checkout-summary {
        border-radius: 22px;
    }

    .vx-checkout-main {
        padding: 22px 18px;
    }

    .vx-checkout-main > h1 {
        font-size: clamp(2.4rem,13vw,3.7rem);
    }

    .vx-checkout-actions {
        display: grid;
    }

    .vx-checkout-actions .vx-button {
        width: 100%;
    }

    .vx-checkout-summary {
        padding: 24px 20px;
    }
}


/* ================================================================
   VOYARA CORE 4.3 — DAILY COACH, ACHIEVEMENTS & RETENTION
   ================================================================ */

.vx-dashboard-coach-card {
    display: grid;
    grid-template-columns: auto minmax(0,1fr) 120px auto;
    align-items: center;
    gap: 18px;
    margin: 18px 0;
    padding: 22px;
    border: 1px solid rgba(13,92,78,.16);
    border-radius: 24px;
    background:
        radial-gradient(circle at 100% 0%, rgba(230,243,239,.95), transparent 17rem),
        #fff;
    box-shadow: var(--vx-shadow-sm);
}

.vx-dashboard-coach-card__icon {
    display: grid;
    place-items: center;
    width: 56px;
    height: 56px;
    border-radius: 18px;
    color: #fff;
    background: linear-gradient(135deg,var(--vx-brand-900),var(--vx-brand-600));
    font-size: 1.25rem;
}

.vx-dashboard-coach-card h2 {
    margin: 5px 0;
    font-size: 1.3rem;
}

.vx-dashboard-coach-card p {
    margin: 0;
    color: var(--vx-ink-600);
    line-height: 1.5;
}

.vx-dashboard-coach-card__progress strong {
    display: block;
    margin-bottom: 7px;
    font-size: 1.1rem;
    text-align: right;
}

.vx-dashboard-coach-card__progress > div {
    height: 8px;
    overflow: hidden;
    border-radius: 999px;
    background: #e5ece9;
}

.vx-dashboard-coach-card__progress i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,var(--vx-brand-700),var(--vx-gold-500));
}

.vx-coach-hero {
    display: grid;
    grid-template-columns: minmax(0,1fr) 220px;
    align-items: end;
    gap: 28px;
    min-height: 285px;
    padding: clamp(30px,5vw,54px);
    border-radius: 31px;
    color: #fff;
    background:
        radial-gradient(circle at 90% 8%, rgba(239,184,94,.28), transparent 20rem),
        radial-gradient(circle at 8% 120%, rgba(255,255,255,.08), transparent 20rem),
        linear-gradient(135deg,#073b33,#137561);
    box-shadow: var(--vx-shadow-md);
}

.vx-coach-hero h1 {
    max-width: 820px;
    margin: 8px 0 13px;
    font-size: clamp(2.6rem,6vw,5.3rem);
    line-height: .95;
    letter-spacing: -.06em;
}

.vx-coach-hero p {
    max-width: 760px;
    margin: 0;
    color: rgba(255,255,255,.72);
    font-size: 1.02rem;
    line-height: 1.65;
}

.vx-coach-hero__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 23px;
}

.vx-coach-hero__meta span {
    padding: 8px 11px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 999px;
    background: rgba(255,255,255,.09);
    font-size: .72rem;
    font-weight: 850;
}

.vx-coach-goal {
    display: grid;
    place-items: center;
    min-height: 170px;
    padding: 24px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 24px;
    background: rgba(255,255,255,.10);
    backdrop-filter: blur(14px);
}

.vx-coach-goal strong {
    font-size: 2.7rem;
    line-height: 1;
}

.vx-coach-goal small {
    margin-top: 6px;
    color: rgba(255,255,255,.72);
    font-weight: 800;
}

.vx-coach-goal > div {
    width: 100%;
    height: 8px;
    margin-top: 18px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255,255,255,.18);
}

.vx-coach-goal i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,#fff,#f5cf7b);
}

.vx-coach-missions {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 14px;
    margin-top: 18px;
}

.vx-coach-missions article {
    display: flex;
    flex-direction: column;
    min-height: 300px;
    padding: 22px;
    border: 1px solid var(--vx-line-200);
    border-radius: 24px;
    background: #fff;
    box-shadow: var(--vx-shadow-sm);
}

.vx-coach-missions article.is-completed {
    border-color: rgba(25,114,83,.28);
    background:
        radial-gradient(circle at 100% 0%, rgba(227,245,236,.92), transparent 14rem),
        #fff;
}

.vx-coach-missions header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.vx-coach-missions header > span {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    border-radius: 15px;
    color: #fff;
    background: var(--vx-brand-800);
    font-size: 1.05rem;
}

.vx-coach-missions header small {
    color: var(--vx-ink-600);
    font-size: .68rem;
    font-weight: 850;
}

.vx-coach-missions h2 {
    margin: 20px 0 8px;
    font-size: 1.25rem;
}

.vx-coach-missions p {
    margin: 0;
    color: var(--vx-ink-600);
    font-size: .86rem;
    line-height: 1.55;
}

.vx-coach-mission-track {
    height: 7px;
    margin: auto 0 17px;
    overflow: hidden;
    border-radius: 999px;
    background: #e8efec;
}

.vx-coach-mission-track i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg,var(--vx-brand-700),var(--vx-gold-500));
}

.vx-coach-complete {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    border-radius: 13px;
    color: var(--vx-success);
    background: var(--vx-success-soft);
    font-size: .8rem;
    font-weight: 900;
}

.vx-coach-grid {
    display: grid;
    grid-template-columns: minmax(0,1.35fr) minmax(300px,.65fr);
    gap: 16px;
    margin-top: 16px;
}

.vx-achievement-panel,
.vx-reminder-panel {
    border: 1px solid var(--vx-line-200);
    border-radius: 26px;
    background: #fff;
    box-shadow: var(--vx-shadow-sm);
}

.vx-achievement-panel {
    padding: clamp(22px,4vw,34px);
}

.vx-achievement-panel h2,
.vx-reminder-panel h2 {
    margin: 6px 0 8px;
    font-size: 1.8rem;
}

.vx-achievement-panel header p,
.vx-reminder-panel > p {
    margin: 0;
    color: var(--vx-ink-600);
    line-height: 1.6;
}

.vx-achievement-grid {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    margin-top: 22px;
}

.vx-achievement-grid > div {
    display: grid;
    grid-template-columns: auto minmax(0,1fr);
    gap: 3px 12px;
    padding: 15px;
    border: 1px solid var(--vx-line-200);
    border-radius: 17px;
    opacity: .55;
    background: #fafcfb;
}

.vx-achievement-grid > div.is-unlocked {
    opacity: 1;
    border-color: rgba(200,154,61,.38);
    background:
        radial-gradient(circle at 100% 0%, rgba(247,236,212,.88), transparent 9rem),
        #fff;
}

.vx-achievement-grid > div > span {
    display: grid;
    grid-row: 1 / 4;
    place-items: center;
    width: 43px;
    height: 43px;
    border-radius: 14px;
    color: #17332c;
    background: var(--vx-gold-100);
    font-size: 1rem;
}

.vx-achievement-grid strong {
    font-size: .84rem;
}

.vx-achievement-grid small {
    color: var(--vx-ink-600);
    font-size: .69rem;
    line-height: 1.45;
}

.vx-achievement-grid b {
    color: var(--vx-brand-700);
    font-size: .62rem;
    text-transform: uppercase;
}

.vx-reminder-panel {
    display: flex;
    flex-direction: column;
    padding: 28px;
    background:
        radial-gradient(circle at 100% 0%, rgba(230,243,239,.9), transparent 13rem),
        #fff;
}

.vx-reminder-panel form {
    display: grid;
    gap: 15px;
    margin: 24px 0 16px;
}

.vx-reminder-toggle {
    display: grid;
    grid-template-columns: auto minmax(0,1fr);
    align-items: center;
    gap: 11px;
    cursor: pointer;
}

.vx-reminder-toggle input {
    position: absolute;
    opacity: 0;
}

.vx-reminder-toggle > span {
    position: relative;
    width: 48px;
    height: 28px;
    border-radius: 999px;
    background: #d9e3df;
    transition: background var(--vx-ease);
}

.vx-reminder-toggle > span::after {
    content: "";
    position: absolute;
    top: 4px;
    left: 4px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 3px 8px rgba(0,0,0,.15);
    transition: transform var(--vx-ease);
}

.vx-reminder-toggle input:checked + span {
    background: var(--vx-brand-700);
}

.vx-reminder-toggle input:checked + span::after {
    transform: translateX(20px);
}

.vx-reminder-panel > small {
    margin-top: auto;
    color: var(--vx-ink-600);
    font-size: .7rem;
    line-height: 1.5;
}

@media (max-width: 980px) {
    .vx-coach-missions {
        grid-template-columns: 1fr;
    }

    .vx-coach-grid {
        grid-template-columns: 1fr;
    }

    .vx-coach-missions article {
        min-height: 0;
    }

    .vx-coach-mission-track {
        margin-top: 22px;
    }
}

@media (max-width: 760px) {
    .vx-dashboard-coach-card {
        grid-template-columns: auto minmax(0,1fr);
        gap: 13px;
        padding: 18px;
        border-radius: 21px;
    }

    .vx-dashboard-coach-card__progress,
    .vx-dashboard-coach-card .vx-button {
        grid-column: 1 / -1;
        width: 100%;
    }

    .vx-coach-hero {
        grid-template-columns: 1fr;
        min-height: 0;
        padding: 27px 21px;
        border-radius: 24px;
    }

    .vx-coach-hero h1 {
        font-size: clamp(2.45rem,13vw,3.8rem);
    }

    .vx-coach-goal {
        min-height: 120px;
    }

    .vx-achievement-grid {
        grid-template-columns: 1fr;
    }

    .vx-achievement-panel,
    .vx-reminder-panel {
        border-radius: 22px;
    }
}


/* ================================================================
   VOYARA CORE 4.4 — SMART REVIEW & SPACED REPETITION
   ================================================================ */

.vx-dashboard-review-card {
    display: grid;
    grid-template-columns: auto minmax(0,1fr) auto auto;
    align-items: center;
    gap: 16px;
    margin: 18px 0;
    padding: 21px;
    border: 1px solid rgba(53,111,141,.22);
    border-radius: 23px;
    background:
        radial-gradient(circle at 100% 0%, rgba(224,238,246,.86), transparent 16rem),
        #fff;
    box-shadow: var(--vx-shadow-sm);
}

.vx-dashboard-review-card__icon {
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    border-radius: 17px;
    color: #fff;
    background: linear-gradient(135deg,#285c77,#4f8fac);
    font-size: 1.25rem;
}

.vx-dashboard-review-card h2 {
    margin: 5px 0;
    font-size: 1.25rem;
}

.vx-dashboard-review-card p {
    margin: 0;
    color: var(--vx-ink-600);
    line-height: 1.5;
}

.vx-dashboard-review-card > strong {
    display: grid;
    place-items: center;
    min-width: 48px;
    height: 48px;
    border-radius: 15px;
    color: #285c77;
    background: #e4f0f5;
    font-size: 1.2rem;
}

.vx-review-hero {
    display: grid;
    grid-template-columns: minmax(0,1fr) 180px;
    align-items: end;
    gap: 28px;
    min-height: 275px;
    padding: clamp(30px,5vw,54px);
    border-radius: 31px;
    color: #fff;
    background:
        radial-gradient(circle at 90% 10%, rgba(116,177,205,.24), transparent 20rem),
        radial-gradient(circle at 4% 120%, rgba(255,255,255,.07), transparent 18rem),
        linear-gradient(135deg,#123f52,#226c82);
    box-shadow: var(--vx-shadow-md);
}

.vx-review-hero h1 {
    max-width: 850px;
    margin: 8px 0 13px;
    font-size: clamp(2.65rem,6vw,5.3rem);
    line-height: .95;
    letter-spacing: -.06em;
}

.vx-review-hero p {
    max-width: 740px;
    margin: 0;
    color: rgba(255,255,255,.72);
    font-size: 1.02rem;
    line-height: 1.65;
}

.vx-review-hero__count {
    display: grid;
    place-items: center;
    min-height: 150px;
    padding: 22px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 24px;
    background: rgba(255,255,255,.10);
    backdrop-filter: blur(14px);
}

.vx-review-hero__count strong {
    font-size: 3rem;
    line-height: 1;
}

.vx-review-hero__count small {
    margin-top: 7px;
    color: rgba(255,255,255,.72);
    font-weight: 800;
}

.vx-review-kpis {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 12px;
    margin-top: 16px;
}

.vx-review-kpis article {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 17px;
    border: 1px solid var(--vx-line-200);
    border-radius: 19px;
    background: #fff;
    box-shadow: var(--vx-shadow-sm);
}

.vx-review-kpis article > span {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 13px;
    color: #fff;
    background: #356f8d;
    font-weight: 900;
}

.vx-review-kpis small,
.vx-review-kpis strong {
    display: block;
}

.vx-review-kpis small {
    color: var(--vx-ink-600);
    font-size: .69rem;
    font-weight: 800;
}

.vx-review-kpis strong {
    margin-top: 3px;
    font-size: 1.25rem;
}

.vx-review-layout {
    display: grid;
    grid-template-columns: minmax(0,1.4fr) minmax(280px,.6fr);
    gap: 16px;
    margin-top: 16px;
}

.vx-review-queue,
.vx-review-insight,
.vx-review-empty {
    border: 1px solid var(--vx-line-200);
    border-radius: 26px;
    background: #fff;
    box-shadow: var(--vx-shadow-sm);
}

.vx-review-queue {
    padding: clamp(22px,4vw,34px);
}

.vx-review-queue h2 {
    margin: 6px 0 8px;
    font-size: 1.8rem;
}

.vx-review-queue header p {
    margin: 0;
    color: var(--vx-ink-600);
    line-height: 1.6;
}

.vx-review-list {
    display: grid;
    gap: 9px;
    margin-top: 22px;
}

.vx-review-list article {
    display: grid;
    grid-template-columns: auto minmax(0,1fr) auto auto;
    align-items: center;
    gap: 13px;
    padding: 14px;
    border: 1px solid var(--vx-line-200);
    border-radius: 17px;
    background: #fbfdfc;
}

.vx-review-list__icon {
    display: grid;
    place-items: center;
    width: 45px;
    height: 45px;
    border-radius: 14px;
    color: #fff;
    background: #356f8d;
    font-weight: 900;
}

.vx-review-list__copy {
    min-width: 0;
}

.vx-review-list__copy small,
.vx-review-list__copy strong,
.vx-review-list__copy span {
    display: block;
}

.vx-review-list__copy small {
    color: var(--vx-brand-700);
    font-size: .62rem;
    font-weight: 900;
    text-transform: uppercase;
}

.vx-review-list__copy strong {
    margin-top: 4px;
    overflow: hidden;
    font-size: .84rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.vx-review-list__copy span {
    margin-top: 3px;
    overflow: hidden;
    color: var(--vx-ink-600);
    font-size: .75rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.vx-review-list__status {
    display: grid;
    justify-items: end;
    gap: 5px;
}

.vx-review-list__status b {
    padding: 6px 8px;
    border-radius: 999px;
    font-size: .6rem;
    text-transform: uppercase;
}

.vx-review-list__status b.overdue {
    color: var(--vx-danger);
    background: var(--vx-danger-soft);
}

.vx-review-list__status b.due {
    color: #285c77;
    background: #e4f0f5;
}

.vx-review-list__status b.later {
    color: var(--vx-ink-600);
    background: #edf1ef;
}

.vx-review-list__status small {
    color: var(--vx-ink-600);
    font-size: .64rem;
}

.vx-review-insight {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 28px;
    text-align: center;
    background:
        radial-gradient(circle at 100% 0%, rgba(224,238,246,.92), transparent 14rem),
        #fff;
}

.vx-review-insight h2 {
    margin: 6px 0 20px;
    font-size: 1.6rem;
}

.vx-review-insight__ring {
    --value: 0;
    display: grid;
    place-items: center;
    width: 156px;
    height: 156px;
    border-radius: 50%;
    background:
        radial-gradient(circle at center,#fff 59%,transparent 60%),
        conic-gradient(
            #356f8d calc(var(--value) * 1%),
            #e4ecef 0
        );
}

.vx-review-insight__ring strong {
    font-size: 2rem;
}

.vx-review-insight p {
    margin: 22px 0;
    color: var(--vx-ink-600);
    line-height: 1.6;
}

.vx-review-insight .vx-button {
    margin-top: auto;
}

.vx-review-empty {
    margin-top: 16px;
    padding: 70px 24px;
    text-align: center;
}

.vx-review-empty > span {
    display: grid;
    place-items: center;
    width: 68px;
    height: 68px;
    margin: 0 auto;
    border-radius: 22px;
    color: var(--vx-success);
    background: var(--vx-success-soft);
    font-size: 1.5rem;
}

.vx-review-empty h2 {
    margin: 18px 0 8px;
}

.vx-review-empty p {
    margin: 0 auto 22px;
    max-width: 580px;
    color: var(--vx-ink-600);
}

.vx-review-item-shell {
    width: min(850px,100%);
    margin: 0 auto;
}

.vx-review-item-shell > header {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 16px;
}

.vx-review-item-shell > header > a {
    display: grid;
    place-items: center;
    width: 45px;
    height: 45px;
    border: 1px solid var(--vx-line-200);
    border-radius: 14px;
    background: #fff;
    text-decoration: none;
}

.vx-review-item-shell > header small {
    display: block;
    margin-top: 3px;
    color: var(--vx-ink-600);
}

.vx-review-flashcard {
    display: grid;
    gap: 18px;
    min-height: 440px;
    padding: clamp(26px,6vw,54px);
    border: 1px solid var(--vx-line-200);
    border-radius: 30px;
    background:
        radial-gradient(circle at 100% 0%, rgba(224,238,246,.80), transparent 20rem),
        #fff;
    box-shadow: var(--vx-shadow-md);
}

.vx-review-flashcard__source small,
.vx-review-flashcard__answer small {
    color: var(--vx-brand-700);
    font-size: .67rem;
    font-weight: 900;
    letter-spacing: .1em;
}

.vx-review-flashcard h1 {
    margin: 12px 0 0;
    font-size: clamp(2.2rem,5vw,4.3rem);
    line-height: 1.04;
    letter-spacing: -.045em;
}

.vx-review-flashcard > button {
    align-self: center;
    justify-self: center;
    min-height: 50px;
    padding: 12px 20px;
    border: 0;
    border-radius: 14px;
    color: #fff;
    background: #356f8d;
    font-weight: 900;
    cursor: pointer;
}

.vx-review-flashcard__answer {
    padding-top: 22px;
    border-top: 1px solid var(--vx-line-200);
}

.vx-review-flashcard__answer h2 {
    margin: 10px 0 7px;
    font-size: clamp(1.7rem,4vw,3rem);
}

.vx-review-flashcard__answer p {
    margin: 0;
    color: var(--vx-ink-600);
}

.vx-review-rating {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 9px;
    margin-top: 13px;
}

.vx-review-rating button {
    display: grid;
    place-items: center;
    min-height: 78px;
    padding: 10px;
    border: 1px solid var(--vx-line-200);
    border-radius: 17px;
    background: #fff;
    cursor: pointer;
}

.vx-review-rating button:hover {
    border-color: #356f8d;
    background: #f3f8fa;
}

.vx-review-rating span,
.vx-review-rating strong {
    display: block;
}

.vx-review-rating span {
    font-size: 1.1rem;
}

.vx-review-rating strong {
    margin-top: 5px;
    font-size: .75rem;
}

.vx-review-item-meta {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: 13px;
}

.vx-review-item-meta span {
    padding: 7px 10px;
    border-radius: 999px;
    color: var(--vx-ink-600);
    background: #fff;
    font-size: .68rem;
    font-weight: 800;
}

@media (max-width: 980px) {
    .vx-review-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .vx-dashboard-review-card {
        grid-template-columns: auto minmax(0,1fr);
        gap: 12px;
        padding: 18px;
        border-radius: 21px;
    }

    .vx-dashboard-review-card > strong {
        display: none;
    }

    .vx-dashboard-review-card .vx-button {
        grid-column: 1 / -1;
        width: 100%;
    }

    .vx-review-hero {
        grid-template-columns: 1fr;
        min-height: 0;
        padding: 27px 21px;
        border-radius: 24px;
    }

    .vx-review-hero h1 {
        font-size: clamp(2.45rem,13vw,3.8rem);
    }

    .vx-review-hero__count {
        min-height: 105px;
    }

    .vx-review-kpis {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .vx-review-list article {
        grid-template-columns: auto minmax(0,1fr);
    }

    .vx-review-list__status,
    .vx-review-list article .vx-button {
        grid-column: 1 / -1;
        width: 100%;
    }

    .vx-review-list__status {
        grid-template-columns: auto auto;
        justify-content: space-between;
    }

    .vx-review-rating {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .vx-review-flashcard {
        min-height: 380px;
        padding: 24px 20px;
        border-radius: 24px;
    }
}


/* ================================================================
   VOYARA CORE 4.5 — OFFLINE LEARNING PACKS
   ================================================================ */

.vx-dashboard-offline-card {
    display: grid;
    grid-template-columns: auto minmax(0,1fr) auto;
    align-items: center;
    gap: 16px;
    margin: 18px 0;
    padding: 21px;
    border: 1px solid rgba(58,104,76,.20);
    border-radius: 23px;
    background:
        radial-gradient(circle at 100% 0%, rgba(228,241,230,.92), transparent 16rem),
        #fff;
    box-shadow: var(--vx-shadow-sm);
}

.vx-dashboard-offline-card__icon {
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    border-radius: 17px;
    color: #fff;
    background: linear-gradient(135deg,#315f42,#62906f);
    font-size: 1.25rem;
}

.vx-dashboard-offline-card h2 {
    margin: 5px 0;
    font-size: 1.25rem;
}

.vx-dashboard-offline-card p {
    margin: 0;
    color: var(--vx-ink-600);
    line-height: 1.5;
}

.vx-offline-hero {
    display: grid;
    grid-template-columns: minmax(0,1fr) 220px;
    align-items: center;
    gap: 30px;
    min-height: 285px;
    padding: clamp(30px,5vw,54px);
    border-radius: 31px;
    color: #fff;
    background:
        radial-gradient(circle at 90% 10%, rgba(143,197,159,.27), transparent 21rem),
        radial-gradient(circle at 3% 120%, rgba(255,255,255,.07), transparent 18rem),
        linear-gradient(135deg,#173f2d,#347253);
    box-shadow: var(--vx-shadow-md);
}

.vx-offline-hero h1 {
    max-width: 850px;
    margin: 8px 0 13px;
    font-size: clamp(2.65rem,6vw,5.25rem);
    line-height: .95;
    letter-spacing: -.06em;
}

.vx-offline-hero p {
    max-width: 740px;
    margin: 0;
    color: rgba(255,255,255,.72);
    font-size: 1.02rem;
    line-height: 1.65;
}

.vx-offline-hero__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 22px;
}

.vx-offline-hero__meta span {
    padding: 8px 11px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 999px;
    background: rgba(255,255,255,.09);
    font-size: .72rem;
    font-weight: 850;
}

.vx-offline-signal {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 8px;
    min-height: 150px;
    padding: 25px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 25px;
    background: rgba(255,255,255,.10);
    backdrop-filter: blur(14px);
}

.vx-offline-signal span {
    width: 18px;
    border-radius: 7px 7px 3px 3px;
    background: rgba(255,255,255,.82);
}

.vx-offline-signal span:nth-child(1){height:28px}
.vx-offline-signal span:nth-child(2){height:48px}
.vx-offline-signal span:nth-child(3){height:70px}
.vx-offline-signal span:nth-child(4){height:95px}

.vx-offline-signal b {
    position: absolute;
    right: 24px;
    top: 22px;
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    color: #21472f;
    background: #d8f0df;
}

.vx-offline-note {
    margin: 14px 0;
    padding: 12px 15px;
    border-radius: 14px;
    color: var(--vx-ink-600);
    background: #fff;
    font-size: .73rem;
    line-height: 1.5;
    text-align: center;
}

.vx-offline-grid {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 14px;
}

.vx-offline-grid article {
    display: flex;
    flex-direction: column;
    min-height: 330px;
    padding: 21px;
    border: 1px solid var(--vx-line-200);
    border-radius: 23px;
    background: #fff;
    box-shadow: var(--vx-shadow-sm);
}

.vx-offline-grid article.is-premium {
    border-color: rgba(200,154,61,.34);
    background:
        radial-gradient(circle at 100% 0%, rgba(247,236,212,.78), transparent 12rem),
        #fff;
}

.vx-offline-grid header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.vx-offline-pack-icon {
    display: grid;
    place-items: center;
    width: 49px;
    height: 49px;
    border-radius: 15px;
    color: #fff;
    background: #315f42;
    font-weight: 900;
}

.vx-offline-pack-tier {
    padding: 6px 9px;
    border-radius: 999px;
    color: var(--vx-brand-800);
    background: var(--vx-brand-100);
    font-size: .61rem;
    font-weight: 900;
    text-transform: uppercase;
}

.vx-offline-grid article.is-premium .vx-offline-pack-tier {
    color: #654910;
    background: var(--vx-gold-100);
}

.vx-offline-grid h2 {
    margin: 19px 0 8px;
    font-size: 1.2rem;
}

.vx-offline-grid p {
    margin: 0;
    color: var(--vx-ink-600);
    font-size: .82rem;
    line-height: 1.55;
}

.vx-offline-pack-meta {
    display: flex;
    gap: 8px;
    margin-top: auto;
    padding-top: 20px;
}

.vx-offline-pack-meta span {
    padding: 6px 8px;
    border-radius: 999px;
    color: var(--vx-ink-600);
    background: var(--vx-page);
    font-size: .64rem;
    font-weight: 800;
}

.vx-offline-pack-status {
    margin: 12px 0;
}

.vx-offline-pack-status b {
    display: inline-flex;
    padding: 7px 9px;
    border-radius: 999px;
    color: var(--vx-ink-600);
    background: #edf1ef;
    font-size: .65rem;
}

.vx-offline-pack-status b.ready {
    color: var(--vx-success);
    background: var(--vx-success-soft);
}

.vx-offline-pack-status b.outdated {
    color: #8d6115;
    background: #fff1d6;
}

.vx-offline-pack-status b.locked {
    color: #654910;
    background: var(--vx-gold-100);
}

.vx-offline-grid form,
.vx-offline-grid .vx-button {
    width: 100%;
}

@media (max-width: 1050px) {
    .vx-offline-grid {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 760px) {
    .vx-dashboard-offline-card {
        grid-template-columns: auto minmax(0,1fr);
        gap: 12px;
        padding: 18px;
        border-radius: 21px;
    }

    .vx-dashboard-offline-card .vx-button {
        grid-column: 1 / -1;
        width: 100%;
    }

    .vx-offline-hero {
        grid-template-columns: 1fr;
        min-height: 0;
        padding: 27px 21px;
        border-radius: 24px;
    }

    .vx-offline-hero h1 {
        font-size: clamp(2.45rem,13vw,3.8rem);
    }

    .vx-offline-signal {
        min-height: 110px;
    }

    .vx-offline-grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .vx-offline-grid article {
        min-height: 0;
        border-radius: 21px;
    }
}

.vx-dashboard-app-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;margin:18px 0;padding:21px;border:1px solid #dfe3f2;border-radius:23px;background:#fff;box-shadow:var(--vx-shadow-sm)}
.vx-dashboard-app-card__icon{display:grid;place-items:center;width:54px;height:54px;border-radius:17px;color:#fff;background:#53669d}
.vx-dashboard-app-card h2{margin:5px 0}.vx-dashboard-app-card p{margin:0;color:var(--vx-ink-600)}
.vx-appcenter-hero{display:grid;grid-template-columns:1fr 180px;align-items:center;gap:25px;padding:45px;border-radius:30px;color:#fff;background:linear-gradient(135deg,#25345f,#53669d)}
.vx-appcenter-hero h1{font-size:clamp(2.5rem,6vw,5rem);line-height:.96;margin:8px 0}.vx-appcenter-hero p{color:#ffffffbb}
.vx-phone-preview{display:grid;place-items:center;height:220px;border:8px solid #fff;border-radius:30px;background:#0b4f43}.vx-phone-preview i{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#fff;color:#25345f}
.vx-device-diagnostics{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:16px 0}.vx-device-diagnostics article{display:grid;grid-template-columns:auto 1fr;gap:3px 10px;padding:15px;border:1px solid var(--vx-line-200);border-radius:18px;background:#fff}.vx-device-diagnostics article>span{grid-row:1/3;display:grid;place-items:center;width:40px;height:40px;border-radius:13px;color:#fff;background:#53669d}
.vx-appcenter-actions{display:flex;gap:9px;margin-bottom:16px}.vx-notification-preferences{padding:28px;border:1px solid var(--vx-line-200);border-radius:24px;background:#fff}.vx-notification-preferences form{display:grid;gap:12px;margin-top:20px}.vx-setting-switch{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:10px}.vx-setting-switch input{position:absolute;opacity:0}.vx-setting-switch span{width:46px;height:27px;border-radius:999px;background:#ddd;position:relative}.vx-setting-switch span:after{content:'';position:absolute;width:19px;height:19px;top:4px;left:4px;border-radius:50%;background:#fff}.vx-setting-switch input:checked+span{background:#53669d}.vx-setting-switch input:checked+span:after{transform:translateX(19px)}
@media(max-width:760px){.vx-dashboard-app-card{grid-template-columns:auto 1fr}.vx-dashboard-app-card .vx-button{grid-column:1/-1;width:100%}.vx-appcenter-hero{grid-template-columns:1fr;padding:25px 20px}.vx-device-diagnostics{grid-template-columns:1fr}.vx-appcenter-actions{display:grid}.vx-appcenter-actions .vx-button{width:100%}}


/* ================================================================
   VOYARA CORE 4.7 — CONVERSATION TRAINER
   ================================================================ */

.vx-dashboard-dialogue-card {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:16px;
    margin:18px 0;
    padding:21px;
    border:1px solid rgba(130,88,141,.20);
    border-radius:23px;
    background:
        radial-gradient(circle at 100% 0%,rgba(244,233,248,.90),transparent 16rem),
        #fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-dashboard-dialogue-card__icon {
    display:grid;
    place-items:center;
    width:54px;
    height:54px;
    border-radius:17px;
    color:#fff;
    background:linear-gradient(135deg,#704b7a,#9d72a9);
    font-size:1.25rem;
}

.vx-dashboard-dialogue-card h2 {
    margin:5px 0;
    font-size:1.25rem;
}

.vx-dashboard-dialogue-card p {
    margin:0;
    color:var(--vx-ink-600);
    line-height:1.5;
}

.vx-dialogue-hero {
    display:grid;
    grid-template-columns:minmax(0,1fr) 230px;
    align-items:center;
    gap:30px;
    min-height:290px;
    padding:clamp(30px,5vw,54px);
    border-radius:31px;
    color:#fff;
    background:
        radial-gradient(circle at 88% 10%,rgba(218,174,230,.27),transparent 21rem),
        linear-gradient(135deg,#4a3152,#80518a);
    box-shadow:var(--vx-shadow-md);
}

.vx-dialogue-hero h1 {
    max-width:880px;
    margin:8px 0 13px;
    font-size:clamp(2.65rem,6vw,5.2rem);
    line-height:.95;
    letter-spacing:-.06em;
}

.vx-dialogue-hero p {
    max-width:760px;
    margin:0;
    color:rgba(255,255,255,.74);
    font-size:1.02rem;
    line-height:1.65;
}

.vx-dialogue-hero__visual {
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:150px;
    padding:25px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:25px;
    background:rgba(255,255,255,.10);
    backdrop-filter:blur(14px);
}

.vx-dialogue-hero__visual span {
    display:grid;
    place-items:center;
    width:60px;
    height:60px;
    border-radius:20px;
    color:#4a3152;
    background:#fff;
    font-weight:900;
}

.vx-dialogue-hero__visual i {
    width:38px;
    height:3px;
    background:rgba(255,255,255,.6);
}

.vx-dialogue-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
    margin-top:16px;
}

.vx-dialogue-grid article {
    display:flex;
    flex-direction:column;
    min-height:330px;
    padding:22px;
    border:1px solid var(--vx-line-200);
    border-radius:23px;
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-dialogue-grid article.is-premium {
    border-color:rgba(200,154,61,.35);
    background:
        radial-gradient(circle at 100% 0%,rgba(247,236,212,.82),transparent 13rem),
        #fff;
}

.vx-dialogue-grid header {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.vx-dialogue-grid header>span {
    display:grid;
    place-items:center;
    width:50px;
    height:50px;
    border-radius:16px;
    color:#fff;
    background:#704b7a;
    font-size:1.1rem;
}

.vx-dialogue-grid header div {
    display:grid;
    justify-items:end;
    gap:5px;
}

.vx-dialogue-grid header small,
.vx-dialogue-grid header b {
    padding:6px 8px;
    border-radius:999px;
    font-size:.61rem;
    text-transform:uppercase;
}

.vx-dialogue-grid header small {
    color:#704b7a;
    background:#f2e7f5;
    font-weight:900;
}

.vx-dialogue-grid header b {
    color:#654910;
    background:var(--vx-gold-100);
}

.vx-dialogue-grid h2 {
    margin:20px 0 8px;
    font-size:1.3rem;
}

.vx-dialogue-grid p {
    margin:0;
    color:var(--vx-ink-600);
    line-height:1.6;
}

.vx-dialogue-meta {
    display:flex;
    gap:8px;
    margin:auto 0 16px;
    padding-top:20px;
}

.vx-dialogue-meta span {
    padding:6px 8px;
    border-radius:999px;
    color:var(--vx-ink-600);
    background:var(--vx-page);
    font-size:.65rem;
    font-weight:800;
}

.vx-dialogue-history {
    margin-top:16px;
    padding:28px;
    border:1px solid var(--vx-line-200);
    border-radius:25px;
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-dialogue-history h2 {
    margin:6px 0 18px;
}

.vx-dialogue-history>p {
    color:var(--vx-ink-600);
}

.vx-dialogue-history>div {
    display:grid;
    gap:8px;
}

.vx-dialogue-history article {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:12px;
    padding:13px;
    border-radius:15px;
    background:var(--vx-page);
}

.vx-dialogue-history article>span {
    display:grid;
    place-items:center;
    width:42px;
    height:42px;
    border-radius:13px;
    color:#fff;
    background:#704b7a;
}

.vx-dialogue-history strong,
.vx-dialogue-history small {
    display:block;
}

.vx-dialogue-history small {
    margin-top:3px;
    color:var(--vx-ink-600);
}

.vx-dialogue-play {
    width:min(900px,100%);
    margin:0 auto;
}

.vx-dialogue-play>header {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:13px;
    margin-bottom:13px;
}

.vx-dialogue-play>header>a {
    display:grid;
    place-items:center;
    width:44px;
    height:44px;
    border:1px solid var(--vx-line-200);
    border-radius:14px;
    background:#fff;
    text-decoration:none;
}

.vx-dialogue-play>header small {
    display:block;
    margin-top:3px;
    color:var(--vx-ink-600);
}

.vx-dialogue-progress {
    height:8px;
    margin-bottom:15px;
    overflow:hidden;
    border-radius:999px;
    background:#e9e0ec;
}

.vx-dialogue-progress i {
    display:block;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,#704b7a,#d5a747);
}

.vx-dialogue-message {
    padding:clamp(28px,6vw,58px);
    border-radius:28px;
    color:#fff;
    background:
        radial-gradient(circle at 100% 0%,rgba(220,174,232,.25),transparent 18rem),
        linear-gradient(135deg,#4a3152,#80518a);
    box-shadow:var(--vx-shadow-md);
}

.vx-dialogue-message>span {
    display:inline-grid;
    place-items:center;
    width:42px;
    height:42px;
    border-radius:14px;
    color:#4a3152;
    background:#fff;
    font-weight:900;
}

.vx-dialogue-message h1 {
    margin:22px 0 10px;
    font-size:clamp(2.1rem,5vw,4.3rem);
    line-height:1.02;
    letter-spacing:-.045em;
}

.vx-dialogue-message p {
    margin:0;
    color:rgba(255,255,255,.72);
    font-size:1rem;
}

.vx-dialogue-options {
    margin-top:15px;
    padding:24px;
    border:1px solid var(--vx-line-200);
    border-radius:24px;
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-dialogue-options h2 {
    margin:0 0 15px;
}

.vx-dialogue-options form {
    display:grid;
    gap:9px;
}

.vx-dialogue-options button {
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    align-items:center;
    gap:13px;
    width:100%;
    padding:15px;
    border:1px solid var(--vx-line-200);
    border-radius:16px;
    background:#fff;
    text-align:left;
    cursor:pointer;
}

.vx-dialogue-options button:hover {
    border-color:#704b7a;
    background:#faf6fb;
}

.vx-dialogue-options button>span {
    display:grid;
    place-items:center;
    width:38px;
    height:38px;
    border-radius:12px;
    color:#704b7a;
    background:#f2e7f5;
    font-weight:900;
}

.vx-dialogue-options strong,
.vx-dialogue-options small {
    display:block;
}

.vx-dialogue-options small {
    margin-top:4px;
    color:var(--vx-ink-600);
}

.vx-dialogue-hint {
    display:flex;
    gap:10px;
    margin-top:12px;
    padding:14px;
    border-radius:15px;
    color:#654910;
    background:var(--vx-gold-100);
}

.vx-dialogue-feedback,
.vx-dialogue-result {
    width:min(760px,100%);
    margin:0 auto;
    padding:clamp(30px,6vw,58px);
    border:1px solid var(--vx-line-200);
    border-radius:29px;
    background:#fff;
    box-shadow:var(--vx-shadow-md);
    text-align:center;
}

.vx-dialogue-feedback>span {
    display:grid;
    place-items:center;
    width:72px;
    height:72px;
    margin:0 auto 18px;
    border-radius:23px;
    font-size:1.7rem;
    font-weight:900;
}

.vx-dialogue-feedback.is-correct>span {
    color:var(--vx-success);
    background:var(--vx-success-soft);
}

.vx-dialogue-feedback.is-wrong>span {
    color:var(--vx-danger);
    background:var(--vx-danger-soft);
}

.vx-dialogue-feedback>small {
    color:var(--vx-ink-600);
    font-weight:900;
    text-transform:uppercase;
}

.vx-dialogue-feedback h1 {
    margin:10px 0 20px;
    font-size:clamp(2rem,5vw,3.8rem);
}

.vx-dialogue-feedback>div {
    margin-bottom:22px;
    padding:17px;
    border-radius:16px;
    background:var(--vx-page);
}

.vx-dialogue-feedback>div strong,
.vx-dialogue-feedback>div small {
    display:block;
}

.vx-dialogue-feedback>div small {
    margin-top:5px;
    color:var(--vx-ink-600);
}

.vx-dialogue-result__score {
    display:grid;
    place-items:center;
    width:170px;
    height:170px;
    margin:0 auto 25px;
    border-radius:50%;
    background:
        radial-gradient(circle at center,#fff 58%,transparent 59%),
        conic-gradient(#704b7a 75%,#eee4f0 0);
}

.vx-dialogue-result__score strong {
    font-size:2.4rem;
}

.vx-dialogue-result__score span {
    margin-top:-42px;
    color:var(--vx-ink-600);
}

.vx-dialogue-result h1 {
    margin:8px 0 12px;
    font-size:clamp(2.2rem,5vw,4rem);
}

.vx-dialogue-result p {
    color:var(--vx-ink-600);
    font-size:1.02rem;
}

.vx-dialogue-result__actions {
    display:flex;
    justify-content:center;
    gap:9px;
    margin-top:24px;
}

@media(max-width:980px) {
    .vx-dialogue-grid {
        grid-template-columns:1fr;
    }
}

@media(max-width:760px) {
    .vx-dashboard-dialogue-card {
        grid-template-columns:auto minmax(0,1fr);
        gap:12px;
        padding:18px;
        border-radius:21px;
    }

    .vx-dashboard-dialogue-card .vx-button {
        grid-column:1/-1;
        width:100%;
    }

    .vx-dialogue-hero {
        grid-template-columns:1fr;
        min-height:0;
        padding:27px 21px;
        border-radius:24px;
    }

    .vx-dialogue-hero h1 {
        font-size:clamp(2.45rem,13vw,3.8rem);
    }

    .vx-dialogue-grid article {
        min-height:0;
    }

    .vx-dialogue-message,
    .vx-dialogue-options,
    .vx-dialogue-feedback,
    .vx-dialogue-result {
        border-radius:22px;
    }

    .vx-dialogue-result__actions {
        display:grid;
    }

    .vx-dialogue-result__actions .vx-button {
        width:100%;
    }
}


/* Voyara 4.7.4 — thematisch ähnliche Quizantworten */
.vx-smart-distractor-note {
    display:flex;
    align-items:flex-start;
    gap:10px;
    max-width:760px;
    margin:0 auto 14px;
    padding:11px 14px;
    border:1px solid rgba(13,92,78,.14);
    border-radius:14px;
    background:#eef7f3;
    font-size:.72rem;
    line-height:1.45;
}

.vx-smart-distractor-note strong {
    flex:0 0 auto;
    color:var(--vx-brand-800);
}

.vx-smart-distractor-note span {
    color:var(--vx-ink-600);
}


/* Voyara Core 4.8 — adaptive quiz intelligence */
.vx-question-badges {
    display:flex;
    justify-content:center;
    margin-bottom:8px;
}

.vx-question-badges span {
    padding:7px 10px;
    border-radius:999px;
    color:var(--vx-brand-800);
    background:var(--vx-brand-100);
    font-size:.66rem;
    font-weight:850;
}

.vx-answer-explanation {
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    gap:13px;
    margin:16px 0;
    padding:17px;
    border:1px solid rgba(200,154,61,.35);
    border-radius:17px;
    background:#fff8e8;
    text-align:left;
}

.vx-answer-explanation>span {
    display:grid;
    place-items:center;
    width:44px;
    height:44px;
    border-radius:14px;
    color:#654910;
    background:var(--vx-gold-100);
    font-weight:900;
}

.vx-answer-explanation small,
.vx-answer-explanation strong {
    display:block;
}

.vx-answer-explanation small {
    color:#876820;
    font-size:.65rem;
    font-weight:900;
    text-transform:uppercase;
}

.vx-answer-explanation strong {
    margin-top:5px;
    color:var(--vx-ink-800);
    font-size:.84rem;
    line-height:1.55;
}

.vx-feedback-meta {
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:8px;
    margin:14px 0;
}

.vx-feedback-meta span {
    padding:7px 10px;
    border-radius:999px;
    color:var(--vx-brand-800);
    background:var(--vx-brand-100);
    font-size:.66rem;
    font-weight:850;
}

@media(max-width:760px) {
    .vx-answer-explanation {
        grid-template-columns:1fr;
    }
}


/* ================================================================
   VOYARA CORE 4.9 — PERSONAL ERROR TRAINER
   ================================================================ */

.vx-dashboard-error-card {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:16px;
    margin:18px 0;
    padding:21px;
    border:1px solid rgba(167,86,78,.20);
    border-radius:23px;
    background:
        radial-gradient(circle at 100% 0%,rgba(251,232,229,.92),transparent 16rem),
        #fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-dashboard-error-card__icon {
    display:grid;
    place-items:center;
    width:54px;
    height:54px;
    border-radius:17px;
    color:#fff;
    background:linear-gradient(135deg,#8d4c45,#c77b70);
}

.vx-dashboard-error-card h2 {
    margin:5px 0;
    font-size:1.25rem;
}

.vx-dashboard-error-card p {
    margin:0;
    color:var(--vx-ink-600);
}

.vx-errors-hero {
    display:grid;
    grid-template-columns:minmax(0,1fr) 190px;
    align-items:end;
    gap:28px;
    min-height:280px;
    padding:clamp(30px,5vw,54px);
    border-radius:31px;
    color:#fff;
    background:
        radial-gradient(circle at 90% 8%,rgba(236,158,147,.28),transparent 20rem),
        linear-gradient(135deg,#653833,#9d574e);
    box-shadow:var(--vx-shadow-md);
}

.vx-errors-hero h1 {
    max-width:880px;
    margin:8px 0 13px;
    font-size:clamp(2.65rem,6vw,5.2rem);
    line-height:.95;
    letter-spacing:-.06em;
}

.vx-errors-hero p {
    max-width:760px;
    margin:0;
    color:rgba(255,255,255,.74);
    line-height:1.65;
}

.vx-errors-total {
    display:grid;
    place-items:center;
    min-height:150px;
    padding:22px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:24px;
    background:rgba(255,255,255,.10);
}

.vx-errors-total strong {
    font-size:3rem;
}

.vx-errors-total small {
    color:rgba(255,255,255,.74);
}

.vx-error-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
    margin-top:16px;
}

.vx-error-grid article {
    display:flex;
    flex-direction:column;
    min-height:280px;
    padding:22px;
    border:1px solid var(--vx-line-200);
    border-radius:23px;
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-error-grid header {
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.vx-error-grid header>span {
    display:grid;
    place-items:center;
    width:49px;
    height:49px;
    border-radius:15px;
    color:#fff;
    background:#8d4c45;
    font-weight:900;
}

.vx-error-grid header>b {
    display:grid;
    place-items:center;
    min-width:42px;
    height:42px;
    border-radius:14px;
    color:#8d4c45;
    background:#f8e8e5;
}

.vx-error-grid h2 {
    margin:20px 0 12px;
}

.vx-error-stats {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
}

.vx-error-stats span {
    padding:6px 8px;
    border-radius:999px;
    color:var(--vx-ink-600);
    background:var(--vx-page);
    font-size:.65rem;
    font-weight:800;
}

.vx-error-track {
    height:7px;
    margin:auto 0 18px;
    overflow:hidden;
    border-radius:999px;
    background:#eee7e5;
}

.vx-error-track i {
    display:block;
    height:100%;
    background:linear-gradient(90deg,#8d4c45,#d5a747);
}

.vx-error-recent {
    margin-top:16px;
    padding:28px;
    border:1px solid var(--vx-line-200);
    border-radius:24px;
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-error-recent h2 {
    margin:6px 0 18px;
}

.vx-error-recent>div {
    display:grid;
    gap:8px;
}

.vx-error-recent article {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:12px;
    padding:13px;
    border-radius:15px;
    background:var(--vx-page);
}

.vx-error-recent article>span {
    display:grid;
    place-items:center;
    width:42px;
    height:42px;
    border-radius:13px;
    color:#fff;
    background:#8d4c45;
    font-size:.7rem;
}

.vx-error-recent strong,
.vx-error-recent small {
    display:block;
}

.vx-error-recent small {
    margin-top:3px;
    color:var(--vx-ink-600);
}

.vx-error-play {
    width:min(900px,100%);
    margin:0 auto;
}

.vx-error-play>header {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:13px;
    margin-bottom:13px;
}

.vx-error-play>header>a {
    display:grid;
    place-items:center;
    width:44px;
    height:44px;
    border:1px solid var(--vx-line-200);
    border-radius:14px;
    background:#fff;
    text-decoration:none;
}

.vx-error-play>header strong,
.vx-error-play>header small {
    display:block;
}

.vx-error-progress {
    height:8px;
    margin-bottom:15px;
    overflow:hidden;
    border-radius:999px;
    background:#eee7e5;
}

.vx-error-progress i {
    display:block;
    height:100%;
    background:linear-gradient(90deg,#8d4c45,#d5a747);
}

.vx-error-card {
    padding:clamp(30px,6vw,58px);
    border-radius:28px;
    color:#fff;
    background:
        radial-gradient(circle at 100% 0%,rgba(236,158,147,.25),transparent 18rem),
        linear-gradient(135deg,#653833,#9d574e);
    box-shadow:var(--vx-shadow-md);
}

.vx-error-card h1 {
    margin:15px 0 0;
    font-size:clamp(2.2rem,5vw,4.5rem);
    line-height:1.02;
    letter-spacing:-.045em;
}

.vx-error-options {
    margin-top:15px;
    padding:24px;
    border:1px solid var(--vx-line-200);
    border-radius:24px;
    background:#fff;
}

.vx-error-options form {
    display:grid;
    gap:9px;
}

.vx-error-options button {
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid var(--vx-line-200);
    border-radius:16px;
    background:#fff;
    cursor:pointer;
    text-align:left;
}

.vx-error-options button:hover {
    border-color:#8d4c45;
    background:#fcf7f6;
}

.vx-error-options button>span {
    display:grid;
    place-items:center;
    width:38px;
    height:38px;
    border-radius:12px;
    color:#8d4c45;
    background:#f8e8e5;
    font-weight:900;
}

.vx-error-feedback,
.vx-error-result {
    width:min(760px,100%);
    margin:0 auto;
    padding:clamp(32px,6vw,58px);
    border:1px solid var(--vx-line-200);
    border-radius:29px;
    background:#fff;
    box-shadow:var(--vx-shadow-md);
    text-align:center;
}

.vx-error-feedback>span {
    display:grid;
    place-items:center;
    width:72px;
    height:72px;
    margin:0 auto 18px;
    border-radius:23px;
    font-size:1.7rem;
}

.vx-error-feedback.is-correct>span {
    color:var(--vx-success);
    background:var(--vx-success-soft);
}

.vx-error-feedback.is-wrong>span {
    color:var(--vx-danger);
    background:var(--vx-danger-soft);
}

.vx-error-feedback h1,
.vx-error-result h1 {
    font-size:clamp(2.2rem,5vw,4rem);
}

.vx-error-feedback p {
    color:var(--vx-ink-600);
    line-height:1.6;
}

.vx-error-result__score {
    display:grid;
    place-items:center;
    width:170px;
    height:170px;
    margin:0 auto 24px;
    border-radius:50%;
    background:
        radial-gradient(circle at center,#fff 58%,transparent 59%),
        conic-gradient(#8d4c45 70%,#efe7e5 0);
}

.vx-error-result__score strong {
    font-size:2.5rem;
}

.vx-error-result>div:last-child {
    display:flex;
    justify-content:center;
    gap:9px;
    margin-top:24px;
}

@media(max-width:980px) {
    .vx-error-grid {
        grid-template-columns:1fr;
    }
}

@media(max-width:760px) {
    .vx-dashboard-error-card {
        grid-template-columns:auto minmax(0,1fr);
    }

    .vx-dashboard-error-card .vx-button {
        grid-column:1/-1;
        width:100%;
    }

    .vx-errors-hero {
        grid-template-columns:1fr;
        padding:27px 21px;
        border-radius:24px;
    }

    .vx-errors-hero h1 {
        font-size:clamp(2.45rem,13vw,3.8rem);
    }

    .vx-error-result>div:last-child {
        display:grid;
    }
}

.vx-dashboard-strategy-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;margin:18px 0;padding:21px;border:1px solid #d6e8e2;border-radius:23px;background:#fff;box-shadow:var(--vx-shadow-sm)}.vx-dashboard-strategy-card__icon{display:grid;place-items:center;width:54px;height:54px;border-radius:17px;color:#fff;background:#427d70}.vx-dashboard-strategy-card h2{margin:5px 0}.vx-dashboard-strategy-card p{margin:0;color:var(--vx-ink-600)}
.vx-strategy-hero{display:grid;grid-template-columns:1fr 190px;align-items:end;gap:28px;padding:50px;border-radius:31px;color:#fff;background:linear-gradient(135deg,#214d45,#427d70)}.vx-strategy-hero h1{font-size:clamp(2.6rem,6vw,5.2rem);line-height:.95;margin:8px 0}.vx-strategy-hero p{color:#ffffffbd}.vx-strategy-score{display:grid;place-items:center;min-height:150px;border-radius:24px;background:#ffffff18}.vx-strategy-score strong{font-size:3rem}
.vx-strategy-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:16px}.vx-strategy-kpis article{display:grid;grid-template-columns:auto 1fr;gap:6px 12px;padding:17px;border:1px solid var(--vx-line-200);border-radius:19px;background:#fff}.vx-strategy-kpis article>span{grid-row:1/3;display:grid;place-items:center;width:44px;height:44px;border-radius:14px;color:#fff;background:#427d70}.vx-strategy-kpis i{grid-column:1/-1;height:6px;border-radius:999px;background:linear-gradient(90deg,#427d70 calc(var(--score)*1%),#e5eeeb 0)}
.vx-strategy-layout{display:grid;grid-template-columns:1.35fr .65fr;gap:16px;margin-top:16px}.vx-competence-map,.vx-strategy-focus,.vx-weekly-report{padding:28px;border:1px solid var(--vx-line-200);border-radius:25px;background:#fff;box-shadow:var(--vx-shadow-sm)}.vx-competence-map article{display:grid;grid-template-columns:auto 1fr 1.2fr;align-items:center;gap:12px;padding:13px;margin-top:8px;border-radius:15px;background:var(--vx-page)}.vx-competence-map article>span{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;color:#fff;background:#427d70}.vx-competence-map i{height:7px;border-radius:999px;background:#e6eeeb;overflow:hidden}.vx-competence-map i b{display:block;height:100%;background:#427d70}.vx-strategy-focus{display:flex;flex-direction:column;background:radial-gradient(circle at 100% 0%,#e3f2ed,transparent 14rem),#fff}.vx-strategy-focus .vx-button{margin-top:auto}.vx-weekly-report{margin-top:16px}.vx-weekly-report>div{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px}.vx-weekly-report article{padding:18px;border-radius:17px;background:var(--vx-page);text-align:center}.vx-weekly-report strong,.vx-weekly-report small{display:block}.vx-weekly-report strong{font-size:1.7rem}
@media(max-width:900px){.vx-strategy-kpis{grid-template-columns:repeat(2,1fr)}.vx-strategy-layout{grid-template-columns:1fr}}@media(max-width:760px){.vx-dashboard-strategy-card{grid-template-columns:auto 1fr}.vx-dashboard-strategy-card .vx-button{grid-column:1/-1}.vx-strategy-hero{grid-template-columns:1fr;padding:27px 21px}.vx-strategy-kpis{grid-template-columns:1fr}.vx-weekly-report>div{grid-template-columns:1fr}}


/* Voyara 5.0.1 — QA and strategy usability */
.vx-strategy-kpis article.is-empty{opacity:.62}.vx-focus-facts{display:grid;gap:8px;margin:20px 0}.vx-focus-facts span{padding:10px 12px;border-radius:13px;background:var(--vx-page);font-size:.72rem;line-height:1.45}.vx-strategy-recommendations{margin-top:16px;padding:28px;border:1px solid var(--vx-line-200);border-radius:25px;background:#fff;box-shadow:var(--vx-shadow-sm)}.vx-strategy-recommendations h2{margin:6px 0 18px}.vx-strategy-recommendations>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.vx-strategy-recommendations a{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;padding:15px;border:1px solid var(--vx-line-200);border-radius:16px;color:inherit;background:var(--vx-page);text-decoration:none}.vx-strategy-recommendations a>span{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;color:#fff;background:#427d70}.vx-strategy-recommendations a small{display:block;margin-top:4px;color:var(--vx-ink-600);line-height:1.4}.vx-strategy-recommendations a>b{display:grid;place-items:center;min-width:36px;height:36px;border-radius:12px;color:var(--vx-brand-800);background:var(--vx-brand-100);font-size:.7rem}.vx-competence-map article em{font-style:normal;font-weight:850}.vx-weekly-report footer{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:10px}.vx-weekly-report footer span{padding:16px;border:1px solid var(--vx-line-200);border-radius:15px}.vx-weekly-report footer small,.vx-weekly-report footer strong{display:block}.vx-weekly-report footer small{color:var(--vx-brand-700);font-size:.64rem;font-weight:900;text-transform:uppercase}.vx-weekly-report footer strong{margin-top:5px}.vx-muted{color:var(--vx-ink-600);line-height:1.6}@media(max-width:760px){.vx-strategy-recommendations>div,.vx-weekly-report footer{grid-template-columns:1fr}}

.vx-dashboard-path-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;margin:18px 0;padding:21px;border:1px solid #d9e5f1;border-radius:23px;background:#fff;box-shadow:var(--vx-shadow-sm)}
.vx-dashboard-path-card__icon{display:grid;place-items:center;width:54px;height:54px;border-radius:17px;color:#fff;background:#466f98}
.vx-dashboard-path-card h2{margin:5px 0}.vx-dashboard-path-card p{margin:0;color:var(--vx-ink-600)}
.vx-path-hero{display:grid;grid-template-columns:1fr 190px;align-items:end;gap:28px;padding:clamp(30px,5vw,54px);border-radius:31px;color:#fff;background:linear-gradient(135deg,#274866,#466f98);box-shadow:var(--vx-shadow-md)}
.vx-path-hero h1{font-size:clamp(2.65rem,6vw,5.3rem);line-height:.95;letter-spacing:-.06em;margin:8px 0}.vx-path-hero p{color:#ffffffbd}
.vx-path-score{display:grid;place-items:center;min-height:150px;border:1px solid #ffffff25;border-radius:24px;background:#ffffff12}.vx-path-score strong{font-size:3rem}
.vx-path-setup,.vx-path-roadmap>article{margin-top:16px;padding:28px;border:1px solid var(--vx-line-200);border-radius:25px;background:#fff;box-shadow:var(--vx-shadow-sm)}
.vx-path-goals{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:20px 0}.vx-path-goals input{position:absolute;opacity:0}.vx-path-goals label>span{display:flex;flex-direction:column;min-height:190px;padding:18px;border:1px solid var(--vx-line-200);border-radius:19px;background:var(--vx-page);cursor:pointer}.vx-path-goals label b{display:grid;place-items:center;width:47px;height:47px;border-radius:15px;color:#fff;background:#466f98}.vx-path-goals strong{margin-top:15px}.vx-path-goals small{margin-top:7px;color:var(--vx-ink-600);line-height:1.45}.vx-path-goals input:checked+span{border-color:#466f98;background:#edf5fc}
.vx-path-settings{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px}.vx-path-settings label{display:grid;gap:7px}.vx-path-settings select,.vx-path-settings input{min-height:48px;padding:10px;border:1px solid var(--vx-line-200);border-radius:13px;background:#fff}
.vx-path-review{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;margin-top:16px;padding:20px;border-radius:20px;background:#fff8e8;border:1px solid #ead7a7}.vx-path-review>span{display:grid;place-items:center;width:50px;height:50px;border-radius:15px;background:var(--vx-gold-100)}
.vx-path-roadmap{display:grid;gap:16px}.vx-path-roadmap article>header{display:flex;align-items:center;gap:12px}.vx-path-roadmap article>header span{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;color:#fff;background:#466f98}
.vx-path-world{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;margin-top:10px;padding:15px;border-radius:17px;background:var(--vx-page);border:1px solid var(--vx-line-200)}.vx-path-world>span{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;color:#fff;background:#466f98}.vx-path-world h3{margin:4px 0}.vx-path-world p{margin:0;color:var(--vx-ink-600);font-size:.78rem}.vx-path-world i{display:block;height:6px;margin-top:9px;border-radius:999px;background:#dfe8ef;overflow:hidden}.vx-path-world i b{display:block;height:100%;background:#466f98}.vx-path-world.is-locked{opacity:.58}
@media(max-width:900px){.vx-path-goals{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.vx-dashboard-path-card,.vx-path-review,.vx-path-world{grid-template-columns:auto 1fr}.vx-dashboard-path-card .vx-button,.vx-path-review .vx-button,.vx-path-world .vx-button,.vx-path-world>b{grid-column:1/-1;width:100%}.vx-path-hero{grid-template-columns:1fr;padding:27px 21px}.vx-path-goals,.vx-path-settings{grid-template-columns:1fr}.vx-path-goals label>span{min-height:0}}


/* ================================================================
   VOYARA CORE 5.2 — DAILY MISSIONS AND LEARNING CALENDAR
   ================================================================ */

.vx-dashboard-missions-card {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:16px;
    margin:18px 0;
    padding:21px;
    border:1px solid rgba(52,126,92,.20);
    border-radius:23px;
    background:
        radial-gradient(circle at 100% 0%,rgba(227,244,235,.95),transparent 17rem),
        #fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-dashboard-missions-card__icon {
    display:grid;
    place-items:center;
    width:54px;
    height:54px;
    border-radius:17px;
    color:#fff;
    background:linear-gradient(135deg,#347e5c,#6aa985);
    font-size:1.25rem;
}

.vx-dashboard-missions-card h2 {
    margin:5px 0;
}

.vx-dashboard-missions-card p {
    margin:0;
    color:var(--vx-ink-600);
}

.vx-missions-hero {
    display:grid;
    grid-template-columns:minmax(0,1fr) 190px;
    align-items:end;
    gap:28px;
    padding:clamp(30px,5vw,54px);
    border-radius:31px;
    color:#fff;
    background:
        radial-gradient(circle at 90% 8%,rgba(157,220,187,.30),transparent 20rem),
        linear-gradient(135deg,#24553f,#3e8060);
    box-shadow:var(--vx-shadow-md);
}

.vx-missions-hero h1 {
    margin:8px 0;
    font-size:clamp(2.65rem,6vw,5.3rem);
    line-height:.95;
    letter-spacing:-.06em;
}

.vx-missions-hero p {
    max-width:760px;
    color:rgba(255,255,255,.75);
}

.vx-missions-progress {
    display:grid;
    place-items:center;
    min-height:150px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:24px;
    background:rgba(255,255,255,.10);
}

.vx-missions-progress strong {
    font-size:3rem;
}

.vx-missions-summary {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:16px;
}

.vx-missions-summary article {
    padding:18px;
    border:1px solid var(--vx-line-200);
    border-radius:18px;
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-missions-summary small,
.vx-missions-summary strong {
    display:block;
}

.vx-missions-summary small {
    color:var(--vx-ink-600);
}

.vx-missions-summary strong {
    margin-top:5px;
    font-size:1.25rem;
}

.vx-missions-unlock {
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    gap:14px;
    margin-top:16px;
    padding:20px;
    border:1px solid rgba(52,126,92,.25);
    border-radius:20px;
    background:#eef8f2;
}

.vx-missions-unlock>span {
    display:grid;
    place-items:center;
    width:50px;
    height:50px;
    border-radius:15px;
    color:#fff;
    background:#347e5c;
}

.vx-missions-unlock h2 {
    margin:0 0 5px;
}

.vx-missions-unlock p {
    margin:0;
    color:var(--vx-ink-600);
}

.vx-mission-list {
    display:grid;
    gap:10px;
    margin-top:16px;
}

.vx-mission-list article {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:15px;
    padding:18px;
    border:1px solid var(--vx-line-200);
    border-radius:20px;
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-mission-list article>span {
    display:grid;
    place-items:center;
    width:52px;
    height:52px;
    border-radius:16px;
    color:#fff;
    background:#347e5c;
    font-weight:900;
}

.vx-mission-list small {
    color:var(--vx-brand-700);
    font-size:.65rem;
    font-weight:900;
    text-transform:uppercase;
}

.vx-mission-list h2 {
    margin:4px 0;
}

.vx-mission-list p {
    margin:0;
    color:var(--vx-ink-600);
}

.vx-mission-meter {
    height:7px;
    margin-top:11px;
    overflow:hidden;
    border-radius:999px;
    background:#e2ece7;
}

.vx-mission-meter i {
    display:block;
    height:100%;
    background:linear-gradient(90deg,#347e5c,#d5a747);
}

.vx-mission-list article.is-completed {
    border-color:rgba(52,126,92,.25);
    background:#eef8f2;
}

.vx-learning-calendar {
    margin-top:16px;
    padding:27px;
    border:1px solid var(--vx-line-200);
    border-radius:25px;
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-learning-calendar h2 {
    margin:6px 0 18px;
}

.vx-learning-calendar>div {
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:8px;
}

.vx-learning-calendar article {
    display:grid;
    justify-items:center;
    gap:6px;
    padding:13px 8px;
    border-radius:15px;
    background:var(--vx-page);
}

.vx-learning-calendar article.is-active {
    color:#fff;
    background:#347e5c;
}

.vx-learning-calendar article.is-completed {
    background:#dff2e7;
}

.vx-learning-calendar article.is-missed {
    background:#f9e8e5;
}

.vx-learning-calendar article.is-rest {
    opacity:.55;
}

.vx-learning-calendar article i {
    width:100%;
    height:5px;
    border-radius:999px;
    background:
        linear-gradient(
            90deg,
            currentColor calc(var(--activity) * 1%),
            rgba(128,128,128,.18) 0
        );
}

.vx-mission-refresh {
    display:flex;
    justify-content:flex-end;
    margin-top:12px;
}

@media(max-width:900px) {
    .vx-learning-calendar>div {
        grid-template-columns:repeat(4,minmax(0,1fr));
    }
}

@media(max-width:760px) {
    .vx-dashboard-missions-card,
    .vx-mission-list article {
        grid-template-columns:auto minmax(0,1fr);
    }

    .vx-dashboard-missions-card .vx-button,
    .vx-mission-list article .vx-button,
    .vx-mission-list article>strong {
        grid-column:1/-1;
        width:100%;
    }

    .vx-missions-hero {
        grid-template-columns:1fr;
        padding:27px 21px;
    }

    .vx-missions-summary {
        grid-template-columns:1fr;
    }

    .vx-learning-calendar>div {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}


/* ================================================================
   VOYARA CORE 5.3 — PAYWALL & RELEASE READINESS
   ================================================================ */

.vx-paywall {
    width:min(760px,100%);
    margin:0 auto;
    padding:clamp(32px,6vw,60px);
    border:1px solid var(--vx-line-200);
    border-radius:30px;
    background:
        radial-gradient(circle at 100% 0%,rgba(237,214,161,.45),transparent 19rem),
        #fff;
    box-shadow:var(--vx-shadow-md);
    text-align:center;
}

.vx-paywall__icon {
    display:grid;
    place-items:center;
    width:78px;
    height:78px;
    margin:0 auto 20px;
    border-radius:24px;
    color:#fff;
    background:linear-gradient(135deg,#725c24,#c4a14d);
    font-size:1.8rem;
}

.vx-paywall h1 {
    margin:8px 0 12px;
    font-size:clamp(2.3rem,5vw,4.3rem);
    line-height:1;
    letter-spacing:-.05em;
}

.vx-paywall>p {
    max-width:590px;
    margin:0 auto 24px;
    color:var(--vx-ink-600);
    line-height:1.65;
}

.vx-paywall__feature {
    display:flex;
    justify-content:space-between;
    gap:15px;
    margin-top:8px;
    padding:15px;
    border-radius:16px;
    background:var(--vx-page);
    text-align:left;
}

.vx-paywall__feature small {
    color:var(--vx-brand-700);
    font-size:.65rem;
    font-weight:900;
    text-transform:uppercase;
}

.vx-paywall__actions {
    display:flex;
    justify-content:center;
    gap:9px;
    margin-top:24px;
}

.vx-readiness-hero {
    display:grid;
    grid-template-columns:minmax(0,1fr) 190px;
    align-items:end;
    gap:28px;
    padding:clamp(30px,5vw,54px);
    border-radius:31px;
    color:#fff;
    background:
        radial-gradient(circle at 90% 8%,rgba(255,210,115,.25),transparent 20rem),
        linear-gradient(135deg,#3b4350,#626f7e);
    box-shadow:var(--vx-shadow-md);
}

.vx-readiness-hero h1 {
    margin:8px 0;
    font-size:clamp(2.65rem,6vw,5.2rem);
    line-height:.95;
    letter-spacing:-.06em;
}

.vx-readiness-hero p {
    max-width:760px;
    color:rgba(255,255,255,.76);
}

.vx-readiness-hero>div:last-child {
    display:grid;
    place-items:center;
    min-height:150px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:24px;
    background:rgba(255,255,255,.10);
}

.vx-readiness-hero strong {
    font-size:3rem;
}

.vx-readiness-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    margin-top:16px;
}

.vx-readiness-grid article {
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    gap:14px;
    padding:20px;
    border:1px solid var(--vx-line-200);
    border-radius:20px;
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-readiness-grid article>span {
    display:grid;
    place-items:center;
    width:48px;
    height:48px;
    border-radius:15px;
    color:#fff;
    background:#8b9561;
    font-weight:900;
}

.vx-readiness-grid article.is-blocked>span {
    background:#a4534c;
}

.vx-readiness-grid article.is-warning>span {
    background:#b08734;
}

.vx-readiness-grid small {
    font-size:.64rem;
    font-weight:900;
    text-transform:uppercase;
}

.vx-readiness-grid h2 {
    margin:5px 0;
}

.vx-readiness-grid p {
    margin:0;
    color:var(--vx-ink-600);
    line-height:1.55;
}

.vx-readiness-next {
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    align-items:center;
    gap:15px;
    margin-top:16px;
    padding:22px;
    border-radius:21px;
    color:#fff;
    background:#2e6459;
}

.vx-readiness-next>span {
    display:grid;
    place-items:center;
    width:50px;
    height:50px;
    border-radius:15px;
    background:rgba(255,255,255,.13);
}

.vx-readiness-next h2 {
    margin:5px 0 0;
}

@media(max-width:800px) {
    .vx-readiness-hero {
        grid-template-columns:1fr;
        padding:27px 21px;
    }

    .vx-readiness-grid {
        grid-template-columns:1fr;
    }

    .vx-paywall__actions {
        display:grid;
    }
}


/* ================================================================
   VOYARA CORE 5.4 — BILLING FOUNDATION
   ================================================================ */

.vx-billing-hero {
    display:grid;
    grid-template-columns:minmax(0,1fr) 220px;
    align-items:end;
    gap:28px;
    padding:clamp(30px,5vw,54px);
    border-radius:31px;
    color:#fff;
    background:
        radial-gradient(circle at 90% 8%,rgba(236,209,139,.30),transparent 20rem),
        linear-gradient(135deg,#4a4029,#71603a);
    box-shadow:var(--vx-shadow-md);
}

.vx-billing-hero h1 {
    margin:8px 0;
    font-size:clamp(2.65rem,6vw,5.2rem);
    line-height:.95;
    letter-spacing:-.06em;
}

.vx-billing-hero p {
    max-width:760px;
    color:rgba(255,255,255,.76);
}

.vx-billing-status {
    display:grid;
    gap:8px;
    padding:22px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:24px;
    background:rgba(255,255,255,.10);
}

.vx-billing-status strong {
    font-size:1.5rem;
}

.vx-billing-alert {
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    gap:14px;
    margin-top:16px;
    padding:20px;
    border:1px solid rgba(183,129,37,.28);
    border-radius:20px;
    background:#fff8e8;
}

.vx-billing-alert>span {
    display:grid;
    place-items:center;
    width:50px;
    height:50px;
    border-radius:15px;
    color:#fff;
    background:#b4822f;
    font-weight:900;
}

.vx-billing-alert h2 {
    margin:0 0 5px;
}

.vx-billing-alert p {
    margin:0;
    color:var(--vx-ink-600);
}

.vx-billing-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:16px;
}

.vx-billing-grid article {
    padding:18px;
    border:1px solid var(--vx-line-200);
    border-radius:18px;
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-billing-grid small,
.vx-billing-grid strong {
    display:block;
}

.vx-billing-grid small {
    color:var(--vx-ink-600);
}

.vx-billing-grid strong {
    margin-top:6px;
    font-size:1.2rem;
}

.vx-billing-actions {
    display:flex;
    gap:9px;
    margin-top:16px;
}

.vx-billing-history {
    margin-top:16px;
    padding:27px;
    border:1px solid var(--vx-line-200);
    border-radius:24px;
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-billing-history h2 {
    margin:6px 0 18px;
}

.vx-billing-history>div {
    display:grid;
    gap:8px;
}

.vx-billing-history article {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto auto;
    gap:12px;
    padding:13px;
    border-radius:14px;
    background:var(--vx-page);
}

@media(max-width:760px) {
    .vx-billing-hero {
        grid-template-columns:1fr;
        padding:27px 21px;
    }

    .vx-billing-grid {
        grid-template-columns:1fr;
    }

    .vx-billing-actions {
        display:grid;
    }
}


/* ================================================================
   VOYARA CORE 5.5 — PRIVACY CENTER
   ================================================================ */

.vx-privacy-hero {
    display:grid;
    grid-template-columns:minmax(0,1fr) 190px;
    align-items:end;
    gap:28px;
    padding:clamp(30px,5vw,54px);
    border-radius:31px;
    color:#fff;
    background:
        radial-gradient(circle at 90% 8%,rgba(145,189,224,.28),transparent 20rem),
        linear-gradient(135deg,#334a61,#506f8d);
    box-shadow:var(--vx-shadow-md);
}

.vx-privacy-hero h1 {
    margin:8px 0;
    font-size:clamp(2.65rem,6vw,5.2rem);
    line-height:.95;
    letter-spacing:-.06em;
}

.vx-privacy-hero p {
    max-width:760px;
    color:rgba(255,255,255,.76);
}

.vx-privacy-hero>div:last-child {
    display:grid;
    place-items:center;
    min-height:150px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:24px;
    background:rgba(255,255,255,.10);
}

.vx-privacy-hero strong {
    font-size:3rem;
}

.vx-privacy-card {
    margin-top:16px;
    padding:27px;
    border:1px solid var(--vx-line-200);
    border-radius:24px;
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-privacy-card h2 {
    margin:6px 0 18px;
}

.vx-consent-list {
    display:grid;
    gap:9px;
    margin-bottom:16px;
}

.vx-consent-list label {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:12px;
    padding:15px;
    border-radius:16px;
    background:var(--vx-page);
}

.vx-consent-list strong,
.vx-consent-list small {
    display:block;
}

.vx-consent-list small {
    margin-top:4px;
    color:var(--vx-ink-600);
}

.vx-consent-list input {
    width:22px;
    height:22px;
}

.vx-privacy-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    margin-top:16px;
}

.vx-privacy-grid>article {
    display:flex;
    flex-direction:column;
    gap:14px;
    padding:24px;
    border:1px solid var(--vx-line-200);
    border-radius:22px;
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-privacy-grid>article>span {
    display:grid;
    place-items:center;
    width:52px;
    height:52px;
    border-radius:16px;
    color:#fff;
    background:#506f8d;
    font-size:1.25rem;
}

.vx-privacy-grid h2 {
    margin:0 0 6px;
}

.vx-privacy-grid p {
    margin:0;
    color:var(--vx-ink-600);
    line-height:1.6;
}

.vx-privacy-danger {
    border-color:rgba(160,75,67,.23)!important;
}

.vx-privacy-danger>span {
    background:#a04b43!important;
}

.vx-privacy-danger form {
    display:grid;
    gap:10px;
}

.vx-privacy-danger label {
    display:grid;
    gap:6px;
}

.vx-privacy-danger select,
.vx-privacy-danger textarea {
    width:100%;
    padding:11px;
    border:1px solid var(--vx-line-200);
    border-radius:13px;
    background:#fff;
}

.vx-deletion-status {
    padding:14px;
    border-radius:14px;
    background:#fff0ed;
}

.vx-deletion-status small,
.vx-deletion-status strong {
    display:block;
}

.vx-privacy-security {
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    align-items:center;
    gap:14px;
    margin-top:16px;
    padding:20px;
    border-radius:20px;
    color:#fff;
    background:#334a61;
}

.vx-privacy-security>span {
    display:grid;
    place-items:center;
    width:50px;
    height:50px;
    border-radius:15px;
    background:rgba(255,255,255,.12);
}

.vx-privacy-security h2 {
    margin:0 0 5px;
}

.vx-privacy-security p {
    margin:0;
    color:rgba(255,255,255,.75);
}

@media(max-width:760px) {
    .vx-privacy-hero {
        grid-template-columns:1fr;
        padding:27px 21px;
    }

    .vx-privacy-grid {
        grid-template-columns:1fr;
    }
}


/* Voyara 5.5.1 — safe export notice */
.vx-export-security {
    display:block;
    margin-top:10px;
    padding:9px 11px;
    border-radius:12px;
    color:#286044;
    background:#e8f5ed;
    font-weight:800;
    line-height:1.4;
}


/* ================================================================
   VOYARA CORE 5.6 — ACCOUNT SECURITY
   ================================================================ */

.vx-security-hero {
    display:grid;
    grid-template-columns:minmax(0,1fr) 190px;
    align-items:end;
    gap:28px;
    padding:clamp(30px,5vw,54px);
    border-radius:31px;
    color:#fff;
    background:
        radial-gradient(circle at 90% 8%,rgba(153,205,198,.28),transparent 20rem),
        linear-gradient(135deg,#274d4b,#477976);
    box-shadow:var(--vx-shadow-md);
}

.vx-security-hero h1 {
    margin:8px 0;
    font-size:clamp(2.65rem,6vw,5.2rem);
    line-height:.95;
    letter-spacing:-.06em;
}

.vx-security-hero p {
    max-width:760px;
    color:rgba(255,255,255,.76);
}

.vx-security-hero>div:last-child {
    display:grid;
    place-items:center;
    min-height:150px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:24px;
    background:rgba(255,255,255,.10);
}

.vx-security-hero strong {
    font-size:3rem;
}

.vx-security-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    margin-top:16px;
}

.vx-security-grid article {
    display:flex;
    flex-direction:column;
    gap:14px;
    padding:24px;
    border:1px solid var(--vx-line-200);
    border-radius:22px;
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-security-grid article>span {
    display:grid;
    place-items:center;
    width:52px;
    height:52px;
    border-radius:16px;
    color:#fff;
    background:#477976;
    font-size:1.25rem;
}

.vx-security-grid h2 {
    margin:5px 0;
}

.vx-security-grid p {
    margin:0;
    color:var(--vx-ink-600);
}

.vx-security-outbox {
    margin-top:16px;
    padding:27px;
    border:1px solid var(--vx-line-200);
    border-radius:24px;
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-security-outbox h2 {
    margin:6px 0;
}

.vx-security-outbox header p {
    margin:0 0 18px;
    color:var(--vx-ink-600);
}

.vx-security-outbox>div {
    display:grid;
    gap:8px;
}

.vx-security-outbox article {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:12px;
    padding:14px;
    border-radius:15px;
    background:var(--vx-page);
}

.vx-security-outbox article small,
.vx-security-outbox article strong,
.vx-security-outbox article span {
    display:block;
}

.vx-security-outbox article span {
    margin-top:4px;
    color:var(--vx-ink-600);
}

.vx-security-reset {
    width:min(640px,100%);
    margin:0 auto;
    padding:clamp(28px,5vw,50px);
    border:1px solid var(--vx-line-200);
    border-radius:26px;
    background:#fff;
    box-shadow:var(--vx-shadow-md);
}

.vx-security-reset h1 {
    margin:8px 0;
    font-size:clamp(2.2rem,5vw,4rem);
    letter-spacing:-.05em;
}

.vx-security-reset p {
    color:var(--vx-ink-600);
}

.vx-security-reset form {
    display:grid;
    gap:12px;
    margin-top:20px;
}

.vx-security-reset label {
    display:grid;
    gap:6px;
}

.vx-security-reset input {
    min-height:48px;
    padding:11px;
    border:1px solid var(--vx-line-200);
    border-radius:13px;
}

@media(max-width:760px) {
    .vx-security-hero {
        grid-template-columns:1fr;
        padding:27px 21px;
    }

    .vx-security-grid {
        grid-template-columns:1fr;
    }

    .vx-security-outbox article {
        grid-template-columns:1fr;
    }
}


/* ================================================================
   VOYARA CORE 5.7 — PUBLIC RECOVERY & SESSIONS
   ================================================================ */

.auth-forgot-link {
    margin:-3px 0 8px;
    text-align:right;
}

.auth-forgot-link a {
    font-size:.82rem;
    font-weight:800;
}

.vx-security-session-callout,
.vx-security-login-protection {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:14px;
    margin-top:16px;
    padding:20px;
    border:1px solid var(--vx-line-200);
    border-radius:20px;
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-security-session-callout>span,
.vx-security-login-protection>span {
    display:grid;
    place-items:center;
    width:50px;
    height:50px;
    border-radius:15px;
    color:#fff;
    background:#477976;
}

.vx-security-session-callout h2,
.vx-security-login-protection h2 {
    margin:0 0 5px;
}

.vx-security-session-callout p,
.vx-security-login-protection p {
    margin:0;
    color:var(--vx-ink-600);
}

.vx-sessions-hero {
    display:grid;
    grid-template-columns:minmax(0,1fr) 190px;
    align-items:end;
    gap:28px;
    padding:clamp(30px,5vw,54px);
    border-radius:31px;
    color:#fff;
    background:
        radial-gradient(circle at 90% 8%,rgba(153,205,198,.28),transparent 20rem),
        linear-gradient(135deg,#274d4b,#477976);
    box-shadow:var(--vx-shadow-md);
}

.vx-sessions-hero h1 {
    margin:8px 0;
    font-size:clamp(2.65rem,6vw,5.2rem);
    line-height:.95;
    letter-spacing:-.06em;
}

.vx-sessions-hero p {
    max-width:760px;
    color:rgba(255,255,255,.76);
}

.vx-sessions-hero>div:last-child {
    display:grid;
    place-items:center;
    min-height:150px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:24px;
    background:rgba(255,255,255,.10);
}

.vx-sessions-hero strong {
    font-size:3rem;
}

.vx-session-list {
    display:grid;
    gap:10px;
    margin-top:16px;
}

.vx-session-list>article {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:14px;
    padding:18px;
    border:1px solid var(--vx-line-200);
    border-radius:20px;
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-session-list>article.is-current {
    border-color:rgba(71,121,118,.32);
    background:#edf7f5;
}

.vx-session-list>article>span {
    display:grid;
    place-items:center;
    width:50px;
    height:50px;
    border-radius:15px;
    color:#fff;
    background:#477976;
}

.vx-session-list h2 {
    margin:4px 0;
}

.vx-session-list p {
    margin:2px 0;
    color:var(--vx-ink-600);
    font-size:.8rem;
}

.vx-session-revoke-all {
    display:flex;
    justify-content:flex-end;
    margin-top:12px;
}

@media(max-width:760px) {
    .vx-security-session-callout,
    .vx-session-list>article {
        grid-template-columns:auto minmax(0,1fr);
    }

    .vx-security-session-callout .vx-button,
    .vx-session-list form {
        grid-column:1/-1;
        width:100%;
    }

    .vx-sessions-hero {
        grid-template-columns:1fr;
        padding:27px 21px;
    }
}


/* ================================================================
   VOYARA CORE 5.8 — SYSTEM HEALTH
   ================================================================ */

.vx-health-hero {
    display:grid;
    grid-template-columns:minmax(0,1fr) 190px;
    align-items:end;
    gap:28px;
    padding:clamp(30px,5vw,54px);
    border-radius:31px;
    color:#fff;
    background:linear-gradient(135deg,#28333d,#4a5d6a);
    box-shadow:var(--vx-shadow-md);
}

.vx-health-hero h1 {
    margin:8px 0;
    font-size:clamp(2.65rem,6vw,5.2rem);
    line-height:.95;
    letter-spacing:-.06em;
}

.vx-health-hero p {
    max-width:760px;
    color:rgba(255,255,255,.76);
}

.vx-health-hero>div:last-child {
    display:grid;
    place-items:center;
    min-height:150px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:24px;
    background:rgba(255,255,255,.10);
}

.vx-health-hero strong {
    font-size:3rem;
}

.vx-health-actions {
    display:flex;
    justify-content:flex-end;
    margin-top:14px;
}

.vx-health-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    margin-top:16px;
}

.vx-health-grid article {
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    gap:14px;
    padding:19px;
    border:1px solid var(--vx-line-200);
    border-radius:19px;
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-health-grid article>span {
    display:grid;
    place-items:center;
    width:46px;
    height:46px;
    border-radius:14px;
    color:#fff;
    background:#3f7c59;
}

.vx-health-grid article.is-warning>span {
    background:#b18432;
}

.vx-health-grid article.is-error>span {
    background:#a44740;
}

.vx-health-grid h2 {
    margin:4px 0;
}

.vx-health-grid p {
    margin:0;
    color:var(--vx-ink-600);
}

.vx-health-grid b {
    display:block;
    margin-top:8px;
    font-size:.76rem;
}

.vx-health-migrations {
    margin-top:16px;
    padding:25px;
    border:1px solid var(--vx-line-200);
    border-radius:23px;
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-health-migrations h2 {
    margin:5px 0 16px;
}

.vx-health-migrations>div {
    display:grid;
    gap:7px;
}

.vx-health-migrations article {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:12px;
    padding:11px 13px;
    border-radius:13px;
    background:var(--vx-page);
}

.vx-health-migrations article.is-failed,
.vx-health-migrations article.is-changed {
    background:#fdebea;
}

@media(max-width:760px) {
    .vx-health-hero {
        grid-template-columns:1fr;
        padding:27px 21px;
    }

    .vx-health-grid {
        grid-template-columns:1fr;
    }
}


/* ================================================================
   VOYARA CORE 5.9 — MULTILINGUAL ERROR TRAINER
   ================================================================ */

.vx-error-hero {
    display:grid;
    grid-template-columns:minmax(0,1fr) 220px;
    align-items:end;
    gap:28px;
    padding:clamp(30px,5vw,54px);
    border-radius:31px;
    color:#fff;
    background:
        radial-gradient(circle at 90% 8%,rgba(241,198,121,.28),transparent 20rem),
        linear-gradient(135deg,#4d3d2c,#7a5f3d);
    box-shadow:var(--vx-shadow-md);
}

.vx-error-hero h1 {
    margin:8px 0;
    font-size:clamp(2.65rem,6vw,5.2rem);
    line-height:.95;
    letter-spacing:-.06em;
}

.vx-error-hero p {
    max-width:760px;
    color:rgba(255,255,255,.76);
}

.vx-error-hero>div:last-child {
    display:grid;
    place-items:center;
    min-height:150px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:24px;
    background:rgba(255,255,255,.10);
    text-align:center;
}

.vx-error-start {
    margin-top:16px;
    padding:24px;
    border:1px solid var(--vx-line-200);
    border-radius:22px;
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-error-start form {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:end;
    gap:12px;
}

.vx-error-start label {
    display:grid;
    gap:6px;
}

.vx-error-start select {
    min-height:48px;
    padding:10px;
    border:1px solid var(--vx-line-200);
    border-radius:13px;
}

.vx-error-play,
.vx-error-feedback,
.vx-error-result {
    width:min(760px,100%);
    margin:0 auto;
    padding:clamp(26px,5vw,48px);
    border:1px solid var(--vx-line-200);
    border-radius:27px;
    background:#fff;
    box-shadow:var(--vx-shadow-md);
}

.vx-error-play header {
    margin-bottom:22px;
}

.vx-error-progress {
    height:8px;
    margin-top:10px;
    overflow:hidden;
    border-radius:999px;
    background:#ece9e1;
}

.vx-error-progress span {
    display:block;
    height:100%;
    border-radius:inherit;
    background:#7a5f3d;
}

.vx-error-play article>h1 {
    margin:8px 0 24px;
    font-size:clamp(2rem,5vw,3.8rem);
    line-height:1.05;
    letter-spacing:-.04em;
}

.vx-error-play form {
    display:grid;
    gap:12px;
}

.vx-error-play label {
    display:grid;
    gap:6px;
}

.vx-error-play textarea {
    width:100%;
    padding:14px;
    border:1px solid var(--vx-line-200);
    border-radius:15px;
    resize:vertical;
}

.vx-error-feedback {
    text-align:center;
}

.vx-error-feedback>span {
    display:grid;
    place-items:center;
    width:74px;
    height:74px;
    margin:0 auto 18px;
    border-radius:23px;
    color:#fff;
    background:#a14e45;
    font-size:2rem;
}

.vx-error-feedback.is-correct>span {
    background:#3f7c59;
}

.vx-error-feedback h1 {
    margin:0 0 10px;
    font-size:clamp(2rem,5vw,3.7rem);
}

.vx-error-feedback>div {
    margin:20px 0;
    padding:16px;
    border-radius:15px;
    background:var(--vx-page);
}

.vx-error-feedback>div small,
.vx-error-feedback>div strong {
    display:block;
}

.vx-error-result {
    text-align:center;
}

.vx-error-score {
    display:grid;
    place-items:center;
    width:190px;
    height:190px;
    margin:0 auto 22px;
    border-radius:50%;
    background:conic-gradient(
        #3f7c59 calc(var(--score) * 1%),
        #e7e8e4 0
    );
}

.vx-error-score>div {
    display:grid;
    place-items:center;
    width:150px;
    height:150px;
    border-radius:50%;
    background:#fff;
}

.vx-error-score strong {
    font-size:2.8rem;
}

.vx-error-result h1 {
    margin:8px 0 20px;
    font-size:clamp(2rem,5vw,3.8rem);
}

.vx-error-result-stats {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    margin-bottom:20px;
}

.vx-error-result-stats article {
    padding:16px;
    border-radius:15px;
    background:var(--vx-page);
}

.vx-error-result-stats strong,
.vx-error-result-stats small {
    display:block;
}

.vx-error-result-stats strong {
    font-size:1.8rem;
}

@media(max-width:760px) {
    .vx-error-hero {
        grid-template-columns:1fr;
        padding:27px 21px;
    }

    .vx-error-start form {
        grid-template-columns:1fr;
    }
}


/* ================================================================
   VOYARA 6.0 BETA — RELEASE QA
   ================================================================ */

.vx-beta-hero {
    display:grid;
    grid-template-columns:minmax(0,1fr) 210px;
    align-items:end;
    gap:28px;
    padding:clamp(30px,5vw,54px);
    border-radius:31px;
    color:#fff;
    background:
        radial-gradient(circle at 90% 8%,rgba(126,207,195,.25),transparent 20rem),
        linear-gradient(135deg,#173f3b,#2f6f66);
    box-shadow:var(--vx-shadow-md);
}

.vx-beta-hero h1 {
    margin:8px 0;
    font-size:clamp(2.65rem,6vw,5rem);
    line-height:.95;
    letter-spacing:-.06em;
}

.vx-beta-hero p {
    max-width:760px;
    color:rgba(255,255,255,.76);
}

.vx-beta-hero>div:last-child {
    display:grid;
    place-items:center;
    min-height:150px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:24px;
    background:rgba(255,255,255,.10);
    text-align:center;
}

.vx-beta-hero strong {
    font-size:1.35rem;
}

.vx-beta-actions {
    display:flex;
    justify-content:flex-end;
    margin-top:14px;
}

.vx-beta-automatic,
.vx-beta-manual {
    margin-top:16px;
    padding:25px;
    border:1px solid var(--vx-line-200);
    border-radius:24px;
    background:#fff;
    box-shadow:var(--vx-shadow-sm);
}

.vx-beta-automatic h2,
.vx-beta-manual h2 {
    margin:6px 0;
}

.vx-beta-manual header p {
    color:var(--vx-ink-600);
}

.vx-beta-summary {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin:18px 0;
}

.vx-beta-summary article {
    padding:17px;
    border-radius:16px;
    background:var(--vx-page);
}

.vx-beta-summary strong,
.vx-beta-summary small {
    display:block;
}

.vx-beta-summary strong {
    font-size:2rem;
}

.vx-beta-summary .is-warning {
    background:#fff5dd;
}

.vx-beta-summary .is-failed {
    background:#fdebea;
}

.vx-beta-checks {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
}

.vx-beta-checks article {
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    gap:11px;
    padding:14px;
    border-radius:15px;
    background:var(--vx-page);
}

.vx-beta-checks article>span {
    display:grid;
    place-items:center;
    width:40px;
    height:40px;
    border-radius:12px;
    color:#fff;
    background:#3f7c59;
}

.vx-beta-checks article.is-warning>span {
    background:#b18432;
}

.vx-beta-checks article.is-failed>span {
    background:#a44740;
}

.vx-beta-checks small,
.vx-beta-checks strong {
    display:block;
}

.vx-beta-checks p {
    margin:4px 0 0;
    color:var(--vx-ink-600);
    font-size:.78rem;
}

.vx-beta-manual>div {
    display:grid;
    gap:9px;
    margin-top:18px;
}

.vx-beta-manual article {
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(360px,.8fr);
    gap:16px;
    padding:17px;
    border-left:5px solid #8b9561;
    border-radius:16px;
    background:var(--vx-page);
}

.vx-beta-manual article.priority-critical {
    border-left-color:#a44740;
}

.vx-beta-manual article.priority-high {
    border-left-color:#b18432;
}

.vx-beta-manual h3 {
    margin:4px 0;
}

.vx-beta-manual p {
    margin:0;
    color:var(--vx-ink-600);
}

.vx-beta-manual form {
    display:grid;
    grid-template-columns:130px minmax(0,1fr) auto;
    align-items:center;
    gap:8px;
}

.vx-beta-manual select,
.vx-beta-manual input {
    min-height:43px;
    padding:9px 11px;
    border:1px solid var(--vx-line-200);
    border-radius:12px;
    background:#fff;
}

@media(max-width:900px) {
    .vx-beta-manual article {
        grid-template-columns:1fr;
    }
}

@media(max-width:760px) {
    .vx-beta-hero {
        grid-template-columns:1fr;
        padding:27px 21px;
    }

    .vx-beta-summary,
    .vx-beta-checks {
        grid-template-columns:1fr;
    }

    .vx-beta-manual form {
        grid-template-columns:1fr;
    }
}


/* Voyara 6.0.1 — professional admin separation */
.sidebar-bottom .vx-sidebar-label {
    display:block;
    margin:14px 4px 5px;
    opacity:.62;
    font-size:.62rem;
    font-weight:900;
    letter-spacing:.13em;
    text-transform:uppercase;
}


/* ================================================================
   VOYARA 6.0.2 — CONTEXTUAL SPELLING TRAINING
   ================================================================ */

.vx-spelling-question {
    text-align:center;
}

.vx-spelling-source-context {
    margin:30px auto 22px;
    padding:22px;
    border-radius:20px;
    background:#edf6f2;
}

.vx-spelling-source-context small {
    color:var(--vx-brand-700);
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.08em;
}

.vx-spelling-source-context h1 {
    margin:10px auto 0;
    max-width:760px;
    font-size:clamp(2rem,5vw,4.2rem);
    line-height:1.05;
    letter-spacing:-.04em;
}

.vx-spelling-old-answer {
    display:inline-grid;
    gap:5px;
    margin:0 auto 22px;
    padding:12px 18px;
    border-radius:15px;
    background:#fff1ef;
}

.vx-spelling-old-answer small {
    color:#8f4942;
    font-weight:800;
}

.vx-spelling-old-answer del {
    color:#b23c37;
    font-size:1.45rem;
    font-weight:900;
}

.vx-spelling-question form {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:end;
    gap:12px;
}

.vx-spelling-question form label {
    display:grid;
    gap:7px;
    text-align:left;
}

.vx-spelling-question form label>span {
    color:var(--vx-ink-700);
    font-weight:900;
}

.vx-spelling-question form input {
    min-height:58px;
}

@media(max-width:760px) {
    .vx-spelling-question form {
        grid-template-columns:1fr;
    }
}


/* ================================================================
   VOYARA 6.0.3 — WORD / SENTENCE TASK CLARITY
   ================================================================ */

.vx-spelling-task-badge {
    display:inline-flex;
    margin:14px auto 8px;
    padding:8px 13px;
    border-radius:999px;
    color:#0f6856;
    background:#dff2eb;
    font-size:.78rem;
    font-weight:900;
    letter-spacing:.03em;
}

.vx-spelling-instruction {
    margin:4px auto 16px;
    color:var(--vx-ink-700);
    font-size:1rem;
    font-weight:800;
}

.vx-spelling-question textarea {
    width:100%;
    min-height:110px;
    padding:14px;
    border:1px solid var(--vx-line-200);
    border-radius:15px;
    resize:vertical;
    font:inherit;
}

/* ================================================================
   VOYARA 6.0.4 — spelling focus word clarity
   ================================================================ */
.vx-spelling-focus-context {
    margin:0 auto 22px;
    padding:20px 22px;
    border:1px solid #cfe6dd;
    border-radius:20px;
    background:#f8fcfa;
}

.vx-spelling-focus-context small {
    color:var(--vx-brand-700);
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.08em;
}

.vx-spelling-focus-context p {
    margin:12px auto 8px;
    max-width:780px;
    color:var(--vx-ink-900);
    font-size:clamp(1.3rem,2.7vw,2rem);
    line-height:1.5;
    font-weight:800;
}

.vx-spelling-focus-context span {
    display:block;
    color:var(--vx-ink-600);
    font-size:.98rem;
    font-weight:700;
}

.vx-word-focus {
    display:inline-block;
    padding:.02em .18em;
    border-radius:10px;
    color:#b23c37;
    background:#fff0ee;
    font-weight:900;
}

/* ================================================================
   VOYARA 6.0.5 — source sentence word highlight clarity
   ================================================================ */
.vx-spelling-source-context h1 {
    line-height: 1.22;
}

.vx-source-word-focus {
    display:inline;
    padding:0 .04em;
    border-radius:0;
    background:transparent;
    color:#b23c37;
    text-decoration:underline;
    text-decoration-thickness:0.12em;
    text-underline-offset:0.12em;
    font-weight:900;
}

/* ================================================================
   VOYARA 6.0.8 — final spelling source sentence visual fix
   ================================================================ */
.vx-spelling-question .vx-spelling-source-context h1 {
    margin:10px auto 0;
    max-width:760px;
    color:var(--vx-ink-900) !important;
    text-decoration:none !important;
    font-size:clamp(2rem,5vw,4.2rem);
    line-height:1.22;
    letter-spacing:-.04em;
}

.vx-spelling-question .vx-spelling-source-context h1 .vx-source-word-focus {
    display:inline;
    padding:0 .04em;
    border-radius:0;
    background:transparent;
    color:#b23c37 !important;
    text-decoration-line:underline !important;
    text-decoration-style:solid !important;
    text-decoration-thickness:.12em !important;
    text-underline-offset:.12em;
    font-weight:900;
}

/* ================================================================
   VOYARA 6.0.9 — spelling input and previous-answer polish
   ================================================================ */
.vx-spelling-question .vx-spelling-old-answer {
    gap:3px;
    margin:0 auto 18px;
    padding:9px 14px;
    border-radius:13px;
    background:#fff5f3;
    opacity:.82;
}

.vx-spelling-question .vx-spelling-old-answer small {
    color:#8f625d;
    font-size:.72rem;
    font-weight:800;
    letter-spacing:.02em;
}

.vx-spelling-question .vx-spelling-old-answer del {
    color:#a85b54;
    font-size:1rem;
    font-weight:800;
}

.vx-spelling-question form label>span {
    font-size:.94rem;
}

.vx-spelling-question form input {
    min-height:58px;
    padding:12px 15px;
    font-size:1rem;
    font-weight:750;
}

.vx-spelling-question form input::placeholder {
    color:#7e8582;
    opacity:1;
    font-size:.98rem;
    font-weight:650;
}

/* ================================================================
   VOYARA 6.0.10 — dedicated spelling correction trainer
   ================================================================ */
.vx-spelling-correction {
    width:min(780px,100%);
    margin:0 auto;
    text-align:center;
}

.vx-spelling-correction>h1 {
    margin:18px 0 8px;
    color:var(--vx-ink-900);
    font-size:clamp(2rem,5vw,3.8rem);
    line-height:1.05;
    letter-spacing:-.045em;
    text-decoration:none;
}

.vx-spelling-correction__lead {
    max-width:620px;
    margin:0 auto 25px;
    color:var(--vx-ink-600);
    font-size:1rem;
}

.vx-spelling-misspelled-word {
    display:grid;
    gap:9px;
    margin:0 auto 28px;
    padding:25px;
    border-radius:20px;
    background:#fff1ef;
}

.vx-spelling-misspelled-word small {
    color:#8f4942;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.08em;
}

.vx-spelling-misspelled-word del {
    color:#b23c37;
    font-size:clamp(2.2rem,6vw,4.5rem);
    font-weight:900;
    line-height:1;
    text-decoration-thickness:.09em;
}

.vx-spelling-correction form {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:end;
    gap:12px;
}

.vx-spelling-correction form label {
    display:grid;
    gap:7px;
    text-align:left;
}

.vx-spelling-correction form label>span {
    font-weight:900;
}

.vx-spelling-correction form input {
    min-height:58px;
    font-size:1.05rem;
}

@media(max-width:760px) {
    .vx-spelling-correction form {
        grid-template-columns:1fr;
    }
}

/* ================================================================
   VOYARA 6.0.11 — contextual genuine spelling errors
   ================================================================ */
.vx-spelling-gap-task {
    text-align:center;
}

.vx-spelling-gap-task>h1 {
    margin:18px 0 6px;
    color:var(--vx-ink-900);
    font-size:clamp(2rem,4vw,3.4rem);
    line-height:1.05;
    text-decoration:none;
}

.vx-spelling-gap-task__lead {
    margin:0 auto 22px;
    max-width:700px;
    color:var(--vx-ink-600);
    font-size:1.05rem;
}

.vx-spelling-target-sentence {
    margin:0 auto 18px;
    padding:22px;
    border-radius:20px;
    background:#edf6f2;
}

.vx-spelling-target-sentence small {
    color:var(--vx-brand-700);
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.vx-spelling-target-sentence p {
    margin:12px auto 0;
    color:var(--vx-ink-900);
    font-size:clamp(1.7rem,3.6vw,3rem);
    font-weight:900;
    line-height:1.3;
}

.vx-spelling-misspelled-word--compact {
    margin:0 auto 20px;
    padding:10px 16px;
}

.vx-spelling-gap-task form {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:end;
    gap:12px;
}

.vx-spelling-gap-task form label {
    display:grid;
    gap:7px;
    text-align:left;
}

@media(max-width:760px) {
    .vx-spelling-gap-task form {
        grid-template-columns:1fr;
    }
}


/* Voyalyn Web 6.2 production refinement */
.voyalyn-wordmark{display:flex;align-items:center;gap:14px;max-width:390px;margin-bottom:24px}
.voyalyn-wordmark img{width:66px!important;height:66px!important;object-fit:contain;border-radius:18px}
.voyalyn-wordmark span{display:grid;gap:2px}
.voyalyn-wordmark strong{font-size:2rem;line-height:1;color:var(--green-950,#0b4f43)}
.voyalyn-wordmark small{font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--vx-ink-600,#66736f)}
@media(max-width:760px){.voyalyn-wordmark{justify-content:center;margin-inline:auto}.voyalyn-wordmark img{width:54px!important;height:54px!important}.voyalyn-wordmark strong{font-size:1.65rem}}


/* Voyalyn 6.2.2 – desktop registration viewport fit */
@media (min-width: 981px) and (min-height: 760px) {
    .auth-layout {
        min-height: calc(100dvh - 118px);
        max-height: calc(100dvh - 118px);
    }

    .auth-story {
        padding: 32px 46px;
    }

    .auth-story h2 {
        margin-top: 42px;
        font-size: clamp(2.35rem, 3.5vw, 3.75rem);
    }

    .auth-card:not(.compact) {
        width: min(590px, calc(100% - 36px));
        margin: 8px auto;
        padding: 24px 40px;
    }

    .auth-card:not(.compact) h1 {
        margin: 5px 0;
        font-size: clamp(2rem, 3vw, 3rem);
    }

    .auth-card:not(.compact) > p {
        margin: 6px 0 0;
    }

    .auth-card:not(.compact) form {
        gap: 9px;
        margin-top: 14px;
    }

    .auth-card:not(.compact) input:not([type="checkbox"]) {
        min-height: 44px;
        padding-top: 9px;
        padding-bottom: 9px;
    }

    .auth-card:not(.compact) .check-row {
        gap: 8px;
        font-size: .76rem;
        line-height: 1.35;
    }

    .auth-card:not(.compact) .button.full {
        min-height: 44px;
    }

    .auth-card:not(.compact) .auth-switch {
        margin: 8px 0 0;
    }
}


/* ================================================================
   VOYALYN 6.2.3 — FOCUSED ONBOARDING / DESTINATION PICKER
   ================================================================ */
.onboarding-only-shell {
    min-height: 100dvh;
    background:
        radial-gradient(circle at 95% -5%, rgba(200,154,61,.08), transparent 28rem),
        var(--vx-page);
}

.onboarding-content {
    min-height: 100dvh;
}

.onboarding-only-shell .page {
    width: min(1180px, calc(100% - 40px));
    padding: 24px 0;
}

.onboarding-only-shell .vx-onboarding-shell {
    min-height: calc(100dvh - 48px);
}

.vx-country-picker {
    position: relative;
    z-index: 8;
}

.vx-country-picker__control {
    position: relative;
}

.vx-country-picker__control > span {
    position: absolute;
    top: 50%;
    right: 16px;
    color: var(--vx-ink-600);
    font-size: 1.1rem;
    transform: translateY(-50%);
    pointer-events: none;
}

.vx-country-picker__control input {
    padding-right: 44px;
}

.vx-country-native-select {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    min-height: 0 !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
}

.vx-country-results {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    left: 0;
    z-index: 20;
    max-height: 310px;
    padding: 7px;
    overflow-y: auto;
    border: 1px solid var(--vx-line-200);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 22px 55px rgba(7,59,51,.16);
}

.vx-country-result {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    width: 100%;
    padding: 11px 12px;
    border: 0;
    border-radius: 11px;
    color: var(--vx-ink-900);
    background: transparent;
    text-align: left;
    cursor: pointer;
}

.vx-country-result:hover,
.vx-country-result:focus-visible {
    background: var(--vx-brand-100);
    outline: none;
}

.vx-country-result strong {
    font-size: .9rem;
}

.vx-country-result small {
    color: var(--vx-ink-600);
    font-size: .72rem;
}

.vx-onboarding-form:has([data-country-picker]) {
    gap: 0;
}

.vx-onboarding-form:has([data-country-picker]) .vx-country-suggestion {
    margin: 12px 0 0;
}

.vx-onboarding-form:has([data-country-picker]) .vx-onboarding-fields {
    margin-top: 18px;
}

@media (min-width: 981px) {
    .onboarding-only-shell .vx-onboarding-main {
        padding: 38px 46px;
    }

    .onboarding-only-shell .vx-onboarding-form {
        margin-top: 24px;
    }

    .onboarding-only-shell .vx-onboarding-title {
        margin-bottom: 22px;
    }

    .onboarding-only-shell .vx-onboarding-title h2 {
        font-size: clamp(2.5rem,3.2vw,3.35rem);
    }
}

@media (max-width: 680px) {
    .onboarding-only-shell .page {
        width: 100%;
        padding: 0 12px 24px;
    }

    .onboarding-only-shell .vx-onboarding-shell {
        min-height: 0;
    }

    .vx-country-results {
        position: fixed;
        top: auto;
        right: 12px;
        bottom: calc(84px + env(safe-area-inset-bottom));
        left: 12px;
        max-height: min(48vh, 340px);
    }
}