/* 🎲 DICE ekranı (v64 PROTOTİP) - sahibin göndərdiyi mobil referans üslubu.
   Şəkillər/səslər sonra gələcək; hazırda təmiz CSS. */
#dcScreen{position:fixed; inset:0; z-index:8900; display:none;
  flex-direction:column; overflow:hidden;
  padding:8px 14px calc(12px + env(safe-area-inset-bottom,0px));
  background:linear-gradient(180deg, #10151d, #0a0e14 55%, #080b10);
  color:#e8eaed; font-family:inherit}
#dcScreen.on{display:flex}
@media (min-width:700px){
  #dcScreen{width:520px; margin:0 auto;
    border-left:1px solid rgba(255,255,255,.09);
    border-right:1px solid rgba(255,255,255,.09);
    box-shadow:0 0 70px rgba(0,0,0,.75)}
}

.dctop{display:flex; align-items:center; gap:10px; flex:none; padding:2px 0 4px}
#dcBack{background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.2);
  color:#fff; border-radius:10px; padding:5px 12px; font-size:15px;
  font-weight:800; cursor:pointer; -webkit-tap-highlight-color:transparent}
#dcBack:active{transform:scale(.94)}
.dctitle{font-size:26px; font-weight:900; letter-spacing:4px; color:#fff;
  margin-left:auto; margin-right:auto; text-shadow:0 2px 6px rgba(0,0,0,.6)}
.dctitle canvas{height:40px; width:auto; display:block}   /* v64.1: loqo */
#dcSnd{background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.2);
  color:#fff; border-radius:10px; padding:5px 10px; font-size:14px;
  cursor:pointer; -webkit-tap-highlight-color:transparent}
.dcpf{font-size:13px; opacity:.5}

/* son atışlar lenti */
#dcHist{flex:none; display:flex; gap:6px; padding:6px 0; overflow:hidden;
  justify-content:center; min-height:34px}
.dch{padding:4px 9px; border-radius:999px; font-size:12px; font-weight:900;
  flex:none; background:#20242c; color:#9aa0ab}
.dch.w{background:#ffd75e; color:#231a02}

/* orta: nəticə + xətt */
#dcMid{flex:1; min-height:0; display:flex; flex-direction:column;
  justify-content:center; gap:18px}
#dcRoll{text-align:center; font-size:44px; font-weight:900; min-height:56px;
  letter-spacing:1px; color:#6b7280; transition:color .15s;
  text-shadow:0 2px 8px rgba(0,0,0,.5)}
#dcRoll.w{color:#5fe09a; text-shadow:0 0 18px rgba(95,224,154,.45)}
#dcRoll.l{color:#ff5f6b; text-shadow:0 0 18px rgba(255,95,107,.35)}

#dcTrackWrap{position:relative; padding:26px 6px 30px}
.dcscale{position:absolute; top:0; left:6px; right:6px; height:16px;
  font-size:11px; font-weight:800; color:#9aa0ab}
.dcscale span{position:absolute; transform:translateX(-50%)}
#dcTrack{position:relative; height:16px; border-radius:10px;
  background:#20242c; box-shadow:inset 0 2px 5px rgba(0,0,0,.6),
  0 0 0 5px #171b22, 0 0 0 6px rgba(255,255,255,.06)}
#dcFillL,#dcFillR{position:absolute; top:3px; bottom:3px; border-radius:7px}
#dcFillL{left:4px; background:#e5163c}
#dcFillR{right:4px; background:#35d15c}
#dcKnob{position:absolute; top:50%; width:34px; height:34px;
  transform:translate(-50%,-50%) rotate(45deg); border-radius:8px;
  background:linear-gradient(135deg, #8b32e6, #5c1fa8);
  border:2px solid #ffd75e; box-shadow:0 3px 10px rgba(0,0,0,.6);
  pointer-events:none; display:flex; align-items:center; justify-content:center}
#dcKnob i{transform:rotate(-45deg); font-style:normal; font-size:15px;
  color:#ffd75e; font-weight:900; letter-spacing:-1px}
#dcTgt{position:absolute; top:calc(100% + 2px); transform:translateX(-50%);
  font-size:13px; font-weight:900; color:#ffd75e}
#dcMark{position:absolute; bottom:calc(100% + 3px); transform:translateX(-50%);
  font-size:12px; font-weight:900; color:#fff; opacity:0; transition:opacity .2s;
  background:#20242c; padding:2px 7px; border-radius:7px;
  box-shadow:0 2px 6px rgba(0,0,0,.5)}
