/* ══════════════════════════════════════════════════════════════
   VARIABLES & RESET
══════════════════════════════════════════════════════════════ */
:root{--bg:#08040f;--bg2:#07101f;--card:#110926;--border:rgba(37,99,235,0.15);
  --border2:rgba(37,99,235,0.35);
  --purple:#1d4ed8;--purple2:#2563eb;--purple3:#60a5fa;--pink:#06b6d4;--pink2:#22d3ee;--gold:#f59e0b; --blue:#1d4ed8;--blue2:#2563eb;--blue3:#93c5fd;
  --gold2:#fbbf24;--green:#10b981;--green2:#34d399;--teal:#06b6d4;--red:#f43f5e;--text:#ede9fe;
  --text2:#c4b5fd;--muted:#a8a8a8;--muted2:#a8a8a8;--sidebar:240px;
  --topbar:64px;--zoombar:48px;--r:14px;--rs:9px;}

/* Social float (unique wrapper avoids .sf collision with activity.css and other pages) */
.social-float-rail{position:fixed;right:0;top:50%;transform:translateY(-50%);z-index:400;display:flex;flex-direction:column;gap:5px;}
.social-float-rail .sf-a{display:flex;align-items:center;width:43px;padding:10px 11px;border-radius:10px 0 0 10px;border:1px solid rgba(255,255,255,.12);border-right:none;background:rgba(6,12,24,.88);backdrop-filter:blur(10px);color:var(--muted);text-decoration:none;overflow:hidden;transition:width .22s ease,padding .22s ease,color .22s ease,background .22s ease,border-color .22s ease;}
.social-float-rail .sf-a svg{flex-shrink:0;}
.social-float-rail .sf-a .sf-a-lbl{font-size:11px;font-weight:700;white-space:nowrap;min-width:0;overflow:hidden;transition:max-width .22s ease,opacity .22s ease,margin .22s ease;}
/* Non-hovered row: force collapsed (independent of :has() support) */
.social-float-rail .sf-a:not(:hover){width:43px;padding:10px 11px;color:var(--muted);}
.social-float-rail .sf-a:not(:hover) .sf-a-lbl{max-width:0!important;opacity:0!important;margin-left:0!important;}
.social-float-rail .sf-a:hover{width:108px;padding-right:13px;color:#fff;}
.social-float-rail .sf-a:hover .sf-a-lbl{max-width:72px!important;opacity:1!important;margin-left:7px!important;}
.social-float-rail .sf-tg:hover{background:rgba(6,182,212,.14);border-color:rgba(6,182,212,.3);}
.social-float-rail .sf-fb:hover{background:rgba(59,89,152,.14);border-color:rgba(59,89,152,.3);}
.social-float-rail .sf-dc:hover{background:rgba(88,101,242,.14);border-color:rgba(88,101,242,.3);}
@media(max-width:560px){.social-float-rail{display:none;}}

  *,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{font-family:'Outfit',sans-serif;background:var(--bg);color:var(--text);min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased;}
  body::before{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse 70% 60% at 0% 0%,rgba(29,78,216,0.18) 0%,transparent 60%),radial-gradient(ellipse 50% 40% at 100% 100%,rgba(6,182,212,0.10) 0%,transparent 60%);}
  .layout{display:flex;min-height:100vh;min-width:0;width:100%;position:relative;z-index:1;}
  .sidebar{width:var(--sidebar);background:rgba(15,8,32,0.96);border-right:1px solid var(--border);backdrop-filter:blur(20px);display:flex;flex-direction:column;position:fixed;top:0;left:0;bottom:0;z-index:200;transition:transform 0.32s cubic-bezier(0.4,0,0.2,1);overflow-y:auto;overflow-x:hidden;}
  .sidebar-overlay{display:none;position:fixed;inset:0;z-index:190;background:rgba(0,0,0,0.7);backdrop-filter:blur(4px);}
  .sidebar-overlay.open{display:block;}
  .sidebar-logo{padding:22px 20px 18px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:12px;flex-shrink:0;}
  
  .logo-text{font-weight:800;font-size:18px;letter-spacing:0.08em;color:#fff;}
  .sidebar-close{display:none;margin-left:auto;background:transparent;border:none;color:var(--muted2);cursor:pointer;padding:4px;}
  .nav-section{padding:18px 14px 6px;}
  .nav-label{font-size:9px;letter-spacing:0.16em;text-transform:uppercase;color:var(--muted);padding:0 8px 10px;font-weight:600;}
  .nav-item{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:var(--rs);color:var(--muted2);font-size:13.5px;font-weight:400;cursor:pointer;transition:all 0.18s;margin-bottom:2px;text-decoration:none;position:relative;}
  .nav-item:hover{background:rgba(37,99,235,0.1);color:var(--text);}
  .nav-item.active{background:linear-gradient(90deg,rgba(29,78,216,0.22),rgba(29,78,216,0.05));color:#fff;}
  .nav-item.active::before{content:'';position:absolute;left:0;top:20%;bottom:20%;width:3px;border-radius:0 3px 3px 0;background:linear-gradient(180deg,var(--purple2),var(--pink));}
  .nav-icon{width:16px;height:16px;opacity:0.6;flex-shrink:0;}
  .nav-item.active .nav-icon{opacity:1;}
  .nav-badge{margin-left:auto;font-size:9px;font-weight:700;padding:2px 7px;border-radius:20px;letter-spacing:0.04em;background:linear-gradient(135deg,var(--purple),var(--pink));color:#fff;}
  .nav-badge.hot{background:linear-gradient(135deg,#f59e0b,#f97316);}
  .sidebar-bottom{margin-top:auto;padding:14px;border-top:1px solid var(--border);flex-shrink:0;}
  .user-card{display:flex;align-items:center;gap:10px;padding:10px 11px;border-radius:var(--rs);background:rgba(255,255,255,0.03);border:1px solid var(--border);cursor:pointer;transition:all 0.18s;}
  .user-card:hover{background:rgba(37,99,235,0.1);}
  .avatar{width:32px;height:32px;border-radius:50%;flex-shrink:0;background:linear-gradient(135deg,var(--purple),var(--pink));display:flex;align-items:center;justify-content:center;font-weight:700;font-size:11px;color:#fff;}
  .user-name{font-size:13px;font-weight:600;color:var(--text);}
  .user-email{font-size:10.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .main{margin-left:var(--sidebar);flex:1;min-width:0;max-width:100%;min-height:100vh;display:flex;flex-direction:column;overflow-x:hidden;}
  .header-stack{position:sticky;top:0;z-index:100;align-self:stretch;width:100%;max-width:100%;min-width:0;flex-shrink:0;display:flex;flex-direction:column;}
  .topbar{display:flex;align-items:center;justify-content:space-between;padding:0 32px;height:var(--topbar);background:rgba(8,4,15,1);backdrop-filter:blur(20px);border-bottom:1px solid var(--border);position:relative;left:auto;right:auto;top:auto;width:100%;flex-shrink:0;gap:16px;}
  .topbar-left{display:flex;align-items:center;gap:14px;}
  .menu-btn{display:none;background:transparent;border:none;color:var(--muted2);cursor:pointer;padding:7px;border-radius:var(--rs);transition:all 0.18s;}
  .menu-btn:hover{background:rgba(37,99,235,0.14);color:var(--text);}
  .page-heading h1{font-size:20px;font-weight:700;color:#fff;letter-spacing:-0.025em;}
  .page-heading p{font-size:12px;color:var(--muted2);margin-top:2px;}
  .topbar-actions{display:flex;align-items:center;gap:10px;flex-shrink:0;}
  .icon-btn{width:36px;height:36px;border-radius:var(--rs);background:rgba(255,255,255,0.04);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all 0.18s;color:var(--muted2);position:relative;}
  .icon-btn:hover{background:rgba(37,99,235,0.14);color:var(--text);}
  .notif-dot{width:7px;height:7px;background:var(--pink);border-radius:50%;position:absolute;top:7px;right:7px;border:1.5px solid var(--bg);}
  .btn-outline{text-decoration:none;background:transparent;border:1px solid var(--border2);color:var(--text2);padding:8px 16px;border-radius:var(--rs);font-size:13px;font-weight:500;cursor:pointer;transition:all 0.18s;font-family:'Outfit',sans-serif;white-space:nowrap;}
  .btn-outline:hover{background:rgba(37,99,235,0.14);}
  .btn-primary{text-decoration:none;background:linear-gradient(135deg,var(--purple),#a855f7);border:none;color:#fff;padding:9px 20px;border-radius:var(--rs);font-size:13.5px;font-weight:600;cursor:pointer;font-family:'Outfit',sans-serif;white-space:nowrap;box-shadow:0 4px 20px rgba(29,78,216,0.4);display:flex;align-items:center;gap:7px;transition:all 0.2s;}
  .btn-primary:hover{transform:translateY(-1px);box-shadow:0 8px 28px rgba(29,78,216,0.55);}
  .content{padding:28px 32px;flex:1;min-width:0;}

.success-list {
  list-style: none;
  margin: 0 0 15px;
  padding: 10px;
  color: var(--green2);
  background: rgba(16,185,129,0.16);
  border-radius: 10px;
  font-size: 12px;
}
.errors-list {
  list-style: none;
  margin: 0 0 15px;
  padding: 10px;
  color: var(--red2);
  background: rgba(244,63,94,0.16);
  border-radius: 10px;
  font-size: 12px;
}
/* ─── ZOOM BANNER ──────────────────────────────────────────── */
.zoom-bar{
  position:relative;left:auto;right:auto;top:auto;flex-shrink:0;width:100%;max-width:100%;
  height:var(--zoombar);display:flex;align-items:center;
  justify-content:space-between;gap:16px;padding:0 28px;
  background:linear-gradient(90deg,rgba(29,78,216,.22),rgba(6,182,212,.12));
  border-bottom:1px solid rgba(37,99,235,.32);
  backdrop-filter: blur(20px);
  overflow-x:hidden;
  box-sizing:border-box;
}
.zoom-bar.live{background:linear-gradient(90deg,rgba(16,185,129,.2),rgba(6,182,212,.12));border-bottom-color:rgba(52,211,153,.35);}
.zoom-bar-left{display:flex;align-items:center;gap:9px;min-width:0;flex:1;}
.zoom-bar-text{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:8px;row-gap:2px;min-width:0;flex:1;}
.zoom-dot{width:7px;height:7px;border-radius:50%;background:#2563eb;box-shadow:0 0 7px #2563eb;flex-shrink:0;animation:zdot 1.8s infinite;}
.zoom-bar.live .zoom-dot{background:#34d399;box-shadow:0 0 7px #34d399;}
@keyframes zdot{0%,100%{opacity:1}50%{opacity:.25}}
.zoom-title{font-size:12.5px;font-weight:700;color:#fff;white-space:nowrap;min-width:0;}
.zoom-sub{font-size:11px;color:rgba(255,255,255,.38);white-space:nowrap;}
.zoom-bar-right{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-shrink:0;flex-wrap:wrap;}
.zoom-timer{display:flex;align-items:center;gap:2px;flex-shrink:0;max-width:100%;}
.zoom-seg{display:flex;flex-direction:column;align-items:center;background:rgba(0,0,0,.3);border:1px solid rgba(37,99,235,.25);border-radius:6px;padding:3px 8px;min-width:36px;}
.zoom-seg-n{font-family:'JetBrains Mono',monospace;font-size:13px;font-weight:700;color:#fff;line-height:1;}
.zoom-seg-l{font-size:7px;font-weight:600;color:rgba(255,255,255,.3);letter-spacing:.07em;text-transform:uppercase;margin-top:1px;}
.zoom-colon{font-family:'JetBrains Mono',monospace;font-size:14px;font-weight:700;color:rgba(37,99,235,.5);margin-bottom:9px;}
.zoom-join{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:7px 15px;border-radius:7px;background:#2563eb;color:#fff;font-size:12px;font-weight:700;text-decoration:none;white-space:nowrap;transition:all .18s;flex-shrink:0;}
.zoom-join:hover{background:#1d4ed8;transform:translateY(-1px);box-shadow:0 4px 14px rgba(37,99,235,.5);}
.zoom-bar.live .zoom-join{background:#10b981;}
@media(max-width:860px){
  .zoom-bar{padding:8px 14px;gap:10px;min-height:var(--zoombar);height:auto;flex-wrap:wrap;row-gap:8px;}
  .zoom-bar-right{min-width:0;flex:1 1 auto;justify-content:flex-end;}
  .zoom-sub{display:none;}
  .zoom-title{overflow:hidden;text-overflow:ellipsis;}
  .zoom-seg{padding:2px 5px;min-width:30px;}
  .zoom-seg-n{font-size:12px;}
  .zoom-colon{margin-bottom:6px;font-size:12px;}
  .trade-ticker{left:0;}
}
@media(max-width:760px){
  .zoom-bar{align-items:flex-start;}
}
@media(max-width:640px){
  :root{--zoombar:128px;}
  .zoom-bar{
    flex-direction:column;
    align-items:stretch;
    height:auto;
    min-height:0;
    padding:10px 14px;
    gap:10px;
  }
  .zoom-bar-left{width:100%;align-items:flex-start;}
  .zoom-bar-text{width:100%;}
  .zoom-title{white-space:normal;line-height:1.35;font-size:12px;font-weight:600;}
  .zoom-bar-right{width:100%;justify-content:space-between;gap:10px;}
  .zoom-timer{flex-wrap:wrap;justify-content:center;}
}
@media(max-width:480px){
  .zoom-seg--days,.zoom-colon--after-days{display:none!important;}
  .zoom-seg{padding:2px 4px;min-width:26px;}
  .zoom-seg-n{font-size:11px;}
  .zoom-seg-l{font-size:6px;}
  .zoom-join{position:relative;padding:7px 8px;}
  .zoom-join-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
}
@media(max-width:380px){
  .zoom-bar{padding:10px 12px;}
  :root{--zoombar:132px;}
}


/* ambient layers */
#particles{position:fixed;inset:0;z-index:0;pointer-events:none;}
body::before{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(ellipse 80% 70% at 0% 0%,rgba(37,99,235,0.18) 0%,transparent 55%),
             radial-gradient(ellipse 60% 60% at 100% 100%,rgba(6,182,212,0.09) 0%,transparent 55%);}

section{position:relative;z-index:1;}
.container{max-width:1400px; width:100%; margin:0 auto;padding:0 5%;}


/* ─── FOOTER ──────────────────────────────────────────────────────── */
footer{background:var(--bg2);border-top:1px solid var(--border);padding:60px 0 30px;}
.ft-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;margin-bottom:46px;}
.ft-logo{display:flex;align-items:center;gap:8px;margin-bottom:12px;}
.ft-desc{font-size:13px;color:var(--muted);line-height:1.7;max-width:270px;margin-bottom:14px;}
.ft-social{display:flex;gap:8px;}
.ft-social a{width:34px;height:34px;border-radius:50%;border:1.5px solid rgba(255,255,255,.14);display:flex;align-items:center;justify-content:center;color:var(--muted);text-decoration:none;transition:all .16s;}
.ft-social a:hover{color:var(--teal);border-color:rgba(6,182,212,.38);background:rgba(6,182,212,.08);}
.ft-col-h{font-size:11px;font-weight:700;color:#fff;text-transform:uppercase;letter-spacing:.1em;margin-bottom:13px;}
.ft-links{display:flex;flex-direction:column;gap:9px;}
.ft-link{font-size:13px;color:var(--muted);text-decoration:none;transition:color .16s;}
.ft-link:hover{color:#fff;}
.ft-btm{display:flex;align-items:center;justify-content:space-between;padding-top:20px;border-top:1px solid var(--border);flex-wrap:wrap;gap:12px;}
.ft-copy{font-size:12px;color:var(--dim);}
.ft-disc{font-size:11px;color:var(--dim);max-width:540px;line-height:1.5;text-align:right;}
@media(max-width:860px){.ft-grid{grid-template-columns:1fr 1fr;}.ft-disc{text-align:left;}}
@media(max-width:500px){.ft-grid{grid-template-columns:1fr;}}


/* ── Telegram icon buttons ── */
.tg-icon-btn{
  display:inline-flex;align-items:center;justify-content:center;
  width:36px;height:36px;border-radius:50%;
  background:rgba(255,255,255,0.07);
  border:1.5px solid rgba(255,255,255,0.18);
  color:rgba(255,255,255,0.75);
  text-decoration:none;transition:all 0.18s;flex-shrink:0;
  position:relative;
}
.tg-icon-btn:hover{
  background:rgba(41,182,246,0.18);
  border-color:rgba(41,182,246,0.55);
  color:#29b6f6;
  box-shadow:0 0 14px rgba(41,182,246,0.30);
  transform:translateY(-1px);
}
.footer-tg-row{display:flex;gap:8px;margin-top:10px;}


/* ── Floating Telegram sidebar ── */
.tg-float{
  position:fixed;
  right:0;
  top:50%;
  transform:translateY(-50%);
  z-index:500;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.tg-float-btn{
  display:flex;
  align-items:center;
  gap:0;
  background:rgba(41,182,246,0.15);
  border:1px solid rgba(41,182,246,0.30);
  border-right:none;
  border-radius:10px 0 0 10px;
  color:rgba(255,255,255,0.80);
  text-decoration:none;
  padding:10px 12px;
  transition:all 0.22s ease;
  overflow:hidden;
  width:46px;
  backdrop-filter:blur(10px);
  box-shadow:-2px 0 20px rgba(41,182,246,0.10);
}
.tg-float-btn svg{flex-shrink:0;color:#29b6f6;}
.tg-float-label{
  font-family:'Outfit',sans-serif;
  font-size:12px;
  font-weight:700;
  color:#fff;
  white-space:nowrap;
  opacity:0;
  max-width:0;
  overflow:hidden;
  transition:all 0.22s ease;
  letter-spacing:0.04em;
}
.tg-float-btn:hover{
  width:110px;
  background:rgba(41,182,246,0.25);
  border-color:rgba(41,182,246,0.55);
  box-shadow:-4px 0 24px rgba(41,182,246,0.25);
  padding-right:14px;
}
.tg-float-btn:hover .tg-float-label{
  opacity:1;
  max-width:80px;
  margin-left:8px;
}
@media(max-width:560px){.tg-float{display:none;}}


.tg-float-fb{
  background:rgba(59,89,152,0.15);
  border-color:rgba(59,89,152,0.30);
  box-shadow:-2px 0 20px rgba(59,89,152,0.10);
}
.tg-float-fb svg{color:#4267b2;}
.tg-float-fb:hover{
  background:rgba(59,89,152,0.28);
  border-color:rgba(59,89,152,0.60);
  box-shadow:-4px 0 24px rgba(59,89,152,0.28);
}


.tg-float-dc{
  background:rgba(88,101,242,0.15);
  border-color:rgba(88,101,242,0.30);
  box-shadow:-2px 0 20px rgba(88,101,242,0.10);
}
.tg-float-dc svg{color:#5865f2;}
.tg-float-dc:hover{
  background:rgba(88,101,242,0.28);
  border-color:rgba(88,101,242,0.60);
  box-shadow:-4px 0 24px rgba(88,101,242,0.28);
}





/* ─── NAV ─── */
nav{position:fixed;top:0;left:0;right:0;z-index:200;height:68px;display:flex;align-items:center;justify-content:space-between;padding:0 5%;background:rgba(5,12,24,.88);backdrop-filter:blur(20px);border-bottom:1px solid var(--border);transition:box-shadow .3s;}
.nav-logo{display:flex;align-items:center;gap:8px;text-decoration:none;}
.nav-wordmark{font-size:20px;font-weight:800;color:#fff;letter-spacing:.02em;}
.nav-links{display:flex;align-items:center;position:absolute;left:50%;transform:translateX(-50%);}
.nav-link{padding:8px 16px;font-size:14px;color:var(--muted);text-decoration:none;transition:color .18s;white-space:nowrap;}
.nav-link:hover,.nav-link.active{color:#fff;}
.nav-right{display:flex;align-items:center;gap:8px;}
.nav-tg{width:36px;height:36px;border-radius:50%;border:1.5px solid rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.6);text-decoration:none;transition:all .18s;}
.nav-tg:hover{background:rgba(41,182,246,.15);border-color:rgba(41,182,246,.5);color:#29b6f6;}
.btn-nav{padding:8px 20px;border-radius:24px;font-family:'Outfit',sans-serif;font-size:13.5px;font-weight:600;cursor:pointer;text-decoration:none;border:2px solid rgba(255,255,255,.55);background:transparent;color:#fff;transition:all .18s;}
.btn-nav:hover{background:rgba(255,255,255,.08);border-color:#fff;}
.mob-btn{display:none;background:transparent;border:none;color:var(--muted);cursor:pointer;padding:6px;}
.mob-nav{display:none;position:fixed;inset:0;z-index:190;background:rgba(5,12,24,.97);backdrop-filter:blur(20px);flex-direction:column;align-items:center;justify-content:center;gap:18px;overflow-y:auto;padding:60px 24px 32px;}
.mob-nav.open{display:flex;}
.mob-close{position:absolute;top:22px;right:22px;background:transparent;border:none;color:var(--muted);cursor:pointer;padding:4px;}
.mob-nav .nav-link{font-size:20px;color:#fff;padding:6px 16px;}
.mob-nav-btns{display:flex;gap:12px;margin-top:12px;}
.mob-nav-btns .btn-nav{padding:12px 32px;font-size:15px;}
.mob-nav-extras{display:flex;align-items:center;gap:16px;margin-top:16px;padding-top:16px;border-top:1px solid rgba(255,255,255,.08);}
.mob-nav-social{display:flex;align-items:center;gap:8px;color:var(--muted);text-decoration:none;font-size:14px;font-weight:500;transition:color .18s;}
.mob-nav-social:hover{color:#29b6f6;}
.mob-lang-sel{position:relative;}
.mob-lang-btn{display:flex;align-items:center;gap:6px;padding:8px 14px;border-radius:8px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.06);color:#fff;font-size:14px;font-weight:600;cursor:pointer;font-family:'Outfit',sans-serif;}
.mob-lang-dropdown{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%) translateY(8px);background:#07101f;border:1px solid var(--border);border-radius:12px;padding:6px;min-width:160px;box-shadow:0 -16px 48px rgba(0,0,0,.6);z-index:1000;opacity:0;pointer-events:none;transition:all .2s;}
.mob-lang-dropdown.open{opacity:1;transform:translateX(-50%) translateY(0);pointer-events:all;}
@media(max-width:860px){
  .nav-links{display:none;}
  .mob-btn{display:block;}
  .nav-tg,.lang-sel{display:none;}
}
@media(max-width:480px){
  nav{padding:0 4%;}
  .nav-right .btn-nav:not(.btn-nav-fill){display:none;}
  .nav-right{gap:6px;}
}

/* ─── LIVE TRADE FEED (bottom fixed) ─── */
.trade-ticker{position:fixed;bottom:0;left:var(--sidebar);right:0;z-index:90;background:rgba(4,8,16,.97);border-top:1px solid rgba(37,99,235,.2);padding:7px 20px calc(7px + env(safe-area-inset-bottom, 0px));display:grid;grid-template-columns:minmax(0,130px) minmax(0,1fr);gap:20px;align-items:center;max-width:100%;}
.ticker-label{display:flex;flex-direction:column;gap:5px;}
.ticker-live-dot{width:6px;height:6px;border-radius:50%;background:#34d399;box-shadow:0 0 6px #34d399;animation:zblink 1.6s infinite;flex-shrink:0;}
.ticker-label-txt{font-family:'JetBrains Mono',monospace;font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#34d399;}
.ticker-label-sub{font-size:10.5px;color:rgba(255,255,255,.28);line-height:1.4;}
.feed-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:6px;}
.f-card{background:rgba(255,255,255,.028);border:1px solid rgba(255,255,255,.06);border-radius:7px;padding:7px 10px;display:flex;align-items:center;gap:8px;transition:background .15s;}
.f-card:hover{background:rgba(255,255,255,.055);}
.f-dot{width:5px;height:5px;border-radius:50%;flex-shrink:0;}
.f-pair{font-family:'JetBrains Mono',monospace;font-size:11.5px;font-weight:700;color:#fff;flex:1;}
.f-dir{font-size:8px;font-weight:800;padding:2px 6px;border-radius:3px;letter-spacing:.05em;flex-shrink:0;}
.f-buy{background:rgba(52,211,153,.14);color:#34d399;}
.f-sell{background:rgba(248,113,113,.12);color:#f87171;}
.f-pnl{font-family:'JetBrains Mono',monospace;font-size:11.5px;font-weight:700;flex-shrink:0;}
.f-age{font-family:'JetBrains Mono',monospace;font-size:9px;color:rgba(255,255,255,.28);flex-shrink:0;}
.content{padding-bottom:calc(28px + 56px + env(safe-area-inset-bottom, 0px))!important;}
@media(max-width:1200px){.feed-grid{grid-template-columns:repeat(4,1fr);grid-template-rows:auto auto;}}

@media(max-width:768px){.trade-ticker{left:0;}.feed-grid{grid-template-columns:repeat(2,1fr);}}

.btn-ghost{display:inline-flex;align-items:center;gap:8px;padding:12px 26px;border-radius:11px;background:transparent;color:var(--text);font-family:'Outfit',sans-serif;font-size:15px;font-weight:500;text-decoration:none;border:1.5px solid rgba(255,255,255,.25);cursor:pointer;transition:all .18s;}
.btn-ghost:hover{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.45);}

/* Scroll reveal helpers (used on guide, about, faq, home) */
.av{opacity:0;transform:translateY(22px);transition:opacity 0.7s ease,transform 0.7s ease;}
.av.in{opacity:1;transform:none;}

/* Floating social sidebar */
.social-float{position:fixed;right:0;top:50%;transform:translateY(-50%);z-index:500;display:flex;flex-direction:column;gap:6px;}
.sf-btn{display:flex;align-items:center;width:44px;padding:10px 11px;border-radius:10px 0 0 10px;border:1px solid rgba(255,255,255,.15);border-right:none;background:rgba(7,16,31,.85);backdrop-filter:blur(10px);color:rgba(255,255,255,.7);text-decoration:none;transition:all .22s;overflow:hidden;}
.sf-btn svg{flex-shrink:0;}
.sf-btn .sf-lbl{font-family:'Outfit',sans-serif;font-size:12px;font-weight:700;white-space:nowrap;max-width:0;min-width:0;overflow:hidden;opacity:0;transition:all .22s;letter-spacing:.04em;}
.sf-btn:hover{width:108px;padding-right:14px;}
.sf-btn:hover .sf-lbl{max-width:80px;opacity:1;margin-left:8px;}
.sf-tg:hover{background:rgba(41,182,246,.2);border-color:rgba(41,182,246,.4);color:#29b6f6;}
.sf-fb:hover{background:rgba(59,89,152,.2);border-color:rgba(59,89,152,.4);color:#4267b2;}
.sf-dc:hover{background:rgba(88,101,242,.2);border-color:rgba(88,101,242,.4);color:#5865f2;}
@media(max-width:560px){.social-float{display:none;}}



/* ── ANIMATIONS ───────────────────────────────────────────────── */
@keyframes fadeUp {
  from { opacity:0; transform:translateY(14px); }
  to   { opacity:1; transform:translateY(0); }
}

/* ── MAIN GRID (account area — all variants) ─────────────────── */
.main-grid {
  display: grid;
  align-items: start;
  gap: 18px;
  margin-bottom: 18px;
}
.main-grid--dashboard,
.main-grid--refer {
  grid-template-columns: 1fr 320px;
}
.main-grid--withdraw {
  grid-template-columns: 1fr 340px;
  gap: 20px;
  margin-bottom: 24px;
}
.main-grid--security {
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-bottom: 20px;
}

/* ── CARD (account / deposit shared) ─────────────────────────── */
.card {
  background: var(--card); border: 1px solid var(--border);
  border-radius: var(--r); overflow: hidden;
}
.card-hdr {
  display:flex; align-items:center; justify-content:space-between;
  padding: 18px 22px 14px; border-bottom: 1px solid var(--border);
}
.card-hdr:has(.card-status) { align-items: flex-start; }
.card-title { font-family:'Outfit',sans-serif; font-size:14px; font-weight:700; color:#fff; letter-spacing:-0.01em; }
.card-sub   { font-size:11px; color:var(--muted2); margin-top:2px; }
.card-link  { font-size:11.5px; color:var(--blue2); cursor:pointer; font-weight:500; transition:color 0.18s; }
.card-link:hover { color: var(--teal); }
.card-body  { padding: 20px 22px; }
.card-status{display:flex;align-items:center;gap:5px;font-size:11px;font-weight:600;padding:4px 10px;border-radius:6px;flex-shrink:0;}
.cs-enabled {background:rgba(16,185,129,0.14);color:var(--green2);border:1px solid rgba(16,185,129,0.22);}
.cs-disabled{background:rgba(244,63,94,0.12);color:var(--red2);border:1px solid rgba(244,63,94,0.22);}
.cs-dot{width:5px;height:5px;border-radius:50%;background:currentColor;}

/* Tab chips — deposit + deposit list */
.filter-tabs{
  display:flex;gap:3px;
  background:rgba(255,255,255,0.025);
  border:1px solid var(--border);
  border-radius:11px;padding:4px;
}
.f-tab{
  padding:7px 18px;border-radius:8px;
  font-size:12.5px;font-weight:500;cursor:pointer;
  transition:all 0.18s;color:var(--muted2);white-space:nowrap;
}
.f-tab:hover{color:var(--text2);}
.f-tab.active{
  background:linear-gradient(135deg,var(--blue),#1d4ed8)!important;
  color:#fff;
  box-shadow:0 2px 14px rgba(37,99,235,0.40);
}

/* ═══════════════════════════════════════════════════════════════
   RESPONSIVE — TABLET  (≤1100px)
═══════════════════════════════════════════════════════════════ */
@media (max-width: 1100px) {
  .main-grid--dashboard,
  .main-grid--refer { grid-template-columns: 1fr; }
  .right-col { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
  .referral-card { margin-bottom:0; }
}

/* ═══════════════════════════════════════════════════════════════
   RESPONSIVE — SMALL TABLET / LARGE PHONE  (≤860px)
═══════════════════════════════════════════════════════════════ */
@media (max-width: 860px) {
  :root { --sidebar: 240px; }

  /* Sidebar slides off screen */
  .sidebar { transform: translateX(-100%); }
  .sidebar.open { transform: translateX(0); box-shadow: 4px 0 32px rgba(0,0,0,0.5); }
  .sidebar-close { display:flex; }

  .main { margin-left: 0; }
  .menu-btn { display:flex; }

  .content { padding: 18px 16px; }
  .topbar {
    left: 0;
    min-height: var(--topbar);
    height: auto;
    padding: 10px 14px;
    gap: 10px 12px;
    flex-wrap: wrap;
    align-items: center;
    align-content: center;
  }
  .topbar-left { min-width: 0; flex: 1 1 160px; }
  .page-heading { min-width: 0; }
  .page-heading h1 {
    font-size: clamp(15px, 4vw, 20px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .topbar-actions {
    flex: 1 1 auto;
    min-width: 0;
    flex-shrink: 1;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
  }

  .stat-grid { grid-template-columns: repeat(2, 1fr); gap:12px; }
  .bottom-grid { grid-template-columns: 1fr; }
  .right-col { grid-template-columns: 1fr; }

  /* Hide some topbar items to save space */
  .topbar .btn-ghost { display:none; }
  .page-title p,
  .page-heading p { display:none; }
}

/* ═══════════════════════════════════════════════════════════════
   RESPONSIVE — PHONE  (≤560px)
═══════════════════════════════════════════════════════════════ */
@media (max-width: 560px) {
  .stat-grid { grid-template-columns: 1fr 1fr; gap:10px; }
  .stat-value { font-size: 20px; }
  .stat-card { padding: 14px; }
  .content { padding: 14px 12px; }

  .topbar { padding: 8px 12px; gap: 8px 10px; }
  .topbar-left { flex: 1 1 120px; }
  .btn-outline { padding: 7px 12px; font-size: 12px; }
  .btn-primary { padding: 8px 14px; font-size: 12.5px; }
  .lang-btn { padding: 6px 8px; font-size: 12px; gap: 4px; }

  /* Hide cycle progress column on very small screens */
  .pkg-table .hide-sm { display:none; }

  /* Stack credit banner */
  .credit-banner { flex-direction:column; align-items:flex-start; gap:10px; }
  .credit-countdown { font-size:22px; }

  .btn-primary span.btn-label { display:none; }

  /* Withdraw meta 1 col */
  .wd-meta { grid-template-columns: 1fr 1fr; }
}

/* ═══════════════════════════════════════════════════════════════
   RESPONSIVE — VERY SMALL  (≤380px)
═══════════════════════════════════════════════════════════════ */
@media (max-width: 420px) {
  #currentLang { display: none; }
  .topbar .btn-outline > span:last-child { display: none; }
  .topbar .btn-outline { padding: 7px 10px; }
}

@media (max-width: 380px) {
  .stat-grid { grid-template-columns: 1fr; }
  .topbar-right .icon-btn:first-child { display:none; }
  .page-heading h1 {
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    line-height: 1.25;
  }
}

/* ══════════════════════════════════════════════════════════════
   STEP INDICATOR
══════════════════════════════════════════════════════════════ */
.steps-bar {
  display:flex; align-items:center; gap:0;
  margin-bottom:28px;
}
.step {
  display:flex; align-items:center; gap:10px;
  flex:1; position:relative;
}
.step:not(:last-child)::after {
  content:'';
  position:absolute; left:calc(50% + 18px); top:50%;
  width:calc(100% - 36px); height:2px;
  background:var(--border);
  transform:translateY(-50%);
  z-index:0;
}
.step.done:not(:last-child)::after { background:var(--blue2); }

.step-circle {
  width:36px; height:36px; border-radius:50%; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  font-family:'Outfit',sans-serif; font-weight:700; font-size:13px;
  border:2px solid var(--border); background:var(--card);
  color:var(--muted2); position:relative; z-index:1; transition:all 0.3s;
}
.step.active .step-circle {
  background:linear-gradient(135deg,var(--blue),var(--teal));
  border-color:transparent; color:#fff;
  box-shadow:0 0 18px rgba(124,58,237,0.45);
}
.step.done .step-circle {
  background:rgba(16,185,129,0.2); border-color:var(--green2); color:var(--green2);
}
.step-info { display:flex; flex-direction:column; }
.step-num  { font-size:9.5px; color:var(--muted); text-transform:uppercase; letter-spacing:0.1em; }
.step-name { font-family:'Outfit',sans-serif; font-size:12px; font-weight:600; color:var(--muted2); }
.step.active .step-name { color:#fff; }
.step.done  .step-name  { color:var(--green2); }


/* ── Nav fill button ── */
.btn-nav-fill{background:linear-gradient(135deg,#2563eb,#1d4ed8)!important;border-color:transparent!important;box-shadow:0 3px 14px rgba(37,99,235,.42);}
.btn-nav-fill:hover{transform:translateY(-1px);}

/* ── Language selector ── */
.lang-sel{position:relative;display:flex;align-items:center;}
.lang-btn{display:flex;align-items:center;gap:6px;padding:10px 8px;border-radius:38px;border:1px solid rgba(37,99,235,.5);background:rgba(37,99,235,.12);color:#fff;font-size:13px;font-weight:600;cursor:pointer;transition:all .18s;font-family:'Outfit',sans-serif;white-space:nowrap;}
.lang-btn:hover{border-color:rgba(37,99,235,.8);background:rgba(37,99,235,.22);color:#fff;}
.lang-btn svg{transition:transform .2s;}
.lang-btn.open svg{transform:rotate(180deg);}
.lang-flag{width:18px;height:15px;border-radius:5px;display:block;flex-shrink:0;object-fit:cover;}
.lang-dropdown{position:absolute;top:calc(100% + 8px);right:0;background:#07101f;border:1px solid var(--border);border-radius:12px;padding:6px;min-width:160px;box-shadow:0 16px 48px rgba(0,0,0,.6);z-index:1000;opacity:0;transform:translateY(-8px);pointer-events:none;transition:all .2s;}
.lang-dropdown.open{opacity:1;transform:translateY(0);pointer-events:all;}
.lang-option{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:8px;cursor:pointer;transition:background .15s;font-size:13px;font-weight:500;color:var(--muted);text-decoration:none;}
.lang-option:hover{background:rgba(37,99,235,.1);color:var(--text);}
.lang-option.active{color:#fff;background:rgba(37,99,235,.14);}
.lang-option .lang-flag{font-size:16px;}

/* ── Cookie banner ── */
.cookie-bar{position:fixed;bottom:0;left:0;right:0;z-index:9999;background:rgba(5,8,20,.97);border-top:1px solid rgba(37,99,235,.25);backdrop-filter:blur(20px);padding:16px 32px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;transform:translateY(100%);transition:transform .4s cubic-bezier(.34,1.2,.64,1);box-shadow:0 -8px 32px rgba(0,0,0,.5);}
.cookie-bar.visible{transform:translateY(0);}
.cookie-bar-left{display:flex;align-items:center;gap:14px;flex:1;min-width:260px;}
.cookie-ico{width:38px;height:38px;border-radius:10px;background:rgba(37,99,235,.15);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:18px;}
.cookie-title{font-size:13.5px;font-weight:700;color:#fff;margin-bottom:3px;}
.cookie-text{font-size:12px;color:rgba(255,255,255,.45);line-height:1.5;}
.cookie-text a{color:#60a5fa;text-decoration:none;}
.cookie-text a:hover{text-decoration:underline;}
.cookie-actions{display:flex;align-items:center;gap:9px;flex-shrink:0;}
.cookie-decline{padding:9px 18px;border-radius:8px;border:1px solid rgba(255,255,255,.12);background:transparent;color:rgba(255,255,255,.5);font-size:13px;font-weight:600;cursor:pointer;transition:all .18s;font-family:'Outfit',sans-serif;}
.cookie-decline:hover{border-color:rgba(255,255,255,.25);color:#fff;}
.cookie-settings{padding:9px 18px;border-radius:8px;border:1px solid rgba(37,99,235,.35);background:rgba(37,99,235,.1);color:#60a5fa;font-size:13px;font-weight:600;cursor:pointer;transition:all .18s;font-family:'Outfit',sans-serif;}
.cookie-settings:hover{background:rgba(37,99,235,.22);}
.cookie-accept{padding:9px 22px;border-radius:8px;background:linear-gradient(135deg,#2563eb,#1d4ed8);border:none;color:#fff;font-size:13px;font-weight:700;cursor:pointer;box-shadow:0 4px 14px rgba(37,99,235,.4);transition:all .18s;font-family:'Outfit',sans-serif;}
.cookie-accept:hover{transform:translateY(-1px);}
.cookie-modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:10000;display:none;align-items:center;justify-content:center;padding:20px;}
.cookie-modal-overlay.open{display:flex;}
.cookie-modal{background:#07101f;border:1px solid rgba(37,99,235,.25);border-radius:18px;width:100%;max-width:480px;padding:28px;box-shadow:0 24px 60px rgba(0,0,0,.7);}
.cm-title{font-size:18px;font-weight:800;color:#fff;margin-bottom:6px;}
.cm-sub{font-size:13px;color:rgba(255,255,255,.45);margin-bottom:22px;line-height:1.6;}
.cm-row{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.06);}
.cm-row:last-of-type{border-bottom:none;}
.cm-row-title{font-size:13.5px;font-weight:700;color:#fff;margin-bottom:3px;}
.cm-row-desc{font-size:12px;color:rgba(255,255,255,.4);line-height:1.5;}
.cm-toggle{position:relative;width:44px;height:24px;flex-shrink:0;margin-top:2px;}
.cm-toggle input{opacity:0;width:0;height:0;}
.cm-slider{position:absolute;inset:0;border-radius:24px;background:rgba(255,255,255,.12);cursor:pointer;transition:.25s;}
.cm-slider::before{content:'';position:absolute;width:18px;height:18px;left:3px;top:3px;border-radius:50%;background:#fff;transition:.25s;}
.cm-toggle input:checked+.cm-slider{background:#2563eb;}
.cm-toggle input:checked+.cm-slider::before{transform:translateX(20px);}
.cm-toggle input:disabled+.cm-slider{opacity:.5;cursor:not-allowed;}
.cm-btns{display:flex;gap:10px;margin-top:22px;}
.cm-btn-accept{flex:1;padding:11px;border-radius:10px;background:linear-gradient(135deg,#2563eb,#1d4ed8);border:none;color:#fff;font-size:14px;font-weight:700;cursor:pointer;font-family:'Outfit',sans-serif;}
.cm-btn-save{flex:1;padding:11px;border-radius:10px;border:1px solid rgba(37,99,235,.35);background:rgba(37,99,235,.1);color:#60a5fa;font-size:14px;font-weight:600;cursor:pointer;font-family:'Outfit',sans-serif;}


/* ── Shared form elements (login / signup) ── */
.f-title{font-size:26px;font-weight:800;color:#fff;letter-spacing:-.025em;margin-bottom:6px;}
.f-subtitle{font-size:14px;color:var(--muted);margin-bottom:24px;}
.f-subtitle a{color:var(--blue3);text-decoration:none;font-weight:600;}
.f-subtitle a:hover{text-decoration:underline;}
.fg{margin-bottom:16px;}
.fl{font-size:11.5px;font-weight:700;color:var(--muted);letter-spacing:.07em;text-transform:uppercase;margin-bottom:7px;display:block;}
.fw{position:relative;}
.fi{width:100%;padding:13px 16px 13px 44px;border-radius:11px;background:rgba(255,255,255,.05);border:1.5px solid rgba(255,255,255,.12);color:#fff;font-family:'Outfit',sans-serif;font-size:15px;outline:none;transition:all .2s;}
.fi::placeholder{color:rgba(255,255,255,.22);}
.fi:focus{border-color:rgba(37,99,235,.6);background:rgba(37,99,235,.07);box-shadow:0 0 0 3px rgba(37,99,235,.12);}
.fi-ico{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:rgba(255,255,255,.3);pointer-events:none;}
.fw:focus-within .fi-ico{color:var(--blue3);}
.fi-eye{position:absolute;right:14px;top:50%;transform:translateY(-50%);background:transparent;border:none;color:rgba(255,255,255,.3);cursor:pointer;padding:4px;transition:color .18s;}
.fi-eye:hover{color:var(--muted);}
.f-btn{width:100%;padding:14px;border-radius:11px;background:linear-gradient(135deg,#2563eb,#1d4ed8);color:#fff;font-family:'Outfit',sans-serif;font-size:15px;font-weight:700;border:none;cursor:pointer;box-shadow:0 6px 28px rgba(37,99,235,.4);transition:all .22s;display:flex;align-items:center;justify-content:center;gap:9px;margin-bottom:16px;}
.f-btn:hover{transform:translateY(-2px);box-shadow:0 12px 36px rgba(37,99,235,.6);}
.f-btn:disabled{opacity:.6;cursor:not-allowed;transform:none;}
.f-bot{text-align:center;font-size:13px;color:var(--muted);}
.f-bot a,.f-bot button{color:var(--blue3);text-decoration:none;font-weight:600;background:transparent;border:none;cursor:pointer;font-family:'Outfit',sans-serif;font-size:13px;}
.f-bot a:hover,.f-bot button:hover{text-decoration:underline;}
.f-err{background:rgba(239,68,68,.10);border:1px solid rgba(239,68,68,.30);border-radius:9px;padding:11px 15px;font-size:13px;color:#f87171;margin-bottom:14px;display:none;}
.f-err.show{display:block;}
.f-inf{background:rgba(37,99,235,.10);border:1px solid rgba(37,99,235,.28);border-radius:9px;padding:11px 15px;font-size:13px;color:var(--blue3);margin-bottom:14px;display:none;}
.f-inf.show{display:block;}
.error{background:rgba(239,68,68,.10);border:1px solid rgba(239,68,68,.30);border-radius:9px;padding:11px 15px;font-size:13px;color:#f87171;margin-bottom:10px;}
@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
.spin{animation:spin .9s linear infinite;}