.t-float-left { 
 | 
  float: left; 
 | 
} 
 | 
.t-float-right { 
 | 
  float: right; 
 | 
} 
 | 
@keyframes tdesign-fade-out { 
 | 
  from { 
 | 
    opacity: 1; 
 | 
  } 
 | 
  to { 
 | 
    opacity: 0; 
 | 
  } 
 | 
} 
 | 
.hotspot-expanded.relative { 
 | 
  position: relative; 
 | 
} 
 | 
.hotspot-expanded::after { 
 | 
  content: ''; 
 | 
  display: block; 
 | 
  position: absolute; 
 | 
  left: 0; 
 | 
  top: 0; 
 | 
  right: 0; 
 | 
  bottom: 0; 
 | 
  transform: scale(1.5); 
 | 
} 
 | 
.t-navbar--fixed .t-navbar__content { 
 | 
  position: fixed; 
 | 
  top: 0; 
 | 
  left: 0; 
 | 
  z-index: 5001; 
 | 
} 
 | 
.t-navbar--visible { 
 | 
  display: ''; 
 | 
} 
 | 
.t-navbar--visible-animation { 
 | 
  opacity: 1; 
 | 
  transition: opacity 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); 
 | 
} 
 | 
.t-navbar--hide-animation { 
 | 
  opacity: 0; 
 | 
  transition: opacity 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); 
 | 
} 
 | 
.t-navbar--hide { 
 | 
  display: none; 
 | 
} 
 | 
.t-navbar__placeholder { 
 | 
  height: var(--td-navbar-height, 96rpx); 
 | 
  padding-top: var(--td-navbar-padding-top, 40rpx); 
 | 
  position: relative; 
 | 
  visibility: hidden; 
 | 
} 
 | 
.t-navbar__content { 
 | 
  position: relative; 
 | 
  z-index: 1; 
 | 
  height: var(--td-navbar-height, 96rpx); 
 | 
  width: calc(100% - var(--td-navbar-right, 190rpx)); 
 | 
  padding-right: var(--td-navbar-right, 190rpx); 
 | 
  padding-top: var(--td-navbar-padding-top, 40rpx); 
 | 
  color: var(--td-navbar-color, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))); 
 | 
  background: var(--td-navbar-bg-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff))); 
 | 
  display: flex; 
 | 
  align-items: center; 
 | 
} 
 | 
.t-navbar__left { 
 | 
  position: relative; 
 | 
  box-sizing: border-box; 
 | 
  display: flex; 
 | 
  align-items: center; 
 | 
  margin-left: var(--td-spacer-1, 24rpx); 
 | 
} 
 | 
.t-navbar__left-arrow { 
 | 
  font-size: var(--td-navbar-left-arrow-size, 48rpx); 
 | 
} 
 | 
.t-navbar__capsule { 
 | 
  box-sizing: border-box; 
 | 
  width: var(--td-navbar-capsule-width, 176rpx); 
 | 
  height: var(--td-navbar-capsule-height, 64rpx); 
 | 
  display: flex; 
 | 
  align-items: center; 
 | 
} 
 | 
.t-navbar__capsule::before { 
 | 
  content: ''; 
 | 
  position: absolute; 
 | 
  z-index: -1; 
 | 
  top: 0; 
 | 
  left: 0; 
 | 
  width: 200%; 
 | 
  height: 200%; 
 | 
  transform: scale(0.5); 
 | 
  transform-origin: 0 0; 
 | 
  box-sizing: border-box; 
 | 
  border-radius: calc(var(--td-navbar-capsule-border-radius, 32rpx) * 2); 
 | 
  border: 2rpx solid var(--td-navbar-capsule-border-color, #e3e6ea); 
 | 
} 
 | 
.t-navbar__capsule:empty { 
 | 
  display: none; 
 | 
} 
 | 
.t-navbar__center { 
 | 
  font-size: 36rpx; 
 | 
  text-align: center; 
 | 
  position: absolute; 
 | 
  left: var(--td-navbar-right, 190rpx); 
 | 
  width: calc(100% - var(--td-navbar-right, 190rpx) * 2); 
 | 
  height: var(--td-navbar-height, 96rpx); 
 | 
  line-height: var(--td-navbar-height, 96rpx); 
 | 
  flex: 1; 
 | 
  display: flex; 
 | 
  align-items: center; 
 | 
  justify-content: center; 
 | 
  overflow: hidden; 
 | 
} 
 | 
.t-navbar__center:empty { 
 | 
  display: none; 
 | 
} 
 | 
.t-navbar__center-title { 
 | 
  font-size: var(--td-navbar-title-font-size, 36rpx); 
 | 
  text-overflow: ellipsis; 
 | 
  white-space: nowrap; 
 | 
  overflow: hidden; 
 | 
  font-weight: var(--td-navbar-title-font-weight, 600); 
 | 
} 
 |