/* mx-wheels v1.2 — X100 и Megawheel: единая яркая палитра (сектора, кнопки, чипы истории), подсветка выпавшего
   сектора и списки ставок v2 (аватар, сумма с монетой, результат-пилюля). Сам вид колёс (золотой обод, лампочки, указатель,
   красный центр Megawheel) — оригинальный. Разметку даёт x100.js v2.1 / megawheel.js v2.1. */

@keyframes mxwHit { from { stroke-width: 2; stroke-opacity: .55; } to { stroke-width: 5; stroke-opacity: 1; } }

/* ======================= X100 ======================= */
html body .x1-page .x1-tile.x1-st1 { fill: #3b82f6; }
html body .x1-page .x1-tile.x1-st2 { fill: #f5b700; }
html body .x1-page .x1-tile.x1-st3 { fill: #22c55e; }
html body .x1-page .x1-tile.x1-st4 { fill: #8b5cf6; }
html body .x1-page .x1-tile.x1-st5 { fill: #f97316; }
html body .x1-page .x1-tile.x1-st6 { fill: #ef4444; }
html body .x1-page .x1-tile.hit { stroke: #fff; stroke-width: 3; filter: url(#x1glow); animation: mxwHit .8s ease-in-out infinite alternate; }
html body .x1-page .x1-tx1 { color: #3b82f6; }
html body .x1-page .x1-tx2 { color: #f5b700; }
html body .x1-page .x1-tx3 { color: #22c55e; }
html body .x1-page .x1-tx4 { color: #8b5cf6; }
html body .x1-page .x1-tx5 { color: #f97316; }
html body .x1-page .x1-tx6 { color: #ef4444; }
/* ---- x1-page: палитра кнопок / чипов истории / квадратов ---- */
html body .x1-page .x1-bg1 { background: linear-gradient(135deg, #2563eb, #60a5fa); }
html body .x1-page .x1-bg2 { background: linear-gradient(135deg, #e0a100, #ffd54a); }
html body .x1-page .x1-bg3 { background: linear-gradient(135deg, #16a34a, #4ade80); }
html body .x1-page .x1-bg4 { background: linear-gradient(135deg, #7c3aed, #b794ff); }
html body .x1-page .x1-bg5 { background: linear-gradient(135deg, #ea580c, #fdba74); }
html body .x1-page .x1-bg6 { background: linear-gradient(135deg, #dc2626, #fb8a8a); }
/* ---- x1-page: список ставок v2 ---- */
html body .x1-page .x1-list--v2 .x1-row { background: rgba(255,255,255,.035); border: 1px solid rgba(255,255,255,.07); border-radius: 16px; margin-bottom: 8px; overflow: hidden; transition: border-color .2s, box-shadow .2s; }
html body .x1-page .x1-list--v2 .x1-row.hit { border-color: rgba(245,197,24,.8); box-shadow: 0 0 0 1px rgba(245,197,24,.28), 0 8px 24px rgba(245,197,24,.14); }
html body .x1-page .x1-list--v2 .x1-row__head { display: flex; align-items: center; gap: 10px; padding: 10px 12px 10px 10px; }
html body .x1-page .x1-list--v2 .x1-sq { width: 50px; height: 36px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; box-shadow: 0 4px 12px rgba(0,0,0,.25); }
html body .x1-page .x1-list--v2 .x1-sq b { color: #fff !important; -webkit-text-fill-color: #fff !important; font-weight: 800; font-size: 13px; letter-spacing: .2px; text-shadow: 0 1px 2px rgba(0,0,0,.25); }
html body .x1-page .x1-list--v2 .x1-users { flex: 1 1 auto; display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: 13px; opacity: .85; }
html body .x1-page .x1-list--v2 .x1-users i { opacity: .55; margin: 0; }
html body .x1-page .x1-list--v2 .x1-sum { font-weight: 800; font-size: 15px; letter-spacing: -.2px; gap: 5px; }
html body .x1-page .x1-list--v2 .x1-chev { width: 28px; height: 28px; border-radius: 50%; background: rgba(255,255,255,.06); display: inline-flex; align-items: center; justify-content: center; font-size: 11px; opacity: .85; transition: transform .25s, background .2s; }
html body .x1-page .x1-list--v2 .x1-row.open .x1-chev { transform: rotate(180deg); background: rgba(255,255,255,.12); }
html body .x1-page .x1-list--v2 .x1-row__body { border-top: 1px solid rgba(255,255,255,.06); padding: 4px 10px 10px; background: rgba(0,0,0,.14); }
html body .x1-page .x1-list--v2 .x1-empty { font-size: 13px; opacity: .55; padding: 10px 4px; text-align: center; }
html body .x1-page .x1-list--v2 .x1-bet { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto auto; align-items: center; gap: 10px; padding: 7px 4px; border-bottom: 1px solid rgba(255,255,255,.05); font-size: 13px; }
html body .x1-page .x1-list--v2 .x1-bet:last-of-type { border-bottom: 0; }
html body .x1-page .x1-list--v2 .x1-bet__ava, html body.light-theme .x1-page .x1-list--v2 .x1-bet__ava { width: 28px; height: 28px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff !important; -webkit-text-fill-color: #fff !important; font-weight: 800; font-size: 12px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.18); }
html body .x1-page .x1-list--v2 .x1-bet__u { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html body .x1-page .x1-list--v2 .x1-bet__a { font-weight: 700; display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
html body .x1-page .x1-list--v2 .x1-bet__w { min-width: 60px; text-align: center; padding: 4px 8px; border-radius: 999px; font-weight: 800; font-size: 12px; background: rgba(255,255,255,.06); color: #9aa3b8 !important; -webkit-text-fill-color: #9aa3b8 !important; white-space: nowrap; }
html body .x1-page .x1-list--v2 .x1-bet.is-win .x1-bet__w { background: rgba(34,197,94,.16); color: #4ade80 !important; -webkit-text-fill-color: #4ade80 !important; }
html body .x1-page .x1-list--v2 .x1-bet.is-lose .x1-bet__w { background: rgba(239,68,68,.12); color: #f87171 !important; -webkit-text-fill-color: #f87171 !important; }
html body .x1-page .x1-list--v2 .x1-bet.is-lose .x1-bet__u, html body .x1-page .x1-list--v2 .x1-bet.is-lose .x1-bet__a { opacity: .55; }
html body .x1-page .x1-list--v2 .x1-more { margin-top: 8px; border-radius: 12px; }
html body.light-theme .x1-page .x1-list--v2 .x1-row { background: #f5f6fa; border-color: #e6e9f2; }
html body.light-theme .x1-page .x1-list--v2 .x1-chev { background: rgba(0,0,0,.06); }
html body.light-theme .x1-page .x1-list--v2 .x1-row__body { background: rgba(0,0,0,.03); border-top-color: rgba(0,0,0,.06); }
html body.light-theme .x1-page .x1-list--v2 .x1-bet { border-bottom-color: rgba(0,0,0,.06); }
html body.light-theme .x1-page .x1-list--v2 .x1-bet__w { background: rgba(0,0,0,.06); color: #6b7280 !important; -webkit-text-fill-color: #6b7280 !important; }
html body.light-theme .x1-page .x1-list--v2 .x1-bet.is-win .x1-bet__w { background: rgba(34,197,94,.14); color: #15803d !important; -webkit-text-fill-color: #15803d !important; }
html body.light-theme .x1-page .x1-list--v2 .x1-bet.is-lose .x1-bet__w { background: rgba(239,68,68,.12); color: #b91c1c !important; -webkit-text-fill-color: #b91c1c !important; }


/* ======================= Megawheel ======================= */
html body .mw-page .mw-sec.hit { stroke: #fff; stroke-width: 4; filter: url(#mwglow); animation: mxwHit .8s ease-in-out infinite alternate; }
html body .mw-page .mw-st1 { fill: #3b82f6; stroke: #3b82f6; }
html body .mw-page .mw-st2 { fill: #f5b700; stroke: #f5b700; }
html body .mw-page .mw-st3 { fill: #8b5cf6; stroke: #8b5cf6; }
html body .mw-page .mw-st4 { fill: #ec4899; stroke: #ec4899; }
html body .mw-page .mw-st5 { fill: #84cc16; stroke: #84cc16; }
html body .mw-page .mw-st6 { fill: #10b981; stroke: #10b981; }
html body .mw-page .mw-st7 { fill: #f97316; stroke: #f97316; }
html body .mw-page .mw-st8 { fill: #ef4444; stroke: #ef4444; }
html body .mw-page .mw-tile.hit { stroke: #fff !important; stroke-width: 5; filter: url(#mwglow); }
html body .mw-page .mw-tx1 { color: #3b82f6; }
html body .mw-page .mw-tx2 { color: #f5b700; }
html body .mw-page .mw-tx3 { color: #8b5cf6; }
html body .mw-page .mw-tx4 { color: #ec4899; }
html body .mw-page .mw-tx5 { color: #84cc16; }
html body .mw-page .mw-tx6 { color: #10b981; }
html body .mw-page .mw-tx7 { color: #f97316; }
html body .mw-page .mw-tx8 { color: #ef4444; }
/* ---- mw-page: палитра кнопок / чипов истории / квадратов ---- */
html body .mw-page .mw-bg1 { background: linear-gradient(135deg, #2563eb, #60a5fa); }
html body .mw-page .mw-bg2 { background: linear-gradient(135deg, #e0a100, #ffd54a); }
html body .mw-page .mw-bg3 { background: linear-gradient(135deg, #6d28d9, #a78bfa); }
html body .mw-page .mw-bg4 { background: linear-gradient(135deg, #db2777, #f9a8d4); }
html body .mw-page .mw-bg5 { background: linear-gradient(135deg, #65a30d, #bef264); }
html body .mw-page .mw-bg6 { background: linear-gradient(135deg, #059669, #34d399); }
html body .mw-page .mw-bg7 { background: linear-gradient(135deg, #ea580c, #fdba74); }
html body .mw-page .mw-bg8 { background: linear-gradient(135deg, #dc2626, #fb8a8a); }
/* ---- mw-page: список ставок v2 ---- */
html body .mw-page .mw-list--v2 .mw-row { background: rgba(255,255,255,.035); border: 1px solid rgba(255,255,255,.07); border-radius: 16px; margin-bottom: 8px; overflow: hidden; transition: border-color .2s, box-shadow .2s; }
html body .mw-page .mw-list--v2 .mw-row.hit { border-color: rgba(245,197,24,.8); box-shadow: 0 0 0 1px rgba(245,197,24,.28), 0 8px 24px rgba(245,197,24,.14); }
html body .mw-page .mw-list--v2 .mw-row__head { display: flex; align-items: center; gap: 10px; padding: 10px 12px 10px 10px; }
html body .mw-page .mw-list--v2 .mw-sq { width: 50px; height: 36px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; box-shadow: 0 4px 12px rgba(0,0,0,.25); }
html body .mw-page .mw-list--v2 .mw-sq b { color: #fff !important; -webkit-text-fill-color: #fff !important; font-weight: 800; font-size: 13px; letter-spacing: .2px; text-shadow: 0 1px 2px rgba(0,0,0,.25); }
html body .mw-page .mw-list--v2 .mw-users { flex: 1 1 auto; display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: 13px; opacity: .85; }
html body .mw-page .mw-list--v2 .mw-users i { opacity: .55; margin: 0; }
html body .mw-page .mw-list--v2 .mw-sum { font-weight: 800; font-size: 15px; letter-spacing: -.2px; gap: 5px; }
html body .mw-page .mw-list--v2 .mw-chev { width: 28px; height: 28px; border-radius: 50%; background: rgba(255,255,255,.06); display: inline-flex; align-items: center; justify-content: center; font-size: 11px; opacity: .85; transition: transform .25s, background .2s; }
html body .mw-page .mw-list--v2 .mw-row.open .mw-chev { transform: rotate(180deg); background: rgba(255,255,255,.12); }
html body .mw-page .mw-list--v2 .mw-row__body { border-top: 1px solid rgba(255,255,255,.06); padding: 4px 10px 10px; background: rgba(0,0,0,.14); }
html body .mw-page .mw-list--v2 .mw-empty { font-size: 13px; opacity: .55; padding: 10px 4px; text-align: center; }
html body .mw-page .mw-list--v2 .mw-bet { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto auto; align-items: center; gap: 10px; padding: 7px 4px; border-bottom: 1px solid rgba(255,255,255,.05); font-size: 13px; }
html body .mw-page .mw-list--v2 .mw-bet:last-of-type { border-bottom: 0; }
html body .mw-page .mw-list--v2 .mw-bet__ava, html body.light-theme .mw-page .mw-list--v2 .mw-bet__ava { width: 28px; height: 28px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff !important; -webkit-text-fill-color: #fff !important; font-weight: 800; font-size: 12px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.18); }
html body .mw-page .mw-list--v2 .mw-bet__u { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html body .mw-page .mw-list--v2 .mw-bet__a { font-weight: 700; display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
html body .mw-page .mw-list--v2 .mw-bet__w { min-width: 60px; text-align: center; padding: 4px 8px; border-radius: 999px; font-weight: 800; font-size: 12px; background: rgba(255,255,255,.06); color: #9aa3b8 !important; -webkit-text-fill-color: #9aa3b8 !important; white-space: nowrap; }
html body .mw-page .mw-list--v2 .mw-bet.is-win .mw-bet__w { background: rgba(34,197,94,.16); color: #4ade80 !important; -webkit-text-fill-color: #4ade80 !important; }
html body .mw-page .mw-list--v2 .mw-bet.is-lose .mw-bet__w { background: rgba(239,68,68,.12); color: #f87171 !important; -webkit-text-fill-color: #f87171 !important; }
html body .mw-page .mw-list--v2 .mw-bet.is-lose .mw-bet__u, html body .mw-page .mw-list--v2 .mw-bet.is-lose .mw-bet__a { opacity: .55; }
html body .mw-page .mw-list--v2 .mw-more { margin-top: 8px; border-radius: 12px; }
html body.light-theme .mw-page .mw-list--v2 .mw-row { background: #f5f6fa; border-color: #e6e9f2; }
html body.light-theme .mw-page .mw-list--v2 .mw-chev { background: rgba(0,0,0,.06); }
html body.light-theme .mw-page .mw-list--v2 .mw-row__body { background: rgba(0,0,0,.03); border-top-color: rgba(0,0,0,.06); }
html body.light-theme .mw-page .mw-list--v2 .mw-bet { border-bottom-color: rgba(0,0,0,.06); }
html body.light-theme .mw-page .mw-list--v2 .mw-bet__w { background: rgba(0,0,0,.06); color: #6b7280 !important; -webkit-text-fill-color: #6b7280 !important; }
html body.light-theme .mw-page .mw-list--v2 .mw-bet.is-win .mw-bet__w { background: rgba(34,197,94,.14); color: #15803d !important; -webkit-text-fill-color: #15803d !important; }
html body.light-theme .mw-page .mw-list--v2 .mw-bet.is-lose .mw-bet__w { background: rgba(239,68,68,.12); color: #b91c1c !important; -webkit-text-fill-color: #b91c1c !important; }

@media (prefers-reduced-motion: reduce) {
  html body .x1-page .x1-tile.hit, html body .mw-page .mw-sec.hit { animation: none !important; }
}
/* ---- PC (>=1024): цветной квадрат с множителем виден и здесь ---- */
@media (min-width: 1024px) {
  html body .x1-page .x1-list--v2 .x1-sq { display: inline-flex !important; width: 46px !important; height: 30px !important; border-radius: 9px !important; }
  html body .x1-page .x1-list--v2 .x1-sq b { font-size: 12px; }
  html body .x1-page .x1-list--v2 .x1-row__body { padding: 6px 10px 10px !important; }
  html body .mw-page .mw-list--v2 .mw-sq { width: 46px !important; height: 30px !important; border-radius: 9px !important; }
  html body .mw-page .mw-list--v2 .mw-sq b { font-size: 12px; }
}
