:root{--bg:#fff8ec;--surface:#fff;--ink:#2b2140;--ink-soft:#6b6280;--primary:#ff6b3d;--primary-shadow:#d14a1f;--accent:#5b4bdb;--good:#1fa463;--good-soft:#e3f7ec;--bad:#e5484d;--bad-soft:#fdecec;--line:#ece4d6;--radius:18px;--shadow:0 6px 0 var(--line);color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;font-family:Nunito,ui-rounded,system-ui,-apple-system,Segoe UI,sans-serif}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body:before{content:"";z-index:-1;pointer-events:none;background:linear-gradient(var(--bg), transparent 96px), linear-gradient(to top, var(--bg), transparent 96px), radial-gradient(circle at 10% 0%, #ffe3c2 0, transparent 40%), radial-gradient(circle at 100% 100%, #e4defe 0, transparent 45%), var(--bg);position:fixed;inset:0}button{font:inherit;color:inherit}img{max-width:100%;display:block}.app{min-height:100dvh;padding:max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));justify-content:center;display:flex}.screen{flex-direction:column;gap:16px;width:100%;max-width:480px;animation:.35s ease-out enter;display:flex}.spacer{flex:1}.title{text-align:center;margin:0;font-family:Fredoka,Nunito,ui-rounded,system-ui,sans-serif;font-size:clamp(2.5rem,12vw,3.5rem);font-weight:700;line-height:1}.title-accent{color:var(--primary)}.subtitle{text-align:center;color:var(--ink-soft);margin:0;font-size:1.05rem;line-height:1.5}.hint{text-align:center;color:var(--ink-soft);margin:0;font-size:.85rem}.btn{appearance:none;border:2px solid var(--line);background:var(--surface);border-radius:var(--radius);cursor:pointer;min-height:56px;box-shadow:var(--shadow);touch-action:manipulation;-webkit-user-select:none;user-select:none;padding:14px 18px;font-size:1.05rem;font-weight:800;transition:transform 80ms,box-shadow 80ms,background .2s,border-color .2s}.btn:active:not(:disabled){box-shadow:0 2px 0 var(--line);transform:translateY(4px)}.btn:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.btn-primary{background:var(--primary);border-color:var(--primary);color:#fff;box-shadow:0 6px 0 var(--primary-shadow)}.btn-primary:active:not(:disabled){box-shadow:0 2px 0 var(--primary-shadow)}.btn-big{letter-spacing:.02em;min-height:64px;font-size:1.25rem}.btn-ghost{box-shadow:none;color:var(--ink-soft);background:0 0;border-color:#0000}.icon-btn{appearance:none;width:44px;height:44px;color:var(--ink-soft);cursor:pointer;background:0 0;border:0;border-radius:50%;flex-shrink:0;font-size:1.25rem}.start{text-align:center}.lang-switch{background:var(--surface);border:2px solid var(--line);border-radius:999px;align-self:flex-end;gap:4px;padding:4px;display:flex}.lang-option{min-width:44px;min-height:36px;color:var(--ink-soft);border-radius:999px;place-items:center;padding:0 12px;font-size:.9rem;font-weight:800;text-decoration:none;display:grid}.lang-option.is-active{background:var(--accent);color:#fff}.lang-option:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.start-hero{height:180px;margin:0 0 8px;position:relative}.hero-flag{border:4px solid #fff;border-radius:10px;width:140px;animation:4s ease-in-out infinite float;position:absolute;top:50%;left:50%;box-shadow:0 8px 20px #2b214026}.hero-flag-0{transform:translate(-110%,-60%)rotate(-12deg)}.hero-flag-1{z-index:1;animation-delay:-1.3s;transform:translate(-50%,-40%)rotate(3deg)}.hero-flag-2{animation-delay:-2.6s;transform:translate(10%,-65%)rotate(12deg)}.levels-heading{margin:0;font-size:1rem;font-weight:800}.levels{grid-template-columns:1fr 1fr;gap:12px;display:grid}.level{flex-direction:column;align-items:center;gap:2px;display:flex}.level-count{opacity:.75;font-size:.8rem;font-weight:600}.toggle{color:var(--ink-soft);cursor:pointer;justify-content:center;align-items:center;gap:8px;font-size:.95rem;display:inline-flex}.toggle input{width:20px;height:20px;accent-color:var(--accent)}.topbar{align-items:center;gap:8px;display:flex}.progress{background:var(--line);border-radius:999px;flex:1;height:14px;overflow:hidden}.progress-fill{background:linear-gradient(90deg, var(--primary), #ffb03d);border-radius:inherit;height:100%;transition:width .4s}.counter{color:var(--ink-soft);text-align:right;min-width:2.5em;font-weight:800}.prompt{text-align:center;margin:0;font-family:Fredoka,Nunito,sans-serif;font-size:1.35rem;font-weight:600}.flag-card{background:var(--surface);border:2px solid var(--line);border-radius:calc(var(--radius) + 6px);box-shadow:var(--shadow);justify-content:center;padding:16px;display:flex}.flag-img{object-fit:contain;filter:drop-shadow(0 0 1px #2b214059);border-radius:6px;width:100%;max-height:34vh}.options{grid-template-columns:1fr;gap:12px;display:grid}.option{text-align:left;line-height:1.25}.option.is-correct{background:var(--good-soft);border-color:var(--good);color:var(--good);box-shadow:0 6px 0 var(--good)}.option.is-wrong{background:var(--bad-soft);border-color:var(--bad);color:var(--bad);box-shadow:0 6px 0 var(--bad)}.option.is-dimmed{opacity:.45}.option:disabled{cursor:default}.feedback{margin:0 -16px calc(-1 * max(16px, env(safe-area-inset-bottom)));padding:20px 16px max(20px, env(safe-area-inset-bottom));border-radius:24px 24px 0 0;flex-direction:column;gap:12px;animation:.3s ease-out sheet;display:flex;position:sticky;bottom:0;box-shadow:0 -8px 24px #2b21401f}.feedback-good{background:var(--good-soft)}.feedback-bad{background:var(--bad-soft)}.feedback-title{margin:0;font-family:Fredoka,Nunito,sans-serif;font-size:1.35rem;font-weight:700}.feedback-good .feedback-title{color:var(--good)}.feedback-bad .feedback-title{color:var(--bad)}.feedback-fact{margin:0;line-height:1.5}.result{text-align:center}.result-emoji{margin-top:32px;font-size:5rem;animation:.5s ease-out pop}.stars{justify-content:center;gap:8px;font-size:2.5rem;display:flex}.star{color:var(--line)}.star-on{color:#ffc53d;text-shadow:0 3px #e0a21a}.pop{animation:.4s ease-out pop}.shake{animation:.4s ease-in-out shake}.update-toast{top:max(12px, env(safe-area-inset-top));z-index:10;background:var(--surface);border:2px solid var(--line);border-radius:var(--radius);align-items:center;gap:12px;width:min(100% - 32px,480px);margin:0 auto;padding:12px 6px 16px 18px;animation:.3s ease-out enter;display:flex;position:fixed;left:0;right:0;box-shadow:0 8px 24px #2b21401f}.update-text{text-wrap:balance;flex:1;font-weight:800;line-height:1.25}.update-btn{min-height:44px;box-shadow:0 4px 0 var(--primary-shadow);border-radius:999px;padding:8px 18px;font-size:1rem}.update-toast .icon-btn{margin-left:-8px}@keyframes enter{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes sheet{0%{transform:translateY(100%)}to{transform:none}}@keyframes pop{0%{transform:scale(1)}40%{transform:scale(1.06)}to{transform:scale(1)}}@keyframes shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-8px)}40%,80%{transform:translate(8px)}}@keyframes float{50%{margin-top:-8px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}@media (width>=560px){.app{padding-top:48px;padding-bottom:48px}.options{grid-template-columns:1fr 1fr}.feedback{border-radius:var(--radius);margin:0;padding:20px;position:static}.hero-flag{width:170px}.start-hero{height:220px}}