/* Znikająca mapa (app.js: startMemory): licznik nad widokiem i zasłona „Mapa zniknęła” */

.memory-chip {
  position: fixed; top: calc(var(--header-h) + 12px); left: 50%; z-index: 40; transform: translateX(-50%);
  padding: 8px 18px; border-radius: 999px; white-space: nowrap; pointer-events: none;
  font: 800 1rem var(--font); letter-spacing: 0.02em; color: #1b1405;
  background: linear-gradient(#fff2a6, #d5bf74 60%, #9a7a1f); box-shadow: 0 0 0 1px #000, 0 6px 16px rgba(0, 0, 0, 0.6);
}
.memory-chip[hidden] { display: none; }
.memory-chip[data-stage="answer"] { color: #fff; background: linear-gradient(#5e9c45, #396b29 55%, #12210d); }
.memory-chip.urgent { background: linear-gradient(#f9a19f, #d5604a 55%, #831f1f); animation: memory-pulse 1s ease-in-out infinite; }
@keyframes memory-pulse { 50% { transform: translateX(-50%) scale(1.06); } }

/* Zasłona po zniknięciu mapy: ten sam element co „Wczytywanie mapy…”, ale bez spinnera i z ikoną */
#viewLoader.vanished { font: 800 1.15rem var(--font-display); color: var(--gold-2); text-shadow: 0 2px 0 #000; }
#viewLoader.vanished::before { content: "⏳"; display: block; margin-bottom: 8px; font-size: 2.2rem; animation: none; border: 0; width: auto; height: auto; }

@media (max-width: 640px) {
  .memory-chip { top: calc(var(--header-h) + 8px); padding: 6px 14px; font-size: 0.88rem; }
}
@media (prefers-reduced-motion: reduce) { .memory-chip.urgent { animation: none; } }