.yt-tool-wrap{
  max-width: 980px;
  margin: 120px auto 60px;
}

.yt-hero,
.yt-form-box,
.yt-result{
  border-radius: 24px;
  overflow: hidden;
}

.yt-hero{
  background:
    radial-gradient(600px 180px at 100% 0%, rgba(255,0,0,.08), transparent 60%),
    linear-gradient(180deg, #ffffff 0%, #fbfcfe 100%);
}

.yt-badge{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border-radius: 999px;
  background: #fff1f1;
  color: #b91c1c;
  font-weight: 700;
  border: 1px solid #ffd4d4;
}

.yt-title{
  font-size: clamp(1.8rem, 4vw, 2.7rem);
  font-weight: 800;
}

.yt-subtitle{
  max-width: 680px;
  margin: 0 auto;
  color: #6b7280;
  font-size: 1.05rem;
}

.yt-form-box .form-control{
  border-radius: 16px;
  min-height: 58px;
}

.yt-form-box .btn{
  border-radius: 16px;
  min-height: 58px;
}

.yt-channel-head{
  display:flex;
  gap:20px;
  align-items:center;
  flex-wrap:wrap;
}

.yt-avatar-wrap{ flex: 0 0 auto; }

.yt-avatar{
  width: 104px;
  height: 104px;
  object-fit: cover;
  border-radius: 50%;
  border: 4px solid #fff;
  box-shadow: 0 12px 28px rgba(0,0,0,.12);
  background:#fff;
}

.yt-avatar-fallback{
  display:grid;
  place-items:center;
  color:#dc2626;
  font-size: 2rem;
}

.yt-channel-meta{ flex:1 1 360px; }

.yt-channel-meta h2{
  font-size: clamp(1.35rem, 3vw, 2rem);
  font-weight: 800;
}

.yt-handle{
  padding: 6px 10px;
  border-radius: 999px;
  background: #f3f4f6;
  color: #374151;
  font-size: .95rem;
}

.yt-desc{
  color: #6b7280;
  line-height: 1.9;
}

.yt-stats-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap:14px;
}

.yt-stat-card{
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  border: 1px solid #edf2f7;
  border-radius: 20px;
  padding: 20px;
}

.yt-stat-label{
  color: #6b7280;
  font-size: .95rem;
  margin-bottom: 8px;
}

.yt-stat-value{
  font-weight: 800;
  font-size: clamp(1.2rem, 2.8vw, 1.9rem);
  color: #111827;
}

.yt-note{
  background:#f8fafc;
  padding: 12px 14px;
  border-radius: 14px;
}

@media (max-width: 768px){
  .yt-tool-wrap{ margin-top: 100px; }
  .yt-stats-grid{ grid-template-columns: 1fr; }
  .yt-channel-head{ align-items:flex-start; }
}