/* r336 ordered CSS; unchanged declarations. */
/* /assets/readability-r226.css */
/* Readability polish across public pages. Keep the existing blue layout and motion. */
html body[data-ui-layout] .search-stage .search-heading .ticker-track {
  color:#d9effb!important;
  font-size:11px!important;
  line-height:1.65!important;
}
html body.home-page[data-ui-layout][data-ui-layout] #catalog-scroll .game > b {
  color:#f4fbff!important;
  font-size:13px!important;
  line-height:1.4!important;
}
html body.home-page[data-ui-layout] .app-install-banner small {
  color:#d5e9f4!important;
  font-size:11px!important;
  line-height:1.4!important;
}
html body[data-ui-layout] #packages .pack b {
  color:#f4fbff!important;
  font-size:13px!important;
  line-height:1.45!important;
}
html body[data-ui-layout] #packages .pack .pack-ribbon {
  color:#d8f0ff!important;
  font-size:9px!important;
  line-height:1.35!important;
}
html body[data-ui-layout] .payment-panel .payment-option small {
  color:#d3e8f5!important;
  font-size:11.5px!important;
  line-height:1.5!important;
}
html body[data-ui-layout] .store-dialog.bonus-dialog :is(p,li) {
  color:#e6f3fb!important;
  font-size:13.5px!important;
  line-height:1.65!important;
}
html body[data-ui-layout] .store-dialog.bonus-dialog .bonus-guide figcaption,
html body[data-ui-layout] .store-dialog.weekly-dialog .weekly-guide-summary {
  color:#d8effc!important;
  font-size:12px!important;
  line-height:1.6!important;
}
html body[data-ui-layout] .store-dialog.weekly-dialog .weekly-guide-metric small,
html body[data-ui-layout] .store-dialog.weekly-dialog .weekly-guide-daily {
  color:#c8eeff!important;
  font-size:11px!important;
  line-height:1.5!important;
}
@media(max-width:600px) {
  html body.home-page[data-ui-layout][data-ui-layout] #catalog-scroll .game > b {
    font-size:12px!important;
  }
  html body[data-ui-layout] #packages .pack b {
    font-size:12px!important;
  }
  html body[data-ui-layout] #packages .pack .pack-ribbon {
    font-size:8px!important;
  }
}
/* These controls fit the existing header/search rows without enlarging them. */
html body[data-ui-layout][data-ui-layout] > header :is(.member-trigger,.member-language-quick) {
  height:44px!important;
  min-height:44px!important;
  min-width:44px!important;
}
html body[data-ui-layout][data-ui-layout] > header .member-language-quick {
  width:44px!important;
}
html body.home-page[data-ui-layout][data-ui-layout] #clear-game-search {
  height:44px!important;
  min-height:44px!important;
}
/* The existing search ID matches the specificity inherited by legacy resets.
   r263: clicking/tapping a text field keeps its normal border without an extra
   blue frame. Tab navigation retains a separate neutral focus indicator. */
html.ht-keyboard-navigation body[data-ui-layout][data-ui-layout][data-ui-layout] :is(#game-search,a[href],button,input,select,textarea,summary,[tabindex]):focus-visible:focus:not(:disabled):not([data-ht-pressed]) {
  outline:2px solid #a2e4ff!important;
  outline-offset:3px!important;
}
/* The repeated field group also beats the two ID branches inherited by the
   legacy keyboard stylesheet, without changing which elements match. */
