/* Source: /css/universal-site-header-v17.7.2.css */
/* ==========================================================
   TypingTutor.Online — Universal Site Header v17.7.2
   One complete header for tutor, tests, games, kids, blog,
   certificates, information pages, sitemap, and 404.
========================================================== */

#header,
.test-site-header {
    box-sizing: border-box !important;
    position: relative;
    z-index: 1000;
    width: 100%;
    min-height: 80px;
    padding: max(9px, env(safe-area-inset-top)) 0 9px;
    background: var(--surface, #ffffff);
    border-bottom: 1px solid var(--border, #dbe4f0);
    box-shadow: 0 2px 10px rgba(15, 23, 42, .06);
}

#header .header-inner,
.test-header-inner {
    box-sizing: border-box;
    width: min(1660px, calc(100% - 34px));
    min-height: 60px;
    margin-inline: auto;
    padding: 0;
    display: grid;
    grid-template-columns: minmax(235px, 300px) minmax(0, 1fr) auto;
    gap: clamp(10px, 1.4vw, 24px);
    align-items: center;
}

#header .logo,
.test-logo {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-self: start;
    color: inherit;
    text-decoration: none;
}

#header .site-logo-picture,
.test-logo-stack {
    position: relative;
    display: grid;
    width: min(280px, 100%);
    min-width: 0;
}

#header .site-logo-picture,
#header .site-logo-picture-light,
#header .site-logo-picture-dark,
.test-logo-stack > img {
    grid-area: 1 / 1;
}

#header .site-logo-image,
.test-logo img {
    display: block;
    width: min(280px, 100%);
    height: auto;
    max-height: 60px;
    object-fit: contain;
    object-position: left center;
}

#header .site-logo-picture-dark,
.test-logo-dark {
    display: none !important;
}

html[data-theme="dark"] #header .site-logo-picture-light,
html[data-theme="dark"] .test-logo-light {
    display: none !important;
}

html[data-theme="dark"] #header .site-logo-picture-dark,
html[data-theme="dark"] .test-logo-dark {
    display: block !important;
}

#header .primary-mode-navigation,
.test-nav {
    min-width: 0;
    width: 100%;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(2px, .72vw, 12px);
    overflow: visible;
}

#header #modeSwitcher,
#header .mode-switcher-inner,
#header .mode-navigation {
    min-width: 0;
    width: auto;
}

#header .mode-navigation {
    display: flex;
    align-items: center;
    gap: clamp(2px, .72vw, 12px);
}

#header .mode-switcher-heading {
    display: none !important;
}

