/* slot1234 — ม่วงอัลตราไวโอเลต / ส้มพระอาทิตย์ / ดำพลัม */
html { scroll-behavior: smooth; overflow-x: clip; }
body { overflow-x: clip; }
body {
  background-color: #0b0612;
  background-image:
    radial-gradient(60rem 36rem at 50% -12rem, rgba(139, 92, 246, .28), transparent 70%),
    radial-gradient(40rem 30rem at 100% 30%, rgba(255, 138, 31, .08), transparent 70%),
    radial-gradient(40rem 30rem at 0% 70%, rgba(115, 57, 232, .12), transparent 70%);
  background-attachment: fixed;
  color: #e9e3f5;
}
::selection { background: #ff8a1f; color: #120a1d; }

/* ตัวอักษรไล่สี */
.txt-dawn { background: linear-gradient(92deg, #ffc98a, #ff8a1f 45%, #c9b2ff); -webkit-background-clip: text; background-clip: text; color: transparent; }
.txt-uv { background: linear-gradient(92deg, #e4d9ff, #a685ff); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* การ์ดกระจก + ขอบเรืองแสง */
.glass { background: linear-gradient(160deg, rgba(255,255,255,.06), rgba(255,255,255,.015)); border: 1px solid rgba(166,133,255,.16); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.halo { position: relative; isolation: isolate; }
.halo::before {
  content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px; z-index: -1;
  background: linear-gradient(140deg, rgba(255,169,77,.75), rgba(139,92,246,.15) 40%, rgba(139,92,246,.15) 60%, rgba(166,133,255,.8));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude;
}
.lift { transition: transform .25s ease, box-shadow .25s ease; }
.lift:hover { transform: translateY(-4px); box-shadow: 0 0 0 1px rgba(255,169,77,.35), 0 22px 50px -22px rgba(255,138,31,.55); }

/* ปุ่ม */
.btn-sun { background: linear-gradient(135deg, #ffc98a, #ff8a1f 55%, #e86e00); color: #1c0d02; font-weight: 700; box-shadow: 0 10px 30px -10px rgba(255,138,31,.75); transition: filter .2s, transform .2s; }
.btn-sun:hover { filter: brightness(1.08); transform: translateY(-1px); }
.btn-ghost { border: 1px solid rgba(201,178,255,.35); color: #e4d9ff; transition: background .2s, border-color .2s; }
.btn-ghost:hover { background: rgba(139,92,246,.14); border-color: #a685ff; }

/* เมนู */
.s34-link { position: relative; }
.s34-link[aria-current="page"] { color: #ffc98a; }
.s34-link[aria-current="page"]::after { content: ""; position: absolute; left: 50%; bottom: -6px; width: 6px; height: 6px; margin-left: -3px; border-radius: 9999px; background: #ff8a1f; box-shadow: 0 0 10px #ff8a1f; }
#s34-panel { position: fixed; inset: 0 0 0 auto; width: min(20rem, 86vw); transform: translateX(105%); visibility: hidden; transition: transform .3s ease, visibility 0s linear .3s; z-index: 70; }
#s34-panel.is-open { transform: none; visibility: visible; transition: transform .3s ease; }
/* แถบนำทางด้านล่าง (มือถือ) */
#s34-dock { padding-bottom: env(safe-area-inset-bottom); }
.s34-dock-gap { height: calc(4.5rem + env(safe-area-inset-bottom)); }
.s34-dock-link[aria-current="page"] { color: #ffc98a; background: rgba(255,138,31,.1); }
.s34-dock-link[aria-current="page"] svg { filter: drop-shadow(0 0 6px rgba(255,138,31,.7)); }
#s34-scrim { position: fixed; inset: 0; background: rgba(5,2,10,.6); opacity: 0; pointer-events: none; transition: opacity .3s; z-index: 60; }
#s34-scrim.is-open { opacity: 1; pointer-events: auto; }
.ticker { animation: s34-tick 28s linear infinite; }
@keyframes s34-tick { to { transform: translateX(-50%); } }

.pulse-ring { animation: s34-ring 2.4s ease-out infinite; }
@keyframes s34-ring { 0% { box-shadow: 0 0 0 0 rgba(255,138,31,.55); } 100% { box-shadow: 0 0 0 18px rgba(255,138,31,0); } }

/* ค่ายเกมชั้นนำ (Provider Logo Slider) */
.providers-section { position: relative; padding: 2.5rem 0 2.75rem; border-block: 1px solid rgba(166,133,255,.14); background: linear-gradient(180deg, rgba(42,24,70,.55), rgba(18,10,29,.35)); }
.providers-header { max-width: 46rem; margin: 0 auto 1.6rem; padding: 0 1rem; text-align: center; }
.providers-header h2 { font-family: "Bai Jamjuree", sans-serif; font-weight: 700; font-size: clamp(1.25rem, 2.6vw, 1.75rem); color: #fff; }
.providers-header p { margin-top: .5rem; font-size: .95rem; color: rgba(228,217,255,.7); }
.providers-marquee { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent); mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent); }
.providers-track { display: flex; gap: 18px; width: max-content; margin: 0; padding: 10px 0; list-style: none; animation: providers-scroll 48s linear infinite; animation-play-state: paused; }
.providers-marquee.is-active .providers-track { animation-play-state: running; }
.providers-marquee.is-active:hover .providers-track { animation-play-state: paused; }
.providers-track li { flex: none; border-radius: 16px; overflow: hidden; background: #1c1030; box-shadow: 0 0 0 1px rgba(166,133,255,.25), 0 12px 26px -12px rgba(139,92,246,.7); transition: transform .25s, box-shadow .25s; }
.providers-track li:hover { transform: translateY(-4px) scale(1.02); box-shadow: 0 0 0 1px rgba(255,169,77,.7), 0 16px 32px -12px rgba(255,138,31,.7); }
.providers-track img { width: 220px; height: 141px; display: block; }
@keyframes providers-scroll { to { transform: translateX(calc(-50% - 9px)); } }
@media (max-width: 600px) {
  .providers-track { gap: 12px; animation-duration: 34s; }
  .providers-track img { width: 170px; height: 109px; }
  @keyframes providers-scroll { to { transform: translateX(calc(-50% - 6px)); } }
}

/* บทความ */
.s34-prose { line-height: 1.95; color: rgba(233,227,245,.88); font-size: 1.05rem; }
.s34-prose h2 { font-family: "Bai Jamjuree", sans-serif; font-weight: 700; font-size: 1.55rem; color: #fff; margin: 2.4rem 0 .8rem; padding-left: .9rem; border-left: 4px solid #ff8a1f; scroll-margin-top: 6rem; }
.s34-prose h3 { font-family: "Bai Jamjuree", sans-serif; font-weight: 600; font-size: 1.2rem; color: #ffc98a; margin: 1.6rem 0 .5rem; scroll-margin-top: 6rem; }
.s34-prose p { margin: .9rem 0; }
.s34-prose ul, .s34-prose ol { margin: .9rem 0 .9rem 1.3rem; }
.s34-prose ul { list-style: disc; } .s34-prose ol { list-style: decimal; }
.s34-prose li { margin: .35rem 0; }
.s34-prose a { color: #ffa94d; text-decoration: underline; text-underline-offset: 3px; }
.s34-prose strong { color: #fff; }
.s34-prose blockquote { margin: 1.4rem 0; padding: 1rem 1.2rem; border-radius: 14px; background: rgba(139,92,246,.12); border: 1px solid rgba(166,133,255,.25); color: #e4d9ff; }
.toc a[aria-current="true"] { color: #ffc98a; border-color: #ff8a1f; }
#s34-progress { position: fixed; top: 0; left: 0; height: 3px; width: 0; z-index: 80; background: linear-gradient(90deg, #a685ff, #ff8a1f); }

/* FAQ */
details.faq summary { list-style: none; cursor: pointer; }
details.faq summary::-webkit-details-marker { display: none; }
details.faq[open] .faq-ico { transform: rotate(45deg); }
.faq-ico { transition: transform .2s; }

[data-filter][aria-pressed="true"] { background: #ff8a1f; color: #1c0d02; border-color: #ff8a1f; }

@media (prefers-reduced-motion: reduce) {
  .ticker, .pulse-ring { animation: none !important; }
  .providers-track { animation-duration: 100s; }
  .lift, .providers-track li { transition: none; }
}
