/* Global light mobile theme (ref: gold-trade8.com) */
html:not(.device-pc), .uni-app-root.layout-mobile-home {
    --shell-vw: 100vw;
    --app-bg: #f5f7f9;
    --app-card: #ffffff;
    --app-text: #24314f;
    --app-muted: #8a93a8;
    --app-blue: #2f73f6;
    --app-blue-dark: #1f71ef;
    --app-blue-soft: #eef3ff;
    --app-line: #e5ebf5;
    --app-success: #0a9217;
    --app-danger: #ff1a17;
    --app-radius: calc(16 * var(--shell-vw, 100vw) / 750);
    --app-shadow: 0 calc(8 * var(--shell-vw, 100vw) / 750) calc(28 * var(--shell-vw, 100vw) / 750) rgba(33, 63, 124, 0.07);
    --app-btn: linear-gradient(180deg, #5ba3ff 0%, #2f73f6 100%);
}

html:not(.device-pc), .uni-app-root.layout-mobile-home body {
    background-color: var(--app-bg);
    color: var(--app-text);
}

html:not(.device-pc) .uni-page, .uni-app-root.layout-mobile-home .uni-page,
.uni-app-root.layout-mobile-home .uni-page {
    background-color: var(--app-bg);
    color: var(--app-text);
}

/* Tab bar — all mobile pages */
html:not(.device-pc) .uni-tabbar, .uni-app-root.layout-mobile-home .uni-tabbar,
.uni-app-root.layout-mobile-home .uni-tabbar {
    background: #ffffff;
    border-top: 1px solid var(--app-line);
    box-shadow: 0 calc(-4 * var(--shell-vw, 100vw) / 750) calc(20 * var(--shell-vw, 100vw) / 750) rgba(33, 63, 124, 0.06);
}

html:not(.device-pc) .uni-tabbar-item, .uni-app-root.layout-mobile-home .uni-tabbar-item,
.uni-app-root.layout-mobile-home .uni-tabbar-item {
    color: var(--app-muted);
}

html:not(.device-pc) .uni-tabbar-item.active, .uni-app-root.layout-mobile-home .uni-tabbar-item.active {
    color: var(--app-blue);
}

html:not(.device-pc) .uni-tabbar-item.active img, .uni-app-root.layout-mobile-home .uni-tabbar-item.active img {
    filter: brightness(0) saturate(100%) invert(36%) sepia(89%) saturate(1500%) hue-rotate(205deg) brightness(95%) contrast(95%);
}

/* Sub-page headers */
html:not(.device-pc) .sub-page-header, .uni-app-root.layout-mobile-home .sub-page-header,
.uni-app-root.layout-mobile-home .sub-page-header {
    background: #ffffff;
    border-bottom: 1px solid var(--app-line);
    box-shadow: 0 calc(2 * var(--shell-vw, 100vw) / 750) calc(12 * var(--shell-vw, 100vw) / 750) rgba(33, 63, 124, 0.04);
}

html:not(.device-pc) .sub-back, .uni-app-root.layout-mobile-home .sub-back {
    color: var(--app-text);
}

html:not(.device-pc) .sub-page-title, .uni-app-root.layout-mobile-home .sub-page-title {
    color: var(--app-text);
}

/* Personal info / bank / security / wallet */
html:not(.device-pc) .personal-info-page, .uni-app-root.layout-mobile-home .personal-info-page.sub-page,
html:not(.device-pc) .bank-bind-page, .uni-app-root.layout-mobile-home .bank-bind-page.sub-page,
html:not(.device-pc) .security-settings-page, .uni-app-root.layout-mobile-home .security-settings-page.sub-page,
html:not(.device-pc) .wallet-address-page, .uni-app-root.layout-mobile-home .wallet-address-page.sub-page {
    background: var(--app-bg);
}

html:not(.device-pc) .personal-info-page .sub-page-header, .uni-app-root.layout-mobile-home .personal-info-page .sub-page-header,
html:not(.device-pc) .bank-bind-page .sub-page-header, .uni-app-root.layout-mobile-home .bank-bind-page .sub-page-header,
html:not(.device-pc) .security-settings-page .sub-page-header, .uni-app-root.layout-mobile-home .security-settings-page .sub-page-header,
html:not(.device-pc) .wallet-address-page .sub-page-header, .uni-app-root.layout-mobile-home .wallet-address-page .sub-page-header {
    background: #ffffff;
}

html:not(.device-pc) .personal-info-row, .uni-app-root.layout-mobile-home .personal-info-row,
html:not(.device-pc) .security-settings-row, .uni-app-root.layout-mobile-home .security-settings-row {
    border-bottom-color: var(--app-line);
    background: #ffffff;
}

html:not(.device-pc) .personal-info-label, .uni-app-root.layout-mobile-home .personal-info-label,
html:not(.device-pc) .security-settings-row, .uni-app-root.layout-mobile-home .security-settings-row {
    color: var(--app-text);
}

html:not(.device-pc) .personal-info-text, .uni-app-root.layout-mobile-home .personal-info-text,
html:not(.device-pc) .personal-info-chevron, .uni-app-root.layout-mobile-home .personal-info-chevron {
    color: var(--app-muted);
}

html:not(.device-pc) .personal-info-input, .uni-app-root.layout-mobile-home .personal-info-input,
html:not(.device-pc) .bank-bind-field input, .uni-app-root.layout-mobile-home .bank-bind-field input,
html:not(.device-pc) .wallet-address-field input, .uni-app-root.layout-mobile-home .wallet-address-field input {
    background: var(--app-blue-soft);
    border: 1px solid var(--app-line);
    color: var(--app-text);
}

html:not(.device-pc) .bank-bind-card, .uni-app-root.layout-mobile-home .bank-bind-card {
    background: #ffffff;
    border: 1px solid var(--app-line);
    box-shadow: var(--app-shadow);
}

html:not(.device-pc) .bank-bind-field label, .uni-app-root.layout-mobile-home .bank-bind-field label {
    color: var(--app-muted);
}

html:not(.device-pc) .wallet-address-filter, .uni-app-root.layout-mobile-home .wallet-address-filter {
    background: var(--app-blue-soft);
    color: var(--app-text);
}

html:not(.device-pc) .wallet-address-card, .uni-app-root.layout-mobile-home .wallet-address-card {
    background: #ffffff;
    border: 1px solid var(--app-line);
    box-shadow: var(--app-shadow);
}

html:not(.device-pc) .wallet-address-card-label, .uni-app-root.layout-mobile-home .wallet-address-card-label {
    color: var(--app-muted);
}

html:not(.device-pc) .wallet-address-card-value, .uni-app-root.layout-mobile-home .wallet-address-card-value {
    color: var(--app-text);
}

html:not(.device-pc) .wallet-address-empty, .uni-app-root.layout-mobile-home .wallet-address-empty {
    color: var(--app-muted);
}

html:not(.device-pc) .wallet-address-name, .uni-app-root.layout-mobile-home .wallet-address-name {
    color: var(--app-text) !important;
}

html:not(.device-pc) .wallet-address-network, .uni-app-root.layout-mobile-home .wallet-address-network {
    color: var(--app-muted) !important;
}

html:not(.device-pc) .wallet-address-add-btn, .uni-app-root.layout-mobile-home .wallet-address-add-btn,
html:not(.device-pc) .wallet-address-edit-btn, .uni-app-root.layout-mobile-home .wallet-address-edit-btn {
    background: var(--app-btn) !important;
    border-radius: calc(12 * var(--shell-vw, 100vw) / 750) !important;
}

/* Spot page */
html:not(.device-pc) .spot-page, .uni-app-root.layout-mobile-home .spot-page.index-page {
    background: var(--app-bg);
}

html:not(.device-pc) .spot-page-title, .uni-app-root.layout-mobile-home .spot-page-title {
    color: var(--app-text);
}

html:not(.device-pc) .spot-page-line, .uni-app-root.layout-mobile-home .spot-page-line {
    background: var(--app-blue);
}

html:not(.device-pc) .spot-empty, .uni-app-root.layout-mobile-home .spot-empty {
    color: var(--app-muted);
}

/* Legacy form cards (recharge, transfer, capital, etc.) */
html:not(.device-pc) .recharge-page .amount_box, .uni-app-root.layout-mobile-home .recharge-page .amount_box,
html:not(.device-pc) .recharge-page .Pay_method, .uni-app-root.layout-mobile-home .recharge-page .Pay_method,
html:not(.device-pc) .recharge-page .usdt-recharge-card, .uni-app-root.layout-mobile-home .recharge-page .usdt-recharge-card,
html:not(.device-pc) .recharge-paymethod-row, .uni-app-root.layout-mobile-home .recharge-paymethod-row,
html:not(.device-pc) .recharge-method-picker, .uni-app-root.layout-mobile-home .recharge-method-picker,
html:not(.device-pc) .withdrawal-card, .uni-app-root.layout-mobile-home .withdrawal-card,
html:not(.device-pc) .transfer-page .transfer_content, .uni-app-root.layout-mobile-home .transfer-page .transfer_content,
html:not(.device-pc) .capital-detail-page .capital-detail-box, .uni-app-root.layout-mobile-home .capital-detail-page .capital-detail-box,
html:not(.device-pc) .change-pwd-page .change-pwd-box, .uni-app-root.layout-mobile-home .change-pwd-page .change-pwd-box,
html:not(.device-pc) .sign-in-page .sign-in-box, .uni-app-root.layout-mobile-home .sign-in-page .sign-in-box,
html:not(.device-pc) .recharge-detail-page .Recharge_details, .uni-app-root.layout-mobile-home .recharge-detail-page .Recharge_details,
html:not(.device-pc) .recharge-detail-page .detail_item, .uni-app-root.layout-mobile-home .recharge-detail-page .detail_item,
html:not(.device-pc) .withdrawal-detail-page .withdrawal-detail-box, .uni-app-root.layout-mobile-home .withdrawal-detail-page .withdrawal-detail-box,
html:not(.device-pc) .myteam-page .commission_box, .uni-app-root.layout-mobile-home .myteam-page .commission_box,
html:not(.device-pc) .myteam-page .invitation_box, .uni-app-root.layout-mobile-home .myteam-page .invitation_box,
html:not(.device-pc) .myteam-page .team_box, .uni-app-root.layout-mobile-home .myteam-page .team_box,
html:not(.device-pc) .myteam-page .description_box, .uni-app-root.layout-mobile-home .myteam-page .description_box,
html:not(.device-pc) .myteam-page .fundStructure, .uni-app-root.layout-mobile-home .myteam-page .fundStructure {
    background: #ffffff !important;
    border: 1px solid var(--app-line);
    box-shadow: var(--app-shadow);
    color: var(--app-text);
}

html:not(.device-pc) .recharge-page .amount_title_box, .uni-app-root.layout-mobile-home .recharge-page .amount_title_box,
html:not(.device-pc) .recharge-page .method_box, .uni-app-root.layout-mobile-home .recharge-page .method_box,
html:not(.device-pc) .withdrawal-card-head, .uni-app-root.layout-mobile-home .withdrawal-card-head,
html:not(.device-pc) .withdrawal-payment-title, .uni-app-root.layout-mobile-home .withdrawal-payment-title,
html:not(.device-pc) .withdrawal-field label, .uni-app-root.layout-mobile-home .withdrawal-field label,
html:not(.device-pc) .transfer-page .amount_tip, .uni-app-root.layout-mobile-home .transfer-page .amount_tip,
html:not(.device-pc) .capital-detail-page .capital-detail-title, .uni-app-root.layout-mobile-home .capital-detail-page .capital-detail-title,
html:not(.device-pc) .capital-detail-page .capital-filter-select, .uni-app-root.layout-mobile-home .capital-detail-page .capital-filter-select,
html:not(.device-pc) .change-pwd-page .change-pwd-title, .uni-app-root.layout-mobile-home .change-pwd-page .change-pwd-title,
html:not(.device-pc) .change-pwd-page .pwd_item_name, .uni-app-root.layout-mobile-home .change-pwd-page .pwd_item_name,
html:not(.device-pc) .sign-in-page .sign-in-title, .uni-app-root.layout-mobile-home .sign-in-page .sign-in-title,
html:not(.device-pc) .recharge-detail-page .item_top, .uni-app-root.layout-mobile-home .recharge-detail-page .item_top,
html:not(.device-pc) .myteam-page .item_title, .uni-app-root.layout-mobile-home .myteam-page .item_title,
html:not(.device-pc) .myteam-page .transfer_title, .uni-app-root.layout-mobile-home .myteam-page .transfer_title,
html:not(.device-pc) .myteam-page .fundStructure_title_box, .uni-app-root.layout-mobile-home .myteam-page .fundStructure_title_box {
    color: var(--app-text) !important;
}

html:not(.device-pc) .capital-detail-page .capital-filter-select, .uni-app-root.layout-mobile-home .capital-detail-page .capital-filter-select {
    background-color: var(--app-blue-soft) !important;
    border-color: var(--app-line) !important;
    background-image: linear-gradient(45deg, transparent 50%, #667085 50%), linear-gradient(135deg, #667085 50%, transparent 50%);
    background-position: calc(100% - 22px) calc(50% - 3px), calc(100% - 16px) calc(50% - 3px);
    background-size: 6px 6px, 6px 6px;
    background-repeat: no-repeat;
}

html:not(.device-pc) .capital-detail-page .record-table-head, .uni-app-root.layout-mobile-home .capital-detail-page .record-table-head {
    color: var(--app-muted) !important;
    border-bottom-color: var(--app-line) !important;
}

html:not(.device-pc) .capital-detail-page .record-table-row, .uni-app-root.layout-mobile-home .capital-detail-page .record-table-row {
    color: var(--app-text) !important;
    border-bottom-color: var(--app-line) !important;
}

html:not(.device-pc) .withdrawal-detail-page .withdrawal-detail-title, .uni-app-root.layout-mobile-home .withdrawal-detail-page .withdrawal-detail-title,
html:not(.device-pc) .withdrawal-detail-page .withdrawal-detail-amount, .uni-app-root.layout-mobile-home .withdrawal-detail-page .withdrawal-detail-amount,
html:not(.device-pc) .withdrawal-detail-page .withdrawal-detail-value, .uni-app-root.layout-mobile-home .withdrawal-detail-page .withdrawal-detail-value {
    color: var(--app-text) !important;
}

html:not(.device-pc) .withdrawal-detail-page .withdrawal-detail-label, .uni-app-root.layout-mobile-home .withdrawal-detail-page .withdrawal-detail-label,
html:not(.device-pc) .withdrawal-detail-page .withdrawal-detail-value--muted, .uni-app-root.layout-mobile-home .withdrawal-detail-page .withdrawal-detail-value--muted,
html:not(.device-pc) .withdrawal-detail-page .withdrawal-detail-empty, .uni-app-root.layout-mobile-home .withdrawal-detail-page .withdrawal-detail-empty {
    color: var(--app-muted) !important;
}

html:not(.device-pc) .withdrawal-detail-page .withdrawal-detail-card, .uni-app-root.layout-mobile-home .withdrawal-detail-page .withdrawal-detail-card {
    background: var(--app-blue-soft) !important;
    border-color: var(--app-line) !important;
}

html:not(.device-pc) .recharge-page .amount_detail, .uni-app-root.layout-mobile-home .recharge-page .amount_detail,
html:not(.device-pc) .recharge-page .tutorial_box, .uni-app-root.layout-mobile-home .recharge-page .tutorial_box,
html:not(.device-pc) .recharge-page .amount_item, .uni-app-root.layout-mobile-home .recharge-page .amount_item,
html:not(.device-pc) .recharge-page .method_item, .uni-app-root.layout-mobile-home .recharge-page .method_item,
html:not(.device-pc) .withdrawal-balance-hint, .uni-app-root.layout-mobile-home .withdrawal-balance-hint,
html:not(.device-pc) .withdrawal-bank-row, .uni-app-root.layout-mobile-home .withdrawal-bank-row,
html:not(.device-pc) .transfer-page .amount_tip_sub, .uni-app-root.layout-mobile-home .transfer-page .amount_tip_sub,
html:not(.device-pc) .recharge-detail-page .content_left, .uni-app-root.layout-mobile-home .recharge-detail-page .content_left {
    color: var(--app-muted) !important;
}

html:not(.device-pc) .recharge-page .amount_item, .uni-app-root.layout-mobile-home .recharge-page .amount_item,
html:not(.device-pc) .recharge-page .method_item, .uni-app-root.layout-mobile-home .recharge-page .method_item {
    background: var(--app-blue-soft) !important;
    border-color: var(--app-line) !important;
    color: var(--app-text) !important;
}

html:not(.device-pc) .recharge-page .amount_active, .uni-app-root.layout-mobile-home .recharge-page .amount_active,
html:not(.device-pc) .recharge-page .method_active, .uni-app-root.layout-mobile-home .recharge-page .method_active {
    background: var(--app-blue) !important;
    border-color: var(--app-blue) !important;
    color: #fff !important;
}

html:not(.device-pc) .recharge-page .amount_val_box, .uni-app-root.layout-mobile-home .recharge-page .amount_val_box,
html:not(.device-pc) .withdrawal-amount-box, .uni-app-root.layout-mobile-home .withdrawal-amount-box,
html:not(.device-pc) .transfer-page .amount_all_box input, .uni-app-root.layout-mobile-home .transfer-page .amount_all_box input {
    background: var(--app-blue-soft) !important;
    border-color: var(--app-blue) !important;
    color: var(--app-blue) !important;
}

html:not(.device-pc) .recharge-page .confirm, .uni-app-root.layout-mobile-home .recharge-page .confirm,
html:not(.device-pc) .withdrawal-confirm, .uni-app-root.layout-mobile-home .withdrawal-confirm,
html:not(.device-pc) .transfer-page .more, .uni-app-root.layout-mobile-home .transfer-page .more,
html:not(.device-pc) .bank-bind-save, .uni-app-root.layout-mobile-home .bank-bind-save,
html:not(.device-pc) .change-pwd-page .confirm_btn, .uni-app-root.layout-mobile-home .change-pwd-page .confirm_btn {
    background: var(--app-btn) !important;
    border-color: transparent !important;
    border-radius: calc(12 * var(--shell-vw, 100vw) / 750) !important;
}

html:not(.device-pc) .recharge-page .sub-page-action, .uni-app-root.layout-mobile-home .recharge-page .sub-page-action {
    color: var(--app-text);
}

html:not(.device-pc) .recharge-paymethod-name, .uni-app-root.layout-mobile-home .recharge-paymethod-name {
    color: var(--app-text) !important;
}

html:not(.device-pc) .recharge-paymethod-arrow, .uni-app-root.layout-mobile-home .recharge-paymethod-arrow {
    color: var(--app-muted) !important;
}

html:not(.device-pc) .recharge-method-picker-item, .uni-app-root.layout-mobile-home .recharge-method-picker-item {
    color: var(--app-text) !important;
    border-top-color: var(--app-line) !important;
}

html:not(.device-pc) .recharge-method-picker-item.active, .uni-app-root.layout-mobile-home .recharge-method-picker-item.active {
    color: var(--app-blue) !important;
    background: var(--app-blue-soft) !important;
}

html:not(.device-pc) .recharge-page.sub-page, .uni-app-root.layout-mobile-home .recharge-page.sub-page {
    background: var(--app-bg) !important;
}

html:not(.device-pc) .withdrawal-page, .uni-app-root.layout-mobile-home .withdrawal-page.sub-page:not(.withdrawal-page--exchange) {
    background: var(--app-bg);
}

html:not(.device-pc) .fund-custody-page, .uni-app-root.layout-mobile-home .fund-custody-page.sub-page {
    background: var(--app-bg);
}

html:not(.device-pc) .fund-custody-card, .uni-app-root.layout-mobile-home .fund-custody-card,
html:not(.device-pc) .about-us-page .about-content, .uni-app-root.layout-mobile-home .about-us-page .about-content {
    background: #ffffff !important;
    border: 1px solid var(--app-line);
    color: var(--app-text) !important;
}

html:not(.device-pc) .myteam-page, .uni-app-root.layout-mobile-home .myteam-page.sub-page {
    background: var(--app-bg) !important;
}

html:not(.device-pc) .placeholder-page, .uni-app-root.layout-mobile-home .placeholder-page.sub-page {
    background: var(--app-bg);
}

html:not(.device-pc) .personal-info-body, .uni-app-root.layout-mobile-home .personal-info-body {
    padding: calc(16 * var(--shell-vw, 100vw) / 750);
}

html:not(.device-pc) .personal-info-row, .uni-app-root.layout-mobile-home .personal-info-row {
    background: #ffffff;
    border: 1px solid var(--app-line);
    border-radius: calc(12 * var(--shell-vw, 100vw) / 750);
    margin-bottom: calc(8 * var(--shell-vw, 100vw) / 750);
    padding: 0 calc(20 * var(--shell-vw, 100vw) / 750);
    border-bottom: 1px solid var(--app-line);
}

html:not(.device-pc) .bank-bind-body, .uni-app-root.layout-mobile-home .bank-bind-body {
    padding: calc(16 * var(--shell-vw, 100vw) / 750);
}

html:not(.device-pc) .security-settings-body, .uni-app-root.layout-mobile-home .security-settings-body {
    padding: calc(16 * var(--shell-vw, 100vw) / 750);
}

html:not(.device-pc) .security-settings-row, .uni-app-root.layout-mobile-home .security-settings-row {
    background: #ffffff;
    border: 1px solid var(--app-line);
    border-radius: calc(12 * var(--shell-vw, 100vw) / 750);
    margin-bottom: calc(8 * var(--shell-vw, 100vw) / 750);
    padding: 0 calc(20 * var(--shell-vw, 100vw) / 750);
    border-bottom: 1px solid var(--app-line);
    min-height: calc(104 * var(--shell-vw, 100vw) / 750);
    font-size: calc(28 * var(--shell-vw, 100vw) / 750);
}

html:not(.device-pc) .sign-in-page .sign-calendar-cell, .uni-app-root.layout-mobile-home .sign-in-page .sign-calendar-cell {
    color: var(--app-text);
    background: var(--app-blue-soft);
}

html:not(.device-pc) .sign-in-page .sign-calendar-cell.signed, .uni-app-root.layout-mobile-home .sign-in-page .sign-calendar-cell.signed {
    background: var(--app-blue);
    color: #fff;
}

html:not(.device-pc) .sign-in-page .sign-calendar-nav, .uni-app-root.layout-mobile-home .sign-in-page .sign-calendar-nav,
html:not(.device-pc) .sign-in-page .sign-calendar-week, .uni-app-root.layout-mobile-home .sign-in-page .sign-calendar-week {
    color: var(--app-muted);
}

html:not(.device-pc) .sign-in-page .sign-calendar-btn, .uni-app-root.layout-mobile-home .sign-in-page .sign-calendar-btn {
    background: var(--app-blue-soft);
    border-color: var(--app-line);
    color: var(--app-text);
}

html:not(.device-pc) .modal-mask, .uni-app-root.layout-mobile-home .modal-mask {
    background: rgba(36, 49, 79, 0.35);
}

html:not(.device-pc) .modal_box, .uni-app-root.layout-mobile-home .modal_box {
    background: #ffffff;
    color: var(--app-text);
    border: 1px solid var(--app-line);
    box-shadow: var(--app-shadow);
}

html:not(.device-pc) .form_input, .uni-app-root.layout-mobile-home .form_input {
    color: var(--app-text);
}