html.ht-keyboard-navigation body[data-ui-layout][data-ui-layout][data-ui-layout] :is(#game-search,input:not([type=checkbox]):not([type=radio]):not([type=file]),textarea,select):is(#game-search,input,textarea,select):focus-visible:focus:not(:disabled) {
  outline:2px solid #e2e8f0!important;
  outline-offset:3px!important;
}
html:not(.ht-keyboard-navigation) body[data-ui-layout][data-ui-layout][data-ui-layout] :is(#game-search,input:not([type=checkbox]):not([type=radio]):not([type=file]),textarea,select):focus:not(:disabled) {
  outline:none!important;
  outline-offset:0!important;
}
@media(forced-colors:active) {
  html.ht-keyboard-navigation body[data-ui-layout][data-ui-layout][data-ui-layout] :is(#game-search,a[href],button,input,select,textarea,summary,[tabindex]):focus-visible:focus:not(:disabled):not([data-ht-pressed]),
  html.ht-keyboard-navigation body[data-ui-layout][data-ui-layout][data-ui-layout] :is(#game-search,input:not([type=checkbox]):not([type=radio]):not([type=file]),textarea,select):is(#game-search,input,textarea,select):focus-visible:focus:not(:disabled) {
    outline-color:Highlight!important;
  }
}
/* r261: retain the shared blue action style, with readable white labels even
   at the brighter gradient edge. Limit the existing press light on these
   actions so it cannot wash out their small white text. No semantic state
   colours (success, errors, selected packages or destructive actions) change. */
html body[data-ui-layout] :is(.member-auth,.member-tools-panel) .member-primary,
html body[data-ui-layout] .app-install-banner .install-now {
  background:linear-gradient(115deg,#0b6ca9,#2068c2)!important;
  color:#fff!important;
  filter:none!important;
}
html body[data-ui-layout] :is(.member-auth,.member-tools-panel) .member-primary > .ht-control-light-r259,
html body[data-ui-layout] .app-install-banner .install-now > .ht-control-light-r259 {
  background:radial-gradient(ellipse at var(--ht-press-x,50%) var(--ht-press-y,50%),rgba(233,250,255,.08) 0%,rgba(233,250,255,.035) 32%,rgba(233,250,255,0) 72%)!important;
}

/* /assets/restore-popups-r232.css */
/* Use the visible Diamond x2 colors after its SVG/CSS gradient override. */
html body[data-ui-layout] .store-dialog.weekly-dialog {
  width:min(410px,calc(100vw - 24px))!important;
  max-width:calc(100vw - 24px)!important;
  max-height:calc(100dvh - 64px)!important;
}
html body[data-ui-layout] .store-dialog.weekly-dialog .weekly-guide-scene {
  display:grid;
  grid-template-rows:auto auto minmax(0,1fr) auto;
  gap:4px;
  aspect-ratio:640/440;
  padding:7px!important;
  background:#071d31!important;
}
html body[data-ui-layout] .store-dialog.weekly-dialog .weekly-guide-route {
  font-size:11px;
  font-weight:700;
  gap:7px;
}
html body[data-ui-layout] .store-dialog.weekly-dialog .weekly-guide-route span {
  padding:4px 7px;
  background:#075f96;
  border-color:#38bdf8;
  color:#d7ecff;
  box-shadow:none;
}
html body[data-ui-layout] .store-dialog.weekly-dialog .weekly-guide-route span:last-child {
  background:#b91c1c;
  border-color:#b91c1c;
  color:#eaf6ff;
}
html body[data-ui-layout] .store-dialog.weekly-dialog .weekly-guide-route b {color:#f87171}
html body[data-ui-layout] .store-dialog.weekly-dialog .weekly-guide-product {
  margin:0;
  padding:0;
  gap:8px;
  border:0;
}
html body[data-ui-layout] .store-dialog.weekly-dialog .weekly-guide-product img {
  width:40px;
  height:40px;
}
html body[data-ui-layout] .store-dialog.weekly-dialog .weekly-guide-product strong {
  font-size:15px;
  line-height:1.35;
}
html body[data-ui-layout] .store-dialog.weekly-dialog .weekly-guide-grid {gap:5px}
html body[data-ui-layout][data-ui-layout] .store-dialog.weekly-dialog .weekly-guide-metric {
  min-height:50px;
  padding:5px 8px;
  border-color:#258dbe!important;
  background:linear-gradient(135deg,#103a50,#08263c)!important;
  box-shadow:none;
}
html body[data-ui-layout] .store-dialog.weekly-dialog .weekly-guide-metric-full {min-height:48px}
html body[data-ui-layout] .store-dialog.weekly-dialog .weekly-guide-metric strong {
  margin-top:2px;
  font-size:20px;
  line-height:1.1;
  text-shadow:none;
}
html body[data-ui-layout] .store-dialog.weekly-dialog .weekly-guide-daily {margin-top:0}
html body[data-ui-layout] .store-dialog.weekly-dialog .weekly-guide-links {padding-bottom:8px}

html body[data-ui-layout] header > a.site-brand > img[src*="hourtopup-icon-r167"],
html body[data-ui-layout] .app-install-banner > img[src*="hourtopup-icon-r167"] {
  filter:contrast(1.3) saturate(1.4) brightness(1.08)!important;
}
@media(max-width:340px) {
  html body[data-ui-layout] .store-dialog.weekly-dialog .weekly-guide-scene {gap:3px;padding:5px!important}
  html body[data-ui-layout] .store-dialog.weekly-dialog .weekly-guide-route {font-size:9px;gap:4px}
  html body[data-ui-layout] .store-dialog.weekly-dialog .weekly-guide-route span {padding:3px 5px}
  html body[data-ui-layout] .store-dialog.weekly-dialog .weekly-guide-product img {width:32px;height:32px}
  html body[data-ui-layout] .store-dialog.weekly-dialog .weekly-guide-product strong {font-size:13px}
  html body[data-ui-layout] .store-dialog.weekly-dialog .weekly-guide-metric {min-height:45px;padding:4px 6px}
  html body[data-ui-layout] .store-dialog.weekly-dialog .weekly-guide-metric-full {min-height:42px}
  html body[data-ui-layout] .store-dialog.weekly-dialog .weekly-guide-metric strong {font-size:18px}
}

/* /assets/package-sections-r240.css */
/* Category bars only. Existing package cards, prices, artwork and selection stay untouched. */
html body[data-ui-layout] #packages > .package-section-heading {
  grid-column:1 / -1!important;
  box-sizing:border-box!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  width:100%!important;
  min-width:0!important;
  min-height:31px!important;
  margin:9px 0 1px!important;
  padding:3px 1px 5px!important;
  gap:10px!important;
  border:0!important;
  border-bottom:1px solid #168fca!important;
  background:transparent!important;
  color:#f6f8ff!important;
  box-shadow:none!important;
}

html body[data-ui-layout] #packages > .package-section-heading:first-child {
  margin-top:0!important;
}

html body[data-ui-layout] #packages > .package-section-heading[hidden] {
  display:none!important;
}

html body[data-ui-layout] #packages .package-section-title {
  display:inline-flex!important;
  align-items:center!important;
  min-width:0!important;
  gap:7px!important;
  color:#f6f8ff!important;
  font-size:12px!important;
  font-weight:800!important;
  line-height:1.25!important;
  letter-spacing:.3px!important;
  white-space:nowrap!important;
}

