
/* Original layout: static/css/common.css */
:root {
  --c-accent: #4fc3ff;     
  --c-accent-deep: #2f6bff;   
  --c-text: #ffffff;
  --c-text-dim: rgba(255, 255, 255, 0.9);
  --c-muted: rgba(255, 255, 255, 0.42);
  --c-row: rgba(9, 20, 48, 0.55);
  --c-row-border: rgba(34, 211, 238, 0.4);  
  --c-err: #ff6b81;
  --radius: 10px;
  /* 系统默认字体：手机端自动使用系统默认（iOS 苹方 / Android 系统字体），桌面端中文回退微软雅黑 */
  --font-body: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", sans-serif;
  --font-display: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", sans-serif;
}

* { box-sizing: border-box; }

html, body { margin: 0; padding: 0;}

body {
  font-family: var(--font-body);
  color: var(--c-text);
  background: #071233;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

img {
  display: block;
  border: 0;
}

button {
  font-family: inherit;
  cursor: pointer;
}
a{text-decoration:none;}
.bottom-nav {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 50;
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding: 8px 0 calc(8px + env(safe-area-inset-bottom));
  border-top: 1px solid rgba(63, 115, 248, 0.3);
}
.bottom-nav::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(6, 17, 40, 0.97);
  z-index: -1;
}
.nav-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: 2px;
  width: 64px;
  padding: 32px 0 2px;
  border: 0;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center 4px;
  background-size: 26px 26px;
  color: rgba(255, 255, 255, 1);
  font-size: 14px;
  font-weight: bold;
  letter-spacing: 0.5px;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
  transition: color 0.15s ease;
}
/* 底部导航图标一律用 CSS background，页面不放 img */
.nav-item.home    { background-image: url("../images/bottom-btn1.svg"); }
.nav-item.home.active    { background-image: url("../images/bottom-btn1-hover.svg"); }
.nav-item.service { background-image: url("../images/bottom-btn2.svg"); }
.nav-item.order   { background-image: url("../images/bottom-btn3.svg"); }
.nav-item.order.active { background-image: url("../images/bottom-btn3-hover.svg"); }
.nav-item.assets  { background-image: url("../images/bottom-btn4.svg"); }
.nav-item.profile { background-image: url("../images/bottom-btn5.svg"); }
.nav-item.profile.active { background-image: url("../images/bottom-btn5-hover.svg"); }
.nav-item:active { opacity: 0.75; }
.nav-item.active {
  color: #4fc3ff;
}

.back-btn {
  position: absolute;
  top: 10px;
  left: 0px;
  z-index: 40;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  cursor: pointer;
  background: none;
  border: 0;
}
.back-btn:hover { background: rgba(8, 18, 46, 0.8); }
.back-btn:active { transform: scale(0.94); }
.back-btn img { width: 13px; height: 22px; }
.top {
  max-width: 560px;
  margin: 0 auto;
  padding: 26px 20px 0;
  text-align: center;
}
.top-logo {
  width: 180px;
  margin: 0 auto 10px 30px;
  mix-blend-mode: screen;
}

