*{box-sizing:border-box;margin:0;padding:0}body,html{height:100%;overflow:hidden}:root{--primary-color:#4361ee;--primary-gradient:linear-gradient(135deg, #3a0ca3 0%, #4361ee 100%);--secondary-color:#4cc9f0;--accent-color:#f72585;--text-color:#2b2d42;--light-text:#6c757d;--border-color:#e9ecef;--background-light:#f8f9fa;--background-white:#ffffff;--success-color:#38b000;--error-color:#d90429;--warning-color:#ff9e00;--info-color:#4cc9f0;--shadow-light:0 2px 10px rgba(0, 0, 0, 0.05);--shadow-medium:0 4px 20px rgba(0, 0, 0, 0.08);--shadow-hover:0 8px 30px rgba(67, 97, 238, 0.15);--radius-small:6px;--radius-medium:12px;--radius-large:20px;--radius-full:9999px;--transition-speed:0.3s;--font-main:'SF Pro Display',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,'Open Sans','Helvetica Neue',sans-serif}body{font-family:var(--font-main);line-height:1.6;color:var(--text-color);background-color:var(--background-light);height:100%;display:flex;flex-direction:column;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="4" height="4" viewBox="0 0 4 4"><path fill="%23000000" fill-opacity="0.02" d="M1 3h1v1H1V3zm2-2h1v1H3V1z"></path></svg>');background-repeat:repeat}.container{max-width:1100px;width:100%;margin:0 auto;padding:20px;height:100%;display:flex;flex-direction:column;overflow:hidden}header{text-align:center;margin-bottom:15px;padding:5px 0;flex-shrink:0}.logo{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:8px}.logo i{font-size:2.5rem;background:var(--primary-gradient);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}header h1{color:var(--text-color);font-size:2.5rem;font-weight:600;letter-spacing:-.5px;margin-bottom:5px}header p{color:var(--light-text);font-size:1.1rem;max-width:600px;margin:0 auto}main{flex:1;display:flex;flex-direction:column;overflow:hidden;min-height:0}.translation-box{background-color:var(--background-white);border-radius:var(--radius-large);box-shadow:var(--shadow-medium);overflow:hidden;margin-bottom:10px;transition:box-shadow var(--transition-speed);flex:1;display:flex;flex-direction:column;min-height:0}.translation-box:hover{box-shadow:var(--shadow-hover)}@media (max-width:767px){.translation-panels{flex:1;min-height:0}.panel{min-height:0;max-height:40vh}.panel+.panel{border-top:1px solid var(--border-color)}}.language-controls{display:flex;align-items:center;padding:12px;border-bottom:1px solid var(--border-color);background:var(--primary-gradient);color:#fff;position:relative;overflow:hidden;flex-shrink:0}.language-controls::before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(255,255,255,.1) 0,rgba(255,255,255,0) 70%);animation:8s linear infinite shimmer;pointer-events:none}@keyframes shimmer{from{transform:rotate(0)}to{transform:rotate(360deg)}}.language-selector{flex:1;position:relative}.language-selector:after{content:'\f107';font-family:'Font Awesome 5 Free';font-weight:900;position:absolute;right:15px;top:50%;transform:translateY(-50%);pointer-events:none;color:var(--primary-color)}.language-selector select{width:100%;padding:12px 40px 12px 15px;border:none;border-radius:var(--radius-full);font-size:1rem;font-weight:500;background-color:var(--background-white);color:var(--text-color);cursor:pointer;transition:all var(--transition-speed);appearance:none;-webkit-appearance:none;-moz-appearance:none;box-shadow:var(--shadow-light)}.language-selector select:focus{outline:0;box-shadow:0 0 0 3px rgba(67,97,238,.3)}.swap-languages{margin:0 15px;display:flex;justify-content:center}#swap-btn{background:var(--background-white);border:none;width:50px;height:50px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--primary-color);transition:all var(--transition-speed);box-shadow:var(--shadow-light)}#swap-btn:hover{transform:rotate(180deg);box-shadow:0 0 15px rgba(255,255,255,.3);color:var(--accent-color)}#swap-btn i{font-size:1.3rem}.translation-panels{display:flex;flex-direction:column;flex:1}@media (min-width:768px){.translation-panels{flex-direction:row;flex:1;min-height:0}.panel+.panel{border-left:1px solid var(--border-color)}}.panel{flex:1;display:flex;flex-direction:column;position:relative;min-height:0;overflow:hidden}.panel-header{padding:0 15px;display:flex;justify-content:space-between;align-items:center;color:var(--light-text);font-size:.85rem;background-color:var(--background-light);border-bottom:1px solid var(--border-color);height:40px;box-sizing:border-box;flex-shrink:0}#source-language-label,#target-language-label{font-weight:500;min-width:80px;line-height:40px;color:var(--primary-color)}.char-count{display:flex;align-items:center;color:var(--light-text);font-size:.9rem;height:40px;line-height:40px}.translation-status{color:var(--success-color);font-weight:500;display:flex;align-items:center;gap:5px;height:40px;position:absolute;right:15px;top:0;background-color:var(--background-light);padding:0 5px}.translation-status i{font-size:1rem}.output-content,.panel textarea{flex:1;padding:15px;border:none;font-size:1.1rem;line-height:1.5;resize:none;min-height:0;height:100%;box-sizing:border-box;overflow-y:auto}.panel textarea{outline:0;font-family:inherit;color:var(--text-color);background-color:var(--background-white)}.panel textarea::placeholder{color:#aaa}.output-content{background-color:var(--background-white);white-space:pre-wrap;word-break:break-word;color:var(--text-color);position:relative;overflow-y:auto;max-height:100%}.output-content.placeholder{color:#aaa;font-style:italic}.panel-footer{display:flex;justify-content:space-between;padding:10px 15px;border-top:1px solid var(--border-color);background-color:var(--background-light);flex-shrink:0}.panel-footer-left,.panel-footer-right{display:flex;gap:10px}.icon-btn{background:0 0;border:none;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--light-text);transition:all var(--transition-speed)}.icon-btn:hover{background-color:rgba(67,97,238,.1);color:var(--primary-color);transform:translateY(-2px)}.icon-btn:active{transform:translateY(0);color:var(--accent-color)}.icon-btn i{font-size:1.2rem}.translate-button-container{padding:10px;display:flex;justify-content:center;border-top:1px solid var(--border-color);background-color:var(--background-light);flex-shrink:0}#translate-btn{background:var(--primary-gradient);color:#fff;border:none;border-radius:var(--radius-full);padding:10px 30px;font-size:1rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:8px;transition:all var(--transition-speed);box-shadow:var(--shadow-light);position:relative;overflow:hidden}#translate-btn::before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:.6s}#translate-btn:hover::before{left:100%}#translate-btn:hover{transform:translateY(-3px);box-shadow:var(--shadow-hover)}#translate-btn:active{transform:translateY(-1px)}#translate-btn i{font-size:1.2rem}.loading-indicator{position:absolute;top:0;left:0;right:0;bottom:0;background-color:rgba(255,255,255,.5);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:100;backdrop-filter:blur(1px);-webkit-backdrop-filter:blur(1px)}.spinner{width:30px;height:30px;border:2px solid rgba(67,97,238,.2);border-radius:50%;border-top-color:var(--primary-color);animation:.8s linear infinite spin;margin-bottom:10px}@keyframes spin{to{transform:rotate(360deg)}}.loading-indicator p{color:var(--text-color);font-weight:500;font-size:.9rem}footer{text-align:center;margin-top:auto;padding:10px 0;color:var(--light-text);font-size:.95rem;flex-shrink:0}.footer-links{margin-top:5px;display:flex;justify-content:center;gap:20px}.footer-links a{color:var(--primary-color);text-decoration:none;transition:all var(--transition-speed);display:flex;align-items:center;gap:5px}.footer-links a:hover{color:var(--accent-color);transform:translateY(-2px)}.footer-links a i{font-size:.9rem}.modal{position:fixed;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;z-index:1500;opacity:0;visibility:hidden;transition:all var(--transition-speed);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}.modal.active{opacity:1;visibility:visible}.modal-content{background-color:var(--background-white);border-radius:var(--radius-large);padding:30px;width:90%;max-width:550px;max-height:80vh;overflow-y:hidden;position:relative;box-shadow:var(--shadow-medium);transform:translateY(20px);transition:all var(--transition-speed);border:1px solid var(--border-color)}.modal.active .modal-content{transform:translateY(0)}.close-modal{position:absolute;top:20px;right:20px;font-size:1.5rem;cursor:pointer;color:var(--light-text);transition:color var(--transition-speed);width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:50%}.close-modal:hover{color:var(--error-color);background-color:rgba(217,4,41,.1)}.modal h2{margin-bottom:20px;color:var(--text-color);font-size:1.8rem;font-weight:600}.modal p{margin-bottom:15px;color:var(--light-text);line-height:1.7}.hidden{display:none!important}.copy-notification{position:fixed;top:20px;right:20px;background:var(--primary-gradient);color:#fff;padding:12px 20px;border-radius:var(--radius-medium);box-shadow:var(--shadow-medium);z-index:2000;font-weight:500;display:flex;align-items:center;gap:8px;opacity:0;animation:2.5s forwards notification-slide;max-width:300px}.copy-notification i{font-size:1.1rem}@keyframes notification-slide{0%,100%{opacity:0;transform:translateX(20px)}15%,85%{opacity:1;transform:translateX(0)}}@media (max-width:600px){.language-controls{flex-direction:column;gap:10px;padding:10px}.swap-languages{transform:rotate(90deg)}.output-content,.panel textarea{font-size:1rem;padding:12px}header h1{font-size:1.8rem}header p{font-size:.9rem}.copy-notification{top:10px;right:10px;left:10px;max-width:none}.container{padding:10px}.panel-header{height:36px}#source-language-label,#target-language-label,.char-count{line-height:36px;height:36px}.translation-status{height:36px}}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--background-light);border-radius:10px}::-webkit-scrollbar-thumb{background:var(--light-text);border-radius:10px}::-webkit-scrollbar-thumb:hover{background:var(--primary-color)}.wave-animation{position:absolute;bottom:0;left:0;width:100%;height:100px;background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320"><path fill="%234361ee" fill-opacity="0.05" d="M0,192L48,197.3C96,203,192,213,288,229.3C384,245,480,267,576,250.7C672,235,768,181,864,170.7C960,160,1056,192,1152,197.3C1248,203,1344,181,1392,170.7L1440,160L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path></svg>') 0 0/cover no-repeat;z-index:-1;opacity:.8}.settings-group{margin-bottom:25px}.settings-group h3{font-size:1.2rem;color:var(--text-color);margin-bottom:15px;font-weight:500;border-left:3px solid var(--primary-color);padding-left:10px}.setting-item{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;padding-bottom:15px;border-bottom:1px solid var(--border-color)}.setting-item:last-child{border-bottom:none}.setting-item label{color:var(--text-color);font-weight:400}.setting-item select{width:150px;padding:8px 12px;border:1px solid var(--border-color);border-radius:var(--radius-small);background-color:var(--background-white);color:var(--text-color)}.settings-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.primary-button,.secondary-button{padding:10px 20px;border-radius:var(--radius-medium);font-weight:500;cursor:pointer;transition:all var(--transition-speed)}.primary-button{background:var(--primary-gradient);color:#fff;border:none}.primary-button:hover{transform:translateY(-2px);box-shadow:var(--shadow-hover)}.secondary-button{background:0 0;color:var(--text-color);border:1px solid var(--border-color)}.secondary-button:hover{background-color:var(--background-light)}.switch{position:relative;display:inline-block;width:50px;height:24px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;transition:.4s}.slider:before{position:absolute;content:"";height:18px;width:18px;left:3px;bottom:3px;background-color:#fff;transition:.4s}input:checked+.slider{background:var(--primary-gradient)}input:focus+.slider{box-shadow:0 0 1px var(--primary-color)}input:checked+.slider:before{transform:translateX(26px)}.slider.round{border-radius:34px}.slider.round:before{border-radius:50%}.fullscreen-view{position:fixed;top:0;left:0;right:0;bottom:0;background-color:var(--background-white);z-index:2000;display:flex;flex-direction:column}.fullscreen-header{display:flex;justify-content:space-between;align-items:center;padding:15px 20px;border-bottom:1px solid var(--border-color);background-color:var(--background-light)}.fullscreen-title{font-size:1.2rem;font-weight:500;color:var(--primary-color)}#fullscreen-content{flex:1;padding:30px;font-size:1.2rem;line-height:1.8;overflow-y:auto;white-space:pre-wrap;word-break:break-word}@keyframes rotate{from{transform:rotate(0)}to{transform:rotate(360deg)}}.rotating{animation:.5s rotate}.dark-theme{--text-color:#e0e0e0;--light-text:#9ca3af;--border-color:#374151;--background-light:#1f2937;--background-white:#111827;--shadow-light:0 2px 10px rgba(0, 0, 0, 0.3);--shadow-medium:0 4px 20px rgba(0, 0, 0, 0.4);--shadow-hover:0 8px 30px rgba(79, 70, 229, 0.3);--primary-color:#6366f1;--secondary-color:#8b5cf6;--accent-color:#ec4899;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="4" height="4" viewBox="0 0 4 4"><path fill="%23ffffff" fill-opacity="0.03" d="M1 3h1v1H1V3zm2-2h1v1H3V1z"></path></svg>');background-repeat:repeat}.dark-theme .language-selector:after{color:var(--secondary-color)}.dark-theme .language-controls{background:linear-gradient(135deg,#4f46e5 0,#8b5cf6 100%)}.dark-theme .wave-animation{background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320"><path fill="%236366f1" fill-opacity="0.1" d="M0,192L48,197.3C96,203,192,213,288,229.3C384,245,480,267,576,250.7C672,235,768,181,864,170.7C960,160,1056,192,1152,197.3C1248,203,1344,181,1392,170.7L1440,160L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path></svg>')}#favorite-btn{color:var(--light-text);transition:all var(--transition-speed)}#favorite-btn:hover{color:#ffc107}#favorite-btn.active{color:#ffc107;animation:.5s ease-in-out star-pulse}@keyframes star-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.3)}}.favorites-container{max-height:calc(70vh - 80px);overflow-y:auto;margin-top:20px;padding-right:10px}.favorite-item{background-color:var(--background-light);border-radius:var(--radius-medium);padding:15px;margin-bottom:15px;box-shadow:var(--shadow-light);transition:all var(--transition-speed)}.favorite-item:hover{box-shadow:var(--shadow-medium)}.favorite-header{display:flex;justify-content:space-between;margin-bottom:10px;font-size:.9rem;color:var(--light-text)}.favorite-languages{font-weight:500}.favorite-date{font-size:.8rem}.favorite-content{margin-bottom:15px}.favorite-source{color:var(--light-text);margin-bottom:8px;padding-bottom:8px;border-bottom:1px solid var(--border-color);font-size:.95rem}.favorite-target{color:var(--text-color);font-weight:500}.favorite-actions{display:flex;justify-content:flex-end;gap:10px}.favorite-actions button{background:0 0;border:none;cursor:pointer;padding:5px 10px;border-radius:var(--radius-small);transition:all var(--transition-speed);display:flex;align-items:center;justify-content:center}.copy-favorite{color:var(--secondary-color)}.copy-favorite:hover{background-color:rgba(76,201,240,.1)}.use-favorite{color:var(--primary-color)}.use-favorite:hover{background-color:rgba(67,97,238,.1)}.remove-favorite{color:var(--error-color)}.remove-favorite:hover{background-color:rgba(217,4,41,.1)}.empty-favorites{text-align:center;padding:30px;color:var(--light-text);font-style:italic}.dark-theme #favorite-btn{color:#adb5bd}.dark-theme #favorite-btn.active,.dark-theme #favorite-btn:hover{color:#ffc107}.dark-theme .favorite-item{background-color:#2d3748}.dark-theme .favorite-source{border-bottom-color:#4a5568}.dark-theme .copy-favorite{color:#4cc9f0}.dark-theme .copy-favorite:hover{background-color:rgba(76,201,240,.2)}.dark-theme .use-favorite:hover{background-color:rgba(67,97,238,.2)}.dark-theme .remove-favorite:hover{background-color:rgba(217,4,41,.2)}.clear-favorites-btn{display:flex;justify-content:flex-end;margin-bottom:15px;padding-bottom:15px;border-bottom:1px solid var(--border-color)}.clear-favorites-btn button{display:flex;align-items:center;gap:8px;padding:8px 15px;font-size:.9rem;transition:all var(--transition-speed)}.clear-favorites-btn button:hover{background-color:rgba(217,4,41,.1);color:var(--error-color)}.dark-theme .clear-favorites-btn{border-bottom-color:#4a5568}.dark-theme .clear-favorites-btn button:hover{background-color:rgba(217,4,41,.2)}