
/* ===== User Hover Preview (Featured 3x3) ===== */
/* Compact, glassy hovercard with quote style for text items */
.ce-v6-user-hover { position: absolute; z-index: 99999; pointer-events: auto; }
.ce-v6-user-hover-inner {
	background: var(--ce-glass-bg);
	border: 1px solid var(--ce-glass-border);
	border-radius: 14px;
	backdrop-filter: var(--ce-backdrop-blur);
	-webkit-backdrop-filter: var(--ce-backdrop-blur);
	box-shadow: var(--ce-glass-shadow);
	overflow: hidden;
}
.ce-v6-user-hover-title {
	font-weight: 700; font-size: 12px; color: #0f172a;
	padding: 8px 10px; border-bottom: 1px solid var(--ce-glass-border);
	background: rgba(255,255,255,0.75);
}
.ce-v6-user-hover-grid {
	display: grid;
	grid-template-columns: repeat(3, 56px);
	grid-auto-rows: 56px;
	gap: 3px;
	padding: 8px;
	background: rgba(248,250,252,0.6);
}
.ce-v6-user-hover-grid .cell {
	position: relative;
	border-radius: 10px;
	overflow: hidden;
	display: flex; align-items: center; justify-content: center;
	border: 1px solid var(--ce-glass-border);
	background: rgba(255,255,255,0.35);
}
.ce-v6-user-hover-grid .cell.img::after {
	content: "";
	position: absolute; inset: 0;
	background: linear-gradient(to bottom, rgba(15,23,42,0.0), rgba(15,23,42,0.08));
	pointer-events: none;
}
.ce-v6-user-hover-grid .cell img { width: 100%; height: 100%; object-fit: cover; display: block; filter: saturate(1.1) contrast(1.05); }
.ce-v6-user-hover-grid .cell.text { padding: 6px; font-size: 11px; line-height: 1.25; color: #334155; background: rgba(255,255,255,0.7); }
.ce-v6-user-hover-grid .cell.text .q { font-style: italic; display: -webkit-box; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.ce-v6-user-hover-grid .cell.text .q::before { content: '“'; color:#94a3b8; margin-right: 2px; }
.ce-v6-user-hover-grid .cell.text .q::after { content: '”'; color:#94a3b8; margin-left: 2px; }
.ce-v6-user-hover-grid .cell.empty { opacity: .35; background: repeating-linear-gradient(45deg, rgba(107,70,193,0.06), rgba(107,70,193,0.06) 10px, rgba(107,70,193,0.02) 10px, rgba(107,70,193,0.02) 20px); }

@media (max-width: 540px){
	.ce-v6-user-hover-grid { grid-template-columns: repeat(3, 52px); grid-auto-rows: 52px; }
}

