/* =========================================================
   CoinASX V87
   - 自选/热门/商品/涨幅榜/跌幅榜 增加距离感
   - 快捷功能：一行 5 个
   - 保留原按钮和原点击
   - 加密新闻弹窗
   ========================================================= */

/* ---------- 行情分类：更舒展 ---------- */
.cx84-market-tabs{
  width:100%!important;
  max-width:760px!important;
  margin:34px auto 24px!important;
  padding:0 6px 2px!important;
  display:flex!important;
  align-items:flex-end!important;
  justify-content:flex-start!important;
  gap:28px!important;
  overflow-x:auto!important;
  white-space:nowrap!important;
  scrollbar-width:none!important;
}

.cx84-market-tabs::-webkit-scrollbar{
  display:none!important;
}

.cx84-market-tab{
  flex:0 0 auto!important;
  position:relative!important;
  padding:4px 0 12px!important;
  color:#8f949d!important;
  background:transparent!important;
  border:0!important;
  font-size:16px!important;
  line-height:22px!important;
  font-weight:700!important;
  letter-spacing:.1px!important;
}

.cx84-market-tab.active{
  color:#fff!important;
}

.cx84-market-tab.active:after{
  content:""!important;
  position:absolute!important;
  left:50%!important;
  bottom:0!important;
  width:28px!important;
  height:3px!important;
  border-radius:3px!important;
  background:#fff!important;
  transform:translateX(-50%)!important;
}

/* ---------- 快捷功能：一行 5 个 ---------- */
.home .quick-nav,
.new-home .quick-nav,
.home .quick,
.new-home .quick,
.home .menu-list,
.new-home .menu-list,
.home .tools,
.new-home .tools{
  width:100%!important;
  max-width:720px!important;
  margin:24px auto 36px!important;
  padding:0 10px!important;
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  column-gap:12px!important;
  row-gap:20px!important;
  align-items:start!important;
  justify-items:center!important;
}

/* 6个原功能按钮：第6个第二行居中 */
.home .quick-item:nth-child(6),
.new-home .quick-item:nth-child(6),
.home .quick > :nth-child(6),
.new-home .quick > :nth-child(6),
.home .menu-list > :nth-child(6),
.new-home .menu-list > :nth-child(6),
.home .tools > :nth-child(6),
.new-home .tools > :nth-child(6){
  grid-column:3!important;
}

.home .quick-item,
.new-home .quick-item,
.home .quick > *,
.new-home .quick > *,
.home .menu-list > *,
.new-home .menu-list > *,
.home .tools > *,
.new-home .tools > *{
  width:100%!important;
  min-width:0!important;
  min-height:78px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:9px!important;
  padding:5px 2px!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  text-align:center!important;
}

.home .quick-icon,
.new-home .quick-icon,
.home .quick-item .icon,
.new-home .quick-item .icon,
.home .quick-item > img,
.new-home .quick-item > img{
  width:46px!important;
  height:46px!important;
  min-width:46px!important;
  min-height:46px!important;
  margin:0 auto!important;
  display:grid!important;
  place-items:center!important;
  border-radius:50%!important;
  object-fit:contain!important;
}

