/* ==========================================================================
   DEXFUN.ONLINE — NEON CRYPTO THEME & 6-SECTION UI SYSTEM (dexfun-neon-v1)
   Palette:
   - Bg Primary:     #0B0714 / #0E0A1A
   - Surface/Cards:  #151026 / #1C1533
   - Neon Lime:      #B8FF01
   - Electric Purple:#9D4EDD / #7B2CBF
   - Neon Crimson:   #FF3B69
   ========================================================================== */

:root,
html,
body {
  --bg: #0B0714 !important;
  --bg-elevated: #120C21 !important;
  --surface: #151026 !important;
  --surface-2: #1C1533 !important;
  --panel: #151026 !important;
  --card: #151026 !important;
  --line: rgba(157, 78, 221, 0.26) !important;
  --border: rgba(157, 78, 221, 0.28) !important;
  --text: #F7F5FF !important;
  --muted: #A79BC2 !important;
  --quiet: #8F82AD !important;
  --green: #B8FF01 !important;
  --up: #B8FF01 !important;
  --red: #FF3B69 !important;
  --down: #FF3B69 !important;
  --amber: #FFBE0B !important;
  --accent: #B8FF01 !important;
  --purple: #9D4EDD !important;
  --purple-deep: #7B2CBF !important;
  background-color: #0B0714 !important;
  color: #F7F5FF !important;
}

body {
  background:
    radial-gradient(circle at 18% 0%, rgba(157, 78, 221, 0.16) 0%, transparent 42%),
    radial-gradient(circle at 85% 8%, rgba(184, 255, 1, 0.08) 0%, transparent 36%),
    #0B0714 !important;
}

/* --- TOP HEADER & 6-SECTION NAVIGATION --- */
header {
  background: rgba(11, 7, 20, 0.92) !important;
  backdrop-filter: blur(16px) !important;
  border-bottom: 1px solid rgba(157, 78, 221, 0.32) !important;
  box-shadow: 0 6px 28px rgba(0, 0, 0, 0.55) !important;
  gap: 10px !important;
}

header a.brand {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  text-decoration: none !important;
}

header a.brand img {
  width: 34px !important;
  height: 34px !important;
  border-radius: 10px !important;
  box-shadow: 0 0 14px rgba(184, 255, 1, 0.35) !important;
  border: 1px solid rgba(184, 255, 1, 0.45) !important;
}

header .brand-name {
  font-weight: 800 !important;
  font-size: 1.18rem !important;
  letter-spacing: -0.02em !important;
  background: linear-gradient(90deg, #FFFFFF 0%, #B8FF01 55%, #C77DFF 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

header .brand-slogan {
  color: #A79BC2 !important;
  font-size: 0.72rem !important;
}

.df-topnav {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px;
  background: rgba(21, 16, 38, 0.9);
  border: 1px solid rgba(157, 78, 221, 0.3);
  border-radius: 999px;
}

.df-topnav-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 13px;
  border-radius: 999px;
  border: 1px solid transparent;
  background: transparent;
  color: #C9BFE3;
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.14s ease;
  white-space: nowrap;
}

.df-topnav-btn:hover {
  color: #FFFFFF;
  background: rgba(157, 78, 221, 0.2);
}

.df-topnav-btn.active {
  background: #B8FF01 !important;
  color: #0B0714 !important;
  font-weight: 700;
  box-shadow: 0 0 16px rgba(184, 255, 1, 0.38);
}

.df-topnav-ic {
  font-size: 0.88rem;
  line-height: 1;
}

@media (max-width: 1120px) {
  .df-topnav {
    display: none;
  }
}

header .search-box input#search {
  background: #140E24 !important;
  border: 1px solid rgba(157, 78, 221, 0.36) !important;
  color: #F7F5FF !important;
  border-radius: 999px !important;
}

header .search-box input#search:focus {
  border-color: #B8FF01 !important;
  box-shadow: 0 0 0 2px rgba(184, 255, 1, 0.22) !important;
}

header .wallet,
header .wallet.connect-wallet {
  background: #B8FF01 !important;
  color: #0B0714 !important;
  font-weight: 700 !important;
  border: 1px solid #B8FF01 !important;
  border-radius: 999px !important;
  box-shadow: 0 0 16px rgba(184, 255, 1, 0.32) !important;
  padding: 7px 15px !important;
}

header .wallet:hover {
  filter: brightness(1.06);
  box-shadow: 0 0 22px rgba(184, 255, 1, 0.5) !important;
}

.df-settings-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #151026;
  border: 1px solid rgba(157, 78, 221, 0.35);
  color: #E2D9F3;
  cursor: pointer;
}

.df-settings-btn:hover {
  border-color: #B8FF01;
  color: #B8FF01;
}

/* --- SIDEBAR & TICKER --- */
#sidebar,
.side-module {
  background: #120D22 !important;
  border-color: rgba(157, 78, 221, 0.24) !important;
}

#sidebar > button.active {
  background: rgba(184, 255, 1, 0.14) !important;
  color: #B8FF01 !important;
  border-color: rgba(184, 255, 1, 0.45) !important;
}

#ticker {
  background: rgba(14, 10, 26, 0.95) !important;
  border-top: 1px solid rgba(157, 78, 221, 0.3) !important;
  border-bottom: 1px solid rgba(157, 78, 221, 0.3) !important;
}

/* --- MARKETS HERO BANNER --- */
.df-hero {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 20px;
  padding: 20px 24px;
  margin-bottom: 16px;
  border-radius: 18px;
  background:
    radial-gradient(circle at 85% 50%, rgba(184, 255, 1, 0.16) 0%, rgba(157, 78, 221, 0.22) 38%, transparent 70%),
    linear-gradient(135deg, #161029 0%, #1E1438 55%, #110B20 100%);
  border: 1px solid rgba(157, 78, 221, 0.42);
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.df-hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 4px 11px;
  border-radius: 999px;
  background: rgba(157, 78, 221, 0.2);
  border: 1px solid rgba(184, 255, 1, 0.38);
  color: #B8FF01;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  margin-bottom: 8px;
}

.df-pulse-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #B8FF01;
  box-shadow: 0 0 8px #B8FF01;
}

.df-hero-title {
  font-size: clamp(1.35rem, 2.2vw, 1.85rem);
  font-weight: 800;
  line-height: 1.18;
  margin: 0 0 6px 0;
  color: #FFFFFF;
}

.df-text-lime {
  color: #B8FF01 !important;
}

.df-text-purple {
  color: #C77DFF !important;
}

.df-hero-sub {
  margin: 0 0 14px 0;
  color: #B8AED2;
  font-size: 0.88rem;
  max-width: 64ch;
}

.df-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 14px;
}

.df-btn-lime {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 8px 16px;
  border-radius: 999px;
  border: 1px solid #B8FF01;
  background: #B8FF01;
  color: #0B0714 !important;
  font-weight: 700;
  font-size: 0.84rem;
  cursor: pointer;
  box-shadow: 0 0 16px rgba(184, 255, 1, 0.28);
  transition: transform 0.12s ease, box-shadow 0.12s ease;
}

.df-btn-lime:hover {
  transform: translateY(-1px);
  box-shadow: 0 0 22px rgba(184, 255, 1, 0.48);
}

.df-btn-purple {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 8px 16px;
  border-radius: 999px;
  border: 1px solid rgba(199, 125, 255, 0.55);
  background: linear-gradient(135deg, #7B2CBF 0%, #9D4EDD 100%);
  color: #FFFFFF !important;
  font-weight: 700;
  font-size: 0.84rem;
  cursor: pointer;
  box-shadow: 0 0 16px rgba(157, 78, 221, 0.35);
}

.df-btn-ghost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 8px 15px;
  border-radius: 999px;
  border: 1px solid rgba(157, 78, 221, 0.4);
  background: rgba(21, 16, 38, 0.85);
  color: #E5DEFA !important;
  font-weight: 600;
  font-size: 0.84rem;
  cursor: pointer;
}

.df-btn-ghost:hover {
  border-color: #B8FF01;
  color: #B8FF01 !important;
}

.df-btn-sm {
  padding: 5px 12px;
  font-size: 0.78rem;
}

.df-btn-xs {
  padding: 4px 10px;
  font-size: 0.74rem;
}

.df-hero-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 10px;
}

.df-stat-pill {
  padding: 8px 12px;
  border-radius: 12px;
  background: rgba(11, 7, 20, 0.65);
  border: 1px solid rgba(157, 78, 221, 0.28);
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.df-stat-label {
  font-size: 0.72rem;
  color: #A79BC2;
}

.df-stat-val {
  font-size: 0.96rem;
  font-weight: 700;
  color: #F7F5FF;
}

.df-mascot-frame {
  width: 190px;
  height: 158px;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(184, 255, 1, 0.38);
  box-shadow: 0 0 26px rgba(157, 78, 221, 0.42);
  background: #120B20;
}

.df-mascot-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

@media (max-width: 820px) {
  .df-hero {
    grid-template-columns: 1fr;
  }
  .df-hero-visual {
    display: none;
  }
}

/* --- DISCOVER TABSTRIP & TOKEN TABLE --- */
.discover-lists button[data-filter] {
  background: #151026 !important;
  border: 1px solid rgba(157, 78, 221, 0.28) !important;
  color: #C9BFE3 !important;
  border-radius: 999px !important;
}

.discover-lists button[data-filter].selected,
.discover-lists button[data-filter][aria-pressed="true"] {
  background: #B8FF01 !important;
  color: #0B0714 !important;
  border-color: #B8FF01 !important;
  font-weight: 700 !important;
  box-shadow: 0 0 14px rgba(184, 255, 1, 0.32) !important;
}

.token-table {
  background: #130E24 !important;
  border: 1px solid rgba(157, 78, 221, 0.28) !important;
  border-radius: 16px !important;
}

.columnheads {
  background: #191230 !important;
  border-bottom: 1px solid rgba(157, 78, 221, 0.28) !important;
}

#tokenrows .token {
  border-bottom: 1px solid rgba(157, 78, 221, 0.16) !important;
}

#tokenrows .token:hover {
  background: rgba(157, 78, 221, 0.14) !important;
}

.ui-row-buy {
  background: rgba(184, 255, 1, 0.16) !important;
  color: #B8FF01 !important;
  border: 1px solid rgba(184, 255, 1, 0.45) !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
}

.ui-row-buy:hover {
  background: #B8FF01 !important;
  color: #0B0714 !important;
}

/* --- NUMERIC SAFETY SCORE BADGE --- */
.df-score-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  padding: 1px 6px;
  border-radius: 999px;
  font-size: 0.73rem;
  font-weight: 800;
  margin-right: 4px;
  background: rgba(184, 255, 1, 0.16);
  color: #B8FF01;
  border: 1px solid rgba(184, 255, 1, 0.4);
}

.df-score-badge[data-tone="signal"] {
  background: rgba(255, 190, 11, 0.18);
  color: #FFBE0B;
  border-color: rgba(255, 190, 11, 0.45);
}

.df-score-badge[data-tone="strong"] {
  background: rgba(255, 59, 105, 0.2);
  color: #FF3B69;
  border-color: rgba(255, 59, 105, 0.5);
}

.df-score-badge[data-tone="neutral"] {
  background: rgba(167, 155, 194, 0.16);
  color: #C9BFE3;
  border-color: rgba(167, 155, 194, 0.3);
}

/* --- PRICE & CHANGE COLORS --- */
.money-value[data-price-tone="up"],
.change-value[data-change="up"],
.tick-change[data-change="up"] {
  color: #B8FF01 !important;
}

.money-value[data-price-tone="down"],
.change-value[data-change="down"],
.tick-change[data-change="down"] {
  color: #FF3B69 !important;
}

/* --- TOKEN DETAIL SWAP CARD & SAFETY SCORE BANNER --- */
.df-swap-card {
  background: linear-gradient(180deg, #18112D 0%, #120D22 100%);
  border: 1px solid rgba(157, 78, 221, 0.38);
  border-radius: 16px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.42);
}

.df-swap-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.df-swap-tabs {
  display: inline-flex;
  background: #0D0818;
  padding: 3px;
  border-radius: 10px;
  border: 1px solid rgba(157, 78, 221, 0.26);
}

.df-swap-tab {
  padding: 6px 18px;
  border-radius: 8px;
  border: none;
  background: transparent;
  color: #A79BC2;
  font-weight: 700;
  font-size: 0.84rem;
  cursor: pointer;
}

.df-swap-tab.active-buy {
  background: #B8FF01;
  color: #0B0714;
}

.df-swap-tab.active-sell {
  background: #FF3B69;
  color: #FFFFFF;
}

.df-swap-orders {
  display: inline-flex;
  gap: 4px;
}

.df-order-pill {
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid rgba(157, 78, 221, 0.28);
  background: #140E24;
  color: #A79BC2;
  font-size: 0.74rem;
  cursor: pointer;
}

.df-order-pill.active {
  border-color: #9D4EDD;
  color: #F7F5FF;
  background: rgba(157, 78, 221, 0.25);
}

.df-swap-box {
  background: #0E0A1A;
  border: 1px solid rgba(157, 78, 221, 0.26);
  border-radius: 12px;
  padding: 12px;
}

.df-swap-row-top {
  display: flex;
  justify-content: space-between;
  font-size: 0.75rem;
  color: #A79BC2;
  margin-bottom: 6px;
}

.df-swap-input-row,
.df-swap-output-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.df-swap-input {
  background: transparent;
  border: none;
  color: #FFFFFF;
  font-size: 1.25rem;
  font-weight: 700;
  width: 100%;
  outline: none;
}

.df-swap-est {
  font-size: 1.15rem;
  font-weight: 800;
  color: #B8FF01;
}

.df-swap-unit {
  padding: 4px 10px;
  border-radius: 999px;
  background: #1B1333;
  border: 1px solid rgba(157, 78, 221, 0.34);
  font-size: 0.78rem;
  font-weight: 700;
  color: #F7F5FF;
  white-space: nowrap;
}

.df-swap-presets {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  margin-top: 10px;
}

.df-preset-btn,
.df-slip-pill {
  padding: 5px 8px;
  border-radius: 8px;
  border: 1px solid rgba(157, 78, 221, 0.28);
  background: #161029;
  color: #C9BFE3;
  font-size: 0.74rem;
  font-weight: 600;
  cursor: pointer;
}

.df-preset-btn.active,
.df-slip-pill.active {
  border-color: #B8FF01;
  color: #B8FF01;
  background: rgba(184, 255, 1, 0.12);
}

.df-swap-divider {
  display: flex;
  justify-content: center;
  margin: -6px 0;
}

.df-swap-divider span {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #1C1433;
  border: 1px solid rgba(157, 78, 221, 0.4);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #B8FF01;
  font-size: 0.82rem;
}

.df-slippage-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 0.76rem;
}

.df-slippage-pills {
  display: inline-flex;
  gap: 4px;
}

.df-swap-meta {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  padding: 8px 10px;
  border-radius: 10px;
  background: rgba(11, 7, 20, 0.55);
  font-size: 0.73rem;
}

.df-swap-meta > div {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.df-swap-meta span {
  color: #9D91B8;
}

.df-swap-cta {
  width: 100%;
  padding: 11px 16px;
  border-radius: 12px;
  font-size: 0.92rem;
  font-weight: 800;
  cursor: pointer;
  border: none;
}

.df-cta-buy {
  background: #B8FF01;
  color: #0B0714;
  box-shadow: 0 0 18px rgba(184, 255, 1, 0.35);
}

.df-cta-sell {
  background: #FF3B69;
  color: #FFFFFF;
  box-shadow: 0 0 18px rgba(255, 59, 105, 0.35);
}

.df-ts-score-banner {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 14px;
  margin-bottom: 12px;
  border-radius: 12px;
  background: rgba(21, 16, 38, 0.9);
  border: 1px solid rgba(184, 255, 1, 0.35);
}

.df-ts-score-banner[data-tone="signal"] {
  border-color: rgba(255, 190, 11, 0.45);
}

.df-ts-score-banner[data-tone="strong"] {
  border-color: rgba(255, 59, 105, 0.5);
}

.df-ts-score-circle {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: rgba(184, 255, 1, 0.14);
  border: 2px solid #B8FF01;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  line-height: 1;
  color: #B8FF01;
}

.df-ts-score-circle[data-tone="signal"] {
  border-color: #FFBE0B;
  color: #FFBE0B;
  background: rgba(255, 190, 11, 0.14);
}

.df-ts-score-circle[data-tone="strong"] {
  border-color: #FF3B69;
  color: #FF3B69;
  background: rgba(255, 59, 105, 0.16);
}

.df-ts-score-circle strong {
  font-size: 1.05rem;
  font-weight: 800;
}

.df-ts-score-circle small {
  font-size: 0.62rem;
  opacity: 0.85;
}

.df-ts-score-meta {
  display: flex;
  flex-direction: column;
  gap: 3px;
  font-size: 0.82rem;
}

.df-ts-score-meta span {
  color: #A79BC2;
  font-size: 0.76rem;
}

/* --- SHARED DEXFUN PAGE SECTIONS (LAUNCHPAD, BOT, COMMUNITY, WALLET) --- */
.df-page {
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding-bottom: 36px;
}

.df-section-hero,
.df-wallet-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  padding: 20px 24px;
  border-radius: 18px;
  background: linear-gradient(135deg, #17102C 0%, #1F143B 60%, #120C22 100%);
  border: 1px solid rgba(157, 78, 221, 0.38);
}

.df-section-hero h1 {
  margin: 4px 0 6px 0;
  font-size: clamp(1.3rem, 2vw, 1.7rem);
}

.df-section-hero-right,
.df-bot-top-controls {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.df-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 12px;
}

.df-kpi-card {
  background: #151026;
  border: 1px solid rgba(157, 78, 221, 0.28);
  border-radius: 14px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.df-kpi-card span {
  font-size: 0.76rem;
  color: #A79BC2;
}

.df-kpi-card strong {
  font-size: 1.28rem;
  font-weight: 800;
}

.df-kpi-card small {
  font-size: 0.72rem;
  color: #8F82AD;
}

.df-subnav-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}

.df-subtabs {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
  background: #130E24;
  padding: 5px;
  border-radius: 999px;
  border: 1px solid rgba(157, 78, 221, 0.28);
}

.df-subtab {
  padding: 7px 15px;
  border-radius: 999px;
  border: none;
  background: transparent;
  color: #B8AED2;
  font-weight: 600;
  font-size: 0.82rem;
  cursor: pointer;
}

.df-subtab.active {
  background: #B8FF01;
  color: #0B0714;
  font-weight: 700;
}

.df-inline-search {
  padding: 8px 14px;
  border-radius: 999px;
  background: #151026;
  border: 1px solid rgba(157, 78, 221, 0.34);
  color: #F7F5FF;
  min-width: 220px;
}

/* --- LAUNCHPAD CARDS & WIZARD --- */
.df-launchpad-grid,
.df-calls-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
  gap: 14px;
}

.df-launch-card,
.df-call-card,
.df-card,
.df-wizard-card {
  background: #151026;
  border: 1px solid rgba(157, 78, 221, 0.3);
  border-radius: 16px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
}

.df-lc-top,
.df-call-token {
  display: flex;
  align-items: center;
  gap: 10px;
}

.df-lc-id,
.df-call-token-id {
  flex: 1;
  min-width: 0;
}

.df-lc-id h3,
.df-call-token-id h3 {
  margin: 0;
  font-size: 0.98rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.df-link-btn {
  background: none;
  border: none;
  padding: 0;
  color: #F7F5FF;
  font-weight: 700;
  font-size: inherit;
  cursor: pointer;
  text-align: left;
}

.df-link-btn:hover {
  color: #B8FF01;
}

.df-lc-sym {
  font-size: 0.75rem;
  color: #A79BC2;
}

.df-lc-badge,
.df-badge-pill,
.df-roi-badge {
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  white-space: nowrap;
}

.df-badge-live,
.df-badge-lime,
.df-roi-badge {
  background: rgba(184, 255, 1, 0.16);
  color: #B8FF01;
  border: 1px solid rgba(184, 255, 1, 0.42);
}

.df-badge-hot,
.df-badge-purple {
  background: rgba(157, 78, 221, 0.24);
  color: #E0AAFF;
  border: 1px solid rgba(199, 125, 255, 0.45);
}

.df-badge-grad {
  background: rgba(0, 245, 212, 0.16);
  color: #00F5D4;
  border: 1px solid rgba(0, 245, 212, 0.4);
}

.df-lc-progress {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.df-lc-prog-head {
  display: flex;
  justify-content: space-between;
  font-size: 0.76rem;
  color: #C9BFE3;
}

.df-prog-track {
  height: 8px;
  border-radius: 999px;
  background: #0D0818;
  border: 1px solid rgba(157, 78, 221, 0.28);
  overflow: hidden;
}

.df-prog-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #9D4EDD 0%, #B8FF01 100%);
  box-shadow: 0 0 10px rgba(184, 255, 1, 0.45);
}

.df-lc-metrics {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  padding: 8px 10px;
  border-radius: 10px;
  background: #0E0A1A;
  font-size: 0.74rem;
}

.df-lc-metrics > div {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.df-lc-metrics span {
  color: #8F82AD;
  font-size: 0.68rem;
}

.df-lc-foot,
.df-call-foot,
.df-card-foot,
.df-wizard-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: auto;
}

.df-safety-pill {
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 700;
  border: 1px solid rgba(184, 255, 1, 0.38);
  background: rgba(184, 255, 1, 0.12);
  color: #B8FF01;
  cursor: pointer;
}

.df-safety-pill[data-tone="signal"] {
  border-color: rgba(255, 190, 11, 0.45);
  background: rgba(255, 190, 11, 0.14);
  color: #FFBE0B;
}

.df-safety-pill[data-tone="strong"] {
  border-color: rgba(255, 59, 105, 0.5);
  background: rgba(255, 59, 105, 0.16);
  color: #FF3B69;
}

/* --- WIZARD & FORMS --- */
.df-wizard-head,
.df-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.df-wizard-head h2,
.df-card-head h2 {
  margin: 0;
  font-size: 1.1rem;
}

.df-wizard-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.df-step-pill {
  padding: 6px 14px;
  border-radius: 999px;
  background: #0E0A1A;
  border: 1px solid rgba(157, 78, 221, 0.3);
  color: #A79BC2;
  font-weight: 600;
  font-size: 0.78rem;
  cursor: pointer;
}

.df-step-pill.active {
  background: #B8FF01;
  color: #0B0714;
  border-color: #B8FF01;
  font-weight: 700;
}

.df-step-pill.done {
  border-color: #9D4EDD;
  color: #E0AAFF;
}

.df-form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 12px;
}

.df-field {
  display: flex;
  flex-direction: column;
  gap: 5px;
  font-size: 0.78rem;
  color: #C9BFE3;
}

.df-field-full {
  grid-column: 1 / -1;
}

.df-field input,
.df-field select,
.df-field textarea {
  padding: 9px 12px;
  border-radius: 10px;
  background: #0E0A1A;
  border: 1px solid rgba(157, 78, 221, 0.34);
  color: #F7F5FF;
  font-size: 0.86rem;
}

.df-toggle-row,
.df-setting-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 12px;
  background: #0E0A1A;
  border: 1px solid rgba(157, 78, 221, 0.22);
}

.df-toggle-row p,
.df-setting-item p {
  margin: 2px 0 0 0;
  font-size: 0.74rem;
}

.df-switch {
  min-width: 54px;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid rgba(157, 78, 221, 0.4);
  background: #1B1333;
  color: #A79BC2;
  font-weight: 800;
  font-size: 0.74rem;
  cursor: pointer;
}

.df-switch.on {
  background: #B8FF01;
  color: #0B0714;
  border-color: #B8FF01;
  box-shadow: 0 0 12px rgba(184, 255, 1, 0.35);
}

/* --- BOT STUDIO & SIGNAL LIST --- */
.df-bot-grid,
.df-settings-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
  gap: 16px;
}

.df-e50-toggles,
.df-bot-signal-list,
.df-holdings-list,
.df-leaderboard-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.df-signal-row,
.df-holding-row,
.df-lb-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  background: #0E0A1A;
  border: 1px solid rgba(157, 78, 221, 0.22);
}

.df-signal-main {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.df-signal-main > div {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.df-signal-right {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.df-sig-badge {
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 800;
}

.df-sig-badge[data-tone="lime"] {
  background: rgba(184, 255, 1, 0.16);
  color: #B8FF01;
  border: 1px solid rgba(184, 255, 1, 0.4);
}

.df-sig-badge[data-tone="purple"] {
  background: rgba(157, 78, 221, 0.22);
  color: #E0AAFF;
  border: 1px solid rgba(157, 78, 221, 0.45);
}

.df-sig-badge[data-tone="muted"] {
  background: rgba(167, 155, 194, 0.12);
  color: #9D91B8;
}

/* --- COMMUNITY & REWARDS --- */
.df-call-caller {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(157, 78, 221, 0.18);
  font-size: 0.78rem;
}

.df-call-caller > div {
  display: flex;
  flex-direction: column;
}

.df-call-thesis {
  margin: 0;
  font-size: 0.83rem;
  color: #D7CEEE;
  line-height: 1.42;
}

.df-boost-btn {
  padding: 5px 12px;
  border-radius: 999px;
  background: rgba(157, 78, 221, 0.2);
  border: 1px solid rgba(157, 78, 221, 0.42);
  color: #F7F5FF;
  font-size: 0.76rem;
  font-weight: 700;
  cursor: pointer;
}

.df-boost-btn:hover {
  border-color: #B8FF01;
  color: #B8FF01;
}

.df-rewards-hero-card {
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  background: linear-gradient(135deg, #1B1136 0%, #120B24 100%);
  border-color: rgba(184, 255, 1, 0.4);
}

.df-rh-amount {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin: 6px 0;
}

.df-rh-amount strong {
  font-size: 2rem;
  font-weight: 900;
}

.df-rh-tier {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 16px 22px;
  border-radius: 16px;
  background: rgba(11, 7, 20, 0.6);
  border: 1px solid rgba(199, 125, 255, 0.4);
}

.df-tier-orb {
  font-size: 2rem;
  margin-bottom: 4px;
}

/* --- WALLET HERO --- */
.df-wh-balance {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 6px 0;
}

.df-wh-balance strong {
  font-size: 2.1rem;
  font-weight: 900;
  color: #FFFFFF;
}

.df-wh-chart {
  width: 340px;
  max-width: 100%;
}

.df-portfolio-svg {
  width: 100%;
  height: 100px;
  display: block;
}

.df-hold-chg[data-tone="up"] {
  color: #B8FF01;
  font-weight: 700;
}

.df-hold-chg[data-tone="down"] {
  color: #FF3B69;
  font-weight: 700;
}

.df-mode-switch {
  display: inline-flex;
  background: #0E0A1A;
  padding: 3px;
  border-radius: 999px;
  border: 1px solid rgba(157, 78, 221, 0.34);
}

.df-mode-btn {
  padding: 5px 12px;
  border-radius: 999px;
  border: none;
  background: transparent;
  color: #A79BC2;
  font-size: 0.76rem;
  font-weight: 700;
  cursor: pointer;
}

.df-mode-btn.active {
  background: #9D4EDD;
  color: #FFFFFF;
}

.df-launch-success {
  padding: 10px 14px;
  border-radius: 10px;
  background: rgba(184, 255, 1, 0.14);
  border: 1px solid rgba(184, 255, 1, 0.45);
  color: #B8FF01;
  font-weight: 700;
  font-size: 0.84rem;
}

.df-review-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
  padding: 12px;
  border-radius: 12px;
  background: #0E0A1A;
  border: 1px solid rgba(157, 78, 221, 0.28);
}

.df-review-summary > div {
  display: flex;
  flex-direction: column;
  gap: 3px;
  font-size: 0.8rem;
}

.df-review-summary span {
  color: #9D91B8;
  font-size: 0.72rem;
}

.df-close-btn {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 1px solid rgba(157, 78, 221, 0.35);
  background: #0E0A1A;
  color: #F7F5FF;
  font-size: 1.1rem;
  cursor: pointer;
}

/* --- DEXFUN V2 HOME HUB & DASHBOARD STYLE (MATCHING 5 DESIGN MOCKUPS) --- */
#sidebar,
#ui-token-nav-toggle,
body:has(.df-dashboard-shell) #ui-chat-widget {
  display: none !important;
}

.layout,
body:has(.discover-tabstrip) .layout,
body[data-ui-lounge-open="true"] .layout {
  display: block !important;
  grid-template-columns: 1fr !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

#main,
body:has(.discover-tabstrip) #main,
body[data-ui-lounge-open="true"]:has(.discover-tabstrip) #main {
  display: block !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  width: 100% !important;
  max-width: 1480px !important;
  margin: 0 auto !important;
  padding: 18px 24px 90px 24px !important;
}

/* Header & Brand */
header {
  height: 64px !important;
  padding: 0 24px !important;
  background: rgba(10, 6, 18, 0.96) !important;
  border-bottom: 1px solid rgba(157, 78, 221, 0.28) !important;
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
}

header a.brand {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  text-decoration: none !important;
}

header a.brand img {
  width: 38px !important;
  height: 38px !important;
  border-radius: 10px !important;
  object-fit: contain !important;
}

header .brand-name {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0 !important;
}

.df-brand-dex {
  color: #FFFFFF !important;
  font-weight: 900 !important;
  font-style: italic !important;
  font-size: 1.45rem !important;
  letter-spacing: -0.02em !important;
}

.df-brand-fun {
  color: #A8FF00 !important;
  font-weight: 900 !important;
  font-style: italic !important;
  font-size: 1.45rem !important;
  letter-spacing: -0.02em !important;
}

.df-beta-pill {
  margin-left: 8px !important;
  padding: 2px 8px !important;
  border-radius: 6px !important;
  background: rgba(157, 78, 221, 0.28) !important;
  border: 1px solid rgba(199, 125, 255, 0.45) !important;
  color: #E0AAFF !important;
  font-size: 0.68rem !important;
  font-weight: 700 !important;
  font-style: normal !important;
  letter-spacing: 0.02em !important;
}

.df-topnav {
  display: inline-flex !important;
  align-items: center !important;
  gap: 2px !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin-left: 6px !important;
  flex-shrink: 0 !important;
}

.df-topnav-btn {
  padding: 6px 11px !important;
  border-radius: 999px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  color: #C4B9E0 !important;
  font-size: 0.81rem !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  transition: all 0.14s ease !important;
}

header .search-go,
header .sourcechip,
header .watch-head,
header .x-link,
header .headerreserve {
  display: none !important;
}

header .search-box {
  flex: 1 1 180px !important;
  max-width: 240px !important;
  min-width: 140px !important;
  margin-left: auto !important;
}

header #search {
  width: 100% !important;
  height: 36px !important;
  padding: 0 14px !important;
  border-radius: 999px !important;
  font-size: 0.8rem !important;
}

.df-topnav-btn:hover {
  color: #FFFFFF !important;
  background: rgba(157, 78, 221, 0.16) !important;
}

.df-topnav-btn.active {
  background: rgba(168, 255, 0, 0.13) !important;
  border: 1px solid #A8FF00 !important;
  color: #A8FF00 !important;
  box-shadow: 0 0 14px rgba(168, 255, 0, 0.22) !important;
}

.df-notif-btn {
  position: relative;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: #161029;
  border: 1px solid rgba(157, 78, 221, 0.34);
  color: #F7F5FF;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.df-notif-dot {
  position: absolute;
  top: 5px;
  right: 5px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #A8FF00;
  box-shadow: 0 0 8px #A8FF00;
}

header .wallet.connect-wallet {
  background: linear-gradient(90deg, #9EFF00 0%, #B8FF01 100%) !important;
  color: #090514 !important;
  font-weight: 800 !important;
  border-radius: 10px !important;
  padding: 9px 18px !important;
  border: none !important;
  box-shadow: 0 0 18px rgba(168, 255, 0, 0.38) !important;
}

/* 2-Column Home Hub Layout — Beat ui-lounge-room.css grid on #main */
html body:has(.discover-tabstrip) #main,
html body:has(.discover-tabstrip)[data-ui-lounge-open="true"] #main,
html body:has(.df-dashboard-shell) #main,
html body #main {
  display: block !important;
  grid-template-columns: none !important;
  grid-template-rows: none !important;
  height: auto !important;
  min-height: calc(100dvh - 110px) !important;
  overflow: visible !important;
  padding: 20px 24px 90px !important;
  max-width: 1520px !important;
  width: 100% !important;
  margin: 0 auto !important;
  box-sizing: border-box !important;
}

.df-dashboard-shell {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 365px !important;
  gap: 18px !important;
  align-items: start !important;
  width: 100% !important;
}

@media (max-width: 1180px) {
  .df-dashboard-shell {
    grid-template-columns: 1fr !important;
  }
}

.df-dash-main {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  min-width: 0 !important;
  width: 100% !important;
}

.df-dash-side,
aside.df-dash-side {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  min-width: 0 !important;
  width: 100% !important;
  max-width: none !important;
  padding: 0 !important;
  border: 0 !important;
  min-height: 0 !important;
}

/* Hero Banner V2 with 3D Mascot */
.df-hero-banner-v2 {
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(250px, 0.82fr);
  align-items: center;
  gap: 16px;
  padding: 26px 28px;
  border-radius: 20px;
  background:
    radial-gradient(circle at 76% 45%, rgba(157, 78, 221, 0.44) 0%, rgba(92, 28, 175, 0.22) 40%, rgba(16, 10, 30, 0.96) 76%),
    linear-gradient(135deg, #130B24 0%, #1B1035 55%, #0E081C 100%);
  border: 1px solid rgba(157, 78, 221, 0.42);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.08);
  position: relative;
  overflow: hidden;
}

.df-hb-eyebrow {
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  color: #C4B9E0;
  margin-bottom: 8px;
}

.df-hb-title {
  margin: 0 0 10px 0;
  font-size: clamp(1.65rem, 2.35vw, 2.25rem);
  font-weight: 900;
  line-height: 1.13;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}

.df-hb-sub {
  margin: 0 0 18px 0;
  font-size: 0.88rem;
  line-height: 1.5;
  color: #B8AED2;
  max-width: 54ch;
}

.df-hb-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.df-btn-lg {
  padding: 11px 22px !important;
  font-size: 0.92rem !important;
}

.df-btn-dark-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 20px;
  border-radius: 999px;
  background: rgba(24, 16, 44, 0.9);
  border: 1px solid rgba(157, 78, 221, 0.45);
  color: #F7F5FF;
  font-weight: 700;
  font-size: 0.88rem;
  cursor: pointer;
}