/* Toast */
.toast {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.9);
  background: rgba(9, 27, 61, 0.85);
  border: 1px solid rgba(0, 229, 255, 0.4);
  border-radius: 12px;
  padding: 14px 24px;
  color: #fff;
  font-size: 14px;
  z-index: 9999;
  opacity: 0;
  transition: 0.3s;
  pointer-events: none;
  box-shadow: 0 0 20px rgba(0, 229, 255, 0.3);
}
.toast.show {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

@media (max-width: 420px) {}

.page-bg {
  position: absolute;
  inset: 0;
  z-index: -1;
}
/* ======================================================================
   GPone · Reference White / Blue — visual layer only
   Existing sections, grids, document order, controls and JS stay in place.
   Decorative line work is not a quotation, performance promise or live feed.
   ====================================================================== */
:root {
  color-scheme: light;
  --c-accent: #0965e8;
  --c-accent-deep: #094cc8;
  --c-text: #1b2c46;
  --c-text-dim: #52657d;
  --c-muted: #798a9f;
  --c-row: #f7faff;
  --c-row-border: #dce6f3;
  --c-err: #bd4f60;
  --radius: 11px;
  --ref-page: #f2f6fb;
  --ref-ink: #1b2c46;
  --ref-muted: #697e96;
  --ref-line: #dfeaf7;
  --ref-soft: #eef5ff;
  --ref-blue: #0965e8;
  --ref-deep: #064bcc;
  --ref-surface: linear-gradient(155deg, #ffffff 28%, #fcfdff 68%, #f3f8ff 100%);
  --ref-button: linear-gradient(130deg, #27b4fa 0%, #0784f7 30%, #0863ed 66%, #0745d8 100%);
  --ref-icon: radial-gradient(ellipse at 18% 0%, rgba(193,245,255,.83), transparent 40%), linear-gradient(145deg, #26bdf9 0%, #088bf8 33%, #0861ea 72%, #0646d7 100%);
  --ref-shadow: 0 7px 16px -10px rgba(38,103,173,.30), 0 2px 4px rgba(74,127,181,.045), inset 0 1px 0 rgba(255,255,255,.98);
  --ref-button-shadow: inset 0 1px 1px rgba(239,251,255,.90), inset 0 -2px 4px rgba(4,54,166,.22), 0 6px 12px -5px rgba(13,104,227,.35);
  --ref-icon-shadow: inset 0 1px 2px rgba(239,254,255,.95), inset 1px 0 2px rgba(190,227,255,.55), inset 0 -2px 4px rgba(3,64,182,.3), 0 6px 11px -5px rgba(12,105,234,.44);
  --ref-blue-filter: brightness(0) saturate(100%) invert(29%) sepia(88%) saturate(2819%) hue-rotate(211deg) brightness(96%) contrast(98%);
  --ref-gray-filter: brightness(0) saturate(100%) invert(50%) sepia(19%) saturate(625%) hue-rotate(175deg) brightness(93%) contrast(87%);
  --ref-finance: url("../images/data_2007f150ba26.svg");
  --ref-wave: url("../images/data_ce81e5638af1.svg");
}
html { background: var(--ref-page); }
body, body.bg1 {
  color: var(--ref-ink);
  background: radial-gradient(ellipse 480px 300px at 73% 0%, #dceeff 0%, transparent 80%),
    linear-gradient(180deg,#edf5ff 0px,#f4f7fb 560px,#f1f6fc 100%);
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: rgba(20,112,233,.08);
}
.page-bg, .welcome-bg {
  background: var(--ref-wave) center top / 100% 170px no-repeat,
    radial-gradient(ellipse 480px 300px at 75% 0%,#dcebff 0%,transparent 76%),
    linear-gradient(180deg,#edf5ff 0px,#f4f7fb 560px,#f1f6fc 100%);
}
.page-bg::after, .welcome-bg::after { background: transparent; }
button, input, select, textarea { font-family: var(--font-body); }
input, textarea { caret-color: var(--ref-blue); }
::selection { background: #d2e7ff; color: #164281; }
:focus-visible { outline: none; }

/* Brand header: light sky, modest financial line work, original mark. */
.home-top, .top {
  position: relative;
  isolation: isolate;
  background: var(--ref-wave) center / 100% 100% no-repeat,
    linear-gradient(115deg,rgba(250,253,255,.76),rgba(227,241,255,.3) 52%,rgba(211,233,254,.65));
}
.home-top::after, .top::after {
  content: "";
  position: absolute;
  pointer-events: none;
  background: var(--ref-finance) center / contain no-repeat;
  z-index: -1;
}
.home-top::after { right: 67px; bottom: -1px; width: calc(100% - 198px); max-width: 264px; height: 53px; }
.top::after { right: 16px; bottom: 1px; width: calc(100% - 252px); max-width: 225px; height: 57px; opacity: .85; }
.home-logo, .top-logo, .brand-mark {
  mix-blend-mode: normal;
  filter: invert(1) hue-rotate(190deg) saturate(1.15) brightness(.87);
}
.home-logo-link { position: relative; }
.msg-link {
  background: linear-gradient(145deg,#ffffff 20%,#edf5ff 100%);
  border-color: #edf6ff;
  box-shadow: inset 0 1px 2px #fff, 0 5px 12px -5px rgba(32,102,180,.23);
}
.msg-link img { filter: var(--ref-blue-filter); }
.msg-link:active { background: #e7f1ff; }
.back-btn {
  background: linear-gradient(145deg,rgba(255,255,255,.95),rgba(234,244,255,.88));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.98), 0 3px 10px -7px rgba(30,88,153,.25);
}
.back-btn img { filter: var(--ref-blue-filter); }
.back-btn:hover { background: #edf5ff; }
.brand { position: relative; isolation: isolate; }
.brand::before {
  content: ""; position: absolute; inset: -22px -6px -20px;
  z-index: -1; pointer-events: none;
  border-radius: 22px;
  background: var(--ref-wave) center / cover no-repeat,
    linear-gradient(115deg,rgba(255,255,255,.94),rgba(229,242,255,.78));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.98),0 9px 24px -23px rgba(25,82,160,.40);
}
.brand::after {
  content: ""; position: absolute; inset: -17px -2px -14px;
  z-index: -1; pointer-events: none;
  background: var(--ref-finance) right center / 126px 62px no-repeat;
  opacity: .23;
}

/* Paper-white main surfaces and pale silver-blue recessed surfaces. */
.card, .home-card, .mkt-card, .svc-item, .order-item, .detail-card,
.menu-card, .reg-card, .main-card, .task-card, .vip-card, .reward-table,
.lang-card, .faq-card, .form-card, .cal-card, .rule-card, .news-panel,
.more-cats, .bal-card {
  background: var(--ref-surface);
  border-color: var(--ref-line);
  border-radius: 19px;
  box-shadow: var(--ref-shadow);
}
.card::before, .home-card::before, .mkt-card::before, .svc-item::before,
.order-item::before, .detail-card::before, .menu-card::before, .reg-card::before,
.main-card::before, .task-card::before, .vip-card::before, .reward-table::before,
.faq-card::before, .form-card::before, .cal-card::before, .rule-card::before {
  background: transparent;
  box-shadow: none;
}
.carousel-card { border-color: #d0e4fd; border-radius: 20px; box-shadow: 0 8px 18px -11px rgba(12,83,167,.55); }
.carousel-card::before { background: transparent; }
.carousel-dots .dot { background: rgba(255,255,255,.42); box-shadow: 0 1px 2px rgba(7,25,65,.2); }
.carousel-dots .dot.active { background: #fff; }
.market-item, .mkt-item, .earn-item {
  background: linear-gradient(135deg,#f3f8ff,#edf4fc);
  border-color: #e1ecfc;
  border-radius: 13px;
  box-shadow: inset 0 1px 0 #fff;
}
.market-item:active, .mkt-item:active { background: #e9f2ff; }
.sec-title, .svc-name, .oi-name, .card-title, .detail-title, .task-title,
.faq-title, .entry-name, .card-h, .section-title { color: #192d49; font-weight: 700; }
.mk-name, .mkt-pair, .row-sym { color: #1b2d47; }
.mk-name span, .mkt-pair span, .row-sym span { color: #798da7; }
.mk-price, .mkt-price, .col-price, .detail-value, .split-value, .svc-value,
.oi-num, .oi-val, .bal-num, .earn-num, .info-value, .detail-val {
  color: #182e4a;
  font-variant-numeric: tabular-nums;
}
.mk-price, .mkt-price, .svc-value, .oi-num { font-weight: 750; }
.more-link {
  color: #0964db;
  background: linear-gradient(120deg,#eef9ff,#e9f1ff);
  border-radius: 8px;
  box-shadow: 0 0 0 4px #eef5ff;
}
.more-arrow, .menu-arrow, .news-arrow img, .entry-arrow img,
.coin-arrow, .sel-arrow, .caret, .faq-toggle img,
.cal-nav img, .page-btn img { filter: var(--ref-blue-filter); }
.more-link:active { color: #084fbf; }
.sec-icon, .card-title > img, .card-ic, .title-ic, .title-ic1,
.label-icon, .label-icontitle, .label-icon2, .section-title > img,
.credit-right-title img, .credit-note img, .feature-item img,
.switch-left img, .ov-ic { filter: var(--ref-blue-filter); }

/* Same shortcut grid; white tiles with bright sculpted blue controls. */
.home-page > .home-card:nth-of-type(3) {
  background: transparent; border-color: transparent; box-shadow: none;
}
.home-page > .home-card:nth-of-type(3)::before { background: transparent; box-shadow: none; }
.func-box {
  background: linear-gradient(150deg,#fff 32%,#fbfdff 67%,#edf5ff);
  border-color: #e0ecfb;
  border-radius: 16px;
  box-shadow: inset 0 1px 1px #fff,0 6px 12px -9px rgba(43,113,190,.38),0 1px 2px rgba(50,111,190,.04);
  transition: background .18s ease,box-shadow .18s ease,transform .15s ease;
}
.func-icon-bg {
  background: var(--ref-icon);
  border-color: rgba(101,192,255,.52);
  border-radius: 15px;
  box-shadow: var(--ref-icon-shadow);
}
.func-icon-bg::after {
  inset: 1px;
  background: linear-gradient(145deg,rgba(255,255,255,.26),transparent 36%,transparent 78%,rgba(58,159,255,.12));
  box-shadow: inset 0 1px 1px rgba(255,255,255,.55);
}
.func-icon { filter: brightness(0) invert(1) drop-shadow(0 1px 1px rgba(0,51,142,.16)); }
.func-row:first-child .func-box:nth-child(2) .func-icon-bg {
  background: radial-gradient(ellipse at 18% 0%,rgba(173,230,255,.9),transparent 40%),linear-gradient(145deg,#3aaaff,#0878f9 44%,#0645dc);
}
.func-row:last-child .func-icon-bg {
  background: radial-gradient(ellipse at 18% 0%,rgba(217,236,255,.85),transparent 43%),linear-gradient(145deg,#79b0fc,#377fed 40%,#185ae4 74%,#244dd8);
}
.func-name { color: #1a2e49; font-weight: 700; letter-spacing: .25px; }
.func-box:active { background: #eef5ff; box-shadow: inset 0 2px 5px rgba(65,127,204,.08); }
.news-title { color: #243a55; }
.news-subtitle, .news-sub, .news-date { color: #778ba4; }
.news-tag, .detail-tag { background: #eaf3ff; color: #346cb6; border-color: #dceafd; }
.news-arrow, .entry-arrow {
  background: linear-gradient(145deg,#fff,#e7f2ff);
  border-color: #d4e5ff;
  box-shadow: inset 0 1px 0 #fff,0 2px 4px rgba(43,104,177,.06);
  opacity: 1;
}
.news-icon { border-color: #e1ebf8; box-shadow: none; }
.news-thumb { border-color: #e2eaf5; }
.news-item { border-top-color: #eaf0f7; }
.news-item:active { background: #f2f7ff; }
.home-page .news-tab { background: none; color: #6a7e97; box-shadow: none; }
.home-page .news-tab.active { background: none; color: #0961df; }
.home-page .news-tab.active::after { background: linear-gradient(90deg,#09a8fb,#0754e9); }
.news-date {
  background-image: url("../images/data_b70ea35947e1.svg");
}

/* Layered fixed bottom navigation. No change to position, item size or order. */
.bottom-nav {
  isolation: isolate;
  background: linear-gradient(140deg,rgba(255,255,255,.97),rgba(236,245,255,.97));
  border-top-color: #fff;
  border-radius: 23px 23px 0 0;
  box-shadow: 0 -5px 22px -12px rgba(41,104,174,.32),inset 0 0 0 1px rgba(224,237,252,.88);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
.bottom-nav::before {
  background: linear-gradient(130deg,rgba(255,255,255,.94),rgba(237,245,255,.93));
  border-radius: inherit;
  box-shadow: inset 0 1px 0 #fff;
}
.bottom-nav .nav-item {
  position: relative;
  isolation: isolate;
  background-image: none;
  color: #7b91ad;
  font-weight: 550;
  letter-spacing: .15px;
  transition: color .18s ease;
}
.nav-item::before {
  content: ""; position: absolute; pointer-events: none;
  top: -3px; left: 5px; right: 5px; height: 35px;
  border-radius: 13px;
  background: transparent;
  z-index: -1;
  transition: box-shadow .18s ease,background .18s ease;
}
.nav-item::after {
  content: ""; position: absolute; pointer-events: none;
  top: 3px; left: calc(50% - 13px); width: 26px; height: 26px;
  background: transparent;
  background-image: var(--nav-symbol);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}/**
.bottom-nav .nav-item.active { color: #0755da; font-weight: 750; }

.nav-item.active::after {
  background-image: var(--nav-symbol-active);
}
**/
/* Service tab: larger circular badge in the middle. */
.bottom-nav .nav-item.service {
  width: 78px;
}
.bottom-nav .nav-item.service::before {
  top: -24px;
  left: 50%;
  right: auto;
  width: 50px;
  height: 50px;
  transform: translateX(-50%);
  border-radius: 50%;background: var(--ref-icon); box-shadow: var(--ref-icon-shadow);
}
.bottom-nav .nav-item.service::after {
  top: -14px;background-image: var(--nav-symbol-active); 
  left: 50%;
  width: 32px;
  height: 32px;
  transform: translateX(-50%);
}

/* Buttons keep every original disabled state, trigger, size and hit area. */
.submit-btn, .confirm-btn, .apply-btn, .sign-btn, .open-btn,
.modal-confirm, .svc-btn.primary, .claim-btn, .task-btn.claim,
.coupon-btn, .welcome-btn, .code-btn, .modal-btn {
  color: #fff;
  background: var(--ref-button);
  box-shadow: var(--ref-button-shadow);
  border-color: rgba(27,132,248,.18);
  border-radius: 13px;
  text-shadow: 0 1px 1px rgba(0,49,137,.14);
  font-weight: 650;
  transition: box-shadow .18s ease,filter .18s ease,transform .12s ease;
}
.modal-btn.confirm { background: var(--ref-button); color: #fff; box-shadow: var(--ref-button-shadow); }
.modal-btn.cancel {
  background: linear-gradient(145deg,#f8fbff,#e7eff9);
  color: #526b8a;
  border-color: #e0e9f5;
  box-shadow: inset 0 1px 0 #fff;
  text-shadow: none;
}
#logoutMask .modal-btn.confirm {
  background: linear-gradient(135deg,#cb8c94,#bd6875); color: #fff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.55),0 5px 10px -6px rgba(149,67,86,.4);
}
.svc-btn.disabled, .task-btn.nofit, .coupon-btn.disabled,
button:disabled, .code-btn:disabled, .get-code:disabled {
  color: #8291a5 !important;
  background: #e9eff6 !important;
  border-color: #dfe6ef !important;
  box-shadow: inset 0 1px 0 #f8fafc !important;
  text-shadow: none !important;
  filter: none !important;
}
.float-service {
  background: var(--ref-icon); border-color: #e4f2ff;
  box-shadow: var(--ref-icon-shadow);
}
.float-service img { filter: brightness(0) invert(1); }

/* Segmented controls and selection states. */
.svc-tabs, .order-tabs, .task-tabs, .vip-tabs, .news-page .news-tabs,
.coupon-page .tab-row, .tab-bar {
  background: linear-gradient(180deg,#f8fbff,#ebf2fb);
  border-color: #dce7f6;
  box-shadow: inset 0 1px 0 #fff,0 3px 10px -9px rgba(53,100,163,.30);
}
.svc-tab, .order-tab, .task-tab, .vip-tab, .news-page .news-tab,
.coupon-page .tab-btn, .records-page .tab-btn { color: #647993; }
.svc-tab.active, .order-tab.active, .task-tab.active, .vip-tab.active,
.news-page .news-tab.active, .coupon-page .tab-btn.active,
.records-page .tab-btn.active {
  background: var(--ref-button);
  color: #fff;
  border-color: #438df1;
  box-shadow: var(--ref-button-shadow);
  font-weight: 650;
}
.svc-tab-icon { filter: var(--ref-blue-filter); }
.svc-tab.active .svc-tab-icon { filter: brightness(0) invert(1); }
.mkt-tab, .m-tab, .time-btn, .cat-btn, .period-btn, .more-btn, .page-btn, .cal-nav {
  background: linear-gradient(145deg,#ffffff,#edf4fe);
  border-color: #dce7f6;
  color: #516f94;
  box-shadow: inset 0 1px 0 #fff;
}
.mkt-tab.active, .m-tab.active, .time-btn.active, .cat-btn.active, .period-btn.active {
  color: #fff;
  background: var(--ref-button);
  border-color: #4a96f2;
  box-shadow: var(--ref-button-shadow);
}
.period-btn::before { background: transparent; box-shadow: none; }
.loan-page .tab-btn { color: #74879e; }
.loan-page .tab-btn.active { color: #095dd8; }
.loan-page .tab-btn.active::after { background: #1c7bf0; }
.list-head, .rec-head, .m-head, .rt-head {
  color: #71859e;
  background: #f2f7fd;
  border-bottom-color: #e2ebf7;
}
.m-head span, .rec-head span { color: #73859e; }
.rt-head .rt-c { color: #41678e; }
.list-row, .rec-row, .m-row, .rt-row, .info-row, .detail-row, .repay-item { border-bottom-color: #e7edf6; }
.up1 { color: #238b74; background: #e7f4ef; }
.down1 { color: #b15565; background: #f9edef; }

/* Forms: inset pale fields, readable labels, high-contrast focus. */
.reg-card { border-radius: 23px; }
.row, .input-wrap, .amount-box, .amount-row, .search-bar,
.kuang, .sel-val, .coin-select-wrap, .info-row1, .sec-input {
  background: linear-gradient(180deg,#f5f9ff,#fafcff);
  border-color: #dbe6f3;
  box-shadow: inset 0 1px 3px rgba(46,88,146,.035),0 1px 0 rgba(255,255,255,.85);
}
.row::before, .amount-row::before { background: transparent; box-shadow: none; }

.row.has-err { border-color: #ce8090; box-shadow: 0 0 0 3px rgba(190,91,110,.10); }
.row-input, .form-input, .input-readonly, .input-prefix, .input,
.amount-input, .search-input, input.field, .sec-input, .code-picker,
.coin-val, .sel-val, .sel-opt, .coin-opt, .code-menu button { color: #283d58; }
input::placeholder, textarea::placeholder { color: #8495ab; }
.input-ic::after, .code-picker::after { background: #dce6f2; }
.row-icon, .input-ic img, .eye-btn img, .scan-btn img,
.search-icon, .upload-ic img { filter: var(--ref-gray-filter); }
.code-menu, .sel-dropdown, .coin-dropdown {
  background: #ffffff;
  border-color: #dbe6f4;
  box-shadow: 0 16px 32px -12px rgba(34,76,132,.25),0 2px 4px rgba(20,66,131,.05);
}
.code-menu button:hover, .code-menu button:focus-visible, .sel-opt:hover, .coin-opt:hover { background: #edf5ff; }
.code-menu .cn { color: #74859a; }
.code-search {
  background: #ffffff;
}
.code-search input {
  border-color: #dbe6f3;
  background: #f5f9ff;
  color: #283d58;
}
.code-search input::placeholder { color: #8495ab; }

.get-code, .amount-all, .all-btn { color: #0864d9; background: #edf4ff; text-shadow: none; }
.get-code { border-left-color: #dce6f4; }
.get-code:hover:not(:disabled) { color: #0750b8; }
.captcha { border-left-color: #dbe7f7; background: linear-gradient(140deg,#e7f6ff,#dceaff); }
.captcha .cap-char { color: #1456b2; text-shadow: none; }
.captcha .cap-hint { background: rgba(222,236,255,.93); color: #42618c; }
.login-links a, .login-link a { color: #145fc8; }
.login-link { color: #698099; }
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  -webkit-text-fill-color: #233b58;
  -webkit-box-shadow: 0 0 0 1000px #f3f8ff inset;
  caret-color: #0965e8;
}
select option { background: #fff; color: #263d59; }
.upload-box { background: linear-gradient(145deg,#fafcff,#edf5ff); border-color: #b9d3f1; }
.upload-ic { background: #e6f0ff; }
.corner { border-color: #78a7e0; }
.form-label, .field-label { color: #3b526e; }
.amount-unit { color: #1567ce; }
.line, .line2, .bal-div, .card-line, .section-line { background: #e2eaf5; }

/* Profile and balances: light financial panels, no dark neon blocks. */
.user-banner, .total-card {
  background: var(--ref-finance) right center / auto 104% no-repeat,
    linear-gradient(125deg,#ffffff 0%,#edf5ff 51%,#ddeeff 100%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.95),0 7px 16px -12px rgba(51,112,185,.4);
}
.total-title, .user-email { color: #243c5d; }
.total-num { color: #0960d8; font-variant-numeric: tabular-nums; }
.user-id-row { color: #6b819e; }
.avatar { mix-blend-mode: normal; border-color: rgba(255,255,255,.94); box-shadow: 0 3px 8px -4px rgba(40,105,190,.22); }
.menu-item + .menu-item { border-top-color: #eaf0f7; }
.menu-item:active { background: #edf5ff; }
.menu-label { color: #263e5d; font-weight: 550; }
.menu-value { color: #7b8ea6; }
.logout-row .menu-label { color: #657a95; }
.menu-icon {
  background: var(--ref-icon);
  border-color: rgba(108,187,252,.5);
  box-shadow: var(--ref-icon-shadow);
  border-radius: 13px;
}
.menu-icon img { filter: brightness(0) invert(1); }
.menu-icon.icon-green, .menu-icon.icon-cyan, .menu-icon.icon-sky {
  background: radial-gradient(ellipse at 18% 0%,rgba(202,245,255,.9),transparent 40%),linear-gradient(145deg,#52b9e9,#268dda 48%,#196be0);
}
.menu-icon.icon-purple, .menu-icon.icon-lime {
  background: radial-gradient(ellipse at 18% 0%,rgba(224,235,255,.85),transparent 40%),linear-gradient(145deg,#8cb5f3,#6089e7 48%,#4062d4);
}
.menu-icon.icon-gray, .menu-icon.icon-logout {
  background: linear-gradient(145deg,#c4d2e4,#91a9c7);
  box-shadow: inset 0 1px 1px #fff,0 4px 8px -6px rgba(80,109,146,.3);
}
.profile-page .copy-btn img, .profile-page ~ .modal-mask .copy-btn img { filter: var(--ref-blue-filter); }
.entry-box, .entry-card, .entry-card.wide {
  background: var(--ref-surface);
  border-color: #dfe9f7;
  box-shadow: var(--ref-shadow);
  border-radius: 15px;
}
.entry-txt { color: #254163; }
.bal-label, .earn-label, .cond-label, .cond-num, .vip-note { color: #70839c; }
.entry-ic, .bal-ic, .earn-ic, .svc-item-icon, .task-ic,
.faq-ic, .value-ic, .how-ic {
  background: var(--ref-icon);
  border-radius: 12px;
  border-color: #b4d6fc;
  box-shadow: var(--ref-icon-shadow);
}
.entry-ic img, .bal-ic img, .earn-ic img, .svc-item-icon img,
.task-ic img, .faq-ic img, .value-ic img, .how-ic img { filter: brightness(0) invert(1); }
.study-page .entry-ic { background: none; box-shadow: none; }
.study-page .entry-ic img { filter: none; }

/* Orders, tasks and memberships: numbers in ink, selected controls in blue. */
.oi-status { box-shadow: none; }
.oi-status.gray, .oi-status.ghost { color: #637c9c; background: #edf2f8; border-color: #dfe7f2; }
.oi-status.amber { color: #997537; background: #f8f1e4; border-color: #eedfc6; }
.oi-status.green { color: #32876f; background: #e9f5ef; border-color: #d2e9dc; }
.oi-status.cyan { color: #216dad; background: #e9f4fd; border-color: #d7e9f9; }
.oi-time i, .tl-box {
  background: linear-gradient(180deg,#ecf5ff,#e1edff);
  border-color: #cfdff5;
  color: #1659b9;
  box-shadow: inset 0 1px 0 #fff,0 2px 4px rgba(45,104,180,.035);
}
.oi-time em, .tl-sep { color: #8ba0bc; }
.oi-num.red { color: #bd5a6a; }
.oi-txt, .oi-label, .oi-date { color: #637c98; }
.oi-txt b { color: #294361; }
.oi-row, .oi-dates { border-color: #e6edf6; }
.oi-col + .oi-col, .oi-date:nth-child(2) { border-left-color: #e4ecf7; }
.bar-track, .cond-bar { background: #e8eff7; }
.bar-fill, .cond-fill { box-shadow: none; }
.bar-fill { background: linear-gradient(90deg,#39baf6,#1475ed); }
.task-amount { color: #1870d3; }
.task-ic::after { background: #fff; color: #1561c8; box-shadow: 0 1px 3px rgba(65,93,134,.16); }

.vip-name, .rt-c { color: #253d5b; }
.vip-card.svip .vip-name, .rt-row.svip .rt-c-level { color: #9a7740; }
.vip-cond { color: #526c8c; }
.svc-badge { background: #c87482; color: #fff; }

/* Deposit / withdrawal, coupons, calendar and ancillary pages. */
.addr-row { background: #eff5fe; border-color: #dce8f8; }
.addr-text, .inv-text { color: #2c496d; }
.deposit-page .copy-btn, .invite-page .copy-btn {
  background: var(--ref-button); color: #fff;
  box-shadow: var(--ref-button-shadow); border-radius: 9px;
}
.copy-btn.copied { background: #379982; color: #fff; }
.net-opt { color: #65809d; border-color: #dbe8f6; background: #f3f7fd; }
.net-opt.active { color: #105ecd; border-color: #b4d2f7; background: #e7f1ff; }
.qr-img { background: #fff; box-shadow: 0 0 0 1px #e0eaf6,0 5px 12px -10px rgba(40,93,158,.35); }
.notice-list li, .rule-item { color: #647b96; }
.n-num { background: #e6f0ff; color: #2e6abe; box-shadow: inset 0 1px 0 #fff; }
.balance-row span { color: #bb5b6d; }
.invite-bg {
  background: var(--ref-finance) right 14px top 12px / 53% auto no-repeat,
    var(--ref-wave) center top / 100% 220px no-repeat,
    linear-gradient(145deg,#fbfdff 15%,#e3f0ff 56%,#f7fbff);
  border-radius: 20px;
  box-shadow: inset 0 0 0 1px #dfeafd, var(--ref-shadow);
}
.coupon-card {
  border-radius: 15px;
  background: linear-gradient(100deg,#e0edff 0%,#e8f3ff 41.8%,#fff 42%,#f7fbff 100%);
  box-shadow: inset 0 0 0 1px #dbe8fa,0 6px 14px -11px rgba(48,104,169,.3);
}
.coupon-card::before {
  content: ""; position: absolute; pointer-events: none;
  top: 12px; bottom: 12px; left: 42%; border-left: 1px dashed #b8cfea;
}
.coupon-value { color: #0b60d5; }
.coupon-name { color: #274261; }
.coupon-type { color: #5882b9; background: rgba(255,255,255,.52); border-color: #c2d7f2; }
.coupon-date { color: #7b8fa7; }
.coupon-card.used, .coupon-card.expired { background: linear-gradient(100deg,#e9eef4 0 42%,#f8fafc 42% 100%); box-shadow: inset 0 0 0 1px #e3e9f0; }
.coupon-card.used::before, .coupon-card.expired::before { border-left-color: #ced9e6; }
.coupon-card.used .coupon-value, .coupon-card.expired .coupon-value,
.coupon-card.used .coupon-name, .coupon-card.expired .coupon-name,
.coupon-card.used .coupon-date, .coupon-card.expired .coupon-date { color: #93a1b3; }
.coupon-card.used .coupon-btn, .coupon-card.expired .coupon-btn { background: #e7edf4; color: #8494a9; box-shadow: none; text-shadow: none; }
.cal-table td div { color: #365172; }
.cal-table td div.today { background: var(--ref-button); color: #fff; box-shadow: var(--ref-button-shadow); }
.cal-head { color: #25466e; }
.cal-week td { color: #8c9db2; }
.cal-table td.onToday div::after { background: #4c97e7; box-shadow: none; }
.lang-item.active { background: #eef6ff; }
.lang-item:active { background: #edf5ff; }
.lang-name { color: #34506f; }
.lang-item + .lang-item { border-top-color: #e8eff7; }
.count-bar { background: linear-gradient(145deg,#fbfdff,#e6f1ff); color: #075fd8; border-color: #cfdef2; box-shadow: var(--ref-shadow); }
.bx-page .hero { background: radial-gradient(ellipse at 50% 54%,rgba(173,212,255,.45),transparent 67%); }
.prize-ic { background: #eff5fc; }
.prize-name { color: #627c99; }
.how-name { color: #294565; }
.how-desc { color: #70869f; }
.bx-page ~ .modal-mask .modal-amt { color: #fff; }
.bx-page ~ .modal-mask .modal-amt span { color: #f3d490; }
.score-num { color: #126de0; text-shadow: none; }
.credit-amount { color: #203d60; }
.ring-progress { stroke: #3992ee; filter: none; }
.score-ring circle:not(.ring-progress) { stroke: #e4eefb; }
.repay-status.paid { background: #e8f5ee; color: #3f8d76; }
.repay-status.pending { background: #f8f2e6; color: #a0834b; }

/* Toggles: both existing button and checkbox implementations are preserved. */
.detail-page .switch, .slider { background: #dbe4ef; border-color: #cfdae8; box-shadow: inset 0 1px 3px rgba(28,59,102,.09); }
.detail-page .switch::after, .slider::before { background: #fff; box-shadow: 0 2px 4px rgba(42,74,118,.18); }
.detail-page .switch.on, .switch input:checked + .slider { background: var(--ref-button); border-color: #3796f4; }

/* Dialogs and feedback. Keep the original visibility and click handling. */
.modal-mask { background: rgba(21,40,69,.42); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); }
.modal {
  background: linear-gradient(155deg,#fff 35%,#f2f8ff);
  color: #263f5f;
  border-color: rgba(238,246,255,.95);
  border-radius: 22px;
  box-shadow: 0 20px 65px -20px rgba(16,42,85,.35),inset 0 1px 0 #fff;
}
.modal-title { color: #1f3e66; }
.modal-desc, .modal p { color: #70839e; }
.modal-close { color: #768ba5; }
.modal .ok-icon { background: var(--ref-button); box-shadow: var(--ref-button-shadow); }
.service-line { color: #294b75; }
.service-line span { color: #7d8fa6; }
.toast { color: #fff; background: rgba(28,48,76,.95); border-color: rgba(207,228,255,.2); box-shadow: 0 12px 28px -13px rgba(10,43,87,.38); }
.welcome-slogan { color: #26456f; text-shadow: none; }
.welcome-plate { background: linear-gradient(180deg,rgba(255,255,255,.92),rgba(175,211,254,.22) 62%,transparent); border-color: #c4dbf5; box-shadow: inset 0 1px 0 #fff; }
.welcome-logo { filter: invert(1) hue-rotate(190deg) saturate(1.15) brightness(.87); }

@media (hover: hover) and (pointer: fine) {
  .func-box:hover { border-color: #c4dcfa; box-shadow: 0 8px 20px -12px rgba(30,108,211,.32),inset 0 1px 0 #fff; }
  .menu-item:hover, .news-item:hover, .list-row:hover { background-color: #f1f7ff; }
  .submit-btn:hover:not(:disabled), .confirm-btn:hover, .svc-btn.primary:hover,
  .apply-btn:hover, .sign-btn:hover, .open-btn:hover, .coupon-btn:hover:not(:disabled) {
    filter: brightness(1.035);
    box-shadow: inset 0 1px 1px rgba(255,255,255,.86),0 8px 16px -7px rgba(13,104,227,.43);
  }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
/* Preserve multicolour illustrations (do not flatten their opaque raster fill). */
.team-page .title-ic, .team-page .ov-ic, .feature-item img,
.faq-toggle img { filter: none; }
.task-tab img { filter: var(--ref-blue-filter); }
.task-tab.active img { filter: brightness(0) invert(1); }
.rec-ic img { filter: var(--ref-blue-filter); }
.user-banner, .total-card {
  background: linear-gradient(105deg,rgba(255,255,255,.96) 0%,rgba(238,246,255,.91) 55%,rgba(225,240,255,.36)),
    var(--ref-finance) right center / 72% auto no-repeat,#e5f1ff;
}
/* Keep the welcome mark legible during its original entrance/glow animation. */
.welcome-logo { filter: invert(1) hue-rotate(190deg) saturate(1.15) brightness(.87) !important; }
/* Allow the existing labelled withdrawal field to shrink on narrow phones. */
.withdraw-page .input-row > .kuang { min-width: 0; }

.nav-item.home { --nav-symbol:url("../images/data_544e9cbfe52a-gray.svg"); --nav-symbol-active:url("../images/data_544e9cbfe52a.svg"); }

.nav-item.service { --nav-symbol:url("../images/data_94463424c07e-gray.svg"); --nav-symbol-active:url("../images/data_94463424c07e.svg"); }

.nav-item.order { --nav-symbol:url("../images/data_303f4c3be661-gray.svg"); --nav-symbol-active:url("../images/data_303f4c3be661.svg"); }

.nav-item.assets { --nav-symbol:url("../images/data_0b2640da931c-gray.svg"); --nav-symbol-active:url("../images/data_0b2640da931c.svg"); }

.nav-item.profile { --nav-symbol:url("../images/data_819bd6eb49a7-gray.svg"); --nav-symbol-active:url("../images/data_819bd6eb49a7.svg"); }

/* ======================================================================
   Tech popups — site-wide upgrade (mask fade, card pop, cyan rim, glass toast)
   ====================================================================== */
@keyframes gMaskIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes gPopIn {
  from { opacity: 0; transform: translateY(24px) scale(.93); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes gToastIn {
  from { opacity: 0; transform: translate(-50%, -50%) scale(.88) translateY(18px); }
  to   { opacity: 1; transform: translate(-50%, -50%) scale(1) translateY(0); }
}

.modal-mask.show { animation: gMaskIn .28s ease; }

.modal-mask.show .modal,
.modal-mask.show .modal-box { animation: gPopIn .34s cubic-bezier(.16, 1, .3, 1); }

.bx-page ~ .modal-mask:not([hidden]) { animation: gMaskIn .28s ease; }
.bx-page ~ .modal-mask:not([hidden]) .modal-box { animation: gPopIn .34s cubic-bezier(.16, 1, .3, 1); }

.modal,
.modal-box {
  position: relative;
  border: 1px solid rgba(0, 229, 255, .38);
  box-shadow: 0 0 46px rgba(0, 229, 255, .16),
              inset 0 0 28px rgba(0, 229, 255, .06),
              0 22px 60px -22px rgba(16, 42, 85, .45);
}
.modal::before,
.modal-box::before {
  content: "";
  position: absolute;
  top: 0;
  left: 14%;
  right: 14%;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(0, 229, 255, .95), rgba(9, 101, 232, .9), transparent);
  border-radius: 2px;
  pointer-events: none;
}

.toast {
  background: linear-gradient(135deg, rgba(11, 37, 78, .94), rgba(9, 28, 62, .9));
  border-color: rgba(0, 229, 255, .5);
  box-shadow: 0 10px 34px rgba(0, 229, 255, .24),
              inset 0 0 14px rgba(0, 229, 255, .08);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.toast.show { animation: gToastIn .3s cubic-bezier(.16, 1, .3, 1); }