/* BrextonAI Client Portal — Dark Intelligence UI v5.0
   Visual layer only. Existing API/data/IDs and business logic are untouched. */
:root{
  --bx-bg:#05090e;
  --bx-bg-2:#071019;
  --bx-card:#0b141e;
  --bx-card-2:#0e1b28;
  --bx-card-soft:rgba(12,25,36,.82);
  --bx-line:rgba(139,183,207,.14);
  --bx-line-strong:rgba(86,236,188,.28);
  --bx-text:#f4f8fb;
  --bx-text-soft:#a4b3c2;
  --bx-text-dim:#718294;
  --bx-green:#35edae;
  --bx-green-2:#1fd296;
  --bx-cyan:#4fc5ff;
  --bx-blue:#57a5ff;
  --bx-violet:#8e72ff;
  --bx-gold:#f4b63d;
  --bx-danger:#ff6177;
  --bx-glow:0 22px 70px rgba(0,0,0,.38);
  --bx-radius:24px;
  --ink:var(--bx-text);
  --muted:var(--bx-text-soft);
  --line:var(--bx-line);
  --surface:var(--bx-card-soft);
  --surface2:var(--bx-card);
  --green:var(--bx-green);
  --green2:var(--bx-green-2);
  --cyan:var(--bx-cyan);
  --shadow:var(--bx-glow);
}
html{background:#05090e;color-scheme:dark}
body{
  color:var(--bx-text)!important;
  background:
    radial-gradient(circle at 8% 7%,rgba(44,234,168,.13),transparent 24%),
    radial-gradient(circle at 92% 11%,rgba(61,177,255,.13),transparent 26%),
    radial-gradient(circle at 70% 88%,rgba(96,71,255,.08),transparent 24%),
    linear-gradient(145deg,#05090e 0%,#071019 46%,#050a10 100%)!important;
}
body:before{
  opacity:.55;
  background-image:
    linear-gradient(rgba(105,181,206,.034) 1px,transparent 1px),
    linear-gradient(90deg,rgba(105,181,206,.034) 1px,transparent 1px)!important;
  background-size:48px 48px!important;
  mask-image:linear-gradient(to bottom,#000 8%,transparent 88%)!important;
}
body:after{content:"";position:fixed;z-index:-1;inset:auto -12vw -20vw auto;width:55vw;height:55vw;border-radius:50%;background:radial-gradient(circle,rgba(44,234,168,.10),transparent 67%);filter:blur(25px);pointer-events:none}
::selection{background:rgba(53,237,174,.24);color:#fff}
*{scrollbar-color:rgba(67,224,181,.42) rgba(255,255,255,.035)}
*::-webkit-scrollbar{width:9px;height:9px}*::-webkit-scrollbar-track{background:rgba(255,255,255,.025)}*::-webkit-scrollbar-thumb{background:linear-gradient(180deg,rgba(53,237,174,.65),rgba(79,197,255,.48));border-radius:999px;border:2px solid #081019}

/* Sidebar */
.portal-sidebar{
  width:292px!important;
  padding:18px 14px!important;
  background:
    radial-gradient(circle at 15% 0%,rgba(53,237,174,.11),transparent 28%),
    linear-gradient(180deg,#08111a,#08131d 58%,#061018)!important;
  border-right:1px solid rgba(86,236,188,.13)!important;
  box-shadow:22px 0 65px rgba(0,0,0,.42)!important;
}
.side-head{padding:3px 3px 6px;align-items:center!important}
.brand{padding:7px 7px 17px!important;font-size:25px!important;letter-spacing:-.04em}
.brand:after{content:"LIVE";font:800 8px/1 "DM Sans";letter-spacing:.12em;color:#8df8d3;border:1px solid rgba(53,237,174,.25);padding:5px 7px;border-radius:999px;background:rgba(53,237,174,.065);margin-left:auto;box-shadow:0 0 22px rgba(53,237,174,.06)}
.brand-mark{width:39px!important;height:39px!important;border-radius:13px!important;background:linear-gradient(145deg,#42efb6,#42baf6)!important;color:#04221a!important;box-shadow:0 0 0 1px rgba(255,255,255,.12),0 12px 30px rgba(53,237,174,.18)!important}
.side-nav{gap:4px!important;padding:4px 4px 8px 0!important}
.side-nav a{position:relative;padding:10px 10px!important;border:1px solid transparent;border-radius:14px!important;color:#9eb0c2!important;font-size:13px!important;font-weight:600;letter-spacing:.005em}
.side-nav a:before{content:"";position:absolute;left:0;top:50%;height:0;width:2px;border-radius:99px;background:linear-gradient(var(--bx-green),var(--bx-cyan));transform:translateY(-50%);transition:.22s ease;box-shadow:0 0 12px var(--bx-green)}
.side-nav a:hover{background:rgba(255,255,255,.035)!important;border-color:rgba(255,255,255,.055)!important;color:#e9f6f7!important;transform:translateX(2px)!important}
.side-nav a.active{background:linear-gradient(90deg,rgba(53,237,174,.13),rgba(79,197,255,.055))!important;border-color:rgba(53,237,174,.18)!important;color:#fff!important;box-shadow:inset 0 0 28px rgba(53,237,174,.035),0 10px 28px rgba(0,0,0,.16)!important}
.side-nav a.active:before{height:56%!important}
.nav-icon{width:34px!important;height:34px!important;border-radius:11px!important;background:#0d1d29!important;color:#6ef2c7!important;border:1px solid rgba(115,236,202,.11);box-shadow:inset 0 0 16px rgba(53,237,174,.035)}
.side-nav a.active .nav-icon{background:linear-gradient(145deg,rgba(53,237,174,.15),rgba(79,197,255,.08))!important;color:#82f9d5!important;border-color:rgba(53,237,174,.25);box-shadow:0 0 22px rgba(53,237,174,.08)}
.side-bottom{border-top:1px solid rgba(255,255,255,.07)!important;background:linear-gradient(180deg,rgba(7,17,26,0),rgba(7,17,26,.97) 25%)!important}
.side-user{background:linear-gradient(135deg,rgba(255,255,255,.055),rgba(53,237,174,.035))!important;border:1px solid rgba(255,255,255,.075)!important;border-radius:17px!important}
.avatar{background:linear-gradient(145deg,var(--bx-green),var(--bx-cyan))!important;color:#04201a!important;box-shadow:0 8px 24px rgba(53,237,174,.15)}
.side-user b{color:#f7fbfd}.side-user small{color:#7f94a8!important}
.logout-btn{background:#0b1722!important;border-color:rgba(255,255,255,.075)!important;color:#d8e4eb!important;transition:.2s ease}
.logout-btn:hover{border-color:rgba(255,97,119,.30)!important;color:#fff!important;background:rgba(255,97,119,.08)!important}
.sidebar-scroll-hint{background:#0d1c28!important;border-color:rgba(53,237,174,.18)!important;color:#6ff2c9!important}

/* Main shell */
.portal-main{margin-left:292px!important;padding:24px 26px 42px!important;min-height:100dvh}
.topbar{position:sticky;top:0;z-index:40;margin:-24px -26px 24px;padding:18px 26px;background:linear-gradient(180deg,rgba(5,10,16,.94),rgba(5,10,16,.76));border-bottom:1px solid rgba(255,255,255,.055);backdrop-filter:blur(24px) saturate(1.25)}
.page-kicker{color:#66dfbc!important;font-weight:700;letter-spacing:.12em;text-transform:uppercase;font-size:9px!important}
.page-title{font-size:31px!important;color:#f6fafc!important;letter-spacing:-.045em;text-shadow:0 1px 24px rgba(255,255,255,.035)}
.top-actions{gap:8px!important}.top-pill{position:relative;background:#0b151f!important;border:1px solid rgba(255,255,255,.08)!important;color:#cbd9e2!important;border-radius:13px!important;box-shadow:none!important;padding:10px 13px!important;font-size:12px;transition:.2s}
.top-pill:hover{border-color:rgba(53,237,174,.25)!important;color:#fff!important;background:#0e1c28!important;transform:translateY(-1px)}
.top-pill:last-child:before{content:"";width:6px;height:6px;background:var(--bx-green);border-radius:50%;display:inline-block;margin-right:7px;box-shadow:0 0 10px var(--bx-green)}
.menu-btn{background:#0b151f!important;border-color:rgba(255,255,255,.085)!important;box-shadow:none!important}.menu-btn span{background:#b7cbd7!important}
.content{max-width:1540px!important;margin:0 auto}

/* Generic surfaces */
.glass,.panel,.form-card,.stat,.strategy-card{background:linear-gradient(145deg,rgba(13,25,35,.88),rgba(8,17,26,.91))!important;border:1px solid rgba(138,182,204,.10)!important;box-shadow:0 22px 65px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.018)!important;backdrop-filter:blur(20px) saturate(1.15)!important}
.panel,.form-card,.strategy-card{border-radius:22px!important}.panel:hover,.stat:hover{border-color:rgba(53,237,174,.15)!important}
.muted{color:var(--bx-text-soft)!important}.pill{background:rgba(53,237,174,.085)!important;color:#66ecc4!important;border:1px solid rgba(53,237,174,.12);font-size:9px!important;letter-spacing:.09em!important;padding:6px 9px!important}
.item{background:rgba(255,255,255,.025)!important;border-color:rgba(255,255,255,.07)!important;color:#e9f0f4!important}.item .muted,.item small{color:#7f91a2!important}
.grid-2,.grid-3{gap:15px!important}

/* Dashboard hero */
.hero{min-height:220px;padding:30px!important;background:
  radial-gradient(circle at 80% 20%,rgba(79,197,255,.11),transparent 30%),
  radial-gradient(circle at 12% 78%,rgba(53,237,174,.09),transparent 28%),
  linear-gradient(135deg,rgba(12,28,37,.96),rgba(7,17,26,.92))!important;border-color:rgba(53,237,174,.12)!important}
.hero:before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(89,199,233,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(89,199,233,.035) 1px,transparent 1px);background-size:34px 34px;mask-image:linear-gradient(90deg,#000,transparent 92%)}
.hero:after{width:330px!important;height:330px!important;right:-105px!important;top:-150px!important;background:radial-gradient(circle,rgba(53,237,174,.20),rgba(79,197,255,.06) 48%,transparent 69%)!important;filter:blur(4px)!important}
.hero h2{color:#fff!important;font-size:40px!important;letter-spacing:-.05em}.hero .muted{max-width:760px;color:#91a7b8!important}
.hero-value{padding:20px 0;position:relative!important}.hero-value:before{content:"PORTFOLIO VALUE";display:inline-flex;color:#65edc6;font:800 8px "DM Sans";letter-spacing:.14em;border:1px solid rgba(53,237,174,.14);padding:5px 7px;border-radius:999px;margin-bottom:7px}.hero-value small{color:#8496a7!important}.hero-value strong{font-size:48px!important;color:#fff!important;letter-spacing:-.055em;text-shadow:0 0 40px rgba(79,197,255,.08)}

/* Stats */
.stat-grid{gap:13px!important}.stat{min-height:165px;padding:18px!important;border-radius:21px!important;transition:.22s ease}.stat:hover{transform:translateY(-3px);box-shadow:0 24px 70px rgba(0,0,0,.32),0 0 0 1px rgba(53,237,174,.04)!important}.stat:after{content:"";position:absolute;width:105px;height:105px;border-radius:50%;right:-44px;top:-47px;background:radial-gradient(circle,rgba(53,237,174,.08),transparent 68%)}
.stat-icon{width:42px!important;height:42px!important;border-radius:13px!important;box-shadow:0 12px 30px rgba(0,0,0,.18)!important}.stat small,.stat span{color:#7e90a1!important}.stat strong{color:#f7fbfd!important;font-size:27px!important;letter-spacing:-.035em}
.i-blue{background:linear-gradient(145deg,#288bf5,#44c9ff)!important}.i-green{background:linear-gradient(145deg,#1cc58f,#45efb6)!important}.i-purple{background:linear-gradient(145deg,#7057ed,#9a78ff)!important}.i-gold{background:linear-gradient(145deg,#d6941b,#ffc75a)!important}

/* Strategy cards */
.strategy-card{min-height:440px!important;isolation:isolate;overflow:hidden!important;color:#79f2ca!important}
.strategy-card:after{content:"";position:absolute;z-index:-1;inset:auto -50px -80px auto;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,currentColor,transparent 68%);opacity:.065;filter:blur(4px)}
.strategy-card:hover{transform:translateY(-5px)!important;box-shadow:0 32px 78px rgba(0,0,0,.35),0 0 0 1px rgba(53,237,174,.045)!important}
.strategy-card.zender{color:#43edb3!important}.strategy-card.zello{color:#45c6ff!important}.strategy-card.maxino{color:#b276ff!important}.strategy-card h3{color:#fff!important;font-size:25px!important}.strategy-symbol{width:82px!important;height:82px!important;background:linear-gradient(145deg,rgba(17,33,44,.98),rgba(7,17,25,.98))!important;border-color:color-mix(in srgb,currentColor 25%,transparent)!important;box-shadow:inset 0 0 35px color-mix(in srgb,currentColor 10%,transparent),0 0 38px color-mix(in srgb,currentColor 10%,transparent)!important;text-shadow:0 0 16px currentColor}
.metric{border-color:rgba(255,255,255,.06)!important;color:#f0f5f8!important}.metric span{color:#7f91a3!important}.metric b{color:#f4f8fb!important}
.primary-btn{background:linear-gradient(115deg,#2be1a5,#4cc4ff)!important;color:#031b18!important;border:1px solid rgba(255,255,255,.10)!important;border-radius:13px!important;box-shadow:0 12px 34px rgba(31,210,150,.14)!important;transition:.2s ease!important}.primary-btn:hover{filter:brightness(1.07)!important;box-shadow:0 16px 40px rgba(31,210,150,.19)!important}.secondary-btn{background:#0d1a25!important;color:#c8d6df!important;border-color:rgba(255,255,255,.08)!important}.secondary-btn:hover{border-color:rgba(79,197,255,.25)!important;color:#fff!important}

/* Forms */
label{color:#c8d5de!important;font-size:12px!important;letter-spacing:.01em}
input,select,textarea{background:#07121c!important;color:#f2f7fa!important;border:1px solid rgba(147,187,208,.13)!important;border-radius:12px!important;box-shadow:inset 0 1px 14px rgba(0,0,0,.15)!important}
input::placeholder,textarea::placeholder{color:#617485!important}input:focus,select:focus,textarea:focus{border-color:rgba(53,237,174,.46)!important;box-shadow:0 0 0 3px rgba(53,237,174,.075),0 0 30px rgba(53,237,174,.035)!important}
select{color-scheme:dark}input[readonly]{background:#091620!important;color:#9fb0bd!important}
.status.ok{background:rgba(53,237,174,.075)!important;color:#7bf3cf!important;border-color:rgba(53,237,174,.19)!important}.status.err{background:rgba(255,97,119,.075)!important;color:#ff91a2!important;border-color:rgba(255,97,119,.19)!important}
.copy-btn{background:linear-gradient(115deg,#2be1a5,#4cc4ff)!important;color:#05231e!important}.copy-btn.copied{background:#163448!important;color:#fff!important}

/* Tables & pagination */
.table-wrap{border-radius:17px;border:1px solid rgba(255,255,255,.055);background:rgba(3,10,15,.30)}
.table{color:#dbe6ec!important}.table th{background:#091620!important;color:#7990a1!important;font-size:10px!important;letter-spacing:.08em;text-transform:uppercase}.table th,.table td{border-color:rgba(255,255,255,.055)!important}.table tr:hover td{background:rgba(53,237,174,.025)}
.client-pager{color:#708696!important}.client-pager button{background:#0b1823!important;color:#c9d8e1!important;border-color:rgba(255,255,255,.08)!important}.client-pager button:not(:disabled):hover{border-color:rgba(53,237,174,.25)!important;color:#fff!important}

/* Performance chart */
.performance-head h2,.panel h2,.form-card h2{color:#f6fafc!important}.performance-live-value small{color:#75899c!important}.performance-live-value strong{color:#fff!important}.performance-live-value span{background:rgba(53,237,174,.10)!important;color:#60edc3!important;border:1px solid rgba(53,237,174,.11)}
.performance-meta,.performance-foot{color:#6d8294!important}.performance-meta{border-color:rgba(255,255,255,.055)!important}.client-chart-wrap{background:linear-gradient(180deg,#07131d,#050e16)!important;border-color:rgba(255,255,255,.06)!important;box-shadow:inset 0 0 45px rgba(0,0,0,.18)}
.client-chart-wrap:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(86,150,178,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(86,150,178,.035) 1px,transparent 1px);background-size:42px 42px;pointer-events:none}
.client-chart-empty{color:#6d8091!important}.client-chart-empty b{color:#8da1b1!important}.chart-empty-icon{color:#4bc8ff!important}.chart-grid{stroke:#173044!important}.chart-line{stroke:#35e5aa!important;filter:drop-shadow(0 6px 9px rgba(53,229,170,.23))!important}.chart-point{fill:#08131d!important;stroke:#35e5aa!important}.chart-point.current{fill:#35e5aa!important;stroke:#fff!important}.chart-y-label,.chart-x-label{fill:#657b8c!important}.chart-current-label{fill:#dcfff4!important}

/* Referral withdrawal cards */
.refwd-card{background:#091722!important;border-color:rgba(255,255,255,.07)!important}.refwd-label{color:#7990a1!important}.refwd-value{color:#f4f9fb!important}.refwd-status{border-color:rgba(255,255,255,.08)!important;background:#0d1b27!important}.refwd-status.paid{color:#6cebc4!important}.refwd-status.pending{color:#ffd071!important}.refwd-status.rejected{color:#ff8da0!important}
.bonus-claim-box{background:linear-gradient(135deg,rgba(53,237,174,.055),rgba(79,197,255,.035))!important;border-color:rgba(53,237,174,.16)!important}.bonus-claim-label{color:#dbe9ee!important}

/* Toast / backdrop */
#portalBackdrop{background:rgba(0,5,9,.72)!important;backdrop-filter:blur(8px)!important}.toast{background:#0b1924!important;color:#edf7f7!important;border:1px solid rgba(53,237,174,.15);box-shadow:0 18px 50px rgba(0,0,0,.42)!important}

/* Support widget — visual alignment with main BrextonAI dark website */
.bx48-launch{background:linear-gradient(115deg,#2ce1a5,#4dc4ff)!important;color:#04201b!important;box-shadow:0 18px 50px rgba(28,209,151,.18)!important}
.bx48{background:#07121b!important;border-color:rgba(97,193,219,.16)!important;color:#eef6f8!important;box-shadow:0 32px 100px rgba(0,0,0,.58)!important}
.bx48-head{background:linear-gradient(135deg,#0c202a,#0a1b28)!important;border-color:rgba(255,255,255,.065)!important}.bx48-logo{background:linear-gradient(135deg,#35e5ab,#4fc5ff)!important;color:#05231d!important}.bx48-head small{color:#7f96a8!important}.bx48-iconbtn{background:#0c1b27!important;border-color:rgba(255,255,255,.08)!important;color:#d8e5eb!important}.bx48-chips{background:#07131d!important;border-color:rgba(255,255,255,.06)!important}.bx48-chip{background:#0b1d2a!important;border-color:rgba(79,197,255,.15)!important;color:#b7cbd6!important}.bx48-chip:hover{border-color:rgba(53,237,174,.28)!important;color:#fff!important}.bx48-main{background:#050e16!important}.bx48-log{background:linear-gradient(180deg,#07131c,#050e15)!important}.bx48-bubble{background:#0d2232!important;color:#d8e5eb!important;border:1px solid rgba(103,166,191,.10)}.bx48-row.mine .bx48-bubble{background:linear-gradient(135deg,rgba(25,121,102,.48),rgba(19,88,106,.52))!important;color:#effff9!important;border-color:rgba(53,237,174,.17)!important}.bx48-row.admin .bx48-bubble{background:#0d3b5b!important;color:#fff!important}.bx48-avatar{background:rgba(53,237,174,.09)!important;color:#6aefc5!important}.bx48-agent-banner{background:rgba(79,197,255,.055)!important;border-color:rgba(79,197,255,.13)!important;color:#a9c5d3!important}.bx48-status{background:#07131c!important;border-color:rgba(255,255,255,.06)!important;color:#7f94a5!important}.bx48-form{background:#07111a!important;border-color:rgba(255,255,255,.06)!important}.bx48-form textarea{background:#050e16!important;color:#f1f7f9!important;border-color:rgba(255,255,255,.09)!important}.bx48-send{background:linear-gradient(115deg,#2ce1a5,#4dc4ff)!important;color:#04201b!important}.bx48-history{background:#06111a!important}.bx48-history-head{background:#091823!important;border-color:rgba(255,255,255,.06)!important}.bx48-history-list{background:#06111a!important}.bx48-conv{background:#091823!important;border-color:rgba(255,255,255,.07)!important;color:#e7f0f4!important}.bx48-conv.active{background:rgba(53,237,174,.07)!important;border-color:rgba(53,237,174,.17)!important}.bx48-conv p{color:#7890a1!important}.bx48-empty{color:#8195a6!important}

/* Responsive */
@media(max-width:1200px){.portal-main{padding-left:22px!important;padding-right:22px!important}.topbar{margin-left:-22px;margin-right:-22px;padding-left:22px;padding-right:22px}.hero h2{font-size:35px!important}}
@media(max-width:900px){
 .portal-sidebar{width:min(320px,89vw)!important;transform:translateX(-105%)}.portal-sidebar.open{transform:none}.portal-main{margin-left:0!important;padding:16px 16px 34px!important}.topbar{margin:-16px -16px 18px;padding:13px 16px}.menu-btn{display:block!important}.side-close{display:block!important}.page-title{font-size:26px!important}.hero{min-height:auto;padding:22px!important}.hero h2{font-size:31px!important}.hero-value{text-align:left!important}.top-pill{padding:9px 11px!important}
}
@media(max-width:560px){
 .portal-main{padding:12px 10px 30px!important}.topbar{margin:-12px -10px 16px;padding:11px 10px}.topbar-left{min-width:0}.page-title{font-size:23px!important}.page-kicker{font-size:8px!important}.top-pill.hide-mobile{display:none!important}.top-actions{gap:5px!important}.top-pill{font-size:11px;padding:9px 10px!important}.hero{padding:19px!important;border-radius:19px!important}.hero h2{font-size:28px!important}.hero-value strong{font-size:38px!important}.stat{min-height:145px}.panel,.form-card,.strategy-card{padding:16px!important;border-radius:19px!important}.grid-2,.grid-3{gap:11px!important}.bx48{border-radius:20px!important}.bx48-launch{right:10px!important}
}

/* accessibility and motion */
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}

/* ============================================================
   BrextonAI Client Portal — V5.1 Deep Black / Neon Finance UI
   Inspired by premium crypto-wallet dashboards. Visual only.
   ============================================================ */
:root{
  --bx-bg:#020402;
  --bx-bg-2:#050806;
  --bx-card:#090c09;
  --bx-card-2:#0c100c;
  --bx-card-soft:rgba(10,14,10,.94);
  --bx-line:rgba(128,255,122,.10);
  --bx-line-strong:rgba(86,255,126,.34);
  --bx-text:#f6f8f5;
  --bx-text-soft:#a5ada4;
  --bx-text-dim:#727a72;
  --bx-green:#6cff73;
  --bx-green-2:#20e986;
  --bx-cyan:#34d7ff;
  --bx-blue:#4c8fff;
  --bx-violet:#d95cff;
  --bx-gold:#f8db4a;
  --bx-danger:#ff5470;
  --bx-glow:0 26px 70px rgba(0,0,0,.62);
  --bx-radius:22px;
}
html{background:#010201!important}
body{
  background:
    radial-gradient(circle at 12% 5%,rgba(71,255,95,.10),transparent 22%),
    radial-gradient(circle at 82% 8%,rgba(45,255,142,.06),transparent 19%),
    radial-gradient(circle at 78% 80%,rgba(100,255,89,.04),transparent 22%),
    linear-gradient(180deg,#010201 0%,#030503 42%,#020302 100%)!important;
}
body:before{
  opacity:.28!important;
  background-image:
    linear-gradient(rgba(120,255,133,.028) 1px,transparent 1px),
    linear-gradient(90deg,rgba(120,255,133,.028) 1px,transparent 1px)!important;
  background-size:42px 42px!important;
}
body:after{background:radial-gradient(circle,rgba(103,255,101,.085),transparent 68%)!important}

/* Sidebar becomes much more compact and premium */
.portal-sidebar{
  width:264px!important;
  background:
    radial-gradient(circle at 18% 0%,rgba(95,255,104,.09),transparent 25%),
    linear-gradient(180deg,#050805 0%,#070a07 52%,#030503 100%)!important;
  border-right:1px solid rgba(122,255,119,.08)!important;
  box-shadow:30px 0 70px rgba(0,0,0,.58)!important;
  padding:16px 12px!important;
}
.portal-main{margin-left:264px!important}
.brand{font-size:24px!important;color:#fff!important}
.brand-mark{
  background:radial-gradient(circle at 35% 30%,#9aff8b,#53ff6d 45%,#13df81 100%)!important;
  color:#071007!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.14),0 0 30px rgba(101,255,105,.22)!important;
}
.brand:after{color:#92ff8d!important;border-color:rgba(121,255,111,.22)!important;background:rgba(111,255,103,.055)!important}
.side-nav a{color:#9ea59e!important;border-radius:12px!important}
.side-nav a:hover{background:#0d110d!important;color:#fff!important;border-color:rgba(124,255,124,.09)!important}
.side-nav a.active{
  background:linear-gradient(90deg,rgba(96,255,103,.13),rgba(47,232,128,.035))!important;
  border-color:rgba(115,255,119,.18)!important;
  box-shadow:inset 0 0 30px rgba(94,255,105,.025)!important;
}
.side-nav a:before{background:#65ff6f!important;box-shadow:0 0 15px rgba(101,255,111,.75)!important}
.nav-icon{background:#0a0e0a!important;color:#75ff79!important;border-color:rgba(113,255,119,.08)!important}
.side-user{background:#0a0e0a!important;border-color:rgba(255,255,255,.07)!important}
.logout-btn{background:#070a07!important}

/* Top bar feels like dark native app chrome */
.topbar{
  background:rgba(2,4,2,.88)!important;
  border-bottom:1px solid rgba(255,255,255,.045)!important;
  backdrop-filter:blur(28px) saturate(1.1)!important;
}
.page-kicker{color:#76ff7c!important}
.page-title{color:#f7f8f7!important;text-shadow:none!important}
.top-pill,.menu-btn{background:#080b08!important;border-color:rgba(255,255,255,.065)!important}
.top-pill:hover{background:#0d120d!important;border-color:rgba(105,255,111,.18)!important}
.top-pill:last-child:before{background:#65ff71!important;box-shadow:0 0 12px rgba(101,255,113,.85)!important}

/* Core surfaces: pure black cards with brighter accents */
.glass,.panel,.form-card,.stat,.strategy-card{
  background:linear-gradient(145deg,rgba(11,14,11,.98),rgba(5,7,5,.98))!important;
  border:1px solid rgba(255,255,255,.055)!important;
  box-shadow:0 26px 70px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.018)!important;
  backdrop-filter:blur(18px)!important;
}
.panel:hover,.stat:hover,.strategy-card:hover{border-color:rgba(113,255,119,.17)!important}
.pill{background:rgba(101,255,111,.08)!important;color:#8fff8b!important;border-color:rgba(105,255,116,.13)!important}
.muted{color:#9ba39b!important}
.item{background:#090d09!important;border-color:rgba(255,255,255,.055)!important;color:#f0f3ef!important}

/* Hero now resembles a premium crypto wallet header */
.hero{
  min-height:250px!important;
  padding:34px!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 78% 30%,rgba(113,255,114,.12),transparent 23%),
    radial-gradient(circle at 15% 80%,rgba(64,255,130,.075),transparent 24%),
    linear-gradient(135deg,#090c09 0%,#060806 62%,#020302 100%)!important;
  border-color:rgba(107,255,111,.12)!important;
}
.hero:before{
  background:
    repeating-radial-gradient(ellipse at 88% 38%,transparent 0 18px,rgba(112,255,111,.09) 19px 20px,transparent 21px 36px)!important;
  opacity:.44!important;
  mask-image:linear-gradient(90deg,transparent 35%,#000 77%,transparent 100%)!important;
}
.hero:after{
  width:420px!important;height:420px!important;right:-100px!important;top:-180px!important;
  background:radial-gradient(circle,rgba(108,255,112,.22),rgba(31,226,134,.08) 34%,transparent 68%)!important;
}
.hero h2{font-size:44px!important;font-weight:800!important;max-width:760px!important}
.hero .muted{color:#929b92!important;font-size:15px!important}
.hero-value{
  min-width:290px;padding:22px 24px!important;border:1px solid rgba(110,255,115,.11);
  border-radius:20px;background:linear-gradient(145deg,rgba(13,20,13,.82),rgba(4,8,4,.88));
  box-shadow:0 20px 55px rgba(0,0,0,.34),inset 0 0 40px rgba(92,255,104,.025)
}
.hero-value:before{color:#8fff91!important;border-color:rgba(104,255,113,.15)!important;background:rgba(104,255,113,.05)!important}
.hero-value strong{font-size:50px!important;color:#fff!important;text-shadow:0 0 34px rgba(104,255,111,.09)!important}

/* Stats become finance tiles with neon numbers */
.stat-grid{gap:14px!important}
.stat{min-height:158px!important;padding:20px!important;background:linear-gradient(160deg,#0a0d0a 0%,#050705 100%)!important}
.stat:before{content:"";position:absolute;left:0;top:0;width:100%;height:2px;background:linear-gradient(90deg,transparent,rgba(101,255,111,.42),transparent);opacity:.7}
.stat:after{background:radial-gradient(circle,rgba(104,255,111,.075),transparent 68%)!important}
.stat-icon{background:#0e150e!important;color:#7fff80!important;border:1px solid rgba(115,255,117,.14)!important;box-shadow:0 0 28px rgba(101,255,111,.08)!important}
.stat strong{font-size:29px!important;color:#fff!important}
.stat small,.stat span{color:#838c83!important}

/* Performance panel becomes the centerpiece */
.performance-panel{
  background:linear-gradient(160deg,#080c08,#030503)!important;
  border-color:rgba(109,255,114,.09)!important;
}
.performance-live-value strong{color:#75ff79!important;text-shadow:0 0 26px rgba(105,255,111,.14)!important}
.performance-live-value span{background:rgba(102,255,111,.08)!important;color:#7fff83!important;border:1px solid rgba(109,255,113,.12)!important}
.performance-meta,.performance-foot{border-color:rgba(255,255,255,.045)!important;color:#7d877d!important}
.client-chart-wrap{
  background:
    linear-gradient(rgba(111,255,115,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(111,255,115,.022) 1px,transparent 1px),
    radial-gradient(circle at 50% 100%,rgba(100,255,106,.06),transparent 55%),
    #050805!important;
  background-size:36px 36px,36px 36px,auto,auto!important;
  border-color:rgba(116,255,120,.08)!important;
}
.client-performance-chart .grid-line{stroke:rgba(255,255,255,.05)!important}
.client-performance-chart .chart-line{stroke:#6cff73!important;filter:drop-shadow(0 0 5px rgba(108,255,115,.42))}
.client-performance-chart .chart-area{fill:url(#chartGradient)!important}
.client-performance-chart text{fill:#778078!important}
.client-chart-empty{color:#758075!important}.chart-empty-icon{color:#66ff72!important}

/* Strategy cards get neon strip and stronger hierarchy */
.strategy-card{position:relative;overflow:hidden!important;background:linear-gradient(160deg,#0a0d0a,#050705)!important}
.strategy-card:before{content:"";position:absolute;inset:0 auto 0 0;width:2px;background:linear-gradient(180deg,#69ff71,#23e796,transparent)}
.strategy-card h2,.strategy-card h3{color:#fff!important}
.primary-btn,.btn,.btn-primary,.submit-btn,.action-btn{
  background:linear-gradient(90deg,#6cff73,#29e58f)!important;
  color:#031005!important;
  border:none!important;
  box-shadow:0 15px 38px rgba(71,255,105,.13)!important;
  font-weight:800!important;
}
.primary-btn:hover,.btn-primary:hover,.submit-btn:hover,.action-btn:hover{filter:brightness(1.06);transform:translateY(-1px)!important;box-shadow:0 18px 45px rgba(89,255,104,.20)!important}
.secondary-btn,.btn-secondary{background:#0a0d0a!important;color:#dfe4df!important;border-color:rgba(255,255,255,.07)!important}

/* Inputs and selects: dark native wallet style */
input,select,textarea{
  background:#060906!important;
  border-color:rgba(255,255,255,.075)!important;
  color:#f5f8f5!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.005)!important;
}
input:focus,select:focus,textarea:focus{border-color:rgba(108,255,115,.35)!important;box-shadow:0 0 0 3px rgba(108,255,115,.055)!important;outline:none!important}
label{color:#bac2ba!important}

/* Tables and history sections */
table{background:#050805!important;border-color:rgba(255,255,255,.05)!important}
th{background:#090d09!important;color:#91ff91!important;border-color:rgba(255,255,255,.045)!important}
td{color:#d9ded9!important;border-color:rgba(255,255,255,.045)!important}
tbody tr:hover{background:rgba(105,255,111,.025)!important}
.pagination button,.pager button,.page-btn{background:#080b08!important;color:#bfc6bf!important;border-color:rgba(255,255,255,.06)!important}.pagination button.active,.pager button.active,.page-btn.active{background:#67ff70!important;color:#061006!important}

/* Referral / wallet modules get an actual wallet-like look */
.referral-wallet,.wallet-card,.referral-payout,.withdrawal-card{background:linear-gradient(145deg,#0a0e0a,#050705)!important;border-color:rgba(111,255,116,.10)!important}
.referral-wallet strong,.wallet-card strong{color:#75ff79!important}

/* AI/support chat: deep dark and better contrast */
.bx48{background:#030603!important;border:1px solid rgba(105,255,111,.10)!important;box-shadow:0 30px 90px rgba(0,0,0,.62)!important}
.bx48-head{background:linear-gradient(135deg,#0a120a,#07100a)!important;border-color:rgba(105,255,111,.08)!important}
.bx48-title b{color:#fff!important}.bx48-title small{color:#889288!important}
.bx48-chip{background:#070b07!important;border-color:rgba(255,255,255,.065)!important;color:#aeb6ae!important}.bx48-chip:hover{background:#0c120c!important;color:#8fff91!important;border-color:rgba(103,255,112,.18)!important}
.bx48-main,.bx48-log{background:#030603!important}
.bx48-bubble{background:#0a120a!important;color:#dce2dc!important;border-color:rgba(255,255,255,.055)!important}.bx48-row.mine .bx48-bubble{background:linear-gradient(135deg,#103b1d,#0b2719)!important;border-color:rgba(104,255,112,.16)!important}.bx48-row.admin .bx48-bubble{background:#0e2a24!important}
.bx48-form{background:#050805!important}.bx48-form textarea{background:#020402!important;border-color:rgba(255,255,255,.075)!important}.bx48-send{background:linear-gradient(90deg,#6cff73,#29e58f)!important;color:#051006!important}

/* Tiny decorative activity dots inspired by wallet UI */
.content:before{content:"";position:fixed;z-index:-1;left:38%;top:20%;width:5px;height:5px;border-radius:50%;background:#67ff70;box-shadow:250px 90px 0 rgba(103,255,112,.35),510px 330px 0 rgba(103,255,112,.22),-210px 410px 0 rgba(103,255,112,.18);opacity:.45}

/* Mobile keeps the same visual language */
@media(max-width:900px){
  .portal-sidebar{width:min(296px,88vw)!important}
  .portal-main{margin-left:0!important}
  .hero{padding:24px!important}.hero h2{font-size:34px!important}.hero-value{min-width:0!important;width:100%}
}
@media(max-width:560px){
  .hero{padding:20px!important;border-radius:18px!important}.hero h2{font-size:29px!important}.hero-value strong{font-size:39px!important}
  .stat{min-height:142px!important}.panel,.form-card,.strategy-card{border-radius:18px!important}
}


/* V5.4 launch-polish: higher visibility for financial forms and history */
.form-card input,.form-card select,.form-card textarea,.panel input,.panel select,.panel textarea{
  background:#050a07!important;border:1px solid rgba(177,255,184,.22)!important;color:#f7fff8!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.018),0 0 0 1px rgba(0,0,0,.25)!important;
}
.form-card input::placeholder,.panel input::placeholder,.form-card textarea::placeholder,.panel textarea::placeholder{color:#7f9285!important;opacity:1}
.form-card input:focus,.form-card select:focus,.form-card textarea:focus,.panel input:focus,.panel select:focus,.panel textarea:focus{
  border-color:#68ff76!important;box-shadow:0 0 0 3px rgba(104,255,118,.10),0 0 28px rgba(104,255,118,.06)!important;
}
.table td,.table td small,.table td b,.table td strong,.table td span{color:#eef6ef!important}
.table th{color:#aaffae!important}.table tbody tr{background:#050907!important}.table tbody tr:nth-child(even){background:#070c08!important}
.table-wrap{border:1px solid rgba(126,255,137,.10)!important;border-radius:18px!important;overflow:auto!important}
.refwd-card{background:#07100a!important;border:1px solid rgba(112,255,122,.14)!important;box-shadow:0 14px 36px rgba(0,0,0,.25)!important}
.refwd-label{color:#92a795!important}.refwd-value{color:#f0f6f1!important}.refwd-main strong{color:#75ff7b!important}
.refwd-status.pending{background:rgba(255,196,75,.13)!important;color:#ffd56b!important}.refwd-status.approved{background:rgba(79,197,255,.13)!important;color:#89d9ff!important}.refwd-status.paid{background:rgba(78,244,166,.13)!important;color:#6ff4b6!important}.refwd-status.rejected{background:rgba(255,91,112,.13)!important;color:#ff8e9d!important}
.status.ok{background:rgba(73,245,176,.10)!important;color:#8fffc9!important;border:1px solid rgba(73,245,176,.20)!important}.status.err{background:rgba(255,89,110,.10)!important;color:#ff9aaa!important;border:1px solid rgba(255,89,110,.22)!important}