.df-btn-dark-pill:hover {
  border-color: #A8FF00;
  color: #A8FF00;
}

.df-hb-art {
  display: flex;
  align-items: center;
  justify-content: center;
}

.df-hb-mascot {
  width: 100%;
  max-width: 345px;
  height: auto;
  display: block;
  filter: drop-shadow(0 10px 26px rgba(157, 78, 221, 0.45));
}

/* 4-Column KPI Strip V2 */
.df-kpi-strip-v2 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  padding: 14px 20px;
  border-radius: 16px;
  background: rgba(19, 13, 36, 0.94);
  border: 1px solid rgba(157, 78, 221, 0.32);
}

.df-kpi-item {
  display: flex;
  align-items: center;
  gap: 12px;
  border-right: 1px solid rgba(157, 78, 221, 0.18);
  padding-right: 10px;
}

.df-kpi-item:last-child {
  border-right: none;
  padding-right: 0;
}

.df-kpi-ic {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background: rgba(168, 255, 0, 0.12);
  border: 1px solid rgba(168, 255, 0, 0.32);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  flex-shrink: 0;
}

.df-kpi-item div {
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.df-kpi-item strong {
  font-size: 1.25rem;
  font-weight: 900;
  color: #FFFFFF;
}

.df-kpi-item span {
  font-size: 0.75rem;
  color: #A79BC2;
}

/* 4 Feature Quick-Nav Cards V2 */
.df-feature-row-v2 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}

.df-feat-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 16px;
  background: linear-gradient(145deg, #17102C 0%, #120B22 100%);
  border: 1px solid rgba(157, 78, 221, 0.34);
  color: #F7F5FF;
  text-align: left;
  cursor: pointer;
  transition: transform 0.14s ease, border-color 0.14s ease, box-shadow 0.14s ease;
}

.df-feat-card:hover {
  transform: translateY(-2px);
  border-color: #A8FF00;
  box-shadow: 0 8px 24px rgba(168, 255, 0, 0.16);
}

.df-feat-bot-glow {
  border-color: rgba(168, 255, 0, 0.65);
  box-shadow: 0 0 22px rgba(168, 255, 0, 0.16), inset 0 0 16px rgba(168, 255, 0, 0.06);
}

.df-feat-ic {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  flex-shrink: 0;
}

.df-feat-purple {
  background: rgba(157, 78, 221, 0.22);
  border: 1px solid rgba(199, 125, 255, 0.42);
}

.df-feat-lime {
  background: rgba(168, 255, 0, 0.15);
  border: 1px solid rgba(168, 255, 0, 0.42);
}

.df-feat-body {
  display: flex;
  flex-direction: column;
  gap: 3px;
  flex: 1;
  min-width: 0;
}

.df-feat-body strong {
  font-size: 0.94rem;
  font-weight: 800;
  color: #FFFFFF;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.df-beta-mini {
  padding: 1px 6px;
  border-radius: 999px;
  background: #A8FF00;
  color: #090514;
  font-size: 0.62rem;
  font-style: normal;
  font-weight: 800;
}

.df-feat-body span {
  font-size: 0.74rem;
  color: #A79BC2;
  line-height: 1.32;
}

.df-feat-arrow {
  font-size: 1.2rem;
  color: #A79BC2;
  font-weight: 700;
}

/* Markets Table Card V2 */
.df-markets-card-v2 {
  background: #130D24;
  border: 1px solid rgba(157, 78, 221, 0.34);
  border-radius: 18px;
  padding: 16px 18px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.42);
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* Hide legacy clutter inside Home Dashboard Markets Card */
.df-markets-card-v2 > .ui-pinned-strip,
.df-markets-card-v2 > .currency-status,
.df-markets-card-v2 > .list-summary,
.df-markets-card-v2 > .ui-list-info,
.df-markets-card-v2 > .focus-card,
.df-markets-card-v2 > .list-rule,
.df-markets-card-v2 .list-order-status,
.df-markets-card-v2 .column-info,
.df-markets-card-v2 .ui-quick-buy {
  display: none !important;
}

.df-markets-card-v2 > .toolbar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin: 0 !important;
  padding: 0 !important;
}

.df-markets-card-v2 > .toolbar h1 {
  font-size: 1.15rem !important;
  font-weight: 800 !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.df-markets-card-v2 > .toolbar h1::before {
  content: '📊';
  font-size: 1.05rem;
}

.df-markets-card-v2 .discover-tabstrip {
  margin: 0 !important;
}

.df-markets-card-v2 .discover-lists button {
  padding: 6px 16px !important;
  border-radius: 999px !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
}

.df-markets-card-v2 .discover-lists button.selected,
.df-markets-card-v2 .discover-lists button[aria-pressed="true"] {
  background: #A8FF00 !important;
  color: #090514 !important;
  font-weight: 800 !important;
  box-shadow: 0 0 14px rgba(168, 255, 0, 0.35) !important;
}

.df-markets-card-v2 .list-controls {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin: 0 !important;
}

.df-markets-card-v2 .token-table {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
}

.df-markets-card-v2 #tokenrows {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

/* ==========================================================================
   DEXFUN V3 — 10-SCREEN REFERENCE SYSTEM + 390PX MOBILE & 1440PX DESKTOP
   ========================================================================== */

/* 1. 2-ROW TOP HEADER + FIXED 5-BUTTON BOTTOM DOCK */
html body header {
  position: sticky !important;
  top: 0 !important;
  z-index: 95 !important;
  background: rgba(11, 7, 20, 0.96) !important;
  backdrop-filter: blur(18px) !important;
  border-bottom: 1px solid rgba(157, 78, 221, 0.32) !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100vw !important;
}

html body header .df-beta-pill,
html body header .sourcechip,
html body header .watch-head,
html body header .x-link,
html body header .headerreserve,
html body header .df-settings-btn,
html body .compact-navigation {
  display: none !important;
}

html body header .df-header-right {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  margin-left: auto !important;
  min-width: 0 !important;
}

html body header .df-icon-circle {
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  background: #161029 !important;
  border: 1px solid rgba(157, 78, 221, 0.38) !important;
  color: #F7F5FF !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 0.88rem !important;
  cursor: pointer !important;
  position: relative !important;
  flex-shrink: 0 !important;
}

html body header .df-icon-circle:hover {
  border-color: #B8FF01 !important;
  color: #B8FF01 !important;
}

html body header .wallet,
html body header .wallet.connect-wallet {
  background: #B8FF01 !important;
  color: #0B0714 !important;
  font-weight: 800 !important;
  font-size: 0.82rem !important;
  line-height: 1 !important;
  height: 34px !important;
  min-height: 34px !important;
  min-width: 0 !important;
  padding: 0 14px !important;
  border-radius: 999px !important;
  border: 1px solid #B8FF01 !important;
  box-shadow: 0 0 16px rgba(184, 255, 1, 0.34) !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Desktop header (>= 1024px) */
@media (min-width: 1024px) {
  html body header {
    display: flex !important;
    align-items: center !important;
    height: 64px !important;
    padding: 0 24px !important;
    gap: 16px !important;
  }

  html body header #df-topnav {
    order: 2 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    margin-left: 12px !important;
  }

  html body header .df-header-right {
    order: 3 !important;
  }

  html body header .df-search-btn {
    display: none !important;
  }

  html body header .search-box {
    display: block !important;
    width: 240px !important;
    max-width: 260px !important;
    margin: 0 !important;
  }
}

/* Mobile & Tablet 2-Row Header (< 1024px) */
@media (max-width: 1023px) {
  html body header {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    grid-template-rows: 50px 40px !important;
    align-items: center !important;
    height: auto !important;
    min-height: 90px !important;
    padding: 0 10px !important;
    gap: 0 8px !important;
  }

  html body header > a.brand {
    grid-column: 1 !important;
    grid-row: 1 !important;
    gap: 8px !important;
    min-width: 0 !important;
    min-height: 0 !important;
  }

  html body header > a.brand img {
    width: 30px !important;
    height: 30px !important;
    border-radius: 8px !important;
  }

  html body header .df-brand-dex,
  html body header .df-brand-fun {
    font-size: 1.22rem !important;
  }

  html body header > .df-header-right {
    grid-column: 2 !important;
    grid-row: 1 !important;
    gap: 6px !important;
    justify-content: flex-end !important;
  }

  html body header .df-icon-circle {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    min-height: 32px !important;
    font-size: 0.82rem !important;
  }

  html body header .wallet,
  html body header .wallet.connect-wallet {
    height: 32px !important;
    min-height: 32px !important;
    padding: 0 11px !important;
    font-size: 12px !important;
    border-radius: 999px !important;
  }

  html body header .search-box {
    display: none !important;
  }

  html body header.df-search-open .search-box {
    display: block !important;
    position: absolute !important;
    top: 50px !important;
    left: 10px !important;
    right: 10px !important;
    z-index: 120 !important;
    max-width: none !important;
    width: auto !important;
    background: #140E24 !important;
    padding: 6px !important;
    border-radius: 12px !important;
    border: 1px solid #B8FF01 !important;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.75) !important;
  }

  html body header > #df-topnav,
  html body header > nav.df-topnav {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    display: flex !important;
    align-items: stretch !important;
    justify-content: space-between !important;
    width: 100% !important;
    height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 0 !important;
    border: none !important;
    border-top: 1px solid rgba(157, 78, 221, 0.22) !important;
    background: transparent !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
    gap: 0 !important;
  }

  html body header > #df-topnav::-webkit-scrollbar {
    display: none !important;
  }

  html body header #df-topnav .df-topnav-btn {
    flex: 1 0 auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: 40px !important;
    padding: 0 7px !important;
    border-radius: 0 !important;
    border: none !important;
    border-bottom: 2px solid transparent !important;
    background: transparent !important;
    color: #A79BC2 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
  }

  html body header #df-topnav .df-topnav-btn.active {
    color: #B8FF01 !important;
    border-bottom: 2px solid #B8FF01 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  html body header #df-topnav .df-topnav-ic {
    font-size: 12px !important;
  }
}

/* Fixed Bottom 5-Button App Dock (.df-bottom-dock) */
html body #nav.df-bottom-dock,
html body nav.bottomnav.df-bottom-dock {
  position: fixed !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 90 !important;
  height: 60px !important;
  padding: 0 6px env(safe-area-inset-bottom, 0px) !important;
  background: rgba(11, 7, 20, 0.96) !important;
  backdrop-filter: blur(18px) !important;
  border-top: 1px solid rgba(157, 78, 221, 0.34) !important;
  box-shadow: 0 -8px 26px rgba(0, 0, 0, 0.6) !important;
  display: grid !important;
  grid-template-columns: repeat(5, 1fr) !important;
  align-items: center !important;
  gap: 2px !important;
}

@media (min-width: 1024px) {
  html body #nav.df-bottom-dock {
    display: none !important;
  }
}

@media (max-width: 1023px) {
  html body #ticker {
    display: none !important;
  }
}

html body #nav.df-bottom-dock .df-dock-btn {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 2px !important;
  height: 52px !important;
  min-height: 0 !important;
  min-width: 0 !important;
  padding: 4px 2px !important;
  border: none !important;
  border-radius: 12px !important;
  background: transparent !important;
  color: #9D91B8 !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  cursor: pointer !important;
}

html body #nav.df-bottom-dock .df-dock-btn .navicon {
  font-size: 16px !important;
  line-height: 1 !important;
}

html body #nav.df-bottom-dock .df-dock-btn .df-dock-lbl {
  font-size: 10.5px !important;
  line-height: 1.1 !important;
  white-space: nowrap !important;
}

html body #nav.df-bottom-dock .df-dock-btn.active {
  color: #B8FF01 !important;
  background: rgba(184, 255, 1, 0.08) !important;
}

html body #nav.df-bottom-dock .df-dock-btn.df-dock-launch .navicon {
  width: 30px !important;
  height: 30px !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg, rgba(184, 255, 1, 0.24) 0%, rgba(157, 78, 221, 0.36) 100%) !important;
  border: 1px solid rgba(184, 255, 1, 0.55) !important;
  box-shadow: 0 0 12px rgba(184, 255, 1, 0.32) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 14px !important;
}

/* 2. UNIFIED 5-DATA-COLUMN TOKEN TABLE (#, Token+MC, Price, 24h, Vol+Star) ON ALL VIEWPORTS */
html body #main .token-table.df-markets-table,
html body:has(.discover-tabstrip) #main .token-table.df-markets-table,
html body #main .df-markets-card-v2 .token-table {
  container-type: normal !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
  counter-reset: df-token-rank;
}

html body #main .token-table.df-markets-table :is(.cell-age, .cell-liquidity, .cell-holders, .cell-focus, .cell-lounge, .cell-safety, .cell-spark, .df-row-trade-btn, .ui-row-buy, .ui-row-metrics, .mobile-metric-label, .column-info, .ui-quick-buy),
html body:has(.discover-tabstrip) #main .token-table.df-markets-table :is(.cell-age, .cell-liquidity, .cell-holders, .cell-focus, .cell-lounge, .cell-safety, .cell-spark, .df-row-trade-btn, .ui-row-buy, .ui-row-metrics, .mobile-metric-label, .column-info, .ui-quick-buy),
html body #main #tokenrows .token.df-market-row > :is(.cell-age, .cell-liquidity, .cell-holders, .cell-safety, .cell-spark) {
  display: none !important;
}

html body #main .token-table.df-markets-table :is(.columnheads, #tokenrows .token.df-market-row),
html body:has(.discover-tabstrip) #main .token-table.df-markets-table :is(.columnheads, #tokenrows .token.df-market-row),
html body #main .df-markets-card-v2 .token-table :is(.columnheads, #tokenrows .token[data-row-mint]) {
  display: grid !important;
  grid-template-columns: minmax(106px, 1.3fr) minmax(74px, 0.95fr) minmax(60px, 0.78fr) minmax(56px, 0.72fr) 22px !important;
  grid-template-rows: 1fr !important;
  column-gap: 5px !important;
  row-gap: 0 !important;
  align-items: center !important;
  padding: 6px 6px !important;
  position: relative !important;
  width: 100% !important;
  box-sizing: border-box !important;
  cursor: pointer !important;
}

html body #main .token-table.df-markets-table .columnheads,
html body:has(.discover-tabstrip) #main .token-table.df-markets-table .columnheads {
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
}

html body #main #tokenrows .token.df-market-row,
html body:has(.discover-tabstrip) #main #tokenrows .token.df-market-row,
html body #main .df-markets-card-v2 #tokenrows .token[data-row-mint] {
  height: 56px !important;
  min-height: 56px !important;
  max-height: 56px !important;
  counter-increment: df-token-rank;
}

/* Override legacy BitSan mobile absolute positioning inside #tokenrows EXCEPT inside .avatar */
html body #main #tokenrows .token.df-market-row *:not(.avatar):not(.avatar *),
html body:has(.discover-tabstrip) #main #tokenrows .token.df-market-row *:not(.avatar):not(.avatar *),
html body #main .df-markets-card-v2 #tokenrows .token *:not(.avatar):not(.avatar *) {
  position: static !important;
  inset: auto !important;
}

html body #main #tokenrows .token.df-market-row :is(button, .row-open, .money-value, .row-star),
html body:has(.discover-tabstrip) #main #tokenrows .token.df-market-row :is(button, .row-open, .money-value, .row-star),
html body #main .token-table.df-markets-table .columnheads button {
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

html body #main .token-table.df-markets-table .columnheads [role="columnheader"],
html body:has(.discover-tabstrip) #main .token-table.df-markets-table .columnheads [role="columnheader"] {
  grid-row: 1 !important;
  align-self: center !important;
  height: auto !important;
  min-height: 0 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  color: #8F82AD !important;
  text-transform: uppercase !important;
  letter-spacing: 0.03em !important;
  display: flex !important;
  align-items: center !important;
}

html body #main .token-table.df-markets-table .columnheads .cell-token,
html body:has(.discover-tabstrip) #main .token-table.df-markets-table .columnheads .cell-token {
  grid-column: 1 !important;
  justify-content: flex-start !important;
}

html body #main .token-table.df-markets-table .columnheads .cell-price,
html body:has(.discover-tabstrip) #main .token-table.df-markets-table .columnheads .cell-price {
  grid-column: 2 !important;
  justify-content: flex-end !important;
  text-align: right !important;
}

html body #main .token-table.df-markets-table .columnheads .cell-change,
html body:has(.discover-tabstrip) #main .token-table.df-markets-table .columnheads .cell-change {
  grid-column: 3 !important;
  justify-content: flex-end !important;
  text-align: right !important;
}

html body #main .token-table.df-markets-table .columnheads .cell-volume,
html body:has(.discover-tabstrip) #main .token-table.df-markets-table .columnheads .cell-volume {
  grid-column: 4 !important;
  justify-content: flex-end !important;
  text-align: right !important;
}

/* Column 1: # Rank + Avatar + $SYMBOL & Market Cap underneath */
html body #main #tokenrows .token.df-market-row > .cell-token,
html body:has(.discover-tabstrip) #main #tokenrows .token.df-market-row > .cell-token {
  order: 1 !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  align-self: center !important;
  height: 42px !important;
  min-height: 0 !important;
  max-height: 42px !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  overflow: hidden !important;
}

html body #main #tokenrows .token.df-market-row .df-row-rank::before,
html body:has(.discover-tabstrip) #main #tokenrows .token.df-market-row .df-row-rank::before {
  content: counter(df-token-rank);
  display: inline-block;
  width: 16px;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  color: #8F82AD !important;
  text-align: center;
  flex-shrink: 0;
}

html body #main #tokenrows .token.df-market-row .avatar,
html body:has(.discover-tabstrip) #main #tokenrows .token.df-market-row .avatar {
  flex: 0 0 32px !important;
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  min-height: 32px !important;
  max-width: 32px !important;
  max-height: 32px !important;
  border-radius: 50% !important;
  flex-shrink: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
}

html body #main #tokenrows .token.df-market-row .avatar :is(img, canvas, .avatar-fallback),
html body:has(.discover-tabstrip) #main #tokenrows .token.df-market-row .avatar :is(img, canvas, .avatar-fallback) {
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  object-fit: cover !important;
}

html body #main #tokenrows .token.df-market-row .token-label.token-id,
html body:has(.discover-tabstrip) #main #tokenrows .token.df-market-row .token-label.token-id {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: flex-start !important;
  gap: 2px !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
  height: auto !important;
  overflow: hidden !important;
}

html body #main #tokenrows .token.df-market-row .token-name-line,
html body:has(.discover-tabstrip) #main #tokenrows .token.df-market-row .token-name-line {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  width: 100% !important;
  min-width: 0 !important;
}

html body #main #tokenrows .token.df-market-row .row-open,
html body:has(.discover-tabstrip) #main #tokenrows .token.df-market-row .row-open {
  display: inline-flex !important;
  align-items: center !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

html body #main #tokenrows .token.df-market-row .row-open .name,
html body:has(.discover-tabstrip) #main #tokenrows .token.df-market-row .row-open .name {
  font-size: 13px !important;
  font-weight: 800 !important;
  color: #FFFFFF !important;
  line-height: 1.15 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

html body #main #tokenrows .token.df-market-row .cell-cap.df-sub-cap,
html body:has(.discover-tabstrip) #main #tokenrows .token.df-market-row .cell-cap.df-sub-cap {
  display: flex !important;
  align-items: center !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

html body #main #tokenrows .token.df-market-row .cell-cap.df-sub-cap,
html body #main #tokenrows .token.df-market-row .cell-cap.df-sub-cap .money-value,
html body #main #tokenrows .token.df-market-row .cell-cap.df-sub-cap .money-value span,
html body:has(.discover-tabstrip) #main #tokenrows .token.df-market-row .cell-cap.df-sub-cap .money-value,
html body:has(.discover-tabstrip) #main #tokenrows .token.df-market-row .cell-cap.df-sub-cap .money-value span {
  font-size: 10.5px !important;
  font-weight: 600 !important;
  color: #8F82AD !important;
  line-height: 1.15 !important;
  white-space: nowrap !important;
  text-align: left !important;
  justify-content: flex-start !important;
}

/* Column 2: Price */
html body #main #tokenrows .token.df-market-row > .cell-price,
html body:has(.discover-tabstrip) #main #tokenrows .token.df-market-row > .cell-price {
  order: 2 !important;
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: center !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  text-align: right !important;
  min-width: 0 !important;
}

html body #main #tokenrows .token.df-market-row > .cell-price .money-value,
html body #main #tokenrows .token.df-market-row > .cell-price .money-value span,
html body:has(.discover-tabstrip) #main #tokenrows .token.df-market-row > .cell-price .money-value,
html body:has(.discover-tabstrip) #main #tokenrows .token.df-market-row > .cell-price .money-value span {
  font-size: 12.5px !important;
  font-weight: 700 !important;
  color: #F7F5FF !important;
  white-space: nowrap !important;
}

/* Column 3: 24h Change % */
html body #main #tokenrows .token.df-market-row > .cell-change,
html body:has(.discover-tabstrip) #main #tokenrows .token.df-market-row > .cell-change {
  order: 3 !important;
  grid-column: 3 !important;
  grid-row: 1 !important;
  align-self: center !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  text-align: right !important;
  min-width: 0 !important;
}

html body #main #tokenrows .token.df-market-row > .cell-change .change-value,
html body:has(.discover-tabstrip) #main #tokenrows .token.df-market-row > .cell-change .change-value {
  font-size: 12px !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
}

html body #main #tokenrows .token.df-market-row > .cell-change .change-value[data-change="up"],
html body:has(.discover-tabstrip) #main #tokenrows .token.df-market-row > .cell-change .change-value[data-change="up"] {
  color: #B8FF01 !important;
}

html body #main #tokenrows .token.df-market-row > .cell-change .change-value[data-change="down"],
html body:has(.discover-tabstrip) #main #tokenrows .token.df-market-row > .cell-change .change-value[data-change="down"] {
  color: #FF3B69 !important;
}

/* Column 4: Volume + Star */
html body #main #tokenrows .token.df-market-row > .cell-volume,
html body:has(.discover-tabstrip) #main #tokenrows .token.df-market-row > .cell-volume {
  order: 4 !important;
  grid-column: 4 !important;
  grid-row: 1 !important;
  align-self: center !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 6px !important;
  text-align: right !important;
  min-width: 0 !important;
}

html body #main #tokenrows .token.df-market-row > .cell-volume .window-volume,
html body #main #tokenrows .token.df-market-row > .cell-volume .money-value,
html body #main #tokenrows .token.df-market-row > .cell-volume .money-value span,
html body #main #tokenrows .token.df-market-row > .cell-volume .partial-number {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #D7CEEE !important;
  white-space: nowrap !important;
}

html body #main #tokenrows .token.df-market-row > .cell-volume .row-star {
  font-size: 14px !important;
  color: #8F82AD !important;
  width: 18px !important;
  flex-shrink: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
}

html body #main #tokenrows .token.df-market-row > .cell-volume .row-star[aria-pressed="true"] {
  color: #FFBE0B !important;
}

/* 3. SCREEN 1: HOME / TRADE SWAP CARD (.df-home-swap-card) */
.df-home-swap-card {
  background: linear-gradient(180deg, #17112B 0%, #120C21 100%);
  border: 1px solid rgba(157, 78, 221, 0.38);
  border-radius: 18px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.48);
}

.df-hsw-tabs {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  background: #0D0818;
  padding: 4px;
  border-radius: 12px;
  border: 1px solid rgba(157, 78, 221, 0.28);
}

.df-hsw-tab {
  padding: 7px 8px !important;
  min-height: 0 !important;
  min-width: 0 !important;
  border-radius: 9px;
  border: none;
  background: transparent;
  color: #A79BC2;
  font-size: 12.5px !important;
  font-weight: 700;
  cursor: pointer;
}

.df-hsw-tab.active {
  background: #B8FF01;
  color: #0B0714 !important;
  font-weight: 800;
  box-shadow: 0 0 12px rgba(184, 255, 1, 0.32);
}

.df-hsw-box {
  background: #0E091A;
  border: 1px solid rgba(157, 78, 221, 0.28);
  border-radius: 14px;
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.df-hsw-box-top,
.df-hsw-box-sub {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 11.5px !important;
  color: #8F82AD;
}

.df-hsw-box-main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.df-hsw-token-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 12px;
  border-radius: 999px;
  background: #1B1333;
  border: 1px solid rgba(157, 78, 221, 0.4);
  color: #FFFFFF;
  font-weight: 800;
  font-size: 13px !important;
  white-space: nowrap;
  flex-shrink: 0;
}

.df-hsw-token-pill .avatar {
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  min-height: 20px !important;
  border-radius: 50% !important;
}

.df-hsw-sol-ic {
  color: #B8FF01;
  font-weight: 900;
}

.df-hsw-input {
  background: transparent;
  border: none;
  color: #FFFFFF;
  font-size: 1.35rem !important;
  font-weight: 800;
  text-align: right;
  width: 100%;
  min-width: 0;
  outline: none;
}

.df-hsw-est-val {
  font-size: 1.25rem !important;
  font-weight: 800;
  color: #B8FF01;
  text-align: right;
}

.df-hsw-presets {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
}

.df-hsw-flip-row {
  display: flex;
  justify-content: center;
  margin: -8px 0;
  z-index: 2;
}

.df-hsw-flip-btn {
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  min-height: 32px !important;
  padding: 0 !important;
  border-radius: 50%;
  background: #1C1435;
  border: 1px solid rgba(184, 255, 1, 0.45);
  color: #B8FF01;
  font-weight: 800;
  cursor: pointer;
}

.df-hsw-slippage {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 12px !important;
  color: #A79BC2;
}

.df-hsw-slip-pills {
  display: inline-flex;
  gap: 5px;
}

.df-hsw-details {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(11, 7, 20, 0.6);
  border: 1px solid rgba(157, 78, 221, 0.2);
  font-size: 11.5px !important;
}

.df-hsw-details > div {
  display: flex;
  justify-content: space-between;
  color: #A79BC2;
}

.df-hsw-submit {
  width: 100%;
  padding: 12px 18px !important;
  border-radius: 14px !important;
  font-size: 15px !important;
  font-weight: 900 !important;
}

/* 4. SCREEN 2: TOKEN DETAIL SAFETY SCORE CARD (92 / 100 Low Risk + 4 Checks + Buy/Sell) */
.df-td-safety-card {
  background: linear-gradient(145deg, #16102A 0%, #110B20 100%);
  border: 1px solid rgba(184, 255, 1, 0.38);
  border-radius: 16px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.42);
}

.df-tds-grid {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 16px;
  align-items: center;
}

.df-tds-left {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding-right: 14px;
  border-right: 1px solid rgba(157, 78, 221, 0.25);
}

.df-tds-label {
  font-size: 11.5px !important;
  font-weight: 700;
  color: #A79BC2;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.df-tds-score-row {
  display: flex;
  align-items: baseline;
  gap: 4px;
}

.df-tds-num {
  font-size: 2rem !important;
  font-weight: 900 !important;
  color: #B8FF01 !important;
  line-height: 1 !important;
}

.df-tds-max {
  font-size: 13px !important;
  color: #8F82AD;
  font-weight: 700;
}

.df-tds-risk-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11.5px !important;
  font-weight: 800;
  color: #B8FF01;
}

.df-tds-right {
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
}

.df-tds-check-row {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 12px !important;
  color: #E5DEFA;
  font-weight: 600;
}

.df-tds-chk-ic {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: rgba(184, 255, 1, 0.18);
  color: #B8FF01;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 10px !important;
  font-weight: 900;
  flex-shrink: 0;
}

.df-tds-inspect-btn {
  margin-top: 4px;
  padding: 0 !important;
  min-height: 0 !important;
  background: none !important;
  border: none !important;
  color: #B8FF01 !important;
  font-size: 11.5px !important;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
}

