/* ── Récap mensuel — card flottante persistante ──────────────────────────── */

.recap-peek {
  position: fixed;
  top: 0;
  left: 50%;
  z-index: 120;
  display: none;
  align-items: center;
  justify-content: center;
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-top: none;
  border-radius: 0 0 12px 12px;
  padding: 8px 18px 10px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.35);
  cursor: default;
  transform: translateX(-50%) translateY(0);
  transition: transform 0.2s ease;
}
.recap-peek.visible { display: flex; }
.recap-peek.ready { cursor: pointer; }
.recap-peek.ready:hover { transform: translateX(-50%) translateY(4px); }

.recap-peek.enter { animation: recapPeekIn 0.6s cubic-bezier(.22,.9,.32,1); }
.recap-peek.shake { animation: recapReadyShake 0.8s ease; }

@keyframes recapPeekIn {
  0%   { transform: translateX(-50%) translateY(-100%) scale(0.4); }
  55%  { transform: translateX(-50%) translateY(10px) scale(1.08); }
  75%  { transform: translateX(-50%) translateY(-4px) scale(0.97); }
  100% { transform: translateX(-50%) translateY(0) scale(1); }
}
@keyframes recapReadyShake {
  0%, 100% { transform: translateX(-50%) translateY(0) rotate(0deg) scale(1); }
  15%  { transform: translateX(-50%) translateY(0) rotate(-5deg) scale(1.14); }
  30%  { transform: translateX(-50%) translateY(0) rotate(4deg) scale(0.94); }
  45%  { transform: translateX(-50%) translateY(0) rotate(-4deg) scale(1.1); }
  60%  { transform: translateX(-50%) translateY(0) rotate(3deg) scale(0.97); }
  75%  { transform: translateX(-50%) translateY(0) rotate(-2deg) scale(1.05); }
  90%  { transform: translateX(-50%) translateY(0) rotate(1deg) scale(0.99); }
}

.recap-peek-label { font-size: 12px; font-weight: 700; color: var(--accent); letter-spacing: 0.03em; white-space: nowrap; }
.recap-peek:not(.ready) .recap-peek-label { animation: recapPulse 1.4s ease-in-out infinite; }
@keyframes recapPulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.45; } }