*{box-sizing:border-box}:root{--bg:#f4f6f8;--card:#fff;--text:#202124;--muted:#667085;--border:#e4e7ec;--accent:#1f5eff;--soft:#eef4ff}body{margin:0;font-family:Arial,"Noto Sans Devanagari",sans-serif;color:var(--text);background:var(--bg);line-height:1.6}a{color:#164dcc;text-decoration:none}a:hover{text-decoration:underline}.container{width:min(1160px,calc(100% - 28px));margin:auto;padding:26px 0 50px}.site-header{background:#fff;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:20}.nav-wrap{width:min(1160px,calc(100% - 28px));margin:auto;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 0}.brand{font-weight:800;font-size:19px;color:var(--text)}nav{display:flex;gap:16px;flex-wrap:wrap;align-items:center}nav a{color:#344054;font-weight:600;font-size:14px}.nav-cta{background:var(--accent);color:#fff!important;padding:8px 12px;border-radius:8px}.site-footer{background:#111827;color:#e5e7eb;margin-top:50px}.footer-grid{width:min(1160px,calc(100% - 28px));margin:auto;padding:38px 0;display:grid;grid-template-columns:2fr 1fr 1fr;gap:28px}.footer-grid a{display:block;color:#d1d5db;margin:7px 0}.hero{display:grid;grid-template-columns:1.45fr .85fr;gap:28px;padding:34px 0}.hero h1,.page-header h1{font-size:clamp(34px,5vw,58px);line-height:1.05;margin:10px 0 18px}.hero p,.page-header p{font-size:18px;color:#475467;max-width:800px}.hero-panel,.card,.feature-card,.course-card,.price-card{background:#fff;border:1px solid var(--border);border-radius:14px;padding:22px;box-shadow:0 2px 12px rgba(16,24,40,.04)}.eyebrow{display:inline-block;font-weight:800;color:#164dcc;background:var(--soft);padding:5px 9px;border-radius:999px;font-size:13px}.recommend-form{display:grid;grid-template-columns:1fr 160px auto;gap:12px;margin-top:24px;align-items:end}label{display:block;font-weight:700;margin:8px 0}input,select,textarea{width:100%;margin-top:6px;border:1px solid #cfd4dc;background:#fff;border-radius:9px;padding:11px 12px;font:inherit}textarea{min-height:130px;resize:vertical}button,.button-link{display:inline-block;border:0;border-radius:9px;padding:11px 17px;background:var(--accent);color:#fff;cursor:pointer;font-weight:800;font-size:14px}.secondary-button,.button-link.secondary{background:#eef1f5;color:#263238}.button-row{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0}.section{margin:42px 0}.section-heading{display:flex;justify-content:space-between;align-items:end}.card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.course-card p{color:#5d6675}.course-topline{display:flex;justify-content:space-between}.pill,.plan-tag,.badge{display:inline-block;font-size:12px;font-weight:800;border-radius:999px;padding:4px 8px;background:#eef1f5}.plan-tag.premium{background:#fff2cc}.plan-tag.free{background:#e8f7ee}.page-header{padding:22px 0}.card{margin:18px 0}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}.grid>div{background:#f7f7f8;padding:12px;border-radius:9px}.big{font-size:20px;font-weight:800}.small{font-size:13px;color:var(--muted)}.notice{background:#fff8db;border:1px solid #ecd98b;padding:14px;border-radius:9px;margin:16px 0}.error-box{background:#fdecec;color:#8c1d18;padding:11px;border-radius:8px;margin:12px 0}.breadcrumbs{font-size:14px;color:var(--muted);margin:12px 0}.chapter-list li{padding:9px 0;border-bottom:1px solid #eee}.chapter-content h2{margin-top:30px}.split-section{display:grid;grid-template-columns:1fr 1fr;gap:22px}.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.price-card.featured{border:2px solid var(--accent)}.price{font-size:26px;font-weight:800}.auth-card{max-width:620px;margin:30px auto}.dashboard-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:18px}.practice-question{background:#fff;border:1px solid var(--border);border-radius:12px;padding:18px;margin:14px 0}.question-number{font-size:12px;color:var(--muted);font-weight:800}.live-box{margin:14px 0;padding:12px;border:1px solid var(--border);border-radius:9px;background:#fafafa}#liveNative{font-size:18px;font-weight:700;margin-left:6px}.status{min-height:24px;margin-top:12px;font-weight:700}.word-card{border:1px solid var(--border);border-radius:10px;padding:14px;margin:12px 0}.feature-row{display:flex;justify-content:space-between;gap:12px;padding:10px 4px;border-bottom:1px solid #eee}.present{font-weight:800}.absent{color:#888}.grammar-detail{border:1px solid var(--border);border-radius:10px;margin:12px 0;overflow:hidden}.grammar-detail summary{padding:14px;background:#fafafa;font-weight:800;cursor:pointer}.detail{padding:15px}.local{padding-left:10px;border-left:3px solid #ddd}pre{background:#f7f7f8;border-radius:8px;padding:12px;white-space:pre-wrap}.hidden{display:none}.grammar-reference{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.grammar-term{margin:0}@media(max-width:900px){.hero,.split-section,.dashboard-grid,.pricing-grid{grid-template-columns:1fr}.card-grid{grid-template-columns:repeat(2,1fr)}.recommend-form{grid-template-columns:1fr}}@media(max-width:620px){.nav-wrap{align-items:flex-start;flex-direction:column}.card-grid,.grammar-reference,.footer-grid{grid-template-columns:1fr}.feature-row{flex-direction:column}}
.global-language-label{display:flex;align-items:center;gap:6px;margin:0;font-size:12px}.global-language-label select{width:125px;margin:0;padding:6px 8px;font-size:12px}.course-meta-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:20px}.course-meta-grid>div{background:#fff;border:1px solid var(--border);border-radius:10px;padding:12px}.course-meta-grid span{display:block;color:var(--muted)}.topic-index{display:grid;gap:10px}.topic-index-item{display:grid;grid-template-columns:52px 1fr;gap:16px;padding:18px 0;border-bottom:1px solid var(--border)}.topic-number{width:42px;height:42px;display:grid;place-items:center;background:var(--accent-soft);border-radius:10px;color:var(--accent);font-weight:900}.concept-chip-row{display:flex;flex-wrap:wrap;gap:7px;margin:10px 0 14px}.concept-chip{display:inline-block;background:#eef1f5;border-radius:999px;padding:4px 9px;font-size:12px;font-weight:700}.concept-stack{display:grid;gap:18px}.concept-card{margin:0}.concept-number{color:var(--muted);font-size:12px;font-weight:800}.native-title{font-size:18px;font-weight:800;color:#315493}.example-item{border-left:4px solid #dfe7ff;padding:10px 12px;background:#fafbff}.example-sentence{font-weight:800}.topic-analyzer-box,.topic-context-banner{border:2px solid #dce6ff;background:#f7faff}@media(max-width:700px){.course-meta-grid{grid-template-columns:1fr}.topic-index-item{grid-template-columns:1fr}}


.page-back-row {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
    margin: 10px 0 14px;
}

.back-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    border: 1px solid var(--border);
    border-radius: 9px;
    background: #fff;
    color: #344054;
    font-size: 14px;
    font-weight: 800;
    text-decoration: none;
}

.back-link:hover {
    background: #f7f8fa;
    text-decoration: none;
}

.bottom-back-row {
    margin-top: 24px;
}

.alphabet-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.alphabet-card{background:#fff;border:1px solid var(--border);border-radius:15px;padding:14px;text-align:center}.alphabet-letter{font-size:64px;font-weight:900;line-height:1}.alphabet-word{border-top:1px solid #eee;margin-top:10px;padding-top:10px;display:flex;flex-direction:column;align-items:center;gap:4px}.picture-emoji{font-size:52px;line-height:1.15}.pronunciation{font-size:12px;color:var(--muted)}.mini-speak,.inline-speak,.speak-button,.word-chip{background:#eef4ff;color:#164dcc;border:1px solid #dbe6ff;padding:6px 9px;border-radius:999px;font-size:12px}.inline-speak{padding:2px 6px;margin-left:5px}.explanation-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.vocab-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}.vocab-card{border:1px solid var(--border);border-radius:12px;padding:12px;display:flex;flex-direction:column;align-items:center;gap:5px;text-align:center}.game-picture{font-size:90px;text-align:center}.quiz-options{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.quiz-option{background:#eef1f5;color:#202124}.quiz-feedback{font-weight:800;min-height:24px}.story-card{display:grid;grid-template-columns:100px 1fr;gap:16px;border:1px solid var(--border);border-radius:12px;padding:16px;margin:14px 0}.story-picture{font-size:72px;text-align:center}.story-question{margin:7px 0}.video-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.video-card{background:#fff;border:1px solid var(--border);border-radius:12px;padding:16px}.course-video{width:100%;aspect-ratio:16/9;border:0;border-radius:10px;background:#111}.beginner-feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.beginner-feature-grid a{display:block;padding:16px;border:1px solid var(--border);border-radius:12px;font-weight:800}.store-picture{font-size:64px}.admin-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.admin-video-row{display:flex;justify-content:space-between;gap:15px;padding:12px 0;border-bottom:1px solid var(--border)}.danger-button{background:#b42318}.big-answer{font-size:22px;font-weight:800}
@media(max-width:900px){.alphabet-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.vocab-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.beginner-feature-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.alphabet-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.vocab-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.video-grid,.admin-form-grid,.beginner-feature-grid{grid-template-columns:1fr}.story-card{grid-template-columns:1fr}.admin-video-row{flex-direction:column}}

/* ============================================================
   V11.2 responsive multilingual UI
   ============================================================ */

:root {
    --bg: #f3f6fb;
    --card: #ffffff;
    --text: #172033;
    --muted: #667085;
    --border: #e1e7f0;
    --accent: #3157d5;
    --accent-2: #7c4dff;
    --accent-soft: #eef2ff;
    --success: #087a55;
    --shadow-sm: 0 2px 10px rgba(21, 36, 69, .05);
    --shadow-md: 0 14px 40px rgba(35, 54, 103, .10);
    --radius: 18px;
}

html {
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
}

body {
    font-family:
        Inter,
        ui-sans-serif,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        "Noto Sans Devanagari",
        "Noto Sans",
        Arial,
        sans-serif;
    background:
        radial-gradient(circle at 5% 0%, rgba(90, 117, 255, .08), transparent 28rem),
        radial-gradient(circle at 95% 12%, rgba(124, 77, 255, .06), transparent 24rem),
        var(--bg);
    overflow-x: hidden;
}

button,
a,
input,
select,
textarea,
summary {
    -webkit-tap-highlight-color: transparent;
}

button,
.button-link,
.back-link {
    min-height: 42px;
}

.container {
    width: min(1180px, calc(100% - 32px));
    padding-top: 30px;
}

/* Header */
.site-header {
    border-bottom: 1px solid rgba(225, 231, 240, .9);
    background: rgba(255, 255, 255, .94);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    box-shadow: 0 1px 10px rgba(34, 51, 84, .04);
}

.nav-wrap {
    width: min(1240px, calc(100% - 28px));
    min-height: 72px;
    padding: 10px 0;
}

.brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 18px;
    white-space: nowrap;
}

.brand-mark {
    display: grid;
    place-items: center;
    width: 48px;
    height: 38px;
    color: #fff;
    background: linear-gradient(135deg, var(--accent), var(--accent-2));
    border-radius: 12px;
    box-shadow: 0 7px 18px rgba(49, 87, 213, .25);
    font-size: 12px;
    letter-spacing: .04em;
}

.primary-navigation {
    display: flex;
    align-items: center;
    gap: 14px;
}

.primary-navigation a {
    transition:
        color .18s ease,
        transform .18s ease;
}

.primary-navigation a:hover {
    color: var(--accent);
    transform: translateY(-1px);
    text-decoration: none;
}

.global-language-label {
    background: #f7f9fd;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 4px 7px;
}

.global-language-label select {
    width: 132px;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.menu-toggle {
    display: none;
    width: 46px;
    min-height: 44px;
    padding: 10px;
    background: #f4f6fa;
    border: 1px solid var(--border);
}

.menu-toggle span {
    display: block;
    height: 2px;
    background: #273653;
    margin: 5px 0;
    border-radius: 2px;
    transition: transform .2s ease, opacity .2s ease;
}

.menu-toggle.is-open span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.menu-toggle.is-open span:nth-child(2) {
    opacity: 0;
}

.menu-toggle.is-open span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

.translation-status {
    width: min(1240px, calc(100% - 28px));
    min-height: 0;
    margin: auto;
    font-size: 12px;
    color: #53617b;
    transition: all .2s ease;
}

.translation-status:not(:empty) {
    padding: 0 0 8px;
}

.status-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    margin-right: 6px;
    border-radius: 50%;
    background: #6a7deb;
    animation: pulseDot 1s ease infinite;
}

.status-dot.ready {
    background: #18a06f;
    animation: none;
}

/* Page/learning cards */
.card,
.course-card,
.feature-card,
.price-card,
.video-card {
    border-color: rgba(220, 227, 239, .95);
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
}

