:root {
  --bg: #00050a;
  --bg2: #050a15;
  --surface: rgba(8, 16, 32, 0.92);
  --surface2: rgba(12, 24, 48, 0.88);
  --text: #f0f6ff;
  --muted: #8ba3c7;
  --accent: #00e5ff;
  --accent2: #007bff;
  --accent-soft: rgba(0, 229, 255, 0.12);
  --ok: #00e5a0;
  --warn: #ffb020;
  --danger: #ff5c7a;
  --border: rgba(0, 180, 255, 0.18);
  --shadow: 0 18px 50px rgba(0, 0, 0, 0.45);
  --glow: 0 0 28px rgba(0, 229, 255, 0.28);
  --radius: 16px;
  --radius-lg: 22px;
  --font: "Sora", system-ui, sans-serif;
  --header-h: 64px;
  --bottom-h: 0px;
  --desk-side: 272px;
  --desk-side-min: 68px;
}

.mv-maint-banner {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 90;
  background: #ff5c7a;
  color: #14040a;
  font-weight: 800;
  text-align: center;
  padding: 10px 12px;
  font-size: 0.85rem;
}
html.mv-maint { padding-top: 0; }
html.mv-maint body { padding-top: calc(var(--header-h) + 42px); }
html.mv-maint .site-header { top: 42px; }
* { box-sizing: border-box; }
html, body {
  margin: 0;
  min-height: 100%;
  max-width: 100%;
}
html { overflow-x: hidden; scrollbar-width: none; }
html::-webkit-scrollbar { width: 0; height: 0; display: none; }
body {
  font-family: var(--font);
  background:
    radial-gradient(1200px 600px at 80% -10%, rgba(0, 123, 255, 0.18), transparent 55%),
    radial-gradient(900px 500px at -10% 20%, rgba(0, 229, 255, 0.08), transparent 50%),
    linear-gradient(180deg, var(--bg) 0%, var(--bg2) 100%);
  color: var(--text);
  padding-top: var(--header-h);
  padding-bottom: calc(var(--bottom-h) + env(safe-area-inset-bottom));
  scrollbar-width: none;
}
body::-webkit-scrollbar { width: 0; height: 0; display: none; }
a { color: var(--accent); text-decoration: none; }
img { max-width: 100%; display: block; }
button, input, select { font-family: inherit; }
.wrap {
  width: min(1180px, calc(100% - 32px));
  margin: 0 auto;
  min-width: 0;
}

