body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--bg-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0;transition:background-color .3s ease,color .3s ease}body,code{color:var(--text-primary)}code{background-color:var(--card-bg);border-radius:4px;font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace;padding:.25rem .5rem}:root{--bg-primary:#f8f8f8;--bg-secondary:#fff;--text-primary:#333;--text-secondary:#666;--text-muted:#999;--border-color:#ddd;--shadow-color:#0000001a;--shadow-hover:#00000026;--input-bg:#fff;--card-bg:#fff;--card-hover-bg:#f9fafb}.dark-mode{--bg-primary:#1a1a1a;--bg-secondary:#2d2d2d;--text-primary:#e0e0e0;--text-secondary:#b0b0b0;--text-muted:#888;--border-color:#404040;--border-light:#363636;--shadow-color:#0000004d;--shadow-hover:#0006;--input-bg:#2d2d2d;--card-bg:#2d2d2d;--card-hover-bg:#363636}#root,body,html{height:100%}#root,body{background-color:#f8f8f8;background-color:var(--bg-primary);color:#333;color:var(--text-primary);display:block;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:14px;min-height:100vh;transition:background-color .3s ease,color .3s ease}#root,.App,body{box-sizing:border-box;margin:0;padding:0}.App{background:#0000;border-radius:0;box-shadow:none;width:100%}@media (max-width:768px){#root,.App,body{padding:0}.App{border-radius:0;box-shadow:none;margin:0;max-width:100%}}@media (max-width:480px){#root,.App,body{padding:0}.App{border-radius:0;max-width:100%}}button{background:linear-gradient(135deg,#4caf50,#45a049);border:none;border-radius:12px;box-sizing:border-box;color:#fff;cursor:pointer;font-size:1rem;font-weight:600;margin:10px 15px 10px 10px;min-height:44px;padding:.6rem 1.2rem;transition:all .3s ease;-webkit-user-select:none;user-select:none}button:hover{background:linear-gradient(135deg,#45a049,#2196f3)}button:active{background:linear-gradient(135deg,#388e3c,#1976d2)}button:disabled{background-color:#999;cursor:not-allowed}input[type=email],input[type=password],input[type=text],select,textarea{background-color:#fff;background-color:var(--input-bg);border:1px solid #ddd;border:1px solid var(--border-color);border-radius:6px;box-sizing:border-box;color:#333;color:var(--text-primary);font-size:1rem;min-height:40px;outline-offset:0;padding:.5rem .75rem;transition:border-color .3s ease,background-color .3s ease,color .3s ease;width:100%}input[type=email]:focus,input[type=password]:focus,input[type=text]:focus,select:focus,textarea:focus{border-color:#4caf50;outline:none}.checkbox-container{align-items:center;cursor:pointer;display:flex;gap:.5rem;-webkit-user-select:none;user-select:none}.checkbox-container input[type=checkbox]{appearance:none;-webkit-appearance:none;background-color:#f8f8f8;background-color:var(--bg-primary);border:2px solid #ddd;border:2px solid var(--border-color);border-radius:50%;cursor:pointer;height:20px;position:relative;transition:background-color .3s ease,border-color .3s ease;width:20px}.checkbox-container input[type=checkbox]:checked{background-color:#4caf50;border-color:#4caf50}.checkbox-container input[type=checkbox]:checked:after{color:#fff;content:"✔";font-size:14px;left:4px;position:absolute;top:0;-webkit-user-select:none;user-select:none}select{appearance:none;-webkit-appearance:none;background-color:#fff;background-color:var(--input-bg);background-image:url('data:image/svg+xml;utf8,<svg fill="%23999" height="20" viewBox="0 0 24 24" width="20" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/></svg>');background-position:right 10px center;background-repeat:no-repeat;background-size:12px;border:1px solid #ddd;border:1px solid var(--border-color);border-radius:8px;color:#333;color:var(--text-primary);cursor:pointer;font-size:1rem;padding:.4rem .75rem}select:focus{border-color:#4caf50;outline:none}option:hover{background-color:#1e90ff;color:#fff}.word-list-container{margin:0 auto;max-width:42rem}.word-list-title{font-size:1.5rem;font-weight:700;margin-bottom:1.5rem}.word-list{display:flex;flex-direction:column;gap:.5rem}.word-card{background:#fff;background:var(--card-bg);border:1px solid #e5e7eb;border:1px solid var(--border-light);border-radius:.5rem;box-shadow:0 1px 3px #0000001a;box-shadow:0 1px 3px var(--shadow-color);cursor:pointer;padding:1rem;transition:all .2s ease}.word-card:hover{background-color:#f9fafb;background-color:var(--card-hover-bg);border-color:#ddd;border-color:var(--border-color);box-shadow:0 4px 6px #00000026;box-shadow:0 4px 6px var(--shadow-hover);transform:translateY(-1px)}.word-content{align-items:center;display:flex;justify-content:space-between}.word-text{font-size:1.125rem;font-weight:500}.word-meaning{color:#666;color:var(--text-secondary);margin-left:1rem}.word-accent{color:#999;color:var(--text-muted);font-size:.875rem}.back-button-container{margin-top:2rem;text-align:center}.back-button{background-color:#22c55e;border-radius:.5rem;padding:.75rem 2rem;transition:all .2s ease}.back-button:hover{background-color:#16a34a;box-shadow:0 4px 8px #22c55e4d}.back-button:active{transform:translateY(0)}.company-branding{gap:8px}.company-branding,.company-branding-vertical{color:#666;color:var(--text-secondary);font-size:14px;margin-top:16px}.company-branding-vertical{text-align:center}.company-logo{height:48px;width:auto}.company-footer{color:#666;color:var(--text-secondary);font-size:13px;margin-top:24px;text-align:center;width:100%}.copyright{color:#999;color:var(--text-muted);font-size:12px;margin-top:4px;text-align:center}@media (max-width:768px){button{font-size:1rem;margin:8px 12px 8px 8px;min-height:48px;padding:.75rem 1.5rem;touch-action:manipulation}input[type=email],input[type=password],input[type=text],select,textarea{font-size:1rem;min-height:48px;padding:.75rem;touch-action:manipulation}}@media (max-width:480px){button{font-size:1rem;margin:6px 10px 6px 6px;min-height:44px;padding:.875rem 1rem}input[type=email],input[type=password],input[type=text],select,textarea{font-size:1rem;min-height:44px;padding:.875rem}}.auth-dialog{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;box-sizing:border-box;margin:auto;max-width:500px;padding:1rem;width:100%}.app-branding{border-bottom:2px solid var(--border-light);margin-bottom:2rem;padding-bottom:1.5rem;text-align:center}.app-title{color:#32a753;font-size:2.5rem;font-weight:700;letter-spacing:-.02em;line-height:1.2;margin:0}.app-tagline,.app-title{font-family:Segoe UI,Roboto,Helvetica Neue,sans-serif}.app-tagline{color:var(--text-secondary);font-size:.9rem;font-weight:400;letter-spacing:.02em;margin:.5rem 0 0}.auth-dialog h2{color:var(--text-primary);text-align:center}.auth-dialog div{margin-bottom:10px}.auth-dialog label{color:var(--text-primary);display:block;font-weight:700}.auth-dialog input{background-color:var(--input-bg);border:1px solid var(--border-color);border-radius:4px;box-sizing:border-box;color:var(--text-primary);margin-top:4px;padding:6px;width:100%}.button-row{display:flex;flex-direction:column;gap:8px;max-height:200px;overflow-y:auto;padding-right:4px}.button-row::-webkit-scrollbar{width:6px}.button-row::-webkit-scrollbar-track{background:var(--border-light);border-radius:3px}.button-row::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:3px}.button-row::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.remember-me-container{background-color:var(--card-bg);border:1px solid var(--border-light);border-radius:6px;margin:1rem 0;padding:.75rem}.remember-me-label{align-items:center;color:var(--text-secondary);cursor:pointer;display:flex;font-size:.9rem;font-weight:400!important;gap:.5rem;margin:0}.remember-me-checkbox{cursor:pointer;margin:0!important;padding:0;width:auto!important}.password-warning-container{margin:1rem 0;padding:0}.password-warning{background-color:#fff3cd;border:1px solid #ffeaa7;border-radius:6px;margin-bottom:1rem;padding:1rem}.password-warning strong{color:#856404;display:block;font-size:.95rem;margin-bottom:.5rem}.password-warning p{color:#856404;font-size:.9rem;line-height:1.4;margin:0}.dark-mode .password-warning{background-color:#3d2914;border:1px solid #8b6914}.dark-mode .password-warning p,.dark-mode .password-warning strong{color:#fbbf24}.acknowledgment-label{align-items:flex-start;color:var(--text-secondary);cursor:pointer;display:flex;font-size:.9rem;font-weight:400!important;gap:.5rem;line-height:1.4;margin:0}.acknowledgment-checkbox{cursor:pointer;flex-shrink:0;margin:2px 0 0!important;padding:0;width:auto!important}.error{color:red;font-weight:700}.skip-login-indicator{padding:2rem;text-align:center}.skip-login-indicator h2{color:#2563eb;margin-bottom:1rem}.skip-login-indicator p{color:var(--text-secondary);font-size:.9rem;margin-bottom:1.5rem}.loading-spinner{animation:spin 2s linear infinite;font-size:2rem}.company-branding{margin-top:1.5rem;padding-top:1rem}.company-logo{height:20px;width:20px}.company-name{font-size:.8rem}.reset-password-btn{background:none!important;border:none!important;color:var(--primary-color)!important;cursor:pointer;font-size:.9rem;padding:.5rem 0!important;text-decoration:underline}.reset-password-btn:hover{opacity:.8}.reset-modal-overlay{align-items:center;background:#00000080;bottom:0;display:flex;justify-content:center;left:0;padding:1rem;position:fixed;right:0;top:0;z-index:1000}.reset-modal{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;box-shadow:0 4px 6px #0000001a;max-width:400px;padding:2rem;width:100%}.reset-modal h3{color:var(--text-primary);font-size:1.25rem;margin:0 0 1rem;text-align:center}.reset-modal p{color:var(--text-secondary);font-size:.9rem;margin:0 0 1.5rem;text-align:center}.reset-form{display:flex;flex-direction:column;gap:1rem}.reset-email-input{background:var(--input-bg);border:1px solid var(--border-color);border-radius:6px;box-sizing:border-box;color:var(--text-primary);font-size:1rem;padding:12px;width:100%}.reset-button-row{display:flex;gap:.5rem;justify-content:flex-end}.reset-submit-btn{background:#32a753;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.9rem;font-weight:500;padding:10px 16px}.reset-submit-btn:hover{background:#2d964b}.reset-cancel-btn{background:#0000;border:1px solid var(--border-color);border-radius:6px;color:var(--text-secondary);cursor:pointer;font-size:.9rem;padding:10px 16px}.reset-cancel-btn:hover{background:var(--border-light)}.reset-message{border-radius:6px;font-size:.9rem;margin-top:.5rem;padding:.75rem;text-align:center}.reset-message.success{background:#d4edda;border:1px solid #c3e6cb;color:#155724}.reset-message.error{background:#f8d7da;border:1px solid #f5c6cb;color:#721c24}.dark-mode .reset-message.success{background:#1e4620;border:1px solid #2d5a31;color:#75b798}.dark-mode .reset-message.error{background:#4a1e1e;border:1px solid #5a2d2d;color:#ef9a9a}@media (max-width:768px){.auth-dialog{border-radius:8px;margin:1rem;padding:1.5rem}.app-title{font-size:2.2rem}.app-tagline{font-size:.85rem}.auth-dialog h2{font-size:1.5rem;margin-bottom:1.5rem}.auth-dialog input{border-radius:8px;font-size:1rem;padding:12px}.auth-dialog label{font-size:1rem;margin-bottom:.5rem}.button-row{gap:12px}.button-row button{border-radius:8px;font-size:1rem;min-height:44px;padding:12px 16px}.company-branding{flex-direction:column;gap:.75rem;margin-top:2rem}.company-logo{height:24px;width:24px}.company-name{font-size:.9rem}.password-warning{padding:1.25rem}.password-warning strong{font-size:1rem}.acknowledgment-label,.password-warning p{font-size:.95rem}.reset-modal{margin:1rem;padding:1.5rem}.reset-email-input{font-size:1rem;padding:14px}.reset-button-row{flex-direction:column;gap:.75rem}.reset-cancel-btn,.reset-submit-btn{font-size:1rem;min-height:44px;padding:12px 16px}}@media (max-width:480px){.auth-dialog{margin:.5rem;padding:1rem}.app-title{font-size:1.8rem}.app-tagline{font-size:.8rem}.auth-dialog h2{font-size:1.25rem}.auth-dialog input{padding:14px}.button-row button{font-size:1.1rem;padding:14px 18px}.password-warning{padding:1rem}.password-warning strong{font-size:.95rem}.acknowledgment-label,.password-warning p{font-size:.9rem}.reset-modal{margin:.5rem;padding:1.25rem}.reset-modal h3{font-size:1.1rem}.reset-email-input{font-size:1.1rem;padding:16px}.reset-cancel-btn,.reset-submit-btn{font-size:1.1rem;padding:14px 18px}}.adsense-container{display:block;margin:20px auto;max-width:100%;min-width:200px;overflow:hidden;padding:10px;text-align:center;width:100%}.adsense-container .adsbygoogle{display:block!important;margin:0 auto;max-width:100%;min-width:200px;width:100%}@media (max-width:768px){.adsense-container{margin:15px auto;padding:8px}}@media (max-width:480px){.adsense-container{margin:10px auto;padding:5px}}.adsense-container .adsbygoogle[data-ad-status=unfilled]{align-items:center;background-color:#f8f9fa;border:1px solid #e9ecef;border-radius:4px;color:#6c757d;display:flex;font-size:14px;justify-content:center;min-height:100px}.adsense-container .adsbygoogle[data-ad-status=unfilled]:after{content:"Advertisement"}.password-strength-container{margin:15px 0}.password-requirements{background:#f8f9fa;border:1px solid #e9ecef;border-radius:6px;margin-bottom:15px;padding:12px}.requirements-title{color:#495057;font-size:14px;font-weight:600;margin:0 0 8px}.requirements-list{list-style:none;margin:0;padding:0}.requirement-item{align-items:center;display:flex;font-size:13px;padding:4px 0;transition:color .2s ease}.requirement-item.met{color:#28a745}.requirement-item.unmet{color:#6c757d}.requirement-icon{font-weight:700;margin-right:8px;text-align:center;width:16px}.requirement-item.met .requirement-icon{color:#28a745}.requirement-item.unmet .requirement-icon{color:#dee2e6}.requirement-text{flex:1 1}.password-strength-meter{margin-top:10px}.strength-label{align-items:center;color:#495057;display:flex;font-size:13px;justify-content:space-between;margin-bottom:6px}.strength-level{font-weight:600;text-transform:capitalize}.strength-level.none{color:#6c757d}.strength-level.weak{color:#dc3545}.strength-level.fair{color:#fd7e14}.strength-level.good{color:#ffc107}.strength-level.strong{color:#28a745}.strength-bar{background-color:#e9ecef;border-radius:3px;height:6px;overflow:hidden;width:100%}.strength-fill{border-radius:3px;height:100%;transition:width .3s ease,background-color .3s ease}.strength-fill.none{background-color:#6c757d}.strength-fill.weak{background-color:#dc3545}.strength-fill.fair{background-color:#fd7e14}.strength-fill.good{background-color:#ffc107}.strength-fill.strong{background-color:#28a745}@media (prefers-color-scheme:dark){.password-requirements{background:#2d3748;border-color:#4a5568}.requirements-title,.strength-label{color:#e2e8f0}.requirement-item.unmet{color:#a0aec0}.requirement-item.unmet .requirement-icon{color:#4a5568}.strength-bar{background-color:#4a5568}}.main-menu{background:var(--bg-secondary);border-radius:0;box-shadow:none;margin:0;min-height:100vh;padding:1rem;transition:background-color .3s ease;width:100%}.logo-area,.main-menu{display:flex;flex-direction:column}.logo-area{align-items:center;flex-shrink:0;gap:1rem;margin-bottom:3rem}.logo{border-radius:12px;height:80px;object-fit:cover;width:80px}.brand{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#4caf50,#2196f3);-webkit-background-clip:text;background-clip:text;color:var(--text-primary);font-size:2.5rem;font-weight:700;margin:0;text-align:center}.welcome-message{background:linear-gradient(135deg,#4caf501a,#2196f31a);border:2px solid #4caf5033;border-radius:16px;margin-bottom:2rem;padding:1.5rem;text-align:center}.welcome-text{color:var(--text-primary);font-size:1.25rem;font-weight:600;line-height:1.4;margin:0}.username-highlight{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#4caf50,#2196f3);-webkit-background-clip:text;background-clip:text;font-weight:700}.language-lessons-section{margin-bottom:2rem}.action-buttons-section{border-top:2px solid var(--border-light);margin-bottom:2rem;padding-top:2rem}.section-title{color:var(--text-primary);font-size:1.5rem;opacity:.8;text-align:center}.button-list{grid-gap:1rem;display:grid;flex:none;gap:1rem;grid-template-columns:1fr;max-height:none;overflow-y:visible}.action-buttons,.language-buttons{margin-bottom:0}.offline-indicator{background:linear-gradient(135deg,#f6ad55,#ed8936);border-radius:8px;box-shadow:0 2px 10px #ed89364d;color:#fff;font-weight:600;grid-column:1/-1;margin-bottom:1rem;padding:1rem;text-align:center}.button-list button{background:linear-gradient(135deg,#32a753,#2e9549);border:none;border-radius:12px;box-shadow:0 4px 15px #32a7534d;color:#fff;cursor:pointer;font-size:1.1rem;font-weight:600;margin:0;min-height:56px;padding:1.25rem 2rem;transition:all .3s ease;width:100%}.button-list button:hover{background:linear-gradient(135deg,#2e9549,#2196f3);box-shadow:0 8px 25px #32a75366;transform:translateY(-2px)}.button-list button:active{box-shadow:0 4px 15px #32a7534d;transform:translateY(0)}.button-list button:last-child{background:linear-gradient(135deg,#2196f3,#1976d2);box-shadow:0 4px 15px #2196f34d}.button-list button:last-child:hover{background:linear-gradient(135deg,#1976d2,#1565c0);box-shadow:0 8px 25px #2196f366}.button-list button:nth-last-child(2){background:linear-gradient(135deg,#e53e3e,#c53030);box-shadow:0 4px 15px #e53e3e4d}.button-list button:nth-last-child(2):hover{background:linear-gradient(135deg,#c53030,#9c2626);box-shadow:0 8px 25px #e53e3e66}.logout-button{background:linear-gradient(135deg,#e53e3e,#c53030)!important;box-shadow:0 4px 15px #e53e3e4d!important}.logout-button:hover{background:linear-gradient(135deg,#c53030,#9c2626)!important;box-shadow:0 8px 25px #e53e3e66!important}.about-button{background:linear-gradient(135deg,#2196f3,#1976d2)!important;box-shadow:0 4px 15px #2196f34d!important}.about-button:hover{background:linear-gradient(135deg,#1976d2,#1565c0)!important;box-shadow:0 8px 25px #2196f366!important}.business-button{background:linear-gradient(135deg,gold,#ffb347)!important;box-shadow:0 4px 15px #ffd7004d!important;transition:transform .3s ease!important}.business-button:hover{background:linear-gradient(135deg,#e6c200,#e6a82e)!important;box-shadow:0 8px 25px #ffd70066!important;transform:translateY(-2px)!important}@keyframes businessColorCycle{0%{background:#ff9800;box-shadow:0 4px 15px #ff98004d}1%{background:#fc9703;box-shadow:0 4px 15px #fc97034d}2%{background:#f99606;box-shadow:0 4px 15px #f996064d}3%{background:#f69509;box-shadow:0 4px 15px #f695094d}4%{background:#f3940c;box-shadow:0 4px 15px #f3940c4d}5%{background:#f0930f;box-shadow:0 4px 15px #f0930f4d}6%{background:#ed9212;box-shadow:0 4px 15px #ed92124d}7%{background:#ea9115;box-shadow:0 4px 15px #ea91154d}8%{background:#e79018;box-shadow:0 4px 15px #e790184d}9%{background:#e48f1b;box-shadow:0 4px 15px #e48f1b4d}10%{background:#e18e1e;box-shadow:0 4px 15px #e18e1e4d}11%{background:#de8d21;box-shadow:0 4px 15px #de8d214d}12%{background:#db8c24;box-shadow:0 4px 15px #db8c244d}13%{background:#d88b27;box-shadow:0 4px 15px #d88b274d}14%{background:#d58a2a;box-shadow:0 4px 15px #d58a2a4d}15%{background:#d2892d;box-shadow:0 4px 15px #d2892d4d}16%{background:#cf8830;box-shadow:0 4px 15px #cf88304d}17%{background:#cc8733;box-shadow:0 4px 15px #cc87334d}18%{background:#c98636;box-shadow:0 4px 15px #c986364d}19%{background:#c68539;box-shadow:0 4px 15px #c685394d}20%{background:#c3843c;box-shadow:0 4px 15px #c3843c4d}21%{background:#c0833f;box-shadow:0 4px 15px #c0833f4d}22%{background:#bd8242;box-shadow:0 4px 15px #bd82424d}23%{background:#ba8145;box-shadow:0 4px 15px #ba81454d}24%{background:#b78048;box-shadow:0 4px 15px #b780484d}25%{background:#b47f4b;box-shadow:0 4px 15px #b47f4b4d}26%{background:#b17e4e;box-shadow:0 4px 15px #b17e4e4d}27%{background:#ae7d51;box-shadow:0 4px 15px #ae7d514d}28%{background:#ab7c54;box-shadow:0 4px 15px #ab7c544d}29%{background:#a87b57;box-shadow:0 4px 15px #a87b574d}30%{background:#a57a5a;box-shadow:0 4px 15px #a57a5a4d}31%{background:#a2795d;box-shadow:0 4px 15px #a2795d4d}32%{background:#9f7860;box-shadow:0 4px 15px #9f78604d}33%{background:#9c7763;box-shadow:0 4px 15px #9c77634d}34%{background:#997666;box-shadow:0 4px 15px #9976664d}35%{background:#967569;box-shadow:0 4px 15px #9675694d}36%{background:#93746c;box-shadow:0 4px 15px #93746c4d}37%{background:#90736f;box-shadow:0 4px 15px #90736f4d}38%{background:#8d7272;box-shadow:0 4px 15px #8d72724d}39%{background:#8a7175;box-shadow:0 4px 15px #8a71754d}40%{background:#877078;box-shadow:0 4px 15px #8770784d}41%{background:#846f7b;box-shadow:0 4px 15px #846f7b4d}42%{background:#816e7e;box-shadow:0 4px 15px #816e7e4d}43%{background:#7e6d81;box-shadow:0 4px 15px #7e6d814d}44%{background:#7b6c84;box-shadow:0 4px 15px #7b6c844d}45%{background:#786b87;box-shadow:0 4px 15px #786b874d}46%{background:#756a8a;box-shadow:0 4px 15px #756a8a4d}47%{background:#72698d;box-shadow:0 4px 15px #72698d4d}48%{background:#6f6890;box-shadow:0 4px 15px #6f68904d}49%{background:#6c6793;box-shadow:0 4px 15px #6c67934d}50%{background:#696696;box-shadow:0 4px 15px #6966964d}51%{background:#666599;box-shadow:0 4px 15px #6665994d}52%{background:#63649c;box-shadow:0 4px 15px #63649c4d}53%{background:#60639f;box-shadow:0 4px 15px #60639f4d}54%{background:#5d62a2;box-shadow:0 4px 15px #5d62a24d}55%{background:#5a61a5;box-shadow:0 4px 15px #5a61a54d}56%{background:#5760a8;box-shadow:0 4px 15px #5760a84d}57%{background:#545fab;box-shadow:0 4px 15px #545fab4d}58%{background:#515eae;box-shadow:0 4px 15px #515eae4d}59%{background:#4e5db1;box-shadow:0 4px 15px #4e5db14d}60%{background:#4b5cb4;box-shadow:0 4px 15px #4b5cb44d}61%{background:#485bb7;box-shadow:0 4px 15px #485bb74d}62%{background:#455aba;box-shadow:0 4px 15px #455aba4d}63%{background:#4259bd;box-shadow:0 4px 15px #4259bd4d}64%{background:#3f58c0;box-shadow:0 4px 15px #3f58c04d}65%{background:#3c57c3;box-shadow:0 4px 15px #3c57c34d}66%{background:#3956c6;box-shadow:0 4px 15px #3956c64d}67%{background:#3655c9;box-shadow:0 4px 15px #3655c94d}68%{background:#3354cc;box-shadow:0 4px 15px #3354cc4d}69%{background:#3053cf;box-shadow:0 4px 15px #3053cf4d}70%{background:#2d52d2;box-shadow:0 4px 15px #2d52d24d}71%{background:#2a51d5;box-shadow:0 4px 15px #2a51d54d}72%{background:#2750d8;box-shadow:0 4px 15px #2750d84d}73%{background:#244fdb;box-shadow:0 4px 15px #244fdb4d}74%{background:#214ede;box-shadow:0 4px 15px #214ede4d}75%{background:#1e4de1;box-shadow:0 4px 15px #1e4de14d}76%{background:#1b4ce4;box-shadow:0 4px 15px #1b4ce44d}77%{background:#184be7;box-shadow:0 4px 15px #184be74d}78%{background:#154aea;box-shadow:0 4px 15px #154aea4d}79%{background:#1249ed;box-shadow:0 4px 15px #1249ed4d}80%{background:#0f48f0;box-shadow:0 4px 15px #0f48f04d}81%{background:#2456e8;box-shadow:0 4px 15px #2456e84d}82%{background:#3964e0;box-shadow:0 4px 15px #3964e04d}83%{background:#4e72d8;box-shadow:0 4px 15px #4e72d84d}84%{background:#6380d0;box-shadow:0 4px 15px #6380d04d}85%{background:#788ec8;box-shadow:0 4px 15px #788ec84d}86%{background:#8d9cc0;box-shadow:0 4px 15px #8d9cc04d}87%{background:#a2aab8;box-shadow:0 4px 15px #a2aab84d}88%{background:#b7b8b0;box-shadow:0 4px 15px #b7b8b04d}89%{background:#ccc6a8;box-shadow:0 4px 15px #ccc6a84d}90%{background:#e1d4a0;box-shadow:0 4px 15px #e1d4a04d}91%{background:#f6e298;box-shadow:0 4px 15px #f6e2984d}92%{background:#fde78f;box-shadow:0 4px 15px #fde78f4d}93%{background:#fce486;box-shadow:0 4px 15px #fce4864d}94%{background:#fbe17d;box-shadow:0 4px 15px #fbe17d4d}95%{background:#fade74;box-shadow:0 4px 15px #fade744d}96%{background:#f9db6b;box-shadow:0 4px 15px #f9db6b4d}97%{background:#f8d862;box-shadow:0 4px 15px #f8d8624d}98%{background:#f7d559;box-shadow:0 4px 15px #f7d5594d}99%{background:#f6d250;box-shadow:0 4px 15px #f6d2504d}to{background:#ff9800;box-shadow:0 4px 15px #ff98004d}}.green-button{background:linear-gradient(135deg,#32a753,#2e9549)!important;box-shadow:0 4px 15px #32a7534d!important}.green-button:hover{background:linear-gradient(135deg,#2e9549,#2196f3)!important;box-shadow:0 8px 25px #32a75366!important;transform:translateY(-2px)}@media (max-width:768px){.main-menu{margin:0 auto;max-width:600px;min-height:auto;padding:1rem}.logo-area{background:var(--bg-secondary);margin-bottom:2rem;padding-bottom:1rem;position:sticky;top:0;z-index:10}.welcome-message{margin-bottom:1.5rem;padding:1.25rem}.welcome-text{font-size:1.1rem}.button-list{flex:none;gap:1rem;grid-template-columns:1fr;margin:0 auto;max-height:none;max-width:500px;overflow-y:visible}.button-list button{font-size:1.1rem;min-height:56px;padding:1.25rem 1.5rem;width:100%}.brand{font-size:2rem}.logo{height:60px;width:60px}.offline-indicator{font-size:1rem;padding:1rem}.action-buttons-section,.language-lessons-section{margin-left:auto;margin-right:auto;max-width:500px}}@media (max-width:480px){.main-menu{margin:0 auto;max-width:450px;min-height:auto;padding:.75rem}.logo-area{background:var(--bg-secondary);margin-bottom:1.5rem;padding-bottom:1rem;position:sticky;top:0;z-index:10}.welcome-message{margin-bottom:1.25rem;padding:1rem}.welcome-text{font-size:1rem;line-height:1.3}.brand{font-size:1.75rem}.logo{height:50px;width:50px}.button-list{flex:none;gap:.875rem;margin:0 auto;max-height:none;max-width:400px;overflow-y:visible}.button-list button{font-size:1rem;min-height:52px;padding:1.125rem 1.25rem;width:100%}.company-branding{flex-direction:column;gap:.75rem;margin-top:1.25rem}.company-logo{height:20px;width:20px}.company-name{font-size:.8rem}.action-buttons-section,.language-lessons-section{margin-left:auto;margin-right:auto;max-width:400px}}@media (min-width:769px){.main-menu{margin:0 auto;max-width:600px;min-height:auto;padding:2rem}.button-list{gap:1.5rem;grid-template-columns:repeat(2,1fr);margin:0 auto;max-width:500px}.button-list button{max-width:none;width:100%}.logo-area{margin-bottom:3rem}.welcome-message{margin-bottom:2.5rem;padding:1.75rem}.welcome-text{font-size:1.35rem}.language-lessons-section{margin-bottom:3rem}.action-buttons-section{margin-bottom:2rem;padding-top:2rem}.section-title{font-size:1.6rem;margin-bottom:2rem}}.company-branding{align-items:center;border-top:1px solid var(--border-light);display:flex;gap:.5rem;justify-content:center;margin-top:2rem;opacity:.7;padding-top:1.5rem}.company-logo{border-radius:4px;height:24px;object-fit:cover;width:24px}.company-name{color:var(--text-secondary);font-size:.875rem;font-weight:500}.preferred-language-section{margin-bottom:2rem}.preferred-language-title{color:var(--text-primary);font-size:1.4rem;font-weight:600;margin:0 0 1rem;text-align:center}.preferred-language-button{display:flex;justify-content:center;margin-bottom:2rem}.primary-language-btn{background:linear-gradient(135deg,#4caf50,#45a049);border:none;border-radius:16px;box-shadow:0 8px 25px #4caf504d;color:#fff;cursor:pointer;font-size:1.2rem;font-weight:600;padding:1.5rem 2rem;transform:translateY(-2px);transition:all .3s ease}.primary-language-btn:hover{background:linear-gradient(135deg,#45a049,#3d8b40);box-shadow:0 12px 35px #4caf5066;transform:translateY(-4px)}.other-languages-title{color:var(--text-secondary);font-size:1.1rem;font-weight:500;margin:0 0 1rem;opacity:.8;text-align:center}@media (max-width:768px){.primary-language-btn{font-size:1.1rem;padding:1.25rem 1.5rem}}@media (max-width:480px){.primary-language-btn{font-size:1rem;padding:1.125rem 1.25rem}}@keyframes pulse-glow{0%{box-shadow:0 2px 4px var(--shadow-color),0 0 0 0 #1b5e20b3}50%{box-shadow:0 8px 20px #1b5e2066,0 0 0 10px #1b5e2000}to{box-shadow:0 2px 4px var(--shadow-color),0 0 0 0 #1b5e2000}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes icon-bounce{0%,to{transform:scale(1) rotate(0deg)}25%{transform:scale(1.1) rotate(-5deg)}75%{transform:scale(1.1) rotate(5deg)}}@keyframes gradient-shift{0%{background:linear-gradient(135deg,#1b5e20,#2e7d32)}25%{background:linear-gradient(135deg,#2e7d32,#388e3c)}50%{background:linear-gradient(135deg,#388e3c,#43a047)}75%{background:linear-gradient(135deg,#43a047,#1b5e20)}to{background:linear-gradient(135deg,#1b5e20,#2e7d32)}}.theme-toggle-button{align-items:center;background:linear-gradient(135deg,#1b5e20,#2e7d32)!important;border:1px solid #388e3c!important;border-radius:12px;box-shadow:0 4px 15px #1b5e204d!important;box-sizing:border-box;color:#fff!important;cursor:pointer;display:flex;font-size:.9rem;font-weight:500;gap:.5rem;margin:10px 15px 10px 10px;min-height:44px;overflow:hidden;padding:.6rem 1rem;position:relative;transition:all .3s ease;-webkit-user-select:none;user-select:none}.theme-toggle-button:hover{animation:pulse-glow 2s infinite,gradient-shift 4s infinite;background:linear-gradient(135deg,#1b5e20,#2e7d32);border-color:#388e3c;color:#fff;transform:translateY(-3px) scale(1.05)}.theme-toggle-button:hover:before{animation:shimmer 2s infinite;background:linear-gradient(90deg,#0000,#fff6,#0000);bottom:0;content:"";left:0;position:absolute;right:0;top:0}.theme-toggle-button:hover .theme-toggle-icon{animation:icon-bounce 1s infinite;filter:drop-shadow(0 0 8px rgba(255,255,255,.8))}.theme-toggle-button:hover .theme-toggle-text{font-weight:700;text-shadow:0 0 10px #fffc}.theme-toggle-button:active{box-shadow:0 6px 15px #1b5e2099;transform:translateY(-1px) scale(1.02)}.theme-toggle-icon{align-items:center;display:flex;font-size:1.2rem}.theme-toggle-icon,.theme-toggle-text{position:relative;transition:all .3s ease;z-index:2}.theme-toggle-text{font-weight:500}.theme-toggle-button:focus{animation:pulse-glow 1.5s infinite,gradient-shift 3s infinite;background:linear-gradient(135deg,#1b5e20,#2e7d32);border:2px solid #388e3c;box-shadow:0 0 20px #1b5e20cc,0 0 40px #1b5e2099,0 0 60px #1b5e2066;color:#fff;outline:none;transform:scale(1.1)}.theme-toggle-button:focus .theme-toggle-icon{animation:icon-bounce .8s infinite;filter:drop-shadow(0 0 12px rgba(255,255,255,1));text-shadow:0 0 15px #ffffffe6}.theme-toggle-button:focus .theme-toggle-text{font-weight:800;letter-spacing:1px;text-shadow:0 0 15px #fff}.theme-toggle-button.super-active{animation:pulse-glow .5s infinite,gradient-shift 1s infinite,super-spin 1.5s ease-out;background:linear-gradient(135deg,#1b5e20,#2e7d32 25%,#388e3c 50%,#43a047 75%,#1b5e20);background-size:400% 400%;border:3px solid #388e3c;box-shadow:0 0 30px #1b5e20,0 0 60px #1b5e20cc,0 0 90px #1b5e2099,inset 0 0 20px #ffffff4d;color:#fff;transform:scale(1.15) rotate(1turn)}@keyframes super-spin{0%{transform:scale(1) rotate(0deg)}50%{transform:scale(1.2) rotate(180deg)}to{transform:scale(1.15) rotate(1turn)}}.theme-toggle-button.super-active:before{animation:shimmer .5s infinite;background:linear-gradient(45deg,#0000,#fff9,#0000);border-radius:15px;bottom:-5px;content:"";left:-5px;position:absolute;right:-5px;top:-5px;z-index:1}.theme-toggle-button.super-active .theme-toggle-icon{animation:icon-bounce .3s infinite,super-glow 1.5s infinite;filter:drop-shadow(0 0 15px rgba(255,255,255,1)) drop-shadow(0 0 30px rgba(76,175,80,.8));font-size:1.4rem}@keyframes super-glow{0%,to{text-shadow:0 0 10px #fffc}50%{text-shadow:0 0 20px #fff,0 0 30px #1b5e20cc,0 0 40px #1b5e2099}}.theme-toggle-button.super-active .theme-toggle-text{font-size:1.1em;font-weight:900;letter-spacing:2px;text-shadow:0 0 20px #fff,0 0 30px #1b5e20cc}@media (max-width:768px){.theme-toggle-button{font-size:1rem;margin:8px 12px 8px 8px;min-height:48px;padding:.75rem 1.2rem;touch-action:manipulation}}@media (max-width:480px){.theme-toggle-button{font-size:1rem;margin:6px 10px 6px 6px;min-height:44px;padding:.875rem 1rem}}.notification-badge-container{display:inline-block;position:relative;width:100%}.notification-badge{align-items:center;animation:pulse 2s infinite;background:linear-gradient(135deg,#e53e3e,#c53030);border:2px solid #fff;border:2px solid var(--bg-secondary,#fff);border-radius:50%;box-shadow:0 2px 8px #e53e3e66;color:#fff;display:flex;font-size:.75rem;font-weight:700;height:20px;justify-content:center;min-width:20px;padding:0 4px;position:absolute;right:-8px;top:-8px;z-index:10}@media (max-width:768px){.notification-badge{font-size:.7rem;height:18px;min-width:18px;right:-6px;top:-6px}}.about-overlay{align-items:center;background:#00000080;bottom:0;box-sizing:border-box;display:flex;justify-content:center;left:0;padding:1rem;position:fixed;right:0;top:0;z-index:1000}.about-modal{animation:modalSlideIn .3s ease-out;background:#fff;border-radius:16px;box-shadow:0 20px 50px #0000004d;max-width:500px;overflow:hidden;position:relative;width:100%}.about-header{background:linear-gradient(135deg,#4caf50,#2196f3);color:#fff;padding:2rem;text-align:center}.about-title{font-size:2rem;font-weight:700;letter-spacing:-.02em;margin:0 0 .5rem}.about-subtitle{font-size:1rem;font-weight:400;margin:0;opacity:.9}.about-content{padding:2rem}.about-info{grid-gap:1.5rem;display:grid;gap:1.5rem;margin-bottom:2rem}.info-item{background:#f8f9fa;border-left:4px solid #4caf50;border-radius:12px;gap:1rem;padding:1rem}.info-icon,.info-item{align-items:center;display:flex}.info-icon{background:linear-gradient(135deg,#4caf50,#45a049);border-radius:50%;color:#fff;flex-shrink:0;font-size:1.2rem;height:40px;justify-content:center;width:40px}.info-details{flex:1 1}.info-label{color:#2d3748;font-size:.875rem;font-weight:600;letter-spacing:.05em;margin-bottom:.25rem;text-transform:uppercase}.info-value{color:#4a5568;font-size:1rem;margin:0}.about-description{background:linear-gradient(135deg,#f0f9ff,#f0fff4);border:1px solid #e2e8f0;border-radius:12px;margin-bottom:2rem;padding:1.5rem}.about-description p{color:#4a5568;line-height:1.6;margin:0 0 1rem}.about-description p:last-child{margin-bottom:0}.available-languages{background:linear-gradient(135deg,#fff5f5,#f7fafc);border:1px solid #e2e8f0;border-radius:12px;margin-bottom:2rem;padding:1.5rem}.languages-title{color:#2d3748;font-size:1.25rem;font-weight:600;margin:0 0 1.25rem;text-align:center}.languages-grid{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.language-item{align-items:center;background:#fff;border:2px solid #0000;border-radius:10px;box-shadow:0 2px 8px #0000001a;display:flex;flex-direction:column;gap:.5rem;padding:1rem;transition:all .3s ease}.language-item:hover{border-color:#4caf50;box-shadow:0 4px 16px #00000026;transform:translateY(-2px)}.language-flag{font-size:2rem;line-height:1}.language-name{color:#2d3748;font-size:.875rem;text-align:center}.about-actions{display:flex;gap:1rem;justify-content:flex-end}.about-button{background:linear-gradient(135deg,#4caf50,#45a049);border:none;border-radius:12px;box-shadow:0 4px 15px #4caf504d;color:#fff;cursor:pointer;font-size:1rem;font-weight:600;min-width:120px;padding:.875rem 2rem;transition:all .3s ease}.about-button:hover{background:linear-gradient(135deg,#45a049,#2196f3);box-shadow:0 8px 25px #4caf5066;transform:translateY(-2px)}.about-button:active{box-shadow:0 4px 15px #4caf504d;transform:translateY(0)}.close-button{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);right:1rem;top:1rem;transition:all .3s ease}.close-button:hover{transform:scale(1.1)}@media (max-width:768px){.about-overlay{align-items:flex-start;padding:1rem .5rem .5rem}.about-modal{margin:0;max-height:calc(100vh - 2rem);max-width:100%;overflow-y:auto}.about-header{padding:1.25rem 1rem}.about-title{font-size:1.5rem;margin-bottom:.25rem}.about-subtitle{font-size:.875rem}.about-content{padding:1rem}.about-info{gap:.75rem;margin-bottom:1.25rem}.info-item{gap:.75rem;padding:.75rem}.info-icon{font-size:1.1rem;height:36px;width:36px}.info-label{font-size:.75rem;margin-bottom:.125rem}.info-value{font-size:.875rem}.about-description{margin-bottom:1rem;padding:1rem}.about-description p{font-size:.9rem;line-height:1.5;margin-bottom:.75rem}.available-languages{margin-bottom:1rem;padding:1rem}.languages-title{font-size:1.125rem;margin-bottom:1rem}.languages-grid{gap:.75rem;grid-template-columns:repeat(auto-fit,minmax(100px,1fr))}.language-item{gap:.375rem;padding:.75rem}.language-flag{font-size:1.5rem}.language-name{font-size:.8rem}.about-actions{gap:.5rem;justify-content:center}.about-button{font-size:1rem;padding:.875rem 1.5rem;width:100%}.close-button{font-size:1.125rem;height:32px;right:.5rem;top:.5rem;width:32px}}@media (max-width:480px){.about-overlay{padding:.5rem .25rem .25rem}.about-modal{border-radius:8px;max-height:calc(100vh - 1rem)}.about-header{padding:1rem .75rem}.about-title{font-size:1.375rem;margin-bottom:.25rem}.about-subtitle{font-size:.8rem}.about-content{padding:.75rem}.about-info{gap:.5rem;margin-bottom:1rem}.info-item{gap:.5rem;padding:.625rem}.info-icon{font-size:1rem;height:32px;width:32px}.info-label{font-size:.7rem}.info-value{font-size:.8rem}.about-description{margin-bottom:.875rem;padding:.875rem}.about-description p{font-size:.85rem;line-height:1.45;margin-bottom:.625rem}.available-languages{margin-bottom:.875rem;padding:.875rem}.languages-title{font-size:1rem;margin-bottom:.875rem}.languages-grid{gap:.625rem;grid-template-columns:repeat(2,1fr)}.language-item{gap:.25rem;padding:.625rem}.language-flag{font-size:1.375rem}.language-name{font-size:.75rem}.about-button{font-size:.95rem;padding:.75rem 1.25rem}.close-button{font-size:1rem;height:28px;right:.375rem;top:.375rem;width:28px}}.page-container{align-items:flex-start;background:linear-gradient(135deg,#4caf50,#2196f3);display:flex;justify-content:center;min-height:100vh;padding:2rem}.page-content{background:#fff;border-radius:12px;box-shadow:0 10px 30px #0000001a;margin-top:2rem;max-width:800px;padding:2rem;width:100%}.page-content h1{border-bottom:3px solid #2196f3;color:#32a753;font-size:2.5rem;margin-bottom:1.5rem;padding-bottom:.5rem}.page-content h2{color:#2c3e50;font-size:1.5rem;margin-bottom:1rem;margin-top:2rem}.page-content h3{color:#32a753;font-size:1.2rem;margin-bottom:.75rem;margin-top:1.5rem}.page-content p{color:#2c3e50;line-height:1.6;margin-bottom:1rem}.page-content ul{margin-bottom:1rem;padding-left:1.5rem}.page-content li{color:#2c3e50;line-height:1.6;margin-bottom:.5rem}.contact-info{grid-gap:1.5rem;display:grid;gap:1.5rem;margin:2rem 0}.contact-item{background:#f8f9fa;border-left:4px solid #4caf50;border-radius:8px;padding:1.5rem}.contact-item h3{color:#2c3e50;margin-top:0}.contact-item p strong{color:#2196f3;font-size:1.1rem}.footer-container{background:linear-gradient(135deg,#32a753e6,#2196f3);color:#fff;margin-top:auto;padding:1rem 2rem;text-align:center}.footer-links{display:flex;flex-wrap:wrap;gap:2rem;justify-content:center;margin-bottom:1rem}.footer-links a{color:#fff;font-weight:500;text-decoration:none;transition:color .3s ease}.footer-links a:hover{color:#e8f5e8;text-decoration:underline}.footer-text{font-size:.9rem;opacity:.8}.page-actions{border-top:1px solid #e9ecef;margin-top:2rem;padding-top:2rem;text-align:center}.return-button{background:linear-gradient(135deg,#4caf50,#2196f3);border:none;border-radius:8px;box-shadow:0 4px 15px #4caf504d;color:#fff;cursor:pointer;font-size:1rem;font-weight:600;padding:12px 24px;transition:all .3s ease}.return-button:hover{background:linear-gradient(135deg,#45a049,#1976d2);box-shadow:0 6px 20px #4caf5066;transform:translateY(-2px)}.return-button:active{box-shadow:0 2px 10px #4caf504d;transform:translateY(0)}@media (max-width:768px){.page-container{padding:1rem}.page-content{margin-top:1rem;padding:1.5rem}.page-content h1{font-size:2rem}.contact-info,.footer-links{gap:1rem}.contact-item{padding:1rem}}.progress-dashboard-overlay{align-items:center;background-color:#000c;bottom:0;display:flex;justify-content:center;left:0;padding:20px;position:fixed;right:0;top:0;z-index:1000}.progress-dashboard{background:var(--bg-secondary);border-radius:15px;box-shadow:0 10px 30px #0000004d;max-height:90vh;max-width:800px;overflow-y:auto;width:90%}.progress-dashboard-header{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border-bottom:2px solid #f0f0f0;border-radius:15px 15px 0 0;color:#fff;display:flex;justify-content:center;padding:20px 30px;position:relative}.progress-dashboard-header h2{font-size:1.5rem;margin:0}.progress-dashboard .lesson-close-button{align-items:center;background:#e53e3e;border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;font-size:1.25rem;font-weight:600;height:40px;justify-content:center;position:absolute;right:20px;top:50%;transform:translateY(-50%);transition:all .3s ease;width:40px}.progress-dashboard .lesson-close-button:hover{background:#c53030;transform:translateY(-50%) scale(1.05)}.progress-tabs{background-color:var(--bg-primary);border-bottom:2px solid var(--border-light);display:flex}.tab-button{color:var(--text-primary);font-size:16px;padding:15px 20px;transition:all .3s}.tab-button:hover{background-color:var(--card-hover-bg)}.tab-button.active{background-color:var(--bg-secondary);border-bottom-color:#667eea;color:#667eea;font-weight:700}.language-selector{background-color:var(--bg-primary);border-bottom:1px solid var(--border-light);padding:15px 30px}.language-select{background:var(--input-bg);border:2px solid var(--border-color);border-radius:8px;color:var(--text-primary);cursor:pointer;font-size:14px;padding:8px 12px}.progress-content{padding:30px}.progress-tab-content{animation:fadeIn .3s ease-in}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.stats-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin-bottom:30px}.language-stats-grid{grid-gap:15px;display:grid;gap:15px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));margin-bottom:25px}.stat-card{background:var(--card-bg);border:1px solid var(--border-light);border-radius:12px;box-shadow:0 4px 15px var(--shadow-color);padding:25px;position:relative;text-align:center;transition:transform .3s}.stat-card:hover{transform:translateY(-5px)}.stat-number{color:var(--text-primary);font-size:2.5rem;font-weight:700;margin-bottom:8px}.stat-label{color:var(--text-secondary);font-size:.9rem;letter-spacing:1px;text-transform:uppercase}.stat-icon{font-size:1.5rem;position:absolute;right:15px;top:10px}.recent-achievements{margin-bottom:30px}.recent-achievements h3{color:var(--text-primary);margin-bottom:15px}.achievements-list{display:flex;flex-direction:column;gap:10px}.achievement-item{align-items:center;background:var(--card-bg);border-left:4px solid #28a745;border-radius:10px;display:flex;padding:15px}.achievement-icon{font-size:2rem;margin-right:15px}.achievement-info{flex:1 1}.achievement-name{color:var(--text-primary);font-weight:700;margin-bottom:4px}.achievement-description{color:var(--text-secondary);font-size:.9rem}.progress-summary h3{color:var(--text-primary);margin-bottom:20px}.language-progress-overview{display:flex;flex-direction:column;gap:12px}.language-summary{align-items:center;background:var(--card-bg);border:1px solid var(--border-light);border-radius:8px;display:flex;padding:15px;transition:box-shadow .3s}.language-summary:hover{box-shadow:0 2px 10px #0000001a}.language-flag{font-size:1.5rem;margin-right:12px}.language-name{color:var(--text-primary);font-weight:700;margin-right:auto}.language-stats{color:var(--text-secondary);display:flex;font-size:.9rem;gap:15px}.no-data-message{color:var(--text-secondary);padding:40px 20px;text-align:center}.no-data-message h3{color:var(--text-primary);margin-bottom:10px}.language-header h3{color:var(--text-primary);font-size:1.3rem;margin-bottom:20px}.quiz-types-breakdown{margin-top:25px}.quiz-types-breakdown h4{color:var(--text-primary);margin-bottom:15px}.quiz-type-item{background:var(--card-bg);border:1px solid var(--border-light);border-radius:8px;margin-bottom:10px;padding:15px;transition:box-shadow .3s}.quiz-type-item:hover{box-shadow:0 2px 8px #0000001a}.quiz-type-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:8px}.quiz-type-name{color:var(--text-primary);font-weight:700}.quiz-type-best{color:#28a745;font-weight:700}.quiz-type-stats{color:var(--text-secondary);display:flex;font-size:.9rem;gap:15px;margin-bottom:10px}.quiz-type-progress-bar{background-color:#e0e0e0;border-radius:4px;height:8px;overflow:hidden;width:100%}.progress-fill{background:linear-gradient(90deg,#28a745,#20c997);height:100%;transition:width .3s ease}.achievements-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}.achievement-card{background:var(--card-bg);border:2px solid var(--border-light);border-radius:12px;padding:20px;position:relative;text-align:center;transition:all .3s}.achievement-card.earned{background:linear-gradient(135deg,#f8fff8,#e8f5e8);border-color:#28a745;transform:scale(1)}.achievement-card.earned:hover{box-shadow:0 8px 25px #28a7454d;transform:scale(1.05)}.achievement-card.locked{background:var(--bg-primary);opacity:.6}.achievement-icon-large{font-size:3rem;margin-bottom:10px}.achievement-card .achievement-name{color:var(--text-primary);font-weight:700;margin-bottom:8px}.achievement-card .achievement-description{color:var(--text-secondary);font-size:.9rem;line-height:1.4}.earned-badge{background:#28a745;border-radius:12px;color:#fff;font-size:.7rem;font-weight:700;padding:4px 8px;position:absolute;right:-8px;top:-8px;transform:rotate(15deg)}.error-message,.loading-message{color:var(--text-secondary);font-size:1.1rem;padding:40px;text-align:center}.progress-dashboard-ad{border-top:1px solid #f0f0f0;margin:20px 0;padding-top:20px}.achievements-earned{background:linear-gradient(135deg,#fff3cd,#ffeaa7);border:2px solid #f39c12;border-radius:12px;margin:20px 0;padding:20px;text-align:center}.achievements-earned h3{color:#d68910;margin-bottom:15px}.achievement-message{background:linear-gradient(135deg,#d4edda,#c3e6cb);border:2px solid #28a745;border-radius:8px;color:#155724;font-weight:700;margin:15px 0;padding:15px;text-align:center}@media (max-width:768px){.progress-dashboard{margin:10px;width:95%}.progress-dashboard-header{padding:15px 20px}.progress-dashboard-header h2{font-size:1.2rem}.progress-content{padding:20px 15px}.stats-grid{gap:15px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.stat-card{padding:20px 15px}.stat-number{font-size:2rem}.achievements-grid{gap:15px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.language-stats,.quiz-type-stats{flex-direction:column;gap:8px}}.report-issue-overlay{align-items:center;background:#000000b3;bottom:0;box-sizing:border-box;display:flex;justify-content:center;left:0;padding:20px;position:fixed;right:0;top:0;z-index:1000}.report-issue-modal{background:#fff;background:var(--background-color,#fff);border-radius:12px;box-shadow:0 10px 30px #0000004d;box-sizing:border-box;color:#333;color:var(--text-color,#333);max-height:90vh;max-width:500px;overflow-y:auto;padding:30px;position:relative;width:100%}.close-button{background:#0000001a;border:1px solid #ddd;border:1px solid var(--border-color,#ddd);color:#333!important;color:var(--text-primary,#333)!important;font-size:24px;font-weight:700;height:30px;position:absolute;right:15px;top:15px;width:30px}.close-button:hover{background:#0003;border-color:#333;border-color:var(--text-primary,#333);color:#000!important;color:var(--text-primary,#000)!important}.report-issue-header{margin-bottom:30px;text-align:center}.report-issue-title{color:#007bff;color:var(--primary-color,#007bff);font-size:24px;font-weight:600;margin:0 0 10px}.report-issue-subtitle{color:#666;color:var(--text-secondary,#666);font-size:14px;margin:0}.report-issue-form{display:flex;flex-direction:column;gap:20px}.form-group{gap:5px}.form-label{color:#333;color:var(--text-color,#333);font-size:14px}.required{color:#e74c3c}.form-input,.form-textarea{background:#fff;background:var(--input-background,#fff);border:2px solid #e1e5e9;border:2px solid var(--border-color,#e1e5e9);border-radius:6px;color:#333;color:var(--text-color,#333);font-family:inherit;font-size:14px;padding:12px;transition:border-color .2s ease}.form-input:focus,.form-textarea:focus{border-color:#007bff;border-color:var(--primary-color,#007bff);outline:none}.form-textarea{min-height:80px;resize:vertical}.form-help{color:#666;color:var(--text-secondary,#666);font-size:12px;margin-top:2px}.issue-id-display{background:#f8f9fa;background:var(--border-color,#f8f9fa);border:2px solid #e1e5e9;border:2px solid var(--border-color,#e1e5e9);border-radius:6px;font-family:Courier New,monospace;padding:12px}.issue-id-display code{background:none;color:#333;color:var(--text-color,#333);font-family:inherit;font-size:14px}.error-message{align-items:center;background:#ffeaea;border:1px solid #f5c6c6;border-radius:6px;color:#d63031;display:flex;font-size:14px;gap:8px;padding:12px}.error-icon{font-size:16px}.success-message{padding:40px 20px;text-align:center}.success-icon{font-size:48px;margin-bottom:15px}.success-message h3{color:#27ae60;color:var(--success-color,#27ae60);font-size:20px;margin:0 0 10px}.success-message p{color:#666;color:var(--text-secondary,#666);font-size:14px;margin:0}.form-actions{gap:12px;margin-top:10px}.primary-button,.secondary-button{border:none;border-radius:6px;cursor:pointer;font-size:14px;font-weight:500;min-width:100px;padding:12px 24px;transition:all .2s ease}.primary-button{background:#007bff;background:var(--primary-color,#007bff);color:#fff}.primary-button:hover:not(:disabled){background:#0056b3;background:var(--primary-hover,#0056b3)}.primary-button:disabled{background:#ccc;background:var(--disabled-color,#ccc);cursor:not-allowed}.secondary-button{background:#0000;border:2px solid #e1e5e9;border:2px solid var(--border-color,#e1e5e9);color:#666;color:var(--text-color,#666)}.secondary-button:hover:not(:disabled){background:#f8f9fa;background:var(--border-color,#f8f9fa);border-color:#999;border-color:var(--text-color,#999)}.secondary-button:disabled{cursor:not-allowed;opacity:.5}.report-issue-footer{border-top:1px solid #e1e5e9;border-top:1px solid var(--border-color,#e1e5e9);margin-top:20px;padding-top:20px;text-align:center}.report-issue-footer small{color:#666;color:var(--text-secondary,#666);font-size:12px}@media (prefers-color-scheme:dark){.report-issue-modal{--background-color:#2c2c2c;--text-color:#fff;--text-secondary:#b3b3b3;--border-color:#404040;--input-background:#3a3a3a;--primary-color:#0d6efd;--primary-hover:#0b5ed7;--success-color:#198754;--disabled-color:#6c757d}.close-button:hover{background:var(--border-color)}.error-message{background:#2d1b1b;border-color:#5c2626;color:#f8d7da}.issue-id-display{background:var(--border-color)}}@media (max-width:768px){.report-issue-overlay{padding:10px}.report-issue-modal{max-height:95vh;padding:20px}.report-issue-title{font-size:20px}.form-actions{flex-direction:column}.primary-button,.secondary-button{width:100%}}.gender-guesser{background:#fff;border-radius:12px;box-shadow:0 4px 20px #0000001a;margin:0 auto;max-width:600px;padding:2rem}.gender-guesser.loading{color:#666;font-size:1.2rem;padding:3rem;text-align:center}.question-content{display:flex;flex-direction:column;gap:1.5rem}.question-header{text-align:center}.question-text{line-height:1.4;margin-bottom:.5rem}.progress{background:#f7fafc;border-radius:20px;color:#718096;display:inline-block;font-size:.9rem;padding:.5rem 1rem}.word-display{align-items:center;background:linear-gradient(135deg,#f7fafc,#edf2f7);border:2px solid #e2e8f0;border-radius:12px;display:flex;flex-direction:column;gap:1rem;padding:1.5rem;transition:all .3s ease}.word-display:hover{border-color:#cbd5e0;box-shadow:0 8px 25px #0000001a}.image-placeholder{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px;box-shadow:0 4px 15px #667eea4d;cursor:pointer;display:flex;height:200px;justify-content:center;transition:all .3s ease;width:200px}.image-placeholder:hover{box-shadow:0 8px 25px #667eea66;transform:scale(1.05)}.image-container{cursor:pointer}.image-container:hover{box-shadow:0 8px 25px #0000004d;transform:scale(1.05)}.image-container.loading{align-items:center;background:linear-gradient(135deg,#f7fafc,#edf2f7);border:2px solid #e2e8f0;display:flex;justify-content:center}.image-container.business-speaker{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border:2px solid #667eea;cursor:pointer;display:flex;justify-content:center}.speaker-emoji-display{align-items:center;display:flex;flex-direction:column;gap:1rem;height:100%;justify-content:center;position:relative;width:100%}.speaker-emoji{animation:pulse 2s infinite;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3));font-size:4rem}.loading-placeholder{color:#718096;font-size:.9rem;text-align:center}.audio-play-button{background:#667eeaf2;bottom:-14px;box-shadow:0 3px 12px #0006;font-size:.8rem;height:28px;right:-8px;width:28px}.audio-play-button:hover:not(:disabled){background:#667eea;box-shadow:0 4px 15px #667eea66}.audio-play-button:disabled{opacity:.7}.loading-spinner,.play-icon{display:block}.placeholder-content{color:#fff;text-align:center}.word-text{display:block;font-size:2rem;font-weight:700;margin-bottom:.5rem;text-shadow:0 2px 4px #0000004d}.click-hint{font-size:.9rem;opacity:.9}.word-label{color:#2d3748;font-size:1.3rem;line-height:1.5;text-align:center}.word-label,.word-label strong{font-weight:600}.audio-hint{animation:pulse 2s infinite;font-size:1.2rem}.options-container{max-height:250px}.option-button{word-wrap:break-word;background:linear-gradient(135deg,#f7fafc,#edf2f7);border:2px solid #e2e8f0;border-radius:12px;color:#2d3748;cursor:pointer;font-size:1.1rem;font-weight:600;-webkit-hyphens:auto;hyphens:auto;line-height:1.5;overflow-wrap:break-word;padding:1rem 1.5rem;position:relative;text-align:left;transition:all .3s ease;white-space:normal}.option-button:hover:not(.disabled){background:linear-gradient(135deg,#667eea,#764ba2);border-color:#667eea;box-shadow:0 8px 25px #667eea4d;color:#fff;transform:translateY(-2px)}.option-button:active:not(.disabled){transform:translateY(0)}.option-button.disabled{background:#f1f5f9;border-color:#cbd5e0;cursor:not-allowed;opacity:.6}.feedback-container{align-items:center;display:flex;flex-direction:column;gap:1rem}.feedback{animation:slideInUp .3s ease;border-radius:12px;font-size:1.1rem;font-weight:600;padding:1rem 1.5rem;text-align:center}.feedback.correct{background:linear-gradient(135deg,#f0fff4,#c6f6d5);border:2px solid #48bb78;color:#22543d}.feedback.incorrect{background:linear-gradient(135deg,#fed7d7,#feb2b2);border:2px solid #e53e3e;color:#742a2a}@keyframes slideInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.score-display{background:#f7fafc;border:1px solid #e2e8f0;border-radius:20px;color:#4a5568;font-size:1.1rem;font-weight:600;padding:.75rem 1.5rem;text-align:center}.final-score{padding:3rem 2rem;text-align:center}.final-score h2{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;background-clip:text;color:#2d3748;font-size:2rem;margin-bottom:1rem}.final-score p{color:#4a5568;font-size:1.2rem;margin:.5rem 0}.finish-button{background:linear-gradient(135deg,#48bb78,#38a169);border:none;border-radius:12px;box-shadow:0 4px 15px #48bb784d;color:#fff;cursor:pointer;font-size:1.1rem;font-weight:600;margin-top:2rem;padding:1rem 2rem;transition:all .3s ease}.finish-button:hover{background:linear-gradient(135deg,#38a169,#2f855a);box-shadow:0 8px 25px #48bb7866;transform:translateY(-2px)}.next-question-button{animation:slideInUp .3s ease;background:#2d9557;border:none;border-radius:12px;box-shadow:0 4px 15px #2d95574d;color:#fff;cursor:pointer;font-size:1rem;font-weight:600;margin-top:1rem;padding:.875rem 1.75rem;transition:all .3s ease}.next-question-button:hover{background:#268a4a;box-shadow:0 8px 25px #2d955766;transform:translateY(-2px)}.next-question-button:active{transform:translateY(0)}.sentence-display{align-items:center;background:linear-gradient(135deg,#f7fafc,#edf2f7);border:2px solid #e2e8f0;border-radius:12px;cursor:pointer;display:flex;flex-direction:column;gap:1rem;padding:2rem;transition:all .3s ease}.sentence-display:hover{border-color:#cbd5e0;box-shadow:0 8px 25px #0000001a;transform:translateY(-2px)}.sentence-content{text-align:center}.sentence-text{word-wrap:break-word;color:#2d3748;font-size:1.8rem;font-weight:600;-webkit-hyphens:auto;hyphens:auto;line-height:1.4;margin-bottom:1rem;overflow-wrap:break-word;white-space:normal}.blank-space{-webkit-text-fill-color:#0000;animation:pulse 2s infinite;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;background-clip:text;border-bottom:3px solid #667eea;color:#667eea;font-weight:700;padding:0 .5rem}.audio-hint-text{align-items:center;color:#718096;display:flex;font-size:.9rem;gap:.5rem;justify-content:center}@media (max-width:768px){.gender-guesser{border-radius:8px;margin:0;padding:1.5rem}.question-text{font-size:1.2rem;line-height:1.4}.word-text{font-size:1.75rem}.sentence-text{font-size:1.5rem;line-height:1.4}.image-container,.image-placeholder{height:180px;width:180px}.speaker-emoji{font-size:3rem}.audio-play-button{bottom:-13px;font-size:.75rem;height:26px;right:-13px;width:26px}.option-button{font-size:1.1rem;padding:1rem 1.25rem}.sentence-display{padding:1.75rem}.word-label{font-size:1.2rem}.progress{font-size:1rem;padding:.75rem 1.25rem}}@media (max-width:480px){.gender-guesser{padding:1rem}.question-text{font-size:1.1rem}.word-text{font-size:1.5rem}.sentence-text{font-size:1.25rem}.image-container,.image-placeholder{height:150px;width:150px}.speaker-emoji{font-size:2.5rem}.audio-play-button{bottom:-12px;font-size:.7rem;height:24px;right:-12px;width:24px}.option-button{font-size:1rem;padding:.875rem 1rem}.sentence-display{padding:1.25rem}.word-label{font-size:1.1rem}.final-score h2{font-size:1.5rem}.final-score p{font-size:1.1rem}.finish-button{font-size:1rem;padding:.875rem 1.5rem}}.image-container.clean-audio .audio-play-button{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;background:none!important;border:none;border-radius:0;bottom:8px;box-shadow:none!important;cursor:pointer;font-size:1.2rem;height:auto;margin:0;padding:0;position:absolute;right:8px;transition:transform .2s ease;width:auto;z-index:10}.image-container.clean-audio .audio-play-button:hover:not(:disabled){background:none!important;box-shadow:none!important;transform:scale(1.1)}.image-container.clean-audio .audio-play-button:disabled{cursor:not-allowed;opacity:.6;transform:none}.image-container.clean-audio .play-icon{display:block;filter:none;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Color Emoji,Apple Color Emoji,Segoe UI Emoji,sans-serif}.arabic-roots .image-container .audio-play-button,.gender-guesser .image-container .audio-play-button,.idiom-quiz .image-container .audio-play-button,.reverse-vocab .image-container .audio-play-button{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;background:none!important;border:none;border-radius:0;bottom:8px;box-shadow:none!important;cursor:pointer;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Color Emoji,Apple Color Emoji,Segoe UI Emoji,sans-serif;font-size:1.2rem;height:auto;margin:0;padding:0;position:absolute;right:4px;transition:transform .2s ease;width:auto;z-index:10}.arabic-roots .image-container .audio-play-button:hover:not(:disabled),.gender-guesser .image-container .audio-play-button:hover:not(:disabled),.idiom-quiz .image-container .audio-play-button:hover:not(:disabled),.reverse-vocab .image-container .audio-play-button:hover:not(:disabled){background:none!important;box-shadow:none!important;transform:scale(1.1)}.arabic-roots .image-container .audio-play-button:disabled,.gender-guesser .image-container .audio-play-button:disabled,.idiom-quiz .image-container .audio-play-button:disabled,.reverse-vocab .image-container .audio-play-button:disabled{cursor:not-allowed;opacity:.6;transform:none}.arabic-roots .image-container .play-icon,.gender-guesser .image-container .play-icon,.idiom-quiz .image-container .play-icon,.reverse-vocab .image-container .play-icon{display:block;filter:none;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Color Emoji,Apple Color Emoji,Segoe UI Emoji,sans-serif}.block-selector-container{background-color:var(--bg-secondary);border-radius:12px;box-shadow:0 4px 20px var(--shadow-color);margin:0 auto;max-width:1000px;padding:2rem;width:100%}.block-selector-header{margin-bottom:2rem;text-align:center}.block-selector-header h2{color:var(--text-primary);font-size:1.75rem;font-weight:600;margin-bottom:1rem}.block-selector-header p{color:var(--text-secondary);font-size:1rem;line-height:1.6;margin:0 auto 1.5rem;max-width:600px}.back-button{background:linear-gradient(135deg,#6b7280,#4b5563);font-size:.9rem}.back-button:hover{box-shadow:0 4px 15px #6b72804d;transform:translateY(-2px)}.blocks-grid{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin-bottom:2rem}.block-card{background:var(--card-bg);border:2px solid var(--border-light);border-radius:12px;cursor:pointer;overflow:hidden;padding:1.5rem;position:relative;transition:all .3s ease}.block-card:hover{border-color:var(--border-color);box-shadow:0 6px 20px var(--shadow-hover);transform:translateY(-3px)}.block-card:before{background:linear-gradient(135deg,#667eea,#764ba2);content:"";height:4px;left:0;position:absolute;right:0;top:0}.block-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:1rem}.block-title{color:var(--text-primary);font-size:1.25rem;font-weight:600;margin:0}.difficulty-badge{border-radius:20px;color:#fff;font-size:.8rem;font-weight:600;letter-spacing:.5px;padding:.25rem .75rem;text-transform:uppercase}.block-info{margin-bottom:1.5rem}.question-count{color:var(--text-secondary);font-size:.9rem;font-weight:500;margin-bottom:.75rem}.block-preview{background-color:var(--bg-primary);border-left:3px solid #667eea;border-radius:6px;color:var(--text-secondary);font-size:.85rem;line-height:1.4;padding:.75rem}.block-preview strong{color:var(--text-primary)}.block-footer{text-align:center}.start-block-button{background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:.95rem;font-weight:600;padding:.75rem 1.5rem;transition:all .3s ease;width:100%}.start-block-button:hover{box-shadow:0 4px 15px #667eea66;transform:translateY(-1px)}.random-block-section{border-top:2px solid var(--border-light);padding-top:1.5rem;text-align:center}.random-block-button{background:linear-gradient(135deg,#f59e0b,#d97706);border:none;border-radius:12px;box-shadow:0 4px 15px #f59e0b4d;color:#fff;cursor:pointer;font-size:1.1rem;font-weight:600;padding:1rem 2rem;transition:all .3s ease}.random-block-button:hover{box-shadow:0 6px 20px #f59e0b66;transform:translateY(-2px)}.loading-message{color:var(--text-secondary);font-size:1.1rem;padding:3rem}@media (max-width:768px){.block-selector-container{margin:1rem;padding:1.5rem}.block-selector-header h2{font-size:1.5rem}.block-selector-header p{font-size:.9rem}.blocks-grid{gap:1rem;grid-template-columns:1fr}.block-card{padding:1.25rem}.block-title{font-size:1.125rem}.difficulty-badge{font-size:.75rem;padding:.2rem .6rem}.block-preview{font-size:.8rem;padding:.6rem}.start-block-button{font-size:.9rem;padding:.875rem 1.25rem}.random-block-button{font-size:1rem;padding:.875rem 1.5rem}}@media (max-width:480px){.block-selector-container{margin:.5rem;padding:1rem}.block-selector-header h2{font-size:1.25rem}.block-selector-header p{font-size:.85rem}.block-card{padding:1rem}.block-header{align-items:flex-start;flex-direction:column;gap:.5rem}.difficulty-badge{align-self:flex-end}.block-title{font-size:1rem}.start-block-button{font-size:.85rem;padding:.75rem 1rem}.random-block-button{font-size:.9rem;padding:.75rem 1.25rem}}.lesson-dialog-overlay{align-items:center;background-color:#00000080;bottom:0;box-sizing:border-box;display:flex;justify-content:center;left:0;padding:20px;position:fixed;right:0;top:0;z-index:1000}.lesson-dialog{background-color:var(--bg-secondary);border-radius:12px;box-shadow:0 4px 20px var(--shadow-color);box-sizing:border-box;max-height:90vh;max-width:700px;overflow:auto;padding:2rem;width:100%}.lesson-dialog-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:1.5rem;position:relative}.lesson-dialog-title{color:var(--text-primary);flex:1 1;font-size:1.5rem;font-weight:600;margin:0;text-align:center}.lesson-close-button{align-items:center;background:#e53e3e;border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;font-size:1.25rem;font-weight:600;height:40px;justify-content:center;position:absolute;right:0;top:50%;transform:translateY(-50%);transition:all .3s ease;width:40px}.lesson-close-button:hover{background:#c53030;transform:translateY(-50%) scale(1.05)}.lesson-tab-container{border-bottom:2px solid var(--border-light);display:flex;gap:.25rem;margin-bottom:1.5rem;overflow-x:auto;padding-bottom:4px}.lesson-tab-container::-webkit-scrollbar{height:6px}.lesson-tab-container::-webkit-scrollbar-track{background:var(--bg-primary);border-radius:3px}.lesson-tab-container::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:3px}.lesson-tab-container::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}.lesson-tab-button{background-color:var(--bg-primary);border:none;border-bottom:3px solid #0000;border-radius:8px 8px 0 0;color:#fff;cursor:pointer;font-weight:600;min-width:fit-content;padding:.75rem 1.5rem;transition:all .3s ease;white-space:nowrap}.lesson-tab-button:hover{background-color:var(--card-hover-bg);color:var(--text-primary)}.lesson-tab-button.active,.lesson-tab-container .lesson-tab-button.active{background-color:#1e90ff!important;background-image:none!important;background:#1e90ff!important;border-bottom-color:#1e90ff!important;color:#fff!important}.lesson-tab-content{padding:2rem 0;text-align:center}.lesson-tab-content h3{color:var(--text-primary);font-size:1.5rem;font-weight:600;margin-bottom:1rem}.lesson-tab-content p{color:var(--text-secondary);font-size:1rem;line-height:1.6;margin-bottom:1.5rem;margin-left:auto;margin-right:auto;max-width:600px}.lesson-action-button{background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:1rem;font-weight:600;margin:.25rem;min-width:120px;padding:.75rem 1.5rem;transition:all .3s ease}.lesson-action-button:hover{box-shadow:0 4px 15px #667eea4d;transform:translateY(-2px)}.lesson-action-button:disabled{cursor:not-allowed;opacity:.6;transform:none}.lesson-action-button.primary{background:linear-gradient(135deg,#32a753,#2e9549)}.lesson-action-button.primary:hover{box-shadow:0 4px 15px #32a7534d}.lesson-action-button.secondary{background:#718096}.lesson-action-button.secondary:hover{box-shadow:0 4px 15px #7180964d}.lesson-action-button.success{background:#48bb78}.lesson-action-button.success:hover{box-shadow:0 4px 15px #48bb784d}.lesson-selection{display:flex;flex-direction:column;gap:1rem;margin-bottom:2rem}.lesson-buttons-container{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1.5rem}.lesson-cards-grid{grid-gap:2rem;display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin-top:2rem}.lesson-card{background:var(--card-bg);border:2px solid var(--border-light);border-radius:12px;padding:1.5rem;transition:all .3s ease}.lesson-card:hover{border-color:var(--border-color);box-shadow:0 4px 15px var(--shadow-hover);transform:translateY(-2px)}.lesson-card h4{color:var(--text-primary);font-size:1.25rem;font-weight:600;margin-bottom:1rem}.lesson-card p{color:var(--text-secondary);font-size:.95rem;line-height:1.6;margin-bottom:1.5rem;text-align:left}.lesson-stats{gap:1rem;justify-content:center;margin-bottom:1.5rem}.lesson-stats span{background-color:var(--card-bg);border:1px solid var(--border-light);border-radius:20px;color:var(--text-secondary);font-size:.8rem;padding:.4rem .8rem}.lesson-quiz-container{padding:1rem 0}.lesson-question-progress{background-color:var(--bg-primary);border-radius:6px;color:var(--text-secondary);font-size:.9rem;margin-bottom:1rem;padding:.5rem;text-align:center}.lesson-question-container{margin-bottom:1.5rem}.lesson-question-text{color:var(--text-primary);font-size:1.2rem;font-weight:600;margin-bottom:1rem;text-align:center}.lesson-options-container{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1.5rem;max-height:300px;overflow-y:auto;padding-right:8px}.lesson-options-container::-webkit-scrollbar{width:8px}.lesson-options-container::-webkit-scrollbar-track{background:var(--bg-primary);border-radius:4px}.lesson-options-container::-webkit-scrollbar-thumb{background:linear-gradient(135deg,var(--border-color),var(--text-secondary));border-radius:4px}.lesson-options-container::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,var(--text-secondary),var(--text-muted))}.lesson-option-label{align-items:center;background-color:var(--card-bg);border:2px solid var(--border-light);border-radius:8px;color:var(--text-primary);cursor:pointer;display:flex;min-height:48px;padding:.75rem;transition:all .3s ease}.lesson-option-label:hover:not(.disabled){background-color:var(--card-hover-bg);border-color:var(--border-color)}.lesson-option-label.disabled{cursor:not-allowed;opacity:.7}.lesson-option-radio{accent-color:#667eea;margin-right:.75rem}.lesson-option-text{color:var(--text-primary);font-weight:400;transition:color .3s ease}.lesson-option-text.correct-answer{color:#22c55e;font-weight:700}.dark-mode .lesson-option-text.correct-answer{color:#4ade80}.lesson-result-container{border:2px solid;border-radius:8px;margin-bottom:1rem;padding:1rem}.lesson-result-container.correct{background-color:#f0fff4;border-color:#48bb78;color:#22543d}.lesson-result-container.incorrect{background-color:#fed7d7;border-color:#e53e3e;color:#742a2a}.dark-mode .lesson-result-container.correct{background-color:#22c55e26;border-color:#22c55e;color:#4ade80}.dark-mode .lesson-result-container.incorrect{background-color:#ef444426;border-color:#ef4444;color:#fca5a5}.lesson-result-status{font-weight:700;margin-bottom:.5rem}.lesson-quiz-controls{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between}.lesson-quiz-controls .lesson-action-button{flex:1 1;min-width:120px}.lesson-results-container{background-color:var(--card-bg);border-radius:12px;margin:1rem 0;padding:2rem;text-align:center}.lesson-results-container h3{color:var(--text-primary);font-size:1.5rem;margin-bottom:1rem}.lesson-results-container p{color:var(--text-secondary);font-size:1.1rem;margin:.5rem 0}.lesson-audio-button{align-items:center;background:linear-gradient(135deg,#48bb78,#38a169);border:none;border-radius:6px;color:#fff;cursor:pointer;display:flex;font-size:.9rem;font-weight:500;gap:.5rem;justify-content:center;margin-bottom:1rem;padding:.5rem 1rem;transition:all .3s ease}.lesson-audio-button:disabled{cursor:not-allowed;opacity:.6}.lesson-audio-button:hover:not(:disabled){box-shadow:0 2px 10px #48bb784d;transform:translateY(-1px)}.lesson-image-container{align-items:center;display:flex;flex-direction:column;gap:1rem;margin-bottom:1.5rem}.lesson-image-loading{align-items:center;background:linear-gradient(135deg,var(--bg-primary) 0,var(--card-bg) 100%);border:2px solid var(--border-light);border-radius:12px;color:var(--text-secondary);display:flex;font-size:.9rem;height:200px;justify-content:center;width:200px}.lesson-image-wrapper{border-radius:12px;box-shadow:0 4px 15px #0003;height:200px;overflow:hidden;position:relative;transition:all .3s ease;width:200px}.lesson-image{border-radius:12px;height:100%;object-fit:cover;width:100%}.lesson-audio-play-button{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#667eeae6;border:2px solid #fff;border-radius:50%;bottom:8px;box-shadow:0 2px 10px #0000004d;color:#fff;cursor:pointer;display:flex;font-size:1rem;height:40px;justify-content:center;position:absolute;right:8px;transition:all .3s ease;width:40px}.lesson-audio-play-button:hover:not(:disabled){transform:scale(1.1)}.lesson-audio-play-button:disabled{cursor:not-allowed;opacity:.6}.lesson-loading-spinner{animation:spin 1s linear infinite;display:inline-block}@media (max-width:768px){.lesson-dialog-overlay{align-items:flex-start;padding:20px 10px 10px}.lesson-dialog{border-radius:8px;max-height:95vh;padding:1.5rem}.lesson-dialog-title{font-size:1.25rem}.lesson-close-button{font-size:1rem;height:35px;width:35px}.lesson-tab-button{flex:none;font-size:.85rem;line-height:1.2;min-width:fit-content;padding:.6rem .8rem;text-align:center;white-space:nowrap}.lesson-tab-content h3{font-size:1.25rem}.lesson-tab-content p{font-size:.9rem}.lesson-stats{flex-direction:column;gap:.5rem}.lesson-stats span{font-size:.8rem}.lesson-cards-grid{gap:1.5rem;grid-template-columns:1fr;margin-top:1.5rem}.lesson-card{padding:1.25rem}.lesson-card h4{font-size:1.125rem}.lesson-card p{font-size:.9rem}.lesson-question-text{font-size:1.1rem}.lesson-image-loading,.lesson-image-wrapper{height:150px;width:150px}.lesson-audio-play-button{font-size:.9rem;height:35px;width:35px}.lesson-option-label{font-size:1rem;min-height:48px;padding:1rem}.lesson-quiz-controls{flex-direction:column}.lesson-quiz-controls .lesson-action-button{font-size:1rem;min-height:44px;padding:1rem;width:100%}.lesson-results-container{padding:1.5rem}.lesson-action-button{font-size:1rem;min-height:44px;padding:1rem}}@media (max-width:480px){.lesson-dialog-overlay{padding:5px}.lesson-dialog{padding:1rem}.lesson-dialog-title{font-size:1.125rem}.lesson-close-button{font-size:.9rem;height:30px;width:30px}.lesson-tab-button{font-size:.8rem;line-height:1.2;padding:.4rem .6rem;text-align:center;white-space:nowrap}.lesson-tab-content h3{font-size:1.125rem}.lesson-tab-content p{font-size:.85rem}.lesson-stats span{font-size:.75rem;padding:.4rem .8rem}.lesson-cards-grid{gap:1rem;margin-top:1rem}.lesson-card{padding:1rem}.lesson-card h4{font-size:1rem}.lesson-card p{font-size:.85rem}.lesson-question-text{font-size:1rem}.lesson-image-loading,.lesson-image-wrapper{height:120px;width:120px}.lesson-audio-play-button{font-size:.8rem;height:30px;width:30px}.lesson-option-label{font-size:.95rem;padding:.875rem}.lesson-action-button{font-size:.95rem;padding:.875rem 1rem}.lesson-results-container{padding:1rem}.lesson-results-container h3{font-size:1.25rem}.lesson-results-container p{font-size:1rem}}.quiz-container{background:#fff;border-radius:12px;box-shadow:0 4px 20px #0000001a;margin:0 auto;max-width:800px;padding:2rem}.quiz-header{margin-bottom:2rem;text-align:center}.quiz-title{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;background-clip:text;color:#2d3748;font-size:2rem;font-weight:700;margin-bottom:1rem}.quiz-score{color:#4a5568;font-size:1.1rem;margin-bottom:.5rem}.quiz-start-container{padding:3rem 2rem;text-align:center}.quiz-start-button{background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:12px;box-shadow:0 4px 15px #667eea4d;color:#fff;cursor:pointer;font-size:1.2rem;font-weight:600;margin:0 1rem 2rem 0;padding:1.25rem 3rem;transition:all .3s ease}.quiz-start-button:hover{background:linear-gradient(135deg,#5a67d8,#6b46c1);box-shadow:0 8px 25px #667eea66;transform:translateY(-2px)}.quiz-results{background:linear-gradient(135deg,#f7fafc,#edf2f7);border:1px solid #e2e8f0;border-radius:12px;margin-top:2rem;padding:2rem;text-align:center}.quiz-results h3{color:#2d3748;font-size:1.5rem;margin-bottom:1rem}.quiz-results p{color:#4a5568;font-size:1.1rem;margin:.5rem 0}.question-container{margin-bottom:2rem}.question-progress{background:#f7fafc;border-radius:8px;color:#718096;font-size:.9rem;margin-bottom:1rem;padding:.5rem 1rem;text-align:center}.question-text{color:#2d3748;font-size:1.3rem;font-weight:600;line-height:1.6;margin-bottom:2rem}.question-image{border-radius:8px;box-shadow:0 4px 12px #0000001a;height:auto;margin-bottom:2rem;max-width:100%}.options-container{gap:1rem;margin-bottom:2rem;max-height:300px;overflow-y:auto;padding-right:8px}.options-container::-webkit-scrollbar{width:8px}.options-container::-webkit-scrollbar-track{background:#f7fafc;border-radius:4px}.options-container::-webkit-scrollbar-thumb{background:linear-gradient(135deg,#cbd5e0,#a0aec0);border-radius:4px}.options-container::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,#a0aec0,#718096)}.option-label{background:#f7fafc;border:2px solid #e2e8f0;border-radius:12px;font-size:1.1rem;padding:1rem 1.5rem}.option-label:hover{background:#edf2f7;border-color:#cbd5e0;transform:translateX(4px)}.option-label.selected{background:linear-gradient(135deg,#e6fffa,#b2f5ea);border-color:#38b2ac;color:#234e52}.option-label.correct{background:linear-gradient(135deg,#f0fff4,#c6f6d5);border-color:#48bb78;color:#22543d;font-weight:600}.option-label.disabled{cursor:not-allowed;opacity:.7}.option-radio{accent-color:#667eea;height:20px;margin-right:1rem;width:20px}.result-container{border-radius:12px;font-size:1.1rem;margin-bottom:2rem;padding:1.5rem}.result-container.correct{background:linear-gradient(135deg,#f0fff4,#c6f6d5);border:2px solid #48bb78;color:#22543d}.result-container.incorrect{background:linear-gradient(135deg,#fed7d7,#feb2b2);border:2px solid #e53e3e;color:#742a2a}.result-status{align-items:center;display:flex;font-weight:700;gap:.5rem;margin-bottom:.5rem}.result-explanation{line-height:1.6;margin-top:1rem}.quiz-controls{align-items:center;display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;max-height:200px;overflow-y:auto;padding-right:4px}.quiz-controls::-webkit-scrollbar{width:6px}.quiz-controls::-webkit-scrollbar-track{background:#f7fafc;border-radius:3px}.quiz-controls::-webkit-scrollbar-thumb{background:#cbd5e0;border-radius:3px}.quiz-controls::-webkit-scrollbar-thumb:hover{background:#a0aec0}.quiz-button{background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:12px;box-shadow:0 4px 15px #667eea4d;color:#fff;cursor:pointer;font-size:1rem;font-weight:600;padding:.875rem 2rem;transition:all .3s ease}.quiz-button:hover{background:linear-gradient(135deg,#5a67d8,#6b46c1);box-shadow:0 8px 25px #667eea66;transform:translateY(-2px)}.quiz-button:disabled{background:#a0aec0;box-shadow:none;cursor:not-allowed;transform:none}.quiz-button.reset{background:linear-gradient(135deg,#718096,#4a5568);box-shadow:0 4px 15px #7180964d}.quiz-button.reset:hover{background:linear-gradient(135deg,#4a5568,#2d3748);box-shadow:0 8px 25px #71809666}.quiz-button.next{background:linear-gradient(135deg,#48bb78,#38a169);box-shadow:0 4px 15px #48bb784d}.quiz-button.next:hover{background:linear-gradient(135deg,#38a169,#2f855a);box-shadow:0 8px 25px #48bb7866}@media (max-width:768px){.quiz-container{border-radius:8px;margin:0;padding:1.5rem}.quiz-title{font-size:1.5rem}.question-text{font-size:1.2rem;line-height:1.5}.quiz-controls{align-items:stretch;flex-direction:column;gap:.75rem}.quiz-button{margin:0;padding:1rem 1.5rem;width:100%}.option-label,.quiz-button{font-size:1.1rem;min-height:48px}.option-label{align-items:center;padding:1rem 1.25rem}.question-image{height:auto;max-height:250px;max-width:100%;object-fit:contain}.quiz-start-button{font-size:1.1rem;padding:1.25rem 2rem;width:100%}}@media (max-width:480px){.quiz-container{padding:1rem}.quiz-title{font-size:1.25rem}.question-text{font-size:1.1rem}.option-label,.quiz-button{font-size:1rem;min-height:44px;padding:.875rem 1rem}.question-image{max-height:200px}.quiz-start-button{font-size:1rem;padding:1rem 1.5rem}.result-container{font-size:1rem;padding:1rem}.quiz-results{padding:1.5rem}}.count-description{color:#666;font-size:.9rem;font-style:italic;margin-bottom:1rem;text-align:center}.chinese-quiz-container{padding:1rem 0}.chinese-question-progress{background-color:#f7fafc;border-radius:6px;color:#718096;font-size:.9rem;margin-bottom:1rem;padding:.5rem;text-align:center}.chinese-question-container{margin-bottom:1.5rem}.chinese-question-text{color:#2d3748;font-size:1.2rem;font-weight:600;margin-bottom:1rem;text-align:center}.chinese-options-container{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1.5rem;max-height:300px;overflow-y:auto;padding-right:8px}.chinese-options-container::-webkit-scrollbar{width:8px}.chinese-options-container::-webkit-scrollbar-track{background:#f7fafc;border-radius:4px}.chinese-options-container::-webkit-scrollbar-thumb{background:linear-gradient(135deg,#cbd5e0,#a0aec0);border-radius:4px}.chinese-options-container::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,#a0aec0,#718096)}.chinese-option-label{align-items:center;background-color:#f7fafc;border:2px solid #e2e8f0;border-radius:8px;cursor:pointer;display:flex;min-height:48px;padding:.75rem;transition:all .3s ease}.chinese-option-label:hover:not(.disabled){background-color:#edf2f7;border-color:#cbd5e0}.chinese-option-label.disabled{cursor:not-allowed;opacity:.7}.chinese-option-radio{accent-color:#667eea;margin-right:.75rem}.chinese-result-container{border:2px solid;border-radius:8px;margin-bottom:1rem;padding:1rem}.chinese-result-container.correct{background-color:#f0fff4;border-color:#48bb78;color:#22543d}.chinese-result-container.incorrect{background-color:#fed7d7;border-color:#e53e3e;color:#742a2a}.chinese-result-status{font-weight:700;margin-bottom:.5rem}.chinese-quiz-controls{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between}.chinese-quiz-controls .chinese-action-button{flex:1 1;min-width:120px}.chinese-action-button{background:linear-gradient(135deg,#32a753,#2e9549);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:1rem;font-weight:600;margin:.5rem 0;padding:.75rem 1.5rem;transition:all .3s ease}.chinese-action-button:hover{box-shadow:0 4px 15px #32a7534d;transform:translateY(-2px)}.chinese-action-button.reset{background:#718096}.chinese-action-button.next{background:#48bb78}.chinese-results-container{background-color:#f7fafc;border-radius:12px;margin:1rem 0;padding:2rem;text-align:center}.chinese-results-container h3{color:#2d3748;font-size:1.5rem;margin-bottom:1rem}.chinese-results-container p{color:#4a5568;font-size:1.1rem;margin:.5rem 0}.image-display-container{align-items:center;display:flex;flex-direction:column;gap:1rem;margin-bottom:1.5rem}.image-loading-container{align-items:center;background:linear-gradient(135deg,#f7fafc,#edf2f7);border:2px solid #e2e8f0;color:#718096;display:flex;font-size:.9rem;justify-content:center}.image-container,.image-loading-container{border-radius:12px;height:200px;width:200px}.image-container{box-shadow:0 4px 15px #0003;overflow:hidden;position:relative;transition:all .3s ease}.question-image{border-radius:12px;height:100%;object-fit:cover;width:100%}.audio-play-button{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#667eeae6;border:2px solid #fff;border-radius:50%;bottom:8px;box-shadow:0 2px 10px #0000004d;font-size:1rem;height:40px;position:absolute;right:8px;width:40px}.audio-play-button:hover:not(:disabled){transform:scale(1.1)}.audio-button{align-items:center;background:linear-gradient(135deg,#48bb78,#38a169);border-radius:6px;display:flex;font-size:.9rem;font-weight:500;gap:.5rem;justify-content:center;margin-bottom:1rem;padding:.5rem 1rem;transition:all .3s ease}.audio-button:disabled{cursor:not-allowed;opacity:.6}.loading-spinner{display:inline-block}@media (max-width:768px){.chinese-question-text{font-size:1.1rem}.image-container,.image-loading-container{height:150px;width:150px}.audio-play-button{font-size:.9rem;height:35px;width:35px}.chinese-option-label{font-size:1rem;min-height:48px;padding:1rem}.chinese-quiz-controls{flex-direction:column}.chinese-quiz-controls .chinese-action-button{font-size:1rem;min-height:44px;padding:1rem;width:100%}.chinese-results-container{padding:1.5rem}}.character-quiz-setup{margin:0 auto;max-width:800px}.quiz-type-selection{margin-bottom:2rem}.quiz-type-selection h4{color:#333;font-size:1.1rem;margin-bottom:1rem}.quiz-type-buttons{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:1fr 1fr;margin-bottom:1.5rem}.quiz-type-button{align-items:center;background:#fff;border:2px solid #e2e8f0;border-radius:12px;cursor:pointer;display:flex;flex-direction:column;justify-content:center;min-height:120px;padding:1.5rem;text-align:center;transition:all .3s ease}.quiz-type-button:hover{background-color:#f8f9fa;border-color:#007bff;box-shadow:0 4px 15px #007bff33;transform:translateY(-2px)}.quiz-type-button strong{color:#333;display:block;font-size:1.1rem;font-weight:600;margin-bottom:8px}.quiz-type-button p{color:#666;font-size:.9rem;line-height:1.4;margin:0}.selected-quiz-info{margin-bottom:2rem;text-align:center}.selected-quiz-info h4{color:#666;font-size:1rem;font-weight:500;margin-bottom:.5rem}.selected-quiz-display{background:#e7f1ff;border-radius:8px;color:#007bff;display:inline-block;font-size:1.2rem;font-weight:600;padding:.5rem 1rem}.character-count-selection{margin-bottom:2rem}.character-count-selection h4{font-size:1.1rem;margin-bottom:1rem;transition:color .3s ease}.count-options{flex-wrap:wrap;gap:1rem}.count-option,.count-options{display:flex;justify-content:center}.count-option{align-items:center;background:#fff;border:2px solid #e2e8f0;border-radius:8px;color:#333;cursor:pointer;font-size:1.2rem;font-weight:600;height:60px;transition:all .3s ease;width:60px}.count-option:hover{background-color:#f8f9fa;border-color:#007bff}.count-option.selected{background-color:#007bff;border-color:#007bff;color:#fff}.count-option-large{align-items:center;background:#fff;border:2px solid #e2e8f0;border-radius:12px;color:#333;cursor:pointer;display:flex;font-size:1.5rem;font-weight:600;height:80px;justify-content:center;margin:.5rem;transition:all .3s ease;width:80px}.count-option-large:hover{background-color:#007bff;border-color:#007bff;box-shadow:0 4px 15px #007bff4d;color:#fff;transform:translateY(-2px)}.back-button{background:#6c757d;font-size:1rem;margin-top:1rem;padding:.75rem 1.5rem}.back-button:hover{background:#5a6268;transform:translateY(-1px)}.character-drill-container{margin:0 auto;max-width:600px}.character-progress{align-items:center;background:#f8f9fa;border-radius:8px;display:flex;font-weight:500;justify-content:space-between;padding:1rem}.character-progress,.character-question-container{margin-bottom:1.5rem}.character-question-header{margin-bottom:2rem;text-align:center}.character-question-header h3{color:#333;font-size:1.2rem;margin-bottom:1rem}.character-meaning-display{background:#f8f9fa;border-radius:8px;color:#007bff;font-size:1.5rem;font-weight:600;margin:1rem 0;padding:1rem}.large-character-display{align-items:center;background:linear-gradient(135deg,#f7fafc,#edf2f7);border:2px solid #e2e8f0;border-radius:12px;box-shadow:0 4px 15px #0000001a;color:#2d3748;display:flex;font-family:SimSun,宋体,serif;font-size:4rem;font-weight:400;justify-content:center;margin:1rem 0;min-height:200px;padding:2rem;position:relative;text-align:center;text-shadow:1px 1px 2px #0000001a;transition:all .3s ease}.large-character-display:hover{border-color:#cbd5e0;box-shadow:0 8px 25px #00000026;transform:translateY(-2px)}.large-character-display.clickable{cursor:pointer}.large-character-display.clickable:hover{background:linear-gradient(135deg,#edf2f7,#e2e8f0);border-color:#667eea}.character-audio-icon{bottom:12px;font-size:1.5rem;opacity:.7;pointer-events:none;position:absolute;right:12px;transition:all .3s ease}.large-character-display.clickable:hover .character-audio-icon{opacity:1;transform:scale(1.1)}.vocab-feedback{animation:slideInUp .3s ease;border-radius:8px;font-size:.9rem;font-weight:500;margin-top:.5rem;padding:.5rem 1rem;text-align:center}.vocab-feedback.success{background:linear-gradient(135deg,#f0fff4,#c6f6d5);border:1px solid #48bb78;color:#22543d}.vocab-feedback.error{background:linear-gradient(135deg,#fed7d7,#feb2b2);border:1px solid #e53e3e;color:#742a2a}.add-to-vocab-button:disabled{cursor:not-allowed;opacity:.8}.character-audio-button{background:linear-gradient(135deg,#007bff,#0056b3);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:1rem;font-weight:500;margin:1rem;padding:.75rem 1.5rem;transition:all .3s ease}.character-audio-button:hover{box-shadow:0 4px 15px #007bff4d;transform:translateY(-2px)}.character-audio-button.large{font-size:1.2rem;padding:1.5rem 2rem}.character-options-container{grid-gap:1rem;display:grid;gap:1rem;margin-bottom:1.5rem}.character-option-button{align-items:center;background:#fff;border:2px solid #e2e8f0;border-radius:8px;color:#333;cursor:pointer;display:flex;font-size:1rem;justify-content:center;min-height:48px;padding:1rem;transition:all .3s ease}.character-option-button:hover:not(:disabled){background-color:#f8f9fa;border-color:#007bff;transform:translateY(-1px)}.character-option-button.selected{background-color:#e7f1ff;border-color:#007bff;color:#007bff;font-weight:600}.character-option-button:disabled{cursor:not-allowed;opacity:.7}.character-option-button.character-option-text{font-family:SimSun,宋体,serif;font-size:1.5rem}.character-option-label{align-items:center;background:#fff;border:2px solid #e2e8f0;border-radius:8px;cursor:pointer;display:flex;padding:1rem;transition:all .3s ease}.character-option-label:hover{background-color:#f8f9fa;border-color:#007bff}.character-option-label input[type=radio]:checked+.character-option-text{color:#007bff;font-weight:600}.character-option-label:has(input[type=radio]:checked){background-color:#e7f1ff;border-color:#007bff}.character-option-text{font-family:SimSun,宋体,serif;font-size:1.5rem;margin-left:.5rem}.character-result{border-radius:8px;margin-bottom:1.5rem;padding:1.5rem;text-align:center}.character-result.correct{background-color:#d4edda;border:2px solid #28a745;color:#155724}.character-result.incorrect{background-color:#f8d7da;border:2px solid #dc3545;color:#721c24}.result-status{font-size:1.2rem;font-weight:600;margin-bottom:1rem}.character-info{align-items:center;display:flex;flex-direction:column;gap:1rem}.character-display-large{color:#333;font-family:SimSun,宋体,serif;font-size:3rem;margin:.5rem 0}.character-details{text-align:center}.character-details div{font-size:1rem;margin:.5rem 0}.add-to-vocab-button{background:linear-gradient(135deg,#28a745,#20c997);border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.9rem;font-weight:500;margin-top:.5rem;padding:.5rem 1rem;transition:all .3s ease}.add-to-vocab-button:hover{box-shadow:0 2px 10px #28a7454d;transform:translateY(-1px)}.character-quiz-controls{display:flex;gap:1rem;justify-content:center}.character-next-button,.character-submit-button{background:linear-gradient(135deg,#007bff,#0056b3);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:1rem;font-weight:600;min-width:150px;padding:.75rem 1.5rem;transition:all .3s ease}.character-next-button:hover,.character-submit-button:hover{box-shadow:0 4px 15px #007bff4d;transform:translateY(-2px)}.character-submit-button:disabled{background:#6c757d;box-shadow:none;cursor:not-allowed;transform:none}@media (max-width:768px){.quiz-type-buttons{gap:.75rem;grid-template-columns:1fr}.quiz-type-button{min-height:100px;padding:1.25rem}.count-options{gap:.5rem}.count-option{font-size:1rem;height:50px;width:50px}.count-option-large{font-size:1.3rem;height:70px;width:70px}.large-character-display{font-size:3rem;min-height:180px;padding:1.5rem}.character-display-large{font-size:2.5rem}.character-option-text{font-size:1.2rem}.character-quiz-controls{flex-direction:column}.character-next-button,.character-submit-button{min-width:auto;width:100%}}@media (max-width:480px){.chinese-question-text{font-size:1rem}.image-container,.image-loading-container{height:120px;width:120px}.audio-play-button{font-size:.8rem;height:30px;width:30px}.chinese-option-label{font-size:.95rem;padding:.875rem}.chinese-action-button{font-size:.95rem;padding:.875rem 1rem}.chinese-results-container{padding:1rem}.chinese-results-container h3{font-size:1.25rem}.chinese-results-container p{font-size:1rem}.large-character-display{font-size:2.5rem;min-height:150px;padding:1.25rem}.character-display-large{font-size:2rem}.word-display{font-size:2.5rem}.word-display-large{font-size:2rem}.word-meaning-display{font-size:1.4rem}.word-option-text{font-size:1.1rem}}.word-display{font-size:3rem}.word-display,.word-display-large{font-family:SimSun,Source Han Sans,Microsoft YaHei,PingFang SC,serif;line-height:1.2}.word-display-large{font-size:2.5rem}.word-meaning-display{background:linear-gradient(135deg,#f0fff4,#c6f6d5);border:2px solid #9ae6b4;border-radius:12px;color:#2d3748;font-size:1.8rem;font-weight:600;margin:1rem 0;padding:1rem;text-align:center}.word-option-text{font-family:SimSun,Source Han Sans,Microsoft YaHei,PingFang SC,serif;font-size:1.3rem}.vocab-action-container{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center;margin-top:1rem}.word-audio-button{background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:.9rem;font-weight:600;min-height:44px;padding:.5rem 1rem;transition:all .3s ease}.word-audio-button:hover{box-shadow:0 4px 12px #667eea4d;transform:translateY(-2px)}.russian-dialog{align-items:center;background-color:#000000b3;display:flex;height:100%;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:1000}.russian-dialog-content{background:#fff;border-radius:10px;max-height:80vh;max-width:600px;overflow-y:auto;padding:20px;position:relative;width:90%}.russian-dialog-header{align-items:center;border-bottom:1px solid #eee;display:flex;justify-content:space-between;margin-bottom:20px;padding-bottom:10px}.russian-dialog-header h2{color:#333;margin:0}.russian-dialog .close-button{align-items:center;background:#e53e3e!important;border:none;border-radius:50%;color:#fff!important;cursor:pointer;display:flex;font-size:20px;font-weight:700;height:35px;justify-content:center;padding:0;transition:all .3s ease;width:35px}.russian-dialog .close-button:hover{background:#c53030!important;transform:scale(1.05)}.tab-navigation{display:flex;gap:10px;margin-bottom:20px}.tab-navigation button{background:#fff;border:1px solid #ddd;border-radius:5px;color:#333;cursor:pointer;padding:10px 20px;transition:all .3s ease}.tab-navigation button:hover{background-color:#f5f5f5}.tab-navigation button.active{background-color:#007bff;border-color:#007bff;color:#fff}.tab-content{min-height:200px}.cases-section,.gender-guesser-section,.verbs-of-motion-section{text-align:center}.cases-section h3,.gender-guesser-section h3,.verbs-of-motion-section h3{color:#333;margin-bottom:15px}.cases-section p,.gender-guesser-section p,.verbs-of-motion-section p{color:#666;line-height:1.6;margin-bottom:20px}.lesson-card,.lesson-selection{margin:25px 0;text-align:left}.lesson-card{background-color:#f8f9fa;border:2px solid #e9ecef;border-radius:8px;padding:20px}.lesson-card h4{color:#333;font-size:18px;margin-bottom:15px}.lesson-selection h4{color:#333;font-size:16px;margin-bottom:15px}.lesson-option{margin-bottom:15px}.lesson-option label{align-items:flex-start;border:2px solid #e9ecef;border-radius:8px;cursor:pointer;display:flex;padding:15px;transition:all .3s ease}.lesson-option label:hover{background-color:#f8f9fa;border-color:#007bff}.lesson-option input[type=radio]{margin-right:12px;margin-top:2px}.lesson-option input[type=radio]:checked+.lesson-details{color:#007bff}.lesson-option label:has(input[type=radio]:checked){background-color:#e7f1ff;border-color:#007bff}.lesson-details{flex:1 1}.lesson-details strong{display:block;font-size:16px;margin-bottom:5px}.lesson-details p{color:#666;font-size:14px;line-height:1.4;margin:0}.lesson-stats{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}.lesson-stats span{background-color:#f8f9fa;border-radius:4px;color:#495057;font-size:12px;font-weight:500;padding:4px 8px}.start-quiz-button{background-color:#28a745;border:none;border-radius:5px;color:#fff;cursor:pointer;font-size:16px;padding:12px 24px;transition:background-color .3s ease}.start-quiz-button:hover{background-color:#218838}.question-container{padding:20px 0}.question-container h3{color:#333;margin-bottom:15px}.question-text{color:#333;font-size:18px;font-weight:500;margin-bottom:20px}.audio-button{background-color:#17a2b8;border:none;border-radius:5px;color:#fff;cursor:pointer;margin-bottom:20px;padding:8px 16px;transition:background-color .3s ease}.audio-button:hover{background-color:#138496}.options-container{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}.option-label{border:1px solid #ddd;border-radius:5px;cursor:pointer;padding:10px;transition:all .3s ease}.option-label:hover{background-color:#f8f9fa;border-color:#007bff}.option-label input[type=radio]{margin-right:10px}.submit-button{background-color:#007bff;border-radius:5px;font-size:16px;padding:12px 24px;transition:background-color .3s ease}.submit-button:hover{background-color:#0056b3}.submit-button:disabled{background-color:#6c757d}.result{border-radius:5px;margin-top:20px;padding:15px;text-align:center}.result.correct{background-color:#d4edda;border:1px solid #c3e6cb;color:#155724}.result.incorrect{background-color:#f8d7da;border:1px solid #f5c6cb;color:#721c24}.result-text{font-weight:700;margin-bottom:10px}.explanation{line-height:1.5;margin-bottom:15px}.next-button{background-color:#28a745;border:none;border-radius:5px;color:#fff;cursor:pointer;padding:10px 20px;transition:background-color .3s ease}.next-button:hover{background-color:#218838}.error-message{background-color:#f8d7da;border:1px solid #f5c6cb;border-radius:5px;margin-top:10px;padding:10px;text-align:center}.russian-dialog-ad{margin-top:20px;text-align:center}@media (max-width:768px){.russian-dialog-content{margin:10px;padding:15px;width:95%}.tab-navigation{flex-direction:column}.tab-navigation button{width:100%}}.business-languages-grid{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:1.5rem 0}.business-language-card{background:linear-gradient(135deg,#f8f9ff,#e8f0ff);border:2px solid #e0e8ff;border-radius:12px;overflow:hidden;padding:1.5rem;position:relative;transition:all .3s ease}.business-language-card:hover{border-color:#6366f1;box-shadow:0 8px 25px #6366f126;transform:translateY(-4px)}.business-language-header{align-items:center;display:flex;gap:.75rem;margin-bottom:1rem}.business-language-flag{filter:drop-shadow(2px 2px 4px rgba(0,0,0,.1));font-size:2rem}.business-language-card h4{color:#1e293b;font-size:1.25rem;font-weight:600;margin:0}.business-language-card p{color:#64748b;font-size:.95rem;line-height:1.5;margin-bottom:1.25rem}.industries-grid{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));margin:1.5rem 0}.industry-card{background:linear-gradient(135deg,#fff,#f8fafc);border:2px solid #e2e8f0;border-radius:16px;overflow:hidden;padding:1.75rem;position:relative;transition:all .3s ease}.industry-card:before{background:linear-gradient(90deg,#6366f1,#8b5cf6,#06b6d4);content:"";height:4px;left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity .3s ease}.industry-card:hover{border-color:#6366f1;box-shadow:0 12px 35px #0000001a;transform:translateY(-6px)}.industry-card:hover:before{opacity:1}.industry-header{align-items:center;display:flex;gap:1rem;margin-bottom:1rem;position:relative}.industry-icon{animation:float 3s ease-in-out infinite;filter:drop-shadow(2px 2px 6px rgba(0,0,0,.1));font-size:2.5rem}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}.industry-header h4{color:#1e293b;flex:1 1;font-size:1.3rem;font-weight:600;margin:0}.industry-audio-btn{align-items:center;background:linear-gradient(135deg,#6366f1,#8b5cf6);border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;font-size:1rem;height:36px;justify-content:center;transition:all .3s ease;width:36px}.industry-audio-btn:hover:not(:disabled){box-shadow:0 4px 15px #6366f166;transform:scale(1.1)}.industry-audio-btn:disabled{animation:pulse 1s infinite;cursor:not-allowed;opacity:.6}.industry-description{color:#64748b;font-size:.95rem;line-height:1.6;margin-bottom:1.25rem}.industry-stats{display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:1.5rem}.stat{align-items:center;background:#6366f11a;border-radius:20px;color:#6366f1;display:flex;font-size:.85rem;font-weight:500;gap:.25rem;padding:.4rem .8rem}.lesson-action-button.primary{background:linear-gradient(135deg,#6366f1,#8b5cf6);border:none;border-radius:10px;color:#fff;cursor:pointer;font-size:.95rem;font-weight:600;overflow:hidden;padding:.85rem 1.5rem;position:relative;text-align:center;transition:all .3s ease;width:100%}.lesson-action-button.primary:before{background:linear-gradient(90deg,#0000,#fff3,#0000);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .5s;width:100%}.lesson-action-button.primary:hover:not(:disabled){box-shadow:0 8px 25px #6366f166;transform:translateY(-2px)}.lesson-action-button.primary:hover:not(:disabled):before{left:100%}.lesson-action-button.primary:disabled{background:#94a3b8;box-shadow:none;cursor:not-allowed;transform:none}.lesson-action-button.primary:disabled:before{display:none}@media (prefers-color-scheme:dark){.business-language-card{background:linear-gradient(135deg,#1e293b,#334155);border-color:#475569}.business-language-card h4,.industry-header h4{color:#f1f5f9}.business-language-card p,.industry-description{color:#cbd5e1}.industry-card{background:linear-gradient(135deg,#1e293b,#334155);border-color:#475569}.stat{background:#6366f133;color:#a5b4fc}}.industry-lang-header{align-items:center;display:flex;gap:1rem;margin-bottom:1.5rem}.back-button{align-items:center;background:linear-gradient(135deg,#64748b,#475569);border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;font-weight:500;gap:.5rem;padding:.6rem 1.2rem;transition:all .3s ease}.back-button:hover{box-shadow:0 4px 15px #64748b4d;transform:translateX(-2px)}.industry-languages-grid{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:1.5rem 0}.industry-language-card{background:linear-gradient(135deg,#fff,#f8fafc);border:2px solid #e2e8f0;border-radius:12px;overflow:hidden;padding:1.5rem;position:relative;transition:all .3s ease}.industry-language-card:before{background:linear-gradient(90deg,#6366f1,#8b5cf6);content:"";height:3px;left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity .3s ease}.industry-language-card:hover{border-color:#6366f1;box-shadow:0 8px 25px #0000001a;transform:translateY(-4px)}.industry-language-card:hover:before{opacity:1}.industry-language-header{align-items:center;display:flex;gap:1rem;margin-bottom:1rem}.industry-language-flag{filter:drop-shadow(2px 2px 4px rgba(0,0,0,.1));font-size:2.2rem}.industry-language-header h4{color:#1e293b;flex:1 1;font-size:1.2rem;font-weight:600;margin:0}@media (max-width:768px){.business-languages-grid,.industries-grid,.industry-languages-grid{gap:1rem;grid-template-columns:1fr;margin:1rem 0}.business-language-card,.industry-card,.industry-language-card{padding:1.25rem}.industry-header,.industry-language-header{gap:.75rem}.industry-icon,.industry-language-flag{font-size:2rem}.industry-stats{gap:.5rem}.stat{font-size:.8rem;padding:.3rem .6rem}.industry-lang-header{align-items:flex-start;flex-direction:column;gap:.75rem}.back-button{font-size:.9rem;padding:.5rem 1rem}}.friends-overlay{align-items:center;background:#000000b3;bottom:0;display:flex;justify-content:center;left:0;padding:1rem;position:fixed;right:0;top:0;z-index:1000}.friends-dialog{background:var(--bg-primary);border:1px solid var(--border-light);border-radius:16px;box-shadow:0 20px 40px #0000004d;display:flex;flex-direction:column;max-height:80vh;max-width:600px;width:100%}.friends-header{align-items:center;background:var(--bg-secondary);border-bottom:2px solid var(--border-light);border-radius:16px 16px 0 0;display:flex;justify-content:space-between;padding:1.5rem}.friends-title{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#4caf50,#2196f3);-webkit-background-clip:text;background-clip:text;color:var(--text-primary);font-size:1.8rem;font-weight:700;margin:0}.close-button{border-radius:8px;font-size:2rem;padding:0;transition:all .2s ease}.close-button:hover{background:var(--bg-tertiary)}.friends-tabs{background:var(--bg-secondary);border-bottom:1px solid var(--border-light);display:flex}.tab-button{background:none;border:none;border-bottom:3px solid #0000;color:var(--text-secondary);cursor:pointer;flex:1 1;font-size:.95rem;font-weight:600;padding:1rem;transition:all .3s ease}.tab-button:hover{background:var(--bg-tertiary);color:var(--text-primary)}.tab-button.active{background:var(--bg-primary);border-bottom-color:#4caf50;color:#4caf50}.message-container{border-bottom:1px solid var(--border-light);padding:1rem}.error-message,.success-message{align-items:center;border-radius:8px;display:flex;font-weight:500;justify-content:space-between;padding:.75rem 1rem}.error-message{background:#e53e3e1a;border:1px solid #e53e3e33;color:#e53e3e}.success-message{background:#4caf501a;border:1px solid #4caf5033}.clear-message-button{align-items:center;background:none;border:none;border-radius:4px;color:inherit;cursor:pointer;display:flex;font-size:1.2rem;height:20px;justify-content:center;padding:0;transition:background .2s ease;width:20px}.clear-message-button:hover{background:#0000001a}.friends-content{flex:1 1;overflow-y:auto;padding:1.5rem}.empty-message,.loading-message{color:var(--text-secondary);font-style:italic;padding:2rem;text-align:center}.friends-list,.requests-list{display:flex;flex-direction:column;gap:.75rem}.friend-item,.request-item,.search-result-item{align-items:center;background:var(--bg-secondary);border:1px solid var(--border-light);border-radius:12px;display:flex;justify-content:space-between;padding:1rem;transition:all .2s ease}.friend-item:hover,.request-item:hover,.search-result-item:hover{background:var(--bg-tertiary);box-shadow:0 4px 8px #0000001a;transform:translateY(-1px)}.friend-username,.request-username,.result-username{color:var(--text-primary);font-size:1.1rem;font-weight:600}.clickable-friend{border-radius:6px;cursor:pointer;margin:-.25rem -.5rem;padding:.25rem .5rem;transition:all .2s ease}.clickable-friend:hover{background:var(--bg-tertiary);color:#4caf50;transform:scale(1.02)}.friend-actions{align-items:center;display:flex;gap:.75rem}.friend-status{color:#4caf50;font-size:.9rem;font-weight:500}.remove-friend-button,.view-progress-button{align-items:center;background:none;border:none;border-radius:4px;color:var(--text-secondary);cursor:pointer;display:flex;font-size:.9rem;height:24px;justify-content:center;padding:.25rem;transition:all .2s ease;width:24px}.view-progress-button:hover{background:#4caf501a;color:#4caf50}.remove-friend-button:hover{background:#e53e3e1a;color:#e53e3e}.confirm-overlay{background:#000c;position:fixed;z-index:1100}.confirm-dialog{background:var(--bg-primary);border:1px solid var(--border-light);box-shadow:0 20px 40px #0000004d;padding:1.5rem}.confirm-dialog h3{color:var(--text-primary);font-size:1.2rem;margin:0 0 1rem}.confirm-dialog p{color:var(--text-secondary);line-height:1.5;margin:0 0 1.5rem}.confirm-actions{display:flex;gap:.75rem;justify-content:flex-end}.confirm-cancel-button,.confirm-remove-button{border:none;border-radius:8px;cursor:pointer;font-size:.9rem;font-weight:600;padding:.75rem 1.5rem;transition:all .2s ease}.confirm-cancel-button{background:var(--bg-secondary);border:1px solid var(--border-light);color:var(--text-primary)}.confirm-cancel-button:hover{background:var(--bg-tertiary)}.confirm-remove-button{background:linear-gradient(135deg,#e53e3e,#c53030);color:#fff}.confirm-remove-button:hover{background:linear-gradient(135deg,#c53030,#9c2626);transform:translateY(-1px)}.request-actions{display:flex;gap:.5rem}.accept-button,.reject-button,.send-request-button{border:none;border-radius:8px;cursor:pointer;font-size:.9rem;font-weight:600;padding:.5rem 1rem;transition:all .2s ease}.accept-button,.send-request-button{background:linear-gradient(135deg,#4caf50,#2e9549);color:#fff}.accept-button:hover,.send-request-button:hover{background:linear-gradient(135deg,#2e9549,#2196f3);transform:translateY(-1px)}.reject-button{background:linear-gradient(135deg,#e53e3e,#c53030);color:#fff}.reject-button:hover{background:linear-gradient(135deg,#c53030,#9c2626);transform:translateY(-1px)}.search-section{display:flex;flex-direction:column;gap:1.5rem}.search-input-container{display:flex;gap:.75rem}.search-input{background:var(--bg-secondary);border:2px solid var(--border-light);border-radius:12px;color:var(--text-primary);flex:1 1;padding:.75rem 1rem;transition:all .2s ease}.search-input:focus{background:var(--bg-primary);border-color:#4caf50}.search-input::placeholder{color:var(--text-secondary)}.search-button{background:linear-gradient(135deg,#4caf50,#2e9549);border:none;border-radius:12px;color:#fff;cursor:pointer;font-size:1rem;font-weight:600;padding:.75rem 1.5rem;transition:all .2s ease}.search-button:hover:not(:disabled){background:linear-gradient(135deg,#2e9549,#2196f3);transform:translateY(-1px)}.search-button:disabled{cursor:not-allowed;opacity:.6;transform:none}.search-results{display:flex;flex-direction:column;gap:.75rem}@media (max-width:768px){.friends-overlay{padding:.5rem}.friends-dialog{max-height:90vh}.friends-header{padding:1rem}.friends-title{font-size:1.5rem}.tab-button{font-size:.85rem;padding:.75rem .5rem}.friends-content{padding:1rem}.friend-item,.request-item,.search-result-item{padding:.75rem}.friend-username,.request-username,.result-username{font-size:1rem}.search-input-container{flex-direction:column;gap:.5rem}.search-button,.search-input{padding:.75rem}.request-actions{flex-direction:column;gap:.25rem}.accept-button,.reject-button,.send-request-button{font-size:.85rem;padding:.5rem .75rem}}@media (max-width:480px){.friends-overlay{padding:.25rem}.friends-header{padding:.75rem}.friends-title{font-size:1.3rem}.tab-button{font-size:.8rem;padding:.6rem .3rem}.friends-content{padding:.75rem}.friend-item,.request-item,.search-result-item{align-items:flex-start;flex-direction:column;gap:.5rem;padding:.6rem}.request-actions{flex-direction:row;justify-content:space-between;width:100%}.accept-button,.reject-button,.send-request-button{flex:1 1;text-align:center}}.tab-header{align-items:center;border-bottom:1px solid var(--border-light);display:flex;justify-content:space-between;margin-bottom:1rem;padding-bottom:.5rem}.tab-header h3{color:var(--text-primary);font-size:1.2rem;font-weight:600;margin:0}.clear-search-button,.refresh-button{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;font-size:.9rem;font-weight:500;gap:.25rem;padding:.5rem 1rem;transition:all .2s ease}.clear-search-button:hover:not(:disabled),.refresh-button:hover:not(:disabled){background:linear-gradient(135deg,#5a67d8,#6b46c1);box-shadow:0 4px 12px #667eea4d;transform:translateY(-1px)}.clear-search-button:disabled,.refresh-button:disabled{box-shadow:none;cursor:not-allowed;opacity:.6;transform:none}.clear-search-button{background:linear-gradient(135deg,#f56565,#e53e3e)}.clear-search-button:hover:not(:disabled){background:linear-gradient(135deg,#e53e3e,#c53030);box-shadow:0 4px 12px #f565654d}.invite-section{display:flex;flex-direction:column;gap:1.5rem}.invite-description{background:var(--bg-secondary);border:1px solid var(--border-light);border-radius:12px;padding:1rem}.invite-description p{color:var(--text-secondary);font-size:.95rem;line-height:1.5;margin:0}.invite-input-container{display:flex;gap:.75rem}.invite-input{background:var(--bg-secondary);border:2px solid var(--border-light);border-radius:12px;color:var(--text-primary);flex:1 1;font-size:1rem;padding:.75rem 1rem;transition:all .2s ease}.invite-input:focus{background:var(--bg-primary);border-color:#4caf50;outline:none}.invite-input::placeholder{color:var(--text-secondary)}.invite-button{background:linear-gradient(135deg,#4caf50,#2e9549);border:none;border-radius:12px;color:#fff;cursor:pointer;font-size:1rem;font-weight:600;padding:.75rem 1.5rem;transition:all .2s ease;white-space:nowrap}.invite-button:hover:not(:disabled){background:linear-gradient(135deg,#2e9549,#2196f3);box-shadow:0 4px 12px #4caf504d;transform:translateY(-1px)}.invite-button:disabled{box-shadow:none;cursor:not-allowed;opacity:.6;transform:none}@media (max-width:768px){.invite-input-container{flex-direction:column;gap:.5rem}.invite-button,.invite-input{padding:.75rem}}@media (max-width:480px){.invite-description{padding:.75rem}.invite-description p{font-size:.9rem}}.leaderboard-overlay{align-items:center;background:#000000b3;bottom:0;display:flex;justify-content:center;left:0;padding:1rem;position:fixed;right:0;top:0;z-index:1000}.leaderboard-dialog{background:var(--bg-secondary);border:1px solid var(--border-light);border-radius:16px;box-shadow:0 20px 40px #0000004d;display:flex;flex-direction:column;max-height:85vh;max-width:700px;overflow:hidden;width:100%}.leaderboard-header{align-items:center;background:var(--card-bg);border-bottom:1px solid var(--border-light);display:flex;justify-content:space-between;padding:1.5rem}.leaderboard-header h2{color:var(--text-primary);font-size:1.5rem;font-weight:600;margin:0}.close-button{background:none;color:var(--text-secondary);font-size:1.5rem;height:40px;padding:.5rem;transition:background-color .2s ease;width:40px}.close-button:hover{background:var(--card-hover-bg);color:var(--text-primary)}.leaderboard-filters{background:var(--bg-primary);border-bottom:1px solid var(--border-light);padding:1rem 1.5rem}.filter-row{grid-gap:1rem;align-items:end;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.filter-group{display:flex;flex-direction:column;gap:.25rem}.filter-group label{color:var(--text-secondary);font-size:.875rem;font-weight:500}.filter-select{background:var(--input-bg);border:1px solid var(--border-color);border-radius:8px;color:var(--text-primary);cursor:pointer;font-size:.875rem;padding:.5rem;transition:border-color .2s ease}.filter-select:focus{border-color:#4caf50;box-shadow:0 0 0 2px #4caf501a;outline:none}.filter-select:disabled{background:var(--card-hover-bg);color:var(--text-muted);cursor:not-allowed}.leaderboard-content{flex:1 1;overflow:auto;padding:1rem}.empty-state,.error-state,.loading-state{align-items:center;color:var(--text-secondary);display:flex;flex-direction:column;justify-content:center;padding:3rem 1rem;text-align:center}.loading-spinner{border:3px solid var(--border-light);border-radius:50%;border-top:3px solid #4caf50;height:40px;margin-bottom:1rem;width:40px}.error-message{color:#dc3545}.retry-button{background:#4caf50;font-size:.875rem;padding:.5rem 1rem;transition:background-color .2s ease}.retry-button:hover{background:#45a049}.leaderboard-info{background:var(--card-bg);border-left:4px solid #4caf50;border-radius:8px;margin-bottom:1rem;padding:.75rem}.sort-info{color:var(--text-secondary);font-size:.875rem;margin:0}.leaderboard-list{display:flex;flex-direction:column;gap:.75rem}.leaderboard-item{align-items:center;background:var(--card-bg);border:1px solid var(--border-light);border-radius:12px;display:flex;gap:1rem;padding:1rem;transition:transform .2s ease,box-shadow .2s ease}.leaderboard-item:hover{box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.leaderboard-item.top-three{background:linear-gradient(135deg,var(--card-bg) 0,var(--card-hover-bg) 100%);border-color:#4caf50;box-shadow:0 2px 8px #4caf501a}.rank-section{flex-shrink:0;text-align:center;width:50px}.rank{font-size:1.25rem;font-weight:600}.player-info{display:flex;flex:1 1;flex-direction:column;gap:.25rem}.player-name{color:var(--text-primary);font-size:1.125rem;font-weight:600}.player-stats{display:flex;flex-wrap:wrap;gap:1rem;margin:.25rem 0}.primary-stat{color:#4caf50;font-size:.875rem;font-weight:600}.secondary-stat{color:var(--text-secondary);font-size:.8rem}.player-meta{color:var(--text-muted);display:flex;flex-wrap:wrap;font-size:.75rem;gap:1rem}.achievements,.last-played{align-items:center;display:flex;gap:.25rem}@media (max-width:768px){.leaderboard-overlay{padding:.5rem}.leaderboard-dialog{max-height:95vh}.filter-row{gap:.75rem;grid-template-columns:1fr}.leaderboard-item{align-items:flex-start;flex-direction:column;gap:.75rem}.rank-section{text-align:left;width:auto}.player-meta,.player-stats{flex-direction:column;gap:.25rem}}@media (max-width:480px){.leaderboard-header{padding:1rem}.leaderboard-header h2{font-size:1.25rem}.leaderboard-filters{padding:.75rem 1rem}.leaderboard-content,.leaderboard-item{padding:.75rem}}.vocab-overlay{align-items:center;background:#000000b3;bottom:0;display:flex;justify-content:center;left:0;padding:1rem;position:fixed;right:0;top:0;z-index:1000}.vocab-dialog{background:#fff;background:var(--bg-primary);border:1px solid #e5e7eb;border:1px solid var(--border-light);border-radius:16px;box-shadow:0 20px 40px #0000004d;display:flex;flex-direction:column;max-height:90vh;max-width:800px;width:100%}.vocab-header{align-items:center;border-bottom:1px solid #e5e7eb;border-bottom:1px solid var(--border-light);display:flex;justify-content:space-between;padding:1.5rem}.vocab-header h2{color:#1f2937;color:var(--text-primary);font-size:1.5rem;margin:0}.vocab-dialog .close-button{background:#0000001a!important;border:none!important;border-radius:8px!important;color:#333!important;cursor:pointer!important;font-size:1.5rem!important;font-weight:700!important;padding:.5rem!important;transition:all .2s!important}.vocab-dialog .close-button:hover{background:#0003!important;color:#000!important}.vocab-tabs{background:#f8fafc;background:var(--bg-secondary);border-bottom:1px solid #e5e7eb;border-bottom:1px solid var(--border-light);display:flex}.tab,.tab-active{background:none;border:none;border-bottom:3px solid #0000;cursor:pointer;flex:1 1;font-size:.9rem;font-weight:500;padding:1rem;transition:all .2s}.tab{color:var(--text-secondary)}.tab:hover{background:var(--bg-hover);color:var(--text-primary)}.tab-active{background:#fff;background:var(--bg-primary);border-bottom-color:#3b82f6;border-bottom-color:var(--accent-color);color:#3b82f6;color:var(--accent-color)}.vocab-content{flex:1 1;overflow-y:auto;padding:1.5rem}.add-word-form h3{color:#1f2937;margin-bottom:1.5rem;margin-top:0}.add-word-form h3,.form-group label{color:var(--text-primary)}.form-group input,.form-group select,.form-group textarea{background:#fff;background:var(--bg-primary);border:2px solid #e5e7eb;border:2px solid var(--border-light);border-radius:8px;color:#1f2937;color:var(--text-primary);font-size:1rem;padding:.75rem;transition:border-color .2s;width:100%}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:#3b82f6;border-color:var(--accent-color);outline:none}.form-group textarea{min-height:80px;resize:vertical}.checkbox-group,.checkbox-group label{align-items:center;display:flex}.checkbox-group label{cursor:pointer;margin-bottom:0}.checkbox-group input[type=checkbox]{margin-right:.5rem;width:auto}.submit-button{background:var(--accent-color);padding:.875rem 2rem}.submit-button:hover:not(:disabled){background:var(--accent-hover)}.review-section{text-align:center}.review-complete{padding:2rem}.review-complete h3{color:#1f2937;color:var(--text-primary);margin-bottom:1rem}.retry-button{background:#3b82f6;background:var(--accent-color);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:1rem;padding:.75rem 1.5rem;transition:background-color .2s}.retry-button:hover{background:#2563eb;background:var(--accent-hover)}.review-card{margin:0 auto;max-width:500px}.review-progress{color:#6b7280;color:var(--text-secondary);font-size:.9rem;margin-bottom:1.5rem}.review-word{margin-bottom:2rem}.review-word h3{color:#1f2937;color:var(--text-primary);font-size:2rem;margin-bottom:.5rem}.word-language{color:#6b7280;color:var(--text-secondary);font-size:.9rem;letter-spacing:.5px;text-transform:uppercase}.show-answer-button{background:#3b82f6;background:var(--accent-color);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:1.1rem;font-weight:600;padding:1rem 2rem;transition:background-color .2s}.show-answer-button:hover{background:#2563eb;background:var(--accent-hover)}.review-answer{text-align:left}.definition,.example{background:#f8fafc;background:var(--bg-secondary);border-radius:8px;margin-bottom:1.5rem;padding:1rem}.definition strong,.example strong{color:#1f2937;color:var(--text-primary);display:block;margin-bottom:.5rem}.definition p,.example p{color:#1f2937;color:var(--text-primary);line-height:1.5;margin:0}.rating-buttons{margin-top:2rem;text-align:center}.rating-buttons p{color:#1f2937;color:var(--text-primary);font-weight:500;margin-bottom:1rem}.rating-buttons button{border:none;border-radius:8px;cursor:pointer;font-size:.9rem;font-weight:600;margin:0 .5rem;padding:.75rem 1rem;transition:transform .1s,box-shadow .2s}.rating-buttons button:hover{box-shadow:0 4px 8px #0003;transform:translateY(-2px)}.rating-fail{background:#fee2e2;color:#dc2626}.rating-hard{background:#fef3c7;color:#d97706}.rating-good{background:#d1fae5;color:#059669}.rating-easy{background:#dbeafe;color:#2563eb}.no-reviews{padding:2rem;text-align:center}.no-reviews h3{color:#1f2937;color:var(--text-primary);margin-bottom:.5rem}.no-reviews p{color:#6b7280;color:var(--text-secondary)}.list-controls{display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:1.5rem}.language-filter,.search-input{background:#fff;background:var(--bg-primary);border:2px solid #e5e7eb;border:2px solid var(--border-light);border-radius:8px;color:#1f2937;color:var(--text-primary);flex:1 1;font-size:1rem;min-width:200px;padding:.75rem}.language-filter:focus,.search-input:focus{border-color:#3b82f6;border-color:var(--accent-color);outline:none}.vocab-list{max-height:400px;overflow-y:auto}.vocab-item{background:#f8fafc;background:var(--bg-secondary);border:1px solid #e5e7eb;border:1px solid var(--border-light);border-radius:8px;margin-bottom:1rem;padding:1rem;transition:box-shadow .2s}.vocab-item:hover{box-shadow:0 2px 8px #0000001a}.vocab-item-header{align-items:flex-start;display:flex;justify-content:space-between;margin-bottom:.5rem}.vocab-item-header h4{color:#1f2937;color:var(--text-primary);font-size:1.2rem;margin:0}.vocab-item-actions{gap:.5rem}.delete-button,.favorite-button{background:none;border:none;border-radius:4px;cursor:pointer;font-size:1.1rem;padding:.25rem;transition:all .2s}.favorite-button{color:#6b7280;color:var(--text-secondary);opacity:.6}.favorite-button:hover{opacity:1;transform:scale(1.1)}.delete-button:hover,.favorite-button:hover{background:#f1f5f9;background:var(--bg-hover)}.favorite-button.favorited{color:#f59e0b;opacity:1}.vocab-language{color:#6b7280;color:var(--text-secondary);font-size:.8rem;letter-spacing:.5px;margin-bottom:.5rem;text-transform:uppercase}.vocab-definition{color:#1f2937;color:var(--text-primary);line-height:1.4;margin-bottom:.5rem}.vocab-example{font-size:.9rem;margin-bottom:.75rem}.vocab-example,.vocab-stats{color:#6b7280;color:var(--text-secondary)}.vocab-stats{display:flex;font-size:.8rem;gap:1rem}.empty-list{color:#6b7280;color:var(--text-secondary);padding:2rem}@media (max-width:768px){.vocab-dialog{max-height:95vh;max-width:95vw}.vocab-tabs{flex-wrap:wrap}.tab,.tab-active{flex:none;font-size:.8rem;min-width:calc(50% - 1px);padding:.75rem}.list-controls{flex-direction:column}.rating-buttons button{font-size:.8rem;margin:.25rem;padding:.5rem .75rem}.vocab-item-header{flex-direction:column;gap:.5rem}.vocab-item-actions{align-self:flex-end}}:root{--bg-primary:#fff;--bg-secondary:#f8fafc;--bg-hover:#f1f5f9;--text-primary:#1f2937;--text-secondary:#6b7280;--border-light:#e5e7eb;--accent-color:#3b82f6;--accent-hover:#2563eb}.vocab-audio-section{display:flex;flex-direction:column;gap:.5rem;margin:.75rem 0}.vocab-audio{background-color:#007bff0d;border-left:3px solid #007bff;border-radius:6px;padding:.5rem}.vocab-synthesis,.vocab-synthesize-button{align-items:center;display:flex}.vocab-synthesize-button{background:linear-gradient(135deg,#17a2b8,#138496);border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:.8rem;font-weight:500;gap:.25rem;padding:.5rem .75rem;transition:all .3s ease}.vocab-synthesize-button:hover:not(:disabled){box-shadow:0 3px 8px #17a2b84d;transform:translateY(-1px)}.vocab-synthesize-button:disabled{box-shadow:none!important;cursor:not-allowed;opacity:.7;transform:none!important}.review-audio-controls{background-color:#007bff0d;border:1px solid #007bff33;border-radius:8px;margin-top:1rem;padding:1rem}.audio-buttons{align-items:center;margin-bottom:.5rem}.audio-buttons,.audio-labels{display:flex;flex-wrap:wrap;gap:.75rem}.audio-labels{justify-content:flex-start}.audio-label{color:#6b7280;color:var(--text-secondary);font-size:.75rem;font-style:italic;min-width:120px;text-align:center}.synthesize-button{background:linear-gradient(135deg,#17a2b8,#138496);border-radius:6px;font-size:.9rem;font-weight:500;padding:.75rem 1rem;transition:all .3s ease}.synthesize-button:hover:not(:disabled){box-shadow:0 4px 12px #17a2b84d;transform:translateY(-2px)}.synthesize-button:disabled{box-shadow:none!important;opacity:.7;transform:none!important}.vocab-audio-button{background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.85rem;font-weight:500;margin:.5rem 0;min-height:36px;padding:.5rem 1rem;transition:all .2s ease}.vocab-audio-button:hover:not(:disabled){box-shadow:0 4px 12px #667eea4d;transform:translateY(-1px)}.vocab-audio-button:disabled{cursor:not-allowed;opacity:.7}.vocab-audio-button.small{font-size:.75rem;margin:0 .25rem;min-height:32px;padding:.375rem .5rem}.form-group .audio-recorder{background-color:#28a7450d;border-color:#28a745;margin-top:.5rem}.vocab-item-actions{align-items:center;display:flex;gap:.25rem}@media (max-width:480px){.review-audio-controls{padding:.75rem}.synthesize-button{font-size:.8rem;padding:.6rem .8rem;width:100%}.recorded-audio{align-items:center}}.audio-recorder{background-color:#f8f9fa;border:2px dashed #e1e5e9;border-radius:8px;margin:1rem 0;padding:1rem;transition:all .3s ease}.audio-recorder:hover{background-color:#f0f8ff;border-color:#007bff}.audio-recorder-controls{align-items:center;display:flex;flex-wrap:wrap;gap:.5rem}.record-button{background:linear-gradient(135deg,#28a745,#20c997);border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.9rem;font-weight:600;padding:.75rem 1.5rem;transition:all .3s ease}.record-button:hover:not(:disabled){box-shadow:0 4px 12px #28a7454d;transform:translateY(-2px)}.record-button.recording{animation:pulse 1.5s infinite;background:linear-gradient(135deg,#dc3545,#fd7e14)}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}.existing-audio-controls,.recorded-audio-controls{align-items:center;display:flex;flex-wrap:wrap;gap:.5rem}.play-button{background:linear-gradient(135deg,#007bff,#6610f2);border-radius:6px;font-size:.85rem;font-weight:500;padding:.5rem 1rem;transition:all .3s ease}.play-button:hover:not(:disabled){box-shadow:0 3px 8px #007bff4d;transform:translateY(-1px)}.save-button{background:linear-gradient(135deg,#28a745,#20c997);border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.85rem;font-weight:500;padding:.5rem 1rem;transition:all .3s ease}.save-button:hover:not(:disabled){box-shadow:0 3px 8px #28a7454d;transform:translateY(-1px)}.delete-button{background:linear-gradient(135deg,#dc3545,#e83e8c);border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.85rem;font-weight:500;padding:.5rem 1rem;transition:all .3s ease}.delete-button:hover:not(:disabled){box-shadow:0 3px 8px #dc35454d;transform:translateY(-1px)}.audio-recorder button:disabled{box-shadow:none!important;cursor:not-allowed;opacity:.6;transform:none!important}.audio-error{background-color:#f8d7da;border:1px solid #f5c6cb;border-radius:4px;color:#721c24;font-size:.85rem;margin-top:.5rem;padding:.5rem}@media (max-width:480px){.audio-recorder{padding:.75rem}.audio-recorder-controls{align-items:stretch;flex-direction:column}.existing-audio-controls,.recorded-audio-controls{flex-direction:column}.delete-button,.play-button,.record-button,.save-button{text-align:center;width:100%}}.audio-player{align-items:center;background:none;border:none;display:inline-flex;gap:0;margin:0;padding:0}.audio-play-button{align-items:center;background:linear-gradient(135deg,#28a745,#20c997);border:none;border-radius:6px;color:#fff;cursor:pointer;display:flex;flex:1 1;font-size:.9rem;font-weight:500;gap:.25rem;justify-content:center;min-width:120px;padding:.75rem 1rem;transition:all .3s ease}.audio-play-button:hover:not(:disabled){box-shadow:0 4px 12px #28a7454d;transform:translateY(-2px)}.audio-play-button:disabled{box-shadow:none!important;cursor:not-allowed;opacity:.6;transform:none!important}.loading-spinner{animation:spin 1s linear infinite}.audio-error-text{color:#dc3545;font-size:.7rem;font-style:italic}.vocab-item .audio-player{background:none;border:none;margin:0;padding:0}.vocab-item .audio-play-button{font-size:.75rem;padding:.3rem .6rem}.audio-player .audio-play-button,.vocab-item .audio-play-button{cursor:pointer!important;pointer-events:auto!important;position:relative!important;z-index:1000!important}.image-container .audio-play-button{cursor:pointer!important;pointer-events:auto!important;position:absolute!important;z-index:1000!important}.audio-player .audio-play-button:disabled,.image-container .audio-play-button:disabled,.vocab-item .audio-play-button:disabled{cursor:not-allowed!important;pointer-events:none!important}.audio-player{position:relative!important;z-index:999!important}.audio-player,.vocab-audio,.vocab-audio-section{pointer-events:auto!important}.audio-player,.vocab-audio{box-shadow:none!important}.audio-buttons-row .audio-player,.audio-player,.vocab-audio{background:none!important;border:none!important;margin:0!important;padding:0!important}.audio-buttons,.audio-buttons-row{align-items:stretch!important;flex-direction:column!important}.audio-buttons .audio-play-button,.audio-buttons .synthesize-button,.audio-buttons-row .audio-play-button,.audio-buttons-row .vocab-synthesize-button,.vocab-item .audio-play-button,.vocab-item .vocab-synthesize-button{align-items:center!important;border-radius:6px!important;box-sizing:border-box!important;display:flex!important;flex:none!important;font-size:.9rem!important;gap:.25rem!important;height:44px!important;justify-content:center!important;margin-bottom:.5rem!important;max-width:none!important;min-width:120px!important;padding:.75rem 1rem!important;width:100%!important}.audio-buttons .synthesize-button:last-child,.audio-buttons-row .vocab-synthesize-button:last-child{margin-bottom:0!important}.study-sets-overlay{align-items:center;background:#000000b3;bottom:0;display:flex;justify-content:center;left:0;padding:1rem;position:fixed;right:0;top:0;z-index:1000}.study-sets-dialog{background:#fff;background:var(--bg-primary,#fff);border:1px solid #e5e7eb;border:1px solid var(--border-light,#e5e7eb);border-radius:16px;box-shadow:0 20px 40px #0000004d;display:flex;flex-direction:column;height:auto;max-height:90vh;max-width:900px;min-height:500px;overflow:hidden;width:100%}.study-sets-header{align-items:center;border-bottom:1px solid #e5e7eb;border-bottom:1px solid var(--border-light,#e5e7eb);display:flex;justify-content:space-between;padding:1.5rem}.study-sets-header h2{color:#1f2937;color:var(--text-primary,#1f2937);font-size:1.5rem;margin:0}.study-sets-dialog .close-button{background:#0000001a!important;border:none!important;border-radius:8px!important;color:#333!important;cursor:pointer!important;font-size:1.5rem!important;font-weight:700!important;padding:.5rem!important;transition:all .2s!important}.study-sets-dialog .close-button:hover{background:#0003!important;color:#000!important}.study-sets-tabs{background:#f8fafc;background:var(--bg-secondary,#f8fafc);border-bottom:1px solid #e5e7eb;border-bottom:1px solid var(--border-light,#e5e7eb);display:flex}.tab{background:none;border:none;border-bottom:3px solid #0000;color:#6b7280;color:var(--text-secondary,#6b7280);cursor:pointer;flex:1 1;font-size:.9rem;font-weight:500;padding:1rem;transition:all .2s}.tab:hover{background:#f1f5f9;background:var(--bg-hover,#f1f5f9);color:#1f2937;color:var(--text-primary,#1f2937)}.tab-active{background:#fff!important;background:var(--bg-primary,#fff)!important;border-bottom-color:#3b82f6!important;border-bottom-color:var(--accent-color,#3b82f6)!important;color:#3b82f6!important;color:var(--accent-color,#3b82f6)!important}.study-sets-content{flex:1 1;min-height:0;overflow-y:auto;padding:1.5rem}.error-message{background:#fee2e2;border:1px solid #fecaca;color:#dc2626}.success-message{background:#d1fae5;border:1px solid #a7f3d0;color:#059669}.info-banner{background:#dbeafe;border:1px solid #93c5fd;border-radius:8px;color:#1d4ed8;font-size:.9rem;line-height:1.4;margin-bottom:1rem;padding:.75rem}.loading-message{color:#6b7280;color:var(--text-secondary,#6b7280);padding:2rem;text-align:center}.empty-list{padding:3rem 1rem;text-align:center}.empty-list h3{color:#1f2937;color:var(--text-primary,#1f2937);margin-bottom:.5rem}.empty-list p{color:#6b7280;color:var(--text-secondary,#6b7280);margin-bottom:1.5rem}.create-first-button{background:#3b82f6;background:var(--accent-color,#3b82f6);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:1rem;font-weight:600;padding:.875rem 1.5rem;transition:background-color .2s}.create-first-button:hover{background:#2563eb;background:var(--accent-hover,#2563eb)}.study-sets-grid{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}.study-set-card{background:#f8fafc;background:var(--bg-secondary,#f8fafc);border:1px solid #e5e7eb;border:1px solid var(--border-light,#e5e7eb);border-radius:12px;padding:1.5rem;transition:all .2s}.study-set-card:hover{box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.study-set-header{align-items:flex-start;display:flex;justify-content:space-between;margin-bottom:1rem}.study-set-header h4{color:#1f2937;color:var(--text-primary,#1f2937);flex:1 1;font-size:1.1rem;font-weight:600;margin:0 1rem 0 0}.study-set-actions{display:flex;gap:.5rem}.delete-button,.edit-button{background:none;border:none;border-radius:4px;cursor:pointer;font-size:1rem;opacity:.7;padding:.25rem;transition:all .2s}.delete-button:hover,.edit-button:hover{background:#f1f5f9;background:var(--bg-hover,#f1f5f9);opacity:1;transform:scale(1.1)}.study-set-info{color:#6b7280;color:var(--text-secondary,#6b7280);display:flex;font-size:.85rem;gap:1rem;margin-bottom:1rem}.item-count{font-weight:500}.study-set-preview{font-size:.9rem}.preview-item{color:#1f2937;color:var(--text-primary,#1f2937);line-height:1.4;margin-bottom:.25rem}.preview-item strong{color:#3b82f6;color:var(--accent-color,#3b82f6)}.preview-more{color:#6b7280;color:var(--text-secondary,#6b7280);font-style:italic;margin-top:.5rem}.create-study-set{margin:0 auto;max-width:700px}.form-group{margin-bottom:1.5rem}.form-group label{display:block;font-weight:500;margin-bottom:.5rem}.form-group input,.form-group label{color:#1f2937;color:var(--text-primary,#1f2937)}.form-group input{background:#fff;background:var(--bg-primary,#fff);border:2px solid #e5e7eb;border:2px solid var(--border-light,#e5e7eb);border-radius:8px;font-size:1rem;padding:.75rem;transition:border-color .2s;width:100%}.form-group input:focus{border-color:#3b82f6;border-color:var(--accent-color,#3b82f6);outline:none}.items-section{margin-bottom:2rem}.items-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:1rem}.items-header h4{color:#1f2937;color:var(--text-primary,#1f2937);margin:0}.add-item-button{background:#3b82f6;background:var(--accent-color,#3b82f6);border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.9rem;padding:.5rem 1rem;transition:background-color .2s}.add-item-button:hover{background:#2563eb;background:var(--accent-hover,#2563eb)}.items-list{display:flex;flex-direction:column;gap:1rem}.vocabulary-item{background:#f8fafc;background:var(--bg-secondary,#f8fafc);border:1px solid #e5e7eb;border:1px solid var(--border-light,#e5e7eb);border-radius:8px;gap:1rem;padding:1rem}.item-number,.vocabulary-item{align-items:center;display:flex}.item-number{background:#3b82f6;background:var(--accent-color,#3b82f6);border-radius:50%;color:#fff;flex-shrink:0;font-size:.8rem;font-weight:600;height:24px;justify-content:center;width:24px}.item-fields{grid-gap:.75rem;display:grid;flex:1 1;gap:.75rem;grid-template-columns:1fr 1fr auto}.item-fields input,.item-fields select{background:#fff;background:var(--bg-primary,#fff);border:1px solid #e5e7eb;border:1px solid var(--border-light,#e5e7eb);border-radius:6px;color:#1f2937;color:var(--text-primary,#1f2937);font-size:.9rem;padding:.5rem}.item-fields input:focus,.item-fields select:focus{border-color:#3b82f6;border-color:var(--accent-color,#3b82f6);outline:none}.remove-item-button{align-items:center;background:#ef4444;border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;flex-shrink:0;font-size:1rem;height:24px;justify-content:center;transition:background-color .2s;width:24px}.remove-item-button:hover{background:#dc2626}.form-actions{border-top:1px solid #e5e7eb;border-top:1px solid var(--border-light,#e5e7eb);display:flex;gap:1rem;justify-content:flex-end;padding-top:1rem}.cancel-button{background:#f8fafc;background:var(--bg-secondary,#f8fafc);border:1px solid #e5e7eb;border:1px solid var(--border-light,#e5e7eb);border-radius:8px;color:#1f2937;color:var(--text-primary,#1f2937);cursor:pointer;font-size:1rem;padding:.75rem 1.5rem;transition:all .2s}.cancel-button:hover{background:#f1f5f9;background:var(--bg-hover,#f1f5f9)}.submit-button{background:#3b82f6;background:var(--accent-color,#3b82f6);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:1rem;font-weight:600;padding:.75rem 1.5rem;transition:background-color .2s}.submit-button:hover:not(:disabled){background:#2563eb;background:var(--accent-hover,#2563eb)}.submit-button:disabled{cursor:not-allowed;opacity:.6}@media (max-width:768px){.study-sets-dialog{max-height:95vh;max-width:95vw}.item-fields,.study-sets-grid{grid-template-columns:1fr}.item-fields{gap:.5rem}.vocabulary-item{align-items:flex-start;flex-direction:column}.item-number{align-self:flex-start}.form-actions{flex-direction:column}.form-actions button{width:100%}}@media (max-width:480px){.study-set-card,.study-sets-content,.study-sets-header{padding:1rem}.study-set-header{flex-direction:column;gap:.5rem}.study-set-actions{align-self:flex-end}}.study-mode{display:flex;flex-direction:column;height:100%;margin:0 auto;max-width:600px;min-height:500px;text-align:center}.study-mode-header{align-items:center;border-bottom:1px solid #e5e7eb;border-bottom:1px solid var(--border-light,#e5e7eb);display:flex;flex-shrink:0;justify-content:space-between;margin-bottom:1rem;padding-bottom:.75rem}.back-to-list-button{background:#f8fafc;background:var(--bg-secondary,#f8fafc);border:1px solid #e5e7eb;border:1px solid var(--border-light,#e5e7eb);border-radius:6px;color:#1f2937;color:var(--text-primary,#1f2937);cursor:pointer;font-size:.9rem;padding:.5rem 1rem;transition:all .2s}.back-to-list-button:hover{background:#f1f5f9;background:var(--bg-hover,#f1f5f9)}.study-mode-header h3{color:#1f2937;color:var(--text-primary,#1f2937);font-size:1.2rem;margin:0}.study-progress{background:#3b82f6;background:var(--accent-color,#3b82f6);border-radius:20px;color:#fff;font-size:.9rem;font-weight:500;padding:.5rem 1rem}.flashcard-container{align-items:center;display:flex;flex:1 1;justify-content:center;margin:1.5rem 0;min-height:280px;perspective:1000px}.flashcard{cursor:pointer;height:220px;margin:0 auto;max-width:400px;position:relative;transform-style:preserve-3d;transition:transform .6s;width:100%}.flashcard.flipped{transform:rotateY(180deg)}.flashcard-back,.flashcard-front{align-items:center;backface-visibility:hidden;background:#fff;background:var(--bg-primary,#fff);border:2px solid #e5e7eb;border:2px solid var(--border-light,#e5e7eb);border-radius:12px;box-shadow:0 4px 12px #0000001a;display:flex;flex-direction:column;height:100%;justify-content:center;padding:2rem;position:absolute;width:100%}.flashcard-back{background:#f8fafc;background:var(--bg-secondary,#f8fafc);transform:rotateY(180deg)}.card-label{color:#6b7280;color:var(--text-secondary,#6b7280);font-size:.8rem;left:1rem;letter-spacing:.5px;position:absolute;text-transform:uppercase;top:1rem}.card-content{color:#1f2937;color:var(--text-primary,#1f2937);font-size:2rem;font-weight:600;line-height:1.2;text-align:center;word-break:break-word}.card-language{background:#f8fafc;background:var(--bg-secondary,#f8fafc);border-radius:4px;bottom:3rem;color:#3b82f6;color:var(--accent-color,#3b82f6);padding:.25rem .5rem;right:1rem}.card-language,.flip-hint{font-size:.8rem;position:absolute}.flip-hint{bottom:1rem;color:#6b7280;color:var(--text-secondary,#6b7280);left:50%;opacity:.7;transform:translateX(-50%)}.study-controls{align-items:center;background:#fff;background:var(--bg-primary,#fff);border-top:1px solid #e5e7eb;border-top:1px solid var(--border-light,#e5e7eb);display:flex;flex-shrink:0;gap:1rem;justify-content:center;margin:1rem 0;padding:1rem 0}.nav-button{background:#3b82f6;background:var(--accent-color,#3b82f6);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:1rem;min-width:100px;padding:.75rem 1.5rem;transition:all .2s}.nav-button:hover:not(:disabled){background:#2563eb;background:var(--accent-hover,#2563eb);transform:translateY(-1px)}.nav-button:disabled{cursor:not-allowed;opacity:.5;transform:none}.flip-button{background:#f8fafc;background:var(--bg-secondary,#f8fafc);border:2px solid #3b82f6;border:2px solid var(--accent-color,#3b82f6);border-radius:8px;color:#1f2937;color:var(--text-primary,#1f2937);cursor:pointer;font-size:1rem;font-weight:500;padding:.75rem 1.5rem;transition:all .2s}.flip-button:hover{background:#3b82f6;background:var(--accent-color,#3b82f6);color:#fff}.study-complete{background:#f8fafc;background:var(--bg-secondary,#f8fafc);border:1px solid #e5e7eb;border:1px solid var(--border-light,#e5e7eb);border-radius:12px;margin-top:2rem;padding:1.5rem}.study-complete p{color:#1f2937;color:var(--text-primary,#1f2937);font-size:1.1rem;margin:0 0 1rem}.restart-button{background:#3b82f6;background:var(--accent-color,#3b82f6);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:1rem;padding:.75rem 1.5rem;transition:all .2s}.restart-button:hover{background:#2563eb;background:var(--accent-hover,#2563eb)}.study-button{background:#3b82f6;background:var(--accent-color,#3b82f6);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:.9rem;font-weight:600;margin-top:1rem;padding:.75rem 1.5rem;transition:all .2s;width:100%}.study-button:hover:not(:disabled){background:#2563eb;background:var(--accent-hover,#2563eb);transform:translateY(-1px)}.study-button:disabled{cursor:not-allowed;opacity:.5}@media (max-width:768px){.study-mode{min-height:450px}.study-mode-header{flex-direction:column;gap:.75rem;margin-bottom:.75rem;text-align:center}.flashcard-container{margin:1rem 0;min-height:200px}.flashcard{height:180px;max-width:300px}.card-content{font-size:1.5rem}.study-controls{flex-wrap:wrap;gap:.5rem;padding:.75rem 0}.study-controls .flip-button,.study-controls .nav-button{font-size:.9rem;min-width:120px;padding:.6rem 1rem}}@media (max-width:480px){.study-mode{min-height:400px}.study-sets-content{padding:1rem}.flashcard-container{min-height:160px}.flashcard{height:160px;max-width:260px}.flashcard-back,.flashcard-front{padding:1.25rem}.card-content{font-size:1.1rem}.study-mode-header{margin-bottom:.5rem}.study-mode-header h3{font-size:1rem}.study-controls{gap:.5rem;padding:.5rem 0}.study-controls .flip-button,.study-controls .nav-button{font-size:.85rem;min-width:100px;padding:.5rem .75rem}}[data-theme=dark]{--bg-primary:#1f2937;--bg-secondary:#374151;--bg-hover:#4b5563;--text-primary:#f9fafb;--text-secondary:#d1d5db;--border-light:#4b5563;--accent-color:#60a5fa;--accent-hover:#3b82f6}.item-audio{border-top:1px solid #e2e8f0;margin-top:.75rem;padding-top:.75rem}.flashcard-audio-button{background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.85rem;font-weight:500;margin:.5rem 0;min-height:36px;padding:.5rem 1rem;transition:all .2s ease}.flashcard-audio-button:hover:not(:disabled){box-shadow:0 4px 12px #667eea4d;transform:translateY(-1px)}.flashcard-audio-button:disabled{cursor:not-allowed;opacity:.7}.vocabulary-item{position:relative}.vocabulary-item .item-audio .audio-recorder{border-color:#cbd5e0;margin:0}.word-search-overlay{align-items:center;background:#000000b3;bottom:0;display:flex;justify-content:center;left:0;padding:20px;position:fixed;right:0;top:0;z-index:1000}.word-search-dialog{background:#fff;border-radius:16px;box-shadow:0 20px 40px #0000004d;display:flex;flex-direction:column;max-height:90vh;max-width:900px;overflow:hidden;width:100%}.word-search-header{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border-bottom:1px solid #e0e0e0;color:#fff;display:flex;justify-content:space-between;padding:24px}.word-search-header h2{font-size:1.5rem;font-weight:600;margin:0}.close-button{align-items:center;background:#fff3;border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;font-size:1.2rem;height:36px;justify-content:center;transition:background-color .2s;width:36px}.close-button:hover{background:#ffffff4d}.search-info{background:#f8f9fa;color:#666;font-size:.9rem;padding:16px 24px;text-align:center}.search-controls,.search-info{border-bottom:1px solid #e0e0e0}.search-controls{align-items:center;display:flex;flex-wrap:wrap;gap:16px;padding:20px 24px}.search-input-container{flex:1 1;min-width:300px;position:relative}.search-input{border:2px solid #e0e0e0;border-radius:8px;font-size:1rem;padding:12px 40px 12px 16px;transition:border-color .2s;width:100%}.search-input:focus{border-color:#667eea;box-shadow:0 0 0 3px #667eea1a;outline:none}.search-spinner{animation:spin 1s linear infinite;position:absolute;right:12px;top:50%;transform:translateY(-50%)}@keyframes spin{0%{transform:translateY(-50%) rotate(0deg)}to{transform:translateY(-50%) rotate(1turn)}}.language-selector{background:#fff;border:2px solid #e0e0e0;border-radius:8px;cursor:pointer;font-size:1rem;min-width:200px;padding:12px 16px}.language-selector:focus{border-color:#667eea;outline:none}.search-content{flex:1 1;overflow-y:auto;padding:24px}.error-message{background:#fee;border:1px solid #fed7d7;color:#c53030}.error-message,.success-message{margin-bottom:16px;padding:12px 16px}.success-message{background:#f0fff4;border:1px solid #c6f6d5;color:#38a169}.search-hint{font-style:italic}.no-results,.search-hint{color:#666;padding:40px 20px;text-align:center}.no-results p:first-child{font-size:1.1rem;font-weight:500;margin-bottom:8px}.results-header{border-bottom:1px solid #e0e0e0;color:#333;font-weight:500;margin-bottom:20px;padding-bottom:12px}.results-list{display:flex;flex-direction:column;gap:16px}.search-result-item{background:#fff;border:1px solid #e0e0e0;border-radius:12px;padding:20px;transition:all .2s}.search-result-item:hover{border-color:#667eea;box-shadow:0 4px 12px #0000001a}.word-header{align-items:flex-start;display:flex;justify-content:space-between;margin-bottom:12px}.word-main{flex:1 1}.word-text{color:#333;font-size:1.3rem;font-weight:600;margin:0 0 8px}.search-highlight{background:#ffd60a;border-radius:4px;font-weight:600;padding:2px 4px}.word-meta{align-items:center;display:flex;flex-wrap:wrap;gap:8px}.language-badge{background:#667eea;border-radius:12px;color:#fff;font-size:.8rem;font-weight:500;padding:4px 8px}.source-info{background:#f8f9fa;border:1px solid #e0e0e0;border-radius:8px;color:#666}.question-type,.source-info{font-size:.8rem;padding:4px 8px}.question-type{background:#e2e8f0;border-radius:8px;color:#4a5568}.add-vocab-button{align-items:center;background:#38a169;border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;font-size:1.1rem;height:44px;justify-content:center;min-width:44px;padding:10px 12px;transition:all .2s}.add-vocab-button:hover:not(:disabled){background:#2f855a;transform:translateY(-1px)}.add-vocab-button:disabled{background:#cbd5e0;cursor:not-allowed;transform:none}.word-definition{color:#555;line-height:1.5;margin-bottom:8px}.word-example{color:#555;font-style:italic;line-height:1.5;margin-bottom:12px}.word-features{display:flex;flex-wrap:wrap;gap:6px}.feature-badge{background:#edf2f7;border-radius:6px;color:#4a5568;font-size:.75rem;font-weight:500;padding:3px 6px}.search-welcome{margin:0 auto;max-width:600px;text-align:center}.search-welcome h3{color:#333;font-size:1.5rem;margin-bottom:16px}.search-welcome>p{color:#666;line-height:1.6}.language-overview,.search-welcome>p{margin-bottom:32px}.language-overview h4{color:#333;margin-bottom:16px;text-align:left}.language-grid{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));margin-bottom:24px}.language-card{align-items:center;background:#f8f9fa;border:1px solid #e0e0e0;border-radius:8px;display:flex;flex-direction:column;gap:4px;padding:12px}.language-card strong{color:#333;font-size:.9rem}.language-card span{color:#666;font-size:.8rem}.search-tips{background:#f8f9fa;border:1px solid #e0e0e0;border-radius:8px;padding:20px;text-align:left}.search-tips h4{color:#333;margin-bottom:12px}.search-tips ul{color:#666;margin:0;padding-left:20px}.search-tips li{line-height:1.4;margin-bottom:6px}@media (max-width:768px){.word-search-overlay{padding:10px}.word-search-dialog{max-height:95vh}.search-controls{align-items:stretch;flex-direction:column}.language-selector,.search-input-container{min-width:auto}.word-header{flex-direction:column;gap:12px}.add-vocab-button{align-self:flex-start}.language-grid{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}}@media (max-width:480px){.word-search-header{padding:16px}.word-search-header h2{font-size:1.2rem}.search-content,.search-result-item{padding:16px}.word-text{font-size:1.1rem}}.settings-overlay{align-items:center;background:#00000080;bottom:0;box-sizing:border-box;display:flex;justify-content:center;left:0;padding:1rem;position:fixed;right:0;top:0;z-index:1000}.settings-modal{animation:modalSlideIn .3s ease-out;background:#fff;border-radius:16px;box-shadow:0 20px 50px #0000004d;display:flex;flex-direction:column;max-height:90vh;max-width:600px;overflow:hidden;position:relative;width:100%}@keyframes modalSlideIn{0%{opacity:0;transform:translateY(-20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.settings-header{background:linear-gradient(135deg,#4caf50,#2196f3);color:#fff;flex-shrink:0;padding:2rem;text-align:center}.settings-title{font-size:2rem;font-weight:700;letter-spacing:-.02em;margin:0 0 .5rem}.settings-subtitle{font-size:1rem;font-weight:400;margin:0;opacity:.9}.settings-tabs{background:#f8f9fa;border-bottom:1px solid #e0e0e0;display:flex;flex-shrink:0}.tab-btn{background:#0000;border:none;border-bottom:3px solid #0000;color:#666;cursor:pointer;flex:1 1;font-size:.9rem;font-weight:500;padding:1rem;transition:all .2s ease}.tab-btn:hover{background:#e9ecef;color:#333}.tab-btn.active{background:#fff;border-bottom-color:#4caf50;color:#4caf50}.settings-content{flex:1 1;overflow-y:auto;padding:2rem}.tab-content{animation:tabFadeIn .2s ease-out}@keyframes tabFadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.settings-section{margin-bottom:2rem}.section-title{color:#333;font-size:1.25rem;font-weight:600;margin:0 0 1.5rem}.profile-section{margin-bottom:2rem}.profile-pic-container{align-items:center;display:flex;flex-direction:column;gap:1rem;margin-bottom:2rem}.profile-pic-preview{box-shadow:0 4px 12px #0000001a;object-fit:cover}.profile-pic-placeholder,.profile-pic-preview{border:4px solid #e0e0e0;border-radius:50%;height:120px;width:120px}.profile-pic-placeholder{align-items:center;background:#f0f0f0;color:#999;display:flex;font-size:3rem;justify-content:center}.pic-upload-input{display:none}.pic-upload-btn{background:linear-gradient(135deg,#4caf50,#45a049);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:.9rem;font-weight:600;padding:.75rem 1.5rem;transition:all .2s ease}.pic-upload-btn:hover:not(:disabled){box-shadow:0 4px 12px #4caf504d;transform:translateY(-1px)}.pic-upload-btn:disabled{background:#ccc;box-shadow:none;cursor:not-allowed;transform:none}.bio-section{margin-top:2rem}.bio-textarea{border:2px solid #e0e0e0;border-radius:8px;box-sizing:border-box;font-family:inherit;font-size:1rem;min-height:100px;padding:.75rem;resize:vertical;transition:border-color .2s ease;width:100%}.bio-textarea:focus{border-color:#4caf50;box-shadow:0 0 0 3px #4caf501a;outline:none}.bio-textarea:disabled{background-color:#f5f5f5;color:#999;cursor:not-allowed}.char-count{color:#666;font-size:.8rem;margin-top:.5rem;text-align:right}.update-bio-btn{background:linear-gradient(135deg,#4caf50,#45a049);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:1rem;font-weight:600;margin-top:1rem;padding:.75rem 1.5rem;transition:all .2s ease}.update-bio-btn:hover:not(:disabled){box-shadow:0 4px 12px #4caf504d;transform:translateY(-1px)}.update-bio-btn:disabled{background:#ccc;box-shadow:none;cursor:not-allowed;transform:none}.email-form,.password-form{display:flex;flex-direction:column;gap:1rem}.form-group{gap:.5rem}.form-label{color:#555;font-size:.9rem;font-weight:500}.form-input{border:2px solid #e0e0e0;border-radius:8px;font-size:1rem;padding:.75rem;transition:border-color .2s ease}.form-input:focus{border-color:#4caf50;box-shadow:0 0 0 3px #4caf501a;outline:none}.form-input:disabled{background-color:#f5f5f5;color:#999;cursor:not-allowed}.current-email-display{background-color:#f8f9fa;border:1px solid #e9ecef;border-radius:8px;display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.5rem;padding:1rem}.current-email-value{color:#495057;font-size:1rem;font-weight:500;padding:.5rem 0}.change-email-btn,.change-password-btn{align-self:flex-start;background:linear-gradient(135deg,#4caf50,#45a049);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:1rem;font-weight:600;padding:.75rem 1.5rem;transition:all .2s ease}.change-email-btn:hover:not(:disabled),.change-password-btn:hover:not(:disabled){box-shadow:0 4px 12px #4caf504d;transform:translateY(-1px)}.change-email-btn:disabled,.change-password-btn:disabled{background:#ccc;box-shadow:none;cursor:not-allowed;transform:none}.error-message{background:#ffebee;border-left:4px solid #f44336;color:#f44336}.error-message,.success-message{font-size:.9rem;margin-bottom:1rem;padding:.75rem}.success-message{background:#e8f5e8;border-left:4px solid #4caf50;border-radius:8px;color:#4caf50}.settings-footer{background:#f9f9f9;border-top:1px solid #eee;display:flex;flex-shrink:0;justify-content:flex-end;padding:1.5rem 2rem}.close-btn{background:#666;border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:1rem;padding:.75rem 1.5rem;transition:background-color .2s ease}.close-btn:hover{background:#555}.delete-warning{display:flex;flex-direction:column;gap:2rem}.warning-box{background:#fff3cd;border:2px solid #ffc107;border-radius:8px;color:#856404;padding:1.5rem}.warning-box strong{color:#721c24;display:block;font-size:1.1rem;margin-bottom:1rem}.warning-box p{line-height:1.5;margin:1rem 0}.warning-box ul{margin:1rem 0;padding-left:1.5rem}.warning-box li{margin-bottom:.5rem}.delete-confirmation{background:#f8f9fa;border:1px solid #dee2e6;border-radius:8px;padding:1.5rem}.delete-input{font-family:monospace;font-weight:700;text-transform:uppercase}.delete-account-btn{background:linear-gradient(135deg,#dc3545,#c82333);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:1rem;font-weight:600;margin-top:1rem;padding:.75rem 1.5rem;transition:all .2s ease}.delete-account-btn:hover:not(:disabled){box-shadow:0 4px 12px #dc354566;transform:translateY(-1px)}.delete-account-btn:disabled{background:#ccc;box-shadow:none;cursor:not-allowed;transform:none}.delete-confirm-dialog{border:2px solid #dc3545}.delete-confirm-dialog .confirm-title{color:#dc3545}.confirm-delete{background:linear-gradient(135deg,#dc3545,#c82333);color:#fff}.confirm-delete:hover:not(:disabled){box-shadow:0 4px 12px #dc354566;transform:translateY(-1px)}@media (prefers-color-scheme:dark){.warning-box{background:#3d2914;border-color:#8b6914;color:#fbbf24}.warning-box strong{color:#f59e0b}.delete-confirmation{background:#2a2a2a;border-color:#444}.delete-confirm-dialog{border-color:#dc3545}}.confirm-overlay{align-items:center;background:#000000b3;border-radius:16px;bottom:0;display:flex;justify-content:center;left:0;position:absolute;right:0;top:0;z-index:10}.confirm-dialog{animation:confirmSlideIn .2s ease-out;background:#fff;border-radius:12px;box-shadow:0 10px 30px #0000004d;max-width:400px;padding:2rem;width:90%}@keyframes confirmSlideIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.confirm-title{color:#333;font-size:1.25rem;font-weight:600;margin:0 0 1rem;text-align:center}.confirm-message{color:#555;line-height:1.5;margin:0 0 1.5rem;text-align:center}.confirm-message strong{color:#4caf50;font-weight:600}.confirm-buttons{display:flex;gap:1rem;justify-content:center}.confirm-btn{border-radius:8px;font-size:.9rem;min-width:120px;padding:.75rem 1.5rem}.confirm-yes{background:linear-gradient(135deg,#4caf50,#45a049);color:#fff}.confirm-yes:hover:not(:disabled){box-shadow:0 4px 12px #4caf504d;transform:translateY(-1px)}.confirm-no{background:#f5f5f5;border:1px solid #ddd;color:#666}.confirm-no:hover:not(:disabled){background:#e8e8e8}.confirm-btn:disabled{opacity:.6}@media (prefers-color-scheme:dark){.settings-modal{background:#1e1e1e;color:#fff}.settings-tabs{background:#2a2a2a;border-bottom-color:#444}.tab-btn{color:#ccc}.tab-btn:hover{background:#333;color:#fff}.tab-btn.active{background:#1e1e1e;color:#4caf50}.section-title{color:#fff}.form-label{color:#ccc}.bio-textarea,.form-input{background:#2a2a2a;border-color:#444;color:#fff}.bio-textarea:focus,.form-input:focus{border-color:#4caf50}.char-count{color:#999}.profile-pic-placeholder{background:#2a2a2a;border-color:#444}.settings-footer{background:#2a2a2a;border-top-color:#444}.confirm-dialog{background:#2a2a2a;color:#fff}.confirm-title{color:#fff}.confirm-message{color:#ccc}.confirm-no{background:#444;border-color:#555;color:#ccc}.confirm-no:hover:not(:disabled){background:#555}}@media (max-width:600px){.settings-overlay{padding:.5rem}.settings-modal{max-width:100%}.settings-header{padding:1.5rem}.settings-title{font-size:1.75rem}.settings-content{padding:1.5rem}.settings-footer{padding:1rem 1.5rem}.tab-btn{font-size:.8rem;padding:.75rem .5rem}.profile-pic-placeholder,.profile-pic-preview{height:100px;width:100px}.profile-pic-placeholder{font-size:2.5rem}.confirm-dialog{margin:1rem;padding:1.5rem}.confirm-buttons{flex-direction:column}.confirm-btn{min-width:auto}.settings-tabs{flex-wrap:wrap}.tab-btn{flex:0 0 25%}.warning-box{padding:1rem}.warning-box strong{font-size:1rem}.delete-confirmation{padding:1rem}}@media (max-width:400px){.tab-btn{flex:1 1;font-size:.65rem;padding:.4rem}.warning-box{padding:.75rem}.warning-box strong{font-size:.95rem}.delete-confirmation{padding:.75rem}}.current-language-display{margin-bottom:2rem}.current-language-value{background:#f5f5f5;border-radius:8px;color:#666;font-weight:500;margin-top:.5rem;padding:1rem}.language-selection{margin-top:2rem}.subsection-title{color:#333;font-size:1.1rem;font-weight:600;margin-bottom:1rem}.language-dropdown-container{margin-top:1rem;max-width:300px;position:relative;width:100%}.language-dropdown{background:#fff;border:2px solid #e0e0e0;border-radius:12px;box-shadow:0 2px 8px #0000001a;cursor:pointer;position:relative;transition:all .3s ease}.language-dropdown:hover:not(.disabled){border-color:#4caf50;box-shadow:0 4px 16px #4caf5033}.language-dropdown.open{border-bottom-left-radius:4px;border-bottom-right-radius:4px;border-color:#4caf50;box-shadow:0 6px 20px #4caf504d}.language-dropdown.disabled{cursor:not-allowed;opacity:.6}.dropdown-selected{align-items:center;display:flex;font-size:1rem;font-weight:500;justify-content:space-between;padding:1rem 1.25rem}.selected-language{align-items:center;color:#333;display:flex;gap:.5rem}.dropdown-arrow{color:#666;font-size:.8rem;transition:transform .3s ease;-webkit-user-select:none;user-select:none}.dropdown-arrow.up{transform:rotate(180deg)}.dropdown-options{background:#fff;border:2px solid #4caf50;border-radius:0 0 12px 12px;border-top:none;box-shadow:0 4px 16px #00000026;left:0;max-height:0;overflow:auto;position:absolute;right:0;top:100%;transition:all .3s ease;z-index:1000}.language-dropdown.open .dropdown-options{border-color:#4caf50;max-height:300px}.dropdown-option{align-items:center;border-bottom:1px solid #f0f0f0;cursor:pointer;display:flex;font-size:1rem;justify-content:space-between;padding:.875rem 1.25rem;transition:all .2s ease}.dropdown-option:last-child{border-bottom:none}.dropdown-option:hover{background:linear-gradient(135deg,#f8fffe,#e8f5e8);color:#2e7d32}.dropdown-option.selected{background:linear-gradient(135deg,#e8f5e8,#c8e6c8);color:#2e7d32;font-weight:600}.option-label{align-items:center;display:flex;gap:.5rem}.check-icon{color:#4caf50;font-size:1.1rem;font-weight:700}.section-description{color:#666;line-height:1.5;margin-bottom:1.5rem}@media (prefers-color-scheme:dark){.current-language-value{background:#2d2d2d;color:#e0e0e0}.subsection-title{color:#e0e0e0}.language-dropdown{background:#2d2d2d;border-color:#444}.language-dropdown:hover:not(.disabled){border-color:#4caf50;box-shadow:0 4px 16px #4caf504d}.language-dropdown.open{border-color:#4caf50;box-shadow:0 6px 20px #4caf5066}.selected-language{color:#e0e0e0}.dropdown-arrow{color:#b0b0b0}.dropdown-options{background:#2d2d2d;border-color:#4caf50;box-shadow:0 4px 16px #0006}.dropdown-option{border-bottom-color:#444;color:#e0e0e0}.dropdown-option.selected,.dropdown-option:hover{background:linear-gradient(135deg,#1b4332,#2d5a27);color:#81c784}.section-description{color:#b0b0b0}}.text-to-speech-dialog{max-height:90vh;max-width:800px;overflow-y:auto;width:90%}.tts-content{padding:20px}.language-selection{grid-gap:20px;display:grid;gap:20px;grid-template-columns:1fr 1fr;margin-bottom:30px}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-weight:600}.form-group label,.language-dropdown,.voice-dropdown{color:#333;color:var(--text-color,#333);font-size:14px}.language-dropdown,.voice-dropdown{background:#fff;background:var(--input-bg,#fff);border:2px solid #ddd;border:2px solid var(--border-color,#ddd);border-radius:8px;cursor:pointer;padding:12px;transition:border-color .2s ease}.language-dropdown:focus,.language-dropdown:hover,.voice-dropdown:focus,.voice-dropdown:hover{border-color:#007bff;border-color:var(--primary-color,#007bff);outline:none}.text-input-section{margin-bottom:30px}.text-input-section label{display:block;font-size:16px;font-weight:600;margin-bottom:10px}.text-input,.text-input-section label{color:#333;color:var(--text-color,#333)}.text-input{background:#fff;background:var(--input-bg,#fff);border:2px solid #ddd;border:2px solid var(--border-color,#ddd);border-radius:8px;font-family:inherit;font-size:14px;min-height:120px;padding:15px;resize:vertical;transition:border-color .2s ease;width:100%}.text-input:focus,.text-input:hover{border-color:#007bff;border-color:var(--primary-color,#007bff);outline:none}.text-input::placeholder{color:#888;color:var(--placeholder-color,#888)}.character-count{color:#666;color:var(--secondary-text,#666);font-size:12px;margin-top:5px;text-align:right}.sample-text-button{background:#f8f9fa;background:var(--secondary-bg,#f8f9fa);border:1px solid #ddd;border:1px solid var(--border-color,#ddd);border-radius:6px;color:#333;color:var(--text-color,#333);cursor:pointer;font-size:13px;margin-top:10px;padding:8px 16px;transition:all .2s ease}.sample-text-button:hover{background:#e9ecef;background:var(--hover-bg,#e9ecef);border-color:#007bff;border-color:var(--primary-color,#007bff)}.control-buttons{display:flex;flex-wrap:wrap;gap:15px;margin-bottom:20px}.synthesize-button{background:linear-gradient(135deg,#007bff,#0056b3);border:none;border-radius:8px;box-shadow:0 2px 4px #007bff33;color:#fff;cursor:pointer;font-size:16px;font-weight:600;padding:15px 30px;transition:all .2s ease}.synthesize-button:hover:not(:disabled){background:linear-gradient(135deg,#0056b3,#004085);box-shadow:0 4px 8px #007bff4d;transform:translateY(-1px)}.synthesize-button:disabled{background:#6c757d;background:var(--disabled-bg,#6c757d);box-shadow:none;cursor:not-allowed;transform:none}.play-button{background:linear-gradient(135deg,#28a745,#1e7e34);border:none;border-radius:8px;box-shadow:0 2px 4px #28a74533;color:#fff;cursor:pointer;font-size:16px;font-weight:600;padding:15px 25px;transition:all .2s ease}.play-button:hover{background:linear-gradient(135deg,#1e7e34,#155724);box-shadow:0 4px 8px #28a7454d;transform:translateY(-1px)}.error-message{background:linear-gradient(135deg,#dc3545,#c82333);border-radius:8px;box-shadow:0 2px 4px #dc354533;color:#fff;font-weight:500;margin-bottom:20px;padding:15px}.audio-player{background:#d4edda;background:var(--success-bg,#d4edda);border:1px solid #c3e6cb;border:1px solid var(--success-border,#c3e6cb);border-radius:8px;margin-bottom:20px;padding:20px}.audio-player p{color:#155724;color:var(--success-text,#155724);font-weight:600;margin:0 0 15px}.audio-controls{height:40px;width:100%}.tts-info{background:#f8f9fa;background:var(--info-bg,#f8f9fa);border:1px solid #dee2e6;border:1px solid var(--border-color,#dee2e6);border-radius:8px;margin-top:20px;padding:20px}.tts-info h3{color:#333;color:var(--text-color,#333);font-size:16px;margin:0 0 15px}.tts-info ul{margin:0 0 15px;padding-left:20px}.tts-info li{color:#333;color:var(--text-color,#333);line-height:1.5;margin-bottom:8px}.tts-info p{color:#666;color:var(--secondary-text,#666);font-size:14px;line-height:1.5;margin:0}[data-theme=dark] .language-dropdown,[data-theme=dark] .text-input,[data-theme=dark] .voice-dropdown{background:#2d3748;background:var(--dark-input-bg,#2d3748);border-color:#4a5568;border-color:var(--dark-border,#4a5568);color:#e2e8f0;color:var(--dark-text,#e2e8f0)}[data-theme=dark] .sample-text-button{background:#4a5568;background:var(--dark-secondary-bg,#4a5568);border-color:#4a5568;border-color:var(--dark-border,#4a5568);color:#e2e8f0;color:var(--dark-text,#e2e8f0)}[data-theme=dark] .sample-text-button:hover{background:#2d3748;background:var(--dark-hover-bg,#2d3748)}[data-theme=dark] .audio-player{background:#2d5a3d;background:var(--dark-success-bg,#2d5a3d);border-color:#4a7c59;border-color:var(--dark-success-border,#4a7c59)}[data-theme=dark] .tts-info{background:#2d3748;background:var(--dark-info-bg,#2d3748);border-color:#4a5568;border-color:var(--dark-border,#4a5568)}.text-to-speech-dialog .close-button{background:#0000001a!important;border:1px solid #ddd;border:1px solid var(--border-color,#ddd);color:#333!important;color:var(--text-color,#333)!important}.text-to-speech-dialog .close-button:hover{background:#0003!important;color:#333!important;color:var(--text-color,#333)!important}[data-theme=dark] .text-to-speech-dialog .close-button{background:#ffffff1a!important;border-color:#4a5568;border-color:var(--dark-border,#4a5568);color:#e2e8f0!important;color:var(--dark-text,#e2e8f0)!important}[data-theme=dark] .text-to-speech-dialog .close-button:hover{background:#fff3!important}@media (max-width:768px){.text-to-speech-dialog{margin:10px;width:95%}.language-selection{gap:15px;grid-template-columns:1fr}.control-buttons{flex-direction:column}.play-button,.synthesize-button{width:100%}.tts-content{padding:15px}}@media (max-width:480px){.text-to-speech-dialog{margin:5px;width:98%}.tts-content{padding:10px}.text-input{min-height:100px;padding:12px}.play-button,.synthesize-button{font-size:14px;padding:12px 20px}}.language-prompt-overlay{align-items:center;background:#0009;bottom:0;box-sizing:border-box;display:flex;justify-content:center;left:0;padding:1rem;position:fixed;right:0;top:0;z-index:1001}.language-prompt-modal{animation:languagePromptSlideIn .4s ease-out;background:#fff;border-radius:20px;box-shadow:0 25px 60px #0000004d;display:flex;flex-direction:column;max-height:90vh;max-width:600px;overflow:hidden;position:relative;width:100%}@keyframes languagePromptSlideIn{0%{opacity:0;transform:translateY(-30px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.language-prompt-header{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:2.5rem 2rem;text-align:center}.language-prompt-title{font-size:2.2rem;font-weight:700;margin:0 0 1rem;text-shadow:0 2px 4px #0003}.language-prompt-subtitle{font-size:1.1rem;line-height:1.5;margin:0;opacity:.9}.language-prompt-content{flex:1 1;overflow-y:auto;padding:2rem}.language-prompt-error{background:#ffebee;border-left:4px solid #f44336;border-radius:8px;color:#c62828;font-weight:500;margin-bottom:1.5rem;padding:1rem}.language-options-grid{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));margin-top:1rem}.language-option-card{align-items:center;background:#fff;border:3px solid #e8e8e8;border-radius:16px;color:#333;cursor:pointer;display:flex;flex-direction:column;justify-content:center;min-height:100px;padding:1.5rem 1rem;text-align:center;transition:all .3s ease}.language-option-card:hover:not(:disabled){background:#f8f9ff;border-color:#667eea;box-shadow:0 8px 25px #667eea26;transform:translateY(-4px)}.language-option-card.selected{background:linear-gradient(135deg,#e8f5e8,#f1f8e9);border-color:#4caf50;box-shadow:0 8px 25px #4caf5033;color:#2e7d32;transform:translateY(-2px)}.language-option-card:disabled{cursor:not-allowed;opacity:.6;transform:none}.language-code{background:linear-gradient(135deg,#f0f2ff,#e8ecff);border:2px solid #667eea20;border-radius:8px;color:#667eea;display:block;font-size:1.2rem;font-weight:700;letter-spacing:1px;margin-bottom:.5rem;padding:.5rem 1rem}.language-name{color:#333;font-size:1rem;font-weight:600;margin-bottom:.25rem}.language-native{color:#666;font-size:.85rem;font-style:italic}.language-prompt-footer{align-items:center;background:#f8f9fa;border-top:1px solid #e9ecef;display:flex;justify-content:space-between;padding:1.5rem 2rem}.skip-btn{background:none;border:2px solid #6c757d;border-radius:10px;color:#6c757d;cursor:pointer;font-size:1rem;font-weight:600;padding:.75rem 1.5rem;transition:all .2s ease}.skip-btn:hover:not(:disabled){background:#6c757d;color:#fff;transform:translateY(-1px)}.confirm-btn{background:linear-gradient(135deg,#4caf50,#45a049);border:none;border-radius:10px;box-shadow:0 4px 15px #4caf504d;color:#fff;cursor:pointer;font-size:1rem;font-weight:600;padding:.75rem 2rem;transition:all .2s ease}.confirm-btn:hover:not(:disabled){box-shadow:0 6px 20px #4caf5066;transform:translateY(-1px)}.confirm-btn:disabled{background:#ccc;box-shadow:none;cursor:not-allowed;transform:none}@media (prefers-color-scheme:dark){.language-prompt-modal{background:#1e1e1e;color:#fff}.language-option-card{background:#2d2d2d;border-color:#444;color:#e0e0e0}.language-option-card:hover:not(:disabled){background:#2a3284;border-color:#667eea}.language-option-card.selected{background:linear-gradient(135deg,#1b4332,#2d5a27);border-color:#4caf50;color:#81c784}.language-code{background:linear-gradient(135deg,#2a2d5f,#1e2344);border-color:#667eea40;color:#8fa5ff}.language-name{color:#e0e0e0}.language-native{color:#b0b0b0}.language-prompt-footer{background:#2a2a2a;border-top-color:#444}.skip-btn{border-color:#888;color:#888}.skip-btn:hover:not(:disabled){background:#888;color:#1e1e1e}.language-prompt-error{background:#f4433626;border-left-color:#f44336;color:#ff6b6b}}@media (max-width:600px){.language-prompt-overlay{padding:.5rem}.language-prompt-modal{border-radius:16px;max-width:100%}.language-prompt-header{padding:2rem 1.5rem}.language-prompt-title{font-size:1.8rem}.language-prompt-content{padding:1.5rem}.language-options-grid{gap:.75rem;grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.language-option-card{min-height:80px;padding:1rem .5rem}.language-flag{font-size:2rem}.language-name{font-size:.9rem}.language-prompt-footer{flex-direction:column;gap:1rem;padding:1rem 1.5rem}.confirm-btn,.skip-btn{width:100%}}@media (max-width:400px){.language-options-grid{grid-template-columns:repeat(2,1fr)}.language-option-card{min-height:70px;padding:.75rem .25rem}.language-flag{font-size:1.75rem;margin-bottom:.25rem}.language-name{font-size:.8rem}}.backend-status{animation:slideIn .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid;border-radius:8px;box-shadow:0 4px 12px #00000026;font-size:.9rem;max-width:300px;padding:.75rem 1rem;position:fixed;right:1rem;top:1rem;z-index:9999}.backend-status.info{background:#3b82f61a;border-color:#3b82f64d;color:#1d4ed8}.backend-status.warning{background:#f59e0b1a;border-color:#f59e0b4d;color:#92400e}.backend-status.error{background:#ef44441a;border-color:#ef44444d;color:#dc2626}.status-content{align-items:center;display:flex;flex-wrap:wrap;gap:.5rem}.status-icon{flex-shrink:0;font-size:1rem}.status-message{flex:1 1;font-weight:500}.status-time{flex-basis:100%;font-size:.75rem;margin-top:.25rem;opacity:.8}@keyframes slideIn{0%{opacity:0;transform:translateX(100%)}to{opacity:1;transform:translateX(0)}}@media (max-width:768px){.backend-status{font-size:.85rem;left:.5rem;max-width:none;right:.5rem;top:.5rem}.status-content{align-items:flex-start}.status-message{flex-basis:100%}}
/*# sourceMappingURL=main.f1eda91a.css.map*/