/* «الروليت الروسي»: صالةُ رهانٍ خافتة — خشبٌ ومخمل أحمر وذهب (٢٠٢٦/١٠/٠٤) */
.xg-rr .xg{background:#0d0705}
.rr{position:relative;overflow:hidden}
.rr-scene{position:absolute;inset:0;z-index:0}
.rr-scene canvas{position:absolute;inset:0;width:100%!important;height:100%!important;display:block}
.rr > .xg-head{position:relative;z-index:2;pointer-events:none}
.xg-rr .xg-title b{color:#fff;text-shadow:0 0 .4em #ffd23a,0 .08em 0 #0b0716}
.xg-rr .xg-title small{color:#ffe9a8}
.xg-rr .xg-chip{background:rgba(11,7,22,.7);border-color:#ffd23a66;color:#ffe9a8}
.xg-rr .xg-clock{background:conic-gradient(#ffd23a calc(var(--p) * 360deg),rgba(255,255,255,.1) 0)}
.xg-rr .xg-clock::before{background:#0b0716}
.rr-stage{position:relative;z-index:1;flex:1;min-height:0;pointer-events:none}
.rr-side{position:absolute;top:0;inset-inline-end:0;width:clamp(210px,21cqw,320px);max-height:100%;overflow:hidden;pointer-events:auto;
  padding:2cqh 1.2cqw;border-radius:2.4cqh;background:rgba(18,10,30,.72);border:2px solid #ff3fa455;backdrop-filter:blur(6px)}
.rr-side h3{text-align:center;color:#ff9fd0}
.rr-side ol li{box-shadow:inset 4px 0 0 var(--c)}
.rr-side ol li.cur{background:color-mix(in srgb,var(--c) 26%,rgba(255,255,255,.06))}
.rr-side ol li.out{opacity:.5}
.rr-side ol li.out b{color:#ff8a8a}
.rr-side ol li.aim{box-shadow:inset 4px 0 0 var(--c),inset 0 0 0 2px #ff4d5e}
.rr-side ol li b{color:#ffd23a}
.rr-ammo{font-style:normal;color:#ffd23a;letter-spacing:.08em;font-size:.8em}
.rr-num{font-style:normal;min-width:1.6em;text-align:center;padding:.05em .3em;border-radius:.4em;background:var(--c);color:#fff;font-weight:900}
.rr-risk{position:absolute;top:0;inset-inline-start:0;display:flex;flex-direction:column;align-items:center;gap:.5cqh;padding:1.6cqh 1.6cqw;border-radius:2.4cqh;
  background:rgba(18,10,30,.72);border:2px solid #ffd23a55;color:#fff;text-align:center}
.rr-risk:empty{display:none}
.rr-risk small{font-size:max(12px,2cqh);color:#ffe9a8}
.rr-risk b{font-size:max(26px,6cqh);line-height:1;color:#ffd23a;text-shadow:0 0 .3em #ffd23a88}
.rr-cyl{display:flex;gap:.5cqw}
.rr-cyl i{width:max(14px,2.6cqh);height:max(14px,2.6cqh);border-radius:50%;background:#3fd2ff;box-shadow:inset 0 0 0 3px #12081c}
.rr-cyl i.used{background:#2a1d3d}
.rr-cyl i.next{background:#ffd23a;box-shadow:0 0 10px #ffd23a,inset 0 0 0 3px #12081c}
.rr-turn{position:absolute;z-index:3;left:50%;bottom:3cqh;transform:translateX(-50%);display:flex;align-items:center;gap:1em;
  padding:.6em 1.4em .6em .7em;border-radius:99px;background:rgba(255,250,240,.95);color:#1c1a14;box-shadow:0 1.2em 2.4em rgba(0,0,0,.5)}
.rr-turn:empty{display:none}
.rr-turn p{margin:0;font-size:max(16px,3.3cqh);font-weight:800}
.rr-turn p b{color:#d6246e}
.rr-who{display:flex;align-items:center;gap:.4em;padding:.15em .8em .15em .2em;border-radius:99px;background:#fff;box-shadow:0 0 0 3px var(--c)}
.rr-who b{font-size:max(17px,3.4cqh);font-weight:900}
.rr-who .av{width:max(30px,5.4cqh)!important;height:max(30px,5.4cqh)!important}
.rr-labels{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:1}
.rr-tag{position:absolute;left:0;top:0;display:flex;align-items:center;gap:.35em;padding:.18em .7em .18em .22em;border-radius:99px;white-space:nowrap;
  background:rgba(15,8,24,.8);color:#fff;font-weight:900;font-size:max(12px,2.2cqh);box-shadow:0 0 0 2px var(--c)}
.rr-tag .av{width:max(20px,3.2cqh)!important;height:max(20px,3.2cqh)!important}
.rr-tag.cur{font-size:max(15px,3cqh);background:var(--c);color:#12081c}
.rr-tag em{font-style:normal;font-weight:900;min-width:1.5em;text-align:center;padding:0 .3em;border-radius:.4em;background:var(--c);color:#fff}
.rr-tag.cur em{background:#12081c}
.rr-tag.aim{background:#ff4d5e;color:#fff;font-size:max(15px,3cqh);box-shadow:0 0 0 3px #fff,0 0 18px #ff4d5e}
.rr-tag.out{opacity:.55;box-shadow:0 0 0 2px #888}
.rr-pop{position:absolute;left:0;top:0;font-weight:900;pointer-events:none;z-index:6;white-space:nowrap;-webkit-text-stroke:3px #12081c;paint-order:stroke}
.rr-pop.click{font-size:max(26px,6cqh);color:#dfe6ff}
.rr-pop.bang{font-size:max(40px,11cqh);color:#ffd23a;text-shadow:0 0 .3em #ff7a2f}
/* الشاشاتُ العموديّة (جوال/آيباد): قائمةُ اللاعبين تُخفى — أرقامُهم وأسماؤهم فوق رؤوسهم —
   وعدّادُ المسدس يصغر فلا يغطّي العجلة */
@media (max-aspect-ratio:1/1){
  .rr-side{display:none}
  .rr-risk{padding:1cqh 2cqw;gap:.3cqh}
  .rr-risk b{font-size:max(20px,3.6cqh)}
  .rr-risk small{font-size:max(10px,1.5cqh)}
  .rr-cyl i{width:max(11px,1.8cqh);height:max(11px,1.8cqh)}
  .rr-turn{max-width:94%;padding:.45em 1em .45em .5em;bottom:2cqh}
  .rr-turn p{font-size:max(14px,2.2cqh)}
  .rr-who b{font-size:max(15px,2.4cqh)}
  .rr-tag{font-size:max(11px,1.6cqh)}
}

/* ══ إعادة التصميم ٢٠٢٦/١٠/٠٤ ══ */
.xg-rr .xg-title b{text-shadow:0 0 .4em #ffb347,0 .08em 0 #0d0705}
.rr-side{background:rgba(20,10,6,.74);border-color:#e8b54a55}
.rr-side h3{color:#ffd27a}
.rr-risk{background:rgba(20,10,6,.78);border-color:#e8b54a77;min-width:clamp(150px,13cqw,210px)}
.rr-risk b{font-size:max(30px,7cqh)}
.rr-risk b.hot{color:#ff5a3c;text-shadow:0 0 .35em #ff5a3c;animation:rrHot 1s ease-in-out infinite}
@keyframes rrHot{50%{transform:scale(1.08)}}
.rr-rev{width:max(70px,13cqh);height:max(70px,13cqh);filter:drop-shadow(0 .4em .8em rgba(0,0,0,.5))}
.rr-rev g{transform-origin:50px 50px;transition:transform .9s cubic-bezier(.3,1.5,.5,1)}
.rr-rev .body{fill:#2c2f3a;stroke:#e8b54a;stroke-width:3}
.rr-rev circle:not(.body):not(.pin){fill:#0a0a0d;stroke:#596075;stroke-width:2}
.rr-rev circle.used{fill:#3b3f4d;stroke:#3b3f4d}
.rr-rev circle.next{fill:#ffd23a;stroke:#fff;stroke-width:2.5;filter:drop-shadow(0 0 4px #ffd23a)}
.rr-rev .pin{fill:#e8b54a}
.rr-rev .mark{fill:#ffd23a}
.rr-count{position:absolute;inset:0;z-index:5;display:grid;place-items:center;pointer-events:none}
.rr-count:empty{display:none}
.rr-count b{font-size:max(90px,26cqh);font-weight:900;color:#fff;-webkit-text-stroke:5px #3a0606;paint-order:stroke;text-shadow:0 0 .25em #ff5a3c;opacity:0;transform:scale(1.8)}
.rr-count b.go{animation:rrCount .66s cubic-bezier(.2,1.4,.4,1) forwards}
@keyframes rrCount{0%{opacity:0;transform:scale(1.8)}30%{opacity:1;transform:scale(1)}80%{opacity:1}100%{opacity:0;transform:scale(.85)}}
.rr-white{position:absolute;inset:0;z-index:7;background:#fff;opacity:0;pointer-events:none}
.rr-white.on{animation:rrWhite .45s ease-out forwards}
@keyframes rrWhite{0%{opacity:.9}100%{opacity:0}}
.rr-vig{position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;transition:opacity .4s;background:radial-gradient(ellipse at center,transparent 35%,rgba(0,0,0,.85) 100%)}
.rr-tag{transition:opacity .3s}
.rr-pop.click{font-size:max(34px,8cqh);color:#dfe6ff}
.rr-pop.bang{font-size:max(56px,14cqh);color:#ffd23a;text-shadow:0 0 .3em #ff5a3c}