@font-face{font-family:Nunito;font-style:normal;font-display:swap;font-weight:700;src:url(/assets/nunito-latin-700-normal-Dort48En.woff2)format("woff2"),url(/assets/nunito-latin-700-normal-OcDqTBcA.woff)format("woff")}@font-face{font-family:Nunito;font-style:normal;font-display:swap;font-weight:800;src:url(/assets/nunito-latin-800-normal-Dz8SOQK_.woff2)format("woff2"),url(/assets/nunito-latin-800-normal-D-J0wlBY.woff)format("woff")}@font-face{font-family:ZCOOL KuaiLe;font-style:normal;font-weight:400;font-display:swap;src:url(/assets/ZCOOLKuaiLe-Regular-CvIfguNK.ttf)format("truetype")}html{height:100%}body{min-height:100%;margin:0}:root{--sky-top:#9ad7ff;--sky-mid:#b8f0d8;--sky-bottom:#ffe8a3;--ink:#1f2a37;--soft:#ffffff8c;--btn:#ff7a59;--btn-ink:#fff7f2;--shadow:0 10px 28px #1f2a371a;color:var(--ink);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Nunito,ZCOOL KuaiLe,system-ui,sans-serif;font-weight:700;line-height:1.2}*{box-sizing:border-box}html,body,#root{touch-action:manipulation;overscroll-behavior:none;cursor:url(/cursor.svg) 38 38,pointer;width:100%;height:100%;margin:0;overflow:hidden}body{background:radial-gradient(circle at 18% 20%, #ffffff8c, transparent 28%), radial-gradient(circle at 82% 18%, #ffd6a573, transparent 26%), linear-gradient(165deg, var(--sky-top), var(--sky-mid) 48%, var(--sky-bottom));min-width:320px}button{font:inherit;cursor:url(/cursor.svg) 38 38,pointer;border:0}button:active,.nav-btn:active{cursor:url(/cursor-active.svg) 38 42,pointer}a,.track{cursor:url(/cursor.svg) 38 38,pointer}.app{width:100%;height:100dvh;padding-top:max(clamp(8px, 1.4vw, 16px), env(safe-area-inset-top,0px));padding-right:max(clamp(10px, 2vw, 24px), env(safe-area-inset-right,0px));padding-bottom:max(clamp(14px, 2.5vw, 28px), env(safe-area-inset-bottom,0px));padding-left:max(clamp(10px, 2vw, 24px), env(safe-area-inset-left,0px));-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;grid-template-rows:auto minmax(0,1fr) auto;gap:clamp(8px,1.4vh,14px);display:grid}.top{flex-shrink:0;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;display:grid}.parent-tools{justify-content:center;align-items:center;gap:6px;min-width:0;display:flex}.brand{letter-spacing:.04em;justify-self:start;margin:0;font-family:ZCOOL KuaiLe,Nunito,sans-serif;font-size:clamp(1rem,2.4vw,1.4rem)}.progress{opacity:.7;justify-self:end;margin:0;font-size:.85rem}.speak-btn{background:#ffd43b;border-radius:12px;place-items:center;width:36px;height:36px;font-size:1rem;line-height:1;display:grid;box-shadow:0 6px #f59f00}.speak-btn:active{transform:translateY(4px);box-shadow:0 2px #f59f00}.top-actions{justify-self:center;align-items:center;gap:8px;display:flex}.auto-btn{width:36px;height:36px;color:var(--ink);background:#ffffffb8;border-radius:12px;place-items:center;font-size:1rem;line-height:1;display:grid;box-shadow:0 6px #1f2a3724}.auto-btn.on{color:#fff;background:#20c997;box-shadow:0 6px #0ca678}.auto-btn:active{transform:translateY(4px);box-shadow:0 2px #1f2a3724}.auto-btn.on:active{box-shadow:0 2px #0ca678}.sections{scrollbar-width:none;flex-wrap:nowrap;gap:8px;padding:2px 2px 4px;display:flex;overflow-x:auto}.sections::-webkit-scrollbar{display:none}.section-btn{min-height:32px;color:var(--ink);background:#ffffff9e;border-radius:10px;flex:none;padding:0 10px;font-size:.85rem;box-shadow:0 3px #1f2a371f}.section-btn.on{color:#fff;background:#15aabf;box-shadow:0 3px #0b7285}.section-btn:active{transform:translateY(2px);box-shadow:0 1px #1f2a371f}.sheet{z-index:0;place-items:stretch stretch;min-height:0;padding:2px 4px 10px;animation:.32s cubic-bezier(.22,1,.36,1) slide-in;display:grid;position:relative;overflow:visible}.sheet-next{--from-x:28px}.sheet-prev{--from-x:-28px}@keyframes slide-in{0%{opacity:.35;transform:translateX(var(--from-x,28px)) scale(.98)}to{opacity:1;transform:translate(0)scale(1)}}.stage{text-align:center;height:100%;min-height:0;box-shadow:var(--shadow);background:var(--soft);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);isolation:isolate;border-radius:clamp(24px,4vw,40px);flex-direction:column;justify-content:center;align-items:center;gap:clamp(6px,1.2vh,14px);padding:clamp(10px,2.5vw,28px);display:flex;overflow:hidden}.word-block{flex-direction:column;align-items:center;gap:clamp(4px,.8vh,10px);min-width:0;display:flex}.stage-color{background:0 0}.stroke-demo{box-shadow:none;background:0 0;border-radius:0;place-items:center;max-width:100%;padding:0;display:grid}.stroke-row{flex-wrap:nowrap;justify-content:center;align-items:center;gap:clamp(4px,1vw,12px);max-height:min(42vh,340px);display:flex}.stroke-cell{flex:none}.stage-color .stroke-demo{box-shadow:none;background:0 0}.stage-color .english{color:inherit;opacity:1}.giant{letter-spacing:.02em;text-shadow:0 8px #0000000f;margin:0;font-family:ZCOOL KuaiLe,Nunito,sans-serif;font-size:clamp(6.5rem,min(32vw,28vh),17rem);line-height:.92}.giant-long{font-size:clamp(5rem,min(22vw,22vh),12rem)}.giant-xl{font-size:clamp(3.8rem,min(16vw,18vh),9rem)}.hint{opacity:.85;min-height:44px;margin:0;padding:8px 16px;font-size:clamp(1.2rem,min(3.2vw,3.5vh),2rem)}.tap{touch-action:manipulation}.photo-wrap.tap,.stroke-demo.tap,.giant.tap,.items.tap{animation:1.7s ease-in-out infinite tap-invite}@keyframes tap-invite{0%,to{transform:scale(1)}50%{transform:scale(1.04)}}.tap:active{filter:brightness(.92);animation:none;transform:scale(.94)}.photo-wrap.tap,.items.tap{box-shadow:none;background:0 0;border-radius:22px;padding:0}.items.tap{border-radius:0}.english{letter-spacing:.04em;color:#0b7285;margin:0;font-size:clamp(2rem,min(6vw,6vh),4rem)}.emoji{filter:drop-shadow(0 10px #0000000f);font-size:clamp(5rem,min(22vw,22vh),12rem);line-height:1}.bounce{animation:1.4s ease-in-out infinite bounce}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-14px)}}.items{flex-wrap:wrap;justify-content:center;gap:clamp(10px,2.4vw,22px);max-width:min(92vw,820px);display:flex}.items-many{gap:clamp(6px,1.4vw,12px);max-width:min(94vw,900px)}.item{font-size:clamp(4.2rem,14vw,8rem);line-height:1}.items-many .item{font-size:clamp(2.8rem,9vw,5.2rem)}.pop{animation:.42s cubic-bezier(.22,1,.36,1) both pop}@keyframes pop{0%{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}.stage-animal,.stage-thing{grid-template-rows:minmax(0,1fr) auto auto;grid-template-columns:minmax(0,1fr);align-content:stretch;place-items:stretch stretch;display:grid}.stage-animal .word-block,.stage-thing .word-block,.stage-animal .hint,.stage-thing .hint{z-index:1;position:relative}.stage-animal .english,.stage-thing .english{font-size:clamp(1.4rem,min(4.2vw,3.6vh),2.4rem)}.photo-wrap{width:min(100%,520px);height:100%;min-height:0;margin-inline:auto;display:block;position:relative;overflow:hidden}.photo,.photo-wrap .emoji{object-fit:contain;border-radius:22px;width:100%;height:100%;position:absolute;inset:0}.photo-wrap .emoji{place-items:center;font-size:clamp(3.2rem,min(16vw,14vh),6rem);display:grid}.nav{z-index:2;flex-shrink:0;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding-bottom:12px;display:grid;position:relative}.nav-btn{background:var(--btn);width:clamp(64px,12vw,88px);height:clamp(64px,12vw,88px);color:var(--btn-ink);border-radius:28px;font-size:clamp(2.4rem,7vw,3.4rem);line-height:1;transition:transform .12s,box-shadow .12s;box-shadow:0 8px #d9480f}.nav-btn:active{transform:translateY(5px);box-shadow:0 3px #d9480f}.track{background:#1f2a3724;border-radius:999px;height:16px;overflow:hidden}.track-fill{border-radius:inherit;background:linear-gradient(90deg,#20c997,#15aabf);height:100%;transition:width .22s}@media (width<=640px){.giant{font-size:clamp(5.2rem,min(34vw,26vh),10rem)}.giant-long{font-size:clamp(4rem,min(24vw,20vh),7.5rem)}.giant-xl{font-size:clamp(3.2rem,min(18vw,16vh),6rem)}.emoji{font-size:clamp(4.4rem,min(26vw,20vh),8rem)}.nav-btn{border-radius:24px}}