:root{color-scheme:dark;--bg:#0b0c0e;--surface:#151719;--surface-2:#1d2021;--line:#38393a;--text:#f5f4ed;--muted:#b9b9b2;--gold:#ffd84a;--gold-deep:#bd8c16;--aqua:#84d9cf}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:Tahoma,"Noto Sans Thai",system-ui,sans-serif;line-height:1.55}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit}
button,a{touch-action:manipulation}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--aqua);outline-offset:3px}
[hidden]{display:none!important}
.wrap{width:min(1180px,calc(100% - 40px));margin-inline:auto}
.skip-link{position:absolute;top:-100px;left:12px;z-index:100;padding:10px;background:#fff;color:#111}
.skip-link:focus{top:10px}
.site-header{position:relative;z-index:30;background:#050607;border-bottom:1px solid #9c7c1d}
.header-inner{width:min(1320px,calc(100% - 32px));min-height:82px;margin:auto;display:flex;align-items:center;gap:26px}
.brand-mark{display:inline-block;flex:none;padding:5px 14px 4px;background:linear-gradient(120deg,#fff3a4 0%,#ffcf35 55%,#e9aa23 100%);color:#111;font:900 36px/1.08 Arial,sans-serif;letter-spacing:0;border-radius:3px;box-shadow:inset 0 0 0 1px #ffe989}
.keyword-k9win{padding:0 .16em;border-radius:2px;background:linear-gradient(110deg,#fff4aa 0%,#ffd344 55%,#e2a421 100%);color:#17130b;font-weight:900;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.prose .keyword-inline{padding:0 .16em;border-radius:2px;color:#17130b;font-weight:800;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.prose .keyword-inline--en{background:linear-gradient(110deg,#fff4aa 0%,#ffd344 55%,#e2a421 100%)}
.prose .keyword-inline--th{background:linear-gradient(110deg,#b4eee5 0%,#75d7c9 100%);color:#092925}
.desktop-nav{display:flex;align-items:center;justify-content:center;gap:4px;flex:1}
.desktop-nav a{padding:14px 9px;font-size:14px;white-space:nowrap;color:#e4e1d2}
.desktop-nav a:hover,.desktop-nav a[aria-current=page]{color:var(--gold)}
.header-actions{display:flex;align-items:center;gap:12px}
.button{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:10px 21px;border:1px solid transparent;border-radius:4px;font-weight:800;text-align:center;white-space:normal;line-height:1.2;transition:background .2s,color .2s,transform .2s}
.button:hover{transform:translateY(-2px)}
.button-primary,.button-header{background:linear-gradient(180deg,#fff3a0,#ffcf3e 58%,#dca52b);border-color:#ffe37a;color:#1a160b}
.button-quiet{background:rgba(9,10,10,.7);border-color:#d4b547;color:#fff2ad}
.button-header{font-size:14px;min-height:40px;padding:9px 14px}
.icon-button{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border:1px solid #9f8643;border-radius:4px;background:#151719;color:var(--gold);cursor:pointer}
.icon{display:inline-block;width:22px;height:22px;background:currentColor;mask-size:contain;mask-position:center;mask-repeat:no-repeat;-webkit-mask-size:contain;-webkit-mask-position:center;-webkit-mask-repeat:no-repeat}
.icon-menu{mask-image:url('../icons/menu.svg');-webkit-mask-image:url('../icons/menu.svg')}
.icon-home{mask-image:url('../icons/house.svg');-webkit-mask-image:url('../icons/house.svg')}
.icon-gamepad{mask-image:url('../icons/gamepad-2.svg');-webkit-mask-image:url('../icons/gamepad-2.svg')}
.icon-gift{mask-image:url('../icons/gift.svg');-webkit-mask-image:url('../icons/gift.svg')}
.icon-smartphone{mask-image:url('../icons/smartphone.svg');-webkit-mask-image:url('../icons/smartphone.svg')}
.icon-log-in{mask-image:url('../icons/log-in.svg');-webkit-mask-image:url('../icons/log-in.svg')}
.icon-chevron-left{mask-image:url('../icons/chevron-left.svg');-webkit-mask-image:url('../icons/chevron-left.svg')}
.icon-chevron-right{mask-image:url('../icons/chevron-right.svg');-webkit-mask-image:url('../icons/chevron-right.svg')}
.menu-toggle,.mobile-menu,.bottom-nav{display:none}
.lobby-hero{position:relative;overflow:hidden;background:#151612;border-bottom:1px solid #9c7c1d}
.lobby-hero:before{content:"";position:absolute;inset:0 0 auto;height:5px;background:linear-gradient(90deg,#ae7e16,#fff2a2,#d49b1a);z-index:2}
.hero-media{width:100%;background:#08090a}
.hero-slide{width:100%;aspect-ratio:1904/300}
.hero-slide picture,.hero-slide img{display:block;width:100%;height:100%}
.hero-slide img{object-fit:cover;object-position:center}
.eyebrow{margin:0 0 12px;color:var(--gold);font-size:12px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}
.hero-intro{padding:18px 0 32px}
.hero-intro h1{max-width:970px;margin:0;font-size:43px;line-height:1.25;font-weight:900}
.hero-keyword{display:inline-block;margin-right:8px;font:900 54px/1 Arial,sans-serif;vertical-align:-3px}
.hero-intro>p:not(.eyebrow){max-width:800px;margin:11px 0 18px;color:#f1eee4;font-size:16px;line-height:1.55}
.hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px}
.hero-controls{min-height:55px;display:flex;justify-content:flex-end;align-items:center;gap:12px}
.hero-arrow{background:rgba(5,5,5,.82)}
.hero-dots{display:flex;align-items:center;gap:7px}
.hero-dots button{width:22px;height:6px;padding:0;border:0;border-radius:0;background:#a7a496;cursor:pointer}
.hero-dots button.is-active{width:36px;background:var(--gold)}
.quick-zones{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:#7e661f;border:1px solid #7e661f;margin-top:18px;margin-bottom:60px}
.quick-zones a{min-height:116px;padding:18px 22px;background:#171817;display:flex;flex-direction:column;gap:3px;transition:background .2s}
.quick-zones a:hover{background:#24241d}
.quick-zones span{color:var(--gold);font-size:12px;font-weight:900}
.quick-zones strong{font-size:21px}
.quick-zones small{color:var(--muted);font-size:13px}
.lobby-section{margin-block:64px 78px}
.section-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:24px}
.section-heading h2{margin:0;font-size:34px;line-height:1.2}
.text-link{color:var(--gold);font-weight:800;white-space:nowrap}
.text-link:hover{text-decoration:underline}
.filter-tabs{display:flex;gap:4px;border-bottom:1px solid #63592e;margin-bottom:22px;overflow:auto}
.filter-tabs button{padding:11px 22px;border:0;border-bottom:3px solid transparent;background:none;color:#d5d3c9;cursor:pointer;white-space:nowrap}
.filter-tabs button[aria-selected=true]{border-bottom-color:var(--gold);color:#ffe987;font-weight:800}
.game-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;min-height:245px}
.game-tile{min-width:0;background:#17191a;border:1px solid #3f4038;border-radius:4px;overflow:hidden;transition:transform .2s,border-color .2s}
.game-tile:hover{transform:translateY(-3px);border-color:var(--gold)}
.game-tile img{width:100%;aspect-ratio:508/234;object-fit:cover}
.game-tile>span{display:block;padding:12px 13px 16px}
.game-tile strong,.game-tile small{display:block}
.game-tile strong{font-size:16px}
.game-tile small{margin-top:3px;color:var(--muted);font-size:12px}
.feature-band{background:#1a1b1a;border-block:1px solid #4f4427;padding:56px 0}
.feature-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,508px);align-items:center;gap:50px}
.feature-grid h2{font-size:35px;line-height:1.2;margin:0 0 16px}
.feature-grid p:not(.eyebrow){font-size:17px;line-height:1.8;color:#d0cfc6;max-width:650px}
.feature-grid img{width:100%;height:auto;border:1px solid #b3984c}
.category-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.category-strip a{min-height:268px;display:flex;flex-direction:column;align-items:center;justify-content:end;padding:15px;background:#1a1c1e;border-bottom:3px solid #c4a230;border-radius:3px}
.category-strip a:hover{background:#242827}
.category-strip img{height:205px;width:auto;object-fit:contain}
.category-strip strong{font-size:17px;color:#f8e8a6}
.story-band{padding:58px 0;background:#101517;border-block:1px solid #284348}
.story-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:#4b5a58;border:1px solid #4b5a58}
.story-links a{min-width:0;min-height:146px;padding:23px;background:#171e20;display:flex;flex-direction:column;gap:12px}
.story-links a:hover{background:#213032}
.story-links span{font-size:12px;font-weight:800;color:var(--aqua)}
.story-links strong{font-size:19px;line-height:1.35}
.story-links small{color:var(--muted);font-size:13px;line-height:1.5}
.long-form{padding-top:45px;padding-bottom:80px}
.prose{width:min(860px,100%);font-size:17px;line-height:1.9;color:#e0dfd7}
.prose h2{margin:55px 0 16px;color:#fff2a9;font-size:30px;line-height:1.3}
.prose h3{margin:28px 0 12px;color:#f7f2da;font-size:23px;line-height:1.35}
.prose p{margin:0 0 19px}
.prose a{color:#a7e6dd;text-decoration:underline;text-underline-offset:3px}
.prose ul,.prose ol{padding-left:23px;margin:0 0 23px}
.prose li{margin-bottom:8px}
.prose blockquote{margin:26px 0;padding:14px 22px;border-left:3px solid var(--gold);background:#20221d}
.prose .story-image{margin:32px 0 38px;width:min(680px,100%)}
.story-image img{width:100%;max-width:508px;border:1px solid #66562d}
.story-image figcaption{margin-top:7px;color:var(--muted);font-size:13px}
.prose details{border-block-end:1px solid #3e423e;padding:13px 0}
.prose details:first-of-type{border-block-start:1px solid #3e423e}
.prose summary{color:#f7e8aa;font-weight:800;cursor:pointer}
.prose details p{margin:10px 0 0}
.prose .content-links{display:flex;gap:10px;flex-wrap:wrap;margin:25px 0}
.prose .content-links a{display:inline-flex;padding:8px 14px;border:1px solid #927b39;border-radius:3px;color:#f9e8a4;text-decoration:none;font-size:14px}
.prose .content-links a:hover{background:#322b1c}
.inner-hero{padding:54px 0 52px;background:linear-gradient(110deg,#101213 0%,#25220f 65%,#6a531b 100%);border-bottom:1px solid #927938}
.inner-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,508px);align-items:center;gap:50px}
.inner-hero-text{max-width:900px}
.inner-hero h1{max-width:740px;margin:0;color:#fff7db;font-size:45px;line-height:1.17}
.hero-summary{max-width:650px;margin:16px 0 22px;font-size:17px;line-height:1.65;color:#e1e0d6}
.inner-hero img{width:100%;max-width:508px;height:auto;border:1px solid #c4a02d}
.article-hero .wrap{max-width:900px}
.breadcrumbs{display:flex;flex-wrap:wrap;gap:9px;align-items:center;padding:17px 0;border-bottom:1px solid #323532;color:#aead9e;font-size:13px}
.breadcrumbs a:hover{color:var(--gold)}
.page-body{padding-top:14px;padding-bottom:64px}
.article-index{padding-top:44px}
.article-index .story-links{grid-template-columns:repeat(2,minmax(0,1fr))}
.closing-band{padding:48px 0;background:linear-gradient(96deg,#171a1a,#3b3214);border-top:1px solid #9e8139}
.closing-band h2{margin:0 0 8px;font-size:30px}
.closing-band p{color:#d2d0c4;font-size:16px}
.site-footer{background:#07090a;border-top:1px solid #3c3c35;padding:53px 0 26px}
.footer-inner{width:min(1180px,calc(100% - 40px));margin:auto}
.footer-top{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:40px}
.footer-brand{font-size:30px}
.footer-top p{max-width:340px;color:#b6b7af;font-size:14px}
.footer-age{color:#f6d774!important}
.footer-top nav{display:flex;flex-direction:column;gap:10px}
.footer-top nav h2{margin:0 0 7px;font-size:16px;color:#ffe17b}
.footer-top nav a{color:#cbccc5;font-size:14px}
.footer-top nav a:hover{color:#fff1a1}
.footer-bottom{display:flex;justify-content:space-between;gap:15px;margin-top:50px;padding-top:17px;border-top:1px solid #323632;color:#91948e;font-size:12px}
.fallback-list,.error-page{min-height:55vh;padding-block:70px}
.fallback-list article{padding:22px 0;border-bottom:1px solid var(--line)}
.fallback-list h1,.error-page h1{font-size:42px}
@media(max-width:1120px){.desktop-nav a{padding-inline:6px;font-size:13px}.header-inner{gap:12px}.brand-mark{font-size:31px}}
@media(max-width:980px){.desktop-nav{display:none}.header-inner{justify-content:space-between}.menu-toggle{display:inline-flex}.mobile-menu{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;padding:0 16px 16px;background:#050607}.mobile-menu[hidden]{display:none}.mobile-menu a{padding:13px;background:#161819;border-bottom:1px solid #5d4b1b}.feature-grid,.inner-hero-grid{grid-template-columns:1fr 42%;gap:25px}.game-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.wrap{width:min(100% - 28px,560px)}.header-inner{min-height:68px}.brand-mark{font-size:27px}.button-header{display:none}.lobby-hero{background:linear-gradient(155deg,#111314 0%,#3d3214 70%,#735819 100%)}.hero-slide{min-height:620px;padding-top:33px}.hero-copy{padding-bottom:70px}.hero-copy h1,.hero-copy h2{font-size:35px}.hero-brand{font-size:60px}.hero-copy>p:not(.eyebrow){font-size:15px}.hero-mosaic{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,150px);height:300px}.hero-mosaic img{height:150px}.hero-controls{bottom:314px}.quick-zones{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:20px;margin-bottom:42px}.quick-zones a{min-height:96px;padding:12px}.quick-zones strong{font-size:18px}.section-heading h2{font-size:27px}.lobby-section{margin-block:43px}.game-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.game-tile>span{padding:9px 10px 12px}.game-tile strong{font-size:14px}.game-tile small{font-size:11px}.feature-band{padding:38px 0}.feature-grid,.inner-hero-grid{grid-template-columns:1fr}.feature-grid h2{font-size:29px}.feature-grid img{max-width:508px}.category-strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.category-strip a{min-height:218px}.category-strip img{height:170px}.story-band{padding:40px 0}.story-links,.article-index .story-links{grid-template-columns:1fr}.story-links a{min-height:112px}.long-form{padding-block:35px 65px}.prose{font-size:16px;line-height:1.82}.prose h2{font-size:25px;margin-top:42px}.prose h3{font-size:20px}.inner-hero{padding:36px 0}.inner-hero h1{font-size:35px}.inner-hero img{max-width:400px}.page-body{padding-bottom:50px}.footer-top{grid-template-columns:repeat(2,minmax(0,1fr));gap:29px}.footer-top>div{grid-column:1/-1}.site-footer{padding-bottom:100px}.footer-bottom{flex-direction:column;margin-top:35px}.bottom-nav{position:fixed;bottom:0;left:0;right:0;z-index:25;display:grid;grid-template-columns:repeat(4,1fr);background:#080a0b;border-top:1px solid #a58b3b;padding-bottom:env(safe-area-inset-bottom)}.bottom-nav a{min-height:60px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:#e9e5cf;font-size:11px}.bottom-nav .icon{width:21px;height:21px;color:var(--gold)}}
@media(max-width:390px){.hero-slide{min-height:635px}.hero-copy h1,.hero-copy h2{font-size:31px}.hero-brand{font-size:52px}.hero-copy>p:not(.eyebrow){font-size:14px}.hero-actions .button{padding-inline:12px;font-size:13px}.hero-controls{bottom:311px}.section-heading{align-items:start}.text-link{font-size:13px}.quick-zones small{font-size:11px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button,.game-tile{transition:none}}
@media(max-width:700px){.lobby-hero{background:#151612}.hero-slide{min-height:0;padding-top:0;aspect-ratio:10/7}.hero-slide img{object-fit:contain}.hero-controls{position:static;min-height:52px;transform:none;pointer-events:auto}.hero-intro{padding:14px 0 25px}.hero-intro h1{font-size:30px}.hero-keyword{font-size:48px}.hero-intro>p:not(.eyebrow){font-size:15px}.quick-zones{margin-top:16px}}
@media(max-width:390px){.hero-slide{min-height:0}.hero-intro h1{font-size:28px}.hero-keyword{font-size:43px}.hero-controls{position:static}}
@media(max-width:700px){.bottom-nav{grid-template-columns:repeat(4,minmax(0,1fr)) minmax(96px,1.25fr)}.bottom-nav .bottom-login{min-height:48px;margin:6px 7px 6px 0;gap:0;border:1px solid #ffe48a;border-radius:4px;background:linear-gradient(180deg,#fff3a0,#ffcf3e 58%,#dca52b);color:#17130b;font-size:11px;font-weight:900;line-height:1.15}.bottom-nav .bottom-login .icon{width:18px;height:18px;color:#17130b}.bottom-nav .bottom-login span:last-child{white-space:nowrap}}
