/* ═══════════════════════════════════════════════════════════
   DAILY.CSS — Académie Pirate
   Daily reward overlay + streak calendar
   Préfixe .dr-* — isolation totale
   Mobile-first
   ═══════════════════════════════════════════════════════════ */

/* ── Overlay ── */
.dr-overlay {
  position: fixed; inset: 0; z-index: 9000;
  display: flex; align-items: center; justify-content: center;
  background: var(--dr-bg, #0a0205);
  opacity: 1;
  transition: opacity .5s ease, transform .5s ease;
  overflow: hidden;
}

/* ── Particules ── */
.dr-particles { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.dr-particle {
  position: absolute; border-radius: 50%; bottom: -20px; opacity: 0;
  animation: dr-float linear infinite;
}
@keyframes dr-float {
  0%   { transform: translateY(0) scale(1) rotate(0deg); opacity: .8; }
  50%  { transform: translateY(-45vh) scale(1.3) rotate(180deg); opacity: .5; }
  100% { transform: translateY(-95vh) scale(.3) rotate(360deg); opacity: 0; }
}

/* ── Card ── */
.dr-card {
  position: relative; z-index: 2;
  background: rgba(5, 8, 16, .95);
  border: 2px solid var(--dr-color, #e63946);
  border-radius: 24px;
  padding: clamp(20px, 5vw, 32px) clamp(16px, 4vw, 28px);
  width: min(420px, 92vw);
  display: flex; flex-direction: column; align-items: center; gap: 14px;
  box-shadow: 0 0 60px var(--dr-color, #e63946)44, 0 20px 60px rgba(0,0,0,.8);
  animation: dr-card-appear .5s cubic-bezier(.34, 1.56, .64, 1) both;
}
@keyframes dr-card-appear {
  from { transform: scale(.7) translateY(40px); opacity: 0; }
  to   { transform: scale(1) translateY(0); opacity: 1; }
}

/* ── Emoji ── */
.dr-emoji {
  font-size: clamp(2.5rem, 10vw, 4rem);
  animation: dr-bounce 1s ease-in-out infinite;
  line-height: 1;
}
@keyframes dr-bounce {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-8px); }
}

/* ── Titre ── */
.dr-title {
  font-family: 'Bangers', cursive;
  font-size: clamp(1.6rem, 6vw, 2.4rem);
  letter-spacing: 4px;
  color: var(--dr-accent, #f4c95d);
  text-shadow: 2px 2px 0 #000, 0 0 20px var(--dr-accent, #f4c95d)88;
  text-align: center;
  line-height: 1;
}

/* ── Streak ── */
.dr-streak {
  font-family: 'Nunito', sans-serif;
  font-size: clamp(.9rem, 3vw, 1.1rem);
  font-weight: 900;
  color: rgba(255,255,255,.9);
  text-align: center;
}
.dr-streak-num {
  font-family: 'Bangers', cursive;
  font-size: clamp(1.5rem, 5vw, 2rem);
  color: var(--dr-color, #e63946);
  text-shadow: 2px 2px 0 #000;
  padding: 0 4px;
}

/* ── Message ── */
.dr-msg {
  font-family: 'Nunito', sans-serif;
  font-size: clamp(.8rem, 2.5vw, .95rem);
  font-weight: 800;
  color: rgba(255,255,255,.7);
  text-align: center;
  line-height: 1.5;
}

/* ── Joker ── */
.dr-joker-badge {
  background: rgba(99, 102, 241, .2);
  border: 1px solid rgba(99, 102, 241, .5);
  border-radius: 12px;
  padding: 8px 14px;
  font-family: 'Nunito', sans-serif;
  font-size: .78rem;
  font-weight: 800;
  color: #a5b4fc;
  text-align: center;
  width: 100%;
}
.dr-joker-info {
  font-family: 'Nunito', sans-serif;
  font-size: .72rem;
  font-weight: 700;
  color: rgba(255,255,255,.35);
  text-align: center;
}

/* ── Calendrier 7 jours ── */
.dr-calendar {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 5px;
  width: 100%;
}
.dr-cal-day {
  display: flex; flex-direction: column; align-items: center; gap: 2px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  padding: 6px 2px;
  transition: all .3s;
}
.dr-cal-day.done {
  background: rgba(6, 214, 160, .1);
  border-color: rgba(6, 214, 160, .3);
}
.dr-cal-day.current {
  background: var(--dr-color, #e63946)22;
  border-color: var(--dr-color, #e63946);
  transform: scale(1.08);
  box-shadow: 0 0 12px var(--dr-color, #e63946)44;
  animation: dr-pulse 1.5s ease-in-out infinite;
}
@keyframes dr-pulse {
  0%, 100% { box-shadow: 0 0 12px var(--dr-color)44; }
  50%      { box-shadow: 0 0 20px var(--dr-color)88; }
}
.dr-cal-num {
  font-family: 'Bangers', cursive;
  font-size: .75rem;
  letter-spacing: 1px;
  color: rgba(255,255,255,.5);
}
.dr-cal-day.current .dr-cal-num { color: var(--dr-color); }
.dr-cal-day.done .dr-cal-num    { color: #06d6a0; }
.dr-cal-xp {
  font-family: 'Nunito', sans-serif;
  font-size: .6rem;
  font-weight: 900;
  color: var(--dr-accent, #f4c95d);
  white-space: nowrap;
}
.dr-cal-star { font-size: .7rem; }

/* ── Récompense ── */
.dr-reward-wrap {
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  width: 100%;
}
.dr-reward-label {
  font-family: 'Nunito', sans-serif;
  font-size: .72rem;
  font-weight: 900;
  color: rgba(255,255,255,.4);
  text-transform: uppercase;
  letter-spacing: 2px;
}
.dr-reward-xp {
  font-family: 'Bangers', cursive;
  font-size: clamp(2rem, 7vw, 3rem);
  letter-spacing: 3px;
  color: var(--dr-accent, #f4c95d);
  text-shadow: 3px 3px 0 #000, 0 0 30px var(--dr-accent)88;
  animation: dr-xp-appear .6s cubic-bezier(.34,1.56,.64,1) .3s both;
}
@keyframes dr-xp-appear {
  from { transform: scale(0); opacity: 0; }
  to   { transform: scale(1); opacity: 1; }
}

/* ── Bouton ── */
.dr-btn {
  width: 100%;
  padding: 14px 24px;
  background: linear-gradient(135deg, var(--dr-color, #e63946), var(--dr-accent, #f4c95d));
  border: none;
  border-radius: 14px;
  font-family: 'Bangers', cursive;
  font-size: clamp(1rem, 3.5vw, 1.2rem);
  letter-spacing: 2px;
  color: #fff;
  text-shadow: 1px 1px 0 rgba(0,0,0,.5);
  cursor: pointer;
  transition: transform .15s, box-shadow .15s;
  box-shadow: 0 4px 20px var(--dr-color)66;
  animation: dr-btn-pulse 2s ease-in-out infinite;
  -webkit-tap-highlight-color: transparent;
}
@keyframes dr-btn-pulse {
  0%, 100% { transform: scale(1); }
  50%      { transform: scale(1.02); }
}
.dr-btn:hover  { transform: scale(1.04) translateY(-2px); }
.dr-btn:active { transform: scale(.97); }
.dr-btn:disabled { opacity: .6; cursor: default; animation: none; }

/* ── Responsive ── */
@media (max-width: 380px) {
  .dr-calendar { gap: 3px; }
  .dr-cal-day  { padding: 5px 1px; }
  .dr-cal-xp   { font-size: .55rem; }
}