.home .quick-item > span:last-child,
.new-home .quick-item > span:last-child{
  width:100%!important;
  color:#d3d6db!important;
  font-size:11px!important;
  line-height:16px!important;
  font-weight:500!important;
  text-align:center!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

/* ---------- 行情卡片距离 ---------- */
.home .market-cards,
.new-home .market-cards{
  margin-top:0!important;
  margin-bottom:34px!important;
  gap:14px!important;
}

.home .market-card,
.new-home .market-card{
  border-radius:16px!important;
}

/* ---------- 新闻入口 ---------- */
.cx87-news-trigger{
  width:100%;
  max-width:760px;
  height:48px;
  margin:4px auto 22px;
  padding:0 15px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border:1px solid #24272e;
  border-radius:14px;
  background:#16181c;
  color:#f4f5f6;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

.cx87-news-trigger-left{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}

.cx87-news-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#18c99b;
  box-shadow:0 0 0 5px rgba(24,201,155,.08);
}

.cx87-news-trigger-title{
  font-size:14px;
  font-weight:750;
}

.cx87-news-trigger-sub{
  margin-left:7px;
  color:#7f858e;
  font-size:11px;
  font-weight:500;
}

.cx87-news-arrow{
  color:#858b94;
  font-size:18px;
}

/* ---------- 新闻弹窗 ---------- */
.cx87-news-mask{
  position:fixed;
  inset:0;
  z-index:99998;
  display:none;
  align-items:flex-end;
  justify-content:center;
  padding:0;
  background:rgba(0,0,0,.64);
  backdrop-filter:blur(3px);
  -webkit-backdrop-filter:blur(3px);
}

.cx87-news-mask.open{
  display:flex;
}

.cx87-news-panel{
  width:min(100%,560px);
  max-height:78vh;
  background:#101216;
  border:1px solid #272a31;
  border-bottom:0;
  border-radius:22px 22px 0 0;
  overflow:hidden;
  box-shadow:0 -16px 48px rgba(0,0,0,.34);
  animation:cx87Up .2s ease-out;
}

@keyframes cx87Up{
  from{transform:translateY(24px);opacity:.35}
  to{transform:translateY(0);opacity:1}
}

.cx87-news-head{
  height:60px;
  padding:0 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid #202329;
}

.cx87-news-head h3{
  margin:0;
  color:#fff;
  font-size:17px;
  font-weight:800;
}

.cx87-news-source{
  margin-left:8px;
  color:#777d86;
  font-size:11px;
  font-weight:500;
}

.cx87-news-close{
  width:34px;
  height:34px;
  border:0;
  border-radius:50%;
  background:#1c1f24;
  color:#bec2c8;
  font-size:20px;
  line-height:34px;
  cursor:pointer;
}

.cx87-news-list{
  max-height:calc(78vh - 60px);
  overflow-y:auto;
  padding:8px 16px calc(20px + env(safe-area-inset-bottom));
}

.cx87-news-item{
  display:block;
  padding:14px 2px;
  border-bottom:1px solid #1d2025;
  text-decoration:none;
}

.cx87-news-item:last-child{
  border-bottom:0;
}

.cx87-news-title{
  color:#eef0f2;
  font-size:14px;
  line-height:1.48;
  font-weight:650;
}

.cx87-news-meta{
  margin-top:7px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  color:#747a83;
  font-size:11px;
}

.cx87-news-empty{
  padding:32px 12px;
  color:#7d838c;
  font-size:13px;
  text-align:center;
}

/* ---------- 手机 ---------- */
@media(max-width:600px){
  .cx84-market-tabs{
    margin-top:30px!important;
    margin-bottom:22px!important;
    gap:24px!important;
    padding-left:2px!important;
    padding-right:2px!important;
  }

  .home .quick-nav,
  .new-home .quick-nav,
  .home .quick,
  .new-home .quick,
  .home .menu-list,
  .new-home .menu-list,
  .home .tools,
  .new-home .tools{
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    column-gap:8px!important;
    row-gap:18px!important;
    margin-top:22px!important;
    margin-bottom:36px!important;
    padding-left:4px!important;
    padding-right:4px!important;
  }

  .home .quick-item,
  .new-home .quick-item{
    min-height:75px!important;
  }

  .home .quick-icon,
  .new-home .quick-icon,
  .home .quick-item .icon,
  .new-home .quick-item .icon,
  .home .quick-item > img,
  .new-home .quick-item > img{
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    min-height:42px!important;
  }

  .home .quick-item > span:last-child,
  .new-home .quick-item > span:last-child{
    font-size:10px!important;
  }

  .home .market-cards,
  .new-home .market-cards{
    gap:12px!important;
    margin-bottom:30px!important;
  }

  .cx87-news-trigger{
    height:46px;
    margin-bottom:20px;
  }
}

@media(max-width:360px){
  .cx84-market-tabs{
    gap:20px!important;
  }

  .cx84-market-tab{
    font-size:14px!important;
  }

  .home .quick-nav,
  .new-home .quick-nav,
  .home .quick,
  .new-home .quick{
    column-gap:4px!important;
  }

  .home .quick-icon,
  .new-home .quick-icon{
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
    min-height:38px!important;
  }

  .home .quick-item > span:last-child,
  .new-home .quick-item > span:last-child{
    font-size:9px!important;
  }
}

/* ---------- V88 黑色按钮文字 ---------- */
.cx84-market-tab,
.cx84-market-tab.active{
  color:#000!important;
}

.cx84-market-tab.active:after{
  background:#000!important;
}

.home .quick-item,
.new-home .quick-item,
.home .quick-item *,
.new-home .quick-item *,
.home .quick > *,
.new-home .quick > *,
.home .quick > * *,
.new-home .quick > * *,
.home .menu-list > *,
.new-home .menu-list > *,
.home .menu-list > * *,
.new-home .menu-list > * *,
.home .tools > *,
.new-home .tools > *,
.home .tools > * *,
.new-home .tools > * *{
  color:#000!important;
}

/* ---------- V88 行情卡片字体黑色 ---------- */
.home .market-card,
.new-home .market-card,
.home .market-card *,
.new-home .market-card *{
  color:#000!important;
}

/* 涨跌色继续保留，避免全部变成黑色 */
.home .market-card .up,
.new-home .market-card .up,
.home .market-card .rise,
.new-home .market-card .rise,
.home .market-card .positive,
.new-home .market-card .positive{
  color:#10b981!important;
}

.home .market-card .down,
.new-home .market-card .down,
.home .market-card .fall,
.new-home .market-card .fall,
.home .market-card .negative,
.new-home .market-card .negative{
  color:#ef476f!important;
}

/* ---------- V88 消除行情卡片闪动 ---------- */
.home .market-cards > .market-card,
.new-home .market-cards > .market-card,
.home .market-cards > .market-card:not([hidden]),
.new-home .market-cards > .market-card:not([hidden]){
  animation:none!important;
  transition:none!important;
  transform:none!important;
  opacity:1!important;
  will-change:auto!important;
}

/* hidden 仍然只负责分类隐藏 */
.home .market-cards > .market-card[hidden],
.new-home .market-cards > .market-card[hidden]{
  display:none!important;
}

/* 禁止行情刷新时产生淡入淡出 */
.home .market-card *,
.new-home .market-card *{
  animation:none!important;
  transition-property:color,background-color!important;
  transition-duration:0s!important;
}