:root{--bg: #f7f6f3;--surface: #ffffff;--text: #1e1b18;--muted: #6b6560;--border: #e6e2dc;--accent: #3f6f66;--accent-contrast: #ffffff;--radius: 14px;--shadow: 0 1px 3px rgba(0, 0, 0, .06), 0 6px 24px rgba(0, 0, 0, .04);color-scheme:light dark;font-family:Segoe UI,Assistant,system-ui,-apple-system,sans-serif;line-height:1.6}@media(prefers-color-scheme:dark){:root{--bg: #17150f;--surface: #221f18;--text: #ece7df;--muted: #a49d92;--border: #34302a;--accent: #7fb3a8;--accent-contrast: #12100b;--shadow: 0 1px 3px rgba(0, 0, 0, .4), 0 6px 24px rgba(0, 0, 0, .3)}}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--text);min-height:100vh;-webkit-font-smoothing:antialiased}#root{min-height:100vh;display:flex;flex-direction:column}.ltr{direction:ltr;unicode-bidi:isolate}.app-shell{width:100%;max-width:760px;margin-inline:auto;padding:clamp(16px,4vw,32px);display:flex;flex-direction:column;gap:24px;flex:1}.app-header{display:flex;align-items:center;gap:12px}.app-header h1{font-size:clamp(1.4rem,4vw,1.9rem);margin:0;font-weight:700}.app-header .mark{inline-size:44px;block-size:44px;border-radius:12px;background:var(--accent);color:var(--accent-contrast);display:grid;place-items:center;font-size:1.4rem;flex:none}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:clamp(18px,4vw,28px)}.card h2{margin-block-start:0;font-size:1.15rem}.muted{color:var(--muted)}.badge{display:inline-block;font-size:.8rem;padding:2px 10px;border-radius:999px;background:color-mix(in srgb,var(--accent) 16%,transparent);color:var(--accent);border:1px solid color-mix(in srgb,var(--accent) 30%,transparent)}.app-shell.chat{block-size:100vh;max-block-size:100vh;gap:16px;padding-block-end:16px}.app-header .end-btn{margin-inline-start:auto;font:inherit;font-size:.85rem;padding:8px 14px;border-radius:10px;border:1px solid var(--border);background:var(--surface);color:var(--muted);cursor:pointer}.app-header .end-btn:disabled{opacity:.5;cursor:default}.transcript{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:12px;padding:4px}.bubble{max-inline-size:82%;padding:12px 16px;border-radius:16px;box-shadow:var(--shadow)}.bubble-text{white-space:pre-wrap;overflow-wrap:anywhere}.bubble.tutor{align-self:flex-start;background:var(--surface);border:1px solid var(--border);border-start-start-radius:4px}.bubble.learner{align-self:flex-end;background:var(--accent);color:var(--accent-contrast);border-start-end-radius:4px}.typing{display:inline-flex;gap:5px;align-items:center}.typing span{inline-size:7px;block-size:7px;border-radius:50%;background:var(--muted);animation:blink 1.2s infinite ease-in-out both}.typing span:nth-child(2){animation-delay:.2s}.typing span:nth-child(3){animation-delay:.4s}@keyframes blink{0%,80%,to{opacity:.2}40%{opacity:1}}.composer{display:flex;gap:10px;align-items:flex-end}.composer textarea{flex:1;resize:none;font:inherit;padding:12px 14px;border-radius:12px;border:1px solid var(--border);background:var(--surface);color:var(--text);max-block-size:160px}.composer textarea:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.send-btn{font:inherit;font-weight:600;padding:12px 20px;border-radius:12px;border:none;background:var(--accent);color:var(--accent-contrast);cursor:pointer}.send-btn:disabled{opacity:.5;cursor:default}.app-header .back-btn{font:inherit;font-size:1.5rem;line-height:1;inline-size:36px;block-size:36px;border-radius:10px;border:1px solid var(--border);background:var(--surface);color:var(--text);cursor:pointer;transform:scaleX(-1)}.app-shell.centered{align-items:center;justify-content:center}.learner-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}.learner-card{font:inherit;text-align:start;display:flex;flex-direction:column;gap:6px;padding:20px;min-block-size:96px;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface);box-shadow:var(--shadow);cursor:pointer;transition:transform .08s ease,border-color .08s ease}.learner-card:hover{transform:translateY(-2px);border-color:var(--accent)}.learner-name{font-size:1.15rem;font-weight:700}.learner-meta{font-size:.85rem}.learner-card.add{align-items:center;justify-content:center;border-style:dashed;background:transparent}.learner-card.add .plus{font-size:1.8rem;color:var(--accent)}.add-form label{display:block;margin-block:14px 4px;font-size:.9rem}.add-form input,.add-form select{display:block;inline-size:100%;font:inherit;margin-block-start:6px;padding:10px 12px;border-radius:10px;border:1px solid var(--border);background:var(--bg);color:var(--text)}.add-form .small{font-size:.8rem;margin-block:4px 0}.form-actions{display:flex;gap:10px;margin-block-start:18px}.ghost-btn{font:inherit;padding:12px 18px;border-radius:12px;border:1px solid var(--border);background:transparent;color:var(--muted);cursor:pointer}