*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;color:#333}.language-switcher{position:fixed;top:20px;right:20px;z-index:1000}.lang-switch-btn{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.25rem;background:#fff;border:2px solid #667eea;border-radius:25px;cursor:pointer;font-weight:600;color:#667eea;transition:all .3s ease;box-shadow:0 4px 12px #0000001a}.lang-switch-btn:hover{background:#667eea;color:#fff;transform:translateY(-2px);box-shadow:0 6px 16px #667eea4d}#lang-icon{font-size:1.2rem}#lang-text{font-size:.9rem}.screen{min-height:100vh;display:flex;align-items:center;justify-content:center}.hidden{display:none!important}.container{max-width:1200px;width:100%;padding:2rem}#login-screen .container{text-align:center;background:#fff;border-radius:20px;padding:4rem;box-shadow:0 20px 60px #0000004d;max-width:800px}#login-screen h1{font-size:3rem;margin-bottom:1rem;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.hero-description{margin:2rem 0;text-align:left}.hero-description h2{font-size:1.8rem;color:#333;margin-bottom:.5rem;text-align:center}.hero-description .subtitle{font-size:1.2rem;color:#666;margin-bottom:2rem;text-align:center}.features{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem;margin:2rem 0}.feature{display:flex;align-items:center;gap:1rem;padding:1rem;background:#f8f9fa;border-radius:10px;transition:all .3s ease}.feature:hover{background:#e9ecef;transform:translate(5px)}.feature-icon{font-size:2rem;flex-shrink:0}.feature-text{font-size:1rem;color:#333;font-weight:500}.method-description{margin-top:2rem;padding:1.5rem;background:linear-gradient(135deg,#667eea1a,#764ba21a);border-left:4px solid #667eea;border-radius:10px;font-size:1rem;line-height:1.6;color:#555;text-align:left}#login-screen .btn-primary{margin-top:2rem}.login-buttons{display:flex;flex-direction:column;gap:1rem;margin-top:2rem}.btn-google,.btn-mailru{display:flex;align-items:center;justify-content:center;padding:1rem 2rem;border:none;border-radius:10px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;text-decoration:none;color:#fff}.btn-google{background:#fff;color:#333;border:2px solid #ddd}.btn-google:hover{transform:translateY(-2px);box-shadow:0 10px 20px #0000001a;border-color:#4285f4}.btn-mailru{background:linear-gradient(135deg,#168de2,#1a6db8)}.btn-mailru:hover{transform:translateY(-2px);box-shadow:0 10px 20px #168de266}.btn{padding:1rem 2rem;border:none;border-radius:10px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease}.btn-primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 20px #667eea66}.btn-secondary{background:#6c757d;color:#fff}.btn-secondary:hover{background:#5a6268}.header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;background:#fff;padding:1.5rem;border-radius:15px;box-shadow:0 5px 15px #0000001a}.user-info{display:flex;gap:1rem;align-items:center}.search-bar{margin-bottom:1.5rem}.search-bar input{width:100%;padding:1rem;border:2px solid #ddd;border-radius:10px;font-size:1rem;transition:border-color .3s ease}.search-bar input:focus{outline:none;border-color:#667eea}.filters{display:flex;gap:1.5rem;margin-bottom:2rem;padding:1.5rem;background:#fff;border-radius:15px;box-shadow:0 2px 10px #0000000d;flex-wrap:wrap}.filter-group{display:flex;flex-direction:column;gap:.5rem;flex:1;min-width:150px}.filter-group label{font-weight:600;color:#333;font-size:.9rem}.filter-group select{padding:.75rem;border:2px solid #ddd;border-radius:8px;font-size:1rem;background:#fff;cursor:pointer;transition:all .3s ease}.filter-group select:hover{border-color:#667eea}.filter-group select:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.book-card{background:#fff;border-radius:15px;padding:2rem;transition:all .3s ease;box-shadow:0 5px 15px #0000001a;display:flex;flex-direction:column;gap:1rem}.book-card:hover{transform:translateY(-5px);box-shadow:0 10px 25px #0003}.book-header{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem}.book-actions{display:flex;align-items:center;gap:.5rem}.btn-delete{background:none;border:none;font-size:1.3rem;cursor:pointer;padding:.3rem .5rem;border-radius:4px;transition:all .2s;opacity:.6}.btn-delete:hover{opacity:1;background:#dc35451a;transform:scale(1.1)}.book-header h3{margin:0;color:#333;font-size:1.3rem;flex:1}.badge{padding:.25rem .75rem;border-radius:20px;font-size:.85rem;font-weight:600;white-space:nowrap}.badge-new{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.badge-progress{background:linear-gradient(135deg,#f093fb,#f5576c);color:#fff}.book-card .author{color:#666;font-size:1rem;margin:0}.book-card .description{color:#888;font-size:.9rem;line-height:1.5;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.book-meta{display:flex;gap:1rem;flex-wrap:wrap}.book-meta span{font-size:.85rem;color:#666;padding:.25rem .75rem;background:#f8f9fa;border-radius:15px}.progress-section{margin-top:.5rem}.progress-bar{width:100%;height:8px;background:#e9ecef;border-radius:10px;overflow:hidden;margin-bottom:.5rem}.progress-fill{height:100%;background:linear-gradient(90deg,#667eea,#764ba2);border-radius:10px;transition:width .3s ease}.progress-stats{display:flex;justify-content:space-between;font-size:.85rem;color:#666}.book-card .btn{margin-top:auto;width:100%}.no-books{text-align:center;padding:4rem 2rem;color:#999;font-size:1.2rem}.book-card .language{display:inline-block;padding:.25rem .75rem;background:#e9ecef;border-radius:20px;font-size:.8rem;margin-top:.5rem}.trainer-container{width:100%;max-width:1400px;padding:2rem}.trainer-header{display:flex;justify-content:space-between;align-items:center;background:#fff;padding:1.5rem;border-radius:15px;margin-bottom:2rem;box-shadow:0 5px 15px #0000001a}.stats{display:flex;gap:2rem}.stat{text-align:center}.stat-label{display:block;font-size:.8rem;color:#666;margin-bottom:.25rem}.stat-value{display:block;font-size:1.5rem;font-weight:700;color:#667eea}.text-display{background:#fff;padding:3rem;border-radius:15px;margin-bottom:2rem;box-shadow:0 5px 15px #0000001a;min-height:200px}.text-content{font-size:1.5rem;line-height:2;letter-spacing:.5px;white-space:pre-wrap}.char{position:relative}.char[data-newline=true]{color:transparent;font-size:0}.char[data-newline=true]:before{content:"↵";color:#6c757d;opacity:.4;font-size:14px;margin-left:2px;margin-right:2px}.char.correct{color:#28a745}.char.incorrect{color:#dc3545;background:#ffe6e6}.char.current{background:#fff3cd;animation:blink 1s infinite}@keyframes blink{0%,50%,to{opacity:1}25%,75%{opacity:.5}}.error-message{margin-top:1rem;padding:1rem;background:#fff3cd;border-left:4px solid #ffc107;border-radius:5px;font-weight:600}.correction-panel{margin-top:2rem;padding:2rem;background:linear-gradient(135deg,#fff3cd,#ffe6a0);border:3px solid #ffc107;border-radius:15px;box-shadow:0 8px 24px #ffc1074d;animation:slideIn .3s ease}@keyframes slideIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.correction-header{margin-bottom:1rem}.correction-title{color:#dc3545;font-size:1.5rem;margin-bottom:.5rem}.correction-instruction{font-size:1.1rem;color:#333;margin-bottom:1rem;font-weight:600}.correction-progress{font-size:1rem;color:#666;margin-bottom:1rem}.correction-input{background:#fff;padding:1rem;border-radius:10px;font-size:1.3rem;font-family:monospace;border:2px solid #ffc107;min-height:60px;display:flex;align-items:center}.correction-text{color:#667eea;font-weight:700}.correction-cursor{color:#667eea;animation:blink 1s infinite;margin-left:2px}.completion-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:2000;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.completion-content{background:#fff;border-radius:20px;padding:3rem;max-width:600px;width:90%;box-shadow:0 20px 60px #0000004d;animation:scaleIn .3s ease;text-align:center}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.completion-content h2{font-size:2.5rem;margin-bottom:1rem;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.completion-message{font-size:1.3rem;color:#333;margin-bottom:2rem;font-weight:600}.completion-stats{background:#f8f9fa;padding:1.5rem;border-radius:15px;margin-bottom:2rem;text-align:left}.completion-stats h3{color:#667eea;margin-bottom:1rem}.completion-stats p{font-size:1.1rem;color:#333;margin-bottom:.5rem}.completion-buttons{display:flex;gap:1rem;justify-content:center}.keyboard-container{background:#fff;padding:2rem;border-radius:15px;box-shadow:0 5px 15px #0000001a}.keyboard-language{display:flex;gap:1rem;margin-bottom:1rem;justify-content:center}.lang-btn{padding:.5rem 1.5rem;border:2px solid #667eea;background:#fff;color:#667eea;border-radius:10px;cursor:pointer;font-weight:600;transition:all .3s ease}.lang-btn.active{background:#667eea;color:#fff}.keyboard{display:flex;flex-direction:column;gap:.5rem;align-items:center}.keyboard-row{display:flex;gap:.5rem}.key{min-width:50px;height:50px;display:flex;align-items:center;justify-content:center;background:#f8f9fa;border:2px solid #dee2e6;border-radius:8px;font-weight:600;transition:all .1s ease;-webkit-user-select:none;user-select:none}.key.pressed{background:#667eea;color:#fff;transform:scale(.95);box-shadow:inset 0 2px 4px #0003}.key.space{min-width:300px}.key.wide{min-width:80px}.key.extra-wide{min-width:100px}.admin-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;padding-bottom:1rem;border-bottom:2px solid #e9ecef}.admin-header h1{color:#2c3e50;margin:0}.btn-admin{background:linear-gradient(135deg,#ff6b6b,#ee5a24);color:#fff;border:none;padding:.5rem 1rem;border-radius:8px;font-weight:500;cursor:pointer;transition:all .3s ease;text-decoration:none;display:inline-flex;align-items:center;gap:.5rem}.btn-admin:hover{transform:translateY(-2px);box-shadow:0 4px 12px #ee5a244d}.upload-section{background:#fff;padding:2rem;border-radius:12px;box-shadow:0 4px 20px #0000001a;border:1px solid #e9ecef}.upload-section h2{color:#2c3e50;margin-bottom:.5rem}.upload-section p{color:#6c757d;margin-bottom:2rem;line-height:1.6}.upload-form{display:flex;flex-direction:column;gap:1.5rem}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-group label{font-weight:600;color:#2c3e50;font-size:.95rem}.form-group input,.form-group select{padding:.75rem;border:2px solid #e9ecef;border-radius:8px;font-size:1rem;transition:border-color .3s ease}.form-group input:focus,.form-group select:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.form-group small{color:#6c757d;font-size:.85rem}.form-actions{display:flex;justify-content:flex-start;margin-top:1rem}.upload-progress{margin-top:2rem;padding:1.5rem;background:#f8f9fa;border-radius:8px;border:1px solid #e9ecef}.progress-bar{width:100%;height:12px;background:#e9ecef;border-radius:6px;overflow:hidden;margin-bottom:1rem}.progress-fill{height:100%;background:linear-gradient(90deg,#667eea,#764ba2);width:0%;transition:width .3s ease;animation:progress-animation 2s infinite}@keyframes progress-animation{0%{width:0%}50%{width:70%}to{width:100%}}.upload-result{margin-top:2rem}.success-message{padding:1.5rem;background:linear-gradient(135deg,#00b894,#00a085);color:#fff;border-radius:8px;box-shadow:0 4px 12px #00b8944d}.success-message h3{margin:0 0 1rem;font-size:1.2rem}.success-message p{margin:.5rem 0;opacity:.95}.error-message{padding:1.5rem;background:linear-gradient(135deg,#e17055,#d63031);color:#fff;border-radius:8px;box-shadow:0 4px 12px #e170554d}.error-message h3{margin:0 0 1rem;font-size:1.2rem}.error-message p{margin:.5rem 0;opacity:.95}.fb2-metadata{margin-top:1rem;padding:1rem;background:#ffffff1a;border-radius:6px;border-left:4px solid rgba(255,255,255,.3)}.fb2-metadata h4{margin:0 0 .5rem;font-size:1rem;opacity:.9}.fb2-metadata p{margin:.3rem 0;font-size:.9rem;opacity:.85}.books-management-section{margin-top:40px;padding-top:30px;border-top:2px solid #dee2e6}.books-management-section h2{color:#495057;margin-bottom:10px}.admin-books-list{margin-top:20px}.admin-book-item{display:flex;justify-content:space-between;align-items:center;padding:15px;margin:10px 0;background:#f8f9fa;border:1px solid #dee2e6;border-radius:8px}.admin-book-info{flex:1}.admin-book-title{font-weight:700;color:#212529;margin-bottom:5px}.admin-book-meta{font-size:14px;color:#6c757d}.admin-book-actions{display:flex;gap:10px}.btn-danger{background-color:#dc3545;color:#fff;border:none;padding:8px 16px;border-radius:4px;cursor:pointer;font-size:14px;transition:background-color .2s}.btn-danger:hover{background-color:#c82333}.btn-danger:disabled{background-color:#6c757d;cursor:not-allowed}.upload-info{background:#f8f9fa;border:1px solid #dee2e6;border-radius:8px;padding:20px;margin:20px 0}.info-section{margin-bottom:20px}.info-section:last-child{margin-bottom:0}.info-section h4{margin:0 0 10px;color:#495057;font-size:16px}.info-section ul{margin:10px 0;padding-left:20px}.info-section li{margin:5px 0}.info-section p{margin:10px 0 0;color:#6c757d;line-height:1.4}.book-card.personal{border-left:4px solid #007bff}.book-card.public{border-left:4px solid #28a745}.book-type-badge{display:inline-block;padding:2px 8px;border-radius:12px;font-size:12px;font-weight:700;margin-left:8px}.book-type-badge.personal{background-color:#e3f2fd;color:#1976d2}.book-type-badge.public{background-color:#e8f5e8;color:#388e3c}.modal{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.modal.hidden{display:none}.modal-content{background-color:#fff;border-radius:8px;padding:0;max-width:500px;width:90%;max-height:90vh;overflow-y:auto;box-shadow:0 4px 6px #0000001a}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid #e0e0e0}.modal-header h2{margin:0;font-size:24px;color:#333}.modal-close{background:none;border:none;font-size:28px;cursor:pointer;color:#999;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center}.modal-close:hover{color:#333}.modal-body{padding:20px}.info-text{background-color:#e3f2fd;padding:12px;border-radius:4px;margin-bottom:20px;color:#1976d2}.warning-text{background-color:#fff3cd;border-left:4px solid #ffc107;padding:12px;border-radius:4px;margin-bottom:20px;color:#856404;font-size:14px;line-height:1.5}.warning-text strong{display:block;margin-bottom:8px;color:#856404}.app-footer{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:30px 20px;margin-top:50px;text-align:center}.footer-content{max-width:1200px;margin:0 auto}.footer-content p{margin:10px 0}.copyright{font-size:14px;font-weight:500}.footer-links{margin:15px 0}.footer-link{color:#fff;text-decoration:none;font-size:14px;transition:opacity .3s}.footer-link:hover{opacity:.8;text-decoration:underline}.separator{margin:0 15px;opacity:.6}.footer-note{font-size:12px;opacity:.8;margin-top:10px}.file-input-wrapper{display:flex;align-items:center;gap:15px;margin-top:8px}.file-input-button{padding:10px 20px;background:#3498db;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:14px;transition:background .3s;display:flex;align-items:center;gap:8px}.file-input-button:hover{background:#2980b9}.file-name{color:#666;font-size:14px;font-style:italic}.toast-notification{position:fixed;top:80px;left:50%;transform:translate(-50%) translateY(-100px);padding:16px 24px;border-radius:8px;font-size:16px;font-weight:600;box-shadow:0 4px 12px #00000026;z-index:10000;opacity:0;transition:all .3s ease;max-width:90%;text-align:center}.toast-notification.show{opacity:1;transform:translate(-50%) translateY(0)}.toast-info{background:#3498db;color:#fff}.toast-warning{background:#f39c12;color:#fff;font-size:18px;animation:pulse .5s ease-in-out 3}.toast-success{background:#27ae60;color:#fff}.toast-error{background:#e74c3c;color:#fff}@keyframes pulse{0%,to{transform:translate(-50%) translateY(0) scale(1)}50%{transform:translate(-50%) translateY(0) scale(1.05)}}@media (max-width: 768px){.language-switcher{top:10px;right:10px}.lang-switch-btn{padding:.5rem 1rem;font-size:.85rem}#lang-icon{font-size:1rem}#lang-text{font-size:.8rem}.login-container{padding:20px;margin:20px}.app-title{font-size:2rem}.app-subtitle{font-size:1rem}.features{flex-direction:column;gap:15px}.feature,.method-description{font-size:.9rem}.login-buttons{flex-direction:column;gap:15px}.btn{width:100%;font-size:.9rem;padding:12px 20px}.books-container{padding:15px}.books-header{flex-direction:column;align-items:flex-start;gap:15px}.books-header h1{font-size:1.5rem}.user-info{font-size:.85rem}.filters{flex-direction:column;gap:10px}.filter-group,.filter-group select{width:100%}.books-grid{grid-template-columns:1fr;gap:15px}.book-card{padding:15px}.book-title{font-size:1.1rem}.book-author{font-size:.85rem}.trainer-container{padding:15px}.trainer-header{flex-direction:column;gap:10px;padding:15px}.stats{flex-direction:column;gap:10px;width:100%}.stat-item{font-size:.85rem}.text-display{padding:20px 15px;font-size:1rem;line-height:1.6}.keyboard-container{padding:15px}.keyboard{transform:scale(.7);transform-origin:top center}.correction-overlay{padding:20px}.correction-content{padding:20px;max-width:90%}.correction-content h2{font-size:1.3rem}.correction-word{font-size:1.5rem}.admin-panel{padding:15px}.upload-form{padding:20px}.app-footer{padding:20px 15px}.footer-content p{font-size:.85rem}.footer-links{flex-direction:column;gap:10px}.separator{display:none}.footer-note{font-size:.75rem;line-height:1.4}}@media (max-width: 480px){.app-title{font-size:1.5rem}.app-subtitle{font-size:.9rem}.login-container{margin:10px;padding:15px}.text-display{font-size:.9rem}.keyboard{transform:scale(.5)}.book-card{padding:12px}}#login-screen{position:relative;overflow:hidden}.trainer-preview-bg{position:absolute;top:50%;opacity:.15;pointer-events:none;z-index:0}.trainer-preview-right{right:-100px;transform:translateY(-50%) rotate(5deg);animation:floatPreviewRight 6s ease-in-out infinite}.trainer-preview-left{left:-100px;transform:translateY(-50%) rotate(-5deg);animation:floatPreviewLeft 6s ease-in-out infinite;animation-delay:3s}@keyframes floatPreviewRight{0%,to{transform:translateY(-50%) rotate(5deg)}50%{transform:translateY(-45%) rotate(3deg)}}@keyframes floatPreviewLeft{0%,to{transform:translateY(-50%) rotate(-5deg)}50%{transform:translateY(-45%) rotate(-3deg)}}.preview-window{background:#fff;border-radius:20px;padding:2.5rem;box-shadow:0 20px 60px #0000004d;border:3px solid #667eea;min-width:500px}.preview-text{font-size:2.2rem;line-height:2.8;letter-spacing:1px;font-family:Courier New,monospace;margin-bottom:1.5rem}.char-demo{display:inline-block;position:relative;transition:all .3s ease}.char-demo.correct{color:#28a745;font-weight:700}.char-demo.incorrect{color:#dc3545;background:#ffe6e6;padding:0 6px;border-radius:6px;animation:shake .5s ease-in-out infinite}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.preview-error-hint{padding:1.2rem;background:linear-gradient(135deg,#fff3cd,#ffe6e6);border-radius:12px;border-left:5px solid #dc3545;font-size:1.1rem;color:#721c24;font-weight:600;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.8}}#login-screen .container{position:relative;z-index:1}@media (max-width: 1200px){.trainer-preview-bg{opacity:.1;right:-150px}.preview-window{min-width:400px;padding:2rem}.preview-text{font-size:1.8rem}}@media (max-width: 768px){.trainer-preview-bg{display:none}}:root{--k-white: #ffffff;--k-light-gray: #f0f0f0;--k-medium-gray: #e0e0e0;--k-dark-gray: #d0d0d0;--text-color: #38383a;--k-accent-pressed: #007aff}.keyboard-container{background:var(--k-white);padding:20px;border-radius:12px;box-shadow:0 4px 10px #0000000d;border:1px solid #d1d1d6}.keyboard-row{gap:8px;margin-bottom:8px}.keyboard-row.space-row{margin-top:10px}.key{box-shadow:0 2px #d1d1d6!important;background:var(--k-white)!important;border:1px solid #e5e5ea!important;border-radius:6px;color:var(--text-color);font-size:16px;font-weight:500;width:50px;height:50px;transition:all .1s ease}.key.wide{width:90px;font-size:14px}.key.wide-small{width:70px;font-size:14px}.key.extra-wide{width:100px;font-size:14px}.key.space{width:560px}.key.f-l-index,.key.f-r-index{background-color:var(--k-light-gray)!important}.key.f-l-middle,.key.f-r-middle,.key.f-l-ring,.key.f-r-ring{background-color:var(--k-medium-gray)!important}.key.f-l-pinky,.key.f-r-pinky,.key.wide,.key.wide-small,.key.extra-wide,.key.space{background-color:var(--k-dark-gray)!important}.key.space{background-color:var(--k-light-gray)!important}.key.pressed{transform:translateY(2px);box-shadow:none!important;background-color:#d1d1d6!important;color:var(--k-accent-pressed)!important}.key.space.pressed{background-color:#c4c4c4!important}.progress-section .progress-fill,.book-card .progress-section .progress-fill{animation:none!important}.upload-progress .progress-fill{animation:progress-animation 2s infinite!important}
