body{margin:0}:root{--bg-deep:#10243f;--bg-mid:#1d4d73;--bg-glow:#ffb15a;--surface:#fff6df29;--surface-strong:#fff6df47;--card:#fff6df;--card-ink:#2a2118;--card-shadow:#160c0447;--accent:#ff6b4a;--accent-dark:#e24b2c;--accent2:#ffd15c;--success:#3cbe6e;--success-dark:#249456;--text:#2a2118;--hint:#fff8ea;--radius-lg:1.25rem;--radius-xl:1.75rem;--touch-min:3rem;font-family:PingFang SC,Noto Sans SC,system-ui,sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html{touch-action:manipulation}body{min-height:100dvh;color:var(--hint);background:radial-gradient(90% 42% at 50% 118%,#ff8a2ed9 0%,#0000 58%),radial-gradient(circle at 82% 8%,#ffd67859 0%,#0000 18%),linear-gradient(#16345c 0%,#1f6a8a 42%,#1d6b45 78%,#145233 100%);margin:0}body:before{content:"";pointer-events:none;z-index:0;background-image:radial-gradient(circle,#fff 1.1px,#0000 1.6px),radial-gradient(circle,#ffecaaf2 1.4px,#0000 2px),radial-gradient(circle,#fff 1px,#0000 1.5px);background-position:12px 20px,80px 40px,40px 90px;background-size:140px 180px,220px 260px,90px 120px;animation:3.6s ease-in-out infinite twinkle;position:fixed;inset:0}#root{z-index:1;min-height:100dvh;position:relative}@keyframes twinkle{50%{opacity:.55}}.app-shell{max-width:32rem;min-height:100dvh;padding:max(.75rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) max(1.5rem, env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left));flex-direction:column;gap:.85rem;margin:0 auto;display:flex}.app-shell--home{justify-content:flex-start}.app-shell.loading{text-align:center;justify-content:center;align-items:center;gap:1rem}.loading-text{margin:0;font-size:1.15rem}.loader-bounce{font-size:3rem;animation:1s ease-in-out infinite bounce}@keyframes bounce{50%{transform:translateY(-8px)}}.linkish-btn{background:var(--surface-strong);color:#fff;min-height:var(--touch-min);cursor:pointer;border:none;border-radius:999px;padding:.75rem 1.25rem;font-size:1rem}.home-screen{flex-direction:column;gap:1.25rem;width:100%;display:flex}.home-hero{text-align:center;padding:.5rem .5rem .25rem}.home-scene{max-width:16rem;height:7.5rem;margin:0 auto .25rem;position:relative}.home-moon,.home-star,.home-tent{filter:drop-shadow(0 6px #10243f40);position:absolute}.home-moon{font-size:2.6rem;top:.2rem;right:1.2rem}.home-star{color:var(--accent2);font-size:1.35rem}.home-star-a{animation:2.4s ease-in-out infinite twinkle;top:1.4rem;left:1.6rem}.home-star-b{font-size:.95rem;top:.35rem;left:4.2rem}.home-tent{font-size:4.2rem;line-height:1;bottom:0;left:50%;transform:translate(-50%)}.home-title{letter-spacing:.02em;margin:.5rem 0 .25rem;font-size:clamp(1.75rem,6vw,2.25rem);font-weight:800}.home-subtitle{opacity:.88;margin:0;font-size:1.05rem}.lesson-list{flex-direction:column;gap:.75rem;margin:0;padding:0;list-style:none;display:flex}.lesson-card{border-radius:var(--radius-xl);background:linear-gradient(180deg, #fffdf6, var(--card));width:100%;min-height:5.25rem;color:var(--card-ink);cursor:pointer;text-align:left;touch-action:manipulation;border:3px solid #ffe08a;align-items:center;gap:1rem;padding:1rem 1rem 1rem 1.1rem;transition:transform .15s;display:flex;box-shadow:0 8px #e7a23a}.lesson-card:active{transform:translateY(4px);box-shadow:0 4px #e7a23a}.lesson-card-emoji{text-align:center;flex-shrink:0;width:3rem;font-size:2.25rem}.lesson-card-text{flex-direction:column;flex:1;gap:.15rem;min-width:0;display:flex}.lesson-card-title{font-size:1.25rem;font-weight:800}.lesson-card-sub{color:#7a5a32;font-size:.95rem}.lesson-card-go{color:#fff;background:linear-gradient(#ffb15a,#ff7a3c);border-radius:999px;flex-shrink:0;padding:.45rem .75rem;font-size:.95rem;font-weight:800;box-shadow:0 3px #d85a22}.home-empty,.home-footer-hint{text-align:center;opacity:.8;margin:0;font-size:.95rem}.app-header{grid-template-columns:var(--touch-min) 1fr var(--touch-min);align-items:center;gap:.35rem;display:grid}.back-btn,.mute-btn{width:var(--touch-min);height:var(--touch-min);cursor:pointer;touch-action:manipulation;background:#fff6dfeb;border:3px solid #ffe08ad9;border-radius:999px;justify-content:center;align-items:center;font-size:1.35rem;display:flex;box-shadow:0 4px #10243f47}.title-btn{color:inherit;cursor:pointer;min-height:var(--touch-min);touch-action:manipulation;background:0 0;border:none;justify-content:center;align-items:center;gap:.35rem;padding:.35rem;font-size:1.1rem;font-weight:800;display:flex}.title-text{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.app-emoji{flex-shrink:0}.gate-map-wrap{flex-direction:column;align-items:stretch;gap:.35rem;display:flex}.gate-map{scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;background:#10243f47;border:3px dashed #ffd15cb3;border-radius:1.4rem;gap:.35rem;padding:.55rem .45rem;display:flex;overflow-x:auto}.gate-map::-webkit-scrollbar{display:none}.gate-node{scroll-snap-align:center;min-width:4.25rem;color:inherit;opacity:.5;font:inherit;cursor:default;background:0 0;border:none;flex-direction:column;flex:none;align-items:center;gap:.15rem;padding:.35rem .25rem;display:flex}.gate-node.replayable{cursor:pointer;touch-action:manipulation}.gate-node.replayable:active{transform:scale(.95)}.gate-node.current,.gate-node.done{opacity:1}.gate-node.current{background:var(--card);color:var(--card-ink);border-radius:1rem;transform:translateY(-3px);box-shadow:0 5px #e7a23a}.gate-icon{font-size:1.1rem;line-height:1}.gate-star{font-size:1.35rem;line-height:1}.gate-label{text-align:center;max-width:4.5rem;font-size:.7rem;font-weight:700;line-height:1.2}.gate-stars-total{text-align:center;color:var(--card-ink);background:#fff6dfeb;border-radius:999px;align-self:center;margin:0;padding:.2rem .75rem;font-size:.95rem;font-weight:800}.section-toolbar{background:var(--card);color:var(--card-ink);border-radius:999px;justify-content:space-between;align-items:center;gap:.5rem;padding:.45rem .5rem .45rem .9rem;font-size:.95rem;display:flex;box-shadow:0 5px #10243f38}.section-toolbar-label{padding-left:.15rem;font-weight:800}.section-restart-btn{color:var(--card-ink);font:inherit;cursor:pointer;touch-action:manipulation;white-space:nowrap;background:#ffe08a;border:none;border-radius:999px;min-height:2.5rem;padding:.55rem .85rem;font-size:.85rem;font-weight:800}.section-restart-btn:active{background:#ffffff38}.app-main{flex:1;justify-content:center;align-items:center;min-height:0;padding:.25rem 0;display:flex}.activity{text-align:center;flex-direction:column;align-items:center;gap:1.1rem;width:100%;max-width:100%;display:flex}.activity-hint{opacity:.92;margin:0;font-size:1.05rem;font-weight:600}.big-btn{min-height:var(--touch-min);border-radius:var(--radius-lg);cursor:pointer;touch-action:manipulation;border:none;min-width:8.5rem;padding:.85rem 1.35rem;font-size:clamp(1.15rem,4vw,1.35rem);font-weight:800;transition:transform .1s,box-shadow .1s,filter .1s;box-shadow:0 4px #00000038}.big-btn:active:not(:disabled){filter:brightness(.97);transform:translateY(3px);box-shadow:0 1px #0003}.big-btn:disabled{opacity:.45;cursor:not-allowed}.big-btn--primary{background:linear-gradient(180deg, var(--accent), var(--accent-dark));color:#fff}.big-btn--success{background:linear-gradient(180deg, var(--success), var(--success-dark));color:#fff}.big-btn--ghost{color:var(--card-ink);background:#fff6dfeb;border:3px solid #ffe08a;font-size:1rem;box-shadow:0 4px #10243f38}.big-btn--choice{background:linear-gradient(180deg, #fffef8, var(--card));color:var(--text);width:100%;max-width:100%;min-height:3.75rem;font-size:clamp(1.35rem,5vw,1.65rem);box-shadow:0 5px #0000001f}.choice-grid{grid-template-columns:1fr;gap:.85rem;width:100%;max-width:20rem;display:grid}.choice-row{grid-template-columns:1fr 1fr;gap:.85rem;width:100%;max-width:22rem;display:grid}@media (width>=400px){.choice-row{gap:1rem}}.choice-right{outline:3px solid var(--accent2);outline-offset:2px;animation:.35s pop}.choice-shake{animation:.45s shake}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-6px)}75%{transform:translate(6px)}}@keyframes pop{50%{transform:scale(1.04)}}.flashcard-card{width:100%;max-width:20rem;min-height:13rem;color:var(--card-ink);cursor:pointer;touch-action:manipulation;background:linear-gradient(#ff8a3c,#ff8a3c) 50% .85rem/4.5rem .7rem no-repeat,linear-gradient(#fffdf8,#ffe7a8);border:4px solid #ffe08a;border-radius:2rem;flex-direction:column;justify-content:center;align-items:center;gap:.65rem;padding:2rem 1rem 1.25rem;display:flex;box-shadow:0 10px #e7a23a}.flashcard-card:active{transform:scale(.98)}.flashcard-word{font-size:clamp(2.75rem,14vw,3.75rem);font-weight:900;line-height:1.15}.flashcard-tap{opacity:.65;font-size:.95rem;font-weight:600}.flashcard-nav{justify-content:center;align-items:center;gap:.45rem;width:min(100%,22rem);display:flex}.card-step{width:2.75rem;height:2.75rem;color:var(--card-ink);cursor:pointer;touch-action:manipulation;background:#fff6dfeb;border:3px solid #ffe08a;border-radius:999px;flex:none;padding:0 0 .15rem;font-size:2rem;font-weight:700;line-height:1;box-shadow:0 4px #10243f38}.card-step:disabled{opacity:.35;cursor:default;box-shadow:none}.progress-dots{flex-wrap:wrap;justify-content:center;align-items:center;gap:.4rem;max-width:100%;margin:0;display:flex}.dot{background:#ffffff47;border-radius:50%;width:.55rem;height:.55rem}.dot.seen{background:#ffd15cb8}.dot.on{background:var(--accent2);transform:scale(1.35)}.feedback-line{min-height:1.4rem;margin:0;font-size:1.15rem;font-weight:800}.feedback-line.right{color:var(--accent2)}.feedback-line.wrong{color:#ffb4c8}.quiz-blank{color:#e25b1a;letter-spacing:.04em;margin:0 .2rem;display:inline-block}.quiz-stem{background:var(--card);color:var(--card-ink);word-break:break-word;text-align:left;border:3px solid #ffe08a;border-radius:1.25rem;width:100%;max-width:22rem;margin:0;padding:1.05rem 1.15rem;font-size:clamp(1.25rem,4.5vw,1.5rem);line-height:1.6;box-shadow:0 6px #10243f33}.replay-btn{width:auto;min-width:7rem}.celebration .star-burst{letter-spacing:.15em;font-size:clamp(2rem,10vw,2.75rem);animation:.6s infinite alternate pop}.cele-title{color:var(--accent2);margin:0;font-size:clamp(1.75rem,7vw,2.25rem);font-weight:900}.cele-actions{flex-direction:column;gap:.75rem;width:100%;max-width:16rem;display:flex}.parent-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:100;padding:1rem;padding-bottom:max(1rem, env(safe-area-inset-bottom));background:#080a1ca6;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.parent-panel{color:var(--text);border-radius:var(--radius-xl) var(--radius-xl) var(--radius-lg) var(--radius-lg);background:#fff;flex-direction:column;gap:.65rem;width:min(100%,24rem);padding:1.25rem 1.25rem 1rem;display:flex;box-shadow:0 -8px 40px #00000040}.parent-panel h3{margin:0 0 .25rem;font-size:1.15rem}.parent-panel button{cursor:pointer;touch-action:manipulation;background:#f7f7f9;border:1px solid #e8e8e8;border-radius:.85rem;min-height:3rem;font-size:1rem;font-weight:600}.parent-close{margin-top:.25rem;background:linear-gradient(180deg, var(--accent), var(--accent-dark))!important;color:#fff!important;border:none!important}.section-intro{width:min(100%,20rem);min-height:17rem;color:var(--card-ink);cursor:pointer;font:inherit;background:linear-gradient(#fffdf8,#ffe7a8);border:4px solid #ffe08a;border-radius:2rem;flex-direction:column;justify-content:center;align-items:center;gap:.3rem;padding:1.4rem 1rem 1.2rem;animation:.45s cubic-bezier(.2,1.4,.4,1) intro-pop;display:flex;box-shadow:0 12px #e7a23a}.section-intro-kicker{letter-spacing:.18em;color:#c45a12;font-size:.95rem;font-weight:800}.section-intro-emoji{margin:.15rem 0;font-size:4.4rem;line-height:1}.section-intro-title{font-size:clamp(1.8rem,8vw,2.3rem);font-weight:900;line-height:1.15}.section-intro-line{font-size:1.15rem;font-weight:700}.section-intro-go{color:#fff;background:linear-gradient(#ffb15a,#ff7a3c);border-radius:999px;margin-top:.85rem;padding:.55rem 1.15rem;font-size:1.15rem;font-weight:800;box-shadow:0 4px #d85a22}@keyframes intro-pop{0%{opacity:0;transform:scale(.84)translateY(14px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){body:before,.home-star-a,.section-intro,.celebration .star-burst{animation:none}}