:root{--text:#6b6375;--text-h:#08060d;--bg:#fff;--border:#e5e4e7;--code-bg:#f4f3ec;--accent:#aa3bff;--accent-bg:#aa3bff1a;--accent-border:#aa3bff80;--social-bg:#f4f3ec80;--shadow:#0000001a 0 10px 15px -3px, #0000000d 0 4px 6px -2px;--sans:system-ui, "Segoe UI", Roboto, sans-serif;--heading:system-ui, "Segoe UI", Roboto, sans-serif;--mono:ui-monospace, Consolas, monospace;font:18px/145% var(--sans);letter-spacing:.18px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}@media (width<=1024px){:root{font-size:16px}}@media (prefers-color-scheme:dark){:root{--text:#9ca3af;--text-h:#f3f4f6;--bg:#16171d;--border:#2e303a;--code-bg:#1f2028;--accent:#c084fc;--accent-bg:#c084fc26;--accent-border:#c084fc80;--social-bg:#2f303a80;--shadow:#0006 0 10px 15px -3px, #00000040 0 4px 6px -2px}#social .button-icon{filter:invert()brightness(2)}}body{margin:0}#root{text-align:center;box-sizing:border-box;flex-direction:column;width:100%;max-width:none;min-height:100svh;margin:0;display:flex}h1,h2{font-family:var(--heading);color:var(--text-h);font-weight:500}h1{letter-spacing:-1.68px;margin:32px 0;font-size:56px}@media (width<=1024px){h1{margin:20px 0;font-size:36px}}h2{letter-spacing:-.24px;margin:0 0 8px;font-size:24px;line-height:118%}@media (width<=1024px){h2{font-size:20px}}p{margin:0}code,.counter{font-family:var(--mono);color:var(--text-h);border-radius:4px;display:inline-flex}code{background:var(--code-bg);padding:4px 8px;font-size:15px;line-height:135%}*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--font:"Nunito", "Segoe UI", sans-serif;--pink:#ffb3c6;--peach:#ffcba4;--sky:#b8e0ff;--yellow:#fff0a0;--mint:#c8f0d8;--cream:#fff8ee;--orange:#ffedd5;--radius:12px;--shadow:3px 3px 0 var(--border)}.light{--bg:#fff8f0;--surface:#fff;--compass-bg:#fffdf8;--border:#1a1a1a;--text:#1a1a1a;--text-muted:#555;--input-bg:#fff;--input-text:#1a1a1a;--ac-bg:#fff;--ac-hover:#fff0e8;--btn-primary:var(--pink);--btn-hint:var(--peach);--btn-skip:var(--sky)}.dark{--bg:#1c1917;--surface:#292524;--compass-bg:#231f1d;--border:#78716c;--text:#f5f0eb;--text-muted:#a8a29e;--input-bg:#3c3834;--input-text:#f5f0eb;--ac-bg:#3c3834;--ac-hover:#504b46;--btn-primary:#9d4f6e;--btn-hint:#8c5e3c;--btn-skip:#3a5f8a}body{font-family:var(--font);min-height:100dvh;overflow-x:hidden}.app{background:var(--bg);color:var(--text);flex-direction:column;min-height:100dvh;transition:background .25s,color .25s;display:flex}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-7px)}40%{transform:translate(7px)}60%{transform:translate(-4px)}80%{transform:translate(4px)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.85}}@keyframes arrow-pop{0%{opacity:0;transform:scale(.4)}65%{transform:scale(1.18)}to{opacity:1;transform:scale(1)}}@keyframes modal-in{0%{opacity:0;transform:scale(.88)}to{opacity:1;transform:scale(1)}}@keyframes toast-in{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}body.anim-shake{animation:.38s shake}body.anim-pulse{animation:.3s pulse}.arrow-new{animation:.42s cubic-bezier(.34,1.56,.64,1) both arrow-pop}.header{flex-shrink:0;justify-content:space-between;align-items:center;padding:14px 20px 10px;display:flex}.game-title{z-index:100;pointer-events:none;-webkit-user-select:none;user-select:none;letter-spacing:.5px;color:var(--peach);text-transform:lowercase;-webkit-text-stroke:0;text-shadow:-2px -2px 0 var(--border), 2px -2px 0 var(--border), -2px 2px 0 var(--border), 2px 2px 0 var(--border), 3px 3px 0 var(--border);margin:0;font-family:"Baloo 2",sans-serif;font-size:clamp(1.6rem,4vw,2.2rem);font-weight:1000;position:fixed;bottom:20px;left:50%;transform:translate(-50%)}.dark .game-title{text-shadow:none}.header-right{align-items:center;gap:8px;display:flex}.header-btn{border:2.5px solid var(--border);background:var(--peach);width:40px;height:40px;box-shadow:var(--shadow);cursor:pointer;color:var(--border);border-radius:50%;justify-content:center;align-items:center;font-size:1rem;font-weight:900;transition:transform .1s,box-shadow .1s;display:flex}.dark .header-btn{color:var(--text);background:#44403c}.header-btn:hover{box-shadow:4px 4px 0 var(--border);transform:translate(-1px,-1px)}.header-btn:active{box-shadow:1px 1px 0 var(--border);transform:translate(1px,1px)}.feedback-toast{text-align:center;border-radius:var(--radius);opacity:0;pointer-events:none;border:2px solid #0000;max-width:360px;min-height:36px;margin:0 auto 4px;padding:7px 18px;font-size:.9rem;font-weight:700;transition:opacity .2s}.feedback-toast.visible{opacity:1;border-color:var(--border);background:var(--yellow);color:var(--border);box-shadow:var(--shadow);animation:.2s toast-in}.dark .feedback-toast.visible{color:var(--text);background:#44403c}.main{flex-wrap:wrap;flex:1;justify-content:center;align-items:flex-start;gap:28px;padding:8px 20px;display:flex}.compass-section{flex-direction:column;flex:420px;align-items:center;gap:16px;max-width:520px;display:flex}.compass-outer{aspect-ratio:1;touch-action:none;pointer-events:none;border-radius:50%;position:relative}.compass-svg{pointer-events:none;width:100%;height:100%;display:block;overflow:visible}.hint-section{flex-direction:column;flex:0 220px;align-items:stretch;padding-top:0;display:flex}.flag-challenge{background:var(--surface);border:2.5px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);flex-direction:column;align-items:center;gap:12px;padding:18px 16px;display:flex}.flag-hint-label{text-align:center;color:var(--text-muted);font-size:.82rem;font-weight:700}.flag-emoji-display{filter:drop-shadow(1px 2px #0000001f);font-size:3.4rem;line-height:1}.flag-buttons{gap:8px;width:100%;display:flex}.flag-buttons .btn{flex:1}.autocomplete-wrap{width:100%;position:relative}.ac-dropdown{background:var(--ac-bg);border:2px solid var(--border);box-shadow:3px 3px 0 var(--border);z-index:50;border-radius:10px;max-height:240px;list-style:none;position:absolute;bottom:calc(100% + 4px);left:0;right:0;overflow:hidden auto}.ac-dropdown-up{top:auto;bottom:calc(100% + 4px)}.flag-challenge .ac-dropdown{top:calc(100% + 4px);bottom:auto}.ac-flag{font-size:1.2rem}.text-input{border:2.5px solid var(--border);border-radius:var(--radius);width:100%;font-family:var(--font);background:var(--input-bg);color:var(--input-text);outline:none;padding:10px 14px;font-size:.95rem;font-weight:600;transition:border-color .15s,box-shadow .15s}.text-input::placeholder{color:var(--text-muted);opacity:.7}.text-input:focus{border-color:var(--pink);box-shadow:0 0 0 3px #ffb3c659}.dark .text-input:focus{box-shadow:0 0 0 3px #be185d4d}.text-input:disabled{opacity:.5;cursor:not-allowed}.btn{border:2.5px solid var(--border);border-radius:var(--radius);font-family:var(--font);cursor:pointer;box-shadow:var(--shadow);white-space:nowrap;color:var(--border);padding:10px 16px;font-size:.9rem;font-weight:800;transition:transform .1s,box-shadow .1s}.dark .btn{color:var(--text);border-color:var(--border)}.btn:hover{box-shadow:4px 4px 0 var(--border);transform:translate(-1px,-1px)}.btn:active{box-shadow:1px 1px 0 var(--border);transform:translate(1px,1px)}.btn:disabled{opacity:.45;cursor:not-allowed;box-shadow:var(--shadow);transform:none}.btn-guess{background:var(--btn-primary)}.btn-hint{background:var(--btn-hint)}.btn-skip{background:var(--btn-skip)}.bottom{flex-direction:column;flex-shrink:0;align-items:center;gap:10px;padding:8px 20px 20px;display:flex}.guess-wrap{gap:8px;width:100%;max-width:520px;display:flex;position:relative}.attempts-bar{align-items:center;gap:8px;display:flex}.attempt-dot{border:2.5px solid var(--border);border-radius:50%;width:20px;height:20px;transition:background .25s,transform .2s}.attempt-dot.active{background:var(--pink);box-shadow:2px 2px 0 var(--border)}.attempt-dot.used{background:var(--text-muted);opacity:.35}.modal-overlay{z-index:200;background:#00000061;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.modal-box{background:var(--surface);color:var(--text);border:3px solid var(--border);box-shadow:5px 5px 0 var(--border);border-radius:18px;width:100%;max-width:400px;padding:28px 24px 24px;animation:.24s cubic-bezier(.34,1.56,.64,1) modal-in;position:relative}.modal-close{cursor:pointer;color:var(--text-muted);background:0 0;border:none;font-size:1.1rem;font-weight:900;position:absolute;top:14px;right:16px}.modal-close:hover{color:var(--text)}.modal-box h2{margin-bottom:14px;font-size:1.3rem;font-weight:900}.how-list{flex-direction:column;gap:8px;margin-bottom:20px;padding-left:20px;font-size:.88rem;line-height:1.55;display:flex}.result-modal{text-align:center}.result-emoji{margin-bottom:10px;font-size:3.5rem}.result-country{margin:10px 0 22px;font-size:1rem;line-height:1.5}@media (width<=640px){.main{flex-direction:column;align-items:center;gap:14px;padding:6px 12px}.compass-section .compass-outer{width:clamp(250px,100%,520px);margin-bottom:-100px;transform:translateY(-100px)}.hint-section{flex:none;width:100%;max-width:100%;padding-top:0}.flag-challenge{flex-direction:column}.header{padding:10px 14px 8px}.game-title{font-size:1.5rem}.guess-wrap{max-width:100%}}@media (width>=1100px){.main{gap:40px;padding:12px 40px}.compass-section{flex:500px;max-width:600px}}.header-left{align-items:center;gap:8px;display:flex}.ac-item{cursor:pointer;color:var(--text);align-items:center;gap:10px;padding:9px 12px;font-size:.9rem;font-weight:600;transition:background .1s;display:flex}.ac-item-active{background:var(--ac-hover)}.ac-dropdown-down{top:calc(100% + 4px);bottom:auto}.result-buttons{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.btn-map-review{background:var(--mint,#c8f0d8)}.dark .btn-map-review{color:#d1fae5;background:#2d5a3d}.app{-webkit-user-select:none;user-select:none}.app input,.app textarea{-webkit-user-select:text;user-select:text}.flag-challenge-message{justify-content:center;gap:12px;min-height:160px}.last-attempt-icon{text-align:center;font-size:2rem}@keyframes hologram{0%,to{opacity:.7;filter:drop-shadow(0 0 2px var(--pink))}50%{opacity:1;filter:drop-shadow(0 0 6px var(--pink)) brightness(1.2)}}.hologram-icon{pointer-events:none;animation:2s ease-in-out infinite hologram}.bouncy-wrap{cursor:pointer;transform-origin:50%;transition:transform .15s cubic-bezier(.4,0,.2,1)}.bouncy-wrap:hover{transform:translateY(-4px)scale(1.02)}.bouncy-wrap:active{transform:translateY(4px)scale(.98)}.floating-compass.collapsed-box{clip-path:circle(24px);overflow:hidden;width:48px!important;min-width:48px!important;height:48px!important;min-height:48px!important}.resize-ring{transition:stroke .2s,opacity .2s}.resize-ring:hover{stroke:var(--pink);opacity:.3}.compass-elements{transition:transform .4s cubic-bezier(.34,1.56,.64,1),opacity .3s}.compass-elements.collapsed{opacity:0;transform:scale(0)}.drawer-overlay{pointer-events:none;visibility:hidden}.drawer-overlay.drawer-overlay-open{pointer-events:auto;visibility:visible}.map-drawer{z-index:300;pointer-events:none;visibility:hidden;opacity:0;flex-direction:column;padding:3vh 3vw;transition:transform .3s cubic-bezier(.34,1.56,.64,1),opacity .3s,visibility .3s;display:flex;position:fixed;inset:0;transform:scale(.95)}.map-drawer-open{opacity:1;visibility:visible;pointer-events:auto;transform:scale(1)}.drawer-inner{border:3px solid var(--border);box-shadow:6px 6px 0 var(--border);pointer-events:auto;background:var(--bg);border-radius:18px;flex-direction:column;flex:1;display:flex;position:relative;overflow:hidden}.drawer-header{background:var(--surface);border-bottom:2px solid var(--border);z-index:10;flex-direction:row;justify-content:space-between;align-items:center;gap:16px;padding:12px 20px;display:flex}.drawer-header-left{flex-wrap:wrap;align-items:baseline;gap:12px;display:flex}.drawer-title{margin:0;font-size:1.1rem;font-weight:800}.drawer-hint{color:var(--text-muted);margin:0;font-size:.9rem}.drawer-map-area{flex-direction:column;flex:1;min-height:0;display:flex;position:relative}.drawer-map-area>div,.drawer-map-area>svg{flex:1;height:100%}.drawer-handle{display:none}.floating-compass{z-index:100;pointer-events:none;width:280px;height:280px;position:absolute;bottom:24px;left:24px}.compass-hovered{transition:transform .15s cubic-bezier(.4,0,.2,1);transform:translateY(-4px)scale(1.02)}.floating-compass .compass-svg{max-width:100%;transform:none}.app-fullscreen{-webkit-user-select:none;user-select:none;width:100vw;height:100vh;position:relative;overflow:hidden}.app-fullscreen input{-webkit-user-select:text;user-select:text}.map-background{z-index:1;position:absolute;inset:0}.settings-menu-container{z-index:200;align-items:center;gap:8px;display:flex;position:fixed;top:16px;right:16px}.settings-gear-btn{width:40px;height:40px}.settings-dropdown{box-shadow:none;background:0 0;border:none;flex-direction:column;align-items:flex-end;gap:12px;min-width:auto;padding:0;animation:.3s cubic-bezier(.34,1.56,.64,1) forwards slide-down-fade;display:flex;position:absolute;top:60px;right:0}@keyframes slide-down-fade{0%{opacity:0;transform:translateY(-15px)}to{opacity:1;transform:translateY(0)}}.attempts-bar-fixed{background:var(--surface);border:3px solid var(--border);box-shadow:4px 4px 0 var(--border);z-index:150;pointer-events:auto;border-radius:30px;gap:8px;padding:10px 16px;display:flex;position:fixed;top:16px;left:50%;transform:translate(-50%)}.floating-tool-box{z-index:150;background:var(--surface);border:3px solid var(--border);box-shadow:6px 6px 0 var(--border);pointer-events:auto;touch-action:none;border-radius:16px;padding:10px;position:absolute;overflow:visible!important}.tool-toggle-btn{background:var(--bg);border:2px solid var(--border);color:var(--text);cursor:pointer;text-align:left;white-space:nowrap;border-radius:10px;width:100%;padding:10px 16px;font-weight:700}.flag-content-row{align-items:center;gap:12px;display:flex}.flag-emoji-display{background:var(--bg);border:2px solid var(--border);border-radius:8px;padding:4px 10px;font-size:2.2rem}.resize-handle-corner{border-right:3.5px solid var(--pink);border-bottom:3.5px solid var(--pink);cursor:nwse-resize;border-bottom-right-radius:12px;width:14px;height:14px;position:absolute;bottom:0;right:0;transform:translate(-6px,-6px)}.resize-handle-corner:after{content:"";width:48px;height:48px;cursor:inherit;background:0 0;position:absolute;bottom:-15px;right:-15px}.tool-expanded-content{flex-direction:row;align-items:center;gap:12px;animation:.3s cubic-bezier(.34,1.56,.64,1) forwards slide-right;display:flex;overflow:visible!important}@keyframes slide-up-fade{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-15px)}}.settings-dropdown.closing{animation:.2s cubic-bezier(.4,0,1,1) forwards slide-up-fade}@keyframes slide-right{0%{opacity:0;transform:translate(-10px)scaleX(.9)}to{opacity:1;transform:translate(0)scaleX(1)}}.floating-draggable{cursor:grab;position:fixed}.floating-draggable:active{cursor:grabbing}.light .modal-box h2{color:#78716c}.modal-box h2,.how-list{text-align:left}.dark .floating-tool-box,.dark .floating-tool-box .btn,.dark .floating-tool-box .btn:hover,.dark .floating-tool-box .btn:active,.dark .settings-gear-btn,.dark .attempts-bar-fixed,.dark .header-btn,.dark .header-btn:hover,.dark .header-btn:active{box-shadow:none}.dark .compass-svg g[style*=drop-shadow]{filter:none!important}.dark .flag-img,.dark .flag-img-placeholder{box-shadow:inset 0 0 0 1px #fff3}@keyframes icon-pop{0%{opacity:0;transform:scale(0)}65%{transform:scale(1.5)}to{opacity:1;transform:scale(1)}}.center-icon-pop{transform-box:fill-box;transform-origin:50%;animation:.42s cubic-bezier(.34,1.56,.64,1) both icon-pop}.flag-img-display{flex-shrink:0;justify-content:center;align-items:center;width:66px;height:50px;display:flex}.flag-img{object-fit:unset;image-rendering:auto;pointer-events:none;-webkit-user-select:none;user-select:none;background:#f0e6ff;border:2.5px solid #2d2d2d;border-radius:6px;width:auto;max-width:72px;height:36px;max-height:36px;transition:transform .15s,box-shadow .15s;display:block;box-shadow:2px 2px #2d2d2d,inset 0 0 0 1px #ffffff59}.flag-img-display .flag-img{animation:.25s cubic-bezier(.34,1.56,.64,1) both flagPop}@keyframes flagPop{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}.flag-img-placeholder{color:#aaa;background:#f0e6ff;border:2.5px solid #2d2d2d;border-radius:6px;justify-content:center;align-items:center;width:44px;height:33px;font-size:.75rem;display:flex;box-shadow:2px 2px #2d2d2d}.flag-img-fallback{background:#f8f0ff;border:2.5px dashed #c4a8e0;border-radius:6px;display:inline-block;box-shadow:2px 2px #2d2d2d}.how-to-play-overlay{align-items:center;padding:12px}.how-to-play-box{flex-direction:column;max-height:calc(100dvh - 24px);display:flex}.how-to-play-scroll{-webkit-overflow-scrolling:touch;flex:auto;padding-right:4px;overflow-y:auto}.how-to-play-scroll:not(:last-child){-webkit-mask-image:linear-gradient(#000 calc(100% - 24px),#0000 100%);mask-image:linear-gradient(#000 calc(100% - 24px),#0000 100%)}.how-to-play-scroll.at-bottom{-webkit-mask-image:none;mask-image:none}.how-to-play-btn{flex-shrink:0;width:100%;margin-top:16px}@media (height<=500px){.how-to-play-overlay{align-items:flex-start;padding-top:8px;padding-bottom:8px}.how-to-play-box{max-height:calc(100dvh - 16px);padding:16px 18px 14px}.how-to-play-box h2{margin-bottom:8px;font-size:1rem}.how-to-play-btn{margin-top:10px;padding:8px 12px;font-size:.85rem}.how-list{gap:5px;font-size:.83rem}}@media (width<=380px){.how-to-play-box{padding:18px 14px 16px}}
