@import"https://fonts.googleapis.com/css2?family=Baloo+2:wght@500;600;700;800&family=Be+Vietnam+Pro:wght@400;500;600;700;800&display=swap";:root{--cream: #FFF8ED;--card: #FFFFFF;--teal: #1B7A6B;--teal-dark: #135F53;--coral: #FF6B4A;--coral-dark: #E85535;--yellow: #FFC857;--ink: #2B2118;--ink-soft: #6B5F52;--line: #F0E6D6;--wrong: #E85535;--wrong-bg: #FFEEE8;--right-bg: #E8F5F0;--bubble-ai: #FFFFFF;--bubble-user: #1B7A6B}.tutor,.tutor *{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}.tutor{font-family:Be Vietnam Pro,sans-serif;background:var(--cream);color:var(--ink);min-height:100vh;display:flex;justify-content:center}.phone{width:100%;max-width:480px;height:100vh;height:100dvh;background:var(--cream);display:flex;flex-direction:column;position:relative;overflow:hidden}.setup-topbar{padding:18px 20px 10px;display:flex;align-items:center;gap:10px;flex-shrink:0}.back-btn{width:36px;height:36px;border-radius:12px;background:var(--card);border:2px solid var(--line);display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0}.back-btn svg{width:18px;height:18px}.setup-head{padding:4px 20px;flex-shrink:0}.setup-eyebrow{font-family:"Baloo 2";font-weight:700;font-size:12px;color:var(--teal);letter-spacing:.06em;margin-bottom:6px}.setup-title{font-family:"Baloo 2";font-weight:800;font-size:24px;line-height:1.3}.setup-sub{color:var(--ink-soft);font-size:14px;margin-top:6px}.setup-list{padding:18px 20px 20px;display:flex;flex-direction:column;gap:10px;overflow-y:auto}.grid-chips{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.grade-chip{background:var(--card);border:2px solid var(--line);border-radius:16px;padding:18px 0;text-align:center;cursor:pointer}.grade-chip b{display:block;font-family:"Baloo 2";font-weight:800;font-size:22px;color:var(--ink)}.grade-chip span{font-size:11px;color:var(--ink-soft)}.grade-chip:active,.grade-chip.selected{border-color:var(--teal);background:var(--right-bg)}.subject-chip{display:flex;align-items:center;gap:12px;background:var(--card);border:2px solid var(--line);border-radius:16px;padding:14px 16px;cursor:pointer;font-weight:600;font-size:15px}.subject-chip .sico{font-size:22px}.subject-chip:active{border-color:var(--teal);background:var(--right-bg)}.btn-primary{font-family:"Baloo 2",sans-serif;font-weight:700;font-size:17px;color:#fff;background:var(--coral);border:none;border-radius:18px;padding:16px 24px;width:100%;cursor:pointer;box-shadow:0 4px 0 var(--coral-dark);transition:transform .08s,box-shadow .08s}.btn-primary:active{transform:translateY(4px);box-shadow:0 0 0 var(--coral-dark)}.screen{flex:1;display:flex;flex-direction:column;overflow:hidden}.chat-header{flex-shrink:0;display:flex;align-items:center;gap:12px;padding:16px 16px 14px;background:var(--cream);border-bottom:1px solid var(--line)}.chat-avatar{width:42px;height:42px;border-radius:50%;background:var(--yellow);display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative}.chat-avatar svg{width:30px;height:30px}.chat-avatar .pulse-ring{position:absolute;top:-4px;right:-4px;bottom:-4px;left:-4px;border-radius:50%;border:2px solid var(--teal);opacity:0}.chat-avatar.speaking .pulse-ring{animation:ring 1.2s ease-out infinite}@keyframes ring{0%{opacity:.6;transform:scale(1)}to{opacity:0;transform:scale(1.35)}}.chat-title{flex:1;min-width:0}.chat-title b{font-family:"Baloo 2";font-weight:700;font-size:15px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-title span{font-size:12px;color:var(--teal);font-weight:600;display:flex;align-items:center;gap:5px}.status-dot{width:6px;height:6px;border-radius:50%;background:var(--teal)}.status-dot.listening{background:var(--coral);animation:blink 1s infinite}@keyframes blink{50%{opacity:.3}}.chat-close{width:32px;height:32px;border-radius:10px;background:var(--card);border:2px solid var(--line);display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:14px;color:var(--ink-soft)}.chat-scroll{flex:1;overflow-y:auto;padding:16px 14px 10px;display:flex;flex-direction:column;gap:12px}.msg-row{display:flex;gap:8px;max-width:100%;animation:msgIn .35s cubic-bezier(.16,1,.3,1)}@keyframes msgIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.msg-row.ai{align-self:flex-start}.msg-row.user{align-self:flex-end;flex-direction:row-reverse}.msg-avatar-sm{width:26px;height:26px;border-radius:50%;background:var(--yellow);flex-shrink:0;display:flex;align-items:center;justify-content:center;margin-top:2px}.msg-avatar-sm svg{width:18px;height:18px}.bubble{max-width:78%;padding:12px 14px;border-radius:18px;font-size:14.5px;line-height:1.55}.bubble.ai{background:var(--bubble-ai);border:2px solid var(--line);border-top-left-radius:5px;color:var(--ink)}.bubble.user{background:var(--bubble-user);color:#fff;border-top-right-radius:5px}.voice-line{display:flex;align-items:center;gap:10px}.voice-play{width:30px;height:30px;border-radius:50%;background:var(--teal);border:none;flex-shrink:0;display:flex;align-items:center;justify-content:center;cursor:pointer}.voice-play svg{width:13px;height:13px;fill:#fff}.mini-wave{display:flex;align-items:center;gap:3px;height:18px}.mini-wave span{width:3px;border-radius:3px;background:var(--line)}.mini-wave.playing span{background:var(--teal);animation:mwave .9s ease-in-out infinite}.mini-wave span:nth-child(1){height:35%;animation-delay:0s}.mini-wave span:nth-child(2){height:70%;animation-delay:.1s}.mini-wave span:nth-child(3){height:100%;animation-delay:.2s}.mini-wave span:nth-child(4){height:50%;animation-delay:.3s}.mini-wave span:nth-child(5){height:80%;animation-delay:.4s}.mini-wave span:nth-child(6){height:40%;animation-delay:.5s}.mini-wave span:nth-child(7){height:60%;animation-delay:.6s}@keyframes mwave{0%,to{transform:scaleY(.4)}50%{transform:scaleY(1)}}.voice-spinner{width:16px;height:16px;border-radius:50%;border:2.5px solid var(--line);border-top-color:var(--teal);flex-shrink:0;animation:vspin .8s linear infinite}@keyframes vspin{to{transform:rotate(360deg)}}.voice-loading-label{font-size:11.5px;color:var(--ink-soft);font-weight:600}.voice-play:disabled{opacity:.5;cursor:default}.bubble-caption{margin-top:8px;white-space:pre-wrap}.typing-bubble{display:flex;gap:4px;padding:14px 16px}.typing-bubble span{width:7px;height:7px;border-radius:50%;background:var(--ink-soft);opacity:.4;animation:tbounce 1.2s infinite}.typing-bubble span:nth-child(2){animation-delay:.15s}.typing-bubble span:nth-child(3){animation-delay:.3s}@keyframes tbounce{0%,60%,to{transform:translateY(0);opacity:.4}30%{transform:translateY(-5px);opacity:1}}.widget-card{max-width:88%;align-self:flex-start;background:var(--card);border:2px solid var(--teal);border-radius:5px 18px 18px;padding:14px;display:flex;flex-direction:column;gap:10px;animation:msgIn .35s cubic-bezier(.16,1,.3,1)}.widget-kicker{font-family:"Baloo 2";font-weight:700;font-size:11px;color:var(--teal);letter-spacing:.04em}.widget-q{font-weight:700;font-size:14.5px;line-height:1.4;white-space:pre-wrap}.opt-mini{display:flex;align-items:center;gap:10px;background:var(--cream);border:2px solid var(--line);border-radius:14px;padding:10px 12px;font-size:14px;font-weight:600;cursor:pointer}.opt-mini-letter{width:24px;height:24px;border-radius:50%;background:var(--card);border:2px solid var(--line);display:flex;align-items:center;justify-content:center;font-family:"Baloo 2";font-weight:700;font-size:12px;color:var(--ink-soft);flex-shrink:0}.opt-mini.correct{border-color:var(--teal);background:var(--right-bg)}.opt-mini.correct .opt-mini-letter{background:var(--teal);color:#fff;border-color:var(--teal)}.opt-mini.incorrect{border-color:var(--wrong);background:var(--wrong-bg)}.opt-mini.incorrect .opt-mini-letter{background:var(--wrong);color:#fff;border-color:var(--wrong)}.opt-mini.disabled{pointer-events:none}.essay-mini-input{width:100%;border:2px solid var(--line);border-radius:12px;padding:10px 12px;font-family:Be Vietnam Pro;font-size:14px;resize:vertical;min-height:64px;background:var(--cream)}.essay-mini-input:focus{outline:none;border-color:var(--teal)}.solution-box{background:var(--right-bg);border-radius:12px;padding:10px 12px;font-size:13.5px;line-height:1.5;white-space:pre-wrap}.selfcheck-row{display:flex;gap:8px}.selfcheck-btn{flex:1;padding:10px 6px;border-radius:12px;border:2px solid var(--line);background:var(--cream);font-family:"Baloo 2";font-weight:700;font-size:13px;text-align:center;cursor:pointer}.selfcheck-btn.yes:active{border-color:var(--teal);background:var(--right-bg)}.selfcheck-btn.no:active{border-color:var(--wrong);background:var(--wrong-bg)}.mini-btn{align-self:flex-end;background:var(--teal);color:#fff;border:none;border-radius:10px;padding:7px 14px;font-family:"Baloo 2";font-weight:700;font-size:12px;cursor:pointer}.mini-btn:disabled{background:#d8cbb8;cursor:not-allowed}.mini-btn.block{align-self:stretch;padding:12px;font-size:13px}.mini-btn.ghost{background:var(--card);color:var(--ink);border:2px solid var(--line)}.mini-btn.ghost:disabled{opacity:.5;cursor:not-allowed}.read-hint{font-size:12px;color:var(--ink-soft);font-weight:600;text-align:center;animation:blink 1.6s infinite}.voicebar{flex-shrink:0;padding:12px 16px calc(14px + env(safe-area-inset-bottom));background:var(--cream);border-top:1px solid var(--line);display:flex;align-items:center;gap:12px}.text-fallback{flex:1;background:var(--card);border:2px solid var(--line);border-radius:20px;padding:11px 16px;font-size:13px;color:var(--ink-soft);display:flex;align-items:center}.big-mic{width:56px;height:56px;border-radius:50%;background:var(--coral);border:none;cursor:pointer;flex-shrink:0;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 0 var(--coral-dark);position:relative}.big-mic:active{transform:translateY(4px);box-shadow:none}.big-mic:disabled{background:var(--line);box-shadow:none;cursor:not-allowed}.big-mic:disabled:active{transform:none}.text-fallback:disabled{opacity:.6}.big-mic.listening{background:var(--teal);box-shadow:0 4px 0 var(--teal-dark)}.big-mic svg{width:24px;height:24px;fill:#fff}.listen-ring{position:absolute;top:-6px;right:-6px;bottom:-6px;left:-6px;border-radius:50%;border:2px solid var(--teal);opacity:0}.big-mic.listening .listen-ring{animation:ring 1s ease-out infinite}.progress-strip{display:flex;gap:5px;padding:0 16px 10px;flex-shrink:0}.progress-strip .seg{flex:1;height:5px;border-radius:10px;background:var(--line)}.progress-strip .seg.done{background:var(--teal)}.progress-strip .seg.active{background:var(--yellow)}.summary-card{background:var(--right-bg);border:2px solid var(--teal);border-radius:18px;padding:16px;text-align:center;max-width:88%;align-self:center}.summary-card .big-emoji{font-size:34px;margin-bottom:4px}.summary-card b{font-family:"Baloo 2";font-size:18px;display:block;margin-bottom:4px}.summary-card span{font-size:13px;color:var(--ink-soft)}.summary-actions{display:flex;flex-direction:column;gap:8px;max-width:88%;align-self:center;width:88%}.progress-lesson-row{display:flex;align-items:center;gap:12px;background:var(--card);border:2px solid var(--line);border-radius:16px;padding:14px 16px;cursor:pointer}.progress-lesson-row .pl-icon{font-size:24px;width:32px;text-align:center;flex-shrink:0}.progress-lesson-row .pl-body{flex:1;min-width:0}.progress-lesson-row .pl-title{font-size:14px;font-weight:700}.progress-lesson-row .pl-bar-row{display:flex;align-items:center;gap:8px;margin-top:6px}.progress-lesson-row .pl-bar{flex:1;height:6px;border-radius:10px;background:var(--line);overflow:hidden}.progress-lesson-row .pl-bar-fill{height:100%;border-radius:10px}.progress-lesson-row .pl-pct{font-size:11px;font-weight:700;color:var(--ink-soft)}.badge{font-size:10px;font-weight:700;font-family:"Baloo 2";padding:3px 8px;border-radius:10px;white-space:nowrap}.badge.mastered{background:var(--right-bg);color:var(--teal-dark)}.badge.review{background:#fff3d6;color:#a8730a}.badge.notyet{background:var(--wrong-bg);color:var(--wrong)}.badge.notstarted{background:var(--line);color:var(--ink-soft)}.badge.inprogress{background:#ffe4dc;color:var(--coral-dark)}.legend-row{display:flex;flex-wrap:wrap;gap:8px;padding:0 20px 14px}.chapter-head{font-family:"Baloo 2";font-weight:700;font-size:13px;color:var(--ink-soft);letter-spacing:.02em;margin-top:6px}