.form-group input,.form-group select{width:100%;padding:10px 12px;border:1px solid #ddd;border-radius:6px;font-size:.95rem;font-family:inherit;transition:all .2s ease}.form-group input:focus,.form-group select:focus{outline:none;border-color:#4a90e2;box-shadow:0 0 0 3px #4a90e21a;background:white}.form-group input:disabled,.form-group select:disabled{background-color:#f5f5f5;color:#666;cursor:not-allowed}.btn{padding:10px 20px;border:none;border-radius:6px;font-size:.95rem;font-weight:500;cursor:pointer;transition:all .2s ease;text-transform:none}.btn-primary{background:#4a90e2;color:#fff}.btn-primary:hover{background:#357abd;transform:translateY(-2px);box-shadow:0 4px 12px #4a90e24d}.student-list-container{background:white;border-radius:12px;overflow:hidden;box-shadow:0 2px 8px #0000001a;animation:fadeInUp .4s ease-out}.student-table{width:100%;border-collapse:collapse}.student-table thead{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;font-weight:600}.student-table th{padding:16px;text-align:left;font-size:.95rem;text-transform:uppercase;letter-spacing:.5px}.student-table tbody tr{border-bottom:1px solid #e0e0e0;transition:all .2s ease}.student-table tbody tr:hover{background-color:#f8f9ff;box-shadow:inset 0 0 0 1px #667eea1a}.student-table td{padding:16px;font-size:.95rem;color:#333}.gpa-badge{display:inline-block;padding:4px 12px;border-radius:20px;font-weight:600;font-size:.9rem}.gpa-4,.gpa-3{background:#d4edda;color:#155724}.gpa-2{background:#fff3cd;color:#856404}.gpa-1,.gpa-0{background:#f8d7da;color:#721c24}@media (max-width: 1024px){.student-table{font-size:.9rem}.student-table th,.student-table td{padding:12px}}@media (max-width: 768px){.student-list-container{overflow-x:auto}.student-table{min-width:800px}}.dialog-content{background:white;border-radius:12px;box-shadow:0 10px 40px #0003;max-width:600px;width:90%;max-height:90vh;overflow-y:auto;animation:slideUp .3s ease-out}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:#f5576c;box-shadow:0 0 0 3px #f5576c1a;background:white}.btn-primary{background:linear-gradient(135deg,#f093fb 0%,#f5576c 100%);color:#fff}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 4px 12px #f5576c4d}.teacher-list-container{background:white;border-radius:12px;overflow:hidden;box-shadow:0 2px 8px #0000001a;animation:fadeInUp .4s ease-out}.teacher-table{width:100%;border-collapse:collapse}.teacher-table thead{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;font-weight:600}.teacher-table th{padding:16px;text-align:left;font-size:.95rem;text-transform:uppercase;letter-spacing:.5px}.teacher-table tbody tr{border-bottom:1px solid #e0e0e0;transition:all .2s ease}.teacher-table tbody tr:hover{background-color:#f8f9ff;box-shadow:inset 0 0 0 1px #667eea1a}.teacher-table td{padding:16px;font-size:.95rem;color:#333}.exp-badge{display:inline-block;padding:4px 12px;border-radius:20px;font-weight:600;font-size:.9rem}.exp-0{background:#e7f3ff;color:#06c}.exp-1{background:#fff7e6;color:#ff9800}.exp-2{background:#e8f5e9;color:#4caf50}.exp-3{background:#f3e5f5;color:#7b1fa2}@media (max-width: 1024px){.teacher-table{font-size:.9rem}.teacher-table th,.teacher-table td{padding:12px}}@media (max-width: 768px){.teacher-list-container{overflow-x:auto}.teacher-table{min-width:900px}}.dialog-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .2s ease-in-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.dialog-content{background:white;border-radius:12px;box-shadow:0 10px 40px #0003;max-width:700px;width:90%;max-height:90vh;overflow-y:auto;animation:slideUp .3s ease-out}.dialog-header{display:flex;justify-content:space-between;align-items:center;padding:24px;border-bottom:1px solid #e0e0e0;position:sticky;top:0;background:white}.dialog-header h2{margin:0;font-size:1.5rem;color:#333}.close-btn{background:none;border:none;font-size:24px;cursor:pointer;color:#666;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s ease}.close-btn:hover{background:#f0f0f0;color:#333}form{padding:24px}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:8px;font-weight:500;color:#333;font-size:.95rem}.form-group input,.form-group select,.form-group textarea{width:100%;padding:10px 12px;border:1px solid #ddd;border-radius:6px;font-size:.95rem;font-family:inherit;transition:all .2s ease}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:#4facfe;box-shadow:0 0 0 3px #4facfe1a;background:white}.form-group input:disabled,.form-group select:disabled,.form-group textarea:disabled{background-color:#f5f5f5;color:#666;cursor:not-allowed}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.dialog-footer{display:flex;justify-content:flex-end;gap:12px;padding:16px 24px;border-top:1px solid #e0e0e0;background:#f9f9f9}.btn-primary{background:linear-gradient(135deg,#4facfe 0%,#00f2fe 100%);color:#fff}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 4px 12px #4facfe4d}.btn-class{background:linear-gradient(135deg,#4facfe 0%,#00f2fe 100%)!important}.btn-secondary{background:#e0e0e0;color:#333}.btn-secondary:hover{background:#d0d0d0}textarea{resize:vertical;font-family:inherit}@media (max-width: 600px){.dialog-content{width:95%;max-height:95vh}.form-row{grid-template-columns:1fr}.dialog-footer{flex-direction:column}.btn{width:100%}}.class-list-container{background:white;border-radius:12px;overflow:hidden;box-shadow:0 2px 8px #0000001a;animation:fadeInUp .4s ease-out}@keyframes fadeInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.class-table{width:100%;border-collapse:collapse}.class-table thead{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;font-weight:600}.class-table th{padding:16px;text-align:left;font-size:.95rem;text-transform:uppercase;letter-spacing:.5px}.class-table tbody tr{border-bottom:1px solid #e0e0e0;transition:all .2s ease}.class-table tbody tr:hover{background-color:#f8f9ff;box-shadow:inset 0 0 0 1px #667eea1a}.class-table td{padding:16px;font-size:.95rem;color:#333}.class-code{display:inline-block;background:#e0f2fe;color:#0369a1;padding:4px 10px;border-radius:6px;font-weight:600;font-size:.85rem}.capacity-info{display:flex;align-items:center;gap:8px}.capacity-bar{width:100px;height:8px;background:#e0e0e0;border-radius:10px;overflow:hidden}.capacity-fill{height:100%;transition:width .3s ease}.capacity-low{background:linear-gradient(90deg,#22c55e 0%,#16a34a 100%)}.capacity-medium{background:linear-gradient(90deg,#f59e0b 0%,#d97706 100%)}.capacity-high{background:linear-gradient(90deg,#ef4444 0%,#dc2626 100%)}.capacity-text{font-size:.85rem;font-weight:600;min-width:45px;text-align:right}.action-buttons{display:flex;gap:8px;align-items:center}.btn-sm{padding:6px 10px!important;font-size:.85rem!important;border:none;border-radius:4px;cursor:pointer;transition:all .2s ease;background:none}.btn-info{background:rgba(74,144,226,.1)!important;color:#4a90e2!important}.btn-info:hover{background:#4a90e2!important;color:#fff!important;transform:translateY(-2px);box-shadow:0 4px 12px #4a90e24d}.btn-warning{background:rgba(255,193,7,.1)!important;color:#ffc107!important}.btn-warning:hover{background:#ffc107!important;color:#fff!important;transform:translateY(-2px);box-shadow:0 4px 12px #ffc1074d}.btn-danger{background:rgba(220,53,69,.1)!important;color:#dc3545!important}.btn-danger:hover{background:#dc3545!important;color:#fff!important;transform:translateY(-2px);box-shadow:0 4px 12px #dc35454d}.empty-message{text-align:center;padding:48px 16px!important;color:#999;font-size:1rem}@media (max-width: 1024px){.class-table{font-size:.9rem}.class-table th,.class-table td{padding:12px}.capacity-bar{width:80px}}@media (max-width: 768px){.class-list-container{overflow-x:auto}.class-table{min-width:950px}}.dialog-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;z-index:1000}.dialog-content{background:white;border-radius:12px;max-width:680px;width:90%;box-shadow:0 10px 40px #0000001f}.dialog-header{padding:20px 24px;border-bottom:1px solid #eee;display:flex;justify-content:space-between;align-items:center}.form-group{margin-bottom:16px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-group input,.form-group select,textarea{width:100%;padding:10px;border:1px solid #ddd;border-radius:6px}.dialog-footer{display:flex;justify-content:flex-end;gap:12px;padding:16px 24px;border-top:1px solid #eee}.btn-primary{background:linear-gradient(135deg,#9f7aea 0%,#6b21a8 100%);color:#fff}.btn-secondary{background:#e0e0e0}@media (max-width:600px){.form-row{grid-template-columns:1fr}}.subject-list-container{background:white;border-radius:12px;overflow:hidden;box-shadow:0 2px 8px #00000014}.subject-table{width:100%;border-collapse:collapse}.subject-table thead{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff}.subject-table th,.subject-table td{padding:14px;text-align:left}.subject-code{background:rgba(102,126,234,.1);color:#667eea;padding:4px 8px;border-radius:6px;font-weight:600}.empty-message{text-align:center;padding:36px;color:#888}.action-buttons{display:flex;gap:8px}.btn-sm{padding:6px 10px!important}@media (max-width: 768px){.subject-table{min-width:800px}}.teacher-eval-dialog{width:90%;max-width:700px}.teacher-eval-dialog h2{color:#2c3e50;margin-bottom:20px;font-size:1.4rem}.teacher-eval-dialog .form-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.teacher-eval-dialog .form-group{display:flex;flex-direction:column}.teacher-eval-dialog label{font-weight:600;margin-bottom:6px;color:#34495e;font-size:.9rem}.teacher-eval-dialog input,.teacher-eval-dialog textarea{padding:8px 10px;border:1px solid #bdc3c7;border-radius:4px;font-family:inherit;font-size:.95rem}.teacher-eval-dialog input:focus,.teacher-eval-dialog textarea:focus{outline:none;border-color:#3498db;box-shadow:0 0 4px #3498db4d}.teacher-eval-dialog input:disabled,.teacher-eval-dialog textarea:disabled{background-color:#ecf0f1;cursor:not-allowed}.teacher-eval-dialog textarea{resize:vertical;line-height:1.4}.teacher-eval-dialog .dialog-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:25px;padding-top:15px;border-top:1px solid #ecf0f1}.teacher-eval-dialog .btn{padding:8px 16px;font-size:.95rem;border:none;border-radius:4px;cursor:pointer;font-weight:500;transition:all .2s}.teacher-eval-dialog .btn-primary{background-color:#3498db;color:#fff}.teacher-eval-dialog .btn-primary:hover{background-color:#2980b9;box-shadow:0 2px 6px #3498db4d}.teacher-eval-dialog .btn-secondary{background-color:#95a5a6;color:#fff}.teacher-eval-dialog .btn-secondary:hover{background-color:#7f8c8d}.teacher-eval-list-container{width:100%;overflow-x:auto;background:white;border-radius:6px;box-shadow:0 1px 3px #0000001a}.teacher-eval-table{width:100%;border-collapse:collapse;font-size:.95rem}.teacher-eval-table thead{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;position:sticky;top:0}.teacher-eval-table th{padding:12px 10px;text-align:left;font-weight:600;border-bottom:2px solid rgba(102,126,234,.3)}.teacher-eval-table td{padding:10px;border-bottom:1px solid #ecf0f1}.teacher-eval-table tbody tr{transition:background-color .2s}.teacher-eval-table tbody tr:hover{background-color:#f8f9ff}.teacher-eval-table tbody tr:nth-child(2n){background-color:#f8f9ff}.teacher-eval-table .empty-message{text-align:center;padding:30px!important;color:#7f8c8d;font-style:italic}.teacher-eval-table .average-score{font-weight:600;color:#27ae60;background-color:#d5f4e6;padding:6px 10px;border-radius:4px;display:inline-block}.teacher-eval-table .action-buttons{display:flex;gap:6px}.teacher-eval-table .btn{padding:6px 10px;border:none;border-radius:4px;cursor:pointer;font-size:.9rem;transition:all .2s}.teacher-eval-table .btn-sm{padding:5px 8px;font-size:.85rem}.teacher-eval-table .btn-info{background-color:#3498db;color:#fff}.teacher-eval-table .btn-info:hover{background-color:#2980b9;transform:translateY(-2px);box-shadow:0 2px 4px #3498db4d}.teacher-eval-table .btn-warning{background-color:#f39c12;color:#fff}.teacher-eval-table .btn-warning:hover{background-color:#d68910;transform:translateY(-2px);box-shadow:0 2px 4px #f39c124d}.teacher-eval-table .btn-danger{background-color:#e74c3c;color:#fff}.teacher-eval-table .btn-danger:hover{background-color:#c0392b;transform:translateY(-2px);box-shadow:0 2px 4px #e74c3c4d}.grad-eval-dialog{width:90%;max-width:700px}.grad-eval-dialog h2{color:#2c3e50;margin-bottom:20px;font-size:1.4rem}.grad-eval-dialog .form-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.grad-eval-dialog .form-group{display:flex;flex-direction:column}.grad-eval-dialog label{font-weight:600;margin-bottom:6px;color:#34495e;font-size:.9rem}.grad-eval-dialog input,.grad-eval-dialog textarea,.grad-eval-dialog select{padding:8px 10px;border:1px solid #bdc3c7;border-radius:4px;font-family:inherit;font-size:.95rem}.grad-eval-dialog input:focus,.grad-eval-dialog textarea:focus,.grad-eval-dialog select:focus{outline:none;border-color:#9b59b6;box-shadow:0 0 4px #9b59b64d}.grad-eval-dialog input:disabled,.grad-eval-dialog textarea:disabled,.grad-eval-dialog select:disabled{background-color:#ecf0f1;cursor:not-allowed}.grad-eval-dialog textarea{resize:vertical;line-height:1.4}.grad-eval-dialog .dialog-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:25px;padding-top:15px;border-top:1px solid #ecf0f1}.grad-eval-dialog .btn{padding:8px 16px;font-size:.95rem;border:none;border-radius:4px;cursor:pointer;font-weight:500;transition:all .2s}.grad-eval-dialog .btn-primary{background-color:#9b59b6;color:#fff}.grad-eval-dialog .btn-primary:hover{background-color:#8e44ad;box-shadow:0 2px 6px #9b59b64d}.grad-eval-dialog .btn-secondary{background-color:#95a5a6;color:#fff}.grad-eval-dialog .btn-secondary:hover{background-color:#7f8c8d}.grad-eval-list-container{width:100%;overflow-x:auto;background:white;border-radius:6px;box-shadow:0 1px 3px #0000001a}.grad-eval-table{width:100%;border-collapse:collapse;font-size:.95rem}.grad-eval-table thead{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;position:sticky;top:0}.grad-eval-table th{padding:12px 10px;text-align:left;font-weight:600;border-bottom:2px solid rgba(102,126,234,.3)}.grad-eval-table td{padding:10px;border-bottom:1px solid #ecf0f1}.grad-eval-table tbody tr{transition:background-color .2s}.grad-eval-table tbody tr:hover{background-color:#f8f9ff}.grad-eval-table tbody tr:nth-child(2n){background-color:#f8f9ff}.grad-eval-table .empty-message{text-align:center;padding:30px!important;color:#7f8c8d;font-style:italic}.grad-eval-table .avg-score{font-weight:600;color:#9b59b6;background-color:#ebdef0;padding:6px 10px;border-radius:4px;display:inline-block}.grad-eval-table .status{display:inline-block;padding:6px 10px;border-radius:4px;font-weight:600;font-size:.85rem}.grad-eval-table .status.passed{background-color:#d5f4e6;color:#27ae60}.grad-eval-table .status.failed{background-color:#fadbd8;color:#c0392b}.grad-eval-table .status.pending{background-color:#fef5e7;color:#f39c12}.grad-eval-table .action-buttons{display:flex;gap:6px}.grad-eval-table .btn{padding:6px 10px;border:none;border-radius:4px;cursor:pointer;font-size:.9rem;transition:all .2s}.grad-eval-table .btn-sm{padding:5px 8px;font-size:.85rem}.grad-eval-table .btn-info{background-color:#9b59b6;color:#fff}.grad-eval-table .btn-info:hover{background-color:#8e44ad;transform:translateY(-2px);box-shadow:0 2px 4px #9b59b64d}.grad-eval-table .btn-warning{background-color:#f39c12;color:#fff}.grad-eval-table .btn-warning:hover{background-color:#d68910;transform:translateY(-2px);box-shadow:0 2px 4px #f39c124d}.grad-eval-table .btn-danger{background-color:#e74c3c;color:#fff}.grad-eval-table .btn-danger:hover{background-color:#c0392b;transform:translateY(-2px);box-shadow:0 2px 4px #e74c3c4d}.promotion-result-container{width:100%;padding:20px 0}.result-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;margin-bottom:30px}.summary-card{padding:20px;border-radius:8px;box-shadow:0 2px 8px #0000001a;text-align:center;color:#fff}.summary-card h3{margin:0 0 10px;font-size:1rem;font-weight:600}.summary-card .count{margin:0;font-size:2.5rem;font-weight:700}.summary-card.passed{background:linear-gradient(135deg,#27ae60 0%,#229954 100%)}.summary-card.failed{background:linear-gradient(135deg,#e74c3c 0%,#c0392b 100%)}.summary-card.total{background:linear-gradient(135deg,#3498db 0%,#2980b9 100%)}.summary-card.rate{background:linear-gradient(135deg,#16a085 0%,#117a65 100%)}.promotion-result-list{width:100%;overflow-x:auto;background:white;border-radius:6px;box-shadow:0 1px 3px #0000001a}.promotion-table{width:100%;border-collapse:collapse;font-size:.95rem}.promotion-table thead{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;position:sticky;top:0}.promotion-table th{padding:12px 8px;text-align:left;font-weight:600;border-bottom:2px solid rgba(102,126,234,.3);font-size:.85rem}.promotion-table td{padding:10px 8px;border-bottom:1px solid #ecf0f1;font-size:.9rem}.promotion-table .gpa{font-weight:600;color:#9b59b6}.promotion-table tbody tr{transition:background-color .2s}.promotion-table tbody tr:hover{background-color:#f8f9fa}.promotion-table tbody tr.result-pass{border-left:4px solid #27ae60}.promotion-table tbody tr.result-fail{border-left:4px solid #e74c3c}.promotion-table .empty-message{text-align:center;padding:40px!important;color:#7f8c8d;font-style:italic}.promotion-table .student-name{font-weight:600;color:#2c3e50}.promotion-table .teacher-score{font-weight:600;font-size:1.1rem;color:#3498db}.promotion-table .graduation-status .status-badge{display:inline-block;padding:6px 12px;border-radius:4px;font-weight:600;font-size:.85rem}.promotion-table .graduation-status .status-badge.passed{background-color:#d5f4e6;color:#27ae60}.promotion-table .graduation-status .status-badge.failed{background-color:#fadbd8;color:#c0392b}.promotion-table .graduation-status .status-badge.pending{background-color:#fef5e7;color:#f39c12}.promotion-table .final-result{font-weight:700;font-size:1.1rem;padding:8px 12px;border-radius:4px;text-align:center}.promotion-table .final-result.passed{background-color:#d5f4e6;color:#27ae60}.promotion-table .final-result.failed{background-color:#fadbd8;color:#c0392b}.promotion-table .reason{font-size:.85rem;color:#7f8c8d;max-width:300px;word-wrap:break-word}.confirm-dialog{background:white;border-radius:12px;box-shadow:0 10px 40px #0003;padding:32px;max-width:400px;text-align:center;animation:slideUp .3s ease-out}.confirm-dialog h2{margin:0 0 16px;color:#333;font-size:1.25rem}.confirm-dialog p{margin:0 0 32px;color:#666;font-size:.95rem;line-height:1.5}.confirm-buttons{display:flex;gap:12px;justify-content:center}.confirm-buttons .btn{flex:1;min-width:120px}@keyframes slideUp{0%{transform:translateY(30px);opacity:0}to{transform:translateY(0);opacity:1}}@media (max-width: 480px){.confirm-dialog{padding:24px;margin:16px}.confirm-buttons{flex-direction:column}}.login-page{display:flex;align-items:center;justify-content:center;min-height:100vh;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}.login-container{background:white;border-radius:12px;box-shadow:0 10px 40px #0003;padding:40px;width:100%;max-width:400px}.login-header{text-align:center;margin-bottom:40px}.login-header h1{margin:0 0 10px;color:#2c3e50;font-size:1.8rem}.login-header p{margin:0;color:#7f8c8d;font-size:.95rem}.login-form{display:flex;flex-direction:column;gap:20px;margin-bottom:30px}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-weight:600;color:#2c3e50;font-size:.95rem}.form-group input{padding:12px 14px;border:2px solid #ecf0f1;border-radius:6px;font-size:1rem;font-family:inherit;transition:all .3s ease}.form-group input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.form-group input:disabled{background-color:#f8f9fa;cursor:not-allowed;color:#7f8c8d}.error-message{padding:12px;background-color:#fadbd8;color:#c0392b;border-radius:6px;font-size:.9rem;border-left:4px solid #c0392b}.login-btn{padding:12px 24px;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;border:none;border-radius:6px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;margin-top:10px}.login-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.login-btn:disabled{opacity:.6;cursor:not-allowed}.login-demo{background-color:#fef5e7;border-left:4px solid #f39c12;padding:15px;border-radius:6px;font-size:.85rem}.login-demo p{margin:8px 0;color:#2c3e50}.login-demo code{background-color:#fff3cd;padding:2px 6px;border-radius:3px;font-family:Courier New,monospace;font-weight:600;color:#d68910}@media (max-width: 480px){.login-container{margin:20px;padding:30px 20px}.login-header h1{font-size:1.4rem}}.admin-panel-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:2000}.admin-panel{background:white;border-radius:8px;max-width:900px;max-height:90vh;width:95%;display:flex;flex-direction:column;box-shadow:0 10px 40px #0000004d}.admin-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid #ecf0f1}.admin-header h2{margin:0;color:#2c3e50;font-size:1.3rem}.close-btn{background:none;border:none;font-size:1.5rem;cursor:pointer;color:#7f8c8d;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s}.close-btn:hover{background-color:#ecf0f1;color:#2c3e50}.admin-content{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:20px;overflow-y:auto;flex:1}.users-list{display:flex;flex-direction:column;gap:15px}.list-header{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px}.list-header h3{margin:0;color:#2c3e50;font-size:1.1rem}.no-users{text-align:center;padding:30px 20px;color:#7f8c8d;background-color:#f8f9fa;border-radius:6px;font-style:italic}.users-table{display:flex;flex-direction:column;gap:10px;max-height:400px;overflow-y:auto}.user-row{padding:15px;background-color:#f8f9fa;border-radius:6px;border-left:4px solid #3498db;cursor:pointer;transition:all .2s;display:flex;justify-content:space-between;align-items:center}.user-row:hover{background-color:#ecf0f1}.user-row.selected{background-color:#e8f4f8;border-left-color:#27ae60}.user-info{flex:1}.user-name{font-weight:600;color:#2c3e50;font-size:.95rem}.user-username{color:#7f8c8d;font-size:.85rem;margin-top:3px}.user-role{margin-top:5px}.role-badge{display:inline-block;padding:4px 10px;border-radius:12px;font-size:.8rem;font-weight:600}.role-badge.teacher{background-color:#d5f4e6;color:#27ae60}.role-badge.viewer{background-color:#fef5e7;color:#f39c12}.user-actions{display:flex;gap:8px}.form-section{display:flex;flex-direction:column;gap:15px;padding:20px;background-color:#f8f9fa;border-radius:6px;grid-column:2}.form-section h3{margin:0 0 15px;color:#2c3e50;font-size:1.1rem}.form-group{display:flex;flex-direction:column;gap:6px}.form-group label{font-weight:600;color:#34495e;font-size:.9rem}.form-group input,.form-group select{padding:8px 10px;border:1px solid #bdc3c7;border-radius:4px;font-family:inherit;font-size:.9rem}.form-group input:focus,.form-group select:focus{outline:none;border-color:#3498db;box-shadow:0 0 4px #3498db4d}.form-actions{display:flex;gap:10px;margin-top:10px}.form-actions .btn{flex:1}.permissions-info{padding:15px 20px;background-color:#f8f9fa;border-top:1px solid #ecf0f1}.permissions-info h4{margin:0 0 10px;color:#2c3e50;font-size:.95rem}.permission-box{margin-bottom:10px;padding:10px;background-color:#fff;border-radius:4px;border-left:3px solid #3498db;font-size:.85rem}.permission-box strong{color:#2c3e50}.permission-box ul{margin:8px 0 0 20px;padding:0;list-style:none;color:#7f8c8d}.permission-box li{margin:4px 0}.btn{padding:8px 14px;border:none;border-radius:4px;cursor:pointer;font-weight:500;transition:all .2s;font-size:.9rem}.btn-primary{background-color:#3498db;color:#fff}.btn-primary:hover{background-color:#2980b9}.btn-secondary{background-color:#95a5a6;color:#fff}.btn-secondary:hover{background-color:#7f8c8d}.btn-warning{background-color:#f39c12;color:#fff;font-size:.8rem;padding:6px 10px}.btn-warning:hover{background-color:#d68910}.btn-danger{background-color:#e74c3c;color:#fff;font-size:.8rem;padding:6px 10px}.btn-danger:hover{background-color:#c0392b}.btn-sm{padding:5px 10px;font-size:.75rem}@media (max-width: 768px){.admin-content{grid-template-columns:1fr}.form-section{grid-column:1}}.alp-page{min-height:100vh;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);padding:20px}.alp-container{max-width:1400px;margin:0 auto;background:white;border-radius:12px;box-shadow:0 10px 40px #0003;overflow:hidden}.alp-access-denied{display:flex;align-items:center;justify-content:center;min-height:100vh;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%)}.alp-denied-content{background:white;padding:40px;border-radius:12px;box-shadow:0 10px 40px #0003;text-align:center;max-width:500px}.alp-denied-content h2{margin:0 0 20px;color:#e74c3c;font-size:28px}.alp-denied-content p{margin:10px 0;color:#555;font-size:16px}.alp-denied-role{font-size:14px;color:#888;background:#f5f5f5;padding:10px;border-radius:6px}.alp-header{padding:30px;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;display:flex;justify-content:space-between;align-items:flex-start;gap:20px}.alp-header h1{margin:0 0 8px;font-size:32px;font-weight:700}.alp-subtitle{margin:0 0 8px;font-size:15px;opacity:.95}.alp-current-user{margin:0;font-size:13px;opacity:.85;padding-top:8px;border-top:1px solid rgba(255,255,255,.3)}.alp-current-user strong{color:#fff}.alp-btn-delete-mode{padding:10px 20px;background:rgba(255,255,255,.2);border:2px solid white;color:#fff;border-radius:6px;cursor:pointer;font-size:14px;font-weight:600;transition:all .3s ease;white-space:nowrap;min-width:fit-content}.alp-btn-delete-mode:hover{background:rgba(255,255,255,.3);transform:translateY(-2px)}.alp-btn-delete-mode.active{background:#e74c3c;border-color:#e74c3c}.alp-delete-section{padding:30px;background:#fff8f5;border-left:6px solid #e74c3c;border-bottom:2px solid #e74c3c}.alp-delete-header{margin-bottom:20px}.alp-delete-header h3{margin:0 0 5px;color:#e74c3c;font-size:20px}.alp-delete-header p{margin:0;color:#666;font-size:14px}.alp-delete-filters{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:15px;margin-bottom:20px}.alp-delete-group{display:flex;flex-direction:column;gap:5px}.alp-delete-group label{font-size:12px;font-weight:600;color:#555;text-transform:uppercase}.alp-input,.alp-select{padding:10px 12px;border:1px solid #ddd;border-radius:6px;font-size:14px;font-family:inherit}.alp-input:focus,.alp-select:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.alp-btn-confirm-delete{padding:10px 20px;background:#e74c3c;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:14px;font-weight:600;transition:all .3s ease;align-self:flex-end}.alp-btn-confirm-delete:hover:not(:disabled){background:#c0392b;transform:translateY(-2px);box-shadow:0 4px 12px #e74c3c4d}.alp-btn-confirm-delete:disabled{opacity:.6;cursor:not-allowed}.alp-delete-result{padding:15px;border-radius:6px;font-weight:500;text-align:center;margin-top:15px}.alp-delete-result.success{background:#d4edda;color:#155724;border:1px solid #c3e6cb}.alp-delete-result.error{background:#f8d7da;color:#721c24;border:1px solid #f5c6cb}.alp-filters-section{padding:20px 30px;background:#f9f9f9;border-bottom:1px solid #eee}.alp-filters-row{display:flex;gap:15px;margin-bottom:15px;flex-wrap:wrap;align-items:flex-end}.alp-filters-row:last-child{margin-bottom:0}.alp-search-group{flex:1;min-width:250px}.alp-search-input{width:100%;padding:12px 15px;border:2px solid #ddd;border-radius:6px;font-size:14px;transition:all .3s ease}.alp-search-input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.alp-filter-group{display:flex;flex-direction:column;gap:5px;flex:1;min-width:120px}.alp-filter-group label{font-size:12px;font-weight:600;color:#555;text-transform:uppercase;letter-spacing:.5px}.alp-btn-clear,.alp-btn-export{padding:10px 16px;border:none;border-radius:6px;cursor:pointer;font-size:14px;font-weight:500;transition:all .3s ease;white-space:nowrap}.alp-btn-clear{background:#e74c3c;color:#fff}.alp-btn-clear:hover{background:#c0392b;transform:translateY(-2px);box-shadow:0 4px 12px #e74c3c4d}.alp-btn-export{background:#27ae60;color:#fff}.alp-btn-export:hover{background:#229954;transform:translateY(-2px);box-shadow:0 4px 12px #27ae604d}.alp-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:15px;padding:0 30px 20px}.alp-stat-item{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);padding:15px;border-radius:8px;color:#fff;display:flex;justify-content:space-between;align-items:center;box-shadow:0 2px 8px #667eea33}.alp-stat-label{font-size:12px;opacity:.9;text-transform:uppercase;font-weight:500}.alp-stat-value{font-size:24px;font-weight:700}.alp-table-container{padding:0 30px 20px;overflow-x:auto}.alp-loading,.alp-error,.alp-empty{padding:40px;text-align:center;font-size:16px;color:#666;background:white}.alp-error{background:#fee;color:#c33}.alp-table{width:100%;border-collapse:collapse;font-size:14px}.alp-table thead{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;font-weight:600;position:sticky;top:0;z-index:10}.alp-table th{padding:15px;text-align:left;font-size:13px;text-transform:uppercase;letter-spacing:.5px;border-bottom:2px solid #667eea}.alp-table tbody tr{border-bottom:1px solid #e8e8e8;transition:all .3s ease}.alp-table tbody tr:hover{background-color:#f9f9f9}.alp-table tbody tr.expanded{background-color:#f0f7ff}.alp-cell-time{font-weight:500;color:#2c3e50;white-space:nowrap;padding:12px 15px;font-size:13px}.alp-cell-user{padding:12px 15px;display:flex;flex-direction:column;gap:2px}.alp-cell-user strong{color:#2c3e50;font-size:14px}.alp-cell-user small{color:#999;font-size:12px}.alp-cell-action{padding:12px 15px}.alp-cell-resource{padding:12px 15px;display:flex;flex-direction:column;gap:2px}.alp-cell-resource strong{color:#2c3e50}.alp-cell-resource small{color:#999;font-size:12px}.alp-cell-status{padding:12px 15px;text-align:center}.alp-cell-location{padding:12px 15px;font-size:13px;color:#666}.alp-cell-action-btn{padding:12px 15px;text-align:center}.alp-badge,.alp-status-badge{display:inline-block;padding:4px 10px;border-radius:20px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.3px}.alp-action-login{background:#d4edda;color:#155724}.alp-action-logout{background:#fff3cd;color:#856404}.alp-action-create{background:#d1ecf1;color:#0c5460}.alp-action-update{background:#cfe2ff;color:#084298}.alp-action-delete{background:#f8d7da;color:#721c24}.alp-action-view{background:#e7d4f5;color:#5a1a7b}.alp-action-export{background:#d4edda;color:#155724}.alp-action-import{background:#fff3cd;color:#856404}.alp-action-error{background:#f8d7da;color:#721c24}.alp-action-default{background:#e2e3e5;color:#383d41}.alp-status-success{background:#d4edda;color:#155724}.alp-status-failed{background:#f8d7da;color:#721c24}.alp-details-row{background:#f0f7ff}.alp-details-row td{padding:0}.alp-details-content{padding:20px 15px}.alp-details-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}.alp-detail-item{display:flex;flex-direction:column;gap:8px}.alp-detail-item label{font-weight:600;color:#2c3e50;font-size:13px;text-transform:uppercase;letter-spacing:.3px}.alp-detail-item p{margin:0;color:#555;font-size:14px;line-height:1.5;word-break:break-word}.alp-detail-item.alp-detail-error{background:#fee;padding:10px;border-radius:6px;border-left:4px solid #c33}.alp-detail-item.alp-detail-error p{color:#c33}.alp-code{background:#f5f5f5;padding:10px;border-radius:4px;font-family:Courier New,monospace;font-size:12px;color:#333;overflow-x:auto}.alp-btn-details{padding:6px 12px;background:#667eea;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:14px;font-weight:500;transition:all .3s ease}.alp-btn-details:hover{background:#764ba2;transform:translateY(-2px);box-shadow:0 4px 8px #667eea4d}.alp-pagination{display:flex;justify-content:center;align-items:center;gap:15px;padding:20px;background:#f9f9f9;border-top:1px solid #eee;margin-top:20px}.alp-page-info{font-weight:600;color:#2c3e50;font-size:14px;min-width:120px;text-align:center}.alp-btn-page{padding:8px 16px;background:#667eea;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:14px;font-weight:500;transition:all .3s ease}.alp-btn-page:hover:not(:disabled){background:#764ba2;transform:translateY(-2px);box-shadow:0 4px 12px #667eea4d}.alp-btn-page:disabled{background:#ccc;cursor:not-allowed;opacity:.5}@media (max-width: 1024px){.alp-header{flex-direction:column}.alp-btn-delete-mode{width:100%;text-align:center}.alp-filters-row{gap:10px}.alp-filter-group{min-width:100px;flex:0 1 calc(50% - 5px)}.alp-details-grid{grid-template-columns:1fr}.alp-table{font-size:13px}.alp-table th,.alp-table td{padding:10px}}@media (max-width: 768px){.alp-page{padding:10px}.alp-container{border-radius:8px}.alp-header{padding:20px}.alp-header h1{font-size:24px}.alp-delete-section,.alp-filters-section{padding:15px 20px}.alp-delete-filters{grid-template-columns:1fr}.alp-filters-row{flex-direction:column}.alp-filter-group,.alp-search-group{width:100%;min-width:auto}.alp-stats{grid-template-columns:1fr;padding:0 20px 15px}.alp-table-container{padding:0 20px 15px}.alp-table th,.alp-table td{padding:8px}.alp-badge,.alp-status-badge{font-size:11px}.alp-pagination{flex-direction:column;padding:15px 20px}.alp-page-info{min-width:auto}}@media (max-width: 480px){.alp-header h1{font-size:20px}.alp-table th:nth-child(n+4),.alp-table td:nth-child(n+4){display:none}.alp-btn-details{padding:4px 8px;font-size:12px}}.tts-panel{width:100%;padding:20px;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius:12px;box-shadow:0 4px 15px #0000001a}.tts-container{max-width:100%;margin:0 auto;background:white;border-radius:10px;padding:24px;box-shadow:0 2px 10px #0000000d}.tts-container h2{color:#2c3e50;margin:0 0 24px;font-size:24px;font-weight:600;display:flex;align-items:center;gap:10px}.tts-section{margin-bottom:20px}.tts-section label{display:block;margin-bottom:8px;color:#34495e;font-weight:500;font-size:14px}.tts-textarea{width:100%;min-height:150px;padding:12px;border:2px solid #ecf0f1;border-radius:8px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:14px;resize:vertical;transition:border-color .3s ease}.tts-textarea:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.tts-textarea:disabled{background:#f8f9fa;color:#7f8c8d}.tts-char-count{font-size:12px;color:#7f8c8d;margin-top:6px;text-align:right}.tts-char-count .warning{color:#f39c12;font-weight:500}.tts-char-count .error{color:#e74c3c;font-weight:500}.tts-controls-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px}@media (max-width: 768px){.tts-controls-grid{grid-template-columns:1fr}}.tts-select{width:100%;padding:10px 12px;border:2px solid #ecf0f1;border-radius:8px;font-size:14px;background:white;cursor:pointer;transition:border-color .3s ease}.tts-select:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.tts-select:disabled{background:#f8f9fa;color:#7f8c8d;cursor:not-allowed}.tts-slider{width:100%;height:6px;border-radius:3px;background:#ecf0f1;outline:none;-webkit-appearance:none;cursor:pointer}.tts-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:#667eea;cursor:pointer;box-shadow:0 2px 5px #667eea66}.tts-slider::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#667eea;cursor:pointer;border:none;box-shadow:0 2px 5px #667eea66}.tts-slider:disabled{background:#dfe6e9;cursor:not-allowed}.tts-slider:disabled::-webkit-slider-thumb{background:#bdc3c7}.tts-slider:disabled::-moz-range-thumb{background:#bdc3c7}.tts-error{background:#fadbd8;color:#c0392b;padding:12px 15px;border-radius:8px;margin-bottom:20px;border-left:4px solid #e74c3c;font-size:14px;font-weight:500}.tts-success{background:#d5f4e6;color:#27ae60;padding:12px 15px;border-radius:8px;margin-bottom:20px;border-left:4px solid #2ecc71;font-size:14px;font-weight:500}.tts-audio-section{background:#f8f9fa;padding:15px;border-radius:8px;margin-bottom:20px;border:2px solid #ecf0f1}.tts-audio-section label{margin-bottom:12px}.tts-audio-player{width:100%;margin-bottom:12px;border-radius:6px}.tts-audio-buttons{display:flex;gap:10px;flex-wrap:wrap}.tts-audio-buttons .btn{flex:1;min-width:120px}@media (max-width: 480px){.tts-audio-buttons{flex-direction:column}.tts-audio-buttons .btn{min-width:auto}}.tts-action-section{display:flex;gap:10px;margin-top:24px}.tts-action-section .btn{flex:1}.btn-primary{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;border:none;padding:12px 24px;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 10px #667eea4d}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 15px #667eea66}.btn-primary:disabled{opacity:.6;cursor:not-allowed;transform:none}.btn-secondary{background:#ecf0f1;color:#2c3e50;border:2px solid #bdc3c7;padding:10px 16px;border-radius:6px;font-size:13px;font-weight:500;cursor:pointer;transition:all .3s ease}.btn-secondary:hover:not(:disabled){background:#bdc3c7;color:#fff}.btn-secondary:disabled{opacity:.5;cursor:not-allowed}.btn-lg{padding:14px 32px;font-size:16px}@media (max-width: 768px){.tts-panel{padding:15px}.tts-container{padding:16px}.tts-container h2{font-size:20px;margin-bottom:16px}.tts-textarea{min-height:120px;font-size:13px}.tts-action-section{flex-direction:column}.tts-action-section .btn{width:100%}}#root{width:100%;min-height:100vh;background:linear-gradient(135deg,#f5f7fa 0%,#c3cfe2 100%)}.app-container{width:100%;min-height:100vh;display:flex;flex-direction:column}.app-header{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;padding:24px;box-shadow:0 4px 20px #0000001a;display:flex;justify-content:space-between;align-items:center;gap:24px}.header-content{flex:1}.header-content h1{margin:0 0 8px;font-size:2rem;font-weight:700}.header-content p{margin:0;font-size:1rem;opacity:.9;font-weight:300}.header-user{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:flex-end;min-width:300px}.user-info{display:flex;flex-direction:column;align-items:flex-end;gap:4px;padding-right:12px;border-right:1px solid rgba(255,255,255,.3)}.user-role-badge{font-size:.85rem;font-weight:600;opacity:.9}.user-name{font-size:.95rem;font-weight:500}.header-user .btn{padding:8px 12px;font-size:.9rem}.app-nav{background:white;box-shadow:0 2px 8px #0000001a;position:sticky;top:0;z-index:100}.nav-container{max-width:1200px;margin:0 auto;padding:0 24px;display:flex;gap:0}.nav-btn{padding:16px 24px;background:none;border:none;font-size:1rem;font-weight:500;cursor:pointer;color:#666;border-bottom:3px solid transparent;transition:all .3s ease;white-space:nowrap}.nav-btn:hover{color:#667eea;background:rgba(102,126,234,.05)}.nav-btn.active{color:#667eea;border-bottom-color:#667eea}.app-main{flex:1;padding:40px 24px;max-width:1200px;width:100%;margin:0 auto}.control-panel{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px;gap:24px;flex-wrap:wrap}.btn-lg{padding:12px 28px!important;font-size:1rem!important;font-weight:600;box-shadow:0 4px 15px #4a90e24d}.btn-lg:hover{transform:translateY(-3px)!important;box-shadow:0 6px 20px #4a90e266!important}.btn-teacher{box-shadow:0 4px 15px #f5576c4d!important}.btn-teacher:hover{box-shadow:0 6px 20px #f5576c66!important}.btn-class{background:linear-gradient(135deg,#4facfe 0%,#00f2fe 100%)!important;box-shadow:0 4px 15px #4facfe4d!important}.btn-class:hover{box-shadow:0 6px 20px #4facfe66!important}.btn-subject{background:linear-gradient(135deg,#9f7aea 0%,#6b21a8 100%)!important;box-shadow:0 4px 15px #9f7aea40!important;color:#fff!important}.btn-subject:hover{box-shadow:0 6px 20px #9f7aea59!important}.stats{display:flex;gap:24px;align-items:center}.stat-item{background:white;padding:16px 24px;border-radius:8px;box-shadow:0 2px 8px #00000014;display:flex;align-items:center;gap:12px}.stat-label{color:#666;font-size:.95rem;font-weight:500}.stat-value{font-size:1.5rem;font-weight:700;color:#667eea}.btn{padding:10px 20px;border:none;border-radius:6px;font-size:.95rem;font-weight:500;cursor:pointer;transition:all .2s ease}.btn-primary{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 4px 12px #4a90e24d}.btn-secondary{background:#95a5a6;color:#fff}.btn-secondary:hover{background:#7f8c8d}.btn-danger{background:#e74c3c;color:#fff}.btn-danger:hover{background:#c0392b}@media (max-width: 768px){.app-header{padding:32px 16px}.header-content h1{font-size:1.75rem}.header-content p{font-size:.95rem}.nav-container{padding:0 16px}.nav-btn{padding:12px 16px;font-size:.9rem}.app-main{padding:24px 16px}.control-panel{flex-direction:column;align-items:stretch;margin-bottom:24px}.btn-lg{width:100%}.stats{width:100%;justify-content:space-around}}*{margin:0;padding:0;box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(135deg,#f5f7fa 0%,#c3cfe2 100%);min-height:100vh}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}html,body,#root{height:100%}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#f1f1f1}::-webkit-scrollbar-thumb{background:#888;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#555}