:root{--bg-top:#fff5ee;--bg-bottom:#fff;--nav:#1a1a2e;--ink:#1a1a2e;--ink-2:#6b7280;--ink-3:#9ca3af;--card-ai:#fff;--card-user:#fff0e0;--tag-bg:#f5f0ff;--tag-border:#e9d5ff;--accent:#6366f1;--record:#e94560;--offline-bg:#fef3c7;--offline-ink:#92400e;--input-bg:#f5f5f5;--line:#f3f4f6;--shadow-card:0 2px 12px #0000000f;--radius-card:16px;--radius-pill:999px;--font:"Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", system-ui, sans-serif;--header-h:56px;--composer-h:72px;--max-col:720px}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}*,:before,:after{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--font);color:var(--ink);background:linear-gradient(180deg, var(--bg-top) 0%, var(--bg-bottom) 40%);-webkit-font-smoothing:antialiased;background-attachment:fixed}button,textarea,select{font:inherit}button{cursor:pointer;color:inherit;background:0 0;border:none;padding:0}button:disabled{cursor:not-allowed;opacity:.5}img{display:block}.app-shell{flex-direction:column;align-items:center;height:100%;min-height:100%;display:flex}.app-column{width:100%;max-width:var(--max-col);background:0 0;flex-direction:column;height:100%;min-height:100dvh;display:flex;position:relative}.app-header{height:var(--header-h);background:var(--nav);color:#fff;z-index:10;flex-shrink:0;grid-template-columns:48px 1fr 48px;align-items:center;padding:0 8px;display:grid}.app-title{text-align:center;letter-spacing:.02em;margin:0;font-size:16px;font-weight:600}.header-btn{color:#fff;border-radius:10px;place-items:center;width:40px;height:40px;display:grid}.header-btn img{filter:invert()}.hamburger{font-size:20px;line-height:1}.icon-btn{place-items:center;display:inline-grid}.offline-banner{width:100%;max-width:var(--max-col);background:var(--offline-bg);color:var(--offline-ink);text-align:center;border-bottom:1px solid #fcd34d;padding:8px 12px;font-size:13px}.message-list{-webkit-overflow-scrolling:touch;flex:1;padding:16px 12px 12px;overflow-y:auto}.empty-state{padding:40px 8px 24px}.empty-title{color:var(--ink);margin:0 0 8px;font-size:30px;font-weight:700}.empty-sub{color:var(--ink-2);margin:0 0 20px;font-size:14px}.topic-row{scrollbar-width:none;gap:8px;padding-bottom:4px;display:flex;overflow-x:auto}.topic-row::-webkit-scrollbar{display:none}.topic-chip{border-radius:var(--radius-pill);background:var(--tag-bg);border:1px solid var(--tag-border);color:var(--accent);white-space:nowrap;flex-shrink:0;padding:8px 14px;font-size:13px;font-weight:500}.topic-chip:hover{filter:brightness(.97)}.bubble{border-radius:var(--radius-card);max-width:85%;margin-bottom:12px;padding:14px;position:relative}.bubble-ai{background:var(--card-ai);box-shadow:var(--shadow-card);max-width:70%;margin-right:auto}.bubble-user-wrap{flex-direction:column;align-items:flex-end;margin-bottom:12px;display:flex}.bubble-user{background:var(--card-user);max-width:65%;margin-bottom:0;margin-left:auto}.bubble-primary{color:var(--ink);white-space:pre-wrap;word-break:break-word;margin:0;font-size:15.5px;line-height:1.7}.bubble-divider{background:var(--line);height:1px;margin:10px 0}.bubble-secondary{color:var(--ink-3);white-space:pre-wrap;word-break:break-word;margin:0;font-size:13px;line-height:1.5}.bubble-actions{justify-content:flex-end;margin-top:8px;display:flex}.play-btn{background:var(--line);width:44px;min-width:44px;height:44px;min-height:44px;color:var(--ink);touch-action:manipulation;border-radius:50%;place-items:center;display:grid}.play-btn.playing{background:var(--accent);color:#fff;animation:1.6s linear infinite spin-soft}.play-btn.playing img{filter:invert()}.play-btn.muted{opacity:.55}.voice-tag{color:var(--ink-2);margin-top:6px;font-size:12px;display:block}.retry-link{color:var(--record);margin-top:4px;margin-right:4px;font-size:12px;text-decoration:underline}.msg-enter-ai{animation:.26s ease-out slide-in-left}.msg-enter-user{animation:.26s ease-out slide-in-right}@keyframes slide-in-left{0%{opacity:0;transform:translate(-10px)translateY(8px)}to{opacity:1;transform:none}}@keyframes slide-in-right{0%{opacity:0;transform:translate(10px)translateY(8px)}to{opacity:1;transform:none}}@keyframes spin-soft{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-row{align-items:center;gap:10px;padding:8px 4px 16px;display:flex}.loading-label{color:var(--ink-3);font-size:13px}.dots{gap:6px;display:inline-flex}.dots i{background:#d1d5db;border-radius:50%;width:8px;height:8px;animation:1s ease-in-out infinite bounce;display:block}.dots i:nth-child(2){animation-delay:.15s}.dots i:nth-child(3){animation-delay:.3s}@keyframes bounce{0%,80%,to{opacity:.5;transform:translateY(0)}40%{opacity:1;transform:translateY(-6px)}}.composer{border-top:1px solid var(--line);padding:8px 12px calc(10px + env(safe-area-inset-bottom,0px));background:#fff;flex-shrink:0}.composer-hint{color:var(--ink-3);margin-bottom:6px;padding-left:4px;font-size:11px}.composer-row{align-items:flex-end;gap:8px;display:flex}.composer-input{resize:none;background:var(--input-bg);border-radius:var(--radius-pill);max-height:120px;color:var(--ink);border:none;outline:none;flex:1;padding:12px 16px;font-size:15px;line-height:1.4}.composer-input::placeholder{color:var(--ink-3)}.mic-btn{background:var(--nav);color:#fff;touch-action:none;-webkit-user-select:none;user-select:none;border-radius:50%;flex-shrink:0;place-items:center;width:44px;height:44px;display:grid}.mic-btn img{filter:invert()}.mic-btn.recording{background:var(--record);animation:1s ease-in-out infinite pulse-mic}.mic-btn.denied{background:#9ca3af}@keyframes pulse-mic{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}.send-btn{background:var(--accent);color:#fff;border-radius:50%;flex-shrink:0;place-items:center;width:44px;height:44px;display:grid}.send-btn img{filter:invert()}.mic-denied-tip{color:var(--record);margin:6px 4px 0;font-size:12px}.record-overlay{z-index:40;background:#00000059;place-items:center;display:grid;position:fixed;inset:0}.record-panel{color:#fff;flex-direction:column;align-items:center;gap:14px;display:flex}.record-mic{background:var(--record);border-radius:50%;place-items:center;width:96px;height:96px;animation:1.2s ease-in-out infinite pulse-mic;display:grid;box-shadow:0 0 0 12px #e9456040}.record-mic img{filter:invert()}.record-mic.cancel{background:#6b7280;box-shadow:0 0 0 12px #6b728040}.waveform{align-items:flex-end;gap:5px;height:28px;display:flex}.waveform span{background:#fff;border-radius:2px;width:4px;height:10px;animation:.8s ease-in-out infinite wave}@keyframes wave{0%,to{height:8px}50%{height:26px}}.record-time{font-variant-numeric:tabular-nums;margin:0;font-size:18px}.countdown{color:#fcd34d;font-weight:600}.record-tip{opacity:.9;margin:0;font-size:14px}.record-tip.cancel{color:#fca5a5}.record-actions{justify-content:center;align-items:center;gap:12px;margin-top:8px;display:flex}.record-cancel-btn{border-radius:var(--radius-pill);color:#fff;touch-action:manipulation;background:0 0;border:1px solid #ffffff8c;min-width:88px;min-height:44px;padding:10px 22px;font-weight:600}.record-send-btn{border-radius:var(--radius-pill);min-width:88px;min-height:44px;color:var(--ink);touch-action:manipulation;background:#fff;margin-top:0;padding:10px 28px;font-weight:600}.sheet-backdrop{z-index:50;background:#00000059;justify-content:flex-end;align-items:stretch;display:flex;position:fixed;inset:0}.settings-sheet{background:#fff;width:min(360px,100%);padding:16px 18px 32px;animation:.22s ease-out sheet-in;overflow-y:auto;box-shadow:-4px 0 24px #0000001f}@media (width<=767px){.sheet-backdrop{justify-content:center;align-items:flex-end}.settings-sheet{border-radius:16px 16px 0 0;width:100%;max-height:80dvh;animation:.22s ease-out sheet-up}}@keyframes sheet-in{0%{transform:translate(100%)}to{transform:none}}@keyframes sheet-up{0%{transform:translateY(100%)}to{transform:none}}.sheet-head{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.sheet-head h2{margin:0;font-size:18px}.sheet-section{margin-bottom:22px}.sheet-section h3{color:var(--ink-2);text-transform:uppercase;letter-spacing:.04em;margin:0 0 10px;font-size:13px;font-weight:600}.danger-btn{width:100%;color:var(--record);background:#fef2f2;border:1px solid #fecaca;border-radius:12px;padding:12px;font-weight:600}.seg{gap:8px;display:flex}.seg button{background:var(--input-bg);border-radius:10px;flex:1;padding:10px;font-size:14px}.seg button.active{background:var(--tag-bg);color:var(--accent);border:1px solid var(--tag-border);font-weight:600}.sheet-section select{border:1px solid var(--line);background:var(--input-bg);border-radius:10px;width:100%;padding:10px 12px}.stub-note{color:var(--ink-3);margin:8px 0 0;font-size:12px}.switch-row{justify-content:space-between;align-items:center;font-size:15px;display:flex}.word-tap{color:inherit;font:inherit;line-height:inherit;cursor:pointer;text-underline-offset:3px;-webkit-tap-highlight-color:transparent;touch-action:manipulation;-webkit-user-select:none;user-select:none;background:0 0;border:none;border-radius:3px;margin:0;padding:0 1px;-webkit-text-decoration:underline #6366f147;text-decoration:underline #6366f147;text-decoration-thickness:1.5px;display:inline}.word-tap:hover,.word-tap:focus-visible{color:var(--accent);-webkit-text-decoration-color:var(--accent);text-decoration-color:var(--accent);background:#6366f114;outline:none}.word-tap:active{background:#6366f124}.bubble-user .word-tap{text-decoration-color:#1a1a2e38}.bubble-user .word-tap:hover,.bubble-user .word-tap:focus-visible{color:var(--ink);background:#1a1a2e0f}.dict-backdrop{z-index:55;justify-content:center;align-items:flex-end}.dict-sheet{width:min(480px,100%);max-height:min(70dvh,520px);padding:16px 18px calc(24px + env(safe-area-inset-bottom,0px));color:var(--ink);background:#fff5ee;border-radius:16px 16px 0 0;animation:.22s ease-out sheet-up;overflow-y:auto;box-shadow:0 -4px 24px #0000001f}@media (width>=768px){.dict-backdrop{align-items:center}.dict-sheet{border-radius:16px;max-height:min(80dvh,560px);animation:.2s ease-out dict-fade-in}}@keyframes dict-fade-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}.dict-state{color:var(--ink-2);flex-direction:column;align-items:center;gap:12px;padding:28px 12px;font-size:14px;display:flex}.dict-state p{margin:0}.dict-spinner{border:3px solid var(--line);border-top-color:var(--accent);border-radius:50%;width:28px;height:28px;animation:.8s linear infinite spin-soft}.dict-error{color:var(--record)}.dict-retry{border:1px solid var(--tag-border);min-height:44px;color:var(--accent);background:#fff;border-radius:12px;margin-top:4px;padding:10px 20px;font-size:14px;font-weight:600}.dict-body{padding-bottom:8px}.dict-word{color:var(--ink);letter-spacing:-.02em;margin:0 0 8px;font-size:26px;font-weight:700}.dict-phonetic-row{align-items:center;gap:10px;min-height:44px;margin-bottom:16px;display:flex}.dict-phonetic{color:var(--ink-2);font-size:15px}.dict-audio-btn{border:1px solid var(--line);touch-action:manipulation;width:44px;min-width:44px;height:44px;min-height:44px;box-shadow:var(--shadow-card);background:#fff;border-radius:50%;place-items:center;display:grid}.dict-audio-btn.playing{background:var(--accent);border-color:var(--accent)}.dict-audio-btn.playing img{filter:invert()}.dict-meanings{flex-direction:column;gap:10px;margin:0;padding:0;list-style:none;display:flex}.dict-meanings li{box-shadow:var(--shadow-card);background:#fff;border-radius:12px;flex-wrap:wrap;align-items:baseline;gap:8px;padding:12px 14px;font-size:15px;line-height:1.5;display:flex}.dict-pos{color:var(--accent);background:var(--tag-bg);border:1px solid var(--tag-border);border-radius:6px;flex-shrink:0;padding:2px 8px;font-size:12px;font-weight:600}.dict-zh{color:var(--ink)}.toast{left:50%;bottom:calc(88px + env(safe-area-inset-bottom,0px));color:#fff;z-index:60;text-align:center;background:#1a1a2eeb;border-radius:12px;max-width:min(90vw,360px);padding:10px 16px;font-size:13px;animation:.2s ease-out toast-in;position:fixed;transform:translate(-50%)}@keyframes toast-in{0%{opacity:0;transform:translate(-50%)translateY(8px)}to{opacity:1;transform:translate(-50%)translateY(0)}}@media (width>=1024px){.bubble-ai{max-width:70%}.bubble-user{max-width:65%}}@media (width>=768px) and (width<=1023px){.app-column{max-width:640px}}