:root{font-family:Poppins,Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light;color:#333;background-color:transparent;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#e67e22;text-decoration:inherit;transition:color .3s ease}a:hover{color:#d35400}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh;background-image:url(/assets/noa-BNWr9Rvv.jpg);background-size:cover;background-position:center;background-repeat:no-repeat;background-attachment:fixed}h1{font-size:3.2em;line-height:1.1;color:#fff;text-shadow:2px 2px 4px rgba(0,0,0,.5);margin-bottom:.5em}.home-container{background-color:#faebd7d9;padding:2rem;border-radius:12px;box-shadow:0 4px 15px #0000004d;max-width:800px;margin:0 auto;text-align:center;display:flex;flex-direction:column;align-items:center}.app-title{color:#d35400;font-size:3.5em;margin-bottom:.5em;text-shadow:1px 1px 2px rgba(0,0,0,.2)}.app-description{color:#555;font-size:1.2em;margin-bottom:2em}.category-label{color:#555;font-size:1.1em;margin-bottom:.8em;font-weight:500}.select-container{width:100%;margin-bottom:1.5em;display:flex;flex-direction:column;align-items:center}@media (max-width: 768px){.home-container{padding:1.5rem;margin:0 1rem}.app-title{font-size:2.5em}}:root{--primary: #e67e22;--primary-hover: #d35400;--white: #ffffff;--border-color: #ccc;--shadow-sm: 0 4px 6px rgba(0, 0, 0, .1);--shadow-md: 0 6px 8px rgba(0, 0, 0, .15);--transition: all .25s ease}.ui-button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:var(--primary);color:var(--white);cursor:pointer;transition:var(--transition);box-shadow:var(--shadow-sm)}.ui-button:hover{background-color:var(--primary-hover);transform:translateY(-2px);box-shadow:var(--shadow-md)}.ui-button:focus,.ui-button:focus-visible{outline:3px solid rgba(230,126,34,.5)}.start-button{padding:.8em 2em;font-size:1.2em;background-color:var(--primary);margin-top:1em;display:block;width:fit-content;clear:both}.ui-select{padding:.6em 1em;border-radius:6px;border:1px solid var(--border-color);background-color:var(--white);font-size:1em;width:auto;min-width:200px;cursor:pointer;margin-bottom:1.5em;transition:var(--transition)}.ui-select:hover{border-color:var(--primary)}.ui-select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 2px #e67e2233}#root{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}body{background-image:url(/assets/noa-BNWr9Rvv.jpg);background-size:cover;background-position:center;background-repeat:no-repeat;padding:0;min-height:100vh}.quiz-container{max-width:800px;margin:0 auto;padding:20px;background-color:#faebd7d9;border-radius:10px;box-shadow:0 4px 15px #0000004d}.quiz-card{background-color:#ffffffe6;padding:20px;border-radius:8px;margin-bottom:20px;box-shadow:0 2px 10px #8b451333;border-left:4px solid #e67e22}.quiz-card h3{margin-top:0;color:#d35400;font-weight:700}.choices{list-style:none;padding:0;margin:20px 0}.choice{padding:12px 15px;margin:8px 0;background-color:#e9967acc;border-radius:5px;cursor:pointer;transition:all .3s;color:#181818;font-weight:500;border:1px solid transparent}.choice:hover{background-color:#e67e22;transform:translateY(-2px);box-shadow:0 4px 8px #0000001a}.choice.correct{background-color:#27ae60;color:#fff}.choice.wrong{background-color:#e74c3c;color:#fff}.results-container{background-color:#ffffffe6;padding:30px;border-radius:10px;box-shadow:0 4px 20px #0003;margin:20px auto;max-width:600px;border-top:5px solid #e67e22}.results-container h1{color:#d35400;margin-top:0}.results-container button{margin:10px;padding:10px 20px;background-color:#e67e22;color:#fff;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s}.results-container button:hover{background-color:#d35400}.choice-flag{display:block;margin:0 auto}.loading-message{background-color:#ffffffe6;padding:20px;border-radius:10px;box-shadow:0 4px 15px #0000004d;margin:20px auto;max-width:600px;color:#d35400;font-size:1.2em}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.08)}to{transform:scale(1)}}.choice.correct{animation:pulse .4s ease-in-out}@keyframes shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-8px)}40%,80%{transform:translate(8px)}}.choice.wrong{animation:shake .4s ease-in-out}.page-layout{display:flex;flex-direction:column;min-height:100vh}.main-content{flex:1;display:flex;justify-content:center;align-items:center}