:root { --ink:#f6f7fb; --muted:#a8b0c3; --navy:#0b1220; --surface:#151e2e; --line:#28354d; --coral:#ff735b; --sky:#72d0ff; --yellow:#f7cb55; }
*{box-sizing:border-box} body{margin:0;background:linear-gradient(155deg,#0b1220,#111b2e 50%,#0d1422);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display",Inter,sans-serif;min-height:100vh}button{font:inherit;color:inherit;border:0;cursor:pointer}.app-shell{max-width:620px;margin:0 auto;padding:calc(env(safe-area-inset-top) + 20px) 18px 106px}.view{display:none}.view.active{display:block}.hero{padding:8px 4px 20px}.eyebrow{font-size:11px;letter-spacing:.15em;font-weight:800;color:var(--sky);margin:0 0 7px}.hero h1{font-size:37px;line-height:1.04;letter-spacing:-1.4px;margin:0}.hero h1 em{color:var(--coral);font-style:normal}.subtle{color:var(--muted);margin:12px 0 18px}.progress-card,.today-card,.lesson-card,.flashcard,.quiz-card{background:rgba(21,30,46,.93);border:1px solid var(--line);border-radius:20px}.progress-card{padding:14px 16px;display:grid;grid-template-columns:1fr auto;gap:9px;font-size:13px;color:var(--muted)}.progress-card strong{font-size:13px;color:var(--ink)}.progress-track{height:7px;background:#28354d;border-radius:9px;grid-column:span 2;overflow:hidden}.progress-track i{display:block;background:linear-gradient(90deg,var(--coral),var(--yellow));height:100%;width:0%;transition:.35s}.today-card{padding:19px;margin:0 0 28px;background:linear-gradient(130deg,#1e304a,#192335);position:relative;overflow:hidden}.today-card:after{content:'▶';position:absolute;right:20px;top:21px;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--coral);font-size:15px}.today-card p{color:var(--sky);font-weight:800;font-size:12px;margin:0 0 8px}.today-card h2{font-size:22px;margin:0 45px 8px 0}.today-card span{color:var(--muted);font-size:14px}.section-title{display:flex;justify-content:space-between;align-items:center;margin:0 3px 12px}.section-title h2{font-size:18px;margin:0}.text-button{background:transparent;color:var(--sky);font-size:13px}.week-list{display:grid;gap:9px}.week-button{display:flex;text-align:left;align-items:center;gap:13px;padding:14px;border-radius:16px;background:rgba(21,30,46,.75);border:1px solid var(--line)}.week-number{width:35px;height:35px;border-radius:11px;display:grid;place-items:center;background:#253450;font-weight:800;color:var(--sky);font-size:13px}.week-button.done .week-number{background:var(--coral);color:#fff}.week-copy{flex:1}.week-copy strong{display:block;font-size:15px}.week-copy span{font-size:12px;color:var(--muted);display:block;margin-top:3px}.arrow{color:var(--muted);font-size:21px}.bottom-nav{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:center;gap:34px;padding:11px max(18px,env(safe-area-inset-right)) calc(11px + env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));background:rgba(9,15,27,.94);backdrop-filter:blur(18px);border-top:1px solid #233049}.nav-item{background:transparent;color:var(--muted);font-size:20px;display:grid;gap:2px;justify-items:center}.nav-item span{font-size:10px}.nav-item.active{color:var(--coral)}.lesson-header{display:grid;grid-template-columns:40px 1fr 40px;align-items:center;gap:10px;margin-bottom:19px}.lesson-header h2{font-size:20px;line-height:1.1;margin:0}.lesson-header .eyebrow{margin:0 0 4px}.icon-button{background:#1c2a42;width:38px;height:38px;border-radius:12px;font-size:25px}.lesson-header #completeButton{color:var(--yellow);font-weight:800;font-size:19px}.lesson-tabs{display:flex;gap:5px;overflow:auto;margin:0 -3px 20px;padding:0 3px}.tab{white-space:nowrap;padding:9px 13px;background:#1a263b;border-radius:10px;font-size:13px;color:var(--muted)}.tab.active{background:var(--coral);color:white;font-weight:700}.lesson-card{padding:18px;margin-bottom:13px}.lesson-card h3{font-size:18px;margin:0 0 7px}.lesson-card p{color:var(--muted);line-height:1.5;margin:0}.phrases{display:grid;gap:11px}.flashcard{padding:18px;position:relative;min-height:121px}.language-tag{font-size:11px;letter-spacing:.12em;color:var(--sky);font-weight:800}.phrase{font-size:21px;line-height:1.22;margin:10px 42px 8px 0}.translation{color:var(--muted);font-size:14px}.speaker{position:absolute;right:13px;top:15px;width:36px;height:36px;border-radius:11px;background:#293b5a;color:var(--sky)}.speak-intro{padding:19px;margin-bottom:12px}.speak-intro h3{margin:0 0 8px}.record-row{display:flex;gap:10px;align-items:center}.record-button{width:66px;height:66px;border-radius:50%;background:var(--coral);font-size:23px}.record-button.recording{animation:pulse 1s infinite;background:#ff3f57}.tip{font-size:13px;color:var(--muted);line-height:1.45}.video-stage{border-radius:22px;overflow:hidden;background:linear-gradient(145deg,#30466a,#1a2539);padding:27px 21px;text-align:center;min-height:244px;display:grid;align-content:center}.coach-avatar{width:75px;height:75px;border-radius:50%;margin:auto;background:radial-gradient(circle at 50% 35%,#ffd3ab 0 24%,transparent 25%),linear-gradient(#6b4a40 0 29%,#ffd3ab 30% 56%,#182a42 57%);border:3px solid var(--sky)}.video-stage h3{margin:14px 0 8px}.video-stage p{color:#d8e5f4;font-size:14px;line-height:1.45;margin:0 auto;max-width:300px}.video-stage button{margin:17px auto 0;padding:11px 15px;border-radius:11px;background:var(--sky);color:#0d1726;font-size:13px;font-weight:800}.quiz-card{padding:18px}.quiz-card h3{margin:0 0 8px}.answer{display:block;width:100%;text-align:left;padding:12px;margin-top:9px;border:1px solid var(--line);border-radius:12px;background:#1a263b;font-size:14px}.answer.correct{border-color:#47d997;background:#173d38}.answer.wrong{border-color:#ff6974;background:#462538}.complete-lesson{width:100%;padding:14px;border-radius:13px;background:var(--coral);font-weight:800;margin-top:18px}.toast{position:fixed;left:50%;bottom:96px;transform:translateX(-50%);background:#eaf8ee;color:#143425;padding:11px 15px;border-radius:12px;font-size:13px;font-weight:700;box-shadow:0 9px 30px #0005;z-index:4}@keyframes pulse{50%{transform:scale(1.08)}}
.check-button{border-radius:11px;background:#263b5d;color:var(--sky);font-weight:700;padding:11px 12px;font-size:13px}