: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)}.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}