
/* ==========================================================
   KIDS SECTION UI REDESIGN v17.10.73
========================================================== */
body.kids-ui-redesign {
    background:
        radial-gradient(circle at top left, rgba(191, 219, 254, .35), transparent 28%),
        radial-gradient(circle at top right, rgba(254, 240, 138, .18), transparent 24%),
        linear-gradient(180deg, #f6fbff 0%, #f8fafc 28%, #f4f7ff 100%);
}

.kids-ui-redesign .kids-shell {
    width: min(1320px, calc(100% - 32px));
    padding: 26px 0 76px;
}

.kids-ui-redesign .kids-breadcrumbs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-bottom: 18px;
    padding: 0 4px;
    color: #6b7a93;
    font-weight: 700;
}

.kids-ui-redesign .kids-subnav {
    position: sticky;
    top: 78px;
    z-index: 40;
    gap: 10px;
    padding-top: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(191, 213, 255, .85);
    background: rgba(255, 255, 255, .82);
    backdrop-filter: blur(14px);
}

.kids-ui-redesign .kids-subnav a {
    padding: 10px 16px;
    border-radius: 999px;
    color: #44607d;
    background: rgba(230, 239, 253, .82);
    border: 1px solid rgba(204, 221, 250, .9);
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.kids-ui-redesign .kids-subnav a:hover,
.kids-ui-redesign .kids-subnav a[aria-current="page"] {
    transform: translateY(-1px);
    color: #fff;
    background: linear-gradient(135deg, #2563eb, #4f46e5);
    box-shadow: 0 14px 24px rgba(37, 99, 235, .22);
}

.kids-ui-redesign .kids-hero,
.kids-ui-redesign .kids-content-card,
.kids-ui-redesign .kids-practice-card,
.kids-ui-redesign .kids-path-card,
.kids-ui-redesign .kids-feature-card,
.kids-ui-redesign .kids-test-card,
.kids-ui-redesign .kids-game-card,
.kids-ui-redesign .kids-badge-card,
.kids-ui-redesign .kids-progress-card,
.kids-ui-redesign .kids-history-card,
.kids-ui-redesign .kids-side-card,
.kids-ui-redesign .kids-certificate-path,
.kids-ui-redesign .kids-goal-card,
.kids-ui-redesign .kids-continue-card,
.kids-ui-redesign .kids-stat-card,
.kids-ui-redesign .journey-step {
    background: rgba(255, 255, 255, .92);
    border: 1px solid rgba(205, 219, 243, .95);
    box-shadow: 0 18px 50px rgba(15, 23, 42, .08);
}

.kids-ui-redesign .kids-hero {
    position: relative;
    padding: clamp(26px, 4.2vw, 54px);
    gap: 28px;
    border-radius: 34px;
    overflow: hidden;
}

.kids-ui-redesign .kids-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 16% 16%, rgba(96, 165, 250, .18), transparent 26%),
        radial-gradient(circle at 85% 18%, rgba(250, 204, 21, .18), transparent 22%),
        radial-gradient(circle at 74% 86%, rgba(244, 114, 182, .14), transparent 25%);
    pointer-events: none;
}

.kids-ui-redesign .kids-hero > * {
    position: relative;
    z-index: 1;
}

.kids-ui-redesign .kids-hero h1,
.kids-ui-redesign .kids-content-card h1,
.kids-ui-redesign .kids-page-hero h1 {
    font-family: "Poppins", "Inter", sans-serif;
    letter-spacing: -.03em;
}

.kids-ui-redesign .kids-hero p,
.kids-ui-redesign .kids-content-card p,
.kids-ui-redesign .kids-page-hero p {
    color: #52627a;
}

.kids-ui-redesign .kids-home-action-grid,
.kids-ui-redesign .kids-highlight-grid,
.kids-ui-redesign .kids-mini-card-grid,
.kids-ui-redesign .kids-parents-grid,
.kids-ui-redesign .kids-certificate-steps {
    display: grid;
    gap: 18px;
}

.kids-ui-redesign .kids-home-action-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.kids-ui-redesign .kids-highlight-grid,
.kids-ui-redesign .kids-certificate-steps {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.kids-ui-redesign .kids-mini-card-grid,
.kids-ui-redesign .kids-parents-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.kids-ui-redesign .kids-quick-card,
.kids-ui-redesign .kids-highlight-card,
.kids-ui-redesign .kids-mini-card,
.kids-ui-redesign .kids-parent-card,
.kids-ui-redesign .kids-step-card,
.kids-ui-redesign .kids-featured-banner {
    position: relative;
    display: block;
    padding: 22px;
    border-radius: 24px;
    color: #0f172a;
    border: 1px solid rgba(198, 216, 248, .9);
    box-shadow: 0 16px 34px rgba(15, 23, 42, .08);
    overflow: hidden;
}

.kids-ui-redesign .kids-quick-card::before,
.kids-ui-redesign .kids-highlight-card::before,
.kids-ui-redesign .kids-mini-card::before,
.kids-ui-redesign .kids-parent-card::before,
.kids-ui-redesign .kids-step-card::before,
.kids-ui-redesign .kids-featured-banner::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: .96;
    pointer-events: none;
}

