/* Harita oyunu (29. tur): the base comes from ../rota/rota.css and ../kartlar/kartlar.css. */
body.map-page:before{background:linear-gradient(#07162499,#071624dd),url('../assets/celsus-room-v1.webp') center/cover no-repeat}
body.map-page main{max-width:980px}
/* One row of kinds (it scrolls sideways when narrow), so nothing below moves when they arrive. */
.map-kinds{display:flex;flex-wrap:nowrap;gap:8px;min-height:42px;overflow-x:auto;scrollbar-width:thin}
.map-kinds .kind{flex:none;min-height:40px;padding:8px 13px;border-radius:999px;border:1px solid var(--ui-line,#3a4b5c);background:var(--ui-raised,#1f2d3b);color:var(--ui-text,#f4f1ea);font:600 13px/1.2 system-ui,sans-serif;cursor:pointer}
.map-kinds .kind[aria-pressed="true"]{background:var(--ui-accent,#ecc27f);border-color:var(--ui-accent,#ecc27f);color:#1a1408}
.map-stage{display:grid;gap:14px}
.map-page .cards-head .quiet{margin:0}.map-page .map-stats{margin-bottom:2px}
.map-card{padding:20px;display:grid;gap:10px;min-width:0}
/* 40. tur: the card asks one question (“… hangi ildedir?”) instead of a big name over a short clue. */
.place-question{margin:0;font:500 21px/1.4 Georgia,serif;color:var(--ui-text,#f4f1ea)}
.place-note{margin:0;font-size:13px;line-height:1.45;color:var(--ui-accent,#ecc27f)}
.map-info{margin:0;padding:8px 10px;border-left:3px solid var(--ui-accent,#ecc27f);border-radius:4px;background:rgba(236,194,127,.08);font-size:13.5px;line-height:1.5;color:var(--ui-text,#f4f1ea)}
.place-badge{justify-self:start;margin:0;padding:3px 10px;border-radius:999px;border:1px solid var(--ui-accent,#ecc27f);color:var(--ui-accent,#ecc27f);font:700 11px/1.4 system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase}
/* The map: parchment land on a night sea; lakes and labels never take a tap. */
.map-box{position:relative;border-radius:12px;overflow:hidden;border:1px solid var(--ui-line,#3a4b5c);background:radial-gradient(ellipse at 50% 40%,#1d4260,#0c1f30 75%)}
.map-box .map-blank{aspect-ratio:2/1}
.map-box svg{display:block;width:100%;aspect-ratio:2/1;touch-action:none;user-select:none;-webkit-user-select:none;cursor:pointer}
.map-box .provinces path{fill:#e3d7bb;stroke:#6e604a;stroke-width:.7;vector-effect:non-scaling-stroke;stroke-linejoin:round;transition:fill .15s}
@media(hover:hover){.map-box .provinces path:hover{fill:#f3ead3}}
.map-box .provinces path.sel{fill:var(--ui-accent,#ecc27f);stroke:#3b2d10;stroke-width:1.6}
.map-box .provinces path.right{fill:#79c79c;stroke:#1d4b33;stroke-width:1.4}
.map-box .provinces path.wrong{fill:#e59478;stroke:#5a2415;stroke-width:1.4}
.map-box .lakes path{fill:#6fa8c9;stroke:#3e6f8e;stroke-width:.5;vector-effect:non-scaling-stroke;pointer-events:none}
.map-box .labels,.map-box .names{pointer-events:none}
.map-box .nm{font-family:system-ui,sans-serif;font-weight:600;fill:#3d3524;stroke:#f3ead6;paint-order:stroke;stroke-linejoin:round}
.map-box .nm.off{display:none}.map-box .nm.on{fill:#1a1206;font-weight:800}
.map-box .lab{font-family:system-ui,sans-serif;font-weight:700;fill:#10202c;stroke:#fffdf6;paint-order:stroke;stroke-linejoin:round}
.map-box .lab.wrong{fill:#5a1a0c}
.map-tools{position:absolute;right:8px;bottom:8px;display:flex;gap:6px}
.map-zoom{min-width:44px;min-height:44px;border-radius:10px;border:1px solid #0006;background:#f7f1e2ee;color:#1b2733;font:700 20px/1 system-ui,sans-serif;cursor:pointer;box-shadow:0 2px 6px #0005}
.map-zoom.wide{font-size:12px}
.map-answer{display:flex;flex-wrap:wrap;align-items:center;gap:10px;justify-content:space-between;scroll-margin-bottom:calc(96px + env(safe-area-inset-bottom))}
.map-status{margin:0;flex:1 1 220px;font-size:13px}
.map-answer .action[disabled]{opacity:.5;cursor:not-allowed}
.map-list{font-size:13px;color:var(--ui-muted,#c6ced6)}
.map-list summary{cursor:pointer;min-height:32px;display:flex;align-items:center}
.map-list label{display:flex;align-items:center;gap:8px;margin-top:6px}
.map-list select{min-height:40px;border-radius:8px;border:1px solid var(--ui-line,#3a4b5c);background:var(--ui-raised,#1f2d3b);color:var(--ui-text,#f4f1ea);padding:0 10px;font-size:15px}
.map-card .card-back .source{line-height:1.8}
/* Phones: the kinds scroll sideways in one row, so the map and “Cevapla” fit on the first screen. */
@media(max-width:560px){.map-card{padding:14px;gap:8px}.place-question{font-size:18px}.map-box svg,.map-box .map-blank{aspect-ratio:10/7}
 .map-kinds{scrollbar-width:none;margin:0 -12px;padding:0 12px 2px}.map-kinds::-webkit-scrollbar{display:none}.map-kinds .kind{flex:none;font-size:12px;padding:7px 11px}
 .map-page .cards-head{padding:16px 18px}.map-page .cards-head h1{font-size:26px}}
