/* ═══ ATHENA / ECHO — boutons 🎈 (urgence guidée) et 💡 (Panthéon) · R49 ═══
   Le ballon reprend l'animation du hub d'Olympe (balancement + onde rouge).
   Ces deux boutons restent animés même quand le reste est calme ; seul
   « réduire les animations » du système les fige. */
.atp-btn{ position:relative; display:inline-flex; align-items:center; justify-content:center; gap:6px; cursor:pointer;
  font:inherit; font-weight:700; font-size:12.5px; line-height:1; }
/* En-tête Echo : même gabarit que les boutons voisins */
#rec-app .atp-btn{ border:1px solid var(--t-ligne); background:var(--t-surf); color:var(--t-ink); border-radius:10px; padding:7px 10px; min-height:34px; }

/* 🎈 */
.atp-ballon{ width:42px; padding:0 !important; font-size:18px !important;
  background:rgba(255,59,48,.12) !important; border:1px solid rgba(255,59,48,.38) !important; border-radius:12px !important; }
.atp-ballon > span{ display:inline-block; animation:atpBallon 3.2s ease-in-out infinite; transform-origin:50% 90%; }
.atp-ballon::after{ content:""; position:absolute; inset:-1px; border-radius:12px; border:2px solid rgba(255,59,48,.55);
  animation:atpPing 2.2s ease-out infinite; pointer-events:none; }
.atp-ballon:hover{ transform:translateY(-2px) scale(1.06); }
.atp-ballon:active{ transform:scale(.93); }
/* ATHENA : ses .hd-btn forcent fond et bordure (html.athena .hd-btn … !important) */
html.athena .at-actions .atp-ballon{ width:44px; min-height:36px; align-self:stretch; padding:0 !important;
  background:rgba(255,59,48,.12) !important; border:1px solid rgba(255,59,48,.38) !important; border-radius:12px !important; }
html.athena .at-actions .atp-ballon:hover{ background:rgba(255,59,48,.2) !important; border-color:rgba(255,59,48,.6) !important; }
html[data-at-theme="creme"] .atp-ballon,
html.athena[data-at-theme="creme"] .at-actions .atp-ballon{ background:rgba(255,235,228,.9) !important; border-color:rgba(190,40,30,.32) !important; }

/* 🆘 : rouge franc, sans animation (c'est un bouton grave) */
.atp-sos{ width:42px; padding:0 !important; font-size:17px !important; background:#fff !important; border:2px solid rgba(215,25,47,.65) !important; border-radius:12px !important; }
.atp-sos:hover{ background:#FFF0F1 !important; }
html.athena .at-actions .atp-sos{ width:44px; min-height:36px; align-self:stretch; background:#fff !important; border:2px solid rgba(215,25,47,.65) !important; }
#rec-app .atp-sos{ border:2px solid rgba(215,25,47,.65); }

/* 💡 */
.atp-idee em{ font-style:normal; }
.atp-idee > span{ display:inline-block; transition:transform .25s, filter .25s; }
.atp-idee:hover > span{ transform:scale(1.18) rotate(-8deg); filter:drop-shadow(0 0 6px rgba(255,205,60,.9)); }

@keyframes atpBallon{ 0%,100%{ transform:translateY(0) rotate(-6deg); } 50%{ transform:translateY(-4px) rotate(6deg); } }
@keyframes atpPing{ 0%{ opacity:.8; transform:scale(1); } 80%,100%{ opacity:0; transform:scale(1.35); } }

/* Téléphone : 💡 sans libellé pour garder l'en-tête sur une ligne */
@media (max-width:720px){
  .atp-idee em{ display:none; }
  .atp-idee{ width:42px; padding:0 !important; font-size:17px !important; }
}
/* Echo sur petit téléphone : le sous-titre cède la place aux boutons */
@media (max-width:440px){
  #rec-app .rec-t span{ display:none; }
  #rec-app .atp-btn{ width:38px; min-height:34px; }
  /* R50 : « Quitter » en icône pour que l'en-tête tienne sur une ligne (🎈 🆘 💡) */
  #rec-app #rec-quit{ font-size:0; width:38px; padding:0; min-height:34px; }
  /* R55 : icône dessinée (le caractère ⏻ n'existe pas dans les polices Android → carré vide) */
  #rec-app #rec-quit::after{ content:''; display:block; width:17px; height:17px; margin:auto; background:currentColor;
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M12 3v8'/%3E%3Cpath d='M6.3 6.6a8 8 0 1 0 11.4 0'/%3E%3C/svg%3E") center/contain no-repeat;
            mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M12 3v8'/%3E%3Cpath d='M6.3 6.6a8 8 0 1 0 11.4 0'/%3E%3C/svg%3E") center/contain no-repeat; }
}
@media (prefers-reduced-motion:reduce){
  .atp-ballon > span, .atp-ballon::after{ animation:none; }
}

/* R51 : ATHENA — la bulle « SOS » flottante est retirée (demande Direction).
   Les alertes restent reçues : bandeau d'alerte dans la page et fenêtre
   #dd-pop qui s'ouvre toute seule avec la sirène ; envoi par le bouton 🆘. */
#dd-bulle{ display:none !important; }