.t-wrap{
  border-radius: var(--radius);
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.03);
  box-shadow: var(--shadow);
  padding: 14px;
  outline:none;
  display:flex;
  flex-direction:column;
}

.t-controls{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:12px;
  flex: 0 0 auto;
}

.t-btn{
  width:38px;
  height:38px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.04);
  color: var(--text);
  font-weight: 800;
  cursor:pointer;
}

.t-live{
  color: rgba(233,238,249,.78);
  font-size: 13px;
  font-weight: 650;
}

/* Fixed-height frame */
.t-track{
  position:relative;
  overflow:hidden;
  height: 320px;   /* größer */
  max-height: 60vh;
}

/* Slides in frame */
.t-slide{
  position:absolute;
  inset:0;
  display:none;
}
.t-slide.is-active{
  display:flex;
  flex-direction:column;
}

/* This is the vertical scroll area */
.t-quote{
  flex: 1 1 auto;
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: 10px;
  font-size: 16px;
  line-height: 1.65;
  color: rgba(233,238,249,.92);
  white-space: pre-wrap;
  overscroll-behavior: contain;
}

.t-person{
  flex: 0 0 auto;
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:12px;
  padding-top:12px;
  border-top:1px solid rgba(255,255,255,.10);
}

.t-avatar{
  width:44px;
  height:44px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.16);
  object-fit:cover;
  background: rgba(255,255,255,.03);
}

.t-person-meta{display:flex; flex-direction:column; gap:2px}
.t-name{font-weight:800; font-size:13px}
.t-title{color: rgba(233,238,249,.70); font-weight:650; font-size:12px}

.t-social{
  display:inline-flex;
  width:fit-content;
  margin-top:4px;
  font-weight:800;
  font-size:12px;
  text-decoration:none;
  border-bottom:1px solid rgba(124,92,255,.55);
}

.t-dots{
  flex: 0 0 auto;
  display:flex;
  gap:8px;
  justify-content:center;
  margin-top:12px;
}

.t-dot{
  width:10px;
  height:10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.22);
  background: transparent;
  cursor:pointer;
  padding:0;
}
.t-dot.is-active{
  background: rgba(124,92,255,.9);
  border-color: rgba(124,92,255,.9);
}

@media (max-width: 920px){
  .t-track{ height: 360px; }
}
