/* Ý 48: ô nhỏ góc màn hình khi đang gửi ảnh ngầm, và thẻ báo "Album ... đã cập nhật N ảnh" (hang-cho-anh.js).
   Màu lấy từ biến của app nên chế độ tối tự đổi theo. Trên điện thoại ô nằm sát đáy, chừa chỗ cho nút quay lại. */
.fa-ngam { position: fixed; z-index: 1060; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom));
  width: min(360px, calc(100vw - 32px)); display: flex; flex-direction: column; gap: .5rem; pointer-events: none; }
.fa-ngam-the { pointer-events: auto; display: flex; align-items: flex-start; gap: .65rem; padding: .75rem .85rem; border-radius: 16px;
  background: var(--fa-surface); color: var(--fa-ink); border: 1px solid var(--fa-line); box-shadow: var(--fa-shadow-lg);
  font-size: .9rem; animation: fa-ngam-vao .35s ease both; }
.fa-ngam-the > .bi { font-size: 1.25rem; color: var(--fa-amber); line-height: 1.2; }
.fa-ngam-the > .spinner-border { color: var(--fa-amber); margin-top: .2rem; flex: none; }
.fa-ngam-chu { flex: 1; min-width: 0; }
.fa-ngam-chu strong { display: block; line-height: 1.3; }
.fa-ngam-chu span { display: block; color: var(--fa-muted); font-size: .84rem; margin-top: .15rem; }
.fa-ngam-chu progress { display: block; width: 100%; height: .45rem; margin-top: .45rem; border: 0; border-radius: 999px; overflow: hidden;
  background: var(--fa-line); -webkit-appearance: none; appearance: none; }
.fa-ngam-chu progress::-webkit-progress-bar { background: var(--fa-line); border-radius: 999px; }
.fa-ngam-chu progress::-webkit-progress-value { background: linear-gradient(90deg, var(--fa-honey), var(--fa-amber)); border-radius: 999px; }
.fa-ngam-chu progress::-moz-progress-bar { background: linear-gradient(90deg, var(--fa-honey), var(--fa-amber)); border-radius: 999px; }
.fa-ngam-dong { flex: none; border: 0; background: none; color: var(--fa-muted); padding: 0 .1rem; font-size: .95rem; line-height: 1; }
.fa-ngam-nut { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin-top: .5rem; }
.fa-ngam-loi, .fa-up .fa-ngam-loi { margin: .35rem 0 0; padding-left: 1.1rem; max-height: 7rem; overflow-y: auto; overflow-wrap: anywhere;
  font-size: .84rem; color: var(--fa-muted); }
.fa-ngam-the.is-loi > .bi { color: #d4553f; }
.fa-ngam-the.is-xong > .bi { color: var(--fa-honey); }
/* Trong khung tải ảnh của trang album (tai-anh-nhanh.css lo phần còn lại) */
.fa-up.is-xong { background: var(--fa-soft); }
.fa-up .fa-ngam-nut { margin-top: .5rem; }
@keyframes fa-ngam-vao { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .fa-ngam-the { animation: none; } }
@media (max-width: 575.98px) {
  .fa-ngam { right: 12px; left: 72px; width: auto; bottom: calc(12px + env(safe-area-inset-bottom)); }
  html:not(.fa-standalone) .fa-ngam { left: 12px; }
}
/* Nút "Bắt đầu k/5 bước" (guide.css) cũng nằm góc phải dưới: đẩy ô lên phía trên nó */
body:has(.fg-journey:not([hidden])) .fa-ngam { bottom: calc(88px + env(safe-area-inset-bottom)); }