@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@600;700;800&display=swap');
:root{--paper:#fcfcfa;--ink:#22251e;--muted:#8a8d83;--lime:#c9f64a;--line:#e8ebe2;--font:'DM Sans',sans-serif}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:var(--paper);font:16px var(--font);min-height:100dvh}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #648a20;outline-offset:5px}[hidden]{display:none!important}a{color:inherit}button:disabled{cursor:default}.header{max-width:1060px;height:90px;padding:0 32px;margin:auto;display:flex;align-items:center;justify-content:space-between}.wordmark{font:800 37px 'Manrope',sans-serif;letter-spacing:-2.7px;text-decoration:none}.wordmark span{color:#89ac39}.header-actions{display:flex;align-items:center;gap:22px}.score{display:flex;align-items:center;gap:7px;font-size:18px}.score>span{font-size:24px;color:#8daa39}.score strong{font-weight:600}.icon-button{border:1px solid var(--line);background:transparent;width:34px;height:34px;border-radius:50%;font-size:18px}.icon-button:hover{background:var(--lime)}main{width:min(100% - 40px,520px);margin:0 auto}.question-block{text-align:center;padding:10px 0 24px}.round-count{font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums;margin-bottom:12px}h1{font:800 clamp(30px,4vw,40px)/1.2 'Manrope',sans-serif;letter-spacing:-1.9px;margin:0}h1 em{font-style:normal;display:inline-block;position:relative;isolation:isolate}h1 em:after{content:'';position:absolute;bottom:1px;left:0;right:0;height:9px;background:var(--lime);z-index:-1;transform:rotate(-1.7deg)}.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.portrait-card{position:relative;border:0;border-radius:22px;overflow:hidden;padding:0;background:#eaede5;aspect-ratio:1.12;box-shadow:0 2px 3px #23310a07;isolation:isolate;transition:transform .22s cubic-bezier(.2,.8,.2,1),box-shadow .22s;animation:card-enter .38s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i)*45ms)}.portrait-card img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .35s}.portrait-card:hover:not(:disabled){transform:translateY(-3px) rotate(-.5deg);box-shadow:0 8px 24px #34411a15}.portrait-card:hover:not(:disabled) img{transform:scale(1.045)}.portrait-card:active:not(:disabled){transform:scale(.94)}.choice-number{position:absolute;left:12px;bottom:12px;width:27px;height:27px;display:grid;place-items:center;font-size:12px;color:white;border:1px solid #ffffff65;background:#22251e28;backdrop-filter:blur(8px);border-radius:9px}.portrait-card.chosen{box-shadow:0 0 0 4px var(--lime)}.portrait-card.is-wrong{box-shadow:0 0 0 4px #f98675}.answer-label{position:absolute;bottom:0;left:0;right:0;text-align:left;padding:35px 12px 12px;background:linear-gradient(transparent,#000b);color:white}.answer-label strong{display:block;font-size:14px}.answer-label span{display:block;font-size:11px;margin-top:3px}.progress-track{display:flex;justify-content:center;gap:7px;margin-top:24px}.progress-track span{width:6px;height:6px;background:#e1e5d8;border-radius:20px;transition:width .3s}.progress-track .active{width:23px;background:#262d1e}.progress-track .correct{background:#9ac438}.progress-track .wrong{background:#ed9683}footer{text-align:center;padding:22px 20px max(20px,env(safe-area-inset-bottom))}.text-button{border:0;padding:5px;background:none;color:var(--muted);font-size:12px}.text-button:hover{color:var(--ink)}.primary{background:var(--ink);color:white;border:0;border-radius:16px;padding:17px 30px;min-height:54px;font-weight:700;font-size:16px;transition:transform .2s,background .2s}.primary:hover{background:#3e4932;transform:translateY(-2px)}.primary:active{transform:scale(.96)}.primary span{margin-left:24px}.reveal{position:fixed;inset:0;margin:0;border:0;width:100%;height:100%;max-width:none;max-height:none;padding:0;overflow-x:hidden;overflow-y:auto;color:var(--ink);background:var(--lime);overscroll-behavior:contain}.reveal[open]{display:grid;place-items:center;animation:screen-in .58s cubic-bezier(.16,1,.3,1) both}.reveal::backdrop{background:transparent}.reveal.is-leaving{animation:screen-out .32s cubic-bezier(.7,0,.85,.3) both;pointer-events:none}.reveal.wrong{background:#17211b;color:white}.flag-scene{position:absolute;inset:0;overflow:hidden;pointer-events:none}.flag-scene img{width:100%;height:100%;object-fit:cover;opacity:.78;animation:flag-in .95s cubic-bezier(.16,1,.3,1) both}.flag-scene:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#112016ed,#11201645 75%,#11201625)}.reveal.success .flag-scene{display:none}#confetti{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:2}.reveal-content{position:relative;z-index:3;text-align:center;width:min(100% - 40px,470px);margin:auto;padding:38px 0;animation:reveal-in .55s .3s both}.reveal.wrong .reveal-content{animation-delay:.48s}.reveal-kicker{font-size:14px;font-weight:600;margin:0 0 14px;opacity:.75}.reveal h2{font:800 clamp(48px,8vw,76px)/1 'Manrope',sans-serif;letter-spacing:-4px;margin:0 0 25px}.reveal-avatar{position:relative;width:116px;height:116px;margin:0 auto 18px}.reveal-avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%;border:5px solid #ffffffb0;box-shadow:0 10px 35px #0002}.country-badge{position:absolute;bottom:-2px;right:-8px;background:white;color:#20231e;border-radius:25px;padding:5px 9px;font-size:24px;line-height:1;box-shadow:0 3px 12px #0001}.reveal-name{font:800 26px 'Manrope',sans-serif;letter-spacing:-.9px;margin:0 0 6px}.reveal-job{font-size:15px;margin:0 0 8px;opacity:.85}.reveal-country{font-size:15px;font-weight:600;margin:0 0 20px}.reveal-country a{font-weight:400;opacity:.7;font-size:12px;margin-left:6px;text-underline-offset:3px}.reveal .primary{width:100%;margin-top:26px}.reveal.wrong .primary{background:white;color:#20251d}.correct-person{display:flex;align-items:center;gap:12px;text-align:left;border:1px solid #ffffff35;background:#ffffff14;border-radius:17px;padding:12px 15px;margin-top:25px;backdrop-filter:blur(12px)}.correct-person img{width:48px;height:48px;object-fit:cover;border-radius:11px}.correct-person span{display:block;font-size:12px;opacity:.8;margin-bottom:4px}.correct-person strong{font-size:15px}.reveal.success .reveal-avatar{animation:avatar-bounce .6s .4s both}.result-score{font:800 120px 'Manrope',sans-serif;letter-spacing:-8px;margin:20px 0}.result-score small{font-size:28px;letter-spacing:-1px;color:var(--muted)}.results{text-align:center;padding:70px 0}.results h1{font-size:38px}.result-history{display:flex;justify-content:center;gap:8px;margin:0 0 35px}.result-history span{background:#edf4df;color:#557a1e;width:30px;height:30px;border-radius:50%;display:grid;place-items:center}.result-history .wrong{background:#fff0e9;color:#b46555}.info-modal{border:1px solid var(--line);border-radius:24px;padding:25px;width:min(680px,calc(100% - 28px));max-height:85dvh;color:var(--ink);background:var(--paper)}.info-modal::backdrop{background:#19221b66;backdrop-filter:blur(7px)}.modal-top{display:flex;align-items:center;justify-content:space-between}.info-modal h2{font:800 27px 'Manrope',sans-serif;letter-spacing:-1px}.info-modal p,.info-modal li{line-height:1.6;color:#666e5f;font-size:15px}.info-modal li{margin-bottom:10px}.source-row{display:flex;gap:15px;padding:17px 0;border-bottom:1px solid var(--line)}.source-row img{width:55px;height:66px;object-fit:cover;border-radius:9px}.source-row strong{display:block;font-size:15px}.source-row p{font-size:12px;margin:4px 0}.source-row a{font-size:12px;margin-right:12px}.dataset-stats{background:#f0f4e8;padding:12px;border-radius:10px}body:has(.reveal[open]){overflow:hidden}@keyframes screen-in{from{clip-path:circle(0 at var(--origin-x,50%) var(--origin-y,50%))}to{clip-path:circle(150vmax at var(--origin-x,50%) var(--origin-y,50%))}}@keyframes screen-out{from{clip-path:inset(0)}to{clip-path:inset(0 0 100% 0)}}@keyframes flag-in{from{transform:scale(1.4) rotate(-6deg)}to{transform:scale(1) rotate(0)}}@keyframes reveal-in{from{opacity:0;transform:translateY(28px) scale(.94)}to{opacity:1;transform:none}}@keyframes avatar-bounce{0%{transform:scale(.65) rotate(-12deg)}65%{transform:scale(1.08) rotate(4deg)}100%{transform:none}}@keyframes card-enter{from{opacity:0;transform:translateY(15px) scale(.96)}to{opacity:1;transform:none}}@media(min-width:700px) and (min-height:850px){main{width:min(100% - 40px,570px)}.question-block{padding:20px 0 32px}.cards{gap:17px}.portrait-card{aspect-ratio:1.08}.header{height:100px}}@media(max-width:600px){.header{height:72px;padding:0 23px}.wordmark{font-size:31px}.header-actions{gap:18px}.score{font-size:16px}.icon-button{width:31px;height:31px}main{width:calc(100% - 32px);max-width:470px}.question-block{padding:8px 0 22px}.round-count{font-size:12px;margin-bottom:10px}h1{font-size:clamp(28px,7.7vw,37px);letter-spacing:-1.65px}.cards{gap:11px}.portrait-card{border-radius:19px;aspect-ratio:auto;height:clamp(144px,calc((100dvh - 247px)/2),246px)}.choice-number{width:23px;height:23px;left:10px;bottom:10px;font-size:11px}.progress-track{margin-top:20px}footer{padding-top:16px}.reveal-content{padding:30px 0;width:calc(100% - 44px);max-width:420px}.reveal h2{font-size:58px;letter-spacing:-3.2px;margin-bottom:23px}.reveal-avatar{width:100px;height:100px}.reveal-name{font-size:24px}.reveal-job{font-size:14px}.correct-person{margin-top:19px}.reveal .primary{margin-top:22px}.results{padding:65px 0}.result-score{font-size:100px}.result-history{gap:5px}.result-history span{width:26px;height:26px;font-size:12px}}@media(max-height:640px){.reveal-content{padding:24px 0}.reveal h2{font-size:44px;margin-bottom:16px}.reveal-avatar{width:75px;height:75px;margin-bottom:12px}.reveal-kicker{margin-bottom:8px}.reveal-name{font-size:22px}.correct-person{margin-top:15px}.reveal .primary{margin-top:15px}.reveal-country{margin-bottom:10px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}#confetti{display:none}}

@media(max-width:600px){.flag-scene img{object-fit:fill}}

/* Larger portraits on desktop, with room for both rows in the viewport. */
@media(min-width:900px){
  main{width:min(calc(100% - 64px),840px)}
  .header{height:76px}
  .question-block{padding:8px 0 22px}
  .cards{gap:18px}
  .portrait-card{aspect-ratio:auto;height:clamp(240px,calc((100dvh - 260px)/2),380px);border-radius:24px}
}

/* Endless streak counters */
.counter-copy{display:flex;flex-direction:column;align-items:center;gap:1px;min-width:26px}.counter-copy strong{font-size:20px;line-height:1;font-variant-numeric:tabular-nums}.counter-copy small{font-size:10px;color:var(--muted);font-weight:500}.score.record>span:first-child{color:#ae9046}.header-actions{gap:22px}.question-block{padding-top:28px}.progress-track{min-height:6px}
@media(max-width:600px){.header-actions{gap:15px}.counter-copy strong{font-size:18px}.score{gap:5px}.score>span:first-child{font-size:21px}.question-block{padding-top:20px;padding-bottom:25px}.portrait-card{height:clamp(144px,calc((100dvh - 229px)/2),254px)}}

.portrait-card img{object-position:var(--portrait-position,50% 25%);scale:var(--portrait-zoom,1);transform-origin:var(--portrait-origin,50% 50%)}
@media(min-width:900px){.portrait-card img{object-position:var(--portrait-position-wide,50% 25%);scale:var(--portrait-zoom-wide,1);transform-origin:var(--portrait-origin-wide,50% 50%)}}