@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@400;500;600;700&display=swap');
:root{--bg:#101715;--panel:#19221f;--line:#2c3730;--gold:#d7b97b;--muted:#8e9e94}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:#eef1e9;font:14px 'Noto Sans Thai',sans-serif}button,input,select{font:inherit}button{cursor:pointer;color:inherit;background:#243129;border:1px solid #3b493f;border-radius:8px;padding:10px 18px}button:hover{border-color:var(--gold);filter:brightness(1.12)}button:disabled{opacity:.35;cursor:default}aside{width:228px;position:fixed;inset:0 auto 0 0;border-right:1px solid var(--line);padding:35px 22px;background:#141c18}.brand{display:flex;gap:12px;align-items:center;color:var(--gold);text-decoration:none;font-size:34px;font-weight:700}.brand span{font-size:24px}.brand small{display:block;font-size:8px;letter-spacing:1px;color:#9aa99b}.navtitle{font-size:11px;color:#6e8073;margin:50px 14px 16px}.nav{display:block;width:100%;text-align:left;margin:8px 0;background:none;border-color:transparent;color:#a7b5aa;padding:14px}.nav.active{background:#2c392c;color:#e4c58c;border:1px solid #4c5336}.sidebottom{position:absolute;bottom:28px;color:#65776b;font-size:11px;line-height:1.9}.online{color:#a3bc9e}.sidebottom small{font-size:9px}main{margin-left:228px}header{height:88px;border-bottom:1px solid var(--line);padding:0 42px;display:flex;align-items:center;justify-content:space-between;color:var(--muted)}header>div{display:flex;gap:12px}header button{background:none}.balance{color:var(--gold)}.balance b{margin:0 8px}.balance small{color:#8e9e94}#content{padding:32px 42px;min-height:calc(100vh - 150px)}.hero{border:1px solid #42523b;border-radius:16px;min-height:245px;background:radial-gradient(ellipse at 83% 80%,#34573e 0,transparent 55%),linear-gradient(120deg,#25392c,#18271f);padding:32px 36px;position:relative;overflow:hidden}.eyebrow{font-size:11px;color:var(--gold);letter-spacing:3px}h1{font-size:36px;line-height:1.4;font-weight:600;margin:16px 0 10px}p{color:#a4b3a8;line-height:1.8}.gold{color:#1c251d;background:var(--gold);border-color:var(--gold);font-weight:600}.hero p{max-width:480px}.heroart{position:absolute;right:70px;top:40px;transform:rotate(12deg)}.heroart .card{width:100px;height:143px;font-size:27px;box-shadow:0 10px 28px #0005}.heroart .card:first-child{transform:rotate(-24deg) translate(14px,14px)}.heroart .card:last-child{transform:rotate(13deg) translate(-14px,10px)}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin:23px 0 32px}.stat{border:1px solid var(--line);background:#18211c;border-radius:10px;padding:18px 22px;display:flex;align-items:center;gap:15px}.stat i{font-size:25px;color:var(--gold);font-style:normal}.stat b{display:block;font-size:20px;font-weight:500}.stat small{color:var(--muted)}.sectiontitle{display:flex;align-items:center;justify-content:space-between;margin:14px 0 20px}h2{font-size:22px;font-weight:500;margin:0}.sectiontitle small{color:var(--muted)}.filters{display:flex;gap:8px;margin-bottom:22px}.filters button{font-size:12px;background:transparent}.filters .selected{background:#d7b97b;color:#20291f}.rooms{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.room{border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:22px}.roomhead{display:flex;justify-content:space-between;align-items:center}.tag{font-size:10px;border:1px solid #3c5844;background:#203d2c;color:#a6c2a4;border-radius:20px;padding:4px 10px}.room h3{font-size:18px;font-weight:500;margin:16px 0 5px}.sub{color:#788e7f;font-size:11px}.rate{margin:24px 0;color:var(--gold);font-size:26px}.rate small{font-size:12px;color:#90a092}.avatars{display:flex;gap:5px;margin:12px 0 21px}.avatar{width:32px;height:32px;display:inline-grid;place-items:center;border:1px solid #485542;border-radius:50%;background:#344439;color:#d8c896}.empty{border-style:dashed;background:none;color:#5e7363}.roomfoot{border-top:1px solid var(--line);padding-top:17px;display:flex;justify-content:space-between;align-items:center}.roomfoot span{font-size:11px;color:#92a295}.roomfoot button{padding:8px 18px;font-size:12px}.tip{margin-top:25px;border:1px solid var(--line);border-radius:10px;padding:17px 20px;color:#9da99e;font-size:12px}.tip b{color:var(--gold);margin-right:12px}footer{padding:20px 42px;border-top:1px solid var(--line);font-size:10px;color:#6e8073;display:flex;justify-content:space-between}dialog{background:#19251e;color:#edf0e8;border:1px solid #556346;border-radius:15px;padding:32px;width:min(480px,90vw)}dialog::backdrop{background:#000a;backdrop-filter:blur(4px)}.close{float:right;background:none;border:0;padding:0 4px;font-size:24px}dialog h2{margin:0 0 22px}label{display:block;color:#acbcae;margin:16px 0 6px}input,select{width:100%;background:#101b14;color:#fff;border:1px solid #415344;border-radius:7px;padding:12px}form>.gold{width:100%;margin-top:24px}.error{color:#f2ac91}.ledger{max-height:180px;overflow:auto;font-size:12px}.ledger div{padding:12px 0;border-bottom:1px solid #334237}.table{margin:25px auto;max-width:850px;min-height:340px;border-radius:160px;border:12px solid #3b4734;outline:1px solid #6c6944;background:radial-gradient(ellipse,#28583e,#163c2b);box-shadow:inset 0 0 50px #0007;display:flex;flex-direction:column;align-items:center;justify-content:space-around;padding:25px}.players{display:flex;gap:24px;justify-content:center;flex-wrap:wrap}.player{text-align:center;color:#b4c8b7;padding:12px;border-radius:10px;border:1px solid transparent}.player.turn{border-color:#d7b97b;background:#d7b97b10}.tablecards{min-height:110px;display:flex;align-items:center}.card{display:inline-flex;flex-direction:column;align-items:center;justify-content:space-between;width:62px;height:90px;margin:0 3px;padding:7px;background:#f3efdf;color:#182b22;border-radius:6px;border:1px solid #d9d4bf;font:bold 19px Georgia;box-shadow:0 3px 4px #0004}.card.red{color:#b83f40}.card.selected{transform:translateY(-18px);outline:3px solid var(--gold)}.hand{display:flex;justify-content:center;margin:40px 0 20px;flex-wrap:wrap;gap:5px}.actions{text-align:center;display:flex;gap:10px;justify-content:center}.center{text-align:center}.timer{color:var(--gold);font-size:20px}.log{font-size:12px;color:#a9b8ac;margin:20px auto;max-width:850px;line-height:1.8}#toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);background:#e2c28b;color:#17241a;padding:13px 24px;border-radius:8px;display:none;z-index:20}@media(max-width:1100px){.rooms{grid-template-columns:repeat(2,1fr)}.heroart{right:20px;opacity:.5}.hero p{max-width:350px}}@media(max-width:760px){aside{position:relative;width:100%;padding:15px;display:flex;align-items:center;gap:5px;border-bottom:1px solid var(--line)}.brand{margin-right:auto}.brand span{font-size:18px}.brand small,.navtitle,.sidebottom{display:none}.nav{width:auto;font-size:0;padding:10px}.nav:first-letter{font-size:20px}main{margin:0}header{height:72px;padding:12px 18px}header>span{display:none}header>div{width:100%;justify-content:space-between}#content{padding:20px 16px}.hero{padding:25px;min-height:240px}h1{font-size:29px}.heroart{display:none}.stats{gap:7px}.stat{padding:12px 8px;gap:7px}.stat b{font-size:16px}.stat small{font-size:9px}.stat i{display:none}.rooms{grid-template-columns:1fr}.sectiontitle{gap:10px}.sectiontitle h2{font-size:20px}.sectiontitle small{display:none}footer{padding:20px 16px}footer span{max-width:60%;text-align:right}.card{width:47px;height:72px;font-size:16px}.players{gap:2px}.player{font-size:11px;padding:7px}.table{border-width:7px;border-radius:70px;min-height:320px;padding:18px 5px}.filters{flex-wrap:wrap}}
.result-summary{margin:30px auto;max-width:1100px;padding:24px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}.result-summary>p{font-size:12px}.summary-scroll{overflow-x:auto}.summary-table{width:100%;border-collapse:collapse;min-width:660px;text-align:left}.summary-table caption{text-align:left;color:var(--muted);font-size:12px;margin-bottom:14px}.summary-table th,.summary-table td{padding:15px 12px;border-bottom:1px solid var(--line);vertical-align:top}.summary-table thead{color:var(--gold);font-size:12px}.summary-table tbody th{min-width:120px;font-weight:500}.summary-table small{display:block;color:var(--muted);font-size:11px;margin-bottom:7px}.summary-groups{display:flex;gap:6px;flex-wrap:wrap;margin:6px 0}.summary-group{display:inline-flex;gap:3px;padding:4px;border:1px solid #526047;border-radius:6px;background:#101b14}.summary-card{display:inline-block;border-radius:4px;background:#f3efdf;color:#182b22;padding:4px 6px;font:bold 16px Georgia;white-space:nowrap}.summary-card.red{color:#b83f40}.winner-row{background:#d7b97b0a}.net{color:#e2a799;white-space:nowrap}.net.positive{color:var(--gold)}@media(max-width:760px){.result-summary{padding:16px 10px}.result-summary h2{font-size:19px}}
.hand [data-hand-card]{touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab;position:relative}.hand [data-hand-card]:active{cursor:grabbing}.hand-drag-source{opacity:.25}.hand-drag-ghost{position:fixed!important;z-index:1000;pointer-events:none;margin:0!important;transform:translate(-50%,-65%) rotate(5deg)!important;box-shadow:0 12px 28px #0009!important;opacity:.95}.hand-drop-before::before,.hand-drop-after::after{content:"";position:absolute;top:-8px;bottom:-8px;width:4px;background:var(--gold);border-radius:4px;box-shadow:0 0 10px #d7b97b80}.hand-drop-before::before{left:-7px}.hand-drop-after::after{right:-7px}
.special-banner,.special-offer{border:1px solid #655d3d;border-radius:12px;padding:24px;background:linear-gradient(120deg,#283725,#19261e);margin:22px auto;max-width:950px;text-align:center}.special-banner p,.special-offer p{font-size:13px}.special-offer .summary-groups{justify-content:center;margin:20px 0}.special-rules{padding-left:25px;line-height:1.85}.special-rules li{margin-bottom:14px;color:#aebdaf}.special-rules b{color:#e0c58e}.previous-special{margin:24px 0;border:1px solid var(--line);border-radius:9px;padding:16px}.previous-special>summary{cursor:pointer;color:var(--gold)}.special-result{border-color:#655d3d}.special-offer .actions{flex-wrap:wrap}
.seat-table{position:relative;min-height:470px;max-width:1000px;margin:24px auto 35px;isolation:isolate}.seat-felt{position:absolute;inset:55px 65px 60px;border:12px solid #505039;border-radius:48%;background:radial-gradient(ellipse,#2c6344,#173d2b);box-shadow:inset 0 0 65px #0006,0 8px 25px #0004;z-index:-1}.seat-center{position:absolute;inset:24% 20% 23%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;text-align:center}.seat-center h2{font-size:21px}.seat-center p{font-size:12px;margin:5px 0}.table-seat{position:absolute;transform:translate(-50%,-50%);width:142px;min-height:105px;padding:9px 8px;background:#1b2a20;border:1px solid #53604a;display:flex;flex-direction:column;align-items:center;gap:3px;box-shadow:0 4px 13px #0005;z-index:2}.table-seat:disabled{opacity:1;cursor:default}.table-seat b{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500;font-size:12px}.seat-number{color:#8a9f8c;font-size:9px}.seat-avatar{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#334a37;color:var(--gold);font-size:13px}.seat-count{color:#aabdac;font-size:10px}.my-seat{border:2px solid var(--gold);background:#34432b}.current-seat{box-shadow:0 0 0 3px #d7b97b44,0 0 24px #d7b97b33}.vacant-seat{border-style:dashed;background:#17251bd9}.seat-pos-0{left:50%;top:88%}.seat-pos-1{left:9%;top:52%}.seat-pos-2{left:28%;top:11%}.seat-pos-3{left:72%;top:11%}.seat-pos-4{left:91%;top:52%}.seat-center .tablecards{min-height:55px;max-height:115px;overflow:auto;justify-content:center;flex-wrap:wrap}.seat-center .tablecards .card{width:39px;height:57px;font-size:14px;padding:4px;margin:2px}.deal-deck,.flying-deal-card{display:grid;place-items:center;width:49px;height:70px;background:repeating-linear-gradient(45deg,#244b37 0 4px,#315b40 4px 8px);color:#dcc38a;border:3px solid #d8c99f;border-radius:5px;font:bold 27px Georgia;box-shadow:0 3px 0 #b5b094,0 6px 0 #25442d}.flying-deal-card{position:fixed;z-index:500;pointer-events:none;width:35px;height:50px;font-size:18px;animation:deal-flight .24s ease-out forwards}.seat-mini-hand{display:flex;height:14px}.seat-mini-hand i{display:block;width:10px;height:14px;border:1px solid #dfd0ab;border-radius:2px;background:#356042;margin-left:-3px}.dealt-my-hand .card{animation:deal-reveal .2s ease-out}.dealt-my-hand{min-height:90px;margin-top:26px}@keyframes deal-flight{from{transform:translate(-50%,-50%) rotate(-10deg);opacity:1}to{transform:translate(calc(-50% + var(--deal-x)),calc(-50% + var(--deal-y))) rotate(14deg) scale(.65);opacity:.4}}@keyframes deal-reveal{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion:reduce){.flying-deal-card{display:none}.dealt-my-hand .card{animation:none}}@media(max-width:760px){.seat-table{min-height:395px;margin:25px auto}.seat-felt{inset:55px 26px 58px;border-width:8px}.table-seat{width:95px;min-height:92px;padding:6px 3px}.table-seat b{font-size:10px}.seat-number{font-size:8px}.seat-count{font-size:8px}.seat-avatar{height:24px;width:24px;font-size:10px}.seat-pos-1{left:10%}.seat-pos-4{left:90%}.seat-pos-2{left:26%}.seat-pos-3{left:74%}.seat-center{inset:29% 21% 24%}.seat-center h2{font-size:16px}.seat-center p{font-size:10px}.seat-center>.gold{font-size:11px;padding:8px 10px}.seat-center .timer{font-size:13px}.seat-center .eyebrow{font-size:8px}.seat-center>.sub{font-size:9px}.seat-center .card{width:37px;height:53px;font-size:14px}.seat-center .tablecards .card{width:28px;height:42px;font-size:12px;margin:1px}.seat-center .tablecards{max-height:94px}.deal-deck{width:40px;height:58px}}

/* Reserve all nine hand positions so receiving one card cannot shift earlier cards. */
.hand.dealt-my-hand{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));justify-content:start;align-content:start;width:min(100%,700px);gap:6px;margin:22px auto 16px;min-height:90px}.hand.dealt-my-hand>.card{width:100%;min-width:0;margin:0!important;animation:none!important;opacity:1;transform:none;transition:none!important;backface-visibility:hidden}.flying-deal-card{animation:deal-flight-steady .30s linear forwards;will-change:transform;backface-visibility:hidden;contain:layout paint}@keyframes deal-flight-steady{from{transform:translate3d(-50%,-50%,0) rotate(-6deg);opacity:1}to{transform:translate3d(calc(-50% + var(--deal-x)),calc(-50% + var(--deal-y)),0) rotate(6deg) scale(.72);opacity:1}}@media(max-width:760px){.hand.dealt-my-hand{width:calc(100% - 8px);gap:3px;min-height:58px;margin:18px auto 10px}.hand.dealt-my-hand>.card{height:52px;font-size:13px;padding:5px 3px}}@media(prefers-reduced-motion:reduce){.flying-deal-card{animation:none;display:none}}