*{box-sizing:border-box}html{color-scheme:light}body{margin:0;background:#fff;color:#111;font-family:Arial,Helvetica,sans-serif}main{min-height:100vh;min-height:100svh;display:grid;place-items:center;padding:48px 24px;text-align:center}h1{margin:0;max-width:100%;font-size:clamp(2.4rem,6.7vw,7rem);font-weight:700;line-height:1.15;letter-spacing:-.045em}button{position:relative;display:grid;place-items:center;min-height:168px;max-width:100%;padding:18px 0;border:0;background:none;color:inherit;font:inherit;letter-spacing:inherit;line-height:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:2px solid #b71924;outline-offset:12px;border-radius:2px}.text{display:block;text-wrap:balance;transition:opacity .35s ease,transform .45s ease;transform:scale(1)}.flag{position:absolute;inset:0;display:grid;place-items:center;opacity:0;visibility:hidden;transform:scale(.94);transition:opacity .4s ease,transform .6s ease,visibility .4s;pointer-events:none}.flag img{display:block;width:192px;height:128px;border:1px solid #eee}.flag canvas{display:block;width:224px;height:168px;max-width:100%;object-fit:contain;filter:drop-shadow(0 2px 3px rgb(0 0 0 / .07))}[hidden]{display:none!important}.show-flag .text{opacity:0;transform:scale(.97)}.show-flag .flag{opacity:1;visibility:visible;transform:scale(1)}@media(max-width:480px){main{padding:32px 20px}h1{font-size:clamp(2rem,8.5vw,2.6rem)}}@media(prefers-reduced-motion:reduce){.text,.flag{transition:none;transform:none!important}}
#soundButton{position:fixed;right:24px;bottom:20px;display:block;min-height:44px;min-width:60px;padding:12px;font-family:Arial,Helvetica,sans-serif;font-size:14px;font-weight:400;letter-spacing:0;line-height:20px;color:#666}#soundButton:hover{color:#111}