:root {
  --bg: #08090b;
  --surface: #0e1014;
  --surface-2: #15181d;
  --line: #242831;
  --text: #f4f5f7;
  --muted: #878d98;
  --accent: #67e8b9;
  --danger: #d4636f;
  --shadow: 0 18px 48px rgba(0, 0, 0, 0.38);
  --border: var(--line);
  --panel: #0e1014;
  --panel-2: #111419;
  --accent-2: var(--accent);
}

* { box-sizing: border-box; }

body {
  margin: 0;
  min-height: 100vh;
  color: var(--text);
  font-family: "Montserrat", "Segoe UI", Arial, sans-serif;
  background: var(--bg);
}

a { color: var(--text); }
button, input {
  font: inherit;
}

.miniapp-shell {
  padding: 18px 18px 110px;
}

.rakes-app {
  min-height: 100vh;
  overflow-x: hidden;
  padding: max(14px, env(safe-area-inset-top)) 14px max(18px, env(safe-area-inset-bottom));
  background: #08090b;
  color: var(--text);
}

.sheet {
  position: fixed;
  inset: 0;
  display: grid;
  align-items: end;
  padding: 10px;
  background: rgba(0, 0, 0, 0.58);
  z-index: 60;
}

.sheet.hidden {
  display: none;
}

.sheet-card.compact-sheet {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #0e1014;
  box-shadow: var(--shadow);
}

.sheet-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.sheet-head h2 {
  font-size: 16px;
}

.icon-button {
  width: 32px;
  height: 32px;
  padding: 0;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #111318;
  color: var(--muted);
}

.icon-button svg {
  width: 16px;
  height: 16px;
}

.wallet-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}

.wallet-grid button,
.sheet-action {
  min-height: 42px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #15181d;
  color: var(--text);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  font-size: 13px;
}

.wallet-grid svg {
  width: 15px;
  height: 15px;
}

.compact-sheet input {
  height: 44px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: #0b0d11;
}

.compact-list {
  display: grid;
  gap: 6px;
}

.line-item {
  min-height: 34px;
  padding: 7px 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--muted);
  font-size: 12px;
}

.line-item strong,
.line-item a {
  color: var(--text);
}

/* Rakes Mini App v2. Mobile-first game screen inspired by the provided reference. */
body.rakes-app {
  min-height: 100vh;
  overflow-x: hidden;
  padding: 0;
  color: #f5f7f6;
  font-family: "Montserrat", "Segoe UI", Arial, sans-serif;
  background:
    radial-gradient(circle at 18% 16%, rgba(117, 229, 149, 0.12) 0 1px, transparent 2px),
    radial-gradient(circle at 82% 24%, rgba(255, 255, 255, 0.20) 0 1px, transparent 2px),
    radial-gradient(circle at 68% 72%, rgba(117, 229, 149, 0.10) 0 1px, transparent 2px),
    radial-gradient(circle at 28% 86%, rgba(255, 255, 255, 0.16) 0 1px, transparent 2px),
    #030805;
  background-size: 220px 220px, 180px 180px, 260px 260px, 210px 210px, auto;
}

.rakes-app button {
  border: 0;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.rakes-mobile {
  width: min(100%, 460px);
  min-height: 100vh;
  margin: 0 auto;
  padding: max(14px, env(safe-area-inset-top)) 6px calc(92px + env(safe-area-inset-bottom));
}

.casino-topbar {
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 0 2px;
}

.brand-mark {
  min-width: 78px;
  color: #f7faf8;
  font-size: 15px;
  font-weight: 900;
  letter-spacing: -0.06em;
  text-transform: uppercase;
}

.top-cluster {
  display: flex;
  align-items: center;
  gap: 7px;
}

.balance-chip,
.avatar-chip {
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(124, 255, 163, 0.08);
  border-radius: 12px;
  background: #09140d;
  color: #6df28e;
}

.balance-chip {
  gap: 7px;
  padding: 0 11px;
  color: #75f096;
  font-size: 14px;
  font-weight: 800;
}

.balance-chip small {
  color: rgba(117, 240, 150, 0.72);
  font-size: 10px;
  font-weight: 700;
}

.avatar-chip {
  width: 34px;
  border-radius: 50%;
  color: #07100b;
  background: #f97373;
}

.balance-chip svg,
.avatar-chip svg {
  width: 16px;
  height: 16px;
  stroke-width: 2.4;
}

.round-head {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin: 32px 0 10px;
  padding: 0 1px;
}

.round-head div:last-child {
  text-align: right;
}

.round-head span,
.round-strip span {
  display: block;
  color: rgba(245, 247, 246, 0.62);
  font-size: 15px;
  line-height: 1.1;
}

.round-head strong {
  display: block;
  margin-top: 4px;
  color: #f8faf9;
  font-size: clamp(29px, 8.3vw, 42px);
  font-weight: 800;
  letter-spacing: -0.06em;
  line-height: 0.95;
}

.round-head strong small {
  display: inline-grid;
  place-items: center;
  min-width: 25px;
  height: 25px;
  margin-left: 4px;
  border-radius: 50%;
  background: #4ee781;
  color: #06220f;
  font-size: 10px;
  letter-spacing: -0.02em;
  vertical-align: 5px;
}

.round-head em {
  display: block;
  max-width: 100%;
  margin-top: 12px;
  overflow: hidden;
  color: rgba(245, 247, 246, 0.52);
  font-size: 12px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.wheel-arena {
  position: relative;
  width: min(86vw, 382px);
  aspect-ratio: 1;
  margin: 16px auto 18px;
  display: grid;
  place-items: center;
}

.wheel-arena::before {
  content: "";
  position: absolute;
  inset: -9px;
  border-radius: 50%;
  background: #050b07;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.035), 0 26px 70px rgba(0, 0, 0, 0.54);
}

.wheel-pointer {
  position: absolute;
  top: -9px;
  left: 50%;
  z-index: 3;
  width: 0;
  height: 0;
  transform: translateX(-50%);
  border-left: 12px solid transparent;
  border-right: 12px solid transparent;
  border-top: 0;
  border-bottom: 22px solid #f3f5f2;
  filter: drop-shadow(0 5px 10px rgba(0, 0, 0, 0.42));
}

#round-wheel {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  display: block;
}

.stake-presets {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 0;
  margin: 0 0 20px;
}

.stake-presets button {
  height: 28px;
  background: transparent;
  color: rgba(245, 247, 246, 0.68);
  font-size: 15px;
  font-weight: 600;
}

.stake-presets button:active {
  color: #70ee91;
}

.bet-dock {
  display: grid;
  grid-template-columns: 1fr 86px;
  gap: 0;
  height: 52px;
  margin: 0 0 14px;
  border-radius: 10px;
  overflow: hidden;
  background: #111713;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.035);
}

.bet-dock .bet-wrap {
  min-width: 0;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 8px;
  padding: 0 16px;
  background: #111713;
}

.bet-dock input {
  width: 100%;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: #f5f7f6;
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -0.04em;
}

.bet-dock input::placeholder {
  color: rgba(245, 247, 246, 0.76);
}

.bet-dock .bet-wrap span {
  color: rgba(245, 247, 246, 0.74);
  font-size: 12px;
  font-weight: 800;
}

.bet-dock button {
  background: #52e87c;
  color: #06200e;
  font-size: 15px;
  font-weight: 800;
}

.bet-dock button:disabled {
  background: #243029;
  color: rgba(245, 247, 246, 0.36);
}

.round-strip {
  height: 42px;
  display: grid;
  grid-template-columns: 0.9fr 1.35fr 1fr;
  align-items: center;
  margin: 0 0 10px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 18px;
  background: rgba(5, 9, 7, 0.74);
}

.round-strip div {
  min-width: 0;
  padding: 0 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 5px;
}

.round-strip div + div {
  border-left: 1px solid rgba(255, 255, 255, 0.06);
}

.round-strip span {
  font-size: 11px;
  text-transform: uppercase;
}

.round-strip strong {
  overflow: hidden;
  color: rgba(245, 247, 246, 0.86);
  font-size: 11px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.round-note {
  min-height: 16px;
  margin: 0 8px;
  color: rgba(245, 247, 246, 0.42);
  font-size: 11px;
  line-height: 1.35;
  text-align: center;
}

.bottom-nav {
  position: fixed;
  left: 50%;
  bottom: 0;
  z-index: 50;
  width: min(100%, 460px);
  height: calc(72px + env(safe-area-inset-bottom));
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  padding: 8px 4px max(8px, env(safe-area-inset-bottom));
  transform: translateX(-50%);
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  background: #040806;
}

.bottom-nav button {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 4px;
  background: transparent;
  color: rgba(245, 247, 246, 0.58);
  font-size: 11px;
  font-weight: 700;
}

.bottom-nav button.active {
  color: #56ef7f;
}

.bottom-nav button:disabled {
  opacity: 0.68;
}

/* `display: grid` выше перебивает штатный [hidden] { display: none }, поэтому
   скрытие кнопки (слот на обкатке — см. setSlotAvailable) задаём явно. */
.bottom-nav button[hidden] {
  display: none;
}

.bottom-nav svg {
  width: 22px;
  height: 22px;
  stroke-width: 2.5;
}

.rakes-app .sheet {
  align-items: end;
  padding: 10px 8px calc(82px + env(safe-area-inset-bottom));
  background: rgba(0, 0, 0, 0.64);
}

.rakes-app .sheet-card.compact-sheet {
  width: min(100%, 444px);
  margin: 0 auto;
  padding: 16px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 18px;
  background: #0d120f;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.58);
}

.rakes-app .sheet-head h2 {
  color: #f5f7f6;
  font-size: 17px;
  letter-spacing: -0.03em;
}

.rakes-app .icon-button,
.rakes-app .wallet-grid button,
.rakes-app .sheet-action,
.rakes-app .line-item {
  border-color: rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  background: #111713;
  color: #f5f7f6;
}

.rakes-app .sheet-action {
  background: #52e87c;
  color: #06200e;
  font-weight: 800;
}

.rakes-app .compact-sheet input {
  height: 48px;
  padding: 0 13px;
  border-color: rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  background: #070b08;
  color: #f5f7f6;
}

@media (max-height: 700px) {
  .round-head {
    margin-top: 18px;
  }

  .wheel-arena {
    width: min(78vw, 330px);
    margin-bottom: 10px;
  }

  .stake-presets {
    margin-bottom: 12px;
  }

  .round-note {
    display: none;
  }
}

/* Rakes Mini App v3. Independent product direction, not a reference clone. */
body.rakes-app {
  --r-bg: #050607;
  --r-panel: #0b0d0f;
  --r-panel-2: #111418;
  --r-line: rgba(255, 255, 255, 0.075);
  --r-line-strong: rgba(255, 255, 255, 0.12);
  --r-text: #f4f6f3;
  --r-muted: rgba(244, 246, 243, 0.54);
  --r-soft: rgba(244, 246, 243, 0.30);
  --r-accent: #7cff9b;
  --r-accent-dark: #0d2b17;
  --r-red: #ff6f6f;
  min-height: 100vh;
  padding: 0;
  background-color: var(--r-bg);
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.022) 1px, transparent 1px);
  background-size: 34px 34px;
  color: var(--r-text);
  font-family: "Montserrat", "Segoe UI", Arial, sans-serif;
}

.rakes-mobile {
  width: min(100%, 470px);
  min-height: 100vh;
  margin: 0 auto;
  padding: max(14px, env(safe-area-inset-top)) 12px calc(94px + env(safe-area-inset-bottom));
}

.casino-topbar {
  height: 46px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.brand-mark {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
  color: var(--r-text);
  font-size: 16px;
  font-weight: 900;
  letter-spacing: -0.06em;
  text-transform: uppercase;
}

.brand-mark b {
  width: 22px;
  height: 22px;
  display: block;
  border: 2px solid var(--r-accent);
  border-radius: 8px 8px 8px 2px;
  transform: rotate(45deg);
  background: #08100a;
  box-shadow: inset 0 0 0 4px var(--r-bg);
}

.top-cluster {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.balance-chip,
.avatar-chip {
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--r-line);
  background: rgba(11, 13, 15, 0.92);
}

.balance-chip {
  gap: 7px;
  padding: 0 12px;
  border-radius: 999px;
  color: var(--r-text);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: -0.03em;
}

.balance-chip svg {
  color: var(--r-accent);
}

.balance-chip small {
  color: var(--r-muted);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.04em;
}

.avatar-chip {
  width: 36px;
  padding: 0;
  overflow: hidden;
  border-radius: 14px;
  color: var(--r-text);
  background: #171a1f;
}

.avatar-chip img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.avatar-chip img[hidden] {
  display: none;
}

.balance-chip svg,
.avatar-chip svg {
  width: 16px;
  height: 16px;
  stroke-width: 2.4;
}

.round-head {
  margin: 26px 0 12px;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 13px;
}

.round-kicker {
  min-width: 0;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.round-kicker span {
  color: var(--r-text);
  font-size: 14px;
  font-weight: 800;
  letter-spacing: -0.03em;
}

.round-kicker em {
  overflow: hidden;
  color: var(--r-muted);
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.round-ledger {
  min-height: 66px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 96px;
  border: 1px solid var(--r-line);
  border-radius: 18px;
  background: rgba(11, 13, 15, 0.78);
  overflow: hidden;
}

.round-ledger div {
  min-width: 0;
  padding: 12px 14px;
  display: grid;
  align-content: center;
  gap: 6px;
  text-align: left;
}

.round-ledger div + div {
  border-left: 1px solid var(--r-line);
}

.round-ledger span {
  color: var(--r-muted);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.round-ledger strong {
  min-width: 0;
  display: flex;
  align-items: baseline;
  gap: 6px;
  color: var(--r-text);
  font-size: clamp(24px, 7vw, 32px);
  font-weight: 900;
  letter-spacing: -0.07em;
  line-height: 0.92;
}

.round-ledger strong > span {
  min-width: 0;
  overflow: hidden;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  text-overflow: ellipsis;
  text-transform: none;
  white-space: nowrap;
}

.round-ledger small {
  color: var(--r-accent);
  flex: 0 0 auto;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.04em;
}

.wheel-arena {
  position: relative;
  width: min(84vw, 376px);
  aspect-ratio: 1;
  margin: 18px auto 22px;
  display: grid;
  place-items: center;
}

.wheel-arena::before {
  content: "";
  position: absolute;
  inset: -14px;
  border: 1px solid var(--r-line);
  border-radius: 50%;
  background: #07090a;
  box-shadow: 0 28px 68px rgba(0, 0, 0, 0.45), inset 0 0 0 12px rgba(255, 255, 255, 0.012);
}

.wheel-arena::after {
  content: "";
  position: absolute;
  inset: 13px;
  border: 1px solid rgba(0, 0, 0, 0.38);
  border-radius: 50%;
  pointer-events: none;
  z-index: 3;
}

.wheel-pointer {
  position: absolute;
  top: -13px;
  left: 50%;
  z-index: 4;
  width: 34px;
  height: 26px;
  transform: translateX(-50%);
  border: 0;
  background: var(--r-text);
  clip-path: polygon(50% 100%, 0 0, 100% 0);
}

#round-wheel {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
}

.wheel-hub {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 5;
  width: clamp(82px, 25vw, 112px);
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 2px;
  transform: translate(-50%, -50%);
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 50%;
  background: #050607;
  box-shadow: inset 0 0 0 7px rgba(255, 255, 255, 0.012);
  pointer-events: none;
}

.wheel-hub span {
  max-width: 96%;
  overflow: hidden;
  color: var(--r-text);
  font-size: clamp(25px, 8vw, 38px);
  font-weight: 700;
  letter-spacing: -0.08em;
  line-height: 0.9;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.wheel-hub small {
  color: var(--r-accent);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.14em;
  line-height: 1;
}

.stake-presets {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 8px;
  margin: 0 0 14px;
}

.stake-presets button {
  height: 34px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: transparent;
  color: var(--r-muted);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: -0.04em;
}

.stake-presets button:active {
  border-color: var(--r-line);
  background: var(--r-panel-2);
  color: var(--r-accent);
}

.bet-dock {
  height: 58px;
  display: grid;
  grid-template-columns: 1fr 104px;
  gap: 8px;
  margin: 0 0 12px;
  border-radius: 0;
  overflow: visible;
  background: transparent;
  box-shadow: none;
}

.bet-dock .bet-wrap,
.bet-dock button {
  border: 1px solid var(--r-line);
  border-radius: 18px;
}

.bet-dock .bet-wrap {
  min-width: 0;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 8px;
  padding: 0 16px;
  background: var(--r-panel);
}

.bet-dock input {
  width: 100%;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--r-text);
  font-size: 21px;
  font-weight: 900;
  letter-spacing: -0.06em;
}

.bet-dock input::placeholder {
  color: rgba(244, 246, 243, 0.56);
}

.bet-dock .bet-wrap span {
  color: var(--r-muted);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.08em;
}

.bet-dock button {
  background: var(--r-accent);
  color: #061007;
  font-size: 14px;
  font-weight: 900;
  letter-spacing: -0.04em;
}

.bet-dock button:disabled {
  background: #161a18;
  color: var(--r-soft);
}

.round-strip {
  min-height: 46px;
  height: auto;
  display: grid;
  grid-template-columns: 0.82fr 1.28fr 1fr;
  align-items: stretch;
  margin: 0 0 10px;
  border: 1px solid var(--r-line);
  border-radius: 18px;
  background: rgba(6, 8, 9, 0.76);
}

.round-strip div {
  min-width: 0;
  padding: 9px 10px;
  display: grid;
  align-content: center;
  gap: 3px;
}

.round-strip div + div {
  border-left: 1px solid var(--r-line);
}

.round-strip span {
  color: var(--r-muted);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.round-strip strong {
  overflow: hidden;
  color: var(--r-text);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: -0.03em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.round-note {
  margin: 0 8px;
  color: rgba(244, 246, 243, 0.36);
  font-size: 10px;
  font-weight: 600;
  line-height: 1.45;
  text-align: center;
}

.bottom-nav {
  position: fixed;
  left: 50%;
  bottom: 0;
  z-index: 50;
  width: min(100%, 470px);
  height: calc(76px + env(safe-area-inset-bottom));
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  padding: 8px 12px max(9px, env(safe-area-inset-bottom));
  transform: translateX(-50%);
  border-top: 1px solid var(--r-line);
  background: rgba(5, 6, 7, 0.96);
}

.bottom-nav button {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 5px;
  border-radius: 16px;
  background: transparent;
  color: var(--r-muted);
  font-size: 10px;
  font-weight: 800;
}

.bottom-nav button.active {
  background: rgba(124, 255, 155, 0.08);
  color: var(--r-accent);
}

.bottom-nav button:disabled {
  opacity: 0.58;
}

.bottom-nav svg {
  width: 21px;
  height: 21px;
  stroke-width: 2.6;
}

.rakes-app .sheet {
  padding: 10px 10px calc(86px + env(safe-area-inset-bottom));
  background: rgba(0, 0, 0, 0.68);
}

.rakes-app .sheet-card.compact-sheet {
  width: min(100%, 450px);
  padding: 16px;
  border: 1px solid var(--r-line);
  border-radius: 22px;
  background: #090b0c;
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.62);
}

.rakes-app .sheet-head h2 {
  color: var(--r-text);
  font-size: 17px;
  font-weight: 900;
  letter-spacing: -0.05em;
}

.rakes-app .icon-button,
.rakes-app .wallet-grid button,
.rakes-app .line-item {
  border-color: var(--r-line);
  border-radius: 15px;
  background: var(--r-panel);
  color: var(--r-text);
}

.rakes-app .sheet-action {
  min-height: 46px;
  border: 0;
  border-radius: 15px;
  background: var(--r-accent);
  color: #061007;
  font-weight: 900;
}

.rakes-app .sheet-action:disabled {
  opacity: 0.45;
  filter: saturate(0.4);
  pointer-events: none;
}

/* «Бонус сгорит» в шторке депозита: красная, а не жёлтая — это потеря денег, не ограничение */
.rakes-app .dep-burn-note {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 0 0 12px;
  padding: 12px 14px;
  border: 1px solid rgba(255, 88, 88, 0.32);
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(255, 88, 88, 0.14), rgba(255, 88, 88, 0.05));
}

.rakes-app .dep-burn-note.hidden {
  display: none;
}

.rakes-app .dep-burn-note .dep-burn-title {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 800;
  color: #ff9b9b;
}

.rakes-app .dep-burn-note .dep-burn-title i {
  width: 14px;
  height: 14px;
}

.rakes-app .dep-burn-note small {
  font-size: 11.5px;
  line-height: 1.35;
  color: rgba(255, 255, 255, 0.68);
}

.rakes-app .dep-burn-note small b {
  color: #ffbdbd;
}

.rakes-app .withdraw-wager-card {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 4px;
  padding: 14px 16px;
  border: 1px solid rgba(255, 176, 32, 0.28);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255, 176, 32, 0.12), rgba(255, 176, 32, 0.05));
}

.rakes-app .withdraw-wager-card.hidden {
  display: none;
}

.rakes-app .withdraw-wager-card .pwg-info {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
  flex: 1;
}

.rakes-app .withdraw-wager-card .pwg-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 700;
  color: #ffcf6a;
}

.rakes-app .withdraw-wager-card .pwg-label i {
  width: 14px;
  height: 14px;
}

.rakes-app .withdraw-wager-card strong {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 22px;
  font-weight: 900;
  color: #fff;
}

.rakes-app .withdraw-wager-card small {
  font-size: 11.5px;
  color: rgba(255, 255, 255, 0.62);
  line-height: 1.3;
}

.rakes-app .withdraw-wager-card .pwg-hint {
  margin-top: 4px;
  padding-top: 5px;
  border-top: 1px solid rgba(255, 176, 32, 0.18);
  font-size: 10.5px;
  color: rgba(255, 207, 106, 0.82);
}

/* карточка вагера при доп. строке: контролы сверху, чтобы кнопка не уезжала по центру */
.rakes-app .withdraw-wager-card { align-items: flex-start; }
.rakes-app .withdraw-wager-card .pwg-reset { align-self: center; }

.rakes-app .withdraw-wager-card .pwg-reset {
  flex-shrink: 0;
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid rgba(255, 107, 107, 0.4);
  border-radius: 12px;
  background: rgba(255, 107, 107, 0.14);
  color: #ff8f8f;
  font-size: 13px;
  font-weight: 800;
}

.rakes-app .withdraw-wager-card .pwg-reset:active {
  transform: scale(0.97);
}

/* внутреннее окно подтверждения */
.app-confirm-overlay {
  position: fixed;
  inset: 0;
  z-index: 9000;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(3, 5, 7, 0.72);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  opacity: 0;
  transition: opacity 0.2s ease;
}

.app-confirm-overlay.in { opacity: 1; }
.app-confirm-overlay.out { opacity: 0; }

.app-confirm {
  width: min(360px, 100%);
  padding: 24px 22px 18px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 22px;
  background: linear-gradient(180deg, #12161a, #0c0f12);
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.66);
  text-align: center;
  transform: translateY(14px) scale(0.96);
  transition: transform 0.24s cubic-bezier(0.22, 1, 0.36, 1);
}

.app-confirm-overlay.in .app-confirm { transform: translateY(0) scale(1); }

.app-confirm-ic {
  display: inline-grid;
  place-items: center;
  width: 54px;
  height: 54px;
  margin-bottom: 14px;
  border-radius: 16px;
  background: rgba(82, 232, 124, 0.14);
  color: #52e87c;
}

.app-confirm-ic.danger {
  background: rgba(255, 107, 107, 0.14);
  color: #ff8f8f;
}

.app-confirm-ic i { width: 26px; height: 26px; }

.app-confirm-title {
  margin: 0 0 8px;
  font-size: 18px;
  font-weight: 900;
  letter-spacing: -0.02em;
  color: #f5f7f6;
}

.app-confirm-text {
  margin: 0 0 20px;
  font-size: 13.5px;
  line-height: 1.45;
  color: rgba(255, 255, 255, 0.66);
  white-space: pre-line;
}

.app-confirm-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.app-confirm-btn {
  min-height: 46px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 14px;
  background: #1b2026;
  color: #f5f7f6;
  font-size: 14px;
  font-weight: 800;
}

.app-confirm-btn.primary {
  border-color: transparent;
  background: #52e87c;
  color: #06200e;
}

.app-confirm-btn.danger {
  border-color: transparent;
  background: linear-gradient(180deg, #ff6b6b, #e8433f);
  color: #fff;
}

.app-confirm-btn:active { transform: scale(0.97); }

.rakes-app .compact-sheet input {
  height: 48px;
  padding: 0 14px;
  border: 1px solid var(--r-line);
  border-radius: 15px;
  background: #050607;
  color: var(--r-text);
  font-weight: 800;
}

@media (max-width: 360px) {
  .rakes-mobile {
    padding-left: 9px;
    padding-right: 9px;
  }

  .round-ledger strong {
    font-size: 27px;
  }

  .bet-dock {
    grid-template-columns: 1fr 92px;
  }
}

/* Rakes Mini App v4. Screen-matched premium wheel layout. */
body.rakes-app {
  --r-bg: #030706;
  --r-card: rgba(6, 16, 13, 0.84);
  --r-card-2: rgba(10, 22, 18, 0.92);
  --r-line: rgba(97, 255, 137, 0.20);
  --r-line-soft: rgba(255, 255, 255, 0.075);
  --r-text: #f4f7f3;
  --r-muted: rgba(244, 247, 243, 0.56);
  --r-accent: #4fff7c;
  --r-accent-2: #1fd85c;
  min-height: 100vh;
  color: var(--r-text);
  background:
    radial-gradient(circle at 9% 4%, rgba(68, 255, 118, 0.20), transparent 24%),
    radial-gradient(circle at 84% 0%, rgba(68, 255, 118, 0.10), transparent 22%),
    linear-gradient(rgba(93, 255, 133, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(93, 255, 133, 0.03) 1px, transparent 1px),
    #030706;
  background-size: auto, auto, 38px 38px, 38px 38px, auto;
  font-family: "Montserrat", "Segoe UI", Arial, sans-serif;
}

.rakes-mobile {
  width: min(100%, 736px);
  min-height: 100vh;
  margin: 0 auto;
  padding: max(23px, env(safe-area-inset-top)) 38px calc(116px + env(safe-area-inset-bottom));
  border-left: 1px solid rgba(255, 255, 255, 0.02);
  border-right: 1px solid rgba(255, 255, 255, 0.02);
}

.casino-topbar {
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.brand-mark {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  font-size: 31px;
  font-weight: 700;
  letter-spacing: -0.055em;
  text-transform: uppercase;
}

.brand-mark b {
  width: 49px;
  height: 49px;
  border: 4px solid var(--r-accent);
  border-radius: 15px 15px 15px 5px;
  transform: rotate(45deg);
  background: rgba(24, 255, 96, 0.06);
  box-shadow: 0 0 24px rgba(79, 255, 124, 0.58), inset 0 0 0 7px #040a07;
}

.top-cluster {
  display: inline-flex;
  align-items: center;
  gap: 14px;
}

.balance-chip,
.avatar-chip {
  height: 64px;
  border: 1px solid var(--r-line);
  background: rgba(7, 14, 12, 0.88);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.025), 0 0 22px rgba(58, 255, 105, 0.08);
}

.balance-chip {
  min-width: 183px;
  gap: 13px;
  padding: 0 19px;
  border-radius: 18px;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.045em;
}

.balance-chip svg {
  width: 29px;
  height: 29px;
  color: var(--r-accent);
}

.balance-chip small {
  color: rgba(244, 247, 243, 0.70);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.avatar-chip {
  width: 64px;
  border-radius: 18px;
  color: var(--r-text);
}

.avatar-chip svg {
  width: 29px;
  height: 29px;
}

.round-head {
  margin: 52px 0 18px;
  display: grid;
  gap: 19px;
}

.round-kicker {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.round-kicker span {
  color: var(--r-text);
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.04em;
  text-transform: uppercase;
}

.round-kicker em {
  position: relative;
  padding: 8px 31px 8px 14px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 999px;
  background: rgba(8, 15, 13, 0.88);
  color: rgba(244, 247, 243, 0.68);
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.round-kicker em::after {
  content: "";
  position: absolute;
  right: 12px;
  top: 50%;
  width: 7px;
  height: 7px;
  transform: translateY(-50%);
  border-radius: 50%;
  background: var(--r-accent);
  box-shadow: 0 0 12px rgba(79, 255, 124, 0.85);
}

.round-ledger {
  min-height: 116px;
  display: grid;
  grid-template-columns: 1fr 0.78fr;
  border: 1px solid var(--r-line);
  border-radius: 20px;
  background:
    radial-gradient(circle at 18% 0%, rgba(83, 255, 129, 0.17), transparent 34%),
    radial-gradient(circle at 86% 0%, rgba(83, 255, 129, 0.10), transparent 31%),
    var(--r-card);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.025), 0 0 34px rgba(42, 255, 101, 0.13);
  overflow: hidden;
}

.round-ledger .stat-card {
  min-width: 0;
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  align-items: center;
  gap: 20px;
  padding: 22px 26px;
  text-align: left;
}

.round-ledger .stat-card + .stat-card {
  border-left: 1px solid rgba(255, 255, 255, 0.085);
}

.stat-icon {
  width: 72px;
  height: 72px;
  padding: 20px;
  border: 1px solid rgba(79, 255, 124, 0.22);
  border-radius: 50%;
  color: var(--r-accent);
  background: rgba(8, 16, 13, 0.86);
  box-shadow: inset 0 -13px 32px rgba(79, 255, 124, 0.09), 0 0 20px rgba(79, 255, 124, 0.10);
}

.round-ledger section {
  min-width: 0;
  display: grid;
  gap: 8px;
}

.round-ledger span {
  color: var(--r-muted);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.10em;
  text-transform: uppercase;
}

.round-ledger strong {
  min-width: 0;
  display: flex;
  align-items: baseline;
  gap: 12px;
  color: var(--r-text);
  font-size: clamp(34px, 8vw, 42px);
  font-weight: 700;
  letter-spacing: -0.06em;
  line-height: 0.94;
}

.round-ledger strong > span {
  min-width: 0;
  overflow: hidden;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.round-ledger small {
  padding: 5px 9px;
  border: 1px solid rgba(79, 255, 124, 0.35);
  border-radius: 999px;
  color: var(--r-accent);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.wheel-arena {
  position: relative;
  width: min(78vw, 532px);
  aspect-ratio: 1;
  margin: 23px auto 21px;
  display: grid;
  place-items: center;
}

.wheel-arena::before {
  content: "";
  position: absolute;
  inset: -19px;
  border: 1px solid rgba(255, 255, 255, 0.10);
  border-radius: 50%;
  background:
    radial-gradient(circle, transparent 63%, rgba(255, 255, 255, 0.20) 64%, rgba(4, 7, 6, 1) 69%, rgba(255, 255, 255, 0.15) 70%, rgba(8, 12, 11, 1) 75%, rgba(0, 0, 0, 0) 76%),
    #050807;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.74), 0 0 42px rgba(79, 255, 124, 0.16);
}

.wheel-arena::after {
  content: "";
  position: absolute;
  inset: 22px;
  z-index: 3;
  border: 2px solid rgba(79, 255, 124, 0.34);
  border-radius: 50%;
  box-shadow: inset 0 0 22px rgba(79, 255, 124, 0.12), 0 0 18px rgba(79, 255, 124, 0.18);
  pointer-events: none;
}

.wheel-pointer {
  position: absolute;
  top: -21px;
  left: 50%;
  z-index: 7;
  width: 54px;
  height: 62px;
  transform: translateX(-50%);
  border: 0;
  background: linear-gradient(160deg, #ffffff, #a9aaa7 46%, #ffffff 100%);
  clip-path: polygon(50% 100%, 6% 8%, 94% 8%);
  filter: drop-shadow(0 5px 8px rgba(0, 0, 0, 0.64)) drop-shadow(0 0 10px rgba(255, 255, 255, 0.32));
}

#round-wheel {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
}

.wheel-hub {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 6;
  width: clamp(108px, 27vw, 144px);
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  transform: translate(-50%, -50%);
  border: 2px solid rgba(79, 255, 124, 0.36);
  border-radius: 50%;
  background: radial-gradient(circle, #08120d 0 58%, #030706 59% 100%);
  box-shadow: 0 0 22px rgba(79, 255, 124, 0.20), inset 0 0 0 12px rgba(255, 255, 255, 0.018);
  pointer-events: none;
}

.wheel-hub span {
  max-width: 94%;
  overflow: hidden;
  color: var(--r-text);
  font-size: clamp(42px, 10vw, 58px);
  font-weight: 700;
  letter-spacing: -0.08em;
  line-height: 0.82;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.wheel-hub small {
  color: var(--r-accent);
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 0.12em;
  line-height: 1;
}

.stake-presets {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 15px;
  margin: 0 10px 14px;
}

.stake-presets button {
  height: 35px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 999px;
  background: rgba(7, 13, 11, 0.86);
  color: rgba(244, 247, 243, 0.86);
  font-size: 16px;
  font-weight: 700;
  letter-spacing: -0.03em;
  box-shadow: inset 0 -12px 24px rgba(79, 255, 124, 0.025);
}

.stake-presets button:active,
.stake-presets button.is-active {
  border-color: rgba(79, 255, 124, 0.60);
  color: var(--r-text);
  box-shadow: 0 0 18px rgba(79, 255, 124, 0.18), inset 0 -12px 24px rgba(79, 255, 124, 0.08);
}

.bet-dock {
  height: 87px;
  display: grid;
  grid-template-columns: 1fr 199px;
  gap: 14px;
  margin: 0 0 18px;
  padding: 9px;
  border: 1px solid var(--r-line);
  border-radius: 20px;
  background: rgba(6, 14, 11, 0.92);
  box-shadow: 0 0 30px rgba(79, 255, 124, 0.10), inset 0 0 0 1px rgba(255, 255, 255, 0.025);
}

.bet-dock .bet-wrap,
.bet-dock button {
  border-radius: 15px;
}

.bet-dock .bet-wrap {
  min-width: 0;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 0 22px;
  border: 1px solid rgba(255, 255, 255, 0.065);
  background: rgba(5, 9, 8, 0.94);
}

.bet-dock input {
  min-width: 0;
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--r-text);
  font-size: 34px;
  font-weight: 700;
  letter-spacing: -0.065em;
}

.bet-dock .bet-wrap span {
  color: rgba(244, 247, 243, 0.74);
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.05em;
}

.bet-dock button {
  border: 1px solid rgba(190, 255, 202, 0.42);
  background: linear-gradient(145deg, #67ff8a 0%, #29df5b 48%, #91ffaa 100%);
  color: #061008;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.045em;
  box-shadow: 0 0 28px rgba(79, 255, 124, 0.36), inset 0 -18px 32px rgba(0, 0, 0, 0.12);
}

.bet-dock button:disabled {
  border-color: rgba(255, 255, 255, 0.07);
  background: #131916;
  color: rgba(244, 247, 243, 0.30);
  box-shadow: none;
}

.round-strip {
  min-height: 96px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin: 0 0 13px;
  border: 1px solid var(--r-line);
  border-radius: 18px;
  background:
    radial-gradient(circle at 18% 15%, rgba(79, 255, 124, 0.12), transparent 34%),
    rgba(7, 15, 12, 0.92);
  box-shadow: 0 0 28px rgba(79, 255, 124, 0.11), inset 0 0 0 1px rgba(255, 255, 255, 0.025);
}

.round-strip div {
  min-width: 0;
  padding: 18px 17px;
  display: grid;
  grid-template-columns: 45px minmax(0, 1fr);
  align-items: center;
  gap: 13px;
}

.round-strip div + div {
  border-left: 1px solid rgba(255, 255, 255, 0.08);
}

.round-strip i {
  width: 45px;
  height: 45px;
  padding: 10px;
  border-radius: 50%;
  color: var(--r-accent);
  background: rgba(79, 255, 124, 0.09);
  box-shadow: 0 0 18px rgba(79, 255, 124, 0.16);
}

.round-strip section {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.round-strip span {
  color: var(--r-muted);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.round-strip strong {
  overflow: hidden;
  color: var(--r-text);
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -0.035em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.round-note {
  min-height: 22px;
  margin: 0 8px;
  color: rgba(244, 247, 243, 0.55);
  font-size: 16px;
  font-weight: 500;
  text-align: center;
}

.round-note strong,
.round-note a {
  color: var(--r-accent);
}

.bottom-nav {
  position: fixed;
  left: 50%;
  bottom: 14px;
  z-index: 50;
  width: min(calc(100% - 28px), 708px);
  height: calc(76px + env(safe-area-inset-bottom));
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  padding: 7px;
  transform: translateX(-50%);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 18px;
  background: rgba(7, 11, 10, 0.94);
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.50), inset 0 0 0 1px rgba(255, 255, 255, 0.025);
}

.bottom-nav button {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 5px;
  border-radius: 14px;
  background: transparent;
  color: rgba(244, 247, 243, 0.64);
  font-size: 13px;
  font-weight: 500;
}

.bottom-nav button.active {
  border: 1px solid rgba(79, 255, 124, 0.20);
  background: rgba(79, 255, 124, 0.08);
  color: var(--r-accent);
  box-shadow: inset 0 0 0 1px rgba(79, 255, 124, 0.05), 0 0 18px rgba(79, 255, 124, 0.12);
}

.bottom-nav svg {
  width: 27px;
  height: 27px;
  stroke-width: 2.3;
}

@media (max-width: 540px) {
  .rakes-mobile {
    padding-left: 14px;
    padding-right: 14px;
  }

  .brand-mark {
    gap: 12px;
    font-size: 22px;
  }

  .brand-mark b {
    width: 39px;
    height: 39px;
  }

  .balance-chip {
    min-width: 126px;
    height: 48px;
    padding: 0 12px;
    font-size: 17px;
  }

  .balance-chip small {
    font-size: 10px;
  }

  .avatar-chip {
    width: 48px;
    height: 48px;
  }

  .round-head {
    margin-top: 32px;
  }

  .round-ledger {
    min-height: 92px;
  }

  .round-ledger .stat-card {
    grid-template-columns: 54px minmax(0, 1fr);
    gap: 13px;
    padding: 16px 15px;
  }

  .stat-icon {
    width: 54px;
    height: 54px;
    padding: 15px;
  }

  .round-ledger strong {
    font-size: 30px;
  }

  .round-ledger small {
    font-size: 11px;
  }

  .wheel-arena {
    width: min(82vw, 420px);
  }

  .stake-presets {
    gap: 8px;
    margin-left: 0;
    margin-right: 0;
  }

  .bet-dock {
    grid-template-columns: 1fr 132px;
    height: 74px;
  }

  .bet-dock input {
    font-size: 28px;
  }

  .bet-dock button {
    font-size: 19px;
  }

  .round-strip {
    min-height: 78px;
  }

  .round-strip div {
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 8px;
    padding: 14px 10px;
  }

  .round-strip i {
    width: 36px;
    height: 36px;
    padding: 8px;
  }
}

@media (max-width: 380px) {
  .casino-topbar {
    gap: 8px;
  }

  .brand-mark span {
    display: none;
  }

  .round-ledger {
    grid-template-columns: 1fr;
  }

  .round-ledger .stat-card + .stat-card {
    border-left: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
  }

  .bet-dock {
    grid-template-columns: 1fr 112px;
  }

  .round-strip {
    grid-template-columns: 1fr;
  }

  .round-strip div + div {
    border-left: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
  }
}

/* v4.5 final stat scale and neutral bet dock. Must stay at EOF. */
.rakes-app .round-ledger {
  min-height: 102px !important;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr) !important;
  border-color: rgba(255, 255, 255, 0.10) !important;
  border-radius: 18px !important;
}

.rakes-app .round-ledger .stat-card {
  grid-template-columns: 48px minmax(0, 1fr) !important;
  gap: 13px !important;
  padding: 17px 15px !important;
  place-items: center start !important;
  text-align: left !important;
}

.rakes-app .round-ledger .stat-card + .stat-card {
  border-left-color: rgba(255, 255, 255, 0.10) !important;
}

.rakes-app .stat-icon {
  width: 48px !important;
  height: 48px !important;
  padding: 12px !important;
}

.rakes-app .round-ledger section {
  height: 58px !important;
  grid-template-rows: 22px 32px !important;
  gap: 4px !important;
  place-items: start !important;
  align-content: center !important;
}

.rakes-app .round-ledger span {
  height: 22px !important;
  color: rgba(244, 247, 243, 0.78) !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  line-height: 22px !important;
}

.rakes-app .round-ledger strong {
  height: 32px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: start !important;
  gap: 8px !important;
  overflow: visible !important;
  font-size: 31px !important;
  font-weight: 800 !important;
  letter-spacing: -0.015em !important;
  line-height: 32px !important;
  text-align: left !important;
}

.rakes-app .round-ledger strong > span {
  height: 32px !important;
  display: inline-flex !important;
  align-items: center !important;
  overflow: visible !important;
  padding-right: 2px !important;
  line-height: 32px !important;
}

.rakes-app .round-ledger .token-logo {
  width: 25px !important;
  height: 25px !important;
}

.rakes-app .bet-dock {
  height: 68px !important;
  grid-template-columns: 1fr 112px !important;
  gap: 8px !important;
  padding: 8px !important;
  border-color: rgba(255, 255, 255, 0.09) !important;
  background: rgba(7, 11, 10, 0.92) !important;
  box-shadow: none !important;
}

.rakes-app .bet-dock .bet-wrap,
.rakes-app .bet-dock button {
  min-height: 52px !important;
  border-color: rgba(255, 255, 255, 0.09) !important;
  box-shadow: none !important;
}

.rakes-app .bet-dock .bet-wrap {
  padding: 0 18px !important;
  background: rgba(4, 7, 6, 0.96) !important;
}

.rakes-app .bet-dock input {
  height: 52px !important;
  line-height: 52px !important;
  font-size: 26px !important;
}

.rakes-app .bet-dock button {
  border: 0 !important;
  background: #f4f7f3 !important;
  color: #050706 !important;
  font-size: 17px !important;
}

@media (max-width: 380px) {
  .rakes-app .round-ledger .stat-card {
    grid-template-columns: 42px minmax(0, 1fr) !important;
    gap: 10px !important;
    padding: 14px 10px !important;
  }

  .rakes-app .stat-icon {
    width: 42px !important;
    height: 42px !important;
    padding: 11px !important;
  }

  .rakes-app .round-ledger span {
    font-size: 12px !important;
  }

  .rakes-app .round-ledger strong {
    font-size: 27px !important;
  }

  .rakes-app .bet-dock {
    grid-template-columns: 1fr 100px !important;
  }
}

/* v4.8 EOF: balanced panel, real spacing, neutral bet controls. */
.rakes-app .round-head {
  margin: 22px 0 20px !important;
  gap: 12px !important;
}

.rakes-app .round-ledger {
  min-height: 88px !important;
  grid-template-columns: minmax(0, 1.04fr) minmax(0, 0.96fr) !important;
  border-color: rgba(255, 255, 255, 0.09) !important;
  border-radius: 17px !important;
  background:
    linear-gradient(180deg, rgba(13, 22, 18, 0.96), rgba(6, 11, 9, 0.96)) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.025), 0 14px 34px rgba(0, 0, 0, 0.28) !important;
}

.rakes-app .round-ledger .stat-card {
  grid-template-columns: 40px minmax(0, 1fr) !important;
  gap: 11px !important;
  padding: 14px !important;
  place-items: center start !important;
  text-align: left !important;
}

.rakes-app .round-ledger .stat-card + .stat-card {
  border-left-color: rgba(255, 255, 255, 0.075) !important;
}

.rakes-app .stat-icon {
  width: 40px !important;
  height: 40px !important;
  padding: 10px !important;
  border-color: rgba(79, 255, 124, 0.16) !important;
  box-shadow: none !important;
}

.rakes-app .round-ledger section {
  height: 48px !important;
  grid-template-rows: 18px 28px !important;
  gap: 2px !important;
  place-items: start !important;
  align-content: center !important;
}

.rakes-app .round-ledger span {
  height: 18px !important;
  color: rgba(244, 247, 243, 0.66) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: 0.09em !important;
  line-height: 18px !important;
}

.rakes-app .round-ledger strong {
  height: 28px !important;
  gap: 7px !important;
  font-size: 27px !important;
  font-weight: 800 !important;
  line-height: 28px !important;
}

.rakes-app .round-ledger strong > span {
  height: 28px !important;
  line-height: 28px !important;
}

.rakes-app .round-ledger .token-logo {
  width: 22px !important;
  height: 22px !important;
}

.rakes-app .wheel-arena {
  margin: 20px auto 22px !important;
}

.rakes-app .stake-presets {
  margin-top: 0 !important;
  margin-bottom: 12px !important;
}

.rakes-app .bet-dock {
  height: 68px !important;
  grid-template-columns: 1fr 112px !important;
  gap: 8px !important;
  padding: 8px !important;
  border-color: rgba(255, 255, 255, 0.09) !important;
  background: rgba(7, 11, 10, 0.92) !important;
  box-shadow: none !important;
}

.rakes-app .bet-dock .bet-wrap,
.rakes-app .bet-dock button {
  min-height: 52px !important;
  border-color: rgba(255, 255, 255, 0.09) !important;
  box-shadow: none !important;
}

.rakes-app .bet-dock .bet-wrap {
  padding: 0 18px !important;
  background: rgba(4, 7, 6, 0.96) !important;
}

.rakes-app .bet-dock input {
  height: 52px !important;
  line-height: 52px !important;
  font-size: 26px !important;
}

.rakes-app .bet-dock button {
  border: 0 !important;
  background: #f4f7f3 !important;
  color: #050706 !important;
  font-size: 17px !important;
}

@media (max-width: 380px) {
  .rakes-app .round-ledger {
    min-height: 82px !important;
  }

  .rakes-app .round-ledger .stat-card {
    grid-template-columns: 34px minmax(0, 1fr) !important;
    gap: 8px !important;
    padding: 12px 9px !important;
  }

  .rakes-app .stat-icon {
    width: 34px !important;
    height: 34px !important;
    padding: 8px !important;
  }

  .rakes-app .round-ledger span {
    font-size: 10px !important;
  }

  .rakes-app .round-ledger strong {
    font-size: 23px !important;
  }

  .rakes-app .round-ledger .token-logo {
    width: 19px !important;
    height: 19px !important;
  }

  .rakes-app .bet-dock {
    grid-template-columns: 1fr 100px !important;
  }
}

/* v4.7 balanced pool panel and wheel spacing. */
.rakes-app .round-head {
  margin: 22px 0 20px !important;
  gap: 12px !important;
}

.rakes-app .round-ledger {
  min-height: 88px !important;
  grid-template-columns: minmax(0, 1.04fr) minmax(0, 0.96fr) !important;
  border-color: rgba(255, 255, 255, 0.09) !important;
  border-radius: 17px !important;
  background:
    linear-gradient(180deg, rgba(13, 22, 18, 0.96), rgba(6, 11, 9, 0.96)) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.025), 0 14px 34px rgba(0, 0, 0, 0.28) !important;
}

.rakes-app .round-ledger .stat-card {
  grid-template-columns: 40px minmax(0, 1fr) !important;
  gap: 11px !important;
  padding: 14px 14px !important;
  place-items: center start !important;
  text-align: left !important;
}

.rakes-app .round-ledger .stat-card + .stat-card {
  border-left-color: rgba(255, 255, 255, 0.075) !important;
}

.rakes-app .stat-icon {
  width: 40px !important;
  height: 40px !important;
  padding: 10px !important;
  border-color: rgba(79, 255, 124, 0.16) !important;
  box-shadow: none !important;
}

.rakes-app .round-ledger section {
  height: 48px !important;
  grid-template-rows: 18px 28px !important;
  gap: 2px !important;
  place-items: start !important;
  align-content: center !important;
}

.rakes-app .round-ledger span {
  height: 18px !important;
  color: rgba(244, 247, 243, 0.66) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: 0.09em !important;
  line-height: 18px !important;
}

.rakes-app .round-ledger strong {
  height: 28px !important;
  gap: 7px !important;
  font-size: 27px !important;
  font-weight: 800 !important;
  line-height: 28px !important;
}

.rakes-app .round-ledger strong > span {
  height: 28px !important;
  line-height: 28px !important;
}

.rakes-app .round-ledger .token-logo {
  width: 22px !important;
  height: 22px !important;
}

.rakes-app .wheel-arena {
  margin: 20px auto 22px !important;
}

.rakes-app .stake-presets {
  margin-top: 0 !important;
  margin-bottom: 12px !important;
}

.rakes-app .bet-dock {
  border-color: rgba(255, 255, 255, 0.09) !important;
  box-shadow: none !important;
}

@media (max-width: 380px) {
  .rakes-app .round-ledger {
    min-height: 82px !important;
  }

  .rakes-app .round-ledger .stat-card {
    grid-template-columns: 34px minmax(0, 1fr) !important;
    gap: 8px !important;
    padding: 12px 9px !important;
  }

  .rakes-app .stat-icon {
    width: 34px !important;
    height: 34px !important;
    padding: 8px !important;
  }

  .rakes-app .round-ledger span {
    font-size: 10px !important;
  }

  .rakes-app .round-ledger strong {
    font-size: 23px !important;
  }

  .rakes-app .round-ledger .token-logo {
    width: 19px !important;
    height: 19px !important;
  }
}

/* v4.4 token logo and sharper stat/input geometry. Keep this block last. */
.rakes-app .token-logo {
  width: 22px;
  height: 22px;
  flex: 0 0 auto;
  display: inline-block;
  object-fit: contain;
  border-radius: 50%;
  image-rendering: auto;
}

.rakes-app .balance-chip {
  min-width: 138px;
  height: 44px;
  gap: 8px;
  padding: 0 13px;
  font-size: 16px;
  line-height: 1;
}

.rakes-app .balance-chip .token-logo {
  width: 20px;
  height: 20px;
}

.rakes-app .round-ledger {
  min-height: 92px;
  border-radius: 18px;
}

.rakes-app .round-ledger .stat-card {
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 12px;
  padding: 15px 14px;
}

.rakes-app .stat-icon {
  width: 44px;
  height: 44px;
  padding: 11px;
}

.rakes-app .round-ledger section {
  height: 52px;
  grid-template-rows: 18px 30px;
  gap: 4px;
  place-items: start;
}

.rakes-app .round-ledger span {
  height: 18px;
  color: rgba(244, 247, 243, 0.68);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.09em;
  line-height: 18px;
}

.rakes-app .round-ledger strong {
  height: 30px;
  display: flex;
  align-items: center;
  gap: 7px;
  overflow: visible;
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -0.018em;
  line-height: 30px;
  filter: none;
  transform: translateZ(0);
}

.rakes-app .round-ledger strong > span {
  height: 30px;
  display: inline-flex;
  align-items: center;
  overflow: visible;
  padding-right: 2px;
  line-height: 30px;
}

.rakes-app .round-ledger strong .token-logo {
  width: 24px;
  height: 24px;
  margin-left: 1px;
}

.rakes-app .round-ledger small {
  display: none;
}

.rakes-app .bet-dock {
  height: 66px;
  grid-template-columns: 1fr 110px;
  padding: 8px;
}

.rakes-app .bet-dock .bet-wrap {
  min-height: 50px;
  padding: 0 17px;
  align-items: center;
}

.rakes-app .bet-dock input {
  height: 50px;
  line-height: 50px;
  font-size: 25px;
}

.rakes-app .bet-dock .bet-wrap span {
  align-self: center;
  font-size: 12px;
}

.rakes-app .bet-dock button {
  min-height: 50px;
}

@media (max-width: 380px) {
  .rakes-app .round-ledger .stat-card {
    grid-template-columns: 38px minmax(0, 1fr);
    place-items: center start;
    gap: 9px;
    padding: 12px 9px;
    text-align: left;
  }

  .rakes-app .stat-icon {
    width: 38px;
    height: 38px;
    padding: 10px;
  }

  .rakes-app .round-ledger section {
    height: 46px;
    grid-template-rows: 16px 26px;
    place-items: start;
  }

  .rakes-app .round-ledger span {
    height: 16px;
    font-size: 10px;
    line-height: 16px;
  }

  .rakes-app .round-ledger strong {
    height: 26px;
    justify-content: start;
    font-size: 24px;
    line-height: 26px;
  }

  .rakes-app .round-ledger strong > span {
    height: 26px;
    line-height: 26px;
  }

  .rakes-app .round-ledger strong .token-logo {
    width: 21px;
    height: 21px;
  }

  .rakes-app .bet-dock {
    grid-template-columns: 1fr 98px;
  }
}

/* v4 geometry fixes: strict stat alignment and contained bottom navigation. */
.round-ledger {
  min-height: 104px;
  grid-template-columns: minmax(0, 1.04fr) minmax(0, 0.96fr);
}

.round-ledger .stat-card {
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 18px;
  padding: 18px 24px;
}

.round-ledger .stat-card + .stat-card {
  border-left: 1px solid rgba(255, 255, 255, 0.075);
}

.stat-icon {
  width: 58px;
  height: 58px;
  padding: 16px;
}

.round-ledger section {
  min-width: 0;
  height: 58px;
  display: grid;
  grid-template-rows: 18px 34px;
  align-content: center;
  gap: 6px;
}

.round-ledger span {
  height: 18px;
  display: block;
  font-size: 13px;
  line-height: 18px;
}

.round-ledger strong {
  height: 34px;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: max-content;
  align-items: center;
  justify-content: start;
  gap: 9px;
  font-size: 34px;
  line-height: 34px;
  letter-spacing: -0.055em;
}

.round-ledger strong > span {
  display: block;
  height: 34px;
  line-height: 34px;
}

.round-ledger small {
  height: 24px;
  display: inline-grid;
  place-items: center;
  align-self: center;
  padding: 0 8px;
  font-size: 11px;
  line-height: 1;
  letter-spacing: 0.04em;
}

.bottom-nav {
  height: calc(72px + env(safe-area-inset-bottom));
  padding: 6px;
  border-color: rgba(255, 255, 255, 0.075);
  border-radius: 17px;
  overflow: hidden;
}

.bottom-nav button {
  min-width: 0;
  height: 100%;
  border: 1px solid transparent;
  border-radius: 13px;
  box-shadow: none;
}

.bottom-nav button.active {
  border-color: rgba(79, 255, 124, 0.13);
  background: rgba(79, 255, 124, 0.075);
  box-shadow: inset 0 0 0 1px rgba(79, 255, 124, 0.035);
}

@media (max-width: 540px) {
  .round-ledger {
    min-height: 86px;
  }

  .round-ledger .stat-card {
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 11px;
    padding: 14px 12px;
  }

  .stat-icon {
    width: 46px;
    height: 46px;
    padding: 12px;
  }

  .round-ledger section {
    height: 46px;
    grid-template-rows: 15px 27px;
    gap: 4px;
  }

  .round-ledger span {
    height: 15px;
    font-size: 10px;
    line-height: 15px;
  }

  .round-ledger strong {
    height: 27px;
    gap: 6px;
    font-size: 27px;
    line-height: 27px;
  }

  .round-ledger strong > span {
    height: 27px;
    line-height: 27px;
  }

  .round-ledger small {
    height: 20px;
    padding: 0 6px;
    font-size: 9px;
  }

  .bottom-nav {
    width: min(calc(100% - 24px), 708px);
    height: calc(70px + env(safe-area-inset-bottom));
    bottom: 10px;
  }
}

@media (max-width: 380px) {
  .round-ledger {
    grid-template-columns: 1fr 1fr;
  }

  .round-ledger .stat-card + .stat-card {
    border-left: 1px solid rgba(255, 255, 255, 0.075);
    border-top: 0;
  }

  .round-ledger .stat-card {
    grid-template-columns: 1fr;
    place-items: center;
    gap: 8px;
    padding: 12px 8px;
    text-align: center;
  }

  .round-ledger section {
    place-items: center;
  }

  .round-ledger strong {
    justify-content: center;
  }
}

.page-shell {
  padding: 28px;
}

.hero, .auth-wrap, .admin-layout, .wheel-layout {
  width: min(1320px, 100%);
  margin: 0 auto;
}

.hero {
  display: grid;
  gap: 28px;
  padding-top: 48px;
}

.brand-block {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 24px;
  border: 1px solid var(--border);
  border-radius: 28px;
  background: var(--panel);
  backdrop-filter: blur(18px);
  box-shadow: var(--shadow);
}

.brand-logo {
  width: 88px;
  height: 88px;
  object-fit: contain;
}

.brand-logo.small {
  width: 52px;
  height: 52px;
}

.eyebrow {
  margin: 0 0 8px;
  color: var(--muted);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-size: 11px;
}

h1, h2 {
  margin: 0;
}

.lede {
  max-width: 760px;
  margin: 12px 0 0;
  color: var(--muted);
  line-height: 1.6;
}

.lede.small {
  max-width: 420px;
}

.card-grid, .metric-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 20px;
}

.panel, .auth-card {
  border: 1px solid var(--border);
  border-radius: 24px;
  background: var(--panel-2);
  box-shadow: var(--shadow);
}

.panel {
  padding: 24px;
}

.auth-wrap {
  min-height: calc(100vh - 56px);
  display: grid;
  place-items: center;
}

.auth-card {
  width: min(440px, 100%);
  padding: 32px;
}

.auth-form, .inline-form {
  display: grid;
  gap: 14px;
}

.auth-form label, .inline-form {
  display: grid;
  gap: 8px;
}

input {
  width: 100%;
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: rgba(255, 255, 255, 0.03);
  color: var(--text);
}

button {
  padding: 14px 18px;
  border: 0;
  border-radius: 14px;
  background: var(--text);
  color: #0d1016;
  cursor: pointer;
  font-weight: 600;
}

button.ghost {
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text);
}

.notice {
  padding: 14px 16px;
  border-radius: 14px;
  margin: 16px 0;
}

.notice.error {
  background: rgba(219, 102, 114, 0.12);
  border: 1px solid rgba(219, 102, 114, 0.28);
}

.topbar {
  width: min(1320px, 100%);
  margin: 0 auto 24px;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  padding: 20px 24px;
  border: 1px solid var(--border);
  border-radius: 24px;
  background: var(--panel);
  backdrop-filter: blur(16px);
}

.topbar-brand, .topbar-actions {
  display: flex;
  align-items: center;
  gap: 14px;
}

.admin-layout {
  display: grid;
  gap: 20px;
}

.section-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}

.section-head.compact {
  margin-bottom: 12px;
}

.metric {
  padding: 18px;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.025);
  border: 1px solid var(--border);
}

.metric strong {
  display: block;
  margin-top: 12px;
  font-size: 28px;
}

.table-wrap {
  overflow-x: auto;
}

table {
  width: 100%;
  border-collapse: collapse;
}

th, td {
  padding: 14px 10px;
  text-align: left;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  font-size: 14px;
}

td .row-actions {
  display: flex;
  gap: 8px;
}

.muted {
  color: var(--muted);
}

.wheel-layout {
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 24px;
  align-items: start;
}

.miniapp-top {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 14px 0 18px;
  background: linear-gradient(180deg, rgba(9, 11, 15, 0.98) 72%, rgba(9, 11, 15, 0));
}

.miniapp-main {
  display: grid;
  gap: 16px;
}

.mobile-panel {
  padding: 18px;
  border-radius: 22px;
}

.miniapp-balance {
  display: grid;
  gap: 6px;
  min-width: 118px;
  padding: 12px 14px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--border);
}

.miniapp-balance span {
  color: var(--muted);
  font-size: 12px;
}

.action-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.wide-action {
  min-height: 72px;
  border-radius: 18px;
}

.stack-list {
  display: grid;
  gap: 10px;
}

.room-card {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding: 14px 16px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
}

.sheet {
  position: fixed;
  inset: 0;
  display: grid;
  align-items: end;
  padding: 12px;
  background: rgba(0, 0, 0, 0.48);
  z-index: 40;
}

.sheet.hidden {
  display: none;
}

.sheet-card {
  padding: 18px;
  border-radius: 24px 24px 18px 18px;
  background: #10151c;
  border: 1px solid var(--border);
  display: grid;
  gap: 12px;
  box-shadow: var(--shadow);
}

.mobile-nav {
  position: fixed;
  left: 16px;
  right: 16px;
  bottom: 16px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  padding: 10px;
  border-radius: 24px;
  background: rgba(15, 18, 24, 0.92);
  border: 1px solid var(--border);
  backdrop-filter: blur(18px);
  z-index: 30;
}

.nav-btn {
  min-height: 52px;
  border-radius: 16px;
  background: transparent;
  color: var(--muted);
  border: 1px solid transparent;
}

.nav-btn.active {
  color: var(--text);
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.08);
}

.wheel-stage {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 80vh;
}

#wheel-canvas {
  width: min(78vh, 80vw);
  height: min(78vh, 80vw);
  max-width: 900px;
  max-height: 900px;
}

.pointer {
  position: absolute;
  top: 42px;
  width: 0;
  height: 0;
  border-left: 18px solid transparent;
  border-right: 18px solid transparent;
  border-top: 28px solid #ffffff;
  z-index: 2;
}

.winner-badge {
  position: absolute;
  bottom: 32px;
  padding: 16px 20px;
  border-radius: 18px;
  background: rgba(0, 0, 0, 0.48);
  border: 1px solid var(--border);
  backdrop-filter: blur(16px);
}

.winner-badge.hidden {
  display: none;
}

.meta-stack {
  display: grid;
  gap: 10px;
  margin-top: 18px;
}

.player-chip {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.03);
}

@media (max-width: 960px) {
  .page-shell { padding: 16px; }
  .wheel-layout { grid-template-columns: 1fr; }
  .brand-block { flex-direction: column; align-items: flex-start; }
  .section-head { flex-direction: column; align-items: stretch; }
  .action-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 640px) {
  .action-grid { grid-template-columns: 1fr; }
  .miniapp-top h1 {
    font-size: 28px;
  }
}

.rakes-app .sheet {
  position: fixed;
  inset: 0;
  display: grid;
  align-items: end;
  padding: 10px;
  background: rgba(0, 0, 0, 0.58);
  z-index: 60;
}

.rakes-app .sheet.hidden {
  display: none;
}

.rakes-app .sheet-card.compact-sheet {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #0e1014;
  box-shadow: var(--shadow);
}

.rakes-app button {
  border-radius: 8px;
}

.rakes-app input {
  border-color: var(--line);
}

/* v4.1 final alignment fixes. Keep this block last. */
.rakes-app .round-ledger,
.rakes-app .round-ledger * {
  box-sizing: border-box;
}

.rakes-app .round-ledger .stat-card {
  justify-items: start;
  text-align: left;
}

.rakes-app .round-ledger .stat-card:nth-child(2),
.rakes-app .round-ledger .stat-card:nth-child(2) section,
.rakes-app .round-ledger .stat-card:nth-child(2) span,
.rakes-app .round-ledger .stat-card:nth-child(2) strong {
  text-align: left;
  justify-content: start;
  justify-items: start;
}

.rakes-app .round-ledger section {
  width: 100%;
}

.rakes-app .round-ledger strong {
  align-items: center;
  vertical-align: middle;
}

.rakes-app .round-ledger strong > span {
  display: inline-flex;
  align-items: center;
}

.rakes-app .round-ledger small {
  position: relative;
  top: 0;
  margin: 0;
  transform: none;
}

.rakes-app .stake-presets button {
  height: 36px;
  min-height: 36px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  line-height: 1;
  text-align: center;
}

.rakes-app .bottom-nav {
  height: calc(82px + env(safe-area-inset-bottom));
  padding: 10px;
  align-items: stretch;
  overflow: hidden;
}

.rakes-app .bottom-nav button {
  width: 100%;
  height: 100%;
  min-height: 0;
  padding: 0;
  display: grid;
  place-items: center;
  align-content: center;
  justify-items: center;
  gap: 5px;
  border-radius: 14px;
  line-height: 1;
  text-align: center;
}

.rakes-app .bottom-nav button.active {
  border: 1px solid rgba(79, 255, 124, 0.12);
  border-radius: 14px;
  box-shadow: inset 0 0 0 1px rgba(79, 255, 124, 0.025);
}

.rakes-app .bottom-nav svg {
  display: block;
  margin: 0 auto;
}

.rakes-app .bottom-nav span {
  display: block;
  width: 100%;
  text-align: center;
  line-height: 1;
}

@media (max-width: 540px) {
  .rakes-app .bottom-nav {
    height: calc(78px + env(safe-area-inset-bottom));
    padding: 9px;
  }

  .rakes-app .stake-presets button {
    height: 34px;
    min-height: 34px;
  }
}

/* v4.2 typography and numeric rendering fixes. Keep this block last. */
body.rakes-app {
  font-family: "Montserrat", "Segoe UI", Arial, sans-serif;
}

.rakes-app .round-ledger strong,
.rakes-app .round-ledger strong > span,
.rakes-app .balance-chip,
.rakes-app .bet-dock input,
.rakes-app .round-strip strong,
.rakes-app .wheel-hub span {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1, "lnum" 1;
}

.rakes-app .round-ledger strong {
  overflow: visible;
  letter-spacing: -0.018em;
}

.rakes-app .round-ledger strong > span {
  overflow: visible;
  padding-right: 3px;
  letter-spacing: -0.018em;
  text-overflow: clip;
}

.rakes-app .round-ledger small {
  flex: 0 0 auto;
  align-self: center;
}

.rakes-app .balance-chip,
.rakes-app .bet-dock input,
.rakes-app .wheel-hub span {
  letter-spacing: -0.025em;
}

.rakes-app .wheel-hub span {
  font-size: clamp(32px, 8vw, 52px);
}

/* v5.0 admin control center refresh */
body.admin-shell {
  padding: 18px;
}

.admin-frame {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  gap: 18px;
  min-height: calc(100vh - 36px);
}

.admin-sidebar,
.admin-toolbar-card,
.admin-card,
.admin-table-card,
.admin-mini-kpi {
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: #0f1318;
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.28);
}

.admin-sidebar {
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 18px;
  padding: 22px 18px;
  border-radius: 28px;
  position: sticky;
  top: 18px;
  height: calc(100vh - 36px);
}

.admin-sidebar-copy {
  margin: 10px 0 0;
  color: rgba(244, 247, 243, 0.54);
  font-size: 13px;
  line-height: 1.5;
}

.admin-nav {
  display: grid;
  gap: 8px;
  align-content: start;
}

.admin-nav-btn {
  min-height: 46px;
  justify-content: flex-start;
  padding: 0 14px;
  border-radius: 14px;
  background: transparent;
  border: 1px solid transparent;
  color: rgba(244, 247, 243, 0.7);
  text-align: left;
}

.admin-nav-btn.active {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.08);
  color: #f4f7f3;
}

.admin-sidebar-bottom {
  display: grid;
  gap: 12px;
}

.admin-operator {
  padding: 14px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.03);
  display: grid;
  gap: 6px;
}

.admin-operator span {
  color: rgba(244, 247, 243, 0.5);
  font-size: 12px;
}

.admin-sidebar-logout {
  width: 100%;
}

.admin-main {
  display: grid;
  align-content: start;
  gap: 18px;
}

.admin-header {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 16px;
  padding: 8px 4px;
}

.admin-header h1 {
  margin: 4px 0 0;
  font-size: clamp(28px, 3vw, 40px);
  letter-spacing: -0.04em;
}

.admin-summary-strip {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 10px;
}

.admin-mini-kpi {
  padding: 14px;
  border-radius: 18px;
  display: grid;
  gap: 8px;
}

.admin-mini-kpi span {
  color: rgba(244, 247, 243, 0.5);
  font-size: 12px;
}

.admin-mini-kpi strong {
  font-size: 19px;
  letter-spacing: -0.03em;
}

.admin-toolbar-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  align-items: start;
}

.admin-toolbar-card,
.admin-card,
.admin-table-card {
  padding: 18px;
  border-radius: 26px;
}

.admin-toolbar-card {
  display: grid;
  align-content: start;
}

.admin-card-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
}

.admin-card-head h3 {
  margin: 0;
  font-size: 18px;
}

.admin-card-head span {
  color: rgba(244, 247, 243, 0.48);
  font-size: 13px;
}

.admin-stack-form {
  display: grid;
  gap: 10px;
}

.admin-input-with-action {
  position: relative;
}

.admin-stack-form input,
.admin-stack-form select,
.admin-panel-head input {
  min-height: 46px;
  border-radius: 14px;
  background: #0b0f13;
  border: 1px solid rgba(255, 255, 255, 0.08);
  color: #f4f7f3;
  padding: 0 14px;
}

.admin-input-with-action input {
  width: 100%;
  padding-right: 56px;
}

.admin-stack-form button {
  min-height: 46px;
  border-radius: 14px;
}

.admin-icon-button {
  position: absolute;
  top: 7px;
  right: 7px;
  width: 32px;
  min-width: 32px;
  min-height: 32px !important;
  height: 32px;
  padding: 0;
  border-radius: 10px !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.admin-icon-button svg {
  width: 16px;
  height: 16px;
}

.admin-inline-status {
  min-height: 20px;
  margin: 10px 0 0;
  color: rgba(244, 247, 243, 0.48);
  font-size: 13px;
}

.admin-inline-status.good {
  color: #82f3aa;
}

.admin-inline-status.bad {
  color: #ff8888;
}

.admin-toolbar-note {
  margin-top: 12px;
  padding: 14px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.03);
  display: grid;
  gap: 6px;
}

.admin-toolbar-note strong {
  font-size: 14px;
}

.admin-toolbar-note span {
  font-size: 24px;
  letter-spacing: -0.04em;
}

.admin-toolbar-note small {
  color: rgba(244, 247, 243, 0.5);
  line-height: 1.45;
}

.admin-panel {
  display: grid;
  gap: 18px;
}

.admin-panel[hidden] {
  display: none !important;
}

.admin-kpi-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.admin-kpi-card {
  padding: 18px;
  border-radius: 24px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: #10151b;
  display: grid;
  gap: 8px;
}

.admin-kpi-card span,
.admin-kpi-card small {
  color: rgba(244, 247, 243, 0.52);
}

.admin-kpi-card strong {
  font-size: 28px;
  letter-spacing: -0.04em;
}

.admin-overview-grid,
.admin-games-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.admin-span-2 {
  grid-column: span 2;
}

.admin-queue-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.admin-queue-card {
  padding: 14px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.03);
  display: grid;
  gap: 6px;
}

.admin-queue-card b {
  font-size: 15px;
}

.admin-queue-card p {
  margin: 0;
  color: rgba(244, 247, 243, 0.58);
}

.admin-list,
.admin-log-list {
  display: grid;
  gap: 10px;
}

.admin-list-row,
.admin-log-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding: 13px 14px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.03);
}

.admin-list-row strong,
.admin-log-row strong,
.admin-primary-cell strong {
  display: block;
  font-size: 14px;
}

.admin-list-row small,
.admin-log-row small,
.admin-primary-cell small {
  color: rgba(244, 247, 243, 0.5);
  font-size: 12px;
}

.admin-list-meta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.admin-badge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  font-size: 12px;
  text-transform: capitalize;
}

.admin-badge.good {
  color: #86f3af;
  background: rgba(85, 255, 129, 0.08);
}

.admin-badge.warn {
  color: #ffd46f;
  background: rgba(255, 212, 111, 0.08);
}

.admin-badge.bad {
  color: #ff8d8d;
  background: rgba(255, 141, 141, 0.08);
}

.admin-badge.neutral {
  color: rgba(244, 247, 243, 0.72);
  background: rgba(255, 255, 255, 0.04);
}

.admin-table-wrap {
  overflow: auto;
}

.admin-table {
  width: 100%;
  border-collapse: collapse;
}

.admin-table th,
.admin-table td {
  padding: 14px 12px;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  font-size: 13px;
}

.admin-table th {
  color: rgba(244, 247, 243, 0.46);
  font-weight: 600;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.admin-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.admin-actions .ghost,
.admin-link-btn {
  min-height: 34px;
  padding: 0 12px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

.admin-actions .danger {
  color: #ff9999;
  border-color: rgba(255, 120, 120, 0.2);
}

.admin-panel-head {
  margin: 0;
}

.admin-pre,
.admin-mono {
  font-family: "JetBrains Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 12px;
}

.admin-pre {
  margin: 0;
  max-width: 320px;
  white-space: pre-wrap;
  color: rgba(244, 247, 243, 0.7);
}

.admin-empty {
  margin: 0;
  color: rgba(244, 247, 243, 0.52);
}

/* Панель создания дуэли от подставного игрока */
.admin-duel-form {
  max-width: 460px;
}

.admin-field {
  display: grid;
  gap: 6px;
}

.admin-field > span {
  font-size: 12px;
  letter-spacing: 0.02em;
  color: rgba(244, 247, 243, 0.6);
}

.admin-field-hint {
  font-size: 11px;
  color: rgba(244, 247, 243, 0.42);
}

.admin-duel-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 16px;
  border-radius: 14px;
  background: #0b0f13;
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.admin-duel-toggle-copy {
  display: grid;
  gap: 4px;
}

.admin-duel-toggle-copy strong {
  font-size: 14px;
}

.admin-duel-toggle-copy small {
  font-size: 12px;
  color: rgba(244, 247, 243, 0.52);
  max-width: 260px;
}

.admin-switch {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  user-select: none;
}

.admin-switch input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

.admin-switch-track {
  position: relative;
  width: 46px;
  height: 26px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  transition: background 0.18s ease;
  flex: none;
}

.admin-switch-thumb {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #f4f7f3;
  transition: transform 0.18s ease;
}

.admin-switch input:checked + .admin-switch-track {
  background: #35d07f;
}

.admin-switch input:checked + .admin-switch-track .admin-switch-thumb {
  transform: translateX(20px);
}

.admin-switch-label {
  font-size: 13px;
  font-weight: 600;
  min-width: 78px;
}

@media (max-width: 1240px) {
  .admin-frame {
    grid-template-columns: 1fr;
  }

  .admin-sidebar {
    position: static;
    height: auto;
  }

  .admin-summary-strip,
  .admin-kpi-grid,
  .admin-overview-grid,
  .admin-games-grid,
  .admin-toolbar-grid,
  .admin-queue-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-span-2 {
    grid-column: span 1;
  }
}

@media (max-width: 760px) {
  body.admin-shell {
    padding: 12px;
  }

  .admin-frame {
    gap: 12px;
  }

  .admin-summary-strip,
  .admin-kpi-grid,
  .admin-overview-grid,
  .admin-games-grid,
  .admin-toolbar-grid,
  .admin-queue-grid {
    grid-template-columns: 1fr;
  }

  .admin-header {
    flex-direction: column;
    align-items: flex-start;
  }

  .admin-sidebar,
  .admin-toolbar-card,
  .admin-card,
  .admin-table-card {
    border-radius: 20px;
  }
}

.rakes-app .wheel-hub small {
  max-width: 86%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* v4.3 compact Telegram density, ticket feed and final mobile overrides. Keep this block last. */
.rakes-app .rakes-mobile {
  width: min(100%, 480px);
  padding: max(14px, env(safe-area-inset-top)) 13px calc(92px + env(safe-area-inset-bottom));
  border: 0;
}

.rakes-app .casino-topbar {
  height: 46px;
  gap: 10px;
}

.rakes-app .brand-mark {
  gap: 10px;
  font-size: 20px;
}

.rakes-app .brand-mark b {
  width: 34px;
  height: 34px;
  border-width: 3px;
  border-radius: 11px 11px 11px 4px;
  box-shadow: 0 0 16px rgba(79, 255, 124, 0.34), inset 0 0 0 5px #040a07;
}

.rakes-app .balance-chip,
.rakes-app .avatar-chip {
  height: 42px;
  border-radius: 14px;
}

.rakes-app .balance-chip {
  min-width: 124px;
  gap: 8px;
  padding: 0 12px;
  font-size: 16px;
}

.rakes-app .balance-chip svg,
.rakes-app .avatar-chip svg {
  width: 20px;
  height: 20px;
}

.rakes-app .balance-chip small {
  font-size: 10px;
}

.rakes-app .avatar-chip {
  width: 42px;
}

.rakes-app .round-head {
  margin: 22px 0 12px;
  gap: 12px;
}

.rakes-app .round-kicker span {
  font-size: 15px;
}

.rakes-app .round-kicker em {
  padding: 5px 24px 5px 10px;
  font-size: 10px;
}

.rakes-app .round-ledger {
  min-height: 78px;
  grid-template-columns: minmax(0, 1.12fr) minmax(0, 0.88fr);
  border-radius: 16px;
}

.rakes-app .round-ledger .stat-card {
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 9px;
  padding: 12px 11px;
}

.rakes-app .stat-icon {
  width: 38px;
  height: 38px;
  padding: 10px;
}

.rakes-app .round-ledger section {
  height: 42px;
  grid-template-rows: 14px 24px;
  gap: 4px;
  align-content: center;
}

.rakes-app .round-ledger span {
  height: 14px;
  font-size: 9px;
  line-height: 14px;
}

.rakes-app .round-ledger strong {
  height: 24px;
  gap: 5px;
  font-size: 24px;
  line-height: 24px;
}

.rakes-app .round-ledger strong > span {
  height: 24px;
  line-height: 24px;
}

.rakes-app .round-ledger small {
  height: 18px;
  padding: 0 5px;
  font-size: 8px;
}

.rakes-app .wheel-arena {
  width: min(78vw, 344px);
  margin: 15px auto 14px;
}

.rakes-app .wheel-arena::before {
  inset: -12px;
  box-shadow: 0 22px 56px rgba(0, 0, 0, 0.68), 0 0 30px rgba(79, 255, 124, 0.12);
}

.rakes-app .wheel-arena::after {
  inset: 15px;
  border-width: 1px;
}

.rakes-app .wheel-pointer {
  top: -14px;
  width: 36px;
  height: 40px;
}

.rakes-app .wheel-hub {
  width: clamp(86px, 22vw, 104px);
  gap: 4px;
  border-width: 1px;
  box-shadow: 0 0 18px rgba(79, 255, 124, 0.16), inset 0 0 0 8px rgba(255, 255, 255, 0.014);
}

.rakes-app .wheel-hub span {
  font-size: clamp(27px, 7vw, 36px);
}

.rakes-app .wheel-hub small {
  font-size: 10px;
  letter-spacing: 0.10em;
}

.rakes-app .stake-presets {
  gap: 7px;
  margin: 0 0 10px;
}

.rakes-app .stake-presets button {
  height: 30px;
  min-height: 30px;
  font-size: 13px;
}

.rakes-app .bet-dock {
  height: 60px;
  grid-template-columns: 1fr 108px;
  gap: 8px;
  margin: 0 0 10px;
  padding: 6px;
  border-radius: 16px;
}

.rakes-app .bet-dock .bet-wrap,
.rakes-app .bet-dock button {
  border-radius: 12px;
}

.rakes-app .bet-dock .bet-wrap {
  padding: 0 13px;
}

.rakes-app .bet-dock input {
  font-size: 24px;
}

.rakes-app .bet-dock .bet-wrap span {
  font-size: 11px;
}

.rakes-app .bet-dock button {
  font-size: 16px;
}

.rakes-app .round-strip {
  min-height: 58px;
  margin: 0 0 10px;
  border-radius: 15px;
}

.rakes-app .round-strip div {
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 7px;
  padding: 10px 8px;
}

.rakes-app .round-strip i {
  width: 28px;
  height: 28px;
  padding: 7px;
}

.rakes-app .round-strip span {
  font-size: 9px;
}

.rakes-app .round-strip strong {
  font-size: 12px;
}

.bets-feed {
  max-height: 188px;
  display: grid;
  grid-auto-rows: 54px;      /* фикс высота строки — не растягивается от высоты экрана */
  align-content: start;      /* строки жмутся к верху, а не тянутся на всю ленту */
  gap: 7px;
  margin: 0 0 6px;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: none;
}

.bets-feed::-webkit-scrollbar {
  display: none;
}

.bet-row {
  height: 54px;               /* фиксированная высота ставки */
  min-height: 54px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 10px;
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 14px;
  background: rgba(5, 10, 8, 0.86);
}

.bet-row.is-winner {
  border-color: rgba(79, 255, 124, 0.42);
  background: rgba(18, 48, 26, 0.52);
}

.bet-row-empty {
  justify-content: center;
  color: rgba(244, 247, 243, 0.42);
  font-size: 12px;
  font-weight: 700;
}

.bet-player {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 9px;
}

.bet-avatar {
  width: 36px;
  height: 36px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(79, 255, 124, 0.22);
  border-radius: 50%;
  background: #101613;
  color: var(--r-text);
  font-size: 12px;
  font-weight: 800;
}

.bet-avatar img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.bet-name,
.bet-meta {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.bet-name strong,
.bet-meta strong {
  overflow: hidden;
  color: var(--r-text);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bet-name small,
.bet-meta small {
  overflow: hidden;
  color: rgba(244, 247, 243, 0.50);
  font-size: 10px;
  font-weight: 700;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bet-meta {
  flex: 0 0 auto;
  justify-items: end;
  text-align: right;
}

.bet-meta small {
  color: var(--r-accent);
}

.rakes-app .bottom-nav {
  width: min(calc(100% - 22px), 458px);
  height: calc(64px + env(safe-area-inset-bottom));
  bottom: 8px;
  padding: 7px;
  border-radius: 16px;
}

.rakes-app .bottom-nav button {
  border-radius: 12px;
  font-size: 10px;
  gap: 4px;
}

.rakes-app .bottom-nav svg {
  width: 20px;
  height: 20px;
}

@media (max-width: 380px) {
  .rakes-app .brand-mark span {
    display: none;
  }

  .rakes-app .round-ledger .stat-card {
    grid-template-columns: 1fr;
    place-items: center;
    gap: 5px;
    padding: 10px 6px;
    text-align: center;
  }

  .rakes-app .round-ledger section {
    place-items: center;
  }

  .rakes-app .round-ledger strong {
    justify-content: center;
    font-size: 22px;
  }

  .rakes-app .bet-dock {
    grid-template-columns: 1fr 96px;
  }

  .rakes-app .round-strip {
    grid-template-columns: repeat(3, 1fr);
  }

  .rakes-app .round-strip div + div {
    border-top: 0;
    border-left: 1px solid rgba(255, 255, 255, 0.08);
  }

  .rakes-app .round-strip div {
    grid-template-columns: 1fr;
    place-items: center;
    gap: 5px;
    text-align: center;
  }
}

/* v4.6 absolute final overrides: no green bet border, larger POOL/PLAYERS. */
.rakes-app .round-ledger {
  min-height: 104px !important;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr) !important;
  border-color: rgba(255, 255, 255, 0.11) !important;
  border-radius: 18px !important;
}

.rakes-app .round-ledger .stat-card {
  grid-template-columns: 48px minmax(0, 1fr) !important;
  gap: 13px !important;
  padding: 17px 15px !important;
  place-items: center start !important;
  text-align: left !important;
}

.rakes-app .round-ledger .stat-card + .stat-card {
  border-left-color: rgba(255, 255, 255, 0.10) !important;
}

.rakes-app .stat-icon {
  width: 48px !important;
  height: 48px !important;
  padding: 12px !important;
}

.rakes-app .round-ledger section {
  height: 58px !important;
  grid-template-rows: 22px 32px !important;
  gap: 4px !important;
  place-items: start !important;
  align-content: center !important;
}

.rakes-app .round-ledger span {
  height: 22px !important;
  color: rgba(244, 247, 243, 0.80) !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  line-height: 22px !important;
}

.rakes-app .round-ledger strong {
  height: 32px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: start !important;
  gap: 8px !important;
  overflow: visible !important;
  color: var(--r-text) !important;
  font-size: 31px !important;
  font-weight: 800 !important;
  letter-spacing: -0.015em !important;
  line-height: 32px !important;
  text-align: left !important;
}

.rakes-app .round-ledger strong > span {
  height: 32px !important;
  display: inline-flex !important;
  align-items: center !important;
  overflow: visible !important;
  padding-right: 2px !important;
  line-height: 32px !important;
}

.rakes-app .round-ledger .token-logo {
  width: 25px !important;
  height: 25px !important;
}

.rakes-app .bet-dock {
  height: 68px !important;
  grid-template-columns: 1fr 112px !important;
  gap: 8px !important;
  padding: 8px !important;
  border-color: rgba(255, 255, 255, 0.09) !important;
  background: rgba(7, 11, 10, 0.92) !important;
  box-shadow: none !important;
}

.rakes-app .bet-dock .bet-wrap,
.rakes-app .bet-dock button {
  min-height: 52px !important;
  border-color: rgba(255, 255, 255, 0.09) !important;
  box-shadow: none !important;
}

.rakes-app .bet-dock .bet-wrap {
  padding: 0 18px !important;
  background: rgba(4, 7, 6, 0.96) !important;
}

.rakes-app .bet-dock input {
  height: 52px !important;
  line-height: 52px !important;
  font-size: 26px !important;
}

.rakes-app .bet-dock button {
  border: 0 !important;
  background: #f4f7f3 !important;
  color: #050706 !important;
  font-size: 17px !important;
}

@media (max-width: 380px) {
  .rakes-app .round-ledger .stat-card {
    grid-template-columns: 42px minmax(0, 1fr) !important;
    gap: 10px !important;
    padding: 14px 10px !important;
  }

  .rakes-app .stat-icon {
    width: 42px !important;
    height: 42px !important;
    padding: 11px !important;
  }

  .rakes-app .round-ledger span {
    font-size: 12px !important;
  }

  .rakes-app .round-ledger strong {
    font-size: 27px !important;
  }

  .rakes-app .bet-dock {
    grid-template-columns: 1fr 100px !important;
  }
}

/* v4.9 real EOF: balanced pool panel, spacing, neutral bet controls. */
.rakes-app .round-head {
  margin: 22px 0 20px !important;
  gap: 12px !important;
}

.rakes-app .round-ledger {
  min-height: 88px !important;
  grid-template-columns: minmax(0, 1.04fr) minmax(0, 0.96fr) !important;
  border-color: rgba(255, 255, 255, 0.09) !important;
  border-radius: 17px !important;
  background: linear-gradient(180deg, rgba(13, 22, 18, 0.96), rgba(6, 11, 9, 0.96)) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.025), 0 14px 34px rgba(0, 0, 0, 0.28) !important;
}

.rakes-app .round-ledger .stat-card {
  grid-template-columns: 40px minmax(0, 1fr) !important;
  gap: 11px !important;
  padding: 14px !important;
  place-items: center start !important;
  text-align: left !important;
}

.rakes-app .round-ledger .stat-card + .stat-card {
  border-left-color: rgba(255, 255, 255, 0.075) !important;
}

.rakes-app .stat-icon {
  width: 40px !important;
  height: 40px !important;
  padding: 10px !important;
  border-color: rgba(79, 255, 124, 0.16) !important;
  box-shadow: none !important;
}

.rakes-app .round-ledger section {
  height: 48px !important;
  grid-template-rows: 18px 28px !important;
  gap: 2px !important;
  place-items: start !important;
  align-content: center !important;
}

.rakes-app .round-ledger span {
  height: 18px !important;
  color: rgba(244, 247, 243, 0.66) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: 0.09em !important;
  line-height: 18px !important;
}

.rakes-app .round-ledger strong {
  height: 28px !important;
  gap: 7px !important;
  font-size: 27px !important;
  font-weight: 800 !important;
  line-height: 28px !important;
}

.rakes-app .round-ledger strong > span {
  height: 28px !important;
  line-height: 28px !important;
}

.rakes-app .round-ledger .token-logo {
  width: 22px !important;
  height: 22px !important;
}

.rakes-app .wheel-arena {
  margin: 20px auto 22px !important;
}

.rakes-app .stake-presets {
  margin-top: 0 !important;
  margin-bottom: 12px !important;
}

.rakes-app .bet-dock {
  height: 68px !important;
  grid-template-columns: 1fr 112px !important;
  gap: 8px !important;
  padding: 8px !important;
  border-color: rgba(255, 255, 255, 0.09) !important;
  background: rgba(7, 11, 10, 0.92) !important;
  box-shadow: none !important;
}

.rakes-app .bet-dock .bet-wrap,
.rakes-app .bet-dock button {
  min-height: 52px !important;
  border-color: rgba(255, 255, 255, 0.09) !important;
  box-shadow: none !important;
}

.rakes-app .bet-dock .bet-wrap {
  padding: 0 18px !important;
  background: rgba(4, 7, 6, 0.96) !important;
}

.rakes-app .bet-dock input {
  height: 52px !important;
  line-height: 52px !important;
  font-size: 26px !important;
}

.rakes-app .bet-dock button {
  border: 0 !important;
  background: #f4f7f3 !important;
  color: #050706 !important;
  font-size: 17px !important;
}

@media (max-width: 380px) {
  .rakes-app .round-ledger {
    min-height: 82px !important;
  }

  .rakes-app .round-ledger .stat-card {
    grid-template-columns: 34px minmax(0, 1fr) !important;
    gap: 8px !important;
    padding: 12px 9px !important;
  }

  .rakes-app .stat-icon {
    width: 34px !important;
    height: 34px !important;
    padding: 8px !important;
  }

  .rakes-app .round-ledger span {
    font-size: 10px !important;
  }

  .rakes-app .round-ledger strong {
    font-size: 23px !important;
  }

  .rakes-app .round-ledger .token-logo {
    width: 19px !important;
    height: 19px !important;
  }

  .rakes-app .bet-dock {
    grid-template-columns: 1fr 100px !important;
  }
}

/* v4.10 result popup and play-only wheel hub. */
.rakes-app .wheel-hub svg,
.rakes-app .wheel-hub [data-lucide] {
  width: 34px;
  height: 34px;
  display: none;
  color: var(--r-accent);
  stroke-width: 2.4;
}

.rakes-app .wheel-hub[data-mode="play"] span,
.rakes-app .wheel-hub[data-mode="play"] small,
.rakes-app .wheel-hub[data-mode="result"] span,
.rakes-app .wheel-hub[data-mode="result"] small,
.rakes-app .wheel-hub[data-mode="result"] svg,
.rakes-app .wheel-hub[data-mode="result"] [data-lucide] {
  display: none !important;
}

.rakes-app .wheel-hub[data-mode="play"] svg,
.rakes-app .wheel-hub[data-mode="play"] [data-lucide] {
  display: block !important;
}

.rakes-app .wheel-hub[data-mode="result"] {
  opacity: 0;
}

.result-popover {
  position: absolute;
  left: 50%;
  top: 44%; /* чуть выше центра колеса */
  z-index: 9;
  width: min(84vw, 264px);
  display: grid;
  gap: 8px;
  padding: 16px;
  transform: translate(-50%, -50%);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 18px;
  background: rgba(5, 8, 7, 0.96);
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.58), inset 0 0 0 1px rgba(255, 255, 255, 0.025);
  text-align: center;
  backdrop-filter: blur(10px);
  animation: result-pop 260ms ease-out both;
}

.result-popover.hidden {
  display: none;
}

.result-popover > span {
  color: rgba(244, 247, 243, 0.56);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
  line-height: 1;
  text-transform: uppercase;
}

.result-popover > strong {
  overflow: hidden;
  color: var(--r-text);
  font-size: 20px;
  font-weight: 900;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.result-popover div {
  min-height: 34px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 10px;
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.025);
}

.result-popover small {
  color: rgba(244, 247, 243, 0.52);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.result-popover b {
  color: var(--r-accent);
  font-size: 13px;
  font-weight: 900;
  line-height: 1;
  /* число и значок USDT — одной строкой: инлайновый <b> рвался между ними,
     значок падал под число и строка перекашивалась */
  display: inline-flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
  flex: 0 0 auto;
}
.result-popover small { flex: 0 0 auto; }

.result-verify-form,
.duel-verify-form {
  display: inline-flex;
  justify-content: center;
}

.result-verify-form[hidden],
.duel-verify-form[hidden] {
  display: none !important;
}

.result-verify,
.duel-verify {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 38px;
  padding: 0 12px;
  border: 1px solid rgba(255,255,255,0.09);
  border-radius: 12px;
  background: rgba(255,255,255,0.04);
  color: var(--r-text);
  font-size: 12px;
  font-weight: 900;
}

.result-verify[hidden],
.duel-verify[hidden] {
  display: none !important;
}

.result-verify svg,
.duel-verify svg {
  width: 14px;
  height: 14px;
}

@keyframes result-pop {
  from {
    opacity: 0;
    transform: translate(-50%, -46%) scale(0.94);
  }
  to {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }
}

/* v4.11 above-the-fold mobile layout: bet input visible without scrolling. */
.rakes-app .rakes-mobile {
  min-height: 100svh !important;
  padding: max(8px, env(safe-area-inset-top)) 12px calc(78px + env(safe-area-inset-bottom)) !important;
}

.rakes-app .casino-topbar {
  height: 42px !important;
}

.rakes-app .brand-wordmark {
  display: block !important;
  width: auto !important;
  height: 24px !important;
  max-width: min(42vw, 150px) !important;
  object-fit: contain !important;
  flex: 0 0 auto !important;
}

.rakes-app .brand-mark {
  font-size: 18px !important;
  gap: 9px !important;
}

.rakes-app .brand-mark b {
  width: 30px !important;
  height: 30px !important;
}

.rakes-app .balance-chip,
.rakes-app .avatar-chip {
  height: 38px !important;
}

.rakes-app .avatar-chip {
  width: 38px !important;
}

.rakes-app .round-head {
  margin: 12px 0 12px !important;
  gap: 8px !important;
}

.rakes-app .round-kicker {
  min-height: 18px !important;
}

.rakes-app .round-kicker span {
  font-size: 12px !important;
}

.rakes-app .round-kicker em {
  padding: 4px 18px 4px 8px !important;
  font-size: 9px !important;
}

.rakes-app .round-ledger {
  min-height: 74px !important;
  border-radius: 15px !important;
}

.rakes-app .round-ledger .stat-card {
  grid-template-columns: 34px minmax(0, 1fr) !important;
  gap: 9px !important;
  padding: 10px 11px !important;
}

.rakes-app .stat-icon {
  width: 34px !important;
  height: 34px !important;
  padding: 8px !important;
}

.rakes-app .round-ledger section {
  height: 42px !important;
  grid-template-rows: 15px 25px !important;
  gap: 2px !important;
}

.rakes-app .round-ledger span {
  height: 15px !important;
  font-size: 10px !important;
  line-height: 15px !important;
}

.rakes-app .round-ledger strong {
  height: 25px !important;
  gap: 6px !important;
  font-size: 24px !important;
  line-height: 25px !important;
}

.rakes-app .round-ledger strong > span {
  height: 25px !important;
  line-height: 25px !important;
}

.rakes-app .round-ledger .token-logo {
  width: 20px !important;
  height: 20px !important;
}

.rakes-app .wheel-arena {
  width: min(70vw, 310px, calc(100svh - 312px)) !important;
  min-width: 238px !important;
  margin: 2px auto 12px !important;
}

.rakes-app .wheel-arena::before {
  inset: -10px !important;
}

.rakes-app .wheel-arena::after {
  inset: 13px !important;
}

.rakes-app .wheel-pointer {
  top: -12px !important;
  width: 30px !important;
  height: 34px !important;
}

.rakes-app .wheel-hub {
  width: clamp(74px, 20vw, 92px) !important;
}

.rakes-app .stake-presets {
  gap: 6px !important;
  margin: 0 0 8px !important;
}

.rakes-app .stake-presets button {
  height: 28px !important;
  min-height: 28px !important;
  font-size: 12px !important;
}

.rakes-app .bet-dock {
  height: 58px !important;
  grid-template-columns: 1fr 104px !important;
  gap: 7px !important;
  margin-bottom: 8px !important;
  padding: 6px !important;
}

.rakes-app .bet-dock .bet-wrap,
.rakes-app .bet-dock button {
  min-height: 46px !important;
}

.rakes-app .bet-dock .bet-wrap {
  padding: 0 15px !important;
}

.rakes-app .bet-dock input {
  height: 46px !important;
  line-height: 46px !important;
  font-size: 23px !important;
}

.rakes-app .bet-dock button {
  font-size: 16px !important;
}

.rakes-app .round-strip {
  min-height: 50px !important;
  margin-top: 8px !important;
}

.rakes-app .bets-feed {
  max-height: 150px !important;
}

@media (max-height: 640px) {
  .rakes-app .rakes-mobile {
    padding-top: max(6px, env(safe-area-inset-top)) !important;
  }

  .rakes-app .round-kicker {
    display: none !important;
  }

  .rakes-app .round-head {
    margin-top: 8px !important;
  }

  .rakes-app .wheel-arena {
    width: min(66vw, 286px, calc(100svh - 270px)) !important;
    min-width: 220px !important;
    margin-top: 10px !important;
    margin-bottom: 12px !important;
  }

  .rakes-app .round-strip {
    display: none !important;
  }

  .rakes-app .bets-feed {
    max-height: 112px !important;
  }
}

@media (max-height: 590px) {
  .rakes-app .round-ledger {
    min-height: 68px !important;
  }

  .rakes-app .wheel-arena {
    width: min(62vw, 250px, calc(100svh - 246px)) !important;
    min-width: 205px !important;
  }

  .rakes-app .stake-presets button {
    height: 26px !important;
    min-height: 26px !important;
  }

  .rakes-app .bet-dock {
    height: 54px !important;
  }
}

/* v4.12 wait icon and balanced bet dock padding. */
.rakes-app .wheel-hub[data-mode="wait"] span,
.rakes-app .wheel-hub[data-mode="wait"] small,
.rakes-app .wheel-hub[data-mode="wait"] #round-play-icon,
.rakes-app .wheel-hub[data-mode="wait"] svg:not(#round-wait-icon svg) {
  display: none !important;
}

.rakes-app .wheel-hub[data-mode="wait"] #round-wait-icon,
.rakes-app .wheel-hub[data-mode="wait"] #round-wait-icon svg,
.rakes-app .wheel-hub[data-mode="wait"] > svg {
  display: block !important;
}

.rakes-app .wheel-hub[data-mode="wait"] [data-lucide="hourglass"] {
  display: block !important;
}

.rakes-app .bet-dock {
  align-items: center !important;
  padding: 7px !important;
  height: 60px !important;
}

.rakes-app .bet-dock .bet-wrap,
.rakes-app .bet-dock button {
  height: 46px !important;
  min-height: 46px !important;
  max-height: 46px !important;
  align-self: center !important;
}

.rakes-app .bet-dock .bet-wrap {
  display: grid !important;
  align-items: center !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.rakes-app .bet-dock input {
  height: 46px !important;
  line-height: 46px !important;
  padding: 0 !important;
}

.rakes-app .bet-dock button {
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  line-height: 1 !important;
}

/* v4.13 profile screen and exact wheel hub icon modes. */
.view-hidden {
  display: none !important;
}

.rakes-app .wheel-hub[data-mode="play"] svg,
.rakes-app .wheel-hub[data-mode="wait"] svg {
  display: none !important;
}

.rakes-app .wheel-hub[data-mode="play"] #round-play-icon,
.rakes-app .wheel-hub[data-mode="wait"] #round-wait-icon {
  display: block !important;
}

.profile-view {
  width: min(100%, 480px);
  min-height: 100svh;
  margin: 0 auto;
  padding: max(12px, env(safe-area-inset-top)) 12px calc(86px + env(safe-area-inset-bottom));
  color: var(--r-text);
}

.profile-top {
  height: 44px;
  display: grid;
  grid-template-columns: 40px 1fr 40px;
  align-items: center;
  gap: 8px;
}

.profile-top strong {
  text-align: center;
  font-size: 16px;
  font-weight: 900;
  letter-spacing: -0.04em;
}

.profile-back,
.profile-wallet {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  border-radius: 14px !important;
  background: rgba(7, 11, 10, 0.88) !important;
  color: var(--r-text) !important;
}

.profile-back svg,
.profile-wallet svg {
  width: 19px;
  height: 19px;
}

.profile-hero {
  min-height: 92px;
  display: grid;
  grid-template-columns: 74px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  margin: 14px 0 10px;
  padding: 13px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(13, 22, 18, 0.96), rgba(6, 11, 9, 0.96));
}

.profile-avatar {
  width: 74px;
  height: 74px;
  overflow: hidden;
  border: 1px solid rgba(79, 255, 124, 0.18);
  border-radius: 22px;
  background: #101613;
}

.profile-avatar img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.profile-main {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.profile-main span,
.profile-main strong,
.profile-main small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.profile-main span {
  color: var(--r-text);
  font-size: 20px;
  font-weight: 900;
  letter-spacing: -0.05em;
}

.profile-main strong {
  color: rgba(244, 247, 243, 0.62);
  font-size: 13px;
  font-weight: 800;
}

.profile-main small {
  color: rgba(244, 247, 243, 0.42);
  font-size: 11px;
  font-weight: 800;
}

.profile-balance-card,
.promo-card,
.profile-games-card {
  margin: 10px 0;
  padding: 14px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 18px;
  background: rgba(7, 11, 10, 0.92);
}

.profile-balance-card {
  display: grid;
  gap: 5px;
}

.profile-balance-card > span,
.promo-card span,
.profile-section-head span {
  color: rgba(244, 247, 243, 0.62);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.10em;
  text-transform: uppercase;
}

.profile-balance-card strong {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--r-text);
  font-size: 34px;
  font-weight: 900;
  letter-spacing: -0.04em;
  line-height: 1;
}

.profile-balance-card .token-logo {
  width: 25px;
  height: 25px;
}

.profile-balance-card small,
.promo-card small,
.profile-section-head small {
  color: rgba(244, 247, 243, 0.42);
  font-size: 11px;
  font-weight: 700;
}

.profile-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin: 10px 0;
}

.profile-stats div {
  min-height: 66px;
  display: grid;
  align-content: center;
  gap: 5px;
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  background: rgba(5, 8, 7, 0.86);
}

.profile-stats span {
  color: rgba(244, 247, 243, 0.48);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.profile-stats strong {
  overflow: hidden;
  color: var(--r-text);
  font-size: 16px;
  font-weight: 900;
  letter-spacing: -0.03em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.promo-card {
  display: grid;
  gap: 11px;
}

.promo-card > div {
  display: grid;
  gap: 4px;
}

.promo-card form {
  height: 48px;
  display: grid;
  grid-template-columns: 1fr 124px;
  gap: 8px;
}

.promo-card input,
.promo-card button {
  height: 48px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 14px;
  font-weight: 900;
}

.promo-card input {
  min-width: 0;
  padding: 0 13px;
  outline: 0;
  background: rgba(4, 7, 6, 0.96);
  color: var(--r-text);
  text-transform: uppercase;
}

.promo-card button {
  background: #f4f7f3;
  color: #050706;
  font-size: 12px;
}

.promo-card button:disabled {
  opacity: 0.52;
}

#promo-status {
  min-height: 16px;
  margin: 0;
  color: rgba(244, 247, 243, 0.58);
  font-size: 11px;
  font-weight: 700;
}

.profile-section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 9px;
}

.profile-games-list {
  display: grid;
  gap: 7px;
}

.profile-game-row {
  min-height: 46px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 10px;
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.02);
}

.profile-game-row b.pg-win { color: #8FE84F; }
.profile-game-row b.pg-loss { color: #ff7a6e; }

.profile-game-row.empty {
  justify-content: center;
  color: rgba(244, 247, 243, 0.42);
  font-size: 12px;
  font-weight: 800;
}

.profile-game-row div {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.profile-game-row div:last-child {
  justify-items: end;
  text-align: right;
}

.profile-game-row strong,
.profile-game-row span,
.profile-game-row b {
  color: var(--r-text);
  font-size: 13px;
  font-weight: 900;
}

.profile-game-row small {
  color: rgba(244, 247, 243, 0.42);
  font-size: 10px;
  font-weight: 800;
}

.profile-game-row b {
  color: rgba(244, 247, 243, 0.58);
}

.profile-game-row.win b {
  color: var(--r-accent);
}

@media (max-width: 380px) {
  .profile-stats {
    grid-template-columns: repeat(2, 1fr);
  }

  .promo-card form {
    grid-template-columns: 1fr 108px;
  }
}

/* v4.14 profile cleanup: no games block, balanced promo card, centered icon buttons. */
.profile-back,
.profile-wallet {
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 0 !important;
}

.profile-back svg,
.profile-wallet svg {
  display: block !important;
  width: 19px !important;
  height: 19px !important;
  margin: 0 !important;
  transform: none !important;
}

.profile-stats strong,
.profile-stats strong span,
#profile-wagered,
#profile-best-win {
  color: var(--r-text) !important;
  font-size: 16px !important;
  font-weight: 900 !important;
  line-height: 1.05 !important;
}

.promo-card {
  gap: 10px !important;
  margin: 10px 0 0 !important;
  padding: 14px !important;
}

.promo-card > div {
  gap: 3px !important;
}

.promo-card form {
  height: 48px !important;
  margin: 0 !important;
}

#promo-status {
  min-height: 0 !important;
  margin: -2px 0 0 !important;
  line-height: 1.25 !important;
}

#promo-status:empty {
  display: none !important;
}

.promo-sub-link {
  display: inline-block;
  margin-left: 6px;
  padding: 3px 10px;
  border-radius: 999px;
  background: #2AABEE;
  color: #fff !important;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}

/* Карточка игр с экрана профиля убрана. Сам СПИСОК скрывать нельзя: он переехал в шит
   «История» → вкладка «Игры», и это правило (display:none !important) делало её всегда
   пустой — сервер историю отдавал, а показать её было нечем. */
.profile-games-card {
  display: none !important;
}

/* v4.15 mutually exclusive wheel hub icons and random-sector stop support. */
.rakes-app .wheel-hub #round-play-icon,
.rakes-app .wheel-hub #round-wait-icon {
  display: none !important;
}

.rakes-app .wheel-hub[data-mode="play"] #round-play-icon {
  display: block !important;
}

.rakes-app .wheel-hub[data-mode="play"] #round-wait-icon,
.rakes-app .wheel-hub[data-mode="wait"] #round-play-icon,
.rakes-app .wheel-hub[data-mode="timer"] #round-play-icon,
.rakes-app .wheel-hub[data-mode="timer"] #round-wait-icon,
.rakes-app .wheel-hub[data-mode="result"] #round-play-icon,
.rakes-app .wheel-hub[data-mode="result"] #round-wait-icon {
  display: none !important;
}

.rakes-app .wheel-hub[data-mode="wait"] #round-wait-icon {
  display: block !important;
}

/* v4.16 remove green round-id dot. */
.rakes-app .round-kicker em {
  padding-right: 10px !important;
}

.rakes-app .round-kicker em::after {
  display: none !important;
  content: none !important;
}

/* v4.17 Duels coinflip mode. */
.duels-view {
  width: min(100%, 480px);
  min-height: 100svh;
  margin: 0 auto;
  padding: max(12px, env(safe-area-inset-top)) 12px calc(86px + env(safe-area-inset-bottom));
  color: var(--r-text);
}

.duels-casino-topbar {
  margin-bottom: 12px;
}

.duels-top {
  height: 58px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.duels-top div {
  display: grid;
  gap: 3px;
}

.duels-top > div > span {
  color: rgba(244, 247, 243, 0.54);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.duels-top strong {
  color: var(--r-text);
  font-size: 22px;
  font-weight: 900;
  letter-spacing: -0.05em;
}

.duels-top button {
  height: 42px;
  padding: 0 13px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 1px solid rgba(255,255,255,0.09) !important;
  border-radius: 14px !important;
  background: #f4f7f3 !important;
  color: #050706 !important;
  font-size: 13px;
  font-weight: 900;
}

.duels-top button span {
  color: #050706 !important;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: -0.01em;
  line-height: 1;
  text-transform: none;
}

.duels-top svg {
  width: 16px;
  height: 16px;
}

.duels-list {
  display: grid;
  gap: 9px;
  margin-top: 12px;
}

.duel-card {
  min-height: 82px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(13, 22, 18, 0.96), rgba(6, 11, 9, 0.96));
}

.duel-card.empty {
  display: grid;
  place-items: center;
  color: rgba(244,247,243,0.44);
  font-size: 13px;
  font-weight: 800;
}

.duel-card-main {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 11px;
}

.duel-card-avatar {
  width: 46px;
  height: 46px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 2px solid rgba(255, 255, 255, 0.12);
  border-radius: 50%;
  background: #111713;
  color: var(--r-text);
  font-size: 13px;
  font-weight: 900;
  line-height: 1;
}

.duel-card-avatar.blue {
  border-color: rgba(88, 168, 255, 0.72);
}

.duel-card-avatar.yellow {
  border-color: rgba(255, 211, 69, 0.82);
}

.duel-card-avatar img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.duel-coin {
  width: 46px;
  height: 46px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #050706;
  font-size: 16px;
  font-weight: 1000;
}

.duel-coin.blue,
.coin-face.blue {
  background: linear-gradient(145deg, #58a8ff, #1f63ff);
}

.duel-coin.yellow,
.coin-face.yellow {
  background: linear-gradient(145deg, #ffe16a, #ffb21f);
}

.duel-card-main strong {
  color: var(--r-text);
  font-size: 19px;
  font-weight: 900;
}

.duel-card-main small {
  display: block;
  margin-top: 3px;
  overflow: hidden;
  color: rgba(244,247,243,0.50);
  font-size: 11px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.duel-card-actions {
  display: grid;
  grid-auto-flow: column;
  gap: 6px;
  align-content: center;
}

.duel-card-actions button {
  width: 82px;
  height: 31px;
  padding: 0 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,255,255,0.09) !important;
  border-radius: 11px !important;
  background: rgba(255,255,255,0.04) !important;
  color: var(--r-text) !important;
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
  text-align: center;
  appearance: none;
}

.duel-card-actions button[data-duel-join] {
  background: #f4f7f3 !important;
  color: #050706 !important;
}

/* снять свою игру, пока не подсел соперник — приглушённо-красная, не спорит с «Играть» */
.duel-card-actions button[data-duel-cancel] {
  border-color: rgba(255,110,110,0.28) !important;
  background: rgba(255,80,80,0.10) !important;
  color: #ff9c9c !important;
}

.rakes-app .sheet-action.duel-cancel-action {
  margin-top: 8px;
  border: 1px solid rgba(255,110,110,0.3);
  background: rgba(255,80,80,0.11);
  color: #ff9c9c;
}

/* обратный отсчёт старта дуэли (3→2→1) на карточке — вместо кнопки «Играть» */
.duel-count {
  width: 31px; height: 31px; flex: 0 0 auto;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 11px; font-size: 15px; font-weight: 900; line-height: 1;
  font-variant-numeric: tabular-nums; color: #8FE84F;
  background: rgba(143,232,79,.14); border: 1px solid rgba(143,232,79,.4);
  box-shadow: 0 0 14px rgba(143,232,79,.2);
  animation: duelCountPulse .9s ease-in-out infinite;
}
@keyframes duelCountPulse {
  0%,100% { transform: scale(1); box-shadow: 0 0 12px rgba(143,232,79,.18); }
  50%     { transform: scale(1.08); box-shadow: 0 0 20px rgba(143,232,79,.34); }
}
.duel-card.starting {
  border-color: rgba(143,232,79,.28);
  background: linear-gradient(165deg, rgba(18,33,26,.6), rgba(12,21,18,.6));
  animation: duelStartFade .3s ease;
}
@keyframes duelStartFade { from { opacity: .55; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .duel-count, .duel-card.starting { animation: none; }
}

.duel-card-actions button:disabled {
  cursor: not-allowed;
  border-color: rgba(255,255,255,0.06) !important;
  background: rgba(255,255,255,0.035) !important;
  color: rgba(244,247,243,0.34) !important;
  opacity: 1;
}

.duel-create-form {
  display: grid;
  gap: 12px;
}

.duel-create-form label {
  display: grid;
  gap: 7px;
}

.duel-create-form label span {
  color: rgba(244,247,243,0.58);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.coin-picker {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.coin-picker button {
  height: 44px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,255,255,0.09) !important;
  border-radius: 14px !important;
  background: rgba(255,255,255,0.04) !important;
  color: var(--r-text) !important;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: -0.01em;
  line-height: 1;
  appearance: none;
}

.coin-picker button.active {
  border-color: rgba(82, 232, 124, 0.92) !important;
  background: rgba(82, 232, 124, 0.08) !important;
  color: var(--r-text) !important;
  box-shadow: inset 0 0 0 1px rgba(82, 232, 124, 0.72), 0 0 0 1px rgba(82, 232, 124, 0.10) !important;
}

.rakes-app .avatar-chip {
  width: 38px !important;
  height: 38px !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  line-height: 0 !important;
}

.rakes-app .avatar-chip svg {
  width: 19px !important;
  height: 19px !important;
  display: block !important;
  margin: 0 !important;
  color: var(--r-text) !important;
}

.rakes-app .avatar-chip img {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: cover !important;
}

.rakes-app .avatar-chip img[hidden] {
  display: none !important;
}

#duel-create-status,
#duel-watch-result {
  min-height: 16px;
  margin: 0;
  color: rgba(244,247,243,0.60);
  font-size: 12px;
  font-weight: 800;
  text-align: center;
}

#duel-watch-join[hidden] {
  display: none !important;
}

.duel-watch-card {
  gap: 14px !important;
}

.duel-watch-players {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.duel-player {
  min-width: 0;
  min-height: 118px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 6px;
  padding: 10px;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 16px;
  background: rgba(255,255,255,0.025);
  text-align: center;
}

.duel-player.winner {
  border-color: rgba(79,255,124,0.42);
}

.duel-player img,
.duel-avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  object-fit: cover;
  background: rgba(255,255,255,0.06);
}

.duel-avatar {
  display: grid;
  place-items: center;
  color: rgba(244,247,243,0.50);
  font-weight: 900;
}

.duel-player strong {
  max-width: 100%;
  overflow: hidden;
  color: var(--r-text);
  font-size: 13px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.duel-player small {
  color: rgba(244,247,243,0.48);
  font-size: 10px;
  font-weight: 800;
}

.coin-stage {
  position: relative;
  width: 100%;
  height: 128px;
  margin: 0 auto;
  display: grid;
  place-items: center;
  overflow: hidden;
  perspective: 800px;
}

.coin-disc {
  position: relative;
  width: 94px;
  height: 94px;
  transform-style: preserve-3d;
  will-change: transform;
}

.coin-side,
.coin-face {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  border-radius: 50%;
  font-size: 30px;
  font-weight: 1000;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  box-shadow: inset 0 0 32px rgba(255,255,255,0.20), inset 0 -14px 30px rgba(0,0,0,0.28), 0 20px 50px rgba(0,0,0,0.45);
}

.coin-side::after {
  position: absolute;
  inset: 9px;
  border: 1px solid rgba(255,255,255,0.22);
  border-radius: 50%;
  content: "";
}

.coin-side-blue {
  color: #ffffff;
  background: linear-gradient(145deg, #58a8ff, #1f63ff);
}

.coin-side-yellow {
  color: #050706;
  background: linear-gradient(145deg, #ffe16a, #ffb21f);
  transform: rotateY(-180deg);
}

.coin-disc.show-blue {
  transform: rotateY(0deg);
}

.coin-disc.show-yellow {
  transform: rotateY(180deg);
}

.coin-countdown {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: var(--r-text);
  font-size: 58px;
  font-weight: 900;
  letter-spacing: -0.08em;
  line-height: 1;
  animation: duel-count-pulse 0.86s cubic-bezier(.2,.8,.2,1) infinite;
}

.coin-countdown[hidden] {
  display: none;
}

.coin-stage.is-counting .coin-disc {
  opacity: 0;
  transform: scale(0.9);
}

.coin-disc.flip-blue {
  animation: duel-coin-flip-blue 3.8s ease-out forwards;
}

.coin-disc.flip-yellow {
  animation: duel-coin-flip-yellow 3.8s ease-out forwards;
}

.duel-roulette {
  position: relative;
  width: 100%;
  height: 132px;
  display: grid;
  place-items: center;
  overflow: hidden;
}

.duel-roulette[hidden] {
  display: none !important;
}

.duel-roulette-window {
  width: 100%;
  height: 92px;
  display: flex;
  align-items: center;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255,255,255,0.035), rgba(255,255,255,0.012));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.025), 0 18px 46px rgba(0,0,0,0.36);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 14%, #000 86%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 14%, #000 86%, transparent 100%);
}

.duel-roulette-pointer {
  position: absolute;
  top: 10px;
  left: 50%;
  z-index: 3;
  width: 2px;
  height: 112px;
  border-radius: 999px;
  background: var(--r-accent);
  box-shadow: 0 0 0 1px rgba(0,0,0,0.42), 0 0 18px rgba(82,232,124,0.45);
  transform: translateX(-50%);
}

.duel-roulette-strip {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0;
  transform: translate3d(0, 0, 0);
  will-change: transform;
}

.duel-roulette-strip.animate {
  animation: duel-case-roll 10s cubic-bezier(0.08, 0.76, 0.08, 1) forwards;
}

.duel-roulette-item {
  width: 68px;
  height: 68px;
  flex: 0 0 68px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 2px solid rgba(255,255,255,0.10);
  border-radius: 50%;
  background: #101511;
  color: var(--r-text);
  font-size: 14px;
  font-weight: 900;
  transition: border-color 0.35s ease, box-shadow 0.35s ease, transform 0.35s ease;
}

.duel-roulette-item.blue {
  border-color: rgba(88,168,255,0.48);
}

.duel-roulette-item.yellow {
  border-color: rgba(255,211,69,0.52);
}

.duel-roulette-item.is-winner {
  border-color: var(--r-accent);
  box-shadow: 0 0 0 2px rgba(82,232,124,0.18), 0 0 22px rgba(82,232,124,0.32);
  transform: scale(1.06);
}

.duel-roulette-item img,
.duel-roulette-item div {
  width: 100%;
  height: 100%;
}

.duel-roulette-item img {
  display: block;
  object-fit: cover;
}

.duel-roulette.is-counting .duel-roulette-window,
.duel-roulette.is-counting .duel-roulette-pointer {
  opacity: 0;
}

.duel-watch-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 12px;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 14px;
  background: rgba(255,255,255,0.025);
}

.duel-watch-meta span {
  color: rgba(244,247,243,0.52);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.duel-watch-meta strong {
  color: var(--r-text);
  font-size: 15px;
  font-weight: 900;
}

@keyframes coin-idle {
  0%, 100% { transform: translateY(0) rotateY(0deg); }
  50% { transform: translateY(-5px) rotateY(18deg); }
}

@keyframes coin-flip {
  0% { transform: rotateX(0deg) rotateY(0deg) scale(1); }
  70% { transform: rotateX(900deg) rotateY(720deg) scale(1.08); }
  100% { transform: rotateX(1080deg) rotateY(720deg) scale(1); }
}

@keyframes duel-count-pulse {
  0% { opacity: 0; transform: scale(0.82); }
  30% { opacity: 1; transform: scale(1); }
  100% { opacity: 0.25; transform: scale(1.08); }
}

@keyframes duel-coin-flip-blue {
  0% { transform: rotateY(0deg); }
  100% { transform: rotateY(1800deg); }
}

@keyframes duel-coin-flip-yellow {
  0% { transform: rotateY(0deg); }
  100% { transform: rotateY(1980deg); }
}

@keyframes duel-case-roll {
  0% { transform: translate3d(0, 0, 0); filter: blur(0); }
  12% { filter: blur(1.15px); }
  46% { filter: blur(0.8px); }
  72% { filter: blur(0.35px); }
  100% { transform: translate3d(var(--duel-roulette-x), 0, 0); filter: blur(0); }
}

/* v4.18 wheel breathing room. */
.rakes-app .wheel-arena {
  margin-top: 22px !important;
  margin-bottom: 22px !important;
}

.rakes-app .stake-presets {
  margin-top: 0 !important;
}

/* v4.19 premium wallet sheet. */
.wallet-sheet {
  gap: 14px !important;
}

.wallet-balance-card {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  padding: 16px;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 22px;
  background: radial-gradient(circle at 18% 0%, rgba(82,232,124,0.12), transparent 34%), #070a08;
}

.wallet-balance-card > span {
  grid-column: 1 / -1;
  color: rgba(244,247,243,0.52);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.wallet-balance-card > strong {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--r-text);
  font-size: 38px;
  font-weight: 900;
  letter-spacing: -0.07em;
  line-height: 1;
}

.wallet-balance-card .token-logo {
  width: 24px;
  height: 24px;
}

.wallet-balance-card div {
  min-height: 54px;
  display: grid;
  align-content: center;
  gap: 5px;
  padding: 10px;
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 16px;
  background: rgba(255,255,255,0.025);
}

.wallet-balance-card small {
  color: rgba(244,247,243,0.46);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.wallet-balance-card b {
  color: var(--r-text);
  font-size: 13px;
  font-weight: 900;
}

.wallet-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.wallet-actions button {
  min-height: 78px;
  display: grid;
  justify-items: start;
  align-content: center;
  gap: 5px;
  padding: 13px;
  border: 1px solid var(--r-line);
  border-radius: 18px;
  background: var(--r-panel);
  color: var(--r-text);
  text-align: left;
}

.wallet-actions svg {
  width: 18px;
  height: 18px;
  color: var(--r-accent);
}

.wallet-actions span {
  font-size: 14px;
  font-weight: 900;
}

.wallet-actions small {
  color: rgba(244,247,243,0.46);
  font-size: 11px;
  font-weight: 800;
}

.wallet-history {
  display: grid;
  gap: 9px;
}

.wallet-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 2px 2px 0;
}

.wallet-section-head span {
  color: rgba(244,247,243,0.62);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.10em;
  text-transform: uppercase;
}

.wallet-section-head button {
  width: 30px;
  height: 30px;
  padding: 0;
  display: grid;
  place-items: center;
  border: 1px solid var(--r-line);
  border-radius: 10px;
  background: rgba(255,255,255,0.025);
  color: var(--r-text);
}

.wallet-section-head svg {
  width: 14px;
  height: 14px;
  display: block;
  margin: 0;
}

.wallet-history-list {
  display: grid;
  gap: 7px;
}

.wallet-history-row {
  min-height: 58px;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 9px;
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 16px;
  background: rgba(255,255,255,0.022);
}

.wallet-history-icon {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 13px;
  background: rgba(82,232,124,0.08);
  color: var(--r-accent);
}

.wallet-history-icon svg {
  width: 16px;
  height: 16px;
}

.wallet-history-row section {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.wallet-history-row strong {
  overflow: hidden;
  color: var(--r-text);
  font-size: 13px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.wallet-history-row span {
  color: rgba(244,247,243,0.45);
  font-size: 11px;
  font-weight: 800;
  text-transform: capitalize;
}

.wallet-history-row > b {
  color: var(--r-text);
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}

.wallet-history-row.paid > b,
.wallet-history-row.completed > b,
.wallet-history-row.success > b,
.wallet-history-row.done > b {
  color: var(--r-accent);
}

.wallet-history-row.pending > b,
.wallet-history-row.processing > b {
  color: #ffd35a;
}

.wallet-history-row.failed > b,
.wallet-history-row.cancelled > b,
.wallet-history-row.rejected > b {
  color: #ff8f8f;
}

.wallet-empty {
  min-height: 62px;
  display: grid;
  place-items: center;
  border: 1px dashed rgba(255,255,255,0.08);
  border-radius: 16px;
  color: rgba(244,247,243,0.42);
  font-size: 12px;
  font-weight: 800;
}

.wallet-load-more {
  height: 42px;
  border: 1px solid var(--r-line);
  border-radius: 14px;
  background: rgba(255,255,255,0.035);
  color: var(--r-text);
  font-size: 12px;
  font-weight: 900;
}

.wallet-load-more[hidden] {
  display: none !important;
}

/* v4.20 crash mode */
.crash-view {
  min-height: 100svh;
  padding: max(8px, env(safe-area-inset-top)) 12px calc(78px + env(safe-area-inset-bottom));
}

.crash-head {
  margin: 12px 0 14px;
}

.crash-ledger {
  min-height: 72px;
}

.crash-history-strip {
  display: flex;
  gap: 7px;
  margin: -4px 0 12px;
  padding: 0 1px 4px;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.crash-history-strip::-webkit-scrollbar {
  display: none;
}

.crash-history-pill {
  flex: 0 0 auto;
  min-width: 54px;
  height: 28px;
  padding: 0 10px;
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 999px;
  background: rgba(255,255,255,0.035);
  color: rgba(244,247,243,0.76);
  font-size: 12px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}

.crash-history-pill.low {
  color: #ff7171;
  background: rgba(255, 91, 91, 0.08);
  border-color: rgba(255, 91, 91, 0.16);
}

.crash-history-pill.mid {
  color: #71a7ff;
  background: rgba(80, 137, 255, 0.08);
  border-color: rgba(80, 137, 255, 0.16);
}

.crash-history-pill.high {
  color: #b68cff;
  background: rgba(166, 121, 255, 0.09);
  border-color: rgba(166, 121, 255, 0.18);
}

.crash-history-pill.legendary {
  color: #ffd36a;
  background: rgba(255, 190, 74, 0.1);
  border-color: rgba(255, 190, 74, 0.24);
}

.crash-stage {
  position: relative;
  margin: 0 0 14px;
  padding: 10px;
  height: 292px;
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 24px;
  background:
    radial-gradient(circle at 50% 0%, rgba(112,255,151,0.08), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01)),
    #080b09;
  overflow: hidden;
}

.crash-center {
  position: absolute;
  inset: 10px;
  z-index: 4;
  display: grid;
  place-items: center;
  justify-items: center;
  gap: 0;
  pointer-events: none;
  text-align: center;
  width: auto;
  min-height: 0;
  padding: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

.crash-center span,
.crash-feed-head span {
  color: rgba(244,247,243,0.48);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.crash-center strong {
  color: #f6faf6;
  font-size: clamp(40px, 11vw, 64px);
  font-weight: 900;
  letter-spacing: 0;
  line-height: 0.95;
  font-variant-numeric: tabular-nums;
}

.crash-center small {
  color: rgba(244,247,243,0.64);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.02em;
}

.crash-center > span,
.crash-center > strong,
.crash-center > small {
  grid-area: 1 / 1;
}

.crash-center[data-state="open"] #crash-status,
.crash-center[data-state="open"] #crash-multiplier,
.crash-center[data-state="running"] #crash-status,
.crash-center[data-state="running"] #crash-substatus,
.crash-center[data-state="crashed"] #crash-status,
.crash-center[data-state="crashed"] #crash-substatus {
  display: none;
}

.crash-center[data-state="open"] #crash-substatus {
  display: block;
  color: #f6faf6;
  font-size: clamp(48px, 14vw, 76px);
  font-weight: 900;
  line-height: 0.95;
  font-variant-numeric: tabular-nums;
}

.crash-center[data-state="running"] #crash-multiplier {
  color: #f6faf6;
  font-size: clamp(48px, 14vw, 76px);
}

.crash-center[data-state="crashed"] #crash-multiplier {
  color: #ff5f5f;
  font-size: clamp(34px, 9vw, 54px);
}

#crash-chart {
  position: absolute;
  inset: 10px;
  z-index: 1;
  display: block;
  width: calc(100% - 20px);
  height: calc(100% - 20px);
  border-radius: 18px;
}

.crash-slots {
  display: grid;
  gap: 9px;
  margin: 0 0 14px;
}

.crash-bet-panel {
  display: grid;
  grid-template-columns: minmax(0, 0.82fr) minmax(0, 0.7fr) 92px;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 8px;
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 20px;
  background: rgba(255,255,255,0.025);
}

.crash-field {
  position: relative;
  display: grid;
  gap: 6px;
  min-height: 52px;
  padding: 8px 11px 9px;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 15px;
  background: rgba(6, 9, 7, 0.84);
}

.crash-field span {
  color: rgba(244,247,243,0.46);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.crash-field input {
  width: 100%;
  padding: 0 24px 0 0;
  border: 0;
  outline: none;
  background: transparent;
  color: #f7fbf7;
  font-size: 18px;
  font-weight: 900;
  letter-spacing: 0;
  font-variant-numeric: tabular-nums;
}

.crash-field small {
  position: absolute;
  right: 12px;
  bottom: 12px;
  color: rgba(244,247,243,0.38);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.crash-slot-action {
  display: grid;
  place-items: center;
  min-height: 52px;
  padding: 0 8px;
  border: 0;
  border-radius: 13px;
  color: #040705;
  background: #f4f7f3;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.01em;
}

.crash-slot-action span,
.crash-slot-action b {
  display: block;
  line-height: 1.05;
  pointer-events: none;
  user-select: none;
}

.crash-slot-action span {
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.crash-slot-action b {
  margin-top: 3px;
  font-size: 13px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}

.crash-slot-action.is-cashout {
  color: #f5fbf5;
  background: #153522;
}

.crash-slot-action:disabled {
  opacity: 0.42;
}

.crash-feed-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 10px;
}

.crash-feed-head strong {
  color: #f4f7f3;
  font-size: 13px;
  font-weight: 900;
}

.crash-bets-feed {
  display: grid;
  gap: 8px;
  padding-bottom: 8px;
}

.crash-bet-row.active .bet-meta small {
  color: rgba(244,247,243,0.52);
}

.crash-bet-row.cashed_out .bet-meta strong,
.crash-bet-row.cashed_out .bet-meta small {
  color: #7bffa0;
}

.crash-bet-row.lost .bet-meta small {
  color: #ff7d7d;
}

.rakes-app .bottom-nav {
  display: grid !important;
  grid-template-columns: repeat(5, 1fr) !important;
}

.rakes-app .bottom-nav button {
  min-width: 0;
}

@media (max-width: 420px) {
  .crash-stage {
    height: 272px;
  }

  .crash-bet-panel {
    grid-template-columns: minmax(0, 0.78fr) minmax(0, 0.66fr) 86px;
    gap: 8px;
    padding: 7px;
  }

  .crash-field {
    min-height: 50px;
    padding: 8px 10px 9px;
  }

  .crash-field input {
    font-size: 17px;
  }

  .crash-slot-action {
    min-height: 50px;
    font-size: 11px;
    padding: 0 6px;
  }

  .crash-slot-action b {
    font-size: 12px;
  }
}

/* v4.21 Mines mode */
.mines-view {
  width: min(100%, 460px);
  min-height: 100svh;
  margin: 0 auto;
  padding: max(8px, env(safe-area-inset-top)) 12px calc(78px + env(safe-area-inset-bottom));
  color: var(--r-text);
}

.mines-hero {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  margin: 12px 0 10px;
}

.mines-hero div {
  display: grid;
  gap: 3px;
}

.mines-hero span,
.mines-section-title span,
.mines-stats span,
.mines-field span {
  color: rgba(244,247,243,0.48);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.mines-hero strong {
  color: var(--r-text);
  font-size: 22px;
  font-weight: 900;
  letter-spacing: -0.04em;
}

.mines-reset {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,0.075);
  border-radius: 14px;
  background: rgba(255,255,255,0.028);
  color: var(--r-text);
}

.mines-reset svg {
  width: 16px;
  height: 16px;
}

.mines-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
  margin: 0 0 11px;
}

.mines-stats article {
  min-width: 0;
  display: grid;
  gap: 5px;
  padding: 10px 9px;
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 16px;
  background: rgba(255,255,255,0.024);
}

.mines-stats strong {
  overflow: hidden;
  color: var(--r-text);
  font-size: 14px;
  font-weight: 900;
  line-height: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.mines-board {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 8px;
  margin: 0 0 12px;
  padding: 10px;
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 24px;
  background:
    radial-gradient(circle at 50% 0%, rgba(124,255,155,0.06), transparent 36%),
    #070a08;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.018);
}

.mines-cell {
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,0.075);
  border-radius: 17px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.055), rgba(255,255,255,0.018)),
    #101411;
  color: rgba(244,247,243,0.62);
  box-shadow: 0 8px 18px rgba(0,0,0,0.22), inset 0 -9px 16px rgba(0,0,0,0.16);
  transition: transform 0.16s ease, border-color 0.18s ease, background 0.18s ease, opacity 0.18s ease;
}

.mines-cell:not(:disabled):active {
  transform: translateY(1px) scale(0.985);
}

.mines-cell:disabled {
  cursor: default;
}

.mines-cell svg {
  width: 22px;
  height: 22px;
  stroke-width: 2.4;
}

.mines-cell.safe {
  border-color: rgba(124,255,155,0.34);
  background:
    radial-gradient(circle at 50% 35%, rgba(124,255,155,0.14), transparent 48%),
    #0b1710;
  color: #7cff9b;
}

.mines-cell.safe.just-revealed {
  animation: mines-safe-pop 0.42s cubic-bezier(0.16, 1, 0.3, 1);
}

.mines-cell.mine {
  border-color: rgba(255,108,108,0.28);
  background:
    radial-gradient(circle at 50% 38%, rgba(255,108,108,0.15), transparent 50%),
    #170d0d;
  color: #ff7777;
}

.mines-cell.hit.just-revealed {
  animation: mines-hit-shake 0.34s ease both;
}

.mines-ladder-wrap {
  display: grid;
  gap: 8px;
  margin: 0 0 12px;
}

.mines-section-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 2px;
}

.mines-section-title b {
  color: rgba(244,247,243,0.62);
  font-size: 11px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}

.mines-ladder {
  display: flex;
  gap: 7px;
  overflow-x: auto;
  padding: 0 1px 5px;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.mines-ladder::-webkit-scrollbar {
  display: none;
}

.mines-ladder span {
  flex: 0 0 auto;
  min-width: 66px;
  display: grid;
  gap: 3px;
  padding: 8px 10px;
  border: 1px solid rgba(255,255,255,0.065);
  border-radius: 14px;
  background: rgba(255,255,255,0.024);
}

.mines-ladder small {
  color: rgba(244,247,243,0.38);
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

.mines-ladder b {
  color: rgba(244,247,243,0.72);
  font-size: 12px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}

.mines-ladder .passed {
  opacity: 0.56;
}

.mines-ladder .next {
  border-color: rgba(255,255,255,0.14);
}

.mines-ladder .current {
  border-color: rgba(124,255,155,0.36);
  background: rgba(124,255,155,0.105);
}

.mines-ladder .current b {
  color: #7cff9b;
}

.mines-controls {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 88px 94px;
  align-items: stretch;
  gap: 8px;
  margin: 0 0 8px;
  padding: 8px;
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 20px;
  background: rgba(255,255,255,0.024);
}

.mines-field {
  position: relative;
  min-width: 0;
  display: grid;
  gap: 6px;
  min-height: 52px;
  padding: 8px 11px 9px;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 15px;
  background: rgba(6, 9, 7, 0.84);
}

.mines-field input {
  width: 100%;
  padding: 0 31px 0 0;
  border: 0;
  outline: none;
  background: transparent;
  color: #f7fbf7;
  font-size: 17px;
  font-weight: 900;
  letter-spacing: 0;
  font-variant-numeric: tabular-nums;
}

.mines-field small {
  position: absolute;
  right: 11px;
  bottom: 11px;
  color: rgba(244,247,243,0.38);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.mines-field input:disabled {
  color: rgba(244,247,243,0.5);
}

.mines-action {
  display: grid;
  place-items: center;
  min-height: 52px;
  padding: 0 8px;
  border-radius: 13px;
  background: #f4f7f3;
  color: #040705;
  font-size: 12px;
  font-weight: 900;
}

.mines-action.is-cashout {
  color: #f5fbf5;
  background: #153522;
}

.mines-action span,
.mines-action b {
  display: block;
  line-height: 1.05;
  pointer-events: none;
}

.mines-action span {
  font-size: 9px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.mines-action b {
  margin-top: 3px;
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}

.mines-action:disabled {
  opacity: 0.42;
}

@keyframes mines-safe-pop {
  0% { opacity: 0.35; transform: scale(0.72) rotate(-7deg); }
  64% { opacity: 1; transform: scale(1.07) rotate(2deg); }
  100% { opacity: 1; transform: scale(1) rotate(0); }
}

@keyframes mines-hit-shake {
  0%, 100% { transform: translateX(0); }
  18% { transform: translateX(-3px); }
  36% { transform: translateX(3px); }
  54% { transform: translateX(-2px); }
  72% { transform: translateX(2px); }
}

@media (max-width: 380px) {
  .mines-view {
    padding-left: 10px;
    padding-right: 10px;
  }

  .mines-board {
    gap: 7px;
    padding: 9px;
  }

  .mines-cell {
    border-radius: 15px;
  }

  .mines-controls {
    grid-template-columns: minmax(0, 1fr) 78px 86px;
  }
}

.duel-roulette { position: relative; }
/* duels: кнопка «Play Again» и её оверлей убраны — результат раунда остаётся чётким, без блюра */

/* ===== Jackpot redesign 20260706 ===== */
.ui-ic { width: 20px; height: 20px; object-fit: contain; flex: 0 0 auto; }
.wallet-ic { width: 18px; height: 18px; }

/* --- top info card --- */
.jackpot-card {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: stretch;
  gap: 8px;
  margin-top: 10px;
  padding: 12px 14px;
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 20px;
  background:
    linear-gradient(120deg, rgba(143, 234, 99, 0.06), transparent 34%),
    linear-gradient(160deg, #12171d 0%, #0b0f13 58%, #080b0e 100%);
  box-shadow: 0 16px 38px rgba(0, 0, 0, 0.45), inset 0 0 0 1px rgba(255, 255, 255, 0.02);
}
.jp-bank { display: grid; align-content: center; gap: 3px; min-width: 0; }
.jp-bank > span { font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: #8d929b; }
.jp-bank strong { display: flex; align-items: center; gap: 7px; font-size: clamp(22px, 6.4vw, 30px); font-weight: 800; color: #f4f4f5; font-variant-numeric: tabular-nums; }
.jp-bank strong .token-logo { width: 22px; height: 22px; }
.jp-bank small { font-size: 10px; letter-spacing: 0.14em; color: #8d929b; }
.jp-badge {
  align-self: center;
  display: grid;
  place-items: center;
  width: clamp(64px, 18vw, 84px);
  aspect-ratio: 1;
  border-radius: 50%;
  border: 1px solid rgba(143, 234, 99, 0.30);
  background: radial-gradient(circle at 50% 40%, #10161a 0 58%, #080b0e 60% 100%);
  box-shadow: 0 0 20px rgba(143, 234, 99, 0.15), inset 0 0 0 6px rgba(255, 255, 255, 0.02);
}
.jp-badge img { width: 58%; object-fit: contain; }
.jp-side { display: grid; align-content: center; gap: 8px; min-width: 0; }
.jp-side-item { display: flex; align-items: center; gap: 9px; justify-content: flex-start; padding-left: 12%; }
.jp-side-item .ui-ic { opacity: 0.85; }
.jp-side-item section { display: grid; gap: 1px; min-width: 0; }
.jp-side-item span { font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: #8d929b; white-space: nowrap; }
.jp-side-item strong { font-size: 15px; font-weight: 800; color: #f4f4f5; font-variant-numeric: tabular-nums; }
.jp-side-item:last-child strong { color: #8fea63; text-shadow: 0 0 14px rgba(143, 234, 99, 0.35); }

/* --- wheel: neon timer hub + side lights --- */
.wheel-hub i, .wheel-hub svg { display: none !important; }
.wheel-hub {
  width: clamp(118px, 30vw, 158px);
  gap: 2px;
  border: 2px solid rgba(143, 234, 99, 0.38);
  background: radial-gradient(circle at 50% 36%, #0d1712 0 46%, #060909 72% 100%);
  box-shadow:
    0 0 26px rgba(143, 234, 99, 0.22),
    0 0 60px rgba(143, 234, 99, 0.08),
    inset 0 0 26px rgba(0, 0, 0, 0.78),
    inset 0 0 0 10px rgba(255, 255, 255, 0.015);
}
#round-timer {
  font-size: clamp(34px, 9.6vw, 46px);
  font-weight: 800;
  line-height: 1;
  color: #eafff0;
  font-variant-numeric: tabular-nums;
  text-shadow: 0 0 16px rgba(143, 234, 99, 0.65), 0 0 42px rgba(143, 234, 99, 0.28);
}
#round-timer:empty::before { content: "•"; color: #8fea63; text-shadow: 0 0 18px rgba(143, 234, 99, 0.8); }
#round-timer-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.38em;
  text-indent: 0.38em;
  color: #8fea63;
  opacity: 0.85;
}
.wheel-light {
  position: absolute;
  top: 50%;
  z-index: 4;
  width: 5px;
  height: 36px;
  border-radius: 4px;
  background: linear-gradient(180deg, #b6ff8f, #6ed13f);
  box-shadow: 0 0 12px rgba(143, 234, 99, 0.95), 0 0 30px rgba(143, 234, 99, 0.45);
  transform: translateY(-50%);
  pointer-events: none;
}
.wheel-light.left { left: 5px; }
.wheel-light.right { right: 5px; }

/* --- round strip icons --- */
.round-strip .ui-ic { width: 22px; height: 22px; opacity: 0.85; }
.round-strip svg { display: none !important; }

/* --- bottom nav with PNG icons --- */
.bottom-nav { grid-template-columns: repeat(5, 1fr); }
.bottom-nav svg { display: none !important; }
.nav-ic { width: 24px; height: 24px; object-fit: contain; opacity: 0.66; transition: opacity 0.18s ease, filter 0.18s ease, transform 0.18s ease; }
/* прокрутка колеса на кнопке Jackpot при нажатии */
.nav-ic.nav-spin { animation: navWheelSpin 0.7s cubic-bezier(0.3, 0.7, 0.25, 1); }
@keyframes navWheelSpin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .nav-ic.nav-spin { animation: none; } }
.bottom-nav button.active { color: #8fea63; }
.bottom-nav button.active .nav-ic {
  opacity: 1;
  transform: translateY(-1px);
  filter: sepia(1) saturate(2.6) hue-rotate(58deg) brightness(1.4) drop-shadow(0 0 9px rgba(143, 234, 99, 0.65));
}

/* ============ PIXEL MATCH 20260706 — reference #070A0D theme ============ */
body.rakes-app {
  --r-bg: #070A0D;
  --r-card: #101419;
  --r-card-2: #15191F;
  --r-line: rgba(255, 255, 255, 0.07);
  --r-line-soft: rgba(255, 255, 255, 0.06);
  --r-text: #F4F4F5;
  --r-muted: #8D929B;
  --r-soft: #8D929B;
  --r-accent: #8FEA63;
  --r-accent-2: #57B33E;
  background: #070A0D;
  background-image: none;
  font-family: "Montserrat", "SF Pro Display", "Segoe UI", Arial, sans-serif;
}
.rakes-mobile,
.crash-view,
.duels-view,
.mines-view,
.x50-view,
.profile-view {
  border-left: 0;
  border-right: 0;
}
.rakes-mobile { padding-left: 16px; padding-right: 16px; }

/* --- kicker --- */
.round-kicker span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #F4F4F5;
}
.round-kicker span::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #8FEA63;
  box-shadow: 0 0 10px rgba(143, 234, 99, 0.9);
}
.round-kicker em {
  padding: 0;
  border: 0;
  background: transparent;
  font-style: normal;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #8D929B;
}

/* --- top card: flat neutral --- */
.jackpot-card {
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: linear-gradient(160deg, #12171D 0%, #0E1216 60%, #0B0F13 100%);
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.4);
}
.jp-badge {
  border: 1px solid rgba(255, 255, 255, 0.09);
  background: radial-gradient(circle at 50% 40%, #12171D 0 58%, #0A0E12 60% 100%);
  box-shadow: inset 0 0 0 5px rgba(255, 255, 255, 0.02), 0 6px 18px rgba(0, 0, 0, 0.45);
}
.jp-side-item:last-child strong { text-shadow: 0 0 12px rgba(143, 234, 99, 0.3); }

/* --- wheel: neutral arena, no dup lights --- */
.wheel-light { display: none; }
.wheel-arena::before { display: none; }
.wheel-hub {
  border: 2px solid rgba(255, 255, 255, 0.10);
  background: radial-gradient(circle at 50% 36%, #10151B 0 46%, #07090C 74% 100%);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6), inset 0 0 24px rgba(0, 0, 0, 0.8), inset 0 0 0 9px rgba(255, 255, 255, 0.015);
}
#round-timer {
  color: #F4F4F5;
  text-shadow: 0 0 16px rgba(143, 234, 99, 0.42), 0 0 40px rgba(143, 234, 99, 0.16);
}
#round-timer-label { color: #8FEA63; opacity: 0.8; }

/* --- presets: rounded-rect chips --- */
.stake-presets { gap: 8px; }
.stake-presets button {
  height: 46px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 13px;
  background: #101419;
  color: #F4F4F5;
  font-size: 15px;
  font-weight: 700;
  box-shadow: none;
}
.stake-presets button.active {
  border-color: rgba(143, 234, 99, 0.55);
  color: #8FEA63;
  background: linear-gradient(180deg, rgba(143, 234, 99, 0.10), rgba(143, 234, 99, 0.03)), #101419;
  box-shadow: 0 0 16px rgba(143, 234, 99, 0.12), inset 0 0 0 1px rgba(143, 234, 99, 0.12);
}

/* --- bet dock: dark input + green CTA --- */
.bet-dock .bet-wrap {
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 14px;
  background: #101419;
  box-shadow: none;
}
.bet-dock input { color: #F4F4F5; font-weight: 700; }
.bet-dock .bet-wrap span { color: #8D929B; font-weight: 600; }
.bet-dock button {
  border: 0;
  border-radius: 14px;
  background: linear-gradient(180deg, #98EF6A 0%, #5FBE43 78%, #4EA83C 100%);
  color: #0B2409;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: -0.01em;
  box-shadow: 0 10px 24px rgba(87, 179, 62, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.35);
}
.bet-dock button:disabled {
  background: #1A1F26;
  color: #566069;
  box-shadow: none;
}

/* --- stats strip: single card, dividers --- */
.round-strip {
  min-height: 64px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 15px;
  background: #101419;
  box-shadow: none;
}
.round-strip div { background: transparent; border: 0; }
.round-strip div + div { border-left: 1px solid rgba(255, 255, 255, 0.06); }
.round-strip span { color: #8D929B; font-size: 10px; letter-spacing: 0.13em; }
.round-strip strong { color: #F4F4F5; }
.round-strip div:last-child strong { color: #8FEA63; text-shadow: 0 0 10px rgba(143, 234, 99, 0.28); }

/* --- bets feed cards --- */
.bets-feed > * {
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  background: #101419 !important;
  box-shadow: none !important;
}

/* --- bottom nav: flat dark bar --- */
.bottom-nav {
  bottom: 10px;
  width: min(calc(100% - 20px), 700px);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 18px;
  background: rgba(11, 15, 19, 0.97);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.55);
}
.bottom-nav button { color: #8D929B; border: 0; box-shadow: none; background: transparent; }
.bottom-nav button.active {
  color: #8FEA63;
  background: rgba(143, 234, 99, 0.07);
  border-radius: 13px;
}

/* --- topbar pills neutral --- */
.balance-chip, .avatar-chip {
  border-color: rgba(255, 255, 255, 0.08) !important;
  background: #101419 !important;
  box-shadow: none !important;
}

/* ===== WHEEL SKIN + CARD ALIGN 20260706 ===== */
.wheel-hub {
  width: clamp(88px, 22vw, 114px);
  border: 0;
  background: transparent;
  box-shadow: none;
}
.wheel-arena { background: transparent; }

/* top card: reference layout */
.jackpot-card { grid-template-columns: 1.02fr auto 1.1fr; gap: 6px; padding: 14px 12px; }
.jp-bank { justify-items: start; text-align: left; padding: 4px 0 4px 10px; align-content: center; gap: 4px; }
.jp-bank > span { font-size: 10px; }
.jp-bank strong { font-size: clamp(24px, 7vw, 32px); letter-spacing: -0.02em; }
.jp-bank small { opacity: 0.9; }
.jp-badge { position: relative; border-color: rgba(255, 255, 255, 0.06); }
.jp-badge::before {
  content: "";
  position: absolute;
  inset: -3px;
  border-radius: 50%;
  background: conic-gradient(from 140deg, #8FEA63 0 54deg, rgba(255, 255, 255, 0.06) 54deg 360deg);
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 3.5px), #000 calc(100% - 3px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 3.5px), #000 calc(100% - 3px));
}
.jp-side { gap: 0; align-content: center; justify-items: stretch; }
.jp-side-item {
  display: grid;
  grid-template-columns: 22px 1fr;
  column-gap: 10px;
  align-items: center;
  justify-content: start;
  padding: 7px 0 7px 16px;
}
.jp-side-item + .jp-side-item { border-top: 1px solid rgba(255, 255, 255, 0.05); }
.jp-side-item section { text-align: left; display: grid; gap: 2px; }
.jp-side-item span { font-size: 10px; }
.jp-side-item strong { font-size: 16px; line-height: 1; }

/* ===== timer size bump 20260706 ===== */
.wheel-hub { gap: 0; }
#round-timer {
  font-size: clamp(25px, 6.6vw, 33px) !important;
  font-weight: 900 !important;
  letter-spacing: -0.03em;
  line-height: 0.9;
}
#round-timer-label {
  font-size: 8px;
  font-weight: 800;
  letter-spacing: 0.32em;
  text-indent: 0.32em;
  margin-top: 1px;
}

/* ===== compact layout 20260706 — less scrolling ===== */
/* bottom stats strip duplicates the top jackpot-card -> remove it */
.round-strip { display: none !important; }

/* tighter vertical rhythm on the jackpot screen */
.rakes-mobile { padding-top: max(12px, env(safe-area-inset-top)) !important; }
.round-head { margin-bottom: 8px !important; }
.jackpot-card { margin-top: 8px !important; }
.rakes-app .wheel-arena {
  width: min(62vw, 262px, calc(100svh - 372px)) !important;
  min-width: 210px !important;
  margin: 6px auto 10px !important;
}
.stake-presets { margin: 2px 0 8px !important; }
.bet-dock { margin-bottom: 10px !important; }

/* ===== antislop contrast 20260706 ===== */
/* readable small notes/labels: lift from ~0.36 alpha to a legible muted */
.round-note { color: #7f858e !important; }
/* placeholder text must meet the same contrast as body, not default gray */
.bet-dock input::placeholder,
#mines-amount::placeholder,
#mines-count::placeholder { color: #6c727b !important; }

/* ===== ui fix 20260706 ===== */
/* green CTA (was overridden white by .rakes-app .bet-dock button {#f4f7f3}) */
.rakes-app .bet-dock button {
  background: linear-gradient(180deg, #98EF6A 0%, #5FBE43 78%, #4EA83C 100%) !important;
  color: #0B2409 !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em !important;
  box-shadow: 0 10px 24px rgba(87, 179, 62, 0.30), inset 0 1px 0 rgba(255, 255, 255, 0.4) !important;
}
.rakes-app .bet-dock button:hover { filter: brightness(1.04); }
.rakes-app .bet-dock button:active { transform: translateY(1px) scale(0.99); }
.rakes-app .bet-dock button:disabled {
  background: #1A1F26 !important;
  color: #566069 !important;
  box-shadow: none !important;
}

/* kill number-input spinner arrows (bet + mines) */
.rakes-app input[type="number"]::-webkit-inner-spin-button,
.rakes-app input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none !important;
  appearance: none !important;
  margin: 0 !important;
}
.rakes-app input[type="number"] {
  -moz-appearance: textfield !important;
  appearance: textfield !important;
}

/* ===== ui polish 20260706b ===== */
/* 1. top card badge: clean symmetric bottom gauge arc + faint full ring */
.jp-badge::before {
  background: conic-gradient(from 132deg,
    #8FEA63 0deg, #8FEA63 88deg,
    rgba(255,255,255,0.08) 88deg, rgba(255,255,255,0.08) 360deg) !important;
  filter: drop-shadow(0 0 6px rgba(143, 234, 99, 0.35));
}
/* align both sides of the card to vertical center */
.jackpot-card { align-items: center !important; }
.jp-bank, .jp-side { align-content: center !important; }

/* 2. presets: 6 equal columns so $100 never clips */
.stake-presets {
  display: grid !important;
  grid-template-columns: repeat(6, 1fr) !important;
  gap: 7px !important;
}
.stake-presets button {
  padding: 0 !important;
  font-size: 14px !important;
  min-width: 0 !important;
}

/* 3. header: a little air, balance pill off the edge */
.top-cluster { gap: 10px !important; align-items: center !important; }
.casino-topbar { gap: 12px !important; }

/* 4. empty state: real placeholder, not a bare line */
.bet-row-empty {
  display: grid !important;
  place-items: center !important;
  gap: 4px;
  padding: 18px 12px !important;
  border: 1px dashed rgba(255,255,255,0.09) !important;
  border-radius: 14px !important;
  background: rgba(255,255,255,0.015) !important;
}
.bet-row-empty span {
  color: #8D929B !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em;
}

/* ===== fit above nav 20260706 ===== */
/* shrink wheel + tighten so the bet dock always clears the bottom nav */
.rakes-app .wheel-arena {
  width: min(56vw, 236px, calc(100svh - 402px)) !important;
  min-width: 196px !important;
  margin: 4px auto 8px !important;
}
.rakes-app .round-head { margin-bottom: 6px !important; }
.rakes-app .jackpot-card { margin-top: 6px !important; }
.rakes-app .stake-presets { margin: 2px 0 8px !important; }
.rakes-app .bet-dock { margin-bottom: 8px !important; }
/* reserve room for the fixed nav so bottom content never hides under it */
.rakes-app .rakes-mobile {
  padding-bottom: calc(104px + env(safe-area-inset-bottom)) !important;
}

/* ===== strict green + card 20260706 ===== */
:root, body.rakes-app { --r-accent: #8FE84F !important; --r-accent-2: #7FB331 !important; }

/* top card: clean 3-column stat strip with dividers */
.jackpot-card {
  grid-template-columns: repeat(3, 1fr) !important;
  align-items: stretch !important;
  gap: 0 !important;
  padding: 13px 4px !important;
}
.jp-stat {
  display: grid !important;
  align-content: center !important;
  justify-items: start !important;
  gap: 8px !important;
  padding: 2px 8px 2px 15px !important;
  min-width: 0 !important;
}
.jp-stat + .jp-stat { border-left: 1px solid rgba(255,255,255,0.07) !important; }
.jp-stat-head { display: flex; align-items: center; gap: 7px; }
.jp-stat-head .ui-ic { width: 15px; height: 15px; opacity: 0.6; }
.jp-stat-head span {
  font-size: 10px; font-weight: 700; letter-spacing: 0.11em;
  text-transform: uppercase; color: #D0D4DA !important; white-space: nowrap;
}
.jp-stat > strong {
  display: flex; align-items: center; gap: 6px;
  font-size: 21px; font-weight: 700; color: #F4F4F5;
  font-variant-numeric: tabular-nums; line-height: 1;
}
.jp-stat > strong .token-logo { width: 17px; height: 17px; }
#round-bank { color: #FFFFFF !important; }
.jp-stat-accent > strong { color: var(--r-accent) !important; text-shadow: none !important; }

/* strict (non-neon) green across visible accents */
.rakes-app .bet-dock button {
  background: linear-gradient(180deg, #8FE84F 0%, #7FB331 78%, #6E9E2A 100%) !important;
  box-shadow: 0 8px 18px rgba(120,170,50,0.22), inset 0 1px 0 rgba(255,255,255,0.16) !important;
}
#round-timer { text-shadow: 0 0 8px rgba(164,255,106,0.30), 0 0 22px rgba(164,255,106,0.12) !important; }
#round-timer-label { color: var(--r-accent) !important; opacity: 0.85; }
.round-kicker span::before { background: var(--r-accent) !important; box-shadow: 0 0 6px rgba(164,255,106,0.5) !important; }
.stake-presets button.active {
  border-color: rgba(164,255,106,0.5) !important;
  color: var(--r-accent) !important;
  background: linear-gradient(180deg, rgba(164,255,106,0.09), rgba(164,255,106,0.03)), #101419 !important;
  box-shadow: none !important;
}
.bottom-nav button.active { color: var(--r-accent) !important; background: rgba(164,255,106,0.06) !important; }
.bottom-nav button.active .nav-ic { filter: sepia(1) saturate(1.4) hue-rotate(58deg) brightness(1.0) !important; }
/* mute wheel outer glows */
.rakes-app .wheel-arena::before { box-shadow: 0 22px 56px rgba(0,0,0,0.68), 0 0 20px rgba(150,200,70,0.07) !important; }
.rakes-app .wheel-arena::after { border-color: rgba(160,200,120,0.15) !important; box-shadow: none !important; }

/* ===== premium wheel size 20260706 ===== */
.rakes-app .wheel-arena {
  width: min(80vw, 320px, calc(100svh - 334px)) !important;
  min-width: 244px !important;
  margin: 8px auto 14px !important;
}
/* bet block a touch lower, using the freed space */
.rakes-app .stake-presets { margin-top: 10px !important; margin-bottom: 10px !important; }
.rakes-app .bet-dock { margin-bottom: 14px !important; }

/* ===== electric lime 20260706 (soft neon glow) ===== */
:root, body.rakes-app { --r-accent: #8FE84F !important; }
.rakes-app .bet-dock button {
  background: linear-gradient(180deg, #9AF05A 0%, #8AE84F 52%, #80DD4B 100%) !important;
  color: #123008 !important;
  box-shadow: 0 10px 26px rgba(138,232,79,0.34), 0 0 20px rgba(164,255,106,0.30), inset 0 1px 0 rgba(255,255,255,0.38) !important;
}
#round-timer { text-shadow: 0 0 12px rgba(164,255,106,0.52), 0 0 30px rgba(143,232,79,0.30) !important; }
#round-timer-label { color: #8FE84F !important; }
.jp-stat-accent > strong { color: #8FE84F !important; text-shadow: 0 0 12px rgba(143,232,79,0.32) !important; }
.round-kicker span::before { background: #8FE84F !important; box-shadow: 0 0 8px rgba(164,255,106,0.7) !important; }
.stake-presets button.active {
  border-color: rgba(143,232,79,0.6) !important;
  color: #8FE84F !important;
  box-shadow: 0 0 14px rgba(143,232,79,0.22) !important;
}
.bottom-nav button.active { color: #8FE84F !important; }
.bottom-nav button.active .nav-ic {
  filter: sepia(1) saturate(2.4) hue-rotate(50deg) brightness(1.3) drop-shadow(0 0 7px rgba(143,232,79,0.55)) !important;
}
.rakes-app .wheel-arena::before { box-shadow: 0 22px 56px rgba(0,0,0,0.68), 0 0 26px rgba(143,232,79,0.12) !important; }

/* ===== fit-no-scroll 20260706 (bet visible without scrolling) ===== */
.rakes-app .wheel-arena {
  width: min(70vw, 300px, calc(100svh - 452px)) !important;
  min-width: 200px !important;
  margin: 6px auto 8px !important;
}
.rakes-app .round-head { margin-bottom: 4px !important; }
.rakes-app .jackpot-card { margin-top: 4px !important; }
.rakes-app .stake-presets { margin: 6px 0 8px !important; }
.rakes-app .bet-dock { margin-bottom: 8px !important; }
.rakes-app .rakes-mobile { padding-bottom: calc(94px + env(safe-area-inset-bottom)) !important; }
/* empty bets placeholder must not eat the fold on the jackpot screen */
#view-game .bets-feed .bet-row-empty { display: none !important; }

/* ===== fill free space 20260706 (bigger wheel, still no scroll) ===== */
.rakes-app .wheel-arena {
  width: min(84vw, 348px, calc(100svh - 402px)) !important;
  min-width: 220px !important;
  margin: 12px auto 16px !important;
}

/* ===== bigger wheel + lower bet 20260706 ===== */
.rakes-app .wheel-arena {
  width: min(86vw, 366px, calc(100svh - 394px)) !important;
  min-width: 224px !important;
  margin: 10px auto 14px !important;
}
/* nudge the bet block a bit lower (closer to the nav) */
.rakes-app .stake-presets { margin-top: 14px !important; }
.rakes-app .rakes-mobile { padding-bottom: calc(80px + env(safe-area-inset-bottom)) !important; }

/* ===== bigger wheel v3 20260706 ===== */
.rakes-app .wheel-arena {
  width: min(90vw, 380px, calc(100svh - 384px)) !important;
  min-width: 230px !important;
  margin: 8px auto 12px !important;
}
.rakes-app .stake-presets { margin-top: 16px !important; }
.rakes-app .rakes-mobile { padding-bottom: calc(72px + env(safe-area-inset-bottom)) !important; }

/* ===== compact card + bigger wheel 20260706 ===== */
.jackpot-card { padding: 9px 4px !important; border-radius: 16px !important; }
.jp-stat { gap: 5px !important; padding: 1px 8px 1px 14px !important; }
.jp-stat-head { gap: 6px !important; }
.jp-stat-head .ui-ic { width: 13px !important; height: 13px !important; }
.jp-stat-head span { font-size: 9px !important; letter-spacing: 0.09em !important; }
.jp-stat > strong { font-size: 18px !important; }
.jp-stat > strong .token-logo { width: 15px !important; height: 15px !important; }
.rakes-app .round-head { margin-bottom: 4px !important; }
.rakes-app .jackpot-card { margin-top: 2px !important; }
/* wheel grows into the freed space */
.rakes-app .wheel-arena {
  width: min(92vw, 396px, calc(100svh - 352px)) !important;
  min-width: 236px !important;
  margin: 8px auto 12px !important;
}

/* ===== Montserrat, self-hosted ===== */
@font-face{font-family:"Montserrat";font-style:normal;font-weight:100 900;font-display:swap;src:url("/app-assets/fonts/montserrat-cyrillic-ext.woff2") format("woff2");unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:100 900;font-display:swap;src:url("/app-assets/fonts/montserrat-cyrillic.woff2") format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:100 900;font-display:swap;src:url("/app-assets/fonts/montserrat-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:100 900;font-display:swap;src:url("/app-assets/fonts/montserrat-latin.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}

body.rakes-app, .rakes-app, .rakes-app button, .rakes-app input, .rakes-app strong, .rakes-app span, .rakes-app small {
  font-family: "Montserrat", "SF Pro Display", -apple-system, system-ui, "Segoe UI", Arial, sans-serif !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
/* softer, less blocky uppercase labels */
.round-kicker span { font-weight: 700 !important; letter-spacing: 0.05em !important; }
.round-kicker em { font-weight: 600 !important; letter-spacing: 0.05em !important; }
.jp-stat-head span { font-weight: 600 !important; letter-spacing: 0.035em !important; }
.stake-presets button { font-weight: 700 !important; }
.bottom-nav button { font-weight: 600 !important; }
.jp-stat > strong { font-weight: 700 !important; }

/* ===== breathing room: gap above (pointer/card) and below (bet/nav) ===== */
.rakes-app .wheel-arena {
  width: min(90vw, 366px, calc(100svh - 398px)) !important;
  min-width: 226px !important;
  margin: 22px auto 12px !important;
}
.rakes-app .stake-presets { margin-top: 12px !important; }
.rakes-app .rakes-mobile { padding-bottom: calc(96px + env(safe-area-inset-bottom)) !important; }

/* ===== flexfit robust 20260706 (bet pinned to bottom, wheel fills) ===== */
.rakes-app #view-game {
  display: flex !important;
  flex-direction: column !important;
  min-height: 100svh !important;
}
/* pin the bet controls to the bottom; leftover space becomes air above them */
.rakes-app #view-game .stake-presets { margin-top: auto !important; }
/* wheel as big as width allows, but never taller than the space (no overlap) */
.rakes-app .wheel-arena {
  width: min(92vw, 392px, calc(100svh - 366px)) !important;
  min-width: 226px !important;
  margin: 18px auto 4px !important;
}
.rakes-app .stake-presets { padding-top: 0 !important; margin-bottom: 10px !important; }
.rakes-app .bet-dock { margin-bottom: 0 !important; }
/* fixed comfortable gap under the bet block, above the nav */
.rakes-app .rakes-mobile { padding-bottom: calc(94px + env(safe-area-inset-bottom)) !important; }
/* remove the little icons before БАНК / ИГРОКОВ / ВАШ ШАНС */
.jp-stat-head .ui-ic { display: none !important; }
.jp-stat-head { gap: 0 !important; }

/* ===== half gap 20260706 (tighten gap under bet ~half) ===== */
.rakes-app .rakes-mobile { padding-bottom: calc(74px + env(safe-area-inset-bottom)) !important; }

/* ===== jackpot roulette v2 (wheel fades, avatar strip decides) ===== */
#view-game.jp-rolling .wheel-arena canvas,
#view-game.jp-rolling .wheel-pointer,
#view-game.jp-rolling .wheel-hub {
  opacity: 0 !important;
  transform: scale(0.9);
  transition: opacity 0.4s ease, transform 0.4s ease;
  pointer-events: none;
}
.jp-roulette {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 7;
  width: min(96vw, 560px);
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: opacity 0.35s ease;
  pointer-events: none;
}
#view-game.jp-rolling .jp-roulette { opacity: 1; }
.jp-roulette-window {
  overflow: hidden;
  padding: 26px 0;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 12%, #000 88%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 12%, #000 88%, transparent 100%);
}
.jp-roulette-strip {
  display: flex;
  align-items: center;
  gap: 12px;
  will-change: transform;
}
.jp-roll-item {
  position: relative;
  flex: 0 0 auto;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #0b0e12;
  border: 3px solid var(--c, #3E7BD6);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.55), 0 0 14px color-mix(in srgb, var(--c, #3E7BD6) 55%, transparent);
  overflow: hidden;
}
.jp-roll-item img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.jp-roll-item span { color: #f4f6f3; font-weight: 800; font-size: 20px; }
.jp-roll-item.is-winner {
  border-color: #8FE84F;
  box-shadow: 0 0 0 3px rgba(143, 232, 79, 0.35), 0 0 26px rgba(164, 255, 106, 0.75);
  animation: jpWinPulse 1.1s ease-in-out infinite;
}
@keyframes jpWinPulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.12); }
}
.jp-roulette-pointer {
  position: absolute;
  left: 50%;
  top: 6px;
  bottom: 6px;
  z-index: 3;
  width: 3px;
  transform: translateX(-50%);
  border-radius: 2px;
  background: linear-gradient(180deg, #A4FF6A, rgba(164, 255, 106, 0.25));
  box-shadow: 0 0 12px rgba(164, 255, 106, 0.8);
  pointer-events: none;
}
.jp-roulette-pointer::before,
.jp-roulette-pointer::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
}
.jp-roulette-pointer::before { top: -8px; border-top: 9px solid #A4FF6A; }
.jp-roulette-pointer::after { bottom: -8px; border-bottom: 9px solid #A4FF6A; }
#view-game .result-popover { z-index: 9; }
@media (prefers-reduced-motion: reduce) {
  .jp-roll-item.is-winner { animation: none; }
}

/* ===== ring center 20260706 (canvas draws bank in center) ===== */
#view-game .wheel-hub { display: none !important; }

/* ===== tweaks 20260706 ===== */
/* 1. compact top card ~15% shorter */
.jackpot-card { padding-top: 6px !important; padding-bottom: 6px !important; }
.jp-stat { padding-top: 0 !important; padding-bottom: 0 !important; gap: 4px !important; }
.jp-stat > strong { font-size: 16px !important; }
.jp-stat-head span { font-size: 9px !important; }

/* 2. bottom nav — no neon glow, calm active state */
.bottom-nav button.active .nav-ic { filter: sepia(1) saturate(1.5) hue-rotate(60deg) brightness(1.02) !important; }
.bottom-nav button.active { box-shadow: none !important; background: transparent !important; color: #8FE84F !important; }

/* 3. seamless, instant tab switching (no motion) */
.app-view { transition: none !important; }
.bottom-nav button, .bottom-nav .nav-ic { transition: none !important; }

/* ===== polish2 20260706 ===== */
/* pointer now drawn by canvas — hide the DOM triangle on the jackpot screen */
#view-game .wheel-pointer { display: none !important; }

/* viewfix: flex layout must not defeat view-hidden */
.rakes-app #view-game.view-hidden { display: none !important; }

/* ===== bet stepper 20260706 ===== */
.bet-dock .bet-wrap { display: flex !important; align-items: center !important; gap: 8px !important; }
.bet-dock #bet-amount { flex: 1 1 auto !important; min-width: 0 !important; text-align: center !important; }
.bet-dock .bet-wrap > span { flex: 0 0 auto !important; color: #8D929B !important; }
.bet-step {
  flex: 0 0 auto;
  width: 38px; height: 38px;
  border-radius: 10px;
  background: #1a1f26;
  border: 1px solid rgba(255,255,255,0.09);
  color: #F4F4F5;
  font-size: 22px; font-weight: 700; line-height: 1;
  display: grid; place-items: center;
  -webkit-user-select: none; user-select: none;
  touch-action: manipulation;
  transition: background .1s ease, transform .1s ease;
}
.bet-step:hover { background: #202730; }
.bet-step:active { background: #26303a; transform: scale(0.93); }
.bet-step:focus-visible { outline: 2px solid var(--r-accent, #8FE84F); outline-offset: 2px; }

/* ===== stepper reset 20260706 (kill CTA styling on -/+ buttons) ===== */
.rakes-app .bet-dock button.bet-step {
  width: 38px !important;
  height: 38px !important;
  min-height: 0 !important;
  padding: 0 !important;
  border-radius: 10px !important;
  background: #1a1f26 !important;
  color: #F4F4F5 !important;
  border: 1px solid rgba(255,255,255,0.09) !important;
  box-shadow: none !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  flex: 0 0 auto !important;
}
.rakes-app .bet-dock button.bet-step:hover { background: #202730 !important; filter: none !important; }
.rakes-app .bet-dock button.bet-step:active { background: #26303a !important; transform: scale(0.93) !important; }

/* ===== tiny arrows 20260706 ===== */
.bet-dock .bet-wrap { display: flex !important; align-items: center !important; gap: 8px !important; }
.bet-dock #bet-amount { flex: 1 1 auto !important; min-width: 0 !important; text-align: left !important; }
.bet-dock .bet-unit { flex: 0 0 auto !important; color: #8D929B !important; }
.bet-steps { display: flex !important; flex-direction: column; gap: 3px; flex: 0 0 auto; }
.rakes-app .bet-dock button.bet-arrow {
  width: 26px !important; height: 17px !important; min-height: 0 !important;
  padding: 0 !important; border-radius: 6px !important;
  background: #1a1f26 !important; color: #9aa3ad !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  box-shadow: none !important; font-size: 9px !important; font-weight: 700 !important;
  line-height: 1 !important; letter-spacing: 0 !important;
  display: grid !important; place-items: center !important;
}
.rakes-app .bet-dock button.bet-arrow:hover { background: #222a33 !important; color: #cfd5db !important; filter: none !important; }
.rakes-app .bet-dock button.bet-arrow:active { background: #2a333d !important; transform: scale(0.92) !important; }

/* ===== arrows inside field 20260706 (absolute, inside the input box) ===== */
.bet-dock .bet-wrap { position: relative !important; display: block !important; }
.bet-dock #bet-amount {
  width: 100% !important;
  box-sizing: border-box !important;
  padding-right: 96px !important;
  text-align: left !important;
}
.bet-dock .bet-unit {
  position: absolute !important;
  right: 44px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  pointer-events: none;
}
.bet-steps {
  position: absolute !important;
  right: 9px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 3px !important;
}

/* ===== pm stepper 20260706 (minus | amount+USDT | plus) ===== */
.bet-dock .bet-wrap {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
}
.bet-mid {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
}
.bet-dock #bet-amount {
  width: 100% !important;
  padding: 0 !important;
  text-align: center !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  background: transparent !important;
}
.bet-mid .bet-unit {
  position: static !important;
  transform: none !important;
  margin-top: -1px !important;
  font-size: 10px !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: #8D929B !important;
  pointer-events: none;
}
.rakes-app .bet-dock button.bet-step-btn {
  width: 32px !important;
  height: 32px !important;
  min-height: 0 !important;
  padding: 0 !important;
  border-radius: 9px !important;
  background: #1a1f26 !important;
  color: #e6eaee !important;
  border: 1px solid rgba(255,255,255,0.09) !important;
  box-shadow: none !important;
  font-size: 20px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
}
.rakes-app .bet-dock button.bet-step-btn:hover { background: #202730 !important; filter: none !important; }
.rakes-app .bet-dock button.bet-step-btn:active { background: #262f39 !important; transform: scale(0.93) !important; }

/* ===== pm stepper specificity 20260706 (beat .rakes-app .bet-dock .bet-wrap) ===== */
.rakes-app .bet-dock .bet-wrap {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
}
.rakes-app .bet-dock .bet-mid {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
}
.rakes-app .bet-dock #bet-amount {
  width: 100% !important;
  padding: 0 !important;
  text-align: center !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  background: transparent !important;
}
.rakes-app .bet-dock .bet-mid .bet-unit {
  position: static !important;
  transform: none !important;
  margin-top: -1px !important;
  font-size: 10px !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: #8D929B !important;
}

/* ===== wallet glow 20260706 ===== */
.wallet-ic {
  width: 20px !important;
  height: 20px !important;
  filter: drop-shadow(0 0 3px rgba(143,232,79,0.95)) drop-shadow(0 0 7px rgba(143,232,79,0.45)) brightness(1.08) !important;
}

/* wallet glow off 20260706 */
.wallet-ic { filter: none !important; }

/* ===== separate stat cards 20260706 ===== */
.rakes-app .jackpot-card {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 8px !important;
  align-items: stretch !important;
}
.rakes-app .jp-stat {
  border: 1px solid rgba(255,255,255,0.06) !important;
  background: linear-gradient(160deg, #12171d, #0e1216 60%, #0b0f13) !important;
  border-radius: 16px !important;
  box-shadow: 0 8px 20px rgba(0,0,0,0.35) !important;
  padding: 10px 14px !important;
}
/* no inner divider — each is its own card now */
.rakes-app .jp-stat + .jp-stat { border-left: 1px solid rgba(255,255,255,0.06) !important; }
/* percent color like the reference (muted green, not neon lime) */
.rakes-app .jp-stat-accent > strong { color: var(--r-accent) !important; text-shadow: none !important; }

/* ===== bet field center 20260706 ===== */
.rakes-app .bet-dock .bet-mid {
  justify-content: center !important;
  align-items: center !important;
}
.rakes-app .bet-dock #bet-amount {
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  text-align: center !important;
  line-height: 1 !important;
  font-size: 22px !important;
  font-weight: 800 !important;
}

/* ===== boss battle 20260709 ===== */
#view-crash:not(.view-hidden){display:flex !important;flex-direction:column !important;}
.rakes-app #view-crash{padding:10px 14px calc(86px + env(safe-area-inset-bottom)) !important;min-height:100svh;gap:10px;}
.bbx{display:flex;flex-direction:column;gap:10px;flex:1 1 auto;min-height:0;max-width:470px;width:100%;margin:0 auto;}
.bb-arena{position:relative;flex:1 1 auto;min-height:340px;border-radius:20px;overflow:hidden;
  border:1px solid rgba(255,255,255,.09);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.6),inset 0 0 60px rgba(0,0,0,.55),0 16px 40px rgba(0,0,0,.5);}
.bb-arena::after{content:"";position:absolute;inset:6px;border:1px solid rgba(143,232,79,.10);border-radius:15px;pointer-events:none;}
#boss-cv{position:absolute;inset:0;width:100%;height:100%;display:block;}
.bb-ui{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;text-align:center;padding:16px 14px;pointer-events:none;}
.bb-orna{display:flex;align-items:center;gap:8px;color:#63BE55;font-size:10px;letter-spacing:.4em;text-transform:uppercase;}
.bb-orna::before,.bb-orna::after{content:"";width:40px;height:1px;background:linear-gradient(90deg,transparent,rgba(143,232,79,.7));}
.bb-orna::after{transform:scaleX(-1);}
.bb-name{font-family:"Palatino Linotype","Book Antiqua",Georgia,serif;font-size:clamp(24px,7vw,36px);font-weight:700;
  letter-spacing:.06em;line-height:1.05;color:#eef1f4;
  text-shadow:0 1px 0 #9aa3ad,0 2px 6px rgba(0,0,0,.8),0 0 24px rgba(143,232,79,.18);}
.bb-sub{display:flex;align-items:center;gap:10px;font-size:9px;letter-spacing:.3em;text-transform:uppercase;color:#63BE55;margin-top:3px;}
.bb-sub::before,.bb-sub::after{content:"\25C6";font-size:6px;color:rgba(143,232,79,.7);}
.bb-mid{margin:auto 0;}
.bb-mult{font-size:clamp(46px,15vw,84px);font-weight:800;line-height:1;font-variant-numeric:tabular-nums;
  text-shadow:0 0 28px rgba(143,232,79,.45);}
.bb-mult small{display:block;font-size:10px;letter-spacing:.3em;font-weight:700;color:#8D929B;margin-top:6px;}
.bb-cd{font-size:clamp(38px,12vw,60px);font-weight:800;color:#8FE84F;text-shadow:0 0 24px rgba(143,232,79,.55);}
.bb-out{font-family:"Palatino Linotype","Book Antiqua",Georgia,serif;font-size:clamp(28px,8vw,44px);font-weight:700;}
.bb-out.win{color:#8FE84F;text-shadow:0 0 28px rgba(143,232,79,.5);}
.bb-out.lose{color:#ff4d4d;text-shadow:0 0 28px rgba(255,70,60,.4);}
.bb-outsub{font-size:12px;color:#C3C9D1;margin-top:5px;}
.bb-outsub.lose-sub{color:#ff7a63;text-shadow:0 0 14px rgba(255,80,60,.42);font-weight:600;letter-spacing:.015em;}
.bb-wait{margin-top:auto;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:#8aa0b0;
  padding:6px 2px;border:0;background:none;display:flex;align-items:center;justify-content:center;gap:8px;}
.bb-wait-pulse{color:#63BE55;animation:waitPulse 1.6s ease-in-out infinite;}
.bb-wait-dots::after{content:"…";display:inline-block;width:1em;text-align:left;animation:waitDots 1.4s ease-in-out infinite;}
@keyframes waitPulse{0%,100%{opacity:.3;}50%{opacity:1;}}
@keyframes waitDots{0%,100%{opacity:.2;}50%{opacity:1;}}
.bb-ctl{display:grid;grid-template-columns:1fr 1fr;gap:8px;flex:0 0 auto;}
.bb-field{border:1px solid rgba(255,255,255,.08);border-radius:14px;background:linear-gradient(165deg,#12171d,#0c1014);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);padding:9px 10px;display:grid;gap:6px;}
.bb-field>label{font-size:8.5px;letter-spacing:.16em;text-transform:uppercase;color:#8D929B;}
.bb-step{display:flex;align-items:center;gap:6px;}
.rakes-app .bb-step button{flex:0 0 auto;width:30px;height:30px;min-height:0;padding:0;border:1px solid rgba(255,255,255,.09);
  background:#1a1f26;color:#F4F4F5;border-radius:9px;font-size:17px;font-weight:600;display:grid;place-items:center;box-shadow:none;}
.rakes-app .bb-step button:active{transform:scale(.93);background:#26303a;}
.bb-step b{flex:1;text-align:center;font-size:17px;font-weight:800;font-variant-numeric:tabular-nums;color:#F4F4F5;}
.rakes-app .bb-step input.bb-bet-input{flex:1;width:100%;min-width:0;text-align:center;font-size:17px;font-weight:800;font-variant-numeric:tabular-nums;color:#F4F4F5;background:transparent;border:0;outline:none;padding:0;margin:0;font-family:inherit;-moz-appearance:textfield;appearance:textfield;}
.rakes-app .bb-step input.bb-bet-input:focus{color:#FFFFFF;}
.rakes-app .bb-step input.bb-bet-input::-webkit-outer-spin-button,.rakes-app .bb-step input.bb-bet-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.rakes-app .bb-step .bb-auto-field{flex:1;min-width:0;display:flex;align-items:baseline;justify-content:center;gap:1px;}
.rakes-app .bb-step .bb-auto-field input.bb-auto-input{flex:0 0 auto;width:4ch;min-width:1ch;max-width:100%;text-align:right;font-size:17px;font-weight:800;font-variant-numeric:tabular-nums;color:#F4F4F5;background:transparent;border:0;outline:none;padding:0;margin:0;font-family:inherit;appearance:textfield;-moz-appearance:textfield;}
.rakes-app .bb-step .bb-auto-field input.bb-auto-input:focus{color:#FFFFFF;}
.rakes-app .bb-step .bb-auto-field input.bb-auto-input::-webkit-outer-spin-button,.rakes-app .bb-step .bb-auto-field input.bb-auto-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.rakes-app .bb-step .bb-auto-field .bb-x{font-size:17px;font-weight:800;color:#F4F4F5;font-style:normal;}
.bb-presets{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;}
.rakes-app .bb-presets button{border:1px solid rgba(255,255,255,.08);background:#101419;color:#F4F4F5;border-radius:8px;
  padding:6px 0;font-size:11px;font-weight:700;min-height:0;box-shadow:none;}
.rakes-app .bb-presets button.on{border-color:rgba(143,232,79,.65);color:#8FE84F;
  background:linear-gradient(180deg,rgba(143,232,79,.12),transparent);}
.rakes-app .bb-cta{position:relative;width:100%;flex:0 0 auto;border:1px solid rgba(190,255,130,.65);border-radius:16px;
  padding:11px;font-size:16px;font-weight:800;letter-spacing:.04em;color:#0c2408;overflow:hidden;min-height:0;
  background:linear-gradient(180deg,#B8F878 0%,#8FE84F 45%,#6FC93E 100%);
  box-shadow:0 0 0 1px rgba(0,0,0,.4),0 10px 26px rgba(110,200,60,.32),inset 0 2px 0 rgba(255,255,255,.5);}
.rakes-app .bb-cta:active{transform:translateY(1px);}
.rakes-app .bb-cta:disabled{opacity:.55;filter:grayscale(.35);}
.rakes-app .bb-cta.is-cashout{border-color:rgba(255,210,120,.7);color:#3a2400;
  background:linear-gradient(180deg,#ffd97a,#ffb638 50%,#f59a24);
  box-shadow:0 10px 26px rgba(255,160,50,.32),inset 0 2px 0 rgba(255,255,255,.5);animation:bbcash 1s ease-in-out infinite;}
@keyframes bbcash{50%{filter:brightness(1.07)}}
.rakes-app .bb-cta b{font-weight:800;margin-left:8px;}
@media (prefers-reduced-motion:reduce){.rakes-app .bb-cta.is-cashout{animation:none}}

/* ===== mines flair 20260709 ===== */
.mines-cell{ background:linear-gradient(180deg, rgba(143,232,79,.07), rgba(255,255,255,.015)), #0f1712 !important; }
.mines-board:not(.inactive) .mines-cell:not(.revealed):not(:disabled){ cursor:pointer; border-color:rgba(143,232,79,.18); }
.mines-board:not(.inactive) .mines-cell:not(.revealed):not(:disabled)::before{ content:"";
  width:9px;height:9px;border-radius:50%;
  background:radial-gradient(circle, rgba(143,232,79,.55), transparent 70%);
  opacity:.32; transition:opacity .18s ease, transform .18s ease; }
.mines-board:not(.inactive) .mines-cell:not(.revealed):not(:disabled):hover::before{ opacity:.75; transform:scale(1.5); }
.mines-board:not(.inactive) .mines-cell:not(.revealed):not(:disabled):active{ transform:scale(.93); }
.mines-cell.safe{
  border-color:color-mix(in srgb, var(--gem,#8FE84F) 55%, transparent) !important;
  background:radial-gradient(circle at 50% 38%, color-mix(in srgb, var(--gem,#8FE84F) 28%, transparent), transparent 58%), #0b120e !important;
  color:var(--gem,#8FE84F) !important;
  box-shadow:0 0 15px color-mix(in srgb, var(--gem,#8FE84F) 42%, transparent), inset 0 0 10px color-mix(in srgb, var(--gem,#8FE84F) 15%, transparent) !important; }
.mines-cell.safe svg{ color:var(--gem,#8FE84F) !important; filter:drop-shadow(0 0 6px color-mix(in srgb, var(--gem,#8FE84F) 70%, transparent)); }
.mines-cell.safe.just-revealed{ animation:mineGemPop .5s cubic-bezier(.16,1,.3,1) !important; }
@keyframes mineGemPop{ 0%{transform:scale(.35);opacity:.15} 55%{transform:scale(1.2)} 100%{transform:scale(1)} }
.mines-cell.mine{ box-shadow:0 0 16px rgba(255,80,70,.5), inset 0 0 12px rgba(255,80,70,.2) !important; }
.mines-cell.hit{ background:radial-gradient(circle, rgba(255,95,70,.55), #170d0d) !important; border-color:#ff5a46 !important; }
.mines-cell.hit svg{ color:#ffd4c6 !important; filter:drop-shadow(0 0 9px #ff5a46); }
.mines-action:not(.is-cashout):not(:disabled){
  background:linear-gradient(180deg,#B8F878,#8FE84F 55%,#6FC93E) !important; color:#0c2408 !important;
  border:1px solid rgba(190,255,130,.6) !important; }

.game-hint{ margin:0 0 12px; padding:9px 13px; font-size:12px; line-height:1.5; color:#aeb4bd;
  border:1px solid rgba(143,232,79,.14); border-radius:12px;
  background:linear-gradient(180deg, rgba(143,232,79,.05), rgba(255,255,255,.01)); }
.game-hint b{ color:#8FE84F; }

.duels-view{ padding-bottom:calc(150px + env(safe-area-inset-bottom)) !important; }
.duels-createbar{ position:fixed; left:0; right:0; bottom:calc(80px + env(safe-area-inset-bottom));
  display:flex; justify-content:center; padding:0 14px; pointer-events:none; z-index:30; }
.rakes-app .duels-create-cta{ pointer-events:auto; width:100%; max-width:460px; display:flex;
  align-items:center; justify-content:center; gap:7px; border:1px solid rgba(190,255,130,.6);
  border-radius:14px; padding:12px; font-size:15px; font-weight:800; letter-spacing:.02em; color:#0c2408;
  background:linear-gradient(180deg,#B8F878,#8FE84F 55%,#6FC93E);
  box-shadow:0 6px 18px rgba(110,200,60,.26), inset 0 2px 0 rgba(255,255,255,.5); }
.rakes-app .duels-create-cta:active{ transform:translateY(1px); }
.rakes-app .duels-create-cta svg{ width:18px; height:18px; }

/* ===== custom tweaks 20260710 ===== */

/* (1) переливающаяся линия по контуру пресетов ($1/$5/$10...) при наведении */
@property --sh-ang { syntax: "<angle>"; initial-value: 0deg; inherits: false; }
.rakes-app .stake-presets button { position: relative; z-index: 0; }
.rakes-app .stake-presets button::before {
  content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1.5px;
  background: conic-gradient(from var(--sh-ang), transparent 0deg, transparent 248deg, rgba(184,248,120,0.85) 300deg, #ffffff 332deg, rgba(184,248,120,0.85) 352deg, transparent 360deg);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask-composite: exclude;
  opacity: 0; transition: opacity 0.25s ease; pointer-events: none;
}
.rakes-app .stake-presets button:hover::before { opacity: 1; animation: presetSpin 1.4s linear infinite; }
@keyframes presetSpin { to { --sh-ang: 360deg; } }

/* (3+4) степпер уже, кнопка «Ставка» крупнее и левее, ровно по высоте, с воздухом */
.rakes-app .bet-dock { grid-template-columns: minmax(0,1fr) 150px !important; gap: 12px !important; align-items: center !important; margin-bottom: 6px !important; }
.rakes-app .bet-dock .bet-wrap { transform: none !important; min-height: 54px !important; }
.rakes-app #bet-submit {
  padding: 0 18px !important;
  font-size: 18px !important;
  border-radius: 14px !important;
  min-height: 54px !important;
  height: 54px !important;
  align-self: center !important;
  position: relative !important;
  overflow: hidden !important;
  box-shadow: 0 6px 16px rgba(87,179,62,0.22), inset 0 1px 0 rgba(255,255,255,0.35) !important;
}
/* воздух между блоком ставки и нижним меню */
.rakes-app #view-game { padding-bottom: 120px !important; }
/* убрать строку статуса «Ожидание игроков / Игра …» и поднять карточки */
.rakes-app .round-kicker { display: none !important; }
.rakes-app .round-head { margin-top: 2px !important; }
/* «Игроков» показывает «Ожидание...» вместо 0 — меньшим шрифтом */
.rakes-app .jp-stat > strong.stat-waiting { font-size: 12.5px !important; font-weight: 700 !important; letter-spacing: .01em !important; color: #8A9099 !important; }
/* активный пресет ставки — нейтральная белая подсветка вместо зелёной */
.rakes-app .stake-presets button.active {
  border-color: rgba(255,255,255,0.5) !important;
  color: #F4F4F5 !important;
  background: rgba(255,255,255,0.09) !important;
  box-shadow: none !important;
}

/* (5) премиальный медленный белый блик по кнопке «Ставка» (~4.5с) */
.rakes-app #bet-submit::after {
  content: ""; position: absolute; top: 0; left: -75%; width: 58%; height: 100%;
  background: linear-gradient(105deg, transparent 0%, rgba(255,255,255,0.10) 35%, rgba(255,255,255,0.40) 50%, rgba(255,255,255,0.10) 65%, transparent 100%);
  transform: skewX(-16deg); pointer-events: none; z-index: 2;
  animation: betGlint 4.5s ease-in-out infinite;
}
@keyframes betGlint { 0% { left: -75%; } 16% { left: 155%; } 100% { left: 155%; } }

/* (2) чуть приглушить самую сильную зелёную подсветку */
#round-timer { text-shadow: 0 0 8px rgba(164,255,106,0.34), 0 0 20px rgba(143,232,79,0.18) !important; }
.rakes-app .jp-stat-accent > strong { text-shadow: 0 0 8px rgba(143,232,79,0.18) !important; }
.rakes-app .wheel-arena::before { box-shadow: 0 22px 56px rgba(0,0,0,0.68), 0 0 16px rgba(143,232,79,0.07) !important; }
.round-kicker span::before { box-shadow: 0 0 5px rgba(164,255,106,0.45) !important; }

/* (6) выплата в бою — яркая, пульсирует (радость + мандраж) */
.bb-mult small.bb-payout{
  display:block; margin-top:9px; font-size:13px; font-weight:800; letter-spacing:.1em;
  color:#B9FF73 !important; text-shadow:0 0 16px rgba(160,255,90,.6), 0 0 4px rgba(160,255,90,.8);
  animation:payoutPulse 1.05s ease-in-out infinite;
}
@keyframes payoutPulse{0%,100%{transform:scale(1);opacity:.92;}50%{transform:scale(1.07);opacity:1;}}

/* монетка Tether в балансе — красивый переворот при наведении/тапе */
.rakes-app .balance-chip .token-logo{
  transform: perspective(240px) rotateY(0deg);
  transition: transform 0.85s cubic-bezier(0.34,1.4,0.5,1);
  transform-origin: center center; backface-visibility: visible; will-change: transform;
}
.rakes-app .balance-chip:hover .token-logo,
.rakes-app .balance-chip:active .token-logo{
  transform: perspective(240px) rotateY(360deg) scale(1.08);
  filter: drop-shadow(0 0 6px rgba(38,196,133,0.55));
}

/* анимация ожидания в центре колеса (пустое лобби): часы → Sonic → призрак, каждые 10с */
#wheel-hourglass{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:18%; height:18%; display:none; pointer-events:none; z-index:4;
  filter: drop-shadow(0 4px 12px rgba(0,0,0,.5));
}
#wheel-hourglass #wait-sonic{
  position:absolute; inset:0; width:100%; height:100%; display:none; object-fit:contain;
  image-rendering:pixelated; image-rendering:crisp-edges;
}
#wheel-hourglass #wait-lottie{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:80%; height:80%; display:none;
}
#wheel-hourglass #wait-lottie svg{ width:100% !important; height:100% !important; display:block; }
#wheel-hourglass #wait-ghost{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:175%; height:175%; display:none; object-fit:contain;
  image-rendering:pixelated; image-rendering:crisp-edges;
}

@media (prefers-reduced-motion: reduce) {
  .rakes-app .balance-chip .token-logo{ transition: none; }
  .rakes-app .stake-presets button:hover::before { animation: none; }
  .rakes-app #bet-submit::after { animation: none; opacity: 0; }
  .bb-mult small.bb-payout{ animation: none; }
  .bb-wait-pulse, .bb-wait-dots::after{ animation: none; }
}

/* ===== crash авто-выход: тумблер (ползунок) + чипы 20260710 ===== */
.rakes-app .bb-ctl{ align-items:stretch !important; }
.rakes-app .bb-field{ display:flex !important; flex-direction:column !important; }
.bb-field-auto > label{ display:flex !important; align-items:center; justify-content:space-between; gap:6px; }
.rakes-app .bb-toggle{ margin-left:auto; width:36px; height:20px; min-height:0 !important; padding:0 !important; border:0 !important; background:transparent !important; box-shadow:none !important; cursor:pointer; flex:0 0 auto; }
.rakes-app .bb-toggle .bb-toggle-track{ display:block; width:36px; height:20px; border-radius:20px; background:#2a2f37; position:relative; transition:background .2s; }
.rakes-app .bb-toggle .bb-toggle-knob{ position:absolute; top:2px; left:2px; width:16px; height:16px; border-radius:50%; background:#8b929c; transition:transform .2s, background .2s; box-shadow:0 1px 3px rgba(0,0,0,.5); }
.rakes-app .bb-toggle[aria-checked="true"] .bb-toggle-track{ background:rgba(143,232,79,.32); }
.rakes-app .bb-toggle[aria-checked="true"] .bb-toggle-knob{ transform:translateX(16px); background:#8FE84F; box-shadow:0 0 8px rgba(143,232,79,.6); }
.bb-auto-off{ flex:1 1 auto; min-height:30px; }
.bb-auto-chips{ display:grid; grid-template-columns:repeat(5,1fr); gap:4px; margin-top:7px; }
.bb-bet-chips{ grid-template-columns:repeat(4,1fr) !important; }
.rakes-app .bb-auto-chips button{ border:1px solid rgba(255,255,255,.09) !important; background:#101419 !important; color:#cfd5db !important; border-radius:8px !important; padding:5px 0 !important; font-size:11px !important; font-weight:700 !important; min-height:0 !important; box-shadow:none !important; }
.rakes-app .bb-auto-chips button.on{ border-color:rgba(143,232,79,.6) !important; color:#8FE84F !important; background:rgba(143,232,79,.08) !important; }
#bb-auto-off[hidden], #bb-auto-on[hidden]{ display:none !important; }

/* ===== crash: вертикальная история иксов + попап выигрыша 20260710 ===== */
.crash-hist-vert{ position:absolute; top:50%; right:6px; transform:translateY(-50%); display:flex; flex-direction:column; gap:5px; z-index:6; pointer-events:none;
  max-height:calc(100% - 16px); overflow:hidden; } /* по центру арены — равный отступ сверху и снизу */
.crash-hist-vert .crash-history-pill{ min-width:48px; text-align:center; padding:3px 7px; border-radius:7px; font-size:10.5px; font-weight:800; font-variant-numeric:tabular-nums; background:rgba(10,14,18,.66); border:1px solid rgba(255,255,255,.06); color:#c9d0d8; backdrop-filter:blur(2px); }
@keyframes histEnter{
  0%{ opacity:0; transform:translateX(-30px) scale(.6); }
  55%{ opacity:1; transform:translateX(4px) scale(1.09); }
  100%{ opacity:1; transform:translateX(0) scale(1); }
}
@keyframes histShift{ 0%{ transform:translateY(-32px); } 100%{ transform:translateY(0); } }
.crash-hist-vert .crash-history-pill.enter{ animation:histEnter .46s cubic-bezier(.2,1.1,.36,1); }
.crash-hist-vert.shift .crash-history-pill:not(.enter){ animation:histShift .4s cubic-bezier(.22,1,.36,1); }
.crash-hist-vert .crash-history-pill.high{ color:#8FE84F; border-color:rgba(143,232,79,.22); }
.crash-hist-vert .crash-history-pill.mid{ color:#c9d0d8; }
.crash-hist-vert .crash-history-pill.low{ color:#ff8778; border-color:rgba(255,90,70,.18); }

.crash-cashout-pop{ position:absolute; left:50%; top:46%; transform:translate(-50%,-50%) scale(.82); z-index:20; pointer-events:none; text-align:center;
  padding:14px 30px; border-radius:20px; background:linear-gradient(180deg, rgba(20,34,18,.94), rgba(9,16,11,.94));
  border:1px solid rgba(143,232,79,.42); box-shadow:0 14px 44px rgba(0,0,0,.6), 0 0 34px rgba(143,232,79,.28);
  opacity:0; visibility:hidden; transition:opacity .28s ease, transform .28s cubic-bezier(.34,1.56,.64,1), visibility .28s; }
.crash-cashout-pop.show{ opacity:1; visibility:visible; transform:translate(-50%,-50%) scale(1); }
.crash-cashout-pop .ccp-title{ font-size:11px; letter-spacing:.28em; text-transform:uppercase; color:#8FE84F; font-weight:800; }
.crash-cashout-pop .ccp-mult{ font-size:clamp(36px,11vw,54px); font-weight:800; color:#B9FF73; line-height:1; margin:4px 0 2px; text-shadow:0 0 24px rgba(160,255,90,.5); font-variant-numeric:tabular-nums; }
.crash-cashout-pop .ccp-amount{ font-size:15px; font-weight:800; color:#F4F4F5; }
/* выключенный авто-выход: те же контролы, но приглушены — для баланса со «Ставкой» */
.rakes-app .bb-auto-on.off{ opacity:.34 !important; pointer-events:none; filter:grayscale(.25); }

/* ===== one-screen fit: crash + jackpot 20260710 =====
   Каждый игровой экран ровно в один вьюпорт, без скролла, на ЛЮБОЙ высоте.
   Высоту вьюпорта задаёт JS через --appvh (медиа-запросы и dvh в Telegram Desktop врут).
   Арена/колесо поглощают свободную высоту; контролы всегда над нижним меню.
   На экстремально низких окнах (<520px) JS вешает html.vp-noFit — возврат к скроллу. */
  /* --- crash --- */
  .rakes-app #view-crash{
    height:var(--appvh, 100vh);
    min-height:0 !important;
    overflow:hidden;
    /* +8px — кнопка «В БОЙ» не прилипает к нижнему меню */
    padding-bottom:calc(80px + env(safe-area-inset-bottom)) !important;
  }
  .rakes-app #view-crash .casino-topbar{ flex:0 0 auto; }
  .bb-arena{ min-height:230px; } /* панель Emerald Reaper — крупнее */

  /* --- jackpot --- */
  .rakes-app #view-game{
    display:flex; flex-direction:column;
    height:var(--appvh, 100vh);
    min-height:0 !important;
    /* не hidden: если контент всё же не влез (очень низкое окно, крупный системный шрифт),
       док ставки должен остаться достижимым скроллом, а не пропасть под нижним меню */
    overflow-y:auto; overflow-x:hidden;
    /* +8px — лента ставок не прилипает к нижнему меню */
    padding-bottom:calc(80px + env(safe-area-inset-bottom)) !important;
  }
  .rakes-app #view-game .casino-topbar,
  .rakes-app #view-game .round-head,
  .rakes-app #view-game .stake-presets,
  .rakes-app #view-game .bet-dock{ flex:0 0 auto; }
  /* колесо масштабируется от свободной высоты: больше на высоких экранах, меньше на низких */
  .rakes-app #view-game .wheel-arena{
    flex:0 0 auto;
    /* резерв под всё остальное меряет JS (--jp-chrome): раньше стояла константа 300px,
       по факту ~400 — на низких экранах док ставки уезжал под нижнее меню */
    width:min(72vw, 340px, calc(var(--appvh, 100vh) - var(--jp-chrome, 300px))) !important;
    min-width:170px !important;
    margin:auto !important; /* центр в свободном месте — контролы уходят ниже */
  }
  .rakes-app #view-game .bets-feed{ flex:0 1 auto; min-height:0; overflow-y:auto; margin-bottom:0; }
  /* пустая заглушка ленты ставок съедала ~66px под «Ставкой» — прячем, реальные ставки показываются как раньше */
  .rakes-app #view-game .bet-row-empty{ display:none !important; }

  /* есть ставки: колесо уменьшается и отдаёт место ленте — её видно и можно скроллить */
  .rakes-app #view-game.has-bets .wheel-arena{
    width:min(52vw, 210px, calc(var(--appvh, 100vh) - var(--jp-chrome, 440px))) !important;
    margin:4px auto 8px !important; /* больше не съедает всю высоту */
  }
  .rakes-app #view-game.has-bets .bets-feed{
    flex:1 1 auto; min-height:64px;
    border-top:1px solid rgba(255,255,255,0.05); padding-top:8px;
  }

  /* очень низкое окно (клавиатура/мини-панель): fit не влезает — возвращаем скролл */
  html.vp-noFit .rakes-app #view-game,
  html.vp-noFit .rakes-app #view-crash{
    height:auto;
    min-height:100vh !important;
    overflow:visible;
  }
  html.vp-noFit .rakes-app #view-game .wheel-arena{ margin:6px auto 10px !important; }

/* компактные контролы crash на невысоких экранах — «В БОЙ» никогда не режется */
@media (max-height: 760px){
  .rakes-app #view-crash{ gap:8px; }
  .bbx{ gap:8px; }
  .rakes-app .bb-field{ padding:7px 9px !important; gap:4px; }
  .bb-auto-chips{ margin-top:5px; }
  .rakes-app .bb-auto-chips button{ padding:4px 0 !important; font-size:10px !important; }
  .rakes-app .bb-cta{ padding:9px !important; }
}
@media (max-height: 660px){
  .bb-auto-chips{ display:none !important; } /* чипы — шорткаты, степперы остаются */
  .bb-arena{ min-height:210px; }
  /* на низких экранах история компактнее, но остаётся по центру арены */
  .crash-hist-vert{ gap:4px; max-height:calc(100% - 12px); }
  .crash-hist-vert .crash-history-pill{ padding:3px 6px !important; font-size:9.5px; min-width:42px; }
}

/* меню чуть ниже — отдаём освободившиеся пиксели игре */
.bottom-nav{ bottom:6px !important; }

/* ===== mines one-screen + карточки множителей 20260710 ===== */
.rakes-app #view-mines{
  display:flex; flex-direction:column;
  height:var(--appvh, 100vh);
  min-height:0 !important;
  overflow:hidden;
  padding-bottom:calc(76px + env(safe-area-inset-bottom)) !important;
}
html.vp-noFit .rakes-app #view-mines{ height:auto; min-height:100vh !important; overflow:visible; }
.rakes-app #view-mines .casino-topbar{ flex:0 0 auto; }
.mnx{ display:flex; flex-direction:column; flex:1 1 auto; min-height:0; max-width:470px; width:100%; margin:0 auto; }

/* карточки: прошлый → текущий → следующий */
.mn-cards{ display:grid; grid-template-columns:1fr 1.22fr 1fr; gap:8px; align-items:stretch; margin:2px 0 10px; flex:0 0 auto; }
.mn-card{ position:relative; border:1px solid rgba(255,255,255,.08); border-radius:14px;
  background:linear-gradient(165deg,#12171d,#0c1014); box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  padding:8px 10px 7px; display:grid; gap:2px; text-align:center; align-content:center; }
.mn-card small{ font-size:8.5px; letter-spacing:.16em; text-transform:uppercase; color:#8D929B; }
.mn-card b{ font-size:15px; font-weight:800; font-variant-numeric:tabular-nums; color:#c9d0d8; line-height:1.1; }
.mn-card i{ font-style:normal; font-size:10.5px; font-weight:800; color:#B9FF73; min-height:13px; line-height:1.2; }
.mn-card.prev{ opacity:.5; }
.mn-card.cur{ border-color:rgba(143,232,79,.45); box-shadow:0 0 18px rgba(143,232,79,.13), inset 0 1px 0 rgba(255,255,255,.05); }
.mn-card.cur b{ color:#8FE84F; font-size:20px; text-shadow:0 0 14px rgba(143,232,79,.35); }
.mn-card.next{ border-style:dashed; border-color:rgba(255,255,255,.14); }
@keyframes mnRoll{ from{ transform:translateX(calc(100% + 8px)); opacity:.3; } to{ transform:translateX(0); opacity:1; } }
.mn-cards.roll .mn-card{ animation:mnRoll .38s cubic-bezier(.22,1,.36,1); }
.mn-cards.roll .mn-card.prev{ animation-duration:.34s; }
.mn-cards.roll .mn-card.next{ animation-duration:.46s; }

/* поле масштабируется от свободной высоты, центр в остатке */
.rakes-app .mines-board{ flex:0 0 auto; margin:auto; }

/* контролы в стиле crash */
.rakes-app .mines-controls{ display:grid; grid-template-columns:1fr 1fr; gap:8px; flex:0 0 auto; margin:0; padding:0; border:0; background:none; box-shadow:none; }
.rakes-app .mines-field{ border:1px solid rgba(255,255,255,.08); border-radius:14px;
  background:linear-gradient(165deg,#12171d,#0c1014); box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  padding:8px 10px; display:grid; gap:2px; margin:0; }
.rakes-app .mines-field span{ font-size:8.5px; letter-spacing:.16em; text-transform:uppercase; color:#8D929B; }
.rakes-app .mines-field input{ background:transparent; border:0; outline:none; font-size:17px; font-weight:800;
  color:#F4F4F5; padding:0; margin:0; width:100%; text-align:center; font-variant-numeric:tabular-nums; box-shadow:none; }
.rakes-app .mines-field small{ font-size:8.5px; color:#566069; text-align:center; letter-spacing:.08em; }
.rakes-app .mines-action{ grid-column:1 / -1; min-height:0; border:1px solid rgba(190,255,130,.65); border-radius:16px;
  padding:11px; font-size:16px; font-weight:800; letter-spacing:.04em; color:#0c2408;
  background:linear-gradient(180deg,#B8F878 0%,#8FE84F 45%,#6FC93E 100%);
  box-shadow:0 0 0 1px rgba(0,0,0,.4), 0 10px 26px rgba(110,200,60,.32), inset 0 2px 0 rgba(255,255,255,.5); }
.rakes-app .mines-action:active{ transform:translateY(1px); }
.rakes-app .mines-action.is-cashout{ border-color:rgba(255,210,120,.7); color:#3a2400;
  background:linear-gradient(180deg,#ffd97a,#ffb638 50%,#f59a24);
  box-shadow:0 10px 26px rgba(255,160,50,.32), inset 0 2px 0 rgba(255,255,255,.5); }
.rakes-app .mines-action:disabled{ opacity:.55; filter:grayscale(.35); }

/* анимации вскрытия */
.rakes-app .mines-cell{ position:relative; min-height:0; padding:0; }
.mines-cell.safe.just-revealed::after{ content:""; position:absolute; inset:-3px; border-radius:inherit; pointer-events:none;
  background:radial-gradient(circle, rgba(143,232,79,.45), transparent 65%);
  animation:mnGemFlash .55s ease-out forwards; }
@keyframes mnGemFlash{ from{ opacity:1; transform:scale(.55); } to{ opacity:0; transform:scale(1.5); } }
@keyframes mnBoardShake{ 0%,100%{ transform:translateX(0); } 18%{ transform:translateX(-8px); } 38%{ transform:translateX(6px); } 58%{ transform:translateX(-4px); } 78%{ transform:translateX(2px); } }
.mines-board.boom{ animation:mnBoardShake .5s ease-out; }
@keyframes mnMineIn{ 0%{ transform:scale(.15); opacity:0; } 60%{ transform:scale(1.16); opacity:1; } 100%{ transform:scale(1); } }
.mines-cell.mine.boom-in{ animation:mnMineIn .38s cubic-bezier(.2,1,.36,1) backwards; } /* все мины сразу, без каскадной задержки — на любом числе мин */
@keyframes mnHitFlash{ from{ box-shadow:0 0 0 0 rgba(255,90,70,.75); } to{ box-shadow:0 0 30px 18px rgba(255,90,70,0); } }
.mines-cell.hit.boom-in{ animation:mnMineIn .4s cubic-bezier(.2,1,.36,1) backwards, mnHitFlash .65s ease-out .12s; z-index:1; }

/* иконка-петарда на минах + мини-взрыв на подорвавшейся клетке 20260711 */
.rakes-app .mines-cell.mine .mn-mine-img{ width:56%; height:56%; display:block; pointer-events:none;
  filter:drop-shadow(0 0 6px rgba(255,120,60,.5)); }
.mines-cell.hit.boom-in::after{ content:""; position:absolute; inset:-6px; border-radius:50%; pointer-events:none;
  background:radial-gradient(circle, rgba(255,240,160,.95) 0%, rgba(255,150,60,.85) 32%, rgba(255,80,40,.45) 55%, transparent 72%);
  animation:mnExplode .55s cubic-bezier(.2,.9,.3,1) .08s both; }
@keyframes mnExplode{ 0%{ opacity:0; transform:scale(.2); } 25%{ opacity:1; } 100%{ opacity:0; transform:scale(2); } }

@media (prefers-reduced-motion: reduce){
  .mn-cards.roll .mn-card, .mines-board.boom, .mines-cell.mine.boom-in, .mines-cell.hit.boom-in{ animation:none !important; }
  .mines-cell.safe.just-revealed::after{ animation:none !important; opacity:0; }
  .mines-cell.hit.boom-in::after{ animation:none !important; opacity:0; }
}

/* ===== mines v2: чипы мин, ½/x2/MIN/MAX, автовыбор, большое поле, тиры цвета 20260710 ===== */
/* кнопки-модификаторы ставки (общие для mines/jackpot/crash) */
.bet-mods{ display:grid; grid-template-columns:repeat(4,1fr); gap:4px; margin-top:6px; }
.rakes-app .bet-mods button{ min-height:0; padding:5px 0; border:1px solid rgba(255,255,255,.09); background:#101419;
  color:#aeb4bd; border-radius:8px; font-size:9.5px; font-weight:800; letter-spacing:.05em; box-shadow:none; }
.rakes-app .bet-mods button:active{ transform:scale(.94); background:#1a222b; color:#F4F4F5; }
/* на компе (мышь) кнопки ½/x2/MAX повыше — удобнее целиться курсором */
@media (hover:hover) and (pointer:fine){
  .rakes-app .bet-mods button{ padding:9px 0; }
  .rakes-app .mn-bet-row .bet-mods button{ width:42px; }
}

.slot-launcher{position:fixed;inset:0;z-index:1000;background:#04060a;display:grid;place-items:center;padding:0}
.slot-launcher:has(.slot-choice:not([hidden])){padding:20px;background:rgba(3,7,12,.88)}
.slot-launcher[hidden]{display:none!important}
.slot-view{width:min(100%,480px);min-height:100svh;margin:0 auto;padding:max(12px,env(safe-area-inset-top)) 12px calc(86px + env(safe-area-inset-bottom));background:#070a0d;color:var(--r-text)}
.slot-choice{position:relative;width:min(360px,100%);padding:30px 22px 22px;border-radius:24px;background:#101923;color:#fff;text-align:center;box-shadow:0 20px 60px #000}
.slot-choice h2{margin:0 0 8px;font-size:23px}.slot-choice p{margin:0 0 22px;color:#9fb0bd}
.slot-choice button:not(.slot-close){width:100%;margin-top:10px;padding:16px 12px;border:0;border-radius:14px;font:700 15px inherit;color:#08110c;background:linear-gradient(135deg,#d8b45a,#f3dc9a)}
.slot-choice #slot-demo{color:#e7efe9;background:#20332a}.slot-close{position:absolute;right:12px;top:8px;border:0;background:transparent;color:#fff;font-size:30px;line-height:1}
.slot-choice .slot-mode-status{margin:14px 0 0;color:#e07a63;font-size:13px;font-weight:700}
/* inset:0 вместо relative+100%: .slot-launcher — это grid с place-items:center,
   и в нём процентная высота элемента упирается в auto-размер строки. Абсолютное
   позиционирование от fixed-родителя гарантирует айфрейму весь вьюпорт. */
.slot-frame{position:absolute;inset:0;background:#04060a;overflow:hidden}.slot-frame iframe{display:block;width:100%;height:100%;border:0}
.jp-mods{ margin:0 0 8px; grid-template-columns:repeat(4,1fr); }
.bb-mods{ margin-top:6px; }

/* чипы количества мин */
.mn-mine-chips{ display:grid; grid-template-columns:repeat(4,1fr); gap:4px; margin-top:2px; }
.rakes-app .mn-mine-chips button{ min-height:0; padding:8px 0; border:1px solid rgba(255,255,255,.09); background:#101419;
  color:#cfd5db; border-radius:8px; font-size:13px; font-weight:800; box-shadow:none; }
.rakes-app .mn-mine-chips button.on{ border-color:rgba(143,232,79,.6); color:#8FE84F; background:rgba(143,232,79,.08); }
.rakes-app .mn-mine-chips button:disabled{ opacity:.5; }

/* две кнопки: Играть (зелёная) + Автовыбор (жёлтая) */
.mn-actions{ grid-column:1 / -1; display:grid; grid-template-columns:1.35fr 1fr; gap:8px; }
.rakes-app .mn-actions .mines-action{ grid-column:auto; }
.rakes-app .mines-auto{ min-height:0; border:1px solid rgba(255,216,77,.6); border-radius:16px; padding:11px;
  font-size:14px; font-weight:800; letter-spacing:.02em; color:#3a2c00;
  background:linear-gradient(180deg,#FFE58A,#FFD84D 55%,#F0B31D);
  box-shadow:0 0 0 1px rgba(0,0,0,.4), 0 10px 24px rgba(240,180,40,.28), inset 0 2px 0 rgba(255,255,255,.5); }
.rakes-app .mines-auto:active{ transform:translateY(1px); }
.rakes-app .mines-auto:disabled{ opacity:.45; filter:grayscale(.35); }

/* поле игры больше: компактнее карточки/статус, шире формула */
.mn-cards{ margin:2px 0 8px; }
.mn-card{ padding:6px 8px; }
.mn-card.cur b{ font-size:19px; }
.rakes-app .mines-board{ padding:8px; gap:7px; border-radius:20px; }

/* клетки: без неоновой подсветки, крупные аккуратные иконки */
.rakes-app .mines-cell.safe{ border-color:rgba(53,208,168,.4) !important; color:#35d0a8 !important;
  background:linear-gradient(180deg,#0d1f18,#0a1611) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04) !important; }
.rakes-app .mines-cell.safe svg{ color:#3fe3b8 !important; width:46%; height:46%; stroke-width:2;
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.55)) !important; }
.rakes-app .mines-cell.mine{ border-color:rgba(255,110,95,.35) !important;
  background:linear-gradient(180deg,#1d1110,#140c0b) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03) !important; }
.rakes-app .mines-cell.mine svg{ color:#ff7b6b !important; width:46%; height:46%;
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.55)) !important; }
.rakes-app .mines-cell.hit{ border-color:#ff5a46 !important;
  background:linear-gradient(180deg,#2a1310,#1a0d0b) !important;
  box-shadow:inset 0 0 0 1px rgba(255,90,70,.35) !important; }
.mines-cell.safe.just-revealed::after{ background:radial-gradient(circle, rgba(63,227,184,.28), transparent 65%); }

/* цвет множителя по тиру: зелёный → жёлтый → оранжевый → красный, с нагревом */
#mn-prev[data-tier="2"], #mn-next[data-tier="2"]{ color:#FFD84D; }
#mn-prev[data-tier="3"], #mn-next[data-tier="3"]{ color:#FF9F40; }
#mn-prev[data-tier="4"], #mn-next[data-tier="4"]{ color:#FF5A46; }
#mn-cur[data-tier="2"]{ color:#FFD84D; text-shadow:0 0 12px rgba(255,216,77,.3); }
#mn-cur[data-tier="3"]{ color:#FF9F40; text-shadow:0 0 14px rgba(255,159,64,.42); animation:mnHot 1.3s ease-in-out infinite; }
#mn-cur[data-tier="4"]{ color:#FF5A46; text-shadow:0 0 16px rgba(255,90,70,.55); animation:mnHot .85s ease-in-out infinite; }
.mn-card.cur[data-tier="2"]{ border-color:rgba(255,216,77,.45); box-shadow:0 0 18px rgba(255,216,77,.10), inset 0 1px 0 rgba(255,255,255,.05); }
.mn-card.cur[data-tier="3"]{ border-color:rgba(255,159,64,.5); box-shadow:0 0 20px rgba(255,159,64,.14), inset 0 1px 0 rgba(255,255,255,.05); }
.mn-card.cur[data-tier="4"]{ border-color:rgba(255,90,70,.55); box-shadow:0 0 22px rgba(255,90,70,.18), inset 0 1px 0 rgba(255,255,255,.05); }
@keyframes mnHot{ 50%{ transform:scale(1.05); filter:brightness(1.12); } }

/* jackpot: ряд ½/x2/MIN/MAX добавил высоты — колесо чуть компактнее, чтобы всё влезало */
.rakes-app #view-game .wheel-arena{ width:min(72vw, 340px, calc(var(--appvh, 100vh) - 334px)) !important; }
.rakes-app #view-game.has-bets .wheel-arena{ width:min(52vw, 210px, calc(var(--appvh, 100vh) - 474px)) !important; }

@media (prefers-reduced-motion: reduce){
  #mn-cur[data-tier="3"], #mn-cur[data-tier="4"]{ animation:none; }
}

/* ставка mines: ½/x2/MIN/MAX в одну строку с вводом — контролы компактнее */
.mn-bet-row{ display:flex; align-items:center; gap:5px; }
.mn-bet-row input{ flex:1 1 40px; min-width:0; }
.mn-bet-row .bet-mods{ margin-top:0; display:flex; gap:3px; flex:0 0 auto; }
.rakes-app .mn-bet-row .bet-mods button{ width:30px; padding:7px 0; font-size:8.5px; }

/* ===== fix-pass 20260710: маленькие моды в джекпоте, авто-выход без пустоты,
       Забрать зелёная, поле мин не на всю ширину ===== */
/* jackpot: ½/x2/MIN/MAX компактно ВНУТРИ блока ставки (как в краше) */
.rakes-app .bet-dock{ height:auto !important; }
.rakes-app .bet-dock .bet-wrap{
  flex-direction:column !important; align-items:stretch !important;
  gap:4px !important; min-height:0 !important; padding:7px 10px !important;
}
.bet-steps-row{ display:flex; align-items:center; gap:8px; width:100%; }
.rakes-app .bet-dock .bet-wrap .bet-mods{ margin-top:0; display:grid; grid-template-columns:repeat(4,1fr); gap:4px; }
.rakes-app .bet-dock .bet-wrap .bet-mods button{ padding:4px 0; font-size:8.5px; }
.rakes-app #bet-submit{ height:auto !important; min-height:0 !important; align-self:stretch !important; }
/* колесо: блок ставки стал чуть выше, но убран отдельный ряд — почти паритет */
.rakes-app #view-game .wheel-arena{ width:min(72vw, 340px, calc(var(--appvh, 100vh) - 320px)) !important; }
.rakes-app #view-game.has-bets .wheel-arena{ width:min(52vw, 210px, calc(var(--appvh, 100vh) - 460px)) !important; }

/* crash: авто-выход распределяет контент по высоте — без дыры внизу */
.rakes-app .bb-auto-on{ flex:1 1 auto; display:flex; flex-direction:column; justify-content:space-evenly; }
.rakes-app .bb-auto-on .bb-auto-chips{ margin-top:0; }

/* mines: Забрать — зелёная (не жёлтая), жёлтый только Автовыбор */
.rakes-app .mines-action.is-cashout{
  border-color:rgba(190,255,130,.65) !important; color:#0c2408 !important;
  background:linear-gradient(180deg,#B8F878 0%,#8FE84F 45%,#6FC93E 100%) !important;
  box-shadow:0 0 0 1px rgba(0,0,0,.4), 0 10px 26px rgba(110,200,60,.32), inset 0 2px 0 rgba(255,255,255,.5) !important;
}
/* поля Ставка/Мины: контент распределён, без пустых провалов */
.rakes-app .mines-field{ align-content:space-evenly; }

/* jackpot mods: перебиваем зелёный стиль .bet-dock button — маленькие тёмные чипы */
.rakes-app .bet-dock .bet-wrap .bet-mods button{
  background:#101419 !important; color:#aeb4bd !important;
  border:1px solid rgba(255,255,255,.09) !important; border-radius:8px !important;
  box-shadow:none !important; padding:4px 0 !important; margin:0 !important;
  min-height:0 !important; height:auto !important; width:auto !important;
  font-size:8.5px !important; font-weight:800 !important; letter-spacing:.05em !important;
}
.rakes-app .bet-dock .bet-wrap .bet-mods button:active{ transform:scale(.94); background:#1a222b !important; color:#F4F4F5 !important; }

/* jackpot dock: высота по контенту — степпер + ряд модов всегда внутри */
.rakes-app .bet-dock{ height:auto !important; min-height:0 !important; align-items:stretch !important; }
.rakes-app .bet-dock .bet-wrap{ height:auto !important; }
.rakes-app .bet-dock .bet-steps-row{ flex:0 0 auto; }
.rakes-app .bet-dock input{ height:30px !important; line-height:30px !important; font-size:22px !important; }
.rakes-app .bet-dock .bet-step-btn{ min-height:0 !important; height:30px !important; width:34px; padding:0 !important; }

/* label был зажат max-height:46px !important из старого блока — снимаем все ограничители */
.rakes-app .bet-dock .bet-wrap{
  max-height:none !important; min-height:0 !important; height:auto !important;
  align-self:stretch !important; display:flex !important; flex-direction:column !important;
  align-items:stretch !important; padding:7px 10px !important; gap:4px !important;
}
.rakes-app #bet-submit{ max-height:none !important; height:auto !important; min-height:0 !important; align-self:stretch !important; }

/* ===== jackpot: убрали ряд $1..$100, колесо крупнее 20260710 ===== */
.rakes-app #view-game .stake-presets{ display:none !important; }
/* без ставок — колесо во весь освободившийся простор */
.rakes-app #view-game .wheel-arena{ width:min(84vw, 360px, calc(var(--appvh, 100vh) - 272px)) !important; }
/* со ставками — крупнее прежнего, лента ставок сохраняет место и скроллится */
.rakes-app #view-game.has-bets .wheel-arena{ width:min(64vw, 250px, calc(var(--appvh, 100vh) - 384px)) !important; min-width:150px !important; }

/* crash: убрать базовые чипы 5/10/25/50 — оставляем только ½/x2/MIN/MAX; арена растёт */
#bb-bet-chips{ display:none !important; }

/* crash: компактнее контролы → больше арены (без базовых чипов ряд стал короче) */
.rakes-app #view-crash .bb-field{ padding:6px 9px !important; gap:4px; }
.rakes-app #view-crash .bb-step button{ width:28px; height:28px; }
.rakes-app #view-crash .bet-mods button{ padding:3px 0 !important; }
.rakes-app #view-crash .bb-field>label{ font-size:8px; }
.rakes-app #view-crash .bb-auto-on{ gap:4px; }
.rakes-app #view-crash .bb-cta{ padding:9px !important; }

/* jackpot has-bets: лента заполняет остаток (не залипает на max-height), колесо крупнее на высоких экранах */
.rakes-app #view-game.has-bets .bets-feed{ flex:1 1 auto !important; max-height:none !important; }
.rakes-app #view-game.has-bets .wheel-arena{ width:min(76vw, 340px, calc(var(--appvh, 100vh) - var(--jp-chrome, 360px))) !important; min-width:150px !important; margin:4px auto 10px !important; }

/* jackpot: ½/x2/MIN/MAX крупнее — в тон остальным кнопкам */
.rakes-app .bet-dock .bet-wrap .bet-mods{ gap:6px !important; margin-top:2px !important; }
.rakes-app .bet-dock .bet-wrap .bet-mods button{
  padding:8px 0 !important; font-size:12px !important; border-radius:10px !important;
  letter-spacing:.04em !important;
}

/* ===== jackpot: анимация цифр и появления игроков 20260710 ===== */
/* банк трясётся при росте пула */
@keyframes numShake{ 0%,100%{transform:translateX(0)} 15%{transform:translateX(-3px) rotate(-1deg)} 30%{transform:translateX(3px) rotate(1deg)} 45%{transform:translateX(-2px)} 60%{transform:translateX(2px)} 80%{transform:translateX(-1px)} }
.num-shake{ display:inline-flex; animation:numShake .42s ease; will-change:transform; }
/* игроки «красиво приходят» — пружинистый поп */
@keyframes numPop{ 0%{transform:scale(1)} 35%{transform:scale(1.4)} 65%{transform:scale(.92)} 100%{transform:scale(1)} }
.num-pop{ display:inline-block; animation:numPop .5s cubic-bezier(.22,1,.36,1); }
/* шанс плавно докручивается + мягкое проявление */
@keyframes numFade{ 0%{opacity:.35; filter:brightness(1.5)} 100%{opacity:1; filter:brightness(1)} }
.num-fade{ display:inline-block; animation:numFade .5s ease; }
/* новый участник в ленте — вылет слева с лёгкой отдачей */
@keyframes betEnter{ 0%{opacity:0; transform:translateX(-26px) scale(.9)} 55%{opacity:1; transform:translateX(5px) scale(1.02)} 74%{transform:translateX(-3px)} 88%{transform:translateX(2px)} 100%{transform:translateX(0) scale(1)} }
.bet-row.bet-enter{ animation:betEnter .52s cubic-bezier(.22,1,.36,1); }

@media (prefers-reduced-motion: reduce){
  .num-shake, .num-pop, .num-fade, .bet-row.bet-enter{ animation:none !important; }
}

/* мягче тряска банка — по просьбе: послабее 20260710 */
@keyframes numShake{ 0%,100%{transform:translateX(0)} 20%{transform:translateX(-1.4px)} 40%{transform:translateX(1.4px)} 60%{transform:translateX(-0.9px)} 80%{transform:translateX(0.7px)} }
.num-shake{ animation:numShake .34s ease !important; }

/* ===== банк как слот-барабан 20260710 ===== */
.slot-num{ display:inline-flex; align-items:flex-start; line-height:1; }
.slot-num .slot-sep{ display:inline-block; }
.slot-num .slot-col{ display:inline-block; height:1em; overflow:hidden; vertical-align:top; }
.slot-num .slot-strip{ display:block; transform:translateY(0); transition:transform .62s cubic-bezier(.18,.7,.16,1); will-change:transform; }
.slot-num .slot-strip i{ display:block; height:1em; line-height:1; font-style:normal; text-align:center; font-variant-numeric:tabular-nums; }
@media (prefers-reduced-motion: reduce){ .slot-num .slot-strip{ transition:none; } }

/* банк-слот: цифры белые (по ошибке наследовали серый) */
.rakes-app #round-bank, .rakes-app #round-bank .slot-strip i{ color:#FFFFFF !important; }

/* ===== mines: доска квадратная, клетки тянутся сами ===== */
.rakes-app #view-mines .mines-board{
  height:auto !important;
  grid-template-rows:none !important;
}
.rakes-app #view-mines .mines-cell{ aspect-ratio:1 / 1 !important; height:auto !important; min-height:0 !important; }

/* ===== mines: поджать хром → доска шире (использует боковые поля на ПК) 20260710 ===== */
.mnx .mn-cards{ margin:2px 0 6px !important; }
.mnx .mn-card{ padding:5px 8px !important; }
.mnx .mn-card.cur b{ font-size:17px !important; }
.rakes-app #view-mines{ padding-bottom:calc(72px + env(safe-area-inset-bottom)) !important; }
.rakes-app #view-mines .mines-controls{ gap:6px !important; }
.rakes-app #view-mines .mines-field{ padding:6px 9px !important; }
.rakes-app #view-mines .mn-mine-chips button{ padding:6px 0 !important; }
.rakes-app #view-mines .mines-action, .rakes-app #view-mines .mines-auto{ padding:9px !important; }

/* mines: поля Ставка/Мины приглушены во время игры (неактивны) 20260710 */
.rakes-app #view-mines .mines-field.mn-locked{ opacity:.5; pointer-events:none; filter:grayscale(.2); transition:opacity .2s ease; }

/* ===== mines cards v3: 2 карточки (Сейчас/Следующая) с суммами, мягче шрифт 20260710 ===== */
.rakes-app #view-mines .mn-cards{ grid-template-columns:1fr auto 1fr !important; align-items:stretch; gap:6px !important; }
.rakes-app #view-mines .mn-card{ padding:8px 10px !important; border-radius:15px; display:grid; gap:3px; align-content:center; }
.rakes-app #view-mines .mn-card small{ font-size:9px; letter-spacing:.14em; text-transform:uppercase; color:#8D929B; font-weight:700; }
/* мягче, не «скелетный»: чуть меньше bold, больше межбуквенного, без резкого свечения */
.rakes-app #view-mines .mn-card b{ font-size:22px; font-weight:700; letter-spacing:.01em; line-height:1.05;
  font-variant-numeric:tabular-nums; -webkit-font-smoothing:antialiased; }
.rakes-app #view-mines .mn-card i{ font-style:normal; font-size:12px; font-weight:700; height:16px; min-height:16px; line-height:16px; letter-spacing:.01em;
  display:flex; align-items:center; justify-content:center; overflow:hidden; }
/* монетка в строке выплаты не должна менять высоту строки (иначе карточка растёт и поле сдвигается) */
.rakes-app #view-mines .mn-card i .mn-usdt{ vertical-align:middle; }

/* ТЕКУЩАЯ карточка — яркая, тон по тиру; СЛЕДУЮЩАЯ — приглушённая (видно разницу) */
.rakes-app #view-mines .mn-card.cur{ border-color:rgba(143,232,79,.4); background:linear-gradient(165deg,#12211a,#0c1512); }
.rakes-app #view-mines .mn-card.cur b{ color:#8FE84F; text-shadow:0 0 10px rgba(143,232,79,.22); }
.rakes-app #view-mines .mn-card.cur i{ color:#B9FF73; }
.rakes-app #view-mines .mn-card.next{ border-style:dashed; border-color:rgba(255,255,255,.13); background:linear-gradient(165deg,#0f1318,#0b0e12); }
.rakes-app #view-mines .mn-card.next b{ color:#9aa2ac; text-shadow:none; }
.rakes-app #view-mines .mn-card.next i{ color:#7f868f; }
/* стрелка между карточками */
.rakes-app #view-mines .mn-arrow{ display:flex; align-items:center; justify-content:center; color:#5c636c; }
.rakes-app #view-mines .mn-arrow svg{ width:18px; height:18px; }
/* цветовые тиры текущего множителя перекрывают базовый зелёный (жёлтый/оранжевый/красный) */
.rakes-app #view-mines .mn-card.cur[data-tier="2"] b{ color:#FFD84D; text-shadow:0 0 10px rgba(255,216,77,.22); }
.rakes-app #view-mines .mn-card.cur[data-tier="3"] b{ color:#FF9F40; text-shadow:0 0 12px rgba(255,159,64,.3); }
.rakes-app #view-mines .mn-card.cur[data-tier="4"] b{ color:#FF5A46; text-shadow:0 0 12px rgba(255,90,70,.35); }
.rakes-app #view-mines .mn-card.cur[data-tier="2"]{ border-color:rgba(255,216,77,.4); }
.rakes-app #view-mines .mn-card.cur[data-tier="3"]{ border-color:rgba(255,159,64,.42); }
.rakes-app #view-mines .mn-card.cur[data-tier="4"]{ border-color:rgba(255,90,70,.45); }

/* Mines: постоянная прокручиваемая панель со всеми шагами-коэффициентами; активный — зелёный */
/* обёртка: [ ‹ ]  [ лента коэффициентов ]  [ › ] */
.rakes-app #view-mines .mn-grid-wrap{
  display:flex; align-items:center; gap:6px;
  margin:10px 0 10px !important;                 /* отступ от хедера — не прилипает */
  flex:0 0 auto;
}
.rakes-app #view-mines .mn-arrow-btn{
  flex:0 0 22px; width:22px; height:32px; padding:0;
  display:flex; align-items:center; justify-content:center;
  border-radius:9px; border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(18,22,28,.92), rgba(10,13,17,.92));
  color:#aab1ba; box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
  transition:opacity .18s ease, transform .1s ease, border-color .18s ease;
}
.rakes-app #view-mines .mn-arrow-btn svg{ width:15px; height:15px; }
.rakes-app #view-mines .mn-arrow-btn:active{ transform:scale(.9); border-color:rgba(143,232,79,.4); }
.rakes-app #view-mines .mn-arrow-btn:disabled{ opacity:.25; pointer-events:none; }

.rakes-app #view-mines .mn-cards.mn-grid{
  display:flex !important; flex-wrap:nowrap; align-items:stretch;
  gap:6px !important;
  flex:1 1 auto; min-width:0;                      /* лента занимает место между стрелками */
  padding:8px; border-radius:16px;
  border:1px solid rgba(255,255,255,.06);
  background:linear-gradient(180deg, rgba(18,22,28,.92), rgba(10,13,17,.92));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03), 0 6px 18px rgba(0,0,0,.28);
  overflow-x:auto; overflow-y:hidden; overscroll-behavior:contain; -webkit-overflow-scrolling:touch;
  scrollbar-width:none;                            /* без видимого скроллбара — листаем стрелками */
  scroll-behavior:smooth;
}
.rakes-app #view-mines .mn-cards.mn-grid::-webkit-scrollbar{ display:none; width:0; height:0; }
.rakes-app #view-mines .mn-grid .mn-cell{
  flex:0 0 calc((100% - 18px) / 4);               /* ровно 4 ячейки на видимую ширину линии */
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px;
  padding:6px 3px; min-height:40px; border-radius:11px;
  border:1px solid rgba(255,255,255,.07);
  background:linear-gradient(165deg,#12171d,#0c1014);
  transition:border-color .18s ease, background .18s ease, transform .18s ease;
}
.rakes-app #view-mines .mn-grid .mn-cell small{ font-size:8.5px; font-weight:700; color:#6b7178; letter-spacing:.03em; line-height:1; }
.rakes-app #view-mines .mn-grid .mn-cell b{ font-size:12.5px; font-weight:800; color:#cbd2da; font-variant-numeric:tabular-nums; line-height:1.05; }
.rakes-app #view-mines .mn-grid .mn-cell.passed{ opacity:.4; }
.rakes-app #view-mines .mn-grid .mn-cell.passed b{ color:#8FE84F; }
.rakes-app #view-mines .mn-grid .mn-cell.next{ border-style:dashed; border-color:rgba(255,255,255,.16); }
.rakes-app #view-mines .mn-grid .mn-cell.next b{ color:#cbd2da; }
.rakes-app #view-mines .mn-grid .mn-cell.active{
  border-color:rgba(143,232,79,.65);
  background:linear-gradient(165deg,#153020,#0d1a12);
  box-shadow:0 0 18px rgba(143,232,79,.22), inset 0 1px 0 rgba(255,255,255,.06);
  transform:translateY(-1px);
}
.rakes-app #view-mines .mn-grid .mn-cell.active small{ color:#B9FF73; }
.rakes-app #view-mines .mn-grid .mn-cell.active b{ color:#8FE84F; font-size:13.5px; text-shadow:0 0 12px rgba(143,232,79,.4); }

/* кнопка «Забрать» крупнее — тот же шрифт что «Автовыбор», но больше и заметнее */
.rakes-app #view-mines .mn-actions{ grid-template-columns:1.5fr 1fr !important; }
.rakes-app #view-mines .mines-action.is-cashout{ padding:11px 9px !important; display:flex; flex-direction:row; align-items:center; justify-content:center; gap:8px; line-height:1; }
.rakes-app #view-mines .mines-action.is-cashout span{ font-size:16px; font-weight:800; letter-spacing:.03em; }
.rakes-app #view-mines .mines-action.is-cashout b{ font-size:18px; font-weight:800; letter-spacing:.01em; }

/* ===== mines cards v4: без «стекла», раздельные цвета, следующая тоже цветная 20260710 ===== */
/* сплошной фон вместо градиента-«стекла» — чище, не «по-иишному» */
.rakes-app #view-mines .mn-card{ background:#0e1411 !important; box-shadow:none !important; backdrop-filter:none !important; }
/* СЕЙЧАС: множитель — тон по иксу, сумма — БЕЛАЯ (не сливается с зелёным множителем) */
.rakes-app #view-mines .mn-card.cur{ border-color:rgba(143,232,79,.42) !important; background:#0d1712 !important; }
.rakes-app #view-mines .mn-card.cur i{ color:#FFFFFF !important; text-shadow:none !important; }
.rakes-app #view-mines .mn-card.cur[data-tier="2"]{ border-color:rgba(255,216,77,.42) !important; }
.rakes-app #view-mines .mn-card.cur[data-tier="3"]{ border-color:rgba(255,159,64,.44) !important; }
.rakes-app #view-mines .mn-card.cur[data-tier="4"]{ border-color:rgba(255,90,70,.46) !important; }
/* СЛЕДУЮЩАЯ: не серая, а бирюзовая («хочется открыть») — свой цвет, отличный от «сейчас» */
.rakes-app #view-mines .mn-card.next{ border-style:solid !important; border-color:rgba(63,227,184,.4) !important; background:#0b1513 !important; }
.rakes-app #view-mines .mn-card.next b{ color:#3FE3B8 !important; text-shadow:0 0 10px rgba(63,227,184,.2) !important; }
.rakes-app #view-mines .mn-card.next i{ color:#FFFFFF !important; text-shadow:none !important; }
/* маленький значок USDT рядом с суммой */
.rakes-app #view-mines .mn-card .mn-usdt{ width:12px; height:12px; vertical-align:-2px; margin-left:3px; opacity:.95; }
/* стрелка — в цвет «между сейчас и следующей» */
.rakes-app #view-mines .mn-arrow{ color:#3a6b58 !important; }

/* ===== кросс-девайс: MIN удалён, тач-таргеты, единый сайзинг 20260710 ===== */
/* iOS раздувает шрифты (text-size-adjust) — из-за этого поля на айфоне выглядели шире */
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; }
/* единый кап ширины контента на всех девайсах (как у crash/mines) */
.rakes-mobile{ max-width:470px !important; margin-left:auto !important; margin-right:auto !important; }

/* моды теперь ½ / x2 / MAX — 3 колонки везде */
.bet-mods{ grid-template-columns:repeat(3,1fr) !important; }

/* тач-устройства: кнопки крупные — в палец (ПК не трогаем) */
@media (pointer: coarse){
  .rakes-app .bet-mods button,
  .rakes-app .bet-dock .bet-wrap .bet-mods button{
    min-height:40px !important; height:auto !important; padding:0 !important;
    font-size:13px !important; border-radius:10px !important;
  }
  /* mines: инлайн-ряд у ставки переезжает вниз полноширинной сеткой */
  .mn-bet-row{ flex-wrap:wrap; }
  .rakes-app .mn-bet-row .bet-mods{ flex:1 1 100%; display:grid !important; grid-template-columns:repeat(3,1fr) !important; gap:5px; margin-top:5px; }
  .rakes-app .mn-bet-row .bet-mods button{ width:auto !important; }
  .rakes-app .mn-mine-chips button{ min-height:40px !important; }
  /* duels: кнопки Играть/Смотреть — в палец */
  .rakes-app .duel-card-actions button{ height:40px; border-radius:12px !important; }
  /* колесо крупнее на мобильных — пустота снизу уходит; высотный кап и px-потолок
     гарантируют, что ничего не вылезает ни по вертикали, ни по горизонтали */
  .rakes-app #view-game .wheel-arena{ width:min(90vw, 408px, calc(var(--appvh,100vh) - 286px)) !important; }
  .rakes-app #view-game.has-bets .wheel-arena{ width:min(72vw, 300px, calc(var(--appvh,100vh) - 398px)) !important; }
}

/* mines: поле прибито после карточек; контролы жмутся к сетке, свободное место — снизу (у меню) */
.rakes-app #view-mines .mines-board{ margin:6px auto 0 !important; }
/* было margin-bottom:auto — свободное место уходило ПОД контролы, и кнопка висела на высоте поля,
   а не экрана. Меняем местами: место уходит НАВЕРХ, контролы прибиты к низу — вровень с Crash/Duels. */
.rakes-app #view-mines .mines-controls{ margin-top:auto !important; margin-bottom:0 !important; }

/* duels: значок USDT вместо текста, масштабируется под размер суммы 20260711 */
.rakes-app .usdt-ic{ width:0.92em; height:0.92em; vertical-align:-0.11em; margin-left:0.28em; display:inline-block; }
.rakes-app .duel-card strong{ display:inline-flex; align-items:center; }
.rakes-app .duel-watch-meta strong{ display:inline-flex; align-items:center; }

/* ===== mines v5: одна карточка «Следующая» + иксы на кристаллах 20260711 ===== */
/* одна карточка по центру */
.rakes-app #view-mines .mn-cards{ grid-template-columns:1fr !important; justify-items:center; }
.rakes-app #view-mines .mn-card.next{ width:min(64%, 250px); }
/* цвет по иксам: зелёная → (2x+) жёлтая → (3.5x+) оранжевая → (6x+) красная */
.rakes-app #view-mines .mn-card.next[data-tier="1"]{ border-color:rgba(143,232,79,.42) !important; }
.rakes-app #view-mines .mn-card.next[data-tier="1"] b{ color:#8FE84F !important; text-shadow:0 0 10px rgba(143,232,79,.22) !important; }
.rakes-app #view-mines .mn-card.next[data-tier="2"]{ border-color:rgba(255,216,77,.45) !important; }
.rakes-app #view-mines .mn-card.next[data-tier="2"] b{ color:#FFD84D !important; text-shadow:0 0 10px rgba(255,216,77,.25) !important; }
.rakes-app #view-mines .mn-card.next[data-tier="3"]{ border-color:rgba(255,159,64,.5) !important; }
.rakes-app #view-mines .mn-card.next[data-tier="3"] b{ color:#FF9F40 !important; text-shadow:0 0 12px rgba(255,159,64,.32) !important; }
.rakes-app #view-mines .mn-card.next[data-tier="4"]{ border-color:rgba(255,90,70,.55) !important; }
.rakes-app #view-mines .mn-card.next[data-tier="4"] b{ color:#FF5A46 !important; text-shadow:0 0 14px rgba(255,90,70,.4) !important; }
/* шаг вперёд: лёгкий пульс карточки вместо слайда */
@keyframes mnNextPulse{ 0%{ transform:scale(1); } 40%{ transform:scale(1.07); } 100%{ transform:scale(1); } }
.rakes-app #view-mines .mn-cards.roll .mn-card{ animation:mnNextPulse .4s cubic-bezier(.22,1,.36,1) !important; }

/* множитель на вскрытом кристалле */
.rakes-app #view-mines .mines-board{ container-type:inline-size; }
.mines-cell .mn-cell-wrap{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; width:100%; height:100%; }
.rakes-app #view-mines .mines-cell .mn-cell-wrap svg{ width:27% !important; height:auto !important; }
.mines-cell .mn-cell-x{ font-weight:800; font-variant-numeric:tabular-nums; color:#3fe3b8; line-height:1;
  font-size:clamp(8px, 5.4cqw, 14px); letter-spacing:.01em; text-shadow:0 1px 2px rgba(0,0,0,.6); }
@container (max-width: 250px){
  .rakes-app #view-mines .mines-cell .mn-cell-wrap svg{ display:none !important; }
}
@media (prefers-reduced-motion: reduce){ .rakes-app #view-mines .mn-cards.roll .mn-card{ animation:none !important; } }

/* ===== mines: трясочка «Следующей» при росте x + единый стиль «Забрать» 20260711 ===== */
@keyframes mnCardShake{
  0%,100%{ transform:translateX(0) scale(1); }
  18%{ transform:translateX(-2px) scale(1.05); }
  38%{ transform:translateX(2px) scale(1.06); }
  58%{ transform:translateX(-1.5px) scale(1.04); }
  80%{ transform:translateX(1px) scale(1.01); }
}
.rakes-app #view-mines .mn-cards.roll .mn-card{ animation:mnCardShake .46s cubic-bezier(.22,1,.36,1) !important; }

/* «ЗАБРАТЬ 2000$» — единое целое: один размер/вес, по центру, табличные цифры */
.rakes-app #view-mines .mines-action.is-cashout{
  display:flex !important; align-items:center !important; justify-content:center !important; gap:7px !important;
}
.rakes-app #view-mines .mines-action.is-cashout span,
.rakes-app #view-mines .mines-action.is-cashout b{
  font-size:15.5px !important; font-weight:800 !important; letter-spacing:.03em !important;
  text-transform:uppercase !important; line-height:1 !important; margin:0 !important;
  font-variant-numeric:tabular-nums;
}

/* ===== mines: бейдж «x» выскакивает над монеткой и сам исчезает (~2с) 20260711 ===== */
.rakes-app #view-mines .mines-board{ overflow:visible; }
.mines-cell .mn-x-pop{
  position:absolute; top:-10px; right:-8px; z-index:6;
  padding:3px 8px; border-radius:999px;
  background:linear-gradient(180deg,#B8F878,#8FE84F); color:#0c2408;
  font-size:11px; font-weight:800; font-variant-numeric:tabular-nums; line-height:1;
  font-style:normal; white-space:nowrap; pointer-events:none;
  box-shadow:0 3px 9px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.45);
  /* только «влёт» и остаётся видимым на текущей клетке (раньше гас в 0 → при быстрых тапах пропадал) */
  animation:mnXPop .42s cubic-bezier(.22,1,.36,1) both;
}
@keyframes mnXPop{
  0%{ opacity:0; transform:translateY(7px) scale(.4); }
  60%{ opacity:1; transform:translateY(0) scale(1.12); }
  100%{ opacity:1; transform:translateY(0) scale(1); }
}
@media (prefers-reduced-motion: reduce){ .mines-cell .mn-x-pop{ animation:none; opacity:1; } }

/* ===== отзывчивость тапов 20260711: мгновенный отклик, без задержек ===== */
/* глобально: без серого тап-хайлайта и без double-tap-zoom на кнопках */
html, body{ -webkit-tap-highlight-color:transparent; }
.rakes-app button{ touch-action:manipulation; }
/* mines: клетка мгновенно «прижимается» и пульсирует, пока летит ответ сервера */
.mines-cell.mn-opening{
  transform:scale(.93) !important;
  border-color:rgba(63,227,184,.55) !important;
  animation:mnOpening .7s ease-in-out infinite;
}
@keyframes mnOpening{
  0%,100%{ box-shadow:inset 0 0 6px rgba(63,227,184,.15); }
  50%{ box-shadow:inset 0 0 16px rgba(63,227,184,.35); }
}
/* моментальное прижатие основных кнопок во всех играх */
.rakes-app .mines-action:active, .rakes-app .mines-auto:active,
.rakes-app .bb-cta:active, .rakes-app #bet-submit:active{ transform:translateY(1px) scale(.985) !important; transition:transform .05s !important; }
@media (prefers-reduced-motion: reduce){ .mines-cell.mn-opening{ animation:none; } }

/* ===== crash: плавающий фид ставок слева внизу арены (как Polymarket) 20260711 ===== */
.bb-live-bets{ position:absolute; left:10px; bottom:12px; z-index:5; pointer-events:none;
  display:flex; flex-direction:column; justify-content:flex-end; gap:4px;
  max-height:20%; max-width:60%; overflow:hidden; opacity:.82;
  -webkit-mask-image:linear-gradient(180deg, transparent 0, #000 30%);
  mask-image:linear-gradient(180deg, transparent 0, #000 30%);
  transition:opacity .5s ease, transform .5s ease; }
.bb-live-bets.out{ opacity:0; transform:translateY(10px); }
.lb-row{ display:flex; align-items:center; gap:6px; animation:lbIn .35s cubic-bezier(.2,.9,.3,1) both; }
.lb-row b{ color:#4ade80; font-size:12px; font-weight:800; letter-spacing:.01em; flex:0 0 auto;
  text-shadow:0 1px 3px rgba(0,0,0,.6); }
.lb-av{ width:16px; height:16px; flex:0 0 auto; display:grid; place-items:center; overflow:hidden;
  border-radius:50%; background:#1a222b; color:#aeb4bd; font-size:8px; font-weight:800; font-style:normal; }
.lb-av img{ width:100%; height:100%; object-fit:cover; display:block; }
.lb-row span{ min-width:0; overflow:hidden; color:rgba(244,247,243,.72); font-size:11px; font-weight:700;
  text-overflow:ellipsis; white-space:nowrap; text-shadow:0 1px 3px rgba(0,0,0,.6); }
@keyframes lbIn{ from{ opacity:0; transform:translateX(-14px); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion: reduce){ .lb-row{ animation:none !important; } }

/* ===== desktop: чуть крупнее кнопки ½/x2/MAX и чипы мин на минах и краше 20260711 ===== */
@media (pointer: fine){
  .rakes-app #view-mines .bet-mods button,
  .rakes-app #view-crash .bet-mods button{
    padding:8px 0 !important; font-size:12px !important; border-radius:9px !important;
  }
  .rakes-app #view-mines .mn-mine-chips button{
    padding:11px 0 !important; font-size:15px !important; border-radius:9px !important;
  }
}

/* mines: авто-раскрытые (не игроком) клетки при завершении — приглушены, чтобы видно,
   что игрок реально нашёл, а что было скрыто */
.rakes-app #view-mines .mines-cell.disclosed{ opacity:.5; }
.rakes-app #view-mines .mines-cell.disclosed svg{ filter:none !important; }
/* мины при выводе (не проигрыш) — показываем статично, приглушённо (акцент на выигрыше) */
.rakes-app #view-mines .mines-cell.mine.revealed:not(.hit):not(.boom-in){ opacity:.62; }

/* crash live-bets: формат «аватарка · ник · сумма+USDT» 20260711 */
.lb-row b{ display:inline-flex; align-items:center; gap:3px; }
.lb-usdt{ width:12px; height:12px; border-radius:50%; display:block; }

/* ===== фиксы 20260711b: банк не режется, фид краша выше и целиком ===== */
/* слот-цифры: вертикальный запас + центрирование глифа, чтобы цифры не подрезались
   на дробных DPI (масштаб TG). Сдвиг ленты — в em (кратно высоте цифры), не в % */
.slot-num .slot-col{ height:1.28em !important; }
.slot-num .slot-strip i{ height:1.28em !important; line-height:1 !important;
  display:flex !important; align-items:center !important; justify-content:center !important; }
/* и чуть больше воздуха до монетки */
.jp-stat > strong{ gap:8px !important; }
/* точка/пробел — такая же колонка, как цифра (см. setSlotNumber): один и тот же box-модель,
   поэтому базовая линия совпадает сама, без подгонки отступов */

/* фид ставок в краше: выше чёрной полосы (на зелёном), аватарка целиком, растёт снизу вверх */
.bb-live-bets{ left:12px; bottom:56px; max-height:26%; padding:2px 0 0 2px; }
.lb-av{ width:18px; height:18px; font-size:8.5px; }

/* mines: карточка «Следующая» скрыта после завершения игры (место резервируется — поле не прыгает) */
.rakes-app #view-mines .mn-cards.mn-hidden{ visibility:hidden !important; }

/* ===== профиль: кнопки Депозит/Вывод открывают внутренние модули ===== */
.rakes-app .profile-wallet-actions,
.rakes-app .wallet-actions{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:0 0 14px; }
.rakes-app .profile-wallet-actions button,
.rakes-app .wallet-actions button{ display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto auto;
  align-items:center; gap:2px 10px; padding:13px 14px; border-radius:16px; text-align:left; min-height:0;
  border:1px solid rgba(255,255,255,.08); background:linear-gradient(165deg,#12171d,#0c1014); box-shadow:inset 0 1px 0 rgba(255,255,255,.04); }
.rakes-app .profile-wallet-actions button i,
.rakes-app .profile-wallet-actions button svg,
.rakes-app .wallet-actions button i,
.rakes-app .wallet-actions button svg{ grid-row:1 / 3; width:22px; height:22px; align-self:center; justify-self:center; color:#8D929B; stroke:currentColor; flex:none; }
.rakes-app .profile-wallet-actions button span,
.rakes-app .wallet-actions button span{ font-size:15px; font-weight:800; color:#F4F4F5; letter-spacing:.01em; align-self:end; }
.rakes-app .profile-wallet-actions button small,
.rakes-app .wallet-actions button small{ font-size:10.5px; color:#8D929B; align-self:start; }
.rakes-app .profile-wallet-actions button:active,
.rakes-app .wallet-actions button:active{ transform:translateY(1px) scale(.99); }
.rakes-app .profile-wallet-actions .pw-deposit,
.rakes-app .wallet-actions .pw-deposit{ border-color:rgba(143,232,79,.4); }
.rakes-app .profile-wallet-actions .pw-deposit i,
.rakes-app .profile-wallet-actions .pw-deposit svg,
.rakes-app .wallet-actions .pw-deposit i,
.rakes-app .wallet-actions .pw-deposit svg{ color:#8FE84F; }
.rakes-app .profile-wallet-actions .pw-deposit span,
.rakes-app .wallet-actions .pw-deposit span{ color:#8FE84F; }
.rakes-app .profile-wallet-actions .pw-withdraw i,
.rakes-app .profile-wallet-actions .pw-withdraw svg,
.rakes-app .wallet-actions .pw-withdraw i,
.rakes-app .wallet-actions .pw-withdraw svg{ color:#FFD84D; }
.rakes-app .wallet-actions{ margin:0; }

/* crash: кэфы в пилюлях истории строго по центру (высота была 28px, текст прижимался к верху) */
.crash-hist-vert .crash-history-pill{
  height:auto !important; min-height:0 !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  line-height:1 !important; padding:5px 7px !important;
}

/* mines: зазор между кнопками и нижним меню (было впритык) */
/* 80px — ровно как у #view-crash: контролы теперь прибиты к низу (см. margin-top:auto выше),
   поэтому padding-bottom напрямую задаёт отступ кнопки от края экрана. */
.rakes-app #view-mines{ padding-bottom:calc(80px + env(safe-area-inset-bottom)) !important; }

/* mines: всё прижато к верху, свободное место уходит вниз (к меню).
   Доска — квадрат (клетки aspect-ratio:1), поэтому ограничиваем только ширину:
   меньшее из «вся ширина» и «сколько осталось по высоте».
   --mn-chrome = всё, кроме доски. Одно число на весь экран, считается так:
   padding 8 + topbar 42 + карточки 66 + отступ доски 6 + отступ контролов 8
   + контролы 139 + padding-bottom 82 = 351, плюс 12 на зазор до нижнего меню
   (иначе кнопки упираются в него). Меняешь контролы — правишь здесь. */
.rakes-app #view-mines{ --mn-chrome:364px; }
.rakes-app #view-mines .mines-board-wrap{
  flex:0 0 auto;
  width:100%;
  margin:0;
}
.rakes-app #view-mines .mines-board,
.rakes-app #view-mines.mn-pregame .mines-board{
  width:min(100%, calc(var(--appvh,100vh) - var(--mn-chrome))) !important;
  min-width:180px !important;
  height:auto !important;
  margin:0 auto !important;
}

/* ===== profile v2: compact hierarchy, details in sheets 20260714 ===== */
.rakes-app #view-profile.profile-view{
  padding-top:max(0px,env(safe-area-inset-top));
  padding-bottom:calc(78px + env(safe-area-inset-bottom));
}
.rakes-app #view-profile .profile-top-simple{
  display:flex;
  align-items:center;
  justify-content:center;
}
.rakes-app #view-profile .profile-top-simple strong{ width:100%; text-align:center; }
.rakes-app #view-profile .profile-hero{
  margin:8px 0;
  padding:9px 11px;
  grid-template-columns:50px minmax(0,1fr) auto;
  gap:11px;
  border-radius:17px;
  background:#0b100e;
}
.rakes-app #view-profile .profile-avatar{ width:50px; height:50px; border-radius:15px; }
.rakes-app #view-profile .profile-main span{ font-size:17px; }
.rakes-app #view-profile .profile-main strong{ font-size:12px; }
.rakes-app #view-profile .profile-main small{ font-size:10px; }

.rakes-app #view-profile .profile-wallet-card{
  margin:8px 0;
  padding:13px;
  gap:7px;
  border-color:rgba(143,232,79,.18);
  background:linear-gradient(160deg,#101914,#090e0b);
}
.rakes-app #view-profile .profile-balance-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.rakes-app #view-profile .profile-balance-meta > span{
  color:rgba(244,247,243,.56);
  font-size:10px;
  font-weight:800;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.rakes-app #view-profile .profile-balance-meta small{
  color:rgba(244,247,243,.46);
  font-size:10px;
  font-weight:650;
  white-space:nowrap;
}
.rakes-app #view-profile .profile-wallet-card > strong{ font-size:27px; }
.rakes-app #view-profile .profile-wallet-actions-inline{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin:3px 0 0;
}
.rakes-app #view-profile .profile-wallet-actions-inline button{
  min-height:40px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:9px 12px;
  text-align:center;
  border-radius:13px;
  background:#0b110e;
}
.rakes-app #view-profile .profile-wallet-actions-inline button svg{
  grid-row:auto;
  width:17px;
  height:17px;
  margin:0;
}
.rakes-app #view-profile .profile-wallet-actions-inline button span{
  align-self:auto;
  font-size:13px;
  line-height:1;
}

.rakes-app #view-profile .profile-stats-primary{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
  margin:8px 0;
}
.rakes-app #view-profile .profile-stats-primary div{
  min-height:54px;
  padding:8px;
  border-radius:14px;
  text-align:center;
}
.rakes-app #view-profile .profile-stats-primary strong{ font-size:15px !important; }

.rakes-app #view-profile .profile-menu{
  overflow:hidden;
  margin:8px 0 0;
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  background:#0a0e0c;
}
.rakes-app #view-profile .profile-menu-row{
  width:100%;
  min-height:56px;
  display:grid;
  grid-template-columns:22px minmax(0,1fr) 18px;
  align-items:center;
  gap:11px;
  padding:10px 13px;
  text-align:left;
  border:0;
  border-bottom:1px solid rgba(255,255,255,.065);
  border-radius:0;
  background:transparent;
  color:var(--r-text);
}
.rakes-app #view-profile .profile-menu-row:last-child{ border-bottom:0; }
.rakes-app #view-profile .profile-menu-row > svg:first-child{ width:20px; height:20px; color:#8D929B; }
.rakes-app #view-profile .profile-menu-row > svg:last-child{ width:17px; height:17px; color:#555d59; }
.rakes-app #view-profile .profile-menu-row > span{ min-width:0; display:grid; gap:2px; }
.rakes-app #view-profile .profile-menu-row b{
  overflow:hidden;
  color:#F4F4F5;
  font-size:13.5px;
  font-weight:750;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.rakes-app #view-profile .profile-menu-row small{
  overflow:hidden;
  color:#727a76;
  font-size:9.5px;
  font-weight:600;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.rakes-app #view-profile .profile-menu-row:active{ background:rgba(255,255,255,.035); }

.rakes-app .profile-stats-sheet,
.rakes-app .promo-sheet-card{ display:grid; gap:11px; }
.rakes-app .profile-details-grid{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.rakes-app .profile-details-grid > div{
  min-height:70px;
  display:grid;
  align-content:center;
  gap:5px;
  padding:11px 12px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  background:#0c110f;
}
.rakes-app .profile-details-grid span{
  color:#747c78;
  font-size:9px;
  font-weight:750;
  letter-spacing:.07em;
  text-transform:uppercase;
}
.rakes-app .profile-details-grid strong{
  overflow:hidden;
  color:#F4F4F5;
  font-size:16px;
  font-weight:800;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.rakes-app .promo-sheet-desc{ margin:0; color:#747c78; font-size:11px; font-weight:600; line-height:1.4; }
.rakes-app .profile-promo-form{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; }
.rakes-app .profile-promo-form input,
.rakes-app .profile-promo-form button{
  height:44px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:13px;
  font-weight:750;
}
.rakes-app .profile-promo-form input{
  min-width:0;
  padding:0 12px;
  outline:0;
  background:#090d0b;
  color:#F4F4F5;
  text-transform:uppercase;
}
.rakes-app .profile-promo-form button{ padding:0 14px; background:#F4F4F5; color:#050706; font-size:11px; }
.rakes-app .profile-promo-form button:disabled{ opacity:.5; }
.rakes-app .promo-sheet-card #promo-status{ min-height:14px; margin:0; }

/* ===== кастомные уведомления (замена нативных tg.showAlert) — верх-центр, ниже баланса ===== */
#notify-host{
  position:fixed;
  top:calc(max(14px, env(safe-area-inset-top)) + 52px);
  left:50%; transform:translateX(-50%);
  z-index:4000; display:flex; flex-direction:column; align-items:center; gap:8px;
  width:max-content; max-width:min(92vw, 440px); pointer-events:none;
}
.notify{
  position:relative; pointer-events:auto; cursor:pointer;
  display:flex; align-items:center; gap:11px;
  padding:11px 16px 11px 12px; border-radius:15px;
  font-size:13.5px; font-weight:700; letter-spacing:.01em; line-height:1.3;
  color:#F4F4F5; max-width:100%;
  background:linear-gradient(180deg, rgba(26,31,38,.97), rgba(15,19,25,.98));
  border:1px solid rgba(255,255,255,.09);
  box-shadow:0 14px 38px rgba(0,0,0,.52), 0 2px 8px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.06);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  opacity:0; transform:translateY(-14px) scale(.94);
  transition:opacity .34s cubic-bezier(.22,1,.36,1), transform .34s cubic-bezier(.22,1,.36,1);
}
.notify.in{ opacity:1; transform:translateY(0) scale(1); }
.notify.out{ opacity:0; transform:translateY(-12px) scale(.96); }
.notify-ic{
  flex:0 0 auto; width:28px; height:28px; border-radius:9px;
  display:flex; align-items:center; justify-content:center;
}
.notify-ic svg{ width:16px; height:16px; }
.notify-msg{ min-width:0; }
/* левый акцент-бордюр по типу */
.notify::before{ content:""; position:absolute; left:0; top:9px; bottom:9px; width:3px; border-radius:0 3px 3px 0; }
/* success */
.notify-success{ border-color:rgba(143,232,79,.42); }
.notify-success::before{ background:#8FE84F; box-shadow:0 0 12px rgba(143,232,79,.6); }
.notify-success .notify-ic{ background:rgba(143,232,79,.16); color:#8FE84F; }
/* error */
.notify-error{ border-color:rgba(255,90,70,.44); }
.notify-error::before{ background:#FF6A54; box-shadow:0 0 12px rgba(255,90,70,.6); }
.notify-error .notify-ic{ background:rgba(255,90,70,.16); color:#FF6A54; }
/* warn */
.notify-warn{ border-color:rgba(255,200,80,.44); }
.notify-warn::before{ background:#FFCB50; box-shadow:0 0 12px rgba(255,200,80,.55); }
.notify-warn .notify-ic{ background:rgba(255,200,80,.16); color:#FFCB50; }
/* info */
.notify-info{ border-color:rgba(120,180,255,.4); }
.notify-info::before{ background:#7FB2FF; box-shadow:0 0 12px rgba(120,180,255,.55); }
.notify-info .notify-ic{ background:rgba(120,180,255,.15); color:#7FB2FF; }
@media (prefers-reduced-motion: reduce){
  .notify{ transition:opacity .2s ease; transform:none !important; }
}

/* ===== профиль: компактнее по вертикали — промокод виден без скролла на всех девайсах 20260712 ===== */
/* сверху было много пустого места — контент сдвинут на ~12px вверх, чтобы реферальный блок попадал в обзор */
.rakes-app .profile-view{ padding-top: max(0px, env(safe-area-inset-top)); padding-bottom: calc(76px + env(safe-area-inset-bottom)); }
.rakes-app .profile-hero{ min-height:0; margin:10px 0 8px; padding:10px 12px; grid-template-columns:56px minmax(0,1fr) auto; gap:12px; }
.rakes-app .profile-avatar{ width:56px; height:56px; border-radius:17px; }
.rakes-app .profile-main{ gap:2px; }
.rakes-app .profile-main span{ font-size:18px; }
.rakes-app .profile-balance-card{ margin:8px 0; padding:10px 14px; gap:3px; }
.rakes-app .profile-balance-card strong{ font-size:26px; }
.rakes-app .profile-balance-card .token-logo{ width:20px; height:20px; }
.rakes-app .profile-wallet-actions{ margin:0 0 8px; }
.rakes-app .profile-wallet-actions button{ padding:9px 12px; }
.rakes-app .profile-stats{ margin:8px 0; gap:7px; }
.rakes-app .profile-stats div{ min-height:46px; padding:7px 9px; gap:3px; }
.rakes-app .profile-stats strong,
.rakes-app .profile-stats strong span,
.rakes-app #profile-wagered,
.rakes-app #profile-best-win{ font-size:14px !important; }
.rakes-app .promo-card{ margin:8px 0 0 !important; padding:12px 14px !important; gap:8px !important; }
.rakes-app .promo-card form,
.rakes-app .promo-card input,
.rakes-app .promo-card button{ height:44px !important; }

/* ===== реферальная система: CTA в профиле + шит со ссылкой 20260712 ===== */
/* реферальный блок — спокойные нейтральные панели, как везде на сайте (без кислотного зелёного) */
.rakes-app .referral-cta{ display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:11px;
  width:100%; margin:8px 0 0; padding:11px 13px; text-align:left;
  border:1px solid var(--r-line); border-radius:16px;
  background:var(--r-panel); color:var(--r-text); }
.rakes-app .referral-cta > svg{ width:20px; height:20px; color:var(--r-muted); flex:none; }
.rakes-app .referral-cta .ref-cta-text{ display:grid; gap:2px; min-width:0; }
.rakes-app .referral-cta .ref-cta-text span{ font-size:14px; font-weight:700; letter-spacing:-.01em; }
.rakes-app .referral-cta .ref-cta-text small{ font-size:10.5px; color:var(--r-muted); font-weight:600; }
.rakes-app .referral-cta:active{ transform:translateY(1px); }
.rakes-app .referral-sheet-card{ display:grid; gap:10px; }
.rakes-app .ref-desc{ margin:0; font-size:12px; line-height:1.45; color:var(--r-muted); font-weight:600; }
.rakes-app .ref-rule{ display:grid; grid-template-columns:auto 1fr; align-items:center; gap:12px;
  padding:12px 14px; border:1px solid var(--r-line); border-radius:14px; background:var(--r-panel-2); }
.rakes-app .ref-rule-pct{ font-size:20px; font-weight:800; color:var(--r-accent); letter-spacing:-.02em; line-height:1; }
.rakes-app .ref-rule-text{ font-size:11.5px; line-height:1.4; color:var(--r-muted); font-weight:600; }
.rakes-app .ref-rule-text b{ color:var(--r-text); font-weight:700; }
.rakes-app .ref-link-row{ display:grid; grid-template-columns:1fr 48px; gap:8px; }
.rakes-app .ref-link-row input{ height:44px; min-width:0; padding:0 12px; border:1px solid var(--r-line);
  border-radius:14px; background:var(--r-bg); color:var(--r-text); font-weight:600; font-size:12px; outline:0; }
/* padding:0 обязателен: кнопка 48px с border-box наследовала padding:14px 18px, контентная
   область схлопывалась до 10px, а иконка 18px в неё не влезала и вылезала вправо —
   place-items:center не центрирует то, что шире контейнера. */
.rakes-app .ref-link-row button{ height:44px; padding:0; display:grid; place-items:center; border:1px solid var(--r-line);
  border-radius:14px; background:var(--r-panel-2); color:var(--r-text); }
.rakes-app .ref-link-row button svg{ width:18px; height:18px; }
.rakes-app .ref-stats{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.rakes-app .ref-stats div{ display:grid; gap:3px; padding:10px 12px; border:1px solid var(--r-line);
  border-radius:14px; background:var(--r-panel); }
.rakes-app .ref-stats span{ font-size:9px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--r-muted); }
.rakes-app .ref-stats strong{ font-size:15px; font-weight:800; color:var(--r-text); }
.rakes-app .ref-note{ margin:0; font-size:10.5px; color:rgba(244,246,243,.4); font-weight:600; text-align:center; line-height:1.4; }

/* ===== депозит из шапки: плюс у баланса + выбор провайдера + сумма 20260712 ===== */
.rakes-app .top-cluster{ gap:10px; }
/* плюс на месте бывшей иконки кошелька: квадратный, чуть ниже по высоте, чёрно-зелёный */
.rakes-app .deposit-plus{ width:24px; height:20px; flex:none; display:inline-grid; place-items:center;
  margin-left:0; position:relative; cursor:pointer; color:#8FE84F;
  border:1px solid rgba(143,232,79,.5); border-radius:7px;
  background:linear-gradient(180deg, #101b10, #060b07);
  box-shadow:inset 0 1px 0 rgba(143,232,79,.16), 0 1px 6px rgba(0,0,0,.35); }
.rakes-app .deposit-plus svg{ width:12px; height:12px; }
.rakes-app .deposit-plus:hover{ border-color:rgba(143,232,79,.85); color:#A9F56E; }
.rakes-app .deposit-plus:active{ transform:translateY(1px) scale(.94); }
/* невидимые расширенные зоны нажатия — легко попадать с телефона и ПК */
.rakes-app .deposit-plus::after{ content:""; position:absolute; inset:-9px; border-radius:12px; }
.rakes-app .avatar-chip{ position:relative; }
.rakes-app .avatar-chip::after{ content:""; position:absolute; inset:-7px; }
.rakes-app .deposit-sheet-card{ display:grid; gap:10px; }
.rakes-app .dep-desc{ margin:0; font-size:12px; color:rgba(244,247,243,.62); font-weight:700; }
.rakes-app .dep-desc b{ color:var(--r-text); font-weight:900; }
.rakes-app .dep-provider{ display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:12px;
  width:100%; padding:13px 14px; text-align:left; border:1px solid rgba(255,255,255,.09); border-radius:16px;
  background:linear-gradient(165deg,#12171d,#0c1014); color:var(--r-text); }
.rakes-app .dep-provider:active{ transform:translateY(1px) scale(.99); }
.rakes-app .dep-provider-disabled{ opacity:.5; cursor:not-allowed; filter:saturate(.55); }
.rakes-app .dep-provider-disabled:active{ transform:none; }
.rakes-app .dep-prov-ic{ width:42px; height:42px; display:block; overflow:hidden; flex:none;
  border-radius:999px; background:#101613; box-shadow:0 0 0 1px rgba(255,255,255,.1); }
.rakes-app .dep-prov-ic img{ display:block; width:100%; height:100%; object-fit:cover; border-radius:999px; }
.rakes-app .dep-prov-text{ display:grid; gap:2px; min-width:0; }
.rakes-app .dep-prov-text span{ font-size:15px; font-weight:900; letter-spacing:-.02em; }
.rakes-app .dep-prov-text small{ font-size:10.5px; color:rgba(244,247,243,.5); font-weight:700; }
.rakes-app .dep-provider svg{ width:17px; height:17px; color:rgba(244,247,243,.4); }
.rakes-app #deposit-form{ display:grid; gap:10px; }
.rakes-app .dep-chips{ display:grid; grid-template-columns:repeat(5,1fr); gap:7px; }
.rakes-app .dep-chips button{ height:34px; padding:0; display:flex; align-items:center; justify-content:center;
  text-align:center; line-height:1; border:1px solid rgba(255,255,255,.1); border-radius:11px;
  background:#101613; color:var(--r-text); font-size:12px; font-weight:900; }
.rakes-app .dep-chips button:active{ transform:translateY(1px); }
.rakes-app .dep-status{ min-height:15px; margin:0; font-size:11px; font-weight:700; color:rgba(244,247,243,.58); }
.rakes-app .dep-status:empty{ display:none; }

/* ===== inline-значок USDT вместо текста: размер = высоте текста (1em) 20260712 ===== */
.rakes-app .usdt-inline{ width:1em; height:1em; display:inline-block; vertical-align:-0.15em; margin-left:.12em; border-radius:50%; }

/* ===== профиль/кошелёк: «живые» кнопки Депозит и Вывод — приподнимаются при наведении 20260712 ===== */
.rakes-app .profile-wallet-actions button,
.rakes-app .wallet-actions button{
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, filter .18s ease;
  will-change:transform; }
@media (hover:hover){
  .rakes-app .profile-wallet-actions button:hover,
  .rakes-app .wallet-actions button:hover{
    transform:translateY(-3px);
    filter:brightness(1.08);
    box-shadow:0 9px 20px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.07); }
  .rakes-app .profile-wallet-actions .pw-deposit:hover,
  .rakes-app .wallet-actions .pw-deposit:hover{
    border-color:rgba(143,232,79,.8);
    box-shadow:0 9px 22px rgba(143,232,79,.2), inset 0 1px 0 rgba(255,255,255,.07); }
  .rakes-app .profile-wallet-actions .pw-withdraw:hover,
  .rakes-app .wallet-actions .pw-withdraw:hover{
    border-color:rgba(255,216,77,.6);
    box-shadow:0 9px 22px rgba(255,216,77,.15), inset 0 1px 0 rgba(255,255,255,.07); }
}
/* на тачах hover нет — оставляем отклик нажатия, чуть живее прежнего */
.rakes-app .profile-wallet-actions button:active,
.rakes-app .wallet-actions button:active{ transform:translateY(1px) scale(.98); filter:brightness(1.05); }

/* ===== дуэли: убрана подсказка (список поднят на её место), кнопки ½/x2/MAX на всю ширину 20260713 ===== */
.rakes-app #sheet-duel-create [data-bet-mods="duel"]{ grid-template-columns:repeat(3,1fr) !important; gap:7px; margin-top:8px; }
.rakes-app #sheet-duel-create [data-bet-mods="duel"] button{ min-height:40px; padding:11px 0 !important; font-size:14px !important;
  font-weight:800; border-radius:12px; }

/* ===== профиль: блоки идут сверху вниз + история (кнопка в hero) 20260714 ===== */
.rakes-app #view-profile.profile-view{
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  gap:10px;
}
/* поля собственные у блоков гасим — всё расстояние задаёт gap */
.rakes-app #view-profile.profile-view > *{ margin:0; flex:none; }

.rakes-app #view-profile .profile-hero-history{
  align-self:center;
  width:32px;
  height:32px;
  padding:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:0;
  border:1px solid rgba(143,232,79,.22);
  border-radius:10px;
  background:rgba(143,232,79,.10);
  color:#8FE84F;
}
/* flex:none + display:block — иначе svg тянется флексом и уезжает с центра */
.rakes-app #view-profile .profile-hero-history svg{
  width:16px;
  height:16px;
  display:block;
  flex:none;
}
.rakes-app #view-profile .profile-hero-history:active{ background:rgba(143,232,79,.18); }
.rakes-app #view-profile .profile-hero-sound{
  position:relative; color:#747d78; border-color:rgba(255,255,255,.10); background:rgba(255,255,255,.04);
  transition:color .2s ease,background .2s ease,border-color .2s ease,transform .16s ease;
}
.rakes-app #view-profile .profile-hero-sound.is-on{ color:#8FE84F; border-color:rgba(143,232,79,.28); background:rgba(143,232,79,.11); }
.rakes-app #view-profile .profile-hero-sound:active{ transform:scale(.92); }
.rakes-app #view-profile .profile-hero-sound .sound-on-icon{ display:none; }
.rakes-app #view-profile .profile-hero-sound .sound-off-icon{ display:block; }
.rakes-app #view-profile .profile-hero-sound.is-on .sound-on-icon{ display:block; }
.rakes-app #view-profile .profile-hero-sound.is-on .sound-off-icon{ display:none; }

.rakes-app .history-sheet-card .history-tabs{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:4px;
  margin-bottom:10px;
  padding:4px;
  border-radius:13px;
  background:rgba(255,255,255,.04);
}
.rakes-app .history-tab{
  min-height:36px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:rgba(244,247,243,.6);
  font-size:12px;
  font-weight:800;
}
.rakes-app .history-tab.is-active{ background:rgba(143,232,79,.14); color:#8FE84F; }
.rakes-app .history-sheet-card .wallet-history-list,
.rakes-app .history-sheet-card .profile-games-list{ max-height:52vh; overflow-y:auto; }

/* ===== мины: окно выигрыша по центру доски 20260714 ===== */
/* обёртка — якорь для окна выигрыша и флекс-элемент .mnx. Размер задаётся ниже
   (блок «доска занимает всё оставшееся место»): здесь только позиционирование. */
.rakes-app .mines-board-wrap{
  position:relative;
}
.rakes-app .mines-board{ width:100%; min-width:0; margin:0; }

.rakes-app .mines-win-pop{
  position:absolute;
  left:50%;
  top:50%;
  z-index:20;
  width:min(62%,200px);
  display:grid;
  align-content:center;
  justify-items:center;
  gap:5px;
  padding:12px 16px;
  transform:translate(-50%,-50%);
  border:1px solid rgba(143,232,79,.30);
  border-radius:22px;
  background:linear-gradient(170deg,#122014,#080e0a);
  box-shadow:0 18px 44px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.06);
  /* клики уходят на доску под окном */
  pointer-events:none;
  animation:minesWinPop .3s cubic-bezier(.2,1.25,.4,1) both;
}
.rakes-app .mines-win-pop[hidden]{ display:none; }
.rakes-app .mines-win-x{
  font-size:30px;
  font-weight:900;
  letter-spacing:-.03em;
  line-height:1;
  color:#8FE84F;
  text-shadow:0 0 18px rgba(143,232,79,.35);
}
.rakes-app .mines-win-profit{
  display:inline-flex;
  align-items:center;
  gap:5px;
  font-size:16px;
  font-weight:800;
  line-height:1;
  color:#F4F7F3;
}
.rakes-app .mines-win-profit .token-logo{ width:15px; height:15px; }
@keyframes minesWinPop{
  from{ opacity:0; transform:translate(-50%,-50%) scale(.82); }
  to{ opacity:1; transform:translate(-50%,-50%) scale(1); }
}
@media (prefers-reduced-motion: reduce){
  .rakes-app .mines-win-pop{ animation:none; }
}

/* ===== профиль: иерархия по размеру и контрасту вместо веса 900 + инлайн-промокод 20260714 ===== */
/* три уровня контраста: #F4F7F3 → .60 → .40; вес держим в 500–700, 900 убираем везде */

/* заголовок страницы не должен спорить с балансом */
.rakes-app #view-profile .profile-top-simple strong{
  font-size:15px !important;
  font-weight:640 !important;
  letter-spacing:-.01em !important;
  color:rgba(244,247,243,.72) !important;
}

/* герой: имя первично, ник вторичен, ID третичен */
.rakes-app #view-profile .profile-main span{
  font-size:17px !important;
  font-weight:640 !important;
  letter-spacing:-.02em !important;
  color:#F4F7F3 !important;
}
.rakes-app #view-profile .profile-main strong{
  font-size:13px !important;
  font-weight:520 !important;
  letter-spacing:0 !important;
  color:rgba(244,247,243,.60) !important;
}
.rakes-app #view-profile .profile-main small{
  font-size:11px !important;
  font-weight:500 !important;
  color:rgba(244,247,243,.40) !important;
}

/* баланс — единственный главный элемент страницы */
.rakes-app #view-profile .profile-wallet-card > strong{
  font-size:32px !important;
  font-weight:700 !important;
  letter-spacing:-.035em !important;
}
.rakes-app #view-profile .profile-balance-meta > span{
  font-weight:600 !important;
  letter-spacing:.09em !important;
  color:rgba(244,247,243,.44) !important;
}
.rakes-app #view-profile .profile-balance-meta small{
  font-weight:520 !important;
  color:rgba(244,247,243,.44) !important;
}
.rakes-app #view-profile .profile-wallet-actions-inline button span{
  font-weight:600 !important;
  letter-spacing:-.01em !important;
}

/* плитки статистики вторичны — не должны читаться как заголовки */
.rakes-app #view-profile .profile-stats-primary strong{
  font-size:16px !important;
  font-weight:640 !important;
  letter-spacing:-.02em !important;
}
.rakes-app #view-profile .profile-stats-primary span{
  font-weight:560 !important;
  color:rgba(244,247,243,.42) !important;
}

/* меню */
.rakes-app #view-profile .profile-menu-row b{
  font-size:14px !important;
  font-weight:600 !important;
  letter-spacing:-.01em !important;
}
.rakes-app #view-profile .profile-menu-row small{
  font-size:12px !important;
  font-weight:450 !important;
  color:rgba(244,247,243,.42) !important;
}

/* промокод: поле и кнопка прямо на странице, шторки больше нет */
.rakes-app #view-profile .profile-promo{ display:grid; gap:6px; }
.rakes-app #view-profile .profile-promo #promo-status{
  min-height:13px;
  margin:0;
  font-size:11px;
  font-weight:520;
  line-height:1.3;
  color:rgba(244,247,243,.50);
}
.rakes-app #view-profile .profile-promo-form input::placeholder{
  color:rgba(244,247,243,.32);
  font-weight:520;
  text-transform:none;
}
.rakes-app #view-profile .profile-promo-form button{
  font-size:12px !important;
  font-weight:640 !important;
}

/* ===== профиль: блик по карточке баланса раз в 2с 20260714 ===== */
.rakes-app #view-profile .profile-wallet-card{ position:relative; overflow:hidden; }
.rakes-app #view-profile .profile-wallet-card::after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:0;
  width:38%;
  pointer-events:none;
  background:linear-gradient(100deg,
    transparent,
    rgba(255,255,255,.07) 42%,
    rgba(255,255,255,.13) 50%,
    rgba(255,255,255,.07) 58%,
    transparent);
  transform:translateX(-170%) skewX(-18deg);
  /* цикл 5с: проход занимает первые 16% (те же 0.8с), дальше блик ждёт за краем */
  animation:profileShine 5s ease-in-out infinite;
}
@keyframes profileShine{
  0%   { transform:translateX(-170%) skewX(-18deg); }
  16%  { transform:translateX(350%)  skewX(-18deg); }
  100% { transform:translateX(350%)  skewX(-18deg); }
}
@media (prefers-reduced-motion: reduce){
  .rakes-app #view-profile .profile-wallet-card::after{ animation:none; opacity:0; }
}

/* ===== реферальная шторка: та же иерархия, что и в профиле 20260714 ===== */
/* специфичность с #sheet-referral перебивает базовые правила без !important */

/* заголовок был 900/-0.05em — сажаем в тот же диапазон, что и профиль */
.rakes-app #sheet-referral .sheet-head h2{
  font-weight:640;
  letter-spacing:-.02em;
}
.rakes-app #sheet-referral .ref-desc{
  font-size:12px;
  font-weight:500;
  line-height:1.45;
  color:rgba(244,247,243,.52);
}

/* «8%» — главный элемент шторки, ради него её и открывают */
.rakes-app #sheet-referral .ref-rule-pct{
  font-size:26px;
  font-weight:700;
  letter-spacing:-.03em;
}
.rakes-app #sheet-referral .ref-rule-text{
  font-size:12px;
  font-weight:500;
  line-height:1.4;
  color:rgba(244,247,243,.52);
}
.rakes-app #sheet-referral .ref-rule-text b{
  font-weight:640;
  color:#F4F7F3;
}

.rakes-app #sheet-referral .ref-link-row input{
  font-weight:520;
  color:rgba(244,247,243,.72);
}
.rakes-app #sheet-referral .sheet-action{
  font-weight:640;
  letter-spacing:-.01em;
}

.rakes-app #sheet-referral .ref-stats span{
  font-weight:560;
  color:rgba(244,247,243,.42);
}
.rakes-app #sheet-referral .ref-stats strong{
  font-size:17px;
  font-weight:640;
  letter-spacing:-.02em;
}
.rakes-app #sheet-referral .ref-note{
  font-size:11px;
  font-weight:450;
  line-height:1.45;
  color:rgba(244,247,243,.34);
}

/* блик по блоку с процентом — тот же приём и тот же цикл, что у карточки баланса */
.rakes-app #sheet-referral .ref-rule{ position:relative; overflow:hidden; }
.rakes-app #sheet-referral .ref-rule::after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:0;
  width:38%;
  pointer-events:none;
  background:linear-gradient(100deg,
    transparent,
    rgba(255,255,255,.06) 42%,
    rgba(255,255,255,.11) 50%,
    rgba(255,255,255,.06) 58%,
    transparent);
  transform:translateX(-170%) skewX(-18deg);
  animation:profileShine 5s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce){
  .rakes-app #sheet-referral .ref-rule::after{ animation:none; opacity:0; }
}

/* ===== десктоп (мышь): док ставки на 3px выше =====
   Без .has-bets: иначе док дёргается на 3px в момент первой ставки. */
@media (pointer: fine){
  .rakes-app #view-game .bet-dock{ margin-top:-3px !important; }
}

/* ===== десктоп: экран не перестраивается под ставки =====
   #view-game задан height:var(--appvh) + overflow:hidden — всё обязано влезть в экран,
   поэтому появление ставок ужимало колесо. Возвращаем скролл (тот же приём, что html.vp-noFit
   для низких окон) и оставляем колесу ровно тот размер, что и без ставок: верх экрана
   не шевелится, лента ставок уезжает вниз — к ней прокручиваем. */
@media (pointer: fine){
  .rakes-app #view-game{
    height:auto !important;
    min-height:var(--appvh, 100vh) !important;
    overflow:visible !important;
  }
  /* margin-top у арены где-то выставлен в auto — он съедал свободное место и толкал
     колесо с доком вниз, под нижнее меню. Фиксируем отступ: контент прижат к верху,
     воздух остаётся снизу, док всегда в зоне досягаемости без скролла.
     Верхний отступ 10px (был 23): колесо ближе к золотому мешочку пула. */
  .rakes-app #view-game .wheel-arena{ margin:10px auto 21px !important; }
  /* Один и тот же размер до и после ставок. Резерв 340px, а не 272: под колесом ещё
     док (100px) и фиксированное меню (80px) — с 272px на низких окнах док уезжал под меню.
     На обычных окнах (730+) режет кап 390px; на низких по-прежнему рулит резерв. */
  .rakes-app #view-game .wheel-arena,
  .rakes-app #view-game.has-bets .wheel-arena{
    width:min(84vw, 390px, calc(var(--appvh, 100vh) - 340px)) !important;
    margin:10px auto 21px !important;
  }
  .rakes-app #view-game.has-bets .bets-feed{
    flex:0 0 auto !important; max-height:none !important; overflow:visible !important;
  }
}


/* ===== реферальный процент: «защёлкивание» в конце счётчика =====
   Короткий доворот с отдачей: цифра будто встаёт в паз. Отдельная анимация, а не .num-shake —
   тому нужна только дрожь по горизонтали, а здесь важен ещё и масштаб. */
@keyframes refPctLock{
  0%   { transform:scale(1.16) translateX(0); }
  35%  { transform:scale(0.95) translateX(-1.6px); }
  55%  { transform:scale(1.03) translateX(1.3px); }
  75%  { transform:scale(0.99) translateX(-0.7px); }
  100% { transform:scale(1) translateX(0); }
}
.rakes-app .ref-rule-pct.is-locked{ display:inline-block; animation:refPctLock .4s cubic-bezier(.2,1.1,.3,1); will-change:transform; }
@media (prefers-reduced-motion: reduce){ .rakes-app .ref-rule-pct.is-locked{ animation:none; } }

/* ===== realtime balance flash 20260716 (баланс в шапке докручивается и подсвечивается) ===== */
.rakes-app .bal-up { animation: bal-up-flash 0.45s ease; }
@keyframes bal-up-flash {
  0% { transform: scale(1); }
  25% { transform: scale(1.07); box-shadow: 0 0 0 1px rgba(82, 232, 124, 0.55), 0 0 18px rgba(82, 232, 124, 0.35); color: #52e87c; }
  100% { transform: scale(1); }
}

/* ===== crash live-bets: кешауты в том же фиде + авто-исчезание строк через 3с 20260716 ===== */
.lb-row.lb-out{ opacity:0; transform:translateX(-14px); transition:opacity .35s ease, transform .35s ease; }

/* ===== support row 20260716 (чуть компактнее реф-строки, тот же стиль) ===== */
.rakes-app #view-profile .profile-menu-row-sm{ min-height:48px; padding:8px 13px; }
.rakes-app #view-profile .profile-menu-row-sm > svg:first-child{ width:18px; height:18px; }
.rakes-app #view-profile .profile-menu-row-sm b{ font-size:12.5px; }
.rakes-app #view-profile .profile-menu-row-sm small{ font-size:9px; }

/* ===== jackpot stepper: ½ / x2 вместо −/+ 20260716 ===== */
.rakes-app .bet-dock button.bet-step-btn { font-size: 13px !important; font-weight: 800 !important; }

/* ===== withdraw provider selector 20260717 (две опции: CryptoBot / xRocket) ===== */
.rakes-app .wd-provider-title{ margin:2px 0 0; color:rgba(245,247,246,.62); font-size:12px; font-weight:700; }
.rakes-app .wd-provider-row{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.rakes-app .wd-provider-row:has(.wd-provider:only-child){ grid-template-columns:1fr; }
.rakes-app .wd-provider{
  position:relative; display:flex; align-items:center; gap:10px;
  padding:12px; border-radius:12px; text-align:left; cursor:pointer;
  background:#111713; border:1.5px solid rgba(255,255,255,.08);
  transition:border-color .15s ease, background .15s ease;
}
.rakes-app .wd-provider .dep-prov-ic{ flex:0 0 auto; width:34px; height:34px; border-radius:9px; overflow:hidden; }
.rakes-app .wd-provider .dep-prov-ic img{ width:100%; height:100%; object-fit:cover; display:block; }
.rakes-app .wd-prov-name{ min-width:0; overflow:hidden; color:#f5f7f6; font-size:14px; font-weight:750; text-overflow:ellipsis; white-space:nowrap; }
.rakes-app .wd-prov-check{ position:absolute; top:8px; right:8px; width:16px; height:16px; color:#52e87c; opacity:0; transition:opacity .15s ease; }
.rakes-app .wd-provider.is-active{ border-color:#52e87c; background:rgba(82,232,124,.08); }
.rakes-app .wd-provider.is-active .wd-prov-check{ opacity:1; }
.rakes-app .wd-provider:active{ transform:scale(.98); }
@media (pointer:fine){
  .rakes-app .wd-provider:hover{ border-color:rgba(82,232,124,.5); }
}

/* ===== referral balance card + claim 20260717 ===== */
.rakes-app .ref-balance-card {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 12px 14px; border-radius: 12px;
  background: linear-gradient(135deg, rgba(82,232,124,0.10), rgba(82,232,124,0.02));
  border: 1px solid rgba(82,232,124,0.28);
}
.rakes-app .ref-balance-info { display: grid; gap: 2px; min-width: 0; }
.rakes-app .ref-balance-info > span { color: rgba(245,247,246,0.66); font-size: 11.5px; font-weight: 700; }
.rakes-app .ref-balance-info strong { display: inline-flex; align-items: center; gap: 4px; color: #f5f7f6; font-size: 18px; font-weight: 800; }
.rakes-app .ref-claim-btn {
  flex: 0 0 auto; padding: 10px 16px; border: 0; border-radius: 10px;
  background: #52e87c; color: #06200e; font-size: 13px; font-weight: 800; cursor: pointer;
  transition: transform .06s ease, opacity .15s ease;
}
.rakes-app .ref-claim-btn:active { transform: scale(.97); }
.rakes-app .ref-claim-btn:disabled { background: #243029; color: rgba(245,247,246,0.36); cursor: default; }

/* ===== profile wager chip (шапка профиля: вагер + круглый сброс) 20260717 ===== */
.rakes-app #view-profile .profile-hero-actions{ display:flex; align-items:center; gap:10px; }
/* вагер — цельный чип-пилюля: «Вагер: X» + кнопка сброса внутри одной капсулы,
   стоит в ряду действий и ни над чем не плавает */
.rakes-app #view-profile .profile-wager-chip{
  display:inline-flex; align-items:center; gap:8px; height:32px; padding:0 4px 0 11px;
  border:1px solid rgba(255,176,32,.32); border-radius:16px;
  background:linear-gradient(180deg, rgba(255,176,32,.16), rgba(255,176,32,.07));
}
.rakes-app #view-profile .profile-wager-chip.hidden{ display:none; }
.rakes-app #view-profile .profile-wager-chip small{
  color:rgba(245,247,246,.78); font-size:10.5px; font-weight:750; white-space:nowrap; line-height:1;
}
.rakes-app #view-profile .profile-wager-chip small b{ color:#ffb020; font-weight:800; font-size:11.5px; }
.rakes-app #view-profile .profile-wager-reset{
  width:24px; height:24px; padding:0; display:inline-flex; align-items:center; justify-content:center;
  line-height:0; border:0; border-radius:50%; background:rgba(255,176,32,.22); color:#ffb020;
}
.rakes-app #view-profile .profile-wager-reset svg{ width:13px; height:13px; display:block; flex:none; }
.rakes-app #view-profile .profile-wager-reset:active{ background:rgba(255,176,32,.34); transform:scale(.92); }

/* ===== deposit credited toast (нижний ненавязчивый тост зачисления) 20260717 ===== */
#deposit-toast-host{
  position:fixed; left:50%; transform:translateX(-50%);
  bottom:calc(max(16px, env(safe-area-inset-bottom)) + 78px);
  z-index:4200; pointer-events:none; display:flex; flex-direction:column; align-items:center;
}
.deposit-toast{
  display:flex; align-items:center; gap:9px; padding:11px 16px; border-radius:14px;
  color:#F4F4F5; font-size:13.5px; font-weight:750; letter-spacing:.01em; white-space:nowrap;
  background:linear-gradient(180deg, rgba(24,38,28,.97), rgba(12,20,15,.98));
  border:1px solid rgba(82,232,124,.3);
  box-shadow:0 14px 38px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.05);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  opacity:0; transform:translateY(16px) scale(.95);
  transition:opacity .34s cubic-bezier(.22,1,.36,1), transform .34s cubic-bezier(.22,1,.36,1);
}
.deposit-toast.in{ opacity:1; transform:none; }
.deposit-toast.out{ opacity:0; transform:translateY(16px) scale(.95); }
.deposit-toast i{ width:18px; height:18px; color:#52e87c; flex:none; }
.deposit-toast b{ color:#52e87c; }
.deposit-toast .usdt-inline{ width:14px; height:14px; vertical-align:-2px; }

/* ==================== ЖИВЫЕ МИНИ-МОДАЛКИ ДУЭЛЕЙ (розыгрыш в реальном времени) ==================== */
.duel-live-layer {
  position: fixed;
  left: 8px; right: 8px;
  bottom: calc(148px + env(safe-area-inset-bottom));
  z-index: 45;
  display: none;
  flex-wrap: wrap; gap: 10px;
  justify-content: center; align-content: flex-end;
  max-height: 54vh; overflow-y: auto;
  pointer-events: none;
}
/* показываем только на вкладке дуэлей и только когда есть карточки */
.duel-live-layer.layer-active:not(:empty) { display: flex; }

/* на широком экране (десктоп) — колонка справа. Полоса у правого края НЕ пересекается
   с центрированной колонкой аппа, поэтому ей можно дать pointer-events и скролл:
   зашёл в 5 дуэлей — все карточки доступны прокруткой, ни одна не «отрезается». */
@media (min-width: 680px) {
  .duel-live-layer.layer-active:not(:empty) {
    left: auto; right: 14px;
    bottom: auto; top: 84px;
    width: 152px;
    flex-direction: column; flex-wrap: nowrap;
    justify-content: flex-start; align-content: flex-start;
    max-height: calc(100vh - 170px);
    pointer-events: auto;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,0.18) transparent;
    padding-right: 2px;
  }
  .duel-live-layer::-webkit-scrollbar { width: 4px; }
  .duel-live-layer::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.18); border-radius: 2px; }
}

/* телефон: карточки компактнее, чтобы 3 дуэли вставали в один ряд и все были видны сразу
   (селекторы с .duel-live-layer — выигрывают у базовых правил ниже по файлу) */
@media (max-width: 679px) {
  .duel-live-layer .duel-live-card { width: 106px; padding: 10px 8px 9px; }
  .duel-live-layer .duel-live-card .dl-stake { font-size: 12px; }
  .duel-live-layer .duel-live-card .dl-arena { width: 60px; height: 60px; margin: 7px auto 6px; }
  .duel-live-layer .duel-live-card .dl-status { font-size: 10px; }
  .duel-live-layer .duel-live-card .dl-result { font-size: 13.5px; }
}

.duel-live-card {
  position: relative;
  pointer-events: auto;
  width: 128px;
  padding: 12px 10px 11px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,0.14);
  /* непрозрачный фон: видимость карточки НЕ зависит от backdrop-filter, который в webview
     Telegram Desktop (WebKit) местами рендерит элемент прозрачным — из-за этого на ПК не было видно */
  background: linear-gradient(180deg, rgba(26,37,31,0.92), rgba(12,18,15,0.94));
  box-shadow: 0 14px 34px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.08);
  text-align: center;
  opacity: 0; transform: translateY(18px) scale(0.9);
  transition: opacity .32s cubic-bezier(.2,.8,.25,1), transform .32s cubic-bezier(.2,.8,.25,1);
  cursor: pointer;
}
.duel-live-card.is-in { opacity: 1; transform: translateY(0) scale(1); }
.duel-live-card.is-out { opacity: 0; transform: translateY(-10px) scale(0.86); }

.duel-live-card .dl-close {
  position: absolute; top: 5px; right: 6px;
  width: 20px; height: 20px; padding: 0;
  display: grid; place-items: center;
  border: none; border-radius: 50%;
  background: rgba(255,255,255,0.08); color: rgba(255,255,255,0.6);
  font-size: 15px; line-height: 1; cursor: pointer;
}
.duel-live-card .dl-close:active { transform: scale(0.9); }

.duel-live-card .dl-stake {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 13px; font-weight: 900; color: #f4f7f3;
}
.duel-live-card .dl-stake .usdt-ic { width: 12px; height: 12px; }

.duel-live-card .dl-arena {
  position: relative;
  width: 74px; height: 74px;
  margin: 9px auto 8px;
}
.dl-arena .dl-face {
  position: absolute; inset: 0;
  display: grid; place-items: center;
  overflow: hidden; border-radius: 50%;
  border: 2px solid rgba(255,255,255,0.16);
  background: #111713; color: #f4f7f3;
  font-size: 20px; font-weight: 900;
  opacity: 0; transform: scale(0.82);
  transition: opacity .09s linear, transform .09s linear;
}
.dl-arena .dl-face.blue   { border-color: rgba(88,168,255,0.85); }
.dl-arena .dl-face.yellow { border-color: rgba(255,211,69,0.9); }
.dl-arena .dl-face img { width: 100%; height: 100%; object-fit: cover; display: block; }
.dl-arena .dl-face.is-show { opacity: 1; transform: scale(1); }

/* победитель после розыгрыша: увеличенный, с сиянием */
.dl-arena .dl-face.is-winner {
  opacity: 1; transform: scale(1.04);
  transition: opacity .3s ease, transform .3s cubic-bezier(.2,1.5,.4,1), box-shadow .3s ease;
  animation: dlWinPulse 1.4s ease-in-out infinite;
}
.dl-arena .dl-face.is-loser { opacity: 0 !important; transform: scale(0.6); }

@keyframes dlWinPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(143,232,79,0.0), 0 0 14px rgba(143,232,79,0.35); }
  50%      { box-shadow: 0 0 0 4px rgba(143,232,79,0.14), 0 0 22px rgba(143,232,79,0.6); }
}
.duel-live-card.lost .dl-arena .dl-face.is-winner {
  animation: none;
  box-shadow: 0 0 16px rgba(255,90,90,0.4);
}

.dl-arena .dl-ring {
  position: absolute; inset: -5px;
  border-radius: 50%;
  border: 2px solid transparent;
  pointer-events: none;
}
.duel-live-card.is-reveal .dl-arena .dl-ring {
  border-top-color: rgba(255,255,255,0.5);
  border-right-color: rgba(255,255,255,0.2);
  animation: dlSpin .7s linear infinite;
}
@keyframes dlSpin { to { transform: rotate(360deg); } }

.duel-live-card .dl-status {
  font-size: 11px; font-weight: 800; letter-spacing: .02em;
  color: rgba(244,247,243,0.62);
}
.duel-live-card.won  .dl-status { color: #8FE84F; }
.duel-live-card.lost .dl-status { color: #ff7a7a; }

.duel-live-card .dl-result {
  margin-top: 4px; min-height: 16px;
  font-size: 15px; font-weight: 1000;
  font-variant-numeric: tabular-nums;
  opacity: 0; transform: translateY(4px);
  transition: opacity .3s ease .05s, transform .3s ease .05s;
}
.duel-live-card.is-settled .dl-result { opacity: 1; transform: translateY(0); }
.duel-live-card .dl-result.win  { color: #8FE84F; }
.duel-live-card .dl-result.lose { color: #ff7a7a; }

/* ==================== ПРОГРЕССИВНЫЙ ДЖЕКПОТ-ПУЛ ==================== */
/* джекпот теперь без плашки: мешочек справа, сумма + USDT одной строкой под ним */
.jackpot-pool-row { display: flex; justify-content: flex-end; align-items: center; gap: 8px; padding-right: 2px; margin-top: 0; }
.rakes-app .jackpot-pool-badge {
  display: inline-flex !important; flex-direction: column; align-items: center; gap: 2px;
  padding: 2px; margin: 0; border: 0; background: none; cursor: pointer; max-width: 100%;
  -webkit-tap-highlight-color: transparent;
}
.jackpot-pool-badge:active { transform: scale(0.94); }
.jackpot-pool-badge .jp-bag { width: 26px; height: 26px; flex: 0 0 auto; filter: drop-shadow(0 2px 4px rgba(0,0,0,0.4)); }
.rakes-app .jp-pool-amount {
  display: inline-flex !important; flex-direction: row; align-items: center; white-space: nowrap;
  gap: 6px; font-size: 13px; font-weight: 900; color: #ffd76b;
  font-variant-numeric: tabular-nums; text-shadow: 0 1px 6px rgba(0,0,0,0.4); line-height: 1;
}
.jackpot-pool-badge #jackpot-pool { display: inline-flex; }
.jackpot-pool-badge .jp-pool-usdt { width: 13px; height: 13px; flex: 0 0 auto; display: inline-block; position: relative; top: 1px; }
/* слот-колонки цифр в бейдже: окно колонки ОБЯЗАНО быть 1.28em, как ячейка цифры и шаг
   translateY в setSlotNumber (миниапп крутит барабан кратно 1.28em) — окно 1em показывало
   верхний срез ячейки, и глиф проседал вниз на 0.14em. Центровку с иконкой даёт flex. */
.jp-pool-amount .slot-num { align-items: center; }
.jp-pool-amount .slot-num .slot-col { height: 1.28em !important; }
.jp-pool-body { display: flex; flex-direction: column; line-height: 1.05; text-align: left; }
.jp-pool-body small {
  font-family: "Montserrat", "Segoe UI", Arial, sans-serif;
  font-size: 10.5px; font-weight: 900; letter-spacing: 0.1em;
  color: #ffd76b;
}
.jp-pool-body strong { display: inline-flex; align-items: center; gap: 4px; font-size: 15px; font-weight: 900; text-shadow: 0 1px 6px rgba(0,0,0,0.35); font-variant-numeric: tabular-nums; }
/* цвет задаём и на контейнер, и на сами слот-цифры <i> — иначе на части устройств
   барабанные цифры не наследуют цвет и выглядят тускло */
.jackpot-pool-badge #jackpot-pool,
.jackpot-pool-badge #jackpot-pool .slot-strip i { color: #ffd76b; }
/* при пополнении число зеленеет и подсвечивается, затем плавно возвращается в золото */
#jackpot-pool { transition: color 0.8s ease, text-shadow 0.8s ease; }
#jackpot-pool .slot-strip i { transition: color 0.8s ease, text-shadow 0.8s ease; }
/* длинная плавная прокрутка барабанов пула — шаги отсчёта перетекают без рывков */
#jackpot-pool.slot-num .slot-strip { transition: transform 0.55s cubic-bezier(.24,.8,.25,1); }
.jackpot-pool-badge.jp-pumping #jackpot-pool,
.jackpot-pool-badge.jp-pumping #jackpot-pool .slot-strip i { color: #52e87c; text-shadow: 0 0 10px rgba(82,232,124,0.55); transition: color 0.3s ease, text-shadow 0.3s ease; }
/* мягкое «дыхание» бейджа во время пополнения — вместо резкой вспышки */
.jackpot-pool-badge { transition: box-shadow 0.6s ease, border-color 0.6s ease; }
.jackpot-pool-badge.jp-pumping {
  border-color: rgba(120,232,140,0.55);
  box-shadow: inset 0 1px 0 rgba(255,240,190,0.25), 0 0 18px rgba(82,232,124,0.28);
  animation: jpBreathe 1.4s ease-in-out infinite;
}
/* без transform — никакой тряски, только мягкая пульсация свечения */
@keyframes jpBreathe {
  0%, 100% { box-shadow: inset 0 1px 0 rgba(255,240,190,0.25), 0 0 12px rgba(82,232,124,0.18); }
  50%      { box-shadow: inset 0 1px 0 rgba(255,240,190,0.25), 0 0 22px rgba(82,232,124,0.4); }
}
.jp-pool-body .jp-pool-usdt { width: 13px; height: 13px; }
/* бонус НА СТОЛЕ: мешочек пульсирует размером БЕЗ подсветки (решение владельца);
   цифры не пульсируют вовсе */
.jackpot-pool-badge.jp-live .jp-bag { animation: jpLiveBag 1.6s ease-in-out infinite; }
@keyframes jpLiveBag {
  0%, 100% { transform: scale(1); }
  50%      { transform: scale(1.08); }
}
/* компактная пилюля объявленного дропа: «🎁 5.00 12:34» — когда и сколько упадёт.
   [hidden]-правило обязано перебивать display:...!important — иначе пилюля не прячется */
.rakes-app .jackpot-upcoming {
  display: inline-flex !important; align-items: center; gap: 5px;
  padding: 3px 9px; margin: 0; cursor: pointer; -webkit-tap-highlight-color: transparent;
  border: 1px solid rgba(255,205,90,0.4); border-radius: 999px;
  background: linear-gradient(180deg, rgba(255,205,90,0.14), rgba(120,80,20,0.08));
  box-shadow: inset 0 1px 0 rgba(255,240,190,0.16), 0 0 8px rgba(255,205,90,0.14);
}
.rakes-app .jackpot-upcoming[hidden] { display: none !important; }
.rakes-app .jackpot-pool-badge.jp-empty { display: none !important; }
/* зелёная пилюля соло-таймера справа от бейджа: одиночка досидит — заберёт бонус.
   Размер строго по контенту (никаких vw/растяжений) — одинаково компактна на ПК и телефоне */
.rakes-app .jackpot-solo-pill {
  display: inline-flex !important; align-items: center; justify-content: center;
  align-self: center; flex: 0 0 auto; box-sizing: border-box;
  height: 20px; min-height: 20px; max-height: 20px; width: auto; max-width: fit-content;
  padding: 0 13px; border-radius: 999px;
  border: 1px solid rgba(143,232,79,0.45);
  background: linear-gradient(180deg, rgba(143,232,79,0.14), rgba(24,64,28,0.10));
  box-shadow: inset 0 1px 0 rgba(210,255,190,0.14), 0 0 6px rgba(143,232,79,0.14);
}
.rakes-app .jackpot-solo-pill[hidden] { display: none !important; }
.jackpot-solo-pill em {
  font-style: normal; font-weight: 900; font-size: 11px; color: #8fe84f;
  font-variant-numeric: tabular-nums; white-space: nowrap; line-height: 1;
  height: auto; margin: 0; padding: 0;
}
.jackpot-upcoming:active { transform: scale(0.94); }
.jackpot-upcoming .jp-up-ic { font-size: 12px; line-height: 1; }
.jackpot-upcoming .jp-up-amount {
  display: inline-flex; align-items: center; gap: 3px; font-size: 11.5px; font-weight: 900;
  color: #ffd76b; font-variant-numeric: tabular-nums; white-space: nowrap; line-height: 1;
}
.jackpot-upcoming .jp-up-amount .jp-pool-usdt { width: 11px; height: 11px; top: 0; }
.jackpot-upcoming .jp-up-timer {
  font-size: 11px; font-weight: 900; font-style: normal; color: #8fe84f;
  font-variant-numeric: tabular-nums; white-space: nowrap; line-height: 1;
}
.jp-pool-q {
  width: 16px; height: 16px; flex: 0 0 auto; display: grid; place-items: center;
  border-radius: 50%; background: rgba(255,215,120,0.22); color: #ffd76b;
  font-size: 10px; font-weight: 900; font-style: normal;
}

/* взрыв сумки на бейдже при срыве джекпота + золотые частицы */
.jackpot-pool-badge.jp-burst { animation: jpBadgeBurst 0.8s ease; }
@keyframes jpBadgeBurst {
  0%   { transform: scale(1); }
  22%  { transform: scale(1.16); box-shadow: 0 0 0 7px rgba(255,205,90,0.35), 0 0 34px rgba(255,190,60,0.85); }
  50%  { transform: scale(0.93); }
  100% { transform: scale(1); box-shadow: inset 0 1px 0 rgba(255,240,190,0.25), 0 4px 14px rgba(0,0,0,0.3); }
}
.jackpot-pool-badge.jp-burst .jp-bag { animation: jpBagBurst 0.8s cubic-bezier(.3,1.5,.4,1); }
@keyframes jpBagBurst {
  0%   { transform: scale(1) rotate(0deg); }
  28%  { transform: scale(1.55) rotate(-14deg); }
  55%  { transform: scale(0.55) rotate(10deg); opacity: 0.35; }
  80%  { transform: scale(1.18) rotate(-4deg); opacity: 1; }
  100% { transform: scale(1) rotate(0deg); }
}
.jp-particle {
  position: fixed; z-index: 130; width: 9px; height: 9px; margin: -4px 0 0 -4px;
  border-radius: 50%; pointer-events: none; opacity: 1;
  background: radial-gradient(circle at 35% 30%, #fff2c0, #ffd76b 55%, #e0a828);
  box-shadow: 0 0 8px rgba(255,205,90,0.8);
  transition: transform 0.75s cubic-bezier(.2,.7,.3,1), opacity 0.75s ease;
}

/* аватар победителя в окне результата */
.result-winner-avatar { position: relative; width: 62px; height: 62px; margin: 0 auto 6px; border-radius: 50%; }
.result-winner-avatar #result-avatar-img,
.result-winner-avatar #result-avatar-fallback {
  width: 100%; height: 100%; border-radius: 50%; object-fit: cover;
  border: 2px solid rgba(255,215,120,0.55); background: #1a2420;
}
.result-winner-avatar #result-avatar-fallback { display: grid; place-items: center; color: #fff; font-weight: 900; font-size: 22px; background: #223028; }
/* display:grid/inline перебивает атрибут hidden — из-за этого спрятанный элемент вылезал
   золотой полоской справа от аватарки. Форсим скрытие. */
.result-winner-avatar #result-avatar-fallback[hidden],
.result-winner-avatar #result-avatar-img[hidden] { display: none !important; }
.result-crown {
  position: absolute; top: -16px; left: 50%; width: 32px; height: 32px;
  transform: translateX(-50%) rotate(-8deg); filter: drop-shadow(0 2px 4px rgba(0,0,0,0.4));
}
.result-crown[hidden] { display: none; }
.crown-pop { animation: crownPop 0.6s cubic-bezier(.3,1.6,.4,1) both; }
@keyframes crownPop {
  0% { opacity: 0; transform: translateX(-50%) translateY(14px) rotate(-8deg) scale(0.3); }
  60% { opacity: 1; transform: translateX(-50%) translateY(-3px) rotate(-8deg) scale(1.15); }
  100% { opacity: 1; transform: translateX(-50%) translateY(0) rotate(-8deg) scale(1); }
}
.avatar-burst { animation: avatarBurst 0.6s ease both; }
@keyframes avatarBurst { 0% { transform: scale(1); } 40% { transform: scale(1.14); } 100% { transform: scale(1); } }
.result-popover.is-jackpot #result-avatar-img,
.result-popover.is-jackpot #result-avatar-fallback { border-color: #ffd76b; box-shadow: 0 0 18px rgba(255,205,90,0.7); }

.result-jackpot-line {
  display: inline-flex; align-items: center; gap: 6px; margin: 4px auto;
  padding: 3px 10px; border-radius: 999px;
  background: linear-gradient(180deg, rgba(255,205,90,0.22), rgba(180,120,30,0.14));
  border: 1px solid rgba(255,205,90,0.5); color: #ffe9a8; font-weight: 900; font-size: 12px;
}
.result-jackpot-line[hidden] { display: none; }
/* «бам»-появление строки джекпота: панч-скейл с отскоком */
.result-jackpot-line.rjl-bam { animation: rjlBam 0.55s cubic-bezier(.25,1.6,.35,1) both; }
@keyframes rjlBam {
  0%   { opacity: 0; transform: scale(0.2); }
  55%  { opacity: 1; transform: scale(1.18); }
  100% { opacity: 1; transform: scale(1); }
}
.result-jackpot-line .jp-bag { width: 18px; height: 18px; }

/* sheet-объяснение джекпота */
/* на невысоких окнах (десктоп Telegram) шторка не влезает — даём ей скролл внутри */
.rakes-app .sheet-card.jackpot-info-sheet { max-height: calc(100vh - 96px); max-height: calc(100dvh - 96px); overflow-y: auto; -webkit-overflow-scrolling: touch; }
.jackpot-info-hero { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 2px 0 0; }
/* сцена: золотой мешок стоит на большой стопке купюр */
.jp-hero-scene { position: relative; width: 150px; height: 104px; }
.jp-hero-scene .jp-hero-cash {
  position: absolute; left: 50%; bottom: 0; width: 150px; height: auto;
  transform: translateX(-50%);
  filter: drop-shadow(0 6px 12px rgba(0,0,0,0.45));
}
/* элитная сцена: мешок мягко парит над пачками, тень под ним дышит в противофазе */
.jp-hero-scene .jp-hero-bag {
  position: absolute; left: 50%; bottom: 40px; width: 68px; height: 68px;
  transform: translateX(-50%);
  filter: drop-shadow(0 8px 14px rgba(255,190,60,0.35));
  animation: jpBagFloat 7s ease-in-out infinite; /* медленное элитное парение */
  will-change: transform;
}
@keyframes jpBagFloat {
  0%, 100% { transform: translateX(-50%) translateY(0) rotate(-0.8deg); }
  50%      { transform: translateX(-50%) translateY(-4px) rotate(0.8deg); }
}
.jp-hero-scene::before { /* дышащая тень под парящим мешком */
  content: ""; position: absolute; left: 50%; bottom: 36px; width: 46px; height: 9px;
  transform: translateX(-50%); border-radius: 50%;
  background: radial-gradient(ellipse, rgba(0,0,0,0.4), transparent 70%);
  animation: jpShadowBreathe 7s ease-in-out infinite; /* в такт медленному парению мешка */
}
@keyframes jpShadowBreathe {
  0%, 100% { transform: translateX(-50%) scale(1); opacity: 0.8; }
  50%      { transform: translateX(-50%) scale(0.84); opacity: 0.5; }
}
/* пробегающий блик поверх сцены: ОДНА полоса слева направо и пауза.
   no-repeat обязателен — иначе градиент тайлится и следом «застревает» второй блик */
.jp-hero-scene::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(115deg, transparent 42%, rgba(255,246,210,0.32) 50%, transparent 58%);
  background-size: 260% 100%;
  background-repeat: no-repeat;
  animation: jpSheen 4.8s ease-in-out infinite;
  mix-blend-mode: screen;
}
@keyframes jpSheen {
  0%, 21%   { background-position: 130% 0; } /* задержка ~1с перед проигрыванием блика */
  50%, 100% { background-position: -130% 0; }
}
/* мерцающие искры вокруг мешка */
.jp-hero-scene .jp-spark {
  position: absolute; width: 7px; height: 7px; pointer-events: none;
  background: radial-gradient(circle, #fff6cf 0%, #ffd76b 45%, transparent 72%);
  border-radius: 50%;
  animation: jpSpark 2.8s ease-in-out infinite;
  opacity: 0;
}
.jp-hero-scene .jp-spark:nth-child(1) { left: 18%; top: 26%; animation-delay: 0s; }
.jp-hero-scene .jp-spark:nth-child(2) { right: 16%; top: 16%; animation-delay: 0.9s; transform: scale(0.7); }
.jp-hero-scene .jp-spark:nth-child(3) { left: 27%; top: 58%; animation-delay: 1.7s; transform: scale(0.85); }
.jp-hero-scene .jp-spark:nth-child(4) { right: 24%; top: 48%; animation-delay: 2.3s; transform: scale(0.6); }
@keyframes jpSpark {
  0%, 100% { opacity: 0; transform: scale(0.3); }
  50%      { opacity: 1; transform: scale(1); }
}
@media (prefers-reduced-motion: reduce) {
  .jp-hero-scene .jp-hero-bag, .jp-hero-scene::before, .jp-hero-scene::after, .jp-hero-scene .jp-spark,
  .jackpot-pool-badge.jp-pumping, .jackpot-upcoming,
  .jackpot-pool-badge.jp-live .jp-bag { animation: none; }
}
.jackpot-info-hero strong { display: inline-flex; align-items: center; gap: 6px; font-size: 23px; font-weight: 900; color: #f5f8f4; }
.jackpot-info-hero .token-logo { width: 18px; height: 18px; }
.jackpot-info-text { display: flex; flex-direction: column; gap: 8px; padding: 6px 2px 2px; }
.jp-how-title { font-size: 12px; font-weight: 900; letter-spacing: 0.14em; text-transform: uppercase; color: #ffd76b; margin: 2px 0 3px; }
.jp-how-step { display: flex; align-items: flex-start; gap: 10px; }
.jp-how-ic {
  flex: 0 0 auto; width: 30px; height: 30px; display: grid; place-items: center; font-size: 16px;
  border-radius: 9px; background: rgba(255,205,90,0.13); border: 1px solid rgba(255,205,90,0.28);
}
.jp-how-step p { margin: 0; font-size: 14px; line-height: 1.5; color: #eef2ee; font-weight: 600; }
.jp-how-step b { color: #ffd76b; font-weight: 900; }
.jp-how-step b.hot { color: #ffb02e; }
.jp-how-step u { text-decoration: none; color: #fff; border-bottom: 1.5px dashed rgba(255,215,120,0.55); }

.jp-how-rules { margin-top: 4px; padding: 10px 12px; border-radius: 12px; background: rgba(143,232,79,0.07); border: 1px solid rgba(143,232,79,0.22); display: flex; flex-direction: column; gap: 6px; }
.jp-how-rules p { margin: 0; font-size: 13px; line-height: 1.45; color: rgba(238,242,238,0.86); font-weight: 600; display: flex; align-items: flex-start; gap: 8px; }
.jp-how-rules p span { flex: 1; }
.jp-how-rules b.good { color: #8fe84f; font-weight: 900; }
.jp-how-rules i.ok { flex: 0 0 auto; color: #8fe84f; font-style: normal; font-weight: 900; }

/* лидерборд гонки за джекпот */
.jackpot-lb { display: flex; flex-direction: column; gap: 6px; }
.jackpot-lb-loading { padding: 14px; text-align: center; color: rgba(244,247,243,0.5); font-size: 12.5px; font-weight: 700; }
.jp-lb-row {
  display: grid; grid-template-columns: 26px 30px minmax(0,1fr) auto;
  align-items: center; gap: 8px; padding: 7px 10px; border-radius: 11px;
  border: 1px solid rgba(255,255,255,0.07); background: rgba(255,255,255,0.03);
}
.jp-lb-row.leader { border-color: rgba(255,205,90,0.55); background: linear-gradient(180deg, rgba(255,205,90,0.14), rgba(180,120,30,0.07)); }
.jp-lb-row.me { border-color: rgba(143,232,79,0.5); }
.jp-lb-me-row { margin-top: 4px; }
.jp-lb-rank { font-size: 13px; font-weight: 900; color: rgba(244,247,243,0.6); text-align: center; }
.jp-lb-row.leader .jp-lb-rank { font-size: 15px; }
.jp-lb-ava { width: 30px; height: 30px; border-radius: 50%; overflow: hidden; display: grid; place-items: center; background: #223028; color: #fff; font-size: 12px; font-weight: 900; }
.jp-lb-ava img { width: 100%; height: 100%; object-fit: cover; display: block; }
.jp-lb-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; font-weight: 800; color: #f4f7f3; }
.jp-lb-amt { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; font-weight: 900; color: #ffe9a8; font-variant-numeric: tabular-nums; }
.jp-lb-amt .usdt-inline { width: 12px; height: 12px; }

/* имя лидера в строке джекпота (когда пул забрал не победитель раунда) */
.result-jackpot-line .rjl-winner { max-width: 110px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 900; color: #ffd76b; }
.result-jackpot-line .rjl-winner[hidden] { display: none; }

/* ===================== Лобби + Limbo + Dice (20260718) ===================== */
/* нижняя навигация теперь 4 таба: Jackpot · Лобби · Duels · Профиль */
.rakes-app .bottom-nav{ grid-template-columns: repeat(4, 1fr) !important; }
.rakes-app #view-lobby:not(.view-hidden),
.rakes-app #view-limbo:not(.view-hidden),
.rakes-app #view-dice:not(.view-hidden){ display:flex !important; flex-direction:column !important; }
.rakes-app #view-limbo, .rakes-app #view-dice{
  padding:10px 14px calc(86px + env(safe-area-inset-bottom)) !important;
  min-height:100svh; gap:10px; height:var(--appvh,100vh); overflow-y:auto; overflow-x:hidden;
}
html.vp-noFit .rakes-app #view-limbo, html.vp-noFit .rakes-app #view-dice{ height:auto; min-height:100svh; overflow:visible; }
.rakes-app #view-lobby{ padding:10px 14px calc(92px + env(safe-area-inset-bottom)) !important; min-height:100svh; gap:12px; }

/* кнопка «назад в лобби» */
.rakes-app .lobby-back{
  width:38px; height:38px; flex:none; display:inline-flex; align-items:center; justify-content:center;
  padding:0; line-height:0; border-radius:12px;
  border:1px solid rgba(255,255,255,.08); background:#101419; color:#cfd5db;
}
.rakes-app .lobby-back:active{ transform:scale(.94); background:#1a222b; }
.rakes-app .lobby-back i,
.rakes-app .lobby-back svg{ width:22px; height:22px; display:block; margin:0; flex:none; }

/* ---- Лобби ---- */
.lobby-wrap{ display:flex; flex-direction:column; gap:12px; width:100%; max-width:470px; margin:0 auto; flex:1 1 auto; min-height:0; }
/* сетка растягивается на всю свободную высоту до нижней навигации: 2 ряда поровну,
   карточки заполняют ряды целиком — и на телефоне, и на ПК */
.lobby-grid{ display:grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr; gap:12px; flex:1 1 auto; min-height:0; }
.lobby-card{
  position:relative; overflow:hidden; display:flex; flex-direction:column; gap:11px; align-items:flex-start;
  text-align:left; padding:16px 14px; border-radius:18px; min-height:134px; color:#F4F4F5;
  border:1px solid rgba(255,255,255,.08); background:linear-gradient(165deg,#12171d,#0c1014);
  box-shadow:0 12px 30px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.04);
}
.lobby-card:active{ transform:translateY(1px) scale(.985); }
/* `display: flex` выше перебивает штатный [hidden] { display: none } — без этого правила
   карточка скрытого режима остаётся видна всем (обкатка x50: атрибут стоял, а карточка
   светилась). Тот же случай, что у .bottom-nav button[hidden] выше. */
.lobby-card[hidden]{ display:none; }
/* фон-арт внутри карточки: прозрачность/размытие по гайдлайну, виньетка+цветной оверлей в ::after */
.lc-art{ position:absolute; inset:-6px; pointer-events:none; background-size:cover; background-position:center; }
.lobby-card::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:
    linear-gradient(var(--lc-tint, rgba(0,0,0,0)), var(--lc-tint, rgba(0,0,0,0))),
    radial-gradient(120% 120% at 50% 45%, rgba(0,0,0,0) 55%, rgba(0,0,0,var(--lc-vig,.12)) 100%);
}
.lobby-card .lc-ic, .lobby-card .lc-body, .lobby-card .lc-badge{ position:relative; z-index:1; }
.lc-crash{ --lc-tint:rgba(255,157,60,.08); --lc-vig:.12; }
.lc-mines{ --lc-tint:rgba(255,90,70,.10); --lc-vig:.14; }
.lc-limbo{ --lc-tint:rgba(143,232,79,.08); --lc-vig:.10; }
.lc-dice{ --lc-tint:rgba(155,140,255,.08); --lc-vig:.12; }
.lc-crash .lc-art{ background-image:url("/app-assets/ui/lobby-crash.jpg?v=3"); }
.lc-mines .lc-art{ background-image:url("/app-assets/ui/lobby-mines.jpg?v=2"); }
.lc-limbo .lc-art{ background-image:url("/app-assets/ui/lobby-limbo.jpg?v=2"); }
.lc-dice .lc-art{ background-image:url("/app-assets/ui/lobby-dice.jpg?v=2"); }
.lc-glow{ position:absolute; inset:0; pointer-events:none; opacity:.5;
  background:radial-gradient(130px 90px at 82% -10%, rgba(143,232,79,.10), transparent 70%); }
/* иконка — готовый PNG-тайл со своей рамкой и свечением, контейнер без рамки/фона */
.lc-ic{ width:54px; height:54px; display:grid; place-items:center; }
.lc-ic img{ width:100%; height:100%; display:block; object-fit:contain; }
.lc-body{ display:flex; flex-direction:column; gap:2px; margin-top:auto; }
.lc-body b{ font-size:17px; font-weight:800; }
.lc-body small{ font-size:11px; color:#8D929B; }
.lc-badge{
  font-size:10px; font-weight:800; letter-spacing:.04em; color:#8FE84F;
  background:rgba(143,232,79,.10); border:1px solid rgba(143,232,79,.22); padding:3px 9px; border-radius:999px;
}
/* акценты по играм */
.lc-crash .lc-glow{ background:radial-gradient(130px 90px at 82% -10%, rgba(255,157,60,.12), transparent 70%); }
.lc-crash .lc-badge{ color:#ff9d3c; background:rgba(255,157,60,.10); border-color:rgba(255,157,60,.24); }
.lc-mines .lc-glow{ background:radial-gradient(130px 90px at 82% -10%, rgba(255,90,70,.12), transparent 70%); }
.lc-mines .lc-badge{ color:#ff7a6e; background:rgba(255,90,70,.10); border-color:rgba(255,90,70,.24); }
.lc-dice .lc-glow{ background:radial-gradient(130px 90px at 82% -10%, rgba(155,140,255,.12), transparent 70%); }
.lc-dice .lc-badge{ color:#b3a8ff; background:rgba(155,140,255,.10); border-color:rgba(155,140,255,.24); }

/* ---- общие блоки Limbo/Dice ---- */
.rakes-app .limbo-x, .rakes-app .dice-x{ display:flex; flex-direction:column; gap:10px; flex:1 1 auto; min-height:0; max-width:470px; width:100%; margin:0 auto; }
.rakes-app .game-meta{ display:flex; gap:8px; flex:0 0 auto; }
.rakes-app .game-meta > div{
  flex:1; display:flex; flex-direction:column; gap:2px; align-items:center; padding:4px 6px; border-radius:12px;
  border:1px solid rgba(255,255,255,.06); background:linear-gradient(165deg,#12171d,#0c1014);
}
.rakes-app .game-meta span{ font-size:8.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:#8D929B; }
.rakes-app .game-meta b{ font-size:18px; font-weight:900; font-variant-numeric:tabular-nums; color:#F4F4F5; display:flex; align-items:center; gap:3px; }
/* значение суммы — это span внутри b; правило .game-meta span выше красит его в серый,
   поэтому явно возвращаем белый и жирный для суммы выплаты */
.rakes-app .game-meta b span{ color:#FFFFFF; font-weight:900; font-size:inherit; letter-spacing:normal; text-transform:none; }
.rakes-app .game-meta .usdt-inline{ width:16px; height:16px; }
.hg-pill{ font-size:10px; font-weight:800; font-variant-numeric:tabular-nums; padding:3px 7px; border-radius:999px; border:1px solid rgba(255,255,255,.08); color:#8D929B; background:rgba(255,255,255,.03); }
.hg-pill.win{ color:#8FE84F; border-color:rgba(143,232,79,.3); background:rgba(143,232,79,.08); }
.hg-pill.lose{ color:#ff7a6e; border-color:rgba(255,90,70,.25); background:rgba(255,90,70,.07); }

/* ---- Limbo ---- */
.rakes-app .limbo-arena{
  position:relative; flex:1 1 auto; min-height:180px; border-radius:22px; overflow:hidden; isolation:isolate;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
  border:1px solid rgba(143,232,79,.14);
  background:
    radial-gradient(120% 80% at 50% 118%, rgba(143,232,79,.16), transparent 60%),
    radial-gradient(90% 60% at 50% -10%, rgba(90,160,255,.10), transparent 60%),
    linear-gradient(180deg,#0a1410,#060a08 60%,#05070a);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.6), inset 0 0 70px rgba(0,0,0,.6), 0 18px 44px rgba(0,0,0,.55);
}
.rakes-app .limbo-arena::before{ content:""; position:absolute; inset:7px; border:1px solid rgba(143,232,79,.12); border-radius:16px; pointer-events:none; z-index:4; }
/* перспективная сетка «взлёта» */
.limbo-grid{
  position:absolute; left:-25%; right:-25%; bottom:-2px; height:62%; z-index:0; pointer-events:none; opacity:.5;
  background-image:
    linear-gradient(rgba(143,232,79,.16) 1px, transparent 1px),
    linear-gradient(90deg, rgba(143,232,79,.10) 1px, transparent 1px);
  background-size:34px 34px, 34px 34px;
  transform:perspective(340px) rotateX(62deg);
  transform-origin:bottom center;
  -webkit-mask-image:linear-gradient(to top, #000, transparent 92%);
  mask-image:linear-gradient(to top, #000, transparent 92%);
  animation:limboGrid 2.6s linear infinite;
}
@keyframes limboGrid{ from{ background-position:0 0, 0 0; } to{ background-position:0 34px, 0 0; } }
/* мягкое сияние-«полярка» */
.limbo-aurora{
  position:absolute; inset:-30% -10% 20%; z-index:0; pointer-events:none; opacity:.55;
  background:conic-gradient(from 210deg at 50% 60%, transparent, rgba(143,232,79,.18), transparent 40%, rgba(90,160,255,.12), transparent 70%);
  filter:blur(26px); animation:limboAurora 8s ease-in-out infinite alternate;
}
@keyframes limboAurora{ from{ transform:translateY(6px) scale(1.02); } to{ transform:translateY(-10px) scale(1.12); } }
.limbo-name{ position:relative; z-index:3; font-family:"Palatino Linotype","Book Antiqua",Georgia,serif; letter-spacing:.34em; font-size:12px; color:#7f8a86; text-transform:uppercase; }
.limbo-mult{ position:relative; z-index:3; font-size:clamp(50px,16vw,92px); font-weight:900; line-height:1; font-variant-numeric:tabular-nums; color:#F4F4F5; letter-spacing:-.01em; text-shadow:0 0 30px rgba(143,232,79,.28); transition:color .16s, text-shadow .16s; }
.limbo-mult i{ font-style:normal; font-size:.46em; color:#8D929B; margin-left:.04em; font-weight:800; }
.limbo-mult.rolling{ color:#e6f6d9; }
.limbo-mult.win{ color:#8FE84F; text-shadow:0 0 44px rgba(143,232,79,.6); animation:limboPop .34s cubic-bezier(.2,1.3,.4,1) both; }
.limbo-mult.lose{ color:#ff5a46; text-shadow:0 0 30px rgba(255,80,70,.45); animation:limboShake .3s ease both; }
@keyframes limboPop{ 0%{ transform:scale(.82); } 60%{ transform:scale(1.06); } 100%{ transform:scale(1); } }
@keyframes limboShake{ 0%,100%{ transform:translateX(0);} 25%{ transform:translateX(-6px);} 75%{ transform:translateX(6px);} }
.limbo-goal{ position:relative; z-index:3; font-size:11px; letter-spacing:.06em; color:#8D929B; text-transform:uppercase; font-weight:700; }
.limbo-goal b{ color:#B8F878; font-weight:900; font-variant-numeric:tabular-nums; }
.limbo-out{ position:relative; z-index:3; min-height:24px; margin-top:2px; font-size:19px; font-weight:900; font-variant-numeric:tabular-nums; text-shadow:0 2px 10px rgba(0,0,0,.4); }
.limbo-arena.win .limbo-out{ color:#8FE84F; }
.limbo-arena.lose .limbo-out{ color:#ff5a46; }
.limbo-arena.win::after, .limbo-arena.lose::after{ content:""; position:absolute; inset:0; pointer-events:none; border-radius:22px; z-index:2; }
.limbo-arena.win::after{ box-shadow:inset 0 0 80px rgba(143,232,79,.2); }
.limbo-arena.lose::after{ box-shadow:inset 0 0 80px rgba(255,80,70,.16); }
.dice-hist{ position:absolute; top:10px; left:10px; right:10px; display:flex; gap:5px; flex-wrap:wrap; justify-content:center; z-index:3; }
/* история Limbo — вертикально справа, как в Crash */
.limbo-hist{ position:absolute; top:50%; right:8px; transform:translateY(-50%); display:flex; flex-direction:column; align-items:flex-end; gap:5px; z-index:3; pointer-events:none; }
.limbo-hist .hg-pill{ min-width:52px; text-align:center; background:rgba(10,14,18,.66); backdrop-filter:blur(2px); }
/* Арена разгружена (27.07.2026): на экране остаются коэффициент, цель и профит.
   Надпись LIMBO дублирует вкладку, история заходов уводила взгляд от результата.
   Откат — убрать эти две строки; разметка и рендер истории на месте. */
.rakes-app .limbo-name{ display:none; }
.rakes-app .limbo-hist{ display:none; }

/* ---- Dice ---- */
.rakes-app .dice-arena{
  position:relative; flex:1 1 auto; min-height:180px; border-radius:20px; overflow:hidden;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:24px; padding:22px 22px;
  border:1px solid rgba(255,255,255,.09);
  background:radial-gradient(circle at 50% 22%, rgba(155,140,255,.06), transparent 55%), #070a08;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.6), inset 0 0 60px rgba(0,0,0,.55), 0 16px 40px rgba(0,0,0,.5);
}
.dice-roll{ font-size:clamp(40px,13vw,72px); font-weight:900; font-variant-numeric:tabular-nums; color:#F4F4F5; line-height:1; text-shadow:0 0 24px rgba(155,140,255,.22); transform:translateY(-12px); }
.dice-arena.win .dice-roll{ color:#8FE84F; text-shadow:0 0 30px rgba(143,232,79,.45); }
.dice-arena.lose .dice-roll{ color:#ff5a46; text-shadow:0 0 26px rgba(255,80,70,.4); }
/* фон трека = проигрышная зона: красный в тон салатовой заливке (видно там, где .dice-fill не перекрывает) */
.dice-track{ position:relative; width:100%; height:14px; border-radius:999px;
  background:linear-gradient(90deg, rgba(255,72,50,.75), rgba(255,92,64,.95)), #14100f;
  border:1px solid rgba(255,255,255,.08); box-shadow:inset 0 2px 6px rgba(0,0,0,.5); cursor:pointer; touch-action:none; user-select:none; -webkit-user-select:none; }
/* невидимая расширенная зона касания: тянуть/тапать можно с запасом вокруг трека (JS берёт только X) */
.dice-track::after{ content:""; position:absolute; left:-10px; right:-10px; top:-18px; bottom:-18px; }
.dice-fill{ position:absolute; top:0; bottom:0; left:0; right:50%; border-radius:999px; pointer-events:none; background:linear-gradient(90deg, rgba(110,235,70,.8), rgba(130,255,88,1)), #0c110d; box-shadow:0 0 16px rgba(120,240,80,.4); transition:left .12s ease, right .12s ease; }
/* круг = перетаскиваемый порог: стоит где поставил, заливка кончается ровно под ним */
.dice-ball{ position:absolute; top:50%; left:50%; width:28px; height:28px; transform:translate(-50%,-50%); border-radius:50%; z-index:3; cursor:grab; transition:left .12s ease;
  background:radial-gradient(circle at 35% 30%, #fff, #c7ccff 60%, #8b8ff0); border:2px solid #fff;
  box-shadow:0 4px 12px rgba(0,0,0,.5), 0 0 14px rgba(155,140,255,.5); }
.dice-ball:active{ cursor:grabbing; }
/* пока тянем — без инерции, круг и заливка чётко за пальцем */
.dice-track.dragging .dice-ball, .dice-track.dragging .dice-fill{ transition:none; }
/* анимация шарика-порога: прыгает на месте пока ждём сервер, скачет к выпавшему числу,
   приземляется и возвращается на порог (возврат делает JS плавным transition'ом) */
.dice-ball.hopping{ animation:diceBallHop .5s ease-in-out infinite; }
@keyframes diceBallHop{ 0%,100%{ transform:translate(-50%,-50%); } 50%{ transform:translate(-50%,calc(-50% - 9px)); } }
.dice-ball.flying{ transition:none; }
.dice-ball.landed{ animation:diceBallLand .32s ease-out; }
@keyframes diceBallLand{ 0%{ transform:translate(-50%,calc(-50% - 10px)); } 60%{ transform:translate(-50%,-50%) scale(1.18,.82); } 100%{ transform:translate(-50%,-50%); } }
.dice-scale{ width:100%; display:flex; justify-content:space-between; font-size:9px; color:#566069; font-variant-numeric:tabular-nums; margin-top:-4px; }
.dice-dirs{ display:grid; grid-template-columns:1fr 1fr; gap:8px; flex:0 0 auto; }
.dice-dir{ padding:14.5px 11px; border-radius:12px; border:1px solid rgba(255,255,255,.08); background:#101419; color:#aeb4bd; font-weight:800; font-size:13px; letter-spacing:.03em; }
.dice-dir.on{ border-color:rgba(143,232,79,.6); color:#8FE84F; background:rgba(143,232,79,.08); }
.dice-dir:active{ transform:scale(.97); }
.dice-range{ -webkit-appearance:none; appearance:none; width:100%; height:44px; background:transparent; outline:none; margin:0; cursor:pointer; touch-action:pan-y; }
.dice-range::-webkit-slider-runnable-track{ height:8px; border-radius:999px; background:#1a1f26; border:1px solid rgba(255,255,255,.06); }
.dice-range::-webkit-slider-thumb{ -webkit-appearance:none; appearance:none; width:24px; height:24px; margin-top:-9px; border-radius:50%; background:radial-gradient(circle at 38% 32%, #a8cf85, #6fa84e 60%, #547c3c); border:2px solid #0c1014; box-shadow:0 2px 7px rgba(0,0,0,.45); cursor:pointer; }
.dice-range::-webkit-slider-thumb:active{ transform:scale(1.08); }
.dice-range::-moz-range-track{ height:8px; border-radius:999px; background:#1a1f26; border:1px solid rgba(255,255,255,.06); }
.dice-range::-moz-range-progress{ height:8px; border-radius:999px; background:linear-gradient(90deg,#6fc93e,#8FE84F); }
.dice-range::-moz-range-thumb{ width:24px; height:24px; border-radius:50%; background:#6fa84e; border:2px solid #0c1014; box-shadow:0 2px 7px rgba(0,0,0,.45); cursor:pointer; }
/* в Dice кнопки ± у «Ставка» и «Порог» спрятаны для экономии места (ввод с клавиатуры + слайдер) */
.rakes-app #view-dice .bb-step button{ display:none; }

/* ——— Профиль: правка имени и загрузка аватара ——— */
.profile-avatar{ position:relative; }
/* карандаш-бейдж ВНУТРИ аватара (у него overflow:hidden — держим бейдж в границах); только он меняет фото */
.profile-avatar .profile-avatar-edit{
  position:absolute; right:3px; bottom:3px; width:22px; height:22px; padding:0;
  display:grid; place-items:center; border:none; border-radius:8px; cursor:pointer; z-index:2;
  background:var(--r-accent,#8FE84F); color:#06210f; box-shadow:0 2px 6px rgba(0,0,0,.45);
}
.profile-avatar .profile-avatar-edit i{ width:13px; height:13px; }
.profile-avatar.rk-dragover{ outline:2px dashed var(--r-accent,#8FE84F); outline-offset:3px; }
.profile-avatar.rk-uploading{ opacity:.55; pointer-events:none; }
/* имя ужимается многоточием, карандаш всегда виден и кликабелен (не уезжает за край) */
/* строка сжата до содержимого (justify-self:start) — карандаш стоит вплотную к имени, не уезжает */
.rakes-app #view-profile .profile-name-row{ display:flex !important; align-items:center; gap:5px; min-width:0; max-width:100%; justify-self:start; overflow:visible; }
.rakes-app #view-profile .profile-name-row #profile-name{ flex:0 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.profile-name-edit{
  flex:none; -webkit-appearance:none; appearance:none; border:none; background:none; padding:0; cursor:pointer;
  width:15px; height:15px; display:inline-grid; place-items:center; color:inherit; opacity:.5;
}
.profile-name-edit:hover{ opacity:.9; }
/* после lucide.createIcons() <i> заменяется на <svg data-lucide> — селектор по i не работал,
   и карандаш рендерился дефолтными 24px, вылезая вертикально */
.profile-name-edit i, .profile-name-edit [data-lucide]{ width:12px; height:12px; }

.rk-modal-back{
  position:fixed; inset:0; z-index:120; display:grid; place-items:center;
  background:rgba(0,0,0,.6); -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); padding:20px;
}
.rk-modal-back[hidden]{ display:none; }
.rk-modal{
  width:100%; max-width:360px; box-sizing:border-box;
  background:var(--card,#131a17); color:var(--text,#eaf3ee);
  border:1px solid rgba(255,255,255,.1); border-radius:18px; padding:22px;
  box-shadow:0 24px 60px -20px rgba(0,0,0,.7); animation:rk-modal-in .18s ease;
}
@keyframes rk-modal-in{ from{ transform:translateY(10px) scale(.98); opacity:0; } to{ transform:none; opacity:1; } }
.rk-modal h3{ margin:0 0 14px; font-size:18px; }
.rk-modal input{
  width:100%; box-sizing:border-box; padding:12px 14px; border-radius:12px;
  border:1px solid rgba(255,255,255,.14); background:rgba(0,0,0,.25); color:inherit; font-size:16px; outline:none;
}
.rk-modal input:focus{ border-color:var(--r-accent,#8FE84F); }
.rk-modal input:disabled{ opacity:.6; }
.rk-modal-note{ margin:10px 2px 0; font-size:13px; opacity:.7; }
.rk-modal-note.rk-note-warn{ color:#ffb84d; opacity:.95; }
.rk-modal-actions{ display:flex; gap:10px; margin-top:18px; }
.rk-modal-actions button{ flex:1; padding:12px; border-radius:12px; font-size:15px; cursor:pointer; border:none; }
.rk-btn-ghost{ background:rgba(255,255,255,.08); color:inherit; }
.rk-btn-primary{ background:var(--r-accent,#8FE84F); color:#06210f; font-weight:700; }
.rk-btn-primary:disabled{ opacity:.5; cursor:default; }
.rk-modal-label{ display:block; font-size:11px; text-transform:uppercase; letter-spacing:.07em; opacity:.55; margin:16px 2px 7px; }
.rk-avatar-drop{
  display:flex; align-items:center; gap:12px; padding:11px; cursor:pointer;
  border:1px dashed rgba(255,255,255,.22); border-radius:14px; background:rgba(0,0,0,.22);
  transition:border-color .15s, background .15s;
}
.rk-avatar-drop:hover, .rk-avatar-drop.rk-dragover{ border-color:var(--r-accent,#8FE84F); background:rgba(143,232,79,.07); }
.rk-avatar-drop.rk-uploading{ opacity:.6; pointer-events:none; }
.rk-avatar-drop img{ width:48px; height:48px; border-radius:13px; object-fit:cover; background:#101613; flex:none; }
.rk-avatar-drop img:not([src]), .rk-avatar-drop img[src=""]{ visibility:hidden; }
.rk-avatar-drop-text{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.rk-avatar-drop-text b{ font-size:14px; }
.rk-avatar-drop-text span{ font-size:11px; opacity:.55; }
.rk-avatar-drop.rk-locked{ opacity:.5; pointer-events:none; filter:grayscale(.4); }
.rk-reset-btn{
  width:100%; margin-top:12px; padding:11px; cursor:pointer;
  border:1px solid color-mix(in srgb, var(--r-accent,#8FE84F) 45%, transparent);
  border-radius:12px; background:color-mix(in srgb, var(--r-accent,#8FE84F) 12%, transparent);
  color:var(--text,#eaf3ee); font-size:14px; font-weight:600;
}
.rk-reset-btn:hover{ background:color-mix(in srgb, var(--r-accent,#8FE84F) 20%, transparent); }
.rk-reset-btn b{ font-weight:800; }
.rk-reset-btn:disabled{ opacity:.5; cursor:default; }
.rk-usdt-ic{ width:15px; height:15px; vertical-align:-3px; margin-left:1px; display:inline-block; }
/* модал подтверждения сброса кулдауна */
.rk-reset-modal{ text-align:center; }
.rk-reset-ic{
  width:52px; height:52px; margin:0 auto 14px; display:grid; place-items:center; border-radius:50%;
  background:color-mix(in srgb, var(--r-accent,#8FE84F) 16%, transparent); color:var(--r-accent,#8FE84F);
}
.rk-reset-ic i{ width:24px; height:24px; }
.rk-reset-modal h3{ text-align:center; margin:0 0 10px; }
.rk-reset-explain{ font-size:14px; line-height:1.5; color:rgba(244,247,243,.72); margin:0 0 16px; }
.rk-reset-price{
  display:flex; align-items:center; justify-content:space-between; text-align:left;
  padding:12px 14px; border-radius:12px; background:rgba(0,0,0,.22); border:1px solid rgba(255,255,255,.08);
}
.rk-reset-price span{ font-size:13px; opacity:.6; }
.rk-reset-price strong{ font-size:18px; display:inline-flex; align-items:center; gap:3px; }
.rk-reset-price strong .rk-usdt-ic{ width:18px; height:18px; vertical-align:middle; margin:0; }

/* ——— Джекпот-пул: центрированная золотая пилюля между статами и колесом ——— */
.rakes-app .round-head{ position:relative; z-index:3; }
.jackpot-pool-row{ justify-content:center !important; margin:8px 0 2px !important; padding:0 !important; }
.rakes-app .jackpot-pool-badge{
  flex-direction:row !important; align-items:center; justify-content:center; gap:8px;
  padding:7px 16px 7px 11px !important; border-radius:999px !important;
  background:
    radial-gradient(120% 160% at 50% 0%, rgba(255,215,107,.10), rgba(255,215,107,0) 55%),
    linear-gradient(180deg, rgba(24,32,26,.97), rgba(9,15,12,.97)) !important;
  border:1px solid rgba(255,215,107,.42) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,240,190,.16),
    0 8px 22px rgba(0,0,0,.5),
    0 0 18px rgba(255,215,107,.14) !important;
}
.jackpot-pool-badge .jp-bag{
  width:26px !important; height:26px !important;
  filter: drop-shadow(0 2px 5px rgba(0,0,0,.5)) drop-shadow(0 0 6px rgba(255,215,107,.25));
}
/* margin:0 гасит legacy margin-top:4px колоночной вёрстки — он сдвигал сумму ниже центра пилюли */
.rakes-app .jp-pool-amount{ font-size:15px !important; line-height:1; letter-spacing:.02em; margin:0 !important; }
.jackpot-pool-badge .jp-pool-usdt{ width:14px !important; height:14px !important; top:0 !important; }
.rakes-app .wheel-arena{ width:min(92vw, 420px) !important; margin:6px auto 14px !important; }

/* ===================== Экран технических работ ===================== */
body.maint-lock{ overflow:hidden !important; }
.maint-screen{ position:fixed; inset:0; z-index:100000; display:flex; align-items:center; justify-content:center; padding:24px; }
.maint-screen[hidden]{ display:none !important; }
.maint-bg{ position:absolute; inset:0; background:radial-gradient(120% 90% at 50% 8%, rgba(143,232,79,.10), transparent 55%), linear-gradient(180deg,#0a1410,#05070a 70%); }
.maint-card{ position:relative; z-index:1; width:100%; max-width:340px; text-align:center; display:flex; flex-direction:column; align-items:center; gap:14px; padding:32px 24px calc(28px + env(safe-area-inset-bottom)); border-radius:24px; border:1px solid rgba(143,232,79,.16); background:linear-gradient(165deg,#12171d,#0c1014); box-shadow:0 24px 60px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.05); animation:maintIn .35s cubic-bezier(.2,1.15,.4,1) both; }
@keyframes maintIn{ from{ opacity:0; transform:translateY(10px) scale(.96); } to{ opacity:1; transform:none; } }
.maint-ic{ width:74px; height:74px; display:grid; place-items:center; border-radius:20px; color:#8FE84F; border:1px solid rgba(143,232,79,.28); background:radial-gradient(circle at 50% 30%, rgba(143,232,79,.18), rgba(143,232,79,.04)); animation:maintWrench 2.4s ease-in-out infinite; }
.maint-ic svg, .maint-ic i{ width:34px; height:34px; }
@keyframes maintWrench{ 0%,100%{ transform:rotate(-9deg); } 50%{ transform:rotate(9deg); } }
.maint-card h2{ margin:0; font-size:22px; font-weight:900; color:#F4F4F5; letter-spacing:.01em; }
.maint-card p{ margin:0; font-size:14px; line-height:1.5; color:#8D929B; }
.maint-dots{ display:flex; gap:7px; margin-top:2px; }
.maint-dots span{ width:8px; height:8px; border-radius:50%; background:#8FE84F; opacity:.3; animation:maintDot 1.2s ease-in-out infinite; }
.maint-dots span:nth-child(2){ animation-delay:.16s; }
.maint-dots span:nth-child(3){ animation-delay:.32s; }
@keyframes maintDot{ 0%,100%{ opacity:.25; transform:translateY(0); } 50%{ opacity:1; transform:translateY(-4px); } }

/* ——— Dice: маркер выпавшего числа (плашка + стрелка вниз) едет к результату по треку.
   Шарик-порог при этом СТОИТ на месте — раньше он улетал к выпавшему числу и возвращался. ——— */
.dice-roll-marker{
  position:absolute; left:50%; bottom:calc(100% + 7px);
  transform:translateX(-50%); z-index:4; pointer-events:none;
  display:flex; flex-direction:column; align-items:center;
  opacity:0; transition:opacity .25s ease;
}
.dice-roll-marker.show{ opacity:1; }
.drm-num{
  padding:4px 9px; border-radius:9px;
  font-size:14px; font-weight:900; font-variant-numeric:tabular-nums; line-height:1; color:#F4F4F5;
  background:linear-gradient(180deg, #1c222b, #10141a);
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 4px 14px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.08);
}
.drm-arrow{
  width:0; height:0; margin-top:-1px;
  border-left:6px solid transparent; border-right:6px solid transparent;
  border-top:7px solid rgba(255,255,255,.28);
}
.dice-roll-marker.win .drm-num{ color:#8FE84F; border-color:rgba(143,232,79,.65);
  box-shadow:0 4px 16px rgba(0,0,0,.5), 0 0 14px rgba(143,232,79,.4); }
.dice-roll-marker.win .drm-arrow{ border-top-color:rgba(143,232,79,.85); }
.dice-roll-marker.lose .drm-num{ color:#ff6a58; border-color:rgba(255,90,70,.6);
  box-shadow:0 4px 16px rgba(0,0,0,.5), 0 0 14px rgba(255,90,70,.35); }
.dice-roll-marker.lose .drm-arrow{ border-top-color:rgba(255,90,70,.85); }
/* приземление: лёгкий подскок с оверушутом */
.dice-roll-marker.landed{ animation:drmLand .45s cubic-bezier(.2,1.6,.4,1); }
@keyframes drmLand{
  0%{ transform:translateX(-50%) translateY(-7px) scale(.85); }
  60%{ transform:translateX(-50%) translateY(1px) scale(1.12); }
  100%{ transform:translateX(-50%) translateY(0) scale(1); }
}
@media (prefers-reduced-motion: reduce){ .dice-roll-marker.landed{ animation:none; } }

/* ===== десктоп: верхняя карточка статов и бейдж пула ~на 10% компактнее =====
   Именно поштучные px, а не zoom: у zoom дробные пиксели (9px -> 8.1px) и текст
   в колонках прыгал по вертикали. Целые размеры сидят ровно. */
@media (pointer: fine){
  .rakes-app #view-game .jp-stat{ padding:8px 12px !important; }
  .rakes-app #view-game .jp-stat > strong{ font-size:14px !important; }
  .rakes-app #view-game .jp-stat > strong .token-logo{ width:13px !important; height:13px !important; }
  .rakes-app #view-game .jp-stat > strong.stat-waiting{ font-size:11px !important; }
  .rakes-app #view-game .jp-stat-head span{ font-size:8px !important; }
  .rakes-app #view-game .jp-stat-head .ui-ic{ width:12px !important; height:12px !important; }
  .rakes-app #view-game .jackpot-pool-badge{ padding:6px 14px 6px 10px !important; gap:7px; }
  .rakes-app #view-game .jackpot-pool-badge .jp-bag{ width:23px !important; height:23px !important; }
  /* после ужатия сумма вставала высоковато относительно мешочка — спускаем на 2px */
  .rakes-app #view-game .jp-pool-amount{ font-size:14px !important; position:relative; top:2px; }
  .rakes-app #view-game .jackpot-pool-badge .jp-pool-usdt{ width:13px !important; height:13px !important; }
}

/* ===== стартовый прелоадер: логотип + спиннер, живёт до первого ответа вебсокета ===== */
#app-preloader {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 30px;
  background: var(--bg);
  transition: opacity 0.35s ease;
}
#app-preloader.hide {
  opacity: 0;
  pointer-events: none;
}
.preloader-logo {
  width: min(48vw, 220px);
  filter: drop-shadow(0 0 24px rgba(103, 232, 185, 0.22));
}
.preloader-spinner {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 3px solid rgba(103, 232, 185, 0.16);
  border-top-color: var(--accent);
  animation: preloader-spin 0.8s linear infinite;
}
@keyframes preloader-spin {
  to { transform: rotate(360deg); }
}
.preloader-hint {
  font-size: 13px;
  color: #8b94a3;
  text-align: center;
  padding: 0 24px;
}
/* короткий вход приложения после прелоадера: мягкий подъём + проявление,
   идёт одновременно с угасанием прелоадера (см. hidePreloader в miniapp.js).
   Нижнюю навигацию НЕ анимируем: она обязана стоять готовой в момент ухода
   прелоадера, иначе выглядит как «догрузилась после» */
body.app-enter .app-view {
  animation: app-enter-rise 0.45s cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes app-enter-rise {
  from { opacity: 0; transform: translateY(14px) scale(0.988); }
  to { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  body.app-enter .app-view { animation: none; }
}

/* ==================== BLACKJACK ==================== */
/* блэкджек — как остальные режимы: арт-фон + иконка-картинка */
.lc-blackjack{ --lc-tint:rgba(143,232,79,.09); --lc-vig:.13; --lc-accent:#8FE84F; }
.lc-blackjack .lc-art{ background-image:url("/app-assets/ui/lobby-blackjack.jpg?v=2"); }
.lc-blackjack .lc-glow{ background:radial-gradient(130px 90px at 82% -10%, rgba(143,232,79,.12), transparent 70%); }
.lc-blackjack .lc-badge{ color:#4fc3ff; background:rgba(79,195,255,.10); border-color:rgba(79,195,255,.24); }

.blackjack-view{ display:flex; flex-direction:column; }
.bj-table{
  position:relative; flex:1 1 auto; margin:8px 12px 0; border-radius:26px; overflow:hidden;
  display:flex; flex-direction:column; justify-content:space-between; gap:10px;
  padding:26px 16px 30px; min-height:60vh;
  background:
    radial-gradient(120% 90% at 50% 8%, rgba(38,166,109,.35), rgba(6,32,22,0) 60%),
    radial-gradient(140% 120% at 50% 120%, #073c28 0%, #052a1d 45%, #03170f 100%);
  border:1px solid rgba(120,255,190,.14);
  box-shadow:inset 0 2px 30px rgba(0,0,0,.5), inset 0 0 0 6px rgba(255,255,255,.02), 0 18px 40px rgba(0,0,0,.5);
}
.bj-felt-glow{ position:absolute; left:50%; top:44%; width:70%; height:38%; transform:translate(-50%,-50%);
  background:radial-gradient(circle, rgba(120,255,190,.10), transparent 70%); pointer-events:none; }
.bj-deck{
  position:absolute; top:16px; right:18px; width:44px; height:62px; border-radius:7px; z-index:1;
  background:repeating-linear-gradient(135deg,#1c3b6e 0 6px,#16305a 6px 12px);
  border:2px solid rgba(255,255,255,.8);
  box-shadow:0 3px 0 -1px #16305a, 0 5px 0 -2px rgba(255,255,255,.7), 0 8px 14px rgba(0,0,0,.5);
}

.bj-row{ position:relative; z-index:2; display:flex; flex-direction:column; gap:8px; }
.bj-player{ align-items:center; }
.bj-dealer{ align-items:center; }
.bj-row-head{ display:flex; align-items:center; gap:10px; transition:opacity .22s ease; }
/* до раздачи стол пустой — подписи «Дилер»/«Вы» и счёт «—» не показываем.
   Класс bj-idle снимается в renderBlackjack, как только приходит игра.
   Прячем opacity, а не display: высота рядов не должна прыгать при раздаче. */
.bj-table.bj-idle .bj-row-head{ opacity:0; pointer-events:none; }
.bj-side-label{ font-size:11px; font-weight:900; letter-spacing:.18em; text-transform:uppercase;
  color:rgba(214,255,235,.65); }
.bj-total{
  min-width:34px; height:26px; padding:0 9px; display:inline-flex; align-items:center; justify-content:center;
  border-radius:999px; font-size:15px; font-weight:900; font-variant-numeric:tabular-nums; color:#eafff4;
  background:rgba(0,0,0,.4); border:1px solid rgba(255,255,255,.14); box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
/* .lose — сторона игрока при любом проигрыше (не только перебор): красная, как бюст дилера */
.bj-total.bust, .bj-total.lose{ color:#ff6a58; border-color:rgba(255,90,70,.5); box-shadow:0 0 12px rgba(255,90,70,.35); }
.bj-total.bj21{ color:#0a2417; background:linear-gradient(180deg,#8FE84F,#5cc63a); border-color:#8FE84F; }

.bj-hand{ display:flex; justify-content:center; min-height:78px; }
.bj-hand .bj-card:not(:first-child){ margin-left:-22px; }

.bj-card{
  position:relative; width:52px; height:74px; border-radius:8px; flex:0 0 auto;
  background:#fbfdff; box-shadow:0 3px 8px rgba(0,0,0,.45), 0 1px 0 rgba(0,0,0,.2);
  transform-origin:bottom center; transition:margin-left .18s ease;
}
.bj-card .bj-rank{ position:absolute; top:4px; left:6px; font-size:16px; font-weight:900; line-height:1; font-family:"Montserrat",Arial,sans-serif; }
.bj-card .bj-suit-c{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); font-size:26px; line-height:1; }
.bj-card .bj-rank-b{ position:absolute; bottom:4px; right:6px; font-size:16px; font-weight:900; line-height:1; transform:rotate(180deg); font-family:"Montserrat",Arial,sans-serif; }
.bj-card.red{ color:#e2213a; }
.bj-card.black{ color:#16213a; }
/* рубашка */
.bj-card.back{
  background:repeating-linear-gradient(135deg,#1c3b6e 0 7px,#16305a 7px 14px);
  border:2px solid #fbfdff;
}
.bj-card.back .bj-rank,.bj-card.back .bj-suit-c,.bj-card.back .bj-rank-b{ display:none; }

/* раздача: карта влетает от колоды (верх-право) в свой слот */
@keyframes bjDeal{
  0%{ opacity:0; transform:translate(160px,-150px) rotate(28deg) scale(.7); }
  60%{ opacity:1; }
  100%{ opacity:1; transform:translate(0,0) rotate(0) scale(1); }
}
.bj-card.dealing{ animation:bjDeal .42s cubic-bezier(.2,.9,.25,1) both; }
/* переворот дырочной карты дилера */
@keyframes bjFlip{
  0%{ transform:rotateY(90deg) scale(1.02); }
  100%{ transform:rotateY(0) scale(1); }
}
.bj-card.flip{ animation:bjFlip .34s ease-out both; }

.bj-outcome{ position:relative; z-index:3; align-self:center; }
.bj-outcome span{
  display:inline-block; padding:7px 20px; border-radius:999px; font-size:16px; font-weight:900;
  letter-spacing:.02em; background:rgba(0,0,0,.5); border:1px solid rgba(255,255,255,.14);
  box-shadow:0 6px 18px rgba(0,0,0,.5); animation:bjPop .35s cubic-bezier(.2,1.5,.4,1) both;
}
@keyframes bjPop{ 0%{ transform:scale(.7); opacity:0; } 100%{ transform:scale(1); opacity:1; } }
.bj-outcome.win span{ color:#0a2417; background:linear-gradient(180deg,#8FE84F,#54c63a); border-color:#8FE84F;
  box-shadow:0 6px 22px rgba(120,240,80,.4); }
.bj-outcome.lose span{ color:#ffd7d1; background:linear-gradient(180deg,#7a1f1f,#4a1414); border-color:rgba(255,90,70,.5); }
.bj-outcome.push span{ color:#e9edf2; }

.bj-controls{ padding:14px 12px calc(14px + env(safe-area-inset-bottom)); }
.bj-bet{ display:flex; flex-direction:column; gap:12px; }
.bj-bet .bb-field{ margin:0; }
.bj-deal{ width:100%; }
.bj-actions{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.bj-act{
  height:60px; border-radius:16px; border:1px solid rgba(255,255,255,.1); font-size:17px; font-weight:900;
  letter-spacing:.02em; cursor:pointer; transition:transform .08s ease, filter .15s ease;
  display:flex; align-items:center; justify-content:center;
}
.bj-act:active{ transform:scale(.96); }
.bj-act:disabled{ opacity:.5; pointer-events:none; }
.bj-hit{ background:linear-gradient(180deg,#8FE84F,#5cc63a); color:#08240f;
  box-shadow:0 8px 20px rgba(120,240,80,.3), inset 0 1px 0 rgba(255,255,255,.35); }
.bj-stand{ background:linear-gradient(180deg,#2a3550,#1a2136); color:#eaf0ff;
  box-shadow:0 8px 18px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.08); }
@media (prefers-reduced-motion: reduce){
  .bj-card.dealing,.bj-card.flip,.bj-outcome span{ animation:none; }
}
/* [hidden] перебивался display:flex/grid — принудительно прячем панели по атрибуту */
.blackjack-view .bj-bet[hidden], .blackjack-view .bj-actions[hidden], .bj-outcome[hidden]{ display:none !important; }

/* ==================== BLACKJACK — раскладка «в один экран» (оверрайды) ==================== */
.rakes-app #view-blackjack:not(.view-hidden){ display:flex !important; flex-direction:column !important; }
.rakes-app #view-blackjack{
  /* нижний отступ резервирует место под фиксированное нижнее меню — иначе оно перекрывает
     кнопку «Раздать»/Ещё-Стоп (как у dice/mines: ~86px) */
  padding:max(10px, env(safe-area-inset-top)) 14px calc(86px + env(safe-area-inset-bottom)) !important;
  min-height:100svh; height:var(--appvh,100vh); gap:8px; overflow:hidden;
}
html.vp-noFit .rakes-app #view-blackjack{ height:auto; min-height:100svh; overflow:visible; }
.rakes-app #view-blackjack .casino-topbar{ flex:0 0 auto; }

/* стол занимает свободное место и СЖИМАЕТСЯ, чтобы контролы всегда были видны */
.rakes-app .bj-table{
  flex:1 1 auto; min-height:0; margin:0; padding:16px 14px;
  justify-content:space-between; border-radius:22px;
}
.rakes-app .bj-deck{ top:12px; right:14px; width:38px; height:54px; }
.rakes-app .bj-hand{ min-height:0; }
.rakes-app .bj-card{ width:46px; height:66px; }
.rakes-app .bj-card .bj-rank,.rakes-app .bj-card .bj-rank-b{ font-size:14px; }
.rakes-app .bj-card .bj-suit-c{ font-size:23px; }
.rakes-app .bj-hand .bj-card:not(:first-child){ margin-left:-20px; }
.rakes-app .bj-controls{ flex:0 0 auto; padding:0; }
.rakes-app .bj-bet{ gap:10px; }
.rakes-app .bj-act{ height:54px; }

/* окно результата: база — mines-win-pop; добавляем красный (проигрыш) и нейтральный (ничья) */
.rakes-app .bj-win-pop.lose{
  border-color:rgba(255,90,70,.32);
  background:linear-gradient(170deg,#241012,#0e0808);
}
.rakes-app .bj-win-pop.lose .mines-win-x{ color:#ff6a58; text-shadow:0 0 18px rgba(255,90,70,.32); }
.rakes-app .bj-win-pop.push{ border-color:rgba(255,255,255,.16); background:linear-gradient(170deg,#171a20,#0b0e12); }
.rakes-app .bj-win-pop.push .mines-win-x{ color:#e9edf2; text-shadow:none; }

/* ==================== BLACKJACK — 3D-флип карты (перекрывает плоские) ==================== */
.rakes-app .bj-card{
  width:46px; height:66px; flex:0 0 auto; position:relative;
  background:transparent !important; box-shadow:none !important; border:0 !important;
  perspective:640px; transition:margin-left .18s ease;
}
.rakes-app .bj-card-inner{
  position:absolute; inset:0; transform-style:preserve-3d;
  transform:rotateY(0deg);  /* рубашкой вверх по умолчанию */
  transition:transform .42s cubic-bezier(.3,.9,.3,1);
}
.rakes-app .bj-card.revealed .bj-card-inner{ transform:rotateY(180deg); }  /* лицом вверх */
.rakes-app .bj-face{
  position:absolute; inset:0; border-radius:8px; overflow:hidden;
  -webkit-backface-visibility:hidden; backface-visibility:hidden;
  box-shadow:0 3px 8px rgba(0,0,0,.5), 0 1px 0 rgba(0,0,0,.2);
}
.rakes-app .bj-face-back{
  background:repeating-linear-gradient(135deg,#1c3b6e 0 7px,#16305a 7px 14px);
  border:2px solid #fbfdff;
}
.rakes-app .bj-face-front{
  background:#fbfdff; transform:rotateY(180deg); border:1px solid rgba(0,0,0,.08);
}
.rakes-app .bj-face-front.red{ color:#e2213a; }
.rakes-app .bj-face-front.black{ color:#16213a; }
.rakes-app .bj-face-front .bj-rank{ position:absolute; top:4px; left:6px; font-size:14px; font-weight:900; line-height:1; font-family:"Montserrat",Arial,sans-serif; }
.rakes-app .bj-face-front .bj-suit-c{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); font-size:23px; line-height:1; }
.rakes-app .bj-face-front .bj-rank-b{ position:absolute; bottom:4px; right:6px; font-size:14px; font-weight:900; line-height:1; transform:rotate(180deg); font-family:"Montserrat",Arial,sans-serif; }

/* влёт карты от колоды (рубашкой вверх) — потом .revealed перевернёт лицом */
@keyframes bjFlyIn{
  0%{ opacity:0; transform:translate(150px,-140px) rotate(24deg) scale(.72); }
  55%{ opacity:1; }
  100%{ opacity:1; transform:translate(0,0) rotate(0) scale(1); }
}
.rakes-app .bj-card.flying{ animation:bjFlyIn .3s cubic-bezier(.22,.85,.25,1) both; }
@media (prefers-reduced-motion: reduce){
  .rakes-app .bj-card.flying{ animation:none; }
  .rakes-app .bj-card-inner{ transition:none; }
}

/* ==================== BLACKJACK — жёсткая фиксация высот (стол не «дышит») ==================== */
/* ряды и руки фиксированной высоты: пусто/с картами — одинаковый layout, стол не меняет размер */
.rakes-app .bj-row{ height:96px; flex:0 0 auto; justify-content:flex-start; }
.rakes-app .bj-hand{ height:70px; min-height:70px; align-items:flex-end; overflow:visible; }
.rakes-app .bj-table{
  flex:1 1 auto; min-height:0; overflow:hidden;
  justify-content:space-between; contain:layout paint;   /* анимации внутри не влияют на внешний layout */
}
.rakes-app .bj-card{ will-change:transform; }
/* влёт от колоды — короче, чтобы карта не выходила далеко за стол (клип overflow:hidden) */
@keyframes bjFlyIn{
  0%{ opacity:0; transform:translate(120px,-90px) rotate(20deg) scale(.74); }
  55%{ opacity:1; }
  100%{ opacity:1; transform:translate(0,0) rotate(0) scale(1); }
}

/* контролы фиксированной высоты: при смене «ставка ⇄ Ещё/Стоп» стол НЕ меняет размер */
.rakes-app .bj-controls{ height:162px; display:flex; flex-direction:column; justify-content:flex-end; }
.rakes-app .bj-actions{ margin-top:auto; }

/* ==================== BLACKJACK — лоск: пульс счёта, мягкое приземление ==================== */
.rakes-app .bj-total{ transition:color .18s ease, background .25s ease, border-color .25s ease; }
.rakes-app .bj-total.bumped{ animation:bjTotalBump .34s cubic-bezier(.2,1.7,.35,1); }
@keyframes bjTotalBump{ 0%{ transform:scale(1);} 42%{ transform:scale(1.24);} 100%{ transform:scale(1);} }
/* влёт с лёгким приземлением-overshoot */
@keyframes bjFlyIn{
  0%{ opacity:0; transform:translate(120px,-92px) rotate(19deg) scale(.72); }
  55%{ opacity:1; }
  86%{ transform:translate(0,0) rotate(0) scale(1.05); }
  100%{ transform:translate(0,0) rotate(0) scale(1); }
}
.rakes-app .bj-card-inner{ transition:transform .36s cubic-bezier(.34,.85,.3,1); }
/* активная рука игрока чуть подсвечена — интерактивнее */
.rakes-app #view-blackjack .bj-actions:not([hidden]) ~ * .bj-player .bj-total,
.rakes-app .bj-player .bj-total.bj21{ box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 0 14px rgba(143,232,79,.28); }
/* тень карт на столе — глубже, «лежат» на сукне */
.rakes-app .bj-face{ box-shadow:0 4px 10px rgba(0,0,0,.55), 0 1px 0 rgba(0,0,0,.25); }

/* ==================== BLACKJACK — тёмно-серо-синий стол + лого на рубашке ==================== */
.rakes-app .bj-table{
  background:
    radial-gradient(120% 90% at 50% 6%, rgba(120,150,210,.16), transparent 58%),
    linear-gradient(180deg, #1b2334 0%, #151b29 52%, #10151f 100%) !important;
  border:1px solid rgba(150,180,230,.13) !important;
  box-shadow:inset 0 2px 26px rgba(0,0,0,.5), inset 0 0 0 6px rgba(255,255,255,.015), 0 16px 40px rgba(0,0,0,.5) !important;
}
.rakes-app .bj-felt-glow{ background:radial-gradient(circle, rgba(130,165,235,.09), transparent 70%) !important; }
/* рубашка карты и колода — фирменная «R» на сине-стальном фоне */
.rakes-app .bj-face-back{
  background:
    url('/app-assets/bjlogo.png?v=1') center/58% no-repeat,
    radial-gradient(120% 120% at 32% 22%, #2a3750, #1a2740 60%, #101a2c) !important;
  border:2px solid #eef2fa;
}
.rakes-app .bj-deck{
  background:
    url('/app-assets/bjlogo.png?v=1') center/66% no-repeat,
    radial-gradient(120% 120% at 32% 22%, #2a3750, #1a2740 60%, #101a2c) !important;
  border:2px solid rgba(255,255,255,.82);
}

/* контролы: поле ставки всегда видно (locked во время игры), кнопочный слот Раздать⇄Ещё/Стоп */
.rakes-app .bj-controls{ height:162px; display:flex; flex-direction:column; justify-content:flex-end; gap:10px; padding:0; }
.rakes-app .bj-field{ margin:0; transition:opacity .2s ease; }
.rakes-app .bj-field.locked{ opacity:.45; }
.rakes-app .bj-btnslot{ position:relative; }
.rakes-app .bj-btnslot .bj-deal{ width:100%; }
.rakes-app .bj-btnslot .bj-actions{ margin-top:0; }

/* контролы полностью жёсткие: поле и кнопочный слот фикс-высоты → раскладка НЕ рефлоу'ит при
   смене Раздать⇄Ещё/Стоп, стол не дёргается ни на кадр */
.rakes-app .bj-controls{ height:174px; gap:10px; }
.rakes-app .bj-field{ height:110px; box-sizing:border-box; }
.rakes-app .bj-btnslot{ height:54px; flex:0 0 54px; }
.rakes-app .bj-btnslot .bj-deal{ height:54px; }
.rakes-app .bj-btnslot .bj-actions{ height:54px; }
.rakes-app .bj-act{ height:54px; }

/* счёт очков — премиум: мягкая смена без прыжков/скейла (только лёгкое проявление) */
.rakes-app .bj-total{ transition:color .22s ease, box-shadow .3s ease; }
.rakes-app .bj-total.bumped{ animation:bjTotalSoft .26s ease-out; }
@keyframes bjTotalSoft{ from{ opacity:.45; } to{ opacity:1; } }

/* Mines: коэффициент следующего шага в верхнем углу каждой закрытой клетки */
.rakes-app .mines-cell{ position:relative; }
.rakes-app .mines-cell{ overflow:visible; }
.rakes-app .mines-cell.safe .mn-cell-mult{
  position:absolute; top:-7px; right:-7px; z-index:3;
  display:inline-flex; align-items:center;
  padding:2px 5px; border-radius:999px;
  font-size:9px; line-height:1; font-weight:900; letter-spacing:-.02em;
  font-variant-numeric:tabular-nums; pointer-events:none;
  color:#3a2a05;
  background:linear-gradient(180deg,#ffe08a,#f2b23c);
  border:1px solid rgba(255,255,255,.4);
  box-shadow:0 2px 6px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.55);
  transform-origin:top right;
  animation:mnMultIn .26s cubic-bezier(.2,1.3,.35,1) both;
}
@keyframes mnMultIn{ from{ opacity:0; transform:scale(.4) translateY(-3px); } to{ opacity:1; transform:scale(1) translateY(0); } }
@media (prefers-reduced-motion: reduce){ .rakes-app .mines-cell.safe .mn-cell-mult{ animation:none; } }

/* ===== 21.07: с компа кнопки ½/x2/MAX были низкими — все варианты модов выше по вертикали
       (в конце файла, т.к. правила mines-row и джекпот-дока перебивали медиа-блок выше) ===== */
@media (hover:hover) and (pointer:fine){
  .rakes-app .bet-mods button{ padding:13px 0; }
  .rakes-app .mn-bet-row .bet-mods button{ padding:12px 0; }
  .rakes-app .bet-dock .bet-wrap .bet-mods button{ padding:10px 0 !important; }
}

/* Ставка упёрлась в баланс: x2 сверх баланса больше не ставит «всё» (см. miniapp.js,
   разбор 27.07.2026) — вместо этого поле коротко подсвечивается, чтобы нажатие
   не выглядело «кнопка не работает». */
.rakes-app .bb-cap-hit,
.rakes-app input.bb-cap-hit{ animation:betCapHit .45s ease-out; }
@keyframes betCapHit{
  0%{ color:#ffd97a; transform:scale(1); }
  35%{ color:#ffd97a; transform:scale(1.06); }
  100%{ color:inherit; transform:scale(1); }
}

/* ===================== Движение: переходы вью, живое лобби, деньги (20260730) ===================== */
/* ВАЖНО: выше стоит боевое `.app-view { transition: none !important; }` (блок «3. seamless,
   instant tab switching»), снимать его нельзя — на нём держится раскладка вкладок.
   Поэтому переходы делаем ТОЛЬКО через animation: это правило её не глушит.
   Анимируется лишь ВХОДЯЩИЙ экран — уходящий скрывается мгновенно, как и раньше,
   иначе пришлось бы задерживать `view-hidden`, а на него завязаны замеры (syncJpChrome). */
@keyframes vt-in-fwd {
  from { opacity: 0; transform: translate3d(46px, 0, 0) scale(0.955); }
  to { opacity: 1; transform: none; }
}
@keyframes vt-in-back {
  from { opacity: 0; transform: translate3d(-46px, 0, 0) scale(0.955); }
  to { opacity: 1; transform: none; }
}
@keyframes vt-in-fade {
  from { opacity: 0; transform: translate3d(0, 22px, 0) scale(0.975); }
  to { opacity: 1; transform: none; }
}
.rakes-app .app-view.vt-fwd { animation: vt-in-fwd 0.52s cubic-bezier(0.32, 0.72, 0.24, 1) both; }
.rakes-app .app-view.vt-back { animation: vt-in-back 0.52s cubic-bezier(0.32, 0.72, 0.24, 1) both; }
.rakes-app .app-view.vt-fade { animation: vt-in-fade 0.44s cubic-bezier(0.32, 0.72, 0.24, 1) both; }

/* ---- Лобби: свечение статичное (дыхание убрано 30.07 — «пусть не двигаются») ---- */
.lobby-card .lc-glow { opacity: 0.55; }

/* наклон под палец: перебивает `.lobby-card:active{transform:...}` — оттого и !important */
.rakes-app .lobby-card.lc-tilting {
  transform: perspective(620px) rotateX(var(--lc-rx, 0deg)) rotateY(var(--lc-ry, 0deg)) scale(0.978) !important;
  transition: transform 0.08s ease-out !important;
}
/* пружинка при отпускании */
@keyframes lc-spring {
  0% { transform: scale(0.978); }
  45% { transform: scale(1.022); }
  75% { transform: scale(0.994); }
  100% { transform: scale(1); }
}
.rakes-app .lobby-card.lc-pop { animation: lc-spring 0.34s cubic-bezier(0.34, 1.56, 0.64, 1) both; }

/* ---- Деньги как событие: всплывающий «+X.XX» над чипом баланса ---- */
.bal-float {
  position: fixed; z-index: 9000; pointer-events: none;
  font-size: 13px; font-weight: 900; letter-spacing: 0.01em;
  color: #8FE84F; text-shadow: 0 2px 10px rgba(0, 0, 0, 0.55);
  animation: bal-float-up 1.15s cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes bal-float-up {
  0% { opacity: 0; transform: translate(-50%, 2px) scale(0.9); }
  18% { opacity: 1; transform: translate(-50%, -6px) scale(1); }
  70% { opacity: 1; transform: translate(-50%, -20px) scale(1); }
  100% { opacity: 0; transform: translate(-50%, -32px) scale(0.98); }
}

@media (prefers-reduced-motion: reduce) {
  .rakes-app .app-view.vt-fwd,
  .rakes-app .app-view.vt-back,
  .rakes-app .app-view.vt-fade,
  .rakes-app .lobby-card.lc-pop { animation: none; }
  .rakes-app .lobby-card.lc-tilting { transform: scale(0.985) !important; }
  .bal-float { animation-duration: 0.6s; }
}

/* ---- Лобби: обводка карточек + поведение под мышь (ПК) ---- */
/* Блик убран по просьбе владельца (30.07): сам по себе в лобби ничего не двигается.
   Вместо него — статичная цветная обводка в акцент каждой игры.
   ::before переиспользуем как рамку: ::after занят виньеткой/тинтом карточки. */
.lobby-card::before {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 1;
  border-radius: inherit;
  border: 1px solid var(--lc-acc, rgba(255, 255, 255, 0.16));
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.25) inset,
              0 0 18px -6px var(--lc-acc, transparent);
}
.lc-crash { --lc-acc: rgba(255, 157, 60, 0.5); }
.lc-mines { --lc-acc: rgba(255, 122, 110, 0.5); }
.lc-limbo { --lc-acc: rgba(143, 232, 79, 0.45); }
.lc-dice { --lc-acc: rgba(179, 168, 255, 0.5); }
.lc-blackjack { --lc-acc: rgba(94, 190, 255, 0.55); }

/* ПК: на телефоне hover не существует, поэтому под указатель — отдельной медиа-веткой.
   hover:hover отсекает тач-устройства, которые эмулируют hover после тапа и залипают */
@media (hover: hover) and (pointer: fine) {
  .lobby-card {
    transition: transform 0.22s cubic-bezier(0.22, 1, 0.36, 1),
                box-shadow 0.22s ease, border-color 0.22s ease;
  }
  .lobby-card:hover {
    transform: translateY(-4px);
    border-color: rgba(255, 255, 255, 0.16);
    box-shadow: 0 20px 44px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.07);
  }
  .lobby-card:hover .lc-glow { opacity: 1; }
  .lobby-card:hover .lc-ic img { transform: scale(1.08); }
  /* наклон под курсор — тот же класс, что и под палец, ставится из wireLobbyTilt */
  .rakes-app .lobby-card.lc-hovertilt {
    transform: perspective(700px) translateY(-4px)
               rotateX(var(--lc-rx, 0deg)) rotateY(var(--lc-ry, 0deg)) !important;
    transition: transform 0.12s ease-out !important;
  }
  /* нажатие должно перебивать hover-наклон, поэтому специфичность выше (два класса) */
  .rakes-app .lobby-card.lc-tilting.lc-hovertilt,
  .rakes-app .lobby-card.lc-tilting {
    transform: perspective(700px) rotateX(var(--lc-rx, 0deg)) rotateY(var(--lc-ry, 0deg)) scale(0.955) !important;
  }
  .bottom-nav button { transition: transform 0.16s ease, color 0.16s ease !important; }
  .bottom-nav button:hover { transform: translateY(-2px); }
}


/* ===== десктоп: колесо крупнее, док ставки ниже (20260730) =====
   Идёт ПОСЛЕ блока «десктоп: экран не перестраивается под ставки» и перебивает его
   каскадом при той же специфичности — правила выше намеренно не трогаем.
   Кап 460 вместо 390 и резерв 310 вместо 340: колесо забирает освободившуюся высоту.
   Уезд дока под меню на низких окнах не страшен — на ПК у #view-game включён
   height:auto + overflow:visible, экран прокручивается. */
@media (pointer: fine) {
  .rakes-app #view-game .wheel-arena,
  .rakes-app #view-game.has-bets .wheel-arena {
    width: min(88vw, 460px, calc(var(--appvh, 100vh) - 310px)) !important;
    margin: 4px auto 10px !important;
  }
  /* «ставку чуть вниз»: было -3px (док поджимался к колесу), теперь отступ вниз */
  .rakes-app #view-game .bet-dock { margin-top: 14px !important; }
}

/* ===== Колесо x50 (обкатка на админах) 20260731 =====
   Экран строится вокруг canvas-дуги: центр колеса уходит под нижний край арены, поэтому
   видно только верхнюю половину ленты — как в референсе. Всё, что ниже дуги (таймер,
   секторы, ставка), живёт обычным потоком, чтобы не драться с canvas за место. */
.x50-view{
  min-height:100svh;
  padding:max(8px, env(safe-area-inset-top)) 12px calc(78px + env(safe-area-inset-bottom));
}
.x50-wrap{ display:flex; flex-direction:column; gap:10px; }

.x50-arena{
  position:relative; margin-top:10px; border-radius:20px; overflow:hidden;
  border:1px solid rgba(255,255,255,.07);
  background:
    radial-gradient(120% 80% at 50% 118%, rgba(255,167,51,.10), transparent 62%),
    linear-gradient(180deg,#151922 0%,#10131a 55%,#0c0f14 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 12px 32px rgba(0,0,0,.45);
  aspect-ratio:11/6.2;
}
.x50-arena canvas{ position:absolute; inset:0; width:100%; height:100%; display:block; }

/* Лента прошлых раундов: цветные чёрточки в пустом поясе между дугой колеса и таймером.
   Высота риски = вес коэффициента (x2 самая низкая, x50 самая высокая) — исход раунда
   читается боковым зрением, не вчитываясь в цифры. Растут вверх от общей базовой линии. */
.x50-hist{
  width:100%; height:24px; margin-bottom:3px;
  display:flex; align-items:flex-end; justify-content:center; gap:4px;
  padding:0 14px; overflow:hidden;
  /* лента по центру арены; порядок при этом прежний — свежие раунды слева, старые справа */
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
  mask-image:linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
}
.x50-tick{ width:3px; border-radius:2px; flex:0 0 auto; opacity:.85; }
.x50-t2 { height:7px;  background:#5a6472; }
.x50-t3 { height:12px; background:#ffb03a; box-shadow:0 0 6px rgba(255,176,58,.45); }
.x50-t5 { height:17px; background:#f2495e; box-shadow:0 0 7px rgba(242,73,94,.5); }
.x50-t50{ height:24px; background:#3fd47c; box-shadow:0 0 10px rgba(63,212,124,.95); opacity:1; }
.x50-t0 { height:20px; background:#b98bff; box-shadow:0 0 9px rgba(168,107,255,.95); opacity:1; }

/* таймер в «яме» под дугой */
.x50-center{
  position:absolute; left:0; right:0; bottom:2%; z-index:2;
  display:flex; flex-direction:column; align-items:center; gap:2px; pointer-events:none;
}
.x50-timer{
  font-size:38px; font-weight:800; line-height:1; letter-spacing:.01em;
  font-variant-numeric:tabular-nums; color:#F4F4F5; text-shadow:0 2px 14px rgba(0,0,0,.7);
  min-height:38px;
}
/* слово вместо цифр: буквам нужен кегль поменьше, иначе «Удачи!» распирает колонку */
.x50-timer.word{ font-size:30px; letter-spacing:.01em; color:#ffc247; text-shadow:0 2px 16px rgba(255,176,58,.35); }
/* выпавший множитель — цветом своего сектора (перебивает золото «Удачи!») */
.x50-timer.res2 { color:#cfd6e0; text-shadow:0 2px 16px rgba(180,190,205,.3); }
.x50-timer.res3 { color:#ffb03a; text-shadow:0 2px 18px rgba(255,176,58,.5); }
.x50-timer.res5 { color:#f2495e; text-shadow:0 2px 18px rgba(242,73,94,.5); }
.x50-timer.res50{ color:#3fd47c; text-shadow:0 0 24px rgba(63,212,124,.75); }
.x50-timer.res0 { color:#b98bff; text-shadow:0 0 24px rgba(168,107,255,.8); }
.x50-caption{ font-size:11px; color:#8D929B; letter-spacing:.02em; }
.x50-progress{
  margin-top:7px; width:min(58%,260px); height:3px; border-radius:3px;
  background:rgba(255,255,255,.08); overflow:hidden;
}
.x50-progress i{
  display:block; height:100%; width:100%; border-radius:3px;
  background:linear-gradient(90deg,#ffb03a,#ff8a1f);
  box-shadow:0 0 10px rgba(255,167,51,.7);
  /* ширину гоняет rAF-цикл: transition сгладил бы «дёрганье» тика, но и врал бы на секунду */
}

/* четыре сектора-кнопки */
.x50-picks{ display:grid; grid-template-columns:repeat(5,1fr); gap:5px; }
.rakes-app .x50-pick .x50-pick-sum{ display:none; }
/* Кнопка сектора самостоятельная (владелец, 01.08): скруглена со всех сторон и имеет
   нижнюю рамку. Раньше низ был срезан, потому что она склеивалась со столбиком ставок —
   теперь столбик прозрачный и склеивать не с чем. */
.rakes-app .x50-pick{
  position:relative; display:flex; flex-direction:column; align-items:center; gap:2px;
  padding:9px 2px; border-radius:13px; min-height:0;
  border:1px solid var(--x50-edge); background:var(--x50-bg);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07); transition:transform .12s ease, box-shadow .18s ease;
}
.rakes-app .x50-pick b{ font-size:17px; font-weight:900; line-height:1; color:var(--x50-ink); }
/* «БОНУС» — слово, а не число: своим кеглем оно распирало бы колонку */
.rakes-app .x50-pick.x50-s0 b{ font-size:10.5px; letter-spacing:.03em; }
/* фиолетовая звёздочка под «БОНУС» — в цвет сектора, со свечением как у его рамки */
.x50-pick-star{
  font-size:11px; line-height:1; font-style:normal; color:var(--x50-ink);
  text-shadow:0 0 8px var(--x50-glow);
}
.rakes-app .x50-pick .x50-pick-sum{
  font-size:10px; font-weight:700; color:rgba(255,255,255,.55); font-variant-numeric:tabular-nums;
}
.rakes-app .x50-pick:active{ transform:scale(.96); }
.rakes-app .x50-pick[disabled]{ opacity:.45; }
/* своя ставка на секторе — золотой бейдж в углу */
.x50-pick-mine{
  position:absolute; top:-6px; right:-4px; padding:2px 6px; border-radius:9px;
  font-size:9.5px; font-weight:800; font-style:normal; color:#12140f;
  background:linear-gradient(180deg,#ffd76a,#ffab26); box-shadow:0 3px 10px rgba(0,0,0,.5);
}
.rakes-app .x50-pick.mine{ border-color:var(--x50-ink); }
.x50-board.mine{ border-color:transparent; }
.rakes-app .x50-pick.won{ border-color:var(--x50-ink); box-shadow:0 0 22px var(--x50-glow); }
/* выигравший сектор подсвечиваем не рамкой (её больше нет), а свечением самих строк */
.x50-board.won li b{ color:var(--x50-ink); }
.x50-board.won li img{ border-color:var(--x50-ink); }
/* цвета по требованию: x2 чёрно-серый, x3 оранжево-жёлтый, x5 красный, x50 зелёный */
.x50-s2 { --x50-bg:linear-gradient(180deg,#2c3038,#1a1d23); --x50-edge:rgba(255,255,255,.10); --x50-ink:#dfe6f0; --x50-glow:rgba(180,190,205,.5); }
.x50-s3 { --x50-bg:linear-gradient(180deg,rgba(255,176,58,.20),rgba(240,138,16,.07)); --x50-edge:rgba(255,176,58,.34); --x50-ink:#ffb03a; --x50-glow:rgba(255,168,40,.75); }
.x50-s5 { --x50-bg:linear-gradient(180deg,rgba(242,73,94,.20),rgba(196,22,46,.07)); --x50-edge:rgba(242,73,94,.34); --x50-ink:#f2495e; --x50-glow:rgba(240,60,85,.75); }
.x50-s50{ --x50-bg:linear-gradient(180deg,rgba(63,212,124,.22),rgba(20,146,71,.07)); --x50-edge:rgba(63,212,124,.38); --x50-ink:#3fd47c; --x50-glow:rgba(50,215,120,.85); }
.x50-s0 { --x50-bg:linear-gradient(180deg,rgba(168,107,255,.24),rgba(96,44,180,.08)); --x50-edge:rgba(168,107,255,.42); --x50-ink:#b98bff; --x50-glow:rgba(168,107,255,.9); }

.x50-ctl{ grid-template-columns:1fr; }

/* Четыре столбика ставок — по одному ПОД каждой кнопкой сектора, колонки совпадают
   с сеткой кнопок (те же 4 колонки и тот же зазор), поэтому читается как продолжение
   кнопки вниз. Высота фиксирована и скроллится внутри: иначе сектор с десятком ставок
   растянул бы экран и кнопки уехали под нижнее меню. */
/* Столбик растёт ИЗ кнопки: вплотную к ней, верх открыт, скругление только снизу.
   align-items:start — иначе grid растянул бы все столбики по самому высокому, и колонка
   с одной ставкой висела бы длинной рамкой (владелец, 01.08). */
.x50-boards{ display:grid; grid-template-columns:repeat(5,1fr); gap:5px; margin-top:0; align-items:start; }
/* Столбики прозрачные (владелец, 01.08): ни фона, ни боковых рамок — список ставок
   висит прямо на фоне арены, как на csgo500. Цвет сектора остаётся на кнопке сверху,
   дублировать его рамкой вниз незачем. */
.x50-board{
  border:1px solid transparent; border-top:0; border-radius:0 0 13px 13px;
  padding:0 3px 5px; background:transparent;
  display:flex; flex-direction:column; gap:4px; min-width:0;
}
/* обводка появляется ТОЛЬКО когда в секторе есть ставки (владелец, 01.08): пустой
   столбик не должен висеть пустой рамкой в воздухе под кнопкой */
.x50-board.has-bets{ border-color:var(--x50-edge); padding-top:5px; }
.x50-board ul{
  list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:3px;
  max-height:104px; overflow-y:auto; overscroll-behavior:contain;
}
/* аватар вплотную к сумме: ника между ними больше нет, растягивать строку не на что */
.x50-board li{ display:flex; align-items:center; justify-content:center; gap:3px; min-width:0; }
.x50-board li img{
  width:15px; height:15px; border-radius:50%; flex:0 0 auto; object-fit:cover;
  background:#20242b; border:1px solid rgba(255,255,255,.08);
}
/* Ник в столбике не показываем (владелец, 01.08): колонок пять, на телефоне под имя
   остаётся пара пикселей, и оно схлопывалось в многоточие — читалось как «точка»
   между аватаркой и суммой. Полное имя осталось в title строки. */
.x50-board li > span{ display:none; }
.x50-board li b{
  flex:0 0 auto; display:inline-flex; align-items:center; gap:3px;
  font-size:10px; font-weight:800; color:#F4F4F5; font-variant-numeric:tabular-nums;
}
/* логотип USDT у суммы — тот же ассет, что в чипе баланса */
.x50-board li b .x50-token{
  width:9px; height:9px; flex:0 0 auto;
  border:0; border-radius:0; background:none;
}

.x50-board li.me b{ color:var(--x50-ink); }
.x50-board li.me img{ border-color:var(--x50-ink); }
/* пустой столбик не занимает вообще ничего: рамка обрывается там, где кончились ставки */
.x50-board ul.empty{ min-height:0; }


/* карточка режима в лобби */
.lc-x50{ --lc-tint:rgba(63,212,124,.09); --lc-vig:.12; --lc-acc:rgba(63,212,124,.5); }
.lc-x50 .lc-art{ background-image:url("/app-assets/ui/lobby-crash.jpg?v=3"); }
.lc-x50 .lc-glow{ background:radial-gradient(130px 90px at 82% -10%, rgba(63,212,124,.14), transparent 70%); }
.lc-x50 .lc-badge{ color:#3fd47c; background:rgba(63,212,124,.10); border-color:rgba(63,212,124,.26); }

/* низкие экраны: арена не должна съедать панель ставок */
@media (max-height: 700px){
  .x50-arena{ aspect-ratio:11/5.4; }
  .x50-timer{ font-size:32px; min-height:32px; }
  /* на коротком экране столбики ужимаем: сектора и поле ставки важнее списков */
  .x50-board ul{ max-height:66px; }
}

/* ===== Бонус-раунд колеса ===== */
/* Сцена лежит поверх арены и занимает её целиком: колесо на это время прячется. */
.x50-bonus{ position:absolute; inset:0; z-index:4; display:flex; flex-direction:column;
  align-items:center; justify-content:flex-start; }
/* `display` выше перебивает штатный [hidden] { display: none } — без этих двух правил
   сцена бонуса и кнопки голосования висят на экране в обычном раунде. Та же ловушка,
   что у .lobby-card[hidden] и .bottom-nav button[hidden]. */
/* Сразу на всё поддерево: любой display внутри сцены перебивает штатный [hidden], и
   каждый новый скрываемый блок иначе всплывает на экране. Правило закрывает вопрос оптом. */
.x50-bonus[hidden], .x50-bonus [hidden]{ display:none !important; }
.x50-bonus canvas{ position:absolute; inset:0; width:100%; height:100%; }
/* подложка под нижнюю панель: сцена не должна просвечивать сквозь кнопки и цифры */
.x50-bonus::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:36%;
  background:linear-gradient(180deg, transparent, rgba(10,12,17,.9) 48%);
  pointer-events:none; z-index:1; }
.x50-bonus-head{ position:relative; z-index:2; width:100%; display:flex; align-items:center;
  justify-content:space-between; padding:8px 12px 0; }
.x50-bonus-title{ font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase;
  background:linear-gradient(90deg,#d9baff,#b98bff 55%,#8a5ce0);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  filter:drop-shadow(0 2px 10px rgba(0,0,0,.6)) drop-shadow(0 0 14px rgba(168,107,255,.35)); }
.x50-bonus-timer{ font-size:14px; font-weight:800; font-variant-numeric:tabular-nums;
  color:#F4F4F5; min-width:34px; text-align:center; padding:3px 9px; border-radius:10px;
  background:rgba(8,10,15,.5); border:1px solid rgba(255,255,255,.1);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06); }
/* пустой таймер не должен висеть тёмным пилюлем без цифр */
.x50-bonus-timer:empty{ visibility:hidden; }

/* Четыре карты. Переворот — тот же приём, что в блэкджеке: две грани и rotateY. */
/* Карты стоят по центру сцены, а не липнут к заголовку: margin-top:auto здесь и такой же
   у .x50-bonus-mult делят свободную высоту пополам, и колода оказывается ровно посередине
   между шапкой и нижней панелью. На фазе игры карты скрыты, их auto-отступ не участвует,
   и низ остаётся прижатым к низу, как и был. */

/* ===== Бонус: празднование на старте (владелец, 01.08) =====
   Пока играет заставка, карты не показываем — они «прилетают» уже после неё, каждая
   со своей задержкой. Анимации на transform/opacity: WebView Telegram их тянет на GPU,
   а любые layout-свойства тут заметно дёргаются. */
.x50-hype{
  position:absolute; inset:0; z-index:4; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:6px; text-align:center;
  pointer-events:none;
}
.x50-hype b{
  font-size:clamp(26px, 9vw, 46px); font-weight:900; letter-spacing:.02em;
  background:linear-gradient(180deg,#fff,#b98bff);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  text-shadow:0 0 26px rgba(168,107,255,.55);
  animation:x50HypePop .5s cubic-bezier(.2,1.5,.4,1) both, x50HypeBeat 1s ease-in-out .5s 1;
}
.x50-hype i{
  font-style:normal; font-size:11.5px; font-weight:700; color:#cbb6ff; letter-spacing:.06em;
  text-transform:uppercase; animation:x50HypeFade .45s ease .28s both;
}
/* лучи из центра — дешёвый «салют» одним элементом, без частиц и канваса */
.x50-hype-rays{
  position:absolute; inset:-20%; z-index:-1; opacity:.5;
  background:conic-gradient(from 0deg, rgba(168,107,255,.55) 0 6deg, transparent 6deg 30deg);
  mask-image:radial-gradient(closest-side, transparent 22%, #000 38%, transparent 72%);
  -webkit-mask-image:radial-gradient(closest-side, transparent 22%, #000 38%, transparent 72%);
  animation:x50HypeSpin 2.2s linear both;
}
@keyframes x50HypePop{
  0%{ transform:scale(.5) rotate(-6deg); opacity:0; }
  60%{ transform:scale(1.12) rotate(2deg); opacity:1; }
  100%{ transform:scale(1) rotate(0); opacity:1; }
}
@keyframes x50HypeBeat{ 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.06); } }
@keyframes x50HypeFade{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:none; } }
@keyframes x50HypeSpin{ from{ transform:rotate(0); } to{ transform:rotate(180deg); } }
/* карты влетают снизу по очереди — задержку ставит JS через --i */
.x50-cards.dealing .x50-card{
  animation:x50CardDeal .42s cubic-bezier(.2,1.2,.35,1) both;
  animation-delay:calc(var(--i, 0) * .1s);
}
@keyframes x50CardDeal{
  from{ opacity:0; transform:translateY(26px) scale(.86) rotate(-4deg); }
  to{ opacity:1; transform:none; }
}
@media (prefers-reduced-motion: reduce){
  .x50-hype b, .x50-hype i, .x50-hype-rays, .x50-cards.dealing .x50-card{ animation:none; }
}
.x50-cards{ position:relative; z-index:2; display:grid; grid-template-columns:repeat(4,1fr);
  gap:8px; width:100%; max-width:310px; margin:auto auto 0; padding:0; }
.rakes-app .x50-card{ aspect-ratio:3/4; padding:0; border:0; background:none; min-height:0;
  perspective:600px; box-shadow:none; }
/* НИКАКИХ filter/opacity/overflow на inner: любое «группирующее» свойство сплющивает
   preserve-3d, и вместо 3d-флипа карта зеркалится плоской картинкой. Тень — на гранях. */
.x50-card-inner{ position:relative; display:block; width:100%; height:100%;
  transform-style:preserve-3d; transition:transform .55s cubic-bezier(.3,1.35,.4,1); }
.x50-card.revealed .x50-card-inner{ transform:rotateY(180deg); }
/* выбранная карта чуть выступает из ряда — на неё и смотрят */
.x50-card.chosen .x50-card-inner{ transform:rotateY(180deg) scale(1.07); }
.x50-card-back, .x50-card-front{ position:absolute; inset:0; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:2px; border-radius:10px; overflow:hidden;
  backface-visibility:hidden; -webkit-backface-visibility:hidden; }
/* рубашка: пурпурное сукно с тиснением и золотой рамкой в два контура */
.x50-card-back{
  background:
    radial-gradient(closest-side at 50% 34%, rgba(185,139,255,.28), transparent 72%),
    repeating-linear-gradient(135deg, rgba(255,255,255,.035) 0 5px, transparent 5px 10px),
    linear-gradient(160deg,#453064,#251a3c 55%,#170f26);
  border:1px solid rgba(185,139,255,.5);
  box-shadow:inset 0 0 0 1px rgba(12,8,22,.9), inset 0 0 0 2px rgba(255,194,71,.28),
    inset 0 14px 22px rgba(255,255,255,.05), 0 6px 14px rgba(0,0,0,.45);
  color:#cfa9ff; font-size:24px; font-weight:900;
  text-shadow:0 0 16px rgba(168,107,255,.85), 0 2px 4px rgba(0,0,0,.6);
}
/* бегущий блик по рубашке: колода живая, пока ждёт голосов */
.x50-card-back::after{ content:""; position:absolute; inset:-40% auto -40% -80%; width:55%;
  background:linear-gradient(105deg, transparent, rgba(255,255,255,.14) 45%, rgba(255,255,255,.02) 55%, transparent);
  transform:skewX(-18deg); animation:x50-card-shine 3.4s ease-in-out infinite; }
@keyframes x50-card-shine{
  0%, 55%{ left:-80%; }
  100%{ left:170%; }
}
.x50-card-front{ transform:rotateY(180deg); background:linear-gradient(160deg,#262c37,#151a22);
  border:1px solid rgba(255,255,255,.14);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.7), inset 0 12px 20px rgba(255,255,255,.04),
    0 6px 14px rgba(0,0,0,.45);
  color:#cfd6e0; }
.x50-card-front b{ font-size:24px; line-height:1; text-shadow:0 0 14px currentColor; }
.x50-card-front i{ font-size:7.5px; font-style:normal; font-weight:800; letter-spacing:.08em; opacity:.8; }
/* свой голос виден до вскрытия, чтобы не тыкать дважды */
.x50-card.voted .x50-card-back{ border-color:#b98bff; box-shadow:inset 0 0 0 1px rgba(12,8,22,.9),
  inset 0 0 0 2px rgba(255,194,71,.28), 0 0 16px rgba(168,107,255,.6), 0 6px 14px rgba(0,0,0,.45); }
.x50-card.chosen .x50-card-front{ border-color:#ffc247;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.7), 0 0 22px rgba(255,194,71,.55), 0 6px 14px rgba(0,0,0,.45); }
/* невыбранные карты гаснут — «а вот что вы упустили» */
.x50-card.revealed:not(.chosen){ opacity:.42; }
.x50-card.revealed .x50-card-back::after{ animation:none; }
/* лицевые грани подкрашены под свою мини-игру — не только глифом, но и фоном */
.face-cross .x50-card-front{ color:#ff7a6e;
  background:linear-gradient(160deg, rgba(242,73,94,.2), rgba(22,10,12,.94) 68%); border-color:rgba(242,73,94,.4); }
.face-balloon .x50-card-front{ color:#ff8ac0;
  background:linear-gradient(160deg, rgba(255,138,192,.2), rgba(24,10,18,.94) 68%); border-color:rgba(255,138,192,.4); }
.face-dance .x50-card-front{ color:#f0ecdf;
  background:linear-gradient(160deg, rgba(236,229,210,.18), rgba(20,18,12,.94) 68%); border-color:rgba(236,229,210,.35); }
.face-wheel .x50-card-front{ color:#b98bff;
  background:linear-gradient(160deg, rgba(168,107,255,.22), rgba(16,10,26,.94) 68%); border-color:rgba(168,107,255,.42); }
.face-coinflip .x50-card-front{ color:#ffc247;
  background:linear-gradient(160deg, rgba(255,194,71,.22), rgba(24,16,6,.94) 68%); border-color:rgba(255,194,71,.45); }

/* живой множитель шарика — золото с мягким свечением; лопнул — гаснет в алый */
.x50-bonus-mult{ position:relative; z-index:2; margin-top:auto; font-size:32px; font-weight:900;
  font-variant-numeric:tabular-nums;
  background:linear-gradient(180deg,#ffe9b0,#ffc247 55%,#f08a10);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  filter:drop-shadow(0 3px 14px rgba(0,0,0,.75)) drop-shadow(0 0 18px rgba(255,176,58,.35)); }
.x50-bonus-mult.popped{ background:linear-gradient(180deg,#ff8a97,#f2495e 60%,#c4162e);
  -webkit-background-clip:text; background-clip:text;
  filter:drop-shadow(0 3px 14px rgba(0,0,0,.75)) drop-shadow(0 0 18px rgba(242,73,94,.45)); }

.x50-bonus-vote{ position:relative; z-index:2; display:grid; grid-template-columns:1fr 1fr;
  gap:8px; width:100%; padding:0 12px; margin-top:6px; }
.rakes-app .x50-vote-btn{ padding:11px 0; border-radius:13px; font-size:13.5px; font-weight:900;
  letter-spacing:.06em; min-height:0; border:1px solid rgba(255,255,255,.12);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1), 0 4px 12px rgba(0,0,0,.35);
  transition:transform .12s ease, box-shadow .18s ease; }
.rakes-app .x50-vote-btn:active{ transform:scale(.96); }
.rakes-app .x50-vote-btn.blow{ background:linear-gradient(180deg,rgba(255,138,192,.28),rgba(198,43,109,.12));
  border-color:rgba(255,138,192,.5); color:#ff8ac0; text-shadow:0 0 12px rgba(255,138,192,.45); }
.rakes-app .x50-vote-btn.stop{ background:linear-gradient(180deg,rgba(143,232,79,.24),rgba(60,120,30,.1));
  border-color:rgba(143,232,79,.45); color:#8FE84F; text-shadow:0 0 12px rgba(143,232,79,.4); }
.rakes-app .x50-vote-btn.mine{ box-shadow:0 0 0 2px currentColor inset, 0 0 18px rgba(0,0,0,.3),
  0 0 16px currentColor; }
.rakes-app .x50-vote-btn[disabled]{ opacity:.4; }

.x50-bonus-tally{ position:relative; z-index:2; padding:5px 0 8px; font-size:10px; color:#98a0ac;
  letter-spacing:.03em; min-height:14px; text-shadow:0 1px 4px rgba(0,0,0,.6); }

@media (max-height: 700px){
  .x50-bonus-mult{ font-size:25px; }
  .x50-card-front b{ font-size:19px; }
}