html, body, #root {
  width: 100%;
  max-width: 100%;
  height: 100vh;
  height: 100svh;
  max-height: 100vh;
  max-height: 100svh;
  overflow: hidden;
  overflow-x: hidden;
  overscroll-behavior: none;
  touch-action: auto;
  background: #f2f4f7;
}
body {
  min-height: 100vh;
  min-height: 100svh;
}
#root {
  position: relative;
  display: flex;
  flex-direction: column;
}
#root > div {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: 100vh;
  height: 100svh;
  max-height: 100vh;
  max-height: 100svh;
  min-height: 0;
  overflow: hidden;
  overflow-x: hidden;
  touch-action: auto;
  background: #f2f4f7 !important;
  justify-content: flex-start !important;
  align-items: stretch !important;
}
#root > div > div {
  max-width: none !important;
  width: 100% !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
  align-self: stretch !important;
  min-height: 0 !important;
  height: 100% !important;
  max-height: 100% !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  border: 0 !important;
}
#root .h-\[100dvh\],
#root .min-h-\[100dvh\],
#root .max-h-\[100dvh\] {
  height: 100vh !important;
  height: 100svh !important;
  min-height: 100vh !important;
  min-height: 100svh !important;
  max-height: 100vh !important;
  max-height: 100svh !important;
}
#root .fixed.inset-0 {
  max-width: none !important;
}
#root main,
#root [class*="overflow-y-auto"],
#root [class*="overflow-auto"],
#root [class*="overflow-y-scroll"],
#root [class*="overflow-scroll"] {
  overflow-y: scroll !important;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  touch-action: pan-y;
  min-height: 0;
  flex: 1 1 auto;
}
#root canvas {
  touch-action: none !important;
}
#root [style*="height: 280px"] {
  touch-action: none !important;
}
[data-onchain-full-name="1"] {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  word-break: break-word;
  cursor: pointer;
  pointer-events: auto !important;
  max-width: 100%;
}
#onchain-name-tip {
  position: fixed;
  z-index: 80;
  max-width: min(280px, 80vw);
  padding: 10px 12px;
  border-radius: 12px;
  background: #111827;
  color: #fff;
  font: 800 13px/1.35 Inter, ui-sans-serif, system-ui, sans-serif;
  word-break: break-all;
  box-shadow: 0 12px 32px rgba(0,0,0,.28);
  pointer-events: none;
}
.min-h-screen {
  min-height: 100vh !important;
  min-height: 100svh !important;
}
button.from-purple-50.to-indigo-50,
.from-purple-50.to-indigo-50.border-purple-100 {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
}
[data-home-dead="1"] {
  display: none !important;
}
#root .bg-black.text-white {
  color: #fff !important;
}
#root .bg-black.text-white .text-\[32px\],
#root .bg-black.text-white [data-onchain-hero] {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}
#root .grid.grid-cols-3 > .bg-gray-50 {
  background: #fff !important;
}
@supports not (height: 100svh) {
  html, body, #root, #root > div {
    height: 100vh;
    height: 100dvh;
    max-height: 100vh;
    max-height: 100dvh;
  }
}

.market-item-row,
.ticker-price-container {
  contain: layout style;
  min-height: 48px;
  line-height: 1.2;
}
.ticker-price,
.price,
[data-price],
[data-price-symbol] {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
  padding: 0 !important;
}

/* 禁用全局翻译并锁死 0 顶距，防止翻译栏挤压抖动 */
html, body {
  top: 0 !important;
  margin-top: 0 !important;
  position: static !important;
}

/* 隐藏各种 Web3 钱包/浏览器注入的翻译 Banner */
.goog-te-banner-frame,
.skiptranslate,
iframe[class*="goog-te-banner-frame"],
iframe[class*="translated-ltr"],
iframe[class*="translated-rtl"],
font.google-translate {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
}

/* 资产卡片迷你趋势图防溢出 */
[data-hero-card] {
  overflow: hidden !important;
  box-sizing: border-box !important;
}
[data-hero-card] > * {
  box-sizing: border-box !important;
}
[data-hero-chart] {
  flex-shrink: 0 !important;
  max-width: 30% !important;
  min-width: 0 !important;
  overflow: hidden !important;
}

