/* NovaMedia H5 readability and asset-fit fixes — 2026-09-16
 * Scoped to stable page roots/current component scopes. Layout, pointer events,
 * and application behavior are intentionally untouched.
 */

:root {
  --nm-ink: #182230;
  --nm-muted: #596273;
  --nm-blue: #1f55ce;
  --nm-orange: #a84d00;
  --nm-hero: #3c8bf9;
  --nm-hero-art: url('/h5/static/ui/ui-top-hero.20260916.svg');
}

.center-wrap,
.team-wrap:not(.box),
.upgrade-wrap,
.login-wrap,
.money-wrap,
.auth-wrap {
  color: var(--nm-ink);
  background-color: #f5f7fb;
}

/* Crisp vector hero replaces the 750x176 bitmap stretched over tall panels. */
.center-wrap > .center-top,
.money-wrap > .money-top,
.login-wrap > .login-top {
  background-color: var(--nm-hero) !important;
  background-image: var(--nm-hero-art) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: cover !important;
  box-shadow: inset 0 0 0 999px rgba(7, 25, 65, .12) !important;
}

.center-wrap > .center-top .middle .nick,
.center-wrap > .center-top .middle .id,
.login-wrap > .login-top .hi,
.login-wrap > .login-top .title {
  color: #fff !important;
  text-shadow: 0 1px 3px rgba(4, 20, 53, .72) !important;
}

.center-wrap > .center-top .center-t-bottom {
  background-color: #fff4dc !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: cover !important;
}

.center-wrap > .center-top .center-t-bottom .middle .title,
.center-wrap > .center-top .center-t-bottom .middle .desc,
.center-wrap > .center-top .center-t-bottom .btn {
  color: #5f390d !important;
}

.center-wrap > .center-top .center-t-bottom .btn {
  border-color: #9a6a2c !important;
  background: rgba(255, 255, 255, .82) !important;
}

.center-wrap .center-bottom .balance-wrap .balance-bottom > uni-view .title,
.center-wrap .center-bottom .team-wrap .team-bottom uni-view,
.team-wrap:not(.box) .team-bottom .list-box .time,
.team-wrap:not(.box) .c_con_ts .c_con_ts_l,
.team-wrap:not(.box) .c_con_ts_r,
.team-wrap:not(.box) .levels,
.team-wrap:not(.box) .money-bottom .list-wrap .list-box .left .time,
.money-wrap .money-bottom .list-wrap .list-box .left .time {
  color: var(--nm-muted) !important;
}

.center-wrap .center-bottom .buttons .left-button,
.money-wrap .money-top .money-data .buttons .left-button {
  color: var(--nm-blue) !important;
  border-color: var(--nm-blue) !important;
  background: #fff !important;
  font-weight: 600 !important;
}

.center-wrap .center-bottom .buttons .right-button,
.money-wrap .money-top .money-data .buttons .right-button {
  color: #fff !important;
  border-color: var(--nm-blue) !important;
  background: var(--nm-blue) !important;
  font-weight: 600 !important;
}

