.admin-training-panel{width:100%;padding:20px;background:linear-gradient(135deg,#f5f7fa,#c3cfe2);border-radius:12px;animation:fadeIn .5s ease-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.message{padding:12px 16px;border-radius:8px;margin-bottom:16px;display:flex;justify-content:space-between;align-items:center;font-weight:500;animation:slideDown .3s ease-out}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.message.error{background:#fee;color:#c33;border-left:4px solid #c33}.message.success{background:#efe;color:#3c3;border-left:4px solid #3c3}.message button{background:none;border:none;font-size:20px;cursor:pointer;color:inherit;opacity:.7;transition:opacity .2s}.message button:hover{opacity:1}.panel-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;padding-bottom:16px;border-bottom:2px solid rgba(255,105,180,.2)}.panel-header h2{margin:0;font-size:24px;color:#333;font-weight:800}.btn-primary{padding:10px 20px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:8px;font-size:14px;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #667eea4d}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 16px #667eea66}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-primary:disabled{opacity:.6;cursor:not-allowed}.btn-secondary{padding:10px 20px;background:#f0f0f0;color:#666;border:1px solid #ddd;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s ease}.btn-secondary:hover:not(:disabled){background:#e8e8e8;border-color:#ccc}.btn-secondary:disabled{opacity:.6;cursor:not-allowed}.btn-icon{background:none;border:none;font-size:16px;cursor:pointer;padding:4px 8px;border-radius:4px;transition:all .2s ease}.btn-icon.edit:hover{background:#fff3cd}.btn-icon.delete:hover{background:#f8d7da}.btn-close{background:none;border:none;font-size:20px;cursor:pointer;color:#999;transition:color .2s}.btn-close:hover{color:#333}.form-section{background:#fff;padding:20px;border-radius:12px;margin-bottom:24px;box-shadow:0 2px 8px #0000001a;animation:slideDown .3s ease-out}.form-group{margin-bottom:16px}.form-group:last-child{margin-bottom:0}.form-group label{display:block;margin-bottom:8px;font-weight:600;color:#333;font-size:14px}.form-group input,.form-group textarea{width:100%;padding:10px 12px;border:1px solid #ddd;border-radius:6px;font-family:inherit;font-size:14px;transition:all .2s ease}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.form-group input:disabled,.form-group textarea:disabled{background:#f5f5f5;cursor:not-allowed}.form-actions{display:flex;gap:12px;margin-top:20px;padding-top:20px;border-top:1px solid #eee}.form-actions button{flex:1}.groups-container{margin-bottom:24px}.loading,.empty{text-align:center;padding:40px 20px;color:#999;font-size:16px;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000000d}.loading{font-size:18px}.groups-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}.group-card{background:#fff;border-radius:12px;padding:16px;box-shadow:0 2px 8px #0000001a;transition:all .3s ease;cursor:pointer;border:2px solid transparent}.group-card:hover{transform:translateY(-4px);box-shadow:0 6px 16px #00000026}.group-card.active{border-color:#667eea;background:#f8f9ff}.card-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}.card-header h3{margin:0;font-size:16px;color:#333;font-weight:700;flex:1}.card-actions{display:flex;gap:4px}.card-description{margin:8px 0;font-size:13px;color:#666;line-height:1.4}.card-key{display:flex;align-items:center;gap:8px;margin:12px 0;padding:8px 12px;background:#f5f5f5;border-radius:6px;font-size:12px}.card-key .label{font-weight:600;color:#666}.card-key code{font-family:Courier New,monospace;color:#333;font-weight:500;flex:1;word-break:break-all}.btn-view-users{width:100%;padding:10px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:6px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s ease}.btn-view-users:hover{transform:translateY(-2px);box-shadow:0 4px 12px #667eea4d}.users-section{background:#fff;border-radius:12px;padding:20px;box-shadow:0 2px 8px #0000001a;animation:slideUp .3s ease-out}@keyframes slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.users-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;padding-bottom:12px;border-bottom:2px solid #f0f0f0}.users-header h3{margin:0;font-size:18px;color:#333;font-weight:700}.users-list{display:flex;flex-direction:column;gap:8px}.user-item{display:flex;justify-content:space-between;align-items:center;padding:12px;background:#f9f9f9;border-radius:8px;border-left:3px solid #667eea;transition:all .2s ease}.user-item:hover{background:#f0f0f0}.user-info{display:flex;align-items:center;gap:12px;flex:1}.user-number{font-weight:700;color:#667eea;min-width:24px}.user-name{font-weight:500;color:#333}.user-status{font-size:12px;color:#3c3;background:#efe;padding:2px 8px;border-radius:4px;font-weight:600}.btn-remove{background:#fee;border:none;color:#c33;width:32px;height:32px;border-radius:6px;font-size:16px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.btn-remove:hover{background:#fdd;transform:scale(1.1)}@media (max-width: 768px){.admin-training-panel{padding:16px}.panel-header{flex-direction:column;gap:12px;align-items:flex-start}.btn-primary{width:100%}.groups-grid{grid-template-columns:1fr}.form-actions{flex-direction:column}.form-actions button{width:100%}.users-header{flex-direction:column;align-items:flex-start;gap:12px}.btn-close{align-self:flex-end}}@media (max-width: 480px){.admin-training-panel{padding:12px}.panel-header h2{font-size:18px}.groups-grid{gap:12px}.group-card{padding:12px}.card-header h3{font-size:14px}.user-item{flex-direction:column;align-items:flex-start;gap:8px}.btn-remove{align-self:flex-end}}.training-pairing-container{width:100%;height:100%;background:linear-gradient(135deg,#fdf2f8,#ffe4f0,#ffd4e5);display:flex;align-items:center;justify-content:center;padding:20px;min-height:100vh;animation:fadeIn .5s ease-in}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.login-section{width:100%;max-width:500px;position:relative}.back-button{position:absolute;top:-60px;left:0;background:#fff;border:2px solid #ffb6d9;color:#ff69b4;width:50px;height:50px;border-radius:50%;font-size:24px;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #ff69b433;display:flex;align-items:center;justify-content:center}.back-button:hover{background:#ffb6d9;color:#fff;transform:scale(1.1) translate(-5px);box-shadow:0 6px 20px #ff69b44d}.login-card{background:#fff;border-radius:30px;padding:40px;box-shadow:0 20px 60px #ff69b426;border:2px solid #ffe4f0;animation:slideUp .6s ease-out}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.login-header{text-align:center;margin-bottom:30px}.login-title{font-size:32px;font-weight:800;color:#ff1493;margin:0 0 10px;letter-spacing:-.5px}.login-subtitle{font-size:14px;color:#999;margin:0;font-weight:500}.login-form{display:flex;flex-direction:column;gap:20px;margin-bottom:20px}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-size:14px;font-weight:700;color:#333;letter-spacing:.5px}.form-input{padding:14px 16px;border:2px solid #ffe4f0;border-radius:12px;font-size:14px;font-family:inherit;transition:all .3s ease;background:#fdf9fb}.form-input:focus{outline:none;border-color:#ff69b4;background:#fff;box-shadow:0 0 0 3px #ff69b41a}.form-input:disabled{background:#f5f5f5;cursor:not-allowed;opacity:.6}.error-message{background:#ffe0e0;border-left:4px solid #ff4444;padding:12px 14px;border-radius:8px;font-size:13px;color:#c00;font-weight:600;animation:shake .3s ease}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.login-button{padding:14px 20px;background:linear-gradient(135deg,#ff69b4,#ff1493);color:#fff;border:none;border-radius:12px;font-size:15px;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 8px 20px #ff14934d;letter-spacing:.5px}.login-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 12px 30px #ff149366}.login-button:active:not(:disabled){transform:translateY(0)}.login-button:disabled{opacity:.6;cursor:not-allowed}.groups-list-button{padding:12px 20px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:12px;font-size:14px;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 8px 20px #667eea4d;letter-spacing:.5px;margin-top:8px}.groups-list-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 12px 30px #667eea66}.groups-list-button:active:not(:disabled){transform:translateY(0)}.groups-list-button:disabled{opacity:.6;cursor:not-allowed}.login-info{background:#fff5f9;border-radius:12px;padding:16px;border-left:4px solid #ffb6d9}.login-info p{margin:6px 0;font-size:13px;color:#666;font-weight:500}.login-info p:first-child{margin-top:0}.login-info p:last-child{margin-bottom:0}.display-section{width:100%;max-width:600px;position:relative}.display-card{background:#fff;border-radius:30px;padding:40px;box-shadow:0 20px 60px #ff69b426;border:2px solid #ffe4f0;animation:slideUp .6s ease-out}.display-header{text-align:center;margin-bottom:30px}.display-title{font-size:32px;font-weight:800;color:#ff1493;margin:0 0 10px;letter-spacing:-.5px}.display-subtitle{font-size:14px;color:#999;margin:0;font-weight:500}.pairs-container{min-height:200px;margin-bottom:20px}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center}.empty-icon{font-size:60px;margin-bottom:15px;animation:bounce 2s infinite}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.empty-text{font-size:16px;font-weight:700;color:#333;margin:0 0 8px}.empty-hint{font-size:13px;color:#999;margin:0}.pairs-list{display:flex;flex-direction:column;gap:16px}.pair-card{background:linear-gradient(135deg,#fff5f9,#ffe4f0);border:2px solid #ffb6d9;border-radius:16px;padding:20px;transition:all .3s ease;animation:slideIn .5s ease-out}@keyframes slideIn{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.pair-card:hover{transform:translateY(-4px);box-shadow:0 12px 30px #ff69b433;border-color:#ff69b4}.pair-number{font-size:12px;font-weight:700;color:#ff69b4;text-transform:uppercase;letter-spacing:1px;margin-bottom:12px}.pair-content{display:flex;align-items:center;justify-content:space-between;gap:12px}.user-item{flex:1;display:flex;align-items:center;gap:10px;background:#fff;padding:12px 14px;border-radius:10px;border:1px solid #ffe4f0}.user-icon{font-size:20px}.user-name{font-size:14px;font-weight:700;color:#333;word-break:break-word}.pair-divider{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:linear-gradient(135deg,#ff69b4,#ff1493);border-radius:50%;flex-shrink:0}.divider-text{color:#fff;font-size:20px;font-weight:700}.display-footer{display:flex;gap:12px;justify-content:center}.refresh-button{padding:12px 24px;background:linear-gradient(135deg,#ffb6d9,#ff69b4);color:#fff;border:none;border-radius:10px;font-size:14px;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 6px 15px #ff69b433}.refresh-button:hover{transform:translateY(-2px);box-shadow:0 8px 20px #ff69b44d}.refresh-button:active{transform:translateY(0)}.groups-button{padding:12px 24px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:10px;font-size:14px;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 6px 15px #667eea33}.groups-button:hover{transform:translateY(-2px);box-shadow:0 8px 20px #667eea4d}.groups-button:active{transform:translateY(0)}@media (max-width: 600px){.training-pairing-container{padding:10px}.login-card,.display-card{padding:30px 20px;border-radius:20px}.login-title,.display-title{font-size:26px}.login-subtitle,.display-subtitle{font-size:12px}.back-button{top:-55px;width:45px;height:45px;font-size:20px}.pair-content{flex-direction:column}.pair-divider{transform:rotate(90deg)}.user-item{width:100%}}@media (max-width: 400px){.login-card,.display-card{padding:20px 16px}.login-title,.display-title{font-size:22px}.form-input,.login-button{font-size:13px}.login-info{padding:12px}.login-info p{font-size:12px}}
