:root{--brand: #185fa5;--brand-light: #f2f7fc;--teal: #0f6e56;--amber: #854f0b;--bg: #fafcff;--text: #1c1c1c;--muted: #888888;--radius: 16px;font-family:Microsoft YaHei,PingFang SC,Hiragino Sans GB,system-ui,sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;padding:0;background:var(--bg);color:var(--text)}#root{max-width:480px;margin:0 auto;min-height:100vh;background:var(--bg)}button{font-family:inherit}.sub-header{display:flex;align-items:center;gap:12px;margin-bottom:14px}.sub-title{font-size:20px;color:var(--brand);margin:0;font-weight:700}.back-btn{width:40px;height:40px;border-radius:50%;border:1px solid var(--brand);background:var(--brand-light);color:var(--brand);font-size:20px;cursor:pointer;line-height:1}.empty-hint{margin-top:40px;text-align:center;color:var(--muted);font-size:15px;padding:0 20px;line-height:1.6}.record-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}.record-item{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--brand-light);border-radius:12px;padding:12px 14px}.record-main{flex:1;min-width:0}.record-zh{font-size:16px;color:var(--text);font-weight:600;word-break:break-word}.record-en{font-size:14px;color:var(--teal);margin-top:4px;word-break:break-word}.record-side{display:flex;align-items:center;gap:8px;flex-shrink:0}.record-time{font-size:12px;color:var(--muted)}.mini-btn{border:1px solid var(--brand);background:#fff;color:var(--brand);border-radius:10px;padding:6px 10px;font-size:14px;cursor:pointer;min-width:36px}.mini-btn.danger{border-color:#c0392b;color:#c0392b}.save-btn{margin-top:10px;border:1px solid var(--amber);background:#fff;color:var(--amber);border-radius:10px;padding:7px 12px;font-size:14px;font-weight:600;cursor:pointer}.save-btn:disabled{opacity:.55;cursor:default}.lesson-card{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--brand-light);border-radius:12px;padding:14px 16px;cursor:pointer}.lesson-main{flex:1;min-width:0}.lesson-title{font-size:17px;font-weight:700;color:var(--brand)}.lesson-sub{font-size:13px;color:var(--muted);margin-top:3px}.lesson-meta{font-size:13px;color:var(--teal);flex-shrink:0;font-weight:600}.dialogue{display:flex;flex-direction:column;gap:12px;margin-bottom:18px}.dlg-row{display:flex;align-items:flex-start;gap:10px}.dlg-role{width:42px;flex-shrink:0;font-size:13px;font-weight:700;text-align:center;padding-top:8px}.dlg-bubble{flex:1;min-width:0;background:#fff;border:1px solid #e3eaf2;border-left:4px solid var(--brand);border-radius:12px;padding:10px 12px;transition:box-shadow .15s,transform .15s,background .15s}.dlg-en{font-size:16px;font-weight:600;color:var(--text);word-break:break-word}.dlg-zh{font-size:13px;color:var(--muted);margin-top:4px;word-break:break-word}.dlg-play{width:44px;height:44px;flex-shrink:0;border-radius:50%;border:1px solid var(--brand);background:var(--brand-light);font-size:16px;cursor:pointer;margin-top:4px}.dlg-active .dlg-bubble{background:#fffbe9;box-shadow:0 0 0 2px var(--amber);transform:scale(1.01)}.roleplay-btn{width:100%;border:1px solid var(--brand);background:var(--brand);color:#fff;border-radius:var(--radius);padding:14px;font-size:17px;font-weight:700;cursor:pointer}.roleplay-btn.playing{background:var(--amber);border-color:var(--amber)}.app-header{display:flex;align-items:baseline;justify-content:space-between;padding:4px 2px 0}.app-title{font-size:22px;font-weight:800;color:var(--brand);letter-spacing:1px}.app-slogan{font-size:13px;color:var(--muted)}.talk-area{position:relative;width:100%;display:flex;flex-direction:column;align-items:center;gap:14px;margin-top:34px}.talk-btn{position:relative;width:190px;height:190px;border-radius:50%;border:none;cursor:pointer;background:radial-gradient(circle at 34% 28%,#2f78c4 0%,var(--brand) 58%,#113f72 100%);box-shadow:0 14px 24px #185fa561,inset 0 4px 8px #ffffff73,inset 0 -10px 16px #0000002e;display:flex;align-items:center;justify-content:center;transition:transform .12s ease,box-shadow .12s ease,background .12s ease;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.talk-btn:after{content:"";position:absolute;width:190px;height:190px;border-radius:50%;box-shadow:0 0 0 3px #fff9,0 0 0 7px #185fa52e;pointer-events:none}.talk-btn.pressing{transform:translateY(5px) scale(.97);background:radial-gradient(circle at 34% 28%,#14a07e 0%,var(--teal) 58%,#0a4636 100%);box-shadow:0 5px 10px #0f6e5666,inset 0 7px 16px #00000052,inset 0 -3px 6px #ffffff2e;animation:talkPulse 1.4s ease-out infinite}.talk-btn.pressing:after{box-shadow:0 0 0 3px #ffffffb3,0 0 0 9px #854f0b59}@keyframes talkPulse{0%{box-shadow:0 5px 10px #0f6e5666,inset 0 7px 16px #00000052,inset 0 -3px 6px #ffffff2e,0 0 #854f0b80}70%{box-shadow:0 5px 10px #0f6e5666,inset 0 7px 16px #00000052,inset 0 -3px 6px #ffffff2e,0 0 0 16px #854f0b00}to{box-shadow:0 5px 10px #0f6e5666,inset 0 7px 16px #00000052,inset 0 -3px 6px #ffffff2e,0 0 #854f0b00}}.talk-caption{font-size:16px;font-weight:700;color:var(--brand);letter-spacing:1px}.talk-caption.active{color:var(--teal)}.pet-stage{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;pointer-events:none}.pet-level{font-size:14px;font-weight:800;color:#fff;letter-spacing:.5px;text-shadow:0 1px 2px rgba(0,0,0,.45)}.pet-avatar{position:relative;transition:opacity .2s,filter .2s}.pet-zzz{position:absolute;top:-6px;right:-10px;font-size:18px;font-weight:800;color:var(--muted);animation:zzzFloat 2.4s ease-in-out infinite}@keyframes zzzFloat{0%,to{transform:translateY(0);opacity:.6}50%{transform:translateY(-5px);opacity:1}}.pet-health{position:relative;width:100px;height:16px;margin-top:4px;background:#e9eef4;border:2px solid rgba(255,255,255,.92);border-radius:9px;overflow:hidden;box-shadow:0 1px 3px #0000002e,inset 0 1px 2px #0000001f}.pet-health-fill{height:100%;border-radius:8px;transition:width .35s ease,background .35s ease}.pet-health-label{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;letter-spacing:.5px;color:#fff;text-shadow:0 0 3px rgba(0,0,0,.55),0 1px 1px rgba(0,0,0,.55)}.parrot-head,.parrot-wing,.parrot-legs,.parrot-eyes{transform-box:fill-box}.parrot-head{transform-origin:50% 100%}.parrot-wing{transform-origin:100% 50%}.parrot-legs{transform-origin:50% 0%}.parrot-eyes{transform-origin:50% 50%}@keyframes pet-shake{0%,to{transform:rotate(0)}20%{transform:rotate(-13deg)}60%{transform:rotate(13deg)}}@keyframes pet-nod{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(9px) rotate(5deg)}}@keyframes pet-tilt{0%,to{transform:rotate(0)}50%{transform:rotate(-17deg)}}@keyframes pet-flap{0%,to{transform:rotate(0)}30%{transform:rotate(-26deg)}65%{transform:rotate(10deg)}}@keyframes pet-kick{0%,to{transform:translateY(0) rotate(0)}40%{transform:translateY(11px) rotate(14deg)}}@keyframes pet-blink{0%,to{transform:scaleY(1)}50%{transform:scaleY(.12)}}.anim-shake{animation:pet-shake .7s ease-in-out}.anim-nod{animation:pet-nod .7s ease-in-out}.anim-tilt{animation:pet-tilt .7s ease-in-out}.anim-flap{animation:pet-flap .7s ease-in-out}.anim-kick{animation:pet-kick .7s ease-in-out}.anim-blink{animation:pet-blink .5s ease-in-out}@media (prefers-reduced-motion: reduce){.anim-shake,.anim-nod,.anim-tilt,.anim-flap,.anim-kick,.anim-blink{animation:none}}.coin-widget{position:absolute;right:0;top:206px;display:flex;flex-direction:column;align-items:center;z-index:2}.coin-icon{width:30px;height:30px;transform-origin:50% 50%;animation:coinSpin 3s linear infinite}.coin-count{margin-top:1px;font-size:13px;font-weight:800;color:var(--amber);text-shadow:0 1px 1px rgba(255,255,255,.6)}@keyframes coinSpin{0%{transform:rotate(0);filter:drop-shadow(0 0 0 rgba(255,205,60,0))}72%{transform:rotate(259deg);filter:drop-shadow(0 0 0 rgba(255,205,60,0))}86%{transform:rotate(310deg);filter:drop-shadow(0 0 12px rgba(255,200,40,.95))}to{transform:rotate(360deg);filter:drop-shadow(0 0 0 rgba(255,205,60,0))}}.feature-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:44px}.shop-h{font-size:16px;color:var(--brand);margin:18px 0 10px}.shop-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.shop-card{display:flex;flex-direction:column;align-items:center;gap:6px;background:#fff;border:2px solid #e3eaf2;border-radius:14px;padding:14px 10px;cursor:pointer;font-family:inherit}.shop-card:disabled{cursor:default}.shop-dot{width:38px;height:38px;border-radius:50%;box-shadow:inset 0 2px 4px #ffffff80,0 2px 5px #0000001f}.shop-name{font-size:15px;font-weight:700;color:var(--text)}.shop-cost{font-size:13px;font-weight:700;color:var(--amber)}.food-btn{width:100%;border:1px solid var(--teal);background:var(--teal);color:#fff;border-radius:var(--radius);padding:14px;font-size:16px;font-weight:700;cursor:pointer}.game-opt{width:100%;border:2px solid #e3eaf2;background:#fff;border-radius:14px;padding:16px;font-size:17px;font-weight:600;color:var(--text);cursor:pointer;font-family:inherit}.game-opt:disabled{cursor:default}.game-opt.correct{border-color:var(--teal);background:#e8f6ee;color:var(--teal)}.game-opt.wrong{border-color:#c0392b;background:#fdecea;color:#c0392b}.game-opt.reveal{border-color:var(--teal);background:#e8f6ee;color:var(--teal)}
