*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #0d1117;--surface: #161b22;--border: #30363d;--text: #e6edf3;--muted: #8b949e;--red: #ff3333;--green: #3fb950;--accent: #58a6ff}html,body{height:100%;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}#app{min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center}.screen{display:none;flex-direction:column;align-items:center;width:100%;height:100%}.screen.active{display:flex}#screen-mode-select{gap:1.2rem;text-align:center;padding:2rem;justify-content:center;align-items:center}#screen-mode-select h1{font-size:2.5rem;font-weight:700;letter-spacing:-.02em}#screen-mode-select>p{color:var(--muted);max-width:40ch;line-height:1.6}.mode-section{width:100%;max-width:780px;display:flex;flex-direction:column;gap:.6rem}.mode-section-header{font-size:.85rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);text-align:left;margin-top:.8rem}.mode-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;width:100%}.mode-grid--two{grid-template-columns:repeat(2,minmax(0,1fr))}@media(max-width:640px){.mode-grid,.mode-grid--two{grid-template-columns:1fr}}.mode-tile{position:relative;display:flex;flex-direction:column;gap:.5rem;padding:1.4rem 1.2rem;background:var(--surface);border:1px solid var(--border);border-radius:12px;color:var(--text);text-align:left;cursor:pointer;font:inherit;transition:border-color .15s,transform .15s,background .15s}.mode-tile:hover:not(:disabled){border-color:var(--accent);transform:translateY(-2px)}.mode-tile--hard{border-color:#ff333373}.mode-tile--hard:hover:not(:disabled){border-color:var(--red)}.mode-tile--endless{border-color:#58a6ff73}.mode-tile--endless:hover:not(:disabled){border-color:var(--accent)}.tile-metro-bg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;border-radius:12px;opacity:.18;pointer-events:none}.mode-tile:disabled{cursor:not-allowed;opacity:.55}.mode-name{font-size:1.15rem;font-weight:700}.mode-desc{font-size:.9rem;color:var(--muted);line-height:1.45}.mode-badge{margin-top:auto;align-self:flex-start;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);background:var(--bg);border:1px solid var(--border);border-radius:999px;padding:.2rem .6rem}#screen-game{position:fixed;top:0;right:0;bottom:0;left:0;flex-direction:column}#exit-btn{position:absolute;top:1rem;right:1rem;padding:.4rem .9rem;font-size:.85rem;z-index:10;display:none}#screen-game.mode-endless #exit-btn{display:inline-block}#screen-game.mode-endless .question-counter,#screen-game.mode-endless .timer-bar-wrap{display:none}#globe-container{width:100%;height:100%;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:0;margin:0;transform:translateY(-10%)}.game-ui{position:absolute;bottom:calc(3.5rem + env(safe-area-inset-bottom,0px));left:0;right:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:1.1rem;padding:5rem 0 1.5rem;background:linear-gradient(to bottom,transparent,var(--bg) 40%)}.question-counter{font-size:.8rem;color:var(--muted);letter-spacing:.08em;text-transform:uppercase}.question-label{font-size:1.1rem;color:var(--text)}.input-row{display:flex;gap:.5rem;width:calc(100% - 2.5rem);max-width:420px}#answer-input{flex:1;padding:.6rem 1rem;background:var(--surface);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:1rem;outline:none;transition:border-color .15s}#answer-input:focus{border-color:var(--accent)}#answer-input:disabled{opacity:.5}#submit-btn{padding:.6rem 1.2rem;background:var(--accent);border:none;border-radius:8px;color:#0d1117;font-size:.95rem;font-weight:600;cursor:pointer;transition:opacity .15s}#submit-btn:disabled{opacity:.4;cursor:default}.timer-bar-wrap{width:calc(100% - 2.5rem);max-width:420px;height:4px;background:var(--border);border-radius:2px;overflow:hidden}#timer-bar{height:100%;background:var(--accent);transition:width 1s linear,background .3s;width:100%}#timer-bar.urgent{background:var(--red)}#feedback-overlay{position:absolute;top:calc(1.5rem + env(safe-area-inset-top,0px));left:50%;transform:translate(-50%);padding:.6rem 1.4rem;border-radius:8px;font-size:1rem;font-weight:600;opacity:0;transition:opacity .2s;pointer-events:none;white-space:nowrap}#feedback-overlay.visible{opacity:1}#feedback-overlay.correct{background:#3fb95026;border:1px solid var(--green);color:var(--green)}#feedback-overlay.wrong{background:#ff333326;border:1px solid var(--red);color:var(--red)}#screen-metro{position:fixed;top:0;right:0;bottom:0;left:0}#metro-exit-btn{position:absolute;top:1rem;right:1rem;padding:.4rem .9rem;font-size:.85rem;z-index:10}#metro-map{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:0}#metro-map.leaflet-container,#metro-map .leaflet-container{background:var(--bg)!important}#metro-map .leaflet-tile-pane{opacity:0;transition:opacity .6s}#metro-map.show-tiles .leaflet-tile-pane{opacity:1}#metro-map:after{content:"";position:absolute;bottom:0;left:0;right:0;height:80px;background:linear-gradient(to bottom,transparent,var(--bg));z-index:1000;pointer-events:none}#metro-canvas{display:none}#metro-feedback{position:absolute;top:calc(1.5rem + env(safe-area-inset-top,0px));left:50%;transform:translate(-50%);padding:.6rem 1.4rem;border-radius:8px;font-size:1rem;font-weight:600;opacity:0;transition:opacity .2s;pointer-events:none;white-space:nowrap;z-index:10}#metro-feedback.visible{opacity:1}#metro-feedback.correct{background:#3fb95026;border:1px solid var(--green);color:var(--green)}#metro-feedback.wrong{background:#ff333326;border:1px solid var(--red);color:var(--red)}#metro-input{flex:1;padding:.6rem 1rem;background:var(--surface);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:1rem;font-family:inherit;outline:none;transition:border-color .15s}#metro-input:focus{border-color:var(--accent)}#metro-input:disabled{opacity:.5}#metro-submit{padding:.6rem 1.2rem;font-size:.95rem}#metro-hint{font-size:.85rem;padding:.4rem 1.2rem}#metro-timer-bar{height:100%;background:var(--accent);transition:width 1s linear,background .3s;width:100%}#metro-timer-bar.urgent{background:var(--red)}#screen-country{position:fixed;top:0;right:0;bottom:0;left:0}#country-exit-btn{position:absolute;top:1rem;right:1rem;padding:.4rem .9rem;font-size:.85rem;z-index:10}#country-canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}#country-feedback{position:absolute;top:calc(1.5rem + env(safe-area-inset-top,0px));left:50%;transform:translate(-50%);padding:.6rem 1.4rem;border-radius:8px;font-size:1rem;font-weight:600;opacity:0;transition:opacity .2s;pointer-events:none;white-space:nowrap;z-index:10}#country-feedback.visible{opacity:1}#country-feedback.correct{background:#3fb95026;border:1px solid var(--green);color:var(--green)}#country-feedback.wrong{background:#ff333326;border:1px solid var(--red);color:var(--red)}#country-input{flex:1;padding:.6rem 1rem;background:var(--surface);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:1rem;font-family:inherit;outline:none;transition:border-color .15s}#country-input:focus{border-color:var(--accent)}#country-input:disabled{opacity:.5}#country-timer-bar{height:100%;background:var(--accent);transition:width 1s linear,background .3s;width:100%}#country-timer-bar.urgent{background:var(--red)}#screen-end{gap:1.2rem;text-align:center;padding:2rem;justify-content:center}#screen-end h2{font-size:2rem;font-weight:700}.score-display{font-size:3rem;font-weight:800;color:var(--accent)}.points-display{font-size:1.4rem;font-weight:600;color:var(--muted)}.share-text{font-family:monospace;font-size:1.1rem;letter-spacing:.1em}#screen-done{gap:1.2rem;text-align:center;padding:2rem}#screen-done h2{font-size:1.8rem;font-weight:700}#auth-bar{width:100%;max-width:780px;display:flex;justify-content:space-between;align-items:center;gap:.5rem;margin-bottom:.5rem}#auth-user-info{display:flex;align-items:center;gap:.5rem;font-size:.9rem}.auth-avatar{width:26px;height:26px;border-radius:50%;object-fit:cover;border:1px solid var(--border)}#auth-name{font-size:.9rem;color:var(--text)}#auth-streak{font-size:.85rem;color:var(--muted)}#screen-leaderboard{gap:1.2rem;padding:2rem;align-items:center;max-width:560px;margin:0 auto;width:100%}#lb-header{display:flex;align-items:center;justify-content:space-between;width:100%}#lb-header h2{font-size:1.6rem;font-weight:700}#lb-mode-tabs,#lb-diff-tabs,#lb-tabs{display:flex;gap:.5rem;width:100%}.lb-mode-tab,.lb-diff-tab,.lb-tab{padding:.4rem .9rem;border:1px solid var(--border);border-radius:999px;background:transparent;color:var(--muted);font:inherit;font-size:.85rem;cursor:pointer;transition:border-color .15s,color .15s,background .15s}.lb-mode-tab.active,.lb-diff-tab.active,.lb-tab.active{border-color:var(--accent);color:var(--accent);background:#58a6ff14}.lb-diff-tab[data-diff=hard].active{border-color:var(--red);color:var(--red);background:#ff333314}.lb-list{list-style:none;width:100%;display:flex;flex-direction:column;gap:.5rem;margin-top:.6rem}.lb-row{display:flex;align-items:center;gap:.7rem;padding:.7rem 1rem;background:var(--surface);border:1px solid var(--border);border-radius:10px;font-size:.95rem}.lb-rank{width:2rem;text-align:center;font-size:1rem;flex-shrink:0}.lb-avatar{width:28px;height:28px;border-radius:50%;object-fit:cover;flex-shrink:0}.lb-avatar-placeholder{background:var(--border);display:inline-block}.lb-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lb-you{font-size:.7rem;background:#58a6ff26;color:var(--accent);border-radius:4px;padding:.1rem .35rem;margin-left:.3rem;vertical-align:middle}.lb-score{font-weight:700;color:var(--accent);flex-shrink:0}.btn{padding:.7rem 1.8rem;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:opacity .15s}.btn-primary{background:var(--accent);color:#0d1117}.btn-secondary{background:var(--surface);border:1px solid var(--border);color:var(--text)}.btn-sm{padding:.35rem .9rem;font-size:.85rem}.btn-ghost{background:transparent;border:1px solid var(--border);color:var(--muted)}.btn-ghost:hover{border-color:var(--accent);color:var(--text);opacity:1}.btn-gold{border-color:#d4af3799;color:#d4af37;margin-top:.8rem}.btn-gold:hover{border-color:#d4af37;color:#d4af37;background:#d4af3714;opacity:1}.btn:hover{opacity:.85}