:root {
  color-scheme: dark;
  font-family: "Trebuchet MS", Arial, sans-serif;
  --gold: #ffd73d;
  --red: #c60000;
  --dark-red: #4a0000;
}

* { box-sizing: border-box; }
html, body, #app, #admin { width: 100%; min-height: 100%; margin: 0; }
body { background: #190000; color: white; overflow-x: hidden; }
button, input { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; filter: grayscale(.8); opacity: .65; }

.stage { min-height: 100vh; position: relative; padding-bottom: 30px; }
.topbar {
  height: 48px; display: flex; align-items: center; gap: 10px; padding: 4px 12px;
  background: #050505; border-bottom: 2px solid #6f3900; position: sticky; top: 0; z-index: 50;
}
.brand { color: #ffd438; font-weight: 1000; letter-spacing: .04em; }
.spacer { flex: 1; }
.nav-button, .window-button {
  min-height: 34px; padding: 5px 14px; color: white; border: 1px solid #a46818; border-radius: 5px;
  background: linear-gradient(#fc332a, #7d0000); font-weight: 900; text-decoration: none;
}
.nav-button:first-of-type { background: linear-gradient(#3a3a3a, #060606); }
.active-tab { background: linear-gradient(#ff3525, #ad0000) !important; }
.window-button { color: #341400; background: linear-gradient(#ffe487, #b46a00); font-size: 1.25rem; padding: 0 10px; }
.check { color: #ff8b19; font-size: 1.15rem; font-weight: 900; display: flex; align-items: center; gap: 4px; }
.check input { width: 30px; height: 30px; accent-color: #0877dc; }
.welcome, .balance-label {
  height: 34px; min-width: 180px; display: flex; align-items: center; justify-content: space-between;
  padding: 0 12px; border: 2px solid #b88729; border-radius: 8px; background: #17120d;
}
.balance-label { min-width: 180px; border-radius: 4px; background: linear-gradient(90deg, #21160e 50%, #f8d06b 50%); }
.balance-label b { color: #261100; min-width: 70px; text-align: center; }
.footer-note {
  position: fixed; z-index: 60; bottom: 0; left: 0; right: 0; padding: 6px; text-align: center;
  background: #180000ed; border-top: 1px solid #b67917; color: #ffc965; font-size: .74rem;
}

/* Login */
.login-stage {
  background: radial-gradient(circle at 45% 48%, #d00 0, #920000 38%, #3b0000 100%);
  isolation: isolate;
}
.login-stage::before {
  content: ""; position: fixed; inset: 0; z-index: -1; opacity: .22;
  background: repeating-conic-gradient(from -6deg at 50% 45%, #ff4435 0 7deg, transparent 7deg 14deg);
}
.login-screen { min-height: calc(100vh - 30px); display: grid; grid-template-columns: minmax(420px, 620px) minmax(350px, 470px); place-content: center; gap: 60px; padding: 35px; }
.login-logo { color: #ffe75e; font-size: clamp(2rem, 4vw, 3.6rem); font-weight: 1000; text-align: center; text-shadow: 0 4px #7f1200, 0 0 18px #ff6a00; }
.login-card, .free-panel {
  padding: 34px 42px; border: 4px solid #ffdc58; border-radius: 12px;
  background: linear-gradient(#a60404, #4d0000); box-shadow: 0 0 0 4px #6b2100, 0 15px 34px #25000099;
}
.login-card label { display: block; margin: 12px 0 5px; }
.login-card input { width: 100%; padding: 11px; color: white; background: #240000; border: 2px solid #640000; border-radius: 4px; }
.primary, .bet-button {
  width: 100%; margin-top: 18px; padding: 11px; color: white; font-weight: 1000;
  border: 2px solid #ffec8e; border-radius: 5px; background: linear-gradient(#ff5b2d, #a50000);
}
.text-button { margin-top: 12px; color: #ffe271; border: 0; background: transparent; }
.login-card details { margin-top: 18px; padding-top: 10px; border-top: 1px solid #a75222; }
.free-panel { background: #210000e8; }
.free-panel h2 { margin: 0; color: #43ff29; font-size: 2.3rem; }
.free-panel li { margin: 22px 0; font-size: 1.15rem; }
.free-panel strong { color: #dfff25; }

/* Lobby */
.lobby-stage { background: radial-gradient(circle at 50% 38%, #c80000, #780000 56%, #300000); isolation: isolate; }
.lobby-stage::before { content:""; position:fixed; inset:48px 0 0; z-index:-2; opacity:.35; background:repeating-conic-gradient(from -4deg at 50% 45%,#ee2b22 0 6deg,transparent 6deg 12deg); }
.lobby-stage::after { content:""; position:fixed; left:50%; bottom:0; width:min(90vw,1100px); height:270px; transform:translateX(-50%); z-index:-1; background:url('assets/lobby/curtain.png') center bottom/cover no-repeat; opacity:.25; }
.lobby-screen { min-height: calc(100vh - 78px); display: grid; place-items: center; padding: 50px 8vw 100px; }
.lobby-cabinet {
  width: min(100%, 1050px); min-height: 470px; position: relative; padding: 90px 70px 75px;
  background: linear-gradient(#a90707, #480000); border: 6px solid #ffe354; border-radius: 24px;
  box-shadow: 0 0 0 5px #6b1600, inset 0 20px 50px #ff2c1d44, 0 22px 45px #200000a8;
}
.lobby-cabinet::before { content:""; position:absolute; width:34%; height:85px; left:33%; top:-70px; background:#8c0808; border:6px solid #ffe354; border-bottom:0; border-radius:25px 25px 0 0; }
.lobby-games { display: grid; grid-template-columns: repeat(4, 1fr); gap: 26px; }
.lobby-game { position:relative; padding:0; color:white; overflow:hidden; border:3px solid #ffc935; border-radius:9px; background:#420000; box-shadow:0 8px 18px #2a000099; }
.lobby-game:hover { transform: translateY(-5px); filter: brightness(1.12); }
.lobby-thumb { display:block; height:180px; background-position:center; background-repeat:no-repeat; background-size:84%; background-color:#ff9a1a; background-image:var(--thumb); }
.lobby-game strong { display:block; padding:12px 4px; background:#f11212; font-size:1.25rem; text-shadow:0 2px #6c0000; }
.lobby-game small { position:absolute; inset:0; display:grid; place-items:center; background:#120000aa; color:#ffcc48; font-size:1.3rem; }
.games-plaque { position:absolute; left:50%; bottom:-54px; transform:translateX(-50%); padding:18px 75px; color:#421a00; font:900 2.1rem Georgia; background:linear-gradient(#ffed73,#d98900); border-radius:38px 38px 8px 8px; box-shadow:0 5px #8e3e00; }

/* Shared game pieces */
.chip-bar { display:flex; justify-content:center; align-items:center; gap:16px; padding:12px; }
.asset-chip { width:82px; height:82px; position:relative; padding:0; border:0; border-radius:50%; background:transparent; transition:.16s; }
.asset-chip img { width:100%; height:100%; object-fit:contain; }
.asset-chip b { position:absolute; inset:0; display:grid; place-items:center; color:#111; font-size:1.05rem; text-shadow:0 1px white; }
.asset-chip.selected { transform:scale(1.15); filter:drop-shadow(0 0 14px #39ff74); }
.asset-chip.selected img { animation:selectedChipSpin 3.6s linear infinite; }
@keyframes selectedChipSpin { to{transform:rotate(360deg)} }
.message-panel { padding:14px; min-height:52px; display:grid; place-items:center; color:white; font-size:1.15rem; font-weight:900; text-align:center; background:#2b1715; border:4px solid #e49e20; border-radius:10px; }
.result-strip { display:flex; align-items:center; gap:6px; min-height:44px; }
.history-result { min-width:42px; height:38px; display:grid; place-items:center; color:white; font-weight:900; background:linear-gradient(#ff3a26,#8c0000); border:2px solid #ffe578; border-radius:5px; }
.muted { opacity:.7; }
.selected { filter:brightness(1.2); box-shadow:0 0 16px #55ff78 !important; }

/* Spin 2 Win */
.spin-stage { background:#8b3d00 url('assets/spin/background.jpg') center/cover fixed no-repeat; }
.spin-screen { min-height:calc(100vh - 78px); display:grid; grid-template-columns:43% 57%; grid-template-rows:58px 1fr; overflow:hidden; }
.spin-history { grid-column:1/-1; display:flex; align-items:center; justify-content:center; gap:16px; padding:5px 20px; color:#421400; background:linear-gradient(#ffe900,#f19700); border-bottom:3px solid #8d4500; }
.spin-history > b { font-size:1.3rem; }
.spin-left { display:flex; flex-direction:column; align-items:center; justify-content:center; padding:10px 12px 70px; }
.asset-wheel { width:min(41vw,610px); aspect-ratio:1; position:relative; }
.asset-wheel img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; }
.wheel-face { padding:3.6%; transition:transform 1.1s cubic-bezier(.12,.6,.15,1); }
.wheel-frame { z-index:2; }
.asset-wheel.spinning .wheel-face { transform:rotate(1080deg); }
.wheel-pointer { position:absolute; z-index:5; left:50%; top:0; transform:translate(-50%,-8%); width:48px; height:65px; display:grid; place-items:center; color:#ff3b48; font-size:2rem; clip-path:polygon(50% 100%,0 28%,18% 0,82% 0,100% 28%); background:#ab1738; }
.wheel-result { position:absolute; z-index:4; left:50%; top:50%; transform:translate(-50%,-50%); width:31%; aspect-ratio:1; border-radius:50%; display:grid; place-items:center; color:white; background:radial-gradient(circle,#f53a48,#490000 68%); border:10px solid #4a4a4a; font-size:4rem; font-weight:1000; text-shadow:0 3px #4a0000; }
.wheel-result small { position:absolute; bottom:12%; color:#ffe86b; font-size:1rem; }
.play-win { width:86%; margin-top:-12px; display:flex; justify-content:space-around; padding:12px; background:#572600; border:4px solid #b76b00; font-size:1.25rem; }
.play-win span { display:flex; gap:12px; }
.spin-right { display:grid; align-content:center; gap:10px; padding:18px 30px 70px 8px; }
.number-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:14px 22px; }
.number-bet { min-height:104px; display:grid; grid-template-rows:1fr 42%; padding:0; color:white; border:4px solid #df9c1b; border-radius:11px; overflow:hidden; background:linear-gradient(#c80000 62%,#fff 62%); box-shadow:0 5px 12px #65300066; }
.number-bet:nth-child(5n+1){background:linear-gradient(#b2a300 62%,#fff 62%)}.number-bet:nth-child(5n+2){background:linear-gradient(#19a537 62%,#fff 62%)}.number-bet:nth-child(5n+3){background:linear-gradient(#f50075 62%,#fff 62%)}.number-bet:nth-child(5n+4){background:linear-gradient(#6242a4 62%,#fff 62%)}
.number-bet b { font-size:2rem; align-self:center; }.number-bet span { color:#211000; align-self:center; font-weight:900; }
.game-controls { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.control-button, .lucky-actions button { padding:12px; color:white; font-weight:1000; font-size:1.15rem; border:3px solid #ffe359; border-radius:7px; background:linear-gradient(#f11b12,#9e0000); }
.timer-panel { display:grid; grid-template-columns:1fr 180px; align-items:center; gap:15px; padding:13px; border:4px solid #d08b00; border-radius:12px; background:linear-gradient(90deg,#ffd900,#ffa800); color:#3e1600; font-weight:900; }
.timer-panel .bet-button { margin:0; }
.timer-panel > div:first-child { display:grid; gap:4px; }
.timer-panel small { display:block; }
.digital-timer { min-height:82px; display:grid; place-items:center; color:white; background:#be0000; border:5px solid #300; border-radius:12px; }
.digital-timer b { font-size:2.7rem; line-height:1; }.digital-timer span { font-size:.68rem; }
.control-button small { display:block; min-height:1em; color:#ffe261; }

/* Lucky Card */
.lucky-stage { background:#ffca60 url('assets/lucky/bg.png') center/cover fixed no-repeat; }
.lucky-screen { height:calc(100vh - 78px); min-height:570px; display:grid; grid-template-columns:65% 35%; grid-template-rows:minmax(0,1fr) 140px; gap:8px; padding:12px; }
.lucky-board { min-height:0; position:relative; padding:76px 18px 10px 170px; overflow:hidden; border:6px dotted #ffec28; border-radius:10px; background:#fff4d3b8; }
.limit-box { position:absolute; left:12px; top:12px; width:145px; height:94px; padding:7px 6px 5px; color:#2a0d00; background:linear-gradient(#fff38e,#f0a900); border:2px solid #9b4a00; text-align:center; line-height:1.18; overflow:hidden; }
.limit-box b { display:inline-block; margin:2px 4px; }
.suit-heads { position:absolute; top:8px; left:175px; right:20px; display:grid; grid-template-columns:repeat(4,1fr); gap:13px; }
.group-bet { min-height:64px; display:flex; align-items:center; justify-content:center; gap:7px; color:#1b1000; border:3px solid #d79600; border-radius:8px; background:linear-gradient(#fff7ad,#f4a700); }
.group-bet i { font-style:normal; font-size:2.4rem; }.group-bet b { font-size:.8rem; }.group-bet span { padding:8px; border-radius:50%; background:#fff4bd; }
.rank-heads { position:absolute; left:15px; top:112px; bottom:15px; width:140px; display:grid; grid-template-rows:repeat(4,1fr); gap:10px; }
.rank-bet { display:grid; grid-template-columns:1fr auto; align-items:center; color:#171000; border:3px solid #d99600; border-radius:8px; background:linear-gradient(#fff5a7,#ffb308); }
.rank-bet small { grid-column:1/-1; font-weight:900; }.rank-bet b { font:900 2.8rem Georgia; }.rank-bet span { padding:9px; border-radius:50%; background:#fff5bd; }
.cards-grid { min-height:0; height:100%; display:grid; grid-template-columns:repeat(4,1fr); grid-template-rows:repeat(4,minmax(0,1fr)); gap:5px 14px; }
.lucky-card { min-height:0; position:relative; display:grid; place-items:center; padding:0 0 22px; border:0; background:transparent; }
.lucky-card img, .css-card { width:54px; height:74px; max-height:calc(100% - 20px); object-fit:contain; background:white; border:1px solid #8b8b8b; border-radius:5px; }
.css-card { display:flex; flex-direction:column; align-items:center; justify-content:center; color:#111; font-size:1.8rem; font-style:normal; }.css-card i{font-style:normal}.css-card.red{color:#e1182a}
.lucky-card strong { position:absolute; bottom:0; min-width:82px; padding:7px; color:#111; border:2px solid #e71a4f; border-radius:5px; background:white; }
.lucky-card small { position:absolute; right:4px; top:4px; min-width:30px; color:white; background:#df102b; border-radius:12px; }
.lucky-wheel-side { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; }
.lucky-wheel { width:min(28vw,350px); aspect-ratio:1; position:relative; flex:0 1 auto; border-radius:50%; filter:drop-shadow(0 0 15px #ffeb52); }
.lucky-wheel img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; }
.lucky-wheel .inner-wheel { padding:0; }.lucky-wheel.spinning .outer-wheel { animation:luckyOuterSpin var(--result-duration,4s) cubic-bezier(.08,.58,.1,1) var(--result-delay,0s) both; }.lucky-wheel.spinning .inner-wheel { animation:luckyInnerSpin var(--result-duration,4s) cubic-bezier(.08,.58,.1,1) var(--result-delay,0s) both; }
@keyframes luckyOuterSpin{from{transform:rotate(0)}to{transform:rotate(1800deg)}}@keyframes luckyInnerSpin{from{transform:rotate(0)}to{transform:rotate(-2160deg)}}
.lucky-result { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:32%; aspect-ratio:1; display:grid; place-items:center; border-radius:50%; color:white; background:#a40010; font-size:2rem; font-weight:1000; }
.lucky-logo { width:min(260px,70%); max-height:90px; object-fit:contain; }
.lucky-wheel-side .message-panel { width:90%; }
.lucky-footer { grid-column:1/-1; display:grid; grid-template-columns:1.2fr 1.5fr .8fr; align-items:center; gap:10px; padding:8px 15px; background:#f1e8d5d9; border-top:4px solid #871919; }
.recent-cards { overflow:hidden; }.lucky-footer .asset-chip{width:72px;height:72px}.lucky-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.lucky-actions button{padding:9px}
.lucky-actions { position:relative; padding-right:100px; }
.lucky-clock { position:absolute; right:0; top:0; bottom:0; width:92px; display:grid; place-items:center; align-content:center; color:#42ff29; border:5px solid #6b1200; border-radius:50%; background:#292929; }
.lucky-clock b { font-size:2.2rem; line-height:1; }.lucky-clock small { margin-top:5px; color:white; font-size:.52rem; text-align:center; }
.lucky-footer .play-win { width:100%; margin:5px 0 0; padding:7px; color:#2a1000; background:#ffd556; border-width:2px; font-size:.9rem; }

/* Remaining compact games */
.simple-game { min-height:calc(100vh - 78px); display:grid; place-items:center; padding:30px; }
.simple-panel { width:min(920px,96vw); padding:26px; text-align:center; border:5px solid #ffd34e; border-radius:18px; background:#750707db; }
.simple-panel h1 { color:#ffe068; font:900 2.2rem Georgia; }
.simple-wheel { width:min(42vw,390px); aspect-ratio:1; margin:auto; display:grid; place-items:center; border-radius:50%; background-position:center; background-size:contain; background-repeat:no-repeat; transition:transform 1.1s; }
.simple-wheel.spinning { transform:rotate(1080deg); }.simple-wheel span{display:grid;place-items:center;width:30%;aspect-ratio:1;border-radius:50%;background:#7c0011;font-size:2.3rem;font-weight:900}
.simple-choices { display:grid; grid-template-columns:repeat(auto-fit,minmax(70px,1fr)); gap:8px; margin:18px 0; }
.simple-choices button { min-height:55px; color:white; background:#310000; border:2px solid #ffd153; border-radius:7px; font-weight:900; }

#toast { position:fixed; z-index:100; left:50%; top:64px; transform:translate(-50%,-20px); opacity:0; padding:11px 22px; border:2px solid #6cff79; border-radius:8px; background:#164e20; transition:.2s; }
#toast.show { opacity:1; transform:translate(-50%,0); } #toast.bad { background:#630a0a; border-color:#ff826e; }

@media (max-width: 1050px) {
  .lobby-games { grid-template-columns:repeat(2,1fr); }
  .lobby-thumb { height:140px; }
  .spin-screen { grid-template-columns:42% 58%; }
  .asset-chip { width:62px; height:62px; }
  .lucky-screen { height:auto; min-height:calc(100vh - 78px); grid-template-columns:1fr; grid-template-rows:auto auto auto; }
  .lucky-board { min-height:560px; }
  .lucky-wheel-side { min-height:440px; }.lucky-wheel{width:min(70vw,430px)}.lucky-footer{grid-column:1;grid-template-columns:1fr}.recent-cards{display:none}
}

@media (max-width: 760px) {
  .topbar { gap:5px; padding:4px; }.brand,.check,.welcome{display:none}.balance-label{min-width:145px}.nav-button{padding:5px 8px}
  .login-screen { grid-template-columns:1fr; padding:20px; }.free-panel{display:none}.login-card{padding:26px}
  .lobby-screen { padding:50px 18px 100px; }.lobby-cabinet{padding:55px 25px 70px}.lobby-games{grid-template-columns:1fr 1fr;gap:14px}.lobby-thumb{height:110px}.games-plaque{padding:14px 50px}
  .spin-screen { display:block; overflow:auto; }.spin-history{display:none}.spin-left{padding:18px}.asset-wheel{width:min(92vw,520px)}.spin-right{padding:15px 15px 70px}.number-grid{gap:8px}.number-bet{min-height:80px}.timer-panel{grid-template-columns:1fr}
  .chip-bar{gap:6px;padding:8px}.asset-chip,.lucky-footer .asset-chip{width:54px;height:54px}
  .lucky-board { padding:76px 8px 12px 110px; overflow:auto; }.limit-box{width:95px;font-size:.72rem}.suit-heads{left:112px}.rank-heads{width:88px}.group-bet b{display:none}.group-bet i{font-size:1.8rem}.cards-grid{min-width:430px}.lucky-card img,.css-card{width:54px;height:75px}.lucky-footer{padding-bottom:45px}
}

/* Recorded 16:9 PaisaJeeto cabinet layout */
.spin-stage, .joker-stage { height:100vh; min-height:0; overflow:hidden; }
.spin-stage .footer-note, .joker-stage .footer-note { display:none; }
.spin-stage .topbar, .joker-stage .topbar { position:relative; height:47px; min-height:47px; padding:3px 11px; gap:10px; }
.spin-stage .topbar .brand, .joker-stage .topbar .brand { display:none; }
.spin-stage { background:#8b3d00 url('assets/single2/background.jpg') center/cover no-repeat; }
.spin-screen { height:calc(100vh - 47px); min-height:0; display:grid; grid-template-columns:40.5% 59.5%; grid-template-rows:54px minmax(0,1fr); overflow:hidden; }
.spin-history { grid-column:1/-1; grid-row:1; height:54px; justify-content:flex-start; padding:3px 12px 3px 100px; gap:5px; background:linear-gradient(#fff600,#eda000); border:0; }
.spin-history > img { width:46px; height:49px; object-fit:contain; margin-left:-62px; margin-right:4px; }
.spin-history .result-strip { flex:1; justify-content:flex-end; gap:5px; min-height:0; overflow:hidden; }
.spin-history .history-result { width:50px; min-width:50px; height:48px; padding-top:1px; border:0; border-radius:3px; font-size:1.62rem; text-shadow:0 2px #333; }
.spin-history .history-result small { display:block; position:absolute; margin-top:29px; font-size:.54rem; }
.spin-left { grid-column:1; grid-row:2; min-height:0; padding:0; justify-content:flex-start; overflow:hidden; }
.spin-left .asset-wheel { width:min(38vw,540px); margin-top:-7px; aspect-ratio:1; overflow:visible; }
.spin-left .asset-wheel img { padding:0; }
.spin-left .wheel-face { z-index:1; inset:2.8%; width:94.4%; height:94.4%; transform:rotate(-36deg); }
.spin-left .wheel-frame { z-index:3; }
.spin-left .wheel-center-art { z-index:4; width:44%; height:44%; left:28%; top:28%; filter:brightness(.58) contrast(1.35); }
.spin-left .wheel-picker-art { z-index:7; width:7%; height:11%; left:46.5%; top:-1%; }
.spin-left .wheel-base-art { z-index:0; width:86%; height:auto; left:7%; top:80%; }
.spin-left .asset-wheel::after { content:""; position:absolute; z-index:4; left:22%; bottom:-12%; width:56%; height:12%; background:url('assets/single2/coins.png') center bottom/100% 100% no-repeat; }
.spin-left .wheel-result { z-index:6; width:23%; border:0; background:transparent; font-size:3.7rem; text-shadow:0 3px #5a0000; }
.spin-left .wheel-result:empty { display:none; }
.spin-left .wheel-result small { bottom:4%; font-size:.82rem; }
.spin-left .play-win { z-index:8; width:84%; min-height:62px; margin-top:69px; padding:8px 20px; border:4px solid #9a5000; background:linear-gradient(#542700,#2e1000); color:white; }
.spin-left .play-win b { color:#08df23; }
.spin-right { grid-column:2; grid-row:2; min-height:0; position:relative; display:block; padding:59px 29px 0 26px; overflow:hidden; }
.spin-right .number-grid { grid-template-columns:repeat(5,1fr); gap:18px 16px; width:96%; margin-left:2%; }
.spin-right .number-bet { min-height:118px; height:118px; grid-template-rows:58% 42%; border:3px solid #d68917; border-radius:8px; box-shadow:0 4px 7px #67360088; }
.spin-right .number-bet b { font-size:2.38rem; }
.spin-right .number-bet:nth-child(1){background:linear-gradient(#b6a400 60%,#fff 60%)}
.spin-right .number-bet:nth-child(2){background:linear-gradient(#21b63b 60%,#fff 60%)}
.spin-right .number-bet:nth-child(3){background:linear-gradient(#f50073 60%,#fff 60%)}
.spin-right .number-bet:nth-child(4){background:linear-gradient(#704aac 60%,#fff 60%)}
.spin-right .number-bet:nth-child(5){background:linear-gradient(#e00000 60%,#fff 60%)}
.spin-right .number-bet:nth-child(6){background:linear-gradient(#ef6b00 60%,#fff 60%)}
.spin-right .number-bet:nth-child(7){background:linear-gradient(#1599a6 60%,#fff 60%)}
.spin-right .number-bet:nth-child(8){background:linear-gradient(#351064 60%,#fff 60%)}
.spin-right .number-bet:nth-child(9){background:linear-gradient(#de7000 60%,#fff 60%)}
.spin-right .number-bet:nth-child(10){background:linear-gradient(#0878c9 60%,#fff 60%)}
.spin-right .number-bet:nth-child(1){background:linear-gradient(#b6a400 60%,#fff 60%)!important}.spin-right .number-bet:nth-child(2){background:linear-gradient(#21b63b 60%,#fff 60%)!important}.spin-right .number-bet:nth-child(3){background:linear-gradient(#f50073 60%,#fff 60%)!important}.spin-right .number-bet:nth-child(4){background:linear-gradient(#704aac 60%,#fff 60%)!important}.spin-right .number-bet:nth-child(5){background:linear-gradient(#e00000 60%,#fff 60%)!important}.spin-right .number-bet:nth-child(6){background:linear-gradient(#ef6b00 60%,#fff 60%)!important}.spin-right .number-bet:nth-child(7){background:linear-gradient(#1599a6 60%,#fff 60%)!important}.spin-right .number-bet:nth-child(8){background:linear-gradient(#351064 60%,#fff 60%)!important}.spin-right .number-bet:nth-child(9){background:linear-gradient(#de7000 60%,#fff 60%)!important}.spin-right .number-bet:nth-child(10){background:linear-gradient(#0878c9 60%,#fff 60%)!important}
.spin-right .chip-bar { height:126px; justify-content:center; padding:7px 6px 1px; gap:15px; }
.spin-right .asset-chip { width:110px; height:110px; flex:0 0 110px; }
.spin-right .asset-chip:nth-child(1) img { filter:hue-rotate(235deg) saturate(1.35); }
.spin-right .asset-chip:nth-child(2) img { filter:grayscale(.72) brightness(1.65) contrast(.72); }
.spin-right .asset-chip:nth-child(3) img { filter:grayscale(1) brightness(.32) contrast(1.8); }
.spin-right .asset-chip:nth-child(3) b { color:#fff; font:900 1.08rem Arial,sans-serif; text-shadow:0 1px 1px #000,-1px 0 #000,1px 0 #000,0 -1px #000; }
.spin-right .asset-chip:nth-child(4) img { filter:hue-rotate(190deg) saturate(1.3); }
.spin-right .asset-chip:nth-child(5) img { filter:hue-rotate(112deg) saturate(1.25); }
.spin-right .game-controls { position:relative; z-index:3; width:59%; margin-top:76px; grid-template-columns:repeat(3,1fr); gap:8px 9px; }
.spin-right .control-button { min-height:55px; padding:7px 5px; font-size:1.35rem; border:2px solid #f5a20b; border-radius:5px; text-shadow:0 2px #650000; }
.spin-right .timer-panel { position:absolute; z-index:1; left:0; right:0; bottom:-8px; height:143px; display:block; padding:0; border:0; border-radius:0; background:url('assets/single2/control-pad.png') left bottom/100% 143px no-repeat; }
.spin-right .spin-round-state { display:none; }
.spin-stage .spin-round-state { display:none!important; }
.spin-right .digital-timer { position:absolute; right:6px; bottom:0; width:205px; height:130px; min-height:0; border:0; border-radius:0; background:url('assets/single2/timer-pad.png') center/100% 100% no-repeat; color:white; padding:12px 0 43px; }
.spin-right .digital-timer b { font-size:3.3rem; text-shadow:0 3px #7c0000; }

/* Exact classic login overlay (1365 × 720 reference) */
.login-stage { height:100vh; min-height:0; padding:0; overflow:hidden; background:#780000; }
.login-stage::before { display:none; }
.classic-login { position:absolute; left:50%; top:50%; width:min(100vw,calc(100vh * 1.895833)); height:min(100vh,calc(100vw / 1.895833)); transform:translate(-50%,-50%); background:url('assets/login/original-clean-v2.png') center/100% 100% no-repeat; }
.login-close { position:absolute; z-index:5; right:1.45%; top:2.75%; width:3.3%; aspect-ratio:1; padding:0; color:white; border:2px solid white; border-radius:50%; background:linear-gradient(#ff4b45,#b40000); box-shadow:0 1px 3px #370000; font:900 clamp(20px,2.5vw,38px)/1 Arial,sans-serif; }
.classic-login-form { position:absolute; inset:0; }
.classic-login-form input { position:absolute; left:27.91%; width:15.25%; height:4.72%; padding:2px 9px; color:white; background:#5b0000; border:2px solid #6e0808; border-radius:0; outline:none; box-shadow:inset 0 2px 7px #260000; }
.classic-login-form input[name="username"] { top:45.83%; }
.classic-login-form input[name="password"] { top:51.81%; }
.classic-login-form button { position:absolute; left:21.98%; top:59.86%; width:8.72%; height:4.72%; padding:0; color:transparent; border:0; background:transparent; font:0/0 sans-serif; cursor:pointer; }
.classic-login-form .login-error { position:absolute; left:28.5%; top:66.5%; width:20%; margin:0; color:#fff; text-align:left; }
.classic-login-form::after { display:none; }
.classic-login-form .login-error { z-index:2; }
.server-hotspot { position:absolute; z-index:6; left:0; top:0; width:9%; height:7%; border:0; background:transparent; }
.android-app .classic-login { width:1365px; height:720px; }
.server-backdrop { position:fixed; z-index:120; inset:0; display:grid; place-items:center; background:#000b; }
.server-dialog { width:min(480px,90vw); position:relative; padding:30px; border:4px solid #ffd34e; border-radius:12px; background:linear-gradient(#a40000,#3f0000); box-shadow:0 20px 60px #000; }
.server-dialog h2 { margin:0 0 18px; color:#ffe15a; }.server-dialog label{display:block;margin-bottom:7px}.server-dialog input{width:100%;padding:12px;color:white;background:#210000;border:2px solid #8b3100}.server-dialog button[data-save-api]{width:100%;margin-top:18px;padding:11px;color:white;border:2px solid #ffcf3d;background:#b80000;font-weight:900}.server-dialog button[data-server-close]{position:absolute;right:8px;top:7px;color:white;border:0;background:transparent;font-size:1.6rem}

/* Four-game lobby cabinet */
.lobby-stage { height:100vh; min-height:0; padding-bottom:0; overflow:hidden; }
.lobby-stage .footer-note { display:none; }
.lobby-screen { min-height:calc(100vh - 48px); grid-template-columns:minmax(0,1fr); padding:72px 2.5% 76px; }
.lobby-cabinet { width:min(100%,1180px); min-height:440px; padding:96px 56px 70px; }
.lobby-games { grid-template-columns:repeat(4,1fr); gap:32px; justify-content:center; }
.lobby-game { width:100%; max-width:205px; justify-self:center; overflow:visible; }
.lobby-thumb { height:143px; background-size:100% 100%; }
.lobby-game strong { margin:-1px -18px -2px; padding:10px 4px; font-size:1.22rem; clip-path:polygon(0 15%,9% 15%,9% 0,91% 0,91% 15%,100% 15%,91% 50%,100% 86%,82% 86%,82% 100%,18% 100%,18% 86%,0 86%,9% 50%); }
.lobby-arrow { width:94px; aspect-ratio:.62; border:0; background:transparent; position:relative; filter:drop-shadow(0 0 3px #fff4ba); }
.lobby-arrow::before,.lobby-arrow::after { content:""; position:absolute; inset:15%; clip-path:polygon(100% 0,35% 50%,100% 100%,72% 100%,8% 50%,72% 0); background:#fff; }
.lobby-arrow::after { inset:21%; background:#8d0808; }
.lobby-arrow.right { transform:scaleX(-1); }

/* Spin result colors and top-row alignment */
.result-1{background:#b7a600!important}.result-2{background:#2fc83d!important}.result-3{background:#ed0873!important}.result-4{background:#724cac!important}.result-5{background:#e00000!important}.result-6{background:#e97400!important}.result-7{background:#1799a4!important}.result-8{background:#37116b!important}.result-9{background:#d56a00!important}.result-0{background:#0878c9!important}
.spin-history .spin-info { width:52px; height:52px; flex:0 0 52px; margin-left:-62px; margin-right:4px; padding:0; border:0; background:transparent; }
.spin-history .spin-info img { width:100%; height:100%; object-fit:contain; }
.history-result { position:relative; font-family:Arial,sans-serif; }
.spin-history .history-result small { left:0; right:0; bottom:3px; margin:0; line-height:1; }

/* A real one-shot spin and the original green/red perimeter lamps */
.spin-left .asset-wheel.spinning .wheel-face { animation:spinWheel 12s cubic-bezier(.08,.58,.08,1) var(--spin-delay,0s) both; }
@keyframes spinWheel { from{transform:rotate(-36deg)} to{transform:rotate(var(--stop-angle,2844deg))} }
.spin-left .asset-wheel.winner-reveal .wheel-face { animation:none!important; transform:rotate(var(--stop-angle,2844deg)); }
.wheel-lights { position:absolute; inset:0; z-index:5; pointer-events:none; }
.wheel-lights i { --lamp:#5bea0b; position:absolute; left:calc(50% - 11px); top:calc(50% - 11px); width:22px; height:22px; border:2px solid #263600; border-radius:50%; background:radial-gradient(circle at 35% 30%,#b7ff75,var(--lamp) 58%,#237000); box-shadow:0 0 12px var(--lamp); transform:rotate(calc(var(--i) * 18deg)) translateY(-246px); animation:lampPulse .7s alternate infinite; }
.closing-phase .wheel-lights i,.result-phase:not(.winner-reveal) .wheel-lights i { animation:lampSwap 2s steps(1,end) infinite; }
.result-phase.winner-reveal .wheel-lights i { --lamp:#ef0606; border-color:#4c0000; background:radial-gradient(circle at 35% 30%,#ff8a79,var(--lamp) 58%,#750000); animation:winnerLamp .35s alternate infinite; }
@keyframes lampPulse { to{filter:brightness(1.65);box-shadow:0 0 22px var(--lamp)} }
@keyframes lampSwap { 0%,49%{background:radial-gradient(circle at 35% 30%,#b7ff75,#55e600 58%,#237000);border-color:#263600;box-shadow:0 0 14px #55e600}50%,100%{background:radial-gradient(circle at 35% 30%,#ff8a79,#ef0606 58%,#750000);border-color:#4c0000;box-shadow:0 0 18px #ef0606} }
@keyframes winnerLamp { to{filter:brightness(1.9);box-shadow:0 0 26px #ff1800} }
.spin-left .wheel-picker-art { filter:hue-rotate(118deg) saturate(1.25); }
.spin-left .wheel-result { display:grid!important; width:30%; border:0; background:radial-gradient(circle at 38% 32%,#ff6373cc 0,#d30620d9 32%,#62000ce8 72%); box-shadow:inset 0 0 18px #210000; }
.spin-left .wheel-result b { color:#ffd042; font-size:.78em; line-height:1; -webkit-text-stroke:2px #793900; text-shadow:2px 2px 0 #fff0a0,-2px -2px 0 #3b1400,0 0 9px #ffdf00; }
.spin-left .wheel-result b.center-tick { animation:centerTicker .44s cubic-bezier(.18,.72,.2,1) both; }
.spin-screen.final-result .wheel-result b { opacity:1!important;transform:none!important;visibility:visible!important; }
.spin-left .wheel-result small { color:#ffe953; text-shadow:0 2px #5a0000; }
.result-phase:not(.winner-reveal) .wheel-result { animation:centerPulse .7s alternate infinite; }
@keyframes centerTicker{0%{transform:translateX(-105%) scale(.78);opacity:0}45%{transform:translateX(8%) scale(1.08);opacity:1}100%{transform:translateX(0) scale(1);opacity:1}}@keyframes centerPulse{to{filter:brightness(1.35)}}
.spin-left .wheel-result:empty::after { content:""; }

.spin-screen.no-more-bets .number-bet { background:linear-gradient(#343434 58%,#f2f2f2 58%)!important; border-color:#202020; box-shadow:inset 0 2px 8px #000,0 3px 5px #542b00!important; }
.spin-screen.no-more-bets .number-bet b,.spin-screen.no-more-bets .number-bet span { visibility:hidden; }
.spin-screen.no-more-bets #confirm-bet { filter:grayscale(1) brightness(.65); }
.spin-screen.final-result .number-bet { animation:boxesReturn .45s ease-out both; }
@keyframes boxesReturn{from{transform:scaleY(.1);opacity:.2}to{transform:scaleY(1);opacity:1}}
.spin-screen.final-result .wheel-result { animation:resultPop .55s cubic-bezier(.1,1.5,.2,1) both; }
@keyframes resultPop{from{transform:translate(-50%,-50%) scale(.6)}to{transform:translate(-50%,-50%) scale(1)}}

/* Original red timer with a live gradient progress bar */
.spin-right .digital-timer { right:7px; bottom:1px; width:220px; height:135px; padding:5px 5px 38px; overflow:hidden; border:6px solid #210000; border-radius:13px; background:linear-gradient(#d50000 0 67%,#f2b51b 67% 100%); box-shadow:0 0 0 3px #c97800; }
.spin-right .digital-timer b { font:900 3.4rem Arial,sans-serif; align-self:center; text-shadow:0 3px #740000; }
.timer-track { position:absolute; left:15px; right:15px; bottom:10px; height:34px; overflow:hidden; border:3px solid #140000; border-radius:22px; background:#080008; }
.timer-track i { display:block; height:100%; border-radius:18px 0 0 18px; background:linear-gradient(90deg,#04df22,#9cff00 52%,#fff000 82%,#ff2b00); transition:width .25s linear; }
.spin-screen.spinning-result .timer-track i { animation:spinProgress 12s linear both; }
.spin-screen.final-result .timer-track i { width:4%!important; }
@keyframes spinProgress{from{width:100%}to{width:0}}

/* Clickable information and result panel */
.game-info-backdrop { position:fixed; z-index:100; inset:0; display:grid; place-items:center; background:#000a; }
.game-info { width:min(620px,90vw); position:relative; padding:28px 34px; color:white; border:5px solid #ffda36; border-radius:18px; background:linear-gradient(#b10b0b,#430000); box-shadow:0 18px 60px #000; }
.game-info h2,.game-info h3 { margin:0 0 13px; text-align:center; color:#ffe25a; }
.info-close { position:absolute; right:12px; top:9px; width:38px; height:38px; color:white; border:2px solid #ffd14a; border-radius:50%; background:#d00000; font-size:1.6rem; }
.rule-grid { display:grid; grid-template-columns:1fr auto; gap:8px; padding:14px; background:#210000; }
.info-results { display:flex; justify-content:center; gap:7px; }
.info-results span { width:45px; height:45px; position:relative; display:grid; place-items:center; border-radius:5px; font-size:1.35rem; font-weight:900; }
.info-results small { position:absolute; bottom:1px; font-size:.5rem; }

/* Original result/report window */
.game-info-backdrop { backdrop-filter:blur(7px); }
.result-window { width:min(1040px,82vw); min-height:510px; position:relative; padding:94px 28px 72px; color:#17120b; border:5px solid #a95f13; border-radius:13px; background:linear-gradient(#fff4a7,#f3c16d); box-shadow:inset 0 0 0 4px #ffe449,0 18px 65px #000b; }
.result-window::before,.result-window::after { content:""; position:absolute; left:-7px; right:-7px; height:20px; background:repeating-radial-gradient(ellipse at 25px 20px,#ffd73b 0 4px,#7b2800 5px 7px,transparent 8px 25px); }
.result-window::before{top:-17px}.result-window::after{bottom:-17px;transform:rotate(180deg)}
.result-window nav { position:absolute; left:27px; top:21px; display:flex; gap:62px; }
.result-window nav button { min-width:170px; height:50px; padding:0 30px; color:#776a48; border:4px solid #d6ab50; border-radius:5px; background:linear-gradient(#e6e4a4,#9bd481); box-shadow:inset 0 0 0 3px #f8e79c; font-weight:1000; letter-spacing:.18em; }
.result-window nav button.active { color:#080808; border-color:#a77913; background:linear-gradient(#b6f08d,#60cc6b); }
.result-window .info-close { right:24px; top:18px; width:54px; height:54px; border:4px solid white; background:linear-gradient(#ef3145,#b90013); font-size:2.3rem; line-height:1; box-shadow:0 2px 4px #5b2400; }
.result-table-wrap { height:345px; overflow:auto; border:2px solid #9b6a2c; background:#f6b86d; box-shadow:0 0 0 12px #f6d37f; }
.result-window table { width:100%; border-collapse:collapse; font-size:1rem; font-weight:800; }
.result-window th,.result-window td { height:48px; padding:9px 13px; border:1px solid #655039; text-align:left; }
.result-window th { background:#fff; font-weight:1000; }
.result-window tbody tr:nth-child(odd){background:#f6ce83}.result-window tbody tr:nth-child(even){background:#efb16d}
.result-search { position:absolute; left:25px; bottom:17px; display:flex; gap:35px; }
.result-search input { width:220px; height:43px; padding:6px 10px; color:#17120b; border:1px solid #777; background:white; font-weight:900; }
.result-search button { width:145px; color:white; border:2px solid #5c250d; border-radius:10px; background:linear-gradient(#b66d58,#733018); font-weight:1000; letter-spacing:.12em; }
@media(max-width:800px){.result-window{width:94vw;padding-top:85px}.result-window nav{gap:8px}.result-window nav button{min-width:0;padding:0 12px}.result-table-wrap{height:330px}}

/* Bet confirmation and settled win/loss notices */
.bet-success { position:fixed; z-index:180; left:50%; top:82px; transform:translateX(-50%); min-width:390px; display:flex; align-items:center; gap:15px; padding:14px 20px; color:#fff; border:3px solid #d8ff8c; border-radius:10px; background:linear-gradient(#30b637,#08731e); box-shadow:0 8px 28px #0009; animation:noticeDrop .35s ease-out; }
.bet-success>b{width:43px;height:43px;display:grid;place-items:center;border-radius:50%;background:#fff;color:#149228;font-size:1.7rem}.bet-success span{font-size:1.15rem;font-weight:1000}.bet-success small{font-size:.8rem;color:#eaffc8}.bet-success button{margin-left:auto;color:white;border:0;background:transparent;font-size:1.4rem}
.game-popup-backdrop { position:fixed; z-index:190; inset:0; display:grid; place-items:center; background:#0008; backdrop-filter:blur(4px); }
.game-popup { width:min(430px,88vw); position:relative; padding:28px 45px; text-align:center; border:6px solid #ffd53b; border-radius:18px; background:linear-gradient(#a90000,#3b0000); box-shadow:0 18px 60px #000; animation:resultNotice .5s cubic-bezier(.1,1.4,.2,1); }
.game-popup.win{background:linear-gradient(#198638,#063d18)}.game-popup>button{position:absolute;right:10px;top:8px;color:#fff;border:0;background:transparent;font-size:1.7rem}.game-popup h2{margin:0 0 15px;color:#ffe84d;font-size:2.3rem}.popup-result{width:120px;aspect-ratio:1;margin:0 auto 15px;position:relative;display:grid;place-items:center;border:10px solid #292929;border-radius:50%;background:radial-gradient(circle,#ef3141,#690000);font-size:3rem;font-weight:1000}.popup-result small{position:absolute;bottom:6px;color:#ffe452;font-size:.75rem}.game-popup p{display:flex;justify-content:space-between;margin:8px 0;padding:8px 15px;background:#19000088;border-radius:5px;font-weight:900}
.result-identity{margin:-7px 0 12px;color:#ffe991;font-weight:900;line-height:1.45}
@keyframes noticeDrop{from{transform:translate(-50%,-35px);opacity:0}}@keyframes resultNotice{from{transform:scale(.55);opacity:0}}

.joker-stage { background:#f6b34e url('assets/joker/bg.png') center/cover no-repeat; }
.joker-screen { height:calc(100vh - 47px); min-height:0; position:relative; display:grid; grid-template-columns:64% 36%; grid-template-rows:minmax(0,1fr) 189px; gap:0 10px; padding:6px 12px 0; overflow:hidden; }
.joker-board { min-height:0; position:relative; background:url('assets/joker/board.png') center/100% 100% no-repeat; }
.joker-limits { position:absolute; left:11px; top:8px; width:176px; height:91px; display:grid; grid-template-columns:1fr 1fr; align-content:center; padding:1px 6px; color:#161000; background:linear-gradient(#f26200,#ffcf13,#f26c00); border:2px solid #863800; border-radius:4px; font-weight:900; text-align:center; }
.joker-limits b { grid-column:1/-1; font-size:.9rem; }.joker-limits span{font-size:.8rem}
.joker-suits { position:absolute; left:224px; right:20px; top:3px; height:91px; display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.joker-suits button, .joker-ranks button { position:relative; color:#181000; border:0; background:linear-gradient(#ffe976,#eda700); border-radius:7px; box-shadow:inset 0 0 0 3px #d78d00; font-weight:900; }
.joker-suits button b { position:absolute; top:4px; left:0; right:0; font-size:.72rem; }.joker-suits button i{font-style:normal;font-size:3.1rem}.joker-suits button span{position:absolute;right:7px;bottom:18px;padding:8px 5px;border-radius:50%;background:#fff3b8;font-size:.72rem}
.joker-ranks { position:absolute; left:34px; top:125px; bottom:17px; width:142px; display:grid; grid-template-rows:repeat(3,1fr); gap:18px; }
.joker-ranks button small { position:absolute; top:7px; left:0; right:0; font-size:.72rem; }.joker-ranks button b{font:900 3.5rem Georgia}.joker-ranks button span{position:absolute;right:8px;bottom:24px;padding:10px 6px;border-radius:50%;background:#fff2b6;font-size:.72rem}
.joker-cards { position:absolute; left:218px; right:20px; top:105px; bottom:13px; display:grid; grid-template-columns:repeat(4,1fr); grid-template-rows:repeat(3,minmax(0,1fr)); gap:6px 25px; }
.joker-cards .lucky-card { min-height:0; padding-bottom:30px; }
.joker-cards .lucky-card img { width:64px; height:91px; max-height:calc(100% - 24px); }
.joker-cards .lucky-card strong { min-width:69px; padding:9px 5px; border-color:#ea184b; font-size:.9rem; }
.joker-cards .lucky-card > * { position:relative; z-index:2; }
.joker-cards .lucky-card::after { content:""; position:absolute; z-index:1; bottom:13px; width:130px; height:38px; background:#c3002f; clip-path:polygon(0 20%,35% 20%,50% 0,65% 20%,100% 20%,87% 52%,100% 84%,62% 84%,50% 100%,38% 84%,0 84%,13% 52%); }
.joker-wheel-side { min-height:0; position:relative; }
.joker-wheel { position:absolute; width:min(34vw,430px); aspect-ratio:1; left:50%; top:21px; transform:translateX(-50%); }
.joker-wheel img { position:absolute; object-fit:contain; }
.joker-logo-ring { z-index:3; width:100%; height:112%; left:0; top:-4%; }
.joker-rank-ring { z-index:2; width:78%; height:78%; left:11%; top:18%; }
.joker-suit-ring { z-index:4; width:51%; height:51%; left:24.5%; top:31.5%; }
.joker-center-result { position:absolute; z-index:5; left:38%; top:45%; width:24%; aspect-ratio:1; display:grid; place-items:center; border-radius:50%; color:#ffd52c; font-size:2.4rem; font-weight:1000; background:radial-gradient(circle,#c40000,#760000); }
.joker-wheel.spinning .joker-rank-ring { animation:recordedJokerOuter var(--result-duration,4s) cubic-bezier(.12,.65,.16,1) var(--result-delay,0s) both; }
.joker-wheel.spinning .joker-suit-ring { animation:recordedJokerInner var(--result-duration,4s) cubic-bezier(.12,.65,.16,1) var(--result-delay,0s) both; }
@keyframes recordedJokerOuter{to{transform:rotate(1440deg)}}@keyframes recordedJokerInner{to{transform:rotate(-1800deg)}}
.joker-draw-time { position:absolute; right:4px; bottom:4px; color:#160800; font-size:.72rem; font-weight:900; }
.joker-footer { grid-column:1/-1; position:relative; margin:0 -12px; background:linear-gradient(90deg,#fff3beaa,#cfedffbb); border-top:3px solid #761414; }
.joker-history { position:absolute; left:12px; top:0; width:42%; height:76px; }
.joker-history .result-strip { height:76px; gap:2px; overflow:hidden; }
.joker-history .history-result { flex:1; min-width:54px; height:71px; color:#171000; background:linear-gradient(#ffcf4c,#f5b72b); border:2px solid #a91d16; font-size:1.4rem; }
.joker-balance { position:absolute; left:0; top:78px; width:150px; height:68px; display:grid; color:white; background:linear-gradient(#e44700,#8b1300); border:1px solid #ffd04c; font-size:.7rem; }
.joker-balance span{display:flex;justify-content:space-between;padding:2px 7px;border-bottom:1px solid #ffcf48}
.joker-message { position:absolute; left:43%; top:0; width:21%; height:76px; display:grid; place-items:center; color:white; background:linear-gradient(#3c332f,#171413); border:4px solid #d59b22; border-radius:9px; font-size:1.3rem; font-weight:1000; }
.joker-footer > .chip-bar { position:absolute; left:13%; bottom:0; width:51%; height:94px; padding:5px; gap:9px; }
.joker-footer > .chip-bar .asset-chip { width:72px; height:72px; }
.joker-actions { position:absolute; left:67%; top:58px; width:20%; display:grid; grid-template-columns:1fr 1fr; gap:5px; }
.joker-actions button { min-height:38px; color:white; background:linear-gradient(#e62a14,#890000); border:2px solid #ffd44e; font-weight:900; }
.joker-timer { position:absolute; right:2%; top:33px; width:112px; aspect-ratio:1; display:grid; place-items:center; color:#3aff1b; font:900 2.2rem monospace; }
.joker-timer img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; }
.joker-timer img:nth-child(2) { inset:11%; width:78%; height:78%; animation:timerSweep 90s linear infinite; }
.joker-timer img:nth-child(3) { inset:6%; width:88%; height:88%; }.joker-timer img:nth-child(4){inset:19%;width:62%;height:62%}
.joker-timer b { position:relative; z-index:3; }
@keyframes timerSweep{to{transform:rotate(360deg)}}

@media (max-aspect-ratio: 4/3) {
  .spin-stage, .joker-stage { min-width:960px; }
  body:has(.spin-stage), body:has(.joker-stage) { overflow:auto; }
}

.triple-stage { height:100vh; min-height:0; overflow:hidden; background:#5b0000; }
.triple-stage .footer-note { display:none; }
.triple-stage .topbar { position:relative; height:47px; min-height:47px; padding:3px 11px; }
.triple-screen { height:calc(100vh - 47px); min-height:0; position:relative; overflow:hidden; background:url('assets/triple/original-1920.png') center -3.385vw/100% auto no-repeat; }
.triple-timer { position:absolute; z-index:5; left:43.85%; top:0; width:12.2%; height:43px; display:grid; place-items:center; color:#ff0a77; background:#a90017; font-size:1.72rem; font-weight:1000; text-shadow:0 2px #520000; }
.triple-double-grid, .triple-three-grid { position:absolute; z-index:4; top:10.55%; height:58.35%; display:grid; grid-template-columns:repeat(10,1fr); grid-template-rows:repeat(10,1fr); gap:2px; }
.triple-double-grid { left:2.45%; width:29.2%; }.triple-three-grid { left:68.82%; width:28.9%; }
.triple-double-grid button, .triple-three-grid button, .triple-single-grid button { position:relative; border:0; background:transparent; border-radius:2px; cursor:pointer; }
.triple-double-grid button:hover, .triple-three-grid button:hover, .triple-single-grid button:hover { box-shadow:inset 0 0 0 3px #fff5a3,0 0 7px #ffea00; }
.triple-double-grid button small, .triple-three-grid button small, .triple-single-grid button small { position:absolute; z-index:3; right:1px; bottom:1px; min-width:15px; padding:1px 2px; color:#fff; border-radius:7px; background:#b00000; font:900 .52rem Arial; box-shadow:0 0 2px #000; }
.triple-double-grid button.selected, .triple-three-grid button.selected, .triple-single-grid button.selected { box-shadow:inset 0 0 0 4px #fff700,0 0 8px #00ff4c !important; filter:none; }
.triple-page-tabs { position:absolute; z-index:5; left:68.9%; top:6.72%; width:28.75%; height:20px; display:grid; grid-template-columns:repeat(10,1fr); }
.triple-page-tabs button { padding:0; color:#321100; border:0; background:transparent; font-size:.69rem; font-weight:900; }
.triple-page-tabs button.active { color:#fff; background:#198f2266; box-shadow:inset 0 0 0 2px #8dff75; }
.triple-single-grid { position:absolute; z-index:5; left:32.35%; top:74.1%; width:35.5%; height:7.1%; display:grid; grid-template-columns:repeat(10,1fr); gap:5px; }
.triple-chip-zones { position:absolute; z-index:5; left:35.15%; top:88.25%; width:29.25%; height:7.8%; display:grid; grid-template-columns:repeat(7,1fr); gap:4px; }
.triple-chip-zones button { border:0; border-radius:50%; background:#fff1; cursor:pointer; }
.triple-chip-zones button.selected { box-shadow:0 0 0 4px #39ff55,0 0 12px #39ff55; }
.triple-zone { position:absolute; z-index:7; width:10.6%; height:9.1%; color:transparent; border:0; background:transparent; cursor:pointer; }
.triple-zone.repeat{top:77.75%;right:1.6%}.triple-zone.double-up{top:77.75%;right:13.25%}.triple-zone.info{top:89.35%;right:13.25%}.triple-zone.clear{top:89.35%;right:1.6%}
.triple-confirm { position:absolute; z-index:8; left:34%; bottom:0; width:32%; height:30px; padding:0 8px; color:#fff; border:2px solid #ffdc45; border-radius:8px 8px 0 0; background:linear-gradient(#d63413,#711000); box-shadow:0 -2px 10px #ffcf45; font-weight:1000; cursor:pointer; }
.triple-confirm:disabled { color:#ffe8b0; filter:grayscale(.55); opacity:.88; }
.triple-play,.triple-win { position:absolute; z-index:5; bottom:11px; width:11.5%; color:#130800; font-size:.78rem; font-weight:900; }.triple-play{left:2.2%}.triple-win{left:13.1%}
.triple-wheel-system{position:absolute;z-index:6;left:33.2%;top:7%;width:33.15%;aspect-ratio:1;display:grid;place-items:center;border-radius:50%;pointer-events:none;opacity:0}.triple-screen.wheel-running .triple-wheel-system{opacity:1}.triple-fixed-pointer{position:absolute;z-index:9;left:46.7%;top:5.8%;width:6.6%;height:11%;clip-path:polygon(50% 100%,0 18%,50% 0,100% 18%);background:linear-gradient(90deg,#a50817,#ffda3a 42%,#fff674 50%,#ffba1e 58%,#9a0011);filter:drop-shadow(0 2px 2px #420000)}.triple-number-ring{position:absolute;overflow:hidden;border:5px solid #f9c52e;border-radius:50%;will-change:transform}.triple-number-ring.outer{inset:12.3%;background:repeating-conic-gradient(from -18deg,#c00036 0 34deg,#780018 34deg 36deg);box-shadow:inset 0 0 0 43px #bd0036aa,inset 0 0 18px #400,0 0 12px #ffe65b}.triple-number-ring.middle{inset:27.3%;background:repeating-conic-gradient(from -18deg,#49bd16 0 34deg,#147719 34deg 36deg);box-shadow:inset 0 0 0 31px #29a51daa,inset 0 0 12px #063d18}.triple-number-ring.inner{inset:40%;background:repeating-conic-gradient(from -18deg,#272727 0 34deg,#070707 34deg 36deg);box-shadow:inset 0 0 0 21px #181818,inset 0 0 9px #000}.triple-number-ring i{position:absolute;left:calc(50% - 18px);top:calc(50% - 21px);width:36px;height:42px;transform:rotate(calc(var(--n)*36deg)) translateY(-174px);display:grid;place-items:center;font-style:normal}.triple-number-ring.middle i{transform:rotate(calc(var(--n)*36deg)) translateY(-108px)}.triple-number-ring.inner i{transform:rotate(calc(var(--n)*36deg)) translateY(-53px)}.triple-number-ring i b{display:block;color:#ffe78c;font:900 1.5rem Arial;text-shadow:0 2px 2px #4b0000;transform:rotate(calc(var(--n)*-36deg))}.triple-number-ring.inner i b{font-size:1.24rem}.triple-wheel-result{position:absolute;z-index:8;inset:43.1%;display:grid;place-items:center;align-content:center;border:4px solid #edb52c;border-radius:50%;background:radial-gradient(circle at 40% 34%,#fff44c,#e18a00 38%,#7d1600 80%);box-shadow:0 0 16px #ffdc47}.triple-wheel-result small{font-size:.5rem;color:#ffe680}.triple-wheel-result b{font:900 1.1rem Arial}.triple-wheel-system.spinning .outer{animation:tripleOuterNumber var(--result-duration,4s) cubic-bezier(.07,.55,.08,1) var(--result-delay,0s) both}.triple-wheel-system.spinning .middle{animation:tripleMiddleNumber calc(var(--result-duration,4s) * .92) cubic-bezier(.07,.55,.08,1) var(--result-delay,0s) both}.triple-wheel-system.spinning .inner{animation:tripleInnerNumber calc(var(--result-duration,4s) * .84) cubic-bezier(.07,.55,.08,1) var(--result-delay,0s) both}.triple-wheel-system.spinning .outer i b{animation:tripleOuterText var(--result-duration,4s) cubic-bezier(.07,.55,.08,1) var(--result-delay,0s) both}.triple-wheel-system.spinning .middle i b{animation:tripleMiddleText calc(var(--result-duration,4s) * .92) cubic-bezier(.07,.55,.08,1) var(--result-delay,0s) both}.triple-wheel-system.spinning .inner i b{animation:tripleInnerText calc(var(--result-duration,4s) * .84) cubic-bezier(.07,.55,.08,1) var(--result-delay,0s) both}.triple-screen.wheel-running:not(.wheel-revealed) .triple-wheel-result{animation:tripleResultPulse .45s ease-in-out infinite alternate}.triple-screen.wheel-revealed .triple-wheel-result{animation:resultNotice .45s cubic-bezier(.1,1.4,.2,1) both}@keyframes tripleOuterNumber{to{transform:rotate(calc(2160deg + var(--digit)*-36deg))}}@keyframes tripleMiddleNumber{to{transform:rotate(calc(-2520deg + var(--digit)*36deg))}}@keyframes tripleInnerNumber{to{transform:rotate(calc(2880deg + var(--digit)*-36deg))}}@keyframes tripleOuterText{to{transform:rotate(calc(var(--n)*-36deg - 2160deg + var(--digit)*36deg))}}@keyframes tripleMiddleText{to{transform:rotate(calc(var(--n)*-36deg + 2520deg - var(--digit)*36deg))}}@keyframes tripleInnerText{to{transform:rotate(calc(var(--n)*-36deg - 2880deg + var(--digit)*36deg))}}@keyframes tripleResultPulse{to{box-shadow:0 0 26px #fff36b;filter:brightness(1.16)}}

.triple-wheel-system.spinning .middle{animation:tripleMiddleNumber var(--result-duration,4s) cubic-bezier(.07,.55,.08,1) var(--result-delay,0s) both}
.triple-wheel-system.spinning .inner{animation:tripleInnerNumber var(--result-duration,4s) cubic-bezier(.07,.55,.08,1) var(--result-delay,0s) both}
.triple-wheel-system.spinning .middle i b{animation:tripleMiddleText var(--result-duration,4s) cubic-bezier(.07,.55,.08,1) var(--result-delay,0s) both}
.triple-wheel-system.spinning .inner i b{animation:tripleInnerText var(--result-duration,4s) cubic-bezier(.07,.55,.08,1) var(--result-delay,0s) both}

/* Exact two-state Triple Chance wheel: blank while spinning, numbered winning lane at reveal */
.triple-number-ring{background-color:transparent!important;background-position:center;background-repeat:no-repeat;background-size:100% 100%;border:0!important;box-shadow:none!important;overflow:visible}
.triple-number-ring.outer{inset:0;background-image:url('assets/triple/ring-outer.svg')}.triple-number-ring.middle{inset:0;background-image:url('assets/triple/ring-middle.svg')}.triple-number-ring.inner{inset:0;background-image:url('assets/triple/ring-inner.svg')}
.triple-number-ring i{left:calc(50% - 18px);top:calc(50% - 21px)}.triple-number-ring.outer i{transform:rotate(calc(var(--n)*36deg)) translateY(-198px)}.triple-number-ring.middle i{transform:rotate(calc(var(--n)*36deg)) translateY(-112px)}.triple-number-ring.inner i{transform:rotate(calc(var(--n)*36deg)) translateY(-57px)}
.triple-wheel-result{inset:42%;border:0;background:url('assets/triple/sheet/center-ball.png') center/contain no-repeat;box-shadow:none;display:flex;flex-direction:column;justify-content:center}.triple-wheel-result b{font-size:1.45rem;line-height:1;color:#fff;text-shadow:0 2px #582100}.triple-wheel-result small{font-size:.72rem;color:#ffcf4b;text-shadow:0 2px #582100}
.triple-winning-lane{display:none;position:absolute;z-index:10;left:39.5%;top:4.8%;width:21%;height:56%;background:url('assets/triple/sheet/winning-lane-clean.png') center/100% 100% no-repeat;color:#08132b;font:900 1.75rem Arial;text-shadow:0 1px #fff}.triple-winning-lane span{position:absolute;left:0;width:100%;text-align:center}.triple-winning-lane span:nth-child(1){top:17%}.triple-winning-lane span:nth-child(2){top:48%}.triple-winning-lane span:nth-child(3){top:76%}.triple-screen.wheel-revealed .triple-winning-lane{display:block;animation:resultNotice .42s cubic-bezier(.1,1.4,.2,1) both}
.triple-screen.wheel-running:not(.wheel-revealed) .triple-number-ring i{opacity:0}.triple-screen.wheel-running:not(.wheel-revealed) .triple-number-ring.inner{display:none}.triple-screen.wheel-running:not(.wheel-revealed) .triple-wheel-result b,.triple-screen.wheel-running:not(.wheel-revealed) .triple-wheel-result small{visibility:hidden}.triple-screen.wheel-revealed .triple-number-ring i{opacity:1}
.triple-screen.wheel-revealed .triple-number-ring{animation:none!important;transform:rotate(calc(var(--digit)*-36deg))!important}.triple-screen.wheel-revealed .triple-number-ring i b{animation:none!important;transform:rotate(calc(var(--n)*-36deg + var(--digit)*36deg))!important}
.triple-screen.wheel-running .triple-fixed-pointer{display:block}.triple-screen.wheel-revealed .triple-wheel-result{inset:39.2%;z-index:11;background-image:url('assets/triple/sheet/result-medallion-clean.png');animation:resultNotice .45s cubic-bezier(.1,1.4,.2,1) both}.triple-screen.wheel-revealed .triple-wheel-result b{font-size:1.75rem}.triple-screen.wheel-revealed .triple-wheel-result small{font-size:.78rem}

/* Triple Chance clean PNG wheel pack: normalized layers share one rotation axis. */
.triple-wheel-system{left:33.25%;top:6%;width:33%;overflow:visible}
.triple-wheel-system::before{content:"";position:absolute;z-index:0;inset:-2%;border-radius:50%;background:radial-gradient(circle,#260000 0 15%,#740008 35%,#920018 72%,#4c0007 100%);box-shadow:0 0 16px #3f0000}
.triple-wheel-system::after{content:"";position:absolute;z-index:5;inset:0;background:url('assets/triple/clean/frame-gold.png') center/100% 100% no-repeat;pointer-events:none}
.triple-wheel-title{display:none}
.triple-fixed-pointer{display:block!important;z-index:14;left:44.8%;top:5.5%;width:10.4%;height:16%;clip-path:none;background:url('assets/triple/clean/pointer.png') center/contain no-repeat;filter:drop-shadow(0 2px 3px #5a0800)}
.triple-number-ring{inset:0!important;background-position:center!important;background-size:100% 100%!important}
.triple-number-ring.outer{z-index:1;background-image:url('assets/triple/clean/ring-red.png')}.triple-number-ring.middle{z-index:2;background-image:url('assets/triple/clean/ring-green.png')}.triple-number-ring.inner{z-index:3;background-image:url('assets/triple/clean/ring-black-center.png')}
.triple-number-ring.outer i{transform:rotate(calc(var(--n)*36deg)) translateY(-194px)}.triple-number-ring.middle i{transform:rotate(calc(var(--n)*36deg)) translateY(-108px)}.triple-number-ring.inner i{transform:rotate(calc(var(--n)*36deg)) translateY(-55px)}
.triple-number-ring i b{color:#fff7bc;font-family:Arial,sans-serif;font-size:1.48rem;-webkit-text-stroke:1px #562300;text-shadow:0 2px 1px #451000,0 0 3px #000}.triple-number-ring.inner i b{font-size:1.25rem;color:#ffd76b}
.triple-wheel-result{inset:42.4%;z-index:8;background-image:url('assets/triple/clean/center-gold.png');filter:drop-shadow(0 0 5px #ffb900)}
.triple-winning-lane{z-index:15;left:36.8%;top:7.3%;width:26%;height:54%;background-image:url('assets/triple/clean/result-wedge.png');font-size:1.65rem;color:#080808;text-shadow:0 1px #d9efff}.triple-winning-lane span:nth-child(1){top:13%}.triple-winning-lane span:nth-child(2){top:44%}.triple-winning-lane span:nth-child(3){top:73%}
.triple-screen.wheel-revealed .triple-wheel-result{inset:39.8%;background-image:url('assets/triple/clean/center-gold.png');filter:drop-shadow(0 0 9px #ffce3d)}
.triple-screen.wheel-running:not(.wheel-revealed) .triple-number-ring.inner{display:block}.triple-screen.wheel-running:not(.wheel-revealed) .triple-wheel-result{background-image:url('assets/triple/clean/center-red.png')}
.triple-wheel-flares{display:none}
.triple-wheel-system.spinning .outer,.triple-wheel-system.spinning .middle,.triple-wheel-system.spinning .inner,.triple-wheel-system.spinning .outer i b,.triple-wheel-system.spinning .middle i b,.triple-wheel-system.spinning .inner i b{animation-duration:var(--result-duration,3s)}

/* Triple Chance standalone canvas wheel transplanted from the approved local wheel. */
.triple-wheel-system.triple-canvas-wheel{left:32.75%;top:3.25%;width:34.5%;aspect-ratio:1;display:block;overflow:visible;opacity:1;border-radius:0;background:transparent;filter:none}
.triple-screen .triple-wheel-system.triple-canvas-wheel{opacity:1}
.triple-wheel-system.triple-canvas-wheel::before,.triple-wheel-system.triple-canvas-wheel::after{display:none}
#triple-wheel-canvas{display:block;width:100%;height:100%;background:transparent}
@keyframes tripleBulb{50%{opacity:1;filter:brightness(1.35)}}@keyframes tripleFlares{50%{filter:hue-rotate(8deg)}}

/* Exact SINGLE2 member-login artwork with functional overlays */
.login-stage { height:100vh; min-height:0; overflow:hidden; background:#06111d url('assets/single2/login.jpg') center/cover no-repeat; }
.login-stage::before, .login-stage .footer-note, .login-stage .free-panel, .login-logo { display:none; }
.login-screen { min-height:100vh; display:block; padding:0; }
.login-side { position:static; }
.login-card { position:absolute; left:33%; top:25%; width:34%; height:68%; padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; }
.login-card h1, .login-card > label { display:none; }
.login-card input { position:absolute; left:15%; width:68%; height:9%; margin:0; padding:10px 14px; color:white; background:#090909; border:3px solid #373737; border-radius:10px; font-size:1.1rem; }
.login-card input[name="username"] { top:30%; }.login-card input[name="password"]{top:50%}
.login-card .primary { position:absolute; left:20%; top:70%; width:60%; height:11%; margin:0; padding:0; border:2px solid #2a0000; border-radius:11px; background:linear-gradient(#ff2c2c,#a90000); font-size:1.7rem; }
.login-card .text-button { position:absolute; left:20%; top:82%; width:60%; height:26px; margin:0; color:transparent; font-size:.92rem; }
.login-card details { display:none; }
.login-card details input { position:static; width:100%; height:30px; }
.login-stage{background:#780000!important}

/* Android uses the original 1365×720 cabinet as one fitted canvas. */
.native-client body { overflow:hidden; background:#000; }
.native-client #app > .stage {
  position:fixed; left:50%; top:50%; width:1365px; height:768px; overflow:hidden;
  transform:translate(-50%,-50%) scale(var(--native-scale,.5));
  transform-origin:center center;
}
.native-client .stage .topbar { width:1365px; }
.native-client .spin-screen,.native-client .joker-screen,.native-client .triple-screen { height:721px; min-height:0; }
.native-client .lobby-screen { min-height:720px; }
.native-client .login-stage { width:1365px; height:768px; min-height:768px; }
.native-client .classic-login { width:1365px; height:720px; }
.native-client .login-screen { min-height:768px; }

/* Do not let phone viewport breakpoints resize or hide desktop cabinet parts. */
.native-client .spin-stage .topbar { display:flex; gap:10px; padding:3px 11px; }
.native-client .spin-stage .topbar .check,
.native-client .spin-stage .topbar .welcome { display:flex; }
.native-client .spin-stage .topbar .nav-button { padding:5px 14px; }
.native-client .spin-stage .topbar .balance-label { min-width:180px; }
.native-client .spin-history { display:flex; }
.native-client .spin-screen { display:grid; grid-template-columns:40.5% 59.5%; grid-template-rows:54px 667px; overflow:hidden; }
.native-client .spin-left { padding:0; }
.native-client .spin-left .asset-wheel { width:519px; height:519px; flex:0 0 519px; }
.native-client .spin-right { padding:59px 29px 0 26px; }
.native-client .spin-right .number-grid { gap:18px 16px; }
.native-client .spin-right .number-bet { min-height:118px; height:118px; }
.native-client .spin-right .chip-bar { gap:15px; padding:7px 6px 1px; }
.native-client .spin-right .asset-chip { width:110px; height:110px; flex:0 0 110px; }
.native-client .spin-right .timer-panel { display:block; }

/* Jeeto Joker: keep the complete desktop board and footer. */
.native-client .joker-screen { display:grid; grid-template-columns:64% 36%; grid-template-rows:532px 189px; gap:0 10px; padding:6px 12px 0; overflow:hidden; }
.native-client .joker-wheel { width:430px; }
.native-client .joker-footer { display:block; }
.native-client .joker-footer > .chip-bar { gap:9px; padding:5px; }
.native-client .joker-footer > .chip-bar .asset-chip { width:72px; height:72px; }

/* 16 Card: cancel phone stacking and retain the full desktop board/footer. */
.native-client .lucky-stage { height:768px; min-height:768px; overflow:hidden; }
.native-client .lucky-stage .footer-note { display:none; }
.native-client .lucky-stage .topbar { height:48px; min-height:48px; display:flex; }
.native-client .lucky-stage .topbar .check,
.native-client .lucky-stage .topbar .welcome { display:flex; }
.native-client .lucky-screen { height:720px; min-height:720px; display:grid; grid-template-columns:65% 35%; grid-template-rows:540px 156px; gap:0; padding:12px; overflow:hidden; }
.native-client .lucky-board { min-height:0; padding:76px 18px 10px 170px; overflow:hidden; }
.native-client .lucky-wheel-side { min-height:0; }
.native-client .lucky-wheel { width:350px; }
.native-client .lucky-footer { grid-column:1/-1; min-height:156px; display:grid; grid-template-columns:1.15fr 1.45fr 1fr; padding:6px 15px; overflow:hidden; }
.native-client .recent-cards { display:block; }
.native-client .lucky-footer .chip-bar { gap:10px; padding:8px; }
.native-client .lucky-footer .asset-chip { width:78px; height:78px; }
.native-client .lucky-actions { align-self:stretch; align-content:center; padding-right:112px; }
.native-client .lucky-actions button { min-height:48px; }
.native-client .lucky-clock { width:104px; height:104px; top:20px; bottom:auto; }
.native-client .lucky-board .cards-grid { min-width:0; }
.native-client .lucky-board .group-bet b { display:block; }

/* Triple Chance: reference image and all hit-zones share the same 1365x721 board. */
.native-client .triple-stage { height:768px; min-height:768px; overflow:hidden; }
.native-client .triple-screen { height:721px; min-height:721px; background-position:center -46.25px; background-size:1366px auto; }

/* Triple Chance Unity source integration (exact supplied production artwork). */
.triple-screen{
  background-image:url('assets/triple/unity/ui.jpg');
  background-position:center -3.23vw;
  background-size:100% auto;
  background-repeat:no-repeat;
  background-color:#710019;
}
.triple-timer{left:44.3%;top:.2%;width:11.5%;height:8.6%;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;color:#ffe557;background:transparent;font-family:Georgia,serif;text-transform:none;text-shadow:0 2px #63000a;pointer-events:none}
.triple-timer small{font-size:1.16rem;font-style:italic;line-height:1.1;color:#fff3cd}.triple-timer b{font:1000 2.75rem/1 Arial;color:#ffe43d}
.triple-double-grid,.triple-three-grid{top:10.7%;height:54.8%;gap:2px}.triple-double-grid{left:3.45%;width:29.15%}.triple-three-grid{left:67.3%;width:29.15%}
.triple-page-tabs{left:67.3%;top:5.6%;width:29.1%;height:4.15%}.triple-page-tabs button{font-size:0}.triple-page-tabs button.active{background:#13a72f99;color:#fff;box-shadow:inset 0 0 0 2px #c9ff80}
.triple-single-grid{left:33.65%;top:72.25%;width:32.8%;height:6.25%;gap:4px}
.triple-random{position:absolute;z-index:7;top:68.5%;height:5.5%;display:grid;grid-template-columns:repeat(7,1fr);gap:2px}.triple-random.left{left:2.35%;width:17.9%}.triple-random.right{right:2.4%;width:17.9%}.triple-random button{border:0;border-radius:50%;background:transparent;cursor:pointer}.triple-random button:hover{box-shadow:0 0 0 2px #fff75d,0 0 8px #fff200}
.triple-result-list{position:absolute;z-index:7;left:2.45%;top:76.8%;width:23.05%;height:11.3%;padding:.35% .55%;display:grid;grid-template-rows:repeat(3,1fr);background:linear-gradient(90deg,#fff2a5e8,#fffbd4e8);border:2px solid #b56800;color:#321400;font:900 .75rem Arial;overflow:hidden}.triple-result-list>div{display:grid;grid-template-columns:58px repeat(6,1fr);align-items:center;border-bottom:1px solid #cf9200}.triple-result-list>div:last-child{border-bottom:0}.triple-result-list span{text-align:center}
.triple-chip-zones{left:35.3%;top:82.7%;width:29.6%;height:7.7%;grid-template-columns:repeat(8,1fr);gap:2px}.triple-chip-zones button{background:transparent}.triple-chip-zones button.selected{box-shadow:0 0 0 4px #39ff55,0 0 15px #a7ff4b;background:#86ff4133}
.triple-zone{width:10.7%;height:10.2%}.triple-zone.double-up{top:75.7%;right:14.45%}.triple-zone.repeat{top:75.7%;right:2.2%}.triple-zone.info{top:87.35%;right:14.45%}.triple-zone.clear{top:87.35%;right:2.2%}
.triple-play,.triple-win{bottom:1.05%;height:5.45%;display:flex;align-items:center;padding-left:1.15%;font-size:1rem;box-shadow:inset 0 0 0 2px #8b5b00}.triple-play{left:3.2%;width:10.3%;background:linear-gradient(90deg,#fff4b3,#ffd560);color:#301300}.triple-win{left:13.5%;width:10.85%;background:#04233a;color:#fff}.triple-play b,.triple-win b{margin-left:auto;margin-right:1rem;color:#0c0}
.triple-confirm{left:33%;width:34%;height:4.4%;bottom:0;border-color:#ffd763;background:linear-gradient(#a33d2f,#5c190f);font-size:.92rem}
.triple-wheel-system.triple-canvas-wheel{left:33.7%;top:6.4%;width:32.6%;opacity:1}.triple-screen .triple-wheel-system.triple-canvas-wheel{opacity:1}#triple-wheel-canvas{filter:drop-shadow(0 0 4px #ffca31)}
.native-client .triple-screen{background-image:url('assets/triple/unity/ui.jpg');background-position:center -44px;background-size:1366px auto}

/* Triple Chance clean cabinet rebuild. This component intentionally uses new
   tc-* class names so none of the retired screenshot-overlay rules can touch it. */
.triple-stage{height:100vh;min-height:0;overflow:hidden;background:#5d0015}
.triple-stage .footer-note{display:none}
.triple-stage .topbar{position:relative;height:47px;min-height:47px;padding:3px 11px}
.tc-screen{box-sizing:border-box;width:100%;height:calc(100vh - 47px);min-height:620px;overflow:hidden;display:grid;grid-template-columns:32.5% 35% 32.5%;gap:8px;padding:7px 12px 6px;background:#6d001a url('assets/triple/fresh/background.jpg') center/cover no-repeat;color:#1f0800;font-family:Arial,sans-serif}
.tc-column,.tc-center{min-width:0;min-height:0;display:flex;flex-direction:column;align-items:stretch;position:relative}
.tc-board{position:relative;height:65.5%;min-height:405px;flex:0 0 auto;background-position:center;background-repeat:no-repeat;background-size:100% 100%;filter:drop-shadow(0 2px 2px #380000)}
.tc-double-board{padding:55px 28px 25px 31px;background-image:url('assets/triple/fresh/double-frame.png')}
.tc-triple-board{padding:72px 31px 25px 28px;background-image:url('assets/triple/fresh/triple-frame.png')}
.tc-board h2,.tc-singles-title{position:absolute;margin:0;color:#52ff42;background:linear-gradient(#091c0a,#000);border:3px solid #e8a71c;border-radius:12px;box-shadow:inset 0 0 7px #79ff67,0 2px 4px #3b0000;text-align:center;letter-spacing:2px;text-shadow:0 0 5px #00c218;font:900 21px/31px Arial}
.tc-double-board h2{top:3px;right:6%;width:44%}.tc-triple-board h2{top:3px;left:8%;width:44%}
.tc-number-grid{height:100%;display:grid;grid-template-columns:repeat(10,minmax(0,1fr));grid-template-rows:repeat(10,minmax(0,1fr));gap:2px}
.tc-number{position:relative;min-width:0;min-height:0;padding:0;border:1px solid #9a4300;border-radius:3px;box-shadow:inset 0 0 0 1px #ffe76b,0 1px 1px #5e1e00;cursor:pointer;overflow:visible;color:#170600;font:900 clamp(10px,1.16vw,17px)/1 Arial}
.tc-number.green{background:linear-gradient(#8affbf,#50e990)}.tc-number.pink{background:linear-gradient(#ffc1ed,#f592d4)}
.tc-number:hover{z-index:30;filter:brightness(1.06);box-shadow:inset 0 0 0 2px #fff8a0,0 0 5px #4a1300}
.tc-number.selected{z-index:3;background:linear-gradient(#f22a17 0 55%,#ffd95b 56% 100%)!important;border-color:#720000;box-shadow:inset 0 0 0 2px #ffbc00,0 0 3px #6b1700;filter:none}
.tc-number b{display:block}.tc-number small{position:absolute;right:0;bottom:0;min-width:15px;padding:1px 2px;border-radius:7px 0 0 0;background:#c10000;color:white;font:900 8px/1 Arial}
.tc-number.selected small{left:50%;right:auto;bottom:-1px;min-width:18px;height:16px;padding:0;transform:translateX(-50%);display:grid;place-items:center;border:1px solid #a54b00;border-radius:50% 50% 5px 5px;background:radial-gradient(circle at 45% 25%,#fff6a0,#ffc72d 58%,#c66b00);color:#160800;font-size:9px}
.tc-number-tooltip{display:none;position:absolute;z-index:60;left:calc(100% + 2px);top:-3px;width:62px;padding:4px 5px;border:1px solid #d0a223;border-radius:2px;background:linear-gradient(#222,#5b3b11 53%,#f2c244 54%,#ffe07e);box-shadow:0 2px 5px #250000;color:#fff;text-align:left;font:700 10px/13px Arial;pointer-events:none}
.tc-number-tooltip em,.tc-number-tooltip strong,.tc-number-tooltip i{display:block;font-style:normal}.tc-number-tooltip strong{color:#1b1104;text-align:center}.tc-number-tooltip i{color:#6b4900;text-align:center}
.tc-number:hover .tc-number-tooltip{display:block}
.tc-page-tabs{position:absolute;z-index:3;left:29px;right:31px;top:42px;height:26px;display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:2px}
.tc-page-tabs button{min-width:0;padding:0;border:1px solid #a84c00;background:linear-gradient(#e99539,#b64c17);color:#311100;font:900 clamp(8px,.85vw,13px)/1 Arial;cursor:pointer}
.tc-page-tabs button.active{color:white;background:#159935;box-shadow:inset 0 0 0 2px #9cff8b}
.tc-random{height:42px;flex:0 0 42px;margin:1px 21px 4px;padding:5px 7px;display:flex;align-items:center;gap:5px;border:4px solid #e8a51c;border-radius:7px;background:linear-gradient(#fff4a8,#f7c944);box-shadow:inset 0 0 0 2px #fff7b2,0 2px 3px #430000;overflow:hidden}
.tc-random strong{margin-right:auto;white-space:nowrap;font:900 clamp(9px,.9vw,13px)/1 Arial}
.tc-random button{width:31px;height:31px;flex:0 0 31px;padding:0;border:2px dashed #ff3686;border-radius:50%;background:radial-gradient(circle,#fffdf2 40%,#ff9bd0 43%,#ffec5c 72%);color:#5a0018;font:900 10px Arial;cursor:pointer}
.tc-random button:hover{transform:translateY(-1px);filter:brightness(1.15)}
.tc-history{height:91px;flex:0 0 91px;margin:0 20px 4px;padding:8px 12px;display:grid;grid-template-rows:repeat(3,1fr);border:4px solid #d98b11;border-radius:7px;background:linear-gradient(90deg,#fff0a4,#fffbd0);box-shadow:inset 0 0 0 2px #fff1a0;color:#2e1000;overflow:hidden}
.tc-history>div{display:grid;grid-template-columns:62px repeat(6,minmax(0,1fr));align-items:center;border-bottom:1px solid #d7a33f;font:900 clamp(9px,.76vw,12px)/1 Arial}.tc-history>div:last-child{border-bottom:0}.tc-history span{text-align:center}
.tc-score{height:49px;flex:0 0 49px;margin:0 20px;display:grid;grid-template-columns:1fr 1fr;border:4px solid #d98b11;border-radius:7px;background:linear-gradient(#fff7bd,#ffd84c);overflow:hidden;font:900 16px Arial}
.tc-score span{padding:0 13px;display:flex;align-items:center;justify-content:space-between}.tc-score span+span{background:#06233a;color:white}.tc-score b{color:#00d128;font-size:18px}
.tc-center{align-items:center;padding-top:0}
.tc-timer{height:58px;flex:0 0 58px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;z-index:4;color:#fff6ce;text-shadow:0 2px #5c0010;pointer-events:none}
.tc-timer span{font:italic 900 19px/21px Georgia,serif;letter-spacing:.2px}.tc-timer strong{font:1000 36px/36px Arial;color:#ffe430;text-shadow:0 2px #75000b}
.tc-wheel{width:min(100%,430px);height:min(58.5vh,430px);min-height:335px;flex:1 1 auto;display:grid;place-items:center;position:relative;margin-top:-2px;overflow:hidden}
.tc-wheel canvas{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 0 5px #ffca31)}
.tc-singles-title{position:relative;width:35%;height:26px;flex:0 0 26px;margin:-12px 0 2px;z-index:5;font-size:17px;line-height:24px}
.tc-single-grid{box-sizing:border-box;width:92%;height:54px;flex:0 0 54px;padding:7px 12px;display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:4px;border:5px solid #dca51d;border-radius:12px;background:linear-gradient(#fff49d,#c98217);box-shadow:inset 0 0 0 2px #fff5a2}
.tc-single-grid .tc-number{font-size:22px}
.tc-chips{box-sizing:border-box;width:76%;height:68px;flex:0 0 68px;margin-top:3px;padding:4px 7px;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:3px;border:5px solid #dca51d;border-radius:10px;background:#0b776f url('assets/triple/fresh/coin-frame.png') center/100% 100% no-repeat}
.tc-chips button{min-width:0;padding:0;border:0;border-radius:50%;background:transparent;cursor:pointer}.tc-chips img{display:block;width:100%;height:100%;object-fit:contain}.tc-chips button.selected{filter:drop-shadow(0 0 7px #6dff54);transform:scale(1.1)}
.tc-confirm{width:78%;height:34px;flex:0 0 34px;margin-top:3px;border:3px solid #e8a71c;border-radius:8px;background:linear-gradient(#a44135,#65150e);color:#fff5cb;text-shadow:0 1px #3c0000;font:900 14px Arial;cursor:pointer}.tc-confirm:disabled{filter:grayscale(.35);opacity:.88}
.tc-actions{height:151px;flex:1 1 auto;min-height:130px;margin:0 21px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:8px;padding:5px}
.tc-actions button{border:6px solid #d99b19;border-radius:10px;background:linear-gradient(#dcffd9,#38c43f 48%,#12921a);box-shadow:inset 0 0 0 3px #ffe668,0 2px 3px #3d0000;color:#082b0c;text-shadow:0 1px #dbffd7;font:900 clamp(14px,1.5vw,22px) Arial;cursor:pointer}.tc-actions button:hover{filter:brightness(1.13)}
.native-client .tc-screen{width:1365px;height:721px;min-height:721px}

@media (max-height:690px){
  html:not(.native-client) .tc-board{min-height:350px}html:not(.native-client) .tc-history{height:76px;flex-basis:76px}html:not(.native-client) .tc-score{height:42px;flex-basis:42px}html:not(.native-client) .tc-wheel{min-height:300px}html:not(.native-client) .tc-random{height:36px;flex-basis:36px}html:not(.native-client) .tc-actions{min-height:112px}
}

/* Triple Chance production rebuild: desktop follows the supplied PC cabinet,
   Android uses the original collapsible landscape cabinet. */
.tc-screen{position:relative}
.tc-mobile-only{display:none}
.tc-timer{flex-direction:row;justify-content:center;gap:7px;height:48px;flex-basis:48px}
.tc-timer span{font:900 30px/42px Arial,sans-serif;color:#fff12a}
.tc-timer strong{font:1000 34px/42px Arial,sans-serif;color:#fff12a}
.tc-wheel{width:min(100%,470px);height:min(62vh,470px);max-height:470px;overflow:visible}
.tc-wheel canvas{overflow:visible;filter:drop-shadow(0 0 7px #ffcb28)}
.tc-chips{grid-template-columns:repeat(7,minmax(0,1fr));background-image:url('assets/triple/original-production/chip-panel.png')}
.tc-actions button{background:#28a934 url('assets/triple/original-production/control-button.png') center/100% 100% no-repeat;border:4px solid #d99b19}

/* Android reference canvas: 1600x755 matches the supplied landscape captures. */
.android-app.native-client #app>.triple-stage{
  width:1600px;height:755px;min-height:755px;padding:0
}
.android-app .triple-stage .topbar{display:none!important}
.android-app .tc-screen{
  width:1600px!important;height:755px!important;min-height:755px!important;
  display:grid;grid-template-columns:260px 1fr 370px;gap:0;padding:0;
  background:#680009 url('assets/triple/fresh/background.jpg') center/cover no-repeat;
  overflow:hidden
}
.android-app .tc-desktop-only{display:none!important}
.android-app .tc-mobile-only{display:flex}
.android-app .tc-left,.android-app .tc-center,.android-app .tc-right{height:755px;min-height:0;padding:0;margin:0}

.android-app .tc-mobile-triggers{
  position:absolute;z-index:12;inset:0 auto 0 20px;width:232px;
  display:flex;align-items:stretch;gap:9px
}
.android-app .tc-mobile-triggers button{
  position:relative;width:72px;height:755px;padding:0;border:3px solid #f6c43e;border-radius:10px;background:#ae0707 url('assets/triple/original-production/mobile-number-trigger.png') center/100% 100% no-repeat;color:#fff;text-shadow:0 2px #510000;box-shadow:inset 0 0 0 4px #6b0000
}
.android-app .tc-mobile-triggers button.active{filter:brightness(1.18);box-shadow:0 0 12px #ffe14a!important}
.android-app .tc-mobile-triggers span,.android-app .tc-mobile-triggers strong{
  position:absolute;left:50%;writing-mode:vertical-rl;transform:translateX(-50%) rotate(180deg);white-space:nowrap;font:900 22px/1 Arial,sans-serif
}
.android-app .tc-mobile-triggers .tc-trigger-win{top:100px}.android-app .tc-mobile-triggers .tc-trigger-play{top:345px}
.android-app .tc-mobile-triggers strong{bottom:34px;font-size:24px;letter-spacing:1px}
.android-app .tc-mobile-triggers i{
  position:absolute;left:50%;top:510px;transform:translateX(-50%);width:0;height:0;border-top:14px solid transparent;border-bottom:14px solid transparent;border-left:22px solid #00f431;filter:drop-shadow(0 1px #006b13)
}
.android-app .tc-mobile-triggers button.active i{transform:translateX(-50%) rotate(180deg)}

.android-app .tc-mobile-bet-panel{
  position:absolute;z-index:20;left:82px;top:0;height:755px;width:875px;
  padding:58px 94px 52px 150px;background-position:center;background-repeat:no-repeat;background-size:100% 100%;
  filter:drop-shadow(3px 0 5px #290000)
}
.android-app .tc-mobile-bet-panel.double{background-image:url('assets/triple/original-production/mobile-double-panel.png')}
.android-app .tc-mobile-bet-panel.double{left:162px;width:795px;padding-left:92px}
.android-app .tc-mobile-bet-panel.triple{left:242px;width:875px;padding:62px 94px 52px 100px;background-image:url('assets/triple/original-production/mobile-triple-panel.png')}
.android-app .tc-mobile-bet-panel.single{
  left:82px;width:350px;padding:66px 18px 18px 58px;background:linear-gradient(90deg,#a85c0c,#e5b958 10%,#8b4906 12%,#351d06 95%);border:4px solid #ffc43f;border-radius:0 18px 18px 0
}
.android-app .tc-mobile-number-grid{
  width:100%;height:100%;display:grid;grid-template-columns:repeat(10,minmax(0,1fr));grid-template-rows:repeat(10,minmax(0,1fr));gap:3px
}
.android-app .tc-mobile-bet-panel.single .tc-mobile-number-grid{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(5,1fr);gap:8px}
.android-app .tc-mobile-number-grid .tc-number{font-size:22px;border:2px solid #9a4300;border-radius:4px}
.android-app .tc-mobile-bet-panel.single .tc-number{font-size:28px}
.android-app .tc-mobile-page-tabs{
  position:absolute;left:100px;right:94px;top:3px;height:52px;display:grid;grid-template-columns:repeat(10,1fr);gap:2px
}
.android-app .tc-mobile-page-tabs button{border:0;background:linear-gradient(#e8a63d,#b95708);color:#211000;font:900 20px Arial}
.android-app .tc-mobile-page-tabs button.active{background:#1aa534;color:white;box-shadow:inset 0 0 0 3px #7cff7c}
.android-app .tc-mobile-bet-panel>.tc-random{
  position:absolute;right:20px;top:60px;bottom:55px;width:62px;height:auto;margin:0;padding:0;display:flex;flex-direction:column;justify-content:space-around;border:0;background:transparent;box-shadow:none
}
.android-app .tc-mobile-bet-panel>.tc-random strong{display:none}
.android-app .tc-mobile-bet-panel>.tc-random button{width:60px;height:54px;flex:0 0 54px;border:0;border-radius:0;background:#ef0707;color:#fff;font-size:20px}

.android-app .tc-center{z-index:4;display:flex;align-items:center;justify-content:center}
.android-app .tc-center .tc-timer{display:none}
.android-app .tc-wheel{width:755px;height:755px;max-height:none;min-height:0;flex:0 0 755px;margin:0;overflow:visible}
.android-app .tc-wheel canvas{width:755px;height:755px;filter:drop-shadow(0 0 9px #ffbd2b)}

.android-app .tc-right{z-index:15;align-items:stretch;background:linear-gradient(90deg,#7c2200,#ae5704 30%,#7d2a00)}
.android-app .tc-mobile-console{height:755px;width:370px;padding:4px 12px 8px;display:flex;flex-direction:column;gap:7px;color:#fff}
.android-app .tc-mobile-console header{height:49px;display:grid;grid-template-columns:1fr 48px 48px;gap:5px}
.android-app .tc-mobile-console header button{border:3px solid #ffc94c;color:#fff;background:linear-gradient(#e22626,#9b0000);font:900 28px Arial;border-radius:50%}
.android-app .tc-mobile-console header .tc-mobile-place{border-radius:0;background:#341b08;color:#fff;font-size:18px}
.android-app .tc-mobile-history{height:121px;flex:0 0 121px;padding:6px 12px;background:linear-gradient(90deg,#321806,#170b03);border:3px solid #ad6411;display:grid;grid-template-rows:repeat(3,1fr)}
.android-app .tc-mobile-history-row{display:grid;grid-template-columns:repeat(10,1fr);align-items:center;text-align:center;font:900 20px Arial}
.android-app .tc-mobile-history-row span.latest{background:#f00000;color:#ffe91c;height:100%;display:grid;place-items:center}
.android-app .tc-mobile-score{height:96px;flex:0 0 96px;display:grid;grid-template-columns:1.35fr .85fr;grid-template-rows:1fr 1fr;background:#331b06;border:4px solid #c77d18;font:900 18px Arial}
.android-app .tc-mobile-score span{padding:0 10px;display:flex;align-items:center;justify-content:space-between;border-bottom:2px solid #a66014}.android-app .tc-mobile-score span:nth-child(2){grid-row:1/3;grid-column:2;border-left:3px solid #bd7618;flex-direction:column;justify-content:center}.android-app .tc-mobile-score span:nth-child(3){border-bottom:0;color:#80ff1e}.android-app .tc-mobile-score b{font-size:24px;color:#fff}
.android-app .tc-mobile-controls{position:relative;min-height:0;flex:1;display:grid;grid-template-columns:105px 1fr;gap:4px;padding:10px 9px;background:#a85b08 url('assets/triple/original-production/mobile-utility-panel.png') center/100% 100% no-repeat}
.android-app .tc-mobile-chip-stack{display:grid;grid-template-rows:repeat(7,1fr);place-items:center;min-height:0}
.android-app .tc-mobile-chip-stack button{width:62px;height:62px;padding:0;border:0;border-radius:50%;background:transparent}.android-app .tc-mobile-chip-stack img{width:100%;height:100%;object-fit:contain}.android-app .tc-mobile-chip-stack button.selected{transform:scale(1.12);filter:drop-shadow(0 0 7px #5dff42)}
.android-app .tc-mobile-actions{display:grid;grid-template-rows:repeat(3,1fr) 1.45fr;gap:8px;min-height:0;padding:3px}
.android-app .tc-mobile-actions>button{position:relative;border:4px solid #d99b19;border-radius:8px;background:#3ac447 url('assets/triple/original-production/control-button.png') center/100% 100% no-repeat;color:#071b04;font:900 25px Arial}
.android-app .tc-mobile-actions .tc-mobile-timer{display:flex;flex-direction:column;align-items:center;justify-content:center;background:#301d06 url('assets/triple/original-production/timer-panel.png') center/100% 100% no-repeat;color:#fff322}
.android-app .tc-mobile-timer b{font-size:58px;line-height:1}.android-app .tc-mobile-timer span{font-size:19px}.android-app .tc-mobile-timer.urgent b{color:#ff004d}
.android-app .game-popup-backdrop,.android-app .game-info-backdrop{z-index:90}

/* Android live-server shells use an explicit fitted canvas. The lobby gets a
   wide 1600x755 composition so every card and label remains visible. */
.android-app.native-client,.android-app.native-client body,.android-app.native-client #app{width:100%;height:100%;min-height:0;overflow:hidden;background:#000}
.android-app.native-client #app>.lobby-stage{width:1600px;height:755px;min-height:755px;padding:0}
.android-app.native-client .lobby-stage .topbar{width:1600px;height:58px;min-height:58px;padding:6px 14px}
.android-app.native-client .lobby-stage .topbar .welcome,.android-app.native-client .lobby-stage .topbar .check{display:none}
.android-app.native-client .lobby-stage .topbar .nav-button,.android-app.native-client .lobby-stage .topbar .window-button{min-height:44px;font-size:22px}
.android-app.native-client .lobby-stage .topbar .balance-label{height:44px;min-width:300px;font-size:22px}
.android-app.native-client .lobby-screen{height:697px;min-height:697px;padding:75px 50px 55px}
.android-app.native-client .lobby-cabinet{width:1480px;min-height:525px;padding:92px 70px 72px}
.android-app.native-client .lobby-cabinet::before{height:72px;top:-62px}
.android-app.native-client .lobby-games{grid-template-columns:repeat(4,minmax(0,1fr));gap:34px}
.android-app.native-client .lobby-game{width:100%;max-width:270px}
.android-app.native-client .lobby-thumb{height:220px}
.android-app.native-client .lobby-game strong{padding:13px 4px;font-size:24px}
.android-app.native-client .games-plaque{bottom:-45px;padding:12px 80px;font-size:28px}

/* v0.3.22 reference fidelity: Jeeto Joker and 16 Card use the same recorded
   1366x768 cabinet geometry and original result/footer treatment. */
.joker-stage,.lucky-stage{background:#ffb348 url('assets/lucky/bg.png') center/cover no-repeat}
.card-history-strip{height:76px;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px;overflow:hidden}
.card-history-result{min-width:0;height:76px;padding:2px 1px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#1b0800;border:2px solid #a81b17;border-radius:2px;background:linear-gradient(135deg,#530014 0 50%,#f55300 51% 100%);font-family:Georgia,serif;font-weight:1000;overflow:hidden}
.card-history-result b{font-size:1.65rem;line-height:1;color:#ffd429;text-shadow:0 2px #230000}.card-history-result small{margin-top:7px;color:#00ec27;font:900 .68rem/1 Arial,sans-serif;white-space:nowrap}
.lucky-info{position:absolute;z-index:12;left:14px;top:13px;width:45px;height:45px;padding:0;border:3px solid #fff;border-radius:50%;background:linear-gradient(#fa352a,#a80000);box-shadow:0 2px 4px #700;color:#fff;font:italic 900 30px/38px Georgia,serif;text-shadow:0 2px #620000}
.lucky-draw-time{position:absolute;right:4px;bottom:4px;color:#160800;font-size:.72rem;font-weight:900}
.reference-card-footer{grid-column:1/-1;position:relative;margin:0 -12px;padding:0!important;display:block!important;background:linear-gradient(90deg,#fff9accc,#d8e9ffdd)!important;border-top:3px solid #761414;overflow:hidden}
.reference-card-footer .joker-history{position:absolute;left:12px;top:8px;width:42%;height:76px}
.reference-card-footer .joker-balance{top:88px}
.reference-card-footer .joker-message{left:43%;top:8px;width:21%;height:76px}
.reference-card-footer>.chip-bar{position:absolute;left:13%;bottom:14px;width:51%;height:94px;padding:5px;gap:9px;justify-content:space-between}
.reference-card-footer>.chip-bar .asset-chip{width:72px;height:72px}
.reference-card-footer .joker-actions{left:69%;top:74px;width:18.5%}
.reference-card-footer .joker-timer{right:2%;top:73px;width:112px}

.native-client .joker-screen{grid-template-columns:64% 36%;grid-template-rows:514px 207px}
.native-client .lucky-stage{height:768px;min-height:768px}
.native-client .lucky-stage .topbar{height:47px;min-height:47px}
.native-client .lucky-screen{box-sizing:border-box;width:1365px;height:721px;min-height:721px;grid-template-columns:64% 36%;grid-template-rows:514px 207px;gap:0 10px;padding:6px 12px 0}
.native-client .lucky-board{padding:105px 20px 13px 218px;border-width:6px}
.native-client .lucky-board .limit-box{left:11px;top:8px;width:176px;height:91px;padding:1px 6px;font-size:.84rem;line-height:1.08}
.native-client .lucky-board .suit-heads{left:224px;right:20px;top:3px;height:91px;gap:22px}
.native-client .lucky-board .group-bet{min-height:0;height:91px;position:relative;flex-direction:row;border:0;box-shadow:inset 0 0 0 3px #d78d00}
.native-client .lucky-board .group-bet b{position:absolute;top:4px;left:0;right:0;text-align:center;font-size:.72rem}.native-client .lucky-board .group-bet i{font-size:3.1rem}.native-client .lucky-board .group-bet span{position:absolute;right:7px;bottom:18px;padding:8px 5px;font-size:.72rem}
.native-client .lucky-board .rank-heads{left:34px;top:125px;bottom:17px;width:142px;grid-template-rows:repeat(4,1fr);gap:8px}
.native-client .lucky-board .rank-bet{position:relative;display:block;border:0;box-shadow:inset 0 0 0 3px #d78d00}.native-client .lucky-board .rank-bet small{position:absolute;top:6px;left:0;right:0;text-align:center;font-size:.68rem}.native-client .lucky-board .rank-bet b{position:absolute;left:22px;bottom:5px;font-size:3.25rem}.native-client .lucky-board .rank-bet span{position:absolute;right:8px;bottom:22px;padding:9px 6px;font-size:.72rem}
.native-client .lucky-board .cards-grid{grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,minmax(0,1fr));gap:6px 25px}
.native-client .lucky-board .lucky-card{padding-bottom:30px}.native-client .lucky-board .lucky-card img,.native-client .lucky-board .css-card{width:64px;height:91px;max-height:calc(100% - 24px)}.native-client .lucky-board .lucky-card strong{min-width:69px;padding:9px 5px;font-size:.9rem}
.native-client .lucky-wheel-side{position:relative;display:block}
.native-client .lucky-wheel{position:absolute;left:50%;top:-13px;transform:translateX(-50%);width:540px;filter:drop-shadow(0 0 10px #ffef67)}
.native-client .lucky-logo{position:absolute;z-index:8;left:50%;top:392px;transform:translateX(-50%);width:360px;max-height:120px}
.native-client .lucky-result{background:#a30013;color:#ffe438}
.native-client .lucky-footer{min-height:207px;height:207px}
.native-client .lucky-footer .joker-message{display:grid}

/* Android Triple Chance reference console has six full-size stacked chips and
   a tall seconds panel. */
.android-app .tc-mobile-chip-stack{grid-template-rows:repeat(6,1fr)}
.android-app .tc-mobile-chip-stack button{width:68px;height:68px}
.android-app .tc-mobile-actions{grid-template-rows:72px 72px 72px minmax(150px,1fr);gap:9px}
.android-app .tc-mobile-actions>button{font-size:25px}
.android-app .tc-mobile-timer b{font-size:62px}
.tc-screen{background-color:#a90013;background-image:linear-gradient(90deg,rgba(255,0,0,.36),rgba(255,35,35,.12) 50%,rgba(225,0,0,.32)),url('assets/triple/fresh/background.jpg');background-blend-mode:screen,screen}
.android-app .tc-screen{background-color:#bd000c;background-image:linear-gradient(90deg,rgba(255,0,0,.42),rgba(255,45,45,.15) 50%,rgba(230,0,0,.38)),url('assets/triple/fresh/background.jpg');background-blend-mode:screen,screen}

/* v0.3.25: numbered animated Triple chips. The recovered production chip
   images are rings, so the denomination is rendered as a live center label. */
.tc-chips button,.tc-mobile-chip-stack button{position:relative;display:grid;place-items:center}
.tc-chips button b,.tc-mobile-chip-stack button b{position:absolute;z-index:3;inset:0;display:grid;place-items:center;color:#171717;font:900 clamp(9px,.9vw,14px)/1 Arial,sans-serif;text-shadow:0 1px #fff,0 0 2px #fff;pointer-events:none}
.tc-mobile-chip-stack button b{font-size:17px}
.tc-chips button.selected,.tc-mobile-chip-stack button.selected{animation:tripleChipPulse .72s ease-in-out infinite alternate;filter:drop-shadow(0 0 9px #7cff52);transform:scale(1.13)}
.tc-chips button.selected img,.tc-mobile-chip-stack button.selected img{animation:tripleChipSpin 1.8s linear infinite}
@keyframes tripleChipSpin{to{transform:rotate(360deg)}}
@keyframes tripleChipPulse{to{filter:drop-shadow(0 0 15px #efff43);transform:scale(1.2)}}

/* The supplied card screenshots use a blue selected ribbon and a real casino
   chip centered over the chosen card instead of a generic green glow. */
.lucky-card.selected{filter:none!important;box-shadow:none!important}
.lucky-board .lucky-card::after{content:"";position:absolute;z-index:1;bottom:13px;width:130px;height:38px;background:#c3002f;clip-path:polygon(0 20%,35% 20%,50% 0,65% 20%,100% 20%,87% 52%,100% 84%,62% 84%,50% 100%,38% 84%,0 84%,13% 52%)}
.lucky-card.selected::after{background:#0649c7!important;filter:drop-shadow(0 0 5px #66c9ff)}
.lucky-board .lucky-card>img,.lucky-board .lucky-card>.css-card{position:relative;z-index:2}
.lucky-board .lucky-card>strong{position:absolute;z-index:2;bottom:0}
.card-bet-chip{position:absolute!important;z-index:8!important;left:50%;top:50%;width:58px;height:58px;transform:translate(-50%,-53%);display:grid;place-items:center;border-radius:50%;background:var(--card-chip) center/contain no-repeat;filter:drop-shadow(0 2px 3px #430000);pointer-events:none;animation:cardChipDrop .28s cubic-bezier(.15,1.5,.35,1)}
.card-bet-chip b{display:grid;place-items:center;width:62%;height:62%;border-radius:50%;color:#151515;font:900 15px/1 Arial,sans-serif;text-shadow:0 1px #fff;background:#ffffff18}
.lucky-card.selected .card-bet-chip{animation:cardChipDrop .28s cubic-bezier(.15,1.5,.35,1),cardChipGlow .75s ease-in-out infinite alternate}
.group-bet.selected,.rank-bet.selected,.joker-suits button.selected,.joker-ranks button.selected{filter:none!important;box-shadow:inset 0 0 0 3px #d78d00,0 0 9px #248bff!important}
.group-bet .card-bet-chip,.rank-bet .card-bet-chip,.joker-suits .card-bet-chip,.joker-ranks .card-bet-chip{width:48px;height:48px;left:58%;top:58%}
@keyframes cardChipDrop{from{opacity:0;transform:translate(-50%,-80%) scale(.35)}}
@keyframes cardChipGlow{to{filter:drop-shadow(0 0 9px #8bdcff);transform:translate(-50%,-53%) scale(1.08)}}