#header .lesson-home-nav-button,
#header .mode-navigation > .mode-button,
#header .mode-more > summary.mode-button,
.test-nav > a,
.test-nav-more > summary {
    box-sizing: border-box;
    min-width: 0;
    min-height: 48px;
    margin: 0;
    padding: 10px clamp(9px, .78vw, 15px);
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: var(--text, #172235);
    background: transparent;
    border: 1px solid transparent;
    border-radius: 12px;
    font: inherit;
    font-size: clamp(12px, .84vw, 15px);
    font-weight: 750;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition: color .16s ease, background-color .16s ease,
        border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

#header .mode-button-icon,
#header .lesson-home-nav-icon,
.test-nav .mode-button-icon,
.test-nav-more-menu .mode-button-icon {
    display: inline-flex;
    flex: 0 0 22px;
    width: 22px;
    min-width: 22px;
    height: 22px;
    align-items: center;
    justify-content: center;
    font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif;
    font-size: 19px;
    font-weight: 400;
    line-height: 22px;
    text-align: center;
}

#header .mode-button-text,
#header .lesson-home-nav-label,
.test-nav .mode-button-text {
    display: inline-flex;
    align-items: center;
    line-height: 1;
}

#header .lesson-home-nav-button:hover,
#header .mode-navigation > .mode-button:hover,
#header .mode-more > summary.mode-button:hover,
.test-nav > a:hover,
.test-nav-more > summary:hover,
.test-nav-more[open] > summary {
    color: var(--primary, #1769ff);
    background: var(--surface-alt, #f2f7ff);
    border-color: #dbe8fa;
}

#header .lesson-home-nav-button-active,
#header .mode-navigation > .mode-button-active,
#header .mode-more.mode-more-active > summary,
.test-nav > a[aria-current="page"],
.test-nav > a.mode-button-active,
.test-nav-more.mode-more-active > summary {
    color: #ffffff !important;
    background: linear-gradient(135deg, #246df0, #285ee5) !important;
    border-color: rgba(31, 92, 222, .58) !important;
    box-shadow: 0 10px 24px rgba(47, 103, 246, .24) !important;
}

#header .header-tools,
.test-header-inner > #themeButton {
    justify-self: end;
}

#header #themeButton,
.test-header-inner > #themeButton {
    box-sizing: border-box;
    min-width: 116px;
    min-height: 48px;
    margin: 0;
    padding: 10px 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #ffffff;
    background: linear-gradient(135deg, #246df0, #285ee5);
    border: 0;
    border-radius: 12px;
    font: inherit;
    font-size: clamp(12px, .84vw, 15px);
    font-weight: 750;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    box-shadow: 0 8px 20px rgba(47, 103, 246, .20);
}

#header #themeButton > span:first-child,
.test-header-inner > #themeButton > span:first-child {
    display: inline-flex;
    flex: 0 0 22px;
    width: 22px;
    height: 22px;
    align-items: center;
    justify-content: center;
    font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif;
    font-size: 19px;
    line-height: 22px;
}

.theme-button-arrow,
.mode-more-chevron {
    font-size: 10px;
    opacity: .8;
}

#header .mode-more,
.test-nav-more {
    position: relative;
    flex: 0 0 auto;
}

#header .mode-more > summary,
.test-nav-more > summary {
    list-style: none;
}

#header .mode-more > summary::-webkit-details-marker,
.test-nav-more > summary::-webkit-details-marker {
    display: none;
}

#header .mode-more-menu,
.test-nav-more-menu {
    box-sizing: border-box;
    position: absolute;
    z-index: 1200;
    top: calc(100% + 10px);
    right: 0;
    width: 244px;
    padding: 8px;
    display: none;
    gap: 4px;
    background: var(--surface-elevated, #ffffff);
    border: 1px solid var(--border, #dbe4f0);
    border-radius: 14px;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .18);
}

#header .mode-more[open] .mode-more-menu,
.test-nav-more[open] .test-nav-more-menu {
    display: grid;
}

#header .mode-more-menu .mode-button,
.test-nav-more-menu a,
.test-nav-more-menu button {
    box-sizing: border-box;
    width: 100%;
    min-height: 44px;
    padding: 10px 12px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    color: var(--text, #172235);
    background: transparent;
    border: 1px solid transparent;
    border-radius: 10px;
    font: inherit;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
}

#header .mode-more-menu .mode-button:hover,
.test-nav-more-menu a:hover,
.test-nav-more-menu button:hover,
.test-nav-more-menu a[aria-current="page"] {
    color: var(--primary, #1769ff);
    background: var(--surface-alt, #f2f7ff);
    border-color: var(--border, #dbe4f0);
}

/* Theme chooser: included here so simple information pages match the app. */
.theme-menu {
    position: fixed;
    z-index: 10050;
    width: 250px;
    padding: 8px;
    background: var(--surface-elevated, #ffffff);
    border: 1px solid var(--border, #dbe4f0);
    border-radius: 14px;
    box-shadow: 0 18px 45px rgba(15, 23, 42, .22);
}
.theme-menu.hidden { display: none !important; }
.theme-option {
    display: grid;
    grid-template-columns: 36px 1fr 22px;
    gap: 10px;
    align-items: center;
    width: 100%;
    padding: 10px;
    color: var(--text, #172235);
    text-align: left;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 10px;
    cursor: pointer;
}
.theme-option:hover,
.theme-option:focus-visible {
    background: var(--surface-alt, #f2f7ff);
    border-color: var(--border, #dbe4f0);
    outline: none;
}
.theme-option-icon {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    background: var(--surface-alt, #f2f7ff);
    border-radius: 9px;
    font-size: 18px;
}
.theme-option-copy { display: grid; gap: 2px; }
.theme-option-copy strong { color: var(--text, #172235); font-size: 13px; }
.theme-option-copy small { color: var(--text-light, #718096); font-size: 10px; }
.theme-option-check { color: var(--primary, #1769ff); font-weight: 900; opacity: 0; }
.theme-option-selected { background: var(--primary-light, #edf4ff); border-color: var(--border, #dbe4f0); }
.theme-option-selected .theme-option-check { opacity: 1; }

html[data-theme="dark"] #header,
html[data-theme="dark"] .test-site-header {
    background: #101b2e;
    border-color: #40516a;
}
html[data-theme="dark"] #header .lesson-home-nav-button,
html[data-theme="dark"] #header .mode-navigation > .mode-button,
html[data-theme="dark"] #header .mode-more > summary.mode-button,
html[data-theme="dark"] .test-nav > a,
html[data-theme="dark"] .test-nav-more > summary,
html[data-theme="dark"] #header .mode-more-menu .mode-button,
html[data-theme="dark"] .test-nav-more-menu a,
html[data-theme="dark"] .test-nav-more-menu button {
    color: #dce7f7;
}
html[data-theme="dark"] #header .mode-more-menu,
html[data-theme="dark"] .test-nav-more-menu,
html[data-theme="dark"] .theme-menu {
    background: #101b2e;
    border-color: #40516a;
}
html[data-theme="dark"] .theme-option,
html[data-theme="dark"] .theme-option-copy strong { color: #e7eef9; }
html[data-theme="dark"] .theme-option-copy small { color: #9aabc2; }
html[data-theme="dark"] .theme-option-icon,
html[data-theme="dark"] .theme-option:hover,
html[data-theme="dark"] .theme-option:focus-visible,
html[data-theme="dark"] #header .mode-more-menu .mode-button:hover,
html[data-theme="dark"] .test-nav-more-menu a:hover,
html[data-theme="dark"] .test-nav-more-menu button:hover {
    background: #17263c;
    border-color: #304662;
}

@media (prefers-color-scheme: dark) {
    html[data-theme="system"] #header,
    html[data-theme="system"] .test-site-header {
        background: #101b2e;
        border-color: #40516a;
    }
    html[data-theme="system"] #header .site-logo-picture-light,
    html[data-theme="system"] .test-logo-light { display: none !important; }
    html[data-theme="system"] #header .site-logo-picture-dark,
    html[data-theme="system"] .test-logo-dark { display: block !important; }
    html[data-theme="system"] #header .lesson-home-nav-button,
    html[data-theme="system"] #header .mode-navigation > .mode-button,
    html[data-theme="system"] #header .mode-more > summary.mode-button,
    html[data-theme="system"] .test-nav > a,
    html[data-theme="system"] .test-nav-more > summary,
    html[data-theme="system"] #header .mode-more-menu .mode-button,
    html[data-theme="system"] .test-nav-more-menu a,
    html[data-theme="system"] .test-nav-more-menu button { color: #dce7f7; }
    html[data-theme="system"] #header .mode-more-menu,
    html[data-theme="system"] .test-nav-more-menu,
    html[data-theme="system"] .theme-menu {
        background: #101b2e;
        border-color: #40516a;
    }
}

@media (max-width: 1360px) {
    #header .header-inner,
    .test-header-inner {
        grid-template-columns: minmax(205px, 235px) minmax(0, 1fr) auto;
        gap: 8px;
    }
    #header .site-logo-picture,
    #header .site-logo-image,
    .test-logo-stack,
    .test-logo img { width: min(235px, 100%); }
    #header .lesson-home-nav-button,
    #header .mode-navigation > .mode-button,
    #header .mode-more > summary.mode-button,
    .test-nav > a,
    .test-nav-more > summary {
        min-height: 44px;
        padding-inline: 8px;
        gap: 6px;
        font-size: 12px;
    }
    #header #themeButton,
    .test-header-inner > #themeButton {
        min-width: 104px;
        min-height: 44px;
        padding-inline: 11px;
        font-size: 12px;
    }
}

@media (max-width: 1040px) {
    #header,
    .test-site-header {
        min-height: 0;
        padding-top: max(7px, env(safe-area-inset-top));
        padding-bottom: 7px;
    }
    #header .header-inner,
    .test-header-inner {
        width: min(100% - 22px, 1660px);
        min-height: 0;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 8px 12px;
    }
    #header .primary-mode-navigation,
    .test-nav {
        grid-column: 1 / -1;
        grid-row: 2;
        width: 100%;
        justify-content: flex-start;
        overflow-x: auto;
        overflow-y: visible;
        padding: 2px 0 3px;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }
    #header .primary-mode-navigation::-webkit-scrollbar,
    .test-nav::-webkit-scrollbar { display: none; }
    #header .header-tools,
    .test-header-inner > #themeButton { grid-column: 2; grid-row: 1; }
    .test-logo { grid-column: 1; grid-row: 1; }
}

@media (max-width: 590px) {
    #header .header-inner,
    .test-header-inner { width: min(100% - 14px, 1660px); }
    #header .site-logo-picture,
    #header .site-logo-image,
    .test-logo-stack,
    .test-logo img { width: min(190px, 100%); }
    #header .lesson-home-nav-button,
    #header .mode-navigation > .mode-button,
    #header .mode-more > summary.mode-button,
    .test-nav > a,
    .test-nav-more > summary {
        min-width: 68px;
        min-height: 44px;
        padding: 7px 8px;
        flex-direction: column;
        gap: 3px;
        font-size: 9px;
    }
    #header .mode-more-chevron,
    .test-nav-more .mode-more-chevron { display: none; }
    #header #themeButton,
    .test-header-inner > #themeButton {
        min-width: 48px;
        min-height: 42px;
        padding: 8px 10px;
    }
    #header #themeButton > span:nth-child(2),
    #header #themeButton > span:last-child,
    .test-header-inner > #themeButton > span:nth-child(2),
    .test-header-inner > #themeButton > span:last-child { display: none; }
}

/* ==========================================================
   v17.10.182 — Reliable mobile More menu
   Explicit JS toggling + fixed viewport panel prevents the menu from
   opening outside the horizontally scrolling navigation in Chrome mobile.
========================================================== */
@media (max-width: 1040px), (pointer: coarse) {
    #header .mode-more-menu,
    .test-nav-more-menu {
        position: fixed !important;
        z-index: 10050 !important;
        top: var(--site-more-top, 118px) !important;
        right: 12px !important;
        bottom: auto !important;
        left: 12px !important;
        width: auto !important;
        max-width: none !important;
        max-height: min(var(--site-more-max-height, 70vh), 480px) !important;
        margin: 0 !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
        border-radius: 16px;
        box-shadow: 0 20px 52px rgba(15, 23, 42, .24);
    }

    #header .mode-more[open] > summary.mode-button,
    .test-nav-more[open] > summary {
        color: var(--primary, #1769ff);
        background: var(--surface-alt, #f2f7ff);
        border-color: var(--border, #dbe4f0);
    }
}

/* v17.10.327: readable hover, open and keyboard-focus states in both dark modes. */
html[data-theme="dark"] #header .lesson-home-nav-button:is(:hover,:focus-visible),
html[data-theme="dark"] #header .mode-navigation > .mode-button:is(:hover,:focus-visible),
html[data-theme="dark"] #header .mode-more > summary.mode-button:is(:hover,:focus-visible),
html[data-theme="dark"] #header .mode-more[open] > summary.mode-button,
html[data-theme="dark"] .test-nav > a:is(:hover,:focus-visible),
html[data-theme="dark"] .test-nav-more > summary:is(:hover,:focus-visible),
html[data-theme="dark"] .test-nav-more[open] > summary,
html[data-theme="dark"] #header .mode-more-menu .mode-button:is(:hover,:focus-visible),
html[data-theme="dark"] .test-nav-more-menu a:is(:hover,:focus-visible),
html[data-theme="dark"] .test-nav-more-menu button:is(:hover,:focus-visible) {
    color: #e7eef9;
    background: #213a5f;
    border-color: #526d91;
    text-decoration: none;
}
@media (prefers-color-scheme: dark) {
html[data-theme="system"] #header .lesson-home-nav-button:is(:hover,:focus-visible),
html[data-theme="system"] #header .mode-navigation > .mode-button:is(:hover,:focus-visible),
html[data-theme="system"] #header .mode-more > summary.mode-button:is(:hover,:focus-visible),
html[data-theme="system"] #header .mode-more[open] > summary.mode-button,
html[data-theme="system"] .test-nav > a:is(:hover,:focus-visible),
html[data-theme="system"] .test-nav-more > summary:is(:hover,:focus-visible),
html[data-theme="system"] .test-nav-more[open] > summary,
html[data-theme="system"] #header .mode-more-menu .mode-button:is(:hover,:focus-visible),
html[data-theme="system"] .test-nav-more-menu a:is(:hover,:focus-visible),
html[data-theme="system"] .test-nav-more-menu button:is(:hover,:focus-visible) {
    color: #e7eef9;
    background: #213a5f;
    border-color: #526d91;
    text-decoration: none;
}
}

/* Source: /css/universal-footer-v17.10.21.css */
/* TypingTutor.Online global footer v17.10.21 */
.universal-site-footer{display:block;box-sizing:border-box;width:100%;margin-top:48px;padding:36px clamp(18px,4vw,56px) 24px;color:var(--text-light,#64748b);background:linear-gradient(180deg,#fbfdff 0%,#f6f9fd 100%);border-top:1px solid var(--border,#d9e2ef);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.universal-footer-inner{box-sizing:border-box;width:min(1500px,100%);margin:0 auto}
.universal-footer-main{display:grid;grid-template-columns:minmax(240px,.85fr) minmax(0,2.15fr);gap:clamp(32px,5vw,72px);align-items:start}
.universal-footer-brand{display:grid;gap:9px;max-width:340px;text-align:left}
.universal-footer-home{width:max-content;color:var(--text,#0f172a)!important;font-size:18px;font-weight:850;line-height:1.25;text-decoration:none;letter-spacing:-.01em}
.universal-footer-home:hover,.universal-footer-home:focus-visible{color:var(--primary,#1769ff)!important}
.universal-footer-brand span{color:var(--text-light,#64748b);font-size:13px;font-weight:550;line-height:1.6}
.universal-footer-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px clamp(22px,4vw,54px)}
.universal-footer-group{min-width:0}
.universal-footer-group>strong{display:block;margin:0 0 10px;color:var(--text,#0f172a);font-size:11px;font-weight:850;letter-spacing:.08em;text-transform:uppercase}
.universal-footer-group-links{display:grid;gap:8px}
.universal-footer-group-links a{width:max-content;max-width:100%;color:var(--text-light,#64748b);font-size:13px;font-weight:700;line-height:1.45;text-decoration:none;transition:color .16s ease,transform .16s ease}
.universal-footer-group-links a:hover,.universal-footer-group-links a:focus-visible{color:var(--primary,#1769ff);text-decoration:underline;text-underline-offset:3px}
.universal-footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:28px;padding-top:18px;border-top:1px solid color-mix(in srgb,var(--border,#d9e2ef) 82%,transparent);color:var(--text-light,#64748b);font-size:11px;font-weight:600;line-height:1.5}
html[data-theme="dark"] .universal-site-footer{color:#94a3b8;background:#0f172a;border-top-color:#334155}
html[data-theme="dark"] .universal-footer-home,html[data-theme="dark"] .universal-footer-group>strong{color:#f8fafc!important}
html[data-theme="dark"] .universal-footer-brand span,html[data-theme="dark"] .universal-footer-group-links a,html[data-theme="dark"] .universal-footer-bottom{color:#a8b5c7}
html[data-theme="dark"] .universal-footer-bottom{border-top-color:#334155}
html[data-theme="dark"] .universal-footer-home:hover,html[data-theme="dark"] .universal-footer-home:focus-visible,html[data-theme="dark"] .universal-footer-group-links a:hover,html[data-theme="dark"] .universal-footer-group-links a:focus-visible{color:#60a5fa!important}
@media(prefers-color-scheme:dark){html[data-theme="system"] .universal-site-footer{color:#94a3b8;background:#0f172a;border-top-color:#334155}html[data-theme="system"] .universal-footer-home,html[data-theme="system"] .universal-footer-group>strong{color:#f8fafc!important}html[data-theme="system"] .universal-footer-brand span,html[data-theme="system"] .universal-footer-group-links a,html[data-theme="system"] .universal-footer-bottom{color:#a8b5c7}html[data-theme="system"] .universal-footer-bottom{border-top-color:#334155}html[data-theme="system"] .universal-footer-home:hover,html[data-theme="system"] .universal-footer-home:focus-visible,html[data-theme="system"] .universal-footer-group-links a:hover,html[data-theme="system"] .universal-footer-group-links a:focus-visible{color:#60a5fa!important}}
@media(max-width:900px){.universal-site-footer{padding-top:30px}.universal-footer-main{grid-template-columns:1fr;gap:26px}.universal-footer-brand{max-width:620px}.universal-footer-nav{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:620px){.universal-site-footer{margin-top:32px;padding:28px 18px 20px}.universal-footer-nav{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 18px}.universal-footer-group:last-child{grid-column:1/-1}.universal-footer-group:last-child .universal-footer-group-links{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 14px}.universal-footer-group-links a{width:auto;padding:2px 0}.universal-footer-bottom{align-items:flex-start;flex-direction:column;gap:5px;margin-top:24px}}
@media(max-width:390px){.universal-footer-nav{grid-template-columns:1fr}.universal-footer-group:last-child{grid-column:auto}.universal-footer-group:last-child .universal-footer-group-links{grid-template-columns:1fr}}
@media print{.universal-site-footer{display:none!important}}

/* Source: /school/access-v17.10.407.css */
*{box-sizing:border-box}body{margin:0;font:16px/1.6 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#f3f7fb;color:#172c46}a{color:#1753a0;text-underline-offset:3px}button,input,select{font:inherit}button,.button{cursor:pointer;display:inline-block;border:1px solid transparent;border-radius:10px;padding:12px 18px;background:#185bb5;color:#fff;font-weight:700;text-align:center;text-decoration:none}button:hover,.button:hover{background:#104787}button:disabled{cursor:wait;opacity:.65}button.secondary{background:transparent;color:inherit;border-color:#8eabc6}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid #aa6600;outline-offset:3px}[hidden]{display:none!important}.skip-school{position:absolute;left:12px;top:-90px;padding:12px;background:#fff;z-index:10000}.skip-school:focus{top:12px}.school-access{max-width:1180px;margin:44px auto 64px;padding:0 24px;display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}.school-intro h1{font-size:clamp(2rem,4vw,3.4rem);line-height:1.12;letter-spacing:-.04em;margin:12px 0 20px}.school-intro>p:not(.eyebrow){max-width:470px}.back-link{display:inline-block;margin-bottom:28px}.eyebrow{font-size:.8rem;letter-spacing:.13em;font-weight:800;color:#30618b}.setup-steps{padding-left:26px;margin:30px 0}.setup-steps li{padding:0 0 20px 8px}.setup-steps li::marker{font-weight:800;color:#1753a0}.setup-steps span{display:block;color:#46617c}.free-note{font-weight:700;color:#136340}.student-entry{border-top:1px solid #c5d4e3;margin-top:28px;padding-top:22px}.student-entry p{margin:6px 0 12px}.small{font-size:.875rem;color:#456079}.school-auth{min-width:0;padding:30px;border:1px solid #d2deea;border-radius:22px;background:#fff;box-shadow:0 12px 40px #193c6810}.school-auth h2{line-height:1.25;margin:26px 0 12px;font-size:1.65rem}.school-auth p{color:#39536c}.access-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:5px;background:#eef3f9;border-radius:12px}.access-tabs a{padding:10px 8px;border-radius:8px;text-align:center;font-size:.9rem;font-weight:700;text-decoration:none}.access-tabs a[aria-current="page"]{background:#fff;color:#163f73;box-shadow:0 1px 5px #173c6420}.school-auth label:not(.check){display:block;font-weight:650;margin:17px 0 6px}.school-auth input:not([type="checkbox"]),.school-auth select{width:100%;min-height:48px;background:#fff;color:#172c46;border:1px solid #90a8c0;border-radius:9px;padding:10px 12px}.school-auth input[type="checkbox"]{width:20px;height:20px;flex-shrink:0;margin:3px 0;accent-color:#185bb5}.check{display:flex;align-items:flex-start;gap:10px;font-size:.9rem;margin:20px 0}.school-auth form>button[type="submit"],#open-school{width:100%;margin-top:20px}.password-field{display:flex;gap:8px;align-items:stretch}.password-field input{min-width:0}.show-password{padding:8px 12px;background:#edf3fa;color:#174879;border-color:#afc5dc;font-size:.85rem}.show-password:hover{background:#dbe8f6}.help-links{display:flex;flex-wrap:wrap;gap:10px 22px;font-size:.875rem;margin:18px 0}.access-message{border-radius:10px;padding:12px 14px;background:#edf4ff;color:#194578;overflow-wrap:anywhere;margin-bottom:18px}.access-message[data-state="error"]{background:#fff0ef;color:#9d2720;border:1px solid #dfaba7}.access-message[data-state="success"]{background:#eaf8ef;color:#175e36;border:1px solid #9ccbad}@media(max-width:760px){.school-access{display:flex;flex-direction:column;margin:24px auto 40px;padding:0 16px;gap:28px}.school-intro,.school-auth{width:100%}.school-auth{padding:22px 18px;order:1}.school-intro{order:0}.school-intro h1{font-size:2rem}.school-intro .setup-steps{display:none}.back-link{margin-bottom:12px}.student-entry{margin-top:14px;padding-top:12px}.school-intro>p{margin:10px 0}.school-intro .student-entry p{display:none}.school-auth h2{font-size:1.45rem}}@media(prefers-reduced-motion:no-preference){button,a{transition:background .15s}}html[data-theme="dark"] body{background:#0d1928;color:#e5edf6}html[data-theme="dark"] .school-auth{background:#17283b;border-color:#40566e}html[data-theme="dark"] .school-auth p,html[data-theme="dark"] .small,html[data-theme="dark"] .setup-steps span{color:#c0cfdf}html[data-theme="dark"] a{color:#9cc9ff}html[data-theme="dark"] .access-tabs{background:#0d1928}html[data-theme="dark"] .access-tabs a[aria-current="page"]{background:#294560;color:#fff}
/* Source: /school/plans-v17.10.410.css */
.school-buy-section{max-width:1500px;margin:24px auto;padding:24px;border:1px solid #cdd9e8;border-radius:18px;background:var(--class-surface,#fff);color:var(--class-text,#172c46)}.school-buy-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.school-buy-card{padding:20px;border:1px solid #cdd9e8;border-radius:14px;display:flex;flex-direction:column;min-width:0}.school-buy-card h3{margin:0 0 10px}.school-buy-price{font-size:25px;font-weight:800;margin:8px 0}.school-buy-card ul{padding-left:20px;flex:1}.school-buy-card li{margin:7px 0}.school-buy-card button{width:100%;margin-top:14px}.school-buy-card .small{font-size:13px}.school-upgrade-banner{padding:18px;border:1px solid #b7d0f2;background:var(--class-surface,#edf4ff);border-radius:14px;margin-bottom:20px}.school-upgrade-banner h3{margin:0 0 8px}.school-buy-section>p{max-width:900px}.school-buy-notice{padding:12px;background:#edf4ff;color:#194578;border-radius:9px}@media(max-width:1050px){.school-buy-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.school-buy-grid{grid-template-columns:1fr}.school-buy-section{margin:20px 16px;padding:18px}}

.school-plan-heading{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}.school-plan-heading h3{margin:0}.school-plan-badge{display:inline-block;border-radius:999px;padding:5px 10px;background:#dcfce7;color:#166534;font-size:13px;font-weight:750;line-height:1.4}.school-buy-card.is-current-plan{border:2px solid #15803d;background:#f0fdf4;padding:19px}.school-buy-card.is-current-plan button:disabled{background:#166534;color:#fff;border-color:#166534;opacity:1;cursor:default}.school-buy-card button:disabled{cursor:default}html[data-theme="dark"] .school-buy-card.is-current-plan{background:#122e25;border-color:#4ade80}html[data-theme="dark"] .school-plan-badge{background:#185534;color:#dcfce7}