/* =============================================
   Zonya P2P Investment Platform Styles
   ============================================= */

/* Reset */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

@media (max-width: 768px) {
    .member-dashboard-page .member-sidebar { display: none !important; }
    .member-dashboard-page .mobile-member-menus,
    .member-dashboard-page .insight-feature-grid,
    .member-dashboard-page .asset-trend-section,
    .member-dashboard-page .account-info,
    .member-dashboard-page .mobile-split-section { display: none !important; }
    .mobile-bottom-nav { height: 66px !important; grid-template-columns: repeat(4,minmax(0,1fr)) !important; }
    .mobile-bottom-nav a { flex-direction: column !important; gap: 2px; min-width: 0; font-size: 11px !important; }
}

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-size: 14px;
    line-height: 1.6;
    color: #333;
    background-color: #f5f5f5;
}

a {
    text-decoration: none;
    color: inherit;
}

ul {
    list-style: none;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
}

/* Header */
.header {
    background: #fff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    position: sticky;
    top: 0;
    z-index: 100;
}

.header .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 70px;
}

.logo h1 {
    font-size: 24px;
    color: #1890ff;
}

.nav ul {
    display: flex;
    gap: 30px;
}

.nav a {
    color: #666;
    transition: color 0.3s;
}

.nav a:hover,
.nav a.active {
    color: #1890ff;
}

.user-area {
    display: flex;
    gap: 15px;
}

.user-area a {
    padding: 8px 20px;
    border-radius: 4px;
}

.user-area a:first-child {
    background: #1890ff;
    color: #fff;
}

.user-area a:last-child {
    border: 1px solid #1890ff;
    color: #1890ff;
}

