:root{--primary-color:#2e7d32;--primary-hover:#1b5e20;--bg-color:#f5f5f0;--card-bg:#fff;--text-main:#1b5e20;--text-light:#555;--border-color:#e0e0e0}.header-logo{object-fit:contain;border-radius:8px;width:40px;height:40px}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-main);justify-content:center;align-items:center;min-height:100vh;padding:1rem;font-family:Inter,system-ui,-apple-system,sans-serif;display:flex}.app-container{background-color:var(--card-bg);border-radius:16px;flex-direction:column;width:100%;max-width:600px;display:flex;overflow:hidden;box-shadow:0 8px 24px #0000001a}.header{color:#fff;text-align:center;background:linear-gradient(135deg,#7c3aed,#6d28d9);justify-content:center;align-items:center;gap:.5rem;padding:1.5rem;font-size:1.5rem;font-weight:600;display:flex}.content-area{flex-direction:column;gap:1.5rem;padding:2rem;display:flex}.instruction-text{color:var(--text-light);text-align:center;font-size:1.1rem}.text-input-container{width:100%;position:relative}.main-textarea{border:2px solid var(--border-color);resize:vertical;background-color:#f8f9fa;border-radius:12px;width:100%;min-height:200px;padding:1.5rem;font-size:1.2rem;transition:border-color .3s}.main-textarea:focus{border-color:var(--primary-color);outline:none}.mic-button{background-color:var(--primary-color);color:#fff;cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;transition:transform .2s,background-color .2s;display:flex;position:absolute;bottom:1rem;right:1rem;box-shadow:0 4px 8px #25d3664d}.mic-button:hover{background-color:var(--primary-hover);transform:scale(1.05)}.mic-button.recording{background-color:#ff3b30;animation:1.5s infinite pulse}@keyframes pulse{0%{transform:scale(1);box-shadow:0 0 #ff3b30b3}70%{transform:scale(1.1);box-shadow:0 0 0 10px #ff3b3000}to{transform:scale(1);box-shadow:0 0 #ff3b3000}}.action-button{background-color:var(--primary-color);color:#fff;cursor:pointer;border:none;border-radius:12px;justify-content:center;align-items:center;gap:.5rem;width:100%;padding:1.2rem;font-size:1.2rem;font-weight:700;transition:background-color .3s;display:flex}.action-button:hover{background-color:var(--primary-hover)}.action-button:disabled{background-color:var(--border-color);cursor:not-allowed}.action-buttons-group{flex-direction:column;gap:1rem;width:100%;display:flex}.share-button{background-color:#25d366}.share-button:hover{background-color:#128c7e}.download-button{color:var(--primary-color);border:2px solid var(--primary-color);background-color:#0000}.download-button:hover:not(:disabled){background-color:#2e7d3214}.clear-input-button{color:#d32f2f;cursor:pointer;background:0 0;border:1px solid #d32f2f;border-radius:8px;align-self:flex-end;align-items:center;gap:.35rem;margin-top:-.5rem;padding:.35rem .75rem;font-size:.8rem;font-weight:500;transition:background .2s,color .2s;display:flex}.clear-input-button:hover{color:#fff;background:#d32f2f}.ai-button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#7c3aed,#6d28d9);border:none;border-radius:12px;justify-content:center;align-items:center;gap:.5rem;width:100%;padding:.9rem;font-size:1rem;font-weight:600;transition:transform .2s,box-shadow .2s,opacity .2s;display:flex;position:relative;overflow:hidden;box-shadow:0 4px 12px #7c3aed4d}.ai-button:before{content:"";background:linear-gradient(90deg,#0000,#ffffff1a,#0000);width:200%;height:100%;transition:left .5s;position:absolute;top:0;left:-100%}.ai-button:hover:not(:disabled):before{left:100%}.ai-button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 20px #7c3aed66}.ai-button:disabled{opacity:.5;cursor:not-allowed}.ai-error{color:#d32f2f;text-align:center;background-color:#fff0f0;border:1px solid #ffcdd2;border-radius:10px;padding:.75rem 1rem;font-size:.9rem}.ai-result{border:2px solid #7c3aed;border-radius:12px;animation:.4s ease-out fadeIn;overflow:hidden}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.ai-result-header{color:#fff;background:linear-gradient(135deg,#7c3aed,#6d28d9);justify-content:space-between;align-items:center;padding:.6rem 1rem;font-size:.85rem;font-weight:600;display:flex}.ai-result-label{align-items:center;gap:.4rem;display:flex}.ai-result-text{color:#333;white-space:pre-wrap;resize:vertical;background-color:#fafafe;border:none;border-top:1px solid #7c3aed26;outline:none;width:100%;min-height:160px;max-height:300px;padding:1rem;font-family:inherit;font-size:1rem;line-height:1.6;overflow-y:auto}.ai-result-footer{background-color:#f8f7fd;border-top:1px solid #7c3aed1a;justify-content:flex-end;gap:.5rem;padding:.5rem .75rem;display:flex}.ai-listen-button{color:#6d28d9;cursor:pointer;background:0 0;border:1px solid #6d28d9;border-radius:8px;align-items:center;gap:.35rem;padding:.4rem .8rem;font-size:.8rem;font-weight:500;transition:background .2s,color .2s;display:flex}.ai-listen-button:hover{color:#fff;background:#6d28d9}.ai-revert-button{color:#d32f2f;cursor:pointer;background:0 0;border:1px solid #d32f2f;border-radius:8px;align-items:center;gap:.35rem;padding:.4rem .8rem;font-size:.8rem;font-weight:500;transition:background .2s,color .2s;display:flex}.ai-revert-button:hover{color:#fff;background:#d32f2f}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background:#00000080;justify-content:center;align-items:center;padding:1.5rem;animation:.25s ease-out modalFadeIn;display:flex;position:fixed;inset:0}@keyframes modalFadeIn{0%{opacity:0}to{opacity:1}}.modal-card{text-align:center;background:#fff;border-radius:20px;width:100%;max-width:380px;padding:2rem 1.75rem;animation:.3s ease-out modalSlideUp;box-shadow:0 20px 60px #00000040}@keyframes modalSlideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.modal-icon{margin-bottom:.75rem;font-size:2.5rem}.modal-title{color:#1a1a1a;margin-bottom:.5rem;font-size:1.25rem;font-weight:700}.modal-message{color:#555;margin-bottom:1.5rem;font-size:.95rem;line-height:1.5}.modal-actions{gap:.75rem;display:flex}.modal-btn{cursor:pointer;border:none;border-radius:12px;flex:1;padding:.9rem 1rem;font-size:1rem;font-weight:600;transition:transform .15s,box-shadow .15s}.modal-btn:active{transform:scale(.97)}.modal-btn-cancel{color:#333;background:#f0f0f0}.modal-btn-cancel:hover{background:#e0e0e0}.modal-btn-confirm{color:#fff;background:#d32f2f;box-shadow:0 4px 12px #d32f2f4d}.modal-btn-confirm:hover{background:#b71c1c;box-shadow:0 6px 16px #d32f2f66}.animate-spin{animation:1s linear infinite spin}.footer-info{text-align:center;color:var(--text-light);border-top:1px solid var(--border-color);background-color:#f8f9fa;padding:1rem;font-size:.9rem}.header-title{flex:1}.logout-button{color:#fff;cursor:pointer;background:#ffffff26;border:1px solid #ffffff40;border-radius:8px;justify-content:center;align-items:center;width:36px;height:36px;transition:background-color .2s,transform .2s;display:flex}.logout-button:hover{background:#ffffff40;transform:scale(1.05)}.login-container{background:linear-gradient(135deg,#4c1d95 0%,#6d28d9 40%,#7c3aed 100%);justify-content:center;align-items:center;min-height:100vh;padding:1rem;display:flex;position:relative;overflow:hidden}.login-container:before{content:"";pointer-events:none;background:radial-gradient(circle at 30%,#ffffff0f 0%,#0000 50%),radial-gradient(circle at 80% 20%,#ffffff0a 0%,#0000 40%);width:200%;height:200%;position:absolute;top:-50%;left:-50%}.login-card{z-index:1;background:#fffffff7;border-radius:20px;width:100%;max-width:420px;animation:.5s ease-out loginSlideUp;position:relative;overflow:hidden;box-shadow:0 20px 60px #00000040,0 0 0 1px #ffffff1a}@keyframes loginSlideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.login-header{text-align:center;flex-direction:column;align-items:center;gap:.5rem;padding:2.5rem 2rem 1.5rem;display:flex}.login-logo{object-fit:contain;border-radius:16px;width:72px;height:72px;margin-bottom:.5rem;box-shadow:0 4px 16px #0000001a}.login-title{color:#6d28d9;margin:0;font-size:1.6rem;font-weight:700}.login-subtitle{color:var(--text-light);margin:0;font-size:.95rem}.login-form{flex-direction:column;gap:1.2rem;padding:0 2rem 2rem;display:flex}.login-error{color:#d32f2f;background-color:#fff0f0;border:1px solid #ffcdd2;border-radius:10px;align-items:center;gap:.5rem;padding:.75rem 1rem;font-size:.9rem;animation:.4s ease-in-out shakeError;display:flex}@keyframes shakeError{0%,to{transform:translate(0)}20%{transform:translate(-6px)}40%{transform:translate(6px)}60%{transform:translate(-4px)}80%{transform:translate(4px)}}.login-field{flex-direction:column;gap:.4rem;display:flex}.login-label{color:var(--text-main);padding-left:.25rem;font-size:.85rem;font-weight:600}.login-input{border:2px solid var(--border-color);color:#333;background-color:#f8f9fa;border-radius:10px;width:100%;padding:.85rem 1rem;font-size:1rem;transition:border-color .3s,box-shadow .3s}.login-input:focus{border-color:#7c3aed;outline:none;box-shadow:0 0 0 3px #7c3aed1a}.login-input:disabled{opacity:.6}.login-password-container{position:relative}.login-input-password{padding-right:3rem}.login-toggle-pass{color:var(--text-light);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:4px;transition:color .2s;display:flex;position:absolute;top:50%;right:.75rem;transform:translateY(-50%)}.login-toggle-pass:hover{color:#7c3aed}.login-submit{color:#fff;cursor:pointer;background:linear-gradient(135deg,#7c3aed,#6d28d9);border:none;border-radius:10px;justify-content:center;align-items:center;gap:.5rem;width:100%;margin-top:.5rem;padding:.95rem;font-size:1.05rem;font-weight:600;transition:transform .2s,box-shadow .2s,opacity .2s;display:flex;box-shadow:0 4px 12px #7c3aed4d}.login-submit:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 20px #7c3aed66}.login-submit:active:not(:disabled){transform:translateY(0)}.login-submit:disabled{opacity:.5;cursor:not-allowed}.login-spinner{border:3px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:22px;height:22px;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.login-footer{text-align:center;color:var(--text-light);border-top:1px solid var(--border-color);background-color:#f8f9fa;padding:1.25rem 2rem;font-size:.8rem}