.card:hover,
.course-card:hover,
.feature-card:hover,
.price-card:hover {
    box-shadow: var(--shadow-md);
}

.learning-hero {
    position: relative;
    overflow: hidden;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .95), rgba(246, 248, 255, .92));
    border: 1px solid var(--border);
    border-radius: 24px;
    padding: clamp(22px, 4vw, 42px);
    margin-bottom: 22px;
    box-shadow: var(--shadow-sm);
}

.learning-hero::after {
    content: "";
    position: absolute;
    right: -80px;
    top: -100px;
    width: 260px;
    height: 260px;
    border-radius: 50%;
    background:
        radial-gradient(circle, rgba(88, 112, 255, .16), rgba(88, 112, 255, 0) 68%);
    pointer-events: none;
}

.topic-lead {
    max-width: 850px;
    font-size: clamp(16px, 2vw, 19px);
    color: #46536a;
}

/* English + selected-language block */
.localize-unit {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    flex-wrap: wrap;
    margin: 6px 0;
}

.localize-unit > .js-localize {
    flex: 1 1 420px;
    min-width: 0;
}

.compact-localize-unit {
    display: inline-flex;
    align-items: center;
    width: 100%;
    margin: 0;
}

.compact-localize-unit > .js-localize {
    flex: 1 1 auto;
}

.translation-box {
    margin: 8px 0 18px;
    padding: 13px 15px;
    border: 1px solid #dbe3ff;
    border-left: 4px solid var(--accent);
    border-radius: 12px;
    background:
        linear-gradient(135deg, #f7f9ff, #f5fbff);
    color: #243454;
    animation: translationIn .25s ease both;
}

.translation-box.is-loading {
    opacity: .78;
}

.translation-box.is-fallback {
    border-left-color: #d49b1b;
    background: #fffaf0;
}

.translation-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 5px;
    color: #506080;
    font-size: 12px;
    font-weight: 800;
}

.translation-copy {
    font-size: 15px;
    line-height: 1.65;
    overflow-wrap: anywhere;
}

.translation-speak {
    min-height: 30px;
    padding: 4px 9px;
    border: 1px solid #cfdaff;
    border-radius: 999px;
    color: #294bb8;
    background: #fff;
    font-size: 11px;
}

.translation-spinner {
    width: 13px;
    height: 13px;
    border: 2px solid #d5dcf2;
    border-top-color: var(--accent);
    border-radius: 50%;
    animation: spin .7s linear infinite;
}

.speak-button,
.mini-speak,
.inline-speak,
.word-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    flex: 0 0 auto;
    transition:
        transform .15s ease,
        box-shadow .15s ease,
        background .15s ease;
}

.speak-button:hover,
.mini-speak:hover,
.inline-speak:hover,
.word-chip:hover {
    transform: translateY(-1px);
    box-shadow: 0 5px 13px rgba(49, 87, 213, .10);
}

/* Topic cards */
.concept-card {
    border-left: 4px solid transparent;
    background:
        linear-gradient(#fff, #fff) padding-box,
        linear-gradient(180deg, #5a75ff, #a276ff) border-box;
}

.concept-card h2 {
    font-size: clamp(22px, 3vw, 29px);
}

.concept-explanation {
    font-size: 16px;
    line-height: 1.78;
}

.rule-list li,
.learning-outcome-list li {
    margin: 10px 0;
}

.example-item {
    border-left-color: #758cff;
    border-radius: 0 12px 12px 0;
}

/* Alphabet & vocabulary */
.alphabet-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.alphabet-card,
.vocab-card {
    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.alphabet-card:hover,
.vocab-card:hover {
    transform: translateY(-4px);
    border-color: #bac8f8;
    box-shadow: 0 12px 28px rgba(50, 75, 138, .10);
}

.alphabet-letter {
    background: linear-gradient(135deg, #2e51ca, #8355de);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.picture-emoji,
.story-picture,
.game-picture {
    filter: drop-shadow(0 7px 10px rgba(30, 45, 80, .08));
}

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

/* Touch-friendly practice */
.quiz-option {
    min-height: 48px;
    border: 1px solid #d8deea;
    transition: transform .15s ease, background .15s ease;
}

.quiz-option:hover {
    transform: translateY(-1px);
    background: #e7edff;
}

.practice-question {
    transition: border-color .18s ease, box-shadow .18s ease;
}

.practice-question:hover {
    border-color: #c6d0f3;
    box-shadow: 0 8px 24px rgba(38, 58, 110, .07);
}

details > summary {
    cursor: pointer;
    min-height: 42px;
    display: flex;
    align-items: center;
}

/* Responsive video */
.course-video {
    max-width: 100%;
}

/* Reveal animation */
.reveal-item {
    opacity: 0;
    transform: translateY(18px);
    transition:
        opacity .48s ease,
        transform .48s ease,
        box-shadow .18s ease;
}

.reveal-item.is-visible {
    opacity: 1;
    transform: none;
}

/* Toast */
.site-toast {
    position: fixed;
    left: 50%;
    bottom: max(22px, env(safe-area-inset-bottom));
    transform: translate(-50%, 18px);
    z-index: 999;
    max-width: min(90vw, 520px);
    padding: 11px 15px;
    color: #fff;
    background: #1d2939;
    border-radius: 12px;
    box-shadow: 0 12px 40px rgba(0,0,0,.22);
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease, transform .2s ease;
}

.site-toast.show {
    opacity: 1;
    transform: translate(-50%, 0);
}

/* Keyframes */
@keyframes spin {
    to { transform: rotate(360deg); }
}

@keyframes pulseDot {
    50% { opacity: .35; }
}

@keyframes translationIn {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }
}

/* Tablet */
@media (max-width: 1080px) {
    .menu-toggle {
        display: inline-block;
    }

    .primary-navigation {
        position: absolute;
        left: 14px;
        right: 14px;
        top: 68px;
        display: none;
        padding: 14px;
        background: #fff;
        border: 1px solid var(--border);
        border-radius: 16px;
        box-shadow: var(--shadow-md);
        max-height: calc(100vh - 90px);
        overflow-y: auto;
    }

    .primary-navigation.is-open {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        animation: translationIn .18s ease both;
    }

    .primary-navigation a {
        display: flex;
        align-items: center;
        min-height: 42px;
        padding: 7px 10px;
        border-radius: 9px;
    }

    .global-language-label {
        grid-column: 1 / -1;
        justify-content: space-between;
    }

    .global-language-label select {
        width: min(220px, 55vw);
    }

    .alphabet-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .vocab-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

/* Phone */
@media (max-width: 700px) {
    .container {
        width: min(100% - 20px, 1180px);
        padding-top: 18px;
    }

    .nav-wrap {
        width: calc(100% - 20px);
        min-height: 62px;
    }

    .brand {
        font-size: 15px;
    }

    .brand-mark {
        width: 34px;
        height: 34px;
    }

    .learning-hero {
        border-radius: 18px;
        padding: 20px 16px;
    }

    .hero h1,
    .page-header h1 {
        font-size: clamp(30px, 10vw, 42px);
    }

    .primary-navigation.is-open {
        grid-template-columns: 1fr;
    }

    .card,
    .course-card,
    .feature-card,
    .price-card {
        border-radius: 14px;
        padding: 16px;
    }

    .alphabet-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .vocab-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 9px;
    }

    .alphabet-letter {
        font-size: 54px;
    }

    .picture-emoji {
        font-size: 46px;
    }

    .localize-unit {
        display: block;
    }

    .localize-unit .speak-button,
    .localize-unit .mini-speak {
        margin-top: 5px;
    }

    .translation-box {
        margin-top: 8px;
        padding: 11px 12px;
    }

    .translation-label {
        align-items: flex-start;
    }

    .translation-speak {
        white-space: nowrap;
    }

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

    .story-picture {
        font-size: 58px;
    }

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

    .button-row,
    .page-back-row {
        align-items: stretch;
    }

    .button-row > *,
    .page-back-row > * {
        flex: 1 1 100%;
        text-align: center;
        justify-content: center;
    }

    .course-meta-grid {
        grid-template-columns: 1fr;
    }

    .topic-index-item {
        grid-template-columns: 44px 1fr;
        gap: 10px;
    }

    .grammar-reference,
    .card-grid,
    .video-grid {
        grid-template-columns: 1fr;
    }
}

/* Very small devices */
@media (max-width: 390px) {
    .alphabet-grid,
    .vocab-grid {
        grid-template-columns: 1fr 1fr;
    }

    .primary-navigation {
        left: 8px;
        right: 8px;
    }

    .translation-label {
        display: block;
    }

    .translation-speak {
        margin-top: 6px;
    }
}

/* Coarse-pointer/touch devices */
@media (pointer: coarse) {
    button,
    .button-link,
    .back-link,
    .primary-navigation a {
        min-height: 46px;
    }

    select,
    input,
    textarea {
        font-size: 16px;
    }
}

/* Respect accessibility settings */
@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }

    .reveal-item {
        opacity: 1 !important;
        transform: none !important;
    }
}


/* V11.4 - purposeful speech controls only */
.speak-button {
    background: #eef3ff;
    color: #294bb8;
    border: 1px solid #d2dcff;
    padding: 8px 12px;
    min-height: 36px;
    font-size: 12px;
}

.mini-speak {
    background: #f6f8fc;
    color: #44577d;
    border: 1px solid #e0e6ef;
    padding: 6px 9px;
    min-height: 32px;
    font-size: 11px;
}

.translation-speak {
    opacity: .92;
}


/* V11.5 - selected-language topic sample */
#language + .small {
    display: block;
    margin-top: 7px;
    color: #667085;
}

#sentence {
    font-size: 16px;
    line-height: 1.65;
}

.live-box {
    overflow-wrap: anywhere;
}

