/* Trang chủ */
.cct-hero{padding:48px 0 28px;text-align:center}
.cct-eyebrow{color:var(--accent);font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:.8rem}
.cct-hero h1{font-size:clamp(2rem,7vw,3.6rem);max-width:16ch;margin:.2em auto .4em}
.cct-grad{background:linear-gradient(90deg,#a78bfa,#38bdf8);-webkit-background-clip:text;background-clip:text;color:transparent}
.cct-lead{max-width:56ch;margin:0 auto 1.4em;color:var(--muted);font-size:1.1rem}
.cct-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.cct-features{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin-top:20px}
.cct-features .cct-card{margin:0}

/* Ghép đôi */
.cct-match{text-align:center;padding:36px 20px}
.cct-pulse{position:relative;width:96px;height:96px;margin:0 auto 18px;border-radius:50%;background:linear-gradient(135deg,var(--primary),var(--accent))}
.cct-pulse span{position:absolute;inset:0;border-radius:50%;border:2px solid var(--accent);opacity:0}
.cct-match.is-searching .cct-pulse span{animation:cct-ping 2s infinite}
.cct-match.is-searching .cct-pulse span:nth-child(2){animation-delay:.6s}
.cct-match.is-searching .cct-pulse span:nth-child(3){animation-delay:1.2s}
@keyframes cct-ping{0%{transform:scale(1);opacity:.7}100%{transform:scale(2.2);opacity:0}}
.cct-match .cct-actions{justify-content:center}

/* Hồ sơ */
.cct-pf-avatar{display:flex;gap:16px;align-items:center;margin:12px 0}
.cct-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.cct-list li{display:flex;align-items:center;gap:12px;justify-content:space-between;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px 12px}
.cct-list .cct-who{display:flex;align-items:center;gap:10px}

/* Lịch sử */
.cct-hlist{list-style:none;margin:0 0 12px;padding:0;display:flex;flex-direction:column;gap:10px}
.cct-hitem{display:flex;gap:12px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:12px 14px;text-decoration:none;color:var(--text)}
.cct-hitem:hover{border-color:var(--accent);color:var(--text)}
.cct-hbody{min-width:0;flex:1}
.cct-hbody strong{display:block}
.cct-hbody span{display:block;color:var(--muted);font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cct-hmeta{color:var(--muted);font-size:.8rem;text-align:right;flex:none}
.cct-badge{display:inline-block;font-size:.72rem;padding:2px 8px;border-radius:999px;border:1px solid var(--line);color:var(--muted)}
.cct-badge-live{border-color:var(--ok);color:#bbf7d0}
.cct-empty{text-align:center;padding:24px 0}