/* Marcadores do mapa (map.mjs) e bolhas-pino (map-pins.mjs). Medidas em pixels de tela:
   --pin-k converte para unidades do mapa, então o tamanho não muda com a tela nem com o zoom. */
.world-map{--pin-k:1;--ai:#ff8a5c;--human:#5fd8e8}
.marker,.pin-k{transform:scale(var(--pin-k))}
/* Bolhas 20% menores (revisão da tela): competiam com as ameaças. A área de toque continua ~50 px (pin-hit maior). */
.map-pin .pin-k{transform:scale(calc(var(--pin-k) * .8))}
#country-shapes.instant .country-shape{transition:none}
/* Marcadores fixos: quente = IA, ciano = humanos. */
.mk-ring{fill:none;stroke-width:2.2}
.mk-ring.ai{stroke:var(--ai)}.mk-dot.ai{fill:var(--ai)}
.mk-ring.human{stroke:var(--human)}
.mk-ring.front{stroke-width:2.4;stroke-dasharray:5 3}.mk-ring.front.ai{stroke:var(--ai)}
.mk-ring.chosen{stroke:#fff6d8;stroke-width:2}
.mk-tile{stroke-width:1.6}.mk-tile.human{fill:#0b2931;stroke:var(--human)}.mk-tile.offline{fill:#ffc46b;stroke:#0b2931}
.mk-glyph{fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.mk-glyph[transform]{stroke-width:3.2}
.mk-glyph.human{stroke:var(--human)}.mk-glyph.offline{stroke:#0b2931}
.map-first .node-label{font-size:11px;font-weight:600;stroke-width:3px}
/* Textura = condição estrutural, por cima da cor da camada (MAPA.md §7): ruína escurece e risca; pane só tracejado claro. */
.country-texture{fill:none;stroke:none}.country-texture.ruin{fill:url(#ruin)}.country-texture.pane{fill:url(#pane)}
/* Ameaças com prazo: ciano é humano (investigação, Desligamento); a decisão do evento é da IA, em âmbar. */
.mk-tile.human.threat{fill:var(--human);stroke:#082028;stroke-width:1.4}.threat+.mk-glyph.human{stroke:#082028;stroke-width:2}
.mk-tile.decision{fill:#f0b978;stroke:#2a1a0e;stroke-width:1.4}.mk-glyph.decision{stroke:#2a1a0e;stroke-width:2}.mk-dot.decision{fill:#2a1a0e}
.mk-due{font:700 11px var(--body);letter-spacing:.02em;paint-order:stroke;stroke:#0a1b21;stroke-width:3px;stroke-linejoin:round}
.mk-due.human{fill:var(--human)}.mk-due.decision{fill:#f0b978}
/* Refúgio: preparando = anel aberto; ativo = anel cheio; último = anel duplo. Religar = linha prevista, não garantida. */
.mk-ring.human.preparing{stroke-dasharray:3.5 2.5}
.mk-ring.human.last{stroke-width:1.4;opacity:.75}
.relight-line{fill:none;stroke:var(--human);stroke-width:1.6;stroke-dasharray:2.4 2;stroke-linecap:round;opacity:.9}
.mk-ring.human.relight-target{stroke-width:1.6;stroke-dasharray:2 2}
/* Com ameaça em curso, as rotas decorativas recuam. */
/* Rotas gerais mais apagadas (as do país selecionado continuam em destaque); com ameaça, recuam mais. */
#world-map .quiet .live-route{opacity:.09}
/* Polos de pesquisa fora da camada Pesquisa: menores e discretos, para não competir com as ameaças. */
.hub.calm{opacity:.5;transform:scale(.78)}
/* Nome da camada sempre visível; fora da Pesquisa, só o nome, discreto. */
/* Abaixo do letreiro, com folga (antes encostava nele). */
.map-first #research-map-key{top:50px}
#research-map-key.compact{padding:2px 6px;border-color:#9fb7b233;background:#09202db3;color:#b9cbc7;letter-spacing:.06em}#world-map .quiet .network-packet{display:none}
/* País que entrou na rede: duas ondas quentes e o nome, uma vez. */
.join-ring{fill:none;stroke:var(--ai);stroke-width:2;transform-box:fill-box;transform-origin:center;animation:join 1.6s cubic-bezier(.16,1,.3,1) both}
.join-ring.late{animation-delay:.25s}
@keyframes join{0%{transform:scale(.4);opacity:.95}100%{transform:scale(2.4);opacity:0}}
.join-name{font:700 11px var(--body);fill:#ffd2b8;paint-order:stroke;stroke:#10232a;stroke-width:3px;stroke-linejoin:round;animation:join-name 1.7s ease-out both}
@keyframes join-name{0%{opacity:0;transform:translateY(3px)}20%{opacity:1;transform:none}75%{opacity:1}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.join-ring{animation:none;opacity:0}.join-name{animation:none;opacity:0}}
/* Letreiro que não cabe: rola até o fim, para e volta (hud-ui.mjs, headline). */
#news-headline .tk{display:inline-block;white-space:nowrap}
#news-headline.marquee{text-overflow:clip!important}#news-headline.marquee .tk{animation:ticker var(--dur) ease-in-out infinite alternate}
@keyframes ticker{0%,18%{transform:translateX(0)}82%,100%{transform:translateX(var(--over))}}
@media(prefers-reduced-motion:reduce){#news-headline.marquee{text-overflow:ellipsis!important}#news-headline.marquee .tk{animation:none;display:inline}}
/* Pacotes de dados nas rotas: pontos de 4 px na tela. */
.map-first .network-packet{r:calc(var(--pin-k) * 2px);fill:#ffd2b8}
/* Bolhas-pino: as únicas coisas do mapa que pedem toque. */
#map-pins{pointer-events:none}
.map-pin{--pin:#ff6a4d}.map-pin.compute{--pin:#ffb547}.map-pin.route{--pin:#ff9a6e}.map-pin.research{--pin:var(--human)}
.map-pin .pin-body{pointer-events:auto;cursor:pointer;outline:none;animation:pin-in .45s cubic-bezier(.16,1,.3,1) both}
@keyframes pin-in{0%{transform:scale(0);opacity:0}55%{transform:scale(1.14);opacity:1}100%{transform:scale(1)}}
.pin-bob{animation:pin-bob 1.7s ease-in-out infinite alternate}
@keyframes pin-bob{to{transform:translateY(-3px)}}
.pin-shadow{fill:#000;opacity:.4;filter:blur(1.5px)}
.pin-tail,.pin-ring{fill:#fff}
.pin-fill{fill:var(--pin)}
.pin-shine{fill:#fff;opacity:.28}
.pin-glyph{fill:none;stroke:#13222a;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.pin-glyph .dot{fill:#13222a;stroke:none}
/* Abertura de mercado: o plugue encaixa e ondas de sinal saem da bolha no mesmo ritmo. */
.pin-glyph .plug{animation:pin-plug 2.4s cubic-bezier(.16,1,.3,1) infinite}
@keyframes pin-plug{0%,15%{transform:translateY(3px)}45%,100%{transform:translateY(0)}}
.pin-wave{fill:none;stroke:var(--pin);stroke-width:2;transform-box:fill-box;transform-origin:center;opacity:0;animation:pin-wave 2.4s cubic-bezier(.16,1,.3,1) .5s infinite}
.pin-wave.late{animation-delay:.85s}
@keyframes pin-wave{0%{transform:scale(1);opacity:.8}100%{transform:scale(2);opacity:0}}
.pin-hit{fill:transparent}
.pin-body:focus-visible .pin-ring{fill:#fff1c8}
/* Sem CP ou sem condição: cinza, sem toque. Acabando (último dia): pisca. */
.map-pin.is-off .pin-fill{fill:#6d7f84}.map-pin.is-off .pin-body{cursor:default}
.map-pin.is-ending:not(.is-off) .pin-fill{animation:pin-ending 1s ease-in-out infinite}
@keyframes pin-ending{50%{opacity:.5}}
/* Estouro e ganho subindo; o botão Evoluir pulsa quando o ganho é PE. */
.map-pin.is-leaving{pointer-events:none}.map-pin.is-leaving .pin-body{animation:pin-pop .22s ease-out forwards}
@keyframes pin-pop{to{transform:scale(1.35);opacity:0}}
.pin-gain{font:700 13px var(--body);fill:#fff;paint-order:stroke;stroke:#10232a;stroke-width:3px;stroke-linejoin:round;animation:pin-gain .9s cubic-bezier(.16,1,.3,1) forwards}
@keyframes pin-gain{0%{opacity:0}15%{opacity:1}100%{opacity:0;transform:translateY(-30px)}}
#show-upgrades.pe-pulse{animation:pe-pulse .6s cubic-bezier(.16,1,.3,1)}
@keyframes pe-pulse{30%{transform:scale(1.05);box-shadow:0 0 0 3px #b9e98680}}
@media(prefers-reduced-motion:reduce){.map-pin *,.map-pin .pin-body,#show-upgrades.pe-pulse{animation:none!important}}