/* WIND GAME «Джекпот» JX1 (2026-10-25): page layout + drum. All rules are scoped to body.jx1 and use the jx- prefix,
   so the older .jp-* layers of the site do not touch them. Moving parts: transform / opacity only. */
body.jx1{--jx-red:#e11d48;--jx-red-hi:#ff4d6d;--jx-red-lo:#9f1239;--jx-gold:#ffd65a;--jx-card:#141317;--jx-card2:#1b1a1f;--jx-line:rgba(225,29,72,.32);--jx-text:#f5f1ec;--jx-mute:#a9a2a6;--jx-tile:168px;--jx-gap:12px;--jx-ava:124px;--jx-drum-h:250px}
body.jx1 .jx-root{display:block;min-height:620px;margin:6px 0 0;color:var(--jx-text);font-variant-numeric:tabular-nums}
body.jx1 .jx-root *{box-sizing:border-box}
body.jx1 .jx-root button{font:inherit;cursor:pointer}

/* ---- rooms ---- */
body.jx1 .jx-topline{display:flex;align-items:stretch;gap:10px;margin:0 0 10px}
body.jx1 .jx-rooms{flex:1 1 auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;min-width:0}
body.jx1 .jx-room{position:relative;display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:10px;padding:8px 12px;min-height:58px;border-radius:14px;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,#19181d,#111014);color:var(--jx-text);text-align:left;transition:border-color .15s,background-color .15s}
body.jx1 .jx-room:hover{border-color:var(--jx-red)}
body.jx1 .jx-room.is-active{border-color:var(--jx-red);background:linear-gradient(180deg,#3a0d1b,#1a0a10);box-shadow:inset 0 0 0 1px rgba(255,77,109,.35)}
body.jx1 .jx-room.is-active .jx-room-pot{color:#ffe08a!important}
body.jx1 .jx-room.is-active .jx-room-timer,body.jx1 .jx-room.is-active .jx-room-t b{color:#fff!important}
body.jx1 .jx-room.is-mine::after{content:"";position:absolute;top:6px;right:6px;width:8px;height:8px;border-radius:50%;background:var(--jx-gold);box-shadow:0 0 0 2px #1a0a10}
body.jx1 .jx-room.is-locked{opacity:.7}
body.jx1 .jx-room-ico{width:36px;height:36px;display:grid;place-items:center}
body.jx1 .jx-room-ico svg{width:32px;height:32px}
body.jx1 .jx-room-t{display:flex;flex-direction:column;min-width:0;line-height:1.15}
body.jx1 .jx-room-t b{font-size:14px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.jx1 .jx-room-pot{font-size:13px;font-weight:700;color:var(--jx-gold);margin-top:2px}
body.jx1 .jx-room-r{display:flex;flex-direction:column;align-items:flex-end;gap:3px}
body.jx1 .jx-room-timer{font-size:13px;font-weight:800;color:#fff;white-space:nowrap}
body.jx1 .jx-room.is-hot .jx-room-timer{color:var(--jx-red-hi)}
body.jx1 .jx-room-pl{display:inline-flex;align-items:center;gap:5px;padding:2px 8px;border-radius:99px;background:rgba(255,255,255,.07);font-size:11px;font-weight:700;color:#d9d2d6;white-space:nowrap}
body.jx1 .jx-room-pl em{font-style:normal}
body.jx1 .jx-room-pl i,body.jx1 .jx-online i{position:relative;width:7px;height:7px;border-radius:50%;background:#6b6b70;flex:none}
body.jx1 .jx-room.is-live .jx-room-pl i,body.jx1 .jx-online i{background:#22c55e}
body.jx1 .jx-room.is-live .jx-room-pl i::after,body.jx1 .jx-online i::after{content:"";position:absolute;inset:-3px;border-radius:50%;background:#22c55e;opacity:.5;animation:jx-ping 1.6s ease-out infinite}
@keyframes jx-ping{from{transform:scale(.6);opacity:.55}to{transform:scale(2.1);opacity:0}}
body.jx1 .jx-online{flex:none;display:inline-flex;align-items:center;gap:8px;padding:0 14px;border-radius:14px;border:1px solid rgba(34,197,94,.35);background:rgba(34,197,94,.08);font-size:13px;font-weight:700;color:#bbf7d0;white-space:nowrap}
body.jx1 .jx-online[hidden]{display:none}

/* ---- bank / timer ---- */
body.jx1 .jx-stage{padding:10px 14px 0;border-radius:16px 16px 0 0;border:1px solid var(--jx-line);border-bottom:0;background:radial-gradient(120% 140% at 50% 0,#2a0b16 0,#141317 60%)}
body.jx1 .jx-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
body.jx1 .jx-pot{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
body.jx1 .jx-lbl{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--jx-mute);font-weight:800}
body.jx1 #jp-pot{font-size:clamp(28px,3.4vw,42px);font-weight:900;line-height:1;letter-spacing:-.02em;color:#fff;text-shadow:0 2px 18px rgba(255,214,90,.25)}
body.jx1 .jx-bonus{padding:4px 10px;border-radius:99px;background:linear-gradient(180deg,var(--jx-red),var(--jx-red-lo));font-size:12px;font-weight:800;color:#fff}
body.jx1 .jx-bonus[hidden]{display:none}
body.jx1 .jx-prize{flex:1 1 220px;margin:0;font-size:13px;font-weight:600;color:#e8dfe3;line-height:1.3}
body.jx1 .jx-time{margin-left:auto;display:flex;align-items:baseline;gap:10px}
body.jx1 #jp-phase{font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:800;color:var(--jx-mute)}
body.jx1 #jp-clock{min-width:64px;text-align:right;font-size:30px;font-weight:900;color:#fff;line-height:1}
body.jx1 .jx-stage[data-ph=betting] #jp-clock{color:var(--jx-gold)}
body.jx1 .jx-stage[data-ph=spin] #jp-clock{color:var(--jx-red-hi)}
body.jx1 .jx-timeline{height:4px;margin:10px 0 0;border-radius:4px;background:rgba(255,255,255,.08);overflow:hidden}
body.jx1 .jx-timeline i{display:block;height:100%;background:linear-gradient(90deg,var(--jx-red-lo),var(--jx-red-hi));transform-origin:0 50%;transform:scaleX(0);will-change:transform}
body.jx1 .jx-timeline i.is-hot{animation:jx-hot .5s ease-in-out infinite alternate}
@keyframes jx-hot{to{opacity:.45}}

/* ---- the drum (full width) ---- */
body.jx1 .jx-drum{position:relative;max-width:none;margin-bottom:14px}
body.jx1 .jx-window{position:relative;height:var(--jx-drum-h);overflow:hidden;contain:layout paint;isolation:isolate;
  background:radial-gradient(60% 120% at 50% 50%,rgba(225,29,72,.22),transparent 70%),repeating-linear-gradient(90deg,rgba(255,255,255,.025) 0 2px,transparent 2px 90px),linear-gradient(180deg,#0b0a0d,#17080e 50%,#0b0a0d);
  border-top:1px solid rgba(255,77,109,.45);border-bottom:1px solid rgba(255,77,109,.45);box-shadow:inset 0 18px 30px -18px #000,inset 0 -18px 30px -18px #000}
body.jx1 .jx-track{position:absolute;left:0;top:0;bottom:0;display:flex;align-items:center;gap:var(--jx-gap);padding:0;will-change:transform;transform:translate3d(0,0,0);backface-visibility:hidden}
body.jx1 .jx-tile{position:relative;flex:0 0 var(--jx-tile);height:calc(var(--jx-drum-h) - 26px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;border-radius:18px;
  background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.08);border-bottom:3px solid var(--c,#555);contain:layout paint style}
body.jx1 .jx-tile.is-ghost{opacity:.35;border-bottom-color:#333}
body.jx1 .jx-face{position:relative;display:inline-grid;place-items:center;flex:none;width:32px;height:32px;border-radius:50%;overflow:hidden;background:var(--bg,#222);box-shadow:0 0 0 2px var(--c,#555)}
body.jx1 .jx-face img{width:100%;height:100%;object-fit:cover;display:block;border-radius:50%}
body.jx1 .jx-face.is-letter b{font-size:15px;font-weight:900;color:#fff}
body.jx1 .jx-face-big{width:var(--jx-ava);height:var(--jx-ava);box-shadow:0 0 0 4px var(--c,#555),0 10px 24px rgba(0,0,0,.55)}
body.jx1 .jx-face-big.is-letter b{font-size:calc(var(--jx-ava) * .42)}
body.jx1 .jx-tn{max-width:calc(var(--jx-tile) - 14px);font-size:15px;font-weight:800;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.jx1 .jx-tp{position:absolute;top:8px;right:8px;padding:2px 7px;border-radius:99px;background:rgba(0,0,0,.55);font-size:11px;font-style:normal;font-weight:800;color:var(--jx-gold)}
body.jx1 .jx-tile.is-win{z-index:2;transform:scale(1.07);border-color:var(--jx-gold);border-bottom-color:var(--jx-gold);background:linear-gradient(180deg,rgba(255,214,90,.25),rgba(225,29,72,.18));transition:transform .45s cubic-bezier(.2,1.6,.4,1)}
body.jx1 .jx-tile.is-win::after{content:"";position:absolute;inset:-2px;border-radius:18px;box-shadow:0 0 0 2px var(--jx-gold),0 0 34px 6px rgba(255,214,90,.55);animation:jx-glow 1s ease-in-out infinite alternate;pointer-events:none}
@keyframes jx-glow{from{opacity:.45}to{opacity:1}}
body.jx1 .jx-tile.is-near-miss{opacity:.8}
body.jx1 .jx-almost{position:absolute;top:-2px;left:50%;transform:translate(-50%,0) rotate(-6deg);padding:3px 10px;border-radius:8px;background:#fff;color:var(--jx-red-lo);font-size:13px;font-style:normal;font-weight:900;text-transform:uppercase;box-shadow:0 4px 14px rgba(0,0,0,.5);animation:jx-pop .5s cubic-bezier(.2,1.6,.4,1) both}
body.jx1 .jx-window.is-done .jx-tile:not(.is-win):not(.is-near-miss){opacity:.45;transition:opacity .6s}
body.jx1 .jx-shade{position:absolute;inset:0;pointer-events:none;z-index:3;background:linear-gradient(90deg,#0b0a0d 0,rgba(11,10,13,0) 16%,rgba(11,10,13,0) 84%,#0b0a0d 100%)}
body.jx1 .jx-fx{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:4}
body.jx1 .jx-marker{position:absolute;left:50%;top:0;bottom:0;width:0;z-index:5;pointer-events:none}
body.jx1 .jx-marker i{position:absolute;left:-2px;top:0;bottom:0;width:4px;border-radius:2px;background:linear-gradient(180deg,var(--jx-gold),#fff 50%,var(--jx-gold));box-shadow:0 0 14px 2px rgba(255,214,90,.7)}
body.jx1 .jx-marker::before,body.jx1 .jx-marker::after{content:"";position:absolute;left:-13px;border:13px solid transparent}
body.jx1 .jx-marker::before{top:-2px;border-top:16px solid var(--jx-gold);filter:drop-shadow(0 2px 4px #000)}
body.jx1 .jx-marker::after{bottom:-2px;border-bottom:16px solid var(--jx-gold);filter:drop-shadow(0 -2px 4px #000)}
body.jx1 .jx-window.is-final .jx-marker i{animation:jx-hot .18s linear infinite alternate}
body.jx1 .jx-empty{position:absolute;inset:0;z-index:6;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;padding:0 16px;background:rgba(8,8,10,.55)}
body.jx1 .jx-empty[hidden]{display:none}
body.jx1 .jx-empty b{font-size:22px;font-weight:900;color:#fff}
body.jx1 .jx-empty span{font-size:14px;color:#d8cfd3}
body.jx1 .jx-count{position:absolute;left:50%;top:50%;z-index:7;transform:translate(-50%,-50%);font-size:88px;font-weight:900;color:#fff;text-shadow:0 0 30px rgba(225,29,72,.9),0 6px 0 var(--jx-red-lo);pointer-events:none;white-space:nowrap}
body.jx1 .jx-count.pop{animation:jx-count .9s cubic-bezier(.2,1.4,.4,1) both}
@keyframes jx-count{from{transform:translate(-50%,-50%) scale(1.8);opacity:0}25%{opacity:1}to{transform:translate(-50%,-50%) scale(1);opacity:.9}}
body.jx1 .jx-banner{position:absolute;left:calc(50% + var(--jx-tile) * .56 + 14px);top:50%;translate:0 -50%;z-index:8;display:flex;align-items:center;gap:14px;max-width:calc(50% - var(--jx-tile) * .56 - 28px);padding:14px 22px 14px 14px;border-radius:20px;
  background:linear-gradient(180deg,rgba(26,10,16,.96),rgba(12,8,10,.96));border:1px solid var(--jx-gold);box-shadow:0 18px 50px rgba(0,0,0,.7),0 0 40px rgba(255,214,90,.25);transform-origin:0 50%;animation:jx-in .5s cubic-bezier(.2,1.5,.4,1) both}
@keyframes jx-in{from{transform:scale(.6);opacity:0}to{transform:scale(1);opacity:1}}
body.jx1 .jx-banner[hidden]{display:none}
body.jx1 .jx-banner.is-me{background:linear-gradient(180deg,#5c0d22,#1d070e);box-shadow:0 18px 50px rgba(0,0,0,.7),0 0 60px rgba(225,29,72,.6)}
body.jx1 .jx-face-ban{width:72px;height:72px;box-shadow:0 0 0 3px var(--jx-gold)}
body.jx1 .jx-banner div{display:flex;flex-direction:column;min-width:0;line-height:1.2}
body.jx1 .jx-banner div>span{font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:800;color:var(--jx-gold)}
body.jx1 .jx-banner b{font-size:22px;font-weight:900;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.jx1 .jx-banner em{font-style:normal;font-size:24px;font-weight:900;color:#4ade80}
body.jx1 .jx-banner small{font-size:12px;color:#cfc6ca}
@keyframes jx-pop{from{transform:translate(-50%,-50%) scale(.6);opacity:0}to{transform:translate(-50%,-50%) scale(1);opacity:1}}
body.jx1 .jx-almost{animation-name:jx-pop2}
@keyframes jx-pop2{from{transform:translate(-50%,0) rotate(-6deg) scale(.4);opacity:0}to{transform:translate(-50%,0) rotate(-6deg) scale(1);opacity:1}}
body.jx1 .jx-share{display:flex;height:6px;gap:2px;margin:0;overflow:hidden}
body.jx1 .jx-share i{display:block;min-width:3px}

/* ---- under the drum ---- */
body.jx1 .jx-below{display:grid;grid-template-columns:minmax(300px,380px) minmax(0,1fr);grid-template-areas:"bet players" "wins fair";gap:12px;align-items:start}
body.jx1 .jx-bet{grid-area:bet}
body.jx1 .jx-players{grid-area:players}
body.jx1 .jx-wins{grid-area:wins}
body.jx1 .jx-fair{grid-area:fair}
body.jx1 .jx-card{min-width:0;padding:12px 14px 14px;border-radius:16px;border:1px solid var(--jx-line);background:linear-gradient(180deg,var(--jx-card2),var(--jx-card))}
body.jx1 .jx-card-h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 10px}
body.jx1 .jx-card h2{margin:0;font-size:13px;letter-spacing:.1em;text-transform:uppercase;font-weight:900;color:#fff}
body.jx1 .jx-card-h small{font-size:12px;font-weight:700;color:var(--jx-mute)}
body.jx1 .jx-bal{font-size:12px;color:var(--jx-mute);font-weight:700}
body.jx1 .jx-bal b{color:#fff;font-size:14px;margin-left:4px}

/* chips: one red-black style */
body.jx1 .jx-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 10px}
body.jx1 .jx-chip{position:relative;width:54px;height:54px;padding:0;border-radius:50%;border:0;display:grid;place-items:center;color:#fff;font-weight:900;font-size:13px;
  background:radial-gradient(circle at 50% 50%,var(--cc) 0 52%,transparent 53%),repeating-conic-gradient(#fff 0 12deg,var(--cc) 12deg 45deg),var(--cc);
  box-shadow:0 0 0 2px var(--ce),inset 0 0 0 5px var(--cc),0 4px 0 var(--ce),0 6px 14px rgba(0,0,0,.45);transition:transform .12s}
body.jx1 .jx-chip span{position:relative;z-index:1;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:1.5px dashed rgba(255,255,255,.55);font-size:12px;line-height:1;letter-spacing:-.02em}
body.jx1 .jx-chip.is-red{--cc:#d3133f;--ce:#7d0b26}
body.jx1 .jx-chip.is-black{--cc:#1d1c21;--ce:#000}
body.jx1 .jx-chip:hover{transform:translateY(-2px)}
body.jx1 .jx-chip.is-on{transform:translateY(-3px);box-shadow:0 0 0 3px var(--jx-gold),inset 0 0 0 5px var(--cc),0 4px 0 var(--ce),0 0 18px rgba(255,214,90,.5)}
body.jx1 .jx-amount{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;gap:8px;align-items:center}
body.jx1 .jx-step{height:44px;border-radius:12px;border:1px solid rgba(255,255,255,.14);background:#1f1d23;color:#fff;font-size:22px;font-weight:800;line-height:1}
body.jx1 .jx-step:hover{border-color:var(--jx-red)}
body.jx1 .jx-input{position:relative;display:block;margin:0}
body.jx1 .jx-input input{width:100%;height:44px;padding:0 34px 0 14px;border-radius:12px;border:1px solid rgba(255,255,255,.16);background:#0d0c10;color:#fff;font-size:18px;font-weight:800;outline:none}
body.jx1 .jx-input input:focus{border-color:var(--jx-red);box-shadow:0 0 0 3px rgba(225,29,72,.25)}
body.jx1 .jx-input span{position:absolute;right:12px;top:50%;transform:translateY(-50%);font-weight:900;color:var(--jx-mute)}
body.jx1 .jx-tools{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:8px 0 10px}
body.jx1 .jx-tools button{height:32px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:#18171b;color:#e9e2e6;font-size:13px;font-weight:800}
body.jx1 .jx-tools button:hover{border-color:var(--jx-red);color:#fff}
body.jx1 .jx-go{display:block;width:100%;min-height:52px;border:0;border-radius:14px;background:linear-gradient(180deg,var(--jx-red-hi),var(--jx-red) 45%,var(--jx-red-lo));color:#fff;font-size:17px;font-weight:900;letter-spacing:.01em;box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 4px 0 #6d0c22,0 10px 24px rgba(225,29,72,.35)}
body.jx1 .jx-go:disabled{cursor:default;filter:saturate(.35) brightness(.7);box-shadow:inset 0 1px 0 rgba(255,255,255,.15)}
body.jx1 .jx-go:not(:disabled):active{transform:translateY(2px)}
body.jx1 .jx-withdraw{display:block;width:100%;margin:8px 0 0;min-height:40px;border-radius:12px;border:1px solid rgba(255,255,255,.35);background:transparent;color:#fff;font-weight:800}
body.jx1 .jx-withdraw[hidden]{display:none}
body.jx1 .jx-mine{margin:10px 0 0;font-size:13px;color:#e6dde1}
body.jx1 .jx-mine:empty,body.jx1 .jx-msg:empty{display:none}
body.jx1 .jx-mine b{color:var(--jx-gold)}
body.jx1 .jx-hint{color:var(--jx-gold);font-weight:700}
body.jx1 .jx-msg{margin:8px 0 0;padding:8px 10px;border-radius:10px;background:rgba(225,29,72,.12);font-size:13px;color:#ffd7df}
body.jx1 .jx-limits{margin:8px 0 0;font-size:11.5px;line-height:1.35;color:var(--jx-mute)}

/* lists */
body.jx1 .jx-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px;max-height:372px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}
body.jx1 .jx-pl-head{display:grid;grid-template-columns:minmax(0,1fr) 110px 64px;padding:0 10px 4px 52px;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;font-weight:800;color:#7e777b}
body.jx1 .jx-pl-head span:not(:first-child){text-align:right}
body.jx1 .jx-pl,body.jx1 .jx-h{position:relative;display:grid;grid-template-columns:32px minmax(0,1fr) 110px 64px;align-items:center;gap:10px;min-height:44px;padding:5px 10px;border-radius:10px;background:#18171c;overflow:hidden;isolation:isolate}
body.jx1 .jx-h{grid-template-columns:32px minmax(0,1fr) auto;cursor:pointer}
body.jx1 .jx-h:hover{background:#211f26}
body.jx1 .jx-pl::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--c);opacity:.16;transform-origin:0 50%;transform:scaleX(var(--p,0))}
body.jx1 .jx-pl.is-me{background:#2a0c17;box-shadow:inset 0 0 0 1px var(--jx-red)}
body.jx1 .jx-pl.is-winner{box-shadow:inset 0 0 0 1px var(--jx-gold);background:#2a220c}
body.jx1 .jx-pl-n{display:flex;align-items:center;flex-wrap:wrap;gap:2px 6px;min-width:0;line-height:1.2}
body.jx1 .jx-pl-n b{min-width:0;max-width:100%;font-size:14px;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.jx1 .jx-pl-n small{font-size:11px;color:var(--jx-mute)}
body.jx1 .jx-h .jx-pl-n{flex-direction:column;align-items:flex-start;flex-wrap:nowrap}
body.jx1 .jx-you,body.jx1 .jx-wtag{padding:1px 6px;border-radius:6px;background:var(--jx-red);color:#fff!important;font-weight:900;font-size:10px!important;letter-spacing:.06em}
body.jx1 .jx-wtag{background:var(--jx-gold);color:#2a1a00!important}
body.jx1 .jx-tk{flex-basis:100%;font-size:11px}
body.jx1 .jx-pl-s{text-align:right;font-size:14px;font-weight:800;color:#fff;white-space:nowrap}
body.jx1 .jx-pl-c{text-align:right;font-size:14px;font-weight:900;color:var(--jx-gold)}
body.jx1 .jx-h-win{font-size:14px;font-weight:900;color:#4ade80;white-space:nowrap}
body.jx1 .jx-h-win.is-ref{color:var(--jx-mute)}
body.jx1 .jx-none{padding:10px;border-radius:10px;background:#18171c;font-size:13px;color:var(--jx-mute);text-align:center}
body.jx1 .jx-fair dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 12px;margin:0;font-size:12px}
body.jx1 .jx-fair dt{color:var(--jx-mute);font-weight:700}
body.jx1 .jx-fair dd{margin:0;color:#fff;word-break:break-all}
body.jx1 .jx-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:11.5px}
body.jx1 #jp-p-status.ok{color:#4ade80}
body.jx1 #jp-p-status.bad{color:#f87171}
body.jx1 .jx-fair-note{margin:10px 0 0;font-size:11.5px;line-height:1.4;color:var(--jx-mute)}
dialog.jx-dialog{width:min(560px,94vw);max-height:86vh;overflow:auto;padding:18px;border-radius:18px;border:1px solid rgba(225,29,72,.45);background:#141317;color:#f5f1ec}
dialog.jx-dialog::backdrop{background:rgba(0,0,0,.65)}
dialog.jx-dialog h2{margin:0 0 6px;font-size:18px}
dialog.jx-dialog p{font-size:13px;color:#d8cfd3}
dialog.jx-dialog .jx-x{position:absolute;right:12px;top:10px;width:34px;height:34px;border-radius:50%;border:0;background:#26232b;color:#fff;font-size:20px;cursor:pointer}
dialog.jx-dialog .jx-list{list-style:none;padding:0;display:flex;flex-direction:column;gap:4px}
dialog.jx-dialog .jx-pl{position:relative;display:grid;grid-template-columns:32px minmax(0,1fr) auto 60px;gap:10px;align-items:center;padding:6px 10px;border-radius:10px;background:#1c1b20}
dialog.jx-dialog .jx-pl.is-winner{box-shadow:inset 0 0 0 1px #ffd65a}
dialog.jx-dialog .jx-face{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;overflow:hidden;background:var(--bg,#222);box-shadow:0 0 0 2px var(--c,#555)}
dialog.jx-dialog .jx-face img{width:100%;height:100%;object-fit:cover}
dialog.jx-dialog .jx-pl-n{display:flex;flex-direction:column;min-width:0}
dialog.jx-dialog .jx-pl-n small{font-size:11px;color:#a9a2a6}
dialog.jx-dialog .jx-pl-c{color:#ffd65a;font-weight:800;text-align:right}
dialog.jx-dialog .jx-small{font-size:11px;word-break:break-all}

/* ---- light theme: panels light, the drum stays a dark casino band ---- */
html[data-theme=light] body.jx1{--jx-card:#ffffff;--jx-card2:#fbf7f8;--jx-text:#1b1a1f;--jx-mute:#6f666b;--jx-line:rgba(225,29,72,.28)}
html[data-theme=light] body.jx1 .jx-room{background:#fff;color:#1b1a1f;border-color:#e6dfe2}
html[data-theme=light] body.jx1 .jx-room.is-active{background:linear-gradient(180deg,#e11d48,#9f1239);border-color:var(--jx-red);color:#fff}
html[data-theme=light] body.jx1 .jx-room-timer{color:#1b1a1f}
html[data-theme=light] body.jx1 .jx-room-pot{color:#b45309}
html[data-theme=light] body.jx1 .jx-room-pl{background:#f1ecee;color:#3f3a3d}
html[data-theme=light] body.jx1 .jx-stage{background:linear-gradient(180deg,#fff1f4,#fff)}
html[data-theme=light] body.jx1 #jp-pot,html[data-theme=light] body.jx1 #jp-clock{color:#1b1a1f;text-shadow:none}
html[data-theme=light] body.jx1 .jx-prize{color:#3f3a3d}
html[data-theme=light] body.jx1 .jx-card h2,html[data-theme=light] body.jx1 .jx-bal b,html[data-theme=light] body.jx1 .jx-pl-n b,html[data-theme=light] body.jx1 .jx-pl-s,html[data-theme=light] body.jx1 .jx-fair dd{color:#1b1a1f}
html[data-theme=light] body.jx1 .jx-pl,html[data-theme=light] body.jx1 .jx-h,html[data-theme=light] body.jx1 .jx-none{background:#f6f2f3}
html[data-theme=light] body.jx1 .jx-pl.is-me{background:#ffe4ea}
html[data-theme=light] body.jx1 .jx-pl-c{color:#b45309}
html[data-theme=light] body.jx1 .jx-step,html[data-theme=light] body.jx1 .jx-tools button{background:#fff;color:#1b1a1f;border-color:#ddd5d8}
html[data-theme=light] body.jx1 .jx-input input{background:#fff;color:#1b1a1f;border-color:#ddd5d8}
html[data-theme=light] body.jx1 .jx-mine{color:#3f3a3d}
html[data-theme=light] body.jx1 .jx-mine b{color:#b45309}
html[data-theme=light] body.jx1 .jx-msg{color:#9f1239}
html[data-theme=light] body.jx1 .jx-online{color:#166534}

/* ---- narrower content / phones ---- */
@media (max-width:1100px){
  body.jx1 .jx-below{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}
@media (max-width:760px){
  body.jx1{--jx-tile:118px;--jx-gap:8px;--jx-ava:82px;--jx-drum-h:180px}
  body.jx1 .jx-topline{flex-direction:column;gap:6px}
  body.jx1 .jx-online{align-self:flex-start;min-height:28px;padding:0 10px;font-size:12px}
  body.jx1 .jx-rooms{gap:6px}
  body.jx1 .jx-room{grid-template-columns:minmax(0,1fr);grid-template-areas:"t" "r";gap:4px;padding:7px 8px;min-height:0}
  body.jx1 .jx-room-ico{display:none}
  body.jx1 .jx-room-t b{font-size:12.5px}
  body.jx1 .jx-room-pot{font-size:12px}
  body.jx1 .jx-room-r{flex-direction:column;align-items:flex-start;gap:3px;min-width:0}
  body.jx1 .jx-room-pl{max-width:100%;overflow:hidden}
  body.jx1 .jx-room-timer{font-size:12px}
  body.jx1 .jx-room-pl{padding:1px 6px;font-size:10px}
  body.jx1 .jx-stage{padding:8px 10px 0}
  body.jx1 .jx-head{gap:4px 10px}
  body.jx1 .jx-prize{order:3;flex-basis:100%;font-size:12px}
  body.jx1 #jp-clock{font-size:24px;min-width:0}
  body.jx1 .jx-tn{font-size:12.5px}
  body.jx1 .jx-tp{top:5px;right:5px;font-size:10px;padding:1px 5px}
  body.jx1 .jx-count{font-size:64px}
  body.jx1 .jx-banner{left:8px;right:8px;top:auto;bottom:8px;translate:none;max-width:none;gap:10px;padding:8px 12px 8px 8px;transform-origin:50% 100%}
  body.jx1 .jx-face-ban{width:40px;height:40px}
  body.jx1 .jx-banner small{display:none}
  body.jx1 .jx-banner div{flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:0 8px}
  body.jx1 .jx-banner div>span{flex-basis:100%}
  body.jx1 .jx-banner b{font-size:16px;max-width:55%}
  body.jx1 .jx-banner em{font-size:17px}
  body.jx1 .jx-below{grid-template-columns:minmax(0,1fr);grid-template-areas:"bet" "players" "wins" "fair"}
  body.jx1 .jx-pl{grid-template-columns:30px minmax(0,1fr) auto 56px;gap:8px}
  body.jx1 .jx-pl-head{grid-template-columns:minmax(0,1fr) auto 56px;padding-left:48px}
  body.jx1 .jx-chip{width:50px;height:50px}
  body.jx1 .jx-chip span{width:31px;height:31px;font-size:11px}
}
@media (prefers-reduced-motion:reduce){
  body.jx1 .jx-tile.is-win::after,body.jx1 .jx-room-pl i::after,body.jx1 .jx-online i::after{animation:none}
}
html[data-theme=light] body.jx1 .jx-stage[data-ph=betting] #jp-clock{color:#b45309}