.df-td-action-bar {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.df-td-act-btn {
  height: 44px !important;
  min-height: 44px !important;
  border-radius: 12px !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  cursor: pointer !important;
}

.df-td-buy {
  background: #B8FF01 !important;
  color: #0B0714 !important;
  border: 1px solid #B8FF01 !important;
  box-shadow: 0 0 16px rgba(184, 255, 1, 0.32) !important;
}

.df-td-sell {
  background: linear-gradient(135deg, #7B2CBF 0%, #9D4EDD 100%) !important;
  color: #FFFFFF !important;
  border: 1px solid rgba(199, 125, 255, 0.55) !important;
  box-shadow: 0 0 16px rgba(157, 78, 221, 0.32) !important;
}

/* 5. SCREEN 3: MARKETS KPI ROW (.df-markets-kpi-row) */
.df-markets-kpi-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}

.df-mk-box {
  background: #151026;
  border: 1px solid rgba(157, 78, 221, 0.3);
  border-radius: 12px;
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  overflow: hidden;
}

.df-mk-lbl {
  font-size: 11px !important;
  color: #A79BC2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.df-mk-val {
  font-size: 14px !important;
  font-weight: 800;
  color: #FFFFFF;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 6. SCREENS 4, 5 & 6: LAUNCHPAD FEATURE STRIP, HORIZONTAL CARDS & PROJECT DETAIL */
.df-lp-feature-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
}

.df-lp-feat-item {
  background: #151026;
  border: 1px solid rgba(157, 78, 221, 0.28);
  border-radius: 12px;
  padding: 10px 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 5px;
  min-width: 0;
}

.df-lp-feat-ic {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background: rgba(184, 255, 1, 0.14);
  border: 1px solid rgba(184, 255, 1, 0.36);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 15px !important;
}

.df-lp-feat-item span {
  font-size: 11.5px !important;
  font-weight: 700;
  color: #E5DEFA;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

.df-launchpad-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.df-lp-card-horiz {
  background: #151026;
  border: 1px solid rgba(157, 78, 221, 0.32);
  border-radius: 16px;
  padding: 14px;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.36);
}

.df-lph-avatar .avatar {
  width: 48px !important;
  height: 48px !important;
  min-width: 48px !important;
  min-height: 48px !important;
  border-radius: 14px !important;
}

.df-lph-body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.df-lph-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
}

.df-lph-title {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

.df-lph-tags {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
}

.df-lph-tag {
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(157, 78, 221, 0.2);
  border: 1px solid rgba(157, 78, 221, 0.38);
  color: #D7CEEE;
  font-size: 10.5px !important;
  font-weight: 700;
}

.df-lph-desc {
  margin: 0;
  font-size: 12px !important;
  color: #A79BC2;
  line-height: 1.35;
}

.df-lph-prog-row {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.df-lph-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 11.5px !important;
}

/* Launchpad Project Detail View (.df-lp-detail-page) */
.df-lpd-card {
  background: #151026;
  border: 1px solid rgba(157, 78, 221, 0.36);
  border-radius: 18px;
  padding: 18px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.df-lpd-hero {
  display: flex;
  align-items: center;
  gap: 14px;
}

.df-lpd-avatar .avatar {
  width: 56px !important;
  height: 56px !important;
  border-radius: 16px !important;
}

.df-lpd-title-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.df-lpd-title-row h1 {
  margin: 0;
  font-size: 1.25rem !important;
}

.df-lpd-raise-box {
  background: #0E091A;
  border: 1px solid rgba(184, 255, 1, 0.35);
  border-radius: 14px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.df-lpd-raise-top,
.df-lpd-raise-sub {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}

.df-lpd-stats-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}

.df-lpd-stat {
  background: #0E091A;
  border: 1px solid rgba(157, 78, 221, 0.24);
  border-radius: 12px;
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.df-lpd-stat span {
  font-size: 11px !important;
  color: #8F82AD;
}

.df-lpd-stat strong {
  font-size: 13px !important;
  color: #FFFFFF;
}

.df-lpd-links {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.df-lpd-link-pill {
  padding: 6px 12px;
  border-radius: 999px;
  background: #1B1333;
  border: 1px solid rgba(157, 78, 221, 0.35);
  color: #E5DEFA;
  font-size: 12px !important;
  font-weight: 600;
}

.df-lpd-cta {
  width: 100%;
  padding: 12px !important;
}

/* 7. SCREENS 7 & 8: TRADING BOT & STRATEGY BUILDER (E50 STOP V1) */
.df-bot-status-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  padding: 12px 16px;
  border-radius: 14px;
  background: #151026;
  border: 1px solid rgba(157, 78, 221, 0.32);
}

.df-bot-status-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px !important;
  color: #E5DEFA;
}

.df-bot-strategy-card,
.df-e50-builder {
  background: #151026;
  border: 1px solid rgba(184, 255, 1, 0.38);
  border-radius: 18px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.df-bsc-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.df-bsc-title {
  display: flex;
  align-items: center;
  gap: 10px;
}

.df-bsc-ic {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: rgba(184, 255, 1, 0.14);
  border: 1px solid rgba(184, 255, 1, 0.4);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 18px !important;
}

.df-bsc-actions {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
}

.df-eb-tabs {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  scrollbar-width: none;
}

.df-eb-tab {
  padding: 6px 12px !important;
  min-height: 0 !important;
  border-radius: 999px;
  background: #0E091A;
  border: 1px solid rgba(157, 78, 221, 0.3);
  color: #A79BC2;
  font-size: 12px !important;
  font-weight: 700;
  white-space: nowrap;
  cursor: pointer;
}

.df-eb-tab.active {
  background: #B8FF01;
  color: #0B0714 !important;
  border-color: #B8FF01;
}

.df-eb-body {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.df-eb-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 12px;
  background: #0E091A;
  border: 1px solid rgba(157, 78, 221, 0.24);
}

.df-eb-seg-group {
  display: inline-flex;
  background: #161029;
  padding: 3px;
  border-radius: 9px;
  border: 1px solid rgba(157, 78, 221, 0.32);
}

.df-eb-seg {
  padding: 4px 10px !important;
  min-height: 0 !important;
  min-width: 0 !important;
  border-radius: 7px;
  border: none;
  background: transparent;
  color: #A79BC2;
  font-size: 11.5px !important;
  font-weight: 700;
  cursor: pointer;
}

.df-eb-seg.active {
  background: #B8FF01;
  color: #0B0714 !important;
}

.df-eb-input-wrap {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #161029;
  border: 1px solid rgba(157, 78, 221, 0.36);
  border-radius: 10px;
  padding: 5px 10px;
}

.df-eb-input-wrap input {
  width: 68px;
  background: transparent;
  border: none;
  color: #FFFFFF;
  font-weight: 800;
  font-size: 13px !important;
  text-align: right;
  outline: none;
}

/* 8. TOKEN WORKSPACE DESKTOP & MOBILE LAYOUT */
@media (min-width: 1024px) {
  body:has(.token-workspace) .token-chart-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 370px !important;
    gap: 12px 16px !important;
    align-items: start !important;
  }

  body:has(.token-workspace) .token-chart-row > .token-chart {
    grid-column: 1 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
    width: 100% !important;
  }

  body:has(.token-workspace) .token-chart-row > .df-td-safety-card {
    grid-column: 1 !important;
    grid-row: 2 !important;
    min-width: 0 !important;
  }

  body:has(.token-workspace) .token-chart-row > .ui-workspace-actions {
    grid-column: 1 !important;
    grid-row: 3 !important;
  }

  body:has(.token-workspace) .token-chart-row > .token-safety-section {
    grid-column: 1 !important;
    grid-row: 4 !important;
    min-width: 0 !important;
  }

  body:has(.token-workspace) .token-chart-row > .df-swap-card {
    grid-column: 2 !important;
    grid-row: 1 / 3 !important;
    min-width: 0 !important;
    width: 100% !important;
    max-width: 370px !important;
  }

  body:has(.token-workspace) .token-chart-row > .trade-space {
    grid-column: 2 !important;
    grid-row: 3 / 5 !important;
    min-width: 0 !important;
    width: 100% !important;
    max-width: 370px !important;
  }
}

/* 9. STRICT MOBILE (< 768px) RESPONSIVE CARDS & ZERO OVERFLOW */
@media (max-width: 768px) {
  html body #main,
  html body:has(.discover-tabstrip) #main,
  html body:has(.df-dashboard-shell) #main {
    padding: 10px 10px 84px 10px !important;
    overflow-x: hidden !important;
  }

  .df-hero-banner-v2 {
    grid-template-columns: 1fr minmax(96px, 118px) !important;
    padding: 14px !important;
    gap: 10px !important;
    border-radius: 16px !important;
  }

  .df-hb-eyebrow {
    font-size: 10px !important;
    margin-bottom: 4px !important;
  }

  .df-hb-title {
    font-size: 1.25rem !important;
    margin-bottom: 4px !important;
  }

  .df-hb-sub {
    font-size: 11.5px !important;
    line-height: 1.35 !important;
    margin-bottom: 10px !important;
  }

  .df-hb-mascot {
    max-width: 112px !important;
  }

  .df-btn-lg,
  .df-btn-dark-pill {
    padding: 7px 12px !important;
    font-size: 11.5px !important;
    min-height: 34px !important;
  }

  .df-kpi-strip-v2,
  .df-feature-row-v2,
  .df-kpi-grid,
  .df-bot-kpi-grid,
  .df-lc-metrics,
  .df-lp-feature-strip {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
  }

  .df-kpi-item {
    border-right: none !important;
    padding-right: 0 !important;
  }

  .df-markets-card-v2 {
    padding: 12px 10px !important;
    border-radius: 16px !important;
  }

  .df-bot-grid,
  .df-settings-grid,
  .df-launchpad-grid,
  .df-calls-grid {
    grid-template-columns: 1fr !important;
  }

  .df-tds-grid {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .df-tds-left {
    border-right: none !important;
    border-bottom: 1px solid rgba(157, 78, 221, 0.22) !important;
    padding-right: 0 !important;
    padding-bottom: 8px !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
  }

  html body:has(.discover-tabstrip) .ui-pinned-strip .team-hot-item::after {
    content: 'Dexfun' !important;
  }

  html body .token-workspace .token-core {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }
}

/* Right-Column Widgets (Launchpad is Live, Live Activity, Top Gainers, Rewards Hub) */
.df-side-card {
  background: #140D26;
  border: 1px solid rgba(157, 78, 221, 0.34);
  border-radius: 18px;
  padding: 16px 18px;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.42);
}

.df-side-launchpad,
.df-side-rewards {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  background:
    radial-gradient(circle at 85% 50%, rgba(157, 78, 221, 0.38) 0%, rgba(20, 13, 38, 0.96) 72%),
    linear-gradient(135deg, #1A1033 0%, #120B24 100%);
  border-color: rgba(199, 125, 255, 0.42);
}

.df-slp-head {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 1.02rem;
  color: #FFFFFF;
  margin-bottom: 4px;
}

.df-slp-text p,
.df-srw-text p {
  margin: 4px 0 12px 0;
  font-size: 0.76rem;
  line-height: 1.4;
  color: #B8AED2;
}

.df-srw-text strong {
  font-size: 1.15rem;
  font-weight: 900;
  color: #FFFFFF;
}

.df-slp-img {
  width: 96px;
  height: 96px;
  object-fit: contain;
  flex-shrink: 0;
}

.df-srw-img {
  width: 112px;
  height: 112px;
  object-fit: contain;
  flex-shrink: 0;
}

.df-side-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}

.df-side-head strong {
  font-size: 0.96rem;
  color: #FFFFFF;
}

.df-side-head small {
  color: #9D91B8;
  font-weight: 500;
}

.df-live-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 10px;
  border-radius: 999px;
  background: rgba(168, 255, 0, 0.13);
  border: 1px solid rgba(168, 255, 0, 0.38);
  color: #A8FF00;
  font-size: 0.72rem;
  font-weight: 800;
}

.df-side-more {
  background: none;
  border: none;
  color: #B8AED2;
  font-size: 0.76rem;
  font-weight: 600;
  cursor: pointer;
}

.df-side-more:hover {
  color: #A8FF00;
}

.df-act-list,
.df-gainer-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.df-act-row,
.df-gainer-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 7px 10px;
  border-radius: 10px;
  background: rgba(11, 7, 20, 0.58);
  border: 1px solid rgba(157, 78, 221, 0.16);
  font-size: 0.76rem;
}

.df-act-left,
.df-gainer-left {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
}

.df-act-left .avatar,
.df-gainer-left .avatar {
  width: 24px !important;
  height: 24px !important;
  border-radius: 50% !important;
  flex-shrink: 0;
}

.df-act-wallet {
  color: #9D91B8;
  font-family: monospace;
  font-size: 0.72rem;
}

.df-act-verb {
  font-weight: 700;
}

.df-act-buy { color: #A8FF00; }
.df-act-sell { color: #FF4D6D; }
.df-act-launch { color: #C77DFF; }

.df-act-sym,
.df-gainer-sym {
  font-size: 0.78rem !important;
  font-weight: 800 !important;
}

.df-act-right {
  display: flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
}

.df-act-right small {
  color: #8F82AD;
}

.df-gainer-spark .df-spark-svg {
  width: 72px;
  height: 22px;
}

.df-gainer-pct {
  color: #A8FF00;
  font-size: 0.82rem;
  font-weight: 800;
}

/* 10. COMPLETE CLASS BINDINGS FOR DEXFUN-VIEWS V3 (HOME SWAP, MARKETS TOP WRAP, LAUNCHPAD & BOT BUILDER) */
.df-home-trade-section,
.df-markets-top-wrap {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  min-width: 0;
}

.df-trade-mode-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  background: #0D0818;
  padding: 5px 8px;
  border-radius: 12px;
  border: 1px solid rgba(157, 78, 221, 0.28);
}

.df-trade-mode-tabs {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  flex: 1;
}

.df-topbar-nav,
.df-lp-ends-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-size: 12px !important;
}

.df-lp-stats-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}

.df-lp-stat-box {
  background: #0E091A;
  border: 1px solid rgba(157, 78, 221, 0.24);
  border-radius: 12px;
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.df-lp-stat-box span {
  font-size: 11px !important;
  color: #8F82AD;
}

.df-lp-stat-box strong {
  font-size: 13px !important;
  color: #FFFFFF;
}

.df-tmode-btn {
  padding: 7px 8px !important;
  min-height: 0 !important;
  min-width: 0 !important;
  border-radius: 9px;
  border: none;
  background: transparent;
  color: #A79BC2;
  font-size: 12.5px !important;
  font-weight: 700;
  cursor: pointer;
}

.df-tmode-btn.active {
  background: #B8FF01;
  color: #0B0714 !important;
  font-weight: 800;
  box-shadow: 0 0 12px rgba(184, 255, 1, 0.32);
}

.df-swap-token-line {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.df-token-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 12px;
  border-radius: 999px;
  background: #1B1333;
  border: 1px solid rgba(157, 78, 221, 0.4);
  color: #FFFFFF;
  font-weight: 800;
  font-size: 13px !important;
  white-space: nowrap;
  flex-shrink: 0;
}

.df-token-pill .avatar,
.df-sol-orb {
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  min-height: 22px !important;
  border-radius: 50% !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(184, 255, 1, 0.16);
  color: #B8FF01;
  font-weight: 900;
  font-size: 12px !important;
}

.df-swap-amt-col {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  min-width: 0;
  flex: 1;
}

.df-swap-amt-col input {
  background: transparent;
  border: none;
  color: #FFFFFF;
  font-size: 1.35rem !important;
  font-weight: 800;
  text-align: right;
  width: 100%;
  min-width: 0;
  outline: none;
}

.df-swap-amt-col small {
  font-size: 11px !important;
  color: #8F82AD;
}

.df-swap-details-list {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(11, 7, 20, 0.6);
  border: 1px solid rgba(157, 78, 221, 0.2);
  font-size: 11.5px !important;
}

.df-swap-details-list > div {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}

.df-swap-details-list span {
  color: #A79BC2;
}

.df-lpf-item {
  background: #151026;
  border: 1px solid rgba(157, 78, 221, 0.28);
  border-radius: 12px;
  padding: 10px 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 5px;
  min-width: 0;
}

.df-lpf-ic {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background: rgba(184, 255, 1, 0.14);
  border: 1px solid rgba(184, 255, 1, 0.36);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 15px !important;
}

.df-lpf-item span:last-child {
  font-size: 11.5px !important;
  font-weight: 700;
  color: #E5DEFA;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

.df-lc-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.df-cat-pill {
  padding: 3px 9px;
  border-radius: 999px;
  background: rgba(157, 78, 221, 0.18);
  border: 1px solid rgba(157, 78, 221, 0.38);
  color: #D7CEEE;
  font-size: 11px !important;
  font-weight: 700;
}

.df-lc-desc {
  margin: 0;
  font-size: 12px !important;
  color: #B8AED2;
  line-height: 1.4;
}

.df-strategy-kv-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  padding: 10px 12px;
  border-radius: 12px;
  background: #0E091A;
  border: 1px solid rgba(157, 78, 221, 0.24);
  font-size: 12px !important;
}

.df-strategy-kv-list > div {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.df-strategy-kv-list span {
  font-size: 10.5px !important;
  color: #8F82AD;
}

.df-strategy-actions {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
}

.df-mode-btn.active-lime {
  background: #B8FF01 !important;
  color: #0B0714 !important;
  font-weight: 800 !important;
}

.df-builder-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 12px;
  background: #0E091A;
  border: 1px solid rgba(157, 78, 221, 0.24);
}

.df-entry-size-input {
  width: 86px !important;
  padding: 6px 10px !important;
  border-radius: 10px !important;
  background: #161029 !important;
  border: 1px solid rgba(157, 78, 221, 0.38) !important;
  color: #FFFFFF !important;
  font-weight: 800 !important;
  text-align: right !important;
}

@media (max-width: 768px) {
  .df-subtabs {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    max-width: 100% !important;
    scrollbar-width: none !important;
  }

  .df-subtabs::-webkit-scrollbar {
    display: none !important;
  }

  .df-subtab {
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    padding: 6px 12px !important;
    font-size: 12px !important;
  }

  html body:has(.token-workspace) .ui-workspace-actions,
  html body:has(.token-workspace) .trade-space {
    display: none !important;
  }
}

/* ==========================================================================
   DEXFUN V4 — 10-SCREENS 1-ON-1 REFERENCE PARITY
   ========================================================================== */

/* 1. Header Brand Solid Neon Lime & 6-Item Bottom Dock */
header .brand-name,
header .brand-name em {
  color: #B8FF01 !important;
  font-style: normal !important;
  text-shadow: 0 0 16px rgba(184, 255, 1, 0.35);
}

#nav.df-bottom-dock {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 2px !important;
  padding: 6px 6px calc(6px + env(safe-area-inset-bottom, 0px)) !important;
}

#nav.df-bottom-dock > button {
  padding: 5px 2px !important;
  font-size: 10px !important;
  gap: 2px !important;
}

#nav.df-bottom-dock > button .df-dock-ic {
  font-size: 15px !important;
}

/* 2. Screen 1 — Home / Trade (Swap Screen Only) */
.df-home-only-shell {
  max-width: 520px;
  margin: 0 auto;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

#main:has(.df-home-only-shell) .table-wrap,
#main:has(.df-home-only-shell) .markets-list-panel,
#main:has(.df-home-only-shell) .discover-below {
  display: none !important;
}

.df-tmode {
  position: relative;
}

.df-tmode-new-badge {
  display: inline-block;
  margin-left: 4px;
  padding: 1px 5px;
  border-radius: 999px;
  background: #9D4EDD;
  color: #FFFFFF;
  font-size: 9px !important;
  font-weight: 800;
  line-height: 1.2;
  vertical-align: middle;
}

.df-swap-amt-col.df-amt-left {
  align-items: flex-start !important;
  text-align: left !important;
}

.df-swap-amt-col.df-amt-left input {
  text-align: left !important;
  font-size: 1.55rem !important;
  font-weight: 900 !important;
}

.df-pos-inline {
  color: #B8FF01 !important;
  font-weight: 700;
}

.df-max-pill {
  margin-left: 4px;
  padding: 1px 6px;
  border-radius: 6px;
  background: rgba(184, 255, 1, 0.16);
  border: 1px solid rgba(184, 255, 1, 0.45);
  color: #B8FF01;
  font-size: 10px !important;
  font-weight: 800;
  cursor: pointer;
}

.df-slip-gear {
  padding: 4px 8px;
  border-radius: 8px;
  background: #1A1230;
  border: 1px solid rgba(157, 78, 221, 0.35);
  color: #E2DAF5;
  font-size: 12px !important;
  cursor: pointer;
}

/* 3. Screen 2 — Token Detail (7-Part Reference Structure) */
.token-workspace.df-token-detail-v4 {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  max-width: 920px;
  margin: 0 auto;
  width: 100%;
  padding-bottom: 18px;
}

html body:has(.df-token-detail-v4) #ui-token-mobile-tabs,
html body:has(.df-token-detail-v4) .ui-workspace-actions,
html body:has(.df-token-detail-v4) .ui-token-info,
html body:has(.df-token-detail-v4) .ui-token-stats-toggle,
html body:has(.df-token-detail-v4) .ui-details-toggle,
.df-token-detail-v4 .chart-bar,
.df-token-detail-v4 .chart-note,
.df-token-detail-v4 .chart-QuickBuy {
  display: none !important;
}

.df-td-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 14px;
  background: #151026;
  border: 1px solid rgba(157, 78, 221, 0.32);
  border-radius: 16px;
}

