/* SERP preview - a search-result style snippet. */
.sp-card { padding: 14px; border: 1px solid var(--e-line); border-radius: 10px; background: var(--e-bg); font-family: Arial, Helvetica, sans-serif; max-width: 652px; }
.sp-mobile { max-width: 412px; }
.sp-site { display: flex; align-items: center; gap: 10px; min-width: 0; }
.sp-fav { flex: none; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-size: 13px; font-weight: 700; background: var(--e-surface); border: 1px solid var(--e-line); color: var(--e-ink-2); }
.sp-site-txt { display: flex; flex-direction: column; min-width: 0; }
.sp-name { font-size: 14px; color: var(--e-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sp-url { font-size: 12px; color: var(--e-ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sp-title { margin: 8px 0 4px; font-size: 20px; line-height: 1.3; color: #1a0dab; overflow-wrap: anywhere; }
html[data-theme="dark"] .sp-title { color: #99c3ff; }
@media (prefers-color-scheme: dark) { html[data-theme="auto"] .sp-title { color: #99c3ff; } }
.sp-mobile .sp-title { font-size: 18px; }
.sp-desc { margin: 0; font-size: 14px; line-height: 1.58; color: var(--e-ink-2); overflow-wrap: anywhere; }
.sp-card + .e-rows { margin-top: 12px; }