:root{font-family:'DM Sans',sans-serif;color:#182b2b;background:#f4f7f8;font-size:16px}*{box-sizing:border-box}body{margin:0}header{max-width:1264px;margin:auto;padding:30px 36px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none;font-weight:800;letter-spacing:-.5px}.brand em{font-weight:400;font-size:14px}.brand-icon{display:grid;place-items:center;background:#123f3b;color:#c5f765;border-radius:12px;width:40px;height:40px;font-size:24px}.badge{font-size:12px;letter-spacing:1.4px;border:1px solid #d5dfe0;border-radius:20px;padding:8px 12px;color:#526566}main{max-width:1120px;margin:28px auto 0;padding:0 28px}.intro{margin-bottom:32px}.eyebrow{font-size:12px;font-weight:700;letter-spacing:2px;color:#3d746d}h1{font-family:Manrope,sans-serif;font-size:clamp(32px,4.5vw,52px);line-height:1.14;letter-spacing:-2px;margin:16px 0}p{line-height:1.6}.intro p{color:#647575;margin:0;font-size:17px}.workspace{border:1px solid #dce4e4;border-radius:24px;background:white;overflow:hidden;box-shadow:0 14px 44px #15353507}.languages{display:flex;align-items:center;gap:26px;padding:24px 32px;border-bottom:1px solid #e2e9e9}.languages label{flex:1;color:#617271;font-size:14px;display:flex;flex-direction:column;gap:7px}select{font:inherit;border:0;background:transparent;color:inherit;padding:5px 24px 5px 0;cursor:pointer}.languages select{font-size:20px;font-weight:600;color:#163e38;width:100%}button{font:inherit;cursor:pointer;transition:background .2s,transform .2s}button:disabled{cursor:default;opacity:.45}button:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible,textarea:focus-visible{outline:3px solid #6ea52b;outline-offset:4px}.swap{border:1px solid #dce5e4;border-radius:50%;background:white;width:42px;height:42px;font-size:23px;flex-shrink:0}.panels{display:grid;grid-template-columns:1fr 1fr}.panel{padding:26px 30px;min-width:0}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:14px;font-size:12px;letter-spacing:1.2px;font-weight:700;min-height:32px}.text-button{border:0;background:none;color:#657d78;font-size:14px;letter-spacing:0}.result{background:#123f3b;color:#edf9f4;display:flex;flex-direction:column}.result .panel-heading{color:#9fbfb5}.language-name{letter-spacing:0;font-size:14px;font-weight:400}textarea{resize:vertical;min-height:154px;width:100%;border:0;background:transparent;font:500 25px/1.5 'DM Sans',sans-serif;padding:18px 0 8px;color:#233e3a}textarea::placeholder{color:#9aa9a6}.input-foot{display:flex;justify-content:space-between;gap:12px;color:#748681;font-size:12px;padding-bottom:22px}.record-row{display:flex;align-items:center;gap:12px;border-top:1px solid #e4eae9;padding-top:24px}.mic{display:grid;place-items:center;border:0;background:#c6f56f;color:#234022;width:52px;height:52px;border-radius:50%;flex-shrink:0}.mic.listening{background:#ffbaa9;animation:pulse 1s infinite}.record-row strong{font-size:14px}.record-row small{display:block;font-size:12px;color:#76847f;margin-top:4px}.translate{margin-left:auto;border:0;border-radius:10px;background:#163f39;color:white;padding:12px;font-size:14px}.output{font:500 29px/1.5 'DM Sans',sans-serif;overflow-wrap:anywhere;min-height:190px;padding:22px 0;flex:1}.output.empty{color:#7eaaa0}.playback{display:flex;align-items:center;justify-content:space-between;gap:12px}.play{border:0;border-radius:10px;background:#c6f56f;color:#203f30;padding:13px 16px;font-weight:700;font-size:14px}.speed{font-size:12px;color:#bad0ca}.speed select{display:block;color:white;font-size:14px}.speed option{color:#183d36}.auto{display:flex;align-items:center;gap:8px;font-size:12px;color:#b6d0c5;margin-top:22px}.auto input{accent-color:#c6f56f;width:16px;height:16px}.voice-note{font-size:12px;margin:8px 0 0;color:#cdded6}.voice-note:empty{display:none}.status{padding:14px 30px;font-size:14px;color:#526b62;min-height:50px;background:#fafdF9}.status.error{color:#9c321d;background:#fff1e9}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin:30px 0}.steps>div{display:flex;align-items:flex-start;gap:13px}.steps span{display:grid;place-items:center;width:28px;height:28px;flex-shrink:0;border:1px solid #ccd9d4;border-radius:50%;font-size:12px;margin-top:4px}.steps p{margin:0;font-size:14px;color:#7a8883}.steps strong{display:block;color:#29483e;font-size:14px;margin-bottom:3px}footer{border-top:1px solid #dbe3df;padding:12px 0 28px;color:#7c8782;font-size:12px}footer p{margin:8px 0}summary{cursor:pointer;width:fit-content;font-size:14px;color:#566e63}footer a{color:#3c7160}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}@keyframes pulse{50%{box-shadow:0 0 0 9px #ffbaa936}}@media(max-width:700px){header{padding:20px}.brand{font-size:14px}.badge{font-size:10px;padding:6px}.brand-icon{width:32px;height:32px}main{padding:0 16px;margin-top:18px}h1{letter-spacing:-1.2px}.intro p{font-size:16px}.languages{padding:18px;gap:10px}.languages select{font-size:16px}.panels{grid-template-columns:1fr}.panel{padding:20px}.output{min-height:130px;font-size:26px}textarea{min-height:130px;font-size:22px}.steps{grid-template-columns:1fr;gap:16px}.status{padding:14px 20px}.workspace{border-radius:18px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

[hidden]{display:none!important}.auth-panel{max-width:470px;margin:45px auto;padding:30px;background:white;border:1px solid #dce4e4;border-radius:24px}.auth-panel h1{font-size:36px}.auth-panel>p{color:#617271}.auth-panel form{display:flex;flex-direction:column;gap:10px;margin:28px 0 12px}.auth-panel label{font-size:14px;font-weight:600}.auth-panel input{font:inherit;border:1px solid #c5d1cc;border-radius:9px;padding:14px;width:100%;margin-bottom:8px}.auth-panel form button{padding:15px;border:0;border-radius:9px;background:#163f39;color:white;font-weight:600}.auth-panel details{border-top:1px solid #e3e9e5;margin-top:25px;padding-top:18px;font-size:14px;color:#64756b}.auth-panel #auth-status{font-size:14px;overflow-wrap:anywhere}.auth-panel #password-tip{font-size:14px;margin:0 0 10px;color:#64756b}.account-bar{max-width:1064px;margin:0 auto;text-align:right;padding:0 28px;font-size:14px;overflow-wrap:anywhere}.account-bar button{margin-left:16px}@media(max-width:600px){.auth-panel{margin:20px 16px;padding:24px}}

.auth-panel .password-tools{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}.auth-panel .password-tools button{font-size:14px;padding:8px;background:#edf3ef;color:#214438;font-weight:500}.auth-panel #forgot-password{display:block;margin:8px 0 16px;padding:0}.auth-panel #password-area label{display:block;margin-bottom:10px}

.pronunciation-feature{margin:0 0 24px}.pronunciation-toggle{display:flex;align-items:center;gap:10px;font-size:14px;line-height:1.5;cursor:pointer;color:#e5f3ec}.pronunciation-toggle input{accent-color:#c6f56f;width:18px;height:18px;flex-shrink:0}.pronunciation-panel{margin-top:14px;padding:18px;border:1px solid #467166;border-radius:12px;background:#1b4b43}.pronunciation-label{font-size:12px;letter-spacing:1px;color:#b9d4c9}.pronunciation-panel #pronunciation-output{font-size:24px;line-height:1.65;color:#d8ff98;overflow-wrap:anywhere;margin:10px 0}.pronunciation-caption,.pronunciation-notice{font-size:14px;line-height:1.6;color:#d2e3da;margin:10px 0 0}.pronunciation-notice:empty{display:none}.pronunciation-unknown{border-bottom:1px dashed #ffd59e;color:#ffd59e}.pronunciation-variant{color:#f1eeb7}.pronunciation-panel details{margin-top:14px;border-top:1px solid #467166;padding-top:12px;font-size:14px;color:#d2e3da}.pronunciation-panel summary{color:#e4f1e8;font-size:14px}.pronunciation-panel details p{margin:10px 0}.pronunciation-panel a{color:#c6f56f}.pronunciation-retry{margin-top:10px;border:1px solid #92b8a8;border-radius:6px;background:transparent;color:#edf9f4;padding:8px 12px;font-size:14px}