body { font-family: 'Courier New', monospace; background-color: #121212; color: #0f0; max-width: 900px; margin: 0 auto; padding: 20px; } .header { text-align: center; border-bottom: 1px solid #333; padding-bottom: 20px; } .challenge { background-color: #1a1a1a; padding: 15px; margin: 20px 0; border: 1px solid #333; border-radius: 5px; } .flag-input { background-color: #121212; color: #0f0; border: 1px solid #0f0; padding: 8px; width: 300px; } .submit-btn { background-color: #0f0; color: #121212; border: none; padding: 8px 15px; cursor: pointer; font-weight: bold; } .hidden { display: none; } .completion-message { text-align: center; margin-top: 30px; padding: 20px; background-color: #1a1a1a; border-radius: 5px; border: 1px solid #0f0; } .professional-btn { background: linear-gradient(135deg, #6e8efb, #a777e3); color: white; border: none; padding: 12px 24px; font-size: 16px; border-radius: 30px; cursor: pointer; margin-top: 20px; font-weight: bold; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); transition: all 0.3s ease; } .professional-btn:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3); } .ranking-container { background-color: #1a1a1a; padding: 15px; margin: 20px 0; border: 1px solid #333; border-radius: 5px; } .ranking-table { width: 100%; border-collapse: collapse; } .ranking-table th, .ranking-table td { padding: 8px; text-align: left; border-bottom: 1px solid #333; } .ranking-table th { background-color: #0a0a0a; } .question { margin-bottom: 10px; } .options { margin-left: 20px; } .binary-answer { font-family: monospace; letter-spacing: 2px; }