*{box-sizing:border-box}:root{font-family:Sigmar,sans-serif;line-height:1.35;font-weight:400;color:#102a54;background:linear-gradient(165deg,#0f3f8e,#1d66d5 52%,#7cb4ff);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-width:320px;min-height:100dvh;font-family:inherit;color:inherit}button{font:inherit;cursor:pointer}#root{min-height:100dvh}.app-shell{min-height:100dvh;display:grid;place-items:center;padding:1rem .9rem 1.3rem}.app-shell-game{height:100dvh;overflow:hidden;padding:.85rem .75rem calc(1.4rem + env(safe-area-inset-bottom))}.home-card,.quiz-card{width:min(100%,28rem);background:linear-gradient(180deg,#fffde9,#fff8bf);border:3px solid #2a66c5;border-radius:1.4rem;padding:1rem;box-shadow:0 18px #1a4d9a,0 20px 40px #0a2a5f33}.home-floating-logo{position:fixed;top:-1rem;left:50%;transform:translate(-50%);width:10rem;height:10rem;object-fit:contain;display:block;z-index:5;pointer-events:none}.settings-top{display:flex;justify-content:flex-end}.icon-btn,.link-btn,.setting-toggle{border:3px solid #1f57af;border-radius:.75rem;background:linear-gradient(180deg,#f6fbff,#dcecff);color:#174181;font-weight:800;box-shadow:0 5px #1b4f9d;transition:transform 90ms ease,box-shadow 90ms ease,filter .12s ease}.icon-btn{padding:.45rem .65rem;font-size:.82rem}.link-btn{margin-top:1rem;width:100%;padding:.7rem .8rem;font-size:1rem}.icon-btn:hover,.link-btn:hover,.setting-toggle:hover{filter:brightness(1.03) saturate(1.06)}.icon-btn:active,.link-btn:active,.setting-toggle:active{transform:translateY(4px);box-shadow:0 1px #1b4f9d}.home-card h1{margin:.8rem 0 .2rem;font-size:2rem;color:#133268}.subtitle{margin:0;color:#2a4f8f;font-weight:600;font-size:1.04rem}.mode-grid{margin-top:1.05rem;display:grid;gap:.8rem}.mode-btn{border:3px solid #1c58b8;border-radius:1rem;background:linear-gradient(180deg,#f6fbff,#dcecff);padding:1rem;text-align:left;display:grid;gap:.24rem;box-shadow:0 6px #1b4f9d;transition:transform 90ms ease,box-shadow 90ms ease,filter .12s ease}.mode-btn .title{color:#173a73;font-size:1.18rem;font-weight:800}.mode-btn .desc{color:#3d5f98;font-size:1rem}.mode-btn .cta{margin-top:.25rem;color:#114492;font-weight:800;font-size:.93rem}.mode-btn.classic{background:linear-gradient(180deg,#ffe155,#ffc930);border-color:#1f57af}.mode-btn.classic .cta{color:#7f3a00}.mode-btn:enabled:active{transform:translateY(4px) scale(.995);box-shadow:0 2px #1b4f9d}.mode-btn:enabled:hover{filter:saturate(1.08)}.mode-btn:disabled{opacity:.7;box-shadow:0 4px #4f74b2;cursor:not-allowed}.settings-card{display:flex;flex-direction:column}.settings-list{margin-top:1rem;display:grid;gap:.75rem}.setting-block{border:3px solid #1f57af;border-radius:1rem;background:linear-gradient(180deg,#f6fbff,#dcecff);box-shadow:0 6px #1b4f9d;padding:.8rem}.setting-row{width:100%;text-align:left;display:flex;justify-content:space-between;align-items:center;gap:.75rem}.setting-toggle{min-width:4.1rem;padding:.38rem .65rem;font-size:.86rem}.setting-title{font-size:1rem;color:#13396f;font-weight:800}.slider-wrap{margin-top:.55rem;display:grid;gap:.35rem}.slider-wrap span{font-size:.85rem;font-weight:700;color:#1f57af}.slider-wrap input[type=range]{width:100%;accent-color:#1f57af}.quiz-top{display:flex;justify-content:space-between;align-items:baseline;gap:.75rem}.quiz-top h1{margin:0;font-size:1.55rem;color:#17396f}.quiz-top p{margin:0;color:#1f57af;font-weight:800;font-size:1.02rem}.quiz-card-game{height:100%;max-height:100%;display:flex;flex-direction:column}.back-home{margin-top:.8rem;border:none;padding:0;background:transparent;color:#1f57af;font-size:.9rem;font-weight:800}.question-count{margin:.45rem 0 0;color:#1f57af;font-size:.98rem}.prompt{margin:1rem 0 .75rem;font-weight:800;color:#173a73;font-size:1.05rem}.quiz-body{display:flex;flex-direction:column;flex:1;min-height:0}.flag-frame{position:relative;margin:0;border-radius:.95rem;overflow:hidden;background:#eff6ff;border:3px solid #1f57af;min-height:10.5rem;box-shadow:inset 0 0 0 3px #fff5b8}.flag-frame img{width:100%;display:block;aspect-ratio:16 / 10;object-fit:cover;transition:opacity .18s ease}.flag-frame.loading img{opacity:.45}.flag-placeholder{width:100%;aspect-ratio:16 / 10;background:linear-gradient(110deg,#b4d5ff 8%,#e1eeff 18%,#b4d5ff 33%);background-size:200% 100%;animation:shimmer 1.1s linear infinite}.flag-loading{position:absolute;inset:0;display:grid;place-items:center;color:#1f57af;font-weight:800;opacity:0;transition:opacity .18s ease;pointer-events:none}.flag-loading.show{opacity:1}.options{margin-top:1rem;display:grid;gap:.7rem;grid-template-rows:repeat(4,minmax(0,1fr));flex:1;min-height:0}.options button,.status button,.round-actions button{width:100%;border:3px solid #1f57af;border-radius:.9rem;background:linear-gradient(180deg,#fff27d,#ffd94f);box-shadow:0 6px #1b4f9d;padding:.82rem;font-size:1.08rem;font-weight:800;color:#1c3e7b;transition:transform 90ms ease,box-shadow 90ms ease,filter .12s ease}.options button:hover,.status button:hover,.round-actions button:hover{filter:brightness(1.03) saturate(1.06)}.options button:active,.status button:active,.round-actions button:active{transform:translateY(4px);box-shadow:0 2px #1b4f9d}.options button:disabled{opacity:1;cursor:default}.options button:disabled:not(.correct):not(.wrong){filter:grayscale(.18)}.options button.correct{background:linear-gradient(180deg,#b7fba8,#7ae173);border-color:#248935;box-shadow:0 6px #1f6d2d;color:#145421;animation:pop-correct .26s ease}.options button.wrong{background:linear-gradient(180deg,#ffd4d1,#ffafaa);border-color:#bb3340;box-shadow:0 6px #8d1f2a;color:#7a1425;animation:wiggle-wrong .22s ease}.status{margin-top:1rem;text-align:center;color:#1f57af;font-weight:700}.round-result{margin-top:1.2rem;flex:1;border:3px solid #1f57af;border-radius:1rem;background:linear-gradient(180deg,#f9fcff,#dcecff);box-shadow:0 6px #1b4f9d;display:grid;align-content:center;justify-items:center;padding:1rem;text-align:center;gap:.65rem}.round-result h2{margin:0;font-size:1.6rem;color:#17396f}.round-result p{margin:0;color:#1f57af;font-size:1.05rem}.completion-text{margin-top:.3rem;font-size:1.05rem;color:#13396f}.round-actions{margin-top:.4rem;width:100%;display:grid;gap:.65rem}@keyframes pop-correct{0%{transform:scale(1)}45%{transform:scale(1.04)}to{transform:scale(1)}}@keyframes wiggle-wrong{0%{transform:translate(0)}30%{transform:translate(-3px)}60%{transform:translate(3px)}to{transform:translate(0)}}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@media(min-width:640px){.app-shell-game{padding:1rem .85rem}.home-card,.quiz-card{padding:1.35rem}}@media(max-width:420px){.app-shell{padding:.7rem .65rem 1rem}.app-shell-game{padding:.65rem .55rem calc(1.1rem + env(safe-area-inset-bottom))}.home-card,.quiz-card{border-radius:1.1rem;padding:.8rem}.home-floating-logo{width:8rem;height:8rem;top:-1rem}.home-card h1{margin-top:.55rem;font-size:1.64rem;line-height:1.05}.subtitle{font-size:.95rem}.mode-grid{margin-top:.8rem;gap:.62rem}.mode-btn{padding:.76rem}.mode-btn .title{font-size:1.05rem}.mode-btn .desc{font-size:.88rem}.mode-btn .cta{font-size:.84rem}.link-btn{margin-top:.8rem;padding:.62rem .75rem;font-size:.9rem}.quiz-top h1{font-size:1.26rem}.quiz-top p{font-size:.95rem}.question-count,.back-home{font-size:.86rem}.prompt{margin-top:.7rem;margin-bottom:.55rem;font-size:.97rem}.flag-frame{min-height:8.3rem}.options{margin-top:.7rem;gap:.55rem}.options button,.status button,.round-actions button{padding:.64rem;font-size:.94rem}.round-result{margin-top:.75rem;padding:.8rem;gap:.5rem}.round-result h2{font-size:1.3rem}.round-result p,.completion-text{font-size:.92rem}.settings-list{gap:.55rem}.setting-block{padding:.65rem}.setting-title{font-size:.94rem}.setting-toggle{min-width:3.6rem;padding:.3rem .55rem;font-size:.82rem}.slider-wrap span{font-size:.82rem}}@media(max-height:730px){.home-floating-logo{width:8rem;height:8rem;top:-1rem}.quiz-top h1{font-size:1.15rem}.prompt{margin-top:.55rem;margin-bottom:.5rem;font-size:.9rem}.flag-frame{min-height:7.7rem}.options{margin-top:.6rem;gap:.48rem}.options button,.status button,.round-actions button{padding:.56rem;font-size:.86rem}}
