:root{--bg0: #070b14;--bg1: #0f172a;--card: rgba(255, 255, 255, .06);--card-border: rgba(255, 255, 255, .1);--text: #f1f5f9;--muted: #94a3b8;--accent: #38bdf8;--accent-2: #818cf8;--zh: #34d399;--zh-glow: rgba(52, 211, 153, .45);--en: #60a5fa;--en-glow: rgba(96, 165, 250, .45);--danger: #f87171;--mic-size: min(28vw, 112px);--zone-size: min(34vw, 132px);--safe-bottom: env(safe-area-inset-bottom, 0px);--font: "SF Pro Text", "PingFang SC", "Helvetica Neue", system-ui, sans-serif;color-scheme:dark}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;min-height:100%;height:100%;font-family:var(--font);background:radial-gradient(1200px 600px at 50% -10%,#1e293b 0%,var(--bg0) 55%);color:var(--text);-webkit-tap-highlight-color:transparent;touch-action:manipulation;-webkit-user-select:none;user-select:none;overflow:hidden}#app{min-height:100%;height:100%;display:flex;flex-direction:column;max-width:560px;margin:0 auto;padding:12px 16px calc(16px + var(--safe-bottom))}.top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:8px 0 12px;flex-shrink:0}.brand{display:flex;gap:10px;align-items:flex-start}.logo-dot{width:10px;height:10px;margin-top:7px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent-2));box-shadow:0 0 12px #38bdf8b3;flex-shrink:0}h1{margin:0;font-size:clamp(1.05rem,4vw,1.25rem);font-weight:650;letter-spacing:.02em}.sub{margin:4px 0 0;font-size:.78rem;color:var(--muted);line-height:1.4;max-width:240px}.pill{font-size:.72rem;padding:6px 10px;border-radius:999px;border:1px solid var(--card-border);background:var(--card);white-space:nowrap;flex-shrink:0}.pill.muted{color:var(--muted)}.pill.ok{color:var(--zh);border-color:#34d39959}.pill.warn{color:#fbbf24;border-color:#fbbf2459}.env-banner{flex-shrink:0;margin-bottom:10px;padding:10px 12px;border-radius:12px;font-size:.78rem;line-height:1.45;color:#fde68a;background:#fbbf241f;border:1px solid rgba(251,191,36,.35)}.provider-bar{display:flex;align-items:center;gap:10px;margin-bottom:10px;flex-shrink:0}.provider-label{font-size:.75rem;color:var(--muted);flex-shrink:0}.provider-switch{display:flex;flex:1;gap:8px;min-width:0}.provider-btn{flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:8px 10px;border-radius:12px;border:1px solid var(--card-border);background:var(--card);color:var(--muted);font-size:.85rem;font-weight:600;cursor:pointer;transition:border-color .15s ease,background .15s ease,color .15s ease,box-shadow .15s ease;text-align:left}.provider-btn small{font-size:.65rem;font-weight:500;opacity:.85}.provider-btn.active{color:var(--text);border-color:#38bdf873;background:#38bdf81f;box-shadow:0 0 0 1px #38bdf826}.provider-btn[data-provider=deepseek].active{border-color:#34d39980;background:#34d3991f;box-shadow:0 0 0 1px #34d3991f}.provider-btn[data-provider=gemini].active{border-color:#818cf88c;background:#818cf824;box-shadow:0 0 0 1px #818cf826}.provider-btn:disabled{opacity:.45;cursor:not-allowed}.hotword-toggle{display:flex;align-items:center;gap:10px;margin-bottom:12px;padding:8px 10px;border-radius:12px;border:1px solid var(--card-border);background:var(--card);cursor:pointer;-webkit-user-select:none;user-select:none;flex-shrink:0}.hotword-toggle input{position:absolute;opacity:0;width:0;height:0}.hotword-switch{width:40px;height:22px;border-radius:999px;background:#94a3b859;position:relative;flex-shrink:0;transition:background .18s ease}.hotword-switch:after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#f8fafc;transition:transform .18s ease}.hotword-toggle input:checked+.hotword-switch{background:#34d399a6}.hotword-toggle input:checked+.hotword-switch:after{transform:translate(18px)}.hotword-toggle input:focus-visible+.hotword-switch{outline:2px solid rgba(56,189,248,.7);outline-offset:2px}.hotword-copy{display:flex;flex-direction:column;gap:1px;min-width:0}.hotword-copy strong{font-size:.85rem;font-weight:600;color:var(--text)}.hotword-copy small{font-size:.68rem;color:var(--muted)}.stage{flex:1;display:flex;flex-direction:column;min-height:0;gap:12px}.meter-row{display:flex;align-items:center;gap:10px;flex-shrink:0;min-height:18px}.level-bar{flex:1;height:8px;border-radius:999px;background:#ffffff14;overflow:hidden;border:1px solid var(--card-border)}.level-fill{height:100%;width:0%;border-radius:inherit;background:linear-gradient(90deg,#34d399,#38bdf8,#f472b6);transition:width .06s linear}.rec-timer{font-variant-numeric:tabular-nums;font-size:.78rem;color:var(--muted);min-width:2.5rem;text-align:right}.pad.is-recording .rec-timer{color:#fda4af}.result-card{flex:0 1 auto;min-height:120px;max-height:38vh;overflow:auto;padding:14px 16px;border-radius:18px;background:var(--card);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);-webkit-overflow-scrolling:touch}.result-meta{display:flex;gap:8px;margin-bottom:10px;flex-wrap:wrap}.chip{font-size:.7rem;padding:3px 8px;border-radius:999px;background:#38bdf81f;color:var(--accent);border:1px solid rgba(56,189,248,.25)}.chip.ghost{background:transparent;color:var(--muted);border-color:var(--card-border)}.chip.zh{color:var(--zh);background:#34d3991f;border-color:#34d3994d}.chip.en{color:var(--en);background:#60a5fa1f;border-color:#60a5fa4d}.result-text{display:block;width:100%;margin:0;padding:0;border:none;outline:none;resize:none;background:transparent;color:inherit;font:inherit;font-size:clamp(1rem,3.8vw,1.15rem);line-height:1.65;white-space:pre-wrap;word-break:break-word;overflow-y:auto;min-height:4.5em;max-height:30vh;box-sizing:border-box;-webkit-overflow-scrolling:touch}.result-text.placeholder{color:var(--muted)}.result-text.loading{color:var(--accent)}.result-text.error{color:var(--danger)}.result-text.editable{cursor:text;caret-color:var(--zh);border-radius:10px;padding:6px 8px;margin:-6px -8px;background:#34d3990f;box-shadow:inset 0 0 0 1px #34d39938}.result-text.editable:focus{background:#34d3991a;box-shadow:inset 0 0 0 1px #34d39973}.pad{position:relative;flex:1;min-height:260px;display:flex;align-items:center;justify-content:center;margin-top:auto}.zone{position:absolute;width:var(--zone-size);height:var(--zone-size);border-radius:50%;display:flex;align-items:center;justify-content:center;opacity:0;transform:scale(.75);pointer-events:none;transition:opacity .18s ease,transform .18s ease,box-shadow .15s ease,background .15s ease;border:1.5px dashed rgba(255,255,255,.22);background:#ffffff08;color:inherit;font:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0}.zone-zh{left:50%;top:50%;transform:translate(-50%,calc(-50% - min(28vw,120px))) scale(.75)}.pad.is-recording .zone{opacity:1;pointer-events:auto}.pad.is-recording .zone-zh{transform:translate(-50%,calc(-50% - min(28vw,120px))) scale(1)}.zone.active.zone-zh{border-style:solid;border-color:var(--zh);background:#34d39924;box-shadow:0 0 28px var(--zh-glow)}.zone-inner{display:flex;flex-direction:column;align-items:center;gap:2px;text-align:center;padding:8px}.zone-icon{font-size:1.15rem;font-weight:700;letter-spacing:.04em}.zone-zh .zone-icon{color:var(--zh)}.zone-label{font-size:.85rem;font-weight:600}.zone-hint{font-size:.65rem;color:var(--muted)}.mic-btn{position:relative;width:var(--mic-size);height:var(--mic-size);border:none;border-radius:50%;padding:0;background:transparent;cursor:pointer;touch-action:manipulation;z-index:2;outline:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.mic-btn.is-live .mic-core{transform:scale(.94)}.mic-core{position:absolute;top:10%;right:10%;bottom:10%;left:10%;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#38bdf8,#6366f1 55%,#4f46e5);color:#fff;box-shadow:0 10px 30px #6366f173,inset 0 1px #ffffff40;transition:transform .12s ease,filter .12s ease}.mic-ring{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;border:2px solid rgba(56,189,248,.35);opacity:0;transform:scale(1)}.mic-icon{width:42%;height:42%}.mic-btn:active .mic-core,.pad.is-recording .mic-core{transform:scale(.94);filter:brightness(1.08)}.pad.is-recording .mic-ring{opacity:1;animation:pulse-ring 1.2s ease-out infinite}.pad.is-recording .mic-core{background:linear-gradient(145deg,#f472b6,#ef4444,#dc2626);box-shadow:0 10px 32px #ef444480}.pad.zone-zh-active .mic-core{background:linear-gradient(145deg,#34d399,#059669);box-shadow:0 10px 32px var(--zh-glow)}@keyframes pulse-ring{0%{transform:scale(1);opacity:.7}to{transform:scale(1.45);opacity:0}}.hint{position:absolute;left:50%;bottom:max(8px,calc(12% - 24px));transform:translate(-50%);margin:0;font-size:.82rem;color:var(--muted);text-align:center;width:90%;pointer-events:none;transition:color .15s ease}.pad.is-recording .hint{color:#fda4af}.pad.zone-zh-active .hint{color:var(--zh)}.foot{flex-shrink:0;text-align:center;padding-top:8px;font-size:.7rem;color:#94a3b8bf}@media(min-width:640px){#app{max-width:640px;padding:24px 24px 28px}.sub{max-width:none}.pad{min-height:320px}:root{--mic-size: 120px;--zone-size: 140px}.zone-zh{transform:translate(-50%,calc(-50% - 130px)) scale(.75)}.pad.is-recording .zone-zh{transform:translate(-50%,calc(-50% - 130px)) scale(1)}}@media(max-height:640px){.result-card{min-height:88px;max-height:30vh}.pad{min-height:220px}}