/*
Theme Name: Roll88 Lobby
Description: Thai-language Roll88 game lobby and editorial pages.
Version: 1.0.0
Text Domain: roll88-lobby
*/
:root{color-scheme:dark;--ink:#f5f8ff;--muted:#bfcae7;--navy:#06184f;--deep:#020c31;--panel:#0a286b;--green:#49d52f;--line:#3163a2;--gold:#ffd965}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#061a55;color:var(--ink);font-family:Tahoma,"Noto Sans Thai",Arial,sans-serif;line-height:1.75}a{color:inherit;text-decoration:none}a:hover,a:focus-visible{color:var(--green)}button,a{touch-action:manipulation}img{max-width:100%;height:auto;display:block}button{font:inherit}a:focus-visible,button:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.site-shell{min-height:100vh;background:radial-gradient(ellipse at 80% 17%,#173a90 0,transparent 37%),linear-gradient(180deg,#06194f 0%,#082968 44%,#051542 100%)}.site-top{height:76px;background:#03113f;border-bottom:1px solid #184480;display:flex;align-items:center;justify-content:flex-end;padding:0 clamp(18px,4vw,64px);gap:12px}.top-brand{display:none}.top-actions{display:flex;gap:12px}.action{display:inline-flex;align-items:center;justify-content:center;min-height:43px;min-width:132px;padding:7px 20px;border:1px solid var(--green);border-radius:24px;font-weight:700;line-height:1.3}.action.primary{background:var(--green);color:#031638}.action.secondary{background:transparent;color:#fff}.action:hover{filter:brightness(1.12);color:#031638}.action.secondary:hover{color:var(--green)}.menu-toggle{display:none;background:none;border:0;color:white;font-size:27px;cursor:pointer}
.layout{display:grid;grid-template-columns:260px minmax(0,1fr);max-width:1920px;margin:auto}.sidebar{background:linear-gradient(180deg,#031146,#062864);border-right:1px solid #17447c;min-height:calc(100vh - 76px);padding:27px 26px;position:relative}.brand img{width:200px;max-height:75px;object-fit:contain}.sidebar nav{margin-top:32px}.sidebar nav a{display:flex;align-items:center;gap:15px;min-height:57px;font-weight:700;border-radius:5px;padding:0 12px}.sidebar nav a[aria-current="page"],.sidebar nav a:hover{background:#11438b;color:var(--green)}.nav-icon{font-size:23px;color:var(--green);width:29px;text-align:center}.side-note{border-top:2px solid var(--green);margin-top:28px;padding-top:24px;color:var(--muted);font-size:.92rem}.side-note strong{display:block;color:var(--green);font-size:1.05rem}.side-note a{display:block;margin-top:9px}
.main{min-width:0;padding:20px clamp(18px,3vw,52px) 60px}.container{max-width:1280px;margin-inline:auto}.hero-visual{border:1px solid #2055a4;border-radius:10px;overflow:hidden;background:#071648}.hero-visual img{width:100%;height:auto}.hero-copy{padding:26px 0 12px}.eyebrow{color:var(--green);font-size:.92rem;font-weight:700}.hero-copy h1,.page-intro h1{font-size:clamp(1.7rem,3vw,2.6rem);line-height:1.3;color:#fff;margin:.2em 0 .35em}.hero-copy p,.page-intro p{color:var(--muted);max-width:820px;margin:0 0 18px}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:17px}.section-head{display:flex;align-items:end;justify-content:space-between;gap:14px;border-bottom:2px solid var(--green);margin:32px 0 18px;padding-bottom:9px}.section-head h2{margin:0;color:var(--green);font-size:1.45rem;line-height:1.35}.section-head a{color:#fff;text-decoration:underline;text-decoration-color:var(--green);text-underline-offset:5px}.games{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.game{border:1px solid #3276bd;background:#092763;border-radius:6px;overflow:hidden}.game img{width:100%;aspect-ratio:306/173;object-fit:contain;background:#071642}.game-body{padding:10px 14px 15px}.game h3{margin:0;color:#fff;font-size:1.05rem}.game p{margin:2px 0 0;color:var(--muted);font-size:.88rem}.topic-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:22px 0}.topic-links a{border-left:3px solid var(--green);background:#0c3075;padding:16px 18px;font-weight:700}.topic-links span{display:block;color:var(--muted);font-weight:400;font-size:.88rem}
.breadcrumb{font-size:.85rem;color:#a7bbdf;margin:0 0 20px}.breadcrumb a{color:var(--green)}.page-intro{padding:24px 0;border-bottom:2px solid #2d60a3}.article-layout{max-width:990px}.article-body{font-size:1.03rem;color:#e7edfb}.article-body h2{font-size:1.55rem;line-height:1.4;color:var(--green);margin:1.8em 0 .65em}.article-body h3{font-size:1.18rem;color:var(--gold);margin:1.5em 0 .5em}.article-body p{margin:0 0 1.15em}.article-body ul,.article-body ol{padding-left:1.5em;margin:0 0 1.2em}.article-body li{margin:.4em 0}.article-body figure{margin:30px 0}.article-body figcaption{color:var(--muted);font-size:.85rem;margin-top:7px}.article-body img{max-height:none;object-fit:contain;border-radius:5px}.related{border-top:1px solid #28609b;margin-top:40px;padding-top:20px}.related h2{color:var(--green);font-size:1.25rem}.related-links{display:flex;flex-wrap:wrap;gap:12px}.related-links a{border:1px solid #4d80ba;padding:8px 16px;border-radius:3px}.site-footer{border-top:1px solid #23518b;background:#03123d;padding:28px clamp(18px,3vw,52px);color:var(--muted);font-size:.9rem}.site-footer-inner{max-width:1280px;margin:auto;display:flex;gap:25px;justify-content:space-between;flex-wrap:wrap}.footer-links{display:flex;flex-wrap:wrap;gap:14px}.mobile-cta{display:none}
@media(max-width:1000px){.layout{grid-template-columns:215px minmax(0,1fr)}.sidebar{padding:22px 13px}.brand img{width:175px}.games{grid-template-columns:repeat(2,minmax(0,1fr))}.topic-links{grid-template-columns:1fr 1fr}}
@media(max-width:740px){.site-top{height:62px;justify-content:space-between;padding-inline:14px}.top-brand{display:block;font-weight:900;font-size:1.2rem}.top-brand b{color:var(--green)}.top-actions .action{min-width:76px;padding:6px 10px;font-size:.83rem;min-height:37px}.menu-toggle{display:block}.layout{display:block}.sidebar{display:none;min-height:0;padding:13px 20px}.sidebar.is-open{display:block}.brand img{width:155px}.sidebar nav{margin-top:12px}.side-note{display:none}.main{padding:16px 17px 94px}.hero-visual{border-radius:5px}.hero-copy{padding:19px 0 4px}.hero-copy h1,.page-intro h1{font-size:1.75rem}.games{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.game-body{padding:8px}.game h3{font-size:.9rem}.game p{font-size:.78rem;line-height:1.4}.topic-links{grid-template-columns:1fr;gap:9px}.article-body{font-size:1rem}.article-body h2{font-size:1.34rem}.mobile-cta{position:fixed;bottom:0;left:0;right:0;display:flex;gap:8px;padding:9px 12px max(9px,env(safe-area-inset-bottom));background:#03113e;border-top:1px solid #2e6caa;z-index:20}.mobile-cta .action{flex:1;min-width:0}.site-footer{padding-bottom:85px}}
@media(max-width:360px){.top-actions .action{min-width:67px;padding:5px 7px}.games{grid-template-columns:1fr 1fr}.game p{display:none}}
.article-body .feature-figure{max-width:786px;margin:30px auto}.article-body .feature-figure img{width:100%;height:auto}
