/* Aurora Mobile theme for CoinFxLAB
   Drop-in theme: /themes/aurora-mobile/style.css
*/

:root{
  --bg:#070a12;
  --panel:#101827;
  --panel2:#172235;
  --line:#263852;
  --txt:#f4f7fb;
  --muted:#9aa8bd;
  --accent:#55e6ff;
  --accent2:#a77bff;
  --up:#35e69a;
  --down:#ff6478;
  --sbuy:#0fbf85;
  --buy:#35e69a;
  --hold:#9aa8bd;
  --sell:#ff9968;
  --ssell:#ff4d68;
  --radius:18px;
  --shadow:0 20px 55px rgba(0,0,0,.34);
  --glass:rgba(16,24,39,.78);
  --glass-strong:rgba(16,24,39,.92);
}

*{
  min-width:0;
}

html{
  scroll-padding-top:86px;
}

body{
  background:
    radial-gradient(920px 520px at 88% -12%,rgba(85,230,255,.17),transparent 64%),
    radial-gradient(760px 420px at 4% 0%,rgba(167,123,255,.16),transparent 58%),
    radial-gradient(560px 360px at 50% 115%,rgba(53,230,154,.09),transparent 62%),
    var(--bg);
  color:var(--txt);
  -webkit-tap-highlight-color:transparent;
  text-rendering:optimizeLegibility;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:38px 38px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.7),transparent 70%);
}

a{
  color:var(--accent);
}

.wrap{
  width:min(100%,1180px);
  padding-inline:clamp(14px,4vw,24px);
}

.muted{
  color:var(--muted);
}

.small{
  font-size:12.5px;
}

/* Header */
.topbar,
.lp-nav{
  background:rgba(7,10,18,.82);
  border-bottom-color:rgba(85,230,255,.18);
  box-shadow:0 12px 38px rgba(0,0,0,.22);
  backdrop-filter:blur(18px);
}

.topbar .wrap,
.lp-nav .wrap{
  gap:18px;
}

.brand{
  display:inline-flex;
  align-items:center;
  gap:9px;
  min-width:max-content;
  color:var(--txt);
  font-weight:800;
  letter-spacing:-.02em;
}

.brand-ico{
  width:28px;
  height:28px;
  border:1px solid rgba(85,230,255,.24);
  border-radius:10px;
  background:
    linear-gradient(135deg,rgba(85,230,255,.2),rgba(167,123,255,.18)),
    rgba(255,255,255,.04);
  color:var(--accent);
}

.brand-ico svg{
  width:17px;
  height:17px;
}

.topbar nav,
.lp-links{
  gap:10px;
}

.topbar nav a,
.lp-links a{
  color:var(--muted);
  border:1px solid transparent;
  border-radius:999px;
  padding:7px 10px;
  white-space:nowrap;
  transition:background .16s,border-color .16s,color .16s;
}

.topbar nav a.on,
.topbar nav a:hover,
.lp-links a:hover{
  color:var(--txt);
  background:rgba(85,230,255,.09);
  border-color:rgba(85,230,255,.2);
}

.account{
  gap:8px;
}

.account .bal{
  color:var(--up);
}

.plan-chip{
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  color:#061019;
  box-shadow:0 10px 22px rgba(85,230,255,.15);
}

/* Buttons and inputs */
.btn{
  min-height:42px;
  border-radius:13px;
  border-color:rgba(85,230,255,.19);
  background:rgba(23,34,53,.88);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}

.btn:hover{
  border-color:rgba(85,230,255,.62);
  transform:translateY(-1px);
}

.btn.sm{
  min-height:34px;
}

.btn.primary,
.plan-badge,
.lp-step .n{
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  color:#061019;
  border:0;
  box-shadow:0 14px 32px rgba(85,230,255,.16);
}

.btn.ghost{
  background:rgba(255,255,255,.035);
}

input,
select,
textarea,
button{
  font:inherit;
}

.trade-form input,
.trade-form select,
.fld select,
.fld input[type=number],
.auth-card input,
.plan-form input,
.plan-form select,
.plan-form textarea,
.stack input,
.stack textarea,
.search-bar input,
.set-grid input,
.set-grid select,
.set-grid textarea,
.upload-row input[type=file]{
  min-height:44px;
  border-radius:12px;
  border-color:rgba(85,230,255,.17);
  background:rgba(23,34,53,.9);
  outline:none;
}

