.challenge-container{max-width:1200px;margin:0 auto;padding:20px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.challenge-header{margin-bottom:30px;padding-bottom:20px;border-bottom:2px solid #e9ecef}.challenge-header h2{margin:0 0 15px;color:#2c3e50;font-size:2rem}.challenge-header-info{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}.username-display-box{display:flex;align-items:center;gap:10px;padding:10px 16px;background:linear-gradient(135deg,#667eea1a,#764ba21a);border:2px solid rgba(102,126,234,.3);border-radius:12px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.username-label{font-size:.9rem;color:#6c757d;font-weight:500}.username-value{font-size:1rem;color:#2c3e50;font-weight:700;font-family:Courier New,monospace;background:#fffc;padding:4px 12px;border-radius:6px;border:1px solid rgba(102,126,234,.2)}.connection-status{padding:8px 16px;border-radius:20px;font-size:.9rem;font-weight:500}.connection-status.connected{background-color:#d4edda;color:#155724;border:1px solid #c3e6cb}.connection-status.disconnected{background-color:#f8d7da;color:#721c24;border:1px solid #f5c6cb}@media (max-width: 768px){.challenge-header h2{font-size:1.5rem}.challenge-header-info{flex-direction:column;align-items:flex-start}.username-display-box{width:100%}}.challenge-sections{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}.challenge-section{background:#fff;border-radius:12px;padding:20px;box-shadow:0 2px 10px #0000001a;border:1px solid #e9ecef}.challenge-section h3{margin:0 0 20px;color:#2c3e50;font-size:1.3rem;padding-bottom:10px;border-bottom:1px solid #e9ecef}.challenge-form{display:flex;flex-direction:column;gap:15px}.form-group{display:flex;flex-direction:column;gap:5px}.form-group label{font-weight:600;color:#495057;font-size:.9rem}.form-group input,.form-group select{padding:10px 12px;border:2px solid #e9ecef;border-radius:8px;font-size:1rem;transition:border-color .2s ease}.form-group input:focus,.form-group select:focus{outline:none;border-color:#007bff}.btn{padding:10px 20px;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease;text-decoration:none;display:inline-block;text-align:center}.btn-primary{background-color:#007bff;color:#fff}.btn-primary:hover{background-color:#0056b3;transform:translateY(-1px)}.btn-accept{background-color:#28a745;color:#fff}.btn-accept:hover{background-color:#1e7e34;transform:translateY(-1px)}.btn-decline{background-color:#dc3545;color:#fff}.btn-decline:hover{background-color:#c82333;transform:translateY(-1px)}.btn-secondary{background-color:#6c757d;color:#fff}.btn-secondary:hover{background-color:#545b62;transform:translateY(-1px)}.challenge-item{background:#f8f9fa;border-radius:8px;padding:15px;margin-bottom:15px;border-left:4px solid #e9ecef;transition:all .2s ease}.challenge-item:hover{transform:translateY(-2px);box-shadow:0 4px 15px #0000001a}.challenge-item.pending{border-left-color:#ffc107;background:#fff3cd}.challenge-item.active{border-left-color:#007bff;background:#d1ecf1}.challenge-item.completed{border-left-color:#28a745;background:#d4edda}.challenge-item.pending.sent{border-left:4px solid #007bff;background-color:#f8f9ff}.challenge-item.pending.received{border-left:4px solid #28a745;background-color:#f8fff9}.challenge-status{color:#6c757d;font-style:italic;font-size:.9rem}.challenge-info{margin-bottom:15px;line-height:1.6}.challenge-info strong{color:#495057}.challenge-actions{display:flex;gap:10px;flex-wrap:wrap}.no-challenges{color:#6c757d;font-style:italic;text-align:center;padding:20px}.challenge-notification{position:fixed;top:20px;right:20px;background:#fff;border-radius:12px;box-shadow:0 8px 25px #00000026;border:1px solid #e9ecef;z-index:1000;animation:slideInRight .3s ease;max-width:400px}@keyframes slideInRight{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.challenge-notification-content{padding:20px}.challenge-notification h3{margin:0 0 10px;color:#2c3e50;font-size:1.2rem}.challenge-notification p{margin:0 0 15px;color:#6c757d;line-height:1.5}.challenge-notification .challenge-actions{display:flex;gap:10px}.challenge-results-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.challenge-results-content{background:#fff;border-radius:12px;padding:30px;max-width:500px;width:90%;text-align:center;box-shadow:0 10px 30px #0003}.challenge-results-content h2{margin:0 0 20px;color:#2c3e50;font-size:1.8rem}.results-summary{display:flex;align-items:center;justify-content:space-between;margin:20px 0;padding:20px;background:#f8f9fa;border-radius:8px}.player-result{text-align:center;flex:1}.player-result h4{margin:0 0 10px;color:#495057;font-size:1.1rem}.player-result p{margin:0;font-size:1.5rem;font-weight:700;color:#007bff}.vs{font-size:1.5rem;font-weight:700;color:#6c757d;margin:0 20px}.winner-announcement{margin:20px 0;padding:15px;background:#e8f5e8;border-radius:8px;border:1px solid #c3e6cb}.winner-announcement h3{margin:0}.challenge-details{background:#f8f9fa;border-radius:6px;padding:15px;margin:15px 0;text-align:left}.challenge-details p{margin:5px 0;color:#6c757d;font-size:.9rem}.score-display{font-size:2.5rem;font-weight:700;margin:10px 0 5px}.score-label{font-size:.9rem;color:#6c757d;margin:0}.username-display{font-weight:600;color:#007bff}.username-display.username-loaded,.player-result.winner .score-display{color:#28a745}.player-result.loser .score-display{color:#dc3545}.player-result.tie .score-display{color:#ffc107}.challenge-actions{display:flex;gap:10px;justify-content:center;margin-top:20px;flex-wrap:wrap}.challenge-results-modal .challenge-actions{justify-content:center}.challenge-results-modal .challenge-actions .btn{min-width:200px;font-size:1.1rem;padding:12px 30px}.answer-submitted{text-align:center;padding:15px;background:#e8f5e8;border-radius:6px;border:1px solid #c3e6cb;margin-bottom:10px}.status-badge.submitted{display:inline-block;background:#28a745;color:#fff;padding:4px 12px;border-radius:20px;font-size:.9rem;font-weight:700;margin-bottom:8px}.score-info{font-weight:700;color:#155724;margin:8px 0;font-size:1.1rem}.waiting-results{color:#28a745;font-style:italic;margin:5px 0 0;font-size:.9rem}.waiting-opponent{color:#856404;font-style:italic;margin:5px 0 0;font-size:.9rem}.challenge-message{position:fixed;top:20px;left:50%;transform:translate(-50%);padding:12px 24px;border-radius:8px;color:#fff;font-weight:600;z-index:1000;animation:slideInDown .3s ease}@keyframes slideInDown{0%{transform:translate(-50%) translateY(-100%);opacity:0}to{transform:translate(-50%) translateY(0);opacity:1}}.challenge-message-success{background-color:#28a745}.challenge-message-error{background-color:#dc3545}.challenge-message-info{background-color:#17a2b8}.challenge-login-prompt{text-align:center;padding:60px 20px;background:#fff;border-radius:12px;box-shadow:0 2px 10px #0000001a}.challenge-login-prompt h2{margin:0 0 15px;color:#2c3e50;font-size:1.8rem}.challenge-login-prompt p{margin:0 0 25px;color:#6c757d;font-size:1.1rem}@media (max-width: 768px){.challenge-container{padding:15px}.challenge-header{flex-direction:column;gap:15px;text-align:center}.challenge-sections{grid-template-columns:1fr}.challenge-notification{right:15px;left:15px;max-width:none}.challenge-results-content{margin:20px;padding:20px}.results-summary{flex-direction:column;gap:15px}.vs{margin:10px 0}}