/* A conversational greeting card, with two illustrated turns instead of repeated prose. */
body[data-lesson-stage="0"] #controls{background:#fffdf5;padding:24px 28px;border-color:#c7d1b5}
.hello-invitation{flex:1;min-height:0;display:flex;flex-direction:column;width:100%}.hello-card-top{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dce1ca;padding-bottom:12px}.hello-card-top .eyebrow{font-size:11px;letter-spacing:2px;margin:0}.hello-spark{font:28px Georgia;color:#dc9c79}.hello-turns{flex:1;display:flex;flex-direction:column;justify-content:center;gap:13px;padding:20px 0}.hello-turn{display:grid;grid-template-columns:92px minmax(0,1fr);gap:14px;align-items:center}.hello-turn.pip-turn{grid-template-columns:minmax(0,1fr) 92px}.hello-avatar svg{width:92px;height:92px;display:block}.hello-turn small{display:block;font-size:10px;letter-spacing:1.1px;font-weight:bold;margin-bottom:9px;color:#71826a}.hello-bubble{position:relative;border:1px solid #d9ceb1;background:#fff2d4;border-radius:21px 21px 21px 5px;padding:17px 18px}.hello-bubble h2{font:400 clamp(25px,2.4vw,36px)/1.12 Georgia,serif;margin:0;color:#294f45;white-space:nowrap}.pip-turn .hello-bubble{background:#edf2df;border-color:#c3d0ae;border-radius:21px 21px 5px 21px;min-height:84px}.hello-bubble strong{font:400 35px/1.1 Georgia,serif;display:block}.hello-listening{display:block;font-size:12px;line-height:1.35;margin-top:5px;color:#71826a}.pip-avatar{background:#e1ebca;border-radius:50%;border:5px solid #f4f6e9;box-shadow:0 0 0 1px #cfdbb9;overflow:hidden}.pip-avatar svg{transform:translateY(10px)}.hello-connection{display:flex;gap:10px;align-items:center;justify-content:center;color:#bc9b70;font:24px Georgia;margin:0 44px}.hello-connection span{height:1px;flex:1;background:repeating-linear-gradient(90deg,#d9c6a3 0 3px,transparent 3px 8px)}.hello-card-bottom{padding-top:10px}.hello-card-bottom #hello{display:flex;align-items:center;justify-content:center;gap:10px;font-size:17px;padding:14px 12px;border-radius:15px;margin:0}.hello-card-bottom #hello span{margin:0;font-size:20px}.hello-ready{font-size:12px!important;line-height:1.4!important;text-align:center;margin:12px 0 0!important;color:#71826a}.hello-wave-hand{transform-origin:58px 98px;animation:hello-hand-wave 1.8s ease-in-out 2}.busy .hello-wave-hand{animation:none}.has-reply{animation:hello-reply .4s ease-out both}
@keyframes hello-hand-wave{0%,100%{transform:rotate(0)}35%{transform:rotate(-9deg)}65%{transform:rotate(7deg)}}@keyframes hello-reply{from{opacity:.4;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1000px) and (max-height:700px){body[data-lesson-stage="0"] #controls{padding:16px 22px}.hello-turns{padding:14px 0;gap:8px}.hello-avatar svg{width:72px;height:72px}.hello-turn{grid-template-columns:72px minmax(0,1fr);gap:11px}.hello-turn.pip-turn{grid-template-columns:minmax(0,1fr) 72px}.hello-bubble{padding:12px 15px}.hello-bubble h2{font-size:29px}.hello-bubble strong{font-size:29px}.pip-turn .hello-bubble{min-height:70px}.hello-turn small{margin-bottom:6px;font-size:9px}.hello-card-bottom #hello{padding:10px;font-size:15px}.hello-ready{margin-top:8px!important}.hello-card-top{padding-bottom:8px}}
@media(max-width:760px){body[data-lesson-stage="0"] #controls{padding:22px}.hello-turns{padding:26px 0}.hello-turn{grid-template-columns:70px minmax(0,1fr);gap:12px}.hello-turn.pip-turn{grid-template-columns:minmax(0,1fr) 70px}.hello-avatar svg{width:70px;height:70px}.hello-bubble{padding:15px 12px}.hello-bubble h2{font-size:27px}.hello-bubble strong{font-size:29px}.hello-turn small{font-size:9px;letter-spacing:.6px}.hello-ready{font-size:12px!important}}
.hello-turns{min-height:0;padding:12px 0;gap:8px}.hello-card-top,.hello-card-bottom{flex-shrink:0}.pip-avatar{width:92px;height:92px;box-sizing:border-box}.pip-avatar svg{width:100%;height:100%}
@media(min-width:1000px) and (max-height:700px){.pip-avatar{width:72px;height:72px}.hello-turns{padding:8px 0;gap:6px}}
@media(max-width:760px){.pip-avatar{width:70px;height:70px}.hello-turns{padding:26px 0}}