/* Overall Wrapper */
.th-tiktk-wrapper{
  max-width:750px;
  margin:20px auto;
  padding:20px;
  background:#ffffff;
  border-radius:14px;
  box-shadow:0 10px 35px rgba(0,0,0,0.08);
  font-family:'Segoe UI',Arial,Helvetica;
}

/* Brand */
.th-brand{
  text-align:center;
  font-size:26px;
  font-weight:800;
  color:#005dff;
  margin-bottom:20px;
}

/* Input */
.th-input-wrap{text-align:center;margin-bottom:18px;}
.th-input{
  width:85%;
  max-width:560px;
  padding:14px 20px;
  border-radius:20px;
  border:2px solid #d6dbff;
  background:#f7f8ff;
  font-size:18px;
}
.th-input:focus{
  outline:none;
  border-color:#7a8cff;
  background:#ffffff;
}

/* Button */
.th-btn{
  margin-top:15px;
  width:45%;
  padding:12px 0;
  border-radius:20px;
  border:0;
  background:#005dff;
  color:#fff;
  font-size:18px;
  font-weight:700;
  cursor:pointer;
}
.th-btn:hover{background:#0041c8;}

/* Spinner */
.th-spinner{
  display:none;
  margin:20px auto;
  height:45px;width:45px;
  border-radius:50%;
  border:5px solid rgba(0,0,0,0.12);
  border-top-color:#005dff;
  animation:spin 0.9s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg);}}

/* PROFILE CARD – colorful */
.th-profile-card{
  padding:16px;
  background:linear-gradient(135deg, #0a84ff, #00d4ff);
  color:#fff;
  border-radius:12px;
  margin:18px 0;
  display:flex;
  align-items:center;
  gap:16px;
  text-align:left;
  box-shadow:0 8px 25px rgba(0,0,0,0.12);
}
.th-profile-card img{
  width:85px;
  height:85px;
  border-radius:50%;
  border:3px solid #ffffffaa;
  object-fit:cover;
}
.th-profile-text h4{
  margin:0;
  font-size:22px;
  font-weight:800;
}
.th-profile-text .followers{
  margin-top:6px;
  font-size:17px;
  font-weight:600;
}

/* Statistic boxed cards */
.th-card{
  background:#ffffff;
  border-radius:12px;
  padding:18px;
  margin:14px 0;
  border:2px solid #e0e7ff;
  text-align:center;
  box-shadow:0 8px 25px rgba(0,0,0,0.06);
}

/* Engagement value */
.th-stat-value{
  margin-top:8px;
  font-size:28px;
  font-weight:800;
  color:#003aad;
}

/* Risk colors */
.th-risk-low{
  background:#e9ffe9;
  color:#009926;
  padding:8px 14px;
  border-radius:10px;
}
.th-risk-moderate{
  background:#fff4c9;
  color:#8a6a00;
  padding:8px 14px;
  border-radius:10px;
}
.th-risk-high{
  background:#ffe1e1;
  color:#c30000;
  padding:8px 14px;
  border-radius:10px;
}

/* Error */
.th-error{
  text-align:center;
  background:#ffe1e1;
  color:#c30000;
  padding:12px;
  border-radius:12px;
  font-weight:700;
  margin:12px 0;
}

/* Center Engagement & Risk Titles + Values */
.th-card .th-stat,
.th-card .th-stat-value {
    text-align:center !important;
    width:100%;
    display:block;
}