/* splash.css — หน้าต้อนรับ */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body {
  font: 400 16px/1.6 'Sarabun', 'Noto Sans Thai', 'Leelawadee UI', 'Tahoma', sans-serif;
  color: #fff;
  background: radial-gradient(1200px 700px at 50% -10%, #2f6fe0 0%, rgba(47,111,224,0) 60%), linear-gradient(160deg, #0c2150 0%, #12306b 55%, #1d4fb8 100%);
  background-attachment: fixed;
}
.splash { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: 22px 16px 28px; text-align: center; }
.s-logo { width: 64px; height: 64px; object-fit: contain; filter: drop-shadow(0 4px 10px rgba(0, 0, 0, .4)); animation: rise .6s ease both; }
.s-title { margin: 0; font-family: 'Prompt', 'Sarabun', sans-serif; font-size: clamp(1rem, 2.6vw, 1.25rem); font-weight: 700; text-shadow: 0 2px 8px rgba(0, 0, 0, .35); animation: rise .6s .08s ease both; }
.s-banner { display: block; width: fit-content; max-width: min(1180px, 96vw); margin-inline: auto; border-radius: 14px; overflow: hidden; background: rgba(255, 255, 255, .08); box-shadow: 0 18px 50px rgba(0, 0, 0, .5); animation: rise .8s .16s ease both; }
.s-banner img { display: block; width: 100%; height: auto; max-height: calc(100vh - 270px); min-height: 160px; object-fit: contain; margin-inline: auto; }
/* สีปุ่ม/ตัวนับถอยหลัง: index.php คำนวณจากสีพื้น (--btn-bg --btn-fg --btn-bd --ct --bar) ให้กลมกลืนกับทุกเทศกาล
   ถ้าไม่ได้ตั้งสีพื้น → ใช้ค่าเริ่มต้นด้านขวาของ var(): ปุ่มกระจกสีเข้มโปร่ง ตัวอักษรขาว ใช้ได้กับภาพพื้นหลังทุกแบบ */
.s-btn { display: inline-flex; align-items: center; gap: 10px; padding: 12px 36px; border-radius: 99px; background: var(--btn-bg, rgba(0, 0, 0, .45)); border: 1px solid var(--btn-bd, rgba(255, 255, 255, .55)); color: var(--btn-fg, #fff); font-weight: 700; font-size: 1.05rem; text-decoration: none; box-shadow: 0 6px 20px rgba(0, 0, 0, .25); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); transition: transform .2s, filter .2s; animation: rise .6s .3s ease both; }
.s-btn:hover { transform: translateY(-2px); filter: brightness(1.08); }
.s-btn:focus-visible, .s-count a:focus-visible, .s-banner:focus-visible { outline: 3px solid var(--ct, #fff); outline-offset: 3px; }
.s-count { font-size: .85rem; color: var(--ct, #e8e8e8); text-shadow: 0 1px 4px rgba(0, 0, 0, .25); animation: rise .6s .4s ease both; }
.s-count a { color: var(--ct, #fff); }
.s-count .bar { display: block; width: 170px; height: 4px; margin: 8px auto 0; background: rgba(128, 128, 128, .3); border-radius: 99px; overflow: hidden; }
.s-count .bar u { display: block; height: 100%; width: 100%; background: var(--bar, #fff); transform-origin: left; text-decoration: none; }
.s-count.stopped .bar { opacity: .35; }
@keyframes rise { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } }

/* พื้นหลังสว่าง (สีพื้นที่แอดมินตั้งไว้) → ปุ่ม/ตัวอักษรสีเข้ม (ค่าสีมาจาก --btn-* / --ct ที่ index.php คำนวณ) */
body.light { color: #222; }
body.light .s-count { text-shadow: none; }