.df-td-left {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.df-td-back {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: #1E1636;
  border: 1px solid rgba(157, 78, 221, 0.38);
  color: #FFFFFF;
  font-size: 1.25rem !important;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
}

.df-td-left .avatar {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  min-height: 40px !important;
  border-radius: 50% !important;
  border: 2px solid #B8FF01 !important;
}

.df-td-id {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.df-td-sym-row {
  display: flex;
  align-items: center;
  gap: 5px;
}

.df-td-sym {
  font-size: 1.15rem !important;
  font-weight: 900;
  color: #FFFFFF;
}

.df-td-sub {
  font-size: 12px !important;
  color: #9E92BA;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.df-td-right {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.df-td-icon-btn {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #1E1636;
  border: 1px solid rgba(157, 78, 221, 0.38);
  color: #E8E2F8;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 14px !important;
  cursor: pointer;
}

.df-td-icon-btn.df-td-star.watched {
  color: #FFD166 !important;
  border-color: rgba(255, 209, 102, 0.55) !important;
  background: rgba(255, 209, 102, 0.14) !important;
}

.df-td-price-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 2px 6px;
}

.df-td-price-main {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}

.df-td-big-price,
.df-td-big-price .money-value {
  font-size: 1.7rem !important;
  font-weight: 900 !important;
  color: #FFFFFF !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
}

.df-td-chg {
  font-size: 13.5px !important;
  font-weight: 800;
  padding: 2px 8px;
  border-radius: 8px;
}

.df-td-chg.up {
  color: #B8FF01 !important;
  background: rgba(184, 255, 1, 0.14);
}

.df-td-chg.down {
  color: #FF3B69 !important;
  background: rgba(255, 59, 105, 0.16);
}

.df-td-24h {
  font-size: 12px !important;
  color: #9E92BA;
}

.df-td-mini-chart-ic {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: rgba(184, 255, 1, 0.12);
  border: 1px solid rgba(184, 255, 1, 0.35);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 15px !important;
}

.df-td-stats-strip {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
  padding: 10px 12px;
  background: #151026;
  border: 1px solid rgba(157, 78, 221, 0.3);
  border-radius: 14px;
}

.df-td-stat-cell {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  border-right: 1px solid rgba(157, 78, 221, 0.18);
  padding-right: 6px;
}

.df-td-stat-cell:last-child {
  border-right: none;
  padding-right: 0;
}

.df-td-stat-cell span {
  font-size: 11px !important;
  color: #9E92BA;
  white-space: nowrap;
}

.df-td-stat-cell strong,
.df-td-stat-cell strong .money-value {
  font-size: 13px !important;
  font-weight: 800 !important;
  color: #FFFFFF !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.df-td-tf-bar {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 4px;
  padding: 5px;
  background: #130D24;
  border: 1px solid rgba(157, 78, 221, 0.28);
  border-radius: 12px;
}

.df-tf-pill {
  padding: 6px 0;
  border-radius: 8px;
  background: transparent;
  border: none;
  color: #A79BC2;
  font-size: 12px !important;
  font-weight: 800;
  text-align: center;
  cursor: pointer;
}

.df-tf-pill.active {
  background: #B8FF01 !important;
  color: #0B0714 !important;
  box-shadow: 0 0 12px rgba(184, 255, 1, 0.4);
}

.df-td-chart-card {
  padding: 8px !important;
  border-radius: 16px !important;
  background: #120C22 !important;
  border: 1px solid rgba(157, 78, 221, 0.3) !important;
  min-height: 240px;
}

.df-td-subtabs {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  border-bottom: 1px solid rgba(157, 78, 221, 0.28);
  background: #140E26;
  border-radius: 12px 12px 0 0;
  overflow: hidden;
}

.df-td-subtab {
  padding: 11px 6px;
  background: transparent;
  border: none;
  border-bottom: 3px solid transparent;
  color: #A79BC2;
  font-size: 13px !important;
  font-weight: 800;
  text-align: center;
  cursor: pointer;
}

.df-td-subtab.selected {
  color: #B8FF01 !important;
  border-bottom-color: #B8FF01 !important;
  background: rgba(184, 255, 1, 0.06);
}

.df-td-safety-card {
  background: linear-gradient(145deg, #17112B 0%, #120C21 100%);
  border: 1px solid rgba(157, 78, 221, 0.35);
  border-radius: 16px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.df-td-safety-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.df-td-safety-head strong {
  font-size: 15px !important;
  font-weight: 900;
  color: #FFFFFF;
}

.df-td-audit-btn {
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(184, 255, 1, 0.14);
  border: 1px solid rgba(184, 255, 1, 0.4);
  color: #B8FF01;
  font-size: 11px !important;
  font-weight: 800;
  cursor: pointer;
}

.df-td-safety-body {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  align-items: center;
}

.df-td-safety-score-col {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-right: 12px;
  border-right: 1px solid rgba(157, 78, 221, 0.22);
}

.df-td-shield {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: rgba(184, 255, 1, 0.16);
  border: 1px solid rgba(184, 255, 1, 0.45);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 20px !important;
}

.df-td-score-num {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.df-td-score-num strong {
  font-size: 1.35rem !important;
  font-weight: 900;
  color: #B8FF01;
  line-height: 1.1;
}

.df-td-score-num strong small {
  font-size: 11.5px !important;
  color: #9E92BA;
  font-weight: 700;
}

.df-td-risk-pill {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(184, 255, 1, 0.16);
  color: #B8FF01;
  font-size: 10.5px !important;
  font-weight: 800;
  width: fit-content;
}

.df-td-safety-checks {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px 8px;
}

.df-td-safety-checks li {
  font-size: 11.5px !important;
  color: #EAE4FA;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.df-chk {
  color: #B8FF01;
  font-weight: 900;
}

.df-td-action-bar {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding-top: 4px;
}

.df-td-buy-btn {
  padding: 13px 16px;
  border-radius: 14px;
  background: #B8FF01 !important;
  color: #0B0714 !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  border: none;
  box-shadow: 0 0 18px rgba(184, 255, 1, 0.4);
  cursor: pointer;
  text-align: center;
}

.df-td-sell-btn {
  padding: 13px 16px;
  border-radius: 14px;
  background: linear-gradient(135deg, #9D4EDD 0%, #6C2BD9 100%) !important;
  color: #FFFFFF !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  border: 1px solid rgba(199, 125, 255, 0.5);
  box-shadow: 0 0 18px rgba(157, 78, 221, 0.35);
  cursor: pointer;
  text-align: center;
}

/* 4. Screen 3 — Markets */
.df-markets-only-shell {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
}

.df-markets-kpi-3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.df-mkpi-box {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 10px;
  border-radius: 14px;
  background: #151026;
  border: 1px solid rgba(157, 78, 221, 0.3);
  min-width: 0;
}

.df-mk-ic {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: rgba(184, 255, 1, 0.14);
  border: 1px solid rgba(184, 255, 1, 0.38);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 13px !important;
  flex-shrink: 0;
}

.df-mk-txt {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.df-mk-lbl {
  font-size: 10.5px !important;
  color: #9E92BA;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.df-mk-val-row {
  display: flex;
  align-items: baseline;
  gap: 4px;
  flex-wrap: wrap;
}

.df-mk-val-row strong {
  font-size: 13.5px !important;
  font-weight: 900;
  color: #FFFFFF;
}

.df-mk-chg.up {
  font-size: 10.5px !important;
  font-weight: 800;
  color: #B8FF01;
}

.df-markets-controls-v4 {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 10px;
}

.df-markets-tabs-v4 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  padding: 5px;
  background: #140E26;
  border: 1px solid rgba(157, 78, 221, 0.3);
  border-radius: 12px;
}

.df-mtab {
  padding: 8px 4px;
  border-radius: 9px;
  background: transparent;
  border: none;
  color: #B8AED2;
  font-size: 12px !important;
  font-weight: 800;
  text-align: center;
  cursor: pointer;
  white-space: nowrap;
}

.df-mtab.selected {
  background: #B8FF01 !important;
  color: #0B0714 !important;
  box-shadow: 0 0 12px rgba(184, 255, 1, 0.35);
}

.df-markets-filter-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.df-mfilter-pill {
  padding: 8px 10px;
  border-radius: 10px;
  background: #17112B;
  border: 1px solid rgba(157, 78, 221, 0.34);
  color: #EAE4FA;
  font-size: 12px !important;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  cursor: pointer;
  white-space: nowrap;
}

.df-mfilter-pill.active {
  border-color: #B8FF01;
  color: #B8FF01;
}

/* 5. Screen 4 — Launchpad Compact Horizontal Cards */
.df-launch-card.df-launch-card-h {
  display: grid !important;
  grid-template-columns: 52px minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: center !important;
  padding: 14px 16px !important;
}

.df-lc-avatar-col .df-lc-avatar {
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
  border: 2px solid #B8FF01 !important;
  object-fit: cover;
}

.df-lc-main-col {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.df-lc-row-1 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.df-lc-title-inline {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  flex-wrap: nowrap;
}

.df-lc-sym {
  font-size: 15px !important;
  font-weight: 900;
  color: #FFFFFF;
}

.df-lc-verified {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #B8FF01;
  color: #0B0714;
  font-size: 10px !important;
  font-weight: 900;
  flex-shrink: 0;
}

.df-lc-timer-fav {
  font-size: 11.5px !important;
  color: #B8AED2;
  white-space: nowrap;
  flex-shrink: 0;
}

.df-lc-row-2 {
  font-size: 12px !important;
  color: #9E92BA;
  margin-bottom: 2px;
}

.df-lc-row-3 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 4px;
}

.df-lc-raised-txt {
  font-size: 12px !important;
  color: #EAE4FA;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.df-lc-view-pill {
  padding: 5px 12px;
  border-radius: 999px;
  background: #140E26;
  border: 1.5px solid #B8FF01;
  color: #B8FF01;
  font-size: 12px !important;
  font-weight: 800;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
}

/* 6. Screen 5 — Create Launch Connected Stepper & Logo Box */
.df-wizard-breadcrumb {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px !important;
  color: #A79BC2;
}

.df-stepper-connected {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  padding: 12px 14px;
  background: #151026;
  border: 1px solid rgba(157, 78, 221, 0.3);
  border-radius: 14px;
}

.df-step-node {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  background: transparent;
  border: none;
  color: #8F82AD;
  font-size: 11px !important;
  font-weight: 700;
  cursor: pointer;
  padding: 0;
}

.df-step-circle {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #1F1738;
  border: 1.5px solid rgba(157, 78, 221, 0.45);
  color: #B8AED2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px !important;
  font-weight: 900;
}

.df-step-node.active .df-step-circle {
  background: #B8FF01 !important;
  border-color: #B8FF01 !important;
  color: #0B0714 !important;
  box-shadow: 0 0 12px rgba(184, 255, 1, 0.45);
}

.df-step-node.active .df-step-txt {
  color: #B8FF01 !important;
  font-weight: 800;
}

.df-step-line {
  flex: 1;
  height: 2px;
  background: rgba(157, 78, 221, 0.35);
  margin-bottom: 16px;
}

.df-step-line.done {
  background: #B8FF01;
}

.df-project-details-frame {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.df-form-row-2col {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.df-desc-counter {
  font-size: 11px !important;
  color: #8F82AD;
  text-align: right;
  margin-top: 2px;
}

.df-logo-upload-row {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 14px;
  border-radius: 14px;
  background: #110B20;
  border: 1px dashed rgba(184, 255, 1, 0.45);
}

.df-logo-preview-img {
  width: 54px;
  height: 54px;
  border-radius: 14px;
  object-fit: cover;
  border: 1.5px solid #B8FF01;
  flex-shrink: 0;
}

.df-logo-upload-copy {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.df-logo-upload-copy strong {
  font-size: 13.5px !important;
  color: #B8FF01;
  font-weight: 800;
}

.df-logo-upload-copy span {
  font-size: 11.5px !important;
  color: #9E92BA;
}

.df-next-full {
  width: 100%;
  justify-content: center;
  text-align: center;
  padding: 13px !important;
  font-size: 15px !important;
}

/* 7. Screens 6 & 7 — Trading Bot & Strategy Builder */
.df-bot-top-2cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.df-bot-mini-card {
  background: #151026;
  border: 1px solid rgba(157, 78, 221, 0.32);
  border-radius: 14px;
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.df-bmc-lbl {
  font-size: 11px !important;
  color: #9E92BA;
  font-weight: 700;
}

.df-mode-btn.active-purple {
  background: linear-gradient(135deg, #9D4EDD 0%, #6C2BD9 100%) !important;
  color: #FFFFFF !important;
  font-weight: 800 !important;
  box-shadow: 0 0 12px rgba(157, 78, 221, 0.45);
}

.df-bot-kpis-v4 .df-bot-kpi {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
}

.df-bk-ic {
  font-size: 14px !important;
  margin-bottom: 2px;
}

.df-strat-inline-metrics {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 12px;
  background: #0E091A;
  border: 1px solid rgba(157, 78, 221, 0.26);
  font-size: 12px !important;
  color: #B8AED2;
  flex-wrap: wrap;
}

.df-builder-top-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.df-builder-top-header h2 {
  margin: 0;
  font-size: 1.1rem !important;
  font-weight: 900;
  color: #FFFFFF;
}

.df-strat-select-pill {
  padding: 6px 10px;
  border-radius: 999px;
  background: #1A1230;
  border: 1px solid rgba(184, 255, 1, 0.45);
  color: #B8FF01;
  font-size: 11.5px !important;
  font-weight: 800;
  cursor: pointer;
  white-space: nowrap;
}

.df-builder-block {
  background: #0E091A;
  border: 1px solid rgba(157, 78, 221, 0.24);
  border-radius: 12px;
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.df-builder-row-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 12.5px !important;
  color: #EAE4FA;
}

.df-entry-presets-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}

.df-preset-pill {
  padding: 7px 4px;
  border-radius: 8px;
  background: #17112B;
  border: 1px solid rgba(157, 78, 221, 0.34);
  color: #D7CEEE;
  font-size: 12px !important;
  font-weight: 800;
  text-align: center;
  cursor: pointer;
}

.df-preset-pill.active {
  background: rgba(184, 255, 1, 0.18);
  border-color: #B8FF01;
  color: #B8FF01;
}

.df-ios-switch {
  width: 44px;
  height: 24px;
  border-radius: 999px;
  background: #261C3D;
  border: 1px solid rgba(157, 78, 221, 0.4);
  padding: 2px;
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  flex-shrink: 0;
}

.df-ios-switch.on {
  background: #B8FF01;
  border-color: #B8FF01;
  justify-content: flex-end;
}

.df-ios-knob {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #FFFFFF;
}

.df-ios-switch.on .df-ios-knob {
  background: #0B0714;
}

.df-builder-sel-pill {
  padding: 5px 10px;
  border-radius: 8px;
  background: #17112B;
  border: 1px solid rgba(157, 78, 221, 0.38);
  color: #EAE4FA;
  font-size: 12px !important;
  font-weight: 800;
}

/* 8. Screen 8 — My Wallet (Profile) */
.df-wallet-top-card {
  background: linear-gradient(145deg, #1B1233 0%, #120B24 100%);
  border: 1px solid rgba(157, 78, 221, 0.38);
  border-radius: 18px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.df-wtc-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.df-wtc-title-col {
  display: flex;
  align-items: center;
  gap: 8px;
}

.df-wtc-title-col h2 {
  margin: 0;
  font-size: 1.15rem !important;
  font-weight: 900;
  color: #FFFFFF;
}

.df-wtc-right-head {
  display: flex;
  align-items: center;
  gap: 8px;
}

.df-connected-pill {
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(184, 255, 1, 0.14);
  border: 1px solid rgba(184, 255, 1, 0.42);
  color: #B8FF01;
  font-size: 11px !important;
  font-weight: 800;
}

.df-wtc-gear-btn {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background: #1E1636;
  border: 1px solid rgba(157, 78, 221, 0.38);
  color: #EAE4FA;
  cursor: pointer;
}

.df-wtc-balance-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.df-wh-sol-bal {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.df-wh-sol-bal strong {
  font-size: 1.7rem !important;
  font-weight: 900;
  color: #FFFFFF;
}

.df-wh-sol-bal span {
  font-size: 13px !important;
  color: #9E92BA;
}

.df-wh-sol-coin {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #9D4EDD, #14F195);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 22px rgba(20, 241, 149, 0.35);
  flex-shrink: 0;
}

.df-sol-3d-orb {
  font-size: 26px !important;
  color: #0B0714;
  font-weight: 900;
}

.df-wtc-actions-3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.df-portfolio-val-card {
  background: #151026;
  border: 1px solid rgba(157, 78, 221, 0.32);
  border-radius: 16px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.df-pvc-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.df-pvc-lbl {
  font-size: 11.5px !important;
  color: #9E92BA;
  display: block;
}

.df-pvc-val-row {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}

.df-pvc-val-row strong {
  font-size: 1.45rem !important;
  font-weight: 900;
  color: #FFFFFF;
}

.df-pvc-chg.up {
  font-size: 12px !important;
  font-weight: 800;
  color: #B8FF01;
}

.df-pvc-spark {
  width: 115px;
  height: 36px;
  flex-shrink: 0;
}

.df-port-summary-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  padding-top: 8px;
  border-top: 1px solid rgba(157, 78, 221, 0.2);
  font-size: 11.5px !important;
  color: #9E92BA;
}

.df-port-summary-row strong {
  display: block;
  font-size: 12.5px !important;
  color: #FFFFFF;
  margin-top: 1px;
}

.df-holdings-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}

.df-holdings-header h3 {
  margin: 0;
  font-size: 14.5px !important;
  font-weight: 900;
  color: #FFFFFF;
}

.df-holdings-toggle {
  display: inline-flex;
  background: #0E091A;
  border: 1px solid rgba(157, 78, 221, 0.32);
  border-radius: 8px;
  padding: 2px;
}

.df-ht-btn {
  padding: 4px 8px;
  border-radius: 6px;
  background: transparent;
  border: none;
  color: #9E92BA;
  font-size: 11px !important;
  font-weight: 800;
  cursor: pointer;
}

.df-ht-btn.active {
  background: #B8FF01;
  color: #0B0714;
}

/* 9. Screen 9 — Community Calls */
.df-call-card-v4 {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.df-call-head-v4 {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.df-caller-info {
  display: flex;
  align-items: center;
  gap: 8px;
}

.df-caller-avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(184, 255, 1, 0.18);
  border: 1px solid #B8FF01;
  color: #B8FF01;
  font-size: 12px !important;
  font-weight: 900;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.df-call-time {
  font-size: 11.5px !important;
  color: #8F82AD;
}

.df-call-body-v4 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.df-call-token-line {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.df-call-token-line div {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.df-call-token-line strong {
  font-size: 13px !important;
  color: #FFFFFF;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.df-call-token-line span {
  font-size: 11.5px !important;
  color: #9E92BA;
}

.df-call-foot-v4 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 8px;
  border-top: 1px solid rgba(157, 78, 221, 0.2);
}

.df-call-socials {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 12px !important;
  color: #B8AED2;
}

.df-call-trade-btn {
  padding: 5px 14px;
  border-radius: 999px;
  background: #140E26;
  border: 1.5px solid #B8FF01;
  color: #B8FF01;
  font-size: 12px !important;
  font-weight: 800;
  cursor: pointer;
}

/* 10. Screen 10 — Settings Dedicated Menu */
.df-settings-v4 {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: 640px;
  margin: 0 auto;
  width: 100%;
}

.df-settings-top-header {
  display: flex;
  align-items: center;
  gap: 10px;
}

.df-settings-top-header h2 {
  margin: 0;
  font-size: 1.25rem !important;
  font-weight: 900;
  color: #FFFFFF;
}

.df-settings-menu-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.df-settings-menu-card {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 16px;
  background: #151026;
  border: 1px solid rgba(157, 78, 221, 0.32);
  text-align: left;
  color: #FFFFFF;
  cursor: pointer;
  width: 100%;
}

.df-smc-ic {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: rgba(184, 255, 1, 0.14);
  border: 1px solid rgba(184, 255, 1, 0.36);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 18px !important;
}

.df-smc-body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.df-smc-body strong {
  font-size: 14.5px !important;
  font-weight: 800;
  color: #FFFFFF;
}

.df-smc-body span {
  font-size: 12px !important;
  color: #9E92BA;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.df-smc-right {
  display: flex;
  align-items: center;
  gap: 8px;
}

.df-smc-badge {
  padding: 3px 8px;
  border-radius: 999px;
  background: rgba(184, 255, 1, 0.16);
  border: 1px solid rgba(184, 255, 1, 0.45);
  color: #B8FF01;
  font-size: 11px !important;
  font-weight: 800;
}

.df-smc-chevron {
  font-size: 1.35rem !important;
  color: #8F82AD;
  font-weight: 700;
}

/* ==========================================================================
   DEXFUN V4 FINAL — EXACT DOM CLASS & SPECIFICITY OVERRIDES FOR ALL 10 SCREENS
   ========================================================================== */

/* 1. Solid Neon Lime Brand + Single-Row Mobile Header + 6-Column Bottom Dock */
html body header .brand-name,
html body header .brand-name em {
  background: none !important;
  -webkit-background-clip: initial !important;
  -webkit-text-fill-color: #B8FF01 !important;
  color: #B8FF01 !important;
  font-style: normal !important;
  font-weight: 900 !important;
}

@media (max-width: 1023px) {
  html body header {
    grid-template-rows: 48px !important;
    height: 54px !important;
    min-height: 54px !important;
    padding: 3px 10px !important;
  }

  html body header > #df-topnav,
  html body header > nav.df-topnav {
    display: none !important;
  }
}

html body #nav.df-bottom-dock,
html body nav.bottomnav.df-bottom-dock {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 2px !important;
  padding: 0 4px env(safe-area-inset-bottom, 0px) !important;
}

html body #nav.df-bottom-dock .df-dock-btn {
  padding: 4px 1px !important;
  font-size: 9.5px !important;
}

html body #nav.df-bottom-dock .df-dock-btn .df-dock-lbl {
  font-size: 9.5px !important;
}

/* 2. Screen 1 — Trade / Swap Card Exact Alignment */
html body .df-tmode-btn {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  white-space: nowrap !important;
}

html body .df-tmode-new-badge {
  position: absolute !important;
  top: -5px !important;
  right: 3px !important;
  margin: 0 !important;
  padding: 1px 5px !important;
  font-size: 8.5px !important;
  border-radius: 999px !important;
  background: #9D4EDD !important;
  color: #FFFFFF !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
}

html body .df-swap-est.df-est-white {
  color: #FFFFFF !important;
  font-size: 1.5rem !important;
  font-weight: 900 !important;
  text-align: left !important;
}

/* 3. Screen 2 — Token Detail (.df-td-screen) Exact 7-Part Layout */
html body .token-workspace.df-td-screen,
html body .df-td-container {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 920px !important;
  margin: 0 auto !important;
}

html body:has(.df-td-screen) #ui-token-mobile-tabs,
html body:has(.df-td-screen) .ui-workspace-actions,
html body:has(.df-td-screen) .ui-token-info,
html body:has(.df-td-screen) .ui-token-stats-toggle,
html body:has(.df-td-screen) .ui-details-toggle {
  display: none !important;
}

html body .df-td-topbar {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 10px 12px !important;
  background: #151026 !important;
  border: 1px solid rgba(157, 78, 221, 0.34) !important;
  border-radius: 16px !important;
}

html body .df-td-top-left {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
}

html body .df-td-top-left .avatar {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  min-height: 40px !important;
  border-radius: 50% !important;
  border: 2px solid #B8FF01 !important;
  flex-shrink: 0 !important;
}

html body .df-td-id {
  display: flex !important;
  flex-direction: column !important;
  gap: 1px !important;
  min-width: 0 !important;
}

html body .df-td-sym-row {
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
}

html body .df-td-sym-row strong {
  font-size: 1.1rem !important;
  font-weight: 900 !important;
  color: #FFFFFF !important;
}

html body .df-td-name {
  font-size: 11.5px !important;
  color: #9E92BA !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  max-width: 175px !important;
}

html body .df-td-actions-top {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 8px !important;
  flex-shrink: 0 !important;
}

html body .df-td-icon-btn,
html body .df-td-star-btn {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  min-height: 36px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  background: #1E1636 !important;
  border: 1px solid rgba(157, 78, 221, 0.38) !important;
  color: #FFFFFF !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 14px !important;
  cursor: pointer !important;
}

html body .df-td-price-row {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  padding: 2px 4px !important;
}

html body .df-td-price-left {
  display: flex !important;
  flex-direction: row !important;
  align-items: baseline !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  min-width: 0 !important;
}

html body .df-td-price-left .money-value,
html body .df-td-price-left .money-value span {
  font-size: 1.65rem !important;
  font-weight: 900 !important;
  color: #FFFFFF !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  min-height: 0 !important;
}

html body .df-td-price-left .cell-change {
  display: inline-flex !important;
  align-items: center !important;
  padding: 0 !important;
  margin: 0 !important;
}

html body .df-td-price-left .cell-change .mobile-metric-label {
  display: none !important;
}

html body .df-td-price-left .cell-change .change-value {
  font-size: 13.5px !important;
  font-weight: 800 !important;
  padding: 2px 8px !important;
  border-radius: 8px !important;
  background: rgba(184, 255, 1, 0.14) !important;
  color: #B8FF01 !important;
}

html body .df-td-price-left .cell-change .change-value[data-change="down"] {
  background: rgba(255, 59, 105, 0.16) !important;
  color: #FF3B69 !important;
}

html body .df-td-stats-strip {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 6px !important;
  padding: 10px 12px !important;
  background: #151026 !important;
  border: 1px solid rgba(157, 78, 221, 0.3) !important;
  border-radius: 14px !important;
}

html body .df-td-stats-strip > .df-td-stat-cell,
html body .df-td-stats-strip > .core-stat {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
  gap: 2px !important;
  min-width: 0 !important;
  padding: 0 6px 0 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: none !important;
  border-right: 1px solid rgba(157, 78, 221, 0.18) !important;
  border-radius: 0 !important;
}

html body .df-td-stats-strip > :last-child {
  border-right: none !important;
  padding-right: 0 !important;
}

html body .df-td-stats-strip > .core-stat .k,
html body .df-td-stats-strip > .df-td-stat-cell > span.quiet {
  font-size: 10.5px !important;
  color: #9E92BA !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
}

html body .df-td-stats-strip .money-value,
html body .df-td-stats-strip .money-value span,
html body .df-td-stats-strip .partial-number,
html body .df-td-stats-strip > .core-stat .v {
  font-size: 12.5px !important;
  font-weight: 800 !important;
  color: #FFFFFF !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  min-height: 0 !important;
  white-space: nowrap !important;
}

html body .df-td-tf-bar {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px !important;
  padding: 5px 8px !important;
  background: #130D24 !important;
  border: 1px solid rgba(157, 78, 221, 0.28) !important;
  border-radius: 12px !important;
}

html body .df-td-tf-pills {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 2px !important;
  flex: 1 !important;
  justify-content: space-between !important;
}

html body .df-tf-btn {
  padding: 5px 7px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: 28px !important;
  border-radius: 7px !important;
  background: transparent !important;
  border: none !important;
  color: #A79BC2 !important;
  font-size: 11.5px !important;
  font-weight: 800 !important;
  cursor: pointer !important;
}

html body .df-tf-btn.selected {
  background: #B8FF01 !important;
  color: #0B0714 !important;
  box-shadow: 0 0 10px rgba(184, 255, 1, 0.35) !important;
}

html body .df-td-tf-icons {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding-left: 6px !important;
  border-left: 1px solid rgba(157, 78, 221, 0.22) !important;
}

html body .df-tf-ic {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  min-height: 28px !important;
  padding: 0 !important;
  border-radius: 7px !important;
  background: transparent !important;
  border: none !important;
  font-size: 13px !important;
  cursor: pointer !important;
}

html body .df-tf-ic.selected {
  background: rgba(184, 255, 1, 0.16) !important;
}

/* Safety Score Card 2-column horizontal layout even on 390px mobile */
html body .df-tds-grid {
  display: grid !important;
  grid-template-columns: 122px minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: center !important;
}

html body .df-tds-left {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 4px !important;
  border-right: 1px solid rgba(157, 78, 221, 0.25) !important;
  border-bottom: none !important;
  padding-right: 10px !important;
  padding-bottom: 0 !important;
}

html body .df-tds-head-row {
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
}

/* 4. Screen 3 — Markets 3 KPI Boxes, 4 Tabs & 3 Filter Pills */
html body .df-markets-kpi-row {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 6px !important;
}

html body .df-mkpi-box.df-mk-box {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 9px 7px !important;
  border-radius: 12px !important;
  background: #151026 !important;
  border: 1px solid rgba(157, 78, 221, 0.3) !important;
  min-width: 0 !important;
}

html body .df-mk-ic {
  width: 26px !important;
  height: 26px !important;
  min-width: 26px !important;
  min-height: 26px !important;
  border-radius: 50% !important;
  font-size: 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}

html body .df-mk-body {
  display: flex !important;
  flex-direction: column !important;
  gap: 1px !important;
  min-width: 0 !important;
}

html body .df-mk-lbl {
  font-size: 9.5px !important;
  color: #9E92BA !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

html body .df-mk-val-row {
  display: flex !important;
  align-items: baseline !important;
  gap: 3px !important;
  flex-wrap: nowrap !important;
}

html body .df-mk-val {
  font-size: 12px !important;
  font-weight: 900 !important;
  color: #FFFFFF !important;
  white-space: nowrap !important;
}

html body .df-mk-chg {
  font-size: 9.5px !important;
  font-weight: 800 !important;
  font-style: normal !important;
  color: #B8FF01 !important;
}

html body .df-markets-tabstrip-v4 {
  padding: 4px !important;
  background: #140E26 !important;
  border: 1px solid rgba(157, 78, 221, 0.3) !important;
  border-radius: 12px !important;
  margin-bottom: 8px !important;
}

html body .df-markets-tabstrip-v4 .df-markets-tabs-v4 {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 4px !important;
  width: 100% !important;
  overflow: visible !important;
}

html body .df-markets-tabstrip-v4 .df-markets-tabs-v4 > button {
  padding: 7px 4px !important;
  min-width: 0 !important;
  min-height: 32px !important;
  height: 32px !important;
  width: 100% !important;
  border-radius: 9px !important;
  font-size: 11.5px !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
  text-align: center !important;
  justify-content: center !important;
  border: none !important;
  background: transparent !important;
  color: #B8AED2 !important;
}

html body .df-markets-tabstrip-v4 .df-markets-tabs-v4 > button.selected {
  background: #B8FF01 !important;
  color: #0B0714 !important;
  box-shadow: 0 0 12px rgba(184, 255, 1, 0.35) !important;
}

html body .df-markets-filter-strip {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin-bottom: 8px !important;
}

html body .df-markets-filter-strip .df-mf-pill {
  padding: 7px 8px !important;
  min-height: 34px !important;
  height: 34px !important;
  border-radius: 10px !important;
  background: #17112B !important;
  border: 1px solid rgba(157, 78, 221, 0.34) !important;
  color: #EAE4FA !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}

html body .df-markets-card-v2 .filter-bar,
html body .df-markets-card-v2 .list-summary,
html body .df-markets-card-v2 .list-rule,
html body .df-markets-card-v2 .list-order-status {
  display: none !important;
}

/* 5. Screen 4 — Launchpad 4-Column Feature Row & Horizontal Cards */
html body .df-lp-feature-strip {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 6px !important;
}

html body .df-lc-r1-left {
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
  min-width: 0 !important;
}

html body .df-lc-sym-main {
  font-size: 15px !important;
  font-weight: 900 !important;
  color: #FFFFFF !important;
  padding: 0 !important;
  min-height: 0 !important;
  background: none !important;
  border: none !important;
}

html body .df-verified-chk {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 15px !important;
  height: 15px !important;
  border-radius: 50% !important;
  background: #B8FF01 !important;
  color: #0B0714 !important;
  font-size: 9.5px !important;
  font-weight: 900 !important;
  flex-shrink: 0 !important;
}

html body .df-lc-sol-stat {
  font-size: 11.5px !important;
  color: #EAE4FA !important;
  white-space: nowrap !important;
}

html body .df-lc-sol-stat em {
  font-style: normal !important;
}

/* 6. Screen 5 — Create Launch Logo Upload Row */
html body .df-proj-details-head {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin-bottom: 4px !important;
}

html body .df-proj-details-head h3 {
  margin: 0 !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  color: #FFFFFF !important;
}

html body .df-logo-upload-row {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 10px 12px !important;
  border-radius: 14px !important;
  background: #110B20 !important;
  border: 1px dashed rgba(184, 255, 1, 0.45) !important;
}

html body .df-logo-mascot-preview {
  width: 58px !important;
  height: 58px !important;
  min-width: 58px !important;
  min-height: 58px !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  border: 1.5px solid #B8FF01 !important;
  flex-shrink: 0 !important;
}

html body .df-logo-mascot-preview img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

html body .df-logo-upload-right {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 4px !important;
}

html body .df-upload-img-btn {
  padding: 6px 12px !important;
  min-height: 0 !important;
  border-radius: 8px !important;
  background: rgba(184, 255, 1, 0.14) !important;
  border: 1px solid #B8FF01 !important;
  color: #B8FF01 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  cursor: pointer !important;
}

/* 7. Screens 6 & 7 — Trading Bot & Strategy Builder */
html body .df-bot-kpis-v4 {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 6px !important;
}

html body .df-bot-kpis-v4 .df-bot-kpi-box {
  padding: 10px 8px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 3px !important;
  min-width: 0 !important;
}

html body .df-bot-kpis-v4 .df-bot-kpi-box strong {
  font-size: 12.5px !important;
  white-space: nowrap !important;
}

html body .df-as-title-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
}

html body .df-as-title-row h2 {
  margin: 0 !important;
  font-size: 1.05rem !important;
  font-weight: 900 !important;
}

html body .df-builder-box-col {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  padding: 10px 12px !important;
  border-radius: 12px !important;
  background: #0E091A !important;
  border: 1px solid rgba(157, 78, 221, 0.24) !important;
}

html body .df-builder-row-inline {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  font-size: 12.5px !important;
}

html body .df-entry-val-pill {
  color: #B8FF01 !important;
  font-weight: 800 !important;
}

html body .df-entry-preset-pill {
  padding: 7px 4px !important;
  min-height: 0 !important;
  border-radius: 8px !important;
  background: #17112B !important;
  border: 1px solid rgba(157, 78, 221, 0.34) !important;
  color: #D7CEEE !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  text-align: center !important;
  cursor: pointer !important;
}

html body .df-entry-preset-pill.active {
  background: rgba(184, 255, 1, 0.18) !important;
  border-color: #B8FF01 !important;
  color: #B8FF01 !important;
}

/* 8. Screen 8 — My Wallet (Profile) */
html body .df-wtc-row-1,
html body .df-wtc-row-2 {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
}

html body .df-wtc-title-col h1 {
  margin: 0 !important;
  font-size: 1.15rem !important;
  font-weight: 900 !important;
  color: #FFFFFF !important;
}

html body .df-addr-pill {
  font-size: 11.5px !important;
  color: #9E92BA !important;
  background: rgba(11, 7, 20, 0.55) !important;
  padding: 3px 8px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(157, 78, 221, 0.25) !important;
}

html body img.df-wh-sol-coin {
  width: 56px !important;
  height: 56px !important;
  border-radius: 14px !important;
  object-fit: cover !important;
  flex-shrink: 0 !important;
}

html body .df-pv-main-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
}

html body .df-pv-main-row strong {
  font-size: 1.55rem !important;
  font-weight: 900 !important;
  color: #FFFFFF !important;
}

/* 9. Screen 9 — Community Calls */
html body .df-call-author {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 10px !important;
}

html body .df-call-author .avatar {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
  border-radius: 50% !important;
}

html body .df-call-author-row {
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
}

html body .df-call-body-v4 {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 4px !important;
}

html body .df-call-body-v4 h3 {
  margin: 0 !important;
  font-size: 13.5px !important;
}

html body .df-call-body-v4 p {
  margin: 0 !important;
  font-size: 11.5px !important;
}

html body .df-social-pill {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  min-height: 0 !important;
  color: #B8AED2 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

/* 10. Screen 10 — Settings Menu Cards */
html body .df-settings-topbar h1 {
  margin: 0 0 8px 0 !important;
  font-size: 1.3rem !important;
  font-weight: 900 !important;
  color: #FFFFFF !important;
}

html body .df-settings-menu-card {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 14px 16px !important;
  border-radius: 16px !important;
  background: #151026 !important;
  border: 1px solid rgba(157, 78, 221, 0.32) !important;
  width: 100% !important;
  text-align: left !important;
}

html body .df-smc-left {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
}

html body .df-smc-text {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 2px !important;
  min-width: 0 !important;
}

html body .df-smc-text strong {
  font-size: 14.5px !important;
  font-weight: 800 !important;
  color: #FFFFFF !important;
}

html body .df-smc-text span {
  font-size: 12px !important;
  color: #9E92BA !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

html body .df-smc-right {
  flex-shrink: 0 !important;
}

html body .df-smc-badge {
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}

/* Single-column full width for Home/Trade and Markets on Desktop & Mobile */
html body .df-dashboard-shell.df-home-only-shell {
  display: block !important;
  grid-template-columns: 1fr !important;
  max-width: 560px !important;
  margin: 0 auto !important;
  width: 100% !important;
}

html body .df-dashboard-shell.df-markets-only-shell {
  display: block !important;
  grid-template-columns: 1fr !important;
  max-width: 1180px !important;
  margin: 0 auto !important;
  width: 100% !important;
}

@media (max-width: 768px) {
  html body .df-mkpi-box.df-mk-box {
    padding: 8px 6px !important;
    gap: 5px !important;
  }

  html body .df-mk-ic {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    min-height: 20px !important;
    font-size: 10px !important;
  }

  html body .df-mk-val {
    font-size: 11px !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }

  html body .df-mk-chg {
    font-size: 9px !important;
  }
}

/* ==========================================================================
   DEXFUN V5 — BULLETPROOF TOKEN ICONS, 9-COLUMN DESKTOP TABLE & DESKTOP HUB
   ========================================================================== */

/* 1. Bulletproof Token Avatar & Image Layering (all views, tables, cards & sidebars) */
html body .avatar {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  flex-shrink: 0 !important;
  background: linear-gradient(135deg, hsl(var(--avatar-hue, 265) 68% 26%), hsl(var(--avatar-hue, 265) 75% 15%)) !important;
  border: 1px solid rgba(184, 255, 1, 0.25) !important;
}

html body .avatar > .avatar-fallback {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-weight: 800 !important;
  font-size: 0.78rem !important;
  color: #B8FF01 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  transition: opacity 0.15s ease !important;
}

html body .avatar.has-img > .avatar-fallback {
  opacity: 0 !important;
}

html body .avatar > img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: inherit !important;
  z-index: 2 !important;
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
}

html body .avatar.img-failed > img {
  display: none !important;
}

/* 2. Responsive Home Hybrid Shell (Mobile Swap vs Desktop Full Dashboard Hub) */
html body .df-dashboard-shell.df-home-hybrid-shell {
  display: block !important;
  width: 100% !important;
  max-width: 1420px !important;
  margin: 0 auto !important;
}

@media (max-width: 1023px) {
  html body .df-mobile-home-trade {
    display: block !important;
    width: 100% !important;
  }
  html body .df-desktop-dashboard-hub {
    display: none !important;
  }
}

@media (min-width: 1024px) {
  html body .df-mobile-home-trade {
    display: none !important;
  }
  html body .df-desktop-dashboard-hub {
    display: flex !important;
    flex-direction: column !important;
    gap: 18px !important;
    width: 100% !important;
  }
  html body .df-dashboard-shell.df-markets-only-shell {
    max-width: 1420px !important;
  }
}

/* 3. Token Subline & Mobile vs Desktop Market Table Columns */
html body #main #tokenrows .token.df-market-row .df-token-subline {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 11px !important;
  color: #8F82AD !important;
  line-height: 1.15 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

@media (max-width: 1023px) {
  html body:has(.discover-tabstrip) #main,
  html body:has(.discover-tabstrip)[data-ui-lounge-open="true"] #main,
  html body:has(.df-dashboard-shell) #main,
  html body #main {
    padding: 12px 12px 84px !important;
  }
  html body #main #tokenrows .token.df-market-row .df-desktop-tname {
    display: none !important;
  }
  html body #main #tokenrows .token.df-market-row .df-mobile-mc {
    display: inline !important;
    font-size: 10.5px !important;
    font-weight: 600 !important;
    color: #8F82AD !important;
  }
  html body:has(.discover-tabstrip) #main .token-table.df-markets-table .columnheads :is(.cell-cap, .cell-liquidity, .cell-holders, .cell-spark),
  html body #main .token-table.df-markets-table .columnheads :is(.cell-cap, .cell-liquidity, .cell-holders, .cell-spark),
  html body:has(.discover-tabstrip) #main #tokenrows .token.df-market-row > :is(.cell-cap, .cell-liquidity, .cell-holders, .cell-spark),
  html body #main #tokenrows .token.df-market-row > :is(.cell-cap, .cell-liquidity, .cell-holders, .cell-spark) {
    display: none !important;
  }
  html body:has(.discover-tabstrip) #main .token-table.df-markets-table .columnheads .cell-safety,
  html body #main .token-table.df-markets-table .columnheads .cell-safety {
    grid-column: 5 !important;
    font-size: 0 !important;
    color: transparent !important;
    visibility: hidden !important;
    justify-content: center !important;
  }
  html body #main #tokenrows .token.df-market-row > .cell-safety {
    display: flex !important;
    order: 5 !important;
    grid-column: 5 !important;
    grid-row: 1 !important;
    align-items: center !important;
    justify-content: flex-end !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  html body #main #tokenrows .token.df-market-row > .cell-safety :is(.df-row-trade-btn, .coverage-button) {
    display: none !important;
  }
  html body #main #tokenrows .token.df-market-row > .cell-safety .row-star {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 14px !important;
    color: #8F82AD !important;
    width: 18px !important;
    height: 18px !important;
  }
  html body #main #tokenrows .token.df-market-row > .cell-safety .row-star[aria-pressed="true"] {
    color: #FFBE0B !important;
  }
  html body #main .token-table.df-markets-table :is(.columnheads, #tokenrows .token.df-market-row),
  html body:has(.discover-tabstrip) #main .token-table.df-markets-table :is(.columnheads, #tokenrows .token.df-market-row) {
    grid-template-columns: minmax(106px, 1.45fr) minmax(62px, 0.85fr) minmax(50px, 0.72fr) minmax(54px, 0.78fr) 18px !important;
    column-gap: 5px !important;
    padding: 6px 8px !important;
  }
}

@media (min-width: 1024px) {
  html body #main #tokenrows .token.df-market-row .df-desktop-tname {
    display: inline !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    color: #8F82AD !important;
  }
  html body #main #tokenrows .token.df-market-row .df-mobile-mc {
    display: none !important;
  }
  html body #main .token-table.df-markets-table :is(.columnheads, #tokenrows .token.df-market-row),
  html body:has(.discover-tabstrip) #main .token-table.df-markets-table :is(.columnheads, #tokenrows .token.df-market-row) {
    display: grid !important;
    grid-template-columns: minmax(168px, 1.55fr) minmax(84px, 0.85fr) minmax(70px, 0.72fr) minmax(86px, 0.88fr) minmax(86px, 0.88fr) minmax(80px, 0.82fr) minmax(64px, 0.68fr) 92px minmax(122px, 1fr) !important;
    column-gap: 10px !important;
    padding: 8px 14px !important;
    align-items: center !important;
  }
  html body #main #tokenrows .token.df-market-row {
    height: 60px !important;
    min-height: 60px !important;
    max-height: 60px !important;
  }
  html body #main .token-table.df-markets-table .columnheads :is(.cell-cap, .cell-liquidity, .cell-holders, .cell-spark, .cell-safety),
  html body #main #tokenrows .token.df-market-row > :is(.cell-cap, .cell-liquidity, .cell-holders, .cell-spark, .cell-safety) {
    display: flex !important;
    grid-row: 1 !important;
    align-self: center !important;
    align-items: center !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  html body #main .token-table.df-markets-table .columnheads .cell-cap,
  html body #main #tokenrows .token.df-market-row > .cell-cap {
    order: 5 !important;
    grid-column: 5 !important;
    justify-content: flex-end !important;
    text-align: right !important;
  }
  html body #main .token-table.df-markets-table .columnheads .cell-liquidity,
  html body #main #tokenrows .token.df-market-row > .cell-liquidity {
    order: 6 !important;
    grid-column: 6 !important;
    justify-content: flex-end !important;
    text-align: right !important;
  }
  html body #main .token-table.df-markets-table .columnheads .cell-holders,
  html body #main #tokenrows .token.df-market-row > .cell-holders {
    order: 7 !important;
    grid-column: 7 !important;
    justify-content: flex-end !important;
    text-align: right !important;
  }
  html body #main .token-table.df-markets-table .columnheads .cell-spark,
  html body #main #tokenrows .token.df-market-row > .cell-spark {
    order: 8 !important;
    grid-column: 8 !important;
    justify-content: center !important;
  }
  html body #main .token-table.df-markets-table .columnheads .cell-safety,
  html body #main #tokenrows .token.df-market-row > .cell-safety {
    order: 9 !important;
    grid-column: 9 !important;
    justify-content: flex-end !important;
    gap: 6px !important;
  }
  html body #main #tokenrows .token.df-market-row > :is(.cell-cap, .cell-liquidity) .money-value,
  html body #main #tokenrows .token.df-market-row > :is(.cell-cap, .cell-liquidity) .money-value span,
  html body #main #tokenrows .token.df-market-row > .cell-liquidity .partial-number,
  html body #main #tokenrows .token.df-market-row > .cell-holders span:not(.mobile-metric-label):not(.held-age) {
    font-size: 12.5px !important;
    font-weight: 700 !important;
    color: #EAE4FA !important;
    white-space: nowrap !important;
  }
  html body #main #tokenrows .token.df-market-row > .cell-spark .df-spark-svg {
    width: 84px !important;
    height: 28px !important;
    display: block !important;
  }
  html body #main #tokenrows .token.df-market-row > .cell-safety .df-row-trade-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 5px 12px !important;
    height: 28px !important;
    min-height: 28px !important;
    border-radius: 999px !important;
    background: #B8FF01 !important;
    color: #0B0714 !important;
    font-size: 11.5px !important;
    font-weight: 800 !important;
    border: 1px solid #B8FF01 !important;
    box-shadow: 0 0 10px rgba(184, 255, 1, 0.28) !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
  }
  html body #main #tokenrows .token.df-market-row > .cell-safety .df-row-trade-btn:hover {
    background: #C9FF3B !important;
    box-shadow: 0 0 14px rgba(184, 255, 1, 0.48) !important;
  }
  html body #main #tokenrows .token.df-market-row > .cell-safety .coverage-button {
    display: inline-flex !important;
    align-items: center !important;
    gap: 3px !important;
    padding: 3px 6px !important;
    border-radius: 8px !important;
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(157, 78, 221, 0.28) !important;
    font-size: 10.5px !important;
    color: #C8BFE0 !important;
    cursor: pointer !important;
  }
  html body #main #tokenrows .token.df-market-row > .cell-safety .coverage-button .finding-label,
  html body #main #tokenrows .token.df-market-row > .cell-safety .coverage-button .finding-more {
    display: none !important;
  }
  html body #main #tokenrows .token.df-market-row > .cell-safety .row-star {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 14px !important;
    color: #8F82AD !important;
    width: 20px !important;
    cursor: pointer !important;
  }
  html body #main #tokenrows .token.df-market-row > .cell-safety .row-star[aria-pressed="true"] {
    color: #FFBE0B !important;
  }
}

