:root {
    color-scheme: light;
    --fintech-ink: #102a43;
    --fintech-muted: #52677d;
    --fintech-teal: #087f8c;
    --fintech-teal-dark: #086773;
    --fintech-mint: #e7f7f4;
    --fintech-gold: #bd8a2c;
    --fintech-line: #dce7ee;
    --fintech-surface: #ffffff;
    --fintech-background: #edf3f7;
}

html {
    scroll-behavior: smooth;
}

body {
    color: var(--fintech-ink);
    background: var(--fintech-background);
}

a {
    transition: color 180ms ease, background-color 180ms ease, border-color 180ms ease;
}

button,
input,
select,
textarea {
    font: inherit;
}

button,
input[type="submit"],
input[type="button"] {
    transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease;
}

button:hover,
input[type="submit"]:hover,
input[type="button"]:hover {
    filter: brightness(1.04);
}

input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
select,
textarea {
    border-color: #cbd9e2;
    border-radius: 8px;
}

input:focus,
select:focus,
textarea:focus {
    outline: 3px solid rgba(8, 127, 140, 0.15);
    border-color: var(--fintech-teal);
}

body:has(> aside) {
    background: var(--fintech-background);
}

aside {
    background: linear-gradient(180deg, #102a43 0%, #0a1d30 100%);
    border-right: 1px solid rgba(16, 42, 67, 0.1);
}

.sidebar-header {
    color: #70ded1;
    border-bottom-color: rgba(255, 255, 255, 0.1);
    min-height: 72px;
    padding: 14px 18px;
    gap: 9px;
    font-size: 13px;
    letter-spacing: 0.4px;
}

.sidebar-logo {
    display: block;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    object-fit: contain;
    border-radius: 50%;
    background: transparent;
    border: 1px solid #ffffff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}

.sidebar-header.has-brand-video {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: #102a43 url('hero-video-poster.jpg') center / cover no-repeat;
}

.sidebar-header.has-brand-video::before {
    position: absolute;
    inset: 0;
    z-index: -1;
    content: "";
    background: rgba(7, 23, 39, 0.6);
    pointer-events: none;
}

.sidebar-brand-video {
    position: absolute;
    inset: 0;
    z-index: -2;
    width: 100%;
    height: 100%;
    object-fit: cover;
    pointer-events: none;
    opacity: 0;
}

.sidebar-brand-video.is-ready {
    opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
    .sidebar-brand-video {
        display: none;
    }
}

.member-brand-copy {
    display: grid;
    min-width: 0;
    flex: 1;
    gap: 5px;
}

.member-welcome {
    color: #ffffff;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1.25;
}

.member-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    width: fit-content;
    color: #9cebd4;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1.2;
}

.member-status::before {
    width: 7px;
    height: 7px;
    flex: 0 0 7px;
    content: "";
    border-radius: 50%;
    background: #34d399;
    box-shadow: 0 0 0 3px rgba(52, 211, 153, 0.15);
}

.member-status.is-guest {
    color: #f3d28b;
}

.member-status.is-guest::before {
    background: #f3b84b;
    box-shadow: 0 0 0 3px rgba(243, 184, 75, 0.15);
}

.wallet-meta {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
}

.wallet-score {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 6px 12px;
    border: 1px solid rgba(185, 245, 235, 0.38);
    border-radius: 999px;
    color: #d9fff7;
    background: rgba(255, 255, 255, 0.12);
    font-size: 13px;
    font-weight: 800;
    white-space: nowrap;
}

.investment-table-scroll {
    max-width: 100%;
}

.stock-ticker,
.ticker-wrap {
    display: flex;
    height: 48px;
    min-height: 48px;
    align-items: center;
    padding: 0;
    contain: paint;
    pointer-events: none;
}

.ticker-wrap > .container {
    display: flex;
    flex: 0 0 100%;
    width: 100%;
    height: 100%;
    align-items: center;
}

.ticker-track {
    will-change: transform;
    backface-visibility: hidden;
}

@keyframes ticker-scroll {
    0% { transform: translate3d(0, 0, 0); }
    100% { transform: translate3d(-50%, 0, 0); }
}

.sidebar-header > span {
    min-width: 0;
    flex: 1;
    line-height: 1.2;
}

.nav-links li a {
    display: flex;
    align-items: center;
    gap: 11px;
}

.nav-icon {
    width: 17px;
    height: 17px;
    flex: 0 0 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.ui-icon {
    display: inline-block;
    width: 1.1em;
    height: 1.1em;
    margin-right: 0.4em;
    vertical-align: -0.18em;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.nav-links li a {
    border: 1px solid transparent;
    transition: background-color 180ms ease, color 180ms ease, border-color 180ms ease;
}

.nav-links li a:hover,
.nav-links li a.active {
    color: #ffffff;
    background: rgba(33, 166, 164, 0.2);
    border-color: rgba(112, 222, 209, 0.26);
    box-shadow: inset 3px 0 0 #70ded1;
}

main {
    background:
        radial-gradient(ellipse at 82% 3%, rgba(66, 190, 174, 0.12), transparent 32%),
        linear-gradient(180deg, #f5f9fc 0%, #edf3f7 100%);
}

body:has(> aside) > main > header {
    position: sticky;
    top: 0;
    z-index: 3;
    color: var(--fintech-ink);
    background: rgba(255, 255, 255, 0.92);
    border-bottom: 1px solid var(--fintech-line);
    box-shadow: 0 5px 18px rgba(16, 42, 67, 0.06);
    backdrop-filter: blur(14px);
}

header h1 {
    color: var(--fintech-ink);
}

#userScoreBadge {
    color: #086773 !important;
    background: #e7f7f4 !important;
    border: 1px solid #c5e9e4;
}

.stock-ticker,
.ticker-wrap {
    color: #b9f5eb;
    background: #123750;
    border-color: rgba(16, 42, 67, 0.12);
}

.content {
    background-image: radial-gradient(circle at 1px 1px, rgba(25, 108, 128, 0.055) 1px, transparent 0);
    background-size: 26px 26px;
}

.page-super-title {
    color: var(--fintech-ink);
    border-bottom-color: var(--fintech-teal);
}

.card,
.section-card,
.stat-card {
    color: var(--fintech-ink);
    background: rgba(255, 255, 255, 0.97);
    border: 1px solid var(--fintech-line);
    border-radius: 14px;
    box-shadow: 0 8px 24px rgba(16, 42, 67, 0.055), 0 1px 2px rgba(16, 42, 67, 0.04);
    transition: transform 220ms ease, box-shadow 220ms ease, border-color 220ms ease;
}

.card h2,
.section-title,
.bod-main-title {
    color: var(--fintech-ink);
    border-color: var(--fintech-teal);
}

.financial-card,
.nav-snapshot-card,
.distribution-card,
.manager-card,
.fund-card {
    background: rgba(255, 255, 255, 0.97);
}

.financial-period {
    color: #086773;
    background: var(--fintech-mint);
    border-color: #c5e9e4;
}

.financial-highlight,
.fund-info-item,
.fund-eligibility li,
.manager-profile,
.manager-mandate-item {
    color: var(--fintech-ink);
    background: linear-gradient(145deg, #ffffff, #f7fafc);
    border-color: var(--fintech-line);
    box-shadow: 0 5px 14px rgba(16, 42, 67, 0.045);
}

.financial-highlight {
    border-top-color: var(--fintech-teal);
}

.financial-highlight-label,
.financial-highlight-year,
.fund-info-label,
.manager-mandate-item span {
    color: #688095;
}

.financial-highlight-value,
.fund-info-value {
    color: var(--fintech-ink);
}

.financial-table-wrap,
.nav-table-wrap,
.distribution-table-wrap {
    border-color: var(--fintech-line);
    background: #ffffff;
}

.financial-table,
.nav-table,
.distribution-table {
    color: #334e68;
}

.financial-table thead th,
.nav-table thead th,
.distribution-table thead th {
    color: #ffffff;
    background: #123750;
}

.financial-table thead tr:first-child th {
    color: #d9f4f1;
    background: #0d2c43;
}

.financial-table tbody tr:nth-child(even),
.nav-table tbody tr:nth-child(even),
.distribution-table tbody tr:nth-child(even) {
    background: #f5f9fb;
}

.financial-table .latest-year,
.financial-table tbody tr:first-child td.latest-year,
.nav-table tbody tr:first-child,
.distribution-table tbody tr:first-child {
    color: #153c50;
    background: #eaf7f4;
}

.financial-table thead .latest-year {
    color: #ffffff;
    background: var(--fintech-teal);
}

.financial-table th,
.financial-table td,
.nav-table th,
.nav-table td,
.distribution-table th,
.distribution-table td {
    border-bottom-color: #e4edf2;
}

.financial-updated,
.distribution-updated {
    color: #688095;
}

.financial-updated::before {
    background: #15a88a;
    box-shadow: 0 0 0 3px #def5ee;
}

.nav-total-panel {
    color: #ffffff;
    background: linear-gradient(115deg, #103c56, #087f8c 72%, #1a9b91);
    border: 1px solid rgba(8, 127, 140, 0.22);
    box-shadow: 0 13px 26px rgba(8, 91, 112, 0.18);
}

.nav-total-label,
.nav-total-asof {
    color: rgba(255, 255, 255, 0.82);
}

.nav-total-value span {
    color: #ffe3a3;
}

.distribution-total {
    color: #476479;
    background: #fff9e9;
    border-left-color: var(--fintech-gold);
}

.distribution-total strong {
    color: #966a1b;
}

.manager-mandate-item strong {
    color: var(--fintech-teal);
}

.manager-profile h4 {
    color: var(--fintech-teal-dark);
}

.manager-award {
    background: linear-gradient(155deg, #fffdf7, #f8fbfc);
    border-color: #e8d8ae;
    box-shadow: 0 8px 18px rgba(16, 42, 67, 0.055);
    transition: transform 220ms ease, box-shadow 220ms ease;
}

.manager-award:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 24px rgba(16, 42, 67, 0.1);
}

.manager-award::before {
    color: var(--fintech-gold);
    border-color: #d5b76b;
}

.manager-award-source,
.manager-award-recipient {
    color: #688095;
}

.manager-award-title {
    color: #193b56;
}

.fund-card::after {
    color: rgba(8, 127, 140, 0.04);
}

.fund-guardrail {
    border-color: #cbe9e8;
    background: linear-gradient(110deg, #effaf8, #f8fbfc);
}

.fund-guardrail-mark {
    color: #ffffff;
    background: linear-gradient(145deg, #0a8790, #26a995);
    box-shadow: 0 6px 14px rgba(8, 127, 140, 0.2);
}

.fund-guardrail strong {
    color: #08717a;
}

.fund-guardrail p {
    color: #526f7f;
}

.announcement-section {
    padding: 68px 0;
    background: linear-gradient(180deg, #f7fafc, #edf3f7);
    scroll-margin-top: 92px;
}

.announcement-section-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 24px;
}

.announcement-eyebrow,
.news-category {
    color: #a2761c;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.2px;
}

.announcement-section-heading h2 {
    margin: 5px 0 0;
    color: var(--fintech-ink);
    font-size: clamp(28px, 4vw, 36px);
}

.announcement-all-link,
.announcement-read-link {
    color: var(--fintech-teal-dark);
    font-size: 14px;
    font-weight: 800;
}

.announcement-preview {
    display: grid;
    grid-template-columns: minmax(250px, 0.9fr) minmax(0, 1.4fr);
    overflow: hidden;
    border: 1px solid var(--fintech-line);
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 12px 30px rgba(16, 42, 67, 0.08);
}

.announcement-preview-image {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: stretch;
    min-height: 250px;
    overflow: hidden;
    background: #14283c;
}

.announcement-preview-image img {
    width: 100%;
    height: 100%;
    min-height: 250px;
    object-fit: cover;
}

.announcement-preview-badge {
    position: absolute;
    top: 16px;
    left: 16px;
    padding: 7px 10px;
    border-radius: 5px;
    color: #ffffff;
    background: #a82026;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.7px;
}

.announcement-preview-copy {
    align-self: center;
    padding: 28px clamp(22px, 4vw, 42px);
}

.announcement-preview-copy time {
    color: #7a8b9a;
    font-size: 13px;
}

.announcement-preview-copy h3 {
    margin: 10px 0 12px;
    color: #263d51;
    font-size: clamp(20px, 2.4vw, 27px);
    line-height: 1.25;
}

.announcement-preview-copy h3 a {
    color: inherit;
    text-decoration: none;
}

.announcement-preview-copy p {
    margin: 0 0 18px;
    color: #52677d;
    line-height: 1.65;
}

.public-news-page {
    min-height: 100vh;
    background: #f5f7f9;
    font-family: "Segoe UI", Arial, sans-serif;
}

.public-news-page a {
    text-decoration: none;
}

.public-news-page a:hover {
    text-decoration: underline;
}

.public-news-header {
    position: sticky;
    top: 0;
    z-index: 10;
    color: #ffffff;
    background: rgba(9, 24, 40, 0.97);
    box-shadow: 0 5px 18px rgba(5, 18, 32, 0.18);
    backdrop-filter: blur(12px);
}

.public-news-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    width: min(1120px, calc(100% - 40px));
    min-height: 76px;
    margin: 0 auto;
}

.public-news-brand {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: #ffffff;
    font-weight: 800;
    letter-spacing: 0.3px;
}

.public-news-brand img {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    object-fit: contain;
    background: #ffffff;
}

.public-news-links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 22px;
}

.public-news-links a {
    color: rgba(255, 255, 255, 0.8);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.3px;
    text-transform: uppercase;
}

.public-news-links a:hover,
.public-news-links a[aria-current="page"] {
    color: #ffd15b;
}

.news-hero {
    display: grid;
    place-items: center;
    min-height: 260px;
    padding: 36px 20px;
    color: #ffffff;
    text-align: center;
    background:
        linear-gradient(90deg, rgba(4, 15, 26, 0.76), rgba(4, 15, 26, 0.58)),
        url("image_17a503.jpg") center 43% / cover;
}

.news-hero h1 {
    max-width: 1000px;
    margin: 0 auto 10px;
    color: #ffffff;
    font-size: clamp(32px, 5vw, 48px);
    line-height: 1.15;
}

.news-breadcrumb {
    color: rgba(255, 255, 255, 0.82);
    font-size: 14px;
}

.news-breadcrumb a {
    color: #ffd15b;
}

.news-page-main {
    width: min(1120px, calc(100% - 40px));
    margin: 0 auto;
    padding: 38px 0 72px;
}

.news-page-heading {
    margin: 0 0 28px;
    color: #263d51;
    font-size: 28px;
    text-align: center;
}

.news-page-heading::before,
.news-page-heading::after {
    display: inline-block;
    width: 34px;
    height: 2px;
    margin: 0 14px 8px;
    background: #d3a334;
    content: "";
}

.news-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 330px), 1fr));
    gap: 24px;
}

.news-card {
    overflow: hidden;
    border: 1px solid #e7ebef;
    background: #ffffff;
    box-shadow: 0 10px 28px rgba(16, 42, 67, 0.07);
    transition: transform 200ms ease, box-shadow 200ms ease;
}

.news-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 34px rgba(16, 42, 67, 0.12);
}