html body[data-ui-layout] #packages .package-section-mark {
  display:grid!important;
  place-items:center!important;
  flex:0 0 23px!important;
  width:23px!important;
  height:23px!important;
  border:1px solid #38bdf8!important;
  border-radius:50%!important;
  background:radial-gradient(circle at 35% 30%,#208ec2,#0b3150)!important;
  color:#c3efff!important;
  font-size:11px!important;
  line-height:1!important;
  box-shadow:inset 0 1px 0 #d7f5ff3b,0 0 10px #2fafe829!important;
}

html body[data-ui-layout] #packages .package-section-count {
  flex:0 0 auto!important;
  max-width:45%!important;
  padding:3px 8px!important;
  overflow:hidden!important;
  border:1px solid #277ba8!important;
  border-radius:999px!important;
  background:#0c2a42!important;
  color:#a9e4ff!important;
  font-size:9px!important;
  font-weight:800!important;
  line-height:1.2!important;
  letter-spacing:.25px!important;
  white-space:nowrap!important;
  text-overflow:ellipsis!important;
  box-shadow:inset 0 1px 0 #ffffff12!important;
}

@media(max-width:480px) {
  html body[data-ui-layout] #packages > .package-section-heading {
    min-height:29px!important;
    margin-top:7px!important;
    padding-bottom:4px!important;
  }
  html body[data-ui-layout] #packages .package-section-title {
    gap:6px!important;
    font-size:10px!important;
  }
  html body[data-ui-layout] #packages .package-section-mark {
    flex-basis:20px!important;
    width:20px!important;
    height:20px!important;
    font-size:9px!important;
  }
  html body[data-ui-layout] #packages .package-section-count {
    padding:3px 6px!important;
    font-size:8px!important;
  }
}

/* /assets/account-profile-r239.css */
/* r239: account headings use one quiet, familiar profile mark on every app. */
html body[data-ui-layout] :is(.mlbb-shell,.telegram-shell)
  .checkout-panel > .title.account-step > .account-profile-icon {
  display:grid!important;
  place-items:center!important;
  flex:0 0 30px!important;
  width:30px!important;
  height:30px!important;
  min-width:30px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  outline:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#39b9ff!important;
  font-size:0!important;
}

html body[data-ui-layout] :is(.mlbb-shell,.telegram-shell)
  .checkout-panel > .title.account-step > .account-profile-icon > svg {
  display:block;
  width:24px;
  height:24px;
  overflow:visible;
  filter:none;
}

html body[data-ui-layout] :is(.mlbb-shell,.telegram-shell)
  .checkout-panel > .title.account-step > div {
  justify-content:flex-start!important;
}

@media(max-width:650px) {
  html body[data-ui-layout] :is(.mlbb-shell,.telegram-shell)
    .checkout-panel > .title.account-step > .account-profile-icon {
    flex-basis:25px!important;
    width:25px!important;
    height:25px!important;
    min-width:25px!important;
  }

  html body[data-ui-layout] :is(.mlbb-shell,.telegram-shell)
    .checkout-panel > .title.account-step > .account-profile-icon > svg {
    width:21px;
    height:21px;
  }
}

/* /assets/package-art-background-r239.css */
/* r248: retain the dark black-blue artwork slot and normalize every package
   image inside it. Card size, slot size, text, spacing and states stay intact. */
html body[data-ui-layout][data-ui-layout] :is(.mlbb-shell,.telegram-shell) .topup #packages.packages .pack .pack-artplate {
  background-color:#040a13!important;
  background-image:
    radial-gradient(circle at 78% 18%,rgba(31,139,203,.24) 0,rgba(31,139,203,0) 46%),
    linear-gradient(145deg,#02060d 0%,#061522 48%,#0a2d49 100%)!important;
}

/* Absolute sizing prevents square source files from resolving to 72px high
   inside a 72x60 phone slot. Contain shows the complete original artwork. */
html body[data-ui-layout][data-ui-layout] #packages.packages .pack .pack-artplate > img.pack-icon {
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  box-sizing:border-box!important;
  object-fit:contain!important;
  object-position:center!important;
  transform:none!important;
  transform-origin:center!important;
}