/*
Theme Name: LSM88lotto Salon
Version: 1.0.0
Author: lsm88lotto
Description: Thai editorial casino and snooker club.
Text Domain: lsm88lotto-salon
Requires at least: 6.3
Requires PHP: 7.4
License: GNU General Public License v2 or later
*/
:root {
    --wine:#35191f;
    --wine-dark:#231216;
    --felt:#173b31;
    --gold:#e6c68c;
    --paper:#f5f1e9;
    --ink:#2f2926;
    --muted:#5d5750;
    --line:#c9beb0;
    --body:"Fahkwang","Leelawadee UI","Noto Sans Thai",Tahoma,sans-serif;
    --display:"Cormorant Garamond","Baskerville","Times New Roman",Georgia,serif;
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:1rem/1.68 var(--body);overflow-wrap:break-word}
h1,h2,h3,p{margin:0} h1,h2,h3{line-height:1.34}
button,select{font:inherit}
a{color:inherit;text-decoration:none} button,select,label[for]{cursor:pointer}
img,svg,picture{display:block} img{max-width:100%} [hidden]{display:none!important}
:focus-visible{outline:3px solid #0077d6;outline-offset:3px}
.frame{width:min(90%,1430px);margin-inline:auto}
.skip{position:fixed;z-index:20;top:8px;left:8px;transform:translateY(-150%);padding:7px 14px;background:white;color:#231216}
.skip:focus{transform:none}
.ui-icon{width:17px;height:17px;flex:none}
.mast{background:var(--wine-dark);color:#f8f0e1;border-bottom:1px solid #715c49}
.mast-inner,.wordmark,.mast-actions,.main-menu ul{display:flex;align-items:center}
.mast-inner{min-height:72px;gap:clamp(19px,3vw,56px)}
.wordmark{gap:9px;width:fit-content;flex:none}
.wordmark img{width:36px;height:36px}
.wordmark>span{font:600 clamp(1.3rem,2vw,2rem)/1 var(--display);white-space:nowrap;letter-spacing:-.035em}
.wordmark b{font-weight:500;color:var(--gold)} .wordmark i{font-weight:400;font-style:normal}
.main-menu ul,.closing ul{padding:0;margin:0;list-style:none}
.main-menu ul{gap:clamp(14px,1.8vw,34px)}
.main-menu a,.desk-login{display:inline-flex;align-items:center;min-height:44px;font-size:.91rem;font-weight:600}
.main-menu a[aria-current],.main-menu a:hover,.desk-login:hover{color:var(--gold)}
.main-menu .drawer-login,.nav-toggle{display:none}
.mast-actions{margin-left:auto;gap:16px}
.action{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:9px 20px;min-height:44px;width:fit-content;border:1px solid transparent;border-radius:2px;font-size:.93rem;font-weight:700;line-height:1.5}
.action .ui-icon{width:15px;height:15px}
.primary-action,.ink-action{background:var(--gold);color:#302017}
.primary-action:hover,.ink-action:hover{background:#f5dbab}
.outline-action{border-color:#c4a980;color:#fff8e8;background:#24181899}
.outline-action:hover{background:#59323a}
.text-link,.member-help{display:inline-flex;align-items:center;gap:8px;min-height:42px;font-weight:650;font-size:.91rem}
.text-link:hover,.member-help:hover,.closing a:hover,.crumb a:hover,.read-body a:hover,.article-byline a:hover{text-decoration:underline;text-underline-offset:4px}
.cover{position:relative;isolation:isolate;overflow:hidden;background:#251a1a;color:white}
.cover-art,.cover::before,.cover::after{position:absolute;inset:0}
.cover-art{z-index:-3}
.cover-art img{width:100%;height:100%;object-fit:cover;object-position:50% 45%}
.cover::before{content:"";z-index:-2;background:linear-gradient(90deg,#211316f7 0%,#251519ef 23%,#251519bb 40%,#21131650 56%,transparent 76%)}
.cover::after{content:"";z-index:-1;inset:14px;border:1px solid #d8b98470;pointer-events:none}
.cover-inner{min-height:clamp(380px,32vw,530px);display:flex;align-items:center;padding-block:45px}
.cover-copy{width:min(51%,690px);padding-inline-start:clamp(2px,1.8vw,32px)}
.cover h1{font-size:clamp(2rem,3.3vw,4rem)}
.cover-brand{display:block;text-transform:uppercase;font:500 clamp(3.65rem,6.5vw,7rem)/.94 var(--display);letter-spacing:-.055em;color:#fff8e9;white-space:nowrap}
.cover-brand em{color:var(--gold);font-style:italic;font-weight:400}
.cover-caption{display:block;margin-top:9px;font-size:clamp(1.45rem,2.3vw,2.65rem);font-weight:600}
.cover-copy>p{color:#efe7da;font-size:clamp(.99rem,1.1vw,1.19rem);max-width:30em;margin-top:9px}
.cover-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:21px}
.member-help{color:#f0dec2;font-size:.82rem;font-weight:500}
.member-help .ui-icon{width:14px;height:14px}
.directory,.journal{padding-block:clamp(26px,3.3vw,55px)}
.rule-title,.journal-heading{display:flex;align-items:center;gap:17px;flex-wrap:wrap;margin-bottom:14px}
.rule-title::after{content:"";height:1px;flex:1;background:var(--line)}
.rule-title h2,.journal-heading h2,.table-intro h2{font-size:clamp(1.5rem,2.4vw,2.65rem);font-weight:650}
.lobby{display:grid;grid-template-columns:1.12fr 1fr 1fr;grid-template-rows:repeat(2,minmax(105px,1fr));gap:12px}
.room{display:grid;grid-template-columns:minmax(68px,42%) minmax(0,1fr);min-width:0;border:1px solid var(--line);background:#fdfaf4;overflow:hidden}
.room-photo{position:relative;overflow:hidden;min-height:0;background:#31241e}
.room-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .25s ease}
.room:hover .room-photo img{transform:scale(1.035)}
.room-copy{display:flex;justify-content:space-between;align-items:center;gap:7px;padding:10px clamp(9px,1.25vw,23px)}
.room-copy h3{font-size:clamp(1.17rem,1.6vw,1.75rem);font-weight:650}
.room-copy p{font-size:.85rem;line-height:1.47;color:var(--muted);margin-top:3px}
.room-copy>.ui-icon{width:14px;height:14px;color:#693b39}
.room-casino{position:relative;isolation:isolate;grid-row:1/3;display:flex;align-items:end;color:white;background:#311b18;border-color:#644c38}
.room-casino .room-photo{position:absolute;z-index:-2;inset:0}
.room-casino::after{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(0deg,#241511ed,transparent 78%)}
.room-casino .room-copy{width:100%;padding:16px 20px}
.room-casino h3{font-size:clamp(1.7rem,2.6vw,2.85rem)}
.room-casino p,.room-casino .ui-icon{color:#fff0da}
.baize{background:var(--felt);color:#fbf5e9;border-block:3px double #bfac84}
.table-grid{display:grid;grid-template-columns:minmax(0,.87fr) minmax(0,1.13fr);align-items:center;gap:clamp(22px,6vw,110px);padding-block:clamp(25px,3.6vw,66px)}
.table-intro p{max-width:42em;margin-top:7px;color:#e0e8df}
.table-intro a{color:#ffdf9d}
.score-select{margin:0;min-width:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;border:1px solid #a19777;padding:9px 16px 13px}
.score-select legend{padding-inline:8px;font-size:.93rem;font-weight:600;color:#f2dfb4}
.score-select input{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden}
.score-select label{display:flex;min-width:0;min-height:58px;padding:4px 2px;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:1px solid transparent;border-radius:2px;color:#f7f2e9;font-size:.82rem;font-weight:600;line-height:1.45}
.score-select input:checked+label{background:#f7ebce;color:#202b21;border-color:#ecd5a6}
.score-select input:focus-visible+label{outline:3px solid #8cc8ff}
.ball{display:block;width:21px;height:21px;border:1px solid #ffffff7a;border-radius:50%;box-shadow:inset -3px -4px 4px #0006;background-color:var(--ball);background-image:radial-gradient(circle at 31% 27%,#ffffff9e 0%,transparent 24%)}
.ball-yellow{--ball:#edcd52}.ball-green{--ball:#319b70}.ball-brown{--ball:#a76f45}.ball-blue{--ball:#4978bd}.ball-pink{--ball:#e5a0ad}.ball-black{--ball:#242526}
.outcome{display:none;grid-column:1/-1;padding-top:8px;margin-top:4px;border-top:1px solid #758b79}
.outcome strong{font-size:1.29rem;color:#f8e0ab}
.outcome span{align-self:center;color:#edf1e6;font-size:.85rem}
#colour-yellow:checked~.outcome-yellow,#colour-green:checked~.outcome-green,#colour-brown:checked~.outcome-brown,#colour-blue:checked~.outcome-blue,#colour-pink:checked~.outcome-pink,#colour-black:checked~.outcome-black{display:flex;gap:5px 12px;flex-wrap:wrap}
.journal-controls,.read-meta,.article-byline{display:flex;align-items:center;gap:8px}
.journal-heading .text-link{margin-left:auto;color:#5c2830}
.journal-controls{margin-left:auto;font-size:.86rem}
.journal-controls+.text-link{margin-left:0}
.journal-controls[hidden]+.text-link{margin-left:auto}
.journal-controls select{min-height:35px;padding:3px 8px;border:1px solid #ad9e8e;background:#fffefa;color:var(--ink)}
.journal-list,.read-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px 28px}
.read-card{display:grid;grid-template-columns:minmax(64px,32%) minmax(0,1fr);gap:14px;padding-top:13px;min-width:0;border-top:1px solid var(--line);align-items:start}
.read-cover{position:relative;aspect-ratio:1.42;overflow:hidden;background:#cabdab}
.read-cover img{width:100%;height:100%;object-fit:cover}
.read-meta,.article-byline{flex-wrap:wrap;color:var(--muted);font-size:.78rem}
.read-meta span{color:#6e2535;font-weight:700}
.read-body h3,.read-body h2{font-size:clamp(1.08rem,1.4vw,1.48rem);margin-top:1px}
.read-body p{color:var(--muted);font-size:.9rem;margin-top:4px}
.desk{display:grid;grid-template-columns:1.1fr 1fr;align-items:stretch;gap:clamp(18px,4vw,72px);padding-bottom:clamp(35px,4vw,82px)}
.feature-copy{align-self:start;border-top:2px solid #8b6d4e;padding-top:12px}
.feature-copy h2,.desk-links h2{font-size:clamp(1.25rem,1.65vw,1.8rem)}
.feature-copy p{margin-top:7px}
.feature-copy a,.prose a{color:#742c37;text-decoration:underline;text-underline-offset:3px}
.member-panel{display:grid;grid-template-columns:36% 1fr;background:var(--wine);color:#fff8eb}
.desk-photo{position:relative;min-height:145px}
.desk-photo img{position:absolute;width:100%;height:100%;object-fit:cover}
.desk-links{align-self:center;padding:15px 20px}
.desk-links a{min-height:39px;display:flex;gap:7px;align-items:center;justify-content:space-between;border-bottom:1px solid #917b65;color:#f9e5be;font-size:.91rem}
.inner-head{padding-block:clamp(24px,3.8vw,70px);background:var(--wine);color:#fff8ec;border-bottom:3px double #a88c67}
.inner-head h1{font-size:clamp(1.85rem,3.3vw,3.65rem);max-width:32em;overflow-wrap:anywhere}
.inner-head p{margin-top:10px;max-width:62em;color:#f1e4d7}
.crumb{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-bottom:12px;font-size:.82rem;color:#e5d2b7}
.article-byline{margin-bottom:7px;color:#f3d49c}
.reading{display:grid;grid-template-columns:minmax(0,1fr) minmax(150px,27%);align-items:start;gap:clamp(18px,3.8vw,65px);padding-block:clamp(25px,3.5vw,65px)}
.prose{min-width:0;padding:clamp(18px,2.5vw,42px);background:#fffdf8;border-block:1px solid var(--line);line-height:1.84;overflow-wrap:anywhere}
.prose h2,.prose h3{margin:1.1em 0 .46em}.prose h2{font-size:clamp(1.27rem,1.85vw,2rem)}.prose h3{font-size:1.15rem}
.prose p,.prose ol,.prose ul{margin:0 0 .88em}.prose ol,.prose ul{padding-inline-start:1.6em}
.prose>:first-child{margin-top:0}.prose>:last-child{margin-bottom:0}
.prose table{border-collapse:collapse;width:100%;margin:1em 0}.prose th,.prose td{border:1px solid var(--line);padding:7px 9px;vertical-align:top;text-align:start}.prose th{background:#eee7d8}.prose caption{text-align:start;font-weight:bold;padding-bottom:5px}
.outbound{background:#f5eadd;border-left:3px solid #926735;padding:15px;margin-bottom:1.2em}
.outbound p{font-size:.9rem;color:var(--muted);margin:7px 0 0}.prose a.action{color:#302017;text-decoration:none}
.reading-side{background:var(--felt);color:#f9f0db}
.reading-side img{width:100%;aspect-ratio:1.5;object-fit:cover;height:auto}
.reading-side .text-link{margin:5px 15px}
.post-links{display:grid;gap:8px;padding-top:12px;margin-top:20px;border-top:1px solid var(--line)}
.archive-body,.missing{padding-block:clamp(25px,3.3vw,60px) clamp(35px,4.5vw,82px)}
.archive-intro{margin-bottom:22px}.pagination,.missing .action{margin-top:19px}.nav-links{display:flex;gap:12px;flex-wrap:wrap}
.closing{background:var(--wine-dark);color:#f7eddb}
.closing-grid{display:grid;grid-template-columns:1.5fr .8fr 1fr;gap:clamp(20px,4vw,70px);padding-block:clamp(26px,3.7vw,66px)}
.closing-brand p{margin-top:12px;max-width:26em;color:#d8cdc0;font-size:.9rem}
.closing h2{color:var(--gold);font-size:1rem;margin-bottom:6px}.closing li a{display:inline-block;font-size:.91rem;padding-block:4px}
.colophon{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;border-top:1px solid #726050;color:#d8c9b9;padding-block:12px;font-size:.78rem}
@media(max-width:1100px){
    .frame{width:93%}.mast-inner{gap:22px}.mast-actions{gap:12px}
    .lobby{grid-template-columns:1.12fr 1fr 1fr;gap:8px}.room{grid-template-columns:37% minmax(0,1fr)}
    .room-copy{padding-inline:9px}.room-copy>.ui-icon{display:none}
}
@media(max-width:860px){
    .mast-inner{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 10px;min-height:59px}
    .mast-inner>.wordmark{grid-area:1/1;justify-self:start}.mast-actions{grid-area:1/2;gap:6px}
    .main-menu{grid-area:2/1/3/-1}.main-menu ul{flex-wrap:wrap;gap:0 16px}.main-menu .drawer-login{display:inline-flex;gap:5px}
    .desk-login,.nav-ready .main-menu{display:none}.nav-ready .menu-open .main-menu{display:block;border-top:1px solid #856c54}
    .nav-ready .nav-toggle{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:39px;height:39px;border:1px solid #a48b6b;border-radius:2px;color:white;background:transparent}
    .nav-toggle span{width:16px;height:2px;background:currentColor}
    .cover-copy{width:56%}.room{grid-template-columns:minmax(0,1fr)}.room:not(.room-casino) .room-photo{aspect-ratio:2.6}
    .lobby{grid-template-rows:auto auto}
    .read-card{grid-template-columns:27% minmax(0,1fr);gap:9px}
    .table-grid{gap:20px;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
    .score-select{padding-inline:9px;gap:3px}
}
@media(max-width:680px){
    .frame{width:calc(100% - 32px)}.mast-inner{min-height:57px}
    .wordmark{gap:6px}.wordmark img{width:29px;height:29px}.wordmark>span{font-size:1.27rem}
    .mast-actions .action{min-height:38px;padding:6px 10px;font-size:.81rem}
    .cover-art img{object-position:50% 32%}
    .cover::before{background:linear-gradient(0deg,#241418fc 0%,#241418ee 24%,#211518b5 48%,#21151827 74%,transparent)}
    .cover::after{inset:7px;border-color:#dfc09467}
    .cover-inner{min-height:clamp(385px,100vw,520px);padding:clamp(120px,34vw,200px) 6px 13px;align-items:end}
    .cover-copy{width:100%;padding:0}.cover-brand{font-size:clamp(2.75rem,11.9vw,5.12rem)}
    .cover-caption{font-size:clamp(1.28rem,5.35vw,2.05rem);margin-top:5px}
    .cover-copy>p{font-size:.93rem;line-height:1.55;margin-top:6px}
    .cover-actions{margin-top:11px;gap:6px}.cover-actions .action{font-size:.82rem;min-height:39px;padding:6px 11px}
    .member-help{font-size:.76rem;min-height:33px}
    .rule-title,.journal-heading{margin-bottom:9px}.directory,.journal{padding-block:22px}
    .lobby{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
    .room-casino{min-height:112px;grid-row:auto;grid-column:1/-1}.room-casino .room-copy{padding:11px 13px}
    .room-casino .room-photo img{object-position:50% 48%}
    .room:not(.room-casino) .room-photo{aspect-ratio:2.45}
    .room-copy{padding:7px 9px}.room-copy h3{font-size:1.15rem}.room-copy p{font-size:.79rem;line-height:1.46}
    .room-casino h3{font-size:1.65rem}
    .table-grid,.desk,.reading{grid-template-columns:minmax(0,1fr);gap:14px}
    .table-intro p{font-size:.94rem}.journal-heading{gap:6px 10px}
    .journal-controls{order:3;margin:0;width:100%}.journal-controls+.text-link{margin-left:auto}
    .journal-list,.read-grid{grid-template-columns:minmax(0,1fr);gap:10px}
    .read-card{grid-template-columns:minmax(64px,29%) minmax(0,1fr);gap:10px;padding-top:10px}
    .read-body p{font-size:.85rem}.read-meta{font-size:.74rem}.read-cover{aspect-ratio:1.12}
    .desk-links{padding:13px}.desk-photo{min-height:131px}
    .prose{padding:15px;font-size:.97rem}.prose th,.prose td{padding:5px;font-size:.85rem}
    .reading-side{display:grid;grid-template-columns:34% minmax(0,1fr);align-items:center}
    .closing-grid{grid-template-columns:1fr 1fr;gap:16px}.closing-brand{grid-column:1/-1}
}
@media(max-width:365px){
    .frame{width:calc(100% - 22px)}.cover-actions .ui-icon,.mast-actions .ui-icon{display:none}
    .cover-actions .action{padding-inline:8px}.score-select{gap:1px;padding-inline:6px}.score-select label{font-size:.75rem}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;scroll-behavior:auto!important}}