.news-card-image {
    position: relative;
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    height: 220px;
    overflow: hidden;
    background: #122b43;
}

.news-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.news-card-image img:first-child {
    object-position: top center;
}

.news-card-image img:nth-child(2) {
    object-position: top center;
}

.news-card-image--poster {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #e9eef2;
}

.news-card-image--poster img {
    width: auto;
    max-width: 100%;
    height: 100%;
    object-fit: contain;
}

.news-card-image--service {
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 12px;
    color: #e8f6f6;
    background:
        radial-gradient(circle at 50% 15%, rgba(112, 222, 209, 0.2), transparent 36%),
        linear-gradient(145deg, #153b54, #0b2137);
    text-align: center;
}

.news-card-image--service svg {
    width: 54px;
    height: 54px;
    fill: none;
    stroke: #f0c04f;
    stroke-width: 1.4;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.news-card-image--service span {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.1px;
}

.news-date-badge {
    position: absolute;
    right: 0;
    bottom: 0;
    padding: 8px 12px;
    color: #ffffff;
    background: #e1aa18;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.news-card-copy {
    padding: 20px 22px 24px;
}

.news-card-copy h2 {
    margin: 8px 0 12px;
    color: #31465a;
    font-size: 20px;
    line-height: 1.3;
}

.news-card-copy h2 a {
    color: inherit;
    text-decoration: none;
}

.news-card-copy p {
    min-height: 68px;
    margin: 0 0 18px;
    color: #5a6e80;
    line-height: 1.55;
}

.news-detail-card {
    overflow: hidden;
    padding: clamp(22px, 5vw, 48px);
    background: #ffffff;
    box-shadow: 0 8px 24px rgba(16, 42, 67, 0.08);
}

.news-detail-title {
    margin: 0 0 14px;
    color: #263d51;
    font-size: clamp(24px, 3.6vw, 34px);
    line-height: 1.25;
}

.news-detail-date {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 26px;
    color: #7a8996;
    font-size: 14px;
}

.news-detail-date svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: #d9a41f;
    stroke-width: 1.8;
}

.news-copy {
    color: #526b7d;
    font-size: 15px;
    line-height: 1.75;
}

.news-copy p {
    margin: 0 0 16px;
}

.news-copy strong {
    color: #354f63;
}

.news-copy a {
    color: #087f8c;
    font-weight: 700;
    overflow-wrap: anywhere;
}

.news-warning {
    margin: 24px 0;
    padding: 18px 20px;
    border-left: 4px solid #c73d3d;
    border-radius: 8px;
    color: #513333;
    background: #fff4f1;
    line-height: 1.65;
}

.news-reference-section {
    margin-top: 44px;
}

.news-reference-section h2 {
    margin: 0 0 16px;
    color: #415a6f;
    font-size: 19px;
}

.news-reference-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 300px));
    gap: 22px;
}

