body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.App{background:linear-gradient(135deg,#f5f7fa,#c3cfe2);box-sizing:border-box;min-height:100vh;padding:20px}.chord-game{font-family:Arial,sans-serif;margin:0 auto;max-width:800px;padding:20px;text-align:center}h1{color:#2c3e50;font-size:2.5rem;margin-bottom:10px}.subtitle{color:#7f8c8d;font-size:1.2rem;margin-bottom:30px}.score-container{background-color:#f8f9fa;border-radius:5px;font-size:1.2rem;font-weight:700;margin-bottom:20px;padding:10px}.question-container{background-color:#fff;border-radius:10px;box-shadow:0 4px 8px #0000001a;margin-bottom:20px;padding:20px}h2{color:#34495e;margin-bottom:15px}.chord-description{color:#7f8c8d;font-style:italic;margin-bottom:20px}.options-container{grid-gap:15px;display:grid;gap:15px;grid-template-columns:repeat(2,1fr);margin-bottom:20px}.option-button{background-color:#ecf0f1;border:none;border-radius:5px;cursor:pointer;font-size:1.2rem;padding:15px;transition:all .3s ease}.option-button:hover:not(:disabled){background-color:#d6dbdf}.option-button.correct{background-color:#2ecc71;color:#fff}.option-button.incorrect{background-color:#e74c3c;color:#fff}.option-button.correct-answer{background-color:#2ecc71;color:#fff;opacity:.7}.result{border-radius:5px;font-weight:700;margin-top:15px;padding:10px}.result.correct{background-color:#2ecc7133;color:#27ae60}.result.incorrect{background-color:#e74c3c33;color:#c0392b}.next-button{background-color:#3498db;border:none;border-radius:5px;color:#fff;cursor:pointer;font-size:1.1rem;padding:12px 25px;transition:background-color .3s ease}.next-button:hover{background-color:#2980b9}@media (max-width:600px){.options-container{grid-template-columns:1fr}h1{font-size:2rem}h2{font-size:1.3rem}}