.kids-ui-redesign .kids-home-action-grid > :nth-child(1)::before { background: linear-gradient(135deg, #dbeafe, #eff6ff); }
.kids-ui-redesign .kids-home-action-grid > :nth-child(2)::before { background: linear-gradient(135deg, #dcfce7, #f0fdf4); }
.kids-ui-redesign .kids-home-action-grid > :nth-child(3)::before { background: linear-gradient(135deg, #ffedd5, #fff7ed); }
.kids-ui-redesign .kids-home-action-grid > :nth-child(4)::before { background: linear-gradient(135deg, #fef3c7, #fffbea); }
.kids-ui-redesign .kids-home-action-grid > :nth-child(5)::before { background: linear-gradient(135deg, #ede9fe, #f5f3ff); }
.kids-ui-redesign .kids-home-action-grid > :nth-child(6)::before { background: linear-gradient(135deg, #ffe4e6, #fff1f2); }

.kids-ui-redesign .kids-highlight-grid > :nth-child(1)::before,
.kids-ui-redesign .kids-mini-card-grid > :nth-child(1)::before,
.kids-ui-redesign .kids-certificate-steps > :nth-child(1)::before,
.kids-ui-redesign .kids-parents-grid > :nth-child(1)::before { background: linear-gradient(135deg, #e0f2fe, #f0f9ff); }
.kids-ui-redesign .kids-highlight-grid > :nth-child(2)::before,
.kids-ui-redesign .kids-mini-card-grid > :nth-child(2)::before,
.kids-ui-redesign .kids-certificate-steps > :nth-child(2)::before,
.kids-ui-redesign .kids-parents-grid > :nth-child(2)::before { background: linear-gradient(135deg, #ecfccb, #f7fee7); }
.kids-ui-redesign .kids-highlight-grid > :nth-child(3)::before,
.kids-ui-redesign .kids-mini-card-grid > :nth-child(3)::before,
.kids-ui-redesign .kids-certificate-steps > :nth-child(3)::before,
.kids-ui-redesign .kids-parents-grid > :nth-child(3)::before { background: linear-gradient(135deg, #fce7f3, #fdf2f8); }
.kids-ui-redesign .kids-highlight-grid > :nth-child(4)::before,
.kids-ui-redesign .kids-mini-card-grid > :nth-child(4)::before,
.kids-ui-redesign .kids-certificate-steps > :nth-child(4)::before,
.kids-ui-redesign .kids-parents-grid > :nth-child(4)::before { background: linear-gradient(135deg, #fef3c7, #fffbeb); }

.kids-ui-redesign .kids-quick-card > *,
.kids-ui-redesign .kids-highlight-card > *,
.kids-ui-redesign .kids-mini-card > *,
.kids-ui-redesign .kids-parent-card > *,
.kids-ui-redesign .kids-step-card > *,
.kids-ui-redesign .kids-featured-banner > * {
    position: relative;
    z-index: 1;
}

.kids-ui-redesign .kids-quick-card:hover,
.kids-ui-redesign .kids-highlight-card:hover,
.kids-ui-redesign .kids-mini-card:hover,
.kids-ui-redesign .kids-parent-card:hover,
.kids-ui-redesign .kids-step-card:hover,
.kids-ui-redesign .kids-featured-banner:hover {
    transform: translateY(-3px);
    box-shadow: 0 24px 40px rgba(15, 23, 42, .12);
}

.kids-ui-redesign .kids-card-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: #1d4ed8;
}

.kids-ui-redesign .kids-card-kicker .icon,
.kids-ui-redesign .kids-card-icon-badge {
    display: inline-grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border-radius: 16px;
    background: rgba(255, 255, 255, .72);
    box-shadow: inset 0 0 0 1px rgba(203, 213, 225, .75);
    font-size: 24px;
}

.kids-ui-redesign .kids-quick-card h3,
.kids-ui-redesign .kids-highlight-card h3,
.kids-ui-redesign .kids-mini-card h3,
.kids-ui-redesign .kids-parent-card h3,
.kids-ui-redesign .kids-step-card h3 {
    margin: 0 0 8px;
    font-size: 26px;
    line-height: 1.15;
    letter-spacing: -.02em;
}

.kids-ui-redesign .kids-quick-card p,
.kids-ui-redesign .kids-highlight-card p,
.kids-ui-redesign .kids-mini-card p,
.kids-ui-redesign .kids-parent-card p,
.kids-ui-redesign .kids-step-card p,
.kids-ui-redesign .kids-featured-banner p {
    margin: 0;
    color: #53627b;
    line-height: 1.6;
}

.kids-ui-redesign .kids-card-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 16px;
    color: #1769ff;
    font-weight: 800;
}

.kids-ui-redesign .kids-home-highlights {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-top: 22px;
}

.kids-ui-redesign .kids-home-highlights .kids-stat-card {
    text-align: left;
    padding: 18px 20px;
    border-radius: 20px;
}

.kids-ui-redesign .kids-home-highlights .kids-stat-card strong {
    font-size: 30px;
}

.kids-ui-redesign .kids-featured-banner {
    margin-top: 18px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
}

.kids-ui-redesign .kids-featured-banner::before {
    background: linear-gradient(135deg, #dbeafe, #e0f2fe 42%, #eff6ff 100%);
}

.kids-ui-redesign .kids-featured-visual {
    display: flex;
    align-items: center;
    gap: 16px;
}

.kids-ui-redesign .kids-featured-emoji {
    display: grid;
    place-items: center;
    width: 78px;
    height: 78px;
    border-radius: 24px;
    background: rgba(255,255,255,.82);
    font-size: 42px;
    box-shadow: inset 0 0 0 1px rgba(203,213,225,.75);
}

.kids-ui-redesign .kids-featured-banner h2 {
    margin: 6px 0;
    font-size: 30px;
    line-height: 1.1;
}

.kids-ui-redesign .kids-featured-banner .kids-button {
    white-space: nowrap;
}

.kids-ui-redesign .kids-page-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 20px;
    align-items: center;
    margin-bottom: 22px;
    padding: 28px 30px;
    border-radius: 28px;
    background: rgba(255,255,255,.92);
    border: 1px solid rgba(205,219,243,.95);
    box-shadow: 0 18px 50px rgba(15,23,42,.08);
}

.kids-ui-redesign .kids-page-hero h1 {
    margin: 8px 0 10px;
    font-size: clamp(34px, 4vw, 56px);
}

.kids-ui-redesign .kids-page-badge {
    display: inline-grid;
    place-items: center;
    min-width: 170px;
    padding: 18px 20px;
    border-radius: 24px;
    background: linear-gradient(135deg, #dbeafe, #ede9fe);
    color: #1e3a8a;
    font-weight: 800;
    text-align: center;
}

.kids-ui-redesign .kids-page-badge small {
    display: block;
    margin-top: 6px;
    color: #4b5f7b;
    font-weight: 700;
}

.kids-ui-redesign .kids-content-card {
    position: relative;
    overflow: hidden;
    border-radius: 28px;
    padding: clamp(24px, 3.3vw, 40px);
}

.kids-ui-redesign .kids-content-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 6px;
    background: linear-gradient(90deg, #2563eb, #7c3aed, #f59e0b);
}

.kids-ui-redesign .kids-content-card > * {
    position: relative;
    z-index: 1;
}

.kids-ui-redesign .kids-progress-overview,
.kids-ui-redesign .kids-live-stats {
    gap: 12px;
}

.kids-ui-redesign .kids-progress-metric,
.kids-ui-redesign .kids-live-stat {
    padding: 14px 16px;
    border-radius: 18px;
    background: rgba(246, 250, 255, .9);
    border: 1px solid rgba(215, 227, 246, .95);
}

.kids-ui-redesign .kids-test-card,
.kids-ui-redesign .kids-game-card,
.kids-ui-redesign .kids-badge-card,
.kids-ui-redesign .kids-certificate-path,
.kids-ui-redesign .kids-feature-card,
.kids-ui-redesign .kids-path-card {
    border-radius: 24px;
}

.kids-ui-redesign .kids-test-grid,
.kids-ui-redesign .kids-game-grid,
.kids-ui-redesign .kids-badge-grid,
.kids-ui-redesign .kids-certificate-grid,
.kids-ui-redesign .kids-feature-grid,
.kids-ui-redesign .kids-path-grid {
    gap: 20px;
}

.kids-ui-redesign .kids-test-card::after,
.kids-ui-redesign .kids-game-card::after,
.kids-ui-redesign .kids-badge-card::after,
.kids-ui-redesign .kids-certificate-path::after,
.kids-ui-redesign .kids-feature-card::after,
.kids-ui-redesign .kids-path-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(255,255,255,.64), rgba(255,255,255,0));
    pointer-events: none;
}

.kids-ui-redesign .kids-test-card > *,
.kids-ui-redesign .kids-game-card > *,
.kids-ui-redesign .kids-badge-card > *,
.kids-ui-redesign .kids-certificate-path > *,
.kids-ui-redesign .kids-feature-card > *,
.kids-ui-redesign .kids-path-card > * {
    position: relative;
    z-index: 1;
}

.kids-ui-redesign .kids-test-card:nth-child(4n+1),
.kids-ui-redesign .kids-game-card:nth-child(4n+1),
.kids-ui-redesign .kids-feature-card:nth-child(4n+1),
.kids-ui-redesign .kids-certificate-path:nth-child(4n+1) { background: linear-gradient(135deg, #f8fbff, #eef7ff); }
.kids-ui-redesign .kids-test-card:nth-child(4n+2),
.kids-ui-redesign .kids-game-card:nth-child(4n+2),
.kids-ui-redesign .kids-feature-card:nth-child(4n+2),
.kids-ui-redesign .kids-certificate-path:nth-child(4n+2) { background: linear-gradient(135deg, #f7fff7, #eefcf3); }
.kids-ui-redesign .kids-test-card:nth-child(4n+3),
.kids-ui-redesign .kids-game-card:nth-child(4n+3),
.kids-ui-redesign .kids-feature-card:nth-child(4n+3),
.kids-ui-redesign .kids-certificate-path:nth-child(4n+3) { background: linear-gradient(135deg, #fff8fe, #fff1f8); }
.kids-ui-redesign .kids-test-card:nth-child(4n),
.kids-ui-redesign .kids-game-card:nth-child(4n),
.kids-ui-redesign .kids-feature-card:nth-child(4n),
.kids-ui-redesign .kids-certificate-path:nth-child(4n) { background: linear-gradient(135deg, #fffdf5, #fff8e8); }

.kids-ui-redesign .kids-card-icon {
    display: inline-grid;
    place-items: center;
    width: 58px;
    height: 58px;
    border-radius: 18px;
    background: rgba(255,255,255,.7);
    box-shadow: inset 0 0 0 1px rgba(203,213,225,.75);
}

.kids-ui-redesign .kids-app-grid {
    gap: 24px;
}

.kids-ui-redesign .kids-lesson-sidebar {
    top: 146px;
    padding: 20px;
    border-radius: 24px;
}

.kids-ui-redesign .kids-practice-head {
    align-items: start;
    padding: 22px 24px;
}

.kids-ui-redesign .kids-practice-head h1 {
    margin: 10px 0 0;
}

.kids-ui-redesign .kids-text-area {
    padding: 26px;
}

.kids-ui-redesign .kids-section-heading h2 {
    letter-spacing: -.03em;
}

.kids-ui-redesign .kids-note {
    border-radius: 24px;
    background: linear-gradient(135deg, #ecfeff, #f0fdf4);
    border-color: #a7f3d0;
}

.kids-ui-redesign .kids-results {
    background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(239,246,255,.92));
}

.kids-ui-redesign .kids-activity-item,
.kids-ui-redesign .kids-personal-best {
    background: rgba(248, 250, 252, .95);
    border-color: rgba(215, 227, 246, .95);
}

.kids-ui-redesign .kids-home-page .kids-stats-strip {
    margin-top: 18px;
    margin-bottom: 0;
}

.kids-ui-redesign .kids-home-page .kids-stats-strip .kids-stat-card {
    text-align: left;
    padding: 20px 22px;
    background: rgba(255,255,255,.95);
}

.kids-ui-redesign .kids-home-page .kids-stats-strip .kids-stat-card strong {
    font-size: 34px;
}

.kids-ui-redesign .kids-top-note {
    margin-top: 18px;
    display: grid;
    gap: 8px;
    padding: 16px 18px;
    border-radius: 18px;
    background: rgba(239, 246, 255, .82);
    border: 1px solid rgba(191, 219, 254, .95);
    color: #1e3a8a;
}

.kids-ui-redesign .kids-top-note strong {
    font-size: 15px;
}

.kids-ui-redesign .kids-history-card,
.kids-ui-redesign .kids-progress-card {
    border-radius: 26px;
}

html[data-theme="dark"] body.kids-ui-redesign {
    background:
        radial-gradient(circle at top left, rgba(37, 99, 235, .18), transparent 28%),
        radial-gradient(circle at top right, rgba(234, 179, 8, .10), transparent 24%),
        linear-gradient(180deg, #08111f 0%, #0b1322 35%, #0f172a 100%);
}

html[data-theme="dark"] .kids-ui-redesign .kids-subnav,
html[data-theme="dark"] .kids-ui-redesign .kids-hero,
html[data-theme="dark"] .kids-ui-redesign .kids-content-card,
html[data-theme="dark"] .kids-ui-redesign .kids-practice-card,
html[data-theme="dark"] .kids-ui-redesign .kids-path-card,
html[data-theme="dark"] .kids-ui-redesign .kids-feature-card,
html[data-theme="dark"] .kids-ui-redesign .kids-test-card,
html[data-theme="dark"] .kids-ui-redesign .kids-game-card,
html[data-theme="dark"] .kids-ui-redesign .kids-badge-card,
html[data-theme="dark"] .kids-ui-redesign .kids-progress-card,
html[data-theme="dark"] .kids-ui-redesign .kids-history-card,
html[data-theme="dark"] .kids-ui-redesign .kids-side-card,
html[data-theme="dark"] .kids-ui-redesign .kids-certificate-path,
html[data-theme="dark"] .kids-ui-redesign .kids-goal-card,
html[data-theme="dark"] .kids-ui-redesign .kids-continue-card,
html[data-theme="dark"] .kids-ui-redesign .kids-stat-card,
html[data-theme="dark"] .kids-ui-redesign .journey-step,
html[data-theme="dark"] .kids-ui-redesign .kids-page-hero {
    background: rgba(13, 24, 42, .94);
    border-color: rgba(48, 64, 92, .96);
    box-shadow: 0 20px 50px rgba(2, 6, 23, .45);
}

html[data-theme="dark"] .kids-ui-redesign .kids-subnav {
    background: rgba(8, 17, 31, .88);
}

html[data-theme="dark"] .kids-ui-redesign .kids-subnav a {
    color: #dbeafe;
    background: rgba(20, 35, 58, .9);
    border-color: rgba(56, 74, 104, .95);
}

html[data-theme="dark"] .kids-ui-redesign .kids-hero h1,
html[data-theme="dark"] .kids-ui-redesign .kids-content-card h1,
html[data-theme="dark"] .kids-ui-redesign .kids-content-card h2,
html[data-theme="dark"] .kids-ui-redesign .kids-content-card h3,
html[data-theme="dark"] .kids-ui-redesign .kids-page-hero h1,
html[data-theme="dark"] .kids-ui-redesign .kids-quick-card h3,
html[data-theme="dark"] .kids-ui-redesign .kids-highlight-card h3,
html[data-theme="dark"] .kids-ui-redesign .kids-mini-card h3,
html[data-theme="dark"] .kids-ui-redesign .kids-parent-card h3,
html[data-theme="dark"] .kids-ui-redesign .kids-step-card h3,
html[data-theme="dark"] .kids-ui-redesign .kids-test-card h2,
html[data-theme="dark"] .kids-ui-redesign .kids-game-card h2,
html[data-theme="dark"] .kids-ui-redesign .kids-certificate-path h2,
html[data-theme="dark"] .kids-ui-redesign .kids-feature-card h3,
html[data-theme="dark"] .kids-ui-redesign .kids-path-card h3,
html[data-theme="dark"] .kids-ui-redesign .journey-step strong,
html[data-theme="dark"] .kids-ui-redesign .kids-featured-banner h2 {
    color: #f8fafc;
}

html[data-theme="dark"] .kids-ui-redesign .kids-breadcrumbs,
html[data-theme="dark"] .kids-ui-redesign .kids-hero p,
html[data-theme="dark"] .kids-ui-redesign .kids-content-card p,
html[data-theme="dark"] .kids-ui-redesign .kids-content-card li,
html[data-theme="dark"] .kids-ui-redesign .kids-page-hero p,
html[data-theme="dark"] .kids-ui-redesign .kids-quick-card p,
html[data-theme="dark"] .kids-ui-redesign .kids-highlight-card p,
html[data-theme="dark"] .kids-ui-redesign .kids-mini-card p,
html[data-theme="dark"] .kids-ui-redesign .kids-parent-card p,
html[data-theme="dark"] .kids-ui-redesign .kids-step-card p,
html[data-theme="dark"] .kids-ui-redesign .kids-featured-banner p,
html[data-theme="dark"] .kids-ui-redesign .kids-progress-metric span,
html[data-theme="dark"] .kids-ui-redesign .kids-live-stat span,
html[data-theme="dark"] .kids-ui-redesign .journey-step small,
html[data-theme="dark"] .kids-ui-redesign .kids-card-link,
html[data-theme="dark"] .kids-ui-redesign .kids-top-note,
html[data-theme="dark"] .kids-ui-redesign .kids-page-badge small {
    color: #b7c7dd;
}

html[data-theme="dark"] .kids-ui-redesign .kids-card-icon,
html[data-theme="dark"] .kids-ui-redesign .kids-card-icon-badge,
html[data-theme="dark"] .kids-ui-redesign .kids-card-kicker .icon,
html[data-theme="dark"] .kids-ui-redesign .kids-featured-emoji {
    background: rgba(18, 31, 53, .92);
    box-shadow: inset 0 0 0 1px rgba(59, 79, 112, .85);
}

html[data-theme="dark"] .kids-ui-redesign .kids-quick-card,
html[data-theme="dark"] .kids-ui-redesign .kids-highlight-card,
html[data-theme="dark"] .kids-ui-redesign .kids-mini-card,
html[data-theme="dark"] .kids-ui-redesign .kids-parent-card,
html[data-theme="dark"] .kids-ui-redesign .kids-step-card,
html[data-theme="dark"] .kids-ui-redesign .kids-featured-banner,
html[data-theme="dark"] .kids-ui-redesign .kids-progress-metric,
html[data-theme="dark"] .kids-ui-redesign .kids-live-stat,
html[data-theme="dark"] .kids-ui-redesign .kids-personal-best,
html[data-theme="dark"] .kids-ui-redesign .kids-activity-item,
html[data-theme="dark"] .kids-ui-redesign .kids-page-badge,
html[data-theme="dark"] .kids-ui-redesign .kids-top-note,
html[data-theme="dark"] .kids-ui-redesign .kids-home-page .kids-stats-strip .kids-stat-card {
    background: rgba(14, 26, 45, .95);
    border-color: rgba(50, 68, 97, .95);
}

html[data-theme="dark"] .kids-ui-redesign .kids-featured-banner::before,
html[data-theme="dark"] .kids-ui-redesign .kids-home-action-grid > :nth-child(1)::before,
html[data-theme="dark"] .kids-ui-redesign .kids-home-action-grid > :nth-child(2)::before,
html[data-theme="dark"] .kids-ui-redesign .kids-home-action-grid > :nth-child(3)::before,
html[data-theme="dark"] .kids-ui-redesign .kids-home-action-grid > :nth-child(4)::before,
html[data-theme="dark"] .kids-ui-redesign .kids-home-action-grid > :nth-child(5)::before,
html[data-theme="dark"] .kids-ui-redesign .kids-home-action-grid > :nth-child(6)::before,
html[data-theme="dark"] .kids-ui-redesign .kids-highlight-grid > :nth-child(1)::before,
html[data-theme="dark"] .kids-ui-redesign .kids-highlight-grid > :nth-child(2)::before,
html[data-theme="dark"] .kids-ui-redesign .kids-highlight-grid > :nth-child(3)::before,
html[data-theme="dark"] .kids-ui-redesign .kids-highlight-grid > :nth-child(4)::before,
html[data-theme="dark"] .kids-ui-redesign .kids-mini-card-grid > :nth-child(1)::before,
html[data-theme="dark"] .kids-ui-redesign .kids-mini-card-grid > :nth-child(2)::before,
html[data-theme="dark"] .kids-ui-redesign .kids-mini-card-grid > :nth-child(3)::before,
html[data-theme="dark"] .kids-ui-redesign .kids-mini-card-grid > :nth-child(4)::before,
html[data-theme="dark"] .kids-ui-redesign .kids-certificate-steps > :nth-child(1)::before,
html[data-theme="dark"] .kids-ui-redesign .kids-certificate-steps > :nth-child(2)::before,
html[data-theme="dark"] .kids-ui-redesign .kids-certificate-steps > :nth-child(3)::before,
html[data-theme="dark"] .kids-ui-redesign .kids-certificate-steps > :nth-child(4)::before,
html[data-theme="dark"] .kids-ui-redesign .kids-parents-grid > :nth-child(1)::before,
html[data-theme="dark"] .kids-ui-redesign .kids-parents-grid > :nth-child(2)::before,
html[data-theme="dark"] .kids-ui-redesign .kids-parents-grid > :nth-child(3)::before,
html[data-theme="dark"] .kids-ui-redesign .kids-parents-grid > :nth-child(4)::before {
    background: linear-gradient(135deg, rgba(30,41,59,.62), rgba(15,23,42,.04));
}

html[data-theme="dark"] .kids-ui-redesign .kids-test-card:nth-child(4n+1),
html[data-theme="dark"] .kids-ui-redesign .kids-game-card:nth-child(4n+1),
html[data-theme="dark"] .kids-ui-redesign .kids-feature-card:nth-child(4n+1),
html[data-theme="dark"] .kids-ui-redesign .kids-certificate-path:nth-child(4n+1) { background: linear-gradient(135deg, rgba(14,28,50,.96), rgba(9,18,33,.96)); }
html[data-theme="dark"] .kids-ui-redesign .kids-test-card:nth-child(4n+2),
html[data-theme="dark"] .kids-ui-redesign .kids-game-card:nth-child(4n+2),
html[data-theme="dark"] .kids-ui-redesign .kids-feature-card:nth-child(4n+2),
html[data-theme="dark"] .kids-ui-redesign .kids-certificate-path:nth-child(4n+2) { background: linear-gradient(135deg, rgba(14,32,36,.96), rgba(7,18,24,.96)); }
html[data-theme="dark"] .kids-ui-redesign .kids-test-card:nth-child(4n+3),
html[data-theme="dark"] .kids-ui-redesign .kids-game-card:nth-child(4n+3),
html[data-theme="dark"] .kids-ui-redesign .kids-feature-card:nth-child(4n+3),
html[data-theme="dark"] .kids-ui-redesign .kids-certificate-path:nth-child(4n+3) { background: linear-gradient(135deg, rgba(37,18,41,.96), rgba(15,9,23,.96)); }
html[data-theme="dark"] .kids-ui-redesign .kids-test-card:nth-child(4n),
html[data-theme="dark"] .kids-ui-redesign .kids-game-card:nth-child(4n),
html[data-theme="dark"] .kids-ui-redesign .kids-feature-card:nth-child(4n),
html[data-theme="dark"] .kids-ui-redesign .kids-certificate-path:nth-child(4n) { background: linear-gradient(135deg, rgba(44,30,14,.96), rgba(22,15,8,.96)); }

@media (prefers-color-scheme: dark) {
    html[data-theme="system"] body.kids-ui-redesign {
        background:
            radial-gradient(circle at top left, rgba(37, 99, 235, .18), transparent 28%),
            radial-gradient(circle at top right, rgba(234, 179, 8, .10), transparent 24%),
            linear-gradient(180deg, #08111f 0%, #0b1322 35%, #0f172a 100%);
    }
}

@media (max-width: 1180px) {
    .kids-ui-redesign .kids-home-action-grid,
    .kids-ui-redesign .kids-highlight-grid,
    .kids-ui-redesign .kids-mini-card-grid,
    .kids-ui-redesign .kids-home-highlights,
    .kids-ui-redesign .kids-parents-grid,
    .kids-ui-redesign .kids-certificate-steps {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1050px) {
    .kids-ui-redesign .kids-app-grid {
        grid-template-columns: 1fr;
    }
    .kids-ui-redesign .kids-practice-card {
        order: 1;
    }
    .kids-ui-redesign .kids-lesson-sidebar {
        position: static;
        order: 2;
        max-height: none;
    }
    .kids-ui-redesign .kids-page-hero,
    .kids-ui-redesign .kids-featured-banner {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {
    .kids-ui-redesign .kids-shell {
        width: min(100%, calc(100% - 20px));
        padding-top: 18px;
    }
    .kids-ui-redesign .kids-hero {
        padding: 22px;
        border-radius: 26px;
    }
    .kids-ui-redesign .kids-home-action-grid,
    .kids-ui-redesign .kids-highlight-grid,
    .kids-ui-redesign .kids-mini-card-grid,
    .kids-ui-redesign .kids-home-highlights,
    .kids-ui-redesign .kids-parents-grid,
    .kids-ui-redesign .kids-certificate-steps {
        grid-template-columns: 1fr;
    }
    .kids-ui-redesign .kids-quick-card h3,
    .kids-ui-redesign .kids-highlight-card h3,
    .kids-ui-redesign .kids-mini-card h3,
    .kids-ui-redesign .kids-parent-card h3,
    .kids-ui-redesign .kids-step-card h3,
    .kids-ui-redesign .kids-featured-banner h2 {
        font-size: 23px;
    }
    .kids-ui-redesign .kids-page-hero {
        padding: 22px;
        border-radius: 24px;
    }
}

@media (max-height: 850px) and (max-width: 1100px) {
    .kids-ui-redesign .kids-page-hero,
    .kids-ui-redesign .kids-hero,
    .kids-ui-redesign .kids-content-card {
        padding-top: 20px;
        padding-bottom: 20px;
    }
    .kids-ui-redesign .kids-shell {
        padding-top: 16px;
    }
}


/* ==========================================================
   v17.10.74 LESSON-FIRST KIDS EXPERIENCE
   Put active typing before browsing/category cards.
========================================================== */
.kids-lessons-page .kids-lessons-priority-hero{
    grid-template-columns:minmax(0,1fr) auto;
    margin-bottom:14px;
    padding:18px 24px;
    border-radius:22px;
}
.kids-lessons-page .kids-lessons-priority-hero h1{
    margin:3px 0 5px;
    font-size:clamp(28px,3.4vw,42px);
}
.kids-lessons-page .kids-lessons-priority-hero p{
    max-width:820px;
    margin:0;
    font-size:14px;
    line-height:1.5;
}
.kids-lessons-page .kids-lessons-priority-hero .kids-eyebrow{
    padding:5px 9px;
    font-size:11px;
}
.kids-lessons-page .kids-lessons-priority-hero .kids-page-badge{
    min-width:148px;
    padding:11px 14px;
    border-radius:17px;
    font-size:13px;
}
.kids-lessons-page .kids-lessons-priority-hero .kids-page-badge small{
    margin-top:3px;
    font-size:10px;
}

.kids-lessons-page .kids-lessons-priority-workspace{
    margin-top:0;
    align-items:start;
}
.kids-lessons-page .kids-lessons-priority-workspace .kids-practice-card{
    box-shadow:0 18px 46px rgba(15,23,42,.09);
}
.kids-lessons-page .kids-lessons-priority-workspace .kids-practice-head{
    padding:16px 20px;
}
.kids-lessons-page .kids-lessons-priority-workspace .kids-practice-head h1,
.kids-lessons-page .kids-lessons-priority-workspace .kids-practice-head h2{
    margin-top:5px;
    font-size:clamp(25px,2.7vw,34px);
}
.kids-lessons-page .kids-lessons-priority-workspace .kids-practice-head p{
    margin-top:4px;
    font-size:13px;
}
.kids-lessons-page .kids-lessons-priority-workspace .kids-live-stats{
    padding:10px 14px;
}
.kids-lessons-page .kids-lessons-priority-workspace .kids-live-stat{
    padding:8px 10px;
}
.kids-lessons-page .kids-lessons-priority-workspace .kids-text-area{
    min-height:190px;
    padding:20px 22px;
}
.kids-lessons-page .kids-lessons-priority-workspace .kids-keyboard-wrap{
    padding:12px 14px 10px;
}
.kids-lessons-page .kids-lessons-priority-workspace .kids-hand-guide-controls{
    padding-top:7px;
}

.kids-lessons-page .kids-lessons-browse-below{
    margin-top:22px;
    padding-top:4px;
}
.kids-lessons-page .kids-lessons-browse-below::before{
    content:"Browse lesson groups";
    grid-column:1/-1;
    display:block;
    margin-bottom:-4px;
    color:#405675;
    font-size:13px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
}

/* On shorter screens, trim every non-practice pixel before the lesson. */
@media (max-height:900px){
    .kids-lessons-page .kids-shell{padding-top:10px}
    .kids-lessons-page .kids-breadcrumbs{margin-bottom:9px;font-size:11px}
    .kids-lessons-page .kids-lessons-priority-hero{padding:12px 18px;margin-bottom:10px}
    .kids-lessons-page .kids-lessons-priority-hero h1{font-size:28px;margin:1px 0 2px}
    .kids-lessons-page .kids-lessons-priority-hero p{font-size:12px;line-height:1.35}
    .kids-lessons-page .kids-lessons-priority-hero .kids-page-badge{padding:8px 11px}
    .kids-lessons-page .kids-lessons-priority-workspace .kids-practice-head{padding:12px 16px}
    .kids-lessons-page .kids-lessons-priority-workspace .kids-live-stats{padding:7px 10px}
    .kids-lessons-page .kids-lessons-priority-workspace .kids-text-area{min-height:155px;padding:14px 18px}
    .kids-lessons-page .kids-lessons-priority-workspace .kids-keyboard-wrap{padding-top:8px}
}

@media (max-width:1050px){
    .kids-lessons-page .kids-lessons-priority-workspace{
        display:flex;
        flex-direction:column;
    }
    .kids-lessons-page .kids-lessons-priority-workspace .kids-practice-card{order:1;width:100%}
    .kids-lessons-page .kids-lessons-priority-workspace .kids-lesson-sidebar{order:2;width:100%;margin-top:16px}
}

@media (max-width:720px){
    .kids-lessons-page .kids-lessons-priority-hero{
        grid-template-columns:1fr;
        padding:14px 16px;
    }
    .kids-lessons-page .kids-lessons-priority-hero .kids-page-badge{display:none}
    .kids-lessons-page .kids-lessons-priority-workspace .kids-text-area{min-height:145px;padding:14px 12px}
    .kids-lessons-page .kids-lessons-browse-below{margin-top:18px}
}

/* ==========================================================
   v17.10.75 SINGLE-HERO + DETAIL WORKSPACE POLISH
========================================================== */

/* Directory/dashboard pages use their original SEO intro as the one hero.
   This removes the duplicated title/intro block added in v17.10.73. */
.kids-ui-redesign .kids-directory-hero{
  position:relative;
  min-height:0;
  margin-top:0;
  padding:26px 150px 26px 30px;
  border-radius:26px;
  overflow:hidden;
}
.kids-ui-redesign .kids-directory-hero::before{
  height:5px;
  background:linear-gradient(90deg,#2563eb,#7c3aed,#f59e0b)
}
.kids-ui-redesign .kids-directory-hero::after{
  position:absolute;
  right:34px;
  top:50%;
  z-index:0;
  display:grid;
  place-items:center;
  width:82px;
  height:82px;
  border-radius:24px;
  transform:translateY(-50%);
  background:linear-gradient(135deg,rgba(219,234,254,.95),rgba(237,233,254,.95));
  border:1px solid rgba(191,213,255,.9);
  box-shadow:0 14px 28px rgba(37,99,235,.12);
  font-size:42px;
  line-height:1;
}
.kids-ui-redesign.kids-tests-page .kids-directory-hero::after{content:"⏱️"}
.kids-ui-redesign.kids-games-page .kids-directory-hero::after{content:"🎮"}
.kids-ui-redesign.kids-rewards-page .kids-directory-hero::after{content:"⭐"}
.kids-ui-redesign.kids-progress-page .kids-directory-hero::after{content:"📊"}
.kids-ui-redesign.kids-certificates-page .kids-directory-hero::after{content:"🏆"}
.kids-ui-redesign.kids-parents-page .kids-directory-hero::after{content:"👨‍👩‍👧‍👦";font-size:32px}
.kids-ui-redesign .kids-directory-hero h1{
  max-width:820px;
  margin:8px 0 9px;
  font-size:clamp(32px,4vw,48px);
  line-height:1.06;
}
.kids-ui-redesign .kids-directory-hero>p{
  max-width:850px;
  margin-bottom:0;
  font-size:16px;
  line-height:1.65;
}
.kids-ui-redesign .kids-directory-hero .kids-progress-overview{
  margin-top:18px;
}

/* Keep featured cards close to the title instead of creating a second
   full-width presentation band. */
.kids-ui-redesign .kids-directory-hero + .kids-highlight-grid,
.kids-ui-redesign .kids-directory-hero + .kids-top-note,
.kids-ui-redesign .kids-directory-hero + .kids-certificate-steps,
.kids-ui-redesign .kids-directory-hero + .kids-parents-grid{
  margin-top:20px;
}

/* Actual Kids test/game detail pages already had the right workspace.
   Polish that workspace directly instead of adding another hero. */
.kids-ui-redesign.kids-test-detail-page .kids-practice-card,
.kids-ui-redesign.kids-game-detail-page .kids-practice-card{
  position:relative;
  border-radius:26px;
  overflow:hidden;
  box-shadow:0 20px 46px rgba(15,23,42,.10);
}
.kids-ui-redesign.kids-test-detail-page .kids-practice-head,
.kids-ui-redesign.kids-game-detail-page .kids-practice-head{
  position:relative;
  min-height:112px;
  padding:20px 112px 18px 24px;
  background:linear-gradient(135deg,#f7fbff,#f5f3ff 64%,#fff8ed);
}
.kids-ui-redesign.kids-test-detail-page .kids-practice-head::after,
.kids-ui-redesign.kids-game-detail-page .kids-practice-head::after{
  position:absolute;
  right:24px;
  top:50%;
  display:grid;
  place-items:center;
  width:66px;
  height:66px;
  transform:translateY(-50%);
  border-radius:20px;
  background:rgba(255,255,255,.82);
  border:1px solid #d7e4f7;
  box-shadow:0 12px 26px rgba(30,64,175,.12);
  font-size:34px;
}
.kids-ui-redesign.kids-test-detail-page .kids-practice-head::after{content:"⏱️"}
.kids-ui-redesign.kids-game-detail-page .kids-practice-head::after{content:"🎮"}
.kids-ui-redesign.kids-test-detail-page .kids-practice-head h1,
.kids-ui-redesign.kids-game-detail-page .kids-practice-head h1{
  margin:7px 0 7px;
  font-size:clamp(27px,3.2vw,38px);
  line-height:1.08;
}
.kids-ui-redesign.kids-test-detail-page .kids-practice-head p,
.kids-ui-redesign.kids-game-detail-page .kids-practice-head p{
  max-width:720px;
  margin-bottom:0;
  color:#52627a;
}
.kids-ui-redesign.kids-game-detail-page .kids-practice-head .kids-button{
  position:relative;
  z-index:2;
}
.kids-ui-redesign.kids-test-detail-page .kids-side-card{
  border-radius:24px;
  background:linear-gradient(180deg,#fbfdff,#f6f9ff);
}
.kids-ui-redesign.kids-game-detail-page .kids-game-stage{
  border-radius:22px;
  border:1px solid #d8e5f6;
}

html[data-theme="dark"] .kids-ui-redesign .kids-directory-hero::after,
html[data-theme="dark"] .kids-ui-redesign.kids-test-detail-page .kids-practice-head::after,
html[data-theme="dark"] .kids-ui-redesign.kids-game-detail-page .kids-practice-head::after{
  background:linear-gradient(135deg,#17233a,#111b2d);
  border-color:#344967;
  box-shadow:0 14px 28px rgba(0,0,0,.32)
}
html[data-theme="dark"] .kids-ui-redesign.kids-test-detail-page .kids-practice-head,
html[data-theme="dark"] .kids-ui-redesign.kids-game-detail-page .kids-practice-head,
html[data-theme="dark"] .kids-ui-redesign.kids-test-detail-page .kids-side-card{
  background:linear-gradient(135deg,#111c30,#12192a 64%,#211a12);
  border-color:#30425e
}
html[data-theme="dark"] .kids-ui-redesign.kids-test-detail-page .kids-practice-head p,
html[data-theme="dark"] .kids-ui-redesign.kids-game-detail-page .kids-practice-head p{
  color:#c4d2e6
}

@media(prefers-color-scheme:dark){
  html[data-theme="system"] .kids-ui-redesign .kids-directory-hero::after,
  html[data-theme="system"] .kids-ui-redesign.kids-test-detail-page .kids-practice-head::after,
  html[data-theme="system"] .kids-ui-redesign.kids-game-detail-page .kids-practice-head::after{
    background:linear-gradient(135deg,#17233a,#111b2d);
    border-color:#344967;
    box-shadow:0 14px 28px rgba(0,0,0,.32)
  }
  html[data-theme="system"] .kids-ui-redesign.kids-test-detail-page .kids-practice-head,
  html[data-theme="system"] .kids-ui-redesign.kids-game-detail-page .kids-practice-head,
  html[data-theme="system"] .kids-ui-redesign.kids-test-detail-page .kids-side-card{
    background:linear-gradient(135deg,#111c30,#12192a 64%,#211a12);
    border-color:#30425e
  }
  html[data-theme="system"] .kids-ui-redesign.kids-test-detail-page .kids-practice-head p,
  html[data-theme="system"] .kids-ui-redesign.kids-game-detail-page .kids-practice-head p{color:#c4d2e6}
}

@media(max-width:720px){
  .kids-ui-redesign .kids-directory-hero{padding:22px}
  .kids-ui-redesign .kids-directory-hero::after{display:none}
  .kids-ui-redesign.kids-test-detail-page .kids-practice-head,
  .kids-ui-redesign.kids-game-detail-page .kids-practice-head{
    min-height:0;
    padding:18px 20px
  }
  .kids-ui-redesign.kids-test-detail-page .kids-practice-head::after,
  .kids-ui-redesign.kids-game-detail-page .kids-practice-head::after{display:none}
}

@media(max-height:850px) and (min-width:721px){
  .kids-ui-redesign .kids-directory-hero{padding-top:20px;padding-bottom:20px}
  .kids-ui-redesign.kids-test-detail-page .kids-practice-head,
  .kids-ui-redesign.kids-game-detail-page .kids-practice-head{min-height:96px;padding-top:16px;padding-bottom:14px}
}

/* ==========================================================
   v17.10.76 KIDS TESTS — THREE VISIBLE TYPING ROWS
========================================================== */
.kids-ui-redesign.kids-test-detail-page .kids-text-area{
  --kids-test-visible-lines:3;
  --kids-test-line-height:1.55;
  display:block;
  min-height:214px;
  height:214px;
  max-height:214px;
  height:calc(var(--kids-test-visible-lines) * var(--kids-test-line-height) * 1em + 36px);
  min-height:calc(var(--kids-test-visible-lines) * var(--kids-test-line-height) * 1em + 36px);
  max-height:calc(var(--kids-test-visible-lines) * var(--kids-test-line-height) * 1em + 36px);
  padding:18px 22px;
  overflow-x:hidden;
  overflow-y:hidden;
  scroll-behavior:auto;
  scrollbar-width:none;
  background:var(--surface,#fff)
}
.kids-ui-redesign.kids-test-detail-page .kids-text-area::-webkit-scrollbar{display:none}
.kids-ui-redesign.kids-test-detail-page .kids-text{
  position:relative;
  width:100%;
  margin:0;
  font-size:clamp(28px,2.7vw,38px);
  line-height:var(--kids-test-line-height);
  letter-spacing:.04em;
  text-align:left;
  overflow-wrap:normal;
  word-break:normal
}
.kids-ui-redesign.kids-test-detail-page .kids-char{
  white-space:pre-wrap
}

/* On typical laptop widths this keeps the passage to approximately three
   comfortable rows and gets the keyboard into view much sooner. */
@media(max-width:1180px){
  .kids-ui-redesign.kids-test-detail-page .kids-text-area{
    --kids-test-line-height:1.52;
    height:190px;
    min-height:190px;
    max-height:190px;
    height:calc(var(--kids-test-visible-lines) * var(--kids-test-line-height) * 1em + 32px);
    min-height:calc(var(--kids-test-visible-lines) * var(--kids-test-line-height) * 1em + 32px);
    max-height:calc(var(--kids-test-visible-lines) * var(--kids-test-line-height) * 1em + 32px);
    padding:16px 18px
  }
  .kids-ui-redesign.kids-test-detail-page .kids-text{
    font-size:clamp(25px,2.8vw,34px);
    line-height:var(--kids-test-line-height)
  }
}

@media(max-width:720px){
  .kids-ui-redesign.kids-test-detail-page .kids-text-area{
    --kids-test-line-height:1.48;
    height:158px;
    min-height:158px;
    max-height:158px;
    height:calc(var(--kids-test-visible-lines) * var(--kids-test-line-height) * 1em + 28px);
    min-height:calc(var(--kids-test-visible-lines) * var(--kids-test-line-height) * 1em + 28px);
    max-height:calc(var(--kids-test-visible-lines) * var(--kids-test-line-height) * 1em + 28px);
    padding:14px 14px
  }
  .kids-ui-redesign.kids-test-detail-page .kids-text{
    font-size:clamp(22px,6vw,29px);
    line-height:var(--kids-test-line-height);
    letter-spacing:.025em
  }
}

@media(max-height:820px) and (min-width:721px){
  .kids-ui-redesign.kids-test-detail-page .kids-text-area{
    --kids-test-line-height:1.48;
    height:170px;
    min-height:170px;
    max-height:170px;
    height:calc(var(--kids-test-visible-lines) * var(--kids-test-line-height) * 1em + 28px);
    min-height:calc(var(--kids-test-visible-lines) * var(--kids-test-line-height) * 1em + 28px);
    max-height:calc(var(--kids-test-visible-lines) * var(--kids-test-line-height) * 1em + 28px);
    padding-top:14px;
    padding-bottom:14px
  }
  .kids-ui-redesign.kids-test-detail-page .kids-text{
    font-size:clamp(25px,2.5vw,32px);
    line-height:var(--kids-test-line-height)
  }
}

/* ==========================================================
   v17.10.79 KIDS TESTS — EXACTLY THREE COMPLETE ROWS
   Fixes the previous em-based viewport calculation which used the
   container font size instead of the large typing-text font size.
========================================================== */
.kids-ui-redesign.kids-test-detail-page .kids-text-area{
  box-sizing:border-box;
  height:214px;
  min-height:214px;
  max-height:214px;
  padding:18px 22px;
  overflow:hidden;
}

@media(max-width:1180px){
  .kids-ui-redesign.kids-test-detail-page .kids-text-area{
    height:190px;
    min-height:190px;
    max-height:190px;
    padding:16px 18px;
  }
}

@media(max-width:720px){
  .kids-ui-redesign.kids-test-detail-page .kids-text-area{
    height:158px;
    min-height:158px;
    max-height:158px;
    padding:14px;
  }
}

@media(max-height:820px) and (min-width:721px){
  .kids-ui-redesign.kids-test-detail-page .kids-text-area{
    height:170px;
    min-height:170px;
    max-height:170px;
    padding-top:14px;
    padding-bottom:14px;
  }
}

/* The green test progress bar sits after the full viewport instead of
   visually clipping the third line. */
.kids-ui-redesign.kids-test-detail-page .kids-progress-track{
  position:relative;
  z-index:2;
  margin-top:0;
  flex:0 0 auto;
}

/* ==========================================================
   v17.10.80 KIDS STICKY SUBNAV POLISH
   Keep the small Kids navigation available after the global
   header scrolls away, while preserving maximum activity space.
========================================================== */
.kids-ui-redesign .kids-subnav{
  position:sticky;
  top:0;
  z-index:85;
  padding-top:7px;
  padding-bottom:7px;
  background:rgba(255,255,255,.96);
  border-bottom:1px solid rgba(188,205,230,.95);
  box-shadow:0 8px 22px rgba(15,23,42,.08);
  -webkit-backdrop-filter:blur(16px) saturate(160%);
  backdrop-filter:blur(16px) saturate(160%);
}
.kids-ui-redesign .kids-subnav a{
  padding-top:7px;
  padding-bottom:7px;
  min-height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

html[data-theme="dark"] .kids-ui-redesign .kids-subnav{
  background:rgba(8,17,31,.97);
  border-bottom-color:rgba(48,66,94,.98);
  box-shadow:0 9px 24px rgba(0,0,0,.34);
}

@media(prefers-color-scheme:dark){
  html[data-theme="system"] .kids-ui-redesign .kids-subnav{
    background:rgba(8,17,31,.97);
    border-bottom-color:rgba(48,66,94,.98);
    box-shadow:0 9px 24px rgba(0,0,0,.34);
  }
}

@media(max-width:720px){
  .kids-ui-redesign .kids-subnav{
    gap:6px;
    padding-top:6px;
    padding-bottom:6px;
  }
  .kids-ui-redesign .kids-subnav a{
    min-height:32px;
    padding:6px 11px;
    font-size:12px;
  }
}
