:root{
  --deep:#012E40;--dark:#024959;--mid:#026773;--teal:#3CA6A6;--cream:#F2E3D5;--cyan:#00E5FF;
}
*{box-sizing:border-box} body{margin:0;min-height:100vh;background:
radial-gradient(circle at 50% 20%,#0a6675 0,#024959 35%,#012E40 78%);
color:var(--cream);font-family:Montserrat,Arial,sans-serif;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.16;background-image:linear-gradient(90deg,transparent 49%,rgba(255,255,255,.06) 50%,transparent 51%),linear-gradient(0deg,transparent 49%,rgba(255,255,255,.04) 50%,transparent 51%);background-size:90px 90px}
#app{min-height:100vh;position:relative}.screen{display:none;min-height:100vh;width:min(1100px,100%);margin:auto;padding:40px 24px;align-items:center;justify-content:center;flex-direction:column;text-align:center}.screen.active{display:flex}
.logo{font-family:Audiowide,sans-serif;letter-spacing:1px;font-size:clamp(20px,3vw,32px)}.logo span{font-family:cursive;font-weight:400;font-size:.72em;display:inline-block;transform:rotate(-5deg);margin-left:4px}
.logo.small{font-size:17px}.eyebrow{font-weight:800;letter-spacing:.22em;color:var(--cyan);font-size:13px;margin:30px 0 12px}
h1,h2{font-family:Audiowide,sans-serif;font-weight:400;line-height:1.2;margin:0;max-width:850px}h1{font-size:clamp(32px,6vw,68px)}h2{font-size:clamp(23px,4vw,42px)}
.lead{max-width:720px;line-height:1.7;color:#d9e5e5;margin:22px auto;font-size:16px}.start-meta{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin:20px 0 30px}.start-meta span,.result-stats span{border:1px solid rgba(242,227,213,.22);border-radius:999px;padding:9px 14px;font-size:12px}
button{border:0;cursor:pointer;font-family:Montserrat,sans-serif;font-weight:800;letter-spacing:.08em;border-radius:10px;padding:16px 26px;transition:.2s transform,.2s box-shadow,.2s background}.primary{background:var(--cyan);color:var(--deep);box-shadow:0 0 24px rgba(0,229,255,.24)}button:hover{transform:translateY(-2px)}.secondary{background:transparent;color:var(--cream);border:1px solid rgba(242,227,213,.35)}.hidden{display:none!important}
.game-header{width:100%;display:flex;align-items:center;justify-content:space-between;gap:15px}.progress{font-weight:700;opacity:.8}.timer{width:72px;height:72px;border:2px solid var(--cyan);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-direction:column;box-shadow:0 0 22px rgba(0,229,255,.15)}.timer span{font-family:Audiowide;font-size:25px;color:var(--cyan)}.timer small{font-size:8px;letter-spacing:.16em}.timer.urgent{border-color:#ffb84d;box-shadow:0 0 25px rgba(255,184,77,.25)}.timer.danger{border-color:#ff6b6b;box-shadow:0 0 30px rgba(255,107,107,.3);animation:pulse .5s infinite alternate}
.timer-track{height:5px;background:rgba(255,255,255,.12);width:100%;margin:16px 0 35px;border-radius:5px;overflow:hidden}.timer-track div{height:100%;width:100%;background:var(--cyan);transition:width 1s linear}
.question-card{width:min(850px,100%);background:rgba(1,46,64,.76);border:1px solid rgba(60,166,166,.35);border-radius:22px;padding:35px 28px;box-shadow:0 18px 60px rgba(0,0,0,.28);backdrop-filter:blur(8px)}.question-card .eyebrow{margin-top:0}.answers{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:30px}.answer{background:rgba(242,227,213,.07);border:1px solid rgba(242,227,213,.22);color:var(--cream);text-align:left;min-height:66px;font-size:15px}.answer .letter{color:var(--cyan);margin-right:10px}.answer.correct{background:rgba(60,166,166,.3);border-color:var(--teal)}.answer.wrong{background:rgba(160,55,55,.32);border-color:#d96a6a}.answer:disabled{cursor:default;opacity:1}.feedback{min-height:70px;text-align:left;margin:20px auto 0;max-width:730px;line-height:1.55}.feedback strong{display:block;color:var(--cyan);font-size:18px;margin-bottom:5px}.result-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:30px}.score{font-family:Audiowide;font-size:clamp(70px,12vw,130px);color:var(--cyan);line-height:1}.score small{font-size:.35em;color:var(--cream)}.result-stats{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}.result-stats b{color:var(--cyan)}
@keyframes pulse{to{transform:scale(1.05)}}@media(max-width:650px){.screen{padding:25px 15px}.game-header .logo{font-size:12px}.progress{font-size:12px}.timer{width:60px;height:60px}.answers{grid-template-columns:1fr}.question-card{padding:28px 17px}.answer{min-height:60px}}