:root{
  --bg-deep:#050b16;
  --bg:#081321;
  --panel:#0c1b2d;
  --panel-raised:#102943;
  --line:rgba(183,211,255,.16);
  --line-strong:rgba(100,240,216,.38);
  --muted:#8fa7bf;
  --text:#f6f9ff;
  --cyan:#64f0d8;
  --blue:#94a4ff;
  --violet:#cf9cff;
  --orange:#ffc078;
  --shadow-lg:0 24px 70px rgba(0,0,0,.36);
}

html{background:var(--bg-deep)}
body{
  overflow-x:hidden;
  background:
    radial-gradient(900px 560px at 86% -12%,rgba(92,105,255,.18),transparent 62%),
    radial-gradient(680px 420px at 5% 9%,rgba(50,212,191,.09),transparent 62%),
    linear-gradient(145deg,#050b16 0%,#081524 52%,#06111e 100%)!important;
}
body:before{opacity:.15!important;background-size:88px 88px!important}
body:after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(520px 260px at 50% 0,rgba(255,255,255,.035),transparent 72%)}
a,button,input,select{transition:color .2s,border-color .2s,background .2s,box-shadow .2s,transform .2s}

.topbar,.top,.app-header{
  background:rgba(5,13,25,.76)!important;
  border-color:var(--line)!important;
  box-shadow:0 10px 42px rgba(0,0,0,.18);
}
.topbar{position:sticky;top:0}
.brand-mark,.mark{
  position:relative;
  overflow:hidden;
  width:40px!important;
  height:40px!important;
  flex:none;
  border-color:rgba(100,240,216,.54)!important;
  border-radius:13px!important;
  background:linear-gradient(145deg,#123c4a,#1b2852)!important;
  box-shadow:0 0 0 5px rgba(100,240,216,.035),0 0 32px rgba(100,240,216,.18)!important;
}
.brand-mark:before,.mark:before{content:"";position:absolute;left:10px;bottom:10px;width:4px;height:10px;border-radius:5px;background:var(--cyan);box-shadow:7px -5px 0 var(--cyan),14px -10px 0 var(--violet);transform:none}
.brand-mark:after,.mark:after{content:"";position:absolute;right:6px;top:10px;width:16px;height:3px;border:0!important;border-radius:99px;background:linear-gradient(90deg,rgba(235,255,251,.96),var(--violet));transform:rotate(-38deg)!important;box-shadow:5px -3px 0 -1px var(--violet);-webkit-text-fill-color:initial}
.dot,.brand-dot,.brand>span:not(.brand-mark):not(.wordmark)>span[style*="color"],.mobile-brand>span:not(.brand-mark):not(.wordmark)>span[style*="color"]{display:none!important}
.wordmark{display:inline-block;letter-spacing:-.7px;font-size:23px!important;font-weight:800;background:linear-gradient(105deg,#ff6f9f 0%,#ffc1d4 34%,#b8c8ff 66%,#9a71ff 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.brand>.brand-mark~span:not(.wordmark),.mobile-brand>.brand-mark~span:not(.wordmark),.brand>.mark~span:not(.wordmark){font-size:23px!important;font-weight:800;background:linear-gradient(105deg,#ff6f9f 0%,#ffc1d4 34%,#b8c8ff 66%,#9a71ff 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.nav-links{font-size:15px!important}
.login,.back{font-size:15px!important}
.topbar .btn{min-height:50px;font-size:15px}
.brand{font-size:23px!important}
.mobile-brand{font-size:19px!important}
.nav-links a,.login,.back{position:relative;color:#afc1d3}
.nav-links a:hover,.login:hover,.back:hover{color:#fff}
.nav-links a.active,.nav-links a[aria-current="page"]{color:var(--cyan)}
.nav-links a.active:after,.nav-links a[aria-current="page"]:after{content:"";position:absolute;right:0;left:0;bottom:-10px;height:2px;border-radius:99px;background:var(--cyan);box-shadow:0 0 14px rgba(100,240,216,.75)}

.btn-primary,.submit{
  color:#06141c!important;
  border:1px solid rgba(169,255,236,.35)!important;
  background:linear-gradient(135deg,var(--cyan),#a7f9e7)!important;
  box-shadow:0 12px 30px rgba(48,224,193,.18)!important;
}
.btn-primary:hover,.submit:hover{box-shadow:0 16px 38px rgba(48,224,193,.3)!important;transform:translateY(-2px)}
.btn-ghost,.btn:not(.btn-primary){border-color:var(--line)!important;background:rgba(255,255,255,.035)!important}
.btn-ghost:hover,.btn:not(.btn-primary):hover{border-color:var(--line-strong)!important;background:rgba(100,240,216,.08)!important}

h1,h2,h3{color:var(--text)}
h1{letter-spacing:-2.8px}
.gradient-text,.gradient{background:linear-gradient(105deg,var(--cyan),#aebcff 58%,var(--violet));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.eyebrow{border-color:rgba(100,240,216,.32)!important;background:rgba(100,240,216,.08)!important;box-shadow:0 0 26px rgba(100,240,216,.05)}
.pulse{background:var(--cyan)!important;box-shadow:0 0 0 5px rgba(100,240,216,.11),0 0 15px rgba(100,240,216,.65)!important}

.card,.feature-card,.plan,.surface,.panel,.auth-card,.dashboard,.mini-terminal,.terminal,.page-art,.metric-card,.value-card,.person{
  position:relative;
  border-color:var(--line)!important;
  background:linear-gradient(145deg,rgba(18,42,67,.91),rgba(7,19,34,.82))!important;
  box-shadow:var(--shadow-lg);
}
.card:before,.feature-card:before,.plan:before,.surface:before,.panel:before,.auth-card:before,.dashboard:before,.mini-terminal:before,.terminal:before,.page-art:before,.metric-card:before,.value-card:before,.person:before{
  content:"";position:absolute;z-index:0;top:0;right:15%;left:15%;height:1px;background:linear-gradient(90deg,transparent,rgba(174,244,233,.52),transparent);opacity:.8;pointer-events:none
}
.card:hover,.feature-card:hover,.plan:hover,.surface:hover,.value-card:hover,.person:hover{border-color:rgba(100,240,216,.34)!important;box-shadow:0 28px 76px rgba(0,0,0,.42),0 0 35px rgba(100,240,216,.055)}
.feature-card:hover,.card:hover{transform:translateY(-4px)}
.icon-tile,.feature-icon{background:linear-gradient(145deg,rgba(100,240,216,.16),rgba(148,164,255,.1))!important;box-shadow:inset 0 1px rgba(255,255,255,.08),0 12px 25px rgba(0,0,0,.12)}

input,select,textarea{
  color:var(--text)!important;
  border-color:rgba(159,193,231,.18)!important;
  background:rgba(4,14,27,.62)!important;
}
input::placeholder{color:#66819a}
input:focus,select:focus,textarea:focus{border-color:rgba(100,240,216,.68)!important;box-shadow:0 0 0 4px rgba(100,240,216,.09)!important;outline:0}

.page-hero,.hero{isolation:isolate}
.page-hero:after,.hero:after{content:"";position:absolute;z-index:-1;width:430px;height:430px;right:8%;top:18%;border:1px solid rgba(100,240,216,.07);border-radius:50%;transform:rotate(24deg);box-shadow:0 0 0 34px rgba(100,240,216,.02),0 0 0 68px rgba(148,164,255,.018);pointer-events:none}
.page-art,.dashboard{box-shadow:0 30px 90px rgba(0,0,0,.42),0 0 70px rgba(91,113,255,.13)!important}
.dashboard{transform:perspective(1200px) rotateY(-3deg) rotateX(1deg)}
.dashboard:hover{transform:perspective(1200px) rotateY(-1deg) rotateX(1deg) translateY(-3px)}
.cta-box{border-color:rgba(100,240,216,.3)!important;background:radial-gradient(circle at 52% 110%,rgba(100,240,216,.2),transparent 48%),linear-gradient(135deg,rgba(19,52,75,.96),rgba(10,25,44,.96))!important;box-shadow:0 30px 80px rgba(0,0,0,.32)}
.exchange-strip,.stats-band{background:rgba(10,28,46,.56)!important;border-color:var(--line)!important}
.exchange-strip{position:relative;z-index:4;width:min(1180px,calc(100% - 40px));margin:-38px auto 0;padding:15px 22px;border:1px solid var(--line);border-radius:22px;box-shadow:0 22px 55px rgba(0,0,0,.3);backdrop-filter:blur(18px)}
.exchange-track{min-width:0!important;gap:18px;justify-content:space-between!important}
.exchange{padding:7px 10px;border-radius:12px;background:rgba(255,255,255,.025);transition:background .2s,transform .2s}
.exchange:hover{background:rgba(100,240,216,.08);transform:translateY(-2px)}

.feature-grid{grid-template-columns:1fr 1fr!important;grid-template-areas:"lead lead" "copy bot" "risk risk";gap:18px}
.feature-card{min-height:230px!important}
.feature-card:nth-child(1){grid-area:lead;background:linear-gradient(135deg,rgba(22,57,76,.98),rgba(8,27,42,.9))!important}
.feature-card:nth-child(2){grid-area:copy}
.feature-card:nth-child(3){grid-area:bot}
.feature-card:nth-child(4){grid-area:risk;background:linear-gradient(135deg,rgba(29,39,73,.92),rgba(13,25,47,.88))!important}
.feature-card:nth-child(1) .feature-icon,.feature-card:nth-child(4) .feature-icon{box-shadow:0 0 26px rgba(100,240,216,.13)}

#features.section{padding-top:72px;padding-bottom:74px}
#features .section-head{margin-bottom:26px}
#features .feature-card{min-height:190px!important;padding:24px 25px}
#features .feature-icon{margin-bottom:15px}
#features .feature-card h3{margin-bottom:6px}
#product.product-section{padding-top:70px;padding-bottom:70px}
#product .product-showcase{gap:48px}
#product .mini-terminal{padding:16px}
.stats-band{padding:23px 0!important;margin-top:0!important}
.cta{padding:58px 0!important}
.cta-box{padding:52px 30px!important}

.sidebar{background:linear-gradient(180deg,rgba(7,20,35,.98),rgba(5,14,26,.98))!important;border-color:var(--line)!important;box-shadow:16px 0 70px rgba(0,0,0,.2)}
.side-nav a.active{color:#e4fffb!important;background:linear-gradient(90deg,rgba(100,240,216,.13),rgba(100,240,216,.04))!important;box-shadow:inset -2px 0 var(--cyan),0 8px 22px rgba(0,0,0,.12)!important}
.app-header{backdrop-filter:blur(18px)}
.demo-banner{border-color:rgba(100,240,216,.24)!important;background:linear-gradient(100deg,rgba(100,240,216,.08),rgba(148,164,255,.06))!important;box-shadow:0 14px 40px rgba(0,0,0,.14)}
.kpi,.bot-card,.visual-item,.activity-item,.quick{border-color:rgba(172,205,244,.13)!important;background:rgba(14,34,56,.76)!important}
.kpi:hover,.bot-card:hover,.quick:hover{border-color:rgba(100,240,216,.34)!important;background:rgba(18,45,68,.9)!important;transform:translateY(-3px)}
.kpi:first-child{box-shadow:inset 3px 0 var(--cyan),0 16px 42px rgba(0,0,0,.18)}
.chart{background:linear-gradient(180deg,rgba(10,28,47,.75),rgba(6,17,30,.42))!important}
.period-tabs,.data-tabs,.tabs{border-color:rgba(173,205,244,.12)!important;background:rgba(4,14,27,.58)!important}
.period-tabs button.active,.data-tabs button.active,.tabs button.active{color:#06141c!important;background:var(--cyan)!important;box-shadow:0 4px 16px rgba(100,240,216,.18)}
.table-wrap,.compare{border-color:var(--line)!important;background:rgba(7,18,32,.42)!important}
.data-table th,.table th{color:#bad0e4!important;background:rgba(255,255,255,.035)!important}
.status,.badge{border-color:rgba(100,240,216,.25)!important;background:rgba(100,240,216,.1)!important}

.market-head{padding:18px 20px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(100deg,rgba(18,42,67,.78),rgba(8,20,35,.68));box-shadow:0 18px 55px rgba(0,0,0,.2)}
.market-head .coin{box-shadow:0 0 24px rgba(255,192,120,.16)}
.chart-card,.orderbook,.form-card,.table-card{box-shadow:var(--shadow-lg)!important}
.form-card .submit{min-height:48px;border-radius:14px}
.form-card .submit.sell{color:#fff!important;background:linear-gradient(135deg,#f06f86,#ff9a7d)!important;border-color:rgba(255,168,164,.35)!important}
.book-row,.asset-row{border-color:rgba(173,205,244,.09)!important}
.spread,.position-note{background:rgba(100,240,216,.06)!important;border-color:rgba(100,240,216,.16)!important}

.auth-wrap{max-width:1100px!important}
.auth-card{border-radius:26px!important;padding:34px!important}
.auth-card h2{font-size:29px!important}
.auth-card .tabs{padding:5px!important;border-radius:14px!important}
.auth-card .tabs button{border-radius:10px!important}
.auth-card .submit{min-height:48px!important;border-radius:13px!important}
.intro{filter:drop-shadow(0 18px 35px rgba(0,0,0,.14))}
.intro h1{font-size:clamp(42px,5vw,66px)!important}

.toast{border-color:rgba(100,240,216,.32)!important;background:linear-gradient(135deg,#123a43,#10293d)!important;box-shadow:0 18px 45px rgba(0,0,0,.36)!important}

@media(max-width:900px){
  .dashboard{transform:none!important}
  .page-hero:after,.hero:after{right:-170px;top:34%;opacity:.5}
  #features.section{padding-top:62px;padding-bottom:62px}
  #product.product-section{padding-top:58px;padding-bottom:58px}
}
@media(max-width:680px){
  .topbar{position:relative}
  .nav-links a.active:after,.nav-links a[aria-current="page"]:after{display:none}
  .brand-mark,.mark,.mobile-brand .brand-mark{width:34px!important;height:34px!important;border-radius:11px!important}
  .brand,.wordmark,.brand>.brand-mark~span:not(.wordmark),.mobile-brand>.brand-mark~span:not(.wordmark){font-size:19px!important}
  .exchange-strip{width:calc(100% - 28px);margin:-20px auto 0;padding:12px 14px;border-radius:18px}
  .exchange-track{min-width:0!important;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;justify-content:stretch!important}
  .exchange{justify-content:center;padding:7px 5px;font-size:10px}
  .feature-grid{grid-template-columns:1fr!important;grid-template-areas:none}
  .feature-card,#features .feature-card{grid-area:auto!important;min-height:0!important}
  #features.section{padding-top:52px;padding-bottom:52px}
  #product.product-section{padding-top:48px;padding-bottom:48px}
  .cta{padding:42px 0!important}
  .cta-box{padding:40px 20px!important}
  .market-head{align-items:flex-start;flex-direction:column;padding:15px}
  .ticker{width:100%;display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
  .auth-card{padding:22px!important}
  .intro h1{font-size:38px!important}
}