@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Literata:opsz,wght@7..72,500;7..72,600&display=swap');
:root{--paper:#faf9f5;--ink:#20394b;--navy:#284967;--muted:#778185;--line:#e8e7df;--blue-wash:#eaf0f4;--yellow:#fff1a3;--white:#fffefb;font-family:'DM Sans','PingFang SC','Microsoft YaHei',sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,select{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}button{color:inherit}button:disabled{opacity:.3;cursor:default}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #b3c7d8;outline-offset:4px}button{touch-action:manipulation}a{color:inherit;text-decoration:none}[hidden]{display:none!important}svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.app-header{max-width:1240px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:28px 44px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:baseline;gap:6px;letter-spacing:-1px}.brand-cn{font-size:26px;font-weight:700}.brand-en{font-family:Georgia,serif;font-size:29px;font-weight:700}.brand-dot{color:#d4ad4e}.header-right{display:flex;align-items:center;gap:24px}.course{font-size:13px;letter-spacing:1px;color:var(--muted)}.food{border:0;border-radius:24px;background:var(--yellow);padding:11px 18px;font-size:14px;display:flex;gap:9px;align-items:center}.food strong{font-weight:600}.food span{font-size:16px}main{max-width:1160px;margin:0 auto;padding:34px 40px 40px}.story-heading{text-align:center;margin-bottom:34px}.eyebrow{font-size:12px;letter-spacing:1.6px;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;justify-content:center;gap:12px}.today-tag{font-size:11px;letter-spacing:.4px;color:#7e6a2b;background:#fff4c3;padding:4px 8px;border-radius:5px}.episode-switch{display:flex;align-items:center;justify-content:center;gap:8px;margin:20px 0 18px}.icon-button{background:none;border:0;width:44px;height:44px;font-size:30px;font-family:Arial;font-weight:400}.episode{background:#e8edf0;border:0;border-radius:24px;padding:10px 24px;font-size:16px;font-weight:700;letter-spacing:.3px;min-height:44px}h1{font-family:'Literata',Georgia,'Songti SC',serif;font-size:clamp(28px,3.5vw,43px);line-height:1.3;font-weight:600;letter-spacing:-1px;margin:0 0 10px}.story-subtitle{font-size:16px;color:var(--muted);margin:0;line-height:1.7;letter-spacing:.5px}.reading-layout{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:68px;align-items:start}.story-media{position:sticky;top:28px}.cover-wrap{position:relative;overflow:hidden;border-radius:22px;background:#f4e8d2;aspect-ratio:2.1/1}.cover-wrap img{width:100%;height:100%;object-fit:cover;display:block}.cover-label{position:absolute;top:15px;left:16px;background:#faf9f5d9;border:1px solid #fff8;border-radius:20px;font-size:10px;padding:6px 10px;letter-spacing:1.5px;color:#566877}.reading-tools{margin-top:24px}.tools-main{display:flex;gap:12px}.tool{display:flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);border-radius:13px;background:var(--white);padding:14px 12px;min-height:48px;font-size:14px;flex:1;white-space:nowrap}.tool.play{flex:1.35;background:var(--blue-wash);border-color:var(--blue-wash);color:var(--navy);font-weight:600}.play svg{width:21px;height:21px}.play svg path{fill:currentColor;stroke:none}.tools-secondary{display:flex;gap:12px;margin-top:10px}.tools-secondary>*{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;gap:7px;min-height:44px;border:0;border-radius:11px;background:#f0efe9;font-size:13px;color:#5c6c75}.speed-control select{border:0;background:transparent;color:inherit;font-size:13px;padding:6px 0;cursor:pointer}.audio-info{display:flex;align-items:center;gap:7px;font-size:11px;color:#8a9398;margin:14px 0 0;justify-content:center}.audio-dot{width:4px;height:4px;background:#9cabb5;border-radius:50%}.media-caption{margin-top:35px;font-size:13px;color:#859095;line-height:1.8;display:flex;flex-direction:column;align-items:center;gap:13px}.tiny-rule{width:30px;height:1px;background:#d5d9d8}.story-reading{border-left:1px solid var(--line);padding-left:42px}.reading-top{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#8a969b;margin-bottom:24px;font-size:10px;letter-spacing:1.7px}.reading-top span:last-child{font-size:12px;letter-spacing:0;color:#849094}.sentence{position:relative;margin-bottom:25px;padding:0 10px 0 0;border-radius:8px}.sentence.speaking{background:#edf2f5;box-shadow:-12px 0 0 #edf2f5,8px 0 0 #edf2f5}.sentence-en{border:0;text-align:left;background:none;padding:2px 0;display:block;width:100%;font-size:22px;line-height:1.65;letter-spacing:-.3px}.sentence-en mark{background:#fff0a7;color:inherit;border-radius:4px;padding:2px 3px}.no-grammar mark{background:none;padding:2px 3px}.sentence-cn{font-size:14px;color:#889092;line-height:1.8;margin:7px 0 0}.sentence-detail{margin:12px 0 0;display:flex;align-items:flex-start;gap:12px;border-top:1px dashed #dfe3e3;padding-top:10px}.sentence-detail button{border:0;background:#e9eef2;color:#345774;border-radius:8px;padding:8px 10px;font-size:12px;white-space:nowrap}.sentence-detail p{font-size:12px;line-height:1.8;color:#728087;margin:2px 0}.story-end{display:flex;align-items:center;justify-content:center;gap:12px;margin:36px 0 24px;color:#c6ae64;font-size:12px}.end-line{width:30px;height:1px;background:var(--line)}.practice-cta{border:0;border-radius:14px;background:var(--navy);color:#fff;padding:17px 22px;font-size:15px;display:flex;align-items:center;justify-content:center;gap:14px;width:100%;font-weight:500}.practice-cta:hover{background:#1e3e5b}.completion-note{text-align:center;color:#849094;font-size:12px;margin:12px 0 0;min-height:18px}.bottom-nav{position:fixed;bottom:0;left:0;right:0;z-index:10;background:#faf9f5ef;backdrop-filter:blur(12px);border-top:1px solid var(--line);padding:10px 18px calc(10px + env(safe-area-inset-bottom))}.nav-inner{max-width:560px;margin:auto;display:flex;gap:8px}.nav-inner button{border:0;background:none;display:flex;align-items:center;justify-content:center;gap:10px;border-radius:13px;min-height:48px;flex:1;padding:10px 12px;font-size:14px;color:#92999a;white-space:nowrap}.nav-inner button.active{background:var(--blue-wash);color:var(--navy);font-weight:600}.nav-inner svg{width:20px;height:20px}footer{padding:15px 20px 116px;text-align:center;color:#9aa2a3;font-size:11px;letter-spacing:1px}footer span{margin:0 7px}.section-heading{text-align:center;margin:26px 0 40px}.section-heading .eyebrow{margin:0 0 20px}.section-heading h1{font-size:34px}.practice-layout{max-width:900px;margin:auto;display:grid;grid-template-columns:1fr 1.2fr;gap:30px}.grammar-card{background:#f2efe5;border-radius:20px;padding:30px}.small-label{font-size:12px;letter-spacing:1px;color:#8d8061}.grammar-card h2{font-size:23px;line-height:1.5;margin:15px 0 24px}.rule-example{font-size:21px;line-height:1.8;padding:7px 0}.rule-example mark{background:var(--yellow);color:inherit;padding:3px 5px;border-radius:4px}.grammar-card p{font-size:14px;color:#758084;line-height:1.9;margin-top:24px}.quiz-card{border:1px solid var(--line);background:var(--white);border-radius:20px;padding:30px;min-height:360px}.quiz-meta{display:flex;justify-content:space-between;font-size:13px;color:#8c9493}.quiz-progress{height:3px;background:#efeee7;border-radius:2px;margin-top:14px;overflow:hidden}.quiz-progress>div{height:100%;background:#cfb35c;transition:width .3s}.quiz-instruction{color:#849095;font-size:13px;margin:26px 0 18px}.question{font-size:25px;line-height:1.6;margin-bottom:26px}.blank{display:inline-block;min-width:48px;color:#bc9b3c;border-bottom:2px solid #dbc782;text-align:center}.answers{display:flex;flex-wrap:wrap;gap:10px}.answers button{flex:1;min-width:70px;border:1px solid #dfe5e6;border-radius:12px;background:#f8fafb;min-height:52px;font-size:18px}.answers button.correct{background:#e7efe4;border-color:#b6caaa;color:#3c643b}.answers button.wrong{background:#fbece6;border-color:#deb4a5;color:#975740}.answers button:disabled{opacity:1}.answer-feedback{font-size:14px;line-height:1.8;margin:20px 0;color:#6e7c80;min-height:44px}.next-question{border:0;background:var(--navy);color:white;padding:12px 18px;border-radius:10px;min-height:44px}.quiz-done{text-align:center;padding:32px 0}.done-star{font-size:38px;color:#c0a052}.quiz-done h2{font-size:23px}.quiz-done p{font-size:14px;color:#7c878b;line-height:1.8}.quiz-done .practice-cta{margin-top:24px}.text-button{background:none;border:0;padding:14px;color:#648299;font-size:14px;min-height:44px}.pet-card{max-width:450px;margin:0 auto;background:#f2efe6;border-radius:26px;padding:30px 38px;text-align:center}.egg-orbit{width:190px;height:190px;margin:0 auto 20px;border-radius:50%;background:#fcf7e1;display:flex;align-items:center;justify-content:center}.egg-orbit span{font-size:100px;filter:drop-shadow(0 10px 10px #80725315)}.pet-card h2{font-size:23px}.pet-card p{font-size:14px;line-height:1.9;color:#82908c}.pet-progress{height:6px;background:#e5e1d5;border-radius:4px;margin-top:24px;overflow:hidden}.pet-progress>div{height:100%;background:#d0b35b;transition:width .4s}.pet-small{font-size:12px!important;margin-bottom:24px}dialog{padding:0;border:0;border-radius:24px;background:var(--white);color:var(--ink);width:min(600px,calc(100% - 32px));max-height:80dvh;box-shadow:0 25px 100px #1c324440;overflow:hidden}dialog::backdrop{background:#21344066;backdrop-filter:blur(4px)}.dialog-top{display:flex;align-items:center;gap:12px;padding:22px;background:#203f5a}.search-wrap{display:flex;align-items:center;gap:10px;flex:1;min-width:0;background:#ffffff14;border:1px solid #ffffff30;border-radius:13px;color:#b7c6d0;padding:0 13px}.search-wrap svg{width:20px}.search-wrap input{width:100%;min-width:0;background:none;border:0;color:#fff;padding:15px 0;font-size:15px;outline-offset:0}.search-wrap input::placeholder{color:#b2c0c9}.dialog-close{background:#ffffff15;color:#dce6ed;width:44px;height:44px;flex-shrink:0;border:0;border-radius:50%;font-size:26px}.dialog-body{padding:28px 24px;overflow:auto;max-height:calc(80dvh - 96px)}.dialog-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:20px}.dialog-heading h2{font-size:20px;margin:0}.dialog-heading>span{font-size:12px;color:#8c969b}.list-row{display:flex;align-items:center;gap:16px;width:100%;border:0;background:none;text-align:left;padding:21px 16px;border-bottom:1px solid #eeede7;color:var(--ink)}.list-row.selected{background:#edf1f4;border-radius:10px}.list-number{color:#a2adb2;font-size:17px;font-weight:600;min-width:34px}.selected .list-number{color:var(--navy)}.list-copy{flex:1;min-width:0}.list-title{font-size:16px;font-weight:600;line-height:1.5}.list-sub{font-size:12px;color:#899398;margin-top:5px;line-height:1.6}.list-check{height:27px;width:27px;border-radius:50%;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:center;font-size:15px}.list-new{font-size:10px;background:#fff1b3;border-radius:4px;color:#89702e;padding:3px 6px;display:inline-block;margin-top:6px}.list-note{font-size:12px;color:#9aa1a2;text-align:center;margin:24px 0 0}.empty-list{padding:35px 0;color:#889297;text-align:center;font-size:15px}.toast{position:fixed;bottom:95px;left:50%;transform:translateX(-50%);z-index:100;border-radius:13px;background:#243f55;color:#fff;padding:14px 20px;font-size:14px;max-width:calc(100vw - 36px);text-align:center;box-shadow:0 6px 30px #22394c22}.visually-hidden{position:absolute;clip:rect(0,0,0,0);width:1px;height:1px;overflow:hidden}.no-chinese .sentence-cn{display:none}.read-complete{color:#6a865c}
@media(min-width:1100px){.story-heading{margin-bottom:45px}.story-media{padding-top:0}.cover-wrap{aspect-ratio:1.75/1}.story-reading{padding-top:0}.sentence-en{font-size:24px}}
@media(max-width:760px){.app-header{padding:21px 22px;border-bottom:0}.brand-cn{font-size:23px}.brand-en{font-size:26px}.course{display:none}.food{padding:9px 14px;font-size:13px}main{padding:18px 22px 24px;max-width:550px}.story-heading{margin-bottom:25px}.eyebrow{font-size:11px;letter-spacing:1px;gap:8px}.episode-switch{margin:17px 0 18px}.episode{font-size:15px;padding:9px 22px}h1{font-size:29px;letter-spacing:-.7px;line-height:1.3}.story-subtitle{font-size:14px}.reading-layout{display:block}.story-media{position:static}.cover-wrap{border-radius:18px;aspect-ratio:2.1/1}.cover-label{font-size:9px;top:12px;left:12px;padding:5px 8px}.reading-tools{margin-top:24px}.tool{font-size:14px;padding:12px 9px;min-height:46px}.tools-secondary>*{font-size:12px}.media-caption{display:none}.audio-info{margin-top:11px;font-size:10px}.story-reading{border-left:0;padding-left:0;margin-top:30px}.reading-top{margin-bottom:22px;font-size:9px}.reading-top span:last-child{font-size:11px}.sentence{margin-bottom:26px}.sentence-en{font-size:21px;line-height:1.65}.sentence-cn{font-size:14px;margin-top:8px}.nav-inner{gap:4px}.nav-inner button{font-size:13px;padding:10px 5px;gap:7px}.nav-inner svg{width:18px}.bottom-nav{padding-top:9px;padding-bottom:calc(9px + env(safe-area-inset-bottom))}footer{padding-bottom:104px}.section-heading{margin-top:15px;margin-bottom:28px}.section-heading h1{font-size:30px}.practice-layout{display:block}.grammar-card{padding:24px;margin-bottom:20px}.grammar-card h2{font-size:21px;margin-bottom:15px}.quiz-card{padding:24px}.question{font-size:23px}.pet-card{padding:28px 24px}dialog{margin:auto auto 0;width:100%;max-height:82dvh;border-radius:25px 25px 0 0}.dialog-top{padding:20px 18px}.dialog-body{padding:24px 18px;max-height:calc(82dvh - 90px);padding-bottom:calc(28px + env(safe-area-inset-bottom))}.list-row{padding:18px 10px;gap:12px}.list-title{font-size:15px}.list-number{font-size:16px}.today-tag{font-size:10px}}
@media(max-width:350px){main{padding-left:17px;padding-right:17px}.app-header{padding-left:17px;padding-right:17px}h1{font-size:26px}.tool{font-size:12px;gap:5px}.nav-inner button{font-size:12px}.sentence-en{font-size:20px}.eyebrow{flex-wrap:wrap}.list-row{gap:8px}.list-number{min-width:28px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Floating, centered navigation */
.bottom-nav{left:50%;right:auto;bottom:24px;transform:translateX(-50%);width:min(420px,calc(100% - 36px));padding:8px;background:#fffefbef;border:1px solid #e1e5e2;border-radius:23px;box-shadow:0 10px 40px #20394b16;backdrop-filter:blur(16px)}
.nav-inner{gap:5px}.nav-inner button{min-height:48px;border-radius:16px;padding:10px 7px}.nav-inner button.active{background:#e8eff4}
.admin-entry{font-size:13px;color:#788b98;white-space:nowrap}
@media(max-width:760px){.bottom-nav{bottom:calc(14px + env(safe-area-inset-bottom));width:min(390px,calc(100% - 28px));padding:7px;border-radius:21px}.nav-inner button{min-height:45px;padding:8px 5px;gap:6px;font-size:12px}.admin-entry{font-size:11px}.header-right{gap:12px}footer{padding-bottom:130px}}

/* A consistent illustrated egg on every device. */
.egg-orbit{width:250px;height:260px;background:radial-gradient(ellipse at 50% 57%,#fff8e5 0%,#fbf3df 56%,transparent 72%);border-radius:0;margin-bottom:10px}
.egg-orbit #pet-visual{display:block;width:220px;height:240px;filter:none;font-size:100px}
.egg-orbit .companion-egg{width:220px;height:240px;display:block;stroke:none;overflow:visible}
.egg-body{transform-origin:110px 208px;animation:egg-sway 5s ease-in-out infinite}
.egg-shadow{transform-origin:110px 220px;animation:egg-breathe 5s ease-in-out infinite}
#pet-visual.hatched{display:flex;align-items:center;justify-content:center}
@keyframes egg-sway{0%,65%,100%{transform:rotate(0)}72%{transform:rotate(-4deg)}80%{transform:rotate(4deg)}88%{transform:rotate(-2deg)}}
@keyframes egg-breathe{0%,65%,100%{transform:scaleX(1)}80%{transform:scaleX(.92)}}
@media(prefers-reduced-motion:reduce){.egg-body,.egg-shadow{animation:none}}

.pet-card .pet-event{font-size:13px;line-height:1.8;color:#8c7751;white-space:pre-line;padding:12px 14px;background:#fff9eb;border-radius:12px}

.pet-card{max-width:520px}.pet-chat{background:#fffef9;border:1px solid #e8dfcf;border-radius:19px;padding:20px;margin:24px -8px;text-align:left}.pet-card .pet-chat-label{font-size:11px;letter-spacing:1px;color:#a38d63;margin:0 0 12px}.pet-chat h3{font-size:21px;line-height:1.45;margin:0;color:#284967}.pet-card #pet-question-cn{font-size:13px;margin:7px 0 16px}#pet-chat-options{display:flex;flex-wrap:wrap;gap:8px}.pet-answer{flex:1;min-width:100px;border:1px solid #e5e2d7;border-radius:11px;padding:11px 9px;background:#faf8f0;text-align:left;line-height:1.5;min-height:64px}.pet-answer span{display:block;font-size:13px}.pet-answer small{display:block;color:#8c9289;font-size:11px;margin-top:3px}.pet-answer[aria-pressed=true]{background:#eaf0f4;border-color:#9aafbe}.pet-card #pet-chat-reply{white-space:pre-line;background:#fff3cb;padding:13px;border-radius:12px;color:#75613b;font-size:13px;line-height:1.8;margin:14px 0 0}.pet-card .pet-chat-note{font-size:11px;color:#9c9c91;margin:14px 0 0}@media(max-width:600px){.pet-card{padding:24px}.pet-chat{margin-left:0;margin-right:0;padding:16px}}

.question{font-size:21px;line-height:1.7}.answers button{font-size:16px;line-height:1.6;padding:12px;min-width:120px;flex-basis:100%;text-align:left}.question .blank{min-width:55px}@media(max-width:600px){.question{font-size:19px}.answers button{font-size:15px}}

.grammar-library-trigger{font-size:26px;font-weight:600;padding:12px 28px;letter-spacing:1px;border:1px solid #d8e0e5;box-shadow:0 3px 0 #dbe2e6}.grammar-library-trigger:hover{background:#dce7ef}.section-heading h1:has(.grammar-library-trigger){margin-bottom:15px}.grammar-page-toolbar{display:flex;justify-content:space-between;align-items:center;max-width:900px;margin:auto}.grammar-page-toolbar .episode{font-size:14px}.grammar-page-toolbar+.section-heading h1{font-size:28px;line-height:1.5}.grammar-page-toolbar+.section-heading .eyebrow{margin-bottom:12px}#grammar-dialog{width:min(760px,calc(100% - 32px))}.grammar-library-intro{font-size:13px;line-height:1.8;color:#8b9599;margin:0 0 20px}#grammar-categories{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:25px}.grammar-filter{border:1px solid #e3e7e7;background:#fafaf7;border-radius:20px;padding:9px 14px;font-size:13px;min-height:40px}.grammar-filter[aria-pressed=true]{background:#284967;color:white;border-color:#284967}.grammar-group{margin-bottom:25px}.grammar-group h3{font-size:13px;color:#9b885d;letter-spacing:1px;padding:0 10px;margin:0 0 8px}.grammar-topic{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;text-align:left;border:0;border-bottom:1px solid #ecebe3;background:transparent;padding:18px 11px;min-height:78px}.grammar-topic:hover{background:#eef2f4;border-radius:12px}.grammar-topic-copy{min-width:0}.grammar-topic-copy strong{font-size:16px;line-height:1.6;display:block}.grammar-topic-copy small{font-size:11px;color:#8b989c;display:block;margin-top:5px;line-height:1.6}.grammar-topic-state{font-size:11px;white-space:nowrap;color:#648299}.grammar-topic-state span{font-size:24px;margin-left:8px}.grammar-card #grammar-detail-rule{font-size:15px;color:#52676f;margin:14px 0 25px}.grammar-card .grammar-source{font-size:12px;color:#9a917c}.quiz-done .grammar-reward-note{font-size:11px;color:#98a1a1}@media(max-width:600px){.grammar-topic{padding:16px 6px;gap:8px}.grammar-topic-copy strong{font-size:14px}.grammar-topic-state{font-size:10px}.grammar-library-trigger{font-size:24px}.grammar-page-toolbar+.section-heading h1{font-size:23px}#grammar-dialog .dialog-body{padding:24px 18px}}
.speech-practice{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--line,#e8e2d6)}.speech-actions{display:flex;flex-wrap:wrap;gap:.65rem}.speech-actions button{font-size:.875rem;min-height:40px;padding:.55rem .9rem}.speech-actions .speech-record{background:#193c49;color:#fff;border-color:#193c49}.speech-status{font-size:.875rem!important;line-height:1.7!important;margin:.7rem 0 0!important}.speech-status:empty{display:none}.speech-status a{color:#193c49;text-decoration:underline}.speech-result{margin-top:1rem;padding:1rem;background:#fffdf7;border:1px solid #e8e2d6;border-radius:14px}.speech-total{font-size:1.65rem;color:#193c49}.speech-result>p{margin:.4rem 0 .8rem!important}.speech-measures{display:flex;gap:.65rem 1.4rem;flex-wrap:wrap;font-size:.875rem;color:#546b73}.speech-words{display:flex;flex-wrap:wrap;gap:.4rem;margin:1rem 0 .5rem}.speech-words span{font-size:1rem;border-radius:6px;padding:.2rem .4rem}.speech-word-good{background:#edf3ec;color:#355645}.speech-word-practice{background:#fff0dc;color:#875015}.speech-word-missing{border:1px dashed #a97039;color:#875015}.speech-result>small{font-size:.875rem;line-height:1.6;color:#6c6c61}.speech-actions button:disabled{opacity:.55;cursor:wait}.speech-actions [hidden],.speech-result[hidden]{display:none!important}
.companion-baby{display:block;width:220px;height:240px;overflow:hidden;filter:drop-shadow(0 8px 8px #bda98016)}.baby-breathe{transform-box:fill-box;transform-origin:center bottom;animation:baby-breathe 3.6s ease-in-out infinite}.pet-resting .baby-breathe,.pet-resting .egg-body{animation:none}.pet-resting{filter:saturate(.65);opacity:.87}@keyframes baby-breathe{0%,100%{scale:1 1}50%{scale:1.015 1.025}}@media(prefers-reduced-motion:reduce){.baby-breathe{animation:none}}
.profile-chip{font-size:.875rem;max-width:210px;border:1px solid #e3dece;border-radius:20px;background:#fffdf6;color:#294b55;padding:.55rem .85rem;cursor:pointer}.header-right{flex-wrap:wrap}.profile-panel{padding:1.6rem;max-width:620px;font-size:1rem;line-height:1.75}.profile-heading{display:flex;align-items:center;justify-content:space-between;gap:1rem}.profile-heading h2{font-size:1.35rem;margin:0}.profile-heading button{font-size:1.5rem;background:none;border:0;padding:.3rem .6rem}.profile-actions{display:flex;flex-wrap:wrap;gap:.7rem;margin:1.2rem 0}.profile-actions button,.profile-choice button{background:#21434e;color:white;padding:.7rem 1rem;border:0;border-radius:10px;font-size:.875rem;cursor:pointer}.profile-actions button:disabled{opacity:.45;cursor:default}.profile-choice{border:1px solid #e3dece;padding:1rem;border-radius:12px;margin:.8rem 0;background:#fffdf7}.profile-note{font-size:.875rem;color:#6a7475}.profile-panel a{color:#21434e;text-decoration:underline}#profile-dialog{border:1px solid #ded8c9;border-radius:22px;max-width:min(92vw,650px);max-height:85vh}#profile-dialog::backdrop{background:#18303970}@media(max-width:600px){.profile-chip{font-size:.8rem;max-width:180px}.profile-panel{padding:1.1rem}.header-right .course{display:none}}
/* PokeCH — shared learning space */
.subject-switch{display:flex;gap:4px;padding:4px;border:1px solid var(--line,#e5e1d8);border-radius:15px;background:#f1efe9}.subject-switch button{border:0;background:transparent;padding:8px 14px;border-radius:11px;color:#73736e;font:inherit;font-size:13px;cursor:pointer}.subject-switch button[aria-pressed=true]{background:#fffdf7;color:#253d39;box-shadow:0 2px 5px #26362c0c}.subject-switch small{display:block;font-size:10px;letter-spacing:.06em;margin-top:3px}.app-header{flex-wrap:wrap;gap:14px}.subject-chinese .practice-cta{background:#355e52;color:#fff}.subject-chinese .bottom-nav .active{color:#355e52}.ch-reading-layout{display:grid;grid-template-columns:300px minmax(0,1fr);gap:52px;max-width:1000px;margin:0 auto}.ch-method{align-self:start;padding:25px;border-radius:22px;background:#eeeee3;line-height:1.9}.ch-method h2{font-size:24px}.ch-illustration{height:205px;display:flex;align-items:center;justify-content:center;gap:12px;background:#dce5d8;border-radius:15px;margin-bottom:25px}.ch-illustration>span{font-size:70px;color:#54735a;transform:rotate(-15deg)}.ch-paper{background:#fffdf3;transform:rotate(7deg);padding:24px 20px;box-shadow:5px 6px 0 #bdcdb7;color:#385445;font-size:23px;line-height:1.8}.ch-paper small{font-size:15px}.ch-story{font-size:19px;line-height:2.05;background:#fffdf8;padding:28px 36px;border-radius:22px;border:1px solid #e8e3d7}.ch-story p{text-indent:2em;margin:0 0 21px}.ch-source{font-size:12px;color:#7d8278;line-height:1.8}.ch-workshop{max-width:800px;margin:auto;display:grid;gap:24px}.ch-card{padding:30px 34px;background:#fffdf8;border:1px solid #e6e3d9;border-radius:22px;line-height:1.9}.ch-card h2{margin:12px 0;font-size:25px}.ch-field{display:block;margin:22px 0 8px;font-size:15px;font-weight:600}.ch-field textarea{display:block;width:100%;box-sizing:border-box;resize:vertical;border:1px solid #d2d9cc;border-radius:12px;background:#fafbf5;padding:16px;margin-top:9px;font:inherit;font-weight:400;line-height:1.9;color:#293d34}.ch-field textarea:focus{outline:2px solid #6d967d;outline-offset:2px}.ch-word-bank,.ch-hint{padding:16px 20px;background:#eef2e7;border-radius:12px}.ch-card details{color:#526b58}.ch-card summary{cursor:pointer}.ch-finish #ch-feedback{color:#355e52}.ch-finish #ch-save{font-size:12px;color:#7d8278}.subject-chinese .brand-dot{color:#54735a}@media(max-width:800px){.app-header .subject-switch{order:3;width:100%;justify-content:center}.ch-reading-layout{grid-template-columns:1fr;gap:20px}.ch-method{padding:22px}.ch-illustration{height:150px}.ch-story{padding:24px;font-size:18px}.ch-card{padding:22px}.subject-switch button{flex:1}.ch-workshop{gap:18px}}
.subject-switch[hidden]{display:none}.review-entry{position:fixed;right:20px;bottom:22px;z-index:15;border:1px solid #bca68b;border-radius:24px;padding:12px 20px;background:#fffaf0;color:#594832;box-shadow:0 4px 18px #40332215;cursor:pointer}#review-dialog{width:min(560px,calc(100vw - 32px));max-height:85dvh;border:1px solid #d8cbb8;border-radius:22px;background:#fffdf6;color:#493e32;padding:0}#review-dialog::backdrop{background:#332d2466}.review-panel{padding:30px}.review-panel h2{font-size:32px;margin:8px 0 20px}.review-panel h3{line-height:1.6}.review-panel p{line-height:1.8}.review-panel .answers{display:grid;gap:12px}.review-panel .practice-cta{margin-top:18px}.review-panel .text-button{margin-top:12px}
/* Keep complete cover artwork visible at every screen width. */
.cover-wrap{aspect-ratio:auto}.cover-wrap img{height:auto;object-fit:contain}.cover-label{top:auto;bottom:12px;background:#faf9f5d9}
#practice-view .practice-layout{display:block;max-width:740px}.practice-tools{display:flex;justify-content:center;gap:24px;margin-top:14px}.study-card{max-width:740px;margin:0 auto}.study-card .grammar-card{margin-bottom:22px}.study-card>.text-button{display:block;margin:18px auto}button.whiteboard-open{border:1px solid #d9dfe1;background:#eef2f4;border-radius:22px;padding:10px 16px;white-space:nowrap;font-size:14px}.whiteboard-panel{position:fixed;right:14px;top:14px;bottom:14px;width:370px;z-index:35;background:#fffefb;border:1px solid #deded6;border-radius:18px;box-shadow:0 8px 36px #20394b18;display:flex;flex-direction:column;padding:18px;gap:14px}.whiteboard-heading{display:flex;justify-content:space-between;align-items:center;gap:10px}.whiteboard-heading small{display:block;color:#778185;margin-top:6px;font-size:12px}.whiteboard-heading button{background:#eef2f4;border:0;border-radius:8px;padding:8px 10px}.whiteboard-heading>div:last-child{display:flex;gap:8px}.whiteboard-toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center}.whiteboard-toolbar label{display:flex;align-items:center;gap:5px;font-size:13px}.whiteboard-toolbar select,.whiteboard-toolbar button{border:1px solid #d9dfe1;background:#faf9f5;border-radius:8px;padding:7px;color:#20394b}.whiteboard-hint{font-size:12px;color:#778185;line-height:1.6;margin:0}#whiteboard-editor{flex:1;min-height:180px;overflow:auto;outline:none;background:#fff;padding:18px 14px;border:1px solid #e5e7e7;border-radius:12px;font-size:24px;line-height:1.75;overflow-wrap:anywhere;white-space:pre-wrap;color:#20394b}#whiteboard-editor:focus{border-color:#aabfcd}#whiteboard-editor:empty::before{content:attr(data-placeholder);color:#a7afb1;pointer-events:none}#whiteboard-status{font-size:11px;color:#778185;margin:0;line-height:1.5}.whiteboard-open .app-header,.whiteboard-open main{margin-right:398px;margin-left:auto;max-width:calc(100% - 398px)}.whiteboard-open .app-header{padding-left:24px;padding-right:24px;gap:18px;flex-wrap:wrap}.whiteboard-open .header-right{gap:12px;flex-wrap:wrap}.whiteboard-open .reading-layout{gap:24px}.whiteboard-open .story-reading{padding-left:22px}.whiteboard-open .bottom-nav{right:398px}.whiteboard-panel.whiteboard-full{left:16px;right:16px;top:16px;bottom:16px;width:auto}.whiteboard-full #whiteboard-editor{font-size:32px}
@media(max-width:1050px){.whiteboard-open .reading-layout{grid-template-columns:1fr}.whiteboard-open .story-media{position:static;max-width:360px;margin:0 auto}.whiteboard-open .story-reading{border:0;padding-left:0}}
@media(max-width:760px){.app-header .header-right{flex-wrap:wrap;gap:10px}.whiteboard-open .app-header,.whiteboard-open main{margin-right:auto;max-width:100%}.whiteboard-open main{padding-bottom:55dvh}.whiteboard-open .bottom-nav{right:0}.whiteboard-panel{left:10px;right:10px;top:auto;bottom:76px;width:auto;height:48dvh;padding:14px;gap:9px}.whiteboard-panel #whiteboard-editor{min-height:80px}.whiteboard-panel.whiteboard-full{top:10px;bottom:10px;height:auto}.whiteboard-open .story-media{max-width:100%}.whiteboard-hint{font-size:11px}}

.audio-restart{display:block;margin:4px auto 0;min-height:44px;padding:8px 16px;font-size:13px;}

#daily-word-dialog{width:min(850px,calc(100% - 24px));max-height:85vh;overflow:auto}.word-panel{padding:26px}.word-heading,.word-card-head,.word-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px}.word-heading h2{margin:0}.word-heading button{border:0;background:none;font-size:28px;min-width:44px;min-height:44px}#word-hint,#word-status{font-size:13px;line-height:1.8;color:#728087}.word-toolbar{flex-wrap:wrap;margin:20px 0}.word-toolbar select{padding:8px;border:1px solid var(--line);border-radius:8px;background:var(--white)}#word-count{font-size:13px;color:#728087}.word-picker{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:22px}.word-chip{border:1px solid #dce4e7;border-radius:12px;background:#fffefb;padding:10px 14px;min-height:44px}.word-chip[aria-pressed="true"]{background:#fff1a3;border-color:#c8ad56}.word-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.word-card{padding:20px;border:1px solid var(--line);border-radius:16px;background:#fffefb}.word-card h3{margin:0;font-size:24px}.word-remove{border:0;background:none;color:#7b8589;min-height:44px}.word-ipa{color:#5b788d;font-size:16px}.word-ipa span{font-size:12px;margin-left:8px}.word-meaning{font-size:16px}.word-card ul{padding-left:20px;font-size:14px;line-height:1.8}.word-context{border-top:1px dashed var(--line);padding-top:12px;color:#7a8488}.word-context small{font-size:11px}.word-context p{font-size:13px;line-height:1.8;margin:6px 0}.word-empty{grid-column:1/-1;color:#78878c;line-height:1.8;padding:20px 0}@media(max-width:600px){.word-list{grid-template-columns:1fr}.word-panel{padding:18px}.header-right{flex-wrap:wrap;gap:8px}}

.inline-word-hint{font-size:12px;color:#6b7b85;line-height:1.8;text-align:center;margin:4px 0 8px}.story-word{font:inherit;line-height:inherit;letter-spacing:inherit;background:none;border:0;border-radius:5px;padding:0 2px;margin:0;color:inherit;cursor:pointer}.story-word:hover,.story-word:focus-visible{background:#fff1a3}.story-word.word-picked{text-decoration:underline;text-decoration-color:#b0bfa4;text-underline-offset:5px}#word-detail-dialog{width:min(440px,calc(100% - 24px));max-height:85vh;overflow:auto}#inline-word-body ul{font-size:15px;line-height:1.8;padding-left:22px}#inline-word-add{margin-top:18px}#inline-word-status{font-size:13px;color:#66815e;min-height:20px}

.hide-word-meaning .word-meaning,.hide-word-meaning .word-translation,.hide-word-meaning .word-context-cn{visibility:hidden;user-select:none;}

.hide-word-meaning .word-card>:not(.word-card-head),.hide-word-meaning .word-remove{display:none}.hide-word-meaning .word-card{padding:18px 20px}

.retell-title{font-size:24px;margin:20px 0 14px}.retell-prompt{line-height:1.8;font-size:17px}.retell-encourage{font-size:13px;color:#78848a;line-height:1.8}.retell-hints{background:#f4f1e8;padding:14px;border-radius:12px;margin:18px 0;font-size:14px;line-height:1.8}.retell-hints summary{cursor:pointer}.retell-hints span{display:inline-block;background:#fffefb;border-radius:5px;padding:1px 6px;margin:3px}.retell-label{display:block;font-size:13px;color:#647780}.retell-label textarea{display:block;width:100%;box-sizing:border-box;margin-top:10px;padding:12px;font:inherit;font-size:17px;line-height:1.7;border:1px solid #d9e2e4;border-radius:12px;resize:vertical;background:#fffefb;color:#20394b}#retell-status{font-size:12px;color:#63816f;min-height:20px}
/* Compact reading controls and persistent teaching tools. */
:root{--board-width:390px}.app-header{padding-top:20px;padding-bottom:20px;gap:18px}.header-right{gap:12px}.account-menu{position:relative;font-size:13px}.account-menu summary{cursor:pointer;list-style:none;padding:10px}.account-menu[open] .admin-entry:not([hidden]){position:absolute;right:0;top:42px;z-index:20;white-space:nowrap;padding:15px;background:var(--white);border:1px solid var(--line);border-radius:12px}.story-heading{margin-bottom:26px}.episode-switch{margin:12px 0}.reading-layout{gap:42px;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}.story-reading{padding-left:30px}.reading-tools{margin-top:18px}.audio-row,.reading-options{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.audio-row #full-play{flex:1;min-width:125px}.audio-row .audio-restart{margin:0;padding:10px 8px;font-size:13px;white-space:nowrap}.audio-row .speed-control{display:flex;align-items:center;gap:4px;font-size:12px;white-space:nowrap}.reading-options{margin-top:12px;justify-content:center}.reading-options>*{flex:initial!important;min-height:38px;padding:8px 10px;border:0;background:transparent;font-size:12px;color:#648299;margin:0!important}.media-caption{display:block;margin-top:18px;text-align:center;font-size:12px}.media-caption summary{cursor:pointer;padding:8px}.media-caption>span{display:block;padding:4px 10px}.sentence{margin-bottom:22px}button.whiteboard-fab{position:fixed;right:22px;bottom:calc(92px + env(safe-area-inset-bottom));z-index:38;background:var(--navy);color:white;box-shadow:0 4px 18px #20394b20;min-height:46px;padding:12px 20px}.whiteboard-panel{width:var(--board-width);bottom:80px}.whiteboard-open .whiteboard-fab{right:calc(var(--board-width) + 30px)}.whiteboard-open .app-header,.whiteboard-open main{margin-right:calc(var(--board-width) + 28px);max-width:calc(100% - var(--board-width) - 28px)}.whiteboard-open .bottom-nav{right:calc(var(--board-width) + 28px)}#whiteboard-resize{position:absolute;left:-7px;top:20px;bottom:20px;width:14px;cursor:ew-resize;touch-action:none}#whiteboard-resize:focus-visible{outline:2px solid #aabfcd}.floating-audio{position:fixed;top:12px;left:50%;transform:translateX(-50%);z-index:30;display:flex;align-items:center;gap:8px;padding:7px 12px;border:1px solid var(--line);border-radius:16px;background:#fffefbf5;box-shadow:0 4px 20px #20394b12;backdrop-filter:blur(12px);max-width:calc(100% - 24px)}.floating-audio button{border:0;background:var(--blue-wash);border-radius:9px;padding:10px;font-size:13px;white-space:nowrap}.floating-audio label{display:flex;align-items:center;gap:3px;font-size:12px;white-space:nowrap}.floating-audio select{border:0;background:transparent;padding:8px 0}.whiteboard-open .floating-audio{left:calc((100% - var(--board-width) - 28px)/2)}
@media(max-width:760px){.app-header{padding:16px 18px;flex-wrap:wrap}.header-right{flex:1;justify-content:flex-end;gap:8px}.header-right button{font-size:12px;padding:9px 11px}.brand-cn{font-size:22px}.brand-en{font-size:25px}.account-menu{margin-left:auto}.reading-layout{grid-template-columns:1fr;gap:26px}.story-reading{padding-left:0;border:0}.story-media{position:static}.whiteboard-open .app-header,.whiteboard-open main{margin-right:auto;max-width:100%}.whiteboard-open .bottom-nav{right:0}.whiteboard-open .whiteboard-fab{right:18px;bottom:calc(49dvh + 90px)}button.whiteboard-fab{right:18px}.whiteboard-panel{height:48dvh;bottom:76px;width:auto}.whiteboard-open .floating-audio{left:50%}#whiteboard-resize{display:none}.floating-audio{top:8px}.audio-row{justify-content:center}.story-heading h1{font-size:29px}.story-subtitle{font-size:14px}.whiteboard-panel.whiteboard-full{width:auto}}

@media(min-width:761px){.whiteboard-open .story-media{position:static}.whiteboard-open .reading-layout{grid-template-columns:1fr}.whiteboard-open .story-media{max-width:440px;margin:auto}.whiteboard-open .story-reading{border:0;padding-left:0}}
/* Watercolor baby pterosaur: four pose atlas and a one-time hatch sequence. */
.egg-orbit #pet-visual.ptero-visual{width:260px;height:260px}.ptero-scene{position:relative;width:260px;height:260px;isolation:isolate}.ptero-character{position:absolute;inset:0;z-index:1;transform-origin:50% 85%;animation:ptero-breathe 3.8s ease-in-out infinite}.ptero-sprite{width:100%;height:100%;background-image:url('/assets/pterosaur-poses.png');background-size:200% 200%;background-repeat:no-repeat;background-position:0 0;animation:ptero-idle 8s steps(1,end) infinite}.ptero-shell,.ptero-shell-top{position:absolute;inset:0;width:260px;height:260px;stroke:none;z-index:2;pointer-events:none}.ptero-shell-top{z-index:3}.ptero-sleep .ptero-character{animation:none;transform:translateY(30px)}.ptero-sleep .ptero-sprite{animation:none;background-position:100% 0;filter:saturate(.7)}.ptero-eating .ptero-sprite{animation:ptero-munch 1.7s steps(1,end)}.ptero-eating .ptero-character{animation:ptero-nod .55s ease-in-out 3}.ptero-hatching .ptero-scene{animation:ptero-egg-wiggle 1.2s ease-in-out}.ptero-hatching .ptero-shell-top{animation:ptero-open-shell 5.2s ease-in-out forwards}.ptero-hatching .ptero-character{animation:ptero-emerge 5.2s ease-in-out forwards}.ptero-hatching .ptero-sprite{animation:ptero-hatch-poses 5.2s steps(1,end) forwards}.ptero-hatching .ptero-shell{animation:ptero-bottom-shell 5.2s ease-in-out forwards}
@keyframes ptero-idle{0%,36%,40%,81%,88%,100%{background-position:0 0}37%,39%{background-position:100% 0}82%,87%{background-position:0 100%}}
@keyframes ptero-breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.012,1.025)}}
@keyframes ptero-munch{0%,70%{background-position:100% 100%}80%,100%{background-position:0 100%}}
@keyframes ptero-nod{0%,100%{transform:translateY(0)}50%{transform:translateY(5px) rotate(2deg)}}
@keyframes ptero-egg-wiggle{0%,100%{transform:rotate(0)}25%,65%{transform:rotate(-4deg)}45%,85%{transform:rotate(4deg)}}
@keyframes ptero-open-shell{0%,20%{transform:translateY(0);opacity:1}35%{transform:translate(15px,-34px) rotate(13deg);opacity:1}55%,100%{transform:translate(95px,50px) rotate(65deg);opacity:0}}
@keyframes ptero-emerge{0%,22%{transform:translateY(145px);opacity:0}30%{opacity:1;transform:translateY(80px)}48%{transform:translateY(48px)}70%,100%{opacity:1;transform:translateY(0)}}
@keyframes ptero-hatch-poses{0%,47%,55%{background-position:0 0}49%,53%{background-position:100% 0}75%,94%{background-position:0 100%}100%{background-position:0 0}}
@keyframes ptero-bottom-shell{0%,65%{transform:translateY(0)}80%,100%{transform:translateY(5px)}}
@media(prefers-reduced-motion:reduce){.ptero-character,.ptero-sprite,.ptero-scene,.ptero-shell,.ptero-shell-top{animation:none!important}.ptero-shell-top{display:none}}

.ptero-scene{overflow:hidden;border-radius:24px}.ptero-sleep .ptero-sprite{background-position:100% 0}
.lesson-audio-status{font-size:12px;color:#7e6c48;line-height:1.7;background:#fff7e3;border-radius:10px;padding:10px 12px;margin:12px 0}

/* Keep the learning archive reachable at small viewport heights and browser zoom. */
#profile-dialog{width:min(650px,calc(100vw - 24px));max-width:calc(100vw - 24px);max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px);padding:0;overflow-x:hidden;overflow-y:scroll;overscroll-behavior:contain;scrollbar-gutter:stable;-webkit-overflow-scrolling:touch}
#profile-dialog .profile-panel{max-width:none;min-width:0;overflow-wrap:anywhere}
#profile-dialog .profile-heading{position:sticky;top:0;z-index:1;background:var(--paper);padding:12px 0;border-bottom:1px solid var(--line)}
#profile-message{padding:10px 12px;background:var(--blue-wash);border-radius:10px}
#profile-export-feedback{flex-basis:100%;margin:0;padding:10px 12px;border-radius:10px;background:var(--blue-wash);font-size:.875rem;line-height:1.7}
#profile-dialog .profile-actions button{min-height:44px;white-space:normal}
.pet-access-gate{max-width:640px;margin:24px auto 100px;padding:42px 30px;background:var(--white);border:1px solid var(--line);border-radius:26px;text-align:center}.pet-access-icon{display:grid;place-items:center;width:74px;height:74px;margin:0 auto 25px;border-radius:50%;font-size:31px;background:#f4f0e1;color:#9b8652}.pet-access-gate h2{font-size:25px;line-height:1.6;font-weight:600}.pet-access-gate p{line-height:1.9}.pet-access-gate #pet-access-message{font-size:14px;color:var(--muted)}.pet-access-days{display:flex;justify-content:center;gap:12px;margin:27px 0 18px}.pet-access-day{display:grid;place-items:center;flex:0 1 48px;height:48px;border:1px dashed #cbd3d4;border-radius:50%;font-size:15px;color:#9aa6aa;background:var(--paper)}.pet-access-day.done{border:1px solid #284967;background:var(--navy);color:white}.pet-access-gate #pet-access-count{font-size:14px;margin-bottom:27px}.pet-access-note{font-size:12px;color:var(--muted);max-width:430px;margin:22px auto 0}.pet-access-gate .practice-cta{max-width:340px;margin-left:auto;margin-right:auto}@media(max-width:480px){.pet-access-gate{padding:30px 18px}.pet-access-gate h2{font-size:21px}.pet-access-days{gap:7px}.pet-access-day{height:36px;flex-basis:36px;font-size:13px}}