:root{--bg: #fff7ed;--card: #ffffff;--ink: #4a3b2a;--muted: #a3917f;--accent: #ffb703;--accent-deep: #f59e0b;--green: #34d399;--blue: #60a5fa;--pink: #f472b6;--red: #f87171;--radius: 28px;--shadow: 0 10px 30px rgba(74, 59, 42, .12)}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;overscroll-behavior:none}body{font-family:system-ui,-apple-system,PingFang SC,Microsoft YaHei,Segoe UI,sans-serif;background:var(--bg);color:var(--ink);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;touch-action:manipulation}button{font-family:inherit;border:none;background:none;cursor:pointer;color:inherit;touch-action:manipulation}.screen{height:100dvh;display:flex;flex-direction:column;overflow:hidden}.btn{border-radius:999px;padding:1rem 2rem;font-size:1.3rem;font-weight:700;background:var(--card);box-shadow:var(--shadow);transition:transform .1s ease}.btn:active{transform:scale(.96)}.btn.primary{background:var(--accent)}.btn.small{padding:.5rem 1rem;font-size:1rem}.btn:disabled{opacity:.45}.danger-btn{background:var(--red);color:#fff}.start-screen{align-items:center;justify-content:center}.start-card{text-align:center;display:grid;gap:1.5rem;justify-items:center}.start-logo{font-size:7rem;animation:bob 2s ease-in-out infinite}.start-card h1{font-size:2.4rem}.start-btn{font-size:1.8rem;padding:1.2rem 4rem}.onboard-screen{align-items:center;justify-content:center;gap:1.5rem}.onboard-screen h1{font-size:2rem}.onboard-hint{color:var(--muted);font-size:1.1rem}.pet-choices{display:flex;gap:1.5rem}.pet-choice{width:200px;padding:1.5rem 1rem;border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow);display:grid;gap:.5rem;justify-items:center;transition:transform .12s ease}.pet-choice:active{transform:scale(.95)}.pet-choice-emoji{font-size:5rem}.pet-choice-name{font-size:1.4rem;font-weight:800}.pet-choice-desc{color:var(--muted);font-size:.95rem}.home-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.5rem}.home-title{font-size:1.6rem;font-weight:800}.frag-pill{background:var(--card);border-radius:999px;padding:.5rem 1.1rem;font-weight:800;font-size:1.2rem;box-shadow:var(--shadow)}.home-main{flex:1;display:flex;align-items:center;justify-content:center;gap:4rem;padding:1rem}.home-pet{display:grid;justify-items:center;gap:1rem}.feed-btn{background:var(--green)}.home-subjects{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}.subject-btn{width:220px;height:220px;border-radius:var(--radius);display:grid;align-items:center;justify-items:center;gap:.6rem;box-shadow:var(--shadow);transition:transform .12s ease}.subject-btn:active{transform:scale(.95)}.subject-btn.math{background:var(--blue)}.subject-btn.english{background:var(--pink)}.subject-emoji{font-size:5rem}.subject-name{font-size:1.8rem;font-weight:800;color:#fff}.pet{display:grid;justify-items:center}.pet-body{position:relative;line-height:1;animation:bob 2.4s ease-in-out infinite;filter:drop-shadow(0 8px 16px rgba(74,59,42,.18))}.pet-body.happy{animation:jump .6s ease infinite}.pet-hat{position:absolute;top:-.15em;right:-.35em;font-size:.45em}.pet-name{margin-top:.6rem;font-size:1.3rem;font-weight:800}.parent-lock{position:relative;font-size:1.6rem;opacity:.5;padding:.4rem .7rem;border-radius:14px;overflow:hidden}.hold-bar{position:absolute;left:0;bottom:0;height:4px;background:var(--accent-deep)}.gate-overlay{position:fixed;inset:0;background:#4a3b2a73;display:flex;align-items:center;justify-content:center;z-index:50}.gate-card{background:var(--card);border-radius:var(--radius);padding:2rem;display:grid;gap:1rem;justify-items:center;box-shadow:var(--shadow)}.gate-q{font-size:2rem;font-weight:800}.gate-options{display:grid;grid-template-columns:repeat(2,1fr);gap:.8rem}.gate-opt{background:var(--bg);border-radius:16px;padding:.8rem 1.6rem;font-size:1.4rem;font-weight:700}.gate-close{color:var(--muted);font-size:.95rem}.sub-header{display:flex;align-items:center;gap:1rem;padding:1rem 1.5rem}.sub-header h1{font-size:1.6rem}.corner-btn{font-size:1.8rem;padding:.4rem .7rem;border-radius:16px;background:var(--card);box-shadow:var(--shadow)}.game-list{flex:1;display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;padding:1rem 2rem 2rem;align-content:center}.game-card{border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow);padding:1.5rem 1rem;display:grid;gap:.4rem;justify-items:center;transition:transform .12s ease}.game-card:active{transform:scale(.95)}.game-emoji{font-size:4rem}.game-title{font-size:1.5rem;font-weight:800}.game-desc{color:var(--muted);font-size:1rem}.game-meta{font-size:.9rem;color:var(--accent-deep);font-weight:700}.game-shell{flex:1;display:flex;flex-direction:column;overflow:hidden}.game-header{display:flex;align-items:center;gap:1rem;padding:.8rem 1.5rem}.game-title{font-size:1.4rem;font-weight:800;flex:1}.dots{display:flex;gap:.4rem}.dot{width:12px;height:12px;border-radius:50%;background:#4a3b2a26}.dot.now{background:var(--accent-deep);transform:scale(1.2)}.dot.done{background:var(--green)}.prompt-bar{display:flex;align-items:center;gap:1rem;padding:.5rem 1.5rem}.speak-btn{font-size:1.6rem;width:64px;height:64px;border-radius:50%;background:var(--accent);box-shadow:var(--shadow);transition:transform .1s;flex-shrink:0}.speak-btn:active{transform:scale(.92)}.prompt-text{font-size:1.5rem;font-weight:700}.streak{margin-left:auto;font-size:1.2rem;font-weight:800}.q-area{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem;padding:.5rem 2rem 2rem}.cards{display:grid;gap:1.5rem}.cards-2{grid-template-columns:repeat(2,minmax(0,1fr))}.cards-3{grid-template-columns:repeat(3,minmax(0,1fr))}.cards-4{grid-template-columns:repeat(4,minmax(0,1fr))}.opt-card{min-width:170px;min-height:170px;border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow);display:grid;align-items:center;justify-items:center;gap:.4rem;position:relative;transition:transform .1s ease,box-shadow .2s;padding:1rem}.opt-card:active{transform:scale(.94)}.opt-emoji{font-size:5rem;line-height:1}.opt-text{font-size:4.5rem;font-weight:800;line-height:1}.opt-label{font-size:1.1rem;color:var(--muted);font-weight:700}.opt-corner{position:absolute;top:10px;right:12px;font-size:1.6rem;opacity:.9}.opt-card.correct{background:var(--green);animation:pop .45s ease}.opt-card.correct .opt-label{color:#ffffffe6}.opt-card.wrong{background:#fee2e2;animation:shake .4s ease;opacity:.8}.opt-card.dim{opacity:.35}.scene{display:grid;gap:1.5rem;justify-items:center}.scene-items{display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem;max-width:760px}.item-tile{font-size:3rem;line-height:1;padding:.35rem;border-radius:18px;background:#fff9;transition:transform .12s}.item-tile.counted{background:#d9f99d;transform:scale(1.08)}.sides{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem}.side-panel{border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow);padding:1.5rem;min-height:260px;transition:transform .1s}.side-panel:active{transform:scale(.97)}.side-panel.wrong{background:#fee2e2;animation:shake .4s ease}.side-items{display:flex;flex-wrap:wrap;justify-content:center;align-content:center;gap:.8rem;height:100%}.side-item{font-size:3.2rem}.pattern-wrap{display:grid;gap:1.8rem;justify-items:center}.tiles{display:flex;gap:.7rem;flex-wrap:wrap;justify-content:center}.tile{width:90px;height:90px;border-radius:22px;background:var(--card);box-shadow:var(--shadow);display:grid;place-items:center;font-size:3rem}.tile.missing{background:var(--bg);border:3px dashed var(--muted);color:var(--muted);font-size:2.4rem;font-weight:800}.sum{display:grid;gap:1.5rem;justify-items:center}.sum-formula{display:flex;align-items:center;gap:.9rem}.sum-num{min-width:72px;height:72px;display:grid;place-items:center;border-radius:18px;background:var(--card);box-shadow:var(--shadow);font-size:2.6rem;font-weight:800;line-height:1}.sum-answer{border:3px dashed var(--accent-deep);color:var(--accent-deep)}.sum-answer.revealed{border-style:solid;background:var(--green);color:#fff;animation:answer-pop .35s ease}@keyframes answer-pop{0%{transform:scale(.6)}60%{transform:scale(1.15)}to{transform:scale(1)}}.sum-groups{display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap;justify-content:center;max-width:760px}.sum-group{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;align-content:center;background:#fff9;border-radius:18px;padding:.6rem;min-width:90px;min-height:90px}.sum-item{font-size:3rem;line-height:1}.sum-item.ghost{opacity:.35;filter:grayscale(1);text-decoration:line-through}.sum-op{font-size:3rem;font-weight:800;color:var(--muted)}.sum-q{min-width:80px;height:80px;border-radius:20px;border:3px dashed var(--muted);display:grid;place-items:center;font-size:2.2rem;font-weight:800;color:var(--muted)}.reward-overlay{position:fixed;inset:0;background:#fff7edf5;display:flex;align-items:center;justify-content:center;z-index:40}.reward-card{text-align:center;display:grid;gap:.8rem;justify-items:center;position:relative;padding:2.5rem 4rem;background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.reward-card h2{font-size:2.2rem}.reward-frag{font-size:1.8rem;font-weight:800;color:var(--accent-deep)}.reward-hint{color:var(--muted)}.reward-actions{display:flex;gap:1rem;margin-top:1rem}.confetti span{position:absolute;font-size:1.8rem;animation:floatUp 1.6s ease-out infinite}.confetti span:nth-child(1){left:12%}.confetti span:nth-child(2){right:16%;animation-delay:.3s}.confetti span:nth-child(3){left:30%;bottom:10%}.confetti span:nth-child(4){right:30%;bottom:15%;animation-delay:.5s}.confetti span:nth-child(5){left:50%;top:8%;animation-delay:.8s}.parent-body{flex:1;overflow-y:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.2rem;padding:0 2rem 2rem;align-content:start;-webkit-overflow-scrolling:touch}.parent-card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:1.4rem;display:grid;gap:.8rem;align-content:start}.parent-card h2{font-size:1.2rem;color:var(--accent-deep)}.kv{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;font-size:1.02rem}.kv span{color:var(--muted)}.field{display:flex;justify-content:space-between;align-items:center;gap:1rem}.field select,.parent-card input{font-size:1.05rem;padding:.55rem .8rem;border-radius:12px;border:2px solid rgba(74,59,42,.15);background:var(--bg);font-family:inherit}.field-row{display:flex;gap:.8rem}.field-row input{flex:1}.wrong-list{list-style:none;display:grid;gap:.4rem;font-size:1rem}.muted{color:var(--muted);font-size:.95rem}.parent-card.danger{border:2px solid rgba(248,113,113,.4)}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes jump{0%,to{transform:translateY(0) scale(1)}30%{transform:translateY(-22px) scale(1.06)}60%{transform:translateY(0) scale(.97)}}@keyframes pop{0%{transform:scale(1)}40%{transform:scale(1.12)}to{transform:scale(1)}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-8px)}75%{transform:translate(8px)}}@keyframes floatUp{0%{transform:translateY(0);opacity:0}20%{opacity:1}to{transform:translateY(-90px);opacity:0}}@media (max-width: 820px){.home-main{flex-direction:column;gap:1.5rem}.pet-choices{flex-direction:column}.game-list{grid-template-columns:1fr;overflow-y:auto}.parent-body{grid-template-columns:1fr}.cards-4{grid-template-columns:repeat(2,1fr)}}.write-wrap{display:grid;gap:1.2rem;justify-items:center}.write-wrap.shake{animation:shake .5s ease}.write-card{position:relative;width:min(64vw,380px);aspect-ratio:1;background:#fff;border-radius:28px;box-shadow:var(--shadow);overflow:hidden;touch-action:none}.write-glyph{position:absolute;inset:0;display:grid;place-items:center;color:transparent;-webkit-text-stroke:7px #e6dcc9;user-select:none;pointer-events:none;line-height:1}.write-canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:crosshair}.write-pass{position:absolute;inset:0;display:grid;place-items:center;font-size:7rem;background:#34d3992e;animation:pop .45s ease}.write-actions{display:flex;gap:1rem}.write-btn{padding:.8rem 1.6rem;border-radius:999px;border:none;font-size:1.3rem;font-weight:800;box-shadow:var(--shadow)}.write-btn.primary{background:var(--green);color:#fff}.write-btn.ghost{background:#fff;color:var(--ink)}.write-btn:active{transform:scale(.95)}.write-btn:disabled{opacity:.5}.level-picker{display:grid;gap:.7rem;background:#ffffff8c;border-radius:24px;padding:1rem;box-shadow:var(--shadow)}.voice-actions{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:.6rem}.voice-actions button{padding:.5rem .9rem;border-radius:12px;border:2px solid var(--accent);background:#fff;color:var(--ink);font-weight:700}.level-title{font-size:1.1rem;font-weight:800;text-align:center}.level-row{display:flex;gap:.8rem}.level-card{flex:1;display:grid;justify-items:center;gap:.15rem;padding:.9rem .4rem .8rem;border-radius:20px;background:var(--card);border:3px solid transparent;box-shadow:0 4px 14px #4a3b2a1a;transition:transform .15s ease,border-color .15s ease}.level-card:active{transform:scale(.96)}.level-card.active{border-color:var(--green);background:#f0fdf7}.level-emoji{font-size:2rem;line-height:1.2}.level-name{font-size:1.15rem;font-weight:800}.level-range{font-size:.9rem;color:var(--muted)}@media (max-width: 820px){.level-row{flex-direction:column}}.day-chips{display:flex;gap:.5rem;flex-wrap:wrap;margin:.6rem 0 1rem}.day-chip{padding:.45rem .9rem;border-radius:999px;border:2px solid #e6dcc9;background:#fff;font-size:.95rem;color:#6b5b45}.day-chip.active{background:#f4a261;border-color:#f4a261;color:#fff}.report-sub{margin:1rem 0 .4rem;font-size:1rem;color:#6b5b45}
