.flag-game{width:min(100%,560px);display:grid;gap:18px}.flag-progress{height:7px;background:#30343a;border-radius:99px;overflow:hidden}.flag-progress span{display:block;height:100%;width:0;background:var(--lime);transition:width .2s}.flag-frame{min-height:265px;padding:22px;background:linear-gradient(145deg,#272b31,#1d2024);border:1px solid #3a3f46;border-radius:16px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px}.flag-image{display:block;max-width:100%;width:auto;height:auto;max-height:205px;object-fit:contain;border:1px solid #ffffff2b;box-shadow:0 12px 28px #0007}.flag-number{margin:0;color:var(--muted);font-size:12px;letter-spacing:1.5px;text-transform:uppercase}.flag-answer label{display:block;margin-bottom:8px;color:#ddd;font-size:13px;font-weight:600}.flag-answer>div{display:grid;grid-template-columns:1fr auto;gap:8px}.flag-answer input{min-width:0;padding:13px 14px;border:1px solid #51565e;border-radius:8px;background:#262a2f;color:#fff;font:inherit}.flag-answer input:focus{outline:3px solid var(--pink);outline-offset:2px;border-color:transparent}.flag-answer button{padding:0 20px;border:1px solid var(--lime);border-radius:8px;background:var(--lime);color:#17191c;font-weight:700}.flag-answer button:disabled,.flag-answer input:disabled{opacity:.55}.flag-result{min-height:22px;text-align:center;color:var(--lime);font-weight:600}.flag-answer input::placeholder{color:#8d9299}@media(max-width:560px){.flag-game{gap:13px}.flag-frame{min-height:205px;padding:14px}.flag-image{max-height:155px}.flag-answer>div{grid-template-columns:1fr}.flag-answer button{min-height:46px}.flag-result{font-size:14px}}
