:root{
  --bg-primary: #090710;
  --bg-secondary: rgba(19, 15, 34, 0.75);





  --bg-menu: #15102a;
  --bg-card: rgba(30, 24, 53, 0.45);
  --bg-accent: #261e43;
  --text-primary: #f3f0ff;
  --text-muted: #958da9;
  --color-buy: #0ecb81;
  --color-buy-transparent: rgba(14, 203, 129, 0.12);
  --color-sell: #f6465d;
  --color-sell-transparent: rgba(246, 70, 93, 0.12);
  --color-brand: #d81b60;
  --color-cosmos: #7c4dff;
  --border-color: rgba(44, 34, 77, 0.5);
  --font-family: 'Inter', sans-serif;
  --font-logo: 'Outfit', sans-serif;
  --glow-brand: 0 0 12px rgba(216, 27, 96, 0.4);
  --glow-cosmos: 0 0 15px rgba(124, 77, 255, 0.4);





  --fade-end: 90deg;
















  --fade-18: linear-gradient(var(--fade-end), #000 calc(100% - 18px), transparent);
  --fade-20: linear-gradient(var(--fade-end), #000 calc(100% - 20px), transparent);
  --fade-22: linear-gradient(var(--fade-end), #000 calc(100% - 22px), transparent);
  --fade-24: linear-gradient(var(--fade-end), #000 calc(100% - 24px), transparent);
  --fade-26: linear-gradient(var(--fade-end), #000 calc(100% - 26px), transparent);
  --fade-28: linear-gradient(var(--fade-end), #000 calc(100% - 28px), transparent);
  --fade-30: linear-gradient(var(--fade-end), #000 calc(100% - 30px), transparent);
  --fade-34: linear-gradient(var(--fade-end), #000 calc(100% - 34px), transparent);
}
*{
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
body{
  background-color: var(--bg-primary);
  color: var(--text-primary);
  font-family: var(--font-family);
  font-size: 13px;
  overflow: hidden;
  height: 100vh;
  display: flex;
  flex-direction: column;
}
::-webkit-scrollbar{
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track{
  background: transparent;
}
::-webkit-scrollbar-thumb{
  background: var(--border-color);
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover{
  background: var(--color-cosmos);
}
.app-header{
  height: 64px;
  background-color: rgba(9, 7, 16, 0.9);
  border-bottom: 1px solid var(--border-color);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
  z-index: 10;
  backdrop-filter: blur(8px);
}
.hidden{
  display: none !important;
}
.lang-switcher{ position: relative; display: inline-flex; }
.lang-chip{
  display: inline-flex; align-items: center; gap: 5px; cursor: pointer; font-family: inherit;
  padding: 4px 9px; border-radius: 20px; font-size: 11px; font-weight: 600; color: var(--text-muted);
  background: rgba(124, 77, 255, 0.10); border: 1px solid rgba(124, 77, 255, 0.25); transition: background .15s;
}
.lang-chip > #lang-cur,
.lang-chip > .net-caret{ display: none; }
.lang-chip:hover{ background: rgba(124, 77, 255, 0.18); }
.lang-menu{ position: absolute; top: calc(100% + 6px); right: 0; z-index: 60; min-width: 170px;
  background: var(--bg-menu); border: 1px solid var(--stroke, rgba(124,77,255,0.25));
  border-radius: 10px; padding: 5px; box-shadow: 0 12px 32px rgba(0,0,0,0.5); max-height: 70vh; overflow-y: auto; }
.lang-menu.hidden{ display: none; }
.lang-opt{ display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 7px;
  font-size: 12.5px; font-weight: 600; color: var(--text-primary); cursor: pointer; }
.lang-opt:hover{ background: var(--bg-accent); }
.lang-opt.active{ color: var(--color-cosmos); }
.lang-opt .lang-flag{ font-size: 15px; line-height: 1; }
:root{
  --bg-0: #07060d;
  --bg-1: #0c0a17;
  --glass: rgba(20, 16, 36, 0.55);
  --glass-strong: rgba(26, 21, 46, 0.72);
  --stroke: rgba(124, 77, 255, 0.14);
  --stroke-soft: rgba(255, 255, 255, 0.05);
  --accent-grad: linear-gradient(135deg, #d81b60 0%, #9d3be8 50%, #7c4dff 100%);
  --buy-grad: linear-gradient(135deg, #0ecb81, #0a9d68);
  --sell-grad: linear-gradient(135deg, #f6465d, #c92a44);
  --shadow-lg: 0 18px 50px -12px rgba(0,0,0,0.7);
}
body{
  background:
    radial-gradient(1100px 700px at 12% -8%, rgba(124,77,255,0.16), transparent 60%),
    radial-gradient(900px 650px at 100% 0%, rgba(216,27,96,0.13), transparent 55%),
    radial-gradient(800px 800px at 50% 120%, rgba(124,77,255,0.10), transparent 60%),
    var(--bg-0);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.1px;
}
.app-header{
  height: 60px;
  background: linear-gradient(180deg, rgba(12,10,23,0.96), rgba(10,8,18,0.82));
  border-bottom: 1px solid var(--stroke);
  box-shadow: 0 1px 0 var(--stroke-soft), 0 8px 30px -20px rgba(0,0,0,0.9);
  backdrop-filter: blur(16px) saturate(140%);
}
::-webkit-scrollbar-thumb{ background: rgba(124,77,255,0.35); border-radius: 10px; }
::-webkit-scrollbar-thumb:hover{ background: rgba(124,77,255,0.55); }
@media (max-width: 980px){
body{ overflow: auto; height: auto; }
.app-header{ flex-wrap: wrap; height: auto; gap: 8px; padding: 10px 14px; }
body:has(#view-stocks.active, #view-onchain.active, #view-walls.active, #view-analytics.active,
           #view-liq.active, #view-hlpage.active, #view-agents.active) .app-header{ display: none; }
}
body:has(#fb-fab) .disc-marquee{ margin-inline-end: 120px; }
@media (max-width: 720px){
body:has(#fb-fab) .disc-marquee{ margin-inline-end: 0; }
body:has(.disc-marquee) .fb-fab{ bottom: calc(var(--sp-h-mobile, 34px) + 46px); }
body:has(.disc-marquee):has(.view.active .fav-bar:not(.hidden)) .fb-fab{ bottom: calc(var(--sp-h-mobile, 34px) + 46px + 34px); }
body .fb-fab{ padding: 8px; gap: 0; }
body .fb-fab > span{
    position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0;
    overflow: hidden; clip-path: inset(50%); white-space: nowrap;
  }
}
.bx-x{ color: var(--color-brand, #d81b60); }
.bx-pf{
  color: inherit;
  background: linear-gradient(90deg, #2f9dff 0%, #7b5cff 55%, #a855f7 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
[dir="rtl"]{ --fade-end: 270deg; }
@media (max-width: 980px){
.app-header{ flex-wrap: wrap; row-gap: 5px; align-items: center; }
}
body{ padding-bottom: 22px; }
@media (max-width: 980px){
.app-header{ --hdr-ctl-h: 40px; }
.app-header .net-chip,
  .app-header .net-gas-chip,
  .app-header #pair-combo #pair-input,
  
  .app-header .lang-chip,
  .app-header .header-actions .btn-icon,
  .app-header .header-actions .header-wallet-connect,
  .app-header .header-actions .wallet-badge{
    height: var(--hdr-ctl-h);
    min-height: var(--hdr-ctl-h);
    border-radius: 12px;
    box-sizing: border-box;
  }
.app-header:not(.venue-hl):not(.venue-cex):not(.venue-dn) .lang-menu{ left: 0; right: auto; max-width: calc(100vw - 28px); }
}
@media (max-width: 560px){
.app-header:not(.venue-hl):not(.venue-cex):not(.venue-dn){ padding: 6px 14px; row-gap: 4px; }
}
:root{


  --radius-card: 14px;
  --radius-ctl: 8px;
  --ctl-h: 31px;


  --focus-ring: #c9b8ff;
  --ctl-caret: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23958da9' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --ctl-check: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.4 6.2l2.5 2.5 4.7-5.1' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
:is(a, button, input, select, textarea, summary, [tabindex], [role="button"], [role="tab"], [role="switch"], [contenteditable="true"]):focus-visible{
  outline: 2px solid var(--focus-ring) !important;
  outline-offset: 2px !important;
}
:root{



  --th-size: 10.5px;
  --th-weight: 700;
  --th-tracking: .5px;
  --th-color: var(--text-muted);




  --page-gutter: 16px;




  --page-max: 100%;
}