/* Var i Sverige/världen? (mapPin). Laddas efter round-view.css. MapLibres egen CSS laddas
 * från /vendor först när en kartfråga visas. */
.map-frame{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:20px;background:#0c1028;isolation:isolate}
/* Två klasser: MapLibres CSS (laddas senare) sätter annars position:relative på behållaren. */
.map-frame .map-slot,.map-frame .map-canvas{position:absolute;inset:0}
.map-canvas .maplibregl-canvas{outline:none}
.map-canvas .maplibregl-canvas:focus-visible{outline:3px solid var(--accent);outline-offset:-3px}
/* Tillskrivningen är alltid synlig: ingen knapp, ingen hopfällning. */
.map-attribution{position:absolute;right:0;bottom:0;z-index:4;max-width:100%;margin:0;padding:3px 9px;border-top-left-radius:10px;background:#16132ce6;color:#d6d0ea;font-size:11px;line-height:1.4;text-align:right}
.map-attribution a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.map-status{position:absolute;z-index:3;margin:0;display:grid;gap:12px;justify-items:center;text-align:center;color:var(--ink)}
.map-status[hidden]{display:none}
.map-status p{margin:0;color:var(--ink);font-size:15px;line-height:1.45;max-width:440px}
.map-status.is-blocking{inset:0;place-content:center;padding:24px;background:#16132cf0}
.map-status.is-notice{left:10px;right:10px;top:10px;padding:10px 14px;border-radius:14px;background:#442f35f0;border:1px solid #dcaa74}
.map-status .secondary{min-height:44px;padding:10px 18px}

/* Mobil: kartan fyller mitten; under den en återkopplingsrad med reserverad höjd. */
.map-phone .phone-middle{justify-content:flex-start}
.map-phone .map-frame{flex:1 1 auto;min-height:220px;margin:0}
.map-feedback{flex:none;min-height:60px;display:grid;align-content:center;gap:8px}
.map-phone.stage-reveal .map-frame{min-height:200px}
.map-solution{font-size:18px;font-weight:800;color:var(--accent);margin:0}

/* Nålar och rätt plats (MapLibre-markörer; positioneras av MapLibre) */
.map-pin{width:34px;height:44px;cursor:default}
.map-pin-head{position:absolute;left:0;top:0;width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:var(--player-color,#d8fd78);color:#1b1630;border:2px solid #16132c;box-shadow:0 3px 10px #0009;font:850 12px/1 ui-rounded,"SF Pro Rounded",system-ui,sans-serif;letter-spacing:-.3px}
.map-pin::after{content:"";position:absolute;left:50%;bottom:0;transform:translateX(-50%);border-left:7px solid transparent;border-right:7px solid transparent;border-top:12px solid var(--player-color,#d8fd78)}
.map-pin.is-own{width:44px;height:56px}
.map-pin.is-own .map-pin-head{width:44px;height:44px;font-size:14px;border-width:3px}
.map-pin.is-own::after{border-left-width:9px;border-right-width:9px;border-top-width:14px}
.maplibregl-marker.maplibregl-marker-draggable .map-pin{cursor:grab}
.map-pin-chip{position:absolute;left:38px;top:6px;white-space:nowrap;padding:2px 8px;border-radius:20px;background:#16132ced;border:1px solid var(--player-color,#d8fd78);color:var(--ink);font:700 12px/1.4 ui-rounded,"SF Pro Rounded",system-ui,sans-serif}
.map-answer{display:flex;flex-direction:column;align-items:center;gap:3px}
.map-answer-head{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--accent);color:#251c36;border:3px solid #16132c;box-shadow:0 0 0 6px #d8fd7840,0 4px 14px #000a;font:850 22px/1 ui-rounded,system-ui,sans-serif}
.map-answer-label{order:-1;padding:3px 10px;border-radius:12px;background:#16132cf0;border:1px solid #d8fd7899;color:var(--accent);font:800 13px/1.35 ui-rounded,"SF Pro Rounded",system-ui,sans-serif;white-space:nowrap;max-width:260px;overflow:hidden;text-overflow:ellipsis}

/* TV under frågan: bilden eller en nål i den gemensamma bildramen (inga ortnamn, inget facit). */
.map-media{margin:0}
.map-media img{display:block;width:100%;height:100%;object-fit:cover}
.map-question-stage{display:grid;place-content:center;justify-items:center;gap:calc(var(--u)*2);text-align:center;background:radial-gradient(ellipse at 50% 40%,#2a2545,#16132c 75%)}
.map-question-pin{width:calc(var(--u)*12);aspect-ratio:1;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:radial-gradient(circle at 50% 50%,#16132c 0 18%,transparent 19%),linear-gradient(135deg,#d8fd78,#8edcfa);box-shadow:0 18px 50px #d8fd7822}
.map-question-stage p{font-size:calc(var(--u)*2.2);margin:0;color:var(--muted)}
.map-warning{position:absolute;left:50%;bottom:calc(var(--u)*1);transform:translateX(-50%);width:min(90%,760px);margin:0;padding:10px 16px;border-radius:14px;border:1px solid #dcaa74;background:#442f35f0;color:#fff;text-align:center;font-size:calc(var(--u)*1.6)}

/* TV-facit: kartan fyller samma ram som bilden under frågan; tillskrivningen syns alltid. */
.map-reveal-frame .map-frame{position:absolute;inset:0;border:0;border-radius:0}
.map-reveal-frame .map-attribution{font-size:calc(var(--u)*1.1)}
.map-reveal-frame .map-status p{font-size:calc(var(--u)*1.8)}
@media(max-width:650px){.map-attribution{font-size:10px}}