.news-reference-figure {
    margin: 0;
}

.news-reference-figure img {
    width: 100%;
    max-height: 540px;
    object-fit: contain;
    object-position: top center;
    border: 1px solid #e1e7ed;
    background: #f3f5f7;
}

.news-reference-figure figcaption {
    margin-top: 8px;
    color: #647789;
    font-size: 13px;
}

.public-news-footer {
    padding: 24px 20px;
    color: rgba(255, 255, 255, 0.78);
    background: #0b1d2d;
    font-size: 13px;
    text-align: center;
}

@media (max-width: 700px) {
    .announcement-section-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .announcement-preview {
        grid-template-columns: 1fr;
    }

    .announcement-preview-image {
        min-height: 210px;
    }

    .announcement-preview-image img {
        min-height: 210px;
    }

    .public-news-nav {
        align-items: flex-start;
        flex-direction: column;
        justify-content: center;
        gap: 12px;
        padding: 12px 0;
    }

    .public-news-links {
        justify-content: flex-start;
        gap: 12px 18px;
    }

    .news-hero {
        min-height: 230px;
    }

    .news-page-main {
        width: min(100% - 28px, 1120px);
        padding-top: 28px;
    }

    .news-page-heading::before,
    .news-page-heading::after {
        width: 20px;
        margin-right: 8px;
        margin-left: 8px;
    }

    .news-reference-grid {
        grid-template-columns: 1fr;
    }
}

