/* Moonup's client theme. The shared operator/trader styles are untouched. */
.moonup {
  --bg: #0b0c15;
  --bg-2: #131420;
  --card: #13141f;
  --card-rgb: 19, 20, 31;
  --card-solid: #171722;
  --field: #1b1c2b;
  --field-2: #282337;
  --text: #f1effa;
  --hint: #9b9aad;
  --hint-rgb: 155, 154, 173;
  --muted: #88819b;
  --accent: #bca3ff;
  --accent-2: #ddc5ff;
  --accent-deep: #9773c6;
  --accent-rgb: 188, 163, 255;
  --accent-text: #201336;
  --glow-rgb: 121, 67, 198;
  --link: #c9b5ff;
  --info: #c9b5ff;
  --info-rgb: 201, 181, 255;
  --danger: #ff939f;
  --danger-deep: #b9506a;
  --danger-text: #24060e;
  --danger-rgb: 255, 147, 159;
  --ok: #91d8bb;
  --ok-rgb: 145, 216, 187;
  --appeal: #c9b5ff;
  --appeal-rgb: 201, 181, 255;
  --border: #2a293b;
  --border-strong: #75558f;
  --radius: 22px;
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: "Manrope", "Avenir Next", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.55;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}
.moonup button, .moonup input, .moonup textarea { font-family: inherit; }
.moonup button, .moonup a, .moonup input { -webkit-tap-highlight-color: transparent; }
.moonup button { transition: background .18s, border-color .18s, color .18s, transform .18s; }
.moonup a { color: inherit; }
.moonup :focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; }
.moonup input:focus-visible, .moonup textarea:focus-visible { outline-offset: 2px; }
.moonup .icon { width: 22px; height: 22px; flex: 0 0 auto; vertical-align: middle; }
.skip-link { position: fixed; top: -100px; left: 20px; background: var(--accent); color: #201336 !important; padding: 12px 20px; z-index: 100; border-radius: 12px; }
.skip-link:focus { top: 16px; }
.sidebar {
  position: fixed; inset: 0 auto 0 0; width: 220px; z-index: 20;
  display: flex; flex-direction: column; padding: 35px 20px 26px;
  border-right: 1px solid #242333; background: #10111b;
}
.brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; font-size: 30px; font-weight: 800; line-height: 1.1; letter-spacing: -1.6px; }
.brand > .icon { width: 32px; height: 32px; color: #c7acff; fill: #c7acff; stroke-width: 1.1; transform: rotate(-17deg); }
.brand__word { display: inline-flex; align-items: baseline; }
.brand__moon {
  color: #e5d9f4;
  background-image: radial-gradient(ellipse at 27% 68%, #a99abd 0%, transparent 19%), radial-gradient(ellipse at 68% 24%, #fffaff 0%, transparent 32%), linear-gradient(160deg, #fffaff 5%, #e0d6f0 43%, #b5a0d5 85%);
  background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
.brand__up {
  color: #b7f38d;
  background: linear-gradient(150deg, #d1ffae, #a9f17f 55%, #70df9c);
  background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
.brand > .brand__symbol { fill: none; stroke: none; filter: drop-shadow(0 0 5px #c4a4fb22); }
.sidebar .brand { padding-left: 14px; }
.sidebar__label { margin: 53px 14px 17px; font-size: 10px; letter-spacing: 1.8px; font-weight: 600; color: #85829c; }
.moonup .nav { display: flex; flex-direction: column; gap: 5px; padding: 0; border: 0; border-radius: 0; background: none; }
.moonup .nav__btn { display: flex; align-items: center; gap: 12px; flex: none; min-height: 48px; padding: 12px 15px; border: 1px solid transparent; border-radius: 12px; color: #a5a2b8; text-align: left; font-size: 14px; font-weight: 550; }
.moonup .nav__btn .icon { width: 19px; height: 19px; }
.moonup .nav__btn:hover:not(:disabled) { background: #222033; color: #ebe2ff; }
.moonup .nav__btn--active { color: #d8c6ff; background: linear-gradient(100deg, #342746, #242035); border-color: #483358; }
.nav__orbit { width: 5px; height: 5px; margin-left: auto; border-radius: 50%; background: #cbb1ff; opacity: 0; }
.nav__btn--active .nav__orbit { opacity: 1; }
.nav__group { font-size: 10px; letter-spacing: 1.7px; color: #85829c; margin: 23px 15px 8px; }
.nav__separator { height: 1px; background: #252432; margin: 20px 14px 16px; }
.moonup .nav__btn--soon { color: #9690a8; cursor: default; }
.soon-tag { font-size: 10px; line-height: 1; letter-spacing: .6px; color: #b7a9d2; border: 1px solid #43394f; border-radius: 6px; padding: 5px 6px; margin-left: auto; font-weight: 500; }
.sidebar__bottom { margin-top: auto; padding: 70px 15px 0; color: #88849d; font-size: 12px; line-height: 1.8; }
.sidebar__bottom small { display: block; color: #68657c; font-size: 10px; letter-spacing: 1.6px; margin-top: 25px; }
.orbit-stamp { position: relative; display: flex; align-items: center; gap: 11px; margin-bottom: 18px; color: #b09ec9; }
.orbit-stamp .icon { width: 27px; height: 27px; }
.orbit-stamp span { font-size: 8px; letter-spacing: 1.6px; max-width: 70px; line-height: 1.6; }
.moonup .app { max-width: 1376px; margin: 0 0 0 220px; padding: 0 42px 20px; gap: 0; outline: none; }
.topbar { height: 100px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.breadcrumb { display: flex; gap: 15px; color: #9691a9; align-items: center; font-size: 13px; }
.breadcrumb > span:nth-child(2) { color: #4e4a60; }
.breadcrumb strong { font-weight: 550; color: #ded8ec; }
.topbar__right { display: flex; gap: 20px; align-items: center; }
.network-badge { display: flex; align-items: center; gap: 8px; font-size: 12px; color: #a29caf; }
.network-badge .icon { width: 14px; height: 14px; color: #bca3df; }
.topbar__mark { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; color: #bcf49c; font-weight: 800; font-size: 11px; letter-spacing: -.2px; background: #202d25; border: 1px solid #415c42; }
.brand--mobile { display: none; }
.moonup .view { gap: 22px; min-width: 0; }
.moonup .notice { margin-bottom: 18px; font-size: 14px; }
.moon-hero { position: relative; overflow: hidden; isolation: isolate; min-height: 274px; background: #10111e; border: 1px solid #363044; border-radius: 24px; }
.moon-hero::before { content: ""; position: absolute; z-index: 1; inset: 0; background: linear-gradient(90deg, #171325 0%, #181426 29%, #13121e00 66%); pointer-events: none; }
.moon-hero::after { content: ""; position: absolute; inset: 0; pointer-events: none; box-shadow: inset 0 0 80px #ac80ff06; border-radius: inherit; }
.moon-hero__copy { position: relative; z-index: 2; width: 60%; padding: 30px 35px; }
.eyebrow { display: flex; align-items: center; gap: 8px; font-size: 10px; letter-spacing: 2px; color: #c1acdf; font-weight: 600; }
.eyebrow .icon { width: 13px; height: 13px; }
.moon-hero h1 { margin: 14px 0 12px; font-size: clamp(28px, 3.1vw, 44px); line-height: 1.18; letter-spacing: -1.5px; font-weight: 650; }
.moon-hero h1 span { color: #c2a6f6; }
.moon-hero p { margin: 0; color: #aaa2bc; font-size: 13px; line-height: 1.7; }
.hero-coordinate { display: flex; gap: 10px; align-items: center; margin-top: 22px; color: #7d758f; font-size: 8px; font-weight: 550; letter-spacing: 1.4px; }
.hero-coordinate i { display: inline-block; width: 19px; height: 1px; background: #625773; }
.moon-hero__art { position: absolute; right: 3%; top: -9%; width: 370px; height: 370px; object-fit: contain; max-width: 50%; mask-image: linear-gradient(90deg, transparent, #000 17%, #000 93%, transparent); }
.hero-caption { position: absolute; z-index: 2; right: 28px; bottom: 16px; font-size: 8px; letter-spacing: 1px; color: #91829f; }
.exchange-layout { display: grid; grid-template-columns: minmax(0, 1.47fr) minmax(275px, 1fr); align-items: start; gap: 22px; }
.moonup .card { padding: 25px; border: 1px solid #2a283a; background: linear-gradient(125deg, #171722, #13141f); gap: 17px; }
.moonup .exchange-card { gap: 16px; }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 6px; }
.section-kicker { color: #9990ae; font-size: 9px; letter-spacing: 1.6px; font-weight: 600; }
.moonup h2 { font-size: 22px; line-height: 1.3; letter-spacing: -.6px; font-weight: 600; margin: 4px 0 0; }
.pair-tag { font-size: 10px; font-weight: 600; display: flex; gap: 7px; align-items: center; border: 1px solid #343043; border-radius: 7px; color: #b5adc5; padding: 5px 8px; white-space: nowrap; }
.pair-tag .icon { width: 12px; height: 12px; }
.currency-stack { position: relative; display: flex; flex-direction: column; gap: 8px; }
.moonup .currency-field { padding: 14px 17px 13px; border-radius: 14px; background: #1d1d2b; border: 1px solid #302d40; gap: 6px; }
.moonup .currency-field:focus-within { border-color: #9779c9; box-shadow: 0 0 0 3px #b38cff0a; }
.moonup .field__label { font-size: 14px; color: #b2aabd; }
.moonup .currency-field .field__row { background: none; border: 0; align-items: center; overflow: visible; min-width: 0; }
.moonup .currency-field input { padding: 0; font-size: 27px; line-height: 1.3; font-weight: 550; height: 37px; border: 0; outline: 0; letter-spacing: -.5px; }
.moonup .currency-field input::placeholder { color: #91889f; opacity: 1; }
.currency { display: flex; align-items: center; gap: 9px; min-width: 139px; }
.currency > span { display: flex; flex-direction: column; }
.currency strong { font-size: 14px; color: #ede8f6; font-weight: 600; }
.currency small { font-size: 11px; color: #9b94ad; white-space: nowrap; }
.currency__coin { display: grid; place-items: center; width: 33px; height: 33px; border-radius: 50%; font-size: 18px; font-weight: 650; }
.currency__coin--rub { background: #414067; color: #e4d9ff; border: 1px solid #5c507f; }
.currency__coin--btc { color: #fff1d3; background: #b77534; border: 1px solid #d5975e; font-size: 23px; }
.exchange-divider { position: absolute; top: 50%; left: calc(50% - 16px); transform: translateY(-50%); display: grid; place-items: center; width: 32px; height: 32px; border: 4px solid #15151f; border-radius: 10px; background: #3b2c51; color: #cab1f6; }
.exchange-divider .icon { width: 13px; height: 13px; }
.moonup .presets { gap: 7px; }
.moonup .presets button { min-height: 38px; border-radius: 8px; font-size: 12px; color: #b9b0ca; border-color: #353042; padding: 7px 2px; }
.moonup .presets button:hover { background: #292037; border-color: #7b5c9b; color: #e5d5ff; }
.moonup .presets button.on, .moonup .presets button[aria-pressed="true"] { color: #d9c4fa; border-color: #75558f; background: #2e223d; }
.moonup .presets--mines { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.quote-line { display: flex; flex-wrap: wrap; gap: 4px 14px; align-items: center; justify-content: space-between; padding: 0 2px 15px; border-bottom: 1px solid #2a2737; }
.moonup .rate { font-size: 13px; color: #c7bcda; text-align: left; }
.moonup .fee { font-size: 12px; color: #a79caf; line-height: 1.6; min-height: 0; }
.quote-line .fee { font-size: 10px; text-align: right; }
.wallet-field { gap: 10px; }
.wallet-field .field__label { display: flex; align-items: center; gap: 7px; }
.wallet-field .icon { width: 15px; height: 15px; color: #a193b3; }
.moonup input, .moonup textarea { background: #1b1b29; border: 1px solid #363041; border-radius: 11px; font-size: 16px; padding: 13px 14px; color: #f0eaf8; }
.moonup input#wallet { font-size: 14px; }
.moonup input::placeholder { color: #8c829d; }
.moonup input:focus, .moonup textarea:focus { border-color: #a789cf; }
.moonup .field__row > input { border: 0; background: transparent; border-radius: 0; }
.moonup .validation-hint { text-align: left; color: #cbb4df; }
.validation-hint:empty { display: none; }
.moonup .primary { display: flex; justify-content: center; align-items: center; gap: 11px; min-height: 49px; padding: 13px 18px; font-size: 14px; font-weight: 650; border-radius: 11px; color: #261838; background: linear-gradient(100deg, #cab1f8, #ae8ce7); border: 1px solid #dfc7ff55; box-shadow: 0 3px 18px #9d68ee12; }
.moonup .primary .icon { width: 17px; height: 17px; }
.moonup .primary:not(:disabled):hover { background: linear-gradient(100deg, #dac2ff, #bf9cf5); box-shadow: 0 4px 24px #9d68ee2a; transform: translateY(-1px); }
.moonup .primary:disabled { opacity: .5; cursor: not-allowed; }
.moonup .status { text-align: center; font-size: 12px; color: #a79db6; margin: 0; }
.moonup .status--error { color: #eda0a9; }
.moonup .status--ok { color: #a79fb6; }
.exchange-aside { display: grid; gap: 18px; }
.moonup .guide-card { padding: 26px 24px 22px; }
.guide-heading { display: flex; align-items: center; gap: 10px; }
.guide-heading .icon { width: 19px; height: 19px; color: #bc9be8; }
.guide-heading h2 { font-size: 17px; letter-spacing: -.3px; margin: 0; }
.orbit-steps { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-direction: column; gap: 24px; }
.orbit-steps li { display: flex; align-items: flex-start; gap: 14px; position: relative; }
.orbit-steps li:not(:last-child)::after { content: ""; position: absolute; left: 14px; top: 36px; height: calc(100% - 18px); width: 1px; background: linear-gradient(#514062, #51406200); }
.step-number { display: grid; place-items: center; flex-shrink: 0; width: 29px; height: 29px; border-radius: 50%; background: #2e233d; border: 1px solid #483257; color: #c7a3ef; font-size: 10px; }
.orbit-steps h3 { margin: 2px 0 5px; font-size: 14px; font-weight: 600; }
.orbit-steps p { margin: 0; color: #a198b0; font-size: 13px; line-height: 1.75; }
.network-note { display: flex; gap: 9px; align-items: flex-start; padding-top: 16px; margin-top: 3px; border-top: 1px solid #2c2638; color: #a292b2; }
.network-note .icon { width: 15px; height: 15px; margin-top: 2px; }
.network-note p { font-size: 12px; line-height: 1.6; margin: 0; }
.task-teaser { position: relative; overflow: hidden; border-radius: 20px; border: 1px solid #453152; padding: 22px 24px; background: radial-gradient(ellipse at 100% 100%, #4a2c5955, transparent 70%), #211828; }
.task-teaser__top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; }
.task-symbol { color: #c4a1df; }
.task-symbol .icon { width: 22px; height: 22px; }
.task-teaser .soon-tag { font-size: 8px; padding: 5px 7px; border-color: #654372; color: #c49dd8; }
.task-teaser h2 { font-size: 21px; color: #e7d8f1; line-height: 1.3; position: relative; z-index: 1; }
.task-teaser p { font-size: 13px; color: #b59dc2; line-height: 1.8; margin: 10px 0 0; position: relative; z-index: 1; }
.task-teaser__line { position: absolute; width: 190px; height: 90px; border: 1px solid #69417d; border-radius: 50%; right: -85px; bottom: -30px; transform: rotate(-35deg); box-shadow: 0 0 0 15px #66407c22, 0 0 0 30px #66407c15; }
.exchange-history { display: grid; gap: 16px; }
.exchange-history:has(> [hidden]:first-child:last-child), .exchange-history:not(:has(> :not([hidden]))) { display: none; }
.page-footer { display: flex; align-items: center; gap: 18px; color: #777084; font-size: 10px; margin-top: 2px; padding: 0 2px 10px; }
.page-footer > span:first-child { font-weight: 750; font-size: 17px; letter-spacing: -.8px; color: #a298b0; }
.page-footer .icon { width: 11px; height: 11px; margin-left: auto; color: #9784ab; }
.view-intro { display: flex; gap: 20px; align-items: center; padding: 17px 0 25px; }
.view-intro__icon { width: 65px; height: 65px; border-radius: 21px; display: grid; place-items: center; color: #d0b4f5; border: 1px solid #59416d; background: linear-gradient(140deg, #3e2a52, #231c32); }
.view-intro__icon .icon { width: 28px; height: 28px; }
.view-intro h1 { font-size: 32px; line-height: 1.25; font-weight: 600; letter-spacing: -1px; margin: 4px 0 5px; }
.view-intro p { font-size: 13px; color: #a99bb8; margin: 0; }
.moonup #viewMines, .moonup #viewDice { display: grid; grid-template-columns: 1.15fr 1fr; align-items: start; }
.moonup #viewMines > .view-intro, .moonup #viewDice > .view-intro { grid-column: 1 / -1; }
.moonup .direction { justify-content: flex-start; margin-bottom: 8px; }
.moonup .direction .note { font-size: 11px; }
.moonup .chip { background: #332540; font-size: 14px; padding: 8px 12px; }
.moonup .chip__flag { background: #50365f; }
.moonup .secondary { font-size: 14px; min-height: 44px; border-radius: 10px; background: #252031; border-color: #4a395b; }
.moonup .secondary:hover { background: #382847; }
.moonup .note { font-size: 13px; color: #aa9db8; line-height: 1.7; }
.moonup .link { font-size: 13px; min-height: 30px; }
.moonup .card__title { font-weight: 600; font-size: 16px; }
.moonup .game__stats { background: #1c1929; border: 1px solid #3b2c4b; border-radius: 13px; padding: 17px; gap: 13px; }
.moonup .game__mid { font-size: 17px; margin-top: 6px; color: #d5baf7; }
.moonup .game__stats .field__label { font-size: 10px; }
.moonup .dir { font-size: 13px; }
.moonup .dir.on { background: #3b2b4e; border-color: #9e77c6; }
.moonup .dice__target { font-size: 25px; color: #d5b9f7; }
.moonup input[type="range"] { background: transparent; border: none; padding: 0; height: 28px; }
.moonup .dice__scale { font-size: 11px; }
.moonup .roll__number { color: #d5b9f7; }
.moonup .roll__number--won { color: var(--ok); }
.moonup .roll__number--lost { color: var(--danger); }
.moonup .grid { gap: 10px; }
.moonup .cell { background: linear-gradient(135deg, #322341, #221c31); border-color: #523963; border-radius: 15px; box-shadow: inset 0 1px #81599722, 0 3px #08070e; }
.moonup .cell:not(:disabled):hover { background: #49305d; border-color: #a373c5; transform: translateY(-2px); }
.moonup .cell--gem { background: #204138; border-color: #579582; }
.moonup .cell--mine { background: #502c42; border-color: #a26383; }
.moonup .cell--boom { background: #8b364f; border-color: #ed8fac; }
.moonup #viewGame, .moonup #viewRoll, .moonup #viewPay, .moonup #viewStatus, .moonup #viewAppeal { width: 100%; max-width: 670px; margin: 30px auto; }
.moonup .fair { padding: 14px; border: 1px solid #3c2c4c; background: #1d1827; border-radius: 12px; font-size: 13px; }
.moonup .fair summary { color: #c3acd9; }
.moonup .fair__body { font-size: 12px; }
.moonup .fair__body .mono { font-size: 12px; }
.moonup .req__label { font-size: 12px; }
.moonup .req { border: 1px solid #403149; }
.moonup .copy { color: #d6b5f5; border-color: #574061; padding: 9px 12px; }
.moonup .pay__big { color: #dac1f5; }
.moonup .timer { background: #33253e; color: #e0c6ff; }
.moonup .timer--warn { color: var(--danger); }
.moonup #profileCard { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: start; }
.moonup #profileCard > .card:first-child { grid-column: 1 / -1; }
.moonup #profileGuest { max-width: 620px; padding: 35px; }
.moonup .avatar { background: linear-gradient(135deg, #bd96ed, #624574); color: #fff1ff; width: 66px; height: 66px; border: 1px solid #ac81c4; }
.moonup .tiles { grid-template-columns: repeat(4, 1fr); }
.moonup .tile { background: #211b2c; padding: 18px; border: 1px solid #3c2d49; }
.moonup .tile__v { color: #d3b5f0; }
.moonup .tile__k { font-size: 12px; color: #b8a7c6; }
.moonup .profile__rank { font-size: 14px; }
.moonup .board li { font-size: 13px; }
.moonup .toast { background: #30243e; border-color: #79608c; color: #f2e7ff; z-index: 60; font-size: 14px; padding: 13px 20px; box-shadow: 0 8px 35px #0007; }
@media (min-width: 1650px) { .moonup .app { margin-right: auto; margin-left: max(220px, calc((100vw - 1300px) / 2)); } }
@media (max-width: 1200px) {
  .sidebar { width: 195px; padding-left: 14px; padding-right: 14px; }
  .moonup .app { margin-left: 195px; padding-left: 28px; padding-right: 28px; }
  .moon-hero__copy { padding-left: 28px; }
  .moon-hero__art { right: -1%; top: 0; width: 325px; height: 325px; }
  .exchange-layout { grid-template-columns: minmax(0, 1.3fr) minmax(250px, 1fr); gap: 18px; }
  .moonup .card { padding: 21px; }
  .moonup .guide-card { padding: 24px 20px; }
  .currency { min-width: 115px; }
  .currency small { font-size: 8px; }
  .moonup .currency-field input { font-size: 23px; }
  .moonup .currency-field { padding-left: 13px; padding-right: 13px; }
}
@media (max-width: 960px) and (min-width: 761px) {
  .sidebar { width: 170px; padding-left: 10px; padding-right: 10px; }
  .sidebar .brand { font-size: 26px; padding-left: 7px; gap: 7px; }
  .brand > .icon { width: 26px; }
  .sidebar__label { font-size: 9px; margin-left: 10px; }
  .moonup .nav__btn { padding-left: 10px; gap: 8px; font-size: 13px; }
  .moonup .app { margin-left: 170px; padding-left: 22px; padding-right: 22px; }
  .exchange-layout { grid-template-columns: minmax(0, 1fr); }
  .exchange-aside { grid-template-columns: 1.2fr 1fr; }
  .moon-hero__copy { width: 65%; }
  .moon-hero__art { right: -4%; top: 15px; }
  .network-badge { display: none; }
  .currency { min-width: 139px; }
  .currency small { font-size: 10px; }
  .moonup .currency-field input { font-size: 28px; }
  .moonup #viewMines, .moonup #viewDice { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .sidebar { inset: auto 0 0; width: 100%; padding: 0; border: 0; background: none; }
  .sidebar > .brand, .sidebar__label, .sidebar__bottom, .nav__group, .nav__separator { display: none; }
  .moonup .nav { flex-direction: row; align-items: stretch; justify-content: space-around; gap: 3px; padding: 10px 9px calc(9px + env(safe-area-inset-bottom)); background: #13121eef; backdrop-filter: blur(20px); border-top: 1px solid #3a2c47; border-radius: 20px 20px 0 0; box-shadow: 0 -10px 35px #0b091440; }
  .moonup .nav__btn { min-width: 0; flex: 1; min-height: 48px; gap: 5px; flex-direction: column; padding: 7px 2px; font-size: 10px; line-height: 1.2; justify-content: center; border-radius: 11px; }
  .moonup .nav__btn .icon { width: 19px; height: 19px; }
  .nav__orbit { display: none; }
  .nav__btn .soon-tag { font-size: 7px; line-height: 1; padding: 0; border: 0; margin: 0; position: absolute; top: 1px; right: 1px; color: #b49cce; }
  .moonup .nav__btn--soon { position: relative; padding-top: 7px; }
  .moonup .app { margin: 0; padding: 0 20px calc(100px + env(safe-area-inset-bottom)); }
  .topbar { height: 83px; }
  .brand--mobile { display: inline-flex; font-size: 27px; gap: 8px; letter-spacing: -1px; }
  .brand--mobile .icon { width: 28px; height: 28px; }
  .breadcrumb, .network-badge { display: none; }
  .topbar__mark { width: 33px; height: 33px; }
  .moonup .view { gap: 19px; }
  .moon-hero { min-height: 235px; border-radius: 20px; }
  .moon-hero__copy { padding: 24px; width: 70%; }
  .eyebrow { font-size: 8px; letter-spacing: 1.6px; gap: 5px; }
  .moon-hero h1 { font-size: 32px; margin: 14px 0 11px; letter-spacing: -1px; }
  .moon-hero p { font-size: 11px; }
  .hero-coordinate { font-size: 6px; gap: 7px; margin-top: 19px; letter-spacing: 1px; }
  .moon-hero__art { width: 285px; height: 285px; top: -6px; right: -10px; max-width: 50%; }
  .hero-caption { display: none; }
  .exchange-layout { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .exchange-aside { grid-template-columns: 1.2fr 1fr; gap: 14px; }
  .moonup .card { padding: 23px; border-radius: 19px; }
  .currency { min-width: 144px; }
  .currency small { font-size: 10px; }
  .moonup .currency-field input { font-size: 28px; }
  .moonup .currency-field { padding: 15px 17px; }
  .moonup .presets button { font-size: 12px; min-height: 37px; }
  .moonup .field__label { font-size: 13px; }
  .moonup .primary { font-size: 15px; min-height: 50px; }
  .moonup .status { font-size: 11px; }
  .moonup .fee { font-size: 12px; }
  .moonup input#wallet { font-size: 14px; }
  .quote-line .fee { font-size: 11px; }
  .moonup .rate { font-size: 13px; }
  .moonup .guide-card { padding: 22px 18px; }
  .task-teaser { padding: 20px 18px; }
  .task-teaser h2 { font-size: 23px; }
  .task-teaser p { font-size: 12px; }
  .orbit-steps p { font-size: 12px; }
  .orbit-steps h3 { font-size: 14px; }
  .network-note p { font-size: 11px; }
  .page-footer { font-size: 10px; padding: 0 4px; }
  .moonup #viewMines, .moonup #viewDice { grid-template-columns: 1fr; }
  .view-intro { gap: 15px; padding: 10px 0 8px; }
  .view-intro h1 { font-size: 29px; }
  .view-intro p { font-size: 12px; }
  .view-intro__icon { width: 54px; height: 54px; border-radius: 17px; flex-shrink: 0; }
  .moonup #profileCard { grid-template-columns: 1fr; }
  .moonup .tiles { grid-template-columns: 1fr 1fr; }
  .moonup #viewGame, .moonup #viewRoll, .moonup #viewPay, .moonup #viewStatus, .moonup #viewAppeal { margin: 10px auto; }
  .moonup .toast { bottom: calc(100px + env(safe-area-inset-bottom)); width: max-content; }
}
@media (max-width: 480px) {
  .moonup .app { padding-left: 14px; padding-right: 14px; }
  .topbar { height: 74px; padding: 0 5px; }
  .moon-hero { min-height: 212px; }
  .moon-hero__copy { padding: 23px 20px; width: 79%; }
  .moon-hero h1 { font-size: 28px; }
  .moon-hero p { font-size: 10px; }
  .moon-hero__art { width: 250px; height: 250px; max-width: 54%; right: -18px; top: 13px; opacity: .87; }
  .moon-hero::before { background: linear-gradient(90deg, #191426 0%, #181426 28%, #181426bb 43%, #13121e00 85%); }
  .hero-coordinate { margin-top: 18px; font-size: 5.5px; }
  .moonup .card { padding: 20px 17px; }
  .moonup h2 { font-size: 22px; }
  .section-heading { margin-bottom: 5px; }
  .section-kicker { font-size: 8px; }
  .pair-tag { font-size: 9px; gap: 5px; }
  .moonup .currency-field { padding: 14px; }
  .currency { min-width: 111px; gap: 7px; }
  .currency__coin { width: 29px; height: 29px; font-size: 17px; }
  .currency__coin--btc { font-size: 21px; }
  .currency small { font-size: 8px; }
  .currency strong { font-size: 13px; }
  .moonup .currency-field input { font-size: 24px; }
  .moonup .presets { gap: 5px; }
  .moonup .presets button { font-size: 11px; }
  .moonup .rate { font-size: 12px; }
  .quote-line { gap: 5px; }
  .quote-line .fee { font-size: 10px; }
  .exchange-aside { grid-template-columns: 1fr; gap: 16px; }
  .moonup .guide-card { padding: 25px; }
  .guide-heading h2 { font-size: 18px; }
  .task-teaser { padding: 23px 25px; }
  .task-teaser h2 br { display: none; }
  .task-teaser h2 { font-size: 23px; }
  .task-teaser__top { margin-bottom: 12px; }
  .moonup .note { font-size: 13px; }
  .moonup .game__stats--3 { gap: 8px; padding: 14px 12px; }
  .moonup .game__mid { font-size: 16px; }
  .moonup .dice__cond { gap: 6px; }
}
@media (max-width: 360px) {
  .moon-hero__copy { width: 100%; padding: 22px 18px; }
  .moon-hero h1 { font-size: 25px; max-width: 240px; }
  .moon-hero__art { top: 42px; opacity: .64; }
}
@media (prefers-reduced-motion: reduce) {
  .moonup *, .moonup *::before, .moonup *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* Ambient motion and abstract orbital surfaces. */
.moonup { isolation: isolate; background: #090c15; }
.cosmic-atmosphere { position: fixed; inset: 0; overflow: hidden; pointer-events: none; z-index: -1; contain: strict; }
.cosmic-haze { position: absolute; width: 65vw; height: 65vw; min-width: 450px; min-height: 450px; border-radius: 50%; filter: blur(75px); opacity: .24; animation: cosmic-drift 24s ease-in-out infinite alternate; }
.cosmic-haze--violet { right: -29vw; top: 5vh; background: radial-gradient(ellipse, #7943c6 0%, #45286655 42%, transparent 70%); }
.cosmic-haze--mint { left: -35vw; bottom: -28vw; background: radial-gradient(ellipse, #528074 0%, #3e626744 40%, transparent 67%); animation-delay: -12s; }
.cosmic-stars { position: absolute; inset: 0; opacity: .45; background-image: radial-gradient(circle at 14% 23%, #e2dbfd 0 .7px, transparent 1.2px), radial-gradient(circle at 79% 12%, #cbb2ed 0 .8px, transparent 1.4px), radial-gradient(circle at 88% 76%, #d3f6d0 0 .6px, transparent 1.1px), radial-gradient(circle at 37% 92%, #d7c5fa 0 .7px, transparent 1.2px), radial-gradient(circle at 93% 44%, #fff1fe 0 .9px, transparent 1.4px); }
.moonup .sidebar { background: linear-gradient(165deg, #11121ce8, #131019e8); backdrop-filter: blur(24px); }
.moonup .moon-hero { border-radius: 24px 58px 24px 24px; background: radial-gradient(ellipse at 63% 110%, #79417c4d, transparent 56%), #131323; box-shadow: 0 15px 60px #00000022; }
.moonup .moon-hero::before { background: linear-gradient(90deg, #221631f5 0%, #1d1832e6 27%, #1c1a3300 69%); }
.moonup .moon-hero__copy { z-index: 3; }
.moonup .moon-hero h1 { font-weight: 650; font-size: clamp(34px, 3.4vw, 49px); letter-spacing: -1.6px; }
.moonup .moon-hero h1 span { background: linear-gradient(95deg, #e5c7f7, #bfa6f3 45%, #bce8d5); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.moonup .moon-hero__art { animation: lunar-float 9s ease-in-out infinite; transform-origin: center; mix-blend-mode: screen; mask-image: linear-gradient(90deg, transparent, #000 18%, #000 92%, transparent), linear-gradient(0deg, transparent, #000 12%, #000 89%, transparent); mask-composite: intersect; }
.hero-orbits { position: absolute; inset: 0; z-index: 2; pointer-events: none; overflow: hidden; }
.hero-orbits > span { position: absolute; width: 83%; height: 90%; left: 32%; top: 38%; border: 1px solid #c69ce72a; border-radius: 50%; transform: rotate(-24deg); }
.hero-orbits > span:nth-child(2) { width: 75%; height: 125%; left: 39%; top: 30%; border-color: #b5f29217; transform: rotate(-24deg); }
.hero-orbits > i { position: absolute; width: 8px; height: 8px; border-radius: 50%; left: 62%; top: 77%; background: #c3f797; box-shadow: 0 0 10px #bde69b77, 0 0 25px #bde69b44; animation: orbital-spark 13s ease-in-out infinite alternate; }
.moonup .hero-coordinate { color: #a18eb4; }
.moonup .exchange-card { background: linear-gradient(125deg, #1b1925e8, #141720eb); box-shadow: 0 15px 50px #00000014, inset 0 1px #e0c5ff06; border-color: #51405566; }
.moonup .currency-field { background: linear-gradient(110deg, #25202f, #1c202b); border-color: #51425777; }
.moonup .exchange-divider { background: #40304f; color: #d7bcf4; border-color: #171820; }
.moonup .guide-card { background: linear-gradient(130deg, #141c23e8, #161821ed); border-color: #40565a66; border-radius: 22px 22px 45px 22px; }
.moonup .guide-heading > .icon { color: #b3d4c0; }
.moonup .step-number { background: #243032; border-color: #47605c; color: #bdd6c7; }
.moonup .task-teaser { background: radial-gradient(ellipse at 100% 90%, #a4524466, transparent 70%), linear-gradient(120deg, #2c1b32, #48252d); border-color: #83515966; border-radius: 38px 20px 20px; }
.moonup .task-teaser h2 { color: #f2d9dc; }
.moonup .task-teaser p { color: #d3b1be; }
.moonup .task-symbol { color: #eab6c0; }
.moonup .task-teaser .soon-tag { color: #e3c1c0; border-color: #9a666c; }
.moonup .task-teaser__line { border-color: #d4947255; box-shadow: 0 0 0 17px #ca877722, 0 0 0 34px #c7788e15; }
.moonup .primary { background: linear-gradient(105deg, #d2b4f9, #b5a4f2 58%, #a5c9c5); background-size: 160% 100%; }
.moonup .primary:not(:disabled):hover { background: linear-gradient(105deg, #e0c0ff, #c9b8ff 45%, #c0efd1); background-position: 100% 0; }
.moonup .nav__btn--active { box-shadow: inset 0 1px #e5d1fc0a, 0 0 24px #b38ada08; }
.moonup .view { transition: transform .25s cubic-bezier(.2,.75,.25,1); }
.moonup .view.is-swiping { transition: none; will-change: transform; }
.moonup #viewForm, .moonup #viewGames, .moonup #viewMines, .moonup #viewDice, .moonup #viewProfile { touch-action: pan-y pinch-zoom; }
@keyframes lunar-float { 0%, 100% { transform: translateY(0) rotate(-1deg); } 50% { transform: translateY(-8px) rotate(1deg); } }
@keyframes cosmic-drift { from { transform: translate3d(0,0,0); } to { transform: translate3d(5vw,-4vh,0); } }
@keyframes orbital-spark { from { transform: translate3d(0,0,0); opacity: .55; } to { transform: translate3d(34px,-13px,0); opacity: 1; } }
@media (max-width: 760px) {
  .moonup .sidebar { background: none; backdrop-filter: none; }
  .moonup .nav { background: linear-gradient(115deg, #181521f5, #141d23f5); }
  .moonup .moon-hero { border-radius: 22px 45px 22px 22px; }
  .moonup .moon-hero h1 { font-size: 34px; }
  .moonup .moon-hero::before { background: linear-gradient(90deg, #221631ee 0%, #20162dcc 29%, #1d183266 45%, transparent 90%); }
  .moonup .app { overflow: clip; }
  .cosmic-haze { filter: blur(45px); animation: none; opacity: .2; }
}
@media (max-width: 480px) {
  .moonup .moon-hero h1 { font-size: 32px; line-height: 1.16; margin: 14px 0 12px; }
  .moonup .moon-hero p { font-size: 11px; line-height: 1.7; }
  .moonup .moon-hero__copy { padding: 24px 20px; width: 74%; }
  .moonup .moon-hero__art { top: 11px; right: -12px; max-width: 57%; opacity: 1; }
  .hero-orbits > span { width: 120%; height: 60%; left: 14%; top: 68%; }
  .hero-orbits > span:nth-child(2) { width: 115%; height: 70%; left: 37%; top: 55%; }
  .hero-orbits > i { width: 5px; height: 5px; left: 61%; top: 87%; }
}
@media (max-width: 360px) {
  .moonup .moon-hero__copy { width: 87%; padding: 22px 18px; }
  .moonup .moon-hero h1 { font-size: 29px; }
  .moonup .moon-hero__art { top: 22px; opacity: .83; }
}
@media (prefers-reduced-motion: reduce) {
  .moonup *, .moonup *::before, .moonup *::after { animation: none !important; transition: none !important; }
}

/* Keep the client layout stable when the shared script selects its moon theme. */
html[data-theme="moon"] body.moonup::before,
html[data-theme="moon"] body.moonup::after { content: none; }
html[data-theme="moon"] body.moonup .app { position: relative; z-index: auto; }
body.moonup.has-nav .app { padding-bottom: 20px; }
.moonup .brand__word { min-width: 0; }
.moonup .brand__word--custom { max-width: 100%; }
.moonup .brand__word--custom .brand__moon { background: none; -webkit-text-fill-color: currentColor; overflow-wrap: anywhere; font-size: .8em; letter-spacing: -.5px; }
.moonup .brand__up[hidden] { display: none; }

/* A shared games destination, preserving the server-controlled game buttons. */
.moonup #viewGames { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; }
.moonup #viewGames > :not(.game-pick) { grid-column: 1 / -1; }
.moonup #viewGames > section.card { background: linear-gradient(115deg, #211a30, #171c2a); border-color: #51405f; border-radius: 22px 46px 22px 22px; }
.moonup #viewGames .card__title { font-size: 24px; font-weight: 600; letter-spacing: -.6px; }
.moonup .games-title { margin: 2px 0 0; max-width: 650px; color: #ece3fa; font-size: clamp(29px, 3vw, 42px); font-weight: 600; line-height: 1.18; letter-spacing: -1.2px; }
.moonup #viewGames > section .note { max-width: 680px; margin: 0; }
.moonup .game-pick { --game-light: #bed9d0; --game-border: #41625e; position: relative; isolation: isolate; min-width: 0; min-height: 248px; overflow: hidden; display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; gap: 25px; padding: 28px; border: 1px solid var(--game-border); border-radius: 22px 48px 22px 22px; background: radial-gradient(ellipse at 110% 0, #54857945, transparent 65%), linear-gradient(140deg, #1c2b2c, #161923); text-align: left; }
.moonup #pickDice { --game-light: #d9c0f2; --game-border: #645072; border-radius: 48px 22px 22px 22px; background: radial-gradient(ellipse at 110% 0, #8053a855, transparent 65%), linear-gradient(140deg, #2b2139, #1b1928); }
.moonup .game-pick::before { content: ""; position: absolute; z-index: -1; width: 290px; height: 150px; top: -10px; right: -75px; border: 1px solid var(--game-border); border-radius: 50%; transform: rotate(-32deg); opacity: .45; box-shadow: 0 0 0 22px #b5c1e108, 0 0 0 44px #b5c1e108; pointer-events: none; }
.moonup .game-pick::after { content: ""; position: absolute; top: 39px; right: 46px; width: 7px; height: 7px; border-radius: 50%; background: var(--game-light); box-shadow: 0 0 18px var(--game-light); pointer-events: none; }
.moonup .game-pick:hover:not(:disabled) { transform: translateY(-3px); border-color: var(--game-light); box-shadow: 0 14px 35px #03060d40; }
.moonup .game-pick:active:not(:disabled) { transform: translateY(-1px); }
.moonup .game-pick__icon { display: grid; place-items: center; width: 66px; height: 66px; flex: none; border: 1px solid var(--game-border); border-radius: 20px; color: var(--game-light); background: #ffffff08; box-shadow: inset 0 1px #ffffff0a; font-size: 34px; transform: rotate(-8deg); }
.moonup #pickDice .game-pick__icon { transform: rotate(8deg); }
.moonup .game-pick__icon .icon { width: 34px; height: 34px; }
.moonup .game-pick__body { flex: none; width: 100%; padding-right: 34px; gap: 9px; }
.moonup .game-pick__body b { color: #f2eaf9; font-size: 29px; line-height: 1.2; letter-spacing: -.7px; font-weight: 600; }
.moonup .game-pick__body .note { color: var(--game-light); font-size: 13px; line-height: 1.65; }
.moonup .game-pick__arrow { position: absolute; bottom: 27px; right: 24px; display: grid; place-items: center; width: 31px; height: 31px; border: 1px solid var(--game-border); border-radius: 50%; color: var(--game-light); font-size: 25px; line-height: 1; }
.moonup #gamesEmpty { padding: 32px 20px; border: 1px dashed #51405f; border-radius: 22px; text-align: center; }
.moonup .back-link { border-radius: 8px; padding: 6px 0; font-size: 13px; flex-shrink: 0; }

/* The shared Dice scene; movement is triggered only by game actions. */
.moonup .dice-stage {
  --die-size: 94px;
  --die-depth: 47px;
  --die-cycle: 4.6s;
  position: relative;
  grid-column: 1 / -1;
  width: 100%;
  min-width: 0;
  height: 236px;
  margin: -10px 0 -4px;
  border: 1px solid #a78dbb20;
  border-radius: 24px 62px 24px 24px;
  overflow: hidden;
  background: radial-gradient(ellipse at 50% 84%, #657e7423, transparent 45%), radial-gradient(ellipse at 50% 34%, #8b62b824, transparent 57%), linear-gradient(125deg, #18162270, #11182160);
  pointer-events: none;
  user-select: none;
}
.moonup .dice-stage::before {
  content: "";
  position: absolute;
  width: 300px;
  height: 150px;
  top: 34px;
  left: calc(50% - 150px);
  border: 1px solid #c6b0ee16;
  border-radius: 50%;
  transform: rotate(-23deg);
  box-shadow: 0 0 0 29px #baa4d807, 0 0 0 59px #baa4d805;
}
.moonup .dice-preview__orbit {
  position: absolute;
  left: calc(50% - 129px);
  top: 167px;
  width: 258px;
  height: 59px;
  border: 1px solid #bbebd42b;
  border-radius: 50%;
  box-shadow: 0 0 26px #a4ddc40a, inset 0 0 18px #b4dccc09;
}
.moonup .dice-preview__orbit::before { content: ""; position: absolute; inset: 9px 29px; border: 1px solid #c6b3e424; border-radius: inherit; }
.moonup .dice-preview__orbit::after { content: ""; position: absolute; top: 17px; right: 11px; width: 5px; height: 5px; border-radius: 50%; background: #b6e7cd; box-shadow: 0 0 14px #b6e7cd99; }
.moonup .dice-preview__spark { position: absolute; left: calc(50% - 128px); top: 66px; width: 4px; height: 4px; border-radius: 50%; background: #d9c1ff; box-shadow: 0 0 14px #d9c1ff88, 254px 18px 0 -1px #c2e9d5, 187px -32px 0 -1px #c8b1e7, -17px 64px 0 -1px #c1b1d1; }
.moonup .dice-preview__shadow { position: absolute; top: 195px; left: calc(50% - 55px); width: 110px; height: 20px; border-radius: 50%; background: radial-gradient(ellipse, #080711a3, #100e1938 53%, transparent 74%); transform: scale(1); opacity: .85; animation: none; }
.moonup .dice-preview__perspective { position: absolute; inset: 0; perspective: 720px; perspective-origin: 50% 42%; }
.moonup .dice-preview__lift { position: absolute; width: var(--die-size); height: var(--die-size); top: 88px; left: calc(50% - var(--die-depth)); transform-style: preserve-3d; animation: none; }
.moonup .dice-preview__cube { position: relative; width: 100%; height: 100%; transform-style: preserve-3d; transform: rotateX(-25deg) rotateY(-33deg) rotateZ(-8deg); animation: none; }
.moonup .dice-preview__face {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template: repeat(3, 1fr) / repeat(3, 1fr);
  place-items: center;
  padding: 17%;
  gap: 8%;
  border: 1px solid #fff4ffb0;
  border-radius: 7px;
  background: radial-gradient(circle at 22% 16%, #fff8ffbd, transparent 46%), linear-gradient(145deg, #e0d0f7, #bea2dc);
  box-shadow: inset 0 0 0 4px #ffffff1c, inset 0 -5px 10px #7a5b9340;
  backface-visibility: hidden;
}
.moonup .dice-preview__face--one { transform: translateZ(var(--die-depth)); }
.moonup .dice-preview__face--six { transform: rotateY(180deg) translateZ(var(--die-depth)); background: linear-gradient(145deg, #b4cdd0, #86aaa3); }
.moonup .dice-preview__face--three { transform: rotateY(90deg) translateZ(var(--die-depth)); background: linear-gradient(145deg, #d1bce8, #a68ac5); }
.moonup .dice-preview__face--four { transform: rotateY(-90deg) translateZ(var(--die-depth)); background: linear-gradient(145deg, #b7dcca, #86b9aa); }
.moonup .dice-preview__face--two { transform: rotateX(90deg) translateZ(var(--die-depth)); background: radial-gradient(circle at 30% 24%, #fffcffb3, transparent 65%), linear-gradient(145deg, #f0e8ff, #d5c5ed); }
.moonup .dice-preview__face--five { transform: rotateX(-90deg) translateZ(var(--die-depth)); background: linear-gradient(145deg, #c1a5e0, #997bb9); }
.moonup .dice-preview__pip { width: 100%; height: 100%; aspect-ratio: 1; max-width: 12px; max-height: 12px; border-radius: 50%; background: #47385e; box-shadow: inset 0 2px 3px #2212339c, 0 1px 0 #fff8ff80; }
.moonup .dice-preview__pip--tl { grid-area: 1 / 1; }
.moonup .dice-preview__pip--tr { grid-area: 1 / 3; }
.moonup .dice-preview__pip--ml { grid-area: 2 / 1; }
.moonup .dice-preview__pip--mc { grid-area: 2 / 2; }
.moonup .dice-preview__pip--mr { grid-area: 2 / 3; }
.moonup .dice-preview__pip--bl { grid-area: 3 / 1; }
.moonup .dice-preview__pip--br { grid-area: 3 / 3; }
.moonup #viewDice[hidden] .dice-preview__lift,
.moonup #viewDice[hidden] .dice-preview__cube,
.moonup #viewDice[hidden] .dice-preview__shadow { animation-play-state: paused; }
@keyframes moonup-die-toss {
  0%, 13%, 88%, 100% { transform: translateY(0) scale3d(1, 1, 1); }
  18% { transform: translateY(5px) scale3d(1.03, .96, 1.03); animation-timing-function: cubic-bezier(.18,.62,.3,1); }
  39% { transform: translateY(-45px) scale3d(1, 1, 1); animation-timing-function: cubic-bezier(.55,0,.85,.4); }
  62% { transform: translateY(5px) scale3d(1.04, .94, 1.04); }
  71% { transform: translateY(-8px) scale3d(1, 1, 1); }
  79% { transform: translateY(1px) scale3d(1.01, .99, 1.01); }
}
@keyframes moonup-die-tumble {
  0%, 18% { transform: rotateX(-25deg) rotateY(-33deg) rotateZ(-8deg); }
  39% { transform: rotateX(135deg) rotateY(127deg) rotateZ(140deg); }
  62%, 100% { transform: rotateX(335deg) rotateY(327deg) rotateZ(352deg); }
}
@keyframes moonup-die-shadow {
  0%, 13%, 88%, 100% { transform: scale(1); opacity: .85; }
  18%, 62% { transform: scale(1.08); opacity: .95; }
  39% { transform: scale(.67); opacity: .3; }
  71% { transform: scale(.93); opacity: .65; }
}
@media (max-width: 760px) {
  .moonup .dice-stage { --die-size: 84px; --die-depth: 42px; height: 220px; border-radius: 21px 48px 21px 21px; margin: -6px 0 -2px; }
  .moonup .dice-preview__lift { top: 85px; }
  .moonup .dice-preview__orbit { top: 154px; }
  .moonup .dice-preview__shadow { top: 183px; }
  .moonup .dice-preview__face { border-radius: 6px; }
  .moonup .dice-preview__pip { max-width: 11px; max-height: 11px; }
}
@media (prefers-reduced-motion: reduce) {
  .moonup .dice-preview__lift, .moonup .dice-preview__cube, .moonup .dice-preview__shadow { animation: none; }
}
@media (max-width: 760px) {
  body.moonup.has-nav .app { padding-bottom: calc(100px + env(safe-area-inset-bottom)); }
  .moonup .game-pick { min-height: 230px; padding: 24px; }
}
@media (max-width: 600px) {
  .moonup #viewGames { grid-template-columns: minmax(0, 1fr); gap: 17px; }
  .moonup .game-pick { min-height: 212px; padding: 24px; gap: 24px; }
  .moonup .game-pick__icon { width: 57px; height: 57px; font-size: 30px; border-radius: 18px; }
  .moonup .game-pick__body b { font-size: 27px; }
  .moonup .game-pick__body .note { font-size: 12px; }
  .moonup .game-pick__arrow { right: 20px; bottom: 24px; }
}


/* One console: stake controls beside the actual, server-backed game surface. */
.moonup #viewMines, .moonup #viewDice, .moonup #viewGame, .moonup #viewRoll { display: block; max-width: none; width: 100%; margin: 0; }
.moonup .game-console { display: grid; grid-template-columns: minmax(270px, .8fr) minmax(0, 1.45fr); align-items: stretch; border: 1px solid #63507b55; border-radius: 25px; overflow: hidden; background: #151420; }
.moonup .game-controls.card { min-width: 0; margin: 0; padding: 25px; border: none; border-right: 1px solid #65507935; border-radius: 0; background: linear-gradient(155deg, #241d31, #171b26); backdrop-filter: none; -webkit-backdrop-filter: none; box-shadow: none; gap: 18px; }
.moonup .game-controls > .direction { gap: 8px; flex-wrap: wrap; }
.moonup .game-controls .field { margin: 0; }
.moonup .game-controls .presets { gap: 6px; }
.moonup .game-controls .presets button { padding: 9px 5px; font-size: 12px; }
.moonup .game-controls .primary { margin-top: 2px; }
.moonup .game-controls .note { font-size: 11px; line-height: 1.65; color: #b2a5c3; }
.moonup .control-divider { height: 1px; background: #73638135; margin: 0 -2px; }
.moonup .game-arena { min-width: 0; position: relative; display: flex; flex-direction: column; gap: 22px; padding: 25px 28px; background: radial-gradient(ellipse at 70% 20%, #4632533a, transparent 65%), radial-gradient(ellipse at 10% 90%, #2c4c4940, transparent 65%), #10131f; }
.moonup .arena-heading { display: flex; align-items: center; justify-content: space-between; gap: 15px; font-size: 10px; letter-spacing: 1.6px; color: #b5a4c9; }
.moonup .arena-heading b { font-size: 10px; color: #a9d5c2; font-weight: 500; letter-spacing: 1px; }
.moonup .arena-note { text-align: center; font-size: 12px; color: #afa2c0; margin: 0; line-height: 1.6; }
.moonup .mines-board-mount { display: grid; place-items: center; flex: 1; min-height: 390px; padding: 12px 0; }
.moonup #grid { width: 100%; max-width: 420px; margin: 0 auto; gap: 9px; }
.moonup #grid .cell { position: relative; overflow: visible; padding: 0; min-width: 0; border: 1px solid #75618966; border-radius: 12px; background: #202635; box-shadow: 0 4px #070c18, inset 0 1px #f0d8ff15; transition: transform .16s, border-color .16s, box-shadow .16s; }
.moonup #grid .cell:disabled { opacity: 1; cursor: default; }
.moonup #grid .cell:not(:disabled):hover { transform: translateY(-3px); border-color: #c3a6ed; box-shadow: 0 6px #070c18, 0 0 22px #b4a1dd1e; }
.moonup #grid .cell:not(:disabled):active { transform: translateY(1px) scale(.96); }
.moonup #grid .cell__cover { position: absolute; inset: 0; display: grid; place-items: center; border-radius: inherit; background: linear-gradient(145deg, #3e3354, #28263f); box-shadow: inset 0 1px #d9bcff22; color: #9981b74d; font-size: 26px; transform-origin: center bottom; z-index: 2; }
.moonup #grid .cell__symbol { width: 42%; height: 48%; display: block; opacity: 0; color: transparent; transform: scale(.5); }
.moonup #grid .cell--gem { background: linear-gradient(140deg, #2a4f49, #203137); border-color: #81d2b773; box-shadow: 0 4px #070c18, inset 0 0 18px #aaf4d414; }
.moonup #grid .cell--gem .cell__symbol { opacity: 1; transform: scale(1); background: conic-gradient(from 34deg at 50% 38%, #aaf6d8, #4eac92 26%, #9de8cd 27%, #cdfbe9 52%, #77c9b1 53%, #e7fff6 78%, #aaf6d8); clip-path: polygon(50% 0, 91% 28%, 94% 53%, 50% 100%, 6% 53%, 9% 28%); }
.moonup #grid .cell--mine, .moonup #grid .cell--boom { border-color: #e8918880; background: linear-gradient(145deg, #673741, #372838); }
.moonup #grid .cell--mine .cell__symbol, .moonup #grid .cell--boom .cell__symbol { width: 52%; height: 52%; opacity: 1; transform: scale(1); border-radius: 50%; background: radial-gradient(circle at 32% 24%, #ffded0 0 9%, #ed998e 13%, #ad5a65 53%, #57304b 76%); box-shadow: 0 0 0 4px #ef9d8520, 0 0 18px #fa9e7733; }
.moonup #grid .cell--gem .cell__cover, .moonup #grid .cell--mine .cell__cover, .moonup #grid .cell--boom .cell__cover { opacity: 0; transform: scale(.75); }
.moonup #grid .cell--dim { opacity: .4; }
.moonup #grid .cell.pending .cell__cover { animation: lunar-cell-pending .65s ease-in-out infinite alternate; }
.moonup #grid .cell.is-revealing .cell__cover { animation: lunar-cell-open .42s cubic-bezier(.22,.8,.2,1) both; }
.moonup #grid .cell.is-revealing .cell__symbol { animation: lunar-gem-arrive .42s cubic-bezier(.2,.8,.2,1) both; }
.moonup #grid .cell--boom.is-revealing { animation: lunar-impact .42s ease-out; }
.moonup #grid .cell--boom.is-revealing::after { content: ''; position: absolute; inset: -7px; border: 2px solid #f4ac91; border-radius: 50%; pointer-events: none; animation: lunar-impact-ring .55s ease-out both; }
.moonup #grid[data-state="won"] { filter: drop-shadow(0 0 15px #96ecc91a); }
.moonup #grid[aria-busy="true"] { cursor: progress; }
.moonup .game-arena .fair { margin-top: auto; max-width: 100%; }
.moonup .game-arena .fair__body { overflow-wrap: anywhere; }
.moonup .game-arena .result { margin: 0; }
.moonup .game-controls .game__stats { grid-template-columns: 1fr; gap: 17px; }
.moonup .game-controls .game__big { font-size: 25px; }
.moonup .game-controls .pay__head { flex-wrap: wrap; gap: 10px; font-size: 12px; }

/* Idle until an actual action; the final value always comes from that action. */
.moonup .dice-stage { --die-size: 106px; --die-depth: 53px; height: 290px; margin: 0; border: 0; border-radius: 20px; background: radial-gradient(ellipse at 50% 72%, #82729a12, transparent 60%); pointer-events: none; }
.moonup .dice-stage::before { top: 50px; opacity: .65; }
.moonup .dice-preview__lift { top: 83px; }
.moonup .dice-preview__orbit { top: 194px; }
.moonup .dice-preview__shadow { top: 216px; }
.moonup .dice-stage__value { display: block; position: absolute; bottom: 0; left: 0; right: 0; text-align: center; color: #e7d4fc; font-size: 34px; font-weight: 650; font-variant-numeric: tabular-nums; letter-spacing: -1.3px; }
.moonup .dice-stage[data-state="pending"] .dice-stage__value { font-size: 13px; letter-spacing: .4px; color: #b6a5cf; }
.moonup .dice-stage[data-state="won"] .dice-stage__value { color: #adf1d2; text-shadow: 0 0 24px #8fe7bd33; }
.moonup .dice-stage[data-state="lost"] .dice-stage__value { color: #f3b2a1; }
.moonup .dice-stage[data-state="error"] .dice-stage__value { font-size: 13px; letter-spacing: 0; color: #e7b19f; }
.moonup .dice-stage.is-rolling .dice-preview__cube { animation: moonup-live-spin .72s linear infinite; }
.moonup .dice-stage.is-rolling .dice-preview__lift { animation: moonup-live-toss .72s ease-in-out infinite; }
.moonup .dice-stage.is-rolling .dice-preview__shadow { animation: moonup-live-shadow .72s ease-in-out infinite; }
.moonup .dice-stage.is-settling .dice-preview__lift { animation: moonup-live-land .18s ease-out; }
.moonup .dice-stage.is-settling .dice-preview__cube { animation: moonup-live-face .18s ease-out; }
.moonup .dice-settings { display: grid; gap: 14px; }
.moonup .dice-settings .field { margin: 0; }
.moonup .dice-settings .game__stats { margin: 0; background: #1b1b2c; }
.moonup .dice-arena .demo-roll { display: grid; gap: 13px; border-top: 1px solid #79608b30; padding-top: 18px; margin: 0; }
.moonup .dice-arena .demo-roll__row { display: flex; justify-content: center; }
.moonup .dice-arena #demoRollBtn { width: 100%; max-width: 280px; }
.moonup .dice-arena #demoText { text-align: center; font-size: 11px; margin: 0; }
.moonup #rollNumber, .moonup #demoNumber { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.moonup .dice-arena #rollBar { margin: 0 0 14px; }
.moonup #viewRoll .dice-arena { min-height: 560px; }
@keyframes lunar-cell-pending { from { transform: scale(1); filter: brightness(1); } to { transform: scale(.94); filter: brightness(1.4); } }
@keyframes lunar-cell-open { from { opacity: 1; transform: perspective(500px) rotateX(0) scale(1); } to { opacity: 0; transform: perspective(500px) rotateX(76deg) scale(.82); } }
@keyframes lunar-gem-arrive { 0%, 20% { opacity: 0; transform: scale(.3) translateY(8px); } 75% { opacity: 1; transform: scale(1.1) translateY(-2px); } 100% { opacity: 1; transform: scale(1) translateY(0); } }
@keyframes lunar-impact { 20% { transform: translateX(-4px); } 40% { transform: translateX(4px); } 60% { transform: translateX(-2px); } 80% { transform: translateX(2px); } }
@keyframes lunar-impact-ring { from { opacity: .85; transform: scale(.45); } to { opacity: 0; transform: scale(1.7); } }
@keyframes moonup-live-spin { from { transform: rotateX(-25deg) rotateY(-33deg) rotateZ(-8deg); } to { transform: rotateX(335deg) rotateY(327deg) rotateZ(352deg); } }
@keyframes moonup-live-toss { 0%, 100% { transform: translateY(0); } 45% { transform: translateY(-42px); } }
@keyframes moonup-live-shadow { 0%, 100% { opacity: .85; transform: scale(1); } 45% { opacity: .25; transform: scale(.65); } }
@keyframes moonup-live-land { 0% { transform: translateY(-8px) scale(1); } 60% { transform: translateY(3px) scale(1.04,.95); } 100% { transform: translateY(0) scale(1); } }
@keyframes moonup-live-face { from { transform: rotateX(-35deg) rotateY(-20deg) rotateZ(-12deg); } to { transform: rotateX(-25deg) rotateY(-33deg) rotateZ(-8deg); } }
@media (max-width: 1100px) {
  .moonup .game-console { grid-template-columns: minmax(250px, .9fr) minmax(0, 1.2fr); }
  .moonup .game-controls.card { padding: 20px; }
  .moonup .game-arena { padding: 22px; }
  .moonup .mines-board-mount { min-height: 320px; }
}
@media (max-width: 900px) {
  .moonup .game-console { display: flex; flex-direction: column; }
  .moonup .game-arena { order: 0; }
  .moonup .game-controls.card { order: 1; border-right: 0; border-top: 1px solid #65507940; }
  .moonup .mines-board-mount { min-height: 0; }
  .moonup .mines-arena { gap: 18px; }
  .moonup .game-controls .game__stats { grid-template-columns: 1fr 1fr; }
  .moonup #viewRoll .dice-arena { min-height: 0; }
}
@media (max-width: 480px) {
  .moonup .game-console { border-radius: 21px; }
  .moonup .game-arena { padding: 19px 16px; gap: 17px; }
  .moonup .game-controls.card { padding: 21px 18px; }
  .moonup #grid { gap: 7px; }
  .moonup #grid .cell { border-radius: 9px; }
  .moonup #grid .cell__cover { font-size: 21px; }
  .moonup .arena-note { font-size: 11px; }
  .moonup .dice-stage { --die-size: 84px; --die-depth: 42px; height: 247px; }
  .moonup .dice-preview__lift { top: 70px; }
  .moonup .dice-preview__orbit { top: 163px; width: 230px; left: calc(50% - 115px); }
  .moonup .dice-preview__shadow { top: 185px; }
  .moonup .dice-stage__value { font-size: 31px; }
  .moonup .dice-settings .game__stats { padding: 14px 10px; gap: 6px; }
  .moonup .dice-settings .game__stats .field__label { font-size: 9px; }
}
@media (prefers-reduced-motion: reduce) {
  .moonup .dice-stage *, .moonup #grid *, .moonup #grid *::after { animation: none !important; transition: none !important; }
}

@media (max-width: 760px) {
  .moonup #viewGame, .moonup #viewRoll { padding-bottom: calc(86px + env(safe-area-inset-bottom)); }
  .moonup #cashoutBtn, .moonup #gameNewBtn, .moonup #rollBtn, .moonup #rollNewBtn {
    position: fixed; z-index: 65; left: 16px; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom));
    width: calc(100% - 32px); min-height: 52px; margin: 0;
    box-shadow: 0 8px 35px #050611d9, 0 0 0 8px #11131ce6;
  }
}

/* Balance, deposits and the brighter MoonUP game catalogue. */
.moonup .balance-pill { display:flex; align-items:center; gap:9px; padding:6px 6px 6px 10px; border:1px solid #444463; background:linear-gradient(130deg,#23283a,#141622); border-radius:32px; color:#fff; min-height:45px; white-space:nowrap; }
.balance-pill__coin { display:grid; place-items:center; width:29px; height:29px; border-radius:50%; background:#9ce8bd; color:#153d2c; font-weight:850; }
.balance-pill__amount { min-width:38px; font-size:15px; font-weight:800; }
.balance-pill__plus { display:grid; place-items:center; width:33px; height:33px; border-radius:50%; color:#062329; background:linear-gradient(140deg,#afffdf,#61d8f5); box-shadow:0 0 18px #65ffe832; }
.balance-pill__plus .icon { width:19px; height:19px; }
.moonup .balance-pill:hover { border-color:#99eacf; background:#262b41; }
.moonup .moon-hero { background:radial-gradient(ellipse at 62% 2%,#6651b954,transparent 60%),linear-gradient(120deg,#271d47,#121727); }
.moonup .moon-hero__copy { width:66%; padding:30px 34px; }
.moonup .moon-hero h1 { display:flex; align-items:center; gap:24px; margin:16px 0; }
.moonup .moon-hero h1 .promo-number { font-size:clamp(66px,8vw,104px); font-weight:900; letter-spacing:-7px; line-height:1; color:#d0ff88; text-shadow:0 8px 35px #b7ff4225; }
.moonup .moon-hero h1 > span { color:#fff; font-size:clamp(23px,2.4vw,34px); font-weight:800; letter-spacing:-1px; line-height:1.16; }
.moonup .moon-hero p { color:#c7c0dc; max-width:300px; }
.moonup .moon-hero__art { opacity:.82; right:-3%; top:-11%; }
.moonup .primary { background:linear-gradient(120deg,#d2ff88,#9deca9); color:#1a3124; border-color:#d4ffb18c; box-shadow:0 5px 22px #9afc7415; font-weight:800; }
.moonup .primary:not(:disabled):hover { background:linear-gradient(120deg,#e2ffa9,#b5ffd3); box-shadow:0 6px 28px #adfc7630; }
.moonup .games-hub { gap:22px; }
.games-promo { display:flex; position:relative; isolation:isolate; overflow:hidden; min-height:244px; border-radius:27px; padding:30px 32px; border:1px solid #d2838866; background:radial-gradient(ellipse at 89% 9%,#ffb45780,transparent 60%),linear-gradient(112deg,#56218c,#b13573 65%,#f78358); }
.games-promo::before { content:""; position:absolute; width:350px; height:350px; border:1px solid #ffefd542; border-radius:50%; right:-50px; top:-91px; box-shadow:0 0 0 38px #fff4d80a,0 0 0 86px #fff4d807; pointer-events:none; }
.games-promo__copy { position:relative; z-index:2; width:70%; }
.promo-label { color:#ffe6aa; font-size:10px; letter-spacing:1.8px; font-weight:850; }
.games-promo h1 { font-size:clamp(27px,3.5vw,42px); line-height:1.12; font-weight:900; letter-spacing:-1.4px; margin:12px 0 10px; }
.games-promo p { color:#ffe2eb; font-size:14px; margin:0 0 19px; }
.promo-actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px; }
.moonup .promo-actions .primary { min-height:43px; padding:11px 17px; font-size:13px; background:#e0ffa5; border-color:#efffd780; color:#23351a; }
.moonup .promo-friends { font-size:12px; color:#fff2f9; padding:9px 0; text-decoration:underline; text-underline-offset:4px; }
.promo-gift { position:absolute; width:212px; height:225px; right:25px; top:23px; transform:rotate(12deg); pointer-events:none; }
.promo-gift__halo { position:absolute; inset:15px -20px -5px; background:radial-gradient(#ffdb7870,transparent 70%); }
.promo-gift__box { position:absolute; width:115px; height:100px; top:84px; left:47px; border-radius:12px 12px 22px 22px; background:linear-gradient(90deg,#dffe99 0 42%,#fff8cf 42% 57%,#b5ec78 57% 100%); box-shadow:inset -12px -10px 16px #31724930,8px 15px 0 #57276c2e,0 16px 30px #68216750; transform:skewY(-6deg); }
.promo-gift__box::before { content:""; position:absolute; width:132px; height:26px; top:-6px; left:-9px; border-radius:7px; background:linear-gradient(90deg,#e6ffaf 0 43%,#fffbe3 43% 57%,#c6f981 57%); box-shadow:0 5px 5px #69854c35; }
.promo-gift__bow { position:absolute; top:53px; left:82px; width:40px; height:36px; border:9px solid #efffb8; border-radius:24px 25px 4px 26px; transform:rotate(12deg); }
.promo-gift__bow::after { content:""; position:absolute; width:28px; height:27px; top:-9px; left:17px; border:9px solid #d0f895; border-radius:25px 23px 25px 4px; transform:rotate(8deg); }
.promo-gift > span { position:absolute; color:#fff3b7; font-size:44px; font-weight:350; top:18px; left:22px; }
.games-section-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.games-section-heading h2 { font-size:25px; font-weight:850; }
.games-section-heading > span { font-size:12px; color:#b5adc8; }
.games-catalog { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.moonup .game-tile { position:relative; display:block; overflow:hidden; isolation:isolate; min-width:0; text-align:left; padding:0; min-height:330px; border-radius:26px; border:1px solid; color:white; transition:transform .2s,box-shadow .2s,border-color .2s; }
.moonup .game-tile--mines { border-color:#7062bc; background:radial-gradient(ellipse at 56% 37%,#6946e9a6,transparent 60%),linear-gradient(145deg,#32285d,#13272b 73%,#111622); box-shadow:inset 0 1px 1px #b5a4ff54; }
.moonup .game-tile--dice { border-color:#cc7448; background:radial-gradient(ellipse at 58% 32%,#f998358c,transparent 60%),linear-gradient(145deg,#772840,#472630 67%,#201720); box-shadow:inset 0 1px 1px #ffc4a354; }
.game-tile::before { content:""; position:absolute; width:100%; height:130%; top:-53%; left:-10%; border:1px solid #fff3dd13; transform:rotate(-30deg); border-radius:50%; pointer-events:none; }
.game-tile__tag { position:absolute; z-index:2; top:20px; left:22px; color:#e6dcff; font-size:9px; font-weight:750; letter-spacing:1.4px; }
.game-tile--dice .game-tile__tag { color:#ffe7c6; }
.game-tile__art { display:block; width:100%; height:auto; max-height:290px; object-fit:contain; margin:-3px auto 35px; transition:transform .35s cubic-bezier(.2,.8,.2,1); }
.game-tile__info { position:absolute; inset:auto 0 0; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:24px 23px 22px; background:linear-gradient(transparent,#0c0d19c7 64%); }
.game-tile__info > span:first-child { display:flex; flex-direction:column; gap:2px; }
.game-tile__info b { font-size:34px; font-weight:900; line-height:1.1; letter-spacing:-1.2px; }
.game-tile__info small { font-size:12px; font-weight:500; color:#d4cde8; }
.game-tile__play { display:grid; place-items:center; width:45px; height:45px; flex:0 0 45px; border-radius:15px; font-size:24px; font-weight:700; color:#153d2c; background:#bfff8d; box-shadow:0 0 22px #a2fa5827; }
.game-tile--dice .game-tile__play { color:#4d2019; background:#ffb77d; box-shadow:0 0 22px #ffae5827; }
.moonup .game-tile:hover { transform:translateY(-4px); border-color:#d5bcff; box-shadow:0 14px 45px #9167ff25; }
.moonup .game-tile--dice:hover { border-color:#ffd8a1; box-shadow:0 14px 45px #ff8d4426; }
.game-tile:hover .game-tile__art { transform:translateY(-5px) rotate(-3deg) scale(1.04); }
.game-tile:active { transform:scale(.98); }
.game-balance { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:13px 0 0; color:#aaa2bb; font-size:12px; }
.game-balance b { color:#efffdc; font-size:14px; margin-left:5px; font-weight:800; }
.game-balance button { color:#c9ff95; font-size:12px; }
.balance-hint:empty { display:none; }
.balance-hint { font-size:12px; color:#d6c8e5; margin:0; }
.deposit-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:6px 0 8px; }
.deposit-heading h1 { font-size:38px; line-height:1.15; letter-spacing:-1.4px; margin:8px 0 10px; font-weight:850; }
.deposit-heading p { color:#aba4bd; margin:0; font-size:14px; }
.deposit-total { text-align:right; flex:0 0 auto; }
.deposit-total > span { display:block; font-size:12px; color:#a69bb9; }
.deposit-total strong { display:block; color:#caff9b; font-size:28px; font-weight:850; }
.deposit-layout { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(230px,.8fr); gap:22px; align-items:start; }
.moonup .deposit-card { padding:28px; gap:20px; }
.deposit-card h2 { font-size:18px; font-weight:750; }
.deposit-methods { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.moonup .deposit-method { display:flex; align-items:center; flex-direction:column; gap:4px; padding:20px 5px 17px; color:#e8e6f5; background:#222131; border:1px solid #39364d; border-radius:17px; min-width:0; }
.deposit-method__icon { display:grid; place-items:center; width:45px; height:45px; border-radius:15px; margin-bottom:8px; font-size:34px; line-height:1; font-weight:800; }
.deposit-method__icon svg { width:30px; height:30px; }
.deposit-method--usdt .deposit-method__icon { background:linear-gradient(140deg,#55dbb8,#159d84); color:#edfff7; }
.deposit-method--gifts .deposit-method__icon { background:linear-gradient(140deg,#7e8fff,#c069e9); color:#fff0fe; }
.deposit-method--sbp .deposit-method__icon { background:#34334b; }
.deposit-method strong { font-size:14px; font-weight:800; }
.deposit-method small { font-size:10px; color:#b5aac7; }
.moonup .deposit-method[aria-pressed="true"] { background:linear-gradient(135deg,#343b3a,#212833); border-color:#b7f29b; box-shadow:0 0 0 2px #b7f29b16; }
.moonup .deposit-method:hover { border-color:#b7a5d9; }
.moonup .deposit-method:disabled { opacity:.58; cursor:default; }
.deposit-amount .field__row { background:#10131f; border:1px solid #414058; border-radius:13px; }
.deposit-amount input { font-size:28px; font-weight:750; min-width:0; }
.wallet-notice { border:1px solid #636a893d; background:#2730475c; color:#cccbe0; border-radius:14px; padding:14px 17px; margin:0; font-size:13px; }
.deposit-guide { position:relative; padding:28px; border:1px solid #62775480; border-radius:24px; overflow:hidden; background:radial-gradient(ellipse at 100% 0,#8ad03e38,transparent 67%),linear-gradient(145deg,#28352b,#18251e); }
.deposit-guide__icon { display:grid; place-items:center; width:48px; height:48px; margin-bottom:23px; background:#c6fa91; border-radius:16px; font-size:35px; color:#304c28; box-shadow:8px 8px 0 #8dce4830; }
.deposit-guide h2 { color:#e9ffdf; font-size:26px; font-weight:800; line-height:1.15; }
.deposit-guide p { color:#bbcdb4; font-size:13px; line-height:1.7; }
.deposit-guide ol { counter-reset:step; padding:18px 0 0; margin:18px 0 0; list-style:none; border-top:1px solid #86a37236; display:grid; gap:14px; }
.deposit-guide li { display:flex; align-items:center; gap:10px; font-size:12px; color:#d8e7d1; counter-increment:step; }
.deposit-guide li::before { content:counter(step); flex:0 0 21px; display:grid; place-items:center; width:21px; height:21px; border-radius:50%; border:1px solid #8eab756b; color:#caff9b; font-size:10px; }
.deposit-details { padding:20px; border:1px solid #4b4b63; border-radius:15px; background:#121621; overflow-wrap:anywhere; font-size:14px; }
.deposit-details img { display:block; width:210px; max-width:100%; height:auto; border-radius:14px; padding:10px; background:#fff; margin:16px auto; }
.deposit-details a { color:#d5f6aa; text-decoration:underline; text-underline-offset:3px; }
.deposit-history h2 { font-size:18px; }
.moonup .deposit-history .history { margin:0; }
.moonup .game-console { border-color:#66528b; box-shadow:0 14px 70px #52277717; }
.moonup .mines-arena { background:radial-gradient(ellipse at 60% 35%,#4731846b,transparent 68%),#141827; }
.moonup .dice-arena { background:radial-gradient(ellipse at 55% 35%,#75406b52,transparent 72%),#191722; }
.moonup .cell__cover { background:linear-gradient(145deg,#655192,#30294e); border-color:#a88fd271; box-shadow:inset 0 1px 0 #c5b1f844,0 5px 0 #1b172d; }
.moonup .grid[data-state="active"] .cell:not(:disabled):hover .cell__cover { background:linear-gradient(145deg,#8966c4,#513878); border-color:#d9b9ff; }
.moonup .dice-stage { background:radial-gradient(ellipse at 50% 60%,#9f528f17,transparent 72%); }
@media (max-width:1100px) {
  .moonup .moon-hero h1 { gap:17px; }
  .moonup .moon-hero h1 .promo-number { font-size:80px; letter-spacing:-5px; }
  .games-promo { padding:25px; }
  .promo-gift { right:-4px; transform:rotate(12deg) scale(.87); }
  .game-tile__info b { font-size:29px; }
  .moonup .game-tile { min-height:290px; }
  .deposit-layout { grid-template-columns:1fr; }
  .deposit-guide { display:none; }
}
@media (max-width:760px) {
  .moonup .topbar { min-height:80px; height:80px; }
  .moonup .topbar__right { display:flex; gap:0; }
  .moonup .brand--mobile { font-size:27px; }
  .moonup .brand--mobile .brand__symbol { width:26px; height:26px; }
  .moonup .brand--mobile { gap:6px; }
  .moonup .balance-pill { gap:7px; padding:5px; min-height:40px; }
  .balance-pill__coin { width:25px; height:25px; font-size:14px; }
  .balance-pill__plus { width:29px; height:29px; }
  .balance-pill__amount { font-size:13px; min-width:24px; }
  .moonup .nav { gap:0; padding:7px 5px; }
  .moonup .nav__btn { min-width:0; padding:7px 3px; font-size:10px; gap:5px; }
  .moonup .nav__btn .icon { width:21px; height:21px; }
  .moonup .nav__btn--soon .soon-tag { display:none; }
  .moonup .moon-hero { min-height:226px; }
  .moonup .moon-hero__copy { width:76%; padding:23px; }
  .moonup .moon-hero h1 { flex-direction:column; align-items:flex-start; gap:8px; margin:12px 0; }
  .moonup .moon-hero h1 .promo-number { font-size:72px; letter-spacing:-4px; }
  .moonup .moon-hero h1 > span { font-size:27px; letter-spacing:-1px; }
  .moonup .moon-hero h1 > span br { display:none; }
  .moonup .moon-hero__art { width:260px; height:260px; right:-75px; top:0; max-width:75%; opacity:.56; }
  .moonup .moon-hero p { font-size:12px; max-width:215px; }
  .moonup .games-hub { gap:19px; }
  .games-promo { min-height:222px; padding:23px 21px; border-radius:22px; }
  .games-promo__copy { width:84%; }
  .games-promo h1 { font-size:29px; letter-spacing:-1.1px; }
  .games-promo p { max-width:190px; font-size:12px; }
  .promo-label { font-size:8px; letter-spacing:1.3px; }
  .promo-gift { right:-65px; top:17px; transform:rotate(12deg) scale(.65); }
  .promo-actions { gap:12px; }
  .moonup .promo-actions .primary { font-size:12px; padding:10px 13px; min-height:41px; }
  .moonup .promo-friends { font-size:11px; }
  .games-section-heading h2 { font-size:24px; }
  .games-section-heading > span { font-size:10px; }
  .games-catalog { gap:12px; }
  .moonup .game-tile { border-radius:21px; min-height:235px; }
  .game-tile__tag { top:15px; left:14px; font-size:7px; letter-spacing:.7px; }
  .game-tile__art { width:130%; max-width:none; margin:5px -15% 37px; height:195px; }
  .game-tile__info { padding:20px 14px 16px; gap:5px; }
  .game-tile__info b { font-size:27px; }
  .game-tile__info small { font-size:9px; }
  .game-tile__play { width:31px; height:31px; flex-basis:31px; border-radius:10px; font-size:21px; }
  .deposit-heading { align-items:flex-start; gap:12px; }
  .deposit-heading h1 { font-size:32px; }
  .deposit-heading p { max-width:200px; font-size:12px; }
  .deposit-total { padding-top:12px; }
  .deposit-total strong { font-size:22px; }
  .deposit-total > span { font-size:10px; }
  .moonup .deposit-card { padding:22px 17px; }
  .deposit-methods { gap:8px; }
  .moonup .deposit-method { padding:17px 3px 14px; }
  .deposit-method strong { font-size:12px; }
  .deposit-method small { font-size:9px; }
  .deposit-method__icon { width:39px; height:39px; font-size:29px; border-radius:12px; }
}
@media (max-width:360px) {
  .moonup .brand--mobile { font-size:23px; }
  .moonup .brand--mobile .brand__symbol { width:23px; height:23px; }
  .balance-pill__coin { display:none; }
  .games-promo h1 { font-size:26px; }
  .moonup .game-tile { min-height:218px; }
  .game-tile__art { height:180px; }
  .game-tile__info { padding:20px 11px 13px; }
  .game-tile__info b { font-size:24px; }
  .game-tile__info small { font-size:8px; }
}
@media (prefers-reduced-motion:reduce) {
  .moonup .game-tile, .game-tile__art { transition:none; }
  .moonup .game-tile:hover, .game-tile:hover .game-tile__art { transform:none; }
}

.pay-qr { display:grid; gap:14px; justify-items:center; padding:14px; border:1px solid #484356; border-radius:17px; background:#191925; }
.pay-qr img { max-width:220px; width:100%; height:auto; padding:12px; background:white; border-radius:15px; }
.pay-qr a { text-decoration:none; }

.deposit-method__state { font-size:9px; color:#c5ff9b; margin-top:5px; }
.is-unavailable .deposit-method__state { color:#a398ba; }
.deposit-detail { display:grid; gap:4px; margin:12px 0; }
.deposit-detail > span { font-size:11px; color:#b3a8c4; }
.deposit-detail > strong { font-weight:650; font-size:14px; }
.deposit-detail button { justify-self:start; color:#c8fca2; font-size:12px; padding:5px 0; }
.deposit-history-item { width:100%; text-align:left; padding:13px 4px; color:#d8cee7; font-size:13px; }
#depositStatus[data-state="success"] { color:#b8f594; }
#depositStatus[data-state="error"] { color:#ffada4; }
.moonup .promo-friends, .game-balance button { background:none; border:0; }
.moonup .games-promo { min-height:230px; padding-top:24px; padding-bottom:24px; }
.moonup .games-promo h1 { font-size:clamp(27px,3vw,36px); margin:10px 0 8px; }
.moonup .games-promo p { margin-bottom:15px; }
@media (max-width:760px) {
  .moonup .games-promo { min-height:222px; padding-top:21px; padding-bottom:21px; }
  .moonup .games-promo h1 { font-size:29px; }
}
@media (max-width:360px) { .moonup .games-promo h1 { font-size:26px; } }

.moonup .pill--game-lost { color:#ffb1ac; background:#722c382e; border-color:#8a455657; }