.site-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 80;
  overflow: visible;
  background: #16181e;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.nav {
  display: flex;
  align-items: center;
  gap: 18px;
  min-height: var(--header-h);
  flex-wrap: nowrap;
}
.brand {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #fff;
  font-weight: 800;
  letter-spacing: -0.04em;
  font-size: 1.42rem;
  white-space: nowrap;
  min-width: 0;
  flex: 0 0 auto;
  line-height: 1;
}
.brand-word {
  font-style: italic;
  font-weight: 800;
  color: #fff;
}
.brand-short { display: none; }
.brand img.brand-logo {
  display: block;
  height: 42px;
  width: auto;
  max-width: min(220px, 48vw);
  border-radius: 0;
  object-fit: contain;
  flex-shrink: 0;
  filter: drop-shadow(0 0 10px rgba(255, 255, 255, 0.12));
}
.brand img,
.brand-mark {
  display: block;
  width: 32px;
  height: 32px;
  border-radius: 9px;
  flex-shrink: 0;
}
.auth-brand {
  display: block;
  height: 52px;
  width: auto;
  max-width: 240px;
  margin: 0 auto 14px;
  object-fit: contain;
}
.site-header .brand { margin-right: 8px; }
.nav-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.top-bets {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  min-width: 0;
}
.top-bet {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  padding: 0 14px;
  border-radius: 999px;
  border: 0;
  background: #2a2e36;
  color: #fff;
  font-size: 0.8rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  white-space: nowrap;
}
.top-bet:hover { background: #343a44; }
.top-bet.is-on {
  background: #2f6bff;
  color: #fff;
}
.bal {
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 0.78rem;
  font-weight: 700;
  cursor: pointer;
  min-width: 0;
  max-width: 220px;
}
.bal b { color: var(--ok); }
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 0;
  cursor: pointer;
  border-radius: 12px;
  font-weight: 700;
  padding: 0.7rem 1rem;
  font-size: 0.86rem;
}
.btn-primary {
  color: #041018;
  background: linear-gradient(135deg, #00f2ff 0%, #007bff 100%);
  box-shadow: var(--glow);
}
.btn-ghost {
  background: transparent;
  color: var(--text);
  border: 1px solid var(--border);
}
.btn-soft { background: var(--accent-soft); color: var(--accent); }
.btn-sm { padding: 0.45rem 0.75rem; font-size: 0.78rem; min-height: 38px; }
.icon-btn {
  width: 38px; height: 38px; border-radius: 10px;
  border: 1px solid var(--border); background: transparent; color: var(--text); cursor: pointer;
}
.search-btn { display: none; }

body[data-page="home"] .section { margin: 22px 0 4px; }
body[data-page="home"] .section-head h2 { font-size: 1.12rem; }
body[data-page="home"] .game-rail {
  gap: 8px;
  padding-right: 8px;
  scroll-padding-left: 2px;
}
body[data-page="home"] .gcard {
  flex-basis: 140px;
  width: 140px;
}
@media (min-width: 1180px) {
  body[data-page="home"] .gcard { flex-basis: 152px; width: 152px; }
  .home-banners .home-ban { height: 460px; }
}
@media (min-width: 1440px) {
  .home-banners .home-ban { height: 500px; }
}
.home-banners,
.cas-banners {
  position: relative;
  display: block;
  margin: 4px 0 16px;
}
.cas-banners { margin: 0 0 16px; }
.ban-track {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.ban-track::-webkit-scrollbar { display: none; }
.ban-dots { display: none; }
.home-ban {
  position: relative;
  overflow: hidden;
  border-radius: 18px;
  display: block;
  flex: 0 0 calc((100% - 12px) / 2.28);
  width: calc((100% - 12px) / 2.28);
  height: 196px;
  color: #fff;
  background: #1a1d24;
  scroll-snap-align: start;
}
.home-ban img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.home-ban-body {
  position: relative;
  z-index: 1;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  padding: 18px 20px 18px;
  background: linear-gradient(90deg, rgba(8, 10, 16, 0.78) 0%, rgba(8, 10, 16, 0.28) 52%, transparent 78%);
}
.home-ban-body small {
  font-size: 0.78rem;
  font-weight: 600;
  color: rgba(255,255,255,.82);
}
.home-ban-body b {
  display: block;
  font-size: clamp(1.35rem, 2.2vw, 2.15rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.05;
  margin: 4px 0 2px;
}
.home-ban-body > span {
  font-size: 1rem;
  font-weight: 700;
}
.ban-btn {
  margin-top: 12px;
  display: inline-flex;
  align-items: center;
  height: 34px;
  padding: 0 16px;
  border-radius: 999px;
  background: #fff;
  color: #15171c;
  font-style: normal;
  font-size: 0.82rem;
  font-weight: 800;
}
.home-ban:hover .ban-btn { filter: brightness(0.95); }
.ban-nav {
  position: absolute;
  top: 50%;
  z-index: 8;
  width: 48px;
  height: 48px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #fff;
  color: #111827;
  cursor: pointer;
  display: grid;
  place-items: center;
  transform: translateY(-50%);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45);
}
.ban-nav svg {
  width: 22px;
  height: 22px;
  display: block;
}
.ban-nav:hover {
  background: #f8fafc;
  transform: translateY(-50%) scale(1.06);
}
.ban-nav:disabled {
  opacity: 0.38;
  cursor: default;
  transform: translateY(-50%);
}
.ban-nav--prev { left: 10px; }
.ban-nav--next { right: 10px; }
.home-banners.is-single .ban-nav,
.cas-banners.is-single .ban-nav { display: none; }
@media (min-width: 981px) {
  .home-banners .ban-track { gap: 16px; }
  .home-banners .home-ban {
    flex: 0 0 calc((100% - 16px) / 2.02);
    width: calc((100% - 16px) / 2.02);
    height: 420px;
    border-radius: 24px;
  }
  .home-banners .home-ban-body {
    padding: 32px 32px 28px;
  }
  .home-banners .home-ban-body small { font-size: 0.95rem; }
  .home-banners .home-ban-body b {
    font-size: clamp(2.2rem, 3.6vw, 3.4rem);
    margin: 8px 0 6px;
  }
  .home-banners .home-ban-body > span { font-size: 1.22rem; }
  .home-banners .ban-btn {
    height: 44px;
    margin-top: 18px;
    padding: 0 22px;
    font-size: 0.95rem;
  }
  .home-banners .ban-nav {
    width: 56px;
    height: 56px;
  }
  .home-banners .ban-nav svg { width: 24px; height: 24px; }
}
.home-banners.is-hero {
  margin: 4px 0 16px;
}
.home-banners.is-hero .home-ban {
  flex: none;
  width: 100%;
  height: 188px;
  border-radius: 20px;
  border: 1px solid rgba(61, 255, 195, 0.22);
  background: #05080f;
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.32);
}
.home-banners.is-hero .home-ban-walls {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.home-banners.is-hero .home-ban-walls img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 82% 28%;
  opacity: 0;
  transition: opacity 0.7s ease;
  z-index: 0;
}
.home-banners.is-hero .home-ban-walls img.is-on { opacity: 1; }
.home-banners.is-hero .home-ban-brand {
  position: absolute;
  inset: auto;
  top: 12px;
  right: 14px;
  left: auto;
  bottom: auto;
  z-index: 3;
  height: 28px;
  width: auto;
  max-width: 38%;
  object-fit: contain;
  pointer-events: none;
  filter: drop-shadow(0 6px 14px rgba(0, 0, 0, 0.55));
}
.home-banners.is-hero .home-ban-body {
  padding: 16px 16px 16px;
  background: linear-gradient(90deg, rgba(5, 8, 14, 0.94) 0%, rgba(5, 8, 14, 0.58) 38%, rgba(5, 8, 14, 0.12) 68%, transparent 100%);
}
.home-banners.is-hero .home-ban-body small {
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 800;
  font-size: 0.68rem;
  color: #3dffc3;
}
.home-banners.is-hero .home-ban-body b {
  color: #3dffc3;
  font-size: clamp(1.9rem, 6vw, 3.2rem);
  line-height: 0.9;
  letter-spacing: -0.04em;
  margin: 4px 0 6px;
}
.home-banners.is-hero .home-ban-body > span {
  color: rgba(255, 255, 255, 0.78);
  font-weight: 600;
  max-width: 22rem;
  font-size: 0.88rem;
}
.home-banners.is-hero .ban-btn {
  background: #3dffc3;
  color: #04140e;
  margin-top: 10px;
  height: 32px;
  padding: 0 14px;
  font-size: 0.8rem;
}
.home-banners.is-hero .home-ban:hover .ban-btn { filter: brightness(1.05); }
.home-banners.is-hero .ban-dots {
  display: flex;
  gap: 6px;
  position: absolute;
  right: 16px;
  bottom: 12px;
  left: auto;
  z-index: 4;
  pointer-events: auto;
}
.home-banners.is-hero .ban-dots i { cursor: pointer; }
@media (min-width: 981px) {
  .home-banners.is-hero .home-ban {
    flex: none;
    width: 100%;
    height: 320px;
    border-radius: 22px;
  }
  .home-banners.is-hero .home-ban-brand {
    top: 18px;
    right: 22px;
    left: auto;
    height: 40px;
  }
  .home-banners.is-hero .home-ban-body {
    padding: 28px 32px 26px;
  }
  .home-banners.is-hero .home-ban-body small { font-size: 0.78rem; }
  .home-banners.is-hero .home-ban-body > span { font-size: 1.02rem; max-width: 26rem; }
  .home-banners.is-hero .ban-btn {
    height: 40px;
    margin-top: 14px;
    padding: 0 18px;
    font-size: 0.88rem;
  }
}
@media (min-width: 1440px) {
  .home-banners.is-hero .home-ban { height: 360px; }
}
.home-empty {
  margin: 0;
  padding: 22px 16px;
  border-radius: 14px;
  background: #1a1d24;
  color: #8b93a3;
  font-size: 0.88rem;
  text-align: center;
}
.home-rail {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  padding-bottom: 4px;
  scrollbar-width: none;
}
.home-rail::-webkit-scrollbar { display: none; }
.mgame {
  flex: 0 0 148px;
  height: 168px;
  border-radius: 14px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  padding: 14px;
  color: #fff;
  font-weight: 800;
  font-size: 1.15rem;
  letter-spacing: -0.02em;
  background: #2a2e38;
}
.mgame.is-lucky { background: linear-gradient(160deg, #7c3aed, #3b0764); }
.mgame.is-rocket { background: linear-gradient(160deg, #2563eb, #0f172a); }
.mgame.is-bj { background: linear-gradient(160deg, #0f766e, #042f2e); }
.mgame.is-limbo { background: linear-gradient(160deg, #ea580c, #7c2d12); }
.mgame.is-crash { background: linear-gradient(160deg, #db2777, #4a044e); }
.mgame:hover { filter: brightness(1.08); color: #fff; }
.mgame small {
  display: none;
}

.cas-page { padding-top: 10px; }
.cas-sub {
  display: flex;
  gap: 8px;
  margin: 4px 0 14px;
  flex-wrap: wrap;
}
.cas-tab {
  display: inline-flex;
  align-items: center;
  height: 36px;
  padding: 0 14px;
  border-radius: 999px;
  background: #2a2e36;
  color: #fff;
  font-weight: 700;
  font-size: 0.84rem;
}
.cas-tab.is-on, .cas-tab:hover { background: #2f6bff; color: #fff; }
.cas-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 12px;
}
.cas-search, .cas-provs {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 42px;
  border: 0;
  border-radius: 999px;
  background: #2a2e36;
  color: #fff;
  font: inherit;
  font-weight: 700;
  font-size: 0.88rem;
  cursor: pointer;
}
.cas-search { flex: 1; justify-content: flex-start; padding: 0 16px; color: #9aa3b2; }
.cas-search span { font-size: 1.05rem; }
.cas-provs { flex: 0 0 auto; padding: 0 16px; }
.cas-provs svg { width: 16px; height: 16px; display: block; }
.cas-search:hover, .cas-provs:hover { background: #343a44; color: #fff; }
.cas-pills {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  margin: 0 0 8px;
  padding-bottom: 4px;
  scrollbar-width: none;
}
.cas-pills::-webkit-scrollbar { display: none; }
.cas-pill {
  flex: 0 0 auto;
  height: 36px;
  padding: 0 12px;
  border-radius: 999px;
  background: #2a2e36;
  color: #fff;
  font-size: 0.8rem;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
}
.cas-pill.is-on { background: #2f6bff; }

.find-modal {
  position: fixed;
  inset: 0;
  z-index: 110;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px 12px;
  background: rgba(0, 0, 0, 0.55);
}
.find-modal.open { display: flex; }
.find-sheet {
  width: min(720px, 100%);
  max-height: min(88dvh, 820px);
  overflow: auto;
  background: #f3f5f8;
  color: #1c1f26;
  border-radius: 20px;
  padding: 16px 16px 20px;
  box-shadow: 0 24px 60px rgba(0,0,0,.4);
}
.find-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}
.find-head h3 { margin: 0; font-size: 1.28rem; font-weight: 800; }
.find-x {
  width: 32px; height: 32px;
  border: 0; background: transparent;
  color: #8a93a3; font-size: 1.4rem; cursor: pointer; line-height: 1;
}
.find-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  padding: 4px;
  border-radius: 999px;
  background: #e4e7ed;
  margin-bottom: 12px;
}
.find-tabs button {
  height: 36px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #5b6472;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.find-tabs button.is-on {
  background: #fff;
  color: #1c1f26;
  box-shadow: 0 1px 4px rgba(0,0,0,.08);
}
.find-q {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 44px;
  padding: 0 14px;
  border-radius: 12px;
  background: #fff;
  border: 1px solid #d5dae3;
  margin-bottom: 14px;
  color: #8a93a3;
}
.find-q:focus-within { border-color: #2f6bff; }
.find-q input {
  flex: 1;
  border: 0;
  outline: none;
  background: transparent;
  font: inherit;
  color: #1c1f26;
}
.find-body { min-height: 180px; }
.find-empty { margin: 8px 0 16px; color: #8a93a3; font-size: 0.88rem; }
.find-count {
  margin: 0 0 10px;
  font-size: 0.75rem;
  font-weight: 700;
  color: #8a93a3;
}
.find-more {
  margin: 12px 0 0;
  text-align: center;
  color: #8a93a3;
  font-size: 0.78rem;
}
.find-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.find-g {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  font: inherit;
  text-align: left;
  color: #1c1f26;
}
.find-g img,
.find-g-ph {
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  border-radius: 10px;
  background: #d8dde6;
  display: block;
}
.find-g-ph {
  display: grid;
  place-items: center;
  font-weight: 800;
  color: #5b6472;
  font-size: 1.2rem;
}
.find-g b {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 0.68rem;
  line-height: 1.25;
}
.find-g small { color: #8a93a3; font-size: 0.62rem; }
.find-rail-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 12px 0 8px;
  font-size: 0.95rem;
}
.find-rail-head a { color: #8a93a3; font-size: 0.8rem; font-weight: 700; }
.find-hits { display: grid; gap: 8px; }
.find-hit {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 8px;
  border: 0;
  border-radius: 12px;
  background: #fff;
  text-align: left;
  cursor: pointer;
  font: inherit;
}
.find-hit img { width: 40px; height: 52px; object-fit: cover; border-radius: 8px; }
.find-hit b { display: block; color: #1c1f26; }
.find-hit small { color: #8a93a3; }
.prov-h {
  margin: 14px 0 8px;
  font-size: 0.75rem;
  font-weight: 700;
  color: #8a93a3;
}
.prov-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.prov-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 14px 8px 12px;
  border: 0;
  border-radius: 12px;
  background: #e8eaef;
  cursor: pointer;
  font: inherit;
  font-size: 0.72rem;
  font-weight: 700;
  color: #1c1f26;
  text-align: center;
}
.prov-card:hover { background: #dde1e8; }
.prov-logo {
  width: 100%;
  height: 52px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 2px 8px rgba(8, 16, 32, 0.12);
}
.prov-logo svg,
.prov-logo img {
  width: 100%;
  height: 52px;
  display: block;
  object-fit: contain;
  padding: 4px 8px;
  box-sizing: border-box;
}

.intro {
  padding: 22px 0 8px;
}
.intro h1 {
  margin: 0 0 8px;
  font-size: clamp(1.7rem, 3.4vw, 2.6rem);
  letter-spacing: -0.03em;
}
.intro p {
  margin: 0 0 14px;
  color: var(--muted);
  max-width: 48ch;
}
.hero-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 8px; }

.cats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 22px 0; }
.cat {
  position: relative; overflow: hidden; border-radius: 18px; min-height: 140px;
  border: 1px solid var(--border); color: #fff;
}
.cat img { width: 100%; height: 140px; object-fit: cover; }
.cat span {
  position: absolute; left: 12px; bottom: 12px; font-weight: 800; letter-spacing: 0.04em;
  text-shadow: 0 8px 24px #000;
}
.cat:hover { outline: 1px solid var(--accent); }

.section { margin: 28px 0 8px; }
.section-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.section-head h2 { margin: 0; font-size: 1.2rem; font-weight: 800; }
.section-head p, .hint { margin: 0; color: var(--muted); font-size: 0.84rem; }
.section-head a h2 { display: inline; }
.section-head a { color: inherit; text-decoration: none; }
.head-actions { display: flex; align-items: center; gap: 10px; margin-left: auto; flex: none; }
.head-actions a { color: inherit; text-decoration: none; font-size: 0.86rem; font-weight: 700; white-space: nowrap; }
.head-actions .rail-nav { margin-left: 0; }
.rail-nav { display: flex; gap: 6px; margin-left: auto; flex: none; }
.rail-btn {
  width: 32px; height: 32px; border: 0; border-radius: 50%;
  background: rgba(255,255,255,.1); color: #fff; font-size: 1.15rem; line-height: 1;
  cursor: pointer; display: grid; place-items: center; padding: 0;
}
.rail-btn:hover { background: rgba(255,255,255,.18); }
.rail-btn:disabled { opacity: .28; cursor: default; }
.grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.game-rail,
.grid[data-games] {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 2px;
}
.game-rail::-webkit-scrollbar,
.grid[data-games]::-webkit-scrollbar { display: none; }
.game-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(132px, 1fr));
  gap: 10px;
}
.game-grid .gcard {
  flex: none;
  width: auto;
}
.game-rail .home-empty,
.game-rail .hint,
.grid[data-games] .home-empty,
.grid[data-games] .hint { flex: 1; }
.card {
  background: #12151c;
  border: 0;
  border-radius: 10px;
  overflow: hidden;
  cursor: pointer;
  transition: transform .18s ease;
}
.gcard {
  flex: 0 0 132px;
  width: 132px;
  scroll-snap-align: start;
}
@media (min-width: 1180px) {
  .gcard { flex-basis: 138px; width: 138px; }
}
.gcard:hover { transform: translateY(-2px); }
.gcard .thumb {
  aspect-ratio: 3 / 4;
  background: #0b1220;
}
.gcard .thumb::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.42) 0%, transparent 28%, rgba(0,0,0,.62) 100%);
  pointer-events: none;
}
.gcard img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  aspect-ratio: auto;
}
.gcard-prov {
  position: absolute;
  top: 8px;
  left: 8px;
  right: 8px;
  z-index: 2;
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(255,255,255,.78);
  text-shadow: 0 1px 6px #000;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.gcard-title {
  position: absolute;
  left: 7px;
  right: 7px;
  bottom: 26px;
  z-index: 2;
  font-size: 0.72rem;
  font-weight: 800;
  line-height: 1.15;
  text-align: center;
  text-transform: uppercase;
  text-shadow: 0 2px 10px #000;
}
.gcard-live {
  position: absolute;
  left: 8px;
  bottom: 7px;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 0.62rem;
  color: rgba(255,255,255,.8);
}
.gcard-live i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #3ddc84;
  box-shadow: 0 0 6px #3ddc84;
}
.card img { width: 100%; aspect-ratio: 3/4; object-fit: cover; }
.card-body { padding: 10px 12px 12px; }
.card-body strong { display: block; font-size: 0.86rem; }
.meta { color: var(--muted); font-size: 0.72rem; margin-top: 4px; display: flex; justify-content: space-between; }
.badge {
  position: absolute; top: 8px; right: 8px; z-index: 3;
  background: rgba(0,0,0,.55); border: 1px solid var(--border);
  color: var(--accent); font-size: 0.58rem; font-weight: 800;
  padding: 3px 6px; border-radius: 999px; letter-spacing: .06em;
}
.thumb { position: relative; aspect-ratio: 3 / 4; background: #0b1220; }

.filters { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.chip {
  border: 1px solid var(--border); background: transparent; color: var(--muted);
  border-radius: 999px; padding: 7px 12px; font-weight: 700; font-size: 0.78rem; cursor: pointer;
}
.chip.is-on, .chip:hover { color: var(--text); background: var(--accent-soft); border-color: transparent; }

.match, .event, .prov, .promo, .vip-card {
  background: var(--surface); border: 1px solid var(--border); border-radius: 18px; padding: 14px;
}
.matches, .events, .provs, .promos { display: grid; gap: 10px; }
.events.game-rail,
.matches.game-rail {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.events.game-rail::-webkit-scrollbar,
.matches.game-rail::-webkit-scrollbar { display: none; }
.ev-card {
  flex: 0 0 268px;
  width: 268px;
  min-width: 268px;
  max-width: 268px;
  scroll-snap-align: start;
  box-sizing: border-box;
}
.match { display: grid; grid-template-columns: 1.4fr 1fr; gap: 10px; align-items: center; }
.match-teams { font-weight: 800; }
.match-liga { color: var(--muted); font-size: 0.75rem; margin-top: 4px; }
.odds { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.odds-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.odd {
  border: 1px solid var(--border); background: rgba(0,0,0,.25); color: var(--text);
  border-radius: 12px; padding: 8px 6px; cursor: pointer; text-align: center;
}
.odd small { display: block; color: var(--muted); font-size: 0.65rem; }
.odd b { color: var(--accent); }
.odd:hover, .odd.is-on { border-color: var(--accent); background: var(--accent-soft); }
.odd.odd-up {
  background: rgba(62, 224, 122, 0.2) !important;
  border-color: #3ee07a !important;
  box-shadow: 0 0 14px rgba(62, 224, 122, 0.4);
}
.odd.odd-up b { color: #3ee07a !important; }
.odd.odd-down {
  background: rgba(255, 92, 122, 0.2) !important;
  border-color: #ff5c7a !important;
  box-shadow: 0 0 14px rgba(255, 92, 122, 0.4);
}
.odd.odd-down b { color: #ff5c7a !important; }
@keyframes oddFlashUp {
  0% { box-shadow: 0 0 0 0 rgba(62, 224, 122, 0.85); transform: scale(1.04); }
  100% { box-shadow: 0 0 14px rgba(62, 224, 122, 0.4); transform: scale(1); }
}
@keyframes oddFlashDown {
  0% { box-shadow: 0 0 0 0 rgba(255, 92, 122, 0.85); transform: scale(1.04); }
  100% { box-shadow: 0 0 14px rgba(255, 92, 122, 0.4); transform: scale(1); }
}
.odd.odd-flash-up { animation: oddFlashUp 0.35s ease-out; }
.odd.odd-flash-down { animation: oddFlashDown 0.35s ease-out; }
.odd-empty { opacity: .35; cursor: default; display: flex; align-items: center; justify-content: center; font-size: 0.8rem; }

.line-matches { display: block; }
.line-block { margin-bottom: 14px; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; overflow: hidden; }
.line-liga { padding: 8px 12px; font-size: 0.72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); background: rgba(255,255,255,.03); }
.line-table { overflow-x: auto; }
.line-head, .line-row {
  display: grid;
  grid-template-columns: 88px minmax(140px, 1.4fr) repeat(3, 64px) 52px repeat(2, 64px) 52px repeat(2, 64px);
  gap: 6px; align-items: center; padding: 6px 10px; min-width: 860px;
}
.line-head { color: var(--muted); font-size: 0.65rem; font-weight: 700; text-transform: uppercase; border-bottom: 1px solid var(--border); }
.line-row { border-top: 1px solid rgba(255,255,255,.04); }
.line-row.is-live { background: rgba(255,45,85,.08); }
.line-time { font-size: 0.75rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.line-row.is-live .line-time { color: #ff2d55; font-weight: 800; }
.line-teams { display: flex; flex-direction: column; gap: 2px; font-size: 0.88rem; }
.line-teams b { font-weight: 700; }
.line-val { text-align: center; font-size: 0.72rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.line-row .odd { padding: 6px 4px; border-radius: 8px; }

.live-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.live-tile { position: relative; overflow: hidden; border-radius: 18px; border: 1px solid var(--border); min-height: 180px; cursor: pointer; }
.live-tile img { width: 100%; height: 180px; object-fit: cover; }
.live-tile .onair {
  position: absolute; top: 10px; left: 10px; background: #ff2d55; color: #fff;
  font-size: 0.65rem; font-weight: 800; padding: 4px 7px; border-radius: 999px;
}
.live-tile figcaption {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 12px;
  background: linear-gradient(transparent, #000); font-weight: 800;
}

.provs { grid-template-columns: repeat(4, 1fr); display: grid; }
.prov { text-align: center; min-height: 120px; display: flex; flex-direction: column; justify-content: center; gap: 6px; }
.prov .mark {
  width: 100%; height: 56px; margin: 0 auto 4px; border-radius: 12px;
  display: grid; place-items: center; overflow: hidden;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}
.prov .mark svg,
.prov .mark img {
  width: 100%; height: 56px; display: block; object-fit: contain;
  padding: 6px 10px; box-sizing: border-box;
}
.prov small { color: var(--muted); }

.promos { grid-template-columns: repeat(3, 1fr); display: grid; }
.promo h3 { margin: 0 0 6px; }
.promo p { margin: 0; color: var(--muted); font-size: 0.84rem; }
a.promo-logo {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 240px;
  padding: 18px 16px 16px;
  text-decoration: none;
  color: #fff;
  overflow: hidden;
  position: relative;
  border-color: rgba(61, 255, 195, 0.28);
  background: #0c1210;
}
a.promo-logo img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 72% 18%;
  z-index: 0;
}
a.promo-logo::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, rgba(6, 10, 12, 0.15) 20%, rgba(6, 10, 12, 0.88) 100%);
}
a.promo-logo > * { position: relative; z-index: 2; }
a.promo-logo:hover { border-color: #3dffc3; color: #fff; }
a.promo-logo.is-gold { border-color: rgba(242, 186, 74, 0.4); }
a.promo-logo.is-gold:hover { border-color: #f2ba4a; }
a.promo-logo.is-gold .promo-logo-kicker,
a.promo-logo.is-gold .promo-logo-pct { color: #f2ba4a; }
a.promo-logo.is-blue { border-color: rgba(80, 160, 255, 0.4); }
a.promo-logo.is-blue:hover { border-color: #6eb0ff; }
a.promo-logo.is-blue .promo-logo-kicker,
a.promo-logo.is-blue .promo-logo-pct { color: #7ec4ff; }
a.promo-logo.is-sport { border-color: rgba(61, 255, 120, 0.4); }
a.promo-logo.is-sport:hover { border-color: #3dff78; }
a.promo-logo.is-sport .promo-logo-kicker,
a.promo-logo.is-sport .promo-logo-pct { color: #7dff9a; }
.promo-logo-kicker {
  position: absolute;
  top: 14px;
  left: 16px;
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #3dffc3;
}
.promo-logo-pct {
  font-size: clamp(3rem, 8vw, 4.2rem);
  font-weight: 800;
  line-height: 0.9;
  letter-spacing: -0.04em;
  color: #3dffc3;
  margin: 0 0 10px;
}
a.promo-logo h3 { margin: 0 0 4px; font-size: 1.25rem; color: #fff; }
a.promo-logo p { color: rgba(255, 255, 255, 0.72); }
@media (max-width: 720px) {
  a.promo-logo { grid-column: 1 / -1; min-height: 200px; }
}

.cb-lead { max-width: 40rem; color: var(--muted); font-size: 0.95rem; line-height: 1.45; margin: 0 0 18px; }
.cb-hero {
  position: relative;
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid rgba(61, 255, 195, 0.22);
  min-height: 220px;
  margin: 8px 0 20px;
}
.cb-hero img { width: 100%; height: 280px; object-fit: cover; object-position: 70% 22%; display: block; }
.cb-hero-body {
  position: absolute;
  inset: auto 0 0 0;
  padding: 22px 20px 18px;
  background: linear-gradient(180deg, transparent, rgba(5, 8, 10, 0.92));
}
.cb-hero-body small {
  display: block;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-size: 0.72rem;
  font-weight: 800;
  color: #3dffc3;
  margin-bottom: 6px;
}
.cb-hero-body h1 { margin: 0 0 6px; font-size: clamp(1.8rem, 4vw, 2.6rem); color: #fff; }
.cb-hero-body p { margin: 0; color: rgba(255,255,255,.78); max-width: 36rem; }
.cb-levels {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
  margin: 0 0 22px;
}
.cb-lvl {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: #12151c;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 18px;
  padding: 0;
  min-width: 0;
}
.cb-lvl img {
  width: 100%;
  height: 132px;
  object-fit: cover;
  display: block;
}
.cb-lvl-body { padding: 12px 14px 14px; }
.cb-lvl b {
  display: block;
  font-size: 1.55rem;
  color: #3dffc3;
  font-weight: 800;
  margin: 0 0 4px;
}
.cb-lvl h3 { margin: 0 0 6px; font-size: 0.95rem; color: #fff; }
.cb-lvl p { margin: 0; color: #9aa3b2; font-size: 0.78rem; line-height: 1.4; }
.cb-rules {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 16px 18px 8px;
  margin-bottom: 24px;
}
.cb-rules h2 { margin: 0 0 10px; font-size: 1.05rem; }
.cb-rules ul { margin: 0 0 12px; padding-left: 18px; color: var(--muted); font-size: 0.88rem; }
.cb-rules li { margin: 0 0 8px; }
.terms-toc {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px 18px;
  margin: 0 0 14px;
  padding: 0;
  list-style: none;
}
.terms-toc a {
  color: var(--accent);
  text-decoration: none;
  font-size: 0.82rem;
  line-height: 1.35;
}
.terms-toc a:hover { text-decoration: underline; }
.terms-part {
  margin: 14px 0 4px;
  padding: 12px 0 0;
  border-top: 1px solid var(--border);
}
.terms-part:first-of-type { border-top: 0; padding-top: 0; }
.terms-part h3 {
  margin: 0 0 10px;
  font-size: 0.9rem;
  color: var(--accent);
  font-weight: 700;
}
.terms-p {
  display: grid;
  grid-template-columns: 4.6rem 1fr;
  gap: 8px 10px;
  margin: 0 0 10px;
  color: var(--muted);
  font-size: 0.86rem;
  line-height: 1.5;
}
.terms-p .mark {
  color: #c5d4ea;
  font-weight: 700;
  font-size: 0.75rem;
  letter-spacing: 0.02em;
  padding-top: 2px;
}
@media (max-width: 720px) {
  .terms-toc { grid-template-columns: 1fr; }
  .terms-p { grid-template-columns: 1fr; gap: 2px; }
}
.cb-warn {
  border-color: rgba(255, 122, 136, 0.35);
  background: linear-gradient(180deg, rgba(80, 18, 28, 0.35), var(--surface));
}
.cb-warn h2 { color: #ff8a96; }
@media (max-width: 1100px) {
  .cb-levels { grid-template-columns: repeat(3, 1fr); }
  .cb-hero img { height: 220px; }
}
body[data-page="welcome"] .cb-levels,
body[data-page="sportbonus"] .cb-levels { grid-template-columns: repeat(4, 1fr); }
body[data-page="express"] .cb-levels { grid-template-columns: repeat(5, 1fr); }
@media (max-width: 1100px) {
  body[data-page="welcome"] .cb-levels,
  body[data-page="sportbonus"] .cb-levels { grid-template-columns: repeat(2, 1fr); }
  body[data-page="express"] .cb-levels { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
  .cb-levels { grid-template-columns: 1fr; }
  .cb-hero img { height: 180px; }
}

.vip-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.vip-card h3 { margin: 0 0 8px; color: var(--accent); }
.vip-card ul { margin: 0; padding-left: 16px; color: var(--muted); font-size: 0.84rem; }

.page-hero { padding: 22px 0 8px; }
.page-hero h1 { margin: 0 0 6px; font-size: clamp(1.6rem, 3vw, 2.3rem); }
.cover {
  border-radius: 22px; overflow: hidden; border: 1px solid var(--border); margin: 8px 0 18px;
}
.cover img { width: 100%; height: 240px; object-fit: cover; }

.site-footer {
  margin-top: 48px; border-top: 1px solid var(--border); padding: 28px 0 40px;
  color: var(--muted); font-size: 0.82rem;
}
.foot { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 18px; }
.foot strong { color: var(--text); display: block; margin-bottom: 8px; }
.foot a { display: block; color: var(--muted); padding: 3px 0; }
.foot a:hover { color: var(--text); }
.legal { margin-top: 18px; font-size: 0.72rem; opacity: .8; }
.rules-home {
  margin-top: 22px;
  text-align: center;
}
.rules-home .btn {
  min-width: 240px;
}


.modal {
  position: fixed; inset: 0; z-index: 120; display: none; place-items: center;
  background: rgba(0,0,0,.62);
  backdrop-filter: blur(8px);
}
.modal.open { display: grid; }
.sheet.sheet-pick {
  position: relative;
  width: min(280px, calc(100vw - 40px));
  max-width: calc(100% - 28px);
  padding: 0 0 12px;
  overflow: hidden;
  background: #16181e;
  border: 1px solid rgba(255,255,255,.08);
}
.pick-x {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 2;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 10px;
  background: rgba(0,0,0,.45);
  color: #fff;
  cursor: pointer;
  font-size: 1.05rem;
}
.pick-cover {
  position: relative;
  width: 100%;
  line-height: 0;
  background: #12151c;
}
.pick-cover img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: contain;
}
.pick-body { padding: 12px 12px 0; }
.pick-body h3 { margin: 0 0 4px; font-size: 1rem; }
.pick-body .hint { margin: 0; }
.pick-actions {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px 12px 0;
}
.btn-play {
  width: 100%;
  min-height: 50px;
  border: 0;
  border-radius: 12px;
  font-size: 1.05rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #04140a;
  background: linear-gradient(180deg, #6dff9c 0%, #22c55e 55%, #16a34a 100%);
  box-shadow: 0 0 18px rgba(34, 197, 94, 0.45);
  animation: playGlow 1.5s ease-in-out infinite;
}
.btn-play:hover { filter: brightness(1.06); }
.btn-demo {
  width: 100%;
  min-height: 46px;
  border: 0;
  border-radius: 12px;
  font-size: 0.95rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #fff;
  background: #2a3140;
}
.btn-demo:hover { background: #3a4254; }
@keyframes playGlow {
  0%, 100% { box-shadow: 0 0 10px rgba(34, 197, 94, 0.28); }
  50% { box-shadow: 0 0 28px 6px rgba(52, 211, 153, 0.55); }
}
@media (prefers-reduced-motion: reduce) {
  .btn-play { animation: none; }
}
.sheet.sheet-game {
  width: min(1100px, calc(100% - 16px));
  height: min(860px, calc(100svh - 24px));
  padding: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  background: #05070c;
}
.sheet-game h3, .sheet-game .hint { padding: 14px 16px 0; }
.sheet-game .btn { margin: 12px 16px 16px; width: auto; }
.game-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--border);
}
.game-bar strong { font-size: 0.92rem; }
.game-x {
  width: 36px; height: 36px; border: 0; border-radius: 10px;
  background: rgba(255,255,255,.08); color: inherit; cursor: pointer; font-size: 1.1rem;
}
.game-frame {
  flex: 1;
  width: 100%;
  border: 0;
  background: #000;
  min-height: 420px;
}
.thumb-fallback {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-size: 2rem;
  font-weight: 800;
  background: linear-gradient(160deg, #1a2744, #0b1220);
  color: #9ecbff;
}
@media (max-width: 720px) {
  .sheet.sheet-game {
    width: 100%;
    height: 100svh;
    max-height: 100svh;
    border-radius: 0;
  }
}
.sheet {
  width: min(520px, calc(100% - 24px));
  background: #16181e;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 22px;
  padding: 18px;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.7);
  color: #fff;
}
.sheet h3 { margin: 0 0 8px; color: #fff; }
#loginModal .sheet {
  background: #16181e;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.7);
}
#loginModal .sheet h3 {
  color: #fff;
}
#loginModal .sheet .hint {
  color: #c5cad3;
}
#loginModal .field {
  color: #fff;
}
#loginModal .field input {
  background: #0a0b0e;
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: #fff;
}
#loginModal .field input::placeholder {
  color: #8b919c;
}

#loginModal .phone-field {
  display: flex;
  align-items: stretch;
  position: relative;
  margin-top: 6px;
  background: #0a0b0e;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 12px;
}
#loginModal .phone-cc {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 0 10px 0 12px;
  border: 0;
  border-right: 1px solid rgba(255, 255, 255, 0.1);
  background: transparent;
  color: #fff;
  cursor: pointer;
  flex-shrink: 0;
}
#loginModal .phone-flag {
  font-size: 22px;
  line-height: 1;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: #1a1d24;
}
#loginModal .phone-chev {
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 5px solid #c5cad3;
}
#loginModal .field .phone-field input,
#loginModal .phone-field input {
  flex: 1;
  min-width: 0;
  border: 0 !important;
  outline: none;
  box-shadow: none;
  background: transparent !important;
  color: #fff;
  border-radius: 0 12px 12px 0;
  padding: 10px 12px;
}
#loginModal .phone-field:focus-within {
  border-color: rgba(255, 255, 255, 0.28);
}
#loginModal .phone-dd {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 6px);
  z-index: 40;
  max-height: 240px;
  overflow: auto;
  background: #1c1f27;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 12px;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.45);
}
#loginModal .phone-opt {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 10px 12px;
  border: 0;
  background: transparent;
  color: #fff;
  cursor: pointer;
  text-align: left;
  font: inherit;
}
#loginModal .phone-opt:hover,
#loginModal .phone-opt.is-on {
  background: rgba(255, 255, 255, 0.06);
}
#loginModal .phone-opt-name { flex: 1; }
#loginModal .phone-opt-dial { color: #8b919c; font-size: 0.85em; }
#loginModal .auth-terms {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 12px 0 4px;
  font-size: 0.82rem;
  line-height: 1.4;
  color: #c5cad3;
  cursor: pointer;
}
#loginModal .auth-terms input {
  appearance: none;
  -webkit-appearance: none;
  width: 18px;
  height: 18px;
  margin: 2px 0 0;
  flex-shrink: 0;
  border-radius: 4px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  background: #0a0b0e;
  cursor: pointer;
}
#loginModal .auth-terms input:checked {
  border-color: #22c55e;
  background: #22c55e url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' d='M3.5 8.5 6.5 11.5 12.5 4.5'/></svg>") center / 12px no-repeat;
}
#loginModal .auth-terms a {
  color: #4ea3ff;
  text-decoration: none;
}
#loginModal .auth-terms a:hover { text-decoration: underline; }
#loginModal .auth-packs {
  margin: 12px 0 4px;
}
#loginModal .auth-packs-label {
  margin: 0 0 8px;
  color: #c5cad3;
  font-size: 0.85rem;
}
#loginModal .auth-pack-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
#loginModal .auth-pack {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 12px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: #0a0b0e;
  color: #fff;
  text-align: left;
  cursor: pointer;
  font: inherit;
}
#loginModal .auth-pack strong {
  font-size: 0.95rem;
}
#loginModal .auth-pack span {
  color: #8b919c;
  font-size: 0.75rem;
  line-height: 1.35;
}
#loginModal .auth-pack.is-on {
  border-color: #22c55e;
  box-shadow: 0 0 0 1px #22c55e inset;
}
@media (max-width: 520px) {
  #loginModal .auth-pack-row { grid-template-columns: 1fr; }
}
#loginModal .auth-captcha {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
  align-items: stretch;
  margin: 12px 0 4px;
}
#loginModal .auth-captcha-img {
  width: 100%;
  height: 76px;
  object-fit: contain;
  background: #0a0b0e;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 12px;
  user-select: none;
}
#loginModal .auth-captcha-refresh {
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: #0a0b0e;
  color: #c5cad3;
  border-radius: 12px;
  padding: 0 12px;
  cursor: pointer;
  font: inherit;
}

