:root{color:#1e2329;background:#f7f8fa;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;line-height:1.5;text-rendering:optimizeLegibility;--surface: #ffffff;--surface-soft: #f1f4f6;--border: #d9e0e6;--text-muted: #5e6975;--accent: #256f71;--accent-strong: #15595c;--accent-soft: #e3f3f1;--accent-alt: #6f5a9b;--accent-alt-soft: #efeafa;--gold: #c98716;--gold-soft: #fff2cf;--success: #18724a;--success-soft: #e4f5eb;--warning: #936316;--warning-soft: #fff4d9;--danger: #a33a36;--danger-soft: #fdebea;--shadow: 0 18px 50px rgba(34, 42, 54, .08);--bottom-nav-height: 74px;--topbar-height: 60px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;background:linear-gradient(180deg,#e3f3f18c,#f7f8fa00 260px),#f7f8fa;-webkit-tap-highlight-color:transparent;overflow-x:clip}button,input,select{font:inherit}button,.button-link{align-items:center;background:var(--accent);border:1px solid var(--accent);border-radius:8px;color:#fff;cursor:pointer;display:inline-flex;font-weight:700;justify-content:center;min-height:44px;padding:.68rem 1rem;text-decoration:none;touch-action:manipulation}.secondary-button{background:#fff;border-color:#bfcbd5;color:#1f2a33}.secondary-button:hover{background:var(--surface-soft)}.next-primary-button{background:var(--accent-alt);border-color:var(--accent-alt)}.next-primary-button:hover{background:#5e4b86}button:hover,.button-link:hover{background:var(--accent-strong)}button:disabled{background:#d5dce2;border-color:#d5dce2;color:#7b8792;cursor:not-allowed}a{color:inherit}code{background:var(--surface-soft);border-radius:6px;display:inline-block;font-family:SFMono-Regular,Consolas,monospace;max-width:100%;overflow-wrap:anywhere;padding:.15rem .42rem}.app-shell{min-height:100vh;padding-bottom:calc(var(--bottom-nav-height) + env(safe-area-inset-bottom))}.topbar{align-items:center;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#ffffffdb;border-bottom:1px solid var(--border);display:flex;gap:.65rem;justify-content:space-between;min-height:var(--topbar-height);padding:.5rem max(.75rem,calc((100vw - 1120px)/2));position:sticky;top:0;z-index:10}.profile-switcher{align-items:center;display:flex;flex:1 1 auto;gap:.4rem;justify-content:flex-end;min-width:0}.profile-switcher label{align-items:center;display:flex;gap:.45rem;min-width:0}.profile-switcher label span{display:none;color:var(--text-muted);font-size:.78rem;font-weight:800;text-transform:uppercase}.profile-switcher select{background:#fff;border:1px solid var(--border);border-radius:8px;color:#172027;min-height:40px;max-width:42vw;padding:.35rem .55rem}.profile-switcher button{min-height:40px;min-width:40px;padding:.35rem .65rem}.profile-switcher button span{display:none}.brand{align-items:center;color:#10151a;display:inline-flex;flex:0 1 auto;font-size:.98rem;font-weight:800;gap:.45rem;min-width:0;text-decoration:none;white-space:nowrap}.brand svg{color:var(--accent);flex:0 0 auto}.brand-long{display:none}.brand-short{display:inline}@media(min-width:390px){.brand-long{display:inline}.brand-short{display:none}}.desktop-nav{display:none;gap:.45rem}.desktop-nav a,.text-link{border-radius:8px;color:var(--accent-strong);font-weight:700;padding:.45rem .55rem;text-decoration:none}.desktop-nav a:hover,.desktop-nav a[aria-current=page],.text-link:hover{background:var(--accent-soft)}.mobile-tabbar{align-items:center;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#ffffffeb;border-top:1px solid var(--border);bottom:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));min-height:calc(var(--bottom-nav-height) + env(safe-area-inset-bottom));padding:.45rem .75rem calc(.45rem + env(safe-area-inset-bottom));position:fixed;left:0;right:0;z-index:20}.mobile-tabbar a{align-items:center;border-radius:8px;color:#52606c;display:grid;font-size:.72rem;font-weight:800;gap:.15rem;justify-items:center;min-height:54px;text-decoration:none}.mobile-tabbar a[aria-current=page]{background:var(--accent-soft);color:var(--accent-strong)}.text-link--quiet{color:#45525e}.page{margin:0 auto;max-width:1120px;padding:.85rem .85rem 1.4rem}.narrow-page{max-width:760px}.home-header,.lesson-title-block{align-items:stretch;display:grid;gap:.85rem;grid-template-columns:1fr;padding:.85rem 0 1rem}.home-header h1,.lesson-title-block h1,.section-heading h1{font-size:clamp(1.85rem,9vw,3.1rem);letter-spacing:0;line-height:1.02;margin:.15rem 0 .75rem}.lead,.lesson-title-block p{color:var(--text-muted);font-size:1rem;margin:0;max-width:58ch}.course-meta-line{color:var(--accent-alt);font-weight:800;margin:0 0 .6rem}.hero-actions,.completion-actions{align-items:center;display:flex;flex-wrap:wrap;gap:.65rem;margin-top:1rem}.hero-actions>*,.completion-actions>*{flex:1 1 160px}.eyebrow{color:var(--accent-strong);font-size:.78rem;font-weight:800;letter-spacing:0;margin:0 0 .35rem;text-transform:uppercase}.section-block{margin:.95rem 0;min-width:0;scroll-margin-top:calc(var(--topbar-height) + .7rem)}.section-block h2,.exercise-shell h2{font-size:1.35rem;line-height:1.2;margin:0 0 .8rem}.section-block h3{font-size:1.03rem;margin:0 0 .4rem}.section-heading{align-items:flex-start;display:flex;gap:1rem;justify-content:space-between;margin-bottom:.75rem}.section-heading>span{color:var(--text-muted);flex:0 0 auto;font-size:.9rem;font-weight:800}.section-heading h1,.section-heading h2{margin:0}.lesson-list{display:grid;gap:.8rem}.stat-grid{display:grid;gap:.75rem;grid-template-columns:repeat(2,minmax(0,1fr));margin:.5rem 0 1rem}.stat-card,.course-switcher,.lesson-metrics,.data-panel{background:var(--surface);border:1px solid var(--border);border-radius:8px;box-shadow:var(--shadow)}.weak-spot-grid{display:grid;gap:.75rem;grid-template-columns:1fr}.weak-spot-card{background:var(--surface);border:1px solid var(--border);border-radius:8px;box-shadow:var(--shadow);display:grid;gap:.45rem;padding:.9rem}.weak-spot-card div{align-items:center;display:flex;gap:.6rem;justify-content:space-between}.weak-spot-card strong{color:#20262c}.weak-spot-card span{background:var(--danger-soft);border-radius:999px;color:var(--danger);font-size:.78rem;font-weight:800;padding:.35rem .5rem}.weak-spot-card p{color:var(--text-muted);margin:0}.weak-spot-card small{color:var(--accent-alt);font-weight:800}.data-panel{align-items:center;display:grid;gap:1rem;margin:1rem 0;padding:1rem}.data-panel h2{font-size:1.15rem;margin:0 0 .35rem}.data-panel p{color:var(--text-muted);margin:0}.data-actions,.review-toolbar{align-items:center;display:flex;flex-wrap:wrap;gap:.55rem}.data-actions>*,.review-toolbar>button{flex:1 1 130px}.file-button{align-items:center;background:#fff;border:1px solid #bfcbd5;border-radius:8px;color:#1f2a33;cursor:pointer;display:inline-flex;font-weight:800;justify-content:center;min-height:44px;padding:.68rem 1rem}.file-button:hover{background:var(--surface-soft)}.file-button input{display:none}.danger-button{background:var(--danger);border-color:var(--danger)}.danger-button:hover{background:#842b28}.stat-card{align-items:center;display:flex;gap:.7rem;min-height:82px;padding:.85rem}.stat-card>span{align-items:center;background:var(--gold-soft);border-radius:8px;display:inline-flex;font-size:1.35rem;height:42px;justify-content:center;width:42px}.stat-card strong{display:block;font-size:1.18rem;line-height:1.1}.stat-card p{color:var(--text-muted);margin:.15rem 0 0}.course-switcher{align-items:start;display:grid;gap:.8rem;margin:1rem 0;padding:1rem}.course-switcher h2{font-size:1.15rem;margin:0}.course-tabs{display:flex;flex-wrap:nowrap;gap:.55rem;margin-inline:-1rem;overflow-x:auto;padding:0 1rem .15rem;scroll-snap-type:x proximity;scrollbar-width:none}.course-tabs::-webkit-scrollbar,.course-map::-webkit-scrollbar,.exercise-dots::-webkit-scrollbar{display:none}.course-tabs button{background:#fff;border-color:#bfcbd5;color:#24303a;display:grid;justify-items:start;line-height:1.2;min-width:min(82vw,260px);scroll-snap-align:start;text-align:left}.course-tabs button.is-selected{background:var(--accent-alt);border-color:var(--accent-alt);color:#fff}.course-tabs button span{color:var(--text-muted);font-size:.82rem;font-weight:600}.course-tabs button.is-selected span{color:#ffffffd1}.course-map{display:flex;gap:.55rem;margin-inline:-.85rem;overflow-x:auto;padding:0 .85rem .15rem;scroll-snap-type:x proximity}.course-map__item{background:var(--surface);border:1px solid var(--border);border-radius:8px;color:inherit;display:grid;gap:.2rem;flex:0 0 116px;min-height:96px;padding:.75rem;scroll-snap-align:start;text-decoration:none}.course-map__item strong{align-items:center;background:var(--surface-soft);border-radius:999px;display:inline-flex;height:34px;justify-content:center;width:34px}.course-map__item span{color:#26313b;font-weight:800}.course-map__item em{color:var(--danger);font-size:.8rem;font-style:normal;font-weight:800}.course-map__item--completed{border-color:#9dd3b7}.course-map__item--completed strong{background:var(--success-soft);color:var(--success)}.course-map__item--in_progress{border-color:#e5c278}.course-map__item--in_progress strong{background:var(--warning-soft);color:var(--warning)}.course-map__item--locked{color:#73808a;opacity:.72}.lesson-card,.plain-panel,.pattern-row,.example-row,.mistake-row,.mistake-card,.exercise-shell,.developer-error,.locked-panel,.progress-block{background:var(--surface);border:1px solid var(--border);border-radius:8px;box-shadow:var(--shadow)}.lesson-card{color:inherit;display:grid;gap:.6rem;grid-template-rows:auto auto 1fr auto;padding:1rem;text-decoration:none}.lesson-card:hover{border-color:#9fc5c2}.lesson-card--locked{color:#73808a;box-shadow:none}.lesson-card__top,.lesson-card__meta,.mistake-card__top,.progress-block__row,.exercise-shell__header{align-items:center;display:flex;gap:.7rem;justify-content:space-between}.lesson-card h3{font-size:1.28rem;line-height:1.22;margin:0}.lesson-card p,.plain-panel p,.pattern-row p,.example-row p,.mistake-row p,.developer-error p,.locked-panel p{color:var(--text-muted);margin:0}.lesson-card__top,.lesson-card__meta,.mistake-card__top{color:var(--text-muted);font-size:.88rem}.lesson-card__meta{flex-wrap:wrap;justify-content:flex-start}.status-badge{border-radius:999px;display:inline-flex;font-size:.78rem;font-weight:800;line-height:1;padding:.38rem .55rem}.status-badge--completed{background:var(--success-soft);color:var(--success)}.status-badge--in_progress{background:var(--warning-soft);color:var(--warning)}.status-badge--locked{background:#eef1f4;color:#64717e}.progress-block{padding:1rem}.progress-block__row{font-size:.95rem;margin-bottom:.7rem}.progress-bar{background:#e5ebef;border-radius:999px;height:.65rem;overflow:hidden}.progress-bar span{background:linear-gradient(90deg,#256f71,#6f5a9b,#c98716);border-radius:inherit;display:block;height:100%;transition:width .18s ease}.developer-error{background:var(--danger-soft);border-color:#f2b9b5;color:#601f1c;padding:1rem}.developer-error h2{margin:0 0 .5rem}.developer-error__file{margin-top:.75rem}.content-grid{display:grid;gap:1rem;grid-template-columns:1fr}.content-grid>*,.stack>*{min-width:0}.stack{display:grid;gap:.75rem}.plain-panel,.pattern-row,.example-row,.mistake-row{box-shadow:none;padding:1rem}.pattern-row,.example-row,.mistake-row{display:grid;gap:.45rem}.wrong-text{color:var(--danger);text-decoration:line-through}.correct-text{color:var(--success);font-weight:800}.clean-list{display:grid;gap:.55rem;list-style:none;margin:0;padding:0}.clean-list li{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:.8rem .95rem}.exercise-shell{margin:1.4rem 0;padding:.85rem;scroll-margin-top:calc(var(--topbar-height) + .7rem)}.lesson-metrics{display:grid;gap:.55rem;grid-template-columns:repeat(3,minmax(0,1fr));margin:1rem 0;padding:.55rem}.lesson-metrics div{align-items:center;background:var(--surface-soft);border-radius:8px;display:grid;gap:.25rem;justify-items:center;min-width:0;padding:.65rem .35rem;text-align:center}.lesson-metrics span{font-size:1.15rem}.lesson-metrics strong{line-height:1.05}.lesson-metrics p{color:var(--text-muted);font-size:.78rem;line-height:1.2;margin:0}.lesson-jump-nav{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#f7f8fadb;display:flex;gap:.45rem;margin:0 -.85rem 1rem;overflow-x:auto;padding:.35rem .85rem;position:sticky;scrollbar-width:none;top:var(--topbar-height);z-index:8}.lesson-jump-nav::-webkit-scrollbar{display:none}.lesson-jump-nav button{background:#fff;border-color:var(--border);color:#26313b;flex:0 0 auto;min-height:38px;padding:.45rem .75rem}.exercise-shell__header{align-items:flex-start;border-bottom:1px solid var(--border);margin-bottom:1rem;padding-bottom:.85rem}.exercise-shell__header span{color:var(--text-muted);flex:0 0 auto;font-weight:700}.exercise-dots{display:flex;gap:.45rem;margin:0 -.85rem 1rem;overflow-x:auto;padding:0 .85rem .2rem;scroll-snap-type:x proximity}.exercise-dots button{background:#fff;border-color:#c9d4dc;color:#26313b;flex:0 0 42px;min-height:42px;padding:0;scroll-snap-align:start}.exercise-dots button.is-current{border-color:var(--accent-alt);box-shadow:0 0 0 3px var(--accent-alt-soft)}.exercise-dots button.is-correct{background:var(--success-soft);border-color:#9dd3b7;color:var(--success)}.exercise-dots button.is-wrong{background:var(--danger-soft);border-color:#f1b0ac;color:var(--danger)}.exercise-renderer{display:grid;gap:1rem}.exercise-form{display:grid;gap:.85rem}.exercise-form label,.exercise-form fieldset{border:0;display:grid;gap:.4rem;margin:0;padding:0}.exercise-form legend,.exercise-form label{color:#20262c;font-weight:800}.exercise-form input[type=text]{background:#fff;border:1px solid #bfcbd5;border-radius:8px;color:#14191e;font-size:1rem;min-height:48px;padding:.75rem .85rem;width:100%}.exercise-form input[type=text]:focus{border-color:var(--accent);outline:3px solid var(--accent-soft)}.exercise-prompt{color:#20262c;font-weight:800;margin:0}.exercise-sentence{background:var(--surface-soft);border-radius:8px;font-size:clamp(1.05rem,4vw,1.25rem);font-weight:800;margin:0;padding:.9rem 1rem}.hint{color:var(--text-muted);margin:0}.hint-toggle{display:grid;gap:.5rem;justify-items:start}.option-stack{display:grid;gap:.55rem;margin-top:.6rem}.choice-option{align-items:center;border:1px solid var(--border);border-radius:8px;cursor:pointer;display:flex!important;gap:.65rem;padding:.75rem .85rem}.choice-option:hover{border-color:#9fc5c2}.sentence-builder{display:grid;gap:.75rem}.sentence-builder__answer{align-items:center;background:var(--surface-soft);border:1px dashed #aab8c3;border-radius:8px;color:#26313b;display:flex;font-weight:800;min-height:56px;padding:.85rem}.word-bank,.inline-actions,.exercise-nav,.review-checklist{display:flex;flex-wrap:wrap;gap:.55rem}.exercise-form>button,.exercise-nav button,.inline-actions button,.word-bank button{min-height:46px}.exercise-form>button{width:100%}.word-bank button,.inline-actions button,.exercise-nav button{background:#fff;border-color:#bfcbd5;color:#1f2a33}.word-bank button:hover,.inline-actions button:hover,.exercise-nav button:hover{background:var(--surface-soft)}.exercise-feedback{border-radius:8px;padding:.9rem 1rem}.exercise-feedback p{margin:.3rem 0 0}.exercise-feedback--correct{background:var(--success-soft);color:#124a30}.exercise-feedback--wrong{background:var(--danger-soft);color:#6b2522}.exercise-nav{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#fffffff0;border-top:1px solid var(--border);bottom:calc(var(--bottom-nav-height) + env(safe-area-inset-bottom));margin:1rem -.85rem -.85rem;padding:.75rem .85rem;position:sticky;z-index:7}.exercise-nav button{flex:1 1 120px}.completion-panel{background:linear-gradient(135deg,var(--accent-soft),var(--gold-soft));border-radius:8px;color:#174f51;margin-top:1rem;padding:.9rem 1rem}.completion-panel p{margin:.25rem 0 0}.lesson-diagnostics{align-items:center;background:#ffffff8f;border:1px solid rgba(37,111,113,.18);border-radius:8px;display:grid;gap:.65rem;margin-top:.85rem;padding:.8rem}.review-checklist{margin-top:.85rem}.review-checklist span{background:var(--accent-soft);border-radius:999px;color:var(--accent-strong);font-weight:800;padding:.45rem .65rem}.mistake-list,.mistake-trainer{display:grid;gap:1rem}.mistake-trainer__top{align-items:center;background:var(--surface);border:1px solid var(--border);border-radius:8px;box-shadow:var(--shadow);display:flex;gap:1rem;justify-content:space-between;padding:1rem}.mistake-trainer__top h2{margin:0}.review-toolbar{justify-content:space-between;margin:.85rem 0 1rem}.segmented-control{background:var(--surface-soft);border:1px solid var(--border);border-radius:8px;display:inline-flex;gap:.25rem;padding:.25rem}.segmented-control button{background:transparent;border-color:transparent;color:#24303a;min-height:38px;padding:.4rem .65rem}.segmented-control button.is-selected{background:#fff;border-color:var(--border);color:var(--accent-strong)}.mistake-card{box-shadow:none;display:grid;gap:.85rem;padding:1rem}.mistake-card h2{font-size:1.1rem;margin:0}.mistake-card dl{display:grid;gap:.75rem;margin:0}.mistake-card dt{color:var(--text-muted);font-size:.84rem;font-weight:800;margin-bottom:.18rem;text-transform:uppercase}.mistake-card dd{margin:0}.retry-panel{border-top:1px solid var(--border);display:grid;gap:.8rem;padding-top:1rem}.locked-panel{margin-top:1rem;padding:1.2rem}.empty-state,.developer-note{color:var(--text-muted)}@media(min-width:720px){.app-shell{padding-bottom:0}.mobile-tabbar{display:none}.topbar{gap:1rem;min-height:64px;padding:.8rem max(1rem,calc((100vw - 1120px)/2))}.brand{font-size:1.05rem}.desktop-nav{display:flex}.profile-switcher{flex:0 0 auto;gap:.5rem}.profile-switcher label span,.profile-switcher button span{display:inline}.profile-switcher select{max-width:none}.page{padding:1.5rem}.home-header,.lesson-title-block{align-items:end;grid-template-columns:minmax(0,1fr) 320px;padding:2rem 0}.home-header h1,.lesson-title-block h1,.section-heading h1{font-size:clamp(2rem,7vw,4rem)}.lead,.lesson-title-block p{font-size:1.08rem}.hero-actions>*,.completion-actions>*{flex:0 1 auto}.lesson-list{grid-template-columns:repeat(2,minmax(0,1fr))}.stat-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.weak-spot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.course-switcher{align-items:center;grid-template-columns:minmax(0,1fr) auto}.course-tabs{flex-wrap:wrap;margin-inline:0;overflow:visible;padding:0}.course-tabs button{min-width:min(100%,220px)}.course-map{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));margin-inline:0;overflow:visible;padding:0}.course-map__item{flex-basis:auto}.data-panel,.lesson-diagnostics{grid-template-columns:minmax(0,1fr) auto}.data-actions>*,.review-toolbar>button{flex:0 1 auto}.lesson-metrics{grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem;padding:.85rem}.lesson-metrics div{gap:.25rem .65rem;grid-template-columns:auto 1fr;justify-items:stretch;padding:.8rem;text-align:left}.lesson-metrics span{font-size:1.35rem;grid-row:span 2}.lesson-metrics p{font-size:1rem}.lesson-jump-nav{margin:0 0 1rem;padding-inline:0}.content-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.exercise-shell{padding:1.25rem}.exercise-dots{display:grid;grid-template-columns:repeat(auto-fill,minmax(42px,1fr));margin:0 0 1rem;overflow:visible;padding:0}.exercise-dots button{flex-basis:auto}.exercise-form>button{width:auto}.exercise-nav{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;bottom:auto;margin:1rem 0 0;padding:1rem 0 0;position:static}.exercise-nav button{flex:0 1 auto}}
