*{box-sizing:border-box;margin:0;padding:0}body{font-family:Nunito,sans-serif;background:linear-gradient(135deg,#e8f4fd,#f0e8fd);color:#2c3e50;min-height:100vh;user-select:none;-webkit-user-select:none}#app{min-height:100vh;display:flex;flex-direction:column}.cell-green{background-color:#2ecc71!important;color:#fff!important}.cell-yellow{background-color:#f1c40f!important;color:#2c3e50!important}.cell-orange{background-color:#e67e22!important;color:#fff!important}.cell-red{background-color:#e74c3c!important;color:#fff!important}.cell-unattempted{background-color:#ecf0f1!important;color:#bdc3c7!important}.mult-table,.mult-table *,.table-legend,.table-legend *,.pairs-strip,.mini-cell,.number-badge,.feedback,.nav-btn,.submit-btn,.start-btn,.ready-card h2,.ready-card p,.profile-card,.profile-avatar,.profile-name,.profile-hero-title,.view-title,.progress-labels,.progress-bar-track{user-select:none;-webkit-user-select:none}.app-header{background:#fff;box-shadow:0 2px 12px #00000014;padding:.75rem 1.5rem;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.75rem}.app-title{font-size:1.5rem;font-weight:900;color:#6c3beb;white-space:nowrap}.app-nav{display:flex;gap:.5rem}.nav-btn{font-family:Nunito,sans-serif;font-size:1rem;font-weight:700;padding:.5rem 1.25rem;border-radius:2rem;border:3px solid #d0c0f8;background:#fff;color:#6c3beb;cursor:pointer;transition:all .2s}.nav-btn:hover{border-color:#6c3beb;background:#f3eeff}.nav-btn.active{background:#6c3beb;border-color:#6c3beb;color:#fff}.app-main{flex:1;padding:2rem 1.5rem;display:flex;justify-content:center}.profile-badge{display:flex;align-items:center;gap:.5rem;font-size:1rem;font-weight:800;color:#6c3beb}.switch-btn{font-family:Nunito,sans-serif;font-size:.85rem;font-weight:700;padding:.3rem .8rem;border-radius:1rem;border:2px solid #d0c0f8;background:#fff;color:#6c3beb;cursor:pointer;transition:all .2s}.switch-btn:hover{border-color:#6c3beb;background:#f3eeff}.practice-sub-header{background:transparent;padding:.5rem 1.5rem 0;display:flex;align-items:center;gap:.45rem;font-size:.82rem;font-weight:700}.sub-header-label{color:#95a5a6}.sub-header-sep{color:#d0c0f8}.sub-header-change{font-family:Nunito,sans-serif;font-size:.82rem;font-weight:700;color:#6c3beb;background:none;border:none;cursor:pointer;padding:0;opacity:.75;transition:opacity .2s}.sub-header-change:hover{opacity:1}.practice-view{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem;width:100%;max-width:600px;padding-top:2rem}.question-card{background:#fff;border-radius:2rem;padding:2.5rem 3rem;box-shadow:0 8px 32px #6c3beb1f;display:flex;flex-direction:column;align-items:center;gap:1.5rem;width:100%}.question-area{display:flex;align-items:center;gap:.75rem;font-size:4rem;font-weight:900;color:#2c3e50;direction:ltr}.factor{min-width:2.5rem;text-align:center;color:#6c3beb}.operator{color:#95a5a6;font-weight:600}.answer-input{width:7rem;font-family:Nunito,sans-serif;font-size:3rem;font-weight:800;text-align:center;border:4px solid #d0c0f8;border-radius:1rem;padding:.1rem .25rem;outline:none;transition:border-color .2s;-moz-appearance:textfield;color:#2c3e50}.answer-input:focus{border-color:#6c3beb}.answer-input::-webkit-outer-spin-button,.answer-input::-webkit-inner-spin-button{-webkit-appearance:none}.answer-input:disabled{background:#f8f8f8;border-color:#e0e0e0}.submit-btn{font-family:Nunito,sans-serif;font-size:1.4rem;font-weight:800;padding:.75rem 3rem;border-radius:2rem;border:none;background:#6c3beb;color:#fff;cursor:pointer;transition:all .2s;box-shadow:0 4px 12px #6c3beb4d}.submit-btn:hover:not(:disabled){background:#5a2ed6;transform:translateY(-2px);box-shadow:0 6px 16px #6c3beb66}.submit-btn:disabled{background:#c0b0f0;cursor:default;transform:none;box-shadow:none}.feedback-area{min-height:3.5rem;display:flex;align-items:center;justify-content:center}.feedback{font-size:1.8rem;font-weight:800;text-align:center;padding:.5rem 1.5rem;border-radius:1rem}.feedback.correct{background:#d5f5e3;color:#1e8449}.feedback.wrong{background:#fde8e8;color:#c0392b}.feedback-enter-active,.feedback-leave-active{transition:opacity .3s,transform .3s}.feedback-enter-from,.feedback-leave-to{opacity:0;transform:scale(.8)}.ready-card{background:#fff;border-radius:2rem;padding:3rem;box-shadow:0 8px 32px #6c3beb1f;display:flex;flex-direction:column;align-items:center;gap:1.25rem;text-align:center;max-width:420px;width:100%}.ready-emoji{font-size:4rem}.ready-title{font-size:2rem;font-weight:900;color:#6c3beb}.ready-subtitle{font-size:1.1rem;color:#7f8c8d;font-weight:600}.start-btn{font-family:Nunito,sans-serif;font-size:1.4rem;font-weight:800;padding:.85rem 3rem;border-radius:2rem;border:none;background:#6c3beb;color:#fff;cursor:pointer;transition:all .2s;box-shadow:0 4px 12px #6c3beb4d;margin-top:.5rem}.start-btn:hover:not(:disabled){background:#5a2ed6;transform:translateY(-2px);box-shadow:0 6px 16px #6c3beb66}.start-btn:disabled{background:#c0b0f0;cursor:default;box-shadow:none}.practice-status-hint{font-size:.85rem;font-weight:700;color:#95a5a6;text-align:center;min-height:1.2em}.number-selector{display:flex;flex-direction:column;align-items:center;gap:.6rem;width:100%}.number-selector-label{font-size:.95rem;font-weight:700;color:#6c3beb;text-align:right;width:100%}.number-buttons{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center}.number-toggle{font-family:Nunito,sans-serif;font-size:1.1rem;font-weight:800;width:2.6rem;height:2.6rem;border-radius:.75rem;border:3px solid #d0c0f8;background:#fff;color:#6c3beb;cursor:pointer;transition:all .15s;position:relative}.number-toggle:hover{border-color:#6c3beb;background:#f3eeff}.number-toggle.selected{background:#6c3beb;border-color:#6c3beb;color:#fff}.number-toggle.selected:after{content:"✓";position:absolute;top:-8px;inset-inline-start:-8px;width:15px;height:15px;background:#27ae60;color:#fff;font-size:9px;font-weight:900;border-radius:50%;line-height:15px;text-align:center;border:2px solid white}.selector-shortcuts{display:flex;gap:.5rem}.shortcut-btn{font-family:Nunito,sans-serif;font-size:.85rem;font-weight:700;padding:.3rem .9rem;border-radius:1rem;border:2px solid #d0c0f8;background:#fff;color:#6c3beb;cursor:pointer;transition:all .15s}.shortcut-btn:hover{border-color:#6c3beb;background:#f3eeff}.table-view{width:100%;max-width:700px;display:flex;flex-direction:column;gap:1.5rem}.view-title{font-size:1.8rem;font-weight:900;color:#6c3beb;text-align:center}.grid-wrapper{overflow-x:auto;background:#fff;border-radius:1.5rem;padding:1.25rem;box-shadow:0 4px 20px #6c3beb1a}.mult-table{border-collapse:separate;border-spacing:4px;margin:0 auto}.mult-table th{font-size:.85rem;font-weight:800;color:#6c3beb;width:2.4rem;height:2.4rem;text-align:center}.mult-cell{width:2.4rem;height:2.4rem;text-align:center;vertical-align:middle;font-size:.85rem;font-weight:700;border-radius:8px;cursor:default;transition:transform .15s;position:relative}.mult-cell:hover{transform:scale(1.4);z-index:10}.table-legend{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center}.legend-item{display:flex;align-items:center;gap:.4rem;font-size:.85rem;font-weight:700}.legend-dot{width:1.1rem;height:1.1rem;border-radius:50%;border:2px solid rgba(0,0,0,.15);flex-shrink:0}.summary-view{width:100%;max-width:720px;display:flex;flex-direction:column;gap:1.5rem}.progress-section{background:#fff;border-radius:1.5rem;padding:1.25rem 1.5rem;box-shadow:0 4px 20px #6c3beb1a;display:flex;flex-direction:column;gap:.75rem}.progress-bar-wrap{display:flex;flex-direction:column;gap:.4rem}.progress-bar-header{display:flex;justify-content:space-between;align-items:baseline}.progress-bar-title{font-size:.85rem;font-weight:700;color:#6c3beb}.progress-bar-fraction{font-size:.85rem;font-weight:700;color:#95a5a6;direction:ltr}.progress-bar-track{background:#ecf0f1;border-radius:1rem;height:1.4rem;overflow:hidden}.progress-bar-fill{height:100%;background:linear-gradient(90deg,#6c3beb,#2ecc71);border-radius:1rem;transition:width .6s ease}.summary-grid{display:flex;flex-direction:column;gap:.6rem}.summary-row{display:flex;align-items:center;gap:.75rem;background:#fff;border-radius:1rem;padding:.6rem 1rem;box-shadow:0 2px 8px #0000000d}.number-badge{width:2.5rem;height:2.5rem;border-radius:50%;font-size:1.1rem;font-weight:900;display:flex;align-items:center;justify-content:center;flex-shrink:0}.pairs-strip{display:flex;gap:4px;flex-wrap:wrap}.mini-cell{width:2rem;height:2rem;border-radius:6px;font-size:.75rem;font-weight:700;display:flex;align-items:center;justify-content:center;cursor:default;transition:transform .15s}.mini-cell:hover{transform:scale(1.3)}.reset-btn{margin-top:1.5rem;font-family:Nunito,sans-serif;font-size:1rem;font-weight:700;padding:.6rem 1.5rem;border-radius:2rem;border:3px solid #e74c3c;background:#fff;color:#e74c3c;cursor:pointer;align-self:center;transition:all .2s}.reset-btn:hover{background:#e74c3c;color:#fff}.recommendation-box{background:#fff;border-radius:1.5rem;padding:1.25rem 1.5rem;box-shadow:0 4px 20px #6c3beb1a;display:flex;flex-direction:column;align-items:center;gap:1rem;text-align:center;border:2px solid #e8d8ff}.recommendation-text{font-size:1rem;font-weight:700;color:#2c3e50;line-height:1.5}.recommendation-numbers{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center}.rec-number-badge{width:2.2rem;height:2.2rem;border-radius:.6rem;background:#f0e8ff;color:#6c3beb;font-size:1rem;font-weight:900;display:inline-flex;align-items:center;justify-content:center}.rec-practice-btn{font-family:Nunito,sans-serif;font-size:1.1rem;font-weight:800;padding:.7rem 2rem;border-radius:2rem;border:none;background:#6c3beb;color:#fff;cursor:pointer;transition:all .2s;box-shadow:0 4px 12px #6c3beb4d}.rec-practice-btn:hover{background:#5a2ed6;transform:translateY(-2px);box-shadow:0 6px 16px #6c3beb66}.progress-stats{display:flex;justify-content:space-around}.progress-stat{display:flex;flex-direction:column;align-items:center;gap:.15rem}.progress-stat-value{font-size:1.8rem;font-weight:900;color:#6c3beb;line-height:1}.progress-stat-total{font-size:1rem;font-weight:700;color:#b0a0e0}.progress-stat-label{font-size:.8rem;font-weight:700;color:#95a5a6}.results-controls{display:flex;flex-direction:column;align-items:center;gap:0}.results-controls .difficulty-bar{margin-top:1rem}.mode-toggle{display:flex;gap:.4rem}.mode-btn{font-family:Nunito,sans-serif;font-size:.95rem;font-weight:700;padding:.45rem 1.25rem;border-radius:2rem;border:2px solid #d0c0f8;background:#fff;color:#6c3beb;cursor:pointer;transition:all .2s}.mode-btn:hover{border-color:#6c3beb;background:#f3eeff}.mode-btn.active{background:#6c3beb;border-color:#6c3beb;color:#fff}.difficulty-bar{display:flex;align-items:center;gap:.4rem}.difficulty-label{font-size:.9rem;font-weight:700;color:#95a5a6}.difficulty-btn{font-family:Nunito,sans-serif;font-size:.9rem;font-weight:700;padding:.35rem 1rem;border-radius:2rem;border:2px solid #d0c0f8;background:#fff;color:#6c3beb;cursor:pointer;transition:all .2s}.difficulty-btn:hover{border-color:#6c3beb;background:#f3eeff}.difficulty-btn.active{background:#6c3beb;border-color:#6c3beb;color:#fff}.profile-view{width:100%;max-width:600px;display:flex;flex-direction:column;align-items:center;gap:2rem}.profile-hero{text-align:center}.profile-hero-emoji{font-size:4rem}.profile-hero-title{font-size:2rem;font-weight:900;color:#6c3beb;margin-top:.5rem}.profile-list{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;width:100%}.profile-card{display:flex;flex-direction:column;align-items:center;gap:.5rem;background:#fff;border:3px solid #d0c0f8;border-radius:1.5rem;padding:1.25rem 1.75rem;cursor:pointer;font-family:Nunito,sans-serif;transition:all .2s;box-shadow:0 4px 12px #6c3beb14;min-width:7rem}.profile-card:hover{border-color:#6c3beb;transform:translateY(-3px);box-shadow:0 8px 20px #6c3beb33}.profile-avatar{font-size:2.5rem;line-height:1}.profile-name{font-size:1.1rem;font-weight:800;color:#2c3e50}.profile-actions-row{display:flex;justify-content:center}.manage-btn{font-family:Nunito,sans-serif;font-size:.95rem;font-weight:700;padding:.45rem 1.1rem;border-radius:1rem;border:2px solid #d0c0f8;background:#fff;color:#6c3beb;cursor:pointer;transition:all .2s}.manage-btn:hover{border-color:#6c3beb;background:#f3eeff}.management-header{display:flex;align-items:center;justify-content:space-between;width:100%;max-width:480px;padding:0 .25rem}.management-title{font-size:1.2rem;font-weight:900;color:#6c3beb}.done-manage-btn{font-family:Nunito,sans-serif;font-size:.95rem;font-weight:700;padding:.4rem 1rem;border-radius:1rem;border:2px solid #6c3beb;background:#6c3beb;color:#fff;cursor:pointer;transition:all .2s}.done-manage-btn:hover{background:#5a2ed6}.management-list{display:flex;flex-direction:column;gap:.5rem;width:100%;max-width:480px}.management-row{display:flex;align-items:center;gap:.75rem;background:#fff;border-radius:1rem;padding:.75rem 1rem;box-shadow:0 2px 8px #0000000f}.management-avatar{font-size:1.8rem;line-height:1}.management-name{flex:1;font-size:1.1rem;font-weight:800;color:#2c3e50}.edit-btn{font-family:Nunito,sans-serif;font-size:.85rem;font-weight:700;padding:.35rem .75rem;border-radius:.75rem;border:2px solid #d0c0f8;background:#fff;color:#6c3beb;cursor:pointer;white-space:nowrap;transition:all .2s}.edit-btn:hover{border-color:#6c3beb;background:#f3eeff}.delete-btn{font-family:Nunito,sans-serif;font-size:.9rem;font-weight:700;padding:.4rem .9rem;border-radius:.75rem;border:2px solid #e74c3c;background:#fff;color:#e74c3c;cursor:pointer;transition:all .2s}.delete-btn:hover{background:#e74c3c;color:#fff}.edit-row{width:100%}.edit-row-controls{display:flex;align-items:center;gap:.5rem}.save-edit-btn{font-family:Nunito,sans-serif;font-size:.85rem;font-weight:700;padding:.35rem .75rem;border-radius:.75rem;border:none;background:#6c3beb;color:#fff;cursor:pointer;white-space:nowrap;transition:all .2s}.save-edit-btn:disabled{background:#c0b0f0;cursor:default}.save-edit-btn:hover:not(:disabled){background:#5a2ed6}.cancel-edit-btn{font-family:Nunito,sans-serif;font-size:.85rem;font-weight:700;padding:.35rem .75rem;border-radius:.75rem;border:2px solid #bdc3c7;background:#fff;color:#7f8c8d;cursor:pointer;white-space:nowrap;transition:all .2s}.cancel-edit-btn:hover{border-color:#7f8c8d}.profile-empty{color:#95a5a6;font-weight:700;font-size:1rem;text-align:right}.profile-divider{font-size:.9rem;font-weight:700;color:#95a5a6;text-transform:uppercase;letter-spacing:.05em}.new-profile-section{display:flex;flex-direction:column;align-items:center;gap:.75rem;width:100%;max-width:480px}.new-profile-form{display:flex;gap:.75rem;width:100%}.new-profile-btn{font-family:Nunito,sans-serif;font-size:1.1rem;font-weight:800;padding:.65rem 1.25rem;border-radius:1rem;border:none;background:#6c3beb;color:#fff;cursor:pointer;transition:all .2s;white-space:nowrap}.new-profile-btn:hover:not(:disabled){background:#5a2ed6}.new-profile-btn:disabled{background:#c0b0f0;cursor:default}.profile-error{color:#e74c3c;font-weight:700;font-size:.95rem}.input-with-emoji{flex:1;position:relative;display:flex;align-items:center;border:3px solid #d0c0f8;border-radius:1rem;background:#fff;transition:border-color .2s;min-width:0}.input-with-emoji:focus-within{border-color:#6c3beb}.emoji-in-input-btn{font-size:1.5rem;line-height:1;padding:.45rem .5rem .45rem .65rem;background:none;border:none;border-inline-end:2px solid #e8d8ff;cursor:pointer;flex-shrink:0}.emoji-in-input-btn span{display:inline-block;transition:transform .15s}.emoji-in-input-btn:hover span{transform:scale(1.2)}.inline-text-input{flex:1;font-family:Nunito,sans-serif;font-size:1.1rem;font-weight:700;padding:.55rem .75rem;border:none;outline:none;background:transparent;color:#2c3e50;min-width:0;border-radius:0 .75rem .75rem 0}.inline-text-input::placeholder{color:#bdc3c7;font-weight:600}.emoji-picker--dropdown{position:absolute;bottom:calc(100% + 6px);inset-inline-start:0;inset-inline-end:0;z-index:200;display:flex;flex-wrap:wrap;gap:6px;justify-content:center;background:#fff;border-radius:1rem;padding:.6rem .75rem;box-shadow:0 4px 20px #6c3beb2e;border:2px solid #e0d0ff}.emoji-option{font-size:1.5rem;background:none;border:3px solid transparent;border-radius:.5rem;cursor:pointer;padding:.1rem .2rem;line-height:1;transition:border-color .15s,transform .15s}.emoji-option:hover{transform:scale(1.2)}.emoji-option.selected{border-color:#6c3beb;background:#ede6ff}@media (max-width: 600px){.app-title{font-size:1.1rem}.nav-btn{font-size:.85rem;padding:.4rem .9rem}.question-area{font-size:2.8rem}.answer-input{width:3.5rem;font-size:2.2rem}.mult-cell,.mult-table th{width:1.8rem;height:1.8rem;font-size:.65rem}.app-main{overflow-y:auto;align-items:flex-start}.practice-view{justify-content:flex-start;padding-top:1rem}}