#dcMark::after{content:""; position:absolute; top:100%; left:50%;
  transform:translateX(-50%); border:5px solid transparent; border-top-color:#20242c}
#dcMark.on{opacity:1}
#dcMark.w{background:#1d5c38; }
#dcMark.l{background:#7a1420}
#dcMark.w::after{border-top-color:#1d5c38}
#dcMark.l::after{border-top-color:#7a1420}
#dcRange{position:absolute; inset:-10px 0; width:100%; height:36px; top:50%;
  transform:translateY(-50%); opacity:0; cursor:pointer; margin:0;
  touch-action:none}

/* ödəniş / şans qutuları */
#dcInfo{display:flex; gap:10px; justify-content:center}
#dcInfo > div{flex:1; max-width:190px; text-align:center;
  background:#171b22; border:1px solid rgba(255,255,255,.1);
  border-radius:12px; padding:8px 6px}
#dcInfo span{display:block; font-size:10.5px; font-weight:800;
  letter-spacing:1.5px; color:#9aa0ab; margin-bottom:3px}
#dcInfo b{font-size:19px; font-weight:900; color:#fff}

/* atışı çevir */
#dcFlip{margin:0 auto; display:flex; flex-direction:column; align-items:center;
  gap:5px; background:none; border:0; color:#c6cbd3; font-size:11.5px;
  font-weight:800; letter-spacing:1px; cursor:pointer;
  -webkit-tap-highlight-color:transparent}
#dcFlip em{font-style:normal; width:44px; height:44px; border-radius:50%;
  background:#fff; color:#10151d; display:flex; align-items:center;
  justify-content:center; font-size:20px; box-shadow:0 3px 8px rgba(0,0,0,.5)}
#dcFlip:active em{transform:scale(.9)}
#dcHintTxt{text-align:center; font-size:12px; font-weight:800;
  letter-spacing:1px; color:#8a919c}

/* alt panel */
#dcBottom{flex:none; display:flex; flex-direction:column; gap:9px; padding-top:8px}
#dcStat{display:flex; gap:8px}
#dcStat > div{flex:1; text-align:center; background:#12161d;
  border:1px solid rgba(255,255,255,.08); border-radius:12px; padding:6px 4px}
#dcStat span{display:block; font-size:10px; font-weight:800; letter-spacing:1.5px;
  color:#9aa0ab}
#dcStat b{font-size:17px; font-weight:900; color:#fff}
#dcWin.up{color:#5fe09a}
#dcBetRow{display:flex; align-items:center; gap:10px}
.dcstep{width:52px; height:48px; border-radius:12px; border:0; flex:none;
  background:#20242c; color:#fff; font-size:17px; font-weight:900;
  cursor:pointer; -webkit-tap-highlight-color:transparent}
.dcstep:active{transform:scale(.93)}
/* v66.2: mərc sahəsi ƏLLƏ yazıla bilən inputdur (min 0.10 ₼) */
#dcBetWrap{flex:1; position:relative}
#dcBet{width:100%; box-sizing:border-box; text-align:center; font-size:22px;
  font-weight:900; color:#fff; font-family:inherit; outline:none;
  background:#12161d; border:1px solid rgba(255,255,255,.1);
  border-radius:12px; padding:9px 34px 9px 4px; -moz-appearance:textfield}
#dcBet:focus{border-color:rgba(111,224,154,.55)}
#dcBet::-webkit-outer-spin-button,#dcBet::-webkit-inner-spin-button{
  -webkit-appearance:none; margin:0}
#dcBetWrap span{position:absolute; right:14px; top:50%;
  transform:translateY(-50%); font-size:18px; font-weight:900; color:#9aa0ab;
  pointer-events:none}
#dcPlay{height:56px; border-radius:14px; border:0; font-size:19px;
  font-weight:900; letter-spacing:2px; color:#08210f; cursor:pointer;
  background:linear-gradient(180deg, #6fe09a, #2fb862);
  box-shadow:0 4px 12px rgba(47,184,98,.35), 0 4px 10px rgba(0,0,0,.4);
  -webkit-tap-highlight-color:transparent}
#dcPlay:active{transform:scale(.98)}
#dcPlay.dis{opacity:.4; pointer-events:none}
#dcMsg{min-height:16px; text-align:center; font-size:12.5px; color:#ff8a8a}