#loginModal .auth-tabs {
  background: #0a0b0e;
  border-color: rgba(255, 255, 255, 0.12);
}
#loginModal .auth-tabs button {
  color: #c5cad3;
}
#loginModal .auth-tabs button.is-on {
  background: #2a2e36;
  color: #fff;
}
#loginModal .btn-ghost {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.16);
  background: transparent;
}
.sheet.sheet-profile {
  position: relative;
  width: min(420px, calc(100% - 28px));
  height: fit-content;
  max-height: none;
  overflow: hidden;
  background: #16181e;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 22px;
  padding: 16px 20px 8px;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.55);
}
.pf-head { position: relative; margin-bottom: 10px; min-height: 24px; }
.sheet-profile .pf-head h3 {
  margin: 0;
  text-align: center;
  font-size: 1.05rem;
  font-weight: 700;
  color: #fff;
}
.pf-x {
  position: absolute;
  right: -6px;
  top: 50%;
  transform: translateY(-50%);
  width: 32px;
  height: 32px;
  border: 0;
  background: transparent;
  color: #fff;
  font-size: 1.35rem;
  cursor: pointer;
  line-height: 1;
}
.pf-who { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pf-name {
  font-size: 1.12rem;
  font-weight: 800;
  color: #fff;
  word-break: break-all;
  line-height: 1.2;
}
.pf-vip {
  display: inline-flex;
  align-items: center;
  height: 18px;
  padding: 0 7px;
  border-radius: 4px;
  background: #00e5ff;
  color: #041018;
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  flex-shrink: 0;
}
.pf-vip.is-cyan { background: #00e5ff; color: #041018; }
.pf-vip.is-blue { background: #007bff; color: #fff; }
.pf-vip.is-ice { background: #c8f7ff; color: #041018; }
.pf-vip.is-void { background: #1a1030; color: #c4b5fd; border: 1px solid #7c5cff; }
.pf-id { margin: 4px 0 8px; color: #c5cad3; font-size: 0.82rem; font-weight: 500; }
.pf-limit { margin: 0 0 10px; color: #ffb020; font-size: 0.78rem; font-weight: 700; }
.pf-acc { margin: 0; color: #c5cad3; font-size: 0.78rem; }
.pf-sum { margin: 2px 0 12px; font-size: 1.55rem; font-weight: 800; color: #fff; letter-spacing: -0.02em; }
.pf-pay { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 6px; }
.pf-in, .pf-out {
  height: 44px;
  border: 0;
  border-radius: 10px;
  font: inherit;
  font-weight: 800;
  font-size: 0.92rem;
  cursor: pointer;
}
.pf-in {
  color: #041018;
  background: linear-gradient(135deg, #3dff8a 0%, #00c853 100%);
  box-shadow: 0 0 18px rgba(0, 200, 83, 0.45);
}
.pf-in::before { content: "+  "; }
.pf-out {
  background: #2a2e36;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.14);
}
.pf-list { display: flex; flex-direction: column; }
.pf-row {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 11px 0;
  border: 0;
  border-radius: 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  background: transparent;
  color: inherit;
  text-align: left;
  font: inherit;
  cursor: pointer;
  text-decoration: none;
}
.pf-row:last-child { border-bottom: 0; }
.pf-row:hover { background: transparent; opacity: 0.82; }
.pf-ico {
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  color: #fff;
}
.pf-ico svg { width: 22px; height: 22px; display: block; }
.pf-txt { display: grid; gap: 2px; min-width: 0; flex: 1; }
.pf-row b { font-size: 0.95rem; color: #fff; font-weight: 800; }
.pf-row small { color: #c5cad3; font-size: 0.75rem; }
#setModal .sheet.sheet-settings,
#setSheet.sheet-settings {
  width: min(400px, calc(100% - 24px));
  max-height: calc(100dvh - 28px);
  overflow: auto;
  background: #16181e;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 22px;
  padding: 14px 18px 18px;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.55);
}
.set-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 32px;
}
.set-back {
  border: 0;
  background: transparent;
  color: #00e5ff;
  font: inherit;
  font-weight: 700;
  font-size: 0.92rem;
  padding: 4px 0;
  cursor: pointer;
}
.set-x {
  width: 32px;
  height: 32px;
  border: 0;
  background: transparent;
  color: #8ba3c7;
  font-size: 1.4rem;
  line-height: 1;
  cursor: pointer;
}
.set-title {
  margin: 6px 0 14px;
  font-size: 1.45rem;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: #f0f6ff;
}
.set-sec {
  margin: 18px 0 8px;
  color: #8ba3c7;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.set-row {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 13px 2px;
  border: 0;
  border-bottom: 1px solid rgba(0, 180, 255, 0.12);
  background: transparent;
  color: inherit;
  text-align: left;
  font: inherit;
  cursor: pointer;
}
.set-row:last-of-type,
.set-group .set-row:last-child { border-bottom: 0; }
.set-lab { color: #f0f6ff; font-weight: 500; }
.set-right {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  color: #c5d4ea;
  font-weight: 600;
}
.set-right span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 180px; }
.set-chev { color: #5d7a9a; font-size: 1.05rem; font-weight: 400; }
.set-ok {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #00e5ff;
  color: #041018;
  display: grid;
  place-items: center;
  font-size: 0.62rem;
  font-weight: 800;
  flex-shrink: 0;
}
.set-flag {
  font-size: 1.05rem;
  line-height: 1;
  flex-shrink: 0;
}
.set-note {
  margin: 8px 2px 0;
  font-size: 0.75rem;
  color: #8ba3c7;
  line-height: 1.35;
}
.set-link, .set-note button {
  border: 0;
  background: none;
  padding: 0;
  color: #00e5ff;
  font: inherit;
  font-size: inherit;
  cursor: pointer;
}
.set-kill {
  border: 0;
  background: none;
  color: #ff7a7a;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  padding: 0;
}
.set-sess {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 2px 4px;
}
.set-sess b { color: #f0f6ff; }
.set-sess small {
  display: block;
  margin-top: 4px;
  color: #8ba3c7;
  font-size: 0.75rem;
  font-weight: 500;
}
.set-out {
  width: 100%;
  margin-top: 22px;
  height: 48px;
  border: 1px solid rgba(255, 90, 90, 0.35);
  border-radius: 12px;
  background: rgba(255, 70, 70, 0.12);
  color: #ff8a82;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}
.sheet-settings .field { color: #c5cad3; }
.sheet-settings .field input,
.sheet-settings .field select {
  background: #0a0b0e;
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: #fff;
}
.set-guest { padding: 8px 2px 4px; color: #c5cad3; }
.sheet.sheet-pay {
  width: min(400px, calc(100% - 24px));
  max-height: calc(100dvh - 28px);
  overflow: auto;
  background: #fff;
  color: #2b313b;
  border: 0;
  border-radius: 22px;
  padding: 18px 18px 12px;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.35);
}
.bal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}
.bal-head h3 {
  margin: 0;
  flex: 1;
  font-size: 1.28rem;
  font-weight: 800;
  color: #2b313b;
}
.bal-x, .bal-back {
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #8a93a3;
  font-size: 1.35rem;
  line-height: 1;
  cursor: pointer;
}
.bal-sub {
  margin: 2px 0 0;
  font-size: 0.82rem;
  color: #8a93a3;
  font-weight: 600;
}
.bal-sum {
  margin: 6px 0 14px;
  font-size: 1.55rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #1f2430;
}
.bal-topup {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  height: 48px;
  border: 0;
  border-radius: 12px;
  background: #2ee56a;
  color: #fff;
  font: inherit;
  font-weight: 800;
  font-size: 1rem;
  cursor: pointer;
}
.bal-plus {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #fff;
  color: #2ee56a;
  display: grid;
  place-items: center;
  font-size: 1.05rem;
  font-weight: 800;
  line-height: 1;
}
.bal-out {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 44px;
  margin-top: 8px;
  border: 1px solid #d7dde8;
  border-radius: 12px;
  background: #fff;
  color: #2b313b;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.bal-topup.is-out { background: #3b82f6; }
.pay-methods {
  display: flex;
  gap: 8px;
  margin: 4px 0 14px;
}
.pay-methods button {
  flex: 1;
  height: 40px;
  border: 1px solid #d7dde8;
  border-radius: 10px;
  background: #fff;
  color: #2b313b;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.pay-methods button.is-on {
  border-color: #2ee56a;
  background: #edfdf2;
}
.dep-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 10px 0 12px;
}
.dep-tab {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 44px;
  border: 1px solid #e6eaf0;
  border-radius: 12px;
  background: #f6f8fb;
  color: #5b6370;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}
.dep-tab.is-on {
  background: #fff;
  border-color: #2ee56a;
  color: #1f2430;
  box-shadow: 0 0 0 1px #2ee56a;
}
.dep-tab-ico {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 0.75rem;
  color: #fff;
}
.dep-tab-ico.is-fiat { background: #22c55e; }
.dep-tab-ico.is-crypto { background: #f59e0b; }
.dep-ccy {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 12px;
  padding: 10px 12px;
  border: 1px solid #e6eaf0;
  border-radius: 12px;
  font-weight: 700;
  color: #2b313b;
}
.dep-ccy-mark {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: #e53935;
  color: #fff;
  display: grid;
  place-items: center;
  font-weight: 800;
}
.dep-ccy-mark.is-usdt { background: #26a17b; }
.dep-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  padding-bottom: 8px;
}
.dep-m {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 58px;
  padding: 8px 10px;
  border: 1px solid #e6eaf0;
  border-radius: 14px;
  background: #fff;
  text-align: left;
  font: inherit;
  cursor: pointer;
}
.dep-m:hover { border-color: #cfd6e0; }
.dep-logo {
  flex: none;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  color: #fff;
  font-size: 0.72rem;
  font-weight: 800;
  background: #607d8b;
}
.dep-logo.is-tpay { background: #ffdd2d; color: #1a1a1a; }
.dep-logo.is-alfa { background: #ef3124; }
.dep-logo.is-sber { background: #21a038; }
.dep-logo.is-vtb { background: #0a4da3; }
.dep-logo.is-ozon { background: #005bff; }
.dep-logo.is-sbp { background: #5c2d91; font-size: 0.55rem; }
.dep-logo.is-card { background: #1a237e; }
.dep-logo.is-psb { background: #ea1f2c; }
.dep-logo.is-gpb { background: #0077c8; }
.dep-logo.is-usdt { background: #26a17b; }
.dep-logo.is-ton { background: #0098ea; }
.dep-m-txt { display: flex; flex-direction: column; min-width: 0; }
.dep-m-txt b { font-size: 0.86rem; color: #1f2430; }
.dep-m-txt small { color: #8a93a3; font-size: 0.7rem; }
.dep-amt {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 8px 0 4px;
  font-weight: 700;
  color: #5b6370;
  font-size: 0.82rem;
}
.dep-amt input {
  height: 48px;
  border: 1px solid #e6eaf0;
  border-radius: 12px;
  padding: 0 12px;
  font-size: 1.15rem;
  font-weight: 800;
  color: #1f2430;
}
.dep-range {
  margin: 0 0 12px;
  color: #8a93a3;
  font-size: 0.8rem;
}
.dep-presets {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 0 0 16px;
}
.dep-pre {
  height: 42px;
  border: 1px solid #e6eaf0;
  border-radius: 12px;
  background: #f6f8fb;
  font: inherit;
  font-weight: 800;
  color: #2b313b;
  cursor: pointer;
}
.dep-err {
  margin: 0 0 10px;
  color: #e53935;
  font-size: 0.85rem;
  font-weight: 700;
}
.bal-points {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 14px 2px 8px;
  font-size: 0.88rem;
  color: #5b6472;
  font-weight: 600;
}
.bal-points b {
  margin-left: auto;
  color: #2b313b;
  font-variant-numeric: tabular-nums;
}
.bal-p {
  width: 22px;
  height: 22px;
  clip-path: polygon(50% 0, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%);
  background: #9aa3b2;
  color: #fff;
  display: grid;
  place-items: center;
  font-size: 0.7rem;
  font-weight: 800;
}
.bal-i {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 1px solid #c5ccd6;
  color: #9aa3b2;
  font-size: 0.7rem;
  display: grid;
  place-items: center;
  font-style: italic;
}
.bal-sec {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 16px 0 8px;
}
.bal-sec strong {
  font-size: 1.05rem;
  font-weight: 800;
  color: #2b313b;
}
.bal-add {
  border: 0;
  background: none;
  color: #3b82f6;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.bal-acc {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 10px 2px;
  border: 0;
  border-bottom: 1px solid #eef1f5;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.bal-acc:last-of-type { border-bottom: 0; }
.bal-ico {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #fff;
  font-weight: 800;
  font-size: 0.95rem;
  flex-shrink: 0;
}
.bal-acc-txt { min-width: 0; flex: 1; }
.bal-acc-txt b {
  display: block;
  font-size: 0.95rem;
  font-weight: 700;
  color: #2b313b;
}
.bal-acc-txt small {
  color: #8a93a3;
  font-size: 0.75rem;
}
.bal-acc-amt {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: #2b313b;
}
.bal-hint, .sheet-pay .pay-empty {
  margin: 8px 2px 12px;
  color: #8a93a3;
  font-size: 0.85rem;
}
.bal-fx { margin-top: 6px; }
.bal-fx-btn, .bal-hist-link {
  display: block;
  width: 100%;
  margin-top: 8px;
  padding: 10px 0;
  border: 0;
  background: none;
  color: #3b82f6;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  text-align: center;
}
.bal-hist-link { color: #8a93a3; font-weight: 600; font-size: 0.82rem; }
.sheet-pay .pay-tabs {
  background: #f3f5f8;
}
.sheet-pay .pay-tab { color: #8a93a3; }
.sheet-pay .pay-tab.is-on {
  background: #fff;
  color: #2b313b;
  box-shadow: 0 1px 4px rgba(0,0,0,.08);
}
.sheet-pay .pay-mid b, .sheet-pay .pay-amt { color: #2b313b; }
.pay-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
}
.pay-head h3 {
  margin: 0;
  font-size: 1.22rem;
  font-weight: 800;
  color: #f0f6ff;
}
.pay-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 4px;
  padding: 4px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.06);
  margin-bottom: 8px;
}
.pay-tab {
  height: 36px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #8ba3c7;
  font: inherit;
  font-size: 0.82rem;
  font-weight: 700;
  cursor: pointer;
}
.pay-tab.is-on {
  background: rgba(0, 229, 255, 0.16);
  color: #f0f6ff;
}
.pay-list { display: flex; flex-direction: column; }
.pay-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 4px;
  border-bottom: 1px solid rgba(0, 180, 255, 0.1);
}
.pay-row:last-child { border-bottom: 0; }
.pay-ico {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  font-weight: 800;
  font-size: 0.85rem;
  background: linear-gradient(135deg, #00e5ff, #007bff);
  color: #041018;
}
.pay-ico.is-out {
  background: rgba(0, 229, 255, 0.12);
  color: #00e5ff;
  border: 1px solid rgba(0, 180, 255, 0.25);
}
.pay-mid { min-width: 0; flex: 1; }
.pay-mid b {
  display: block;
  font-size: 0.92rem;
  font-weight: 700;
  color: #f0f6ff;
}
.pay-st {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 3px;
  font-size: 0.75rem;
  font-weight: 600;
  color: #8ba3c7;
}
.pay-st.is-ok { color: #3ee07a; }
.pay-st.is-wait { color: #ffb020; }
.pay-st.is-bad { color: #ff8a82; }
.pay-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
  flex-shrink: 0;
}
.pay-right { text-align: right; flex-shrink: 0; }
.pay-amt {
  display: block;
  font-size: 0.92rem;
  font-weight: 800;
  color: #f0f6ff;
}
.pay-amt.is-in { color: #3ee07a; }
.pay-when {
  display: block;
  margin-top: 3px;
  font-size: 0.7rem;
  color: #8ba3c7;
}
.pay-empty {
  padding: 28px 8px;
  text-align: center;
  color: #8ba3c7;
  font-size: 0.88rem;
}
.hist-panel {
  background: #07101d;
  border: 1px solid rgba(0, 180, 255, 0.16);
  border-radius: 18px;
  overflow: hidden;
  margin: 8px 0 28px;
}
.hist-toolbar {
  padding: 10px 12px 0;
  border-bottom: 1px solid rgba(0, 180, 255, 0.12);
}
.hist-tabs {
  display: flex;
  gap: 2px;
  overflow-x: auto;
}
.hist-tab {
  height: 42px;
  padding: 0 16px;
  border: 0;
  background: transparent;
  color: #8ba3c7;
  font: inherit;
  font-size: 0.9rem;
  font-weight: 700;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  white-space: nowrap;
}
.hist-tab.is-on {
  color: #f0f6ff;
  background: rgba(255, 255, 255, 0.06);
  border-bottom-color: #00e5ff;
  border-radius: 10px 10px 0 0;
}
.hist-list { padding: 0 4px; }
.hist-empty {
  padding: 36px 16px;
  text-align: center;
  color: #8ba3c7;
  font-size: 0.9rem;
}
.hist-card {
  padding: 14px 14px 12px;
  border-bottom: 1px solid rgba(0, 180, 255, 0.1);
}
.hist-card:last-child { border-bottom: 0; }
.hist-card-top {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 10px;
  font-size: 0.78rem;
  color: #8ba3c7;
}
.hist-mark {
  width: 22px;
  height: 22px;
  border-radius: 5px;
  display: grid;
  place-items: center;
  background: #e11d48;
  color: #fff;
  font-size: 0.62rem;
  font-weight: 800;
  flex-shrink: 0;
}
.hist-type {
  font-weight: 700;
  color: #c5d7ee;
}
.hist-when { flex: 1; min-width: 140px; }
.hist-tid { margin-left: auto; font-variant-numeric: tabular-nums; }
.hist-main {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 8px;
}
.hist-main-text { min-width: 0; flex: 1; }
.hist-pick {
  font-size: 1.05rem;
  font-weight: 800;
  color: #f0f6ff;
  line-height: 1.25;
}
.hist-event {
  margin-top: 4px;
  font-size: 0.82rem;
  color: #8ba3c7;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
}
.hist-kick {
  display: block;
  margin-top: 3px;
  font-size: 0.75rem;
  color: #6b82a6;
}
.hist-kf {
  font-size: 1.05rem;
  font-weight: 800;
  color: #f0f6ff;
  flex-shrink: 0;
}
.hist-card.is-express { cursor: default; }
.hist-toggle {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  width: 100%;
  margin: 0 0 8px;
  padding: 10px 8px;
  min-height: 48px;
  border: 0;
  background: rgba(255, 255, 255, 0.03);
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  border-radius: 10px;
  -webkit-tap-highlight-color: rgba(0, 229, 255, 0.2);
}
.hist-card.is-express .hist-toggle:hover,
.hist-card.is-open .hist-toggle {
  background: rgba(0, 229, 255, 0.08);
}
.hist-card.is-open .hist-legs {
  display: grid !important;
}
.hist-card:not(.is-open) .hist-legs {
  display: none !important;
}
.hist-chev {
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-left: 8px;
  border-right: 2px solid #8ba3c7;
  border-bottom: 2px solid #8ba3c7;
  transform: rotate(45deg);
  vertical-align: 2px;
}
.hist-card.is-open .hist-chev {
  transform: rotate(-135deg);
  vertical-align: -1px;
}
.hist-legs {
  display: grid;
  gap: 8px;
  margin: 0 0 10px;
  padding: 8px 10px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.03);
}
.hist-leg {
  display: flex;
  gap: 10px;
  align-items: flex-start;
}
.hist-leg-text { min-width: 0; flex: 1; }
.hist-leg-text b {
  display: block;
  font-size: 0.86rem;
  color: #f0f6ff;
}
.hist-leg-text span {
  display: block;
  margin-top: 2px;
  font-size: 0.75rem;
  color: #8ba3c7;
}
.hist-leg-kf {
  font-weight: 700;
  font-size: 0.86rem;
  color: #c5d7ee;
}
.hist-out {
  display: inline-block;
  margin-left: 8px;
  font-size: 0.72rem;
  font-weight: 800;
  font-style: normal;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.hist-out.is-won { color: #16a34a; }
.hist-out.is-lost { color: #dc2626; }
.hist-out.is-void { color: #d97706; }
.hist-leg-text .hist-out { display: block; margin: 4px 0 0; }
.hist-foot {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 6px;
}
.hist-sums { display: flex; gap: 22px; flex-wrap: wrap; }
.hist-sum span {
  display: block;
  font-size: 0.72rem;
  color: #8ba3c7;
}
.hist-sum b {
  display: block;
  margin-top: 2px;
  font-size: 0.92rem;
  color: #f0f6ff;
}
.hist-sum.is-win b { color: #3ee07a; }
.hist-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.82rem;
  font-weight: 700;
  color: #8ba3c7;
}
.hist-status.is-won { color: #3ee07a; }
.hist-status.is-lost { color: #8ba3c7; }
.hist-status.is-open { color: #00e5ff; }
.hist-status.is-void { color: #ffb020; }
.hist-st-ico {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 0.7rem;
  background: rgba(139, 163, 199, 0.2);
  color: #fff;
}
.hist-status.is-won .hist-st-ico { background: #3ee07a; color: #062012; }
.hist-status.is-lost .hist-st-ico { background: #5b6d86; }
.hist-status.is-open .hist-st-ico { background: #00e5ff; color: #041018; }
.hist-status.is-void .hist-st-ico { background: #ffb020; color: #1a1204; }
.hist-acc-pill {
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  background: #3ee07a;
  color: #062012;
  font-size: 0.75rem;
  font-weight: 800;
}
@media (max-width: 640px) {
  .hist-tid { width: 100%; margin-left: 30px; }
  .hist-pick { font-size: 0.98rem; }
}
.sport-page { padding-bottom: 28px; }
.sb-tabs {
  display: flex;
  gap: 4px;
  overflow-x: auto;
  margin: 14px 0 12px;
  border-bottom: 1px solid rgba(0, 180, 255, 0.12);
  scrollbar-width: none;
}
.sb-tabs::-webkit-scrollbar { display: none; }
.sb-tab {
  position: relative;
  flex: 0 0 auto;
  padding: 10px 12px 12px;
  color: #8ba3c7;
  font-size: 0.88rem;
  font-weight: 700;
  white-space: nowrap;
}
.sb-tab.is-on { color: #f0f6ff; }
.sb-tab.is-on::after {
  content: "";
  position: absolute;
  left: 12px; right: 12px; bottom: 0;
  height: 2px;
  background: #00e5ff;
  border-radius: 2px;
}
.sb-new {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 5px;
  border-radius: 4px;
  background: #e11d48;
  color: #fff;
  font-size: 0.58rem;
  font-weight: 800;
  vertical-align: 2px;
}
.sb-tiles {
  display: flex;
  gap: 2px;
  overflow-x: auto;
  padding: 10px 4px 14px;
  scrollbar-width: none;
  background:
    radial-gradient(420px 80px at 12% 0%, rgba(240, 122, 26, 0.16), transparent 70%),
    linear-gradient(180deg, #12100e 0%, transparent 100%);
  border-radius: 16px;
}
.sb-tiles::-webkit-scrollbar { display: none; }
.sb-tile {
  flex: 0 0 78px;
  height: auto;
  min-height: 0;
  border: 0;
  border-radius: 14px;
  background: transparent;
  color: #efe6d6;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  padding: 8px 4px 6px;
  text-align: center;
  font: inherit;
}
.sb-tile.is-on {
  background: transparent;
  box-shadow: none;
}
.sb-tile-mark {
  position: relative;
  width: 48px;
  height: 48px;
  border-radius: 12px;
  display: grid;
  place-items: center;
}
.sb-tile.is-on .sb-tile-mark {
  background: #f07a1a;
  box-shadow: 0 8px 22px rgba(240, 122, 26, 0.38);
}
.sb-tile-ico,
.sb-glyph {
  width: 28px;
  height: 28px;
  display: block;
  color: #d7c4a4;
}
.sb-tile.is-on .sb-tile-ico,
.sb-tile.is-on .sb-glyph { color: #fff; }
.sb-tile-mark::after {
  content: "";
  position: absolute;
  right: 3px;
  bottom: 5px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 4px 0 4px 7px;
  border-color: transparent transparent transparent #fff;
  filter: drop-shadow(0 0 1px rgba(0, 0, 0, 0.55));
  pointer-events: none;
}
.sb-tile b {
  font-size: 0.72rem;
  font-weight: 600;
  color: #f4f4f5;
  line-height: 1.15;
  max-width: 100%;
}
.sb-tile.is-on b { color: #fff; }
.sb-tile small {
  color: rgba(215, 196, 164, 0.72);
  font-size: 0.62rem;
  font-weight: 600;
}
.sb-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}
.sb-pills, .sb-hours { display: flex; gap: 6px; flex-wrap: wrap; }
.sb-pill, .sb-hour {
  height: 32px;
  padding: 0 12px;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
  color: #8ba3c7;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 700;
  cursor: pointer;
}
.sb-pill.is-on, .sb-hour.is-on {
  background: #007bff;
  color: #fff;
}
.sb-leagues {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 2px 0 14px;
  scrollbar-width: none;
}
.sb-lg {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 40px;
  padding: 0 12px 0 6px;
  border-radius: 999px;
  border: 1px solid rgba(0, 180, 255, 0.14);
  background: #0b1626;
  color: #c5d7ee;
  font: inherit;
  font-size: 0.75rem;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
}
.sb-lg span {
  width: 28px; height: 28px; border-radius: 50%;
  display: grid; place-items: center;
  background: #122033;
  font-size: 0.72rem;
}
.sb-lg.is-on { background: #007bff; color: #fff; border-color: transparent; }
.sb-hero {
  position: relative;
  border-radius: 18px;
  overflow: hidden;
  margin-bottom: 18px;
  min-height: 140px;
  border: 1px solid var(--border);
}
.sb-hero img { width: 100%; height: 160px; object-fit: cover; filter: saturate(0.85); }
.sb-hero div {
  position: absolute; left: 0; right: 0; bottom: 0;
  padding: 16px 18px;
  background: linear-gradient(transparent, rgba(5, 10, 21, 0.92));
}
.sb-hero p { margin: 0 0 4px; color: #8ba3c7; font-size: 0.78rem; }
.sb-hero strong { font-size: 1.05rem; }
.sb-rail-wrap { margin-bottom: 18px; }
.sb-rail-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.sb-rail-head h2 { margin: 0; font-size: 1.12rem; display: flex; align-items: center; gap: 8px; font-weight: 800; }
.sb-rail-nav { display: flex; align-items: center; gap: 6px; }
.sb-rail-nav a { color: #2f6bff; font-size: 0.78rem; font-weight: 700; text-decoration: none; }
.sb-rail-nav button {
  width: 32px; height: 32px; border-radius: 50%;
  border: 1px solid #e4e4e4;
  background: #fff;
  color: #16181d;
  cursor: pointer;
  font-size: 1.05rem;
  line-height: 1;
}
.sb-rail-nav button:disabled { opacity: 0.28; cursor: default; }
.sb-rail {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 6px;
}
.sb-rail::-webkit-scrollbar { display: none; }
body[data-page="home"] .matches.sb-rail {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x proximity;
  padding-bottom: 2px;
}
body[data-page="home"] .matches.sb-rail .sb-card {
  flex: 0 0 268px;
  width: 268px;
  min-width: 268px;
  background: #fff;
  border: 0;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
}
body[data-page="home"] .matches .sb-card-teams,
body[data-page="home"] .matches .sb-card-score {
  color: #16181d;
}
body[data-page="home"] .matches .sb-card-top {
  color: #6b7280;
}
body[data-page="home"] .matches .sb-card .odd {
  background: #ececec;
  border: 0;
  color: #16181d;
  border-radius: 8px;
}
body[data-page="home"] .matches .sb-card .odd small {
  color: #6b7280;
}
body[data-page="home"] .matches .sb-card .odd b {
  color: #16181d;
}
body[data-page="home"] .matches .sb-card .odd:hover {
  background: #e0e0e0;
}
body[data-page="home"] .matches .sb-card .odd.is-on,
body[data-page="home"] .matches .sb-card .odd.is-on b,
body[data-page="home"] .matches .sb-card .odd.is-on small {
  background: #2f6bff;
  color: #fff !important;
}
body[data-page="home"] .matches .sb-more {
  background: #ececec;
  border: 0;
  color: #16181d;
}
body[data-page="home"] .matches .sb-extra {
  background: #f7f7f8;
  border-color: #eee;
}
body[data-page="home"] .game-rail .ev-card,
body[data-page="home"] .events.game-rail .ev-card {
  flex: 0 0 268px;
  width: 268px;
  min-width: 268px;
  scroll-snap-align: start;
  background: #fff;
  border: 0;
  border-radius: 14px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
  padding: 12px;
  color: #16181d;
}
.ev-card h3 {
  margin: 8px 0 12px;
  font-size: 0.92rem;
  line-height: 1.35;
  font-weight: 800;
}
.ev-card .ev-card-top {
  font-size: 0.72rem;
  font-weight: 700;
  color: #6b7280;
}
body[data-page="home"] .game-rail .ev-card .odd,
body[data-page="home"] .events.game-rail .ev-card .odd {
  background: #ececec;
  border: 0;
  color: #16181d;
  border-radius: 8px;
}
body[data-page="home"] .game-rail .ev-card .odd small,
body[data-page="home"] .events.game-rail .ev-card .odd small { color: #6b7280; }
body[data-page="home"] .game-rail .ev-card .odd b,
body[data-page="home"] .events.game-rail .ev-card .odd b { color: #16181d; }
body[data-page="home"] .game-rail .ev-card .odd.is-on,
body[data-page="home"] .game-rail .ev-card .odd.is-on b,
body[data-page="home"] .game-rail .ev-card .odd.is-on small,
body[data-page="home"] .events.game-rail .ev-card .odd.is-on,
body[data-page="home"] .events.game-rail .ev-card .odd.is-on b,
body[data-page="home"] .events.game-rail .ev-card .odd.is-on small {
  background: #2f6bff;
  color: #fff !important;
}
.sb-card {
  flex: 0 0 min(252px, 82vw);
  width: min(252px, 82vw);
  min-width: min(252px, 82vw);
  min-height: 198px;
  scroll-snap-align: start;
  background: #fff;
  border: 0;
  border-radius: 16px;
  box-shadow: 0 1px 3px rgba(16, 24, 40, 0.08);
  padding: 12px;
  color: #16181d;
  display: flex;
  flex-direction: column;
  gap: 10px;
  cursor: pointer;
}
.sb-card-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 8px;
}
.sb-card-liga {
  min-width: 0;
  display: grid;
  gap: 1px;
}
.sb-card-liga b {
  font-size: 0.72rem;
  font-weight: 800;
  line-height: 1.25;
  color: #16181d;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.sb-card-liga small {
  font-size: 0.68rem;
  font-weight: 600;
  color: #8a9099;
}
.sb-card-status {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
  flex: none;
  text-align: right;
  max-width: 46%;
}
.sb-card-status .sb-soon,
.sb-card-status .sb-min {
  font-size: 0.68rem;
  font-weight: 700;
  color: #6b7280;
  line-height: 1.25;
}
.sb-card-mid {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: center;
  flex: 1;
  min-height: 52px;
}
.sb-card-score {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
  font-size: 1.02rem;
  font-weight: 800;
  margin: 0;
  min-width: 1.2em;
  text-align: right;
  color: #16181d;
  font-variant-numeric: tabular-nums;
}
.sb-card-teams {
  display: grid;
  gap: 8px;
  font-size: 0.84rem;
  margin: 0;
}
.sb-card-odds {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr auto;
  gap: 6px;
  align-items: stretch;
  flex-wrap: nowrap;
}
.sb-card.kind-two .sb-card-odds {
  grid-template-columns: 1fr auto 1fr auto;
}
.sb-card .odd,
.sb-card .odd-lock {
  min-width: 0;
  width: 100%;
  height: 36px;
  padding: 0 8px;
  border-radius: 8px;
  background: #ececec;
  border: 0;
  color: #16181d;
}
.odd-lock {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #9aa3af;
}
.odd-lock svg { width: 16px; height: 16px; }
.sb-odds { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.sb-live {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: #ff5c7a;
  font-weight: 800;
  font-size: 0.72rem;
}
.sb-cam {
  display: inline-flex;
  align-items: center;
  margin-left: 6px;
  padding: 1px 6px;
  border-radius: 999px;
  background: #111827;
  color: #fff;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: .04em;
}
.sb-block {
  background: #fff;
  border: 0;
  border-radius: 14px;
  margin-bottom: 8px;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.06);
}
.sb-liga {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border: 0;
  background: transparent;
  color: #16181d;
  font: inherit;
  font-size: 0.9rem;
  font-weight: 800;
  cursor: pointer;
  text-align: left;
}
.sb-liga-ico {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #f2f3f5;
  display: grid;
  place-items: center;
  flex: none;
  color: #3a3f48;
}
.sb-liga-ico .sb-glyph { width: 22px; height: 22px; }
.sb-liga-txt {
  flex: 1;
  min-width: 0;
  display: grid;
  gap: 2px;
}
.sb-liga-txt b {
  font-size: 0.92rem;
  font-weight: 800;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sb-liga-txt small {
  font-size: 0.74rem;
  font-weight: 600;
  color: #8a9099;
}
.sb-liga em {
  width: 8px; height: 8px;
  border-right: 2px solid #9aa3b2;
  border-bottom: 2px solid #9aa3b2;
  transform: rotate(-135deg);
  margin-left: auto;
  margin-right: 4px;
  flex: none;
}
.sb-block.is-off .sb-liga em { transform: rotate(45deg); }
.sb-block.is-off .sb-body { display: none; }
.sb-row {
  display: grid;
  grid-template-columns: minmax(140px, 1.1fr) minmax(160px, 1fr) 52px;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  border-top: 1px solid rgba(0, 180, 255, 0.08);
}
.sb-row.is-live {
  background: rgba(255, 92, 122, 0.08);
}
.sb-info { min-width: 0; }
.sb-when, .sb-soon {
  color: #9aa8bd;
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.25;
}
.sb-when-wrap {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 8px;
}
.sb-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 10px;
}
.sb-card-top .sb-when-wrap {
  flex-direction: column;
  align-items: flex-end;
  text-align: right;
  max-width: 72%;
}
.sb-card-top .sb-when, .sb-card-top .sb-soon { text-align: right; }
.sb-score { font-variant-numeric: tabular-nums; color: #f0f6ff; font-weight: 800; }
.sb-teams { display: flex; flex-direction: column; gap: 2px; font-size: 0.9rem; }
.sb-mk-lbl { display: block; font-size: 0.65rem; color: #8ba3c7; margin-bottom: 4px; font-weight: 700; }
.sb-row .odd, .sb-card .odd, .sb-pick .odd, .sb-extra .odd {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 86px;
  height: 36px;
  padding: 0 8px;
  border-radius: 10px;
  background: #122033;
}
.sb-card .odd,
.sb-card .odd-lock,
.sb-card .sb-more {
  min-width: 0;
  width: 100%;
}
.sb-card .sb-more {
  background: #ececec;
  border: 0;
  color: #16181d;
}
.sb-row .odd small, .sb-card .odd small, .sb-pick .odd small, .sb-extra .odd small {
  display: inline;
  color: #8ba3c7;
  font-size: 0.7rem;
}
.sb-more {
  height: 36px;
  min-width: 44px;
  border-radius: 10px;
  border: 1px solid rgba(0, 180, 255, 0.25);
  background: rgba(0, 123, 255, 0.18);
  color: #00e5ff;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 800;
  cursor: pointer;
}
.sb-extra {
  grid-column: 1 / -1;
  display: grid;
  gap: 8px;
  padding-top: 4px;
}
.sb-extra[hidden] { display: none !important; }
.sb-extra-m span {
  display: block;
  font-size: 0.7rem;
  color: #8ba3c7;
  margin-bottom: 4px;
  font-weight: 700;
}
.sb-picks { display: grid; gap: 8px; }
body.ev-open .sb-tiles,
body.ev-open .sb-tabs,
body.ev-open .sb-bar,
body.ev-open .sb-leagues,
body.ev-open .sb-line,
body.ev-open .sb-rail-wrap,
body.ev-open .sb-hero {
  display: none !important;
}
.ev-page { padding: 6px 0 20px; }
.ev-top {
  display: flex; align-items: center; gap: 10px; margin-bottom: 8px;
}
.ev-back {
  display: inline-flex; align-items: center; justify-content: center;
  height: 36px; padding: 0 12px; border-radius: 10px;
  background: #1a1d24; color: #fff; font-weight: 800; font-size: 0.85rem;
}
.ev-top h1 { margin: 0; font-size: 1.05rem; font-weight: 800; }
.ev-tabs {
  display: flex; gap: 6px; margin: 0 0 10px; overflow-x: auto;
  justify-content: flex-start;
}
.ev-tab {
  height: 32px; padding: 0 10px; border: 0; border-radius: 999px;
  background: transparent; color: #fff; font: inherit; font-weight: 700;
  cursor: pointer; white-space: nowrap;
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 0.8rem;
  flex: 0 0 auto;
}
.ev-tab.is-on { background: #fff; color: #111; }
.ev-stream {
  position: relative; overflow: hidden; border-radius: 16px;
  background: #0b0d12; aspect-ratio: 16 / 9; margin-bottom: 12px;
}
.ev-stream.is-lg, .ev-studio.is-lg { aspect-ratio: 16 / 8.5; }
.ev-video { width: 100%; height: 100%; object-fit: cover; display: block; background: #000; border: 0; }
.ev-studio {
  position: relative; overflow: hidden; border-radius: 16px;
  aspect-ratio: 16 / 9; margin-bottom: 12px; color: #fff;
  isolation: isolate;
}
.ev-studio-field { position: absolute; inset: 0; }
.ev-studio.is-football .ev-studio-field {
  background:
    linear-gradient(#fff, #fff) 50% 50% / 2px 100% no-repeat,
    radial-gradient(circle at 50% 50%, transparent 58px, #fff 58px, #fff 60px, transparent 61px),
    repeating-linear-gradient(90deg, #1c8a38 0 12.5%, #167a30 12.5% 25%);
}
.ev-studio.is-hockey .ev-studio-field {
  background:
    linear-gradient(#c62828, #c62828) 50% 50% / 100% 3px no-repeat,
    radial-gradient(circle at 18% 50%, #1565c0 0 10px, transparent 11px),
    radial-gradient(circle at 82% 50%, #1565c0 0 10px, transparent 11px),
    linear-gradient(#e8eef6, #cfd8e6);
}
.ev-studio.is-basketball .ev-studio-field {
  background:
    radial-gradient(circle at 50% 50%, transparent 54px, #f5d0a9 54px, #f5d0a9 56px, transparent 57px),
    linear-gradient(#f5d0a9, #f5d0a9) 50% 50% / 2px 100% no-repeat,
    #c45c26;
}
.ev-studio.is-tennis .ev-studio-field {
  background:
    linear-gradient(#fff, #fff) 50% 50% / 2px 70% no-repeat,
    linear-gradient(#3f8f4a, #3f8f4a) 50% 50% / 62% 78% no-repeat,
    #2e6b38;
}
.ev-studio.is-esports .ev-studio-field {
  background:
    radial-gradient(ellipse at 50% 110%, rgba(47, 107, 255, 0.35), transparent 55%),
    repeating-linear-gradient(0deg, transparent 0 22px, rgba(47,107,255,.12) 22px 23px),
    #070b16;
}
.ev-studio.is-mma .ev-studio-field {
  background:
    radial-gradient(circle at 50% 52%, #2a2a32 0 28%, #1a1a20 29% 42%, #111 43%);
}
.ev-studio.is-volleyball .ev-studio-field,
.ev-studio.is-tabletennis .ev-studio-field {
  background:
    linear-gradient(#fff, #fff) 50% 50% / 100% 2px no-repeat,
    #1e6bb8;
}
.ev-studio:not([class*="is-football"]):not([class*="is-hockey"]):not([class*="is-basketball"]):not([class*="is-tennis"]):not([class*="is-esports"]):not([class*="is-mma"]):not([class*="is-volleyball"]):not([class*="is-tabletennis"]) .ev-studio-field {
  background: radial-gradient(ellipse at 50% 80%, #14301c, #071018 70%);
}
.ev-dot {
  position: absolute; width: 14px; height: 14px; border-radius: 50%;
  background: #fff; box-shadow: 0 0 0 3px rgba(0,0,0,.25);
  left: 52%; top: 48%;
  animation: ev-run 7s ease-in-out infinite;
}
.ev-studio.is-hockey .ev-dot { background: #111; }
.ev-studio.is-esports .ev-dot { background: #22c55e; box-shadow: 0 0 12px #22c55e; }
@keyframes ev-run {
  0%, 100% { transform: translate(-20%, -10%); }
  35% { transform: translate(40%, 18%); }
  70% { transform: translate(-8%, 28%); }
}
.ev-studio-hud {
  position: absolute; inset: 0;
  display: flex; flex-direction: column; justify-content: space-between;
  padding: 12px 14px 14px;
  background: linear-gradient(180deg, rgba(0,0,0,.45), transparent 28%, transparent 62%, rgba(0,0,0,.7));
  z-index: 1;
}
.ev-studio-top {
  display: flex; align-items: center; gap: 8px;
  font-size: 0.72rem; font-weight: 700;
}
.ev-studio-top small { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #e8eef7; }
.ev-studio-top b { font-variant-numeric: tabular-nums; font-size: 0.95rem; }
.ev-studio-live {
  background: #e11d48; color: #fff; font-size: 0.68rem; font-weight: 800;
  padding: 3px 8px; border-radius: 6px; letter-spacing: 0.06em; text-transform: uppercase;
}
.ev-studio-live[hidden] { display: none; }
.ev-studio-score {
  display: grid; grid-template-columns: 1fr auto 1fr; gap: 10px; align-items: center;
}
.ev-studio-side {
  display: flex; align-items: center; gap: 8px; min-width: 0;
}
.ev-studio-side.is-away { justify-content: flex-end; }
.ev-studio-side em {
  font-style: normal; font-weight: 800; font-size: 0.92rem;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  text-shadow: 0 1px 8px #000;
}
.ev-studio-side strong {
  font-size: 2rem; font-variant-numeric: tabular-nums; line-height: 1;
  text-shadow: 0 2px 10px #000;
}
.ev-studio-mid { font-size: 1.4rem; opacity: 0.7; font-weight: 800; }
.sb-crest {
  position: relative;
  width: 22px;
  height: 22px;
  border-radius: 6px;
  overflow: hidden;
  flex: 0 0 22px;
  display: inline-grid;
  place-items: center;
  background: #fff;
  box-shadow: 0 0 0 1px rgba(16, 24, 40, 0.08);
}
.sb-crest i {
  font-style: normal;
  font-size: 0.52rem;
  font-weight: 800;
  color: #3a3f48;
  letter-spacing: -0.04em;
  line-height: 1;
}
.sb-crest img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: transparent;
  z-index: 1;
}
.sb-liga-ico {
  overflow: hidden;
  padding: 0;
  background: #fff;
}
.sb-liga-ico img {
  width: 40px;
  height: 40px;
  object-fit: contain;
  display: block;
}
.sb-teams b,
.sb-card-teams b {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.sb-teams b span,
.sb-card-teams b span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sb-pick-info b {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  vertical-align: middle;
}
.ev-studio-side .sb-crest {
  width: 36px;
  height: 36px;
}
.ev-studio-side .sb-crest i { font-size: 0.72rem; }
.ev-score small {
  display: flex;
  align-items: center;
  gap: 6px;
}
.ev-studio-note {
  margin: 0; font-size: 0.72rem; color: #d5deea; font-weight: 650;
}
@media (max-width: 640px) {
  .ev-studio-side em { font-size: 0.78rem; }
  .ev-studio-side strong { font-size: 1.55rem; }
  .ev-studio-side .sb-crest { width: 30px; height: 30px; }
}
.ev-stream-off { display: grid; place-items: center; }
.ev-off { text-align: center; padding: 24px 16px; color: #c8d0dc; }
.ev-off span { font-size: 2rem; display: block; margin-bottom: 8px; }
.ev-off b { display: block; font-size: 1.05rem; color: #fff; margin-bottom: 6px; }
.ev-off p { margin: 0; font-size: 0.82rem; color: #8b93a3; max-width: 320px; }
.ev-score {
  display: grid; grid-template-columns: 1fr auto 1fr; gap: 10px;
  align-items: center; background: #1a1d24; border-radius: 14px;
  padding: 12px 14px; margin-bottom: 12px;
}
.ev-score div { min-width: 0; }
.ev-score small { display: flex; align-items: center; gap: 6px; font-size: 0.75rem; color: #8b93a3; margin-bottom: 4px; }
.ev-score b { font-size: 1.35rem; }
.ev-score-mid { text-align: center; }
.ev-score-mid strong { display: block; font-size: 1.6rem; letter-spacing: -0.03em; }
.ev-score-mid em {
  font-style: normal;
  font-size: 0.72rem;
  color: #8b93a3;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 4px 8px;
}
.ev-chips { display: flex; gap: 6px; overflow-x: auto; margin: 0 0 8px; }
.ev-chip {
  height: 32px; padding: 0 12px; border: 0; border-radius: 999px;
  background: #2a2e36; color: #fff; font: inherit; font-weight: 700; font-size: 0.78rem;
  cursor: pointer; white-space: nowrap;
}
.ev-chip.is-on { background: #2f6bff; }
.ev-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 10px;
}
.ev-mkt {
  background: #1a1d24; border-radius: 14px; padding: 10px 12px 12px;
}
.ev-mkt header {
  font-size: 0.8rem; font-weight: 800; margin-bottom: 8px;
}
.ev-odds { display: grid; gap: 6px; }
.ev-odds-2 { grid-template-columns: 1fr 1fr; }
.ev-odds-3 { grid-template-columns: 1fr 1fr 1fr; }
.ev-odds .odd {
  display: flex; justify-content: space-between; align-items: center;
  height: 38px; padding: 0 10px; border-radius: 10px; background: #12151c;
  width: 100%;
}
.ev-mkt-h {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 0.8rem;
  font-weight: 800;
  cursor: pointer;
  padding: 0 0 8px;
  text-align: left;
}
.ev-mkt-h em {
  width: 8px; height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  opacity: 0.45;
  transform: rotate(45deg);
  flex: 0 0 auto;
}
.ev-mkt.is-off .ev-mkt-h em { transform: rotate(-45deg); }
.ev-mkt.is-off .ev-mkt-body { display: none; }
.ev-stage {
  width: min(760px, 100%);
  margin: 0 auto 18px;
}
.ev-stream-live {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 2;
  background: #e11d48;
  color: #fff;
  font-size: 0.68rem;
  font-weight: 800;
  padding: 3px 8px;
  border-radius: 6px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.ev-board {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 6px 10px;
  padding: 0 0 10px;
  text-align: center;
}
.ev-board-team {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  min-width: 0;
}
.ev-board-team b {
  font-size: 0.8rem;
  font-weight: 800;
  line-height: 1.2;
  display: block;
}
.ev-board .sb-crest {
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
}
.ev-board .sb-crest i { font-size: 0.7rem; }
.ev-board-score {
  align-self: center;
  min-width: 68px;
  padding: 6px 12px;
  border-radius: 10px;
  background: #e4e4e4;
  color: #111;
  font-size: 1.2rem;
  font-weight: 800;
  letter-spacing: -0.03em;
}
.ev-board-meta {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  flex-wrap: wrap;
  min-height: 0;
}
.ev-board-live {
  color: #e11d48;
  font-size: 0.7rem;
  font-weight: 800;
}
.ev-board-live[hidden] { display: none; }
.ev-board-live::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #e11d48;
  margin-right: 4px;
  vertical-align: 1px;
}
.ev-board-min { font-size: 0.72rem; font-weight: 700; color: #6b7280; }
.ev-track-note { color: #8b93a3; font-size: 0.85rem; }
.sb-info, .sb-card-teams, .sb-pick-info { cursor: pointer; }
@media (max-width: 980px) {
  .ev-grid { grid-template-columns: 1fr; }
  .ev-top h1 { font-size: 0.92rem; }
}
.sb-pick {
  background: #07101d;
  border: 1px solid rgba(0, 180, 255, 0.12);
  border-radius: 14px;
  padding: 12px;
}
.sb-pick-liga { font-size: 0.72rem; color: #8ba3c7; margin-bottom: 6px; }
.sb-pick-body { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.sb-pick-info { flex: 1; min-width: 160px; font-size: 0.9rem; }
.sb-pick-out { margin-top: 4px; font-size: 0.78rem; color: #8ba3c7; }
@media (max-width: 760px) {
  .sb-row { grid-template-columns: 1fr auto; }
  .sb-mk { grid-column: 1 / -1; }
  .sb-tile { flex-basis: 72px; height: auto; }
  .sb-hero img { height: 120px; }
}
.field { display: grid; gap: 6px; margin: 10px 0; font-size: 0.8rem; color: var(--muted); }
.field input {
  background: #050a15; border: 1px solid var(--border); color: var(--text);
  border-radius: 12px; padding: 10px 12px;
}
.reels { display: flex; justify-content: center; gap: 8px; margin: 16px 0; font-size: 2.4rem; }
.reel {
  width: 72px; height: 72px; border-radius: 16px;
  border: 1px solid var(--border); display: grid; place-items: center;
  background: #050a15;
}
.toast {
  position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%);
  background: #07101d; border: 1px solid var(--border); color: var(--text);
  padding: 10px 14px; border-radius: 12px; z-index: 90; display: none;
}
.search-overlay {
  position: fixed; inset: 0; z-index: 110; display: none; background: rgba(0,5,10,.92);
  padding: 80px 16px 24px;
}
.search-overlay.open { display: block; }
.search-overlay input {
  width: min(720px, 100%); display: block; margin: 0 auto 16px;
  background: #07101d; border: 1px solid var(--accent); color: var(--text);
  border-radius: 14px; padding: 14px 16px; font-size: 1rem;
}
.search-hits { width: min(720px, 100%); margin: 0 auto; display: grid; gap: 8px; }
.hit {
  display: flex; gap: 12px; align-items: center; padding: 8px; border-radius: 12px;
  background: var(--surface); border: 1px solid var(--border); color: var(--text); cursor: pointer;
}
.hit img { width: 40px; height: 54px; object-fit: cover; border-radius: 8px; }

.sheet-actions { display: flex; gap: 8px; margin-top: 8px; flex-wrap: wrap; }
.sheet-actions .btn { flex: 1; min-width: 0; }
.auth-btns { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.auth-btns .btn-primary,
.drawer-auth .btn-primary {
  background: #2f6bff;
  color: #fff;
  box-shadow: none;
  border-radius: 999px;
  min-height: 38px;
  padding: 0 16px;
}
.auth-btns .btn-primary:hover,
.drawer-auth .btn-primary:hover {
  background: #3b78ff;
  color: #fff;
}
.auth-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  margin: 0 0 12px;
  padding: 4px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: rgba(0, 0, 0, 0.28);
}
.auth-tabs button {
  border: 0;
  background: transparent;
  color: var(--muted);
  font-weight: 800;
  padding: 8px 10px;
  border-radius: 10px;
  cursor: pointer;
  font-family: inherit;
  font-size: 0.82rem;
}
.auth-tabs button.is-on {
  background: var(--accent-soft);
  color: var(--accent);
}
.auth-err {
  color: #ff7a88;
  font-size: 0.8rem;
  margin: 4px 0 8px;
  min-height: 1.1em;
}
.auth-forgot {
  display: block;
  width: 100%;
  margin: 10px 0 0;
  padding: 0;
  border: 0;
  background: none;
  color: #9aa3b2;
  font: inherit;
  font-size: 0.82rem;
  text-align: left;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 3px;
}
#loginModal .auth-forgot {
  color: #c5cad3;
}
.auth-meta { margin: 8px 0 14px; }
.auth-meta p { margin: 4px 0; font-size: 0.86rem; }
.drawer-auth { display: grid; gap: 8px; }
.drawer-auth .btn { width: 100%; }

.bottom-nav { display: none; }
.menu-toggle { display: none; }
.drawer { display: none; }

.slip {
  position: fixed; right: 16px; bottom: 16px; z-index: 50; width: min(328px, calc(100% - 24px));
  background: #f2f2f2; border: 0; border-radius: 16px; padding: 12px 12px 10px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.22); display: none;
  max-height: min(78vh, 640px); overflow: auto;
  color: #16181d;
}
.slip.open { display: block; }
.slip-line {
  display: flex; justify-content: space-between; gap: 8px; align-items: center;
  margin: 8px 0; color: var(--muted); font-size: 0.8rem;
}
.slip-line span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.slip-ticket {
  margin: 10px 0 8px;
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: 12px;
}
.slip-ticket .slip-head {
  font-size: 0.78rem;
  font-weight: 800;
  margin-bottom: 4px;
  color: var(--text, #e8eef8);
}
.slip-line.ticket-leg {
  align-items: flex-start;
  flex-direction: column;
  gap: 2px;
}
.slip-line.ticket-leg span {
  white-space: normal;
  overflow: visible;
  text-overflow: unset;
}
.slip-line.is-lead { color: #9dffb0; }
.slip-line.is-trail { color: #ffc48a; }
.slip-line.is-won { color: #9dffb0; font-weight: 800; }
.slip-line.is-lost { color: #ff8a7a; }
.slip-ticket.is-won {
  border-color: rgba(80, 220, 140, 0.45);
  background: linear-gradient(180deg, rgba(40, 90, 60, 0.35), rgba(20, 28, 24, 0.2));
}
.slip-ticket.is-won .slip-head { color: #9dffb0; }

@media (max-width: 980px) {
  :root { --header-h: 54px; --bottom-h: 84px; }
  .wrap { width: min(1180px, calc(100% - 20px)); }
  .site-header .wrap { width: calc(100% - 16px); }
  .nav {
    gap: 8px;
    justify-content: space-between;
    width: 100%;
  }
  .nav-actions { margin-left: auto; }
  .auth-btns { gap: 8px; }
  .auth-btns .btn-ghost {
    background: #2a2e36;
    border: 0;
    color: #fff;
    border-radius: 999px;
  }
  .top-bets { flex: 0 1 auto; gap: 6px; }
  .top-bet {
    height: 32px;
    padding: 0 10px;
    font-size: 0.68rem;
  }
  .menu-toggle { display: none !important; }
  .search-btn { display: none !important; }
  .desk-only { display: none !important; }
  .brand { flex: 0 1 auto; letter-spacing: -0.03em; font-size: 1.18rem; }
  .brand-full { display: none; }
  .brand-short { display: none; }
  .brand img.brand-logo {
    height: 32px;
    max-width: min(168px, 44vw);
  }
  .brand img,
  .brand-mark {
    display: block;
    width: 28px;
    height: 28px;
  }
  .icon-btn { width: 34px; height: 34px; flex-shrink: 0; }
  .bal { padding: 4px 12px; font-size: 0.7rem; max-width: 34vw; }
  .bal img { display: none; }
  .bal span { display: none; }
  .bal b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .auth-btns .btn-sm {
    padding: 0 12px;
    min-height: 32px;
    font-size: 0.68rem;
    border-radius: 999px;
  }
  .auth-btns .btn-primary {
    min-height: 32px;
    background: #22c55e;
  }
  .auth-btns .btn-primary:hover { background: #16a34a; }
  .search-btn,
  .top-bets,
  .desk-bell { display: none !important; }
  .site-footer { display: none; }
  .intro { padding: 14px 0 4px; }
  .home-banners,
  .cas-banners {
    height: auto;
    margin: 8px 0 14px;
  }
  .ban-nav { display: none; }
  .ban-track {
    gap: 0;
    height: 176px;
  }
  .home-banners .home-ban,
  .cas-banners .home-ban {
    display: block;
    flex: 0 0 100%;
    width: 100%;
    height: 176px;
    min-height: 176px;
    scroll-snap-align: start;
    border-radius: 18px;
  }
  .home-ban-body {
    padding: 18px 16px 28px;
  }
  .home-ban-body b { font-size: 1.55rem; }
  .home-ban-body > span { font-size: 0.95rem; }
  .ban-btn {
    height: 30px;
    font-size: 0.74rem;
    margin-top: 10px;
    padding: 0 14px;
  }
  html.no-sport .home-banners {
    height: auto;
  }
  .ban-dots {
    display: flex;
    gap: 6px;
    position: absolute;
    left: 14px;
    bottom: 12px;
    z-index: 2;
    pointer-events: none;
  }
  .ban-dots i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: rgba(255,255,255,.35);
  }
  .ban-dots i.is-on { background: #fff; }
  .mgame { flex: 0 0 126px; height: 148px; font-size: 1rem; }
  .mgame small {
    display: block;
    font-size: 0.68rem;
    font-weight: 600;
    color: #9dffb0;
    margin-top: 4px;
  }
  .cas-sub {
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 16px;
    margin: 2px 0 12px;
    scrollbar-width: none;
  }
  .cas-sub::-webkit-scrollbar { display: none; }
  .cas-tab {
    background: transparent;
    height: auto;
    padding: 8px 0;
    border-radius: 0;
    font-size: 0.92rem;
    font-weight: 700;
    color: #fff;
  }
  .cas-tab.is-on {
    background: #2f6bff;
    color: #fff;
    height: 34px;
    padding: 0 16px;
    border-radius: 999px;
  }
  .cas-banners {
    height: auto;
  }
  .cas-bar { gap: 8px; }
  .cas-search {
    min-width: 0;
    height: 44px;
    border-radius: 12px;
  }
  .cas-provs {
    width: auto;
    flex: 0 0 auto;
    height: 44px;
    border-radius: 12px;
    padding: 0 12px;
    justify-content: center;
  }
  .cas-pill {
    height: 40px;
    border-radius: 12px;
    gap: 6px;
    padding: 0 12px;
  }
  .cas-pill svg { width: 16px; height: 16px; display: block; }
  .prov-grid { grid-template-columns: 1fr 1fr; }
  .find-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .intro h1 { font-size: 1.38rem; }
  .intro p { font-size: 0.82rem; margin-bottom: 12px; }
  .hero-actions { gap: 8px; }
  .hero-actions .btn { flex: 1; min-width: 0; padding: 0.55rem 0.5rem; font-size: 0.74rem; }
  .hero-actions .btn-soft { display: none; }
  .cats { grid-template-columns: 1fr 1fr; gap: 8px; margin: 12px 0; }
  .cat { min-height: 0; border-radius: 14px; }
  .cat img { height: 96px; }
  .cat span { font-size: 0.78rem; left: 10px; bottom: 8px; }
  .section { margin: 18px 0 6px; }
  .section-head { margin-bottom: 10px; align-items: center; }
  .section-head h2 { font-size: 1rem; }
  .grid:not([data-games]) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .gcard { flex-basis: 108px; width: 108px; }
  .rail-btn { width: 28px; height: 28px; font-size: 1rem; }
  .card-body { padding: 8px; }
  .card-body strong {
    font-size: 0.75rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .meta { font-size: 0.62rem; gap: 6px; }
  .meta span:last-child { display: none; }
  .live-row, .provs, .promos, .vip-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .live-tile { min-height: 0; border-radius: 14px; }
  .live-tile img { height: 118px; }
  .live-tile figcaption { font-size: 0.78rem; padding: 10px; }
  .match, .event, .prov, .promo, .vip-card { padding: 10px; border-radius: 14px; }
  .match { grid-template-columns: 1fr; }
  .match-teams, .event h3 {
    font-size: 0.84rem;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .odd { padding: 7px 4px; min-width: 0; }
  .odd small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .filters {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    margin: 0 -10px 12px;
    padding: 0 10px 6px;
  }
  .filters::-webkit-scrollbar { display: none; }
  .chip { flex: 0 0 auto; padding: 6px 10px; font-size: 0.72rem; }
  .cover { border-radius: 14px; margin: 6px 0 12px; }
  .cover img { height: 132px; }
  .page-hero { padding: 12px 0 4px; }
  .page-hero h1 { font-size: 1.28rem; }
  .page-hero .hint { font-size: 0.78rem; }
  .foot { grid-template-columns: 1fr 1fr; gap: 12px; }
  .site-footer { margin-top: 28px; padding: 18px 0 20px; display: none; }
  .prov { min-height: 96px; }
  .prov .mark { width: 100%; height: 44px; border-radius: 10px; }
  .sheet {
    width: calc(100% - 20px);
    max-height: calc(100dvh - 24px);
    overflow: auto;
    padding: 14px;
    border-radius: 16px;
  }
  .sheet.sheet-pick {
    width: min(280px, calc(100vw - 40px));
    max-height: none;
    overflow: hidden;
    padding: 0 0 12px;
  }
  .sheet.sheet-profile {
    width: min(420px, calc(100% - 20px));
    max-height: none;
    overflow: hidden;
    padding: 16px 18px 8px;
    border-radius: 20px;
    background: #16181e;
    border: 1px solid rgba(255, 255, 255, 0.1);
  }
  .sheet.sheet-settings,
  #setSheet.sheet-settings {
    width: min(400px, calc(100% - 16px));
    max-height: calc(100dvh - 16px);
    padding: 14px 16px 16px;
    border-radius: 24px;
    background: #16181e;
    border: 1px solid rgba(255, 255, 255, 0.1);
  }
  .sheet.sheet-pay {
    width: min(400px, calc(100% - 16px));
    max-height: calc(100dvh - 16px);
    padding: 14px 14px 8px;
    border-radius: 22px;
  }
  .sheet-actions { flex-direction: column; }
  .sheet-actions .btn { width: 100%; }
  .reels { gap: 6px; font-size: 1.7rem; }
  .reel { width: 56px; height: 56px; border-radius: 12px; }
  .search-overlay { padding: 64px 12px 24px; }
  .search-overlay input, .field input { font-size: 16px; }
  .slip {
    left: 10px;
    right: 10px;
    bottom: calc(var(--bottom-h) + env(safe-area-inset-bottom) + 10px);
    width: auto;
  }
  .toast {
    bottom: calc(var(--bottom-h) + env(safe-area-inset-bottom) + 12px);
    max-width: calc(100% - 24px);
    font-size: 0.8rem;
  }
  .bottom-nav {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 70;
    background: rgba(0, 5, 10, 0.96);
    border-top: 1px solid var(--border);
    padding: 8px 8px calc(10px + env(safe-area-inset-bottom));
    gap: 4px;
    box-shadow: 0 -12px 32px rgba(0, 0, 0, 0.35);
  }
  .bottom-nav a,
  .bottom-nav button {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    min-height: 64px;
    color: var(--muted);
    text-align: center;
    font-size: 0.78rem;
    font-weight: 800;
    padding: 8px 2px;
    min-width: 0;
    width: 100%;
    border: 0;
    border-radius: 16px;
    overflow: hidden;
    background: transparent;
    cursor: pointer;
    font-family: inherit;
  }
  .bottom-nav a.is-active,
  .bottom-nav button.is-active {
    color: #2f6bff;
    background: transparent;
    box-shadow: none;
  }
  .bottom-nav button[aria-expanded="true"] {
    color: var(--muted);
    background: transparent;
  }
  .tab-ico {
    width: 26px;
    height: 26px;
    display: grid;
    place-items: center;
    flex-shrink: 0;
  }
  .tab-ico svg { width: 26px; height: 26px; display: block; }
  .tab-lbl {
    font-size: 0.78rem;
    line-height: 1;
    letter-spacing: 0.01em;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
html.drawer-open { overflow: hidden; }
  .drawer {
    display: block; position: fixed; inset: 0; z-index: 90; pointer-events: none;
  }
  .drawer.open { pointer-events: auto; }
  .drawer-back {
    position: absolute; inset: 0;
    background: rgba(0, 0, 0, 0.62);
    opacity: 0; transition: opacity .22s;
  }
  .drawer.open .drawer-back { opacity: 1; }
  .drawer-panel {
    position: absolute;
    top: 0; left: 0; bottom: 0;
    width: min(340px, 78vw);
    background: #121212;
    padding: calc(10px + env(safe-area-inset-top)) 14px calc(16px + env(safe-area-inset-bottom));
    transform: translateX(-105%);
    transition: transform .24s cubic-bezier(0.22, 1, 0.36, 1);
    overflow: auto;
    box-shadow: 18px 0 50px rgba(0, 0, 0, 0.55);
    display: flex;
    flex-direction: column;
    gap: 2px;
  }
  .drawer.open .drawer-panel { transform: none; }
  .drawer-x {
    position: absolute;
    left: min(340px, 78vw);
    top: calc(10px + env(safe-area-inset-top));
    margin-left: 10px;
    width: 40px;
    height: 40px;
    border: 0;
    border-radius: 50%;
    background: #22c55e;
    color: #fff;
    font-size: 1.15rem;
    line-height: 1;
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    z-index: 2;
  }
  .drawer.open .drawer-x { opacity: 1; pointer-events: auto; }
  .dw-login, .dw-row, .dw-sup, .dw-app {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    border: 0;
    background: transparent;
    color: #fff;
    font: inherit;
    font-weight: 700;
    font-size: 0.95rem;
    text-align: left;
    padding: 12px 4px;
    cursor: pointer;
    border-radius: 12px;
  }
  .dw-login { padding: 8px 4px 14px; }
  .dw-ava {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #2a2e36;
    display: grid;
    place-items: center;
    color: #c8d0dc;
  }
  .dw-ava svg { width: 18px; height: 18px; }
  .dw-chev {
    margin-left: auto;
    color: #8b93a3;
    width: 18px;
    display: grid;
    place-items: center;
  }
  .dw-chev svg { width: 16px; height: 16px; }
  .dw-row .side-ico {
    width: 22px;
    height: 22px;
    color: #c8d0dc;
    display: grid;
    place-items: center;
    flex-shrink: 0;
  }
  .dw-row .side-ico svg { width: 20px; height: 20px; }
  .dw-badge {
    margin-left: auto;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    background: #f97316;
    color: #fff;
    font-size: 0.68rem;
    font-style: normal;
    font-weight: 800;
    display: grid;
    place-items: center;
  }
  .dw-hr { height: 1px; background: #2a2e36; margin: 8px 0; }
  .dw-acc .dw-sub { display: none; padding: 0 8px 8px 38px; }
  .dw-acc.open .dw-sub { display: flex; flex-direction: column; gap: 2px; }
  .dw-acc.open .dw-row .dw-chev { transform: rotate(90deg); }
  .dw-sub a {
    color: #c8d0dc;
    font-weight: 650;
    font-size: 0.88rem;
    padding: 8px 4px;
  }
  .dw-app {
    margin-top: 8px;
    background: #1a1d24;
    padding: 12px;
    align-items: center;
  }
  .dw-app + .dw-app { margin-top: 6px; }
  .dw-app > span:nth-child(2) { display: flex; flex-direction: column; min-width: 0; }
  .dw-app b { font-size: 0.88rem; }
  .dw-app small { color: #8b93a3; font-size: 0.72rem; font-weight: 600; }
  .dw-and { font-size: 1.4rem; flex-shrink: 0; }
.dw-foot,
.dw-soc {
  display: none !important;
}
  .dw-soc a {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #1a1d24;
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 0.78rem;
    font-weight: 800;
  }
  .dw-lang {
    border: 0;
    background: transparent;
    color: #fff;
    font: inherit;
    font-weight: 800;
    cursor: pointer;
  }
  .dw-sup {
    margin-top: 4px;
    background: #1a1d24;
    padding: 12px;
  }
  .dw-sup b {
    margin-left: auto;
    background: #2f6bff;
    color: #fff;
    font-size: 0.68rem;
    padding: 4px 8px;
    border-radius: 999px;
  }
}

@media (max-width: 640px) {
  .foot { grid-template-columns: 1fr; }
}

html.no-sport .need-sport { display: none !important; }
html.no-events .need-events { display: none !important; }
html.no-sport.no-events .need-bets { display: none !important; }
html.no-sport .bottom-nav { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.desk-top,
.desk-side { display: none; }
.desk-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 38px;
  padding: 0 14px 0 10px;
  color: #fff;
  font-size: 0.84rem;
  font-weight: 700;
  border-radius: 999px;
  white-space: nowrap;
  background: #2a2e36;
}
.desk-link:hover { background: #343a44; color: #fff; }
.desk-link.is-on {
  color: #fff;
  background: #2f6bff;
}
.desk-ico {
  width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  color: currentColor;
}
.desk-ico svg { width: 16px; height: 16px; display: block; }
.desk-more { position: relative; z-index: 70; flex-shrink: 0; }
.desk-more-btn {
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  height: 38px;
  padding: 0 14px;
  font-size: 0.84rem;
  font-weight: 700;
  color: #fff;
  border: 0;
  background: #2a2e36;
  border-radius: 999px;
  font-family: inherit;
}
.desk-more-btn::after { content: " ▾"; font-size: 0.7em; opacity: 0.7; }
.desk-more.open .desk-more-btn {
  background: #2f6bff;
  color: #fff;
}
.desk-more-drop {
  display: none;
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 240px;
  grid-template-columns: 1fr;
  gap: 2px;
  padding: 8px;
  background: #07101d;
  border: 1px solid var(--border);
  border-radius: 14px;
  box-shadow: var(--shadow);
  z-index: 80;
}
.desk-more.open .desk-more-drop { display: grid; }
.desk-more-drop .desk-link {
  height: auto;
  padding: 8px 10px;
  justify-content: flex-start;
  background: transparent;
  border-radius: 10px;
}
.desk-more-drop .desk-link:hover { background: rgba(255,255,255,.06); }
.desk-more-drop .desk-link.is-on {
  background: #2f6bff;
}
.desk-cash { display: none; }
.btn-deposit {
  background: #22c55e;
  color: #fff;
  box-shadow: none;
  font-weight: 800;
  min-height: 40px;
  padding: 0 16px;
  border-radius: 10px;
  border: 0;
}
.btn-deposit:hover { filter: brightness(1.06); }
.desk-bal {
  display: none;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 0;
  min-height: 40px;
  padding: 2px 8px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--text);
  cursor: pointer;
  font-family: inherit;
  line-height: 1.15;
}
.desk-bal span { color: rgba(255,255,255,.75); font-size: 0.68rem; font-weight: 700; }
.desk-bal b { color: #fff; font-size: 0.92rem; font-weight: 800; }
.desk-bell {
  position: relative;
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 10px;
  background: #2a3140;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  padding: 0;
}
.desk-bell:hover { background: #3a4254; }
.desk-bell-ico { width: 18px; height: 18px; display: block; }
.desk-bell-dot {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #22c55e;
}
.nt-pop {
  position: fixed;
  top: calc(var(--header-h) + 8px);
  right: 12px;
  z-index: 95;
  width: min(340px, calc(100vw - 20px));
}
.nt-pop[hidden] { display: none !important; }
.nt-card {
  background: #eceff3;
  color: #14171c;
  border-radius: 18px;
  box-shadow: 0 18px 50px rgba(0,0,0,.4);
  overflow: hidden;
  min-height: 360px;
  display: flex;
  flex-direction: column;
}
.nt-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 16px 8px;
}
.nt-head strong { font-size: 1.05rem; }
.nt-x {
  width: 32px;
  height: 32px;
  border: 0;
  background: transparent;
  color: #5b6470;
  font-size: 1.1rem;
  cursor: pointer;
  border-radius: 8px;
}
.nt-tabs {
  display: flex;
  gap: 6px;
  padding: 0 14px 10px;
}
.nt-tab {
  border: 0;
  background: transparent;
  color: #5b6470;
  font: inherit;
  font-weight: 700;
  font-size: 0.82rem;
  padding: 7px 12px;
  border-radius: 10px;
  cursor: pointer;
}
.nt-tab.is-on { background: #2f6bff; color: #fff; }
.nt-body { flex: 1; overflow: auto; padding: 8px 14px 16px; }
.nt-empty {
  min-height: 240px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 8px;
  color: #8b939e;
  padding: 24px 12px;
}
.nt-empty svg { width: 52px; height: 52px; opacity: 0.55; }
.nt-empty b { color: #2a3140; font-size: 1.05rem; }
.nt-empty small { font-size: 0.78rem; line-height: 1.35; max-width: 220px; }
.nt-item {
  background: #fff;
  border-radius: 12px;
  padding: 10px 12px;
  margin-bottom: 8px;
}
.nt-item small { display: block; color: #8b939e; font-size: 0.7rem; margin-bottom: 4px; }
.nt-item b { display: block; font-size: 0.88rem; margin-bottom: 4px; }
.nt-item p { margin: 0; font-size: 0.8rem; color: #3a4250; white-space: pre-wrap; }

.side-profile {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 4px 10px 8px;
  padding: 10px;
  width: calc(100% - 20px);
  border: 0;
  border-radius: 14px;
  background: rgba(255,255,255,.06);
  color: inherit;
  text-align: left;
  cursor: pointer;
  font-family: inherit;
}
.side-profile b { display: block; font-size: 0.92rem; }
.side-profile small { color: var(--muted); font-size: 0.72rem; }
.side-ava {
  position: relative;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #2a3140;
  display: grid;
  place-items: center;
  font-weight: 800;
  flex-shrink: 0;
}
.side-ava i {
  position: absolute;
  right: -6px;
  bottom: -4px;
  font-style: normal;
  font-size: 0.5rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  background: #00e5ff;
  color: #041018;
  border-radius: 999px;
  padding: 1px 5px;
  max-width: 46px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.side-ava i.is-cyan { background: #00e5ff; color: #041018; }
.side-ava i.is-blue { background: #007bff; color: #fff; }
.side-ava i.is-ice { background: #c8f7ff; color: #041018; }
.side-ava i.is-void { background: #1a1030; color: #c4b5fd; border: 1px solid #7c5cff; }
.side-chev { margin-left: auto; opacity: 0.5; font-size: 1.2rem; }
.side-free {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 0 10px 10px;
  padding: 12px 14px;
  border-radius: 12px;
  background: linear-gradient(90deg, #2a3a22, #1a2418);
  color: #fff;
  font-weight: 800;
}
.side-free-cash {
  width: 36px;
  height: 28px;
  border-radius: 6px;
  background: #3d6b32;
  display: grid;
  place-items: center;
  font-size: 1.1rem;
}
.side-acc { margin: 2px 0; }
.side-acc-btn {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 10px 14px;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  text-align: left;
}
.side-acc-btn em {
  margin-left: auto;
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(-45deg);
  opacity: 0.55;
}
.side-acc.open .side-acc-btn em { transform: rotate(45deg); }
.side-acc-body { display: none; padding: 0 6px 6px 8px; }
.side-acc.open .side-acc-body { display: grid; gap: 2px; }
.side-ico {
  width: 20px;
  height: 20px;
  display: inline-flex;
  flex-shrink: 0;
  opacity: 0.9;
}
.side-ico svg { width: 20px; height: 20px; display: block; }
.side-link {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 8px;
  padding: 8px 10px;
  border-radius: 10px;
  border: 0;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 0.86rem;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
  width: calc(100% - 16px);
}
.side-link:hover { background: rgba(255,255,255,.08); }
.side-link.is-on {
  background: rgba(255,255,255,.12);
  color: #fff;
}
.side-n {
  margin-left: auto;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background: #ff3b4e;
  color: #fff;
  font-size: 0.68rem;
  display: grid;
  place-items: center;
}
.side-plus .side-ico { color: #3b82f6; }
.side-gap { height: 10px; }
.side-foot { padding: 8px 10px 12px; }
.side-app {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px;
  border-radius: 14px;
  background: #152033;
  color: #fff;
  margin-bottom: 10px;
}
.side-app b { display: block; font-size: 0.82rem; }
.side-app small { display: block; color: var(--muted); font-size: 0.68rem; line-height: 1.3; }
.side-app-ico {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #2563eb;
  display: grid;
  place-items: center;
  flex-shrink: 0;
}
.side-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 4px 4px 10px;
  color: var(--muted);
}
.side-soc { color: inherit; font-weight: 800; font-size: 0.8rem; }
.lang-picker { padding: 0 10px 10px; }
.lang-now {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  border: 0;
  background: rgba(255, 255, 255, 0.06);
  color: #e8edf5;
  text-align: left;
  padding: 8px 10px;
  border-radius: 10px;
  font: inherit;
  font-weight: 700;
  font-size: 0.82rem;
  cursor: pointer;
}
.lang-now:hover { background: rgba(255, 255, 255, 0.1); }
.lang-caret { margin-left: auto; opacity: 0.7; font-size: 0.7rem; }
.lang-menu {
  position: fixed;
  z-index: 220;
  display: grid;
  gap: 2px;
  padding: 6px;
  border-radius: 12px;
  background: #1a1e27;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45);
}
.lang-menu[hidden] { display: none !important; }
.lang-item {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  border: 0;
  background: transparent;
  color: #e8edf5;
  text-align: left;
  padding: 8px 10px;
  border-radius: 8px;
  font: inherit;
  font-weight: 700;
  font-size: 0.82rem;
  cursor: pointer;
}
.lang-item:hover { background: rgba(255, 255, 255, 0.08); }
.lang-item.is-on { background: #2f6bff; color: #fff; }
.lang-flag,
.lang-now img,
.lang-item img {
  display: none !important;
}
.lang-flag-emo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.35em;
  height: 1.35em;
  overflow: hidden;
  font-size: 1.25rem;
  line-height: 1;
  flex-shrink: 0;
}
.lang-picker.dw { padding: 8px 0 4px; }
.lang-picker.dw .lang-now { background: #1a1d24; color: #fff; }
.lang-now .side-ico { display: none; }
.drawer-panel .dw-foot,
.drawer-panel .dw-soc {
  display: none !important;
}
.side-support {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 10px 12px;
  border: 0;
  border-radius: 12px;
  background: rgba(255,255,255,.06);
  color: inherit;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}
.side-support b {
  margin-left: auto;
  background: #2f6bff;
  color: #fff;
  border-radius: 999px;
  padding: 3px 8px;
  font-size: 0.68rem;
}
.side-pin {
  display: none;
}

@media (min-width: 981px) {
  body { padding-left: var(--desk-side); }
  html.side-min { --desk-side: var(--desk-side-min); }
  .site-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    margin-left: 0;
    width: 100%;
    padding-left: 16px;
    padding-right: 16px;
    box-sizing: border-box;
  }
  html.mv-maint .site-header { top: 42px; }
  .site-header .wrap { width: 100%; max-width: none; }
  .mob-cash { display: none !important; }
  .desk-cash { display: inline-flex; }
  .desk-bal { display: inline-flex; }
  .top-bets { display: none !important; }
  .desk-top {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
    min-width: 0;
    overflow: visible;
    flex-wrap: nowrap;
    padding: 8px 0;
    margin-left: 12px;
  }
  .site-header .brand,
  .desk-top .desk-link,
  .desk-more { flex-shrink: 0; }
  .home-page { padding-top: 18px; }
  html.no-sport .home-banners {
    height: auto;
  }
  .desk-link.is-on {
    background: #2f6bff;
    color: #fff;
  }
  .desk-side {
    display: flex;
    flex-direction: column;
    position: fixed;
    top: var(--header-h);
    left: 0;
    bottom: 0;
    width: var(--desk-side);
    z-index: 46;
    background: #12151c;
    border-right: 1px solid rgba(255,255,255,.06);
    padding: 8px 0 0;
    overflow: visible;
    transition: width .18s ease;
  }
  .side-pin {
    display: grid;
    place-items: center;
    position: absolute;
    top: 92px;
    right: -13px;
    z-index: 70;
    width: 26px;
    height: 26px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #2a3140;
    color: #fff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.45);
    cursor: pointer;
  }
  .side-pin svg {
    width: 12px;
    height: 12px;
    display: block;
    transition: transform .18s ease;
  }
  html:not(.side-min) .side-pin svg { transform: rotate(180deg); }
  .side-pin:hover { background: #3a4252; }
  .side-scroll {
    overflow: auto;
    flex: 1;
    min-height: 0;
    scrollbar-width: none;
  }
  .side-scroll::-webkit-scrollbar { width: 0; height: 0; }
  html.side-min .side-acc-btn > span:not(.side-ico),
  html.side-min .side-acc-btn em,
  html.side-min .side-link > span:not(.side-ico),
  html.side-min .side-profile > span:not(.side-ava),
  html.side-min .side-support > span,
  html.side-min .side-support b,
  html.side-min .side-app span:not(.side-app-ico),
  html.side-min .side-app .side-chev,
  html.side-min .side-meta,
  html.side-min .side-n,
  html.side-min .side-acc-body {
    display: none !important;
  }
  html.side-min .lang-name,
  html.side-min .lang-caret { display: none !important; }
  html.side-min .lang-picker { padding: 4px 6px 8px; }
  html.side-min .lang-now { justify-content: center; padding: 8px 0; }
  html.side-min .side-link,
  html.side-min .side-acc-btn,
  html.side-min .side-profile,
  html.side-min .side-support,
  html.side-min .side-app {
    justify-content: center;
    margin-left: 6px;
    margin-right: 6px;
    width: calc(100% - 12px);
    padding-left: 0;
    padding-right: 0;
  }
  html.side-min .side-app { background: transparent; }
}

.mv-chat-fab {
  position: fixed; left: 16px; bottom: 88px; z-index: 70;
  height: 44px; padding: 0 16px; border: 0; border-radius: 999px;
  background: var(--accent, #3dffc3); color: #04140e; font-weight: 800; cursor: pointer;
  box-shadow: var(--shadow);
}
.mv-chat-fab.has-new { animation: mvPulse 1.4s infinite; }
@keyframes mvPulse { 50% { transform: scale(1.06); } }
.mv-chat-box {
  position: fixed; left: 16px; bottom: 140px; z-index: 71;
  width: min(300px, calc(100% - 24px));
  max-height: min(52vh, 380px);
  display: flex; flex-direction: column;
  background: #12151c; border: 1px solid rgba(255,255,255,.08); border-radius: 14px;
  box-shadow: var(--shadow); overflow: hidden;
}
.mv-chat-box[hidden] { display: none !important; }
.mv-chat-head {
  display: flex; justify-content: space-between; align-items: center;
  padding: 8px 10px; border-bottom: 1px solid rgba(255,255,255,.08); font-size: 0.78rem;
}
.mv-chat-head button { background: none; border: 0; color: inherit; font-size: 1.15rem; cursor: pointer; }
.mv-chat-msgs { flex: 1; overflow: auto; padding: 8px; display: grid; gap: 6px; min-height: 96px; }
.mv-chat-msg { max-width: 88%; padding: 6px 8px; border-radius: 10px; font-size: 0.78rem; background: #1a1d24; line-height: 1.35; }
.mv-chat-msg.is-voice {
  max-width: 92%;
  min-width: min(240px, 100%);
  padding: 8px 10px 10px;
}
.mv-chat-msg.desk { background: #1e2430; }
.mv-chat-msg.visitor { justify-self: end; background: #2f6bff; color: #fff; }
.mv-chat-msg.visitor small { color: rgba(255,255,255,.7); }
.mv-chat-msg small { display: block; opacity: 0.6; font-size: 0.62rem; margin-bottom: 3px; }
.mv-chat-msg audio { position: absolute; width: 0; height: 0; opacity: 0; pointer-events: none; }
.mv-voice {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 40px;
}
.mv-voice-play {
  flex: 0 0 36px;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 50%;
  background: #fff;
  color: #1a1d24;
  font-size: 0.72rem;
  line-height: 1;
  cursor: pointer;
  display: grid;
  place-items: center;
  padding: 0 0 0 2px;
}
.mv-chat-msg.visitor .mv-voice-play { color: #2f6bff; }
.mv-voice.is-play .mv-voice-play { padding: 0; letter-spacing: -2px; }
.mv-voice-wave {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 2px;
  height: 28px;
}
.mv-voice-wave i {
  flex: 1 1 3px;
  max-width: 4px;
  border-radius: 2px;
  background: currentColor;
  opacity: 0.32;
}
.mv-voice-wave i.is-on { opacity: 1; }
.mv-chat-msg.visitor .mv-voice-wave i { background: #fff; }
.mv-voice-time {
  flex: 0 0 auto;
  font-size: 0.72rem;
  font-variant-numeric: tabular-nums;
  opacity: 0.9;
  min-width: 34px;
}
.mv-chat-bar { display: flex; gap: 5px; padding: 6px 8px 8px; align-items: center; }
.mv-chat-bar input {
  flex: 1; min-width: 0; height: 34px; border-radius: 10px;
  border: 1px solid rgba(255,255,255,.1); background: #0b0d12; color: inherit;
  padding: 0 10px; font: inherit; font-size: 0.8rem;
}
.mv-chat-file { cursor: pointer; }
.mv-chat-file input { display: none; }
.mv-chat-bar button, .mv-chat-file span {
  height: 34px; min-width: 34px; border-radius: 10px; border: 0;
  background: #1a1d24; color: inherit; cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
}
.mv-chat-bar button.is-on { background: #ff5c7a; color: #14040a; }
.mv-chat-box.is-intro .mv-chat-file,
.mv-chat-box.is-intro #mvChatVoice { display: none; }
@media (max-width: 980px) {
  .mv-chat-fab { display: none; }
  .mv-chat-box {
    left: 12px; right: 12px; width: auto;
    bottom: calc(var(--bottom-h) + env(safe-area-inset-bottom) + 10px);
    max-height: min(48vh, 340px);
  }
}
@media (min-width: 981px) {
  .mv-chat-fab { display: none !important; }
  .mv-chat-box { left: calc(var(--desk-side) + 16px); bottom: 24px; }
}

@media (max-width: 380px) {
  .top-bet { padding: 0 8px; font-size: 0.64rem; }
  .cats { gap: 6px; }
  .cat img { height: 84px; }
}

body[data-page="events"] {
  background: #121212;
  color: #f4f4f5;
}
body[data-page="events"] .sport-page {
  background: #ececec;
  color: #16181d;
  border-radius: 18px;
  padding: 14px 14px 28px;
  margin-top: 14px;
  margin-bottom: 24px;
}
body[data-page="events"] .sport-page .hint {
  color: #5c6573;
}
body[data-page="events"] .sb-feed-title {
  margin: 4px 2px 12px;
  font-size: 1.12rem;
  font-weight: 800;
  color: #16181d;
}
.ev-cats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 4px 0 12px;
}
body[data-page="events"] .ev-cats .sb-tab {
  background: #dedede;
  color: #16181d;
  border: 0;
  border-radius: 10px;
  padding: 8px 14px;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}
body[data-page="events"] .ev-cats .sb-tab.is-on {
  background: #2f6bff;
  color: #fff;
}
body[data-page="events"] .event {
  background: #fff;
  border: 0;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
  color: #16181d;
}
body[data-page="events"] .event h3 {
  color: #16181d;
}
body[data-page="events"] .event .match-liga {
  color: #6b7280;
}
body[data-page="events"] .event .odd {
  background: #ececec;
  border: 0;
  color: #16181d;
}
body[data-page="events"] .event .odd small {
  color: #6b7280;
}
body[data-page="events"] .event .odd b {
  color: #16181d;
}
body[data-page="events"] .event .odd.is-on,
body[data-page="events"] .event .odd.is-on b,
body[data-page="events"] .event .odd.is-on small {
  background: #2f6bff;
  color: #fff !important;
}
body[data-page="sport"],
body[data-page="esports"] {
  background: #121212;
  color: #f4f4f5;
}
body[data-page="sport"] .sport-page,
body[data-page="esports"] .sport-page {
  background: #ececec;
  color: #16181d;
  border-radius: 18px;
  padding: 14px 14px 28px;
  margin-top: 14px;
  margin-bottom: 24px;
}
body[data-page="sport"] .sport-page .hint,
body[data-page="esports"] .sport-page .hint {
  color: #5c6573;
}
body[data-page="sport"] .sb-feed-title,
body[data-page="esports"] .sb-feed-title {
  margin: 4px 2px 12px;
  font-size: 1.12rem;
  font-weight: 800;
  color: #16181d;
}
body[data-page="sport"] .sb-tabs,
body[data-page="esports"] .sb-tabs {
  border-bottom: 0;
  gap: 8px;
  margin: 4px 0 12px;
}
body[data-page="sport"] .sb-tab,
body[data-page="esports"] .sb-tab {
  background: #dedede;
  color: #3a3f48;
  border-radius: 999px;
  padding: 8px 16px 8px;
  font-size: 0.84rem;
}
body[data-page="sport"] .sb-tab.is-on,
body[data-page="esports"] .sb-tab.is-on {
  background: #fff;
  color: #111;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
}
body[data-page="sport"] .sb-tab.is-on::after,
body[data-page="esports"] .sb-tab.is-on::after {
  display: none;
}
body[data-page="sport"] .sb-tiles,
body[data-page="esports"] .sb-tiles {
  background: transparent;
  padding: 4px 0 12px;
  gap: 4px;
}
body[data-page="sport"] .sb-tile,
body[data-page="esports"] .sb-tile {
  color: #222;
}
body[data-page="sport"] .sb-tile-mark,
body[data-page="esports"] .sb-tile-mark {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 0 1px #e2e2e2;
}
body[data-page="sport"] .sb-tile-ico,
body[data-page="sport"] .sb-glyph,
body[data-page="esports"] .sb-tile-ico,
body[data-page="esports"] .sb-glyph {
  color: #3a3f48;
}
body[data-page="sport"] .sb-tile-mark::after,
body[data-page="esports"] .sb-tile-mark::after {
  border-color: transparent transparent transparent #3a3f48;
}
body[data-page="sport"] .sb-tile.is-on .sb-tile-mark,
body[data-page="esports"] .sb-tile.is-on .sb-tile-mark {
  background: #2f6bff;
  box-shadow: 0 8px 18px rgba(47, 107, 255, 0.35);
}
body[data-page="sport"] .sb-tile.is-on .sb-tile-mark::after,
body[data-page="esports"] .sb-tile.is-on .sb-tile-mark::after {
  border-color: transparent transparent transparent #fff;
}
body[data-page="sport"] .sb-tile.is-on .sb-tile-ico,
body[data-page="sport"] .sb-tile.is-on .sb-glyph,
body[data-page="esports"] .sb-tile.is-on .sb-tile-ico,
body[data-page="esports"] .sb-tile.is-on .sb-glyph {
  color: #fff;
}
body[data-page="sport"] .sb-tile b,
body[data-page="esports"] .sb-tile b {
  color: #222;
}
body[data-page="sport"] .sb-tile.is-on b,
body[data-page="esports"] .sb-tile.is-on b {
  color: #111;
}
body[data-page="sport"] .sb-tile small,
body[data-page="esports"] .sb-tile small {
  color: #6b7280;
}
body[data-page="sport"] .sb-pill,
body[data-page="sport"] .sb-hour,
body[data-page="esports"] .sb-pill,
body[data-page="esports"] .sb-hour {
  background: #dedede;
  color: #3a3f48;
}
body[data-page="sport"] .sb-pill.is-on,
body[data-page="sport"] .sb-hour.is-on,
body[data-page="esports"] .sb-pill.is-on,
body[data-page="esports"] .sb-hour.is-on {
  background: #2f6bff;
  color: #fff;
}
body[data-page="sport"] .sb-lg,
body[data-page="esports"] .sb-lg {
  background: #fff;
  color: #222;
  border: 1px solid #e4e4e4;
}
body[data-page="sport"] .sb-lg span,
body[data-page="esports"] .sb-lg span {
  background: #f3f3f3;
  color: #222;
}
body[data-page="sport"] .sb-lg.is-on,
body[data-page="esports"] .sb-lg.is-on {
  background: #2f6bff;
  color: #fff;
  border-color: transparent;
}
body[data-page="sport"] .sb-lg.is-on span,
body[data-page="esports"] .sb-lg.is-on span {
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
}
body[data-page="sport"] .sb-hero,
body[data-page="esports"] .sb-hero {
  border: 0;
  border-radius: 16px;
  min-height: 168px;
}
body[data-page="sport"] .sb-hero img {
  height: 188px;
  filter: saturate(0.9) contrast(1.05);
}
body[data-page="sport"] .sb-hero div {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  background: linear-gradient(transparent, rgba(12, 12, 14, 0.92));
}
body[data-page="sport"] .sb-hero p {
  color: #c8cdd6;
}
body[data-page="sport"] .sb-hero strong {
  color: #fff;
  max-width: 28rem;
}
.sb-hero-cta {
  display: inline-flex;
  align-items: center;
  height: 36px;
  padding: 0 16px;
  border-radius: 10px;
  background: #2f6bff;
  color: #fff !important;
  font-size: 0.82rem;
  font-weight: 800;
}
body[data-page="sport"] .sb-block,
body[data-page="esports"] .sb-block,
body[data-page="sport"] .sb-pick,
body[data-page="esports"] .sb-pick,
body[data-page="sport"] .sb-card-score,
body[data-page="esports"] .sb-card-score {
  color: #16181d;
}
body[data-page="sport"] .sb-rail-head h2,
body[data-page="esports"] .sb-rail-head h2 {
  color: #16181d;
}
body[data-page="sport"] .sb-line .sb-rail,
body[data-page="esports"] .sb-line .sb-rail {
  width: 100%;
}
body[data-page="sport"] .sb-liga,
body[data-page="esports"] .sb-liga {
  background: #fff;
  color: #16181d;
  border-bottom: 1px solid #eee;
}
body[data-page="sport"] .sb-liga em,
body[data-page="esports"] .sb-liga em {
  border-color: #9aa3b2;
}
body[data-page="sport"] .sb-row,
body[data-page="esports"] .sb-row {
  background: #fff;
  border-top: 1px solid #eee;
  color: #16181d;
}
body[data-page="sport"] .sb-row.is-live,
body[data-page="esports"] .sb-row.is-live {
  background: #fff;
}
body[data-page="sport"] .sb-teams,
body[data-page="sport"] .sb-card-teams,
body[data-page="sport"] .sb-pick-info,
body[data-page="esports"] .sb-teams,
body[data-page="esports"] .sb-card-teams,
body[data-page="esports"] .sb-pick-info {
  color: #16181d;
}
body[data-page="sport"] .sb-when,
body[data-page="sport"] .sb-soon,
body[data-page="sport"] .sb-mk-lbl,
body[data-page="sport"] .sb-pick-liga,
body[data-page="sport"] .sb-pick-out,
body[data-page="sport"] .sb-card-top,
body[data-page="esports"] .sb-when,
body[data-page="esports"] .sb-soon,
body[data-page="esports"] .sb-mk-lbl,
body[data-page="esports"] .sb-pick-liga,
body[data-page="esports"] .sb-pick-out,
body[data-page="esports"] .sb-card-top {
  color: #6b7280;
}
body[data-page="sport"] .sb-score,
body[data-page="esports"] .sb-score {
  color: #111;
}
body[data-page="sport"] .sb-row .odd,
body[data-page="sport"] .sb-card .odd,
body[data-page="sport"] .sb-pick .odd,
body[data-page="sport"] .sb-extra .odd,
body[data-page="esports"] .sb-row .odd,
body[data-page="esports"] .sb-card .odd,
body[data-page="esports"] .sb-pick .odd,
body[data-page="esports"] .sb-extra .odd {
  background: #ececec;
  border: 0;
  color: #16181d;
  border-radius: 8px;
}
body[data-page="sport"] .sb-row .odd small,
body[data-page="sport"] .sb-card .odd small,
body[data-page="sport"] .sb-pick .odd small,
body[data-page="sport"] .sb-extra .odd small,
body[data-page="esports"] .sb-row .odd small,
body[data-page="esports"] .sb-card .odd small,
body[data-page="esports"] .sb-pick .odd small,
body[data-page="esports"] .sb-extra .odd small {
  color: #6b7280;
}
body[data-page="sport"] .odd b,
body[data-page="esports"] .odd b {
  color: #16181d;
}
body[data-page="sport"] .odd:hover,
body[data-page="esports"] .odd:hover {
  background: #e0e0e0;
  border-color: transparent;
}
body[data-page="sport"] .odd.is-on,
body[data-page="esports"] .odd.is-on {
  background: #2f6bff;
  border-color: transparent;
  color: #fff;
}
body[data-page="sport"] .odd.is-on b,
body[data-page="sport"] .odd.is-on small,
body[data-page="esports"] .odd.is-on b,
body[data-page="esports"] .odd.is-on small {
  color: #fff !important;
}
body[data-page="sport"] .odd.odd-up,
body[data-page="esports"] .odd.odd-up {
  background: #e8f8ee !important;
}
body[data-page="sport"] .odd.odd-down,
body[data-page="esports"] .odd.odd-down {
  background: #fdecef !important;
}
body[data-page="sport"] .sb-more,
body[data-page="esports"] .sb-more {
  background: #ececec;
  border: 0;
  color: #16181d;
}
body[data-page="sport"] .sb-extra-m span,
body[data-page="esports"] .sb-extra-m span {
  color: #6b7280;
}
body[data-page="sport"] .ev-top h1,
body[data-page="esports"] .ev-top h1 {
  color: #16181d;
}
body[data-page="sport"] .ev-back,
body[data-page="esports"] .ev-back {
  background: #fff;
  color: #16181d;
}
body[data-page="sport"] .ev-tab,
body[data-page="esports"] .ev-tab {
  background: #dedede;
  color: #3a3f48;
}
body[data-page="sport"] .ev-tab.is-on,
body[data-page="esports"] .ev-tab.is-on {
  background: #2f6bff;
  color: #fff;
}
body[data-page="sport"] .ev-score,
body[data-page="esports"] .ev-score,
body[data-page="sport"] .ev-mkt,
body[data-page="esports"] .ev-mkt {
  background: #fff;
  color: #16181d;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
}
body[data-page="sport"] .ev-score small,
body[data-page="sport"] .ev-score-mid em,
body[data-page="esports"] .ev-score small,
body[data-page="esports"] .ev-score-mid em {
  color: #6b7280;
}
body[data-page="sport"] .ev-score b,
body[data-page="sport"] .ev-score-mid strong,
body[data-page="esports"] .ev-score b,
body[data-page="esports"] .ev-score-mid strong {
  color: #111;
}
body[data-page="sport"] .ev-chip,
body[data-page="esports"] .ev-chip {
  background: #dedede;
  color: #3a3f48;
}
body[data-page="sport"] .ev-chip.is-on,
body[data-page="esports"] .ev-chip.is-on {
  background: #2f6bff;
  color: #fff;
}
body[data-page="sport"] .ev-mkt header,
body[data-page="esports"] .ev-mkt header {
  color: #16181d;
}
body[data-page="sport"] .ev-odds .odd,
body[data-page="esports"] .ev-odds .odd {
  background: #ececec;
  border: 0;
  color: #16181d;
}
body[data-page="sport"] .ev-odds .odd small,
body[data-page="esports"] .ev-odds .odd small {
  color: #6b7280;
}
body[data-page="sport"] .ev-odds .odd:hover,
body[data-page="esports"] .ev-odds .odd:hover {
  background: #e0e0e0;
}
body[data-page="sport"] .ev-odds .odd.is-on,
body[data-page="esports"] .ev-odds .odd.is-on {
  background: #2f6bff;
  color: #fff;
}
body[data-page="sport"] .ev-track-note,
body[data-page="esports"] .ev-track-note {
  color: #5c6573;
}
body[data-page="sport"] .ev-off,
body[data-page="esports"] .ev-off {
  color: #5c6573;
}
body[data-page="sport"] .ev-off b,
body[data-page="esports"] .ev-off b {
  color: #16181d;
}
body[data-page="sport"] .ev-stream-off,
body[data-page="esports"] .ev-stream-off {
  background: #fff;
}
body[data-page="sport"] .ev-page .hint a,
body[data-page="esports"] .ev-page .hint a {
  color: #2f6bff;
}
body[data-page="sport"] .ev-page,
body[data-page="esports"] .ev-page {
  max-width: 880px;
  margin: 0 auto;
}
body[data-page="sport"] .ev-top,
body[data-page="esports"] .ev-top {
  position: relative;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
  min-height: 32px;
}
body[data-page="sport"] .ev-top h1,
body[data-page="esports"] .ev-top h1 {
  text-align: left;
  padding: 0;
  font-size: 0.88rem;
  flex: 1;
  min-width: 0;
  line-height: 1.25;
}
body[data-page="sport"] .ev-back,
body[data-page="esports"] .ev-back {
  position: static;
  flex-shrink: 0;
  height: 32px;
  padding: 0 10px;
  font-size: 0.8rem;
}
body[data-page="sport"] .ev-mkt-h,
body[data-page="esports"] .ev-mkt-h {
  color: #16181d;
}
@media (max-width: 760px) {
  .ev-odds-3 { grid-template-columns: 1fr; }
  .ev-grid { grid-template-columns: 1fr; }
  body[data-page="sport"] .ev-top,
  body[data-page="esports"] .ev-top {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 8px;
  }
  body[data-page="sport"] .ev-top h1,
  body[data-page="esports"] .ev-top h1 {
    padding: 0;
    font-size: 0.82rem;
    flex: 1 1 160px;
  }
  body[data-page="sport"] .ev-chips,
  body[data-page="esports"] .ev-chips {
    margin-bottom: 8px;
  }
}
body[data-page="sport"] .slip,
body[data-page="esports"] .slip,
.slip.is-sport {
  background: #f2f2f2;
  color: #16181d;
  border: 0;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.18);
}
body[data-page="sport"] .slip strong,
body[data-page="esports"] .slip strong,
.slip.is-sport strong {
  color: #111;
}
body[data-page="sport"] .slip .hint,
body[data-page="esports"] .slip .hint,
.slip.is-sport .hint {
  color: #5c6573;
}
body[data-page="sport"] .slip .hint b,
body[data-page="esports"] .slip .hint b,
.slip.is-sport .hint b {
  color: #16181d;
}
body[data-page="sport"] .slip-line,
body[data-page="esports"] .slip-line,
.slip.is-sport .slip-line {
  color: #3a3f48;
}
body[data-page="sport"] .slip a,
body[data-page="esports"] .slip a,
.slip.is-sport a {
  color: #6b7280;
}
body[data-page="sport"] .slip .field,
body[data-page="esports"] .slip .field,
.slip.is-sport .field {
  color: #16181d;
}
body[data-page="sport"] .slip input,
body[data-page="esports"] .slip input,
.slip.is-sport input {
  background: #fff;
  color: #111;
  border: 1px solid #ddd;
}
body[data-page="sport"] .slip .btn-place,
body[data-page="esports"] .slip .btn-place,
.slip.is-sport .btn-place {
  background: #22c55e;
  color: #fff;
  box-shadow: none;
}
.slip-empty {
  display: grid;
  justify-items: center;
  gap: 10px;
  padding: 28px 12px 18px;
  text-align: center;
  color: #8a93a3;
  font-size: 0.84rem;
}
.slip-empty p { margin: 0; }
.slip-empty-ico {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background:
    linear-gradient(#2f6bff, #2f6bff) 50% 58% / 18px 2px no-repeat,
    linear-gradient(#2f6bff, #2f6bff) 50% 58% / 2px 18px no-repeat,
    #e8eefc;
}
.slip-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}
.slip-top strong { font-size: 1.05rem; }
.slip-bal {
  display: inline-flex;
  align-items: center;
  font-size: 0.78rem;
  font-weight: 800;
  color: #3a3f48;
}
.slip-modes {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 36px;
  gap: 4px;
  margin-bottom: 10px;
}
.slip-mode {
  height: 34px;
  border: 0;
  border-radius: 10px;
  background: #e4e4e4;
  color: #3a3f48;
  font: inherit;
  font-size: 0.72rem;
  font-weight: 800;
  cursor: pointer;
}
.slip-mode.is-on {
  background: #2f6bff;
  color: #fff;
}
.slip-trash {
  width: 36px;
  height: 34px;
  border: 0;
  border-radius: 10px;
  background: #e4e4e4;
  color: #5c6573;
  cursor: pointer;
  display: grid;
  place-items: center;
}
.slip-items { display: grid; gap: 8px; margin-bottom: 10px; }
.slip-item {
  background: #fff;
  border-radius: 12px;
  padding: 8px 10px 10px;
}
.slip-item-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.slip-live {
  color: #e11d48;
  font-size: 0.72rem;
  font-weight: 800;
}
.slip-live::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #e11d48;
  margin-right: 5px;
  vertical-align: 1px;
}
.slip-pre { font-size: 0.72rem; font-weight: 700; color: #8a93a3; }
.slip-x {
  border: 0;
  background: transparent;
  color: #9aa3b2;
  font-size: 1.1rem;
  cursor: pointer;
  line-height: 1;
}
.slip-match {
  font-size: 0.86rem;
  font-weight: 800;
  margin: 4px 0 8px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.slip-item-bot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.slip-mkt { font-size: 0.78rem; color: #5c6573; min-width: 0; }
.slip-kf {
  flex: 0 0 auto;
  min-width: 52px;
  height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: #2f6bff;
  color: #fff;
  font-size: 0.8rem;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.slip-promo {
  background: #fff;
  border-radius: 12px;
  padding: 10px;
  margin-bottom: 8px;
}
.slip-promo p {
  margin: 0 0 8px;
  font-size: 0.72rem;
  color: #6b7280;
  line-height: 1.35;
}
.slip-promo-bar {
  height: 6px;
  border-radius: 999px;
  background: #ececec;
  overflow: hidden;
}
.slip-promo-bar i {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #22c55e, #4ade80);
  border-radius: 999px;
}
.slip-promo-marks {
  display: flex;
  justify-content: space-between;
  margin-top: 6px;
  font-size: 0.68rem;
  font-weight: 800;
  color: #9aa3b2;
}
.slip-promo-marks .is-on { color: #16a34a; }
.slip-bonus {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  font-size: 0.78rem;
  margin: 6px 2px 10px;
  color: #5c6573;
}
.slip-bonus b { color: #16a34a; font-size: 0.82rem; }
.slip-bonus i {
  font-style: normal;
  color: #9aa3b2;
  cursor: help;
}
.slip-amt {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-size: 0.78rem;
  font-weight: 700;
  color: #3a3f48;
}
.slip-all {
  border: 0;
  background: none;
  color: #2f6bff;
  font: inherit;
  font-size: 0.75rem;
  font-weight: 800;
  cursor: pointer;
  padding: 0;
}
.slip-stake {
  width: 100%;
  height: 42px;
  margin: 6px 0 8px;
  border: 0;
  border-radius: 10px;
  background: #fff;
  color: #111;
  padding: 0 12px;
  font: inherit;
  font-weight: 800;
}
.slip-note { margin: 0 0 8px; font-size: 0.72rem; color: #6b7280; }
.slip-win {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin: 4px 2px 10px;
  font-size: 0.78rem;
  color: #5c6573;
}
.slip-win b { color: #16a34a; font-size: 0.92rem; }
.slip-actions { display: flex; gap: 8px; align-items: center; }
.slip-share {
  width: 42px;
  height: 42px;
  border: 0;
  border-radius: 12px;
  background: #e4e4e4;
  color: #3a3f48;
  font-size: 1.1rem;
  font-weight: 800;
  cursor: pointer;
}
.slip .btn-place {
  flex: 1;
  height: 42px;
  background: #22c55e;
  color: #fff;
  box-shadow: none;
  border-radius: 12px;
}
.slip .btn-place:disabled {
  opacity: 0.72;
  cursor: wait;
}
.odds-change-modal { z-index: 80; }
.odds-change-modal .sheet-odds {
  max-width: 420px;
  padding: 22px 20px 18px;
}
.odds-change-modal h3 {
  margin: 0 0 8px;
  font-size: 1.15rem;
}
.odds-change-modal p {
  margin: 0 0 12px;
  color: var(--muted);
}
.odds-diff {
  list-style: none;
  margin: 0 0 16px;
  padding: 0;
  display: grid;
  gap: 8px;
}
.odds-diff li {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 8px 10px;
  border-radius: 12px;
  background: rgba(255,255,255,0.04);
  font-size: 0.86rem;
}
.odds-diff em {
  font-style: normal;
  font-weight: 800;
  color: var(--warn);
}
.odds-yesno {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
@media (min-width: 981px) {
  body[data-page="sport"],
  body[data-page="esports"] {
    padding-right: 356px;
  }
  body[data-page="sport"] .slip,
  body[data-page="esports"] .slip {
    top: calc(var(--header-h) + 16px);
    right: 16px;
    bottom: auto;
    width: 328px;
    max-height: calc(100vh - var(--header-h) - 32px);
    border-radius: 16px;
  }
  body[data-page="sport"] .slip.open,
  body[data-page="esports"] .slip.open {
    display: block;
  }
}
@media (max-width: 640px) {
  body[data-page="sport"] .sport-page,
  body[data-page="esports"] .sport-page {
    width: min(1180px, calc(100% - 16px));
    padding: 10px 10px 24px;
    border-radius: 14px;
  }
  body[data-page="sport"] .sb-hero img {
    height: 128px;
  }
}

body[data-page="history"] {
  background: #121212;
  color: #f4f4f5;
}
body[data-page="history"] .hist-page {
  background: #ececec;
  color: #16181d;
  border-radius: 18px;
  padding: 14px 14px 28px;
  margin-top: 14px;
  margin-bottom: 24px;
}
body[data-page="history"] .page-hero h1 {
  color: #16181d;
  font-size: 1.28rem;
}
body[data-page="history"] .sb-tabs {
  border-bottom: 0;
  gap: 8px;
  margin: 4px 0 12px;
}
body[data-page="history"] .sb-tab {
  background: #dedede;
  color: #3a3f48;
  border-radius: 999px;
  padding: 8px 16px 8px;
  font-size: 0.84rem;
}
body[data-page="history"] .sb-tab.is-on {
  background: #fff;
  color: #111;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
}
body[data-page="history"] .sb-tab.is-on::after {
  display: none;
}
body[data-page="history"] .hist-panel {
  background: transparent;
  border: 0;
  border-radius: 0;
  overflow: visible;
  margin: 0 0 12px;
}
body[data-page="history"] .hist-toolbar {
  padding: 0 0 10px;
  border-bottom: 0;
}
body[data-page="history"] .hist-tabs {
  gap: 8px;
}
body[data-page="history"] .hist-tab {
  height: 34px;
  padding: 0 14px;
  border-radius: 999px;
  border-bottom: 0;
  background: #dedede;
  color: #3a3f48;
}
body[data-page="history"] .hist-tab.is-on {
  background: #2f6bff;
  color: #fff;
  border-radius: 999px;
  border-bottom: 0;
}
body[data-page="history"] .hist-list {
  padding: 0;
  display: grid;
  gap: 10px;
}
body[data-page="history"] .hist-empty {
  background: #fff;
  border-radius: 14px;
  color: #5c6573;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
}
body[data-page="history"] .hist-card {
  background: #fff;
  border: 0;
  border-radius: 14px;
  padding: 14px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
  color: #16181d;
}
body[data-page="history"] .hist-card-top {
  color: #6b7280;
}
body[data-page="history"] .hist-type {
  color: #16181d;
}
body[data-page="history"] .hist-pick,
body[data-page="history"] .hist-kf {
  color: #111;
}
body[data-page="history"] .hist-event,
body[data-page="history"] .hist-sum span,
body[data-page="history"] .hist-leg-text span {
  color: #6b7280;
}
body[data-page="history"] .hist-kick { color: #6b7280; }
body[data-page="history"] .hist-sum b,
body[data-page="history"] .hist-leg-text b,
body[data-page="history"] .hist-leg-kf {
  color: #16181d;
}
body[data-page="history"] .hist-sum.is-win b {
  color: #16a34a;
}
body[data-page="history"] .hist-toggle {
  background: #f3f3f3;
  color: #16181d;
}
body[data-page="history"] .hist-card.is-express .hist-toggle:hover,
body[data-page="history"] .hist-card.is-open .hist-toggle {
  background: #e8eefc;
}
body[data-page="history"] .hist-legs {
  background: #f7f7f7;
}
body[data-page="history"] .hist-chev {
  border-color: #9aa3b2;
}
body[data-page="history"] .hist-leg.is-won .hist-leg-text b {
  color: #16a34a;
}
body[data-page="history"] .hist-leg.is-lost .hist-leg-text b {
  color: #dc2626;
}
body[data-page="history"] .hist-status.is-lost {
  color: #dc2626;
}
body[data-page="history"] .hist-out.is-won { color: #16a34a; }
body[data-page="history"] .hist-out.is-lost { color: #dc2626; }
body[data-page="history"] .hist-status.is-open {
  color: #2f6bff;
}
body[data-page="history"] .hist-status.is-open .hist-st-ico {
  background: #2f6bff;
  color: #fff;
}
body[data-page="history"] .hist-card.is-go {
  cursor: pointer;
}
body[data-page="history"] .hist-card.is-go:hover {
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.1);
}
body[data-page="history"] .hist-leg.is-go {
  cursor: pointer;
  border-radius: 10px;
  padding: 4px 6px;
}
body[data-page="history"] .hist-leg.is-go:hover {
  background: #eef3ff;
}
body[data-page="history"] .hist-go-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
body[data-page="history"] .hist-go {
  height: 36px;
  padding: 0 14px;
  border: 0;
  border-radius: 10px;
  background: #2f6bff;
  color: #fff;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 800;
  cursor: pointer;
}
body[data-page="history"] .hist-go.is-cash {
  background: #22c55e;
}
.ev-ticket-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 0 0 14px;
  padding: 10px 12px;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
  color: #16181d;
  font-size: 0.82rem;
  font-weight: 700;
}
.ev-cashout {
  height: 36px;
  padding: 0 14px;
  border: 0;
  border-radius: 10px;
  background: #22c55e;
  color: #fff;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 800;
  cursor: pointer;
}
@media (max-width: 640px) {
  body[data-page="history"] .hist-page {
    width: min(1180px, calc(100% - 16px));
    padding: 10px 10px 24px;
    border-radius: 14px;
  }
}

.install-page { padding-bottom: 40px; }
.install-card {
  background: #16181e;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 18px;
  padding: 20px 18px 22px;
  margin: 0 0 16px;
}
.install-card h2 {
  margin: 6px 0 10px;
  font-size: 1.25rem;
}
.install-card p { color: #b7c0ce; font-size: 0.92rem; line-height: 1.45; }
.install-kicker {
  display: inline-block;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #00e5ff;
}
.install-steps {
  margin: 14px 0 0;
  padding: 0 0 0 18px;
  color: #e8eef8;
  font-weight: 650;
  line-height: 1.55;
}
.install-steps li { margin: 0 0 10px; }
.install-note { margin-top: 14px; font-size: 0.82rem; color: #8b93a3; }
.install-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 14px;
  min-height: 46px;
  padding: 0 18px;
  border-radius: 12px;
  background: #00e5ff;
  color: #041018;
  font-weight: 800;
}
.install-done { display: none; }
body[data-page="install"].is-android .install-ios,
body[data-page="install"].is-ios .install-and { display: none; }
body[data-page="install"].is-standalone .install-ios,
body[data-page="install"].is-standalone .install-and { display: none; }
body[data-page="install"].is-standalone .install-done { display: block; }

/* M1 mark: gold M, silver 1, CASINO only */
:root { --header-h: 64px; }
.site-header {
  background: rgba(5, 10, 21, 0.94);
  border-bottom: 1px solid rgba(212, 175, 90, 0.28);
  backdrop-filter: blur(16px);
}
.brand img.brand-logo {
  height: 58px !important;
  width: auto !important;
  max-width: 72px !important;
  border-radius: 0 !important;
  mix-blend-mode: normal !important;
  filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.45)) !important;
}
.auth-brand {
  height: 120px !important;
  width: auto !important;
  max-width: 140px !important;
  margin: 0 auto 16px !important;
  mix-blend-mode: normal !important;
  filter: drop-shadow(0 8px 16px rgba(0, 0, 0, 0.35));
}
.home-banners.is-hero .home-ban-brand { display: none !important; }
@media (min-width: 981px) {
  .brand img.brand-logo {
    height: 56px !important;
    max-width: 68px !important;
  }
}