.trade-form input:focus,
.trade-form select:focus,
.fld select:focus,
.fld input[type=number]:focus,
.auth-card input:focus,
.plan-form input:focus,
.plan-form select:focus,
.plan-form textarea:focus,
.stack input:focus,
.stack textarea:focus,
.search-bar input:focus,
.set-grid input:focus,
.set-grid select:focus,
.set-grid textarea:focus{
  border-color:rgba(85,230,255,.66);
  box-shadow:0 0 0 4px rgba(85,230,255,.09);
}

/* Shared cards */
.panel,
.stat-card,
.plan-card,
.admin-card,
.lp-feat,
.lp-step,
.lp-market,
.post-card,
.ext-card,
.auth-card,
.lp-hero-card{
  background:
    linear-gradient(180deg,rgba(255,255,255,.035),transparent 42%),
    var(--glass);
  border-color:rgba(85,230,255,.16);
  box-shadow:var(--shadow);
  backdrop-filter:blur(14px);
}

.panel{
  padding:20px;
}

.panel-head{
  gap:12px;
}

.panel-head h2,
.lp-h2,
.hero h1{
  letter-spacing:-.025em;
}

.hero{
  align-items:center;
  margin:26px 0 18px;
}

.hero h1{
  font-size:clamp(26px,4.2vw,38px);
  line-height:1.08;
}

.hero p{
  max-width:720px;
}

.stat-grid{
  gap:14px;
}

.stat-card{
  position:relative;
  overflow:hidden;
  padding:18px;
}

.stat-card::after{
  content:"";
  position:absolute;
  inset:auto 12px -34px auto;
  width:90px;
  height:90px;
  border-radius:50%;
  background:rgba(85,230,255,.08);
  filter:blur(2px);
}

.stat-card .k{
  text-transform:uppercase;
  letter-spacing:.055em;
}

.stat-card .v{
  font-size:clamp(21px,4vw,29px);
  letter-spacing:-.02em;
}

.stat-card.bull{
  border-color:rgba(53,230,154,.3);
}

.stat-card.bear{
  border-color:rgba(255,100,120,.3);
}

/* Tables */
.table-wrap{
  overflow-x:auto;
  border:1px solid rgba(85,230,255,.1);
  border-radius:14px;
  background:rgba(7,10,18,.22);
  scrollbar-width:thin;
  scrollbar-color:rgba(85,230,255,.5) transparent;
}

.table-wrap::-webkit-scrollbar{
  height:9px;
}

.table-wrap::-webkit-scrollbar-thumb{
  background:rgba(85,230,255,.38);
  border-radius:999px;
}

table.signals{
  min-width:760px;
}

table.signals th{
  background:rgba(7,10,18,.28);
  color:#b7c3d3;
  letter-spacing:.03em;
}

table.signals td,
table.signals th{
  padding:12px 11px;
}

table.signals tr:hover td{
  background:rgba(85,230,255,.055);
}

.sym{
  letter-spacing:-.01em;
}

.sig{
  border-radius:999px;
  box-shadow:0 8px 18px rgba(0,0,0,.16);
}

.sig.buy,
.sig.hold,
.sig.sell,
.buy-btn,
.sell-btn{
  color:#071019;
}

.conf{
  background:rgba(255,255,255,.08);
}

.conf span,
.score-meter span{
  background:linear-gradient(90deg,var(--accent),var(--accent2));
}

/* Detail / charts */
.forecast-box,
.indicators li,
.gstat,
.tk-price,
.tk-notional{
  background:rgba(23,34,53,.72);
  border:1px solid rgba(85,230,255,.12);
}

.forecast-box{
  border-radius:14px;
}

.indicators{
  gap:10px;
}

.indicators li{
  border-radius:12px;
}

.tv-box{
  overflow:hidden;
  border-radius:14px;
}

canvas{
  max-width:100%;
}

/* Simulator */
.sim-grid{
  grid-template-columns:minmax(300px,370px) minmax(0,1fr);
  gap:18px;
}

.trade-ticket{
  top:86px;
  border-color:rgba(167,123,255,.24);
}

.tk-price{
  border-radius:14px;
  padding:12px;
}

.tk-price .big{
  font-size:clamp(23px,4vw,29px);
}

.tk-notional{
  border-radius:12px;
  padding:10px 12px;
}

.tk-actions{
  gap:10px;
}

.buy-btn,
.sell-btn{
  min-height:48px;
  border:0;
}

