:root{--bg:#f3f5f4;--surface:#fff;--surface-2:#f4f6f5;--ink:#16181a;--ink-2:#5d6461;--ink-3:#939a96;--line:#e6eae8;--dark:#141516;--primary:#1f5f5b;--primary-ink:#fff;--primary-soft:#e3efec;--accent:#d6683f;--accent-soft:#fbe7dd;--sand:#efe9df;--success:#2f8f5b;--success-soft:#e1f3e8;--danger:#c2442e;--danger-soft:#f9e0da;--radius:24px;--radius-sm:16px;--shadow:0 12px 32px #14181612, 0 1px 2px #1418160a;--shadow-sm:0 2px 10px #1418160f;--font:"Manrope", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--safe-bottom:env(safe-area-inset-bottom,0px)}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--ink);font-family:var(--font);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;margin:0;padding:0;font-size:16px;line-height:1.5}body{background:radial-gradient(120% 70% at 0% 0%, #e7f1ec 0%, #e7f1ec00 60%), radial-gradient(90% 60% at 100% 100%, #fbebe3 0%, #fbebe300 60%), var(--bg);background-attachment:fixed}button,input{font:inherit;color:inherit}a{color:inherit;text-decoration:none}#root{min-height:100dvh}.app{max-width:520px;padding:0 16px calc(170px + var(--safe-bottom));margin:0 auto}.topbar{background:linear-gradient(var(--bg) 70%, #f3f5f400);z-index:5;justify-content:space-between;align-items:center;gap:12px;padding:14px 0 12px;display:flex;position:sticky;top:0}.topbar .brand{letter-spacing:-.01em;white-space:nowrap;align-items:center;gap:10px;font-size:17px;font-weight:700;display:flex}@media (width<=380px){.topbar .brand{gap:8px;font-size:15px}.topbar .row{gap:8px}.chip-stat{padding:0 10px}}@media (width<=340px){.topbar .brand-name{display:none}.segment button{padding:7px 10px}}.topbar .brand img{width:34px;height:34px;box-shadow:var(--shadow-sm);border-radius:12px}.icon-btn{border:1px solid var(--line);background:var(--surface);cursor:pointer;width:44px;height:44px;box-shadow:var(--shadow-sm);border-radius:50%;justify-content:center;align-items:center;display:inline-flex}.icon-btn:active{transform:scale(.96)}.segment{background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow-sm);border-radius:999px;padding:3px;display:inline-flex}.segment button{color:var(--ink-2);cursor:pointer;background:0 0;border:0;border-radius:999px;min-height:38px;padding:7px 13px;font-size:13px;font-weight:700}.segment button[aria-pressed=true]{background:var(--dark);color:#fff}.chip-stat{background:var(--surface);border:1px solid var(--line);min-height:40px;box-shadow:var(--shadow-sm);border-radius:999px;align-items:center;gap:6px;padding:0 14px;font-size:14px;font-weight:700;display:inline-flex}h1,h2,h3{letter-spacing:-.02em;margin:0;line-height:1.2}h1{font-size:28px;font-weight:700}h2{font-size:21px;font-weight:700}h3{font-size:16px;font-weight:700}p{margin:0}.muted{color:var(--ink-2)}.eyebrow{letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);font-size:11px;font-weight:700}.ru{color:var(--ink);font-size:19px;font-weight:700}.ky{color:var(--ink-2);font-size:14px}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px}.card+.card{margin-top:14px}.card.soft{background:var(--surface-2);box-shadow:none}.stack{flex-direction:column;gap:14px;display:flex}.row{align-items:center;gap:12px;display:flex}.spread{justify-content:space-between}.hero{background:var(--dark);color:#fff;min-height:300px;box-shadow:var(--shadow);border-radius:28px;margin-top:6px;position:relative;overflow:hidden}.hero img{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.hero .over{background:linear-gradient(#14151600 30%,#1415168c 70%,#141516d9 100%),linear-gradient(90deg,#d6683f8c 0%,#d6683f00 55%);flex-direction:column;justify-content:flex-end;gap:8px;min-height:300px;padding:22px;display:flex;position:relative}.hero .over .eyebrow,.hero .over .muted{color:#ffffffd1}.hero h1{color:#fff;font-size:30px}.hero .segments{gap:6px;margin-top:6px;display:flex}.hero .segments i{background:#ffffff59;border-radius:999px;flex:1;height:4px}.hero .segments i.done{background:#fff}.hero .btn{margin-top:8px}.hero .btn.light{color:var(--ink);background:#fff}.tutor{grid-template-columns:88px 1fr;align-items:center;gap:16px;display:grid}.tutor img{object-fit:cover;background:var(--primary-soft);border-radius:22px;width:88px;height:88px}.tutor .name{letter-spacing:-.02em;font-size:20px;font-weight:700}.tutor .role{color:var(--ink-2);font-size:14px}.tutor .about{border-top:1px solid var(--line);grid-column:1/-1;padding-top:14px}.tutor .about strong{margin-bottom:6px;font-size:17px;display:block}.tutor .about p{color:var(--ink-2);font-size:15px}.stats{grid-template-columns:1fr 1fr;gap:12px;display:grid}.stat{background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:20px;gap:4px;padding:16px;display:grid}.stat .icon{background:var(--surface-2);border-radius:50%;place-items:center;width:34px;height:34px;margin-bottom:6px;display:grid}.stat .value{letter-spacing:-.02em;font-size:24px;font-weight:700}.stat .label{color:var(--ink-2);font-size:13px}.striped{--fill:0;background:repeating-linear-gradient(135deg, var(--surface-2) 0 4px, #fff 4px 7px);border:1px solid var(--line);border-radius:999px;height:8px;margin-top:8px;overflow:hidden}.striped i{height:100%;width:calc(var(--fill) * 1%);background:repeating-linear-gradient(135deg, var(--primary) 0 4px, #4f8f8a 4px 7px);border-radius:999px;transition:width .4s;display:block}.striped.warm i{background:repeating-linear-gradient(135deg, var(--success) 0 4px, #6fbf8f 4px 7px)}.lesson-item{background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);cursor:pointer;border-radius:20px;grid-template-columns:68px 1fr auto;align-items:center;gap:14px;padding:12px;transition:transform .12s;display:grid}.lesson-item:active{transform:scale(.985)}.lesson-item img,.lesson-item .thumb{object-fit:cover;background:var(--sand);border-radius:16px;width:68px;height:68px}.lesson-item .meta{color:var(--ink-2);font-size:13px}.lesson-item .striped{margin-top:6px}.lesson-item .status{background:var(--surface-2);color:var(--ink-2);white-space:nowrap;border-radius:999px;padding:6px 10px;font-size:12px;font-weight:700}.lesson-item .status.done{background:var(--success-soft);color:var(--success)}.lesson-item .status.active{background:var(--accent-soft);color:var(--accent)}.stepper{gap:5px;margin:8px 0 18px;display:flex}.stepper i{background:var(--line);border-radius:999px;flex:1;height:5px}.stepper i.done{background:var(--primary)}.stepper i.current{background:var(--accent)}.btn{cursor:pointer;border:0;border-radius:999px;justify-content:center;align-items:center;gap:8px;width:100%;min-height:54px;padding:0 22px;font-size:16px;font-weight:700;transition:transform .12s,box-shadow .12s,background .12s;display:inline-flex}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.4;cursor:default;transform:none}.btn.primary{background:var(--dark);color:#fff;box-shadow:0 10px 24px #14151638}.btn.accent{background:linear-gradient(135deg, #e07a4f, var(--accent));color:#fff;box-shadow:0 10px 24px #d6683f4d}.btn.ghost{background:var(--surface);color:var(--ink);border:1px solid var(--line);box-shadow:var(--shadow-sm)}.btn.small{width:auto;min-height:42px;padding:0 16px;font-size:14px}.actionbar{padding:12px 16px calc(14px + var(--safe-bottom));background:linear-gradient(#f3f5f400, var(--bg) 40%);z-index:5;position:fixed;bottom:0;left:0;right:0}.actionbar>div{gap:10px;max-width:520px;margin:0 auto;display:flex}.flashcard{perspective:1000px;cursor:pointer;height:150px}.flashcard .inner{width:100%;height:100%;transform-style:preserve-3d;transition:transform .45s cubic-bezier(.2,.8,.2,1);position:relative}.flashcard.flipped .inner{transform:rotateY(180deg)}.flashcard .face{backface-visibility:hidden;border-radius:var(--radius);text-align:center;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);place-items:center;padding:18px;font-size:24px;font-weight:700;display:grid;position:absolute;inset:0}.flashcard .face.back{background:var(--primary);color:var(--primary-ink);border-color:var(--primary);transform:rotateY(180deg)}.card-nav{color:var(--ink-3);justify-content:space-between;align-items:center;margin-top:12px;font-size:14px;font-weight:700;display:flex}.dialogue-art{aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius);width:100%;box-shadow:var(--shadow);background:var(--sand)}.line{border-top:1px solid var(--line);grid-template-columns:40px 1fr;gap:12px;padding:12px 0;display:grid}.line:first-of-type{border-top:0}.avatar{background:var(--primary-soft);width:40px;height:40px;color:var(--primary);border-radius:50%;place-items:center;font-size:15px;font-weight:700;display:grid}.avatar.b{background:var(--accent-soft);color:var(--accent)}.line .speaker{letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);font-size:11px;font-weight:700}.audio{background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow-sm);border-radius:999px;align-items:center;gap:14px;margin:14px 0;padding:10px 14px 10px 10px;display:flex}.audio button{background:var(--dark);color:#fff;cursor:pointer;border:0;border-radius:50%;flex:none;place-items:center;width:46px;height:46px;display:grid}.audio .bar{background:var(--surface-2);border-radius:999px;flex:1;height:6px;overflow:hidden}.audio .bar i{background:var(--primary);width:0;height:100%;transition:width .2s linear;display:block}.audio .time{font-variant-numeric:tabular-nums;color:var(--ink-2);font-size:13px;font-weight:700}.audio.unavailable{background:var(--surface-2);color:var(--ink-2);box-shadow:none;padding:12px 16px}.pattern{border-left:3px solid var(--accent);padding-left:14px}.pattern .ru{font-size:21px}.pattern ul{gap:8px;margin:10px 0 0;padding:0;list-style:none;display:grid}.pattern li{background:var(--surface-2);border-radius:12px;padding:10px 12px}.note{background:var(--accent-soft);color:var(--ink);border-radius:16px;gap:10px;padding:12px 14px;font-size:15px;display:flex}.note.teal{background:var(--primary-soft)}.note .label{color:var(--accent);white-space:nowrap;font-weight:700}.note.teal .label{color:var(--primary)}.option{text-align:left;border:1.5px solid var(--line);background:var(--surface);cursor:pointer;width:100%;min-height:56px;box-shadow:var(--shadow-sm);border-radius:18px;align-items:center;gap:12px;padding:12px 14px;font-size:17px;font-weight:700;transition:border-color .12s,background .12s;display:flex}.option .badge{background:var(--surface-2);width:26px;height:26px;color:var(--ink-3);border-radius:8px;flex:none;place-items:center;font-size:12px;display:grid}.option[aria-pressed=true]{border-color:var(--dark);background:var(--surface)}.option[aria-pressed=true] .badge{background:var(--dark);color:#fff}.option.correct{border-color:var(--success);background:var(--success-soft)}.option.wrong{border-color:var(--danger);background:var(--danger-soft)}.input{border:1.5px solid var(--line);background:var(--surface);border-radius:18px;outline:none;width:100%;min-height:56px;padding:14px 16px;font-size:19px;font-weight:700}.input:focus{border-color:var(--dark)}.gap-text{font-size:23px;font-weight:700;line-height:1.45}.gap-text mark{background:var(--accent-soft);color:var(--accent);border-radius:8px;padding:0 8px}.chips{flex-wrap:wrap;gap:10px;display:flex}.chip{border:1.5px solid var(--line);background:var(--surface);cursor:pointer;min-height:46px;box-shadow:0 2px 0 var(--line);border-radius:14px;padding:0 16px;font-size:17px;font-weight:700}.chip:active{box-shadow:none;transform:translateY(1px)}.chip.used{opacity:.35}.chip.selected{border-color:var(--dark);background:var(--surface-2)}.chip.paired{border-color:var(--primary);background:var(--primary-soft);opacity:1}.chip.matched{border-color:var(--success);background:var(--success-soft);opacity:1}.chip.wrong{border-color:var(--danger);background:var(--danger-soft);opacity:1}.chip.placed{min-height:40px;padding:0 12px;font-size:16px}.bank .chip.used{visibility:hidden}.sentence-slot{border:1.5px dashed var(--line);background:#fff9;border-radius:18px;flex-wrap:wrap;align-items:center;gap:8px;min-height:62px;padding:10px 12px;font-size:19px;font-weight:700;display:flex}.sentence-slot.ok{border-color:var(--success)}.sentence-slot.bad{border-color:var(--danger)}.pairs{grid-template-columns:1fr 1fr;gap:10px;display:grid}.pairs .chip{white-space:normal;border-radius:16px;width:100%;min-height:56px;padding:10px 12px;font-size:15px;line-height:1.25}.feedback{border-radius:16px;align-items:center;gap:10px;padding:14px 16px;font-weight:700;animation:.25s pop;display:flex}.feedback.ok{background:var(--success-soft);color:var(--success)}.feedback.bad{background:var(--danger-soft);color:var(--danger)}@keyframes pop{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}.record{place-items:center;gap:12px;padding:24px 16px;display:grid}.record button.mic{background:linear-gradient(135deg, #e07a4f, var(--accent));color:#fff;cursor:pointer;border:0;border-radius:50%;place-items:center;width:92px;height:92px;display:grid;box-shadow:0 14px 30px #d6683f59}.record button.mic.on{animation:1.2s ease-in-out infinite pulse}@keyframes pulse{0%,to{box-shadow:0 0 #d6683f73}50%{box-shadow:0 0 0 18px #d6683f00}}.result{text-align:center;padding:28px 20px}.result .big{letter-spacing:-.03em;color:var(--ink);margin:12px 0 8px;font-size:60px;font-weight:700;line-height:1}.skeleton{border-radius:var(--radius);background:linear-gradient(90deg, var(--surface-2), var(--surface), var(--surface-2));background-size:200% 100%;min-height:90px;animation:1.2s linear infinite shimmer}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.fade{animation:.25s fade}@keyframes fade{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.sr-only{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}.tabs{border-bottom:1px solid var(--line);gap:22px;margin:2px 0 14px;display:flex}.tabs button{min-height:44px;color:var(--ink-3);cursor:pointer;background:0 0;border:0;border-bottom:2px solid #0000;margin-bottom:-1px;padding:8px 2px 10px;font-size:15px;font-weight:700}.tabs button[aria-selected=true]{color:var(--ink);border-bottom-color:var(--success)}.section-head{justify-content:space-between;align-items:center;font-size:13px;font-weight:700;display:flex}.section-head .eyebrow{color:var(--accent)}.streak{background:var(--surface);border:1px solid var(--line);min-height:40px;box-shadow:var(--shadow-sm);color:var(--accent);border-radius:999px;align-items:center;gap:4px;padding:0 12px;font-size:14px;font-weight:700;animation:.25s pop;display:inline-flex}.lesson-hero{background:var(--dark);color:#fff;min-height:240px;box-shadow:var(--shadow);border-radius:28px;position:relative;overflow:hidden}.lesson-hero img{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.lesson-hero .over{background:linear-gradient(#14151600 30%,#141516cc 100%),linear-gradient(90deg,#d6683f80 0%,#d6683f00 55%);flex-direction:column;justify-content:flex-end;gap:6px;min-height:240px;padding:22px;display:flex;position:relative}.lesson-hero .eyebrow{color:#fff;opacity:.85}.lesson-hero h1{color:#fff;font-size:28px}.plan{gap:8px;margin:12px 0 0;padding:0;list-style:none;display:grid}.plan li{background:var(--surface-2);border-radius:14px;align-items:center;gap:12px;padding:10px 12px;font-weight:700;display:flex}.plan li .dot{background:var(--surface);width:28px;height:28px;color:var(--ink-2);box-shadow:var(--shadow-sm);border-radius:50%;flex:none;place-items:center;font-size:13px;font-weight:700;display:grid}.plan li.done .dot{background:var(--success);color:#fff}.plan li.active{background:var(--accent-soft)}.plan li.active .dot{background:var(--accent);color:#fff}.aidos{--level:0;border-radius:var(--radius);background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);grid-template-columns:84px 1fr;align-items:center;gap:14px;padding:14px;display:grid}.aidos .audio{box-shadow:none;background:var(--surface-2);border-color:#0000;grid-column:1/-1;margin:0}.aidos .face{background:var(--primary-soft);width:84px;height:84px;box-shadow:0 0 0 calc(var(--level) * 14px) #1f5f5b24;transform:translateY(calc(var(--level) * -3px));border-radius:50%;transition:box-shadow .1s linear,transform .1s linear;position:relative;overflow:hidden}.aidos .face img{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.aidos .face .mouth{opacity:0;transition:opacity 60ms}.aidos.talking .face .mouth{opacity:1}.aidos .who{flex-direction:column;gap:2px;min-width:0;display:flex}.aidos .who strong{font-size:17px}.aidos .who .muted{font-size:13px}.eq{align-items:center;gap:3px;height:36px;margin-top:8px;display:flex}.eq i{background:var(--primary);opacity:.85;border-radius:999px;flex:1;height:8%;transition:height 80ms linear}.aidos-face.sm{object-fit:cover;background:var(--primary-soft);border-radius:50%;flex:none;width:40px;height:40px}.word-grid{grid-template-columns:1fr 1fr;gap:10px;display:grid}.word-grid.list{grid-template-columns:1fr}.word-card{background:var(--surface);box-shadow:var(--shadow-sm);border:1px solid var(--line);border-radius:18px;gap:8px;padding:10px;display:grid;position:relative}.word-grid.list .word-card{grid-template-columns:64px 1fr auto;align-items:center}.word-card img,.word-card .thumb{aspect-ratio:1;object-fit:cover;background:var(--sand);border-radius:14px;width:100%}.word-grid.list .word-card img,.word-grid.list .word-card .thumb{width:64px;height:64px}.word-card .ru{font-size:16px}.word-card .ky{font-size:13px}.play-word{background:var(--dark);color:#fff;cursor:pointer;width:40px;height:40px;box-shadow:var(--shadow-sm);border:0;border-radius:50%;place-items:center;display:grid;position:absolute;top:14px;right:14px}.word-grid.list .play-word{position:static}.sheet{z-index:6;padding:16px 16px calc(16px + var(--safe-bottom));border-radius:24px 24px 0 0;animation:.25s slideUp;position:fixed;bottom:0;left:0;right:0}.sheet>*{max-width:520px;margin:0 auto}.sheet .verdict{align-items:center;gap:12px;margin-bottom:12px;font-size:18px;display:flex}.sheet .verdict small{font-size:15px;font-weight:600;display:block}.sheet.ok{background:var(--success-soft);color:var(--success)}.sheet.bad{background:var(--danger-soft);color:var(--danger)}.sheet .btn{background:var(--success);color:#fff}.sheet.bad .btn{background:var(--danger)}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:none}}@keyframes shake{10%,90%{transform:translate(-2px)}20%,80%{transform:translate(4px)}30%,50%,70%{transform:translate(-6px)}40%,60%{transform:translate(6px)}}.shake{animation:.45s cubic-bezier(.36,.07,.19,.97) shake}.bubble{border-radius:18px;padding:10px 14px;font-size:16px}.bubble.you{background:var(--surface-2);font-weight:600}.bubble.teacher{background:var(--primary-soft)}@media (prefers-reduced-motion:reduce){.fade,.shake,.sheet,.streak,.feedback{animation:none}.aidos .face{transition:none;transform:none}.eq i{transition:none}}.aidos{text-align:center;flex-direction:column;align-items:center;gap:2px;padding:18px 14px 14px;display:flex}.aidos .stage{grid-template-columns:1fr 96px 1fr;align-items:center;gap:12px;width:100%;display:grid}.aidos.still .stage{grid-template-columns:1fr}.aidos .face{width:96px;height:96px;margin:0 auto}.aidos .eq{height:44px;margin:0}.aidos .eq.mirror{transform:scaleX(-1)}.aidos .name{margin-top:8px;font-size:18px;font-weight:700}.aidos .role{font-size:13px}.aidos .transcript{color:var(--ink-2);margin-top:10px;font-size:15px;font-style:italic;line-height:1.55}.aidos .transcript b{color:var(--ink);font-style:normal}.aidos .audio{width:100%;margin-top:12px}.bubbles{flex-direction:column;gap:10px;display:flex}.bubbles .bubble{text-align:left;cursor:pointer;max-width:88%;font:inherit;border:0;border-radius:20px;flex-direction:column;gap:2px;padding:12px 14px;display:flex}.bubbles .bubble.left{background:var(--primary-soft);border-bottom-left-radius:6px;align-self:flex-start}.bubbles .bubble.right{background:var(--accent-soft);border-bottom-right-radius:6px;align-self:flex-end}.bubbles .bubble:active{transform:scale(.98)}.bubbles .speaker{letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);font-size:11px;font-weight:700}.bubbles .ru{font-size:17px}.bubbles .ky{color:var(--ink-2);font-size:14px}.tags{flex-wrap:wrap;gap:10px;margin-top:6px;font-size:14px;font-weight:700;display:flex}.tags span{color:var(--ink-3)}.tags span:first-child{color:var(--ink)}textarea.input{resize:vertical;min-height:96px;font-family:inherit;font-size:18px;font-weight:500;line-height:1.4}
