*{box-sizing:border-box}body{margin:0;background:#f3f5f7;color:#18212b;font-family:Arial,system-ui,sans-serif}.app{max-width:680px;margin:auto;padding:14px}.top{display:flex;align-items:center;gap:12px;padding:8px 2px 16px}.brand{font-size:42px}.top h1{margin:0;font-size:25px}.top p{margin:4px 0 0;color:#6b7280;font-size:14px}.online{margin-left:auto;font-size:12px;color:#16803b;background:#eaf8ef;padding:8px 10px;border-radius:999px}.card{background:#fff;border-radius:20px;padding:17px;margin-bottom:12px;box-shadow:0 5px 24px #0000000b}.lang-title,h2{font-size:16px;margin:0 0 11px}.lang-row{display:flex;gap:8px}.lang-row select,.dest-input input{flex:1;border:1px solid #d8dee6;border-radius:11px;padding:13px;font-size:16px;background:#fff}.secondary,.dest-input button{border:0;border-radius:11px;padding:0 14px;background:#111827;color:#fff;font-weight:700}.detected{margin-top:9px;font-size:13px;color:#667085}.switcher{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:12px}.mode{border:0;border-radius:14px;padding:14px;background:#e4e8ed;font-size:16px;font-weight:700}.mode.active{background:#111827;color:#fff}.direction{display:flex;justify-content:center;gap:13px;font-weight:700;font-size:16px;margin-bottom:16px}.arrow{color:#667085}.mic{display:block;width:94px;height:94px;margin:auto;border:0;border-radius:50%;background:#111827;color:#fff;font-size:38px;box-shadow:0 8px 22px #0002}.mic.listening{background:#c92a2a;animation:pulse 1s infinite}.micText{text-align:center;margin:11px 0 17px;color:#667085}@keyframes pulse{50%{transform:scale(1.06)}}.message{border:1px solid #e1e5ea;border-radius:14px;padding:13px;margin-top:9px}.message small{display:block;color:#667085;margin-bottom:6px}.message div{font-size:19px;min-height:27px}.translated{background:#f0f7ff}.play{margin-top:11px;border:0;border-radius:10px;padding:10px 13px;background:#2563eb;color:#fff;font-weight:700}.section-head{display:flex;justify-content:space-between;align-items:center}.section-head h2{margin:0}.section-head span{font-size:12px;color:#667085}.dest-input{display:flex;gap:8px}.dest-display{margin-top:10px;padding:14px;border-radius:12px;background:#eef5ff;font-weight:700}.phrases{display:flex;flex-wrap:wrap;gap:7px}.phrase{border:1px solid #d8dee6;background:#fff;border-radius:12px;padding:10px 12px}.privacy p{font-size:13px;color:#667085;margin:6px 0 0}footer{text-align:center;color:#7a8490;font-size:12px;padding:7px 0 16px}@media(max-width:450px){.top{align-items:flex-start}.online{font-size:10px}.lang-row{flex-direction:column}.secondary{height:42px}.dest-input button{padding:0 14px}}