/*
 * La Forge du Compagnon : remplissage des pastilles du banner des pages
 * internes (deux braises et une enclume). La mise en page vient de banner.css
 * partagé, sans animation. Toute forme non ronde s'écrit .deco-banner.[forme] :
 * le banner partagé arrondit après nous à spécificité égale.
 */
.deco-banner.braise {
  width: 16px;
  height: 16px;
  background: #f97316;
  border: 2px solid #fdba74;
}
.deco-banner.enclume {
  width: 30px;
  height: 18px;
  border-radius: 2px;
  background: #4b5563;
  clip-path: polygon(0 0, 100% 0, 100% 35%, 72% 45%, 66% 70%, 82% 100%, 18% 100%, 34% 70%, 28% 45%, 0 25%);
}

@media (max-width: 480px) {
  .deco-banner.braise { width: 12px; height: 12px; }
  .deco-banner.enclume { width: 24px; height: 14px; }
}