/* 全局设计系统：字体 */
html, body, #root {
  font-family: -apple-system, BlinkMacSystemFont, 'Inter', 'Segoe UI', 'PingFang SC', 'Helvetica Neue', sans-serif !important;
}

/* 资产黑卡：标题单行不折行 + 迷你趋势图固定 30% 宽不溢出 */
[data-hero-card] [class*="font-black"],
[data-hero-card] h1, [data-hero-card] h2, [data-hero-card] h3 {
  white-space: nowrap !important;
  letter-spacing: -.01em;
}
[data-hero-chart] {
  flex: 0 0 30% !important;
  width: 30% !important;
  max-width: 30% !important;
}
[data-balance-card="1"] .flex[data-hero-chart],
[data-hero-card="1"] .flex[data-hero-chart],
[data-balance-card="1"] button[data-hero-chart],
[data-hero-card="1"] button[data-hero-chart],
[data-balance-card="1"] > .flex.justify-between,
[data-hero-card="1"] > .flex.justify-between {
  flex: 1 1 auto !important;
  width: 100% !important;
  max-width: none !important;
  overflow: visible !important;
}
[data-balance-card="1"] > .flex.justify-between > .flex,
[data-hero-card="1"] > .flex.justify-between > .flex,
[data-balance-card="1"] > .flex.justify-between button,
[data-hero-card="1"] > .flex.justify-between button {
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: none !important;
  overflow: visible !important;
}

/* 资产卡标题：强制横向单行，防止竖排/换行 */
[data-hero-card] [class*="text-"],
[data-hero-card] [class*="font-"],
[data-hero-card] p,
[data-hero-card] h1, [data-hero-card] h2, [data-hero-card] h3 {
  white-space: nowrap !important;
  word-break: keep-all !important;
}

/* iOS 刘海 / 动态岛：顶栏与资产页顶部避开状态栏 */
#root .sticky.top-0,
#root header {
  height: auto !important;
  min-height: 48px !important;
  max-height: none !important;
  padding-top: max(8px, env(safe-area-inset-top)) !important;
  box-sizing: border-box !important;
  overflow: visible !important;
  line-height: 1.25 !important;
}
#root .sticky.top-0.flex,
#root header.flex {
  align-items: center !important;
}
#root .bg-gradient-to-b.from-gray-50.to-white:has([data-balance-card="1"]) {
  padding-top: max(12px, env(safe-area-inset-top)) !important;
  box-sizing: border-box !important;
}

/* 总资产卡：取消写死高度，纵向自适应，避免和绑定行、今日收益叠在一起 */
[data-balance-card="1"],
[data-hero-card="1"] {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 14px !important;
  overflow: visible !important;
  position: relative !important;
  z-index: 1 !important;
  margin-bottom: 16px !important;
}
[data-balance-card="1"] > .absolute {
  z-index: 0 !important;
}
[data-balance-card="1"] > :not(.absolute) {
  position: relative !important;
  z-index: 1 !important;
  top: auto !important;
  height: auto !important;
  overflow: visible !important;
}
[data-balance-card="1"] > .flex.justify-between {
  flex-wrap: wrap !important;
  row-gap: 8px !important;
}
[data-balance-card="1"] .rounded-full {
  flex: 0 0 auto !important;
  max-width: 100% !important;
}
#tron-bind-card {
  position: relative !important;
  inset: auto !important;
  top: auto !important;
  transform: none !important;
  width: 100% !important;
  margin: 18px 0 10px !important;
  z-index: 2 !important;
}
#tron-bind-input,
#tron-bind-btn,
#tron-bind-change {
  line-height: 1.25 !important;
}

/* 资产总览和百分比卡盖在总资产卡上面，避免被黑卡光晕压住 */
#root .bg-gradient-to-b.from-gray-50.to-white:has([data-balance-card="1"]) + .px-4 {
  position: relative !important;
  z-index: 3 !important;
  margin-top: 8px !important;
}
#root .grid.grid-cols-3 {
  position: relative !important;
  z-index: 3 !important;
}

