/* [12/10] CỬA ĐẦU TRANG CHUNG — biển hiệu SYND · WOW + nút gạt Toàn cảnh | Chi tiết, CÙNG MỘT TOẠ ĐỘ trên cả hai màn.
   CEO: "nút đại màn và chi tiết nên cố định 1 chỗ cho cả 2 trang chứ rối quá" (trước: Toàn cảnh để góc PHẢI trên sân 1920 co giãn,
   Chi tiết để sát chữ SYND WOW bên TRÁI trong khung 1440 căn giữa ⇒ bấm xong nút nhảy chỗ). Chốt: trái-trên, cách mép 20px, đỉnh 12px,
   cao 44px (= .wow-nut cao nhất hàng đầu màn Chi tiết ⇒ căn giữa hàng không đẩy lệch). Màn Toàn cảnh đặt `fixed` NGOÀI #san (sân bị scale).
   Logo: "SYND WOW" chữ cam trơn bị chê xấu ⇒ dùng lại BIỂN S.Y.N.D của SYND (cắt từ synd-logo-full.png, bỏ dòng 辛德餐飲聯盟 vì là chữ F&B). */
.cua-dau { display: flex; align-items: center; gap: 16px; height: 44px; flex: none; }
.cua-dau.co-dinh { position: fixed; z-index: 20; top: calc(12px + env(safe-area-inset-top, 0px)); left: 20px; }
/* [13/10] CEO "cụm logo đụt quá" ⇒ chọn phương án 5/10: biển gốc giữ nguyên DÁNG nhưng tô KIM LOẠI CAM bằng mặt nạ (ảnh PNG làm mask,
   màu là gradient kim loại của bộ WOW) + to 26 → 35px; WOW đậm 700 kim loại. Gốc đụt: PNG vàng đồng thu 26px nét mảnh nhoè, lệch tông cam,
   chữ W O W mảnh 300 chìm. */
.wow-hieu { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; }
.wow-bien { flex: none; width: 102px; height: 35px; background: linear-gradient(180deg, var(--wow-kim-tren) 0%, var(--wow-kim-giua) 52%, var(--wow-cam-dam) 100%);
  -webkit-mask: url(/logo/synd-bien-hieu.png?v=b4d7e9d1cc) center / contain no-repeat; mask: url(/logo/synd-bien-hieu.png?v=b4d7e9d1cc) center / contain no-repeat;
  filter: drop-shadow(0 0 6px rgb(var(--wow-cam-rgb) / 0.45)); }
a.wow-hieu:hover { filter: brightness(1.25); }

/* [14/10] CEO: "bấm chuyển tab nó bị lệch" — đại màn ẩn chữ WOW + đệm 12px, Chi tiết thì không ⇒ cụm gạt nhảy chỗ khi chuyển trang.
   Chữ WOW XOÁ khỏi cả hai trang, đệm nấc một giá trị ở đây ⇒ logo + cụm gạt đứng đúng một chỗ trên mọi trang. */
.gat-man { display: inline-flex; border: 1px solid rgb(var(--wow-cam-sang-rgb) / 0.45); border-radius: 999px; padding: 3px; gap: 2px; background: rgba(0, 0, 0, 0.35); }
.gat-man > * { font-family: 'Inter', sans-serif; font-size: 13px; font-weight: 500; letter-spacing: 0.04em; line-height: 20px; padding: 6px 12px; border-radius: 999px;
  text-decoration: none; color: rgba(255, 255, 255, 0.62); white-space: nowrap; }
.gat-man > a:hover { filter: brightness(1.4); }
/* [13/11] tầng 2 (màn trong mảng AFF Shopee): nhỏ, viền mờ, nấc đang chọn tô nhạt — không tranh với tầng 1 (AFF Shopee · AFF US) */
.gat-man.gat-con { border-color: rgb(var(--wow-cam-sang-rgb) / 0.2); margin-left: 6px; }
.gat-man.gat-con > * { font-size: 12px; padding: 4px 10px; }
.gat-man.gat-con > .dang { background: rgb(var(--wow-cam-sang-rgb) / 0.16); color: inherit; }
.gat-man[hidden] { display: none; }
/* [13/10] chữ trắng trên cam sáng #ff7a45 chỉ 2,7:1 (đo WCAG) ⇒ cam đậm hơn, đầu sáng nhất #D23C1C ≈ 4,7:1 */
.gat-man > .dang { background: linear-gradient(135deg, var(--wow-gat-tren), var(--wow-gat-duoi)); color: var(--wow-gat-chu); }
@media (max-width: 900px) {
  .cua-dau.co-dinh { left: 12px; }
}
@media (max-width: 600px) { .wow-hieu { display: none; } .gat-man > * { padding: 5px 10px; font-size: 12px; } }