.center-wrap .concat-wrap .btn {
  color: #fff !important;
  background: linear-gradient(180deg, #2f5fca, #244fbd) !important;
}

.center-wrap .balance-wrap:not(.gg-wrap) .balance-bottom > uni-view:nth-child(-n+2) .number,
.center-wrap .gg-wrap .balance-bottom > uni-view:nth-child(1) .number,
.center-wrap .gg-wrap .balance-bottom > uni-view:nth-child(3) .number,
.team-wrap:not(.box) .money-bottom .list-box .right {
  color: var(--nm-orange) !important;
}

/* Team: preserve the high-resolution artwork and stabilise text contrast. */
.team-wrap:not(.box) > .team-top {
  background-color: #326fe0 !important;
  background-repeat: no-repeat !important;
  background-position: center top !important;
  background-size: cover !important;
  box-shadow: inset 0 0 0 999px rgba(6, 24, 61, .10) !important;
}

.team-wrap:not(.box) > .team-top .tabs-wrap > uni-view .title {
  color: rgba(255, 255, 255, .94) !important;
  text-shadow: 0 1px 3px rgba(4, 20, 53, .72) !important;
}

.team-wrap:not(.box) > .team-top .tabs-wrap > uni-view.active .title {
  color: #fff !important;
}

.team-wrap:not(.box) > .team-top .team-t-bottom {
  background-color: #fff !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: cover !important;
}

.team-wrap:not(.box) .team-t-b-top .title,
.team-wrap:not(.box) .team-t-b-top .number,
.team-wrap:not(.box) .team-t-b-bottom > uni-view,
.team-wrap:not(.box) .team-t-b-bottom > uni-view uni-text,
.team-wrap:not(.box) .team-t-bottom-money .b-title,
.team-wrap:not(.box) .team-t-bottom-money .number {
  color: var(--nm-ink) !important;
  text-shadow: 0 1px 1px rgba(255, 255, 255, .92) !important;
}

.team-wrap:not(.box) .team-t-bottom-money > uni-view:nth-child(1) .number,
.team-wrap:not(.box) .team-t-bottom-money > uni-view:nth-child(3) .number {
  color: #a43f06 !important;
}

.team-wrap:not(.box) .team-bottom .list-box .level {
  color: #2458cf !important;
}

.team-wrap:not(.box) .search-wrap input::placeholder {
  color: #667085 !important;
  opacity: 1 !important;
}

/* Use the existing vector fallback only when the default raster avatar is shown. */
.team-wrap:not(.box) .c_con_t_l .u-image__image > div[style*='user9.png'] {
  background-image: url('/h5/static/images/user9.svg') !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}

/* VIP cards: the bitmaps are large enough; darken them for consistent white text. */
.upgrade-wrap > .upgrade-navbar {
  background-color: #5b58dc !important;
  background-repeat: no-repeat !important;
  background-position: center top !important;
  background-size: cover !important;
}

.upgrade-wrap > .upgrade-level {
  background-color: #5b63da !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: cover !important;
  border-radius: 12px;
  box-shadow: inset 0 0 0 999px rgba(9, 18, 45, .24) !important;
}

.upgrade-wrap > .upgrade-level .desc,
.upgrade-wrap > .upgrade-level .tips,
.upgrade-wrap > .upgrade-level .level,
.upgrade-wrap > .upgrade-level .bottom uni-view {
  color: #fff !important;
  text-shadow: 0 1px 3px rgba(9, 18, 45, .86) !important;
}

.upgrade-wrap .upgrade-top > .title,
.upgrade-wrap .upgrade-top .upgrade-rule > .left .top-right,
.upgrade-wrap .upgrade-top .upgrade-rule > .middle .top-right,
.upgrade-wrap .upgrade-top .upgrade-rule > .left .rate,
.upgrade-wrap .upgrade-top .upgrade-rule > .middle .rate,
.upgrade-wrap .upgrade-middle .upgrade-m-box .desc,
.upgrade-wrap .upgrade-bottom .upgrade-b-list .header uni-view,
.upgrade-wrap .upgrade-bottom .upgrade-b-list .list-box .left .title {
  color: var(--nm-muted) !important;
}

.upgrade-wrap .upgrade-top .upgrade-rule > .right {
  color: #4a2a00 !important;
  font-weight: 600 !important;
  text-shadow: none !important;
}

/* Login/registration inputs. */
.login-wrap .login-bottom .form-wrap .form-box {
  background: #f3f6fb !important;
  border: 1px solid #d7deea !important;
}

.login-wrap .u-input__input,
.login-wrap .u-input__input input {
  color: var(--nm-ink) !important;
  caret-color: var(--nm-blue) !important;
}

.login-wrap input::placeholder,
.login-wrap textarea::placeholder,
.login-wrap .u-input__input::placeholder {
  color: #667085 !important;
  opacity: 1 !important;
}

.login-wrap .uni-input-placeholder,
.auth-wrap .uni-input-placeholder,
.money-wrap .uni-input-placeholder,
.team-wrap:not(.box) .uni-input-placeholder {
  color: #667085 !important;
  opacity: 1 !important;
}

.login-wrap .u-tab-item {
  color: #4f5d70 !important;
}

.login-wrap .login-bottom .form-radio .text {
  color: #4f5866 !important;
}

.login-wrap .login-bottom .form-wrap .form-box .second-btn,
.login-wrap .login-bottom .bottom uni-text,
.login-wrap .login-bottom .form-radio .text uni-text {
  color: var(--nm-blue) !important;
}

.login-wrap .login-bottom .btn {
  color: #fff !important;
  background: var(--nm-blue) !important;
}

/* Authentication upload cards: remove the stretched 256x256 placeholder art. */
.auth-wrap[data-v-505c25b4] .slot-btn[data-v-505c25b4] {
  background-color: #f4f8ff !important;
  background-image:
    radial-gradient(circle at 82% 18%, rgba(76, 125, 239, .14) 0 38px, transparent 39px),
    linear-gradient(135deg, #fbfdff 0%, #edf4ff 100%) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: cover !important;
  border: 1px dashed #9fb2ce !important;
}

.auth-wrap[data-v-505c25b4] .slot-btn .text {
  color: #475569 !important;
  font-weight: 600 !important;
  text-shadow: 0 1px 0 #fff !important;
}

.auth-wrap[data-v-505c25b4] input::placeholder {
  color: #667085 !important;
  opacity: 1 !important;
}

/* Settings: retain the existing icons while restoring visible contrast. */
.set-wrap > .box:not(.first-box) .u-image__image {
  filter: brightness(0) saturate(100%) invert(38%) sepia(93%) saturate(1700%) hue-rotate(205deg) brightness(94%) contrast(92%) !important;
  opacity: .95 !important;
}

.set-wrap .uicon-arrow-right {
  color: #7b8798 !important;
}

.set-wrap .language,
.set-wrap .lou-out {
  color: var(--nm-muted) !important;
}

.set-wrap .lou-out {
  font-weight: 500 !important;
}

/* Playback/share page: rebuild malformed generated assets with scalable styling. */
.con7[data-v-287a0749] {
  background-color: #8d1326 !important;
  background-image:
    radial-gradient(circle at 50% 7%, rgba(255, 226, 143, .38), transparent 28%),
    radial-gradient(circle at 12% 76%, rgba(255, 255, 255, .08) 0 34px, transparent 35px),
    linear-gradient(155deg, #d93b42 0%, #9f172d 54%, #6e0b21 100%) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 100% 100% !important;
  border: 1px solid rgba(255, 226, 143, .55) !important;
  box-shadow: 0 16px 38px rgba(44, 5, 16, .34), inset 0 0 36px rgba(67, 3, 17, .28) !important;
}

.con7[data-v-287a0749] .con7_t,
.con7[data-v-287a0749] .con7_c,
.con7[data-v-287a0749] .con7_b {
  color: #fff7d9 !important;
  text-shadow: 0 2px 4px rgba(48, 3, 12, .82) !important;
}

.shares_c_bs[data-v-287a0749]:nth-child(4) .u-image__image > div {
  background-color: #0b0f18 !important;
  background-image: url('/h5/static/ui/app-store.20260916.svg') !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 100% 100% !important;
}

.shares_c_bs[data-v-287a0749]:nth-child(5) .u-image__image > div {
  background-color: #0b0f18 !important;
  background-image: url('/h5/static/ui/google-play.20260916.svg') !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 100% 100% !important;
}

.userAvatar[data-v-287a0749] .u-image__image > div {
  background-image: url('/h5/static/images/user10.svg') !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: cover !important;
}

/* Ranking badge: replace the square trophy artwork cropped into a thin strip. */
.profit-wrap[data-v-80241afc] .amount[data-v-80241afc] {
  color: #fff !important;
  background-color: #7b2cbf !important;
  background-image: linear-gradient(100deg, #4f46e5 0%, #7c3aed 52%, #b938c7 100%) !important;
  background-repeat: no-repeat !important;
  background-size: 100% 100% !important;
  border-radius: 999px !important;
  box-shadow: 0 5px 14px rgba(79, 70, 229, .24) !important;
  text-shadow: 0 1px 2px rgba(28, 18, 74, .58) !important;
}

/* Ranking poster fallback is shown only for records whose remote cover fails. */
.profit-wrap[data-v-80241afc] .list-inner > .u-image .u-image__error {
  color: transparent !important;
  background-color: #315fcd !important;
  background-image: url('/h5/static/ui/video-poster-fallback.20260916.svg') !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}

.profit-wrap[data-v-80241afc] .list-inner > .u-image .u-image__error .u-icon {
  display: none !important;
}

/* Revenue banner: keep the large source image and add a non-blocking dark reading layer. */
.con[data-v-1e2bdd98] > .con1[data-v-1e2bdd98] {
  background-color: #334155 !important;
  background-blend-mode: multiply !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  box-shadow: inset 0 0 0 999px rgba(15, 23, 42, .20) !important;
}

.con[data-v-1e2bdd98] > .con1 .con1_l_t,
.con[data-v-1e2bdd98] > .con1 .con1_l_b,
.con[data-v-1e2bdd98] > .con1 .con1_r_t {
  color: #fff !important;
  text-shadow: 0 1px 3px rgba(15, 23, 42, .78) !important;
}

/* Ranking tabs sit on a pale illustrated banner; dark labels remain legible. */
body.pages-billboard-index .billboard-top .u-tabs-item {
  color: #43516a !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, .92) !important;
}

body.pages-billboard-index .billboard-top .u-tabs-item[style*='font-weight: bold'],
body.pages-billboard-index .billboard-top .u-tabs-item[style*='font-weight:bold'],
body.pages-billboard-index .billboard-top .u-tabs-item[style*='font-weight: 700'],
body.pages-billboard-index .billboard-top .u-tabs-item[style*='font-weight:700'] {
  color: var(--nm-blue) !important;
  font-weight: 700 !important;
}

body.pages-billboard-index .billboard-top .u-scroll-bar {
  background-color: var(--nm-blue) !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, .72) !important;
}

/* The platform image URLs can be absent in older records; keep crisp local fallbacks. */
body.pages-extension-extension .con3 .con3_i_t {
  margin-inline: auto !important;
}

body.pages-extension-extension .con3 > .con3_i > .con3_i_t .u-image__error {
  color: transparent !important;
  background-color: #fff !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: 78% auto !important;
  border: 1px solid rgba(15, 23, 42, .08) !important;
  border-radius: 10px !important;
  box-sizing: border-box !important;
  pointer-events: none !important;
}

body.pages-extension-extension .con3 > .con3_i > .con3_i_t .u-image__error .u-icon {
  display: none !important;
}

body.pages-extension-extension .con3 > .con3_i:nth-child(1) > .con3_i_t .u-image__error {
  background-image: url('/h5/static/ui/platform-tiktok.20260916.svg') !important;
}

body.pages-extension-extension .con3 > .con3_i:nth-child(2) > .con3_i_t .u-image__error {
  background-image: url('/h5/static/ui/platform-facebook.20260916.svg') !important;
}

body.pages-extension-extension .con3 > .con3_i:nth-child(3) > .con3_i_t .u-image__error {
  background-image: url('/h5/static/ui/platform-instagram.20260916.svg') !important;
}

body.pages-extension-extension .con3 > .con3_i:nth-child(4) > .con3_i_t .u-image__error {
  background-image: url('/h5/static/ui/platform-google.20260916.svg') !important;
}

body.pages-extension-extension .con3 > .con3_i:nth-child(5) > .con3_i_t .u-image__error {
  background-image: url('/h5/static/ui/platform-youtube.20260916.svg') !important;
  background-size: 84% auto !important;
}

body.pages-extension-extension .con3 > .con3_i > .con3_i_b {
  color: #2b3545 !important;
  font-size: clamp(10.5px, 3vw, 12px) !important;
  line-height: 1.35 !important;
  letter-spacing: -.15px !important;
  text-align: center !important;
  white-space: nowrap !important;
}

/* Rich-text notices and revenue notes must not inherit low-contrast source colors. */
body.pages-index-index .con2_c font[color='#6badde'],
body.pages-index-index .con2_c font[color='#6BADDE'] {
  color: #2f638b !important;
}

body.pagesA-translationincome-translationincome .con4_b {
  color: var(--nm-muted) !important;
}

/* App logo fallback is visible only when the configured share logo fails. */
.shares_c_t[data-v-287a0749] {
  background-image: url('/h5/static/ui/app-logo.20260916.svg') !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  border-radius: 14px !important;
  box-shadow: 0 8px 24px rgba(20, 66, 145, .26) !important;
}

.shares_c_t[data-v-287a0749] .u-image__error {
  display: none !important;
}

/* Keep transparent SVG/PNG artwork transparent after it has loaded. */
.center-wrap .u-image__image,
.team-wrap:not(.box) .u-image__image,
.upgrade-wrap .u-image__image {
  background-color: transparent !important;
}

.center-wrap .balance-top .u-image__image > div,
.center-wrap .team-top .u-image__image > div,
.center-wrap .menu-box .u-image__image > div,
.team-wrap:not(.box) .team-t-b-top .u-image__image > div,
.upgrade-wrap .icon .u-image__image > div,
.upgrade-wrap .upgrade-m-box .u-image__image > div,
.upgrade-wrap .upgrade-b-list .left .u-image__image > div {
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
}

.center-wrap .u-avatar__img > div,
.team-wrap:not(.box) .c_con_t_l .u-image__image > div {
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: cover !important;
}

.center-wrap uni-image > img,
.team-wrap:not(.box) uni-image > img,
.upgrade-wrap uni-image > img {
  image-rendering: auto !important;
}

.center-wrap .u-image__loading,
.center-wrap .u-image__error,
.team-wrap:not(.box) .u-image__loading,
.team-wrap:not(.box) .u-image__error,
.upgrade-wrap .u-image__loading,
.upgrade-wrap .u-image__error {
  color: #667085 !important;
  background: linear-gradient(135deg, #f7f9fc, #e7ecf4) !important;
}

@media (prefers-reduced-motion: reduce) {
  .center-wrap *,
  .team-wrap:not(.box) *,
  .upgrade-wrap *,
  .login-wrap *,
  .money-wrap *,
  .auth-wrap * {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}
