*{box-sizing:border-box} :root{--bg:#080c18;--card:#12192d;--text:#f7f8fc;--muted:#9da8c2;--accent:#7c8cff;--accent2:#9b6cff;--ok:#42d392;--bad:#ff667d}html,body{margin:0;min-height:100%;background:radial-gradient(circle at 20% 0%,#7c8cff2e,transparent 32rem),radial-gradient(circle at 90% 10%,#9b6cff26,transparent 28rem),var(--bg);color:var(--text);font-family:system-ui,-apple-system,"Segoe UI",sans-serif}body{min-height:100vh}.app{width:min(100% - 20px,980px);margin:auto;padding:30px 0}header{display:flex;align-items:center;gap:14px;margin-bottom:22px}.logo{width:54px;height:54px;border-radius:17px;display:grid;place-items:center;font-size:30px;font-weight:800;background:linear-gradient(135deg,var(--accent),var(--accent2))}h1,h2,p{margin:0}header h1{font-size:clamp(21px,4vw,30px)}header p,.heading p{color:var(--muted);margin-top:3px}#status{margin-left:auto;padding:8px 12px;border-radius:999px;font-size:12px;background:#ffffff0a;white-space:nowrap}.ok{color:#8ff0bb;background:#42d3921a!important}.bad{color:#ff9aaa;background:#ff667d1a!important}.card,.result{background:#12192ddd;border:1px solid #ffffff1a;border-radius:24px;box-shadow:0 24px 70px #00000059;backdrop-filter:blur(18px)}.card{padding:12px}.drop{border:2px dashed #7c8cff61;border-radius:20px;padding:clamp(35px,8vw,65px) 18px;text-align:center;outline:0;transition:.18s}.drop:hover,.drop:focus,.drag{border-color:var(--accent);background:#7c8cff12}.icon{width:64px;height:64px;margin:0 auto 17px;border-radius:20px;display:grid;place-items:center;background:#7c8cff1f;color:#b0b8ff;font-size:34px}.drop p{color:var(--muted);margin-top:7px}.buttons{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin-top:25px}button{border:0;border-radius:13px;min-height:46px;padding:0 18px;color:#fff;background:linear-gradient(135deg,var(--accent),var(--accent2));font-weight:750;cursor:pointer}button:hover{filter:brightness(1.08)}button:disabled{opacity:.5;cursor:not-allowed}.record{background:linear-gradient(135deg,#e84d69,#a93670)}.recording{box-shadow:0 0 0 5px #e84d6920}.recPanel{margin-top:12px;padding:16px;border-radius:15px;background:#e84d6914;border:1px solid #e84d6938}.recPanel b{display:block}.recPanel b:first-letter{color:var(--bad)}.recPanel span{float:right}.recPanel p{color:var(--muted);margin-top:7px;font-size:14px}.queue{margin-top:15px;padding:12px 15px;border-radius:12px;background:#ffffff0a;color:var(--muted);font-size:14px}#resultsSection{margin-top:28px}.heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:13px}.secondary{background:#ffffff0d;border:1px solid #ffffff1a}.result{padding:16px;margin-bottom:10px;border-radius:17px;box-shadow:none}.rh{display:flex;gap:10px}.name{font-size:13px;font-weight:750;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rs{margin-left:auto;color:var(--muted);font-size:12px;white-space:nowrap}.done{color:var(--ok)}.err{color:#ff9aaa}.progress{height:6px;margin-top:11px;border-radius:99px;background:#ffffff0d;overflow:hidden}.bar{height:100%;width:0;background:linear-gradient(90deg,var(--accent),var(--accent2));transition:width .08s}.text{margin-top:13px;padding:15px;border-radius:12px;background:#05081173;font-size:clamp(18px,3vw,23px);line-height:1.65;direction:rtl;text-align:right;overflow-wrap:anywhere;min-height:55px}.pending{direction:ltr;text-align:left;color:var(--muted);font-size:14px}.error{margin-top:15px;padding:14px;border-radius:13px;color:#ffb4bf;background:#ff667d14;border:1px solid #ff667d38}footer{text-align:center;color:#6f7891;font-size:12px;padding:25px 0}.hidden{display:none!important}@media(max-width:620px){.app{padding-top:17px}.logo{width:46px;height:46px;border-radius:14px;font-size:26px}header h1{font-size:20px}#status{font-size:10px;padding:7px 9px}.buttons{flex-direction:column}.buttons button{width:100%}.drop{padding:35px 12px}}