/* Banner */
.banner {
    background: linear-gradient(135deg, #1890ff 0%, #001529 100%);
    color: #fff;
    padding: 80px 0;
    text-align: center;
}

.banner h2 {
    font-size: 42px;
    margin-bottom: 15px;
}

.banner p {
    font-size: 20px;
    opacity: 0.9;
    margin-bottom: 30px;
}

.banner-btns {
    display: flex;
    gap: 15px;
    justify-content: center;
}

.btn-primary,
.btn-secondary {
    padding: 12px 30px;
    border-radius: 4px;
    font-size: 16px;
}

.btn-primary {
    background: #fff;
    color: #1890ff;
}

.btn-secondary {
    background: transparent;
    border: 2px solid #fff;
    color: #fff;
}

@media (max-width: 768px) {
    body.download-page {
        display: flex;
        min-height: 100vh;
        align-items: center;
        justify-content: center;
        padding: 24px;
        background: #f4f7fa;
    }
    body.download-page > .header,
    body.download-page > .download-hero,
    body.download-page > .footer,
    body.download-page .download-section-title,
    body.download-page .windows-download-card,
    body.download-page .download-security-note,
    body.download-page .tools-download-section,
    body.download-page .android-download-card > :not(.download-action):not(.android-download-qr):not(.mobile-download-intro) {
        display: none !important;
    }
    body.download-page .download-main,
    body.download-page .download-main > .container,
    body.download-page .download-section,
    body.download-page .client-download-grid,
    body.download-page .android-download-card {
        width: 100%;
        margin: 0;
        padding: 0;
        border: 0;
        background: transparent;
        box-shadow: none;
    }
    body.download-page .client-download-grid { display: block; }
    body.download-page .android-download-card {
        display: flex;
        flex-direction: column;
        align-items: center;
        min-height: 0;
        gap: 20px;
        position: relative;
        z-index: 1;
    }
    body.download-page::before,
    body.download-page::after {
        content: "";
        position: fixed;
        border-radius: 50%;
        pointer-events: none;
    }
    body.download-page::before {
        top: -110px;
        right: -100px;
        width: 280px;
        height: 280px;
        background: radial-gradient(circle, rgba(32, 101, 155, .16), rgba(32, 101, 155, 0) 70%);
    }
    body.download-page::after {
        bottom: -140px;
        left: -120px;
        width: 320px;
        height: 320px;
        background: radial-gradient(circle, rgba(214, 168, 77, .15), rgba(214, 168, 77, 0) 70%);
    }
    body.download-page .mobile-download-intro {
        display: flex !important;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    body.download-page .mobile-brand-mark {
        display: grid;
        width: 58px;
        height: 58px;
        place-items: center;
        margin-bottom: 9px;
        border-radius: 18px;
        color: #fff;
        background: linear-gradient(145deg, #123a61, #276d9f);
        box-shadow: 0 12px 25px rgba(18, 58, 97, .22);
    }
    body.download-page .mobile-brand-mark span {
        font-family: Georgia, serif;
        font-size: 32px;
        font-weight: 700;
        line-height: 1;
    }
    body.download-page .mobile-brand-name {
        color: #b48735;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 4px;
    }
    body.download-page .mobile-download-intro h1 {
        margin: 5px 0 3px;
        color: #12304d;
        font-size: 25px;
        line-height: 1.35;
    }
    body.download-page .mobile-download-intro p {
        max-width: 330px;
        color: #718096;
        font-size: 13px;
    }
    body.download-page .mobile-trust-tags {
        display: flex;
        gap: 8px;
        margin-top: 11px;
    }
    body.download-page .mobile-trust-tags span {
        padding: 4px 10px;
        border: 1px solid #dce7f0;
        border-radius: 999px;
        color: #526b82;
        background: rgba(255,255,255,.72);
        font-size: 11px;
    }
    body.download-page .android-download-qr {
        position: static;
        display: flex !important;
        flex-direction: column;
        align-items: center;
        gap: 8px;
    }
    body.download-page .android-download-qr img {
        width: 178px;
        height: 178px;
        padding: 10px;
        border-radius: 12px;
        box-shadow: 0 10px 30px rgba(18, 47, 77, 0.12);
    }
    body.download-page .android-download-qr span {
        color: #52697f;
        font-size: 14px;
    }
    body.download-page .download-action {
        display: flex;
        width: min(100%, 360px);
        min-height: 54px;
        margin: 0 auto !important;
        font-size: 17px;
        box-shadow: 0 12px 26px rgba(18, 58, 97, .20);
    }
}

.btn-download-home {
    padding: 12px 30px;
    border-radius: 4px;
    font-size: 16px;
    background: #d6a84d;
    color: #102a48;
    font-weight: 700;
    box-shadow: 0 8px 22px rgba(214, 168, 77, 0.28);
}

.btn-download-home:hover {
    background: #e6bc66;
}

/* Dedicated APP download page */
body.app-download-page {
    min-height: 100vh;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: #f4f7fa;
}

.app-download-shell {
    width: min(100%, 460px);
}

.app-download-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 34px 28px 30px;
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 18px 50px rgba(18, 47, 77, 0.12);
}

.app-download-card .mobile-brand-mark {
    display: grid;
    width: 62px;
    height: 62px;
    place-items: center;
    margin-bottom: 10px;
    border-radius: 18px;
    color: #fff;
    background: linear-gradient(145deg, #123a61, #276d9f);
    box-shadow: 0 12px 25px rgba(18, 58, 97, .22);
}

.app-download-card .mobile-brand-mark span {
    font-family: Georgia, serif;
    font-size: 34px;
    font-weight: 700;
    line-height: 1;
}

.app-download-card .mobile-brand-name {
    color: #b48735;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 4px;
}

.app-download-card h1 {
    margin: 8px 0 6px;
    color: #12304d;
    font-size: 26px;
    line-height: 1.35;
}

.app-download-card > p {
    max-width: 340px;
    margin: 0;
    color: #718096;
    font-size: 14px;
    line-height: 1.7;
}

.app-version-pill {
    margin-top: 16px;
    padding: 6px 14px;
    border-radius: 999px;
    color: #526b82;
    background: #f2f7fb;
    font-size: 13px;
    font-weight: 600;
}

.app-download-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: min(100%, 360px);
    min-height: 54px;
    margin-top: 22px;
    font-size: 17px;
    box-shadow: 0 12px 26px rgba(18, 58, 97, .20);
}

.app-download-qr-block {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    margin-top: 28px;
    padding-top: 24px;
    width: 100%;
    border-top: 1px solid #e7eef5;
}

.app-download-qr-block img {
    width: 188px;
    height: 188px;
    padding: 10px;
    border: 1px solid #dbe5ee;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 10px 30px rgba(18, 47, 77, 0.10);
}

.app-download-qr-block span {
    color: #52697f;
    font-size: 14px;
}

.app-download-link {
    margin: 0;
    color: #8aa0b3;
    font-size: 12px;
    word-break: break-all;
}

.app-download-notes {
    margin: 22px 0 0;
    padding-left: 18px;
    color: #6d8092;
    font-size: 12px;
    line-height: 1.8;
    text-align: left;
}

.app-download-notes a {
    color: #1f5f95;
}

.download-action-secondary {
    margin-top: 12px;
    background: #eef4f9;
    color: #1f5f95;
    box-shadow: none;
}

.download-action-secondary:hover {
    background: #e2edf7;
}

/* Download Center */
.download-hero {
    padding: 66px 0 70px;
    color: #fff;
    text-align: center;
    background: radial-gradient(circle at 75% 15%, rgba(214, 168, 77, 0.24), transparent 28%), linear-gradient(135deg, #0b2440, #163e67);
}
.download-page .nav { display: none; }
.mobile-download-intro { display: none; }
.android-download-qr { position: absolute; right: 26px; bottom: 26px; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.android-download-qr img { width: 112px; height: 112px; padding: 6px; border: 1px solid #dbe5ee; border-radius: 8px; background: #fff; }
.android-download-qr span { color: #617284; font-size: 12px; }
.android-download-card .download-action { margin-right: 150px; }
.android-download-card .download-action-secondary { margin-right: 150px; margin-top: 10px; }

.download-eyebrow {
    display: inline-block;
    margin-bottom: 12px;
    color: #e7bd69;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 3px;
}

.download-hero h2 { font-size: 40px; margin-bottom: 10px; }
.download-hero p { color: #d3dfeb; font-size: 17px; }
.download-main { padding: 54px 0 70px; background: #f4f7fa; }
.download-section + .download-section { margin-top: 58px; }

.download-section-title {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 24px;
}

.download-section-title > div { display: flex; align-items: center; gap: 12px; }
.download-section-title span { color: #d2a34b; font-size: 14px; font-weight: 800; }
.download-section-title h2 { color: #122f4d; font-size: 26px; }
.download-section-title > p { color: #7a8794; }

.client-download-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.download-card {
    position: relative;
    min-height: 310px;
    padding: 30px;
    overflow: hidden;
    background: #fff;
    border: 1px solid #e0e7ee;
    border-radius: 12px;
    box-shadow: 0 12px 32px rgba(20, 47, 75, 0.07);
}
.download-card.featured { border-top: 3px solid #d4a64c; }
.download-platform-icon {
    position: absolute;
    top: 28px;
    right: 28px;
    width: 56px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    color: #fff;
    font-size: 27px;
    font-weight: 700;
}
.windows-icon { background: #1473e6; }
.android-icon { background: #3ba55d; }
.download-card-body { padding-right: 62px; }
.official-badge { color: #1473e6; font-size: 12px; font-weight: 700; }
.download-card h3 { margin: 8px 0 8px; color: #102d4a; font-size: 24px; }
.download-card-body > p { min-height: 48px; color: #687786; }
.download-card ul { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.download-card li { padding: 4px 9px; color: #657483; background: #f1f5f8; border-radius: 3px; font-size: 12px; }
.download-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 190px;
    margin-top: 28px;
    padding: 12px 22px;
    color: #fff;
    background: #153d65;
    border-radius: 5px;
    font-weight: 700;
}
.download-action:hover { background: #1b527f; }
.download-security-note { margin-top: 15px; color: #748291; font-size: 13px; }

.finance-download-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.finance-download-card { padding: 23px; background: #fff; border: 1px solid #e1e7ed; border-radius: 9px; }
.tool-logo { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; color: #fff; border-radius: 8px; font-weight: 800; }
.tool-blue { background: #1687d9; }.tool-dark { background: #24334d; }.tool-red { background: #d6463c; }.tool-orange { background: #ed7d2b; }
.finance-download-card h3 { margin: 16px 0 7px; color: #153553; font-size: 18px; }
.finance-download-card p { min-height: 66px; color: #788593; font-size: 13px; }
.finance-download-card a { display: inline-block; margin-top: 15px; color: #176bb4; font-weight: 700; }
.finance-download-card a:hover { color: #d09b3f; }
.third-party-notice { display: flex; gap: 14px; margin-top: 18px; padding: 15px 18px; color: #725820; background: #fff8e8; border-left: 3px solid #d6a84d; }
.third-party-notice p { color: #807052; }

/* Quick Categories */
.quick-category-section {
    margin-top: -34px;
    position: relative;
    z-index: 2;
}

.quick-category-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.quick-category-item {
    min-height: 124px;
    padding: 22px 12px;
    background: #fff;
    border: 1px solid #e8eef5;
    border-radius: 8px;
    box-shadow: 0 10px 26px rgba(15, 35, 68, 0.08);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 7px;
    text-align: center;
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.quick-category-item:hover {
    transform: translateY(-4px);
    border-color: #1890ff;
    box-shadow: 0 14px 30px rgba(24, 144, 255, 0.14);
}

.quick-category-icon {
    display: inline-flex;
    width: 42px;
    height: 42px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #e8f2ff;
    color: #1677ff;
    font-weight: 700;
    font-size: 20px;
}

.quick-category-item strong {
    color: #1f2937;
    font-size: 16px;
}

.quick-category-item small {
    color: #6b7280;
    font-size: 12px;
}

/* Market Overview */
.market-section {
    background: #f7f9fc;
    padding-top: 74px;
}

.market-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.market-card {
    background: #fff;
    border: 1px solid #e5eaf2;
    border-radius: 8px;
    padding: 22px;
    box-shadow: 0 10px 28px rgba(15, 35, 68, 0.06);
}

.market-card span,
.market-card em {
    display: block;
    color: #6b7280;
    font-style: normal;
}

.market-card strong {
    display: block;
    margin: 10px 0 4px;
    color: #132238;
    font-size: 28px;
    line-height: 1.15;
}

.market-card.positive em {
    color: #0f9f6e;
}

.market-card.negative em {
    color: #d64545;
}

.market-card.neutral em {
    color: #8b6f35;
}

/* Finance Tools */
.finance-tools-section {
    background: #fff;
}

.finance-tools-grid {
    display: grid;
    grid-template-columns: 1.1fr 1fr 1.1fr;
    gap: 20px;
}

.finance-tool-panel {
    min-height: 286px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid #e5eaf2;
    border-radius: 8px;
    padding: 24px;
    box-shadow: 0 12px 30px rgba(15, 35, 68, 0.07);
}

.finance-tool-panel h3 {
    margin-bottom: 18px;
    color: #132238;
    font-size: 22px;
}

.calc-form {
    display: grid;
    gap: 12px;
}

.calc-form label {
    display: grid;
    gap: 6px;
    color: #5f6b7a;
}

.calc-form input {
    height: 40px;
    padding: 0 12px;
    border: 1px solid #d8e0ea;
    border-radius: 6px;
    color: #132238;
    font-size: 15px;
}

.calc-result {
    margin-top: 18px;
    padding: 16px;
    background: #132238;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #fff;
}

.calc-result strong {
    font-size: 24px;
    color: #f3c76b;
}

.risk-profile-list {
    display: grid;
    gap: 12px;
}

.risk-profile-list div {
    padding: 14px;
    border: 1px solid #e5eaf2;
    border-radius: 8px;
    background: #fff;
}

.risk-profile-list strong,
.risk-profile-list span {
    display: block;
}

.risk-profile-list strong {
    color: #1677ff;
    margin-bottom: 4px;
}

.risk-profile-list span {
    color: #5f6b7a;
}

.allocation-row {
    display: grid;
    grid-template-columns: 76px 1fr 44px;
    align-items: center;
    gap: 10px;
    margin-bottom: 18px;
    color: #5f6b7a;
}

.allocation-row div {
    height: 10px;
    overflow: hidden;
    background: #e8eef5;
    border-radius: 999px;
}

.allocation-row i {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #1677ff, #c9a86a);
    border-radius: 999px;
}

.allocation-row em {
    color: #132238;
    font-style: normal;
    font-weight: 700;
    text-align: right;
}

.product-detail-card,
.article-detail {
    background: #fff;
    border: 1px solid #e5eaf2;
    border-radius: 8px;
    padding: 34px;
    box-shadow: 0 10px 28px rgba(15, 35, 68, 0.06);
}

.product-detail-card h2,
.article-detail h2 {
    margin-bottom: 22px;
    color: #132238;
    font-size: 30px;
}

.product-detail-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 26px;
}

.product-detail-grid div {
    padding: 18px;
    background: #f8fbff;
    border: 1px solid #e5eaf2;
    border-radius: 8px;
}

.product-detail-grid span,
.product-detail-grid strong {
    display: block;
}

.product-detail-grid span {
    margin-bottom: 8px;
    color: #6b7280;
}

.product-detail-grid strong {
    color: #1677ff;
    font-size: 22px;
}

.article-meta {
    display: flex;
    gap: 18px;
    margin-bottom: 24px;
    color: #6b7280;
}

.article-meta em {
    font-style: normal;
}

.article-content {
    margin-bottom: 28px;
    color: #374151;
    line-height: 1.9;
}

/* Sections */
.section {
    padding: 60px 0;
}

.section-title {
    text-align: center;
    margin-bottom: 40px;
}

.section-title h2 {
    font-size: 32px;
    color: #333;
    margin-bottom: 10px;
}

.section-title p {
    color: #666;
}

/* Product Grid */
.product-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 20px;
}

.product-card {
    background: #fff;
    border-radius: 8px;
    padding: 25px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    transition: transform 0.3s, box-shadow 0.3s;
}

.product-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
}

.product-card-head {
    min-height: 52px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.product-name {
    font-size: 18px;
    font-weight: bold;
    color: #333;
    margin-bottom: 15px;
    min-width: 0;
    flex: 1;
}

.risk-badge {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 58px;
    height: 24px;
    padding: 0 8px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
}

.risk-low {
    color: #047857;
    background: #d1fae5;
}

.risk-mid {
    color: #8b5a00;
    background: #fef3c7;
}

.risk-high {
    color: #b91c1c;
    background: #fee2e2;
}

.product-rate {
    text-align: center;
    padding: 20px 0;
    border-bottom: 1px solid #eee;
}

.rate-value {
    font-size: 42px;
    font-weight: bold;
    color: #ff6b00;
}

.rate-label {
    display: block;
    color: #999;
    font-size: 12px;
    margin-top: 5px;
}

.product-info {
    padding: 15px 0;
}

.info-item {
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
}

.info-item .label {
    color: #666;
}

.info-item .value {
    font-weight: 500;
}

.product-progress {
    margin: 15px 0;
}

.progress-bar {
    height: 8px;
    background: #eee;
    border-radius: 4px;
    overflow: hidden;
}

.progress-fill {
    height: 100%;
    background: linear-gradient(90deg, #1890ff, #001529);
    border-radius: 4px;
}

.progress-text {
    font-size: 12px;
    color: #666;
    margin-top: 8px;
}

.btn-invest {
    display: block;
    width: 100%;
    padding: 12px;
    background: #1890ff;
    color: #fff;
    text-align: center;
    border-radius: 4px;
    margin-top: 15px;
    transition: background 0.3s;
}

.btn-invest:hover {
    background: #001529;
}

/* Home Stats */
.stats-section {
    padding: 42px 0;
    background: #001529;
}

.stats-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
}

.home-stat-card {
    min-height: 112px;
    padding: 24px 18px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12);
    text-align: center;
}

.home-stat-card strong {
    display: block;
    color: #fff;
    font-size: 32px;
    line-height: 1.2;
    margin-bottom: 8px;
}

.home-stat-card span {
    color: rgba(255, 255, 255, 0.72);
}

/* Features */
.features-section {
    background: #fff;
}

.feature-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
}

.feature-item {
    text-align: center;
    padding: 34px 24px;
    border-radius: 8px;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.feature-item:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 28px rgba(24, 144, 255, 0.12);
}

.feature-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    margin-bottom: 18px;
    border-radius: 50%;
    color: #fff;
    font-size: 28px;
    font-weight: 700;
    line-height: 1;
    box-shadow: 0 8px 20px rgba(24, 144, 255, 0.22);
}

.feature-icon-security {
    background: linear-gradient(135deg, #1677ff, #36cfc9);
}

.feature-icon-income {
    background: linear-gradient(135deg, #fa8c16, #ffd666);
}

.feature-icon-speed {
    background: linear-gradient(135deg, #52c41a, #95de64);
}

.feature-icon-mobile {
    background: linear-gradient(135deg, #722ed1, #eb2f96);
}

.feature-item h3 {
    font-size: 20px;
    margin-bottom: 10px;
}

.feature-item p {
    color: #666;
}

/* News List */
.news-list {
    max-width: 800px;
    margin: 0 auto;
}

.news-item {
    background: #fff;
    padding: 20px;
    margin-bottom: 15px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 20px;
}

.news-date {
    color: #999;
    font-size: 12px;
    white-space: nowrap;
}

.news-title {
    flex: 1;
    color: #333;
}

.news-title:hover {
    color: #1890ff;
}

/* Footer */
.footer {
    background: #001529;
    color: #fff;
    padding: 40px 0 20px;
}

.footer-content {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
    margin-bottom: 30px;
}

.footer-col h4 {
    margin-bottom: 15px;
    font-size: 18px;
}

.footer-col p,
.footer-col li {
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 10px;
}

.footer-col a:hover {
    color: #fff;
}

.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-top: 20px;
    text-align: center;
    color: rgba(255, 255, 255, 0.5);
}

.mobile-bottom-nav {
    display: none;
}
.mobile-my-header,
.mobile-my-services { display: none; }
.mobile-recent-invest-list { display: none; }

@media (max-width: 768px) {
    .recent-investments-section { padding: 15px 12px !important; background: transparent !important; box-shadow: none !important; }
    .recent-investments-section .member-section-head { margin-bottom: 11px; }
    .recent-investments-section .member-section-head h4 { color: #163650; font-size: 18px; }
    .recent-investments-section .member-section-head a { padding: 5px 10px; border-radius: 999px; color: #1677d2; background: #eaf5ff; font-size: 12px; }
    .recent-investments-section > .member-table-wrap { display: none !important; }
    .mobile-recent-invest-list { display: grid; gap: 11px; }
    .mobile-recent-invest-card {
        display: block;
        padding: 15px;
        border: 1px solid #e0e9f1;
        border-radius: 13px;
        color: #243b50;
        background: linear-gradient(145deg,#fff,#fbfdff);
        box-shadow: 0 7px 18px rgba(17,45,78,.06);
    }
    .mobile-invest-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; padding-bottom: 12px; border-bottom: 1px solid #edf2f6; }
    .mobile-invest-card-head > div { min-width: 0; }
    .mobile-invest-card-head span,
    .mobile-invest-values span { display: block; margin-bottom: 3px; color: #8795a3; font-size: 10px; }
    .mobile-invest-card-head strong { display: block; overflow: hidden; color: #173650; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
    .mobile-invest-card-head .status-pill { flex: 0 0 auto; margin-top: 2px; font-style: normal; }
    .mobile-invest-values { display: grid; grid-template-columns: 1.15fr 1.15fr .8fr; gap: 8px; padding: 13px 0; }
    .mobile-invest-values > div + div { padding-left: 8px; border-left: 1px solid #edf2f6; }
    .mobile-invest-values strong { color: #102f4a; font-size: 14px; white-space: nowrap; }
    .mobile-invest-values > div:nth-child(2) strong { color: #b17b23; }
    .mobile-invest-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-top: 10px; border-top: 1px dashed #e2eaf0; }
    .mobile-invest-card-foot span { color: #7d8d9c; font-size: 10px; }
    .mobile-invest-card-foot strong { color: #1677d2; font-size: 11px; white-space: nowrap; }
    .mobile-recent-empty { padding: 28px 12px; border-radius: 12px; color: #82909e; background: #fff; text-align: center; }
}

/* Login/Register Pages */
.login-page,
.register-page {
    background: linear-gradient(135deg, #1890ff 0%, #001529 100%);
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.login-container,
.register-container {
    width: 100%;
    max-width: 400px;
    padding: 20px;
}

.login-box,
.register-box {
    background: #fff;
    border-radius: 10px;
    padding: 40px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.login-header,
.register-header {
    text-align: center;
    margin-bottom: 30px;
}

.login-header h2,
.register-header h2 {
    font-size: 28px;
    color: #333;
    margin-bottom: 10px;
}

.login-header p,
.register-header p {
    color: #666;
}

.form-group {
    margin-bottom: 20px;
}

.form-group label {
    display: block;
    margin-bottom: 8px;
    color: #333;
    font-weight: 500;
}

.form-group input {
    width: 100%;
    padding: 12px 15px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 14px;
    transition: border-color 0.3s;
}

.form-group input:focus {
    outline: none;
    border-color: #1890ff;
}

.input-with-btn {
    display: flex;
    gap: 10px;
}

.input-with-btn input {
    flex: 1;
}

.btn-send-code {
    padding: 12px 15px;
    background: #1890ff;
    color: #fff;
    border: none;
    border-radius: 4px;
    white-space: nowrap;
}

.btn-send-code:disabled {
    background: #ccc;
}

.btn-login,
.btn-register {
    width: 100%;
    padding: 14px;
    background: #1890ff;
    color: #fff;
    border: none;
    border-radius: 4px;
    font-size: 16px;
    cursor: pointer;
    transition: background 0.3s;
}

.btn-login:hover,
.btn-register:hover {
    background: #001529;
}

.form-footer {
    text-align: center;
    margin-top: 20px;
    color: #666;
}

.form-footer a {
    color: #1890ff;
}

.forgot-link {
    float: right;
    color: #1890ff;
    font-size: 12px;
}

.login-options {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.remember-option {
    margin: 0;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #555;
    font-size: 13px;
    font-weight: 400;
    cursor: pointer;
}

.remember-option input {
    width: 15px;
    height: 15px;
    accent-color: #1890ff;
}

.login-options .forgot-link {
    float: none;
}

.checkbox-group {
    display: flex;
    align-items: center;
    gap: 8px;
}

.checkbox-group input {
    width: auto;
}

/* Member Center */
.member-dashboard-page {
    min-height: 100vh;
    background:
        linear-gradient(180deg, rgba(9, 28, 50, 0.08), rgba(245, 248, 252, 0.92) 310px),
        linear-gradient(135deg, #eef4fb 0%, #f7f9fc 48%, #edf2f7 100%);
    color: #152033;
}

.member-header {
    background:
        linear-gradient(90deg, rgba(4, 20, 37, 0.98), rgba(13, 45, 73, 0.96)),
        #041425;
    color: #fff;
    padding: 22px 0;
    border-bottom: 1px solid rgba(201, 168, 106, 0.28);
    box-shadow: 0 14px 34px rgba(4, 20, 37, 0.16);
}

.member-header .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.member-header h2 {
    margin: 0;
    color: #fff;
    font-size: 25px;
    letter-spacing: 0;
}

.member-header .header-right {
    color: rgba(255, 255, 255, 0.86);
}

.member-header .header-right a {
    color: #f5d990;
    margin-left: 8px;
}

.member-container {
    display: flex;
    max-width: 1280px;
    margin: 28px auto 44px;
    padding: 0 15px;
    gap: 24px;
}

.member-sidebar {
    width: 238px;
    min-width: 238px;
    flex: 0 0 238px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 251, 255, 0.98));
    border: 1px solid #dde7f2;
    border-radius: 8px;
    padding: 18px 0;
    box-shadow: 0 18px 42px rgba(15, 35, 68, 0.08);
}

.member-sidebar-brand {
    margin: 0 16px 14px;
    padding: 16px;
    border-radius: 8px;
    background:
        linear-gradient(135deg, #112b46, #173d61);
    border: 1px solid rgba(201, 168, 106, 0.35);
}

.member-sidebar-brand strong,
.member-sidebar-brand span {
    display: block;
}

.member-sidebar-brand strong {
    color: #fff;
    font-size: 18px;
}

.member-sidebar-brand span {
    margin-top: 4px;
    color: #d9bf7b;
    font-size: 12px;
}

.member-sidebar ul li a {
    display: block;
    margin: 3px 12px;
    padding: 12px 16px;
    color: #223044;
    border-radius: 7px;
    transition: all 0.3s;
}

.member-sidebar ul li a:hover,
.member-sidebar ul li a.active {
    background: linear-gradient(90deg, #1677ff, #0f4b7a);
    color: #fff;
    box-shadow: 0 8px 18px rgba(22, 119, 255, 0.18);
}

.member-content {
    flex: 1;
    min-width: 0;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(252, 254, 255, 0.98));
    border: 1px solid #dde7f2;
    border-radius: 8px;
    padding: 30px;
    box-shadow: 0 20px 50px rgba(15, 35, 68, 0.09);
}

.invest-list-table { min-width: 1280px; }
.mobile-invest-list { display: none; }
.invest-list-header { align-items: center; margin-bottom: 25px; padding-bottom: 15px; border-bottom: 1px solid #eee; }
.invest-list-header h3 { margin: 0; padding: 0; border: 0; }
.standalone-back-btn { margin: 0; padding: 9px 14px; border: 1px solid #c9dceb; border-radius: 6px; background: #f7fbff; font-weight: 600; }

.content-header h3 {
    font-size: 22px;
    margin-bottom: 25px;
    padding-bottom: 15px;
    border-bottom: 1px solid #eee;
}

.account-overview {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 15px;
    margin-bottom: 30px;
}

.mobile-member-profile,
.mobile-member-menus {
    display: none;
}

.account-card {
    min-height: 118px;
    padding: 22px;
    border-radius: 8px;
    text-align: center;
    border: 1px solid rgba(15, 35, 68, 0.06);
    box-shadow: 0 12px 28px rgba(15, 35, 68, 0.06);
}

.account-email-alert { margin: 0 0 12px; padding: 9px 12px; border-radius: 6px; font-size: 13px; }
.account-email-alert.success { color: #087443; background: #e7f8ef; }
.account-email-alert.error { color: #b42318; background: #fff0ee; }
.email-bind-cell { display: flex; align-items: center; gap: 12px; }
.email-bind-details { position: relative; }
.email-bind-details summary { color: #1677ff; font-size: 13px; cursor: pointer; list-style: none; }
.email-bind-details summary::-webkit-details-marker { display: none; }
.email-bind-details form { display: flex; gap: 8px; margin-top: 9px; }
.email-bind-details input { width: 220px; padding: 7px 9px; border: 1px solid #ccd8e5; border-radius: 5px; font-size: 13px; }
.email-bind-details button { padding: 7px 12px; border: 0; border-radius: 5px; color: #fff; background: #1677ff; cursor: pointer; white-space: nowrap; }

@media (max-width: 768px) {
    .email-bind-cell { align-items: flex-start; flex-direction: column; gap: 5px; }
    .email-bind-details form { flex-direction: column; }
    .email-bind-details input { width: min(230px, 52vw); }
    .email-bind-details button { align-self: flex-start; }
}

/* Mobile member information architecture */
@media (max-width: 768px) {
    .member-dashboard-page .member-sidebar { display: none !important; }
    .member-dashboard-page .mobile-member-menus,
    .member-dashboard-page .insight-feature-grid,
    .member-dashboard-page .asset-trend-section,
    .member-dashboard-page .account-info,
    .member-dashboard-page .mobile-split-section { display: none !important; }
    .mobile-member-name-row { display: flex; align-items: center; gap: 9px; }
    .mobile-member-name-row h3 { margin: 0; }
    .mobile-member-name-row span {
        padding: 3px 8px;
        border: 1px solid rgba(255,255,255,.42);
        border-radius: 999px;
        color: #fff3cf;
        background: rgba(8,45,85,.2);
        font-size: 11px;
        font-weight: 700;
    }
    .mobile-bottom-nav {
        height: 66px;
        padding-bottom: max(4px, env(safe-area-inset-bottom));
        grid-template-columns: repeat(4, minmax(0,1fr));
    }
    .mobile-bottom-nav a {
        flex-direction: column;
        gap: 2px;
        min-width: 0;
        font-size: 11px;
    }
    .mobile-bottom-nav a i { font-style: normal; font-size: 20px; line-height: 1; }
    .mobile-bottom-nav a span { line-height: 1.2; }
    .member-profile-page,
    .member-invest-page { padding-bottom: 72px; background: #f4f7fb; }
    .member-profile-page .member-header,
    .member-profile-page .member-sidebar,
    .member-profile-page .footer,
    .member-invest-page .member-header,
    .member-invest-page .member-sidebar,
    .member-invest-page .footer { display: none !important; }
    .member-profile-page .member-container,
    .member-invest-page .member-container { padding: 0; }
    .member-profile-page .member-content,
    .member-invest-page .member-content { padding: 14px 12px; }
    .member-invest-page .member-content { min-height: calc(100vh - 72px); border: 0; border-radius: 0; box-shadow: none; }
    .member-invest-page .invest-list-header { margin: 0 -12px 14px; padding: 18px 18px 16px; border: 0; background: linear-gradient(135deg,#123b62,#176fae); }
    .member-invest-page .invest-list-header h3 { color: #fff; font-size: 20px; }
    .member-invest-page .standalone-back-btn { padding: 7px 10px; border-color: rgba(255,255,255,.35); color: #fff; background: rgba(255,255,255,.12); font-size: 11px; }
    .member-invest-page .member-table-wrap { display: none; }
    .mobile-invest-list { display: grid; gap: 12px; }
    .mobile-invest-list-card { display: block; overflow: hidden; padding: 16px; border: 1px solid #e2ebf3; border-radius: 15px; color: #25384a; background: #fff; box-shadow: 0 7px 22px rgba(20,58,92,.07); }
    .mobile-invest-list-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
    .mobile-invest-list-head > div { min-width: 0; }
    .mobile-invest-order { color: #8493a2; font-size: 11px; letter-spacing: .3px; }
    .mobile-invest-list-head h4 { overflow: hidden; margin: 4px 0 0; color: #163753; font-size: 16px; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
    .mobile-invest-list-head .status-pill { flex: 0 0 auto; margin-top: 2px; }
    .mobile-invest-list-amount { margin: 15px 0 13px; padding: 13px 14px; border-radius: 11px; background: linear-gradient(120deg,#f3f8fd,#f8fbfe); }
    .mobile-invest-list-amount span, .mobile-invest-list-values span { display: block; color: #8493a2; font-size: 10px; }
    .mobile-invest-list-amount strong { display: block; margin-top: 3px; color: #123b62; font-size: 22px; letter-spacing: .2px; }
    .mobile-invest-list-values { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
    .mobile-invest-list-values > div + div { padding-left: 9px; border-left: 1px solid #e7edf2; }
    .mobile-invest-list-values strong { display: block; overflow: hidden; margin-top: 4px; color: #34495e; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
    .mobile-invest-list-values > div:nth-child(2) strong { color: #b47a1b; }
    .mobile-invest-list-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 14px; padding-top: 12px; border-top: 1px dashed #dfe8ef; }
    .mobile-invest-list-foot span { color: #8493a2; font-size: 10px; }
    .mobile-invest-list-foot strong { color: #1677d2; font-size: 11px; }
    .mobile-invest-list-foot i { margin-left: 2px; font-size: 17px; font-style: normal; vertical-align: -1px; }
    .mobile-invest-list-empty { padding: 56px 15px; border-radius: 15px; color: #81909f; background: #fff; text-align: center; }
    .mobile-my-header {
        display: flex;
        align-items: center;
        gap: 13px;
        margin: -14px -12px 14px;
        padding: 23px 20px;
        color: #fff;
        background: linear-gradient(135deg,#1688f8,#12517e);
        border-radius: 0 0 20px 20px;
    }
    .mobile-my-header > span {
        display: grid;
        width: 54px;
        height: 54px;
        place-items: center;
        border-radius: 50%;
        color: #1677d2;
        background: #fff;
        font-size: 23px;
        font-weight: 700;
    }
    .mobile-my-header strong,
    .mobile-my-header em { display: block; }
    .mobile-my-header strong { font-size: 19px; }
    .mobile-my-header em { margin-top: 4px; color: #fff0bf; font-size: 12px; font-style: normal; }
    .mobile-my-services {
        display: grid;
        grid-template-columns: repeat(4,minmax(0,1fr));
        gap: 8px;
        margin-bottom: 15px;
        padding: 14px 8px;
        border-radius: 13px;
        background: #fff;
        box-shadow: 0 5px 18px rgba(17,45,78,.06);
    }
    .mobile-my-services a { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 8px 2px; color: #31475c; font-size: 11px; text-align: center; }
    .mobile-my-services i { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 10px; color: #176eb4; background: #edf6ff; font-size: 19px; font-style: normal; }
}

.balance-card {
    background: linear-gradient(135deg, #1677ff, #041425);
    color: #fff;
}

.frozen-card {
    background: linear-gradient(135deg, #f5f7fa, #eef2f7);
}

.invest-card {
    background: linear-gradient(135deg, #fff7e6, #f5e4bd);
}

.principal-card {
    background: linear-gradient(135deg, #eef6ff, #dceafd);
}

.profit-card {
    background: linear-gradient(135deg, #e6fffb, #d8f2ef);
}

.overdue-card {
    background: linear-gradient(135deg, #fff1ef, #ffe2df);
    border-color: #f3c7c2;
}
.overdue-card .card-value { color: #b93b32; }
.overdue-card-action { margin-top: 8px; color: #b45149; font-size: 12px; font-weight: 700; }

.card-title {
    font-size: 14px;
    margin-bottom: 10px;
    opacity: 0.8;
}

.card-value {
    font-size: 24px;
    font-weight: bold;
}

.member-side-ad {
    position: fixed;
    top: 188px;
    z-index: 20;
    width: 178px;
    min-height: 236px;
    padding: 22px 18px;
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(16, 43, 69, 0.96), rgba(9, 28, 50, 0.98));
    border: 1px solid rgba(201, 168, 106, 0.42);
    box-shadow: 0 18px 42px rgba(9, 28, 50, 0.18);
    color: #fff;
}

.member-side-ad-left {
    left: max(22px, calc((100vw - 1660px) / 2));
}

.member-side-ad-right {
    right: max(22px, calc((100vw - 1660px) / 2));
}

.member-side-ad span,
.member-side-ad strong,
.member-side-ad p,
.member-side-ad em {
    display: block;
}

.member-side-ad span {
    margin-bottom: 10px;
    color: #d9bf7b;
    font-size: 13px;
    font-weight: 700;
}

.member-side-ad strong {
    color: #fff;
    font-size: 20px;
    line-height: 1.35;
}

.member-side-ad p {
    margin: 16px 0;
    color: rgba(255, 255, 255, 0.74);
    line-height: 1.7;
}

.member-side-ad em {
    margin-top: 18px;
    padding: 10px 12px;
    border-radius: 6px;
    background: rgba(201, 168, 106, 0.16);
    color: #f5d990;
    font-style: normal;
    font-weight: 700;
}

.quick-actions {
    display: flex;
    gap: 15px;
    margin-bottom: 30px;
}

.action-btn {
    flex: 1;
    padding: 15px;
    text-align: center;
    border-radius: 4px;
    color: #fff;
    font-size: 16px;
}

.recharge-btn {
    background: #1890ff;
}

.withdraw-btn {
    background: #52c41a;
}

.invest-btn {
    background: #ff6b00;
}
.invest-notice-trigger { border: 0; font: inherit; cursor: pointer; }
body.modal-open { overflow: hidden; }
.invest-pause-modal { position: fixed; z-index: 3000; inset: 0; display: none; align-items: center; justify-content: center; padding: 20px; }
.invest-pause-modal.show { display: flex; }
.invest-pause-backdrop { position: absolute; inset: 0; background: rgba(7,25,44,.66); backdrop-filter: blur(3px); }
.invest-pause-dialog {
    position: relative;
    z-index: 1;
    width: min(560px,100%);
    max-height: calc(100vh - 40px);
    overflow-y: auto;
    padding: 30px 32px 27px;
    border: 1px solid rgba(211,170,87,.5);
    border-radius: 18px;
    color: #223a50;
    background: linear-gradient(160deg,#fff 0%,#f8fbfe 68%,#fff8e9 100%);
    box-shadow: 0 28px 80px rgba(4,23,42,.35);
    text-align: center;
}
.invest-pause-close { position: absolute; top: 12px; right: 14px; width: 34px; height: 34px; border: 0; border-radius: 50%; color: #718296; background: #edf2f6; font-size: 23px; line-height: 1; cursor: pointer; }
.invest-pause-mark { display: grid; width: 58px; height: 58px; margin: 0 auto 9px; place-items: center; border-radius: 18px; color: #f5d893; background: linear-gradient(145deg,#173e62,#0a253e); box-shadow: 0 10px 24px rgba(12,45,74,.2); font-size: 15px; font-weight: 800; letter-spacing: 2px; }
.invest-pause-label { color: #b08129; font-size: 11px; font-weight: 700; letter-spacing: 4px; }
.invest-pause-dialog h3 { margin: 8px 0 18px; color: #143653; font-size: 24px; line-height: 1.45; }
.invest-pause-copy { padding: 17px 18px; border-left: 3px solid #d3a743; border-radius: 8px; background: rgba(255,255,255,.82); text-align: left; }
.invest-pause-copy strong { color: #173c59; font-size: 15px; }
.invest-pause-copy p { margin-top: 11px; color: #516678; font-size: 14px; line-height: 1.9; text-align: justify; }
.invest-pause-confirm { width: 100%; margin-top: 20px; padding: 12px; border: 0; border-radius: 9px; color: #fff; background: linear-gradient(135deg,#167fdc,#124d78); box-shadow: 0 8px 18px rgba(18,77,120,.2); font-size: 15px; font-weight: 700; cursor: pointer; }

@media (max-width: 768px) {
    .invest-pause-modal { align-items: flex-end; padding: 12px; }
    .invest-pause-dialog { max-height: calc(100vh - 24px); padding: 25px 19px 19px; border-radius: 20px; }
    .invest-pause-mark { width: 50px; height: 50px; border-radius: 15px; font-size: 13px; }
    .invest-pause-dialog h3 { margin-bottom: 14px; font-size: 20px; }
    .invest-pause-copy { padding: 14px; }
    .invest-pause-copy p { font-size: 13px; line-height: 1.75; }
}

.info-table {
    width: 100%;
    border-collapse: collapse;
}

.info-table td {
    padding: 12px;
    border-bottom: 1px solid #eee;
}

.info-table td:first-child {
    width: 150px;
    color: #666;
}

.member-data-section {
    margin-top: 28px;
}

.member-section-head {
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.member-section-head h4 {
    margin: 0;
    color: #132238;
    font-size: 18px;
}

.section-helper {
    margin: 3px 0 0;
    color: #7b8794;
    font-size: 13px;
}

.bankcard-count {
    padding: 5px 11px;
    border-radius: 999px;
    background: #eaf3ff;
    color: #1769aa;
    font-size: 13px;
    font-weight: 600;
}

#bankcards {
    margin-bottom: 28px;
    scroll-margin-top: 90px;
}

.bankcard-number {
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
    letter-spacing: 0.4px;
}

/* Member message center */
.message-center-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.message-center-header p {
    margin-top: 5px;
    color: #7b8794;
}

.unread-summary {
    padding: 7px 13px;
    border-radius: 999px;
    background: #eaf3ff;
    color: #1769aa;
    font-size: 13px;
    font-weight: 700;
}

.message-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.message-item {
    position: relative;
    display: flex;
    gap: 15px;
    padding: 21px 23px;
    border: 1px solid #e1e8f0;
    border-radius: 9px;
    background: #fff;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.message-item:hover {
    border-color: #b9d5f1;
    box-shadow: 0 9px 24px rgba(20, 54, 88, 0.07);
}

.message-item.unread {
    border-left: 4px solid #218af0;
    background: #fbfdff;
}

.message-state-dot {
    flex: 0 0 auto;
    width: 9px;
    height: 9px;
    margin-top: 8px;
    border-radius: 50%;
    background: #c4ced8;
}

.message-item.unread .message-state-dot { background: #218af0; box-shadow: 0 0 0 4px #e5f2ff; }
.message-body { flex: 1; min-width: 0; }
.message-item-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.message-type { color: #2573b9; font-size: 12px; font-weight: 700; }
.message-item-head h4 { margin-top: 3px; color: #122f4d; font-size: 17px; }
.message-item-head time { flex: 0 0 auto; color: #8b96a2; font-size: 13px; }
.message-content { margin-top: 11px; color: #667584; line-height: 1.75; white-space: pre-wrap; }

.message-empty {
    padding: 90px 20px;
    text-align: center;
    border: 1px dashed #cfd9e4;
    border-radius: 10px;
    background: #fafcfe;
}

.message-empty-icon {
    display: flex;
    width: 54px;
    height: 54px;
    margin: 0 auto 16px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #e8f2fd;
    color: #2777bd;
    font-size: 22px;
    font-weight: 700;
}

.message-empty h4 { color: #243b53; font-size: 18px; }
.message-empty p { margin-top: 6px; color: #8a97a4; }

/* Investment return schedule */
.return-detail-link { display: inline-block; padding: 6px 11px; border: 1px solid #bcd6ef; border-radius: 4px; color: #176db5; background: #f5faff; font-size: 13px; font-weight: 600; }
.return-detail-link:hover { color: #fff; background: #176db5; border-color: #176db5; }
.return-page-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; }
.back-invest-link { display: inline-block; margin-bottom: 7px; color: #337ab7; font-size: 13px; }
.order-reference { padding: 7px 11px; color: #596b7d; background: #f0f4f8; border-radius: 4px; font-family: Consolas, monospace; }
.return-summary-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.return-summary-card { padding: 19px 20px; border: 1px solid #e1e8ef; border-radius: 8px; background: #f9fbfd; }
.return-summary-card span { display: block; margin-bottom: 7px; color: #758391; font-size: 13px; }
.return-summary-card strong { color: #142f4b; font-size: 19px; }
.return-summary-card.gold { background: #fff8e7; border-color: #f0dfb4; }
.return-summary-card.green { background: #edfbf5; border-color: #cdecdc; }
.return-formula-note { margin-top: 17px; padding: 12px 15px; color: #5f6e7e; background: #f3f7fb; border-left: 3px solid #2a82cf; }
.schedule-count { color: #6e7d8b; font-size: 13px; }
.return-schedule-table { min-width: 1000px; }
.payment-status { display: inline-flex; padding: 5px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; }
.payment-status.paid { color: #087b4c; background: #dff7eb; }
.payment-status.partial { color: #8a6200; background: #fff0bd; }
.payment-status.pending { color: #865e00; background: #fff3cf; }
.payment-status.overdue { color: #b42318; background: #fee7e5; }

.member-section-head a {
    color: #1677ff;
    font-weight: 600;
}

.wallet-history-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 28px; }
.wallet-history-links a { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 20px 22px; border: 1px solid #dce6f0; border-radius: 9px; background: #fff; box-shadow: 0 6px 18px rgba(24, 54, 86, 0.05); }
.wallet-history-links strong { color: #163652; font-size: 17px; }
.wallet-history-links span { color: #1677ff; font-size: 13px; font-weight: 600; }
.wallet-history-page .member-data-section { margin-top: 0; }
.history-summary { color: #748292; font-size: 14px; }
.member-pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; margin-top: 22px; }
.member-pagination a, .member-pagination span { min-width: 36px; padding: 8px 11px; border: 1px solid #d8e2ec; border-radius: 5px; text-align: center; background: #fff; color: #35627f; }
.member-pagination .active { color: #fff; border-color: #1685ed; background: #1685ed; }
.member-pagination .disabled { color: #a9b3bd; background: #f5f7f9; }
@media (max-width: 720px) { .wallet-history-links { grid-template-columns: 1fr; } }

.insight-feature-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin-top:26px; }
.insight-feature-card { min-height:126px;padding:18px;border:1px solid #dce7f1;border-radius:10px;background:linear-gradient(145deg,#fff,#f6faff);display:flex;flex-direction:column; }
.insight-feature-card span { color:#2578ba;font-size:13px;font-weight:700; }.insight-feature-card strong { margin-top:12px;color:#16344f;font-size:16px;line-height:1.45; }.insight-feature-card em { margin-top:auto;color:#73869a;font-size:12px;font-style:normal; }
.insight-feature-card.calendar{border-top:3px solid #2a8bed}.insight-feature-card.trend{border-top:3px solid #16a085}.insight-feature-card.reminder{border-top:3px solid #e49b26}.insight-feature-card.statement{border-top:3px solid #7559c7}
.insight-feature-card.health{border-top:3px solid #d05b64}.insight-feature-card.reinvest{border-top:3px solid #258f74}
.health-hero{display:grid;grid-template-columns:220px 1fr;gap:25px;align-items:center;padding:28px;border:1px solid #dfe8f0;border-radius:12px;background:#fff}.health-score-ring{width:170px;height:170px;margin:auto;border:14px solid #dff4eb;border-top-color:#1b9b70;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center}.health-score-ring strong{font-size:42px;color:#167a59}.health-score-ring span{color:#657789}.health-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.health-metric{padding:18px;border-radius:8px;background:#f5f8fb}.health-metric span{display:block;color:#738293;font-size:13px}.health-metric strong{display:block;margin-top:8px;color:#183b58;font-size:22px}.health-advice{margin-top:22px;padding:20px;border-left:4px solid #2786ca;background:#f5faff}.health-advice li{margin:8px 0;color:#536b80}
.reinvest-card{margin-bottom:15px;padding:20px;border:1px solid #dfe8ef;border-radius:10px;background:#fff}.reinvest-card-head{display:flex;justify-content:space-between;gap:15px}.reinvest-card-head strong{color:#173c59;font-size:17px}.reinvest-card-head span{color:#73869a}.reinvest-form{display:grid;grid-template-columns:1fr 1fr auto;gap:12px;align-items:end;margin-top:17px}.reinvest-form label{display:block;color:#536a7e;font-size:13px}.reinvest-form select,.reinvest-form input{width:100%;margin-top:6px;padding:10px;border:1px solid #ccd9e4;border-radius:6px}.reinvest-consent{grid-column:1/-1;display:flex!important;gap:8px;align-items:flex-start}.reinvest-consent input{width:auto;margin-top:3px}.reinvest-security-note{margin-bottom:20px;padding:16px;border:1px solid #f0dfb4;border-radius:8px;background:#fff9e9;color:#705b28}.pause-plan-btn{background:#fff;color:#a24646;border:1px solid #e5bcbc;border-radius:6px;padding:10px 15px;cursor:pointer}.save-plan-btn{background:#1685ed;color:#fff;border:0;border-radius:6px;padding:11px 17px;cursor:pointer}
@media(max-width:760px){.health-hero{grid-template-columns:1fr}.health-metrics{grid-template-columns:1fr}.reinvest-form{grid-template-columns:1fr}.insight-feature-grid{grid-template-columns:1fr}}
.asset-trend-section{scroll-margin-top:30px}.asset-trend-chart{height:250px;padding:22px 20px 12px;display:flex;gap:18px;align-items:stretch;border:1px solid #e1e9f1;border-radius:9px;background:#fff}.trend-column{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center}.trend-value{height:25px;color:#617386;font-size:11px;white-space:nowrap}.trend-track{flex:1;width:min(48px,80%);display:flex;align-items:flex-end;border-radius:6px 6px 0 0;background:#edf3f8;overflow:hidden}.trend-track i{display:block;width:100%;min-height:3px;border-radius:6px 6px 0 0;background:linear-gradient(#36a0ed,#1777bc)}.trend-column>span{margin-top:8px;color:#67798a;font-size:12px}
.smart-reminder-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.smart-reminder-list a{padding:14px 16px;display:grid;grid-template-columns:72px 1fr auto;gap:10px;align-items:center;border:1px solid #e1e9f0;border-radius:8px;background:#fff}.smart-reminder-list span{color:#2178bc;font-weight:700}.smart-reminder-list strong{color:#273f56}.smart-reminder-list em{color:#9a6a10;font-style:normal;font-size:13px}
.smart-message-panel{margin-bottom:24px;padding:19px;border:1px solid #d8e8f5;border-radius:10px;background:#f8fcff}.smart-message-panel>a{display:flex;gap:12px;padding:12px 5px;border-top:1px solid #e3edf5;color:#344f68}.smart-message-panel>a p{margin-top:4px;color:#738599;font-size:13px}
.income-page-toolbar{display:flex;align-items:center;gap:10px}.income-page-toolbar a,.print-statement-btn{padding:8px 12px;border:1px solid #d2dfeb;border-radius:6px;color:#286fa8;background:#fff;cursor:pointer}.income-page-toolbar strong{min-width:105px;text-align:center;color:#213d57}.income-summary-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:22px}.income-summary-card{padding:20px;border:1px solid #dfe8f0;border-radius:9px;background:#fff}.income-summary-card span{display:block;color:#748495;font-size:13px}.income-summary-card strong{display:block;margin-top:8px;color:#153a58;font-size:22px}
.statement-range-form{display:flex;align-items:end;gap:9px}.statement-range-form label{color:#63768a;font-size:12px}.statement-range-form input{display:block;margin-top:5px;padding:8px;border:1px solid #d2dfeb;border-radius:6px;color:#24445f;background:#fff}.statement-range-form button{padding:9px 15px;border:0;border-radius:6px;color:#fff;background:#1685ed;cursor:pointer}
.income-filter-form{margin:0 0 18px;padding:16px 18px;border:1px solid #e0e9f2;border-radius:10px;background:#f8fbfe}.income-filter-form select,.income-filter-form input{display:block;min-width:190px;margin-top:5px;padding:9px 12px;border:1px solid #d2dfeb;border-radius:6px;color:#24445f;background:#fff}.income-filter-form select{padding-right:32px}.income-filter-form .return-detail-link{padding:8px 14px}.income-filter-form .export-income-btn{color:#fff;border-color:#0b9a6c;background:#0b9a6c}
.balance-card-link{text-decoration:none;color:inherit;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}.balance-card-link:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(16,92,185,.22)}.balance-card-action{margin-top:8px;color:rgba(255,255,255,.82);font-size:12px}.fund-balance-summary{display:flex;align-items:baseline;gap:10px}.fund-balance-summary span,.fund-balance-summary em{color:#718096;font-size:13px;font-style:normal}.fund-balance-summary strong{color:#0c6ed5;font-size:22px}.fund-change-amount{font-weight:700}.fund-change-amount.in{color:#07865f}.fund-change-amount.out{color:#d54435}.flow-source{display:inline-flex;padding:4px 9px;border-radius:999px;font-size:12px}.flow-source.history{color:#78560b;background:#fff1c7}.flow-source.live{color:#08775a;background:#d8f7eb}
.fund-export-btn{padding:7px 13px;border-radius:6px;color:#fff;text-decoration:none;background:#08775a}.fund-export-btn:hover{background:#065f49}
@media(max-width:1100px){.return-page-header{align-items:flex-start;flex-direction:column}.income-page-toolbar{width:100%;flex-wrap:wrap}.statement-range-form{flex-wrap:wrap}}
@media(max-width:900px){.insight-feature-grid{grid-template-columns:repeat(2,1fr)}.smart-reminder-list{grid-template-columns:1fr}}@media(max-width:560px){.insight-feature-grid,.income-summary-grid{grid-template-columns:1fr}.asset-trend-chart{gap:7px;padding-left:8px;padding-right:8px}.trend-value{writing-mode:vertical-rl;height:58px}.smart-reminder-list a{grid-template-columns:65px 1fr}.smart-reminder-list em{grid-column:2}}
@media print{.member-header,.member-sidebar,.footer,.income-page-toolbar,.back-invest-link{display:none!important}.member-container,.member-content{width:100%!important;max-width:none!important;margin:0!important;padding:0!important}.member-table-wrap{overflow:visible}}

.member-table-wrap {
    overflow-x: auto;
    background: #fff;
    border: 1px solid #e5eaf2;
    border-radius: 8px;
}

@media (max-width: 768px) {
    .member-table-wrap::before {
        content: "↔ 左右滑动查看完整内容";
        position: sticky;
        left: 0;
        z-index: 2;
        display: flex;
        width: max-content;
        margin: 0;
        padding: 9px 13px;
        align-items: center;
        color: #33729f;
        border-bottom: 1px solid #dceaf4;
        border-radius: 0 0 8px 0;
        background: #eef8ff;
        font-size: 11px;
        font-weight: 600;
    }
    .back-invest-link {
        position: fixed;
        top: 12px;
        left: 12px;
        z-index: 260;
        margin: 0;
        padding: 8px 12px;
        color: #155f98;
        border: 1px solid #d2e4f2;
        border-radius: 999px;
        background: rgba(255,255,255,.96);
        box-shadow: 0 5px 18px rgba(19,58,91,.16);
        font-size: 11px;
        font-weight: 700;
        backdrop-filter: blur(8px);
    }
}

.member-data-table {
    width: 100%;
    min-width: 720px;
    border-collapse: collapse;
}

.member-data-table th {
    padding: 13px 16px;
    background: #f8fafc;
    border-bottom: 1px solid #e5eaf2;
    color: #4b5563;
    text-align: left;
    font-weight: 600;
    white-space: nowrap;
}

.member-data-table td {
    padding: 13px 16px;
    border-bottom: 1px solid #eef2f7;
    color: #1f2937;
    white-space: nowrap;
}

.member-data-table tr:last-child td {
    border-bottom: 0;
}

.member-data-table tr.highlight-active-invest td {
    background: #fff8e7;
    color: #132238;
}

.member-data-table tr.highlight-active-invest td:first-child {
    border-left: 4px solid #d9a441;
}

.member-data-table tr.highlight-active-invest .status-pill.pending {
    color: #7a4d00;
    background: #f8d978;
    box-shadow: 0 6px 14px rgba(217, 164, 65, 0.22);
}

.member-form-card {
    display: grid;
    grid-template-columns: minmax(280px, 520px) minmax(220px, 1fr);
    gap: 28px;
    align-items: start;
}

.member-form {
    padding: 24px;
    border: 1px solid #e5eaf2;
    border-radius: 8px;
    background: #fff;
}

.form-note {
    padding: 24px;
    border-radius: 8px;
    background: #f8fafc;
    border: 1px solid #e5eaf2;
    color: #5f6b7a;
}

.form-note h4 {
    margin: 0 0 12px;
    color: #132238;
    font-size: 18px;
}

.form-note p {
    margin: 0 0 10px;
}

.wallet-overview {
    grid-template-columns: repeat(3, minmax(190px, 1fr));
}

.wallet-actions-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
    margin-bottom: 30px;
}

.wallet-panel {
    border: 1px solid #dde7f2;
    border-radius: 8px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    box-shadow: 0 14px 32px rgba(15, 35, 68, 0.07);
    overflow: hidden;
}

.wallet-panel h4 {
    margin: 0;
    padding: 18px 22px;
    border-bottom: 1px solid #e5eaf2;
    background: #f8fafc;
    color: #132238;
    font-size: 18px;
}

.wallet-panel .member-form {
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.payment-method-selector {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
}

.payment-method-option {
    position: relative;
    min-height: 76px;
    padding: 10px 6px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid #dbe4ed;
    border-radius: 7px;
    background: #fff;
    cursor: pointer;
    transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}

.payment-method-option input { position: absolute; opacity: 0; pointer-events: none; }
.payment-method-option.active { border-color: #2088ee; background: #f4f9ff; box-shadow: 0 0 0 2px rgba(32, 136, 238, 0.1); }
.payment-method-option strong { color: #34495e; font-size: 13px; }
.payment-method-icon { width: 29px; height: 29px; display: flex; align-items: center; justify-content: center; border-radius: 50%; color: #fff; font-weight: 700; }
.payment-method-icon.wechat { background: #18a856; }
.payment-method-icon.alipay { background: #1677ff; }
.payment-method-icon.bank { background: #d39b36; }
.compact-form {
    padding: 22px;
}

.security-list {
    padding: 12px 22px 22px;
}

.security-list div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 15px 0;
    border-bottom: 1px solid #eef2f7;
}

.security-list div:last-child {
    border-bottom: 0;
}

.security-list span {
    color: #6b7280;
}

.security-list strong {
    color: #132238;
    font-weight: 700;
}

/* Page Container */
.page-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 40px 15px;
}

.page-title {
    text-align: center;
    margin-bottom: 40px;
}

.page-title h2 {
    font-size: 32px;
    color: #333;
    margin-bottom: 10px;
}

/* Admin Login */
.admin-login-container {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #001529;
}

.admin-login-box {
    background: #fff;
    padding: 40px;
    border-radius: 8px;
    width: 400px;
}

/* Admin Dashboard */
.admin-wrapper {
    min-height: 100vh;
    background: #f5f7fb;
    color: #1f2937;
}

.admin-top {
    min-height: 92px;
    padding: 16px 28px;
    background:
        linear-gradient(120deg, rgba(255, 255, 255, 0.96), rgba(238, 243, 250, 0.96)),
        linear-gradient(90deg, #c9a86a, #0f3d63);
    color: #152033;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #d6dde8;
    box-shadow: 0 10px 30px rgba(15, 35, 68, 0.08);
}

.admin-top h2 {
    margin: 0;
    min-width: 380px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    font-size: 24px;
    font-weight: 700;
    color: #132238;
    letter-spacing: 0;
}

.admin-top h2 small {
    display: block;
    font-size: 15px;
    font-weight: 600;
    color: #8b6f35;
    letter-spacing: 0;
}

.top-right {
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: 14px;
}

.top-right a {
    color: #17324d;
    padding: 7px 12px;
    border: 1px solid #b9c5d4;
    border-radius: 6px;
    background: #fff;
}

.top-right a:hover {
    background: #17324d;
    color: #fff;
}

.admin-main {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    min-height: calc(100vh - 68px);
}

.admin-menu {
    background: #fff;
    border-right: 1px solid #e5e7eb;
    padding: 18px 12px;
}

.admin-menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.admin-menu li {
    margin-bottom: 6px;
}

.admin-menu a {
    display: block;
    padding: 12px 14px;
    color: #374151;
    border-radius: 6px;
    font-size: 15px;
}

.admin-menu a:hover,
.admin-menu a.active {
    background: #e8f2ff;
    color: #1677ff;
}

.admin-content {
    padding: 28px;
}

.admin-content h2 {
    margin: 0 0 20px;
    font-size: 24px;
    color: #111827;
}

.dashboard-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(160px, 1fr));
    gap: 18px;
}

.admin-page-head {
    margin-bottom: 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.admin-page-head p {
    margin: -10px 0 0;
    color: #6b7280;
}

.admin-alert { margin-bottom: 16px; padding: 12px 15px; border-radius: 7px; font-size: 14px; }
.admin-alert.success { color: #047857; background: #d1fae5; }
.admin-alert.error { color: #b91c1c; background: #fee2e2; }
.admin-filter-form { display: flex; align-items: end; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; padding: 15px; border: 1px solid #e5e7eb; border-radius: 8px; background: #fff; }
.admin-filter-form label, .admin-manual-entry label { color: #4b5563; font-size: 12px; }
.admin-filter-form input, .admin-filter-form select, .admin-manual-entry input, .admin-manual-entry select { display: block; min-width: 150px; margin-top: 5px; padding: 9px 10px; border: 1px solid #d7dee7; border-radius: 6px; color: #1f2937; background: #fff; }
.admin-filter-form button, .admin-manual-entry button { padding: 10px 18px; border: 0; border-radius: 6px; color: #fff; background: #1677ff; cursor: pointer; }
.admin-filter-form > a { padding: 9px 14px; border: 1px solid #d7dee7; border-radius: 6px; color: #4b6580; background: #fff; }
.admin-manual-entry { margin-bottom: 18px; border: 1px solid #cfe0f5; border-radius: 8px; background: #f7fbff; }
.admin-manual-entry summary { padding: 14px 16px; color: #1269c7; font-weight: 600; cursor: pointer; }
.admin-manual-entry form { display: grid; grid-template-columns: repeat(3, minmax(180px, 1fr)); gap: 14px; padding: 4px 16px 16px; }
.admin-manual-entry label.wide, .manual-entry-warning { grid-column: 1 / -1; }
.admin-manual-entry label.wide input { width: 100%; }
.manual-entry-warning { padding: 10px 12px; border-radius: 6px; color: #8b5a00; background: #fff4ce; font-size: 13px; }
.admin-manual-entry button { justify-self: start; }
@media (max-width: 900px) { .admin-manual-entry form { grid-template-columns: 1fr; } .admin-manual-entry label.wide, .manual-entry-warning { grid-column: auto; } }
.admin-manual-entry .manual-check{display:flex;align-items:center;gap:8px;font-size:13px}.admin-manual-entry .manual-check input{display:inline-block;min-width:0;margin:0}.row-edit-details{position:relative}.row-edit-details summary{color:#1677ff;cursor:pointer}.row-edit-details[open]::before{content:"";position:fixed;inset:0;z-index:999;background:rgba(15,23,42,.38)}.row-edit-details form{position:fixed;z-index:1000;left:50%;top:50%;transform:translate(-50%,-50%);width:min(560px,calc(100vw - 40px));max-height:calc(100vh - 60px);overflow:auto;padding:20px;display:grid;grid-template-columns:1fr 1fr;gap:14px;border:1px solid #cfdceb;border-radius:10px;background:#fff;box-shadow:0 20px 60px rgba(15,23,42,.3)}.row-edit-details label{font-size:12px;color:#4b5563}.row-edit-details input{display:block;width:100%;margin-top:4px;padding:8px;border:1px solid #d7dee7;border-radius:5px}.row-edit-details p{grid-column:1/-1;color:#8b5a00;font-size:12px}.row-edit-details button{justify-self:start;padding:8px 15px;border:0;border-radius:5px;color:#fff;background:#1677ff;cursor:pointer}@media(max-width:900px){.row-edit-details form{width:calc(100vw - 30px);grid-template-columns:1fr;max-height:calc(100vh - 30px)}}

.admin-table-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
    overflow: hidden;
}

.admin-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.admin-table th {
    background: #f8fafc;
    color: #4b5563;
    text-align: left;
    font-weight: 600;
    padding: 14px 16px;
    border-bottom: 1px solid #e5e7eb;
}

.admin-table td {
    padding: 14px 16px;
    border-bottom: 1px solid #eef2f7;
    color: #1f2937;
}

.admin-table tr:last-child td {
    border-bottom: 0;
}

.empty-cell {
    text-align: center;
    color: #9ca3af;
    padding: 36px 16px;
}

.status-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 56px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
}

.status-pill.active {
    color: #047857;
    background: #d1fae5;
}

.status-pill.locked {
    color: #b91c1c;
    background: #fee2e2;
}

.status-pill.pending {
    color: #8b5a00;
    background: #fef3c7;
}

.status-pill.expired {
    color: #4b5563;
    background: #e5e7eb;
}

/* Points Mall */
.mall-hero {
    padding: 54px 0;
    background:
        linear-gradient(120deg, rgba(19, 34, 56, 0.92), rgba(139, 111, 53, 0.82)),
        #132238;
    color: #fff;
}

.mall-hero h2 {
    margin: 0 0 10px;
    font-size: 36px;
}

.mall-hero p {
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: 16px;
}

.mall-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px;
}

.mall-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.06);
}

.mall-thumb {
    height: 170px;
    background: linear-gradient(135deg, #eef4fb, #d8c49a);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #17324d;
    font-size: 22px;
    font-weight: 700;
}

.mall-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.mall-body {
    padding: 18px;
}

.mall-body h3 {
    margin: 0 0 8px;
    color: #111827;
    font-size: 18px;
}

.mall-body p {
    min-height: 42px;
    margin: 0 0 14px;
    color: #6b7280;
    line-height: 1.6;
}

.mall-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}

.mall-meta strong {
    color: #8b6f35;
    font-size: 20px;
}

.mall-meta span {
    color: #6b7280;
}

.btn-exchange {
    width: 100%;
    height: 40px;
    border: 0;
    border-radius: 6px;
    background: #17324d;
    color: #fff;
    cursor: not-allowed;
}

.mall-empty {
    padding: 56px 20px;
    text-align: center;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
}

.mall-empty h3 {
    margin: 0 0 8px;
    color: #111827;
}

.mall-empty p {
    margin: 0;
    color: #6b7280;
}

.stat-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 22px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
}

.stat-title {
    color: #6b7280;
    font-size: 14px;
    margin-bottom: 10px;
}

.stat-value {
    color: #1677ff;
    font-size: 30px;
    font-weight: 700;
    line-height: 1.2;
}

/* Responsive */
@media (max-width: 1650px) {
    .member-side-ad {
        display: none;
    }
}

@media (max-width: 768px) {
    .return-summary-grid { grid-template-columns: 1fr; }
    .return-page-header { align-items: flex-start; flex-direction: column; }
    .download-hero { padding: 46px 0 50px; }
    .download-hero h2 { font-size: 30px; }
    .download-main { padding: 36px 0 50px; }
    .download-section-title { align-items: flex-start; flex-direction: column; gap: 6px; }
    .client-download-grid, .finance-download-grid { grid-template-columns: 1fr; }
    .download-card { min-height: auto; padding: 24px; }
    .download-card-body { padding-right: 48px; }
    .download-platform-icon { top: 22px; right: 22px; width: 45px; height: 45px; font-size: 21px; }
    .finance-download-card p { min-height: auto; }
    .third-party-notice { flex-direction: column; gap: 4px; }
    body {
        padding-bottom: 58px;
    }

    .header .container {
        flex-direction: column;
        height: auto;
        padding: 15px;
    }

    .user-area {
        width: 100%;
        justify-content: center;
    }

    .banner {
        padding: 52px 0 74px;
    }

    .banner h2 {
        font-size: 30px;
    }

    .banner p {
        font-size: 16px;
    }

    .banner-btns {
        flex-direction: column;
        align-items: stretch;
        max-width: 260px;
        margin: 0 auto;
    }

    .quick-category-section {
        margin-top: -48px;
    }

    .quick-category-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .quick-category-item {
        min-height: 108px;
        padding: 18px 10px;
    }

    .nav ul {
        flex-wrap: wrap;
        justify-content: center;
        gap: 15px;
    }

    .section {
        padding: 42px 0;
    }

    .product-card-head {
        min-height: auto;
    }

    .stats-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }

    .home-stat-card {
        min-height: 92px;
        padding: 18px 12px;
    }

    .home-stat-card strong {
        font-size: 26px;
    }

    .feature-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .quick-category-grid,
    .market-grid,
    .finance-tools-grid {
        grid-template-columns: 1fr;
    }

    .market-section {
        padding-top: 56px;
    }

    .account-overview {
        grid-template-columns: repeat(2, 1fr);
    }

    .member-container {
        flex-direction: column;
    }

    .member-sidebar {
        width: 100%;
        min-width: 0;
        flex-basis: auto;
    }

    .member-form-card {
        grid-template-columns: 1fr;
    }

    .wallet-overview,
    .wallet-actions-grid {
        grid-template-columns: 1fr;
    }

    .footer-content {
        grid-template-columns: 1fr;
    }

    .admin-top {
        min-height: auto;
        padding: 16px;
        flex-direction: column;
        align-items: center;
        gap: 10px;
    }

    .admin-top h2 {
        min-width: 0;
        font-size: 20px;
    }

    .admin-main {
        grid-template-columns: 1fr;
    }

    .admin-menu {
        border-right: 0;
        border-bottom: 1px solid #e5e7eb;
    }

    .admin-menu ul {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 6px;
    }

    .dashboard-stats {
        grid-template-columns: 1fr;
    }

    .mall-grid {
        grid-template-columns: 1fr;
    }

    .mobile-bottom-nav {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 200;
        height: 58px;
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        background: #fff;
        border-top: 1px solid #e5e7eb;
        box-shadow: 0 -8px 24px rgba(15, 23, 42, 0.08);
    }

    .mobile-bottom-nav a {
        display: flex;
        align-items: center;
        justify-content: center;
        color: #666;
        font-size: 13px;
        font-weight: 600;
    }

    .mobile-bottom-nav a.active {
        color: #1890ff;
    }

    /* Mobile Login Page Optimization */
    .login-page, .register-page {
        background: #fff;
        align-items: flex-start;
        padding-top: 8vh;
    }
    .login-container, .register-container {
        padding: 20px 30px;
    }
    .login-box, .register-box {
        box-shadow: none;
        padding: 0;
        border-radius: 0;
    }
    .login-header h2, .register-header h2 {
        font-size: 32px;
        font-weight: 700;
        text-align: left;
        color: #112d4e;
    }
    .login-header p, .register-header p {
        text-align: left;
        font-size: 15px;
        margin-top: 8px;
    }
    .login-header {
        margin-bottom: 40px;
    }
    .form-group label {
        display: none;
    }
    .form-group input {
        height: 54px;
        font-size: 16px;
        border: none;
        border-bottom: 1px solid #e0e0e0;
        border-radius: 0;
        padding: 10px 5px;
        background: transparent;
    }
    .form-group input:focus {
        border-bottom-color: #1890ff;
    }
    .btn-login, .btn-register {
        height: 54px;
        font-size: 18px;
        border-radius: 27px;
        margin-top: 20px;
        box-shadow: 0 4px 15px rgba(24, 144, 255, 0.3);
    }
    .form-footer {
        margin-top: 30px;
        font-size: 15px;
    }

    /* Mobile Member Center Optimization */
    .member-header {
        display: none;
    }
    .member-dashboard-page {
        background: #f5f7fa;
    }
    .member-container {
        padding: 0;
    }
    .member-sidebar {
        display: none;
    }
    .member-content {
        padding: 15px;
        margin-bottom: 70px;
    }
    .content-header {
        display: none;
    }
    .mobile-member-profile {
        display: flex;
        align-items: center;
        padding: 25px 20px;
        background: linear-gradient(135deg, #1890ff, #0a58ca);
        color: #fff;
        margin: -15px -15px 15px -15px;
        border-bottom-left-radius: 20px;
        border-bottom-right-radius: 20px;
    }
    .mobile-member-avatar {
        width: 60px;
        height: 60px;
        background: #fff;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 24px;
        color: #1890ff;
        font-weight: bold;
        margin-right: 15px;
    }
    .mobile-member-info h3 {
        font-size: 20px;
        margin-bottom: 5px;
    }
    .mobile-member-info p {
        font-size: 13px;
        opacity: 0.8;
    }
    .mobile-member-menus {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        background: #fff;
        border-radius: 12px;
        padding: 15px 10px;
        margin-bottom: 15px;
        box-shadow: 0 2px 10px rgba(0,0,0,0.03);
    }
    .mobile-menu-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        font-size: 13px;
        color: #333;
        text-decoration: none;
    }
    .mobile-menu-item i {
        font-size: 24px;
        margin-bottom: 8px;
        font-style: normal;
    }
    .account-overview {
        gap: 10px;
        margin-bottom: 15px;
    }
    .account-card {
        padding: 15px;
        border-radius: 12px;
        box-shadow: 0 2px 10px rgba(0,0,0,0.03);
    }
    .account-card.balance-card {
        background: #fff;
        border: 1px solid #e0e0e0;
    }
    .insight-feature-grid {
        gap: 10px;
    }
    .insight-feature-card {
        padding: 15px;
        border-radius: 12px;
        box-shadow: 0 2px 10px rgba(0,0,0,0.03);
    }
    .member-data-section {
        background: #fff;
        border-radius: 12px;
        padding: 15px;
        margin-bottom: 15px;
        box-shadow: 0 2px 10px rgba(0,0,0,0.03);
    }
}
.interest-admin-summary { display: flex; gap: 12px; flex-wrap: wrap; }
.interest-admin-summary span { padding: 10px 14px; border-radius: 8px; background: #fff; color: #64748b; }
.interest-admin-summary strong { color: #08775a; }
.interest-paid-amount { color: #08775a; font-weight: 700; }

@media (max-width: 768px) {
    .member-dashboard-page .member-container {
        display: block;
        width: 100%;
        margin: 0;
        padding: 0;
    }
    .member-dashboard-page .member-content {
        width: 100%;
        margin: 0;
        padding: 14px 12px 86px;
        border: 0;
        border-radius: 0;
        box-shadow: none;
        background: #f4f7fb;
    }
    .member-dashboard-page .member-sidebar {
        position: fixed;
        z-index: 900;
        left: 0;
        right: 0;
        bottom: 0;
        display: block;
        width: 100%;
        min-width: 0;
        padding: 7px 5px max(7px, env(safe-area-inset-bottom));
        border: 0;
        border-top: 1px solid #dce6f0;
        border-radius: 0;
        background: rgba(255,255,255,.98);
        box-shadow: 0 -8px 24px rgba(17,45,78,.1);
    }
    .member-dashboard-page .member-sidebar-brand { display: none; }
    .member-dashboard-page .member-sidebar ul {
        display: flex;
        gap: 2px;
        overflow-x: auto;
        scrollbar-width: none;
    }
    .member-dashboard-page .member-sidebar ul::-webkit-scrollbar { display: none; }
    .member-dashboard-page .member-sidebar ul li { flex: 0 0 auto; }
    .member-dashboard-page .member-sidebar ul li a {
        min-width: 72px;
        margin: 0;
        padding: 9px 10px;
        border-radius: 9px;
        color: #53677a;
        font-size: 13px;
        text-align: center;
        white-space: nowrap;
    }
    .member-dashboard-page .member-sidebar ul li a.active {
        color: #fff;
        background: linear-gradient(135deg,#1688f8,#12517e);
        box-shadow: 0 5px 14px rgba(22,119,255,.2);
    }
    .member-dashboard-page .account-overview {
        grid-template-columns: repeat(2,minmax(0,1fr));
        gap: 10px;
    }
    .member-dashboard-page .account-card {
        min-width: 0;
        padding: 16px 14px;
    }
    .member-dashboard-page .account-card .card-value { font-size: 20px; word-break: break-all; }
    .member-dashboard-page .wallet-actions-grid { gap: 14px; }
    .member-dashboard-page .wallet-panel h4 { padding: 15px 16px; font-size: 17px; }
    .member-dashboard-page .member-form { padding: 16px; }
    .member-dashboard-page .member-data-section { overflow: hidden; }
    .member-dashboard-page .footer { display: none; }
}