/*
Theme Name: 168GalaxyPlus Meridian
Theme URI: https://168galaxyplus.store/
Version: 1.0.0
Author: 168galaxyplus
Description: คู่มือคาสิโนและกีฬาภาษาไทยของ 168galaxyplus ในโทนน้ำเงินมิดไนต์และทองแดง
Text Domain: galaxyplus-meridian
Requires at least: 6.3
Requires PHP: 7.4
License: GNU General Public License v2 or later
*/
:root {
    --night: #0b1425;
    --blue: #152740;
    --ink: #182434;
    --text: #415064;
    --copper: #efb383;
    --copper-ink: #84502d;
    --cream: #f8f6f1;
    --rule: #d9d3ca;
    --faint: #bfcbdc;
    --font: "Fahkwang", "Leelawadee UI", "Noto Sans Thai", Tahoma, Arial, sans-serif;
    --serif: "Cormorant Garamond", Georgia, "Times New Roman", serif;
}
*,*::before,*::after {box-sizing:border-box}
body {margin:0;background:var(--cream);color:var(--ink);font:1rem/1.7 var(--font);overflow-wrap:break-word}
h1,h2,h3,p {margin:0}
h1,h2,h3 {line-height:1.35}
a {color:inherit;text-decoration:none}
img,picture,svg {display:block}
img {max-width:100%}
button,select {font:inherit}
button,select,label[for] {cursor:pointer}
[hidden] {display:none!important}
:focus-visible {outline:3px solid #a45c26;outline-offset:4px}
.hero :focus-visible,.closing :focus-visible,.mast :focus-visible,.lesson :focus-visible {outline-color:#f4c197}
.frame {width:min(1392px,calc(100% - clamp(44px,7.2vw,136px)));margin-inline:auto}
.skip {position:absolute;z-index:30;top:8px;left:12px;transform:translateY(-180%);background:white;color:var(--ink);padding:6px 14px}
.skip:focus {transform:none}
.mast,.hero-shell,.closing {background:var(--night);color:var(--cream)}
.mast {position:relative;z-index:10}
.mast-inner {display:flex;align-items:center;gap:clamp(18px,3vw,50px);min-height:74px;border-bottom:1px solid #344052}
.wordmark {display:inline-flex;align-items:center;gap:7px;flex:none;white-space:nowrap}
.wordmark img {width:37px;height:37px}
.wordmark span {font:600 1.03rem/1 "Inter",Arial,sans-serif;letter-spacing:.055em}
.wordmark b {font-weight:700;color:var(--copper)}
.main-menu ul,.closing ul {padding:0;margin:0;list-style:none}
.main-menu ul {display:flex;align-items:center;gap:clamp(12px,1.7vw,28px)}
.main-menu a,.desk-login {display:inline-flex;align-items:center;min-height:44px;font-weight:600;font-size:.9rem}
.main-menu a:hover,.desk-login:hover,.main-menu a[aria-current=page] {color:var(--copper)}
.mast-actions {margin-left:auto;display:flex;align-items:center;gap:19px}
.main-menu .drawer-login,.nav-toggle {display:none}
.ui-icon {width:18px;height:18px;flex:none}
.action {display:inline-flex;justify-content:center;align-items:center;gap:10px;padding:11px 22px;min-height:45px;border:1px solid transparent;border-radius:30px;font-size:.94rem;line-height:1.35;font-weight:700}
.primary-action {color:#1c1720;background:var(--copper)}
.primary-action:hover {background:#ffd1a8}
.mast .primary-action {min-height:39px;padding:7px 18px}
.outline-action {background:#0d1724b5;border-color:#a7b1bd;color:#fff}
.outline-action:hover {background:#2a3848}
.ink-action {background:var(--blue);color:white}
.ink-action:hover {background:#314a69}
.hero-shell {padding:clamp(15px,1.65vw,27px) 0 clamp(22px,2.4vw,41px)}
.hero {position:relative;isolation:isolate;display:flex;align-items:center;overflow:hidden;min-height:clamp(420px,34vw,550px);color:white;border-radius:18px;border:1px solid #47505c;background:var(--blue)}
.cover-art,.hero::before {position:absolute;inset:0;z-index:-2}
.cover-art img {width:100%;height:100%;object-fit:cover;object-position:center 55%}
.hero::before {content:"";z-index:-1;background:linear-gradient(92deg,#081324f7 0%,#091525e8 18%,#0b1626c9 34%,#0a142789 46%,#0712230a 67%),linear-gradient(0deg,#0c182e55,transparent 45%)}
.hero-copy {width:min(58%,740px);padding:clamp(36px,4.5vw,74px)}
.hero-copy h1 {font-size:clamp(1.9rem,2.55vw,3rem)}
.hero-brand {display:block;font:500 clamp(3.6rem,5.2vw,6rem)/.94 var(--serif);letter-spacing:-.055em;margin-left:-.045em}
.hero-brand span {color:var(--copper)}
.hero-heading {display:block;margin:.55em 0 .34em;letter-spacing:-.035em;text-wrap:balance}
.hero-intro {color:#ecedf0;max-width:38rem;font-size:clamp(.96rem,1.04vw,1.15rem);line-height:1.7}
.hero-actions {display:flex;flex-wrap:wrap;gap:10px;margin-top:23px}
.section-head,.journal-heading {display:flex;gap:12px;align-items:center;justify-content:space-between;margin-bottom:17px}
.section-head h2,.journal-heading h2,.lesson h2,.member-panel h2 {font-size:clamp(1.6rem,2.05vw,2.5rem);font-weight:650;letter-spacing:-.035em}
.text-link {display:inline-flex;gap:8px;align-items:center;min-height:40px;color:var(--copper-ink);font-size:.92rem;font-weight:700}
.text-link:hover,.member-panel a:hover {text-decoration:underline;text-underline-offset:4px}
.directory {padding-block:clamp(30px,3.5vw,59px)}
.topic-grid {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(10px,1.13vw,18px)}
.topic {position:relative;display:block;overflow:hidden;min-width:0;border-radius:11px;background:var(--blue);color:#fff;isolation:isolate}
.topic:after {content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#08111ff7 0%,#0a1526c2 27%,#0a14292e 58%,transparent)}
.topic-photo {aspect-ratio:1.26;overflow:hidden;position:relative;z-index:-2}
.topic-photo img,.read-cover img {display:block;width:100%;height:100%;object-fit:cover;transition:transform .25s ease-out}
.topic:hover img,.read-cover:hover img {transform:scale(1.045)}
.topic:hover .topic-arrow {background:var(--copper);border-color:var(--copper);color:var(--night)}
.topic-caption {position:absolute;inset:auto 32px 13px 15px}
.topic-caption h3 {font-size:clamp(1.16rem,1.5vw,1.65rem);line-height:1.3}
.topic-caption p {font-size:clamp(.72rem,.87vw,.92rem);color:#f0efef;line-height:1.5;margin-top:2px}
.topic-arrow {position:absolute;right:10px;bottom:14px;border:1px solid #b7c0cc;border-radius:50%;width:23px;height:23px;display:grid;place-items:center;color:white}
.topic-arrow .ui-icon {width:14px;height:14px;transform:rotate(-35deg)}
.lesson {display:grid;grid-template-columns:.82fr 1fr;align-items:center;gap:clamp(27px,7vw,120px);padding:clamp(26px,3.3vw,56px);background:#13263a;color:var(--cream);border-radius:17px}
.lesson h2 {font-size:clamp(1.8rem,2.65vw,3rem)}
.lesson-copy p {color:#dbe2e8;max-width:36rem;margin:12px 0 8px}
.lesson .text-link {color:var(--copper)}
.roulette-demo {position:relative;min-width:0;margin:0;border:1px solid #617184;border-radius:12px;padding:8px 17px 17px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px 7px}
.roulette-demo legend {padding:0 8px;font-weight:600}
.place-input {position:absolute;width:1px;height:1px;opacity:0}
.roulette-demo label {font-size:.9rem;display:grid;place-items:center;min-height:38px;border:1px solid #6b7889;border-radius:15px}
.place-input:checked+label {color:var(--night);background:var(--copper);border-color:var(--copper);font-weight:700}
.place-input:focus-visible+label {outline:3px solid white;outline-offset:2px}
.placement {display:none;grid-column:1/-1;grid-template-columns:104px 1fr;gap:17px;align-items:center;margin-top:7px;padding:12px;border:1px solid #526477;border-radius:8px;background:#101d31}
#place-straight:checked~#sample-straight,#place-split:checked~#sample-split,#place-corner:checked~#sample-corner {display:grid}
.felt {position:relative;display:grid;grid-template-columns:1fr 1fr;background:#ddc7a3;gap:1px;border:1px solid #ddc7a3}
.tile {background:#1d2735;text-align:center;font:600 1rem/1.55 Georgia,serif;color:white}
.tile-1,.tile-3,.tile-5 {background:#943941}
.chip {position:absolute;left:25%;top:50%;width:12px;height:12px;border:2px dashed #482m13;border-radius:50%;background:#f6c57c;transform:translate(-50%,-50%);box-shadow:0 0 0 1px white}
.placement-split .chip,.placement-corner .chip {left:50%}
.placement-corner .chip {top:66.667%}
.placement strong {font-size:1.15rem;color:#ffca9c}
.placement p {margin-top:2px;color:#e8edf3;font-size:.9rem;line-height:1.6}
.journal {padding-block:clamp(35px,4.5vw,74px)}
.journal-controls {display:flex;align-items:center;gap:9px;color:var(--text);font-size:.9rem}
.journal-controls select {padding:6px 12px;border-radius:8px;border:1px solid #9ca7af;background:white;color:var(--ink)}
.journal-list,.read-grid {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,2vw,34px)}
.read-card {min-width:0}
.read-cover {display:block;aspect-ratio:1.8;border-radius:10px;overflow:hidden;background:#152b40}
.read-meta,.article-byline {display:flex;align-items:center;flex-wrap:wrap;gap:8px 13px;font-size:.82rem;font-weight:600;color:var(--copper-ink)}
.read-meta {margin:13px 0 6px}
.read-meta time {color:#526172}
.read-body h2,.read-body h3 {font-size:clamp(1.05rem,1.3vw,1.4rem)}
.read-body h2 a:hover,.read-body h3 a:hover {text-decoration:underline}
.read-body p {color:var(--text);font-size:.94rem;margin:7px 0 0}
.member-guides,.reading {display:grid;grid-template-columns:minmax(0,1.8fr) minmax(220px,1fr);align-items:start;gap:clamp(26px,6vw,95px)}
.member-guides {border-top:1px solid var(--rule);padding-block:clamp(32px,4vw,65px)}
.member-panel {padding:22px 25px;background:#eee8df;border-radius:13px}
.member-panel h2 {font-size:1.4rem;margin-bottom:12px}
.member-panel a {display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:46px;border-top:1px solid #ccc2b4;font-weight:650}
.closing {padding:clamp(35px,4vw,64px) 0 0}
.closing-grid {display:grid;grid-template-columns:1.2fr .6fr .75fr;gap:clamp(20px,7vw,90px)}
.closing-brand p {max-width:30em;color:var(--faint);font-size:.92rem;margin-top:13px}
.closing nav h2 {font-size:1rem;margin-bottom:8px;color:#edc09b}
.closing nav a {display:inline-block;padding:3px 0;font-size:.92rem}
.closing nav a:hover,.article-byline a:hover {text-decoration:underline}
.colophon {display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;border-top:1px solid #3b4657;margin-top:26px;padding-block:15px;font-size:.8rem;color:#bfc7d1}
.inner-head {background:var(--blue);color:white;padding-block:clamp(28px,4vw,63px);border-bottom:4px solid #d59869}
.inner-head h1 {max-width:1000px;font-size:clamp(1.95rem,3.9vw,4.6rem);letter-spacing:-.037em;text-wrap:balance}
.inner-head p {max-width:890px;margin:12px 0 0;color:#e0e8f1;font-size:clamp(1rem,1.18vw,1.22rem)}
.crumb,.article-byline {display:flex;flex-wrap:wrap;align-items:center;font-size:.86rem;gap:9px;margin:0 0 13px;color:#f5c399}
.crumb a {text-decoration:underline;text-underline-offset:3px}
.reading,.archive-body,.missing {padding-block:clamp(32px,4vw,72px)}
.prose {min-width:0;font-size:1.04rem;line-height:1.88}
.prose h2 {font-size:clamp(1.28rem,2vw,1.9rem);margin:1.5em 0 .4em}
.prose h3 {font-size:1.18rem;margin:1.4em 0 .35em}
.prose>:first-child,.feature-copy>:first-child {margin-top:0}
.prose p,.prose ol,.prose ul,.prose blockquote {margin:0 0 .95em}
.prose a:not(.action) {color:var(--copper-ink);text-decoration:underline;text-underline-offset:3px}
.prose ol,.prose ul {padding-inline-start:1.5em}
.prose li {margin-block:.25em}
.prose table {border-collapse:collapse;max-width:100%;margin-block:1rem;font-size:.93em}
.prose th,.prose td {padding:7px 10px;border:1px solid var(--rule);text-align:start;overflow-wrap:anywhere}
.prose th {background:#eee7df}
.prose figure {max-width:100%;margin-inline:0;overflow-x:auto}
.reading-side {min-width:0}
.reading-side img {width:100%;height:auto;border-radius:14px;margin-bottom:8px}
.outbound {border-inline-start:3px solid var(--copper-ink);padding:16px 20px;background:#ede7df;margin-bottom:27px;border-radius:0 10px 10px 0}
.outbound p {font-size:.92rem;color:var(--text);margin:8px 0 0}
.post-links {display:flex;flex-wrap:wrap;gap:15px;justify-content:space-between;border-top:1px solid var(--rule);padding-top:18px}
.archive-intro {max-width:850px;margin-bottom:30px}
.pagination {margin-top:25px}
.page-numbers {display:inline-block;padding:6px 10px}
.missing h1 {font-size:clamp(2rem,5vw,4rem)}
.missing .action {margin-top:15px}
@media (max-width:1050px) {
    .mast-inner {gap:19px}
    .main-menu ul {gap:13px}
    .hero-copy {width:63%;padding:34px}
    .topic-caption {left:11px;right:27px;bottom:10px}
    .topic-arrow {right:6px;bottom:12px;width:20px;height:20px}
    .topic-photo {aspect-ratio:1.13}
}
@media (max-width:960px) {
    .mast-inner {min-height:62px;flex-wrap:wrap;gap:0}
    .nav-ready .nav-toggle {display:grid;width:42px;height:42px;border:1px solid #5d6877;border-radius:50%;background:transparent;padding:11px;align-content:center;gap:5px}
    .nav-toggle span {display:block;width:18px;height:2px;background:#fff}
    .main-menu {order:3;width:100%;padding:6px 0}
    .nav-ready .main-menu {display:none}
    .nav-ready .menu-open .main-menu {display:block;position:absolute;top:100%;left:0;padding:12px max(22px,3.6%);background:var(--night);border-bottom:1px solid #596575;box-shadow:0 12px 20px #0003}
    .main-menu ul {display:flex;flex-wrap:wrap;gap:0 20px}
    .main-menu .drawer-login {display:inline-flex;color:var(--copper);gap:8px}
    .desk-login {display:none}
    .mast-actions {gap:9px}
    .journal-list,.read-grid {grid-template-columns:repeat(2,minmax(0,1fr))}
    .topic-grid {grid-template-columns:repeat(6,minmax(0,1fr))}
    .topic {grid-column:span 2}
    .topic:nth-last-child(-n+2) {grid-column:span 3}
    .topic-photo {aspect-ratio:1.83}
    .topic:nth-last-child(-n+2) .topic-photo {aspect-ratio:2.48}
    .topic-caption p {font-size:.82rem}
    .lesson {grid-template-columns:.8fr 1fr;gap:20px}
    .placement {grid-template-columns:78px 1fr;gap:12px}
    .hero-copy {width:71%}
}
@media (max-width:700px) {
    .lesson,.member-guides,.reading {grid-template-columns:1fr}
    .lesson h2 br {display:none}
    .closing-grid {grid-template-columns:1fr 1fr}
    .closing-brand {grid-column:1/-1}
}
@media (max-width:620px) {
    .frame {width:calc(100% - 32px)}
    .mast-inner {min-height:61px}
    .wordmark img {width:30px;height:30px}
    .wordmark {gap:5px}
    .wordmark span {font-size:.84rem;letter-spacing:.025em}
    .mast .primary-action {padding:7px 11px;min-height:37px;font-size:.84rem;gap:5px}
    .mast .primary-action .ui-icon {width:14px;height:14px}
    .hero-shell {padding:10px 0 16px}
    .hero {display:flex;flex-direction:column;align-items:stretch;min-height:0;border-radius:12px;overflow:hidden}
    .cover-art {position:static;z-index:0;aspect-ratio:1.4}
    .cover-art img {object-position:50% 42%}
    .hero::before {display:none}
    .hero-copy {width:100%;padding:17px 16px 20px;background:#13233a}
    .hero-brand {font-size:clamp(2.55rem,11.5vw,4.25rem)}
    .hero-heading {font-size:clamp(1.42rem,5.3vw,1.82rem);margin:.34em 0}
    .hero-intro {font-size:.91rem;line-height:1.6}
    .hero-actions {gap:7px;margin-top:13px}
    .hero-actions .action {flex:auto;min-height:42px;padding:7px 10px;font-size:.84rem;gap:5px}
    .hero-actions .ui-icon {width:15px;height:15px}
    .directory {padding-block:23px}
    .section-head,.journal-heading {gap:7px;margin-bottom:12px;flex-wrap:wrap}
    .section-head h2,.journal-heading h2 {font-size:1.44rem}
    .topic-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
    .topic,.topic:nth-last-child(-n+2) {grid-column:auto}
    .topic:first-child {grid-column:1/-1}
    .topic .topic-photo,.topic:nth-last-child(-n+2) .topic-photo {aspect-ratio:1.35}
    .topic:first-child .topic-photo {aspect-ratio:2.72}
    .topic-caption h3 {font-size:1.13rem}
    .topic-caption p {font-size:.75rem}
    .topic-caption {left:10px;right:21px;bottom:8px}
    .topic-arrow {right:6px;bottom:8px;width:17px;height:17px}
    .topic-arrow .ui-icon {width:12px;height:12px}
    .lesson {padding:20px 16px;gap:15px;border-radius:12px}
    .roulette-demo {padding:5px 10px 10px}
    .placement {grid-template-columns:72px 1fr;padding:8px;gap:10px}
    .journal-list,.read-grid {column-gap:12px;row-gap:24px}
    .read-meta time {font-size:.75rem}
    .read-meta {gap:2px 6px}
    .read-body p {font-size:.88rem}
    .member-panel {padding:18px}
}
@media (max-width:365px) {
    .frame {width:calc(100% - 24px)}
    .mast .primary-action .ui-icon {display:none}
    .mast-actions {gap:6px}
    .hero-copy {padding-inline:12px}
    .hero-actions .action {font-size:.77rem;padding-inline:6px}
    .journal-list,.read-grid {grid-template-columns:1fr}
}
@media (prefers-reduced-motion: reduce) {
    *,*::before,*::after {scroll-behavior:auto!important;transition:none!important}
}