/* Live raffle draw display (public screen + participant tickets page) */
.gfl { position: relative; font-family: "Poppins", system-ui, sans-serif; color: #fff; }
.gfl * { box-sizing: border-box; }

.gfl { background: radial-gradient(ellipse 70% 90% at 12% 0%, rgba(255, 242, 0, 0.14), transparent 60%), linear-gradient(160deg, #0a4a37 0%, #083d2e 60%, #052a20 100%);
	border-radius: 18px; padding: 1.1rem 1.2rem 1.3rem; box-shadow: 0 14px 36px rgba(8, 61, 46, 0.25); overflow: hidden; margin-bottom: 1.3rem; }
.gfl-head { display: flex; align-items: center; gap: 0.55rem; font-size: 0.78rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(255, 255, 255, 0.85); }
.gfl-dot { width: 10px; height: 10px; border-radius: 50%; background: #ff4d4d; box-shadow: 0 0 0 0 rgba(255, 77, 77, 0.7); animation: gfl-live 1.6s infinite; flex: none; }
@keyframes gfl-live { 0% { box-shadow: 0 0 0 0 rgba(255, 77, 77, 0.6); } 70% { box-shadow: 0 0 0 10px rgba(255, 77, 77, 0); } 100% { box-shadow: 0 0 0 0 rgba(255, 77, 77, 0); } }

.gfl-stage { text-align: center; padding: 1.3rem 0.5rem 1rem; min-height: 11rem; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.5rem; }
.gfl-kicker { font-size: 0.8rem; letter-spacing: 0.28em; text-transform: uppercase; font-weight: 600; color: #fff200; }
.gfl-prize { font-size: 1.5rem; font-weight: 700; line-height: 1.15; }
.gfl-clock { font-family: Consolas, Menlo, monospace; font-weight: 700; font-size: 2.6rem; letter-spacing: 0.04em; color: #fff200; font-variant-numeric: tabular-nums; }
.gfl-spin { font-family: Consolas, Menlo, monospace; font-weight: 700; font-size: 1.9rem; letter-spacing: 0.06em; color: #fff200; }
.gfl-code { font-family: Consolas, Menlo, monospace; font-weight: 700; font-size: 2.1rem; letter-spacing: 0.06em; background: #fff200; color: #0a0a0a; padding: 0.55rem 1.1rem; border-radius: 14px; word-break: break-all; animation: gfl-pop 0.6s ease both; }
.gfl-winner-name { font-size: 1.5rem; font-weight: 700; animation: gfl-pop 0.6s ease 0.15s both; }
.gfl-small-msg { font-size: 0.85rem; color: rgba(255, 255, 255, 0.85); line-height: 1.5; max-width: 34rem; }
.gfl-big-msg { font-size: 1.3rem; font-weight: 600; }
@keyframes gfl-pop { from { transform: scale(0.7); opacity: 0; } to { transform: none; opacity: 1; } }
.gfl-stage.is-reveal { background: radial-gradient(circle at 50% 30%, rgba(255, 242, 0, 0.18), transparent 60%); border-radius: 16px; }

.gfl-sub-title { font-size: 0.72rem; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255, 255, 255, 0.7); margin: 0.9rem 0 0.5rem; font-weight: 600; }
.gfl-upcoming .gfl-row { display: flex; justify-content: space-between; gap: 1rem; padding: 0.5rem 0.8rem; background: rgba(255, 255, 255, 0.08); border-radius: 10px; margin-bottom: 0.4rem; font-size: 0.88rem; }
.gfl-row-when { color: #fff200; white-space: nowrap; font-weight: 600; }
.gfl-winners { display: grid; gap: 0.6rem; }
.gfl-winners .gfl-sub-title { margin-bottom: 0; }
.gfl-win { background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.18); border-radius: 12px; padding: 0.7rem 0.9rem; display: grid; gap: 0.1rem; }
.gfl-win.is-grand { border-color: #fff200; }
.gfl-win-prize { font-weight: 600; font-size: 0.85rem; color: rgba(255, 255, 255, 0.85); }
.gfl-win-code { font-family: Consolas, Menlo, monospace; font-weight: 700; color: #fff200; letter-spacing: 0.05em; }
.gfl-win-name { font-size: 0.95rem; font-weight: 600; }
.gfl-note { font-size: 0.8rem; color: rgba(255, 255, 255, 0.8); background: rgba(255, 255, 255, 0.08); border-radius: 10px; padding: 0.5rem 0.8rem; }

/* confetti */
.gfl-confetti { position: absolute; inset: 0; pointer-events: none; overflow: hidden; z-index: 5; }
.gfl-confetti i { position: absolute; top: -12px; width: 9px; height: 14px; opacity: 0.95; animation: gfl-fall linear forwards; border-radius: 2px; }
@keyframes gfl-fall { to { transform: translateY(115vh) rotate(720deg); opacity: 0.9; } }
@media (prefers-reduced-motion: reduce) { .gfl-dot, .gfl-code, .gfl-winner-name { animation: none; } }

/* ---- big screen (projector) ---- */
.gfl-big { border-radius: 0; box-shadow: none; margin: 0; min-height: 100vh; padding: 2rem clamp(1rem, 4vw, 4rem) 3rem; display: flex; flex-direction: column; }
.gfl-big .gfl-head { font-size: clamp(0.8rem, 1.4vw, 1.2rem); }
.gfl-big .gfl-stage { flex: 1; min-height: 46vh; gap: clamp(0.5rem, 1.6vh, 1.4rem); }
.gfl-big .gfl-kicker { font-size: clamp(1rem, 2vw, 1.8rem); }
.gfl-big .gfl-prize { font-size: clamp(2rem, 5.4vw, 5rem); }
.gfl-big .gfl-clock { font-size: clamp(3rem, 12vw, 11rem); }
.gfl-big .gfl-spin { font-size: clamp(2.4rem, 8vw, 7.5rem); }
.gfl-big .gfl-code { font-size: clamp(2.2rem, 8vw, 7.5rem); padding: 0.4rem 1.6rem; border-radius: 22px; }
.gfl-big .gfl-winner-name { font-size: clamp(1.8rem, 5vw, 4.6rem); }
.gfl-big .gfl-small-msg { font-size: clamp(0.95rem, 1.7vw, 1.6rem); max-width: 60rem; }
.gfl-big .gfl-big-msg { font-size: clamp(1.6rem, 4vw, 3.6rem); }
.gfl-big .gfl-sub-title { font-size: clamp(0.8rem, 1.3vw, 1.1rem); }
.gfl-big .gfl-upcoming, .gfl-big .gfl-winners { max-width: 70rem; width: 100%; margin: 0 auto; }
.gfl-big .gfl-winners { grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr)); }
.gfl-big .gfl-row { font-size: clamp(0.95rem, 1.6vw, 1.5rem); }
.gfl-big .gfl-win-prize { font-size: clamp(0.9rem, 1.4vw, 1.3rem); }
.gfl-big .gfl-win-code { font-size: clamp(1.1rem, 1.9vw, 1.8rem); }
.gfl-big .gfl-win-name { font-size: clamp(1.1rem, 1.9vw, 1.8rem); }

/* page chrome for /raffle_live */
body:has(.gfl-page) .navbar, body:has(.gfl-page) .web-footer, body:has(.gfl-page) .page-header { display: none !important; }
body:has(.gfl-page), body:has(.gfl-page) .main-section, body:has(.gfl-page) .page_content, body:has(.gfl-page) .page-content-wrapper, body:has(.gfl-page) .container { max-width: none !important; width: 100% !important; padding: 0 !important; margin: 0 !important; background: #052a20; }
.gfl-page { min-height: 100vh; background: #052a20; display: flex; flex-direction: column; }
.gfl-bar { display: flex; align-items: center; gap: 0.8rem; padding: 0.7rem clamp(1rem, 4vw, 4rem); background: rgba(0, 0, 0, 0.25); color: #fff; font-family: "Poppins", sans-serif; }
.gfl-bar a { color: inherit; text-decoration: none; display: inline-flex; align-items: center; gap: 0.5rem; font-weight: 600; }
.gfl-bar svg { width: 30px; height: 30px; }
.gfl-bar .gfl-fs { margin-left: auto; background: transparent; border: 1px solid rgba(255, 255, 255, 0.4); color: #fff; border-radius: 999px; padding: 0.35rem 0.9rem; font: 500 0.82rem "Poppins", sans-serif; cursor: pointer; }
.gfl-bar .gfl-fs:hover { background: rgba(255, 255, 255, 0.12); }
.gfl-foot { text-align: center; padding: 0.8rem; font: 0.78rem "Poppins", sans-serif; color: rgba(255, 255, 255, 0.6); }
.gfl-foot a { color: inherit; }

.gfl-head { flex-wrap: wrap; }
.gfl-sound { margin-left: auto; background: rgba(255,255,255,.14); color: inherit; border: 1px solid rgba(255,255,255,.3); border-radius: 999px; padding: .25rem .75rem; font: inherit; font-size: .8rem; cursor: pointer; }
.gfl-sound:hover { background: rgba(255,255,255,.24); }