/* Binance-like TF bar + 更多 sheet */
.tf{
  gap:0;
  padding:0 4px;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.tf::-webkit-scrollbar{display:none!important;height:0!important}
.tf button{
  color:var(--muted);
  background:transparent;
  border:0;
  border-radius:0;
  flex:1 0 auto;
  min-width:48px;
  min-height:44px;
  padding:8px 10px;
  font-size:13px;
  font-weight:500;
  white-space:nowrap;
}
.tf button.on{
  background:transparent;
  color:var(--text);
  font-weight:800;
}
.tf button.tf-more{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:2px;
  min-width:56px;
  color:var(--muted);
  font-weight:500;
}
.tf button.tf-more.on{
  color:var(--text);
  font-weight:800;
}
.tf .tf-caret{
  font-size:9px;
  line-height:1;
  opacity:.75;
  transform:translateY(1px);
}
.tf-more-sheet{
  position:absolute;
  inset:0;
  z-index:50;
  display:none;
  align-items:flex-end;
  background:rgba(0,0,0,.55);
}
.tf-more-sheet.on{display:flex}
.tf-more-panel{
  width:100%;
  max-height:56%;
  background:#12161c;
  border-radius:16px 16px 0 0;
  border-top:1px solid #2a323c;
  padding:8px 12px calc(16px + env(safe-area-inset-bottom));
  overflow:auto;
}
.tf-more-h{
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-size:15px;
  font-weight:700;
  margin-bottom:10px;
}
.tf-more-x{
  border:0;
  background:transparent;
  color:var(--muted);
  min-width:44px;
  min-height:44px;
  font-size:24px;
}
.tf-more-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
}
.tf-more-grid button{
  min-height:48px;
  border-radius:8px;
  border:1px solid #2a323c;
  background:#1a1f27;
  color:var(--text);
  font-size:13px;
  font-weight:700;
}
.tf-more-grid button.on{
  border-color:var(--yellow);
  color:var(--yellow);
  background:#2a2416;
}