/* Illustrated two-character conversations, shared by the open stations. */
.lesson-comic{--comic-accent:#dcefc2;position:relative;width:min(100%,650px);margin:18px auto 26px;border:2px solid #80af78;border-radius:23px;overflow:hidden;background:#f8fbf3;color:#073f31;box-shadow:0 8px 22px #073f3119;isolation:isolate}
.lesson-comic .comic-dialogue{display:grid;grid-template-columns:1fr 1fr;gap:13px;padding:15px 15px 0;position:relative;z-index:3}
.lesson-comic .comic-bubble{position:relative;min-width:0;padding:10px 13px 12px;border:2px solid #0b543b;border-radius:19px 19px 19px 7px;background:#fff;font-size:clamp(.82rem,2.2vw,.98rem);line-height:1.28;box-shadow:0 3px 0 #bbd1ae;overflow-wrap:break-word}
.lesson-comic .comic-bubble::after{content:"";position:absolute;left:18px;bottom:-13px;width:16px;height:16px;transform:rotate(42deg);background:#fff;border-right:2px solid #0b543b;border-bottom:2px solid #0b543b}
.lesson-comic .comic-bubble--reply{border-radius:19px 19px 7px 19px;background:#fcfff7}
.lesson-comic .comic-bubble--reply::after{left:auto;right:20px;background:#fcfff7}
.lesson-comic .comic-bubble strong{display:block;margin-bottom:4px;color:#1b794d;font-size:.76em;letter-spacing:.02em;line-height:1.2}
.lesson-comic .comic-bubble span{display:block;font-weight:650}
.lesson-comic .comic-stage{position:relative;height:250px;overflow:hidden;background:radial-gradient(circle at 50% 64%,#fff 0 13%,transparent 43%),radial-gradient(circle at 15% 65%,var(--comic-accent) 0 22%,transparent 55%),radial-gradient(circle at 85% 52%,#d5ead3 0 20%,transparent 55%),linear-gradient(#eff8e8,#e4f1dc)}
.lesson-comic .comic-stage::before{content:"";position:absolute;inset:14px 10% 8px;border:2px dashed #73ad71;border-radius:50%;opacity:.55}
.lesson-comic .comic-stage::after{content:"";position:absolute;left:0;right:0;bottom:0;height:19px;background:#bbd5a8aa}
.lesson-comic .comic-character{position:absolute;bottom:3px;height:240px;width:auto;max-width:none;object-fit:contain;z-index:2;filter:drop-shadow(0 4px 4px #1248292a)}
.lesson-comic .comic-character--first{left:5%}
.lesson-comic .comic-character--second{right:5%}
.lesson-comic .comic-subject{position:absolute;left:50%;top:47%;width:91px;height:91px;transform:translate(-50%,-50%);display:grid;place-items:center;border:3px solid #2f8d55;border-radius:25px;background:#ffffffed;z-index:2;box-shadow:0 7px 16px #1a6a4126}
.lesson-comic .comic-symbol{font-family:"Apple Color Emoji","Segoe UI Emoji",sans-serif;font-size:3.25rem;line-height:1}
.lesson-comic .comic-orbit{position:absolute;inset:-11px;border:2px dotted #5ca96b;border-radius:32px;transform:rotate(10deg)}
.lesson-comic .comic-question-mark{position:absolute;right:-9px;top:-15px;width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:#f7cc54;color:#164331;font-weight:900;font-size:1.15rem;border:2px solid #0b543b}
.lesson-comic figcaption{position:relative;z-index:3;background:#eaf5df;border-top:1px solid #9bc490;padding:7px 14px;text-align:center;font-size:.8rem;font-weight:800;color:#286143}
.lesson-comic--intro{margin:20px auto 26px}
@media(max-width:480px){.lesson-comic{border-radius:18px;margin:16px auto 23px}.lesson-comic .comic-dialogue{gap:8px;padding:10px 9px 0}.lesson-comic .comic-bubble{padding:8px 9px 10px;border-radius:15px 15px 15px 6px;font-size:.83rem;line-height:1.25}.lesson-comic .comic-bubble--reply{border-radius:15px 15px 6px 15px}.lesson-comic .comic-bubble strong{font-size:.73em}.lesson-comic .comic-stage{height:190px}.lesson-comic .comic-character{height:183px;bottom:3px}.lesson-comic .comic-character--first{left:0}.lesson-comic .comic-character--second{right:0}.lesson-comic .comic-subject{width:72px;height:72px;border-radius:20px}.lesson-comic .comic-symbol{font-size:2.5rem}.lesson-comic figcaption{font-size:.73rem}}
@media(max-width:340px){.lesson-comic .comic-bubble{font-size:.76rem}.lesson-comic .comic-character{height:170px}.lesson-comic .comic-subject{width:64px;height:64px}.lesson-comic .comic-symbol{font-size:2.2rem}}