.fund-allocation-item.fixed-income {
    background: linear-gradient(125deg, #123f5c, #176b78);
    box-shadow: 0 10px 20px rgba(16, 73, 93, 0.16);
}

.fund-allocation-item.equities {
    background: linear-gradient(125deg, #806022, #ae842e);
    box-shadow: 0 10px 20px rgba(128, 96, 34, 0.16);
}

.fund-allocation-item span {
    color: rgba(255, 255, 255, 0.88);
}

.fund-eligibility li::before {
    color: var(--fintech-teal);
    background: #e1f5f1;
}

.director-card,
.director-card.chairman {
    background: linear-gradient(145deg, #ffffff, #f4f9fb);
    border: 1px solid var(--fintech-line);
    box-shadow: 0 10px 22px rgba(16, 42, 67, 0.075);
    transition: transform 220ms ease, box-shadow 220ms ease, border-color 220ms ease;
}

.director-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 16px 30px rgba(16, 42, 67, 0.12);
    border-color: #8fcfcf;
}

.director-card.chairman {
    border-color: #e5d19d;
    background: linear-gradient(145deg, #fffdf6, #f4f9fb);
}

.director-photo,
.director-card.chairman .director-photo {
    border-color: #c9e8e7;
    box-shadow: 0 0 0 5px rgba(8, 127, 140, 0.06), 0 8px 18px rgba(16, 42, 67, 0.12);
}

.director-card.chairman .director-photo {
    border-color: #dfc67e;
}

.director-name {
    color: var(--fintech-ink);
}

.director-role {
    color: #08717a;
    background: #e8f7f4;
    border: 1px solid #c5e9e4;
}

.content-text,
.content-list li,
.bod-sub-text,
.fund-intro,
.fund-distribution-note {
    color: var(--fintech-muted);
}

body:has(> aside) .sub-heading {
    color: #193b56;
    font-weight: 800;
}

body:has(> aside) .media-caption {
    color: #36566f;
    font-weight: 700;
}

body:has(> aside) .sub-heading {
    color: #193b56 !important;
}

body:has(> aside) .bod-intro-text {
    color: #405a70;
}

body:has(> aside) .nav-prices-title,
body:has(> aside) .distribution-subtitle,
body:has(> aside) .manager-section-label,
body:has(> aside) .fund-subtitle {
    color: #193b56;
    font-weight: 800;
}

body:has(> aside) .manager-copy,
body:has(> aside) .manager-profile p,
body:has(> aside) .fund-guardrail p,
body:has(> aside) .fund-intro,
body:has(> aside) .fund-distribution-note {
    color: #405a70;
}

body:has(> aside) .manager-profile h4 {
    color: #075d67;
}

body:has(> aside) .manager-award-source,
body:has(> aside) .manager-award-recipient {
    color: #4c6579;
}

body:has(> aside) .manager-award-title {
    color: #183b56;
}

body:has(> aside) .fund-info-label {
    color: #4c6579;
}

.wallet-box {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    background: linear-gradient(115deg, #103c56, #087f8c 72%, #1a9b91);
    box-shadow: 0 13px 26px rgba(8, 91, 112, 0.18);
}

.wallet-box::before {
    content: "";
    position: absolute;
    top: -60%;
    right: -12%;
    z-index: -1;
    width: 280px;
    height: 280px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(185, 245, 235, 0.32), rgba(185, 245, 235, 0) 68%);
    animation: walletGlow 6s ease-in-out infinite alternate;
    pointer-events: none;
}

.wallet-box::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(105deg, transparent 35%, rgba(255, 255, 255, 0.14) 50%, transparent 65%);
    transform: translateX(-120%);
    animation: walletShine 1.4s ease-out .4s 1 forwards;
    pointer-events: none;
}

@keyframes walletGlow {
    from { transform: translate(0, 0) scale(1); opacity: .7; }
    to { transform: translate(-30px, 20px) scale(1.15); opacity: 1; }
}

@keyframes walletShine {
    to { transform: translateX(120%); }
}

.wallet-amount,
.wallet-info .balance {
    color: #b9f5eb;
}

.option-btn {
    color: var(--fintech-ink);
    background: #ffffff;
    border-color: #cbd9e2;
}

.option-btn:hover,
.option-btn.selected {
    color: #ffffff;
    background: var(--fintech-teal);
    border-color: var(--fintech-teal);
}

.custom-input,
.select-box,
.file-upload-box,
.form-group input,
.login-box input,
.register-box input {
    color: var(--fintech-ink);
    background: #f8fbfc;
    border: 1px solid #cbd9e2;
    border-radius: 8px;
}

.file-upload-box {
    border-style: dashed;
}

.btn-submit,
.btn-save,
.login-box button,
.register-box button,
.admin-login-box button {
    color: #ffffff;
    background: linear-gradient(135deg, #087f8c, #15998f);
    box-shadow: 0 8px 18px rgba(8, 127, 140, 0.18);
}

.btn-submit:hover,
.btn-save:hover,
.login-box button:hover,
.register-box button:hover,
.admin-login-box button:hover {
    background: linear-gradient(135deg, #086773, #087f8c);
}

table {
    color: #334e68;
}

th {
    color: #ffffff;
    background: #123750;
}

th,
td {
    border-bottom-color: #e4edf2;
}

tbody tr:nth-child(even) {
    background: #f5f9fb;
}

.page-banner {
    background:
        linear-gradient(110deg, rgba(16, 42, 67, 0.88), rgba(8, 127, 140, 0.75)),
        url("https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?q=80&w=1600&auto=format&fit=crop") center / cover no-repeat;
}

.page-banner .breadcrumb a {
    color: #9ef0e2;
}

body:has(#home) {
    --red: #087f8c;
    --red-dark: #086773;
    --navy: #102a43;
    --navy-2: #123750;
    --gold: #bd8a2c;
    --border: #dce7ee;
    --shadow: 0 12px 28px rgba(16, 42, 67, 0.08);
    background: #edf3f7;
}

body:has(#home) .topbar {
    background: linear-gradient(90deg, #102a43 0%, #123750 100%);
}

body:has(#home) .brand-row {
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 5px 18px rgba(16, 42, 67, 0.07);
    backdrop-filter: blur(14px);
}

body:has(#home) .brand-text strong {
    color: #102a43;
}

body:has(#home) .brand-text span {
    color: #52677d;
}

body:has(#home) .nav a:hover {
    color: #087f8c;
}

body:has(#home) .btn-primary,
body:has(#home) .cta-primary {
    color: #ffffff;
    background: linear-gradient(135deg, #087f8c, #15998f);
    box-shadow: 0 10px 22px rgba(8, 127, 140, 0.18);
}

body:has(#home) .btn-secondary {
    color: #123750;
    border-color: #cbd9e2;
}

body:has(#home) .hero {
    background:
        radial-gradient(ellipse at 78% 18%, rgba(83, 200, 182, 0.22), transparent 34%),
        linear-gradient(125deg, #102a43 0%, #123f59 64%, #087f8c 140%);
}

body:has(#home) .hero-bullets li {
    border-left-color: #70ded1;
}

body:has(#home) .cta-secondary {
    border-color: rgba(255, 255, 255, 0.52);
}

body:has(#home) .ticker-wrap {
    color: #b9f5eb;
    background: #123750;
}

body:has(#home) .section:nth-of-type(even),
body:has(#home) .faq {
    background: #f5f9fc;
}

body:has(#home) .section-header h2,
body:has(#home) .faq-title,
body:has(#home) .benefit-copy h3 {
    color: #102a43;
}

body:has(#home) .feature-card,
body:has(#home) .mini-card,
body:has(#home) .package-item,
body:has(#home) .faq-item,
body:has(#home) .hero-card {
    border-color: #dce7ee;
    box-shadow: 0 8px 24px rgba(16, 42, 67, 0.06);
}

body:has(#home) .package-trigger:hover,
body:has(#home) .package-item.active .package-trigger {
    border-color: #78cfc7;
    background: #f1faf8;
}

body:has(#home) .package-tag {
    color: #086773;
    background: #e7f7f4;
}

body:has(#home) .package-cta {
    color: #ffffff;
    background: linear-gradient(135deg, #087f8c, #15998f);
}

body:has(#home) footer,
body:has(#home) .footer {
    color: #d9e7ef;
    background: #102a43;
}

.form-group label,
label {
    color: #36566f;
}

.about-btn-box {
    background: #eaf7f4;
    border-color: #c5e9e4;
}

.about-btn-box span {
    color: #086773;
}

.about-btn-box a {
    color: #ffffff;
    background: var(--fintech-teal);
}

body:has(> .login-box) .about-btn-box {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    min-height: 72px;
    padding: 12px 13px;
    margin-bottom: 22px;
    color: var(--fintech-ink);
    text-align: left;
    text-decoration: none;
    background: linear-gradient(110deg, #e7f7f4 0%, #f4fbfa 65%, #fffaf0 100%);
    border: 1px solid #a9ddd5;
    border-left: 5px solid var(--fintech-teal);
    border-radius: 11px;
    box-shadow: 0 7px 16px rgba(8, 127, 140, 0.1);
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

body:has(> .login-box) .about-btn-box:hover {
    color: var(--fintech-ink);
    background: linear-gradient(110deg, #def4ef 0%, #effaf8 65%, #fff7e5 100%);
    border-color: #65bdb2;
    box-shadow: 0 11px 23px rgba(8, 127, 140, 0.17);
    transform: translateY(-2px);
}

body:has(> .login-box) .about-btn-box:focus-visible {
    outline: 3px solid rgba(8, 127, 140, 0.32);
    outline-offset: 3px;
}

.about-btn-icon {
    display: grid;
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    place-items: center;
    color: #ffffff;
    background: linear-gradient(145deg, #087f8c, #15998f);
    border-radius: 50%;
    font-family: Georgia, serif;
    font-size: 21px;
    font-weight: 700;
    font-style: italic;
    box-shadow: 0 4px 10px rgba(8, 127, 140, 0.2);
}

.about-btn-copy {
    display: flex;
    flex: 1 1 auto;
    min-width: 0;
    flex-direction: column;
    gap: 4px;
}

body:has(> .login-box) .about-btn-copy > #aboutPromptText {
    color: #0c5963;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.3;
}

.about-btn-hint {
    color: #526f7f;
    font-size: 10px;
    line-height: 1.35;
}

.about-btn-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    flex: 0 0 auto;
    padding: 9px 11px;
    color: #ffffff;
    background: #087f8c;
    border-radius: 7px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.035em;
    white-space: nowrap;
}

body:has(> .login-box) .about-btn-action {
    color: #ffffff;
}

.about-btn-action > span {
    font-size: 15px;
    line-height: 0.8;
    color: #ffffff;
    transition: transform 180ms ease;
}

body:has(> .login-box) .about-btn-box:hover .about-btn-action > span {
    transform: translateX(3px);
}

.register-link a,
.login-link a {
    color: var(--fintech-teal);
}

.login-box,
.register-box,
.admin-login-box {
    color: var(--fintech-ink);
    background: rgba(255, 255, 255, 0.97);
    border: 1px solid rgba(220, 231, 238, 0.95);
    border-radius: 16px;
    box-shadow: 0 18px 45px rgba(16, 42, 67, 0.16);
}

body:has(> .login-box),
body:has(> .register-box),
body:has(> .admin-login-box) {
    min-height: 100vh;
    padding: 20px;
    background:
        radial-gradient(circle at 80% 15%, rgba(69, 193, 177, 0.24), transparent 28%),
        linear-gradient(145deg, #102a43 0%, #123750 55%, #087f8c 140%);
}

.login-box h2,
.register-box h2,
.admin-login-box h2 {
    color: var(--fintech-ink);
}

.admin-shell {
    background: rgba(245, 249, 252, 0.68);
}

body:has(.admin-shell) {
    color: var(--fintech-ink);
    background: linear-gradient(180deg, #edf5f7 0%, #f5f8fb 100%);
}

body:has(.admin-shell) > header {
    background: linear-gradient(100deg, #102a43 0%, #123f59 65%, #087f8c 100%);
}

.section-card,
.stat-card {
    border-color: var(--fintech-line);
}

.table-header-soft {
    background: linear-gradient(180deg, #f8fbfc 0%, #eaf3f6 100%);
}

.menu-button {
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

@media (hover: hover) and (pointer: fine) {
    .card:hover,
    .section-card:hover,
    .stat-card:hover {
        transform: translateY(-3px);
        border-color: #c5d9e4;
        box-shadow: 0 16px 34px rgba(16, 42, 67, 0.1), 0 2px 5px rgba(16, 42, 67, 0.035);
    }
}

@media (max-width: 700px) {
    body:has(> aside) {
        height: auto;
        min-height: 100vh;
        overflow: auto;
        flex-direction: column;
    }

    body:has(> aside) > aside {
        display: contents;
        width: 100%;
        border-right: 0;
        border-bottom: 1px solid rgba(16, 42, 67, 0.12);
    }

    body:has(> aside) > aside > div:first-child {
        position: sticky;
        top: 0;
        z-index: 20;
        flex-shrink: 0;
        order: 0;
        width: 100%;
        min-width: 0;
        color: #ffffff;
        background: linear-gradient(180deg, #102a43 0%, #0a1d30 100%);
    }

    body:has(> aside) .sidebar-header {
        justify-content: center;
        padding: 14px 16px;
    }

    body:has(> aside) .sidebar-logo {
        flex-basis: 46px;
        width: 46px;
        height: 46px;
    }

    body:has(> aside) .member-brand-copy {
        flex: 0 1 auto;
        gap: 5px;
        text-align: left;
    }

    body:has(> aside) .member-welcome {
        font-size: 15px;
    }

    body:has(> aside) .member-status {
        font-size: 12px;
    }

    body:has(> aside) .nav-links {
        display: flex;
        gap: 4px;
        overflow-x: auto;
        padding: 8px 10px;
    }

    body:has(> aside) .nav-links li {
        flex: 0 0 auto;
    }

    body:has(> aside) .nav-links li a {
        margin: 0;
        padding: 9px 11px;
        white-space: nowrap;
    }

    body:has(> aside) > aside > div:last-child {
        order: 2;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        width: 100%;
        padding: 12px 16px !important;
        border-top: 1px solid #dce7ee;
        background: #e5edf2;
    }

    body:has(> aside) #sidebarUser {
        margin-bottom: 0 !important;
        color: #52677d !important;
    }

    body:has(> aside) > aside > div:last-child button,
    body:has(> aside) #authActionButton {
        width: auto !important;
        min-width: 100px;
        padding: 8px 12px !important;
    }

    body:has(> aside) > aside > div:last-child button[onclick="memberLogout()"] {
        min-height: 40px;
        color: #52677d !important;
        background: transparent !important;
        border: 1px solid #b8c8d2 !important;
        border-radius: 8px !important;
        font-size: 13px;
        font-weight: 600 !important;
    }

    body:has(> aside) > main {
        order: 1;
    }

    body:has(> aside) main {
        width: 100%;
        min-height: 0;
        overflow: visible;
    }

    body:has(> aside) > main > .stock-ticker {
        position: sticky;
        top: var(--member-navigation-height, 0px);
        z-index: 19;
    }

    body:has(> aside) > main > header {
        display: none;
    }

    body:has(> aside) > main > header h1 {
        font-size: 16px;
    }

    body:has(> aside) .content {
        padding: 18px 14px;
    }

    body:has(> aside) .card {
        padding: 20px;
        margin-bottom: 18px;
    }

    body:has(> aside) .investment-table-scroll {
        overflow-x: auto;
        overscroll-behavior-x: contain;
    }

    body:has(> aside) .investment-table-scroll table {
        min-width: 640px;
    }

    .page-banner {
        padding: 34px 18px;
    }

    .wallet-box {
        gap: 14px;
        flex-wrap: wrap;
    }

    .wallet-meta {
        align-items: flex-start;
    }

    .login-box,
    .register-box,
    .admin-login-box {
        width: min(100%, 420px);
        padding: 28px 22px;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}