.buy-btn{
  background:linear-gradient(135deg,#42f0a7,#18c87f);
}

.sell-btn{
  background:linear-gradient(135deg,#ff8795,#ff536d);
}

.positions-table{
  min-width:640px;
}

/* Pricing / admin / extensions */
.plans-grid,
.admin-cards,
.ext-grid{
  gap:18px;
}

.plan-card{
  overflow:hidden;
}

.plan-card.featured{
  border-color:rgba(85,230,255,.55);
  box-shadow:0 0 0 1px rgba(85,230,255,.28),var(--shadow);
}

.plan-price .amt{
  letter-spacing:-.04em;
}

.plan-feats li{
  color:#b3bfd0;
}

.admin-card:hover,
.lp-feat:hover,
.lp-market:hover{
  border-color:rgba(85,230,255,.48);
  transform:translateY(-3px);
}

.alert{
  border-radius:14px;
}

/* Landing */
.landing .brand{
  font-size:18px;
}

.lp-hero{
  background:
    radial-gradient(820px 460px at 78% -14%,rgba(85,230,255,.18),transparent 62%),
    radial-gradient(660px 360px at 8% 0%,rgba(167,123,255,.17),transparent 58%);
}

.lp-hero-inner{
  gap:46px;
}

.pill{
  background:rgba(85,230,255,.09);
  border-color:rgba(85,230,255,.22);
  color:#c4f7ff;
}

.lp-hero-copy h1{
  font-size:clamp(38px,6vw,58px);
  line-height:1.02;
}

.grad,
.lp-stats b{
  background:linear-gradient(135deg,var(--accent),var(--accent2) 62%,var(--up));
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}

.lp-ticker li a{
  border-radius:12px;
}

.lp-ticker li a:hover{
  background:rgba(85,230,255,.08);
}

.lp-stats{
  border-color:rgba(85,230,255,.14);
}

.lp-feat .ic{
  width:44px;
  height:44px;
  display:inline-grid;
  place-items:center;
  border-radius:15px;
  background:rgba(85,230,255,.09);
}

.lp-final{
  background:
    radial-gradient(760px 340px at 50% 115%,rgba(85,230,255,.16),transparent 62%),
    linear-gradient(180deg,transparent,rgba(167,123,255,.06));
}

/* Footer / mobile nav */
.foot{
  border-top-color:rgba(85,230,255,.14);
}

.mobile-nav{
  background:rgba(7,10,18,.94);
  border-top-color:rgba(85,230,255,.22);
  box-shadow:0 -18px 40px rgba(0,0,0,.38);
  backdrop-filter:blur(18px);
}

.mobile-nav a{
  min-height:52px;
  justify-content:center;
  border:1px solid transparent;
  border-radius:15px;
  transition:background .16s,color .16s,border-color .16s;
}

.mobile-nav a.on{
  color:var(--accent);
  background:rgba(85,230,255,.11);
  border-color:rgba(85,230,255,.16);
}

.mobile-nav a.on svg{
  filter:drop-shadow(0 0 8px rgba(85,230,255,.48));
}

@media(max-width:1080px){
  .topbar .wrap,
  .lp-nav .wrap{
    height:auto;
    min-height:64px;
    flex-wrap:wrap;
    padding-block:10px;
  }

  .topbar nav,
  .lp-links{
    order:3;
    width:100%;
    overflow-x:auto;
    padding-bottom:4px;
    scrollbar-width:none;
  }

  .topbar nav::-webkit-scrollbar,
  .lp-links::-webkit-scrollbar{
    display:none;
  }

  .topbar nav a,
  .lp-links a{
    flex:0 0 auto;
    background:rgba(23,34,53,.66);
    border-color:rgba(85,230,255,.1);
  }

  .account{
    margin-left:auto;
  }

  .account .uname{
    display:none;
  }

  .grid-2,
  .checkout-grid{
    grid-template-columns:1fr;
  }

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

  .tv-box,
  .tv-box .tradingview-widget-container,
  .tv-box .tradingview-widget-container__widget{
    min-height:360px;
    height:360px!important;
  }
}

@media(max-width:840px){
  .stat-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .plans-grid,
  .admin-cards{
    grid-template-columns:1fr;
  }

  .lp-hero-inner{
    grid-template-columns:1fr;
  }

  .lp-stats,
  .lp-grid,
  .lp-steps{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:720px){
  html{
    scroll-padding-top:70px;
  }

  body{
    padding-bottom:calc(78px + env(safe-area-inset-bottom,0px));
  }

  .wrap{
    padding-inline:14px;
  }

  main.wrap{
    padding-top:10px;
  }

  main.wrap > .wrap{
    padding-inline:0;
  }

  .topbar .wrap,
  .lp-nav .wrap{
    min-height:60px;
    flex-wrap:nowrap;
    padding-block:8px;
  }

  .topbar nav,
  .lp-links{
    display:none;
  }

  .brand,
  .landing .brand{
    font-size:16px;
  }

  .brand-text{
    max-width:42vw;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .brand-ico{
    width:26px;
    height:26px;
    border-radius:9px;
  }

  .account{
    gap:6px;
  }

  .account .bal,
  .account .plan-chip,
  .account #installBtn,
  .lp-nav #installBtn{
    display:none!important;
  }

  .account .btn{
    min-height:36px;
    padding-inline:10px;
  }

  .mobile-nav{
    display:flex;
    padding:7px 7px calc(7px + env(safe-area-inset-bottom,0px));
  }

  .foot{
    margin-bottom:74px;
  }

  .hero{
    display:grid;
    grid-template-columns:1fr;
    gap:14px;
    margin:18px 0 16px;
  }

  .hero .btn,
  .hero .interval-switch{
    width:100%;
  }

  .interval-switch{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(64px,1fr));
    width:100%;
  }

  .interval-switch .btn{
    width:100%;
    padding-inline:8px;
  }

  .stat-grid,
  .plans-grid,
  .admin-cards,
  .lp-stats,
  .lp-grid,
  .lp-steps,
  .sentiment-grid,
  .lp-markets{
    grid-template-columns:1fr;
  }

  .panel,
  .stat-card,
  .plan-card,
  .admin-card,
  .lp-feat,
  .lp-step,
  .lp-market,
  .post-card,
  .ext-card{
    border-radius:15px;
  }

  .panel{
    padding:14px;
    margin-bottom:16px;
  }

  .panel-head{
    align-items:flex-start;
    flex-wrap:wrap;
  }

  .panel-head h2{
    width:100%;
  }

  .table-wrap{
    margin-inline:-6px;
    border-radius:12px;
  }

  table.signals{
    min-width:690px;
    font-size:13px;
  }

  table.signals td,
  table.signals th{
    padding:10px 8px;
  }

  table.signals th:first-child,
  table.signals td:first-child{
    position:sticky;
    left:0;
    z-index:1;
    background:rgba(16,24,39,.98);
  }

  table.signals th:first-child{
    z-index:2;
  }

  .conf{
    width:56px;
  }

  .forecast-box>div{
    align-items:flex-start;
    flex-direction:column;
  }

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

  .trade-form,
  .tk-actions,
  .plan-form .form-row,
  .upload-row,
  .search-bar{
    display:grid;
    grid-template-columns:1fr;
  }

  .trade-form label,
  .trade-form button,
  .trade-form input,
  .trade-form select,
  .upload-row label,
  .search-bar input,
  .search-bar .btn{
    width:100%;
  }

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

  .trade-ticket{
    position:static;
  }

  .tk-price{
    display:grid;
    grid-template-columns:1fr;
    gap:3px;
  }

  .positions-table-wrap{
    margin-inline:-6px;
  }

  .positions-table{
    min-width:560px;
    font-size:12.5px;
  }

  .tv-box,
  .tv-box .tradingview-widget-container,
  .tv-box .tradingview-widget-container__widget{
    min-height:320px;
    height:320px!important;
  }

  canvas#chart{
    min-height:230px;
  }

  .lp-hero-inner{
    padding:34px 14px 42px;
  }

  .lp-hero-copy h1{
    font-size:34px;
  }

  .lp-cta,
  .lp-trust{
    display:grid;
    grid-template-columns:1fr;
  }

  .lp-cta .btn,
  .lp-market,
  .lp-feat,
  .lp-step{
    width:100%;
  }

  .lp-ticker li a{
    grid-template-columns:1fr auto;
    row-gap:4px;
  }

  .lp-ticker li a span:nth-child(n+3){
    display:none;
  }

  .auth-bg{
    align-items:flex-start;
    min-height:100svh;
    padding:18px 14px;
  }

  .auth-card{
    max-width:none;
    padding:22px;
    border-radius:16px;
  }
}

@media(max-width:440px){
  .wrap{
    padding-inline:12px;
  }

  .brand-text{
    max-width:38vw;
  }

  .landing .brand{
    max-width:40vw;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .account .btn.primary{
    display:none;
  }

  .hero h1,
  .lp-hero-copy h1{
    font-size:29px;
  }

  .btn{
    width:100%;
    text-align:center;
  }

  .account .btn,
  .mobile-nav .btn{
    width:auto;
  }

  .mobile-nav{
    gap:4px;
  }

  .mobile-nav a{
    min-height:50px;
    padding-inline:2px;
    font-size:9.5px;
  }

  .mobile-nav svg{
    width:21px;
    height:21px;
  }

  .panel{
    padding:12px;
  }

  .stat-card{
    padding:14px;
  }

  table.signals{
    min-width:640px;
  }
}