/* 金额和英文标签行高，避免上下被切 */
[data-balance-card="1"] .font-mono,
[data-balance-card="1"] .text-\[32px\],
[data-balance-card="1"] .text-\[12px\],
[data-balance-card="1"] .text-\[11px\],
#root .grid.grid-cols-3 .font-mono,
#root .grid.grid-cols-3 .text-\[13px\],
#root .grid.grid-cols-3 .text-\[11px\],
#root .grid.grid-cols-3 .text-\[10px\] {
  line-height: 1.25 !important;
  overflow: visible !important;
}

/* iOS 手感：侧边栏、底部抽屉、Tab 切换。只改过渡，不改结构逻辑。 */
@keyframes iosDrawerIn {
  from { transform: translateX(-100%); }
  to { transform: translateX(0); }
}
@keyframes iosSheetUp {
  from { transform: translateY(100%); }
  to { transform: translateY(0); }
}
@keyframes iosOverlayIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes iosTabFade {
  from { opacity: 0; transform: scale(0.98); }
  to { opacity: 1; transform: scale(1); }
}
@keyframes iosPop {
  from { opacity: 0; transform: scale(0.96) translateY(10px); }
  to { opacity: 1; transform: none; }
}
@keyframes iosTabLine {
  from { transform: translateX(-36%) scaleX(0.45); opacity: 0.2; }
  to { transform: translateX(0) scaleX(1); opacity: 1; }
}

#root .fixed.inset-0.z-50.bg-black\/60 {
  background: rgba(0, 0, 0, 0.4) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  backdrop-filter: blur(12px) !important;
  animation: iosOverlayIn 0.35s cubic-bezier(0.32, 0.72, 0, 1) both;
}

#root .slide-in-from-left {
  transition: transform 0.35s cubic-bezier(0.32, 0.72, 0, 1);
  animation: iosDrawerIn 0.35s cubic-bezier(0.32, 0.72, 0, 1) backwards;
}

#root .fixed.inset-0.items-end > .rounded-t-\[28px\],
#root .fixed.inset-0.justify-end > .rounded-t-\[28px\],
#root .fixed.inset-0.justify-end > .rounded-t-3xl {
  border-top-left-radius: 28px !important;
  border-top-right-radius: 28px !important;
  background: rgba(255, 255, 255, 0.85) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  backdrop-filter: blur(20px) !important;
}

#root .slide-in-from-bottom {
  transition: transform 0.35s cubic-bezier(0.32, 0.72, 0, 1);
  animation: iosSheetUp 0.35s cubic-bezier(0.32, 0.72, 0, 1) backwards;
}

#root .fixed.inset-0.backdrop-blur-sm.items-end > .rounded-t-\[28px\] {
  position: relative;
}
#root .fixed.inset-0.backdrop-blur-sm.items-end > .rounded-t-\[28px\]::before {
  content: "";
  position: absolute;
  top: 8px;
  left: 50%;
  width: 36px;
  height: 5px;
  margin-left: -18px;
  border-radius: 100px;
  background: rgba(60, 60, 67, 0.28);
  pointer-events: none;
}
#root .zoom-in-95 {
  animation: iosPop 0.28s cubic-bezier(0.32, 0.72, 0, 1) backwards;
}

#root .animate-in.fade-in:not(.fixed),
#root .min-h-full.pb-28,
#root .min-h-screen.pb-24 {
  animation: iosTabFade 0.2s cubic-bezier(0.32, 0.72, 0, 1) backwards;
}

#root nav.flex.items-center.justify-between.px-2 > button {
  transition: transform 150ms cubic-bezier(0.32, 0.72, 0, 1);
  -webkit-tap-highlight-color: transparent;
}
#root nav.flex.items-center.justify-between.px-2 > button:active {
  transform: scale(0.9);
}

#root .border-b.border-gray-100 .h-\[2\.5px\].rounded-full,
#root .border-b.border-gray-100 .h-\[2px\].rounded-full {
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  transform-origin: left center;
  animation: iosTabLine 0.25s cubic-bezier(0.4, 0, 0.2, 1) backwards;
}