*{box-sizing:border-box}html,body,#root{color:#111318;background:#f6f7fb;min-height:100%;margin:0;font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,Segoe UI,sans-serif}button,input{font:inherit}button{cursor:pointer}.app-shell{min-height:100vh}.app-content{padding-bottom:92px}.tab-page{max-width:760px;margin:0 auto;padding:24px 18px 34px}.page-header,.simple-header{padding-top:max(12px,env(safe-area-inset-top));margin-bottom:18px}.page-header{justify-content:space-between;align-items:center;display:flex}.page-header h1,.simple-header h1,.profile-head h1{letter-spacing:-1.2px;margin:2px 0 0;font-size:34px;line-height:1.05}.eyebrow{text-transform:uppercase;letter-spacing:1.5px;color:#2d7ff0;margin:0 0 7px;font-size:12px;font-weight:800}.muted{color:#747985;line-height:1.5}.tiny-note{color:#8a8f98;font-size:12px;line-height:1.45}.level-pill{background:#fff;border:1px solid #e2e4ea;border-radius:50%;place-items:center;width:54px;height:54px;font-weight:800;display:grid}.hero-card{color:#fff;background:linear-gradient(145deg,#2f7bf0,#165ed2);border-radius:26px;padding:22px;box-shadow:0 14px 34px #1e65da2e}.hero-card h2{margin:3px 0 8px;font-size:28px}.hero-card p{line-height:1.45}.card-kicker{text-transform:uppercase;letter-spacing:1.2px;opacity:.8;font-weight:800;font-size:12px!important}.hero-progress,.unit-progress,.progress-line{background:#ffffff40;border-radius:99px;height:7px;margin:17px 0;overflow:hidden}.hero-progress span,.unit-progress span,.progress-line span{background:currentColor;border-radius:99px;height:100%;display:block}.primary-button{color:#fff;background:#2b75e8;border:0;border-radius:15px;justify-content:center;align-items:center;gap:8px;width:100%;padding:14px 18px;font-weight:800;display:flex}.primary-button.dark{color:#fff;background:#111318}.primary-button:disabled{opacity:.5}.secondary-button{background:#fff;border:1px solid #d8dbe2;border-radius:15px;width:100%;padding:14px 18px;font-weight:700}.text-button{color:#2d72df;background:0 0;border:0;padding:14px;font-weight:700}.stat-grid{grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0 24px;display:grid}.stat-card{background:#fff;border:1px solid #e4e6eb;border-radius:18px;flex-direction:column;gap:5px;padding:16px 12px;display:flex}.stat-card strong{font-size:23px}.stat-card span{color:#7d828c;font-size:11px}.section-title{margin:24px 2px 10px;font-size:18px}.menu-card,.lesson-row,.sign-row{text-align:left;background:#fff;border:1px solid #e2e4e9;border-radius:18px;align-items:center;gap:13px;width:100%;margin:9px 0;padding:15px;display:flex}.menu-card>span,.lesson-row>span,.sign-row>span{flex-direction:column;flex:1;gap:3px;display:flex}.menu-card small,.lesson-row small,.sign-row small{color:#858a94;font-size:12px;line-height:1.3}.level-section{margin:24px 0 28px}.level-heading{flex-direction:column;margin:0 4px 10px;display:flex}.level-heading span{color:#2d7ff0;text-transform:uppercase;letter-spacing:1.4px;font-size:11px;font-weight:800}.level-heading b{font-size:19px}.unit-card{background:#fff;border:1px solid #e2e4e9;border-radius:22px;margin:12px 0;overflow:hidden}.unit-top{text-align:left;background:#fff;border:0;justify-content:space-between;align-items:center;width:100%;padding:17px;display:flex}.unit-top h3{margin:2px 0 4px;font-size:20px}.unit-top small{color:#8a8f97}.unit-meta{text-transform:uppercase;letter-spacing:1px;color:#2e7ce8;margin:0;font-size:11px;font-weight:800}.unit-progress{background:#eef0f4;height:5px;margin:0}.unit-progress span{background:#2e7ce8}.lesson-list{border-top:1px solid #eff0f3;padding:4px 10px 10px}.lesson-row{border:0;border-radius:14px;margin:2px 0;padding:12px 8px}.lesson-number{color:#6d7480;background:#eef1f6;border-radius:50%;place-items:center;width:32px;height:32px;font-weight:800;display:grid}.lesson-number.done{color:#16814d;background:#dff3e8}.chev{transition:all .2s}.chev.open{transform:rotate(180deg)}.bottom-nav{z-index:20;padding:8px 14px calc(8px + env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#fafafcf0;border-top:1px solid #dddfe5;grid-template-columns:repeat(4,1fr);display:grid;position:fixed;bottom:0;left:0;right:0}.bottom-nav button{color:#8a8f97;background:0 0;border:0;flex-direction:column;align-items:center;gap:3px;padding:5px;font-size:10px;display:flex}.bottom-nav button.active{color:#2575e6}.auth-shell,.onboarding-shell,.quiz-shell{min-height:100vh;padding:calc(28px + env(safe-area-inset-top)) 18px 30px;place-items:center;display:grid}.auth-card,.onboarding-card,.quiz-card{background:#fff;border:1px solid #e1e3e8;border-radius:28px;width:min(100%,480px);padding:24px;box-shadow:0 18px 55px #141c2d14}.auth-card h1,.onboarding-card h1{letter-spacing:-1px;margin:5px 0 10px;font-size:34px}.brand-mark{color:#fff;background:#2477e8;border-radius:20px;place-items:center;width:64px;height:64px;font-size:20px;font-weight:900;display:grid}.auth-form{flex-direction:column;gap:12px;margin-top:20px;display:flex}.auth-form label{color:#656b74;flex-direction:column;gap:6px;font-size:12px;font-weight:700;display:flex}.auth-form input,.search-box input{background:0 0;border:0;outline:none}.auth-form input{color:#111;background:#f3f5f8;border-radius:13px;padding:14px;font-size:16px}.error-banner{color:#a12a2a;background:#fff0f0;border:1px solid #ffd1d1;border-radius:13px;margin:9px 0;padding:12px 13px;line-height:1.4}.placement-icon,.production-icon{color:#2674df;background:#edf4ff;border-radius:19px;place-items:center;width:58px;height:58px;font-size:28px;display:grid}.modal-screen{z-index:50;background:#f6f7fb;position:fixed;inset:0;overflow:auto}.modal-bar{z-index:3;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);padding:calc(10px + env(safe-area-inset-top)) 14px 10px;background:#f6f7fbed;border-bottom:1px solid #e2e4e9;grid-template-columns:44px 1fr 44px;align-items:center;display:grid;position:sticky;top:0}.modal-bar button{background:0 0;border:0;place-items:center;width:42px;height:42px;display:grid}.modal-bar div{text-align:center;flex-direction:column;display:flex}.modal-bar small{color:#858b95;font-size:11px}.lesson-stage{max-width:620px;margin:0 auto;padding:20px 18px 40px}.learning-card,.note-card,.production-card,.result-card,.sign-detail-card{background:#fff;border:1px solid #e1e4e9;border-radius:26px;padding:22px}.learning-card h1,.sign-detail-card h1{letter-spacing:-1px;text-transform:capitalize;margin:3px 0 15px;font-size:38px}.video-box{aspect-ratio:16/12;color:#fff;background:#111318;border-radius:22px;place-items:center;width:100%;margin:12px 0 16px;display:grid;overflow:hidden}.video-box.compact{aspect-ratio:16/9;max-height:300px}.video-box video{object-fit:contain;background:#111318;width:100%;height:100%}.video-fallback{text-align:center;gap:7px}.video-fallback small{color:#aeb4be}.translation-line{color:#777d87;margin-bottom:16px;font-size:12px}.note-card h2,.production-card h2,.quiz-card h2{margin:7px 0 12px;font-size:26px;line-height:1.12}.note-card p,.production-card p{line-height:1.6}.quiz-card.in-modal{box-shadow:none}.answer-list{flex-direction:column;gap:9px;display:flex}.answer-choice{text-align:left;background:#fff;border:1px solid #dfe2e7;border-radius:14px;justify-content:space-between;padding:13px 15px;font-weight:700;display:flex}.answer-choice.correct{background:#eefaf3;border-color:#53b77d}.answer-choice.wrong{background:#fff2f2;border-color:#e56e6e}.result-card{text-align:center}.result-ring{color:#236ed9;background:#edf4ff;border-radius:50%;place-items:center;width:110px;height:110px;margin:10px auto 18px;font-size:30px;font-weight:900;display:grid}.letter-visual{background:#f0f2f6;border-radius:22px;place-items:center;height:320px;margin:13px 0 18px;padding:30px;display:grid;overflow:hidden}.letter-visual img{object-fit:contain;width:auto;max-width:68%;height:auto;max-height:72%;display:block}.letter-visual.placeholder{padding:0}.letter-visual.placeholder span{font-size:110px;font-weight:900}.choice-grid{grid-template-columns:1fr 1fr;gap:9px;margin:14px 0;display:grid}.choice{background:#fff;border:1px solid #dde0e6;border-radius:14px;padding:15px;font-size:22px;font-weight:900}.choice.selected{background:#edf4ff;border-color:#2f78e6}.progress-line{background:#e7e9ee;margin:0 0 18px}.progress-line span{background:#2d78e5}.tip-box{background:#f0f6ff;border-radius:14px;padding:12px;line-height:1.5}.search-box{background:#fff;border:1px solid #e0e2e7;border-radius:16px;align-items:center;gap:9px;padding:12px 14px;display:flex}.search-box input{flex:1;font-size:16px}.search-box button{background:0 0;border:0}.chip-scroll{scrollbar-width:none;gap:8px;padding:12px 1px 6px;display:flex;overflow:auto}.chip{white-space:nowrap;background:#fff;border:1px solid #dfe2e7;border-radius:99px;padding:8px 12px;font-size:12px}.chip.active{color:#fff;background:#1f6fdf;border-color:#1f6fdf}.sign-list{margin-top:10px}.sign-row{border-radius:15px;margin:6px 0;padding:11px}.sign-avatar{color:#2672dd;text-transform:uppercase;background:#edf4ff;border-radius:13px;place-items:center;width:42px;height:42px;font-weight:900;display:grid}.tag-wrap{flex-wrap:wrap;gap:7px;margin:10px 0 20px;display:flex}.tag-wrap span{background:#eff1f5;border-radius:99px;padding:7px 10px;font-size:12px}.source-link{color:#2873de;margin-top:4px;font-weight:700;text-decoration:none;display:inline-block}.center-pad{text-align:center;color:#7d838d;justify-content:center;align-items:center;gap:8px;padding:36px;display:flex}.profile-head{padding-top:max(14px,env(safe-area-inset-top));align-items:center;gap:15px;margin-bottom:20px;display:flex}.profile-avatar{color:#fff;background:#2b75e8;border-radius:20px;place-items:center;width:64px;height:64px;font-size:28px;font-weight:900;display:grid}.profile-card{background:#fff;border:1px solid #e2e4e9;border-radius:16px;justify-content:space-between;margin:9px 0;padding:15px;display:flex}.profile-card span{color:#747a84}.danger-button{color:#b23939;background:#fff;border:1px solid #f1bcbc;border-radius:15px;justify-content:center;align-items:center;gap:8px;width:100%;margin-top:20px;padding:14px;font-weight:800;display:flex}.full-loading{color:#777e87;justify-content:center;align-items:center;gap:10px;min-height:280px;display:flex}.spin{animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (min-width:700px){.tab-page{padding-top:34px}.hero-card{padding:28px}.lesson-stage{padding-top:30px}}.lesson-nav-row{grid-template-columns:minmax(112px,.7fr) minmax(0,1.3fr);align-items:stretch;gap:10px;margin-top:8px;display:grid}.lesson-nav-row .primary-button{height:100%;margin:0}.lesson-nav-button{color:#4f5661;background:#fff;border:1px solid #d9dde5;border-radius:15px;justify-content:center;align-items:center;gap:6px;padding:13px 12px;font-weight:800;display:flex}.lesson-nav-button:disabled{opacity:.38;cursor:default}.review-button{justify-content:center;align-items:center;gap:7px;margin:12px 0 9px;display:flex}.review-text-button{justify-content:center;align-items:center;gap:6px;width:100%;margin-top:10px;display:flex}@media (max-width:380px){.lesson-nav-row{grid-template-columns:1fr}.lesson-nav-button{order:2}}.study-quiz-card{background:linear-gradient(#fff,#f7faff);border-color:#b9d3fb}.studied-only-badge{color:#19734a;background:#eaf7ef;border-radius:99px;align-items:center;gap:6px;margin:0 0 10px;padding:6px 9px;font-size:11px;font-weight:800;display:inline-flex}.study-loading{text-align:center;color:#737a84;background:#fff;border:1px solid #e1e4e9;border-radius:26px;flex-direction:column;justify-content:center;align-items:center;min-height:360px;padding:28px;display:flex}.study-loading h2{color:#15181d;margin:14px 0 4px}.study-loading p{max-width:360px;line-height:1.5}.study-close-button{margin-top:10px}.choice.correct{color:#176d43;background:#eefaf3;border-color:#53b77d}.choice.wrong{color:#a73434;background:#fff2f2;border-color:#e56e6e}