:root{--bg: #fff8ef;--card: #ffffff;--ink: #23304a;--muted: #6b7690;--primary: #ff8a3d;--primary-ink: #ffffff;--primary-dark: #e86f1f;--secondary: #e9eefb;--secondary-ink: #33406a;--listen: #4f8cff;--think: #9b6bff;--speak: #ff8a3d;--good: #2fb67c;--error: #d64545;--radius: 22px;color-scheme:light;font-family:ui-rounded,SF Pro Rounded,Nunito,Segoe UI,system-ui,sans-serif;color:var(--ink);background:var(--bg);-webkit-text-size-adjust:100%}*{box-sizing:border-box}body{margin:0;background:var(--bg);min-height:100dvh}.app{max-width:560px;margin:0 auto;min-height:100dvh;padding:max(16px,env(safe-area-inset-top)) 16px max(16px,env(safe-area-inset-bottom));display:flex;flex-direction:column}h1{font-size:1.6rem;line-height:1.25;margin:.4em 0}h2{font-size:1.1rem;margin:1.2em 0 .4em}p{line-height:1.5}.muted{color:var(--muted)}.small{font-size:.9rem}.error{color:var(--error);background:#fdecec;border-radius:14px;padding:10px 14px}.card{background:var(--card);border-radius:var(--radius);padding:24px 20px;box-shadow:0 6px 24px #23304a14;margin:auto 0;display:flex;flex-direction:column;gap:8px}.card.center{text-align:center;align-items:stretch}.owl{font-size:4.5rem;text-align:center;line-height:1}.owl.thinking{animation:bob 1.6s ease-in-out infinite}.btn{font:inherit;font-weight:700;border:none;border-radius:999px;padding:14px 22px;min-height:52px;cursor:pointer;touch-action:manipulation;transition:transform .08s ease,background .2s ease,opacity .2s ease}.btn:active:not(:disabled){transform:scale(.97)}.btn:disabled{opacity:.45;cursor:default}.btn.big{font-size:1.2rem;min-height:64px;margin-top:8px}.btn.primary{background:var(--primary);color:var(--primary-ink);box-shadow:0 4px 0 var(--primary-dark)}.btn.secondary{background:var(--secondary);color:var(--secondary-ink)}.btn:focus-visible{outline:3px solid var(--listen);outline-offset:3px}.dots{display:flex;justify-content:center;gap:8px;margin:12px 0}.dots span{width:12px;height:12px;border-radius:50%;background:var(--primary);animation:blink 1.2s infinite ease-in-out}.dots span:nth-child(2){animation-delay:.2s}.dots span:nth-child(3){animation-delay:.4s}.goals{list-style:none;padding:0;margin:4px 0 8px;display:flex;flex-direction:column;gap:8px;text-align:left}.goal{display:flex;gap:10px;align-items:flex-start;background:var(--secondary);border-radius:14px;padding:10px 12px}.goal-mark{font-size:1.2rem;line-height:1.3;color:var(--muted)}.goal.reached{background:#e3f7ee}.goal.reached .goal-mark{color:var(--good)}.progress{display:flex;align-items:center;gap:12px}.progress-bar{flex:1;height:14px;border-radius:999px;background:var(--secondary);overflow:hidden}.progress-fill{height:100%;background:var(--good);border-radius:999px;transition:width .6s ease}.progress-label{font-weight:700;font-size:.95rem;white-space:nowrap}.score{font-size:1.2rem}.talk{flex:1;display:flex;flex-direction:column;gap:12px;min-height:0;height:calc(100dvh - max(16px,env(safe-area-inset-top)) - max(16px,env(safe-area-inset-bottom)))}.mic{--level: 0;--color: var(--listen);display:flex;flex-direction:column;align-items:center;padding-top:8px}.mic-circle{width:132px;height:132px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--color) 16%,white);border:6px solid var(--color);transition:transform .12s ease-out,border-color .3s ease,background .3s ease}.mic-icon{font-size:3.4rem}.mic-label{margin:10px 0 0;font-size:1.35rem;font-weight:800;color:var(--color)}.mic-user-speaking .mic-circle{transform:scale(calc(1 + var(--level) * .25))}.mic-thinking{--color: var(--think)}.mic-thinking .mic-circle{border-style:dashed;animation:spin 3s linear infinite}.mic-thinking .mic-icon{animation:spin 3s linear infinite reverse}.mic-speaking{--color: var(--speak)}.mic-speaking .mic-circle{animation:pulse 1s ease-in-out infinite}.mic-ending{--color: var(--good)}.mic-connecting,.mic-lost{--color: var(--muted)}.transcript{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding:4px 2px;-webkit-overflow-scrolling:touch}.bubble{margin:0;padding:10px 14px;border-radius:18px;max-width:85%;font-size:1.05rem}.bubble.tutor{align-self:flex-start;background:var(--card);box-shadow:0 2px 8px #23304a0f;border-bottom-left-radius:6px}.bubble.schueler{align-self:flex-end;background:#dce8ff;border-bottom-right-radius:6px}.interim{color:var(--muted)}.talk-actions{display:flex;flex-direction:column;gap:8px}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{transform:scale(1.06)}}@keyframes bob{50%{transform:translateY(-8px)}}@keyframes blink{0%,80%,to{opacity:.25}40%{opacity:1}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}