dialog:has(.geo-game) { width: min(1040px,calc(100% - 24px)); }
.geo-game { padding: 18px; background: linear-gradient(145deg,#edf9f5,#eef5ff); }
.geo-settings { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 12px; }
.geo-mode,.geo-difficulty { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 7px; }
.geo-mode button,.geo-difficulty button { border: 2px solid #cbdde1; border-radius: 12px; padding: 9px 8px; background: rgba(255,255,255,.9); color: #385567; font-weight: 850; cursor: pointer; }
.geo-mode button.active,.geo-difficulty button.active { border-color: #188a78; background: #e3f8f2; color: #0b6b5d; box-shadow: 0 0 0 3px rgba(24,138,120,.1); }
.geo-mode button:disabled,.geo-difficulty button:disabled { cursor: default; opacity: .66; }
.geo-status { display: grid; grid-template-columns: minmax(150px,260px); justify-content: center; gap: 9px; margin-bottom: 11px; }
.geo-status span { border-radius: 12px; padding: 8px 10px; background: #fff; color: #58707c; font-size: .78rem; font-weight: 800; text-align: center; }
.geo-status strong { display: block; margin-top: 1px; color: #155b73; font: 900 1.05rem/1.2 var(--font-game); }
.geo-question { min-height: 1.55em; margin: 8px 0 11px; color: #183f55; font: 850 clamp(1rem,2vw,1.25rem)/1.35 var(--font-game); text-align: center; }
.geo-map-wrap { overflow: hidden; width: min(100%,820px); margin-inline: auto; border: 3px solid #fff; border-radius: 19px; background: #bfe5f1; box-shadow: 0 14px 28px rgba(28,76,95,.18); }
#geoMap { display: block; width: 100%; height: auto; aspect-ratio: 2/1; }
.geo-ocean { fill: #bfe7f2; }
.geo-grid-lines { stroke: rgba(255,255,255,.4); stroke-width: 1; stroke-dasharray: 4 8; }
.geo-country { fill: #f1f4e9; stroke: #72939a; stroke-width: .65; vector-effect: non-scaling-stroke; }
.geo-country.geo-solved { fill: var(--geo-solved); stroke: rgba(20,55,64,.78); stroke-width: 1.15; }
.geo-target { fill: #ffb326; stroke: #8b4d00; stroke-width: 2.6; vector-effect: non-scaling-stroke; filter: drop-shadow(0 0 5px rgba(255,139,0,.72)); }
.geo-missed { fill: #ef5b6b; stroke: #8d1d2e; stroke-width: 2.6; vector-effect: non-scaling-stroke; }
.geo-target-marker { fill: rgba(255,255,255,.16); stroke: #ff7518; stroke-width: 4; vector-effect: non-scaling-stroke; transform-box: fill-box; transform-origin: center; animation: geoPulse 1.25s ease-out infinite; }
.geo-target-marker.missed { stroke: #c82f45; animation: none; }
@keyframes geoPulse { 0% { transform: scale(.55); opacity: 1; } 100% { transform: scale(1.8); opacity: .08; } }
.geo-shape-bg { fill: #e7f5f8; }
.geo-shape-country { fill: #21a88d; stroke: #075c53; stroke-width: 4; vector-effect: non-scaling-stroke; filter: drop-shadow(0 10px 8px rgba(17,83,81,.2)); }
.geo-shape-country.geo-shape-correct { fill: #38b86b; }
.geo-shape-country.geo-shape-wrong { fill: #ef5b6b; stroke: #8d1d2e; }
.geo-north { fill: #51727d; stroke: #51727d; stroke-width: 3; font: 900 22px var(--font-game); text-anchor: middle; }
.geo-options { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; width: min(760px,100%); margin: 15px auto 0; }
.geo-answer { min-height: 45px; border: 2px solid #cbdde1; border-radius: 12px; padding: 9px 12px; background: #fff; color: #294f62; font-weight: 850; cursor: pointer; }
.geo-answer:hover:not(:disabled) { border-color: #2b9886; transform: translateY(-1px); }
.geo-answer.correct { border-color: #159465; background: #dff8ed; color: #086343; }
.geo-answer.wrong { border-color: #dc5263; background: #ffe8eb; color: #9b2638; }
.geo-answer:disabled { cursor: default; opacity: .8; }
.geo-answer.correct:disabled { opacity: 1; }
.geo-actions { min-height: 47px; margin-top: 13px; text-align: center; }
.geo-actions button { min-width: 160px; }
.geo-source { margin: 7px 0 0; color: #71878f; font-size: .7rem; text-align: center; }
body.standalone-game #modal:has(.geo-game) { width: min(1040px,calc(100% - 24px)); }
@media (max-width: 680px) {
  .geo-game { padding: 11px; }
  .geo-settings { grid-template-columns: 1fr; gap: 8px; }
  .geo-options { grid-template-columns: 1fr; }
  .geo-answer { min-height: 42px; }
  #geoMap { aspect-ratio: 2/1; }
}