/* 4. Desktop Dashboard Hub Layout & Components (>= 1024px) */
html body .df-dd-top-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1.6fr) minmax(320px, 0.85fr) !important;
  gap: 16px !important;
  align-items: stretch !important;
}

html body .df-dd-hero-card {
  position: relative !important;
  background: radial-gradient(circle at 78% 45%, rgba(157, 78, 221, 0.34), rgba(21, 15, 38, 0.96) 68%), linear-gradient(135deg, #191130 0%, #0F0A1E 100%) !important;
  border: 1px solid rgba(157, 78, 221, 0.42) !important;
  border-radius: 20px !important;
  padding: 24px 28px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 20px !important;
  overflow: hidden !important;
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.45) !important;
}

html body .df-dd-hero-copy {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 12px !important;
  max-width: 62% !important;
  z-index: 2 !important;
}

html body .df-dd-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  padding: 5px 12px !important;
  border-radius: 999px !important;
  background: rgba(184, 255, 1, 0.1) !important;
  border: 1px solid rgba(184, 255, 1, 0.35) !important;
  color: #EAE4FA !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
}

html body .df-dd-title {
  margin: 0 !important;
  font-size: 2.15rem !important;
  font-weight: 900 !important;
  line-height: 1.12 !important;
  letter-spacing: -0.02em !important;
  color: #FFFFFF !important;
}

html body .df-dd-sub {
  margin: 0 !important;
  font-size: 13.5px !important;
  line-height: 1.5 !important;
  color: #B8AED2 !important;
}

html body .df-dd-cta-row {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin-top: 2px !important;
}

html body .df-dd-btn-primary {
  padding: 11px 22px !important;
  min-height: 42px !important;
  border-radius: 999px !important;
  background: #B8FF01 !important;
  color: #0B0714 !important;
  border: 1px solid #B8FF01 !important;
  font-size: 13.5px !important;
  font-weight: 900 !important;
  box-shadow: 0 0 20px rgba(184, 255, 1, 0.36) !important;
  cursor: pointer !important;
}

html body .df-dd-btn-secondary {
  padding: 11px 20px !important;
  min-height: 42px !important;
  border-radius: 999px !important;
  background: rgba(157, 78, 221, 0.16) !important;
  color: #FFFFFF !important;
  border: 1px solid rgba(184, 255, 1, 0.35) !important;
  font-size: 13.5px !important;
  font-weight: 800 !important;
  cursor: pointer !important;
}

html body .df-dd-trust-row {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
  margin-top: 4px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #D7CEEE !important;
}

html body .df-dd-trust-row i {
  font-style: normal !important;
  margin-right: 4px !important;
}

html body .df-dd-hero-art {
  flex: 0 0 230px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

html body .df-dd-mascot {
  width: 220px !important;
  height: 190px !important;
  object-fit: cover !important;
  border-radius: 18px !important;
  filter: drop-shadow(0 10px 24px rgba(184, 255, 1, 0.22)) !important;
}

/* Right Top Card: Live on Solana / Live Platform Stats */
html body .df-dd-stats-card {
  background: linear-gradient(160deg, #17112B 0%, #100B1E 100%) !important;
  border: 1px solid rgba(157, 78, 221, 0.38) !important;
  border-radius: 20px !important;
  padding: 18px 20px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  gap: 12px !important;
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.42) !important;
}

html body .df-dd-stats-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding-bottom: 8px !important;
  border-bottom: 1px solid rgba(157, 78, 221, 0.22) !important;
}

html body .df-dd-live-title {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  color: #FFFFFF !important;
}

html body .df-green-dot {
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  background: #B8FF01 !important;
  box-shadow: 0 0 8px #B8FF01 !important;
  display: inline-block !important;
}

html body .df-dd-stat-rows {
  display: flex !important;
  flex-direction: column !important;
  gap: 9px !important;
}

html body .df-dd-stat-item {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  font-size: 12.5px !important;
}

html body .df-dd-stat-lbl {
  color: #9E92BA !important;
  font-weight: 600 !important;
}

html body .df-dd-stat-val {
  display: inline-flex !important;
  align-items: baseline !important;
  gap: 8px !important;
}

html body .df-dd-stat-val strong {
  font-size: 14px !important;
  font-weight: 800 !important;
  color: #FFFFFF !important;
}

html body .df-delta-up {
  font-style: normal !important;
  font-size: 11.5px !important;
  font-weight: 800 !important;
  color: #B8FF01 !important;
}

html body .df-dd-stats-foot {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding-top: 8px !important;
  border-top: 1px solid rgba(157, 78, 221, 0.22) !important;
}

html body .df-dd-safety-pill {
  font-size: 12px !important;
  color: #D7CEEE !important;
}

html body .df-dd-safety-pill b {
  color: #B8FF01 !important;
}

html body .df-dd-stats-link {
  padding: 5px 12px !important;
  min-height: 0 !important;
  border-radius: 999px !important;
  background: rgba(184, 255, 1, 0.14) !important;
  border: 1px solid rgba(184, 255, 1, 0.4) !important;
  color: #B8FF01 !important;
  font-size: 11.5px !important;
  font-weight: 800 !important;
  cursor: pointer !important;
}

/* Middle Row: 5 Feature Quick-Nav Cards */
html body .df-dd-feature-strip {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

html body .df-dd-feat-card {
  background: linear-gradient(155deg, #17112B 0%, #110C20 100%) !important;
  border: 1px solid rgba(157, 78, 221, 0.34) !important;
  border-radius: 16px !important;
  padding: 14px 16px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 6px !important;
  text-align: left !important;
  cursor: pointer !important;
  transition: transform 0.15s ease, border-color 0.15s ease !important;
}

html body .df-dd-feat-card:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(184, 255, 1, 0.55) !important;
}

html body .df-dd-feat-card.df-dd-feat-bot {
  border-color: #B8FF01 !important;
  box-shadow: 0 0 20px rgba(184, 255, 1, 0.18), inset 0 0 16px rgba(184, 255, 1, 0.06) !important;
}

html body .df-dd-feat-top {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
}

html body .df-dd-feat-ic {
  width: 30px !important;
  height: 30px !important;
  border-radius: 9px !important;
  background: rgba(184, 255, 1, 0.14) !important;
  border: 1px solid rgba(184, 255, 1, 0.35) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 15px !important;
  flex-shrink: 0 !important;
}

html body .df-dd-feat-top strong {
  font-size: 14px !important;
  font-weight: 800 !important;
  color: #FFFFFF !important;
}

html body .df-dd-feat-beta {
  padding: 2px 7px !important;
  border-radius: 999px !important;
  background: #B8FF01 !important;
  color: #0B0714 !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
}

html body .df-dd-feat-arr {
  margin-left: auto !important;
  color: #9E92BA !important;
  font-size: 13px !important;
  font-weight: 800 !important;
}

html body .df-dd-feat-card p {
  margin: 0 !important;
  font-size: 11.5px !important;
  line-height: 1.38 !important;
  color: #9E92BA !important;
}

/* Main 2-Column Section: Left Trending Tokens Table + Right 3 Stacked Widgets */
html body .df-dd-main-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 350px !important;
  gap: 16px !important;
  align-items: start !important;
}

html body .df-dd-markets-col {
  background: #140E24 !important;
  border: 1px solid rgba(157, 78, 221, 0.34) !important;
  border-radius: 18px !important;
  padding: 16px !important;
  min-width: 0 !important;
}

html body .df-dd-markets-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-bottom: 12px !important;
  flex-wrap: wrap !important;
}

html body .df-dd-mh-title {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

html body .df-dd-mh-title h2 {
  margin: 0 !important;
  font-size: 1.2rem !important;
  font-weight: 900 !important;
  color: #FFFFFF !important;
}

html body .df-dd-mh-controls {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

html body .df-dd-win-pills {
  display: inline-flex !important;
  background: #0D0818 !important;
  border: 1px solid rgba(157, 78, 221, 0.3) !important;
  border-radius: 10px !important;
  padding: 3px !important;
  gap: 3px !important;
}

html body .df-dd-win-btn {
  padding: 4px 10px !important;
  min-height: 26px !important;
  height: 26px !important;
  border-radius: 7px !important;
  background: transparent !important;
  border: none !important;
  color: #A79BC2 !important;
  font-size: 11.5px !important;
  font-weight: 800 !important;
  cursor: pointer !important;
}

html body .df-dd-win-btn.active {
  background: #B8FF01 !important;
  color: #0B0714 !important;
}

html body .df-dd-filter-btn,
html body .df-dd-chain-btn {
  padding: 5px 12px !important;
  min-height: 32px !important;
  height: 32px !important;
  border-radius: 10px !important;
  background: #1B1330 !important;
  border: 1px solid rgba(157, 78, 221, 0.35) !important;
  color: #EAE4FA !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  cursor: pointer !important;
}

html body .df-desktop-dashboard-hub .df-markets-filter-strip {
  display: none !important;
}

/* Right Side Column: 3 Stacked Live Widgets */
html body .df-dd-side-col {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  min-width: 0 !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
}

html body .df-dd-widget {
  background: linear-gradient(160deg, #161029 0%, #110B1F 100%) !important;
  border: 1px solid rgba(157, 78, 221, 0.34) !important;
  border-radius: 18px !important;
  padding: 14px 16px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

html body .df-dd-whead {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
}

html body .df-dd-wtitle {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  font-size: 13.5px !important;
  font-weight: 800 !important;
  color: #FFFFFF !important;
}

html body .df-dd-live-pill {
  padding: 2px 8px !important;
  border-radius: 999px !important;
  background: rgba(184, 255, 1, 0.14) !important;
  color: #B8FF01 !important;
  font-size: 10.5px !important;
  font-weight: 800 !important;
}

html body .df-dd-wlink {
  padding: 0 !important;
  min-height: 0 !important;
  background: none !important;
  border: none !important;
  color: #B8FF01 !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
}

html body .df-dd-act-list,
html body .df-dd-radar-list,
html body .df-dd-gainers-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}

html body .df-dd-act-row,
html body .df-dd-radar-row,
html body .df-dd-gainer-row {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  width: 100% !important;
  padding: 6px 8px !important;
  border-radius: 10px !important;
  background: rgba(11, 7, 20, 0.5) !important;
  border: 1px solid rgba(157, 78, 221, 0.18) !important;
  color: #EAE4FA !important;
  font-size: 11.5px !important;
  text-align: left !important;
  cursor: pointer !important;
}

html body :is(.df-dd-act-row, .df-dd-gainer-row) .avatar {
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  min-height: 24px !important;
}

html body .df-dd-act-wal {
  color: #8F82AD !important;
  font-size: 11px !important;
}

html body .df-dd-act-tag {
  padding: 1px 6px !important;
  border-radius: 5px !important;
  font-size: 10px !important;
  font-weight: 800 !important;
}

html body .df-act-buy {
  background: rgba(184, 255, 1, 0.16) !important;
  color: #B8FF01 !important;
}

html body .df-act-sell {
  background: rgba(255, 59, 105, 0.18) !important;
  color: #FF3B69 !important;
}

html body .df-act-launch {
  background: rgba(157, 78, 221, 0.25) !important;
  color: #E0AAFF !important;
}

html body .df-dd-act-sym,
html body .df-dd-rad-sym,
html body .df-dd-gain-sym {
  font-weight: 800 !important;
  color: #FFFFFF !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

html body .df-dd-act-amt {
  margin-left: auto !important;
  font-weight: 700 !important;
  color: #EAE4FA !important;
  white-space: nowrap !important;
}

html body .df-dd-act-ago {
  color: #8F82AD !important;
  font-size: 10.5px !important;
}

html body .df-dd-radar-sub {
  padding-top: 8px !important;
  border-top: 1px solid rgba(157, 78, 221, 0.22) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}

html body .df-dd-rad-ic {
  width: 18px !important;
  height: 18px !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  flex-shrink: 0 !important;
}

html body .df-rad-safe {
  background: rgba(184, 255, 1, 0.18) !important;
  color: #B8FF01 !important;
}

html body .df-rad-warn {
  background: rgba(255, 190, 11, 0.2) !important;
  color: #FFBE0B !important;
}

html body .df-dd-rad-txt {
  color: #B8AED2 !important;
  font-size: 11px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

html body .df-dd-rad-arr {
  margin-left: auto !important;
  color: #8F82AD !important;
}

/* Featured Launchpad Widget */
html body .df-dd-lp-featured {
  background: rgba(11, 7, 20, 0.55) !important;
  border: 1px solid rgba(157, 78, 221, 0.26) !important;
  border-radius: 14px !important;
  padding: 12px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

html body .df-dd-lp-top {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

html body .df-dd-lp-top .avatar {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  border-radius: 12px !important;
}

html body .df-dd-lp-meta {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  min-width: 0 !important;
}

html body .df-dd-lp-sym-line {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

html body .df-dd-lp-sym-line strong {
  font-size: 14px !important;
  color: #FFFFFF !important;
}

html body .df-dd-lp-live-tag {
  padding: 1px 7px !important;
  border-radius: 999px !important;
  background: rgba(184, 255, 1, 0.16) !important;
  color: #B8FF01 !important;
  font-size: 10px !important;
  font-weight: 800 !important;
}

html body .df-dd-lp-meta p {
  margin: 0 !important;
  font-size: 11px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

html body .df-dd-lp-badges {
  display: flex !important;
  gap: 6px !important;
  flex-wrap: wrap !important;
}

html body .df-dd-lp-badges span {
  padding: 2px 8px !important;
  border-radius: 6px !important;
  background: rgba(157, 78, 221, 0.18) !important;
  border: 1px solid rgba(157, 78, 221, 0.32) !important;
  color: #D7CEEE !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
}

html body .df-dd-lp-prog-row {
  display: flex !important;
  justify-content: space-between !important;
  font-size: 11.5px !important;
  color: #B8AED2 !important;
}

html body .df-dd-lp-btn {
  width: 100% !important;
  padding: 8px 12px !important;
  min-height: 34px !important;
  border-radius: 10px !important;
  background: rgba(184, 255, 1, 0.14) !important;
  border: 1px solid rgba(184, 255, 1, 0.45) !important;
  color: #B8FF01 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  cursor: pointer !important;
}

/* Top Gainers & Rewards Mini Card */
html body .df-dd-gain-spark .df-spark-svg {
  width: 64px !important;
  height: 22px !important;
  display: block !important;
}

html body .df-dd-gain-pct {
  margin-left: auto !important;
  font-style: normal !important;
  font-weight: 800 !important;
  color: #B8FF01 !important;
  font-size: 12px !important;
}

html body .df-dd-rewards-mini {
  margin-top: 4px !important;
  padding: 12px !important;
  border-radius: 14px !important;
  background: radial-gradient(circle at 85% 50%, rgba(184, 255, 1, 0.2), rgba(24, 16, 44, 0.95) 70%) !important;
  border: 1px solid rgba(184, 255, 1, 0.4) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
}

html body .df-dd-rm-text {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 4px !important;
}

html body .df-dd-rm-text strong {
  font-size: 13.5px !important;
  color: #FFFFFF !important;
}

html body .df-dd-rm-text p {
  margin: 0 !important;
  font-size: 11px !important;
  color: #C8BFE0 !important;
  line-height: 1.35 !important;
}

html body .df-dd-rm-btn {
  margin-top: 2px !important;
  padding: 5px 12px !important;
  min-height: 28px !important;
  border-radius: 999px !important;
  background: #B8FF01 !important;
  color: #0B0714 !important;
  border: none !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}

html body .df-dd-rm-art {
  width: 68px !important;
  height: auto !important;
  border-radius: 0 !important;
  object-fit: contain !important;
  flex-shrink: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* ==========================================================================
   DEXFUN V6 — ULTRA-HQ LIVE INTERACTIVE 3D MASCOT & 1-ON-1 VISUAL POLISH
   ========================================================================== */

/* 1. Crisp Neon SVG Vector Icons (.df-svg-ic) */
html body .df-svg-ic {
  width: 1.08em !important;
  height: 1.08em !important;
  vertical-align: -0.16em !important;
  flex-shrink: 0 !important;
  display: inline-block !important;
  stroke: currentColor !important;
}

html body .df-ic-lime,
html body .df-fire-ic {
  color: #B8FF01 !important;
  display: inline-flex !important;
  align-items: center !important;
}

html body .df-ic-purple {
  color: #C77DFF !important;
  display: inline-flex !important;
  align-items: center !important;
}

html body header .wallet {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
}

html body header .wallet .df-svg-ic {
  width: 16px !important;
  height: 16px !important;
  stroke-width: 2.2 !important;
}

html body .df-dd-btn-primary,
html body .df-dd-btn-secondary,
html body .df-btn-lime,
html body .df-btn-ghost {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
}

/* 40x40px Neon Feature Icon Boxes on Desktop 5-Feature Strip */
html body .df-dd-feat-ic {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
  border-radius: 11px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 18px !important;
  flex-shrink: 0 !important;
}

html body .df-dd-feat-ic.df-feat-ic-lime {
  background: rgba(184, 255, 1, 0.14) !important;
  border: 1px solid rgba(184, 255, 1, 0.42) !important;
  color: #B8FF01 !important;
  box-shadow: 0 0 14px rgba(184, 255, 1, 0.16) !important;
}

html body .df-dd-feat-ic.df-feat-ic-purple {
  background: rgba(157, 78, 221, 0.2) !important;
  border: 1px solid rgba(199, 125, 255, 0.45) !important;
  color: #E0AAFF !important;
  box-shadow: 0 0 14px rgba(157, 78, 221, 0.22) !important;
}

/* 2. Ultra-HQ Freestanding Interactive 3D Mascot (No Square Frame, Live Canvas & 3D Tilt) */
@keyframes dfMascotFloat {
  0%, 100% {
    transform: translate3d(0, 0px, 0) scale(1);
  }
  50% {
    transform: translate3d(0, -7px, 0) scale(1.018);
  }
}

html body .df-dd-hero-card,
html body .df-hero-banner-v2 {
  overflow: visible !important;
}

html body .df-dd-hero-art,
html body .df-hb-art {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  overflow: visible !important;
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

html body .df-dd-hero-art {
  flex: 0 0 370px !important;
  min-height: 220px !important;
  margin: -14px -10px -14px 0 !important;
}

html body .df-live-mascot {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: grab !important;
  user-select: none !important;
  -webkit-user-select: none !important;
  touch-action: manipulation !important;
  perspective: 800px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

html body .df-live-mascot:active {
  cursor: grabbing !important;
}

html body .df-live-mascot.df-mascot-lg {
  width: 380px !important;
  max-width: 100% !important;
}

html body .df-live-mascot.df-mascot-md {
  width: 240px !important;
  max-width: 100% !important;
}

html body .df-live-mascot.df-mascot-sm {
  width: 210px !important;
  max-width: 100% !important;
}

html body .df-live-mascot canvas.df-mascot-fx {
  position: absolute !important;
  inset: -16% -12% !important;
  width: 124% !important;
  height: 132% !important;
  pointer-events: none !important;
  z-index: 3 !important;
  background: transparent !important;
  border: 0 !important;
}

html body .df-live-mascot .df-mascot-rig {
  position: relative !important;
  z-index: 2 !important;
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transform-style: preserve-3d !important;
  will-change: transform !important;
  animation: dfMascotFloat 3.8s ease-in-out infinite !important;
  background: transparent !important;
  border: 0 !important;
}

html body .df-live-mascot.is-interacting .df-mascot-rig {
  animation-play-state: paused !important;
}

html body .df-dd-mascot,
html body .df-hb-mascot,
html body .df-mascot-img {
  width: 100% !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  filter: drop-shadow(0 18px 34px rgba(157, 78, 221, 0.45)) drop-shadow(0 0 22px rgba(184, 255, 1, 0.22)) !important;
  pointer-events: none !important;
  display: block !important;
}

@media (max-width: 1023px) {
  html body .df-live-mascot.df-mascot-sm,
  html body .df-live-mascot.df-mascot-md,
  html body .df-live-mascot.df-mascot-lg {
    width: 148px !important;
  }
  html body .df-hb-art {
    flex: 0 0 142px !important;
    margin: -8px -6px -8px 0 !important;
  }
}

/* 3. Desktop Home Trending Tokens Single Header Row & Clean Action Column */
html body .df-dd-mh-left {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  flex-wrap: wrap !important;
}

html body .df-dd-list-pills {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  background: #0D0818 !important;
  border: 1px solid rgba(157, 78, 221, 0.32) !important;
  border-radius: 999px !important;
  padding: 3px !important;
}

html body .df-dd-list-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  padding: 5px 13px !important;
  min-height: 28px !important;
  height: 28px !important;
  border-radius: 999px !important;
  background: transparent !important;
  border: none !important;
  color: #A79BC2 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  cursor: pointer !important;
  transition: background 0.15s ease, color 0.15s ease !important;
}

html body .df-dd-list-pill.active {
  background: #B8FF01 !important;
  color: #0B0714 !important;
  box-shadow: 0 0 12px rgba(184, 255, 1, 0.35) !important;
}

@media (min-width: 1024px) {
  html body .df-dd-markets-head {
    flex-wrap: nowrap !important;
    justify-content: space-between !important;
    gap: 10px !important;
  }
  html body .df-dd-markets-col :is(.discover-tabstrip, .df-markets-filter-strip) {
    display: none !important;
  }
  html body #main #tokenrows .token.df-market-row > .cell-safety .coverage-button {
    display: none !important;
  }
  html body #ticker {
    display: none !important;
  }
  html body .df-col-vol-mob {
    display: none !important;
  }
  html body .df-col-vol-desk {
    display: inline !important;
  }
}

/* 4. Mobile Markets (390px) Zero Overlap & Clean 5-Column Alignment */
@media (max-width: 1023px) {
  html body .df-col-vol-desk {
    display: none !important;
  }
  html body .df-col-vol-mob {
    display: inline !important;
  }

  html body .df-markets-kpi-row {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }
  html body .df-mkpi-box.df-mk-box {
    padding: 7px 6px !important;
    gap: 5px !important;
    align-items: center !important;
    overflow: hidden !important;
  }
  html body .df-mk-ic {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    min-height: 18px !important;
    font-size: 10px !important;
    border-radius: 5px !important;
  }
  html body .df-mk-body {
    overflow: visible !important;
    min-width: 0 !important;
  }
  html body .df-mk-lbl {
    font-size: 9px !important;
    white-space: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }
  html body .df-mk-val-row {
    gap: 3px !important;
    flex-wrap: nowrap !important;
  }
  html body .df-mk-val {
    font-size: 10.5px !important;
    white-space: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }
  html body .df-mk-chg {
    font-size: 8px !important;
    padding: 1px 2px !important;
  }

  html body #main .token-table.df-markets-table :is(.columnheads, #tokenrows .token.df-market-row),
  html body:has(.discover-tabstrip) #main .token-table.df-markets-table :is(.columnheads, #tokenrows .token.df-market-row),
  html body #main .df-markets-card-v2 .token-table :is(.columnheads, #tokenrows .token[data-row-mint]) {
    grid-template-columns: minmax(94px, 1.15fr) minmax(78px, 1fr) minmax(56px, 0.76fr) minmax(52px, 0.7fr) 20px !important;
    column-gap: 4px !important;
    padding: 7px 6px !important;
  }

  html body #main .token-table.df-markets-table .columnheads [role="columnheader"][data-col="safety"],
  html body:has(.discover-tabstrip) #main .token-table.df-markets-table .columnheads [role="columnheader"][data-col="safety"] {
    grid-column: 5 !important;
    width: 20px !important;
    font-size: 0 !important;
    color: transparent !important;
    visibility: hidden !important;
  }

  html body #main #tokenrows .token.df-market-row .cell-token .name {
    max-width: 58px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: 12px !important;
  }

  html body #main #tokenrows .token.df-market-row > .cell-price :is(.money-value, .money-value span) {
    font-size: 11px !important;
    white-space: nowrap !important;
  }

  html body #main #tokenrows .token.df-market-row > .cell-change,
  html body #main #tokenrows .token.df-market-row > .cell-change .change-value {
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
    text-align: right !important;
    justify-content: flex-end !important;
    font-size: 11px !important;
  }

  html body #main #tokenrows .token.df-market-row > .cell-volume :is(.window-volume, .window-volume span, .money-value, .money-value span) {
    font-size: 11px !important;
    white-space: nowrap !important;
  }

  html body #main #tokenrows .token.df-market-row > .cell-safety {
    grid-column: 5 !important;
    width: 20px !important;
    justify-content: flex-end !important;
  }
}

/* 5. Screen 2 (Token Detail): Hide Legacy Text Above Chart & Compact Chart Height */
html body #main .df-td-screen .token-chart :is(.lwc-legend, .lwc-meta, .chart-rejection, .gap-display-note, .lwc-carry-note, .held-age, .held-note, .ohlc, .chart-history, .note),
html body .df-td-screen :is(.lwc-legend, .lwc-meta, .chart-rejection, .gap-display-note, .lwc-carry-note, .held-age, .held-note, .ohlc, .chart-history, .token-chart > .note) {
  display: none !important;
  height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body #main .df-td-screen .token-chart,
html body #main .df-td-screen .lwc-wrap {
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  gap: 0 !important;
}

@media (max-width: 1023px) {
  html body #main .df-td-screen .token-chart,
  html body #main .df-td-screen .lwc-wrap,
  html body #main .df-td-screen .lwc-stage,
  html body #main .df-td-screen [data-lwc-host],
  html body #main .df-td-screen .candlechart svg {
    height: 195px !important;
    min-height: 195px !important;
    max-height: 195px !important;
  }
}

@media (min-width: 1024px) {
  html body #main .df-td-screen .token-chart,
  html body #main .df-td-screen .lwc-wrap,
  html body #main .df-td-screen .lwc-stage,
  html body #main .df-td-screen [data-lwc-host],
  html body #main .df-td-screen .candlechart svg {
    height: 280px !important;
    min-height: 280px !important;
    max-height: 280px !important;
  }
}

