@import"https://fonts.googleapis.com/css2?family=Syne:wght@400;500;600;700;800&family=DM+Sans:ital,wght@0,300;0,400;0,500;1,300&display=swap";:root{--bg: #080c10;--bg2: #0d1117;--glass: rgba(255,255,255,.04);--glass-hover: rgba(255,255,255,.07);--border: rgba(255,255,255,.07);--border2: rgba(255,255,255,.14);--text: #e8edf3;--text2: #7a8899;--text3: #3a4555;--accent: #00e5a0;--accent-dim: rgba(0,229,160,.08);--accent-border:rgba(0,229,160,.25);--accent-glow: rgba(0,229,160,.15);--danger: #ff6b8a;--danger-dim: rgba(255,107,138,.08);--danger-border:rgba(255,107,138,.3);--info: #5b9cf6;--radius: 16px;--radius-sm: 10px;--font-head: "Syne", sans-serif;--font-body: "DM Sans", sans-serif;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px)}*,*:before,*:after{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html{scroll-behavior:smooth}body{font-family:var(--font-body);background:var(--bg);color:var(--text);min-height:100vh;min-height:100dvh;overflow-x:hidden}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse 60% 40% at 15% 10%,rgba(0,229,160,.06) 0%,transparent 70%),radial-gradient(ellipse 50% 50% at 85% 80%,rgba(91,156,246,.05) 0%,transparent 70%);pointer-events:none;z-index:0}#root{position:relative;z-index:1}button{font-family:var(--font-body);cursor:pointer;border:none;background:none;color:inherit;transition:opacity .15s,transform .1s}button:active{transform:scale(.96)}select,textarea,input{font-family:var(--font-body);color:var(--text);background:var(--glass);border:1px solid var(--border);border-radius:var(--radius-sm);outline:none;font-size:15px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:border-color .2s}select:focus,textarea:focus{border-color:var(--border2)}textarea{resize:none;width:100%}textarea::placeholder{color:var(--text3)}select{padding:11px 34px 11px 14px;width:100%;-moz-appearance:none;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23445566' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;cursor:pointer}select option{background:#0d1117}.card{background:var(--glass);border:1px solid var(--border);border-radius:var(--radius);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:border-color .25s,box-shadow .25s}.card.active-listen{border-color:var(--danger-border);box-shadow:0 0 24px var(--danger-dim)}.card.active-speak{border-color:var(--accent-border);box-shadow:0 0 24px var(--accent-glow)}.card.active-translate{border-color:#5b9cf64d;box-shadow:0 0 20px #5b9cf614}.mic-btn{width:76px;height:76px;border-radius:50%;position:relative;display:flex;align-items:center;justify-content:center;transition:all .25s;cursor:pointer}.mic-btn.idle{background:var(--accent-dim);border:1.5px solid var(--accent-border);color:var(--accent);box-shadow:0 0 0 0 var(--accent-glow)}.mic-btn.idle:hover{box-shadow:0 0 32px var(--accent-glow);border-color:var(--accent)}.mic-btn.active{background:var(--danger-dim);border:1.5px solid var(--danger-border);color:var(--danger)}.wave{display:flex;align-items:center;gap:3px;height:20px}.wave span{display:block;width:3px;border-radius:99px;background:var(--danger);animation:wave-bar .8s ease-in-out infinite}.wave span:nth-child(1){animation-delay:0s;height:6px}.wave span:nth-child(2){animation-delay:.1s;height:14px}.wave span:nth-child(3){animation-delay:.2s;height:20px}.wave span:nth-child(4){animation-delay:.15s;height:12px}.wave span:nth-child(5){animation-delay:.05s;height:7px}@keyframes wave-bar{0%,to{transform:scaleY(.4);opacity:.5}50%{transform:scaleY(1);opacity:1}}.tag{display:inline-flex;align-items:center;gap:5px;font-family:var(--font-head);font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:4px 10px;border-radius:99px}@keyframes pulse-ring{0%{transform:scale(1);opacity:.5}to{transform:scale(2.2);opacity:0}}@keyframes blink{0%,to{opacity:1}50%{opacity:.2}}@keyframes fade-up{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes glow-pulse{0%,to{box-shadow:0 0 20px var(--accent-glow)}50%{box-shadow:0 0 40px var(--accent-glow),0 0 60px #00e5a014}}.fade-up{animation:fade-up .22s ease forwards}
