.tutor-layout{display:grid;grid-template-columns:minmax(230px,300px) minmax(0,1fr);gap:24px;align-items:start}.tutor-settings{position:sticky;top:18px}.tutor-settings label,.tutor-conversation label{display:block;margin:18px 0 7px;font-size:13px;font-weight:600}.tutor-settings select,.tutor-conversation textarea{width:100%;box-sizing:border-box;min-width:0}.tutor-settings button{display:block;width:100%;margin-top:12px}.tutor-method{border-top:1px solid var(--line);margin-top:24px;padding-top:12px}.tutor-method p,.tutor-privacy{font-size:12px;line-height:1.65}.tutor-messages{height:430px;max-height:58dvh;min-height:240px;overflow-y:auto;overscroll-behavior:contain;background:#f5f7ef;border:1px solid var(--line);border-radius:14px;padding:16px}.tutor-message{background:#fff;border:1px solid #e1e7da;border-radius:14px;padding:16px;margin-bottom:15px}.tutor-user{background:#e8efd9;margin-left:25px}.tutor-message strong{display:block;font-size:11px;letter-spacing:.7px;text-transform:uppercase;margin-bottom:9px;color:#4f6c43}.tutor-message>div{white-space:pre-wrap;overflow-wrap:anywhere;font-size:15px;line-height:1.8}.tutor-welcome{padding:35px 10px;text-align:center}.tutor-welcome>span{display:block;font-size:24px;color:#153e37}.tutor-welcome p{font-size:14px;color:var(--muted)}.tutor-quick{display:flex;flex-wrap:wrap;gap:8px;margin:15px 0}.tutor-quick button{font-size:12px;padding:9px 12px}.tutor-setup{background:#f8f0d9;border:1px solid #e2d1a7;border-radius:10px;padding:14px;font-size:14px;line-height:1.6}.tutor-setup[hidden]{display:none}.tutor-conversation .section-head{margin-top:0}.tutor-conversation textarea{resize:vertical}.tutor-conversation form>.row{margin-top:12px}#tutorStatus{font-size:13px;line-height:1.6}@media(max-width:900px){.tutor-layout{grid-template-columns:1fr}.tutor-settings{position:static}.tutor-messages{height:400px}}@media(max-width:620px){.tutor-conversation{padding:18px}.tutor-message{padding:12px}.tutor-user{margin-left:12px}.tutor-messages{padding:10px}.tutor-conversation .section-head{align-items:start;gap:12px;flex-wrap:wrap}}
.lena-stage{--lena-mouth:0;display:grid;grid-template-columns:240px minmax(0,1fr);gap:28px;background:#fff;border:1px solid var(--line);border-radius:20px;padding:22px;margin:0 0 26px;overflow:hidden}.lena-visual{position:relative;align-self:start}.lena-portrait{display:block;width:100%;height:auto;border-radius:16px}.lena-live{position:absolute;bottom:10px;left:10px;display:flex;align-items:center;gap:7px;border-radius:20px;background:#fffdf0ed;padding:7px 12px;font-size:11px;color:#244c48}.lena-live>span:first-child{width:6px;height:6px;border-radius:50%;background:#789f54}.lena-intro h2{font-size:33px;margin:9px 0}.lena-intro>p{font-size:14px;line-height:1.7;max-width:600px}.lena-intro>small{font-size:11px;color:var(--muted)}.lena-tools{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:16px}.lena-tools button{font-size:12px;padding:9px 12px}.lena-tools label{font-size:11px;margin-left:5px}.lena-tools select{margin-left:7px;padding:8px;font-size:12px}.lena-auto{display:flex;align-items:center;gap:8px;font-size:12px;margin:13px 0 0}.lena-auto input{width:16px;height:16px;accent-color:#244c48}.lena-intro .lena-cost{font-size:11px;color:var(--muted);margin:7px 0}.lena-caption{grid-column:1/-1;border-radius:12px;padding:14px 18px;background:#f3f6eb;border-left:3px solid #8ca763;min-height:54px;max-height:180px;overflow:auto;white-space:pre-wrap;font-size:15px;line-height:1.8;overflow-wrap:anywhere}.lena-caption>span{display:block}.lena-caption>span+span{color:var(--muted);font-size:13px}.lena-mouth-open{transform-origin:160px 153px;transform:scaleY(calc(.1 + var(--lena-mouth)*1.3))}.lena-teeth{opacity:var(--lena-mouth)}.lena-smile{opacity:calc(1 - var(--lena-mouth))}.lena-eyes{transform-origin:160px 113px;animation:lena-blink 6.8s infinite}.lena-person{transform-origin:160px 235px;animation:lena-breathe 7s ease-in-out infinite}.lena-speaking .lena-person{animation:lena-teach 5s ease-in-out infinite}.lena-thinking .lena-live>span:first-child{animation:lena-think 1.1s infinite}.tutor-listen{font-size:12px;padding:8px 12px;margin-top:12px}#lenaVoiceStatus{font-size:12px;color:#4f6c43;min-height:18px;margin:6px 0}.lena-tools button:focus-visible,.lena-auto input:focus-visible,.lena-caption:focus-visible{outline:3px solid #8ca763;outline-offset:3px}@keyframes lena-blink{0%,41%,44%,100%{transform:scaleY(1)}42%,43%{transform:scaleY(.1)}}@keyframes lena-breathe{0%,100%{transform:translateY(0)}50%{transform:translateY(1.5px)}}@keyframes lena-teach{0%,100%{transform:rotate(0)}35%{transform:rotate(.7deg)}70%{transform:rotate(-.5deg)}}@keyframes lena-think{50%{opacity:.25}}@media(max-width:740px){.lena-stage{grid-template-columns:165px minmax(0,1fr);gap:18px;padding:18px}.lena-intro h2{font-size:27px}.lena-tools{grid-column:1/-1}}@media(max-width:520px){.lena-stage{grid-template-columns:1fr;gap:14px}.lena-visual{width:200px;margin:auto}.lena-intro{text-align:center}.lena-intro>.eyebrow{font-size:10px}.lena-tools,.lena-auto{justify-content:center}.lena-caption{font-size:14px}.lena-tools label{display:block;margin:4px 0 0}}@media(prefers-reduced-motion:reduce){.lena-person,.lena-eyes,.lena-thinking .lena-live>span:first-child{animation:none!important}.lena-mouth-open{transform:scaleY(.1)}.lena-teeth{opacity:0}.lena-smile{opacity:1}}

/* Sam uses the supplied character portrait, with a clear speaking indicator. */
.sammy-portrait{aspect-ratio:4/5;object-fit:cover;object-position:50% 56%;background:#b8a46b}
.lena-speaking .sammy-portrait{outline:3px solid var(--accent,#8ca763);outline-offset:3px}
.lena-speaking .lena-live>span:first-child{animation:lena-think 1.1s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.lena-speaking .lena-live>span:first-child{animation:none}}

.sammy-frame{position:relative;aspect-ratio:4/5;overflow:hidden;border-radius:16px;transform-origin:50% 80%}
.sammy-motion{position:absolute;inset:0;width:100%;height:100%;display:none;pointer-events:none}
.sammy-motion-ready{display:block}
.lena-speaking .sammy-frame{animation:sammy-speak-sway 3.8s ease-in-out infinite}
@keyframes sammy-speak-sway{0%,100%{transform:rotate(0) scale(1)}35%{transform:rotate(.6deg) scale(1.012)}70%{transform:rotate(-.5deg) scale(1.007)}}
@media(prefers-reduced-motion:reduce){.lena-speaking .sammy-frame{animation:none!important}.sammy-motion{display:none!important}}

/* German captions sit above the portrait animation in both themes. */
.sammy-picture-subtitle{position:absolute;z-index:2;left:7px;right:7px;bottom:40px;max-height:44%;overflow:auto;padding:8px 10px;border-radius:8px;background:transparent;color:#fff;text-align:center;pointer-events:auto;overflow-wrap:anywhere;text-shadow:0 1px 3px #000,0 0 6px #000}
.sammy-picture-subtitle[hidden]{display:none}
#sammySubtitleDe{display:block;color:#fff;font-size:14px;font-weight:600;line-height:1.45}
.lena-caption{max-height:none;white-space:normal}
#sammySubtitleNote{display:block;font-size:11px;line-height:1.5;color:var(--muted)}
.sammy-transcript{margin-top:12px;font-size:13px}
.sammy-transcript summary{cursor:pointer;padding:5px 0}
.sammy-transcript p{white-space:pre-wrap;max-height:220px;overflow:auto;line-height:1.7}
@media(max-width:740px) and (min-width:521px){#sammySubtitleDe{font-size:12px}.sammy-picture-subtitle{padding:6px;left:4px;right:4px}}