.bee-loading[hidden] { display: none; }
.detail-loading-content { min-height: 220px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; text-align: center; }
.detail-loading-content .bee-loading-bee { font-size: 46px; }
.detail-loading-content p { color: var(--muted); margin: 0; }
.detail-loading-content [hidden] { display: none; }
.bee-loading {
  position: fixed; inset: 0; z-index: 10000;
  display: grid; place-items: center; padding: 24px;
  background: #0d0c0bb8; backdrop-filter: blur(5px);
  cursor: progress;
}
.bee-loading-card {
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  width: min(100%, 340px); padding: 32px 24px 28px;
  border: 1px solid #725526; border-radius: 22px;
  background: #211b12; color: #f8e8c8; text-align: center;
  box-shadow: 0 18px 70px #0006;
}
.bee-loading-card strong { font-size: 21px; }
.bee-loading-card > span:not(.bee-loading-bee):not(.bee-loading-dots) { color: #bfae90; font-size: 14px; }
.bee-loading-bee { display: block; font-size: 64px; line-height: 1.25; animation: bee-hover 1.3s ease-in-out infinite; }
.bee-loading-dots { display: flex; gap: 7px; margin-top: 4px; }
.bee-loading-dots i { width: 7px; height: 7px; border-radius: 50%; background: #f2b33d; animation: bee-dot 1.2s ease-in-out infinite; }
.bee-loading-dots i:nth-child(2) { animation-delay: .15s; }
.bee-loading-dots i:nth-child(3) { animation-delay: .3s; }
@keyframes bee-hover {
  0%, 100% { transform: translateY(3px) rotate(-7deg); }
  50% { transform: translateY(-7px) rotate(6deg); }
}
@keyframes bee-dot { 0%, 80%, 100% { opacity: .3; } 40% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .bee-loading-bee, .bee-loading-dots i { animation: none; }
}