/* V12 system, admin, payment, security UI */
.system-page{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 20% 20%,rgba(49,87,213,.12),transparent 30rem),#f4f6fb}.system-card{width:min(680px,100%);text-align:center;background:#fff;border:1px solid var(--border);border-radius:24px;padding:clamp(26px,5vw,52px);box-shadow:var(--shadow-md)}.system-card.in-layout{margin:55px auto}.system-icon{font-size:58px}.error-code{font-weight:900;font-size:72px;color:#dce3f8;line-height:1}.request-id{background:#f7f8fa;border-radius:10px;padding:10px}.admin-hero{background:linear-gradient(135deg,#132238,#243d69);color:#fff}.admin-hero p{color:#d8e0ee}.admin-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:18px 0}.admin-stat-grid.compact{grid-template-columns:repeat(2,minmax(0,220px))}.admin-stat{background:#fff;border:1px solid var(--border);border-radius:16px;padding:18px;box-shadow:var(--shadow-sm)}.admin-stat span{display:block;color:var(--muted);font-size:13px;font-weight:700}.admin-stat strong{display:block;margin-top:5px;font-size:clamp(24px,4vw,36px)}.chart-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.chart-card{min-width:0;background:#f9fafc;border:1px solid var(--border);border-radius:14px;padding:14px}.uet-chart{width:100%;max-width:100%}.config-status-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.config-status-grid>div{display:flex;flex-direction:column;gap:5px;background:#f7f9fc;padding:12px;border-radius:10px}.ok{color:#087a55;font-weight:800}.bad{color:#b54708;font-weight:800}.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}.admin-table{width:100%;min-width:780px;border-collapse:collapse}.admin-table th,.admin-table td{padding:11px;border-bottom:1px solid var(--border);text-align:left;vertical-align:top}.admin-table th{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:#667085}.order-status{display:inline-block;padding:4px 7px;border-radius:999px;background:#eef1f5;font-size:12px;font-weight:800}.order-status.paid{background:#e9f8f1;color:#087a55}.order-status.failed,.order-status.cancelled{background:#fff0ee;color:#b42318}.inline-form{display:flex;gap:6px}.inline-form select{margin:0}.mini-action{min-height:34px;padding:6px 9px}.toggle-row{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:14px;border:1px solid var(--border);border-radius:12px}.toggle-row span{flex:1}.toggle-row small{display:block;color:var(--muted);font-weight:400}.toggle-row input[type=checkbox]{width:24px;height:24px}.success-notice{background:#eaf8f2;border-color:#b7e5d2}.trial-access-banner,.trial-practice-note{background:linear-gradient(135deg,#fff8e7,#fffdf6);border:1px solid #ecd69b;border-radius:12px;padding:13px 15px;margin:14px 0}.locked-topic-title{font-weight:800;color:#7a8496}.locked-card{opacity:.82;background:#fafbfc}.lock-panel{margin-top:14px;padding:10px;border-radius:9px;background:#f0f2f6;font-weight:800}.payment-buttons{display:grid;gap:9px;margin-top:15px}.stripe-button{background:#635bff}.price-alt{color:#46536a;font-weight:800}.featured-secondary{border:2px solid #7b61c8}.payment-big{font-size:34px;font-weight:900}.screen-watermark{position:fixed;right:18px;bottom:18px;z-index:80;pointer-events:none;opacity:.10;transform:rotate(-8deg);font-size:13px;font-weight:900;color:#16213a}.capture-warning{position:fixed;left:50%;top:95px;z-index:1000;transform:translate(-50%,-20px);max-width:min(92vw,600px);padding:12px 16px;color:#fff;background:#1f2937;border-radius:12px;opacity:0;pointer-events:none;transition:.2s ease}.capture-warning.show{opacity:1;transform:translate(-50%,0)}.capture-shield #pageMain{filter:blur(12px)}.is-speaking{animation:speakingPulse .8s ease infinite alternate}@keyframes speakingPulse{from{box-shadow:0 0 0 0 rgba(49,87,213,.12)}to{box-shadow:0 0 0 8px rgba(49,87,213,.04)}}@media print{body[data-content-protection="1"] *{display:none!important}body[data-content-protection="1"]::before{content:"Printing is disabled for protected learning content.";display:block!important;padding:40px;font-size:22px}}@media(max-width:900px){.admin-stat-grid,.chart-grid,.config-status-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.admin-stat-grid,.chart-grid,.config-status-grid,.admin-stat-grid.compact{grid-template-columns:1fr}.toggle-row{align-items:flex-start}}
.prose{max-width:980px;margin:2rem auto;line-height:1.8}.prose h2{margin-top:2rem}.lift{transition:transform .2s,box-shadow .2s}.lift:hover{transform:translateY(-5px);box-shadow:0 16px 40px #0002}.hidden{display:none!important}.login-stage{text-align:center}.login-panel{text-align:left;margin-top:1rem;animation:fadeUp .35s ease}.light-switch{font-size:1.05rem}.light-switch.on{box-shadow:0 0 35px #ffd54f}.inline-row{display:flex;gap:1rem;align-items:center;justify-content:space-between;margin:.6rem 0}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.answer-choice{margin:.3rem}.answer-choice.correct{outline:3px solid #32a852}.answer-choice.wrong{outline:3px solid #d43b3b}.butterfly{position:fixed;left:-80px;top:45%;z-index:50;font-size:28px;pointer-events:none;opacity:0}.butterfly.fly{animation:butterflyFly 8s ease-in-out}.chat-launch{position:fixed;right:20px;bottom:20px;z-index:70;border-radius:999px}.chat-box{position:fixed;right:20px;bottom:75px;width:min(340px,calc(100vw - 40px));z-index:70;background:white;padding:1rem;border-radius:16px;box-shadow:0 18px 60px #0003}.chat-box input{width:100%;margin:.7rem 0}@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes butterflyFly{0%{left:-60px;top:70%;opacity:0}10%{opacity:1}30%{top:25%}60%{top:60%}90%{opacity:1}100%{left:105vw;top:20%;opacity:0}}@media(max-width:800px){.two-col{grid-template-columns:1fr}.prose{padding:1rem}}


/* V13.3 adaptive login sky */
.login-sky{
  position:relative; isolation:isolate; overflow:hidden;
  min-height:calc(100vh - 150px); margin:-1.5rem calc(50% - 50vw) 0;
  padding:clamp(2rem,6vw,5rem) 1rem 6rem;
  display:grid; place-items:start center;
  background:linear-gradient(180deg,#07162f 0%,#153a69 50%,#f3b276 100%);
  transition:background 1s ease;
}
.login-sky.theme-morning{background:linear-gradient(180deg,#8bd2ff 0%,#dff2ff 50%,#ffd9a8 100%)}
.login-sky.theme-afternoon{background:linear-gradient(180deg,#3c9ee8 0%,#9ed8ff 60%,#eef8ff 100%)}
.login-sky.theme-evening{background:linear-gradient(180deg,#382c75 0%,#c46577 55%,#ffb56b 100%)}
.login-sky.theme-night{background:linear-gradient(180deg,#020817 0%,#0b1e42 55%,#172b4f 100%)}
.sky-stars{position:absolute;inset:0;opacity:.85;pointer-events:none;background-image:
 radial-gradient(circle at 10% 16%,#fff 0 1px,transparent 2px),
 radial-gradient(circle at 22% 28%,#fff 0 1px,transparent 2px),
 radial-gradient(circle at 37% 12%,#fff 0 1.2px,transparent 2px),
 radial-gradient(circle at 52% 23%,#fff 0 1px,transparent 2px),
 radial-gradient(circle at 69% 13%,#fff 0 1px,transparent 2px),
 radial-gradient(circle at 83% 31%,#fff 0 1px,transparent 2px),
 radial-gradient(circle at 93% 11%,#fff 0 1px,transparent 2px);
 animation:twinkle 3.4s ease-in-out infinite alternate}
.theme-morning .sky-stars,.theme-afternoon .sky-stars{opacity:.08}
.sky-orb{position:absolute;right:9%;top:9%;width:78px;height:78px;border-radius:50%;background:#fff1a8;box-shadow:0 0 45px #ffe278aa}
.theme-night .sky-orb{background:#fffbe4;box-shadow:0 0 35px #dbe8ff88}
.sky-cloud{position:absolute;color:#fff;opacity:.28;font-size:90px;filter:blur(.2px);animation:cloudDrift 30s linear infinite}
.cloud-one{top:14%;left:-10%}.cloud-two{top:38%;left:-20%;animation-duration:43s;animation-delay:-17s}
.login-glass{position:relative;z-index:4;width:min(620px,calc(100vw - 2rem));padding:clamp(1.3rem,4vw,2.5rem);
 background:rgba(255,255,255,.93);backdrop-filter:blur(16px);border:1px solid #ffffff99;
 box-shadow:0 24px 80px #02081755;border-radius:26px}
.time-greeting{display:flex;gap:1rem;align-items:center;text-align:left;margin-bottom:1rem}
.greeting-icon{font-size:2.5rem}.greeting-kicker{font-weight:800;color:#4261d8;text-transform:uppercase;letter-spacing:.08em;font-size:.78rem}
.time-greeting h1{margin:.15rem 0;font-size:clamp(1.8rem,5vw,2.7rem)}.time-greeting p{margin:.25rem 0;color:#445}
.lamp-switch{display:flex;align-items:center;justify-content:center;gap:1.25rem;margin:1.4rem auto;padding:.8rem 1.25rem;
 border:0;border-radius:18px;background:#162440;color:white;font-weight:800;cursor:pointer;transition:.3s;min-width:235px}
.lamp-switch.on{background:#f3b51b;color:#2d2408;box-shadow:0 0 50px #ffd34d99}
.lamp-art{position:relative;width:58px;height:70px;display:block}
.lamp-shade{position:absolute;left:9px;top:2px;width:40px;height:24px;background:#f5c24e;clip-path:polygon(25% 0,75% 0,100% 100%,0 100%)}
.lamp-bulb{position:absolute;left:23px;top:22px;width:13px;height:13px;border-radius:50%;background:#7c6a32;transition:.3s}
.lamp-switch.on .lamp-bulb{background:#fff7a8;box-shadow:0 0 24px 12px #ffe66a}
.lamp-stand{position:absolute;left:27px;top:34px;width:4px;height:25px;background:#c7a75a}
.lamp-base{position:absolute;left:14px;bottom:2px;width:32px;height:7px;border-radius:50%;background:#9a7938}
.login-panel{border-top:1px solid #dde4f2;padding-top:1.2rem}
.login-flying-butterfly{position:absolute;z-index:3;width:76px;height:auto;left:-110px;top:28%;pointer-events:none;animation:loginButterfly 24s ease-in-out infinite}
.login-firefly{position:absolute;z-index:2;color:#ffe86d;text-shadow:0 0 12px #fff176;font-size:20px;animation:firefly 5s ease-in-out infinite}
.firefly-a{left:12%;top:35%}.firefly-b{right:18%;top:45%;animation-delay:-2s}.firefly-c{left:25%;bottom:18%;animation-delay:-4s}
@keyframes loginButterfly{0%{left:-110px;top:65%;transform:rotate(-8deg)}25%{left:25%;top:22%;transform:rotate(6deg)}55%{left:58%;top:48%;transform:rotate(-5deg)}100%{left:110%;top:18%;transform:rotate(8deg)}}
@keyframes cloudDrift{from{transform:translateX(0)}to{transform:translateX(130vw)}}
@keyframes twinkle{from{filter:brightness(.7)}to{filter:brightness(1.5)}}
@keyframes firefly{0%,100%{opacity:.15;transform:translate(0,0)}50%{opacity:1;transform:translate(20px,-18px)}}
@media(max-width:650px){.login-sky{padding-top:1.25rem}.time-greeting{align-items:flex-start}.login-flying-butterfly{width:52px}.sky-orb{width:55px;height:55px}.lamp-switch{width:100%}}
@media(prefers-reduced-motion:reduce){.login-flying-butterfly,.sky-cloud,.sky-stars,.login-firefly{animation:none}}


/* ============================================================
   V13.4 ORIGINAL ADAPTIVE CSS BUTTERFLY
   No butterfly image/GIF is used.
   ============================================================ */

:root{
    --butterfly-main:#5b67e8;
    --butterfly-main-2:#7b48d6;
    --butterfly-accent:#ffd35a;
    --butterfly-edge:#243153;
    --butterfly-body:#22283a;
    --butterfly-glow:rgba(91,103,232,.28);
}

.uet-butterfly{
    position:fixed;
    z-index:45;
    width:72px;
    height:58px;
    pointer-events:none;
    transform-origin:center;
    filter:drop-shadow(0 7px 10px rgba(14,25,54,.18));
    opacity:0;
    will-change:transform,left,top,opacity;
}

.uet-butterfly-wing{
    position:absolute;
    display:block;
    border:2px solid var(--butterfly-edge);
    background:
      radial-gradient(circle at 62% 36%, var(--butterfly-accent) 0 7%, transparent 8%),
      radial-gradient(circle at 36% 63%, rgba(255,255,255,.72) 0 6%, transparent 7%),
      linear-gradient(145deg,var(--butterfly-main),var(--butterfly-main-2));
    box-shadow:
      inset 0 0 0 2px rgba(255,255,255,.10),
      0 0 16px var(--butterfly-glow);
}

.wing-left-upper{
    width:31px;height:37px;left:5px;top:2px;
    border-radius:85% 40% 70% 30%;
    transform-origin:100% 75%;
    transform:rotate(-19deg);
    animation:uetWingLeft .34s ease-in-out infinite alternate;
}
.wing-right-upper{
    width:31px;height:37px;right:5px;top:2px;
    border-radius:40% 85% 30% 70%;
    transform-origin:0% 75%;
    transform:rotate(19deg);
    animation:uetWingRight .34s ease-in-out infinite alternate;
}
.wing-left-lower{
    width:23px;height:25px;left:10px;bottom:2px;
    border-radius:62% 28% 82% 35%;
    transform-origin:100% 25%;
    transform:rotate(18deg);
    opacity:.94;
    animation:uetLowerLeft .34s ease-in-out infinite alternate;
}
.wing-right-lower{
    width:23px;height:25px;right:10px;bottom:2px;
    border-radius:28% 62% 35% 82%;
    transform-origin:0% 25%;
    transform:rotate(-18deg);
    opacity:.94;
    animation:uetLowerRight .34s ease-in-out infinite alternate;
}

.uet-butterfly-body{
    position:absolute;
    left:33px;top:14px;width:7px;height:34px;
    border-radius:70% 70% 45% 45%;
    background:linear-gradient(#111827,var(--butterfly-body));
    z-index:5;
}
.uet-butterfly-body::before{
    content:"";
    position:absolute;
    left:-2px;top:-6px;width:11px;height:11px;
    border-radius:50%;
    background:#141923;
}

.uet-butterfly-antenna{
    position:absolute;
    top:4px;
    width:20px;
    height:18px;
    border-top:1.8px solid var(--butterfly-body);
    z-index:4;
}
.antenna-left{
    left:22px;
    border-radius:80% 0 0 0;
    transform:rotate(17deg);
}
.antenna-right{
    right:22px;
    border-radius:0 80% 0 0;
    transform:rotate(-17deg);
}

/* Default site flight: appears only during a flight cycle. */
.uet-butterfly-global{
    left:-100px;
    top:22vh;
}

/* Login butterfly lives within login sky instead of viewport. */
.login-sky .login-flying-butterfly{
    position:absolute;
    z-index:3;
    left:-100px;
    top:58%;
    opacity:1;
    animation:loginButterflyV134 23s cubic-bezier(.36,.06,.24,.99) infinite;
}

/* Adaptive palettes */
.login-sky.theme-morning{
    --butterfly-main:#ff8b4a;
    --butterfly-main-2:#ffd451;
    --butterfly-accent:#48a9e6;
    --butterfly-edge:#5c4430;
    --butterfly-body:#493a30;
    --butterfly-glow:rgba(255,178,70,.40);
}
.login-sky.theme-afternoon{
    --butterfly-main:#1e97d5;
    --butterfly-main-2:#31d3c5;
    --butterfly-accent:#ffd952;
    --butterfly-edge:#174c72;
    --butterfly-body:#18344a;
    --butterfly-glow:rgba(45,185,218,.38);
}
.login-sky.theme-evening{
    --butterfly-main:#ef668c;
    --butterfly-main-2:#8f59d1;
    --butterfly-accent:#ffd26a;
    --butterfly-edge:#56335d;
    --butterfly-body:#3d2947;
    --butterfly-glow:rgba(219,95,161,.42);
}
.login-sky.theme-night{
    --butterfly-main:#4a7cff;
    --butterfly-main-2:#8b5cf6;
    --butterfly-accent:#9ef4ff;
    --butterfly-edge:#182759;
    --butterfly-body:#10182d;
    --butterfly-glow:rgba(113,155,255,.52);
}

/* Global page palettes */
body.page-dark,
body[data-theme="dark"]{
    --butterfly-main:#6fa8ff;
    --butterfly-main-2:#9d78ff;
    --butterfly-accent:#8ff7f0;
    --butterfly-edge:#d9e6ff;
    --butterfly-body:#eef4ff;
    --butterfly-glow:rgba(111,168,255,.45);
}
body.page-warm{
    --butterfly-main:#e96a7a;
    --butterfly-main-2:#f09b51;
    --butterfly-accent:#ffda63;
    --butterfly-edge:#5e3a42;
    --butterfly-body:#422a32;
    --butterfly-glow:rgba(233,106,122,.34);
}
body.page-green{
    --butterfly-main:#2eb67d;
    --butterfly-main-2:#56c8a8;
    --butterfly-accent:#ffd55e;
    --butterfly-edge:#235747;
    --butterfly-body:#1d4238;
    --butterfly-glow:rgba(46,182,125,.34);
}

/* JavaScript applies these flight classes. */
.uet-butterfly-global.is-flying-a{
    animation:uetFlightA 17s cubic-bezier(.32,.02,.23,.99) forwards;
}
.uet-butterfly-global.is-flying-b{
    animation:uetFlightB 20s cubic-bezier(.24,.05,.28,.98) forwards;
}
.uet-butterfly-global.is-flying-c{
    animation:uetFlightC 18s cubic-bezier(.33,.03,.26,.99) forwards;
}

@keyframes uetWingLeft{
    from{transform:rotate(-19deg) scaleX(1)}
    to{transform:rotate(-2deg) scaleX(.42)}
}
@keyframes uetWingRight{
    from{transform:rotate(19deg) scaleX(1)}
    to{transform:rotate(2deg) scaleX(.42)}
}
@keyframes uetLowerLeft{
    from{transform:rotate(18deg) scaleX(1)}
    to{transform:rotate(5deg) scaleX(.50)}
}
@keyframes uetLowerRight{
    from{transform:rotate(-18deg) scaleX(1)}
    to{transform:rotate(-5deg) scaleX(.50)}
}

@keyframes loginButterflyV134{
    0%{left:-100px;top:66%;transform:rotate(-8deg) scale(.78)}
    16%{left:14%;top:44%;transform:rotate(8deg) scale(.92)}
    34%{left:33%;top:20%;transform:rotate(-4deg) scale(1)}
    52%{left:54%;top:42%;transform:rotate(9deg) scale(.88)}
    72%{left:75%;top:25%;transform:rotate(-7deg) scale(.98)}
    100%{left:108%;top:11%;transform:rotate(7deg) scale(.80)}
}

@keyframes uetFlightA{
    0%{left:-100px;top:72vh;opacity:0;transform:rotate(-9deg) scale(.75)}
    5%{opacity:1}
    25%{left:22vw;top:48vh;transform:rotate(7deg) scale(.95)}
    48%{left:48vw;top:22vh;transform:rotate(-5deg) scale(1)}
    72%{left:73vw;top:40vh;transform:rotate(8deg) scale(.88)}
    95%{opacity:1}
    100%{left:108vw;top:16vh;opacity:0;transform:rotate(-4deg) scale(.78)}
}
@keyframes uetFlightB{
    0%{left:108vw;top:18vh;opacity:0;transform:scaleX(-1) rotate(8deg) scale(.78)}
    5%{opacity:1}
    28%{left:78vw;top:38vh;transform:scaleX(-1) rotate(-5deg) scale(.95)}
    50%{left:53vw;top:65vh;transform:scaleX(-1) rotate(7deg) scale(.9)}
    75%{left:25vw;top:32vh;transform:scaleX(-1) rotate(-8deg) scale(1)}
    95%{opacity:1}
    100%{left:-100px;top:54vh;opacity:0;transform:scaleX(-1) rotate(5deg) scale(.78)}
}
@keyframes uetFlightC{
    0%{left:-100px;top:24vh;opacity:0;transform:rotate(4deg) scale(.72)}
    6%{opacity:1}
    30%{left:27vw;top:18vh;transform:rotate(-8deg) scale(.9)}
    55%{left:52vw;top:54vh;transform:rotate(7deg) scale(1)}
    80%{left:78vw;top:33vh;transform:rotate(-3deg) scale(.9)}
    95%{opacity:1}
    100%{left:108vw;top:61vh;opacity:0;transform:rotate(8deg) scale(.75)}
}

@media(max-width:700px){
    .uet-butterfly{width:58px;height:47px;transform:scale(.82)}
    .login-sky .login-flying-butterfly{animation-duration:20s}
}

@media(prefers-reduced-motion:reduce){
    .uet-butterfly{display:none!important}
}


/* ============================================================
   V13.6 persistent login / activation / validation messages
   ============================================================ */

.login-panel{
    transition:
        opacity .25s ease,
        transform .25s ease,
        max-height .35s ease;
}

.login-panel:not(.hidden){
    opacity:1;
    transform:translateY(0);
}

.persistent-login-message{
    margin:0 0 14px;
    border-radius:11px;
    line-height:1.55;
}

.login-panel .error-box{
    border:1px solid #f3c4c1;
    background:#fff0ef;
    color:#a62a20;
}

.login-panel .success-box{
    border:1px solid #b8e3d1;
    background:#eaf8f2;
    color:#126b4e;
}

#clientLoginValidation.hidden{
    display:none!important;
}

.login-panel form{
    animation:loginPanelReveal .25s ease both;
}

@keyframes loginPanelReveal{
    from{
        opacity:0;
        transform:translateY(-7px);
    }
    to{
        opacity:1;
        transform:none;
    }
}


/* ============================================================
   V13.7 activation resend + automatic authorization
   ============================================================ */

.activation-info{
    border:1px solid #b7d5ff;
    background:#edf5ff;
    color:#24528a;
    padding:12px 14px;
    border-radius:11px;
    margin-bottom:14px;
    line-height:1.55;
}

.resend-activation-box{
    margin:0 0 20px;
    padding:15px;
    border:1px solid #d6dfef;
    border-radius:14px;
    background:linear-gradient(180deg,#fbfdff,#f4f8ff);
}

.resend-activation-box label{
    margin-top:0;
}

.resend-activation-button{
    width:auto;
    background:#fff;
    color:#3157d5;
    border:1px solid #b9c9f6;
    box-shadow:none;
}

.resend-activation-button:hover{
    background:#edf3ff;
}

.activation-success-banner{
    max-width:1180px;
    margin:18px auto;
    padding:14px 16px;
    border:1px solid #a9dfc7;
    background:#eaf8f2;
    color:#11654a;
    border-radius:12px;
    font-weight:700;
}

@media(max-width:650px){
    .resend-activation-button{
        width:100%;
    }
}


/* ============================================================
   V13.8 pricing updates
   ============================================================ */

.pricing-grid-v138{
    grid-template-columns:repeat(auto-fit,minmax(270px,1fr));
    align-items:stretch;
}

.beginner-card{
    border:2px solid #9cc7ff;
    background:linear-gradient(180deg,#ffffff,#f6fbff);
}

.complete-package-card{
    border:2px solid #3157d5;
    background:
        radial-gradient(circle at top right,rgba(49,87,213,.08),transparent 220px),
        linear-gradient(180deg,#fff,#f7f9ff);
    box-shadow:0 18px 48px rgba(49,87,213,.12);
}

.complete-package-card .eyebrow{
    background:#eaf0ff;
    color:#2245bc;
}

.price-card .price-alt{
    font-size:1rem;
    font-weight:800;
    color:#42516b;
}

@media(max-width:720px){
    .pricing-grid-v138{
        grid-template-columns:1fr;
    }
}

/* V13.30 country-aware UPI checkout */
.region-payment-badge{display:inline-flex;align-items:center;gap:7px;margin-top:10px;padding:9px 13px;border:1px solid #b9c9f6;border-radius:999px;background:#f1f5ff;color:#2447a8;font-weight:800}
.payment-buttons form{margin:0}.payment-buttons button{width:100%}.upi-button{background:#087a55}.upi-button:hover{background:#066443;text-decoration:none}.payment-unavailable{padding:10px 12px;border-radius:9px;background:#f5f6f8;color:#5d6675;font-weight:700}
.payment-method-disabled{width:100%;background:#eef1f5!important;color:#596273!important;border:1px dashed #aeb7c6!important;cursor:not-allowed;opacity:1!important}.payment-admin-setup{display:block;padding:9px 11px;border:1px solid #9eb2ef;border-radius:9px;background:#f2f5ff;text-align:center;font-weight:800}.payment-readiness-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:16px 0}.payment-readiness-grid>div{display:flex;flex-direction:column;gap:4px;padding:12px;border:1px solid var(--border);border-radius:10px;background:#f8fafc}.env-example{overflow-x:auto;padding:12px;border-radius:10px;background:#101828;color:#eaf0ff;white-space:pre-wrap}@media(max-width:620px){.payment-readiness-grid{grid-template-columns:1fr}}
.upi-checkout-card{max-width:900px;margin:28px auto}.upi-checkout-grid{display:grid;grid-template-columns:minmax(260px,340px) 1fr;gap:28px;align-items:start;margin:22px 0}.upi-qr-panel{text-align:center;background:#f7f9fc;border:1px solid var(--border);border-radius:16px;padding:18px}.upi-qr-image{display:block;width:min(100%,300px);height:auto;margin:0 auto 16px;background:#fff;border:10px solid #fff;border-radius:12px}.upi-app-link{display:block}.upi-payment-details dl{display:grid;grid-template-columns:110px 1fr;gap:8px 14px}.upi-payment-details dt{font-weight:800;color:#5d6675}.upi-payment-details dd{margin:0;overflow-wrap:anywhere}.upi-transaction-form{margin-top:24px;padding-top:20px;border-top:1px solid var(--border)}.upi-transaction-form button{margin-top:10px}.payment-confirmation-card{max-width:720px;margin:34px auto;text-align:center}.payment-confirmation-icon{display:grid;place-items:center;width:64px;height:64px;margin:0 auto 16px;border-radius:50%;background:#e9f8f1;color:#087a55;font-size:34px;font-weight:900}.order-status.verification_pending{background:#fff4d7;color:#8a5a00}.order-status.rejected{background:#fff0ee;color:#b42318}.upi-admin-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}.upi-admin-actions form{margin:0}.approve-payment{background:#087a55}.reject-payment{background:#b42318}
.upi-paid-link{display:block;margin-top:9px}.upi-verification-notice{margin:20px 0 0}.order-status.pending{background:#eef3ff;color:#3157d5}.account-payment-action{display:inline-block;white-space:nowrap;text-decoration:none}
@media(max-width:720px){.upi-checkout-grid{grid-template-columns:1fr}.upi-payment-details dl{grid-template-columns:90px 1fr}}

.paypal-button{background:#0070ba;color:#fff}.paypal-button:hover{background:#005ea6}.admin-payment-qr{display:grid;gap:12px;justify-items:start;margin:16px 0;padding:16px;border:1px solid var(--border);border-radius:14px;background:#f8fafc}.admin-payment-qr img{width:min(280px,100%);height:auto;border:10px solid #fff;border-radius:12px}.invoice-card{max-width:900px;margin:28px auto}.invoice-heading,.invoice-grid{display:flex;justify-content:space-between;gap:24px;align-items:flex-start}.invoice-heading{text-align:right;border-bottom:2px solid var(--border);padding-bottom:18px}.invoice-heading>div:first-child{text-align:left}.invoice-grid{margin:20px 0}.invoice-grid>div{flex:1}.invoice-table tfoot th{border-top:2px solid var(--border);font-size:16px}@media(max-width:620px){.invoice-heading,.invoice-grid{display:block;text-align:left}.invoice-heading>div{margin-bottom:12px}}@media print{.invoice-card{border:0;box-shadow:none;margin:0;max-width:none}.site-header,.site-footer,.no-print,.screen-watermark{display:none!important}.container{width:100%;padding:0}}


/* ============================================================
   V13.10 country selector
   ============================================================ */
#countrySelect,
#accountCountrySelect{
    width:100%;
    min-height:48px;
    font-size:15px;
}

@media(max-width:600px){
    #countrySelect,
    #accountCountrySelect{
        font-size:16px; /* prevents iPhone zoom on focus */
    }
}


/* ============================================================
   V13.11 reliable lamp/login visibility
   ============================================================ */
#loginPanel{
    display:none;
    opacity:0;
    transform:translateY(-10px) scale(.985);
    max-height:0;
    overflow:hidden;
    visibility:hidden;
    pointer-events:none;
    transition:
        opacity .25s ease,
        transform .25s ease,
        max-height .35s ease;
}

#loginPanel.is-visible{
    display:block;
    opacity:1;
    transform:translateY(0) scale(1);
    max-height:1200px;
    overflow:visible;
    visibility:visible;
    pointer-events:auto;
}

#loginPanel.is-visible form{
    animation:loginPanelReveal .25s ease both;
}

/* Important messages always keep panel readable */
#loginPanel:has(.persistent-login-message:not(.hidden)){
    display:block;
}

/* Make sure generic .hidden never overrides explicit open state */
#loginPanel.is-visible.hidden{
    display:block!important;
}

@media(max-width:650px){
    #loginPanel.is-visible{
        max-height:1600px;
    }
}


/* ============================================================
   V13.12 reliable lamp toggle + persistent activation messages
   ============================================================ */

#loginCredentials{
    display:none;
    opacity:0;
    transform:translateY(-8px);
    max-height:0;
    overflow:hidden;
    visibility:hidden;
    pointer-events:none;
    transition:
        opacity .22s ease,
        transform .22s ease,
        max-height .30s ease;
}

#loginCredentials.is-visible{
    display:block;
    opacity:1;
    transform:translateY(0);
    max-height:1000px;
    overflow:visible;
    visibility:visible;
    pointer-events:auto;
}

#loginCredentials.is-visible form{
    animation:loginPanelReveal .22s ease both;
}

/* Activation/error/resend messages can remain visible while credentials hide. */
#loginPanel.is-visible{
    display:block;
    opacity:1;
    transform:translateY(0) scale(1);
    max-height:1800px;
    overflow:visible;
    visibility:visible;
    pointer-events:auto;
}

/* Explicit state beats any older generic hidden state. */
#loginPanel.is-visible.hidden{
    display:block!important;
}

#loginPanel.is-visible #loginCredentials:not(.is-visible){
    display:none!important;
}

@media(max-width:650px){
    #loginCredentials.is-visible{
        max-height:1400px;
    }
}

.help-chatbot-shell{position:fixed;right:18px;bottom:18px;z-index:1200}
.help-chat-launcher{width:54px;height:54px;border-radius:50%;border:0;font-size:24px;font-weight:800;cursor:pointer;box-shadow:0 10px 28px rgba(0,0,0,.22)}
.help-chat-panel{position:absolute;right:0;bottom:66px;width:min(360px,calc(100vw - 28px));max-height:580px;background:var(--card-bg,#fff);border:1px solid rgba(120,130,150,.24);border-radius:18px;box-shadow:0 20px 50px rgba(0,0,0,.24);display:none;overflow:hidden}
.help-chat-panel.is-open{display:flex;flex-direction:column}
.help-chat-head{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid rgba(120,130,150,.18)}
.help-chat-head small{display:block;opacity:.7}
.help-chat-head button{border:0;background:transparent;font-size:24px;cursor:pointer}
.help-chat-messages{min-height:180px;max-height:310px;overflow:auto;padding:14px;display:flex;flex-direction:column;gap:10px}
.help-msg{padding:10px 12px;border-radius:13px;line-height:1.45;max-width:88%;white-space:pre-wrap}
.help-msg.bot{align-self:flex-start;background:rgba(100,120,180,.12)}
.help-msg.user{align-self:flex-end;background:rgba(80,130,230,.18)}
.help-quick-row,.help-topic-buttons{display:flex;gap:7px;flex-wrap:wrap;padding:0 14px 10px}
.help-quick-row button,.help-topic-btn{padding:7px 10px;border-radius:999px;border:1px solid #aeb9ce;cursor:pointer;background:#fff;color:#10203f!important;font-weight:700;line-height:1.35;white-space:normal;opacity:1!important;visibility:visible!important}
.help-quick-row button:hover,.help-topic-btn:hover,.help-quick-row button:focus-visible,.help-topic-btn:focus-visible{background:#edf2ff;border-color:#3157d5;color:#17388f!important}
.help-topic-heading{flex:0 0 100%;margin:0 0 3px;color:#10203f;font-weight:800}
.help-chat-form{display:flex;gap:8px;padding:12px 14px;border-top:1px solid rgba(120,130,150,.18)}
.help-chat-form input{flex:1;min-width:0}
.help-chat-more{display:block;text-align:center;padding:0 14px 12px;font-size:13px}
.help-page-chat{max-width:850px;margin-inline:auto;color:#10203f}
.help-page-chat .help-chat-messages{min-height:320px;max-height:520px}
@media(max-width:600px){.help-chatbot-shell{right:10px;bottom:10px}.help-chat-panel{width:calc(100vw - 20px);max-height:72vh}}

.speech-practice-toolbar{display:flex;gap:12px;align-items:end;flex-wrap:wrap;margin:18px 0}.speech-practice-toolbar label{display:flex;flex-direction:column;gap:6px;min-width:190px;flex:1}.speech-practice-list{display:grid;gap:16px;margin-top:16px}.speech-question-card{position:relative;overflow:hidden}.speech-answer-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;margin:14px 0;align-items:start}.speech-practice-answer{width:100%;resize:vertical;min-height:70px}.speech-mic-button{min-height:46px;white-space:nowrap}.speech-mic-button:disabled{opacity:.55;cursor:not-allowed}.speech-practice-feedback{margin-top:10px;font-weight:700}.success-text{color:#18833b}.error-text{color:#b42318}.practice-answer-explanation{margin-top:12px;padding:12px 14px;border-radius:12px;background:rgba(100,120,180,.10)}.practice-celebration{position:absolute;right:12px;top:12px;font-size:28px;animation:practiceCelebrate 1.2s ease forwards;pointer-events:none}@keyframes practiceCelebrate{0%{opacity:0;transform:translateY(12px) scale(.7)}30%{opacity:1;transform:translateY(0) scale(1.15)}100%{opacity:0;transform:translateY(-40px) scale(.9)}}@media(max-width:650px){.speech-answer-row{grid-template-columns:1fr}.speech-mic-button{width:100%}.speech-practice-toolbar{align-items:stretch}}


/* ============================================================
   V13.20 bilingual vocabulary
   ============================================================ */

.localized-learning-box{
    margin-top:18px;
    padding:16px 18px;
    border-radius:14px;
    background:rgba(49,87,213,.07);
    border:1px solid rgba(49,87,213,.14);
}

.localized-learning-box h3{
    margin-top:0;
}

.vocabulary-word-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
    margin-top:14px;
}

.vocabulary-word-card{
    padding:18px;
    border-radius:16px;
    border:1px solid rgba(120,130,150,.22);
    background:rgba(255,255,255,.66);
}

.vocabulary-word-head{
    display:flex;
    gap:10px;
    align-items:baseline;
    flex-wrap:wrap;
}

.vocabulary-word-head h3{
    margin:0;
    font-size:1.35rem;
}

.pronunciation{
    opacity:.72;
    font-size:.92rem;
}

.local-meaning{
    padding:10px 12px;
    border-radius:10px;
    background:rgba(30,140,80,.08);
}

.word-example{
    margin-top:8px;
}

.local-example{
    opacity:.9;
}

.practice-local-question{
    margin-top:-2px;
    padding-left:10px;
    border-left:3px solid rgba(49,87,213,.3);
}

.answer-local-explanation{
    margin-top:10px;
    padding:10px 12px;
    border-radius:10px;
    background:rgba(30,140,80,.08);
}

.answer-local-explanation:empty{
    display:none;
}

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

.dictionary-search{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}.dictionary-search input{flex:1;min-width:240px}.dictionary-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.dictionary-card{padding:18px;border:1px solid rgba(120,130,150,.22);border-radius:16px;background:rgba(255,255,255,.68)}.dictionary-card small{font-size:.8rem;opacity:.65}.native-meaning{padding:9px 11px;border-radius:10px;background:rgba(30,140,80,.08)}.dictionary-options{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}@media(max-width:760px){.dictionary-grid{grid-template-columns:1fr}}
.dictionary-summary-row{display:grid;gap:10px;margin:10px 0 18px}.dictionary-result-summary{color:#475467;font-weight:700}.dictionary-pagination{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:16px;margin:26px 0 4px;padding-top:20px;border-top:1px solid #d7deeb}.dictionary-pagination-top{margin:0;padding:12px;border:1px solid #d7deeb;border-radius:12px;background:#f7f9fc}.dictionary-page-start,.dictionary-page-end{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.dictionary-page-start{justify-content:flex-start}.dictionary-page-end{justify-content:flex-end}.dictionary-pagination .button-link{white-space:nowrap}.pagination-placeholder{min-width:1px}@media(max-width:850px){.dictionary-pagination{grid-template-columns:1fr;text-align:center}.dictionary-page-start,.dictionary-page-end{justify-content:center}.dictionary-pagination .button-link{justify-content:center}}@media(max-width:620px){.dictionary-page-start,.dictionary-page-end{display:grid}.dictionary-pagination .button-link{width:100%}.pagination-placeholder{display:none}}

/* V13.30 filterable vocabulary and phrase practice activity libraries */
.vocabulary-practice-promo{display:flex;justify-content:space-between;align-items:center;gap:22px;margin-bottom:20px;background:linear-gradient(135deg,rgba(49,87,213,.09),rgba(75,135,230,.03))}.vocabulary-practice-promo h2{margin:.35rem 0}.vocabulary-practice-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:22px}.vocabulary-practice-heading h1{margin:.45rem 0}.vocabulary-total-badge{min-width:130px;padding:14px 18px;border-radius:16px;background:#172554;color:#fff;text-align:center;box-shadow:0 10px 24px rgba(23,37,84,.18)}.vocabulary-total-badge strong,.vocabulary-total-badge span{display:block}.vocabulary-total-badge strong{font-size:1.65rem}.vocabulary-total-badge span{font-size:.82rem;opacity:.78;text-transform:uppercase;letter-spacing:.06em}.vocabulary-catalog-note{margin:18px 0;padding:13px 15px;border:1px solid rgba(49,87,213,.18);border-radius:12px;background:rgba(49,87,213,.06)}.vocabulary-filter-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:18px;border:1px solid rgba(120,130,150,.22);border-radius:16px;background:rgba(245,248,255,.72)}.vocabulary-filter-grid label{display:flex;flex-direction:column;gap:6px;font-weight:700}.vocabulary-filter-grid input,.vocabulary-filter-grid select{width:100%;min-height:44px}.vocabulary-search-field{grid-column:span 2}.vocabulary-filter-actions{grid-column:1/-1;display:flex;gap:9px;flex-wrap:wrap}.vocabulary-practice-status{margin:18px 0 4px;padding:12px 14px;border-radius:11px;background:rgba(23,37,84,.07);font-weight:800}.vocabulary-practice-card{position:relative}.vocabulary-question-tags{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:10px}.vocabulary-question-tags span{padding:5px 9px;border-radius:999px;background:rgba(49,87,213,.09);color:#2547ae;font-size:.76rem;font-weight:800}.vocabulary-answer-details{margin-top:12px;padding:14px 16px;border-radius:12px;background:rgba(30,140,80,.07);border-left:4px solid #18833b}.vocabulary-answer-details p{margin:.45rem 0}.vocabulary-answer-details.hidden{display:none}@media(max-width:850px){.vocabulary-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.vocabulary-search-field{grid-column:1/-1}}@media(max-width:620px){.vocabulary-practice-promo,.vocabulary-practice-heading{align-items:stretch;flex-direction:column}.vocabulary-total-badge{min-width:0}.vocabulary-filter-grid{grid-template-columns:1fr}.vocabulary-search-field{grid-column:auto}.vocabulary-filter-actions>*{width:100%;text-align:center}}
.phrase-options .answer-choice{text-align:left;white-space:normal}

.account-module-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.session-card{border-color:rgba(180,40,40,.2)}
.danger-button{border:0;border-radius:10px;padding:11px 16px;background:#b42318;color:#fff;font-weight:700;cursor:pointer}.logout-all-form{margin-top:12px}
@media(max-width:760px){.account-module-grid{grid-template-columns:1fr}}


/* V13.23 strict admin/learner separation */
.admin-mode-badge{display:inline-flex;align-items:center;padding:7px 10px;border-radius:999px;background:#172554;color:#fff;font-weight:800;font-size:.78rem;letter-spacing:.02em}
.nav-logout-form{display:inline-flex;margin:0}.nav-logout-button{border:0;background:#b42318;color:#fff;padding:9px 12px;border-radius:9px;font-weight:700;cursor:pointer}
.admin-shortcuts{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:10px;margin:0 0 18px}.admin-shortcuts a{display:block;padding:13px 14px;border-radius:12px;text-decoration:none;background:#172554;color:#fff;font-weight:700;text-align:center}
.admin-section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.admin-table-wrap{overflow:auto}.admin-data-table{width:100%;border-collapse:collapse;min-width:950px}.admin-data-table th,.admin-data-table td{padding:10px;border-bottom:1px solid rgba(120,130,150,.2);text-align:left}.admin-data-table th{font-size:.82rem;text-transform:uppercase;letter-spacing:.03em;background:rgba(100,120,180,.08)}
@media(max-width:900px){.admin-mode-badge{width:100%;justify-content:center}.nav-logout-form{width:100%}.nav-logout-button{width:100%}}

/* V13.24 10k-per-concept practice library */
.concept-card-topline{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.practice-capacity-badge{font-size:.82rem;font-weight:800;padding:6px 10px;border-radius:999px;background:rgba(49,87,213,.09);color:#3157d5}.practice-library-summary{border:1px solid rgba(49,87,213,.18)}.practice-capacity-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:14px}.practice-capacity-item{display:flex;flex-direction:column;gap:3px;padding:12px;border-radius:12px;background:rgba(49,87,213,.06)}.practice-capacity-item span{font-size:.9rem;opacity:.72}.locked-topic-preview{margin:18px 0;padding:16px;border-radius:14px;background:rgba(49,87,213,.06);border:1px solid rgba(49,87,213,.12)}@media(max-width:800px){.practice-capacity-grid{grid-template-columns:1fr}}


/* ============================================================
   V13.25 learner progress dashboard
   ============================================================ */

.progress-stat-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:14px;
    margin-bottom:20px;
}

.progress-stat-card{
    padding:20px;
    border-radius:16px;
    background:#fff;
    border:1px solid rgba(120,130,150,.20);
    box-shadow:0 8px 24px rgba(30,45,80,.06);
}

.progress-stat-card strong{
    display:block;
    font-size:2rem;
}

.progress-stat-card span{
    opacity:.75;
}

.progress-bar-row{
    display:grid;
    grid-template-columns:90px minmax(0,1fr) 60px;
    gap:12px;
    align-items:center;
    margin:14px 0;
}

.progress-track{
    height:12px;
    background:rgba(120,130,150,.15);
    border-radius:999px;
    overflow:hidden;
}

.progress-track.large{
    height:15px;
    margin:14px 0;
}

.progress-fill{
    height:100%;
    background:#3157d5;
    border-radius:999px;
}

.success-fill{
    background:#228b4e;
}

.danger-fill{
    background:#c53a2c;
}

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

.progress-topic-card{
    padding:16px;
    border:1px solid rgba(120,130,150,.18);
    border-radius:14px;
}

.progress-topic-head{
    display:flex;
    justify-content:space-between;
    gap:15px;
}

.progress-topic-head small{
    display:block;
    opacity:.65;
    margin-top:3px;
}

.status-pill{
    padding:6px 10px;
    border-radius:999px;
    font-size:.82rem;
    font-weight:700;
    align-self:flex-start;
    background:rgba(80,100,150,.12);
}

.status-completed{
    background:rgba(30,150,80,.14);
}

.status-in-progress,
.status-learning{
    background:rgba(230,160,40,.16);
}

.progress-topic-meta{
    display:flex;
    gap:14px;
    flex-wrap:wrap;
    font-size:.9rem;
    opacity:.8;
}

.simple-activity-chart{
    min-height:170px;
    display:flex;
    align-items:end;
    gap:12px;
    overflow-x:auto;
    padding:15px 4px 4px;
}

.activity-column{
    min-width:42px;
    text-align:center;
}

.activity-bars{
    height:125px;
    display:flex;
    gap:4px;
    justify-content:center;
    align-items:end;
}

.activity-bar{
    width:12px;
    min-height:2px;
    border-radius:5px 5px 0 0;
}

.activity-bar.attempts,
.legend-box.attempts{
    background:#3157d5;
}

.activity-bar.correct,
.legend-box.correct{
    background:#228b4e;
}

.chart-legend{
    display:flex;
    gap:18px;
    margin-top:12px;
}

.legend-box{
    width:11px;
    height:11px;
    display:inline-block;
    margin-right:6px;
}

.table-responsive{
    overflow-x:auto;
}

.admin-progress-table{
    width:100%;
    border-collapse:collapse;
}

.admin-progress-table th,
.admin-progress-table td{
    padding:11px;
    border-bottom:1px solid rgba(120,130,150,.18);
    text-align:left;
    vertical-align:top;
}

.mini-progress{
    width:100px;
    height:7px;
    background:rgba(120,130,150,.15);
    border-radius:999px;
    overflow:hidden;
    margin-bottom:4px;
}

.mini-progress > div{
    height:100%;
    background:#228b4e;
}

@media(max-width:800px){
    .progress-stat-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:520px){
    .progress-stat-grid{
        grid-template-columns:1fr;
    }

    .progress-bar-row{
        grid-template-columns:70px minmax(0,1fr) 45px;
    }
}


/* ============================================================
   V13.26 analyzer native-language explanations
   ============================================================ */

.analyzer-native-explanation{
    margin:12px 0 4px;
    padding:12px 14px;
    border-left:4px solid #3157d5;
    border-radius:10px;
    background:rgba(49,87,213,.07);
}

.analyzer-native-label{
    font-size:.82rem;
    font-weight:800;
    color:#3157d5;
    margin-bottom:6px;
}

.analyzer-native-text{
    line-height:1.65;
    white-space:pre-wrap;
}

@media(max-width:700px){
    .analyzer-native-explanation{
        padding:10px 12px;
    }
}


/* V13.27 source language detection */
.detected-source-language-box{
    margin:12px 0;
    padding:12px 14px;
    border:1px solid rgba(49,87,213,.18);
    border-radius:12px;
    background:rgba(49,87,213,.06);
}

.detected-source-language-box strong{
    display:block;
    margin-bottom:5px;
}

.detected-source-normalized{
    margin-top:6px;
    opacity:.82;
    word-break:break-word;
}

.conversation-scenario-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.conversation-scenario-card{display:flex;flex-direction:column;align-items:flex-start}.conversation-scenario-card .button-link{margin-top:auto}.voice-conversation-shell{max-width:950px;margin-inline:auto}.voice-conversation-head{display:flex;justify-content:space-between;gap:20px}.conversation-step-status{padding:10px 14px;border-radius:999px;background:rgba(49,87,213,.08);white-space:nowrap}.conversation-messages{min-height:280px;max-height:440px;overflow:auto;display:flex;flex-direction:column;gap:12px;padding:18px;margin:20px 0;border-radius:16px;background:rgba(100,120,180,.06)}.conversation-message{max-width:82%;padding:12px 15px;border-radius:14px}.conversation-message strong{display:block;margin-bottom:5px;font-size:.82rem}.conversation-message.system{align-self:flex-start;background:#fff;border:1px solid rgba(120,130,150,.18)}.conversation-message.user{align-self:flex-end;background:rgba(49,87,213,.13)}.conversation-controls{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:14px}.conversation-answer-row{display:grid;grid-template-columns:1fr auto;gap:12px}.conversation-answer-row textarea{width:100%;min-height:88px}.conversation-feedback{margin-top:12px;font-weight:700}.conversation-help{margin-top:12px}.conversation-help-box{padding:14px 16px;border-left:4px solid #3157d5;border-radius:10px;background:rgba(49,87,213,.07);white-space:pre-wrap}.conversation-help-box strong{display:block;margin-bottom:6px}@media(max-width:760px){.conversation-scenario-grid{grid-template-columns:1fr}.voice-conversation-head{flex-direction:column}.conversation-answer-row{grid-template-columns:1fr}.conversation-message{max-width:94%}}

.conversation-filter-form{display:grid;grid-template-columns:minmax(220px,2fr) repeat(2,minmax(160px,1fr)) auto auto;gap:12px;align-items:end}
.conversation-filter-form label{display:flex;flex-direction:column;gap:6px}
.conversation-filter-form input,.conversation-filter-form select{width:100%}
.conversation-topic-badges{display:flex;gap:7px;flex-wrap:wrap}
.conversation-topic-meta{display:flex;flex-direction:column;gap:6px;margin:12px 0 18px;font-size:.92rem;opacity:.82}
.conversation-duration-note{display:inline-block;margin-top:8px;padding:8px 11px;border-radius:10px;background:rgba(49,87,213,.07)}
.auth-recovery-link{text-align:center;margin:12px 0 0}.password-recovery-card{max-width:640px}.local-reset-box{margin:16px 0;padding:16px;border:1px solid #a8c7ff;border-radius:12px;background:#eef5ff}
.password-input-wrap{position:relative;display:block}.password-input-wrap input{width:100%;padding-right:52px}.password-visibility-toggle{position:absolute;right:6px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:40px!important;height:36px;padding:0!important;margin:0!important;border:0;border-radius:8px;background:transparent!important;color:#17233b;font-size:18px;line-height:1;box-shadow:none!important;cursor:pointer}.password-visibility-toggle:hover,.password-visibility-toggle:focus-visible{background:#eef3ff!important;outline:2px solid #3157d5;outline-offset:1px}
.conversation-pagination{display:flex;align-items:center;justify-content:center;gap:18px;margin:24px 0}
@media(max-width:1050px){.conversation-filter-form{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.conversation-filter-form{grid-template-columns:1fr}.conversation-pagination{flex-wrap:wrap}}

.practice-native-question{margin:10px 0;padding:11px 13px;border-left:4px solid #3157d5;border-radius:8px;background:#eef3ff;color:#142c69;font-size:1rem;font-weight:800;line-height:1.55}.practice-native-situation{margin:8px 0 12px;padding:9px 12px;border-radius:8px;background:#f5f7fb;color:#344054;line-height:1.5}
.helping-verb-example-list{display:grid;gap:10px;margin-top:12px}.helping-verb-example-list li{min-height:0;line-height:1.55;padding-left:2px}.helping-verb-groups .card{overflow:visible}
.bilingual-helping-option{display:inline-flex;min-width:120px;min-height:54px;flex-direction:row;align-items:center;justify-content:center;gap:7px;line-height:1.2}.bilingual-helping-option strong{font-size:1rem}.bilingual-helping-option small{max-width:170px;font-size:.86rem;font-weight:800;white-space:normal}.helping-option-slash{font-size:1rem;font-weight:900;opacity:.72}.helping-verb-formula{padding:11px 13px;border-left:4px solid #e0a117;border-radius:8px;background:#fff8dc;line-height:1.55}
.helping-verb-groups h3 small{display:block;margin-top:6px;color:#3157d5;font-size:.9rem}.helping-verb-deep-dive{margin-bottom:22px;padding:24px}.helping-deep-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.helping-deep-header h3{margin:0}.helping-deep-header p{margin:6px 0}.helping-deep-formula{display:flex;flex-direction:column;gap:7px;margin:18px 0;padding:15px;border-left:5px solid #d79b13;border-radius:10px;background:#fff7d9}.helping-deep-formula code{font-size:1rem}.helping-rule-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.helping-rule-card{padding:18px;border:1px solid #d7e0ee;border-radius:14px;background:#fff}.helping-rule-title{display:flex;align-items:center;gap:10px}.helping-rule-title>span{width:30px;height:30px;display:grid;place-items:center;border-radius:50%;background:#3157d5;color:#fff;font-weight:900}.helping-rule-title h4{margin:0;font-size:1.2rem}.bilingual-example{margin:13px 0;padding:12px;border-radius:10px;background:#f2f6ff}.bilingual-example p{margin:7px 0}.icon-button{min-width:0;padding:3px 7px;font-size:.8rem}.sentence-parts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin:12px 0}.sentence-parts div{padding:8px;border-radius:8px;background:#f7f8fb}.sentence-parts dt{font-size:.72rem;font-weight:900;text-transform:uppercase;color:#5b6780}.sentence-parts dd{margin:3px 0 0;font-weight:800}.wrong-example,.correct-example{margin:7px 0;padding:9px 11px;border-radius:8px;font-weight:800}.wrong-example{background:#fff0f0;color:#a42626}.correct-example{background:#eaf9f0;color:#087443}.responsive-table{overflow-x:auto}.helping-comparison-table{width:100%;border-collapse:collapse}.helping-comparison-table th,.helping-comparison-table td{padding:11px;border:1px solid #d8dfeb;text-align:left}.helping-comparison-table th{background:#edf2ff}.sentence-form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.sentence-form-grid article{padding:14px;border:1px solid #d8dfeb;border-radius:12px}.sentence-form-grid p{margin:8px 0}.common-mistake-box{margin:12px 0 20px;padding:15px;border:1px solid #efc8c8;border-radius:12px;background:#fffafa}.helping-quick-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.helping-quick-card{padding:15px;border:1px solid #d8dfeb;border-radius:12px}.helping-quick-options{display:flex;flex-wrap:wrap;gap:8px;margin-top:11px}.helping-quick-options button{padding:8px 12px}.helping-quick-options button.correct{background:#138a57}.helping-quick-options button.wrong{background:#c63f45}.helping-quick-feedback{margin:11px 0 0;font-weight:800;color:#173665}
@media(max-width:920px){.helping-rule-grid,.sentence-form-grid{grid-template-columns:1fr}.helping-quick-grid{grid-template-columns:1fr}}@media(max-width:620px){.bilingual-helping-option{min-width:calc(50% - 8px);flex:1 1 calc(50% - 8px);flex-direction:column;gap:3px}.helping-deep-header{flex-direction:column}.sentence-parts{grid-template-columns:1fr}.helping-verb-deep-dive{padding:16px}}
.native-to-english-practice{margin:22px 0;padding:22px;border:1px solid #a9bdf4;border-radius:16px;background:linear-gradient(135deg,#f4f7ff,#eefaf5)}.native-to-english-practice[hidden]{display:none!important}.native-to-english-practice h2{margin:7px 0}.native-to-english-practice label{display:block;margin:16px 0 7px;font-weight:800}.native-to-english-practice textarea{width:100%;min-height:94px;font-size:1.08rem;line-height:1.55}.native-to-english-result{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:14px;padding:16px;border:2px solid #20a464;border-radius:12px;background:#fff}.native-to-english-result[hidden]{display:none!important}.native-to-english-result strong{display:block;flex:1 1 320px;color:#0d5736;font-size:1.25rem}
.practice-batch-pagination{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:14px;margin-top:22px;padding:16px;border:1px solid #d7deeb;border-radius:12px;background:#f7f9fc}.practice-batch-pagination button:first-child{justify-self:start}.practice-batch-pagination button:last-child{justify-self:end}.practice-batch-pagination strong{text-align:center}.practice-batch-pagination button:disabled,button:disabled{opacity:.5;cursor:not-allowed}.feedback-form-card{max-width:760px;margin-inline:auto}.feedback-form-card input[readonly]{background:#eef1f5;color:#4d596b;cursor:not-allowed}.feedback-form-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}.feedback-filter-form{display:flex;align-items:end;gap:12px;flex-wrap:wrap}.feedback-filter-form label{min-width:230px;margin:0}.feedback-stat-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.feedback-admin-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:18px}.feedback-admin-heading h2{margin:8px 0}.feedback-admin-heading time{color:var(--muted);font-size:.88rem}.feedback-meta-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:16px 0}.feedback-meta-grid>div{min-width:0;padding:12px;border-radius:10px;background:#f7f9fc}.feedback-meta-grid dt{font-size:.78rem;font-weight:800;text-transform:uppercase;color:var(--muted)}.feedback-meta-grid dd{margin:4px 0 0;overflow-wrap:anywhere}.feedback-comment{padding:14px 16px;border-left:4px solid #3157d5;border-radius:10px;background:#f5f7fd}.feedback-comment p{white-space:pre-wrap;overflow-wrap:anywhere}.feedback-admin-form{display:grid;grid-template-columns:220px minmax(0,1fr) auto;align-items:end;gap:12px;margin-top:16px}.feedback-admin-form label{margin:0}.feedback-admin-form textarea{min-height:84px}.order-status.new{background:#fff3d6;color:#8a5500}.order-status.reviewed{background:#e9f1ff;color:#164dcc}.order-status.resolved{background:#e9f8f1;color:#087a55}@media(max-width:900px){.feedback-meta-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.feedback-admin-form{grid-template-columns:1fr}.feedback-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:620px){.practice-batch-pagination{grid-template-columns:1fr;text-align:center}.practice-batch-pagination button:first-child,.practice-batch-pagination button:last-child{justify-self:stretch}.feedback-meta-grid,.feedback-stat-grid{grid-template-columns:1fr}.feedback-admin-heading{flex-direction:column}.feedback-form-footer button{width:100%}}

.phrase-hint-button{margin:8px 0;align-self:flex-start}.phrase-hint-box{margin:4px 0 14px;padding:14px 16px;border:1px solid #efbd57;border-left:5px solid #e49b0f;border-radius:12px;background:#fff8df;color:#463309}.phrase-hint-box.hidden{display:none}.phrase-hint-box p{margin:0 0 10px}.phrase-word-meaning-table{width:100%;margin:8px 0 16px;border-collapse:collapse}.phrase-word-meaning-table th,.phrase-word-meaning-table td{padding:9px 11px;border:1px solid rgba(78,96,138,.3);text-align:left;overflow-wrap:anywhere}.phrase-word-meaning-table th{background:rgba(49,87,213,.09)}.correct-meaning-line{padding:11px 13px;border-left:4px solid #1e9f62;border-radius:8px;background:#edf9f3;color:#0b5d38}.vocabulary-answer-details h4{margin:16px 0 7px}@media(max-width:620px){.phrase-word-meaning-table{font-size:.92rem}.phrase-word-meaning-table th,.phrase-word-meaning-table td{padding:8px}}

/* V13.30 virtual call */
.phone-stage{min-height:76vh;display:grid;place-items:center;padding:24px}.phone-shell{width:min(100%,780px);overflow:hidden;border:1px solid rgba(80,100,150,.18);border-radius:34px;background:linear-gradient(160deg,#111936,#253467);color:#fff;box-shadow:0 25px 70px rgba(15,25,60,.28)}.phone-status{display:flex;justify-content:space-between;padding:16px 24px;font-size:.8rem;opacity:.85}.ring-screen{text-align:center;padding:35px 24px 55px}.teacher-avatar{width:112px;height:112px;display:grid;place-items:center;margin:auto;border-radius:50%;background:linear-gradient(145deg,#fff,#cbd8ff);font-size:58px}.teacher-avatar.small{width:54px;height:54px;margin:0;font-size:30px}.incoming-pulse{width:132px;height:132px;display:grid;place-items:center;margin:0 auto 22px;border-radius:50%;animation:incomingPulse 1.35s infinite}.incoming-label{letter-spacing:.08em;text-transform:uppercase;font-size:.78rem;opacity:.7}.ring-actions{display:flex;justify-content:center;gap:64px;margin:35px 0 18px}.call-button{width:66px;height:66px;border:0;border-radius:50%;color:#fff;font-size:28px;cursor:pointer}.call-button.answer{background:#27c66c}.call-button.decline{background:#ef4d5d;transform:rotate(135deg)}.small-call{width:48px;height:48px;font-size:20px}.active-call{padding:0 22px 24px}.active-teacher{display:flex;align-items:center;gap:13px;padding:12px 0}.active-teacher div:nth-child(2){display:flex;flex:1;flex-direction:column}.active-teacher span{font-size:.82rem;opacity:.74}.active-call .conversation-messages{color:#18203b;background:rgba(255,255,255,.95)}.active-call textarea{box-sizing:border-box;width:100%;border:0;border-radius:14px;padding:13px}.call-controls{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-top:12px}.coach-panel{margin:12px 0;padding:13px 16px;border-radius:14px;background:rgba(255,255,255,.12);white-space:pre-line}.coach-panel p{margin:6px 0}.mini-scores{font-size:.85rem;color:#cfe1ff}.call-progress{display:grid;gap:7px;margin-top:15px}.call-progress progress{width:100%}.call-summary{text-align:center;padding:55px 25px}.score-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:25px 0}.score-grid div{padding:16px 8px;border-radius:14px;background:rgba(255,255,255,.12)}.score-grid strong,.score-grid span{display:block}.score-grid span{text-transform:capitalize;font-size:.8rem;opacity:.76}.skill-chart>div{display:grid;grid-template-columns:120px 1fr 55px;gap:12px;align-items:center;margin:14px 0}.skill-track{height:12px;overflow:hidden;border-radius:20px;background:rgba(80,100,150,.12)}.skill-track i{display:block;height:100%;border-radius:20px;background:linear-gradient(90deg,#3157d5,#51c5d8)}@keyframes incomingPulse{0%,100%{box-shadow:0 0 0 0 rgba(100,160,255,.45)}50%{box-shadow:0 0 0 22px rgba(100,160,255,0)}}@media(max-width:600px){.phone-stage{padding:5px}.phone-shell{border-radius:20px}.score-grid{grid-template-columns:repeat(2,1fr)}.skill-chart>div{grid-template-columns:90px 1fr 45px}}
/* Restricted administrator learner-preview login. */
.useradmin-login-page{margin:0;min-height:100vh;background:linear-gradient(145deg,#e8f4ff 0%,#f7fbff 48%,#e9edff 100%);color:#111f3d;font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif}
.useradmin-login-shell{min-height:100vh;display:grid;place-items:center;padding:24px}
.useradmin-login-card{width:min(100%,460px);background:#fff;border:1px solid #d9e3f2;border-radius:24px;box-shadow:0 24px 70px rgba(24,48,92,.16);padding:36px}
.useradmin-login-card h1{margin:.45rem 0 .5rem;font-size:clamp(1.8rem,5vw,2.4rem)}
.useradmin-lock{display:grid;place-items:center;width:58px;height:58px;border-radius:18px;background:#e8efff;font-size:1.7rem;margin-bottom:18px}
.useradmin-login-form{display:grid;gap:16px;margin-top:24px}
.useradmin-login-form label{display:grid;gap:8px;font-weight:700}
.useradmin-login-form input{width:100%;box-sizing:border-box;border:1px solid #bdc9dc;border-radius:10px;padding:14px;font:inherit;background:#f9fbff}
.useradmin-login-form button{width:100%;padding:14px;border-radius:10px}
.useradmin-preview-bar{position:sticky;top:0;z-index:1100;display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;padding:9px 16px;background:#fff4cf;border-bottom:1px solid #e2b84f;color:#4f3900}
.useradmin-preview-bar form{margin:0}
.useradmin-preview-bar button{padding:7px 12px;background:#263f8e}
@media(max-width:560px){.useradmin-login-card{padding:26px 20px;border-radius:18px}.useradmin-preview-bar{font-size:.88rem}}

/* V13.31 public conversion and visual refresh */
.conversion-hero{align-items:center;padding:64px 0 42px;gap:54px}.conversion-hero h1{max-width:760px;font-size:clamp(42px,5.5vw,72px);letter-spacing:-.04em}.hero-lead{max-width:700px!important}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:26px 0 18px}.hero-actions .button-link{padding:14px 21px;font-size:15px}.hero-primary{box-shadow:0 12px 28px rgba(31,94,255,.22)}.trust-row{display:flex;flex-wrap:wrap;gap:10px 18px;color:#344054;font-size:13px;font-weight:800}.conversion-recommend{padding:16px;margin-top:24px;border:1px solid #dce4f4;border-radius:16px;background:#fff;box-shadow:0 10px 30px rgba(16,24,40,.06)}
.learning-preview{position:relative;overflow:hidden;padding:30px;background:linear-gradient(155deg,#12264c,#244e9e);color:#fff;border:0;box-shadow:0 24px 55px rgba(19,46,91,.25)}.learning-preview:after{content:"";position:absolute;width:190px;height:190px;right:-80px;top:-80px;border-radius:50%;background:rgba(109,210,255,.18)}.learning-preview h2{font-size:32px;margin:8px 0 22px}.preview-label{font-size:11px;font-weight:900;letter-spacing:.12em;color:#9edcff}.preview-steps{display:grid;gap:14px;padding:0;margin:0 0 22px;list-style:none}.preview-steps li{display:flex;align-items:center;gap:13px;padding:13px;border:1px solid rgba(255,255,255,.14);border-radius:13px;background:rgba(255,255,255,.08)}.preview-steps li>span{display:grid;place-items:center;flex:0 0 35px;height:35px;border-radius:50%;background:#69d3cd;color:#10284a;font-weight:900}.preview-steps strong,.preview-steps small{display:block}.preview-steps small{color:#d5e4ff}.preview-link{color:#fff;font-weight:800}
.proof-strip{display:grid;grid-template-columns:repeat(4,1fr);margin:8px 0 58px;border:1px solid #dce3ee;border-radius:18px;background:#fff;box-shadow:0 10px 35px rgba(16,24,40,.05)}.proof-strip div{padding:19px;border-right:1px solid #e8ebf1}.proof-strip div:last-child{border:0}.proof-strip strong,.proof-strip span{display:block}.proof-strip span{margin-top:3px;color:#667085;font-size:12px}.section-heading h2{margin:7px 0 0;font-size:clamp(28px,4vw,40px)}.conversion-course-card{position:relative;display:flex;flex-direction:column;min-height:245px;transition:.2s ease}.conversion-course-card:hover{transform:translateY(-5px);box-shadow:0 18px 40px rgba(16,24,40,.1)}.conversion-course-card .text-link{margin-top:auto;font-weight:800}
.how-it-works{padding:40px;border-radius:24px;background:#eaf1ff}.steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:25px}.steps-grid article{padding:22px;border-radius:16px;background:#fff}.steps-grid article>span{font-size:13px;font-weight:900;color:#3157d5}.steps-grid h3{margin:8px 0}.steps-grid p{margin:0;color:#596579}.feature-split .card{padding:32px}.final-cta{display:flex;align-items:center;justify-content:space-between;gap:30px;margin:60px 0 20px;padding:36px 40px;border-radius:24px;background:linear-gradient(135deg,#101f3b,#244a8f);color:#fff}.final-cta h2{font-size:clamp(27px,4vw,42px);margin:8px 0}.final-cta p{margin:0;color:#d6e2f7}.final-cta .button-link{white-space:nowrap;background:#68d2cb;color:#10233f}
.purchase-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;overflow:hidden;margin:4px 0 24px;border:1px solid #dbe3f0;border-radius:16px;background:#dbe3f0}.purchase-steps div{display:grid;grid-template-columns:36px 1fr;gap:0 11px;padding:17px;background:#fff}.purchase-steps span{grid-row:1/3;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#eaf0ff;color:#3157d5;font-weight:900}.purchase-steps strong,.purchase-steps small{display:block}.purchase-steps small{color:#667085}.pricing-signup-cta{width:100%;text-align:center}
.register-shell{display:grid;grid-template-columns:minmax(300px,.85fr) minmax(440px,1.15fr);gap:40px;align-items:start;max-width:1050px;margin:34px auto}.register-value-panel{position:sticky;top:110px;padding:40px;border-radius:24px;background:linear-gradient(150deg,#142b54,#2858a8);color:#fff;box-shadow:0 24px 60px rgba(17,43,84,.2)}.register-value-panel h1{font-size:clamp(32px,4vw,50px);line-height:1.08;margin:16px 0}.register-value-panel>p{color:#d8e6ff}.register-value-panel ul{display:grid;gap:18px;padding:0;margin:28px 0;list-style:none}.register-value-panel li{display:grid;grid-template-columns:22px 1fr}.register-value-panel li:before{content:"✓";color:#6de0c7;font-weight:900}.register-value-panel li span{grid-column:2;color:#cfddf5;font-size:13px}.register-trust{padding:13px;border:1px solid rgba(255,255,255,.2);border-radius:12px;background:rgba(255,255,255,.08);font-size:13px}.register-card{max-width:none;margin:0;padding:32px}.register-card h2{font-size:34px;margin:9px 0}.signup-progress{display:flex;gap:7px;margin-bottom:25px}.signup-progress span{flex:1;padding:8px;border-radius:999px;background:#eef1f5;text-align:center;font-size:11px;font-weight:900}.signup-progress .active{background:#3157d5;color:#fff}.register-form{display:grid;gap:8px}.register-two-col{display:grid;grid-template-columns:1fr 1fr;gap:14px}.register-form button{width:100%;padding:14px;margin-top:9px}.form-assurance{text-align:center;color:#667085;font-size:12px}
.nav-more{position:relative}.nav-more summary{cursor:pointer;color:#344054;font-size:14px;font-weight:700;list-style:none}.nav-more summary::-webkit-details-marker{display:none}.nav-more summary:after{content:" ▾"}.nav-more-menu{position:absolute;right:0;top:32px;display:grid;grid-template-columns:repeat(2,minmax(145px,1fr));gap:2px;width:340px;padding:10px;border:1px solid #dfe4ec;border-radius:14px;background:#fff;box-shadow:0 18px 50px rgba(16,24,40,.18)}.nav-more-menu a{padding:9px 10px;border-radius:8px}.nav-more-menu a:hover{background:#eef4ff;text-decoration:none}
@media(max-width:900px){.conversion-hero{padding-top:35px}.proof-strip{grid-template-columns:repeat(2,1fr)}.proof-strip div:nth-child(2){border-right:0}.steps-grid{grid-template-columns:1fr}.register-shell{grid-template-columns:1fr}.register-value-panel{position:static}.purchase-steps{grid-template-columns:1fr}}
@media(max-width:620px){.conversion-hero h1{font-size:40px}.hero-actions .button-link{width:100%;text-align:center}.proof-strip{grid-template-columns:1fr}.proof-strip div{border-right:0;border-bottom:1px solid #e8ebf1}.final-cta{align-items:stretch;flex-direction:column;padding:28px 22px}.final-cta .button-link{text-align:center}.how-it-works{padding:24px 16px}.register-shell{display:block}.register-value-panel{margin-bottom:18px;padding:26px 20px}.register-card{padding:24px 18px}.register-two-col{grid-template-columns:1fr}.nav-more{width:100%}.nav-more-menu{position:static;width:100%;margin-top:8px;box-shadow:none}}
.search-language-mode{display:inline-flex!important;flex-direction:row!important;align-items:center;gap:8px;width:max-content;font-weight:800}.search-language-mode input{width:18px!important;min-height:18px!important;height:18px;margin:0;accent-color:#3157d5}.search-language-status{display:block;color:#475569;font-weight:700}.dictionary-search .search-language-mode,.dictionary-search .search-language-status{grid-column:1/-1}
.registration-profile-options{margin:8px 0;padding:12px 14px;border:1px solid #dbe3f0;border-radius:12px;background:#f8faff}.registration-profile-options summary{cursor:pointer;font-weight:800;color:#3157d5}.registration-profile-options[open] summary{margin-bottom:10px}.public-demo-section{padding:34px;border:1px solid #dce5f4;border-radius:24px;background:#f8fbff}.public-demo-grid{align-items:start}.public-demo-card{overflow:hidden}.public-demo-card h3{margin-top:0}.demo-video-hero{padding:40px;border-radius:24px;background:linear-gradient(135deg,#eef4ff,#f8fffd)}.public-demo-empty{text-align:center;max-width:760px;margin:20px auto}.conversion-assurance{display:flex;gap:12px;align-items:center;margin:28px 0;padding:18px 22px;border-radius:14px;background:#eaf7f3}.conversion-assurance span{color:#475569}.hindi-landing-hero{margin-top:25px}.landing-benefits ul{display:grid;gap:14px;padding-left:22px}.landing-benefits li{font-weight:800}
@media(max-width:620px){.public-demo-section{padding:22px 14px}.conversion-assurance{align-items:flex-start;flex-direction:column}.demo-video-hero{padding:28px 20px}}
.activity-learning-box{white-space:pre-line}
.activity-selected-language{margin:10px 0 0;color:#475467}.activity-grammar-explanation{white-space:pre-line}.activity-word-heading{display:block;margin:18px 0 8px;color:#17233b}.activity-word-table{width:100%;border-collapse:collapse;background:#fff}.activity-word-table th,.activity-word-table td{padding:9px 11px;border:1px solid #cfd9ec;text-align:left}.activity-word-table th{width:38%;color:#17233b;background:#eef3ff}.activity-word-table td{font-weight:700;color:#31506f}
.mobile-try-cta{display:none}
@media(max-width:700px){
  .site-header{position:sticky;top:0;z-index:100}
  .nav-wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;width:calc(100% - 20px);min-height:58px;padding:8px 0}
  .brand{min-width:0;font-size:15px}.brand span:last-child{overflow:hidden;text-overflow:ellipsis}.brand-mark{flex:0 0 34px}
  .menu-toggle{display:inline-block;grid-column:2;grid-row:1;margin:0}
  .primary-navigation{position:fixed;z-index:105;left:8px;right:8px;top:66px;display:none;max-height:calc(100dvh - 142px);padding:10px;overflow-y:auto;overscroll-behavior:contain;border:1px solid #d9e2ef;border-radius:16px;background:#fff;box-shadow:0 20px 55px rgba(17,34,68,.24)}
  .primary-navigation.is-open{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 6px}
  .primary-navigation a{min-width:0;min-height:42px;padding:8px 9px;border-radius:9px;line-height:1.25;overflow-wrap:anywhere}
  .primary-navigation a:hover,.primary-navigation a:focus{background:#eef4ff}
  .primary-navigation .global-language-label,.primary-navigation .nav-more,.primary-navigation .nav-logout-form,.primary-navigation>span{grid-column:1/-1}
  .global-language-label{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:8px;width:100%;padding:5px 8px}
  .global-language-label select{width:100%;min-width:0;margin:0;padding:7px 8px}
  .nav-more summary{padding:9px 10px;border-radius:9px;background:#f7f9fd}
  .nav-more-menu{position:static;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;max-height:38vh;margin-top:5px;padding:6px;overflow-y:auto;box-shadow:none}
  .nav-more-menu strong{padding:7px 8px;font-size:12px}.nav-more-menu a{min-height:38px;padding:7px 8px;font-size:13px}
  body.mobile-menu-open{overflow:hidden}
  .mobile-try-cta{position:fixed;z-index:90;right:10px;bottom:max(8px,env(safe-area-inset-bottom));left:10px;display:flex;align-items:center;justify-content:center;min-height:48px;padding:10px 14px;border-radius:12px;background:#3157d5;color:#fff;font-size:14px;font-weight:900;text-align:center;box-shadow:0 12px 32px rgba(28,64,170,.32)}
  body:has(.mobile-try-cta){padding-bottom:64px}
  body:has(.mobile-try-cta) .hero-actions .hero-primary[href="/try-english"]{display:none}
  .chat-launch{display:none!important}.help-chat-launcher{right:14px!important;bottom:70px!important;width:46px!important;height:46px!important}
  .container{width:calc(100% - 20px);padding-top:12px}
  .conversion-hero{padding:14px 0 20px;gap:16px}.conversion-hero h1{margin:8px 0 12px;font-size:clamp(32px,10vw,40px);line-height:1.04}.hero-lead{margin:0;font-size:16px!important;line-height:1.5}.hero-actions{margin:16px 0 12px}.trust-row{display:grid;grid-template-columns:1fr 1fr;gap:6px 10px;font-size:12px}.conversion-recommend{margin-top:14px;padding:12px}.recommend-form{grid-template-columns:1fr 92px;gap:8px}.recommend-form button{grid-column:1/-1}.learning-preview{padding:20px}.learning-preview h2{font-size:26px;margin-bottom:14px}.preview-steps{gap:8px}.preview-steps li{padding:9px}
  .proof-strip{grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:30px}.proof-strip div{padding:13px;border-right:1px solid #e8ebf1}.proof-strip div:nth-child(2n){border-right:0}.proof-strip span{line-height:1.35}
  .section{margin:28px 0}.section-heading{align-items:flex-start;gap:8px}.section-heading h2{font-size:28px}.course-card{min-height:auto}.final-cta{margin-top:34px}
  .public-activity-shell{margin:14px auto}.public-activity-intro h1{font-size:36px}.activity-skill-strip{margin:10px 0}.activity-progress{margin:14px 0 10px}.activity-question-card,.activity-result{padding:18px 15px;border-radius:16px}.activity-question-card h2{font-size:28px}.activity-options{gap:8px}.activity-options button{padding:11px 12px}.activity-learning-box{max-height:44vh;overflow:auto;padding:11px 12px}.activity-word-table th,.activity-word-table td{padding:7px 8px}
}
@media(max-width:390px){.primary-navigation.is-open{grid-template-columns:1fr}.primary-navigation .global-language-label,.primary-navigation .nav-more,.primary-navigation .nav-logout-form,.primary-navigation>span{grid-column:1}.nav-more-menu{grid-template-columns:1fr 1fr}.trust-row,.proof-strip{grid-template-columns:1fr 1fr}}
.public-activity-shell{max-width:820px;margin:34px auto}.public-activity-intro{text-align:center}.public-activity-intro h1{font-size:clamp(36px,6vw,58px);margin:10px 0}.activity-progress{height:8px;margin:25px 0 15px;overflow:hidden;border-radius:99px;background:#e7ecf5}.activity-progress span{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#3157d5,#42bda8);transition:width .3s}.activity-question-card,.activity-result{padding:clamp(22px,5vw,44px);border:1px solid #dce4f2;border-radius:24px;background:#fff;box-shadow:0 20px 50px rgba(27,47,86,.09)}.activity-counter{font-size:13px;font-weight:900;color:#3157d5}.activity-instruction{margin-bottom:6px;color:#667085}.activity-question-card h2{margin:0 0 18px;font-size:clamp(25px,4vw,38px)}.activity-listen{margin:0 0 18px;padding:9px 13px;background:#eef3ff;color:#2446a8}.activity-options{display:grid;gap:11px}.activity-options button{padding:15px 17px;border:1px solid #ccd7eb;background:#fff;color:#17233b;text-align:left}.activity-options button:hover:not(:disabled){border-color:#3157d5;background:#f3f6ff}.activity-options button.correct{border-color:#15936f;background:#e9f8f2}.activity-options button.incorrect{border-color:#c73d4b;background:#fff0f1}.activity-feedback{min-height:28px;margin:17px 0 8px;font-weight:800}.activity-feedback.success{color:#087458}.activity-feedback.retry{color:#9b2734}.activity-next{margin-left:auto}.activity-result{text-align:center;background:linear-gradient(145deg,#f6f9ff,#edfff9)}.activity-result-icon{display:grid;place-items:center;width:58px;height:58px;margin:auto;border-radius:50%;background:#15936f;color:#fff;font-size:30px;font-weight:900}.activity-result h2{font-size:clamp(27px,4vw,40px)}.activity-skill-strip,.activity-result-skills{display:flex;justify-content:center;gap:9px;flex-wrap:wrap;margin:17px 0}.activity-skill-strip span,.activity-result-skills span{padding:7px 11px;border:1px solid #d5dfef;border-radius:999px;background:#fff;color:#33415c;font-size:13px;font-weight:800}.activity-skill-badge{display:inline-block;margin:10px 0 6px;padding:5px 10px;border-radius:999px;background:#e9f8f2;color:#087458;font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.04em}.activity-learning-box{margin:0 0 17px;padding:13px 15px;border-left:4px solid #3157d5;border-radius:9px;background:#f3f6ff;color:#293b68}.activity-score-line{font-size:21px;font-weight:900;color:#17233b}.activity-result-skills span{border-color:#bfe3d5;background:#effaf6;color:#087458}.activity-write-answer{margin:4px 0 10px}.activity-write-answer label{margin-bottom:7px}.activity-write-answer>div{display:grid;grid-template-columns:1fr auto;gap:10px}.activity-write-answer input{margin:0;min-height:48px}.activity-write-answer button{white-space:nowrap}@media(max-width:620px){.activity-skill-strip{display:grid;grid-template-columns:1fr 1fr}.activity-skill-strip span{text-align:center}.activity-write-answer>div{grid-template-columns:1fr}.activity-write-answer button{width:100%}}