.serp-preview{background:#fff;padding:20px;border-radius:8px;font-family:Arial,sans-serif;max-width:600px}
.serp-title{color:#1a0dab;font-size:20px;line-height:1.3;margin-bottom:3px;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.serp-title:hover{text-decoration:underline}
.serp-url{color:#006621;font-size:14px;margin-bottom:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.serp-description{color:#545454;font-size:14px;line-height:1.58;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.suggestions-container{margin-top:24px}
.suggestions-container h4{font-size:1rem;color:var(--primary);margin-bottom:12px}
.input-status{display:flex;align-items:center;gap:8px;margin-top:8px}
.status-dot{width:10px;height:10px;border-radius:50%}
.status-dot.good{background:var(--success)}
.status-dot.warning{background:var(--warning)}
.status-dot.error{background:var(--error)}
.status-text{font-size:0.85rem;color:var(--text-light)}
.mobile-preview-toggle{display:flex;gap:12px;margin-bottom:16px}
.preview-toggle-btn{padding:8px 16px;border:1px solid var(--border);background:var(--bg);border-radius:var(--radius);cursor:pointer;font-size:0.9rem;transition:var(--transition)}
.preview-toggle-btn.active{background:var(--primary);color:#fff;border-color:var(--primary)}
.serp-preview.mobile{max-width:360px}
.serp-preview.mobile .serp-title{font-size:16px}
.serp-preview.mobile .serp-url{font-size:12px}
.serp-preview.mobile .serp-description{font-size:13px}