/* =================== tab.css =================== */
.tab {
  padding: var(--sp-12) var(--sp-16);
  border: none;
  background: transparent;
  cursor: pointer;
  font-size: var(--fs-15);
  font-weight: var(--fw-500);
  color: var(--c-text-secondary);
  position: relative;
  white-space: nowrap;
  transition: color var(--tr-fast);
  will-change: color;
}
.tab:hover {
  color: var(--c-text);
}
.tab.active {
  color: var(--c-primary);
  font-weight: var(--fw-600);
}
.tab.active::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, var(--c-primary) 0%, var(--c-accent) 100%);
  animation: slideIn var(--tr-base);
}