/* ==========================================================================
   DEXFUN V7 — ULTRA-HQ TOP-LEFT BRAND LOGO, MOBILE ZERO-CLIPPING & SUB-TABS
   ========================================================================== */

/* 1. Top-Left Brand Logo: Frameless Ultra-HQ 256x256 RGBA Mascot Badge */
html body header .brand {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  text-decoration: none !important;
  padding: 2px 0 !important;
}

html body header .brand img {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
  object-fit: contain !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  filter: drop-shadow(0 2px 10px rgba(184, 255, 1, 0.45)) !important;
  transition: transform 0.2s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

html body header .brand:hover img {
  transform: scale(1.08) rotate(-4deg) !important;
}

/* 2. Mobile (390px) Zero-Clipping & Zero Horizontal Overflow Fixes */
@media (max-width: 760px) {
  /* Wider Token column on Mobile Markets so $SYMBOL and Market Cap ($57.8K) never clip */
  html body #main .token-table.df-markets-table :is(.columnheads, #tokenrows .token.df-market-row),
  html body:has(.discover-tabstrip) #main .token-table.df-markets-table :is(.columnheads, #tokenrows .token.df-market-row),
  html body #main .df-markets-card-v2 .token-table :is(.columnheads, #tokenrows .token[data-row-mint]) {
    grid-template-columns: minmax(118px, 1.45fr) minmax(68px, 0.85fr) minmax(52px, 0.65fr) minmax(52px, 0.68fr) 20px !important;
    column-gap: 4px !important;
    padding: 7px 6px !important;
  }

  html body #main #tokenrows .token.df-market-row .cell-token .name,
  html body #main #tokenrows .token.df-market-row .cell-token .df-mobile-mc {
    max-width: 86px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  /* Mobile Markets 3 KPI Cards: compact icon & full text visibility (+18.6%, New Launches) */
  html body .df-markets-kpi-row {
    gap: 5px !important;
  }
  html body .df-mkpi-box.df-mk-box {
    padding: 7px 5px !important;
    gap: 4px !important;
    overflow: visible !important;
  }
  html body .df-mk-ic {
    display: none !important;
  }
  html body .df-mk-lbl {
    font-size: 9px !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }
  html body .df-mk-val {
    font-size: 10.5px !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }

  /* Mobile Token Detail: Eliminate Horizontal Overflow (scrollWidth <= clientWidth) */
  html body #main .df-td-screen,
  html body #main .df-td-container,
  html body #main .df-td-screen .token-chart {
    max-width: 100% !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
  }
  html body #main .df-td-tf-bar {
    max-width: 100% !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
    flex-wrap: nowrap !important;
    gap: 4px !important;
    padding: 6px 8px !important;
    box-sizing: border-box !important;
  }
  html body #main .df-td-tf-bar::-webkit-scrollbar {
    display: none !important;
  }
  html body #main .df-tf-btn {
    padding: 4px 7px !important;
    font-size: 11px !important;
    flex: 0 0 auto !important;
  }

  /* Mobile Launchpad 4-feature strip & card bottom row */
  html body .df-lp-feature-strip {
    gap: 5px !important;
  }
  html body .df-lpf-item {
    font-size: 10px !important;
    letter-spacing: -0.02em !important;
    padding: 6px 4px !important;
    gap: 4px !important;
  }
  html body .df-lc-row-3 {
    flex-wrap: wrap !important;
    gap: 6px !important;
  }
}

/* 3. Interactive Sub-Tab Panels, Swap Token Picker & Expandable Settings Cards */
.df-swap-picker-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(157, 78, 221, 0.25);
  max-height: 210px;
  overflow-y: auto;
}

.df-swap-picker-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 9px;
  border-radius: 10px;
  background: rgba(18, 12, 34, 0.85);
  border: 1px solid rgba(157, 78, 221, 0.28);
  color: #FFFFFF;
  cursor: pointer;
  text-align: left;
  min-width: 0;
}

.df-swap-picker-item:hover,
.df-swap-picker-item.active {
  border-color: #B8FF01;
  background: rgba(184, 255, 1, 0.1);
}

.df-swap-picker-item .avatar {
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  min-height: 24px !important;
}

.df-swap-picker-item strong {
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.df-swap-picker-item .quiet {
  margin-left: auto;
  font-size: 10px;
}

.df-settings-item-wrap {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.df-settings-menu-card.active {
  border-color: rgba(184, 255, 1, 0.55) !important;
  box-shadow: 0 0 18px rgba(184, 255, 1, 0.14) !important;
}

.df-settings-expand-panel {
  margin-top: 2px;
  margin-bottom: 6px;
  padding: 12px 14px !important;
  background: rgba(20, 14, 38, 0.92) !important;
  border: 1px solid rgba(184, 255, 1, 0.35) !important;
  border-radius: 14px !important;
}

.df-lpd-tab-card,
.df-lpd-participate-box {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* =========================================================================
   DEXFUN V8 — "DEXY" LIVING 3D MASCOT ENGINE (60FPS LIVE2D-STYLE HYBRID RIG)
   ========================================================================= */

.df-living-pet {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  user-select: none !important;
  max-width: 100% !important;
}

.df-pet-stage {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 365px;
  max-width: 100%;
  position: relative;
  z-index: 2;
}

.df-living-pet canvas.df-pet-canvas {
  position: relative !important;
  inset: auto !important;
  width: 348px !important;
  height: 194px !important;
  max-width: 100% !important;
  display: block !important;
  cursor: grab !important;
  pointer-events: auto !important;
  z-index: 2 !important;
  filter: drop-shadow(0 12px 26px rgba(157, 78, 221, 0.38));
}

.df-living-pet canvas.df-pet-canvas:active {
  cursor: grabbing !important;
}

.df-pet-bubble {
  width: 100%;
  max-width: 352px;
  padding: 6px 10px;
  border-radius: 12px;
  border: 1px solid rgba(184, 255, 1, 0.42);
  background: rgba(16, 7, 34, 0.92);
  backdrop-filter: blur(8px);
  font-size: 11px;
  line-height: 1.32;
  margin-top: -10px;
  z-index: 4;
  display: flex;
  flex-direction: column;
  gap: 2px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.45);
  transition: transform 0.18s ease, border-color 0.18s ease;
}

@keyframes dfPetBubblePop {
  0% { transform: scale(0.95); }
  55% { transform: scale(1.03); border-color: #B8FF01; }
  100% { transform: scale(1); }
}

.df-pet-bubble.is-pop {
  animation: dfPetBubblePop 0.28s cubic-bezier(0.22, 1.3, 0.36, 1);
}

.df-pet-bubble-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  font-weight: 800;
  color: #B8FF01;
}

.df-pet-bubble-tag {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.df-pet-vitals {
  color: #C4B5FD;
  font-weight: 700;
  font-size: 9.5px;
  white-space: nowrap;
  flex-shrink: 0;
}

.df-pet-bubble-text {
  color: #F3E8FF;
  font-size: 10.5px;
  font-weight: 500;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.df-pet-hud {
  display: flex;
  gap: 5px;
  margin-top: 6px;
  z-index: 4;
  flex-wrap: wrap;
  justify-content: center;
}

.df-pet-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 9px;
  font-size: 10.5px;
  font-weight: 700;
  border-radius: 99px;
  background: rgba(24, 14, 46, 0.9);
  border: 1px solid rgba(184, 255, 1, 0.36);
  color: #FFFFFF;
  cursor: pointer;
  transition: transform 0.14s ease, border-color 0.14s ease, background 0.14s ease;
}

.df-pet-btn:hover {
  transform: translateY(-1px);
  border-color: #B8FF01;
  background: rgba(184, 255, 1, 0.16);
  color: #B8FF01;
}

/* Compact Hero Banner variant (Trade & Markets hero) on Desktop */
.df-hb-art .df-pet-stage {
  width: 265px;
}

.df-hb-art .df-living-pet canvas.df-pet-canvas {
  width: 245px !important;
  height: 136px !important;
}

.df-hb-art .df-pet-bubble {
  max-width: 260px;
}

/* Mobile (< 768px) compact living mascot inside hero banner */
@media (max-width: 767px) {
  html body .df-hb-art,
  html body .df-hb-art .df-living-pet,
  html body .df-living-pet,
  html body .df-hb-art .df-living-pet .df-pet-stage,
  html body .df-living-pet .df-pet-stage {
    width: 146px !important;
    max-width: 146px !important;
  }
  html body .df-hb-art .df-living-pet canvas.df-pet-canvas,
  html body .df-living-pet canvas.df-pet-canvas {
    width: 146px !important;
    height: 81px !important;
    aspect-ratio: 1186 / 660 !important;
  }
  html body .df-hb-art .df-living-pet .df-pet-hud,
  html body .df-living-pet .df-pet-hud {
    display: none !important;
  }
  html body .df-hb-art .df-living-pet .df-pet-bubble,
  html body .df-living-pet .df-pet-bubble {
    max-width: 146px !important;
    padding: 2px 6px !important;
    margin-top: -4px !important;
    border-radius: 8px !important;
  }
  html body .df-hb-art .df-living-pet .df-pet-bubble-top,
  html body .df-living-pet .df-pet-bubble-top {
    font-size: 8px !important;
    justify-content: center !important;
  }
  html body .df-hb-art .df-living-pet .df-pet-vitals,
  html body .df-living-pet .df-pet-vitals,
  html body .df-hb-art .df-living-pet .df-pet-bubble-text,
  html body .df-living-pet .df-pet-bubble-text {
    display: none !important;
  }
}

/* =========================================================================
   DEXFUN V9 — 9-ROW ALL-IN-ONE MOBILE HOME DASHBOARD (390x844 1-TO-1)
   ========================================================================= */

/* Hide mobile-only elements on Desktop (>= 1024px) */
@media (min-width: 1024px) {
  html body .df-mh-top-stack,
  html body header .brand .brand-online,
  html body #tokenrows .df-mob-crown,
  html body #tokenrows .df-mob-age {
    display: none !important;
  }
}

/* Global prevention of Chrome mobile text autosizer (font boosting) and hide stray grey age dots / sourcechip */
html, body, body * {
  -webkit-text-size-adjust: 100% !important;
  text-size-adjust: 100% !important;
}

html body #main .token-table #tokenrows :is(.held-age, [data-age-marker], .list-price-status, [data-price-age]),
html body #main #tokenrows :is(.held-age, [data-age-marker], .list-price-status, [data-price-age]),
html body .sourcechip {
  display: none !important;
}

/* Default hide crown & mob-age except where activated on mobile */
html body #tokenrows .df-mob-crown,
html body #tokenrows .df-mob-age {
  display: none;
}

@media (max-width: 1023px) {
  /* Show Desktop Dashboard Hub container on Mobile Home (it holds .df-mh-top-stack + #tokenrows) */
  html body #main:not(#never):not(#never2) .df-home-hybrid-shell,
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100vw !important;
    overflow-x: hidden !important;
  }

  /* Hide desktop-only hero/features/sidebar/table-header on Mobile (< 1024px) */
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub > .df-dd-top-grid,
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub > .df-dd-feature-strip,
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub .df-dd-markets-head,
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub .df-dd-side-col {
    display: none !important;
  }

  /* Remove extra padding/borders around #main and .df-dd-markets-col on Mobile Home */
  html body:has(.df-desktop-dashboard-hub) #main:not(#never):not(#never2) {
    padding: 0 0 76px 0 !important;
    margin: 0 !important;
  }

  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub .df-dd-main-grid,
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub .df-dd-markets-col.df-markets-card-v2,
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub .token-table.df-markets-table {
    display: flex !important;
    flex-direction: column !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: 0 !important;
  }

  /* Hide legacy controls & columnheads inside .df-desktop-dashboard-hub on Mobile so Row 8 sits directly under Row 7 */
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub .df-dd-markets-col > .discover-tabstrip,
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub .df-dd-markets-col > .df-markets-filter-strip,
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub .df-dd-markets-col > .filter-bar,
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub .df-dd-markets-col > .list-summary,
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub .df-dd-markets-col > .focus-card,
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub .df-dd-markets-col > .list-rule,
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub .df-dd-markets-col .columnheads,
  html body:has(.discover-tabstrip) #main:not(#never):not(#never2) .df-desktop-dashboard-hub .token-table.df-markets-table .columnheads {
    display: none !important;
  }

  /* =======================================================================
     RIJ 1: Top Header (height: 48px, 34x34 logo + dexfun.online + Search + Bell + Connect Wallet)
     ======================================================================= */
  html body header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    padding: 6px 12px !important;
    background: rgba(11, 6, 22, 0.96) !important;
    border-bottom: none !important;
    gap: 8px !important;
  }

  html body header > #df-topnav,
  html body header > nav.df-topnav {
    display: none !important;
  }

  html body header > a.brand {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 0 !important;
    min-width: 0 !important;
  }

  html body header > a.brand img {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    min-height: 34px !important;
  }

  html body header > a.brand .brand-name,
  html body header > a.brand .brand-dex,
  html body header > a.brand .brand-fun,
  html body header > a.brand .brand-online {
    font-style: normal !important;
    font-size: 19px !important;
    font-weight: 800 !important;
    color: #b8ff01 !important;
    text-transform: lowercase !important;
    letter-spacing: -0.03em !important;
    line-height: 1 !important;
    display: inline !important;
  }

  html body header > .df-header-right {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    margin-left: auto !important;
  }

  html body header .df-icon-circle {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    min-height: 34px !important;
    border-radius: 50% !important;
    background: rgba(24, 14, 44, 0.92) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
  }

  html body header .wallet,
  html body header .wallet.connect-wallet {
    height: 34px !important;
    min-height: 34px !important;
    max-height: 34px !important;
    padding: 0 11px !important;
    font-size: 11.5px !important;
    font-weight: 800 !important;
    border-radius: 999px !important;
    background: #b8ff01 !important;
    color: #090d16 !important;
    border: none !important;
    box-shadow: 0 0 16px rgba(184, 255, 1, 0.4) !important;
    gap: 5px !important;
  }

  html body header .wallet span,
  html body header .wallet.connect-wallet span {
    font-size: 11.5px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    color: #090d16 !important;
  }

  /* =======================================================================
     RIJ 2: Horizontale Top-Subnavigatie Pill-Balk (height: 38px, 5 items)
     ======================================================================= */
  html body #main:not(#never):not(#never2) .df-mh-top-stack {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  html body #main:not(#never):not(#never2) .df-mob-subnav-pills {
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
    margin: 4px 12px !important;
    padding: 3px 4px !important;
    border-radius: 999px !important;
    background: rgba(19, 11, 36, 0.92) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 2px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  html body #main:not(#never):not(#never2) .df-ms-pill {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 3px !important;
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    padding: 0 7px !important;
    border-radius: 999px !important;
    border: none !important;
    background: transparent !important;
    color: #e2e8f0 !important;
    font-size: 10.5px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    position: relative !important;
  }

  html body #main:not(#never):not(#never2) .df-ms-pill span {
    font-size: 10.5px !important;
    font-weight: inherit !important;
    line-height: 1 !important;
    color: inherit !important;
  }

  html body #main:not(#never):not(#never2) .df-ms-pill .df-svg-ic {
    width: 11px !important;
    height: 11px !important;
    color: #b8ff01 !important;
    flex-shrink: 0 !important;
  }

  html body #main:not(#never):not(#never2) .df-ms-pill.active {
    background: linear-gradient(180deg, rgba(184, 255, 1, 0.14), rgba(184, 255, 1, 0.25)) !important;
    color: #ffffff !important;
    font-weight: 800 !important;
    box-shadow: inset 0 -2px 0 #b8ff01, 0 2px 10px rgba(184, 255, 1, 0.22) !important;
  }

  html body #main:not(#never):not(#never2) .df-ms-badge {
    width: 14px !important;
    height: 14px !important;
    border-radius: 50% !important;
    background: #9333ea !important;
    color: #ffffff !important;
    font-size: 8.5px !important;
    font-weight: 800 !important;
    font-style: normal !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
  }

  /* =======================================================================
     RIJ 3: Compacte Mobile Hero Card (height: 154px, Launch. Trade. / Earn. Play. + Grote 3D Gekroonde Mascotte)
     ======================================================================= */
  html body #main:not(#never):not(#never2) .df-mob-hero-card {
    height: 154px !important;
    min-height: 154px !important;
    max-height: 154px !important;
    margin: 5px 12px !important;
    padding: 12px 12px !important;
    border-radius: 18px !important;
    background:
      radial-gradient(circle at 78% 45%, rgba(168, 85, 247, 0.36), rgba(24, 12, 48, 0.96) 68%),
      linear-gradient(135deg, #1d0f3a 0%, #100722 100%) !important;
    border: 1px solid rgba(192, 132, 252, 0.28) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    position: relative !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  html body #main:not(#never):not(#never2) .df-mh-copy {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    z-index: 3 !important;
    width: 210px !important;
    max-width: 210px !important;
    flex-shrink: 0 !important;
  }

  html body #main:not(#never):not(#never2) .df-mh-title {
    margin: 0 !important;
    font-size: 20px !important;
    line-height: 1.06 !important;
    font-weight: 900 !important;
    letter-spacing: -0.02em !important;
    display: flex !important;
    flex-direction: column !important;
  }

  html body #main:not(#never):not(#never2) .df-mh-white {
    color: #ffffff !important;
  }

  html body #main:not(#never):not(#never2) .df-mh-lime {
    color: #b8ff01 !important;
    text-shadow: 0 0 14px rgba(184, 255, 1, 0.35) !important;
  }

  html body #main:not(#never):not(#never2) .df-mh-sub {
    margin: 5px 0 9px !important;
    font-size: 10px !important;
    line-height: 1.25 !important;
    color: rgba(226, 232, 240, 0.85) !important;
    max-width: 185px !important;
  }

  html body #main:not(#never):not(#never2) .df-mh-btns {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    flex-wrap: nowrap !important;
  }

  html body #main:not(#never):not(#never2) .df-mh-btn-launch {
    height: 28px !important;
    min-height: 28px !important;
    max-height: 28px !important;
    padding: 0 10px !important;
    border-radius: 999px !important;
    border: none !important;
    background: #b8ff01 !important;
    color: #090d16 !important;
    font-size: 10.5px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    box-shadow: 0 0 14px rgba(184, 255, 1, 0.4) !important;
  }

  html body #main:not(#never):not(#never2) .df-mh-btn-launch span {
    font-size: 10.5px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    color: #090d16 !important;
  }

  html body #main:not(#never):not(#never2) .df-mh-btn-launch .df-svg-ic,
  html body #main:not(#never):not(#never2) .df-mh-btn-how .df-svg-ic {
    width: 11px !important;
    height: 11px !important;
    flex-shrink: 0 !important;
  }

  html body #main:not(#never):not(#never2) .df-mh-btn-how {
    height: 28px !important;
    min-height: 28px !important;
    max-height: 28px !important;
    padding: 0 10px !important;
    border-radius: 999px !important;
    background: rgba(18, 10, 36, 0.78) !important;
    border: 1px solid rgba(255, 255, 255, 0.22) !important;
    color: #ffffff !important;
    font-size: 10.5px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
  }

  html body #main:not(#never):not(#never2) .df-mh-btn-how span {
    font-size: 10.5px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    color: #ffffff !important;
  }

  /* Large Living 3D Crowned Mascot in Right Column of Mobile Hero Card */
  html body #main:not(#never):not(#never2) .df-mh-art {
    position: absolute !important;
    right: -2px !important;
    top: 8px !important;
    width: 168px !important;
    max-width: 168px !important;
    height: 138px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    z-index: 2 !important;
  }

  html body #main:not(#never):not(#never2) .df-mh-art .df-living-pet,
  html body #main:not(#never):not(#never2) .df-mh-art .df-living-pet .df-pet-stage {
    width: 168px !important;
    max-width: 168px !important;
    height: 138px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    position: relative !important;
  }

  html body #main:not(#never):not(#never2) .df-mh-art .df-living-pet canvas.df-pet-canvas {
    width: 166px !important;
    height: 136px !important;
    max-width: none !important;
    object-fit: contain !important;
  }

  html body #main:not(#never):not(#never2) .df-mh-art .df-living-pet .df-pet-hud {
    display: none !important;
  }

  html body #main:not(#never):not(#never2) .df-mh-art .df-living-pet .df-pet-bubble {
    position: absolute !important;
    bottom: 2px !important;
    right: 6px !important;
    width: auto !important;
    max-width: 154px !important;
    padding: 3px 7px !important;
    border-radius: 8px !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: opacity 0.22s ease !important;
  }

  html body #main:not(#never):not(#never2) .df-mh-art .df-living-pet .df-pet-bubble.is-pop {
    opacity: 1 !important;
  }

  html body #main:not(#never):not(#never2) .df-mh-art .df-living-pet .df-pet-bubble-text {
    display: block !important;
    font-size: 9px !important;
    -webkit-line-clamp: 1 !important;
  }

  /* =======================================================================
     RIJ 4: Slanke 1-Regel Live Ticker Strip (height: 30px)
     ======================================================================= */
  html body #main:not(#never):not(#never2) .df-mob-ticker-strip {
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    margin: 4px 12px !important;
    padding: 0 9px !important;
    border-radius: 10px !important;
    background: rgba(18, 10, 34, 0.92) !important;
    border: 1px solid rgba(255, 255, 255, 0.07) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    font-size: 9.5px !important;
    line-height: 1 !important;
    color: #cbd5e1 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  html body #main:not(#never):not(#never2) .df-mts-item {
    display: inline-flex !important;
    align-items: center !important;
    gap: 2.5px !important;
    font-size: 9.5px !important;
  }

  html body #main:not(#never):not(#never2) .df-mts-item b {
    color: #ffffff !important;
    font-weight: 800 !important;
    font-size: 9.5px !important;
  }

  html body #main:not(#never):not(#never2) .df-mts-gold {
    color: #facc15 !important;
    font-weight: 800 !important;
    font-size: 9.5px !important;
  }

  html body #main:not(#never):not(#never2) .df-mts-green {
    color: #4ade80 !important;
    font-style: normal !important;
    font-weight: 700 !important;
    font-size: 9.5px !important;
  }

  html body #main:not(#never):not(#never2) .df-mts-lbl {
    color: #94a3b8 !important;
    font-size: 9.5px !important;
  }

  html body #main:not(#never):not(#never2) .df-mts-sep {
    color: rgba(255, 255, 255, 0.16) !important;
    font-size: 9.5px !important;
  }

  /* =======================================================================
     RIJ 5: De 4 Compacte Feature Kaarten op 1 Rij (height: 72px)
     ======================================================================= */
  html body #main:not(#never):not(#never2) .df-mob-feat-row4 {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 6px !important;
    margin: 5px 12px !important;
    height: 72px !important;
    min-height: 72px !important;
    max-height: 72px !important;
    box-sizing: border-box !important;
  }

  html body #main:not(#never):not(#never2) .df-mf-card4 {
    height: 72px !important;
    min-height: 72px !important;
    max-height: 72px !important;
    padding: 6px 3px !important;
    border-radius: 14px !important;
    background: linear-gradient(180deg, rgba(38, 21, 70, 0.88), rgba(18, 10, 36, 0.96)) !important;
    border: 1px solid rgba(192, 132, 252, 0.2) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35) !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    min-width: 0 !important;
    overflow: hidden !important;
    cursor: pointer !important;
  }

  html body #main:not(#never):not(#never2) .df-mf4-ic {
    font-size: 18px !important;
    line-height: 1 !important;
    margin-bottom: 4px !important;
    filter: drop-shadow(0 2px 6px rgba(184, 255, 1, 0.32)) !important;
  }

  html body #main:not(#never):not(#never2) .df-mf4-title {
    font-size: 9.5px !important;
    font-weight: 800 !important;
    color: #ffffff !important;
    white-space: nowrap !important;
    line-height: 1.15 !important;
  }

  html body #main:not(#never):not(#never2) .df-mf4-sub {
    font-size: 8px !important;
    color: rgba(203, 213, 225, 0.72) !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    max-width: 100% !important;
    margin-top: 2px !important;
    line-height: 1.1 !important;
  }

  /* =======================================================================
     RIJ 6: Categorie-Tabs Balk (height: 36px, 5 items)
     ======================================================================= */
  html body #main:not(#never):not(#never2) .df-mob-cat-tabs {
    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;
    margin: 5px 12px !important;
    padding: 3px 4px !important;
    border-radius: 999px !important;
    background: rgba(18, 10, 34, 0.92) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 2px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  html body #main:not(#never):not(#never2) .df-mcat-tab {
    height: 28px !important;
    min-height: 28px !important;
    max-height: 28px !important;
    padding: 0 7px !important;
    border-radius: 999px !important;
    border: none !important;
    background: transparent !important;
    color: #94a3b8 !important;
    font-size: 10.5px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
  }

  html body #main:not(#never):not(#never2) .df-mcat-tab.active {
    color: #ffffff !important;
    font-weight: 800 !important;
    background: linear-gradient(180deg, rgba(184, 255, 1, 0.14), rgba(184, 255, 1, 0.25)) !important;
    box-shadow: inset 0 -2px 0 #b8ff01 !important;
  }

  /* =======================================================================
     RIJ 7: Timeframe & Filter Balk (height: 30px, 5m | 1h | 4h | 24h + Filters + Sliders)
     ======================================================================= */
  html body #main:not(#never):not(#never2) .df-mob-tf-filter-bar {
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    margin: 4px 12px 6px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    box-sizing: border-box !important;
  }

  html body #main:not(#never):not(#never2) .df-mtf-group {
    display: inline-flex !important;
    align-items: center !important;
    height: 28px !important;
    min-height: 28px !important;
    max-height: 28px !important;
    background: rgba(18, 10, 34, 0.92) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 8px !important;
    padding: 2px !important;
    gap: 2px !important;
    box-sizing: border-box !important;
  }

  html body #main:not(#never):not(#never2) .df-mtf-btn,
  html body #main:not(#never):not(#never2) button.df-mtf-btn {
    height: 24px !important;
    min-height: 24px !important;
    max-height: 24px !important;
    padding: 0 9px !important;
    margin: 0 !important;
    border-radius: 6px !important;
    border: none !important;
    background: transparent !important;
    color: #94a3b8 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
  }

  html body #main:not(#never):not(#never2) .df-mtf-btn.active,
  html body #main:not(#never):not(#never2) button.df-mtf-btn.active {
    height: 24px !important;
    min-height: 24px !important;
    max-height: 24px !important;
    padding: 0 9px !important;
    background: #b8ff01 !important;
    color: #090d16 !important;
    font-weight: 800 !important;
    box-shadow: 0 0 10px rgba(184, 255, 1, 0.35) !important;
  }

  html body #main:not(#never):not(#never2) .df-mtf-actions {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
  }

  html body #main:not(#never):not(#never2) .df-mtf-filter-btn {
    height: 28px !important;
    min-height: 28px !important;
    max-height: 28px !important;
    padding: 0 10px !important;
    border-radius: 8px !important;
    background: rgba(24, 14, 44, 0.92) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: #cbd5e1 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
  }

  html body #main:not(#never):not(#never2) .df-mtf-sliders-btn {
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
    max-height: 28px !important;
    padding: 0 !important;
    border-radius: 8px !important;
    background: rgba(24, 14, 44, 0.92) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: #cbd5e1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
  }

  /* =======================================================================
     RIJ 8: De Compacte 4-Koloms Token-Rijen met Midden-Sparkline (height: 56px per rij)
     ======================================================================= */
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    padding: 0 12px !important;
    box-sizing: border-box !important;
  }

  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row {
    display: grid !important;
    grid-template-columns: minmax(136px, 1.35fr) 72px minmax(82px, 0.95fr) 22px !important;
    grid-template-rows: 22px 18px !important;
    align-items: center !important;
    column-gap: 6px !important;
    row-gap: 1px !important;
    height: 56px !important;
    min-height: 56px !important;
    max-height: 56px !important;
    padding: 7px 10px !important;
    margin: 0 !important;
    border-radius: 14px !important;
    background: linear-gradient(180deg, rgba(26, 15, 48, 0.92), rgba(16, 9, 32, 0.95)) !important;
    border: 1px solid rgba(255, 255, 255, 0.07) !important;
    box-sizing: border-box !important;
  }

  /* Col 1: Avatar (40x40) + $SYMBOL 👑 + Full Name 🕒 5m */
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row > .cell-token {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    min-width: 0 !important;
  }

  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row .df-row-rank,
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row .df-mobile-mc {
    display: none !important;
  }

  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row .cell-token .avatar {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    border-radius: 50% !important;
  }

  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row .cell-token .name {
    font-size: 12.5px !important;
    font-weight: 800 !important;
    color: #ffffff !important;
    max-width: 112px !important;
    letter-spacing: -0.02em !important;
  }

  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row:first-child .df-mob-crown {
    display: inline-block !important;
    font-size: 12px !important;
    margin-left: 3px !important;
    line-height: 1 !important;
  }

  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row .df-token-subline {
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
    min-width: 0 !important;
  }

  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row .df-desktop-tname {
    display: inline-block !important;
    font-size: 10.5px !important;
    color: #94a3b8 !important;
    max-width: 68px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row .df-mob-age {
    display: inline-flex !important;
    align-items: center !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    color: #4ade80 !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
  }

  /* Col 2: Center Live Mini-Sparkline SVG (70x24px) */
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row > .cell-spark {
    grid-column: 2 !important;
    grid-row: 1 / span 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 70px !important;
    height: 24px !important;
  }

  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row > .cell-spark svg {
    width: 70px !important;
    height: 24px !important;
    display: block !important;
  }

  /* Col 3 Top: Price right-aligned */
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row > .cell-price {
    grid-column: 3 !important;
    grid-row: 1 !important;
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    text-align: right !important;
  }

  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row > .cell-price .money-value {
    font-size: 13px !important;
    font-weight: 800 !important;
    color: #ffffff !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    min-height: 0 !important;
  }

  /* Col 3 Bottom: Change % right-aligned underneath Price */
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row > .cell-change {
    grid-column: 3 !important;
    grid-row: 2 !important;
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    text-align: right !important;
  }

  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row > .cell-change .change-value {
    font-size: 11.5px !important;
    font-weight: 700 !important;
    padding: 0 !important;
    background: transparent !important;
  }

  /* Col 4: Far Right Star ☆ */
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row > .cell-safety {
    grid-column: 4 !important;
    grid-row: 1 / span 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: 22px !important;
  }

  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row > .cell-volume,
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row > .cell-cap,
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row > .cell-liquidity,
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row > .cell-holders {
    display: none !important;
  }

  /* =======================================================================
     RIJ 9: Onderste 5-Knops Dock met Grote Zwevende Ronde 🚀 Launch Knop
     ======================================================================= */
  html body #nav.df-bottom-dock,
  html body nav.bottomnav.df-bottom-dock {
    height: 64px !important;
    padding: 0 8px env(safe-area-inset-bottom, 0px) !important;
    background: rgba(12, 6, 26, 0.96) !important;
    border-top: 1px solid rgba(192, 132, 252, 0.22) !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    overflow: visible !important;
  }

  html body #nav.df-bottom-dock .df-dock-btn.df-dock-launch {
    position: relative !important;
    margin-top: -18px !important;
    background: transparent !important;
    overflow: visible !important;
  }

  html body #nav.df-bottom-dock .df-dock-btn.df-dock-launch .navicon {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    border-radius: 50% !important;
    background: radial-gradient(circle at 50% 35%, rgba(65, 105, 18, 0.96), rgba(18, 28, 12, 0.98)) !important;
    border: 2px solid #b8ff01 !important;
    box-shadow: 0 0 22px rgba(184, 255, 1, 0.65), inset 0 0 12px rgba(184, 255, 1, 0.35) !important;
    color: #b8ff01 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  html body #nav.df-bottom-dock .df-dock-btn.df-dock-launch .navicon svg {
    width: 22px !important;
    height: 22px !important;
  }

  html body #nav.df-bottom-dock .df-dock-btn.df-dock-launch .df-dock-lbl {
    color: #ffffff !important;
    font-weight: 800 !important;
    font-size: 10.5px !important;
    margin-top: 2px !important;
  }
}

/* =========================================================================
   DEXFUN V11 — END-PRODUCT & 5-PARTY WIN-WIN FLYWHEEL ECOSYSTEM UPGRADE
   ========================================================================= */

/* 1. Desktop Hero CTA Buttons (prevent awkward 2-line wrapping) & Flywheel Strip */
.df-dd-hero-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.df-dd-btn-primary,
.df-dd-btn-secondary,
.df-dd-btn-lootbox {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  white-space: nowrap !important;
  padding: 10px 16px !important;
  border-radius: 999px !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  cursor: pointer;
  transition: transform 0.16s ease, box-shadow 0.16s ease;
}

.df-dd-btn-lootbox {
  background: linear-gradient(135deg, rgba(168, 85, 247, 0.28), rgba(184, 255, 1, 0.18)) !important;
  border: 1px solid rgba(184, 255, 1, 0.55) !important;
  color: #B8FF01 !important;
  box-shadow: 0 0 16px rgba(184, 255, 1, 0.22);
}

.df-dd-btn-lootbox:hover {
  transform: translateY(-1px);
  box-shadow: 0 0 24px rgba(184, 255, 1, 0.42);
}

.df-dd-flywheel-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 10px;
  max-width: 530px;
}

.df-dd-fw-pill,
.df-fw-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 11px;
  border-radius: 999px;
  background: rgba(18, 12, 36, 0.85);
  border: 1px solid rgba(184, 255, 1, 0.34);
  color: #E2E8F0;
  font-size: 11.5px;
  font-weight: 700;
  white-space: nowrap;
  cursor: pointer;
  transition: border-color 0.15s ease, transform 0.15s ease;
}

.df-fw-chip:hover {
  border-color: #B8FF01;
  transform: translateY(-1px);
}

.df-fw-chip b {
  color: #B8FF01;
}

/* 2. King of the Curve / Graduation Jackpot Throne inside .df-dd-stats-card */
.df-dd-stats-card {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  gap: 10px !important;
}

.df-dd-jackpot-pill {
  font-size: 11px;
  font-weight: 800;
  color: #FDE047;
  background: rgba(250, 204, 21, 0.14);
  border: 1px solid rgba(250, 204, 21, 0.45);
  padding: 3px 9px;
  border-radius: 999px;
  white-space: nowrap;
}

.df-dd-king-box {
  padding: 11px 12px;
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(30, 18, 56, 0.92), rgba(18, 28, 20, 0.92));
  border: 1px solid rgba(184, 255, 1, 0.42);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.35), inset 0 0 18px rgba(184, 255, 1, 0.08);
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.df-dd-king-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
}

.df-king-pill,
.df-lpk-crown {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 9px;
  border-radius: 999px;
  background: rgba(184, 255, 1, 0.16);
  border: 1px solid rgba(184, 255, 1, 0.48);
  color: #B8FF01;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.df-dd-king-main,
.df-dd-king-top {
  display: flex;
  align-items: center;
  gap: 10px;
}

.df-dd-king-main .avatar,
.df-dd-king-top .avatar {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  min-height: 36px !important;
  border-radius: 50% !important;
  border: 1.5px solid #B8FF01 !important;
}

.df-dd-king-info,
.df-dd-king-meta {
  display: flex;
  flex-direction: column;
  min-width: 0;
  flex: 1;
  gap: 2px;
}

.df-dd-king-sym-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

.df-dd-king-sym {
  font-size: 14px !important;
  font-weight: 800 !important;
  color: #FFFFFF !important;
}

.df-dd-king-info strong {
  font-size: 13.5px;
  color: #FFFFFF;
}

.df-dd-king-info .quiet,
.df-dd-king-meta .quiet {
  font-size: 11px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.df-dd-king-bar-wrap {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.df-dd-king-bar-lbl {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 11px;
  color: #CBD5E1;
}

.df-dd-king-bar {
  height: 6px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  overflow: hidden;
}

.df-dd-king-bar > span {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #A855F7, #B8FF01);
  box-shadow: 0 0 10px rgba(184, 255, 1, 0.65);
}

.df-dd-king-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}

.df-king-snipe-btn,
.df-king-call-btn,
.df-dd-king-snipe,
.df-dd-king-call,
.df-lp-buy-btn,
.df-lp-call-btn,
.df-lc-snipe-pill,
.df-lc-call-pill {
  padding: 6px 10px;
  border-radius: 9px;
  font-size: 11.5px;
  font-weight: 800;
  cursor: pointer;
  white-space: nowrap;
  text-align: center;
  transition: transform 0.14s ease, filter 0.14s ease;
}

.df-king-snipe-btn,
.df-dd-king-snipe,
.df-lp-buy-btn,
.df-lc-snipe-pill {
  background: linear-gradient(135deg, #B8FF01, #7CE800);
  color: #090D16;
  border: none;
  box-shadow: 0 0 12px rgba(184, 255, 1, 0.32);
}

.df-king-call-btn,
.df-dd-king-call,
.df-lp-call-btn,
.df-lc-call-pill {
  background: rgba(168, 85, 247, 0.22);
  color: #E9D5FF;
  border: 1px solid rgba(168, 85, 247, 0.55);
}

.df-king-snipe-btn:hover,
.df-king-call-btn:hover,
.df-dd-king-snipe:hover,
.df-dd-king-call:hover,
.df-lp-buy-btn:hover,
.df-lp-call-btn:hover,
.df-lc-snipe-pill:hover,
.df-lc-call-pill:hover {
  transform: translateY(-1px);
  filter: brightness(1.08);
}

/* 3. Feature Card Live Reward Badges (Desktop & Mobile) */
.df-dd-feat-card {
  position: relative;
}

.df-dd-feat-badge-lime,
.df-dd-feat-badge-purple {
  margin-left: auto;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
  white-space: nowrap;
}

.df-dd-feat-badge-lime {
  background: rgba(184, 255, 1, 0.16);
  border: 1px solid rgba(184, 255, 1, 0.45);
  color: #B8FF01;
}

.df-dd-feat-badge-purple {
  background: rgba(168, 85, 247, 0.22);
  border: 1px solid rgba(168, 85, 247, 0.52);
  color: #E9D5FF;
}

.df-mob-feat-badge {
  display: inline-block;
  margin-top: 2px;
  padding: 1px 6px;
  border-radius: 999px;
  background: rgba(184, 255, 1, 0.16);
  border: 1px solid rgba(184, 255, 1, 0.4);
  color: #B8FF01;
  font-size: 9px;
  font-weight: 800;
}

/* 4. Pro 2-Column Swap Terminal (when clicking Trade) */
.df-trade-terminal-v11 {
  width: 100%;
  padding: 8px 0 24px;
}

.df-trade-terminal-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.9fr);
  gap: 18px;
  align-items: start;
}

.df-trade-main-col,
.df-trade-side-col {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.df-trade-flywheel-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.df-tfw-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 12px;
  border-radius: 14px;
  background: rgba(20, 12, 38, 0.85);
  border: 1px solid rgba(184, 255, 1, 0.28);
}

.df-tfw-ic {
  font-size: 18px;
}

.df-tfw-item strong {
  display: block;
  font-size: 12px;
  color: #FFFFFF;
}

.df-tfw-item .quiet {
  font-size: 10.5px;
}

.df-trade-quick-movers {
  padding: 14px 16px !important;
}

.df-tqm-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}

.df-tqm-head h3 {
  font-size: 14px;
  margin: 0;
}

.df-tqm-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.df-tqm-chip {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 12px;
  background: rgba(25, 16, 46, 0.82);
  border: 1px solid rgba(168, 85, 247, 0.3);
  color: #FFFFFF;
  cursor: pointer;
  text-align: left;
}

.df-tqm-chip.active,
.df-tqm-chip:hover {
  border-color: #B8FF01;
  background: rgba(184, 255, 1, 0.12);
}

.df-tqm-chip .avatar {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  min-height: 28px !important;
}

.df-tqm-info {
  display: flex;
  flex-direction: column;
  min-width: 0;
  flex: 1;
}

.df-tqm-info strong {
  font-size: 12px;
}

.df-tqm-info .quiet {
  font-size: 10.5px;
}

.df-tqm-chg {
  font-size: 11px;
  font-weight: 800;
}

.df-tqm-chg.up { color: #B8FF01; }
.df-tqm-chg.down { color: #FF4D6D; }

/* 5. Launchpad King of the Hill Spotlight & 15% Creator Royalty Calculator */
.df-lp-king-spotlight {
  display: grid;
  grid-template-columns: 1.35fr 1fr;
  gap: 18px;
  padding: 18px 20px;
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(34, 18, 64, 0.95), rgba(18, 34, 24, 0.92));
  border: 1.5px solid rgba(184, 255, 1, 0.5);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.4), inset 0 0 24px rgba(184, 255, 1, 0.08);
  margin-bottom: 14px;
  align-items: center;
}

.df-lp-king-badges,
.df-lpk-badge-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}

.df-lp-king-token,
.df-lpk-token-row {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
}

.df-lp-king-token .avatar,
.df-lpk-token-row .avatar {
  width: 52px !important;
  height: 52px !important;
  min-width: 52px !important;
  min-height: 52px !important;
  border-radius: 50% !important;
  border: 2px solid #B8FF01 !important;
}

.df-lp-king-token h2,
.df-lpk-meta h2 {
  margin: 0 0 4px;
  font-size: 19px;
}

.df-lp-king-right,
.df-lpk-right {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.df-lpk-payout-pills {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.df-lpk-payout-pills > div {
  padding: 8px 10px;
  border-radius: 10px;
  background: rgba(20, 12, 38, 0.82);
  border: 1px solid rgba(255, 255, 255, 0.1);
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 11px;
}

.df-lp-king-prog-row,
.df-lpk-prog-foot {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  margin-top: 6px;
}

.df-lp-king-ctas {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.df-lp-royalty-calc,
.df-winwin-calc-card {
  padding: 16px 18px;
  border-radius: 16px;
  background: rgba(18, 12, 34, 0.9);
  border: 1px solid rgba(168, 85, 247, 0.42);
  margin-bottom: 14px;
}

.df-lp-rc-head,
.df-lprc-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.df-lp-rc-head h2,
.df-lp-rc-head h3,
.df-lprc-head strong {
  margin: 4px 0;
  font-size: 15.5px;
}

.df-lp-rc-pills {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.df-rc-pill {
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(30, 20, 56, 0.85);
  border: 1px solid rgba(168, 85, 247, 0.4);
  color: #E2E8F0;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}

.df-rc-pill.active,
.df-rc-pill:hover {
  background: #B8FF01;
  border-color: #B8FF01;
  color: #090D16;
}

.df-lp-rc-grid,
.df-lprc-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.df-lp-rc-box,
.df-lprc-box {
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(28, 18, 52, 0.78);
  border: 1px solid rgba(255, 255, 255, 0.08);
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.df-lp-rc-box strong,
.df-lprc-box strong {
  font-size: 15px;
}

.df-lp-rc-box small,
.df-lprc-box small {
  font-size: 11px;
  color: #94A3B8;
}

.df-lc-pot-pill {
  padding: 2px 7px;
  border-radius: 999px;
  background: rgba(250, 204, 21, 0.14);
  border: 1px solid rgba(250, 204, 21, 0.4);
  color: #FDE047;
  font-size: 10.5px;
  font-weight: 800;
}

.df-lc-quick-btns {
  display: flex;
  align-items: center;
  gap: 6px;
}

.df-lc-actions-2col {
  display: grid;
  grid-template-columns: 1.25fr 1fr;
  gap: 6px;
  margin-top: 8px;
}

/* 6. Rewards Hub: 3D Neon Mystery Lootbox & 5-Party Win-Win Table */
.df-comm-hero,
.df-bot-hero,
.df-lp-hero {
  min-height: 158px !important;
  padding: 16px 22px !important;
}

.df-rewards-v11-wrap {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.df-lootbox-arena {
  display: grid;
  grid-template-columns: 1.35fr 0.95fr;
  gap: 18px;
  align-items: center;
  background: radial-gradient(circle at 80% 40%, rgba(168, 85, 247, 0.25), rgba(16, 10, 32, 0.95)) !important;
  border: 1.5px solid rgba(184, 255, 1, 0.48) !important;
}

.df-lootbox-left {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.df-lootbox-left h2 {
  margin: 0;
  font-size: 20px;
}

.df-lootbox-perk-active {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
  border-radius: 12px;
  background: rgba(184, 255, 1, 0.1);
  border: 1px solid rgba(184, 255, 1, 0.35);
  font-size: 12.5px;
}

.df-lootbox-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.df-lootbox-right {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}

.df-lootbox-cube-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  cursor: pointer;
}

.df-lootbox-3d-orb {
  width: 112px;
  height: 112px;
  border-radius: 26px;
  background: radial-gradient(circle at 35% 30%, rgba(184, 255, 1, 0.45), rgba(168, 85, 247, 0.45) 55%, rgba(20, 12, 40, 0.95));
  border: 2px solid #B8FF01;
  box-shadow: 0 0 32px rgba(184, 255, 1, 0.45), inset 0 0 20px rgba(168, 85, 247, 0.45);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  animation: dfLootboxFloat 3s ease-in-out infinite;
}

.df-lootbox-emoji {
  font-size: 54px;
  filter: drop-shadow(0 6px 14px rgba(0, 0, 0, 0.55));
}

.df-lootbox-click-hint {
  font-size: 11.5px;
  font-weight: 800;
  color: #B8FF01;
}

@keyframes dfLootboxFloat {
  0%, 100% { transform: translateY(0) rotate(-2deg); }
  50% { transform: translateY(-7px) rotate(2deg); }
}

.df-lootbox-prizes-mini {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  width: 100%;
}

.df-lb-prize-chip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 9px;
  border-radius: 10px;
  background: rgba(24, 15, 44, 0.88);
  border: 1px solid rgba(168, 85, 247, 0.35);
  font-size: 11px;
}

.df-winwin-table {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.df-ww-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 14px;
  border-radius: 12px;
  background: rgba(26, 17, 48, 0.82);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.df-ww-row-highlight {
  background: linear-gradient(90deg, rgba(184, 255, 1, 0.14), rgba(26, 17, 48, 0.9));
  border-color: rgba(184, 255, 1, 0.5);
}

.df-ww-party {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.df-ww-party strong {
  font-size: 13.5px;
}

.df-ww-val {
  text-align: right;
  display: flex;
  flex-direction: column;
  gap: 2px;
  white-space: nowrap;
}

.df-ww-val strong {
  font-size: 14.5px;
}

.df-ww-val span {
  font-size: 11px;
  color: #94A3B8;
}

/* 7. Bot Page: 10.00 SOL Live Paper-Trading Playground */
.df-paper-bot-playground {
  display: flex;
  flex-direction: column;
  gap: 12px;
  border: 1.5px solid rgba(184, 255, 1, 0.42) !important;
}

.df-paper-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.df-paper-head h2 {
  margin: 4px 0;
  font-size: 18px;
}

.df-paper-signals-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.df-paper-sig-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(24, 15, 44, 0.85);
  border: 1px solid rgba(168, 85, 247, 0.32);
}

.df-paper-sig-left {
  display: flex;
  align-items: center;
  gap: 10px;
}

.df-paper-sig-left .avatar {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  min-height: 36px !important;
}

.df-paper-sig-title {
  display: flex;
  align-items: center;
  gap: 8px;
}

.df-paper-sig-tag {
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(184, 255, 1, 0.14);
  border: 1px solid rgba(184, 255, 1, 0.38);
  color: #B8FF01;
  font-size: 10.5px;
  font-weight: 700;
}

.df-paper-sig-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

@media (max-width: 960px) {
  .df-trade-terminal-grid,
  .df-lp-king-spotlight,
  .df-lootbox-arena {
    grid-template-columns: 1fr !important;
  }
  .df-lp-rc-grid,
  .df-trade-flywheel-strip,
  .df-tqm-grid {
    grid-template-columns: 1fr 1fr !important;
  }
  .df-ww-row {
    flex-direction: column;
    align-items: flex-start;
  }
  .df-ww-val {
    text-align: left;
  }
}

/* ==========================================================================
   V12: ORIGIN BADGES (PUMP.FUN PILL vs DEXFUN LOGO), DEXFUN MULTI-WALLET MODAL
   & GUARANTEED LIVE CHART LEGEND
   ========================================================================== */

.avatar {
  position: relative !important;
  overflow: visible !important;
}

.avatar > img[data-icon],
.avatar > img[data-team-logo],
.avatar > .avatar-fallback {
  border-radius: inherit !important;
  overflow: hidden !important;
}

.df-origin-badge {
  position: absolute !important;
  right: -3px !important;
  bottom: -3px !important;
  width: 16px !important;
  height: 16px !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 4 !important;
  pointer-events: none !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.75) !important;
}

.df-origin-badge-lg {
  width: 21px !important;
  height: 21px !important;
  right: -4px !important;
  bottom: -4px !important;
}

.df-origin-pump {
  background: radial-gradient(circle at 30% 30%, #10b981, #052e16) !important;
  border: 1.5px solid #34d399 !important;
}

.df-origin-dexfun {
  background: radial-gradient(circle at 30% 30%, #2a1852, #0d081b) !important;
  border: 1.5px solid #B8FF01 !important;
  box-shadow: 0 0 8px rgba(184, 255, 1, 0.45) !important;
}

.df-origin-pump-svg {
  width: 12px !important;
  height: 12px !important;
  display: block !important;
}

.df-origin-badge-lg .df-origin-pump-svg {
  width: 15px !important;
  height: 15px !important;
}

.df-origin-dexfun-img {
  width: 13px !important;
  height: 13px !important;
  object-fit: contain !important;
  border-radius: 999px !important;
  display: block !important;
}

.df-origin-badge-lg .df-origin-dexfun-img {
  width: 16px !important;
  height: 16px !important;
}

.df-origin-tag {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 2px 7px !important;
  border-radius: 999px !important;
  font-size: 10.5px !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  letter-spacing: 0.01em !important;
  vertical-align: middle !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}

.df-origin-tag-sm {
  padding: 1.5px 5.5px !important;
  font-size: 9.5px !important;
  gap: 3px !important;
}

.df-origin-tag-pump {
  background: rgba(16, 185, 129, 0.14) !important;
  border: 1px solid rgba(52, 211, 153, 0.42) !important;
  color: #6ee7b7 !important;
}

.df-origin-tag-dexfun {
  background: rgba(184, 255, 1, 0.15) !important;
  border: 1px solid rgba(184, 255, 1, 0.52) !important;
  color: #B8FF01 !important;
  box-shadow: 0 0 10px rgba(184, 255, 1, 0.16) !important;
}

.df-origin-tag-svg {
  width: 11px !important;
  height: 11px !important;
  flex-shrink: 0 !important;
}

.df-origin-tag-img {
  width: 12px !important;
  height: 12px !important;
  object-fit: contain !important;
  border-radius: 999px !important;
  flex-shrink: 0 !important;
}

#tokenrows .df-origin-tag-sm {
  padding: 1px 5px !important;
  font-size: 9px !important;
  gap: 2.5px !important;
}

@media (max-width: 760px) {
  #tokenrows .df-origin-tag-sm {
    display: none !important;
  }
}

/* Chart OHLCV Legend Bar */
.token-chart .lwc-legend {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 6px 10px !important;
  font-size: 11.5px !important;
  color: #CBD5E1 !important;
  background: rgba(16, 11, 31, 0.85) !important;
  border-bottom: 1px solid rgba(157, 78, 221, 0.22) !important;
  border-radius: 12px 12px 0 0 !important;
}

.token-chart .lwc-legend b {
  color: #FFFFFF !important;
  font-family: var(--mono, monospace) !important;
  font-weight: 700 !important;
}

.token-chart .lwc-legend .lwc-pct[data-change="up"] {
  color: #B8FF01 !important;
  font-weight: 800 !important;
}

.token-chart .lwc-legend .lwc-pct[data-change="down"] {
  color: #FF3B69 !important;
  font-weight: 800 !important;
}

/* Dexfun Multi-Wallet & Instant Self-Custodial Wallet Modal */
.df-wm-backdrop,
.df-wallet-modal-backdrop {
  position: fixed !important;
  inset: 0 !important;
  z-index: 9999 !important;
  background: rgba(7, 4, 15, 0.82) !important;
  backdrop-filter: blur(10px) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 16px !important;
}

.df-wm-dialog,
.df-wallet-modal-card {
  width: 100% !important;
  max-width: 520px !important;
  max-height: 90vh !important;
  overflow-y: auto !important;
  background: linear-gradient(165deg, #191130 0%, #0E091C 100%) !important;
  border: 1.5px solid rgba(184, 255, 1, 0.45) !important;
  border-radius: 22px !important;
  padding: 20px !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.8), 0 0 32px rgba(184, 255, 1, 0.14) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  color: #F8FAFC !important;
}

.df-wm-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 12px !important;
}

.df-wm-brand {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.df-wm-logo {
  width: 42px !important;
  height: 42px !important;
  border-radius: 12px !important;
  object-fit: contain !important;
  background: rgba(184, 255, 1, 0.12) !important;
  border: 1px solid rgba(184, 255, 1, 0.4) !important;
  padding: 3px !important;
}

.df-wm-kicker {
  display: inline-block !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: 0.06em !important;
  color: #B8FF01 !important;
  text-transform: uppercase !important;
}

.df-wm-head h2 {
  margin: 2px 0 0 !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  color: #FFFFFF !important;
}

.df-wm-close-x,
.df-wm-close {
  width: 34px !important;
  height: 34px !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, 0.07) !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  color: #E2E8F0 !important;
  font-size: 20px !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.df-wm-connected-box,
.df-wm-active-session {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  padding: 12px 14px !important;
  border-radius: 14px !important;
  background: rgba(184, 255, 1, 0.1) !important;
  border: 1px solid rgba(184, 255, 1, 0.4) !important;
}

.df-wm-conn-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
}

.df-wm-conn-badge {
  font-size: 12px !important;
  font-weight: 800 !important;
  color: #B8FF01 !important;
}

.df-wm-addr-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
}

.df-wm-code {
  font-size: 11px !important;
  color: #E2E8F0 !important;
  word-break: break-all !important;
}

.df-wm-vault-note {
  font-size: 10.5px !important;
  color: #A7F3D0 !important;
}

.df-wm-tabs {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 6px !important;
  background: rgba(10, 6, 20, 0.75) !important;
  padding: 4px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(157, 78, 221, 0.28) !important;
}

.df-wm-tab {
  padding: 9px 10px !important;
  border-radius: 9px !important;
  border: none !important;
  background: transparent !important;
  color: #A79BC2 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
}

.df-wm-tab.active {
  background: linear-gradient(135deg, rgba(184, 255, 1, 0.22), rgba(157, 78, 221, 0.28)) !important;
  color: #B8FF01 !important;
  border: 1px solid rgba(184, 255, 1, 0.45) !important;
}

.df-wm-body {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

.df-wm-lead {
  margin: 0 !important;
  font-size: 12.5px !important;
  line-height: 1.45 !important;
  color: #CBD5E1 !important;
}

.df-wm-social-grid,
.df-wm-instant-grid,
.df-wm-ext-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
}

.df-wm-social-btn,
.df-wm-provider-btn,
.df-wm-ext-btn {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  padding: 12px 14px !important;
  border-radius: 14px !important;
  background: rgba(25, 18, 46, 0.9) !important;
  border: 1px solid rgba(157, 78, 221, 0.35) !important;
  color: #FFFFFF !important;
  text-align: left !important;
  cursor: pointer !important;
  transition: transform 0.12s ease, border-color 0.12s ease !important;
}

.df-wm-social-btn:hover,
.df-wm-provider-btn:hover,
.df-wm-ext-btn:hover {
  border-color: #B8FF01 !important;
  transform: translateY(-1px) !important;
}

.df-wm-instant,
.df-wm-provider-lime {
  background: linear-gradient(135deg, rgba(184, 255, 1, 0.16), rgba(25, 18, 46, 0.95)) !important;
  border-color: rgba(184, 255, 1, 0.55) !important;
}

.df-wm-soc-ic,
.df-wm-prov-ic,
.df-wm-ext-ic {
  width: 36px !important;
  height: 36px !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, 0.08) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  flex-shrink: 0 !important;
}

.df-wm-google .df-wm-soc-ic,
.df-wm-google .df-wm-prov-ic {
  background: #FFFFFF !important;
  color: #EA4335 !important;
}

.df-wm-soc-txt,
.df-wm-provider-btn div,
.df-wm-ext-btn div {
  flex: 1 !important;
  min-width: 0 !important;
}

.df-wm-soc-txt strong,
.df-wm-provider-btn strong,
.df-wm-ext-btn strong {
  display: block !important;
  font-size: 13.5px !important;
  font-weight: 800 !important;
  color: #FFFFFF !important;
}

.df-wm-soc-txt small,
.df-wm-provider-btn small,
.df-wm-ext-btn small {
  display: block !important;
  font-size: 11px !important;
  color: #A79BC2 !important;
}

.df-wm-arr,
.df-wm-arrow {
  color: #B8FF01 !important;
  font-weight: 900 !important;
  font-size: 15px !important;
}

.df-wm-email-box,
.df-wm-email-row {
  display: flex !important;
  gap: 8px !important;
}

.df-wm-email-input {
  flex: 1 !important;
  padding: 10px 12px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(157, 78, 221, 0.4) !important;
  background: rgba(11, 7, 20, 0.9) !important;
  color: #FFFFFF !important;
  font-size: 13px !important;
}

.df-wm-foot,
.df-wm-security-foot {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding-top: 10px !important;
  border-top: 1px solid rgba(157, 78, 221, 0.24) !important;
  font-size: 10.5px !important;
  color: #94A3B8 !important;
}

.df-wallet-vault-banner {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  border: 1px solid rgba(184, 255, 1, 0.38) !important;
  background: linear-gradient(135deg, rgba(184, 255, 1, 0.08), rgba(21, 16, 38, 0.92)) !important;
}

.df-wvb-left {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.df-wvb-ic {
  width: 40px !important;
  height: 40px !important;
  border-radius: 12px !important;
  background: rgba(184, 255, 1, 0.14) !important;
  border: 1px solid rgba(184, 255, 1, 0.4) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 20px !important;
}

.df-wvb-right {
  display: flex !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

/* =========================================================================
   DEXFUN V13 — 100% FULL-WIDTH MOBILE COIN ROWS, LARGER BOTTOM FOOTER DOCK,
   GOOGLE ACCOUNT SIGN-IN FLOW, MOBILE SEARCH & FILTER DRAWER
   ========================================================================= */

/* 1. Google Account Sign-In Flow & Inline SVG Icons in Multi-Wallet Modal */
.df-wm-google-svg,
.df-wm-apple-svg {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.df-wm-google .df-wm-soc-ic.df-wm-google-svg,
.df-wm-gstep-head .df-wm-soc-ic.df-wm-google-svg {
  background: #FFFFFF !important;
  border: 1px solid rgba(255, 255, 255, 0.25) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.28) !important;
}

.df-wm-apple .df-wm-soc-ic.df-wm-apple-svg {
  background: rgba(255, 255, 255, 0.12) !important;
  color: #FFFFFF !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
}

.df-wm-error-banner {
  margin: 0 !important;
  padding: 10px 12px !important;
  border-radius: 12px !important;
  background: rgba(255, 59, 105, 0.16) !important;
  border: 1px solid rgba(255, 59, 105, 0.5) !important;
  color: #FECDD3 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

.df-wm-email-tag {
  font-size: 11.5px !important;
  color: #E2E8F0 !important;
}

.df-wm-email-tag b {
  color: #B8FF01 !important;
}

.df-wm-gstep-head {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 10px 12px !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(184, 255, 1, 0.28) !important;
}

.df-wm-gstep-head strong {
  display: block !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  color: #FFFFFF !important;
}

.df-wm-gstep-head small {
  display: block !important;
  font-size: 11.5px !important;
  color: #CBD5E1 !important;
  margin-top: 2px !important;
}

.df-wm-saved-google-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}

.df-wm-g-avatar {
  width: 34px !important;
  height: 34px !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg, #4285F4, #34A853) !important;
  color: #FFFFFF !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}

.df-wm-google-form {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

.df-wm-g-lbl {
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  color: #CBD5E1 !important;
}

.df-wm-g-actions {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  margin-top: 4px !important;
}

.df-wm-g-submit {
  width: 100% !important;
  min-height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  border-radius: 12px !important;
  cursor: pointer !important;
}

.df-wm-back-link {
  align-self: flex-start !important;
  background: transparent !important;
  border: none !important;
  color: #B8FF01 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  padding: 4px 0 !important;
  cursor: pointer !important;
}

.df-wm-status-pill {
  padding: 4px 9px !important;
  border-radius: 999px !important;
  font-size: 10.5px !important;
  font-weight: 800 !important;
  background: rgba(255, 255, 255, 0.08) !important;
  color: #CBD5E1 !important;
  white-space: nowrap !important;
}

.df-wm-status-pill.detected {
  background: rgba(184, 255, 1, 0.16) !important;
  border: 1px solid rgba(184, 255, 1, 0.45) !important;
  color: #B8FF01 !important;
}

/* 2. Interactive Filter Panel (#filter-panel:not([hidden])) on Desktop & Mobile */
html body #filter-panel:not([hidden]) {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  padding: 14px 16px !important;
  margin: 6px 8px 10px !important;
  border-radius: 16px !important;
  background: linear-gradient(165deg, #191130 0%, #100A20 100%) !important;
  border: 1.5px solid rgba(184, 255, 1, 0.42) !important;
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.65) !important;
  z-index: 80 !important;
}

html body #filter-panel .filter-sheet-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

html body #filter-panel .filter-sheet-head button[data-filter-close] {
  padding: 4px 12px !important;
  border-radius: 999px !important;
  background: #B8FF01 !important;
  color: #090D16 !important;
  border: none !important;
  font-size: 11.5px !important;
  font-weight: 800 !important;
  cursor: pointer !important;
}

html body #filter-panel .filter-controls {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(135px, 1fr)) !important;
  gap: 8px !important;
}

html body #filter-panel .filter-controls label {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  color: #CBD5E1 !important;
}

html body #filter-panel .filter-controls select {
  padding: 7px 9px !important;
  border-radius: 10px !important;
  background: #0D0818 !important;
  border: 1px solid rgba(157, 78, 221, 0.4) !important;
  color: #FFFFFF !important;
  font-size: 12px !important;
}

/* 3. Mobile (< 1024px): 100% Full-Width Coin Rows, Edge-to-Edge Layout & Larger Bottom Dock */
@media (max-width: 1023px) {
  html body header {
    overflow: visible !important;
  }

  html body header.df-search-open .search-box,
  html body header .search-box[data-mobile-open="true"] {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    position: absolute !important;
    top: 50px !important;
    left: 8px !important;
    right: 8px !important;
    z-index: 250 !important;
    background: #150D2A !important;
    padding: 8px 10px !important;
    border-radius: 14px !important;
    border: 1.5px solid #B8FF01 !important;
    box-shadow: 0 14px 36px rgba(0, 0, 0, 0.85) !important;
  }

  html body .layout,
  html body #main,
  html body #main:not(#never):not(#never2),
  html body #main:not(#never):not(#never2) .df-dashboard-shell,
  html body #main:not(#never):not(#never2) .df-home-hybrid-shell,
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub,
  html body #main:not(#never):not(#never2) .df-mh-top-stack,
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub .df-dd-main-grid,
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub .df-dd-markets-col,
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub .df-dd-markets-col.df-markets-card-v2,
  html body #main:not(#never):not(#never2) .df-markets-shell,
  html body #main:not(#never):not(#never2) .df-markets-card-v2,
  html body #main:not(#never):not(#never2) .token-table,
  html body #main:not(#never):not(#never2) .token-table.df-markets-table,
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub .token-table.df-markets-table,
  html body #main:not(#never):not(#never2) #tokenrows,
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows,
  html body #main:not(#never):not(#never2) .pager {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    align-items: stretch !important;
    align-self: stretch !important;
    box-sizing: border-box !important;
  }

  html body:has(.df-desktop-dashboard-hub) #main:not(#never):not(#never2),
  html body #main:not(#never):not(#never2) {
    padding-bottom: calc(98px + env(safe-area-inset-bottom, 0px)) !important;
  }

  html body #main:not(#never):not(#never2) .df-mob-subnav-pills,
  html body #main:not(#never):not(#never2) .df-mob-hero-card,
  html body #main:not(#never):not(#never2) .df-mob-ticker-strip,
  html body #main:not(#never):not(#never2) .df-mob-feat-row4,
  html body #main:not(#never):not(#never2) .df-mob-cat-tabs,
  html body #main:not(#never):not(#never2) .df-mob-tf-filter-bar {
    margin-left: 6px !important;
    margin-right: 6px !important;
    width: calc(100% - 12px) !important;
    max-width: calc(100% - 12px) !important;
    box-sizing: border-box !important;
  }

  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows,
  html body #main:not(#never):not(#never2) #tokenrows {
    padding: 0 6px !important;
    gap: 6px !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row {
    width: 100% !important;
    max-width: 100% !important;
    grid-template-columns: minmax(0, 1.45fr) 92px minmax(92px, 1fr) 26px !important;
    grid-template-rows: 24px 20px !important;
    column-gap: 8px !important;
    height: 62px !important;
    min-height: 62px !important;
    max-height: 62px !important;
    padding: 8px 12px !important;
    box-sizing: border-box !important;
  }

  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row .cell-token .avatar {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
  }

  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row .cell-token .name {
    font-size: 13.5px !important;
    font-weight: 800 !important;
    max-width: 175px !important;
  }

  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row .df-desktop-tname {
    font-size: 11px !important;
    max-width: 115px !important;
  }

  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row .df-mob-age {
    font-size: 10.5px !important;
  }

  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row > .cell-spark,
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row > .cell-spark svg {
    width: 88px !important;
    height: 28px !important;
  }

  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row > .cell-price .money-value,
  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row > .cell-price .money-value span {
    font-size: 14px !important;
    font-weight: 800 !important;
  }

  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row > .cell-change .change-value {
    font-size: 12px !important;
    font-weight: 800 !important;
  }

  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row > .cell-safety {
    width: 26px !important;
  }

  html body #main:not(#never):not(#never2) .df-desktop-dashboard-hub #tokenrows .token.df-market-row > .cell-safety .row-star {
    font-size: 17px !important;
    width: 24px !important;
  }

  /* Larger, Bold, Thumb-Friendly Mobile Bottom Dock (#nav.df-bottom-dock) */
  html body #nav.df-bottom-dock,
  html body nav.bottomnav.df-bottom-dock {
    height: calc(82px + env(safe-area-inset-bottom, 0px)) !important;
    min-height: 82px !important;
    padding: 6px 8px calc(8px + env(safe-area-inset-bottom, 0px)) !important;
    background: linear-gradient(180deg, rgba(18, 10, 36, 0.98) 0%, rgba(10, 5, 22, 0.99) 100%) !important;
    border-top: 1.5px solid rgba(184, 255, 1, 0.28) !important;
    box-shadow: 0 -10px 32px rgba(0, 0, 0, 0.82) !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 4px !important;
    overflow: visible !important;
  }

  html body #nav.df-bottom-dock .df-dock-btn {
    height: 66px !important;
    min-height: 66px !important;
    padding: 6px 4px !important;
    gap: 5px !important;
    border-radius: 14px !important;
    font-size: 12.5px !important;
    font-weight: 800 !important;
    color: #C4B5FD !important;
  }

  html body #nav.df-bottom-dock .df-dock-btn:not(.df-dock-launch) .navicon {
    width: 26px !important;
    height: 26px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 22px !important;
  }

  html body #nav.df-bottom-dock .df-dock-btn:not(.df-dock-launch) .navicon svg {
    width: 24px !important;
    height: 24px !important;
    stroke-width: 2.2 !important;
  }

  html body #nav.df-bottom-dock .df-dock-btn .df-dock-lbl {
    font-size: 12.5px !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
    letter-spacing: -0.01em !important;
  }

  html body #nav.df-bottom-dock .df-dock-btn.active:not(.df-dock-launch) {
    background: rgba(184, 255, 1, 0.14) !important;
    border: 1px solid rgba(184, 255, 1, 0.35) !important;
    color: #B8FF01 !important;
  }

  html body #nav.df-bottom-dock .df-dock-btn.active:not(.df-dock-launch) .df-dock-lbl {
    color: #B8FF01 !important;
    font-weight: 900 !important;
  }

  html body #nav.df-bottom-dock .df-dock-btn.df-dock-launch {
    margin-top: -26px !important;
    height: auto !important;
    background: transparent !important;
    border: none !important;
  }

  html body #nav.df-bottom-dock .df-dock-btn.df-dock-launch .navicon {
    width: 60px !important;
    height: 60px !important;
    min-width: 60px !important;
    min-height: 60px !important;
    border-radius: 50% !important;
    background: radial-gradient(circle at 50% 35%, rgba(65, 105, 18, 0.96), rgba(18, 28, 12, 0.98)) !important;
    border: 2.5px solid #B8FF01 !important;
    box-shadow: 0 0 28px rgba(184, 255, 1, 0.72), inset 0 0 14px rgba(184, 255, 1, 0.4) !important;
    color: #B8FF01 !important;
  }

  html body #nav.df-bottom-dock .df-dock-btn.df-dock-launch .navicon svg {
    width: 26px !important;
    height: 26px !important;
  }

  html body #nav.df-bottom-dock .df-dock-btn.df-dock-launch .df-dock-lbl {
    font-size: 12.5px !important;
    font-weight: 900 !important;
    color: #FFFFFF !important;
    margin-top: 3px !important;
  }
}

.df-wm-google-oauth-box {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  margin-bottom: 14px;
}

.df-google-gsi-host {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 44px;
  width: 100%;
}

.df-wm-g-avatar-img {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  object-fit: cover;
  border: 1.5px solid #B8FF01;
  flex-shrink: 0;
}

/* ============================================================================
   DEXFUN V15 — 5-SCREEN ULTRA-HQ PLAYFUL "HOW IT WORKS" ONBOARDING EXPERIENCE
   ============================================================================ */
.df-how-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 38px;
  padding: 0 13px;
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(184, 255, 1, 0.16), rgba(168, 85, 247, 0.22));
  border: 1.5px solid rgba(184, 255, 1, 0.55);
  color: #B8FF01;
  font-size: 12.5px;
  font-weight: 800;
  cursor: pointer;
  white-space: nowrap;
  box-shadow: 0 0 18px rgba(184, 255, 1, 0.22);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.df-how-pill:hover {
  transform: translateY(-1px);
  background: linear-gradient(135deg, rgba(184, 255, 1, 0.26), rgba(168, 85, 247, 0.34));
  box-shadow: 0 0 24px rgba(184, 255, 1, 0.42);
}

@media (max-width: 640px) {
  .df-how-pill {
    padding: 0 10px;
    height: 36px;
    font-size: 11.5px;
  }
  .df-how-pill span {
    display: none;
  }
  .df-how-pill::after {
    content: "How It Works";
    font-weight: 800;
  }
}

.df-onb-backdrop {
  position: fixed;
  inset: 0;
  z-index: 12000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 14px;
  background:
    radial-gradient(circle at 20% 15%, rgba(184, 255, 1, 0.18), transparent 45%),
    radial-gradient(circle at 80% 85%, rgba(168, 85, 247, 0.25), transparent 50%),
    rgba(9, 4, 20, 0.88);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  animation: dfOnbFadeIn 0.22s ease-out;
}

@keyframes dfOnbFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.df-onb-modal {
  width: 100%;
  max-width: 980px;
  max-height: 94dvh;
  display: flex;
  flex-direction: column;
  background: linear-gradient(165deg, rgba(28, 15, 54, 0.98) 0%, rgba(15, 8, 32, 0.99) 100%);
  border: 2px solid rgba(184, 255, 1, 0.55);
  border-radius: 26px;
  box-shadow:
    0 28px 80px rgba(0, 0, 0, 0.82),
    0 0 55px rgba(184, 255, 1, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.14);
  overflow: hidden;
  color: #FFFFFF;
}

.df-onb-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 20px;
  background: rgba(12, 6, 26, 0.72);
  border-bottom: 1px solid rgba(168, 85, 247, 0.24);
  flex-shrink: 0;
}

.df-onb-brand {
  display: flex;
  align-items: center;
  gap: 10px;
}

.df-onb-logo {
  width: 38px;
  height: 38px;
  border-radius: 11px;
  border: 1.5px solid rgba(184, 255, 1, 0.55);
  box-shadow: 0 0 14px rgba(184, 255, 1, 0.3);
}

.df-onb-brand strong {
  display: block;
  font-size: 15px;
  font-weight: 900;
  color: #FFFFFF;
  line-height: 1.15;
}

.df-onb-brand small {
  display: block;
  font-size: 11.5px;
  font-weight: 700;
  color: #B8FF01;
}

.df-onb-step-pills {
  display: flex;
  align-items: center;
  gap: 6px;
  overflow-x: auto;
  scrollbar-width: none;
}

.df-onb-step-pills::-webkit-scrollbar {
  display: none;
}

.df-onb-step-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(168, 85, 247, 0.28);
  color: rgba(226, 214, 255, 0.75);
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.16s ease;
}

.df-onb-step-pill.done {
  background: rgba(16, 185, 129, 0.15);
  border-color: rgba(16, 185, 129, 0.5);
  color: #34D399;
}

.df-onb-step-pill.active {
  background: rgba(184, 255, 1, 0.18);
  border-color: #B8FF01;
  color: #B8FF01;
  box-shadow: 0 0 16px rgba(184, 255, 1, 0.28);
}

.df-onb-skip-btn {
  padding: 7px 13px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.16);
  color: rgba(235, 225, 255, 0.85);
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  white-space: nowrap;
}

.df-onb-skip-btn:hover {
  background: rgba(255, 255, 255, 0.14);
  color: #FFFFFF;
}

.df-onb-progress-track {
  height: 5px;
  width: 100%;
  background: rgba(255, 255, 255, 0.08);
  flex-shrink: 0;
}

.df-onb-progress-fill {
  height: 100%;
  background: linear-gradient(90deg, #B8FF01 0%, #10B981 55%, #A855F7 100%);
  box-shadow: 0 0 14px rgba(184, 255, 1, 0.75);
  transition: width 0.28s cubic-bezier(0.22, 1, 0.36, 1);
}

.df-onb-progress-fill[data-pct="20"] { width: 20%; }
.df-onb-progress-fill[data-pct="40"] { width: 40%; }
.df-onb-progress-fill[data-pct="60"] { width: 60%; }
.df-onb-progress-fill[data-pct="80"] { width: 80%; }
.df-onb-progress-fill[data-pct="100"] { width: 100%; }

.df-onb-body {
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 20px 24px;
}

.df-onb-slide {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: 22px;
  align-items: center;
  animation: dfOnbSlideIn 0.24s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes dfOnbSlideIn {
  from { opacity: 0; transform: translateY(8px) scale(0.99); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

.df-onb-hero-stage {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding: 18px 16px 14px;
  border-radius: 22px;
  background:
    radial-gradient(circle at 50% 38%, rgba(184, 255, 1, 0.22), rgba(26, 14, 52, 0.92) 72%);
  border: 1.5px solid rgba(184, 255, 1, 0.36);
  box-shadow: inset 0 0 32px rgba(184, 255, 1, 0.12);
  overflow: hidden;
  min-height: 320px;
}

.df-onb-stage-cyan {
  background: radial-gradient(circle at 50% 38%, rgba(56, 189, 248, 0.24), rgba(24, 13, 48, 0.94) 72%);
  border-color: rgba(56, 189, 248, 0.45);
}

.df-onb-stage-gold {
  background: radial-gradient(circle at 50% 38%, rgba(250, 204, 21, 0.25), rgba(28, 14, 52, 0.94) 72%);
  border-color: rgba(250, 204, 21, 0.5);
}

.df-onb-stage-purple {
  background: radial-gradient(circle at 50% 38%, rgba(192, 132, 252, 0.28), rgba(26, 12, 50, 0.95) 72%);
  border-color: rgba(192, 132, 252, 0.5);
}

.df-onb-floating-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 7px;
  width: 100%;
  z-index: 2;
}

.df-onb-fbadge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(14, 7, 30, 0.86);
  border: 1px solid rgba(184, 255, 1, 0.45);
  color: #FFFFFF;
  font-size: 11px;
  font-weight: 800;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.45);
  animation: dfOnbFloat 3.2s ease-in-out infinite;
}

.df-onb-fbadge svg {
  width: 13px;
  height: 13px;
}

.df-fb-2 { animation-delay: 0.6s; }
.df-fb-3 { animation-delay: 1.2s; }
.df-fb-4 { animation-delay: 1.8s; }

@keyframes dfOnbFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-4px); }
}

.df-onb-mascot-wrap {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 10px 0;
  z-index: 2;
}

.df-onb-halo {
  position: absolute;
  width: 190px;
  height: 190px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(184, 255, 1, 0.34) 0%, transparent 70%);
  filter: blur(12px);
  z-index: 0;
}

.df-onb-mascot-img {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 290px;
  height: auto;
  max-height: 175px;
  object-fit: contain;
  filter: drop-shadow(0 12px 24px rgba(0, 0, 0, 0.65));
  animation: dfOnbMascotBob 3.6s ease-in-out infinite;
}

.df-onb-mascot-bean {
  max-width: 195px;
  max-height: 165px;
}

.df-onb-chest-img {
  cursor: pointer;
  max-width: 205px;
  max-height: 165px;
  transition: transform 0.2s ease;
}

.df-onb-chest-img.shaking {
  animation: dfOnbChestShake 2.2s ease-in-out infinite;
}

.df-onb-chest-img:hover {
  transform: scale(1.06);
}

@keyframes dfOnbMascotBob {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-6px) scale(1.02); }
}

@keyframes dfOnbChestShake {
  0%, 100% { transform: rotate(0deg) scale(1); }
  20% { transform: rotate(-4deg) scale(1.04); }
  40% { transform: rotate(4deg) scale(1.05); }
  60% { transform: rotate(-3deg) scale(1.03); }
  80% { transform: rotate(3deg) scale(1.02); }
}

.df-onb-speech {
  position: relative;
  z-index: 2;
  width: 100%;
  padding: 11px 14px;
  border-radius: 16px;
  background: rgba(11, 5, 24, 0.9);
  border: 1.5px solid rgba(184, 255, 1, 0.5);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.5);
}

.df-onb-speech-tag {
  display: inline-block;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.05em;
  color: #B8FF01;
  margin-bottom: 3px;
}

.df-onb-speech p {
  margin: 0;
  font-size: 12.5px;
  line-height: 1.42;
  color: #F5F3FF;
}

.df-onb-copy {
  display: flex;
  flex-direction: column;
  gap: 11px;
}

.df-onb-kicker {
  display: inline-flex;
  align-self: flex-start;
  padding: 4px 11px;
  border-radius: 999px;
  background: rgba(184, 255, 1, 0.14);
  border: 1px solid rgba(184, 255, 1, 0.45);
  color: #B8FF01;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.04em;
}

.df-onb-copy h1 {
  margin: 0;
  font-size: 24px;
  font-weight: 900;
  line-height: 1.16;
  color: #FFFFFF;
  letter-spacing: -0.02em;
}

.df-onb-sub {
  margin: 0;
  font-size: 13.5px;
  line-height: 1.45;
  color: rgba(228, 218, 255, 0.84);
}

.df-onb-cards-3 {
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.df-onb-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 14px;
  border-radius: 15px;
  background: rgba(255, 255, 255, 0.045);
  border: 1px solid rgba(168, 85, 247, 0.28);
}

.df-onb-card-ic {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 11px;
  background: rgba(184, 255, 1, 0.13);
  border: 1px solid rgba(184, 255, 1, 0.36);
  font-size: 18px;
  flex-shrink: 0;
}

.df-onb-card strong {
  display: block;
  font-size: 13.5px;
  font-weight: 800;
  color: #FFFFFF;
  margin-bottom: 2px;
}

.df-onb-card small {
  display: block;
  font-size: 12px;
  line-height: 1.35;
  color: rgba(220, 210, 250, 0.8);
}

.df-onb-inline-cta {
  margin-top: 2px;
}

.df-onb-google-btn {
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  height: 44px;
  font-size: 14px;
  font-weight: 900;
}

.df-onb-connected-pill {
  padding: 10px 14px;
  border-radius: 13px;
  background: rgba(16, 185, 129, 0.16);
  border: 1.5px solid rgba(16, 185, 129, 0.55);
  color: #34D399;
  font-size: 13px;
  text-align: center;
}

.df-onb-vol-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 13px;
  background: rgba(12, 6, 26, 0.65);
  border: 1px solid rgba(168, 85, 247, 0.28);
}

.df-onb-vol-pills {
  display: flex;
  gap: 6px;
}

.df-onb-vpill {
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(168, 85, 247, 0.3);
  color: #E9D5FF;
  font-size: 11.5px;
  font-weight: 800;
  cursor: pointer;
}

.df-onb-vpill.active {
  background: #B8FF01;
  border-color: #B8FF01;
  color: #0B0518;
}

.df-onb-grid-4 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
}

.df-onb-win-box {
  padding: 11px 12px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.045);
  border: 1px solid rgba(184, 255, 1, 0.28);
}

.df-onb-wb-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  margin-bottom: 4px;
  font-size: 12px;
  font-weight: 800;
}

.df-onb-win-box small {
  display: block;
  font-size: 11.5px;
  line-height: 1.32;
  color: rgba(224, 214, 255, 0.8);
}

.df-onb-spin-cta {
  width: 100%;
  height: 46px;
  font-size: 14px;
  font-weight: 900;
  border-radius: 14px;
}

.df-onb-prize-won {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 14px;
  border-radius: 15px;
  background: linear-gradient(135deg, rgba(184, 255, 1, 0.18), rgba(16, 185, 129, 0.18));
  border: 1.5px solid #B8FF01;
}

.df-onb-pw-ic {
  font-size: 26px;
}

.df-onb-prize-won strong {
  display: block;
  font-size: 13.5px;
  color: #B8FF01;
}

.df-onb-prize-won small {
  display: block;
  font-size: 12px;
  color: #FFFFFF;
}

.df-onb-launch-grid {
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.df-onb-dest-card {
  display: flex;
  align-items: center;
  gap: 13px;
  width: 100%;
  padding: 13px 15px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.055);
  border: 1.5px solid rgba(184, 255, 1, 0.35);
  color: #FFFFFF;
  text-align: left;
  cursor: pointer;
  transition: transform 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}

.df-onb-dest-card:hover {
  transform: translateY(-2px);
  background: rgba(184, 255, 1, 0.12);
  border-color: #B8FF01;
}

.df-onb-dc-ic {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: rgba(184, 255, 1, 0.16);
  border: 1px solid rgba(184, 255, 1, 0.45);
  font-size: 21px;
  flex-shrink: 0;
}

.df-onb-dc-txt {
  flex: 1 1 auto;
}

.df-onb-dc-txt strong {
  display: block;
  font-size: 14px;
  font-weight: 900;
  color: #FFFFFF;
  margin-bottom: 2px;
}

.df-onb-dc-txt small {
  display: block;
  font-size: 12px;
  color: rgba(224, 214, 255, 0.82);
}

.df-onb-dc-arr {
  font-size: 18px;
  font-weight: 900;
  color: #B8FF01;
}

.df-onb-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 13px 20px;
  background: rgba(11, 5, 24, 0.86);
  border-top: 1px solid rgba(168, 85, 247, 0.26);
  flex-shrink: 0;
}

.df-onb-dots {
  display: flex;
  align-items: center;
  gap: 8px;
}

.df-onb-dot {
  width: 10px !important;
  min-width: 10px !important;
  height: 10px !important;
  min-height: 10px !important;
  padding: 0 !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.22) !important;
  border: none !important;
  cursor: pointer;
  transition: all 0.2s ease;
}

.df-onb-dot.done {
  background: #10B981 !important;
}

.df-onb-dot.active {
  width: 28px !important;
  min-width: 28px !important;
  background: #B8FF01 !important;
  box-shadow: 0 0 12px rgba(184, 255, 1, 0.8) !important;
}

.df-onb-prev,
.df-onb-next {
  min-width: 145px;
  height: 44px;
  border-radius: 13px;
  font-size: 13.5px;
  font-weight: 900;
}

@media (max-width: 900px) {
  .df-onb-backdrop {
    padding: 8px;
  }
  .df-onb-modal {
    max-height: 96dvh;
    border-radius: 22px;
  }
  .df-onb-top {
    padding: 11px 14px;
  }
  .df-onb-step-pills {
    display: none;
  }
  .df-onb-body {
    padding: 14px;
  }
  .df-onb-slide {
    grid-template-columns: 1fr;
    gap: 13px;
  }
  .df-onb-hero-stage {
    min-height: 220px;
    padding: 12px 12px 10px;
  }
  .df-onb-mascot-img {
    max-width: 225px;
    max-height: 132px;
  }
  .df-onb-copy h1 {
    font-size: 20px;
  }
  .df-onb-grid-4 {
    grid-template-columns: 1fr;
  }
  .df-onb-foot {
    padding: 11px 14px;
  }
  .df-onb-prev {
    min-width: 96px;
    height: 42px;
    font-size: 12.5px;
  }
  .df-onb-next {
    min-width: 155px;
    height: 42px;
    font-size: 13px;
  }
}

/* ============================================================================
   DEXFUN V17 — NON-CUSTODIAL PRIVATE KEY EXPORT, ON-CHAIN WALLET & IPHONE IOS SAFARI
   ============================================================================ */

.df-wm-pk-row {
  margin-top: 10px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.df-wm-pk-toggle {
  width: 100%;
  justify-content: center;
  border-color: rgba(184, 255, 1, 0.42) !important;
  color: #B8FF01 !important;
  font-size: 12.5px !important;
  font-weight: 800 !important;
}

.df-wm-pk-reveal {
  margin-top: 8px;
  padding: 12px;
  border-radius: 14px;
  background: rgba(10, 6, 20, 0.92);
  border: 1px solid rgba(184, 255, 1, 0.45);
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.df-wm-pk-code {
  display: block;
  padding: 10px;
  border-radius: 10px;
  background: #07040E;
  border: 1px solid rgba(168, 85, 247, 0.35);
  color: #B8FF01;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11.5px;
  word-break: break-all;
  line-height: 1.45;
  user-select: all;
}

.df-empty-onchain-box {
  padding: 18px 14px;
  text-align: center;
  border-radius: 12px;
  background: rgba(15, 9, 28, 0.72);
  border: 1px dashed rgba(168, 85, 247, 0.35);
}

.df-empty-onchain-box p {
  margin: 4px 0;
}

/* Step 4: iPhone iOS Safari UI Optimization (390x844 / 430x932) */
@media (max-width: 760px) {
  /* Prevent iOS Safari auto-zoom on input focus */
  input,
  textarea,
  select,
  .df-swap-input,
  .df-wm-email-field input,
  .df-input,
  #search {
    font-size: 16px !important;
  }

  /* Dynamic viewport height & iOS Home Indicator safe-area support */
  .df-wm-backdrop,
  .df-onb-backdrop {
    height: 100dvh;
    padding-bottom: max(8px, env(safe-area-inset-bottom));
  }

  .df-wm-modal {
    max-height: calc(100dvh - 20px - env(safe-area-inset-bottom));
  }

  #nav.df-bottom-dock {
    padding-bottom: calc(6px + env(safe-area-inset-bottom)) !important;
    height: calc(62px + env(safe-area-inset-bottom)) !important;
  }

  body {
    padding-bottom: calc(74px + env(safe-area-inset-bottom)) !important;
  }

  /* Compact above-the-fold mobile Home layout so live tokens (#tokenrows) are visible immediately on iPhone 390x844 */
  .df-home-hero {
    padding: 10px 12px !important;
    margin-bottom: 6px !important;
    border-radius: 14px !important;
  }

  .df-home-hero-art {
    display: none !important;
  }

  .df-home-hero-copy h1 {
    font-size: 1.08rem !important;
    line-height: 1.2 !important;
    margin: 2px 0 4px !important;
  }

  .df-home-hero-copy p {
    font-size: 11.5px !important;
    line-height: 1.3 !important;
    margin: 0 0 6px !important;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  .df-hero-badge {
    font-size: 10px !important;
    padding: 2px 8px !important;
  }

  .df-hero-actions {
    gap: 6px !important;
  }

  .df-hero-actions button {
    padding: 6px 10px !important;
    font-size: 11.5px !important;
    min-height: 32px !important;
  }

  .df-kpi-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 6px !important;
    margin-bottom: 6px !important;
  }

  /* Show top 2 KPI cards on mobile home to save vertical space above the fold */
  .df-kpi-strip .df-kpi-card:nth-child(n+3) {
    display: none !important;
  }

  .df-kpi-card {
    padding: 7px 10px !important;
    border-radius: 11px !important;
  }

  .df-kpi-val {
    font-size: 14px !important;
  }

  /* Compact King of the Curve & hide secondary Win-Win card on mobile Home above-the-fold */
  .df-home-Command-strip .df-eco-card {
    display: none !important;
  }

  .df-koc-card {
    padding: 9px 11px !important;
    margin-bottom: 6px !important;
  }

  .df-koc-art-col {
    display: none !important;
  }

  .df-koc-desc {
    display: none !important;
  }

  .df-koc-progress-wrap {
    margin: 4px 0 !important;
  }

  .df-koc-actions button {
    padding: 5px 9px !important;
    font-size: 11px !important;
    min-height: 30px !important;
  }

  /* Hide verbose list-rule / delayed-label notes on mobile Home so token rows move right up */
  .df-home-main-col > .list-summary,
  .df-home-main-col > .list-rule,
  .df-home-main-col > .list-order-status {
    display: none !important;
  }

  .df-markets-tabstrip-v4 {
    margin-bottom: 4px !important;
  }

  .df-markets-filter-strip {
    padding: 4px 0 !important;
    margin-bottom: 4px !important;
  }

  /* Prevent mobile 44px touch-target rule from inflating onboarding progress dots */
  .df-onb-foot .df-onb-dots button.df-onb-dot {
    width: 8px !important;
    min-width: 8px !important;
    max-width: 8px !important;
    height: 8px !important;
    min-height: 8px !important;
    max-height: 8px !important;
    padding: 0 !important;
    border-radius: 999px !important;
  }

  .df-onb-foot .df-onb-dots button.df-onb-dot.active {
    width: 24px !important;
    min-width: 24px !important;
    max-width: 24px !important;
  }

  .df-onb-foot .df-onb-prev,
  .df-onb-foot .df-onb-next {
    min-width: 92px !important;
    width: auto !important;
    padding: 0 14px !important;
    white-space: nowrap !important;
  }

  /* Wallet top actions & Rewards 4-KPI grid wrap cleanly on 2x2 on iPhone */
  .df-wtc-actions-3,
  .df-kpi-grid.df-bot-kpis-v4,
  .df-rewards-v11-wrap .df-kpi-grid.df-bot-kpis-v4 {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  /* Hide extra "How It Works" header button on narrow 390px iPhone header so brand title never overlaps */
  header .df-how-pill {
    display: none !important;
  }
}