:root { font-size: 16px; --text: #ffffff; --muted: #d6e4f5; --cyan: #83f0ff; --green: #92f5c6; }
body { color: #fff; }
html body { font-family: "Segoe UI", Inter, system-ui, -apple-system, sans-serif; }
:root { --font-sans: "Segoe UI", Inter, system-ui, -apple-system, sans-serif; }
.admin-signout-button { width: 100%; background: transparent; font-family: inherit; text-align: left; cursor: pointer; }
.admin-signout-button:hover { background: #0d2944; }
.site-header .site-header-inner { gap: 20px; padding-top: 16px; padding-bottom: 16px; }
.site-brand { min-width: 0; flex-shrink: 0; text-decoration: none; }
.site-brand>img { width: 44px; height: 44px; flex-shrink: 0; }
.site-brand>div { min-width: 0; }
body .site-brand>div>span:first-child { font-size: 1.2rem; line-height: 1.2; white-space: nowrap; }
body .site-brand>div>span:last-child { font-size: .62rem; letter-spacing: .16em; line-height: 1.6; white-space: nowrap; margin-top: 4px; }
body .site-brand>div>span>span { font-size: .55rem; letter-spacing: .08em; line-height: 1.4; }
.site-header .site-header-links { display: none; }
.site-header-actions { margin-left: auto; flex-shrink: 0; }
.site-header-actions>a, .site-header-actions>button { min-height: 44px; white-space: nowrap; justify-content: center; }
.site-header-actions svg, .auth-back-link svg { flex-shrink: 0; }
.auth-header { gap: 24px; }
.auth-back-link { margin-left: auto; white-space: nowrap; }
body .hero-title { font-size: clamp(2rem, 4.5vw, 3.7rem); line-height: 1.15; max-width: 19ch; }
.hero-copy { min-width: 0; }
.hero-badge { max-width: 100%; line-height: 1.6; }
.hero-badge>span { flex-shrink: 0; }
.hero-description { max-width: 58ch; }
#sponsor-verify-badge, #sponsor-badge { position: static; display: block; margin-top: 8px; }
#login-modal>div, #register-modal>div, #payment-modal>div { max-height: calc(100dvh - 32px); overflow-y: auto; overscroll-behavior: contain; }
#login-modal>div>button, #register-modal>div>button, #payment-modal>div>button { min-width: 40px; min-height: 40px; }
@media(min-width:1440px) {
    .site-header .site-header-inner { max-width: 1600px; }
    .site-header .site-header-links { display: flex; gap: 18px; font-size: .8rem; }
}
@media(max-width:1100px) {
    .site-header .site-header-inner, .auth-header { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px 12px; padding: 16px 20px; }
    .site-header-inner>.site-brand, .auth-header>.site-brand { grid-column: 1; grid-row: 1; }
    .site-header-inner>.company-menu-toggle, .auth-header>.company-menu-toggle { grid-column: 2; grid-row: 1; min-height: 42px; font-size: .85rem; padding: 8px 10px; }
    .site-header-actions { grid-column: 1 / -1; width: 100%; margin: 0; gap: 12px; }
    .site-header-actions>a, .site-header-actions>button { flex: 1; min-width: 0; min-height: 46px; font-size: .9rem; }
    .auth-back-link { grid-column: 1 / -1; margin: 0; justify-self: start; font-size: .9rem; }
}
@media(max-width:640px) {
    .site-header .site-header-inner, .auth-header { padding: 14px 16px; }
    .site-brand { gap: 10px; }
    .site-brand>img { width: 38px; height: 38px; }
    body .site-brand>div>span:first-child { font-size: 1.05rem; }
    body .site-brand>div>span:last-child { font-size: .55rem; letter-spacing: .13em; }
    body .site-brand>div>span>span { font-size: .5rem; padding: 2px 4px; }
    .landing-hero { padding-top: 32px; padding-bottom: 48px; }
    .hero-badge { font-size: .73rem; margin-bottom: 20px; padding: 10px 14px; border-radius: 16px; animation: none; }
    body .hero-title { font-size: clamp(1.9rem, 8vw, 2.65rem); margin-bottom: 20px; }
    .hero-description { font-size: 1rem; line-height: 1.75; margin-bottom: 24px; }
    .hero-actions { width: 100%; gap: 12px; margin-bottom: 28px; }
    .hero-actions>button { width: 100%; min-height: 50px; justify-content: center; }
    .auth-intro { display: none; }
    .auth-header+main { padding-top: 24px; padding-bottom: 24px; }
    .auth-form-panel { padding: 24px 20px; border-radius: 20px; }
    #login-modal>div, #register-modal>div, #payment-modal>div { padding: 24px 20px; border-radius: 20px; }
    #login-modal>div>div:first-of-type, #register-modal>div>div:first-of-type, #payment-modal>div>div:first-of-type { padding-right: 24px; }
    #login-modal svg, #register-modal svg, #payment-modal svg { flex-shrink: 0; }
    #login-modal [id$="status-box"], #register-modal [id$="status-box"], #payment-modal [id$="status-box"] { overflow-wrap: anywhere; }
    .topbar { height: auto; min-height: 76px; padding: 16px; flex-wrap: wrap; gap: 12px; }
    .topbar-title { min-width: 0; gap: 10px; }
    .topbar-actions { margin-left: auto; }
    .topbar-actions .mode-pill { display: none; }
    .two-columns, .three-columns, .wallet-grid, .reward-grid { grid-template-columns: minmax(0, 1fr); }
}
.text-xs { font-size: .9375rem; line-height: 1.6; } .text-sm { font-size: 1rem; line-height: 1.65; }
[class*="text-[8px]"], [class*="text-[9px]"], [class*="text-[10px]"], [class*="text-[11px]"] { font-size: .875rem; line-height: 1.5; }
[class*="text-[#a2b4cc]"], [class*="text-[#94a3b8]"] { color: #d6e4f5; }
[class*="text-[#63dfef]"] { color: #83f0ff; } [class*="text-[#69ddb1]"] { color: #92f5c6; }
h1 { font-size: clamp(2rem, 4vw, 2.5rem); } h2 { font-size: 1.4rem; } h3 { font-size: 1.125rem; }
.muted, .fine-print, .notice, .detail-list>div, .setup-steps, .nav-item, .topbar-title, .quick-actions>a, .text-link, .button, .sidebar-journey h3 { font-size: 1rem; }
.badge, .eyebrow, .nav-label, .sidebar-footer, .sidebar-footer small, .sidebar-journey p, .sidebar-journey a, .bottom-nav>a, .content-footer, .plan-price, .plan-status { font-size: .875rem; }
.plan-track strong, .transaction-info>strong, .transaction-amount>strong, .balance-label, .balance-value>span, .balance-side>a, .level-numbers, .level-numbers>span { font-size: 1rem; }
.transaction-info>small, .transaction-amount>small, .balance-card p, .balance-side>span, .tour-copy>.muted, .mini-stats small, .mini-stats em, .wallet-card>.fine-print, .wallet-card>strong small, .network-level>small, .target-stats small, .schedule-list small, .schedule-list .badge { font-size: .875rem; }
.nav-item, .bottom-nav>a, .sidebar-footer small { color: #d6e4f5; }
.dashboard-heading h1 { font-size: clamp(2rem, 4vw, 2.75rem); } .dashboard-heading .muted { font-size: 1.0625rem; }
.quick-actions>a { padding: 12px 8px; min-height: 60px; }
.page-heading, .section-heading, .balance-card, .topbar-title, .dashboard-heading>div { flex-wrap: wrap; }
.plan-track { gap: 10px; } .plan-track strong { max-width: none; }
.company-menu-toggle { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 12px; border: 1px solid #83f0ff; border-radius: 10px; background: #103653; color: white; font-weight: 700; }
.company-menu { position: fixed; inset: 0 auto 0 0; margin: 0; height: 100dvh; max-height: 100dvh; width: min(360px, 90vw); padding: 24px; background: #081e3b; color: white; border: 0; border-right: 1px solid #83f0ff; }
.company-menu::backdrop { background: #020d20b3; }
.company-menu-heading { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 24px; }
.company-menu-heading button { background: #153c59; color: white; border: 0; border-radius: 8px; min-width: 44px; min-height: 44px; }
.company-menu nav { display: grid; gap: 12px; } .company-menu nav a { display: block; padding: 14px; border-radius: 10px; background: #103653; color: white; font-size: 1rem; }
.company-menu nav a:hover { background: #1b4e70; color: #83f0ff; } .company-menu nav .company-pdf { color: #061b3a; background: #92f5c6; font-weight: 700; }
@media(max-width:600px) { .quick-actions { grid-template-columns: repeat(2,minmax(0,1fr)); } .balance-card { align-items: flex-start; } .balance-side { align-items: flex-start; } .topbar { height: auto; min-height: 72px; padding-block: 12px; gap: 10px; flex-wrap: wrap; } .plan-track strong { font-size: .875rem; } .company-menu-toggle { padding: 8px; } }

/* Keep larger landing navigation and footer labels usable on narrow screens. */
body>header>div { height: auto; min-height: 80px; padding-top: 12px; padding-bottom: 12px; gap: 12px; flex-wrap: wrap; }
body>footer>div>div { flex-wrap: wrap; justify-content: center; }
@media(max-width:1100px) { body>header nav { display: none; } }

/* Shared reading scale and breathing room across member, admin and public pages. */
:root { font-size: 17px; }
body { font-size: 1rem; line-height: 1.65; }
input, select, textarea, button { font: inherit; }
strong, b { font-weight: 750; }
[class*="text-[12px]"], [class*="text-[13px]"], [class*="text-[14px]"] { font-size: .95rem; line-height: 1.6; }
.main-content { padding: 40px 36px 32px; }
.card { padding: clamp(22px, 2.6vw, 32px); margin-bottom: 26px; }
.page-heading { gap: 24px; margin-bottom: 32px; }
.section-heading { gap: 18px; margin-bottom: 22px; flex-wrap: wrap; }
.two-columns, .wallet-grid, .reward-grid, .mini-stats, .admin-stats,
body .report-profit-grid, body .report-plan-grid, body .report-link-grid { gap: 24px; }
.wallet-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); }
.wallet-card>h2 { min-height: 0; font-size: 1.0625rem; line-height: 1.5; margin-bottom: 14px; }
.wallet-card>strong, .mini-stats strong, .admin-stats strong, body .report-profit-card strong {
    display: block; font-size: clamp(1.8rem, 3vw, 2.5rem); font-weight: 800;
    line-height: 1.2; letter-spacing: -.035em; margin: 16px 0; overflow-wrap: anywhere;
    font-variant-numeric: tabular-nums;
}
.balance-value { font-size: clamp(2.4rem, 4.5vw, 3.25rem); font-weight: 800; line-height: 1.15; margin: 16px 0; overflow-wrap: anywhere; }
.balance-value>span, .wallet-card>strong small, .mini-stats em, body .report-profit-card strong span { font-size: .875rem; font-weight: 600; letter-spacing: 0; }
.mini-stats .small-value, .admin-stats .small-value { font-size: 1.45rem; }
.transaction-amount>strong { font-size: 1.15rem; font-weight: 750; }
.wallet-card>.fine-print, .mini-stats small, .admin-stats small { font-size: .9rem; line-height: 1.6; }
.form-stack { gap: 14px; }
.form-stack label, body .lab-form label { font-size: 1rem; }
.button { padding: 13px 20px; min-height: 48px; line-height: 1.4; }
.card>p+p { margin-top: 12px; }
.detail-list>div, .transaction-row, .device-row { padding-block: 18px; }
body .lab-grid { gap: 24px; }
body .lab-form { gap: 20px; }
body .lab-actions, body .lab-inline { gap: 14px; margin-block: 20px; }
body .lab-help, body .report-note { font-size: .95rem; line-height: 1.7; }
body .lab-table, body .report-table { font-size: .95rem; }
body .lab-table th, body .lab-table td, body .report-table th, body .report-table td { padding: 16px 14px; }
#lab-wallets .lab-table td:last-child { font-size: 1.1rem; font-weight: 750; }
body .report-filter { gap: 18px; }
body .report-filter label { font-size: .95rem; }
@media(max-width:800px) {
    .main-content { padding: 28px 20px; }
    .wallet-grid, .reward-grid, .mini-stats, body .report-profit-grid { gap: 20px; }
    .card { padding: 24px; }
    .balance-card { gap: 24px; }
    body .bottom-nav.admin-nav { grid-template-columns: repeat(7, minmax(86px, 1fr)); overflow-x: auto; }
}
@media(max-width:480px) {
    .main-content { padding: 24px 16px; }
    .card { padding: 22px; }
    .mini-stats, .admin-stats { grid-template-columns: 1fr; }
    .wallet-card>strong, .mini-stats strong, .admin-stats strong, body .report-profit-card strong { font-size: 2rem; }
    .balance-value { font-size: 2.5rem; }
    .topbar-actions { gap: 10px; flex-wrap: wrap; }
}