/* Open Graph 미리보기 — 고유 레이아웃만 (박스/배경은 style_tools_base.css 통일) */
.wrap{ max-width:100%; padding:0 0 70px; }

.og-head{ margin-bottom:20px; }
.og-title{ font-size:38px; font-weight:800; margin:0; letter-spacing:-.02em; }
.og-sub{ margin:8px 0 0; color:#6b7280; font-size:13px; }

.og-form{ display:flex; gap:8px; max-width:640px; margin-bottom:10px; }
.og-input{ flex:1; padding:12px 15px; border:1.5px solid #e5e7eb; border-radius:10px; font-size:14px; }
.og-go{ background:#111827; color:#fff; border:none; padding:12px 24px; font-weight:700; font-size:14px; cursor:pointer; border-radius:10px; }
.og-go:hover:not(:disabled){ background:#374151; }
.og-go:disabled{ background:#cbd5e1; cursor:not-allowed; }
.og-msg{ min-height:20px; font-size:14px; font-weight:700; color:#6b7280; margin-bottom:14px; }
.og-msg.err{ color:#dc2626; }

.og-cards{ display:grid; grid-template-columns:repeat(auto-fill, minmax(300px,1fr)); gap:20px; margin-bottom:30px; }
.og-prev-label{ font-size:13px; font-weight:800; color:#374151; margin-bottom:8px; }
.og-prev-img,.og-kakao-img,.og-fb-img,.og-tw-img{ background-size:cover; background-position:center; background-color:#f1f5f9; }
.og-kakao-img.empty,.og-fb-img.empty,.og-tw-img.empty{ display:flex; align-items:center; justify-content:center; color:#cbd5e1; font-size:12px; font-weight:700; }

/* 카카오톡 카드 */
.og-kakao{ border:1px solid #e5e7eb; border-radius:12px; overflow:hidden; max-width:340px; background:#fff; }
.og-kakao-img{ height:170px; }
.og-kakao-body{ padding:11px 13px; }
.og-kakao-title{ font-size:14px; font-weight:700; color:#111827; line-height:1.35; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.og-kakao-desc{ font-size:12px; color:#6b7280; margin-top:4px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.og-kakao-host{ font-size:11px; color:#9ca3af; margin-top:7px; }

/* 페이스북 카드 */
.og-fb{ border:1px solid #dadde1; border-radius:8px; overflow:hidden; max-width:340px; background:#fff; }
.og-fb-img{ height:178px; }
.og-fb-body{ padding:10px 12px; background:#f2f3f5; }
.og-fb-host{ font-size:11px; color:#65676b; text-transform:uppercase; letter-spacing:.02em; }
.og-fb-title{ font-size:15px; font-weight:700; color:#1c1e21; margin-top:3px; line-height:1.3; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.og-fb-desc{ font-size:12px; color:#65676b; margin-top:4px; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; }

/* 트위터 카드 */
.og-tw{ border:1px solid #cfd9de; border-radius:16px; overflow:hidden; max-width:340px; background:#fff; }
.og-tw-img{ height:170px; }
.og-tw-body{ padding:10px 13px; }
.og-tw-title{ font-size:14px; font-weight:700; color:#0f1419; line-height:1.3; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; }
.og-tw-desc{ font-size:13px; color:#536471; margin-top:3px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.og-tw-host{ font-size:12px; color:#536471; margin-top:6px; }

.og-h3{ font-size:16px; font-weight:800; margin:0 0 12px; }
.og-table{ width:100%; border-collapse:collapse; font-size:13px; max-width:780px; }
.og-table tr{ border-bottom:1px solid #f1f5f9; }
.og-table th{ text-align:left; padding:8px 12px 8px 0; color:#111827; font-weight:700; width:30%; vertical-align:top; font-family:ui-monospace,Menlo,monospace; }
.og-table td{ padding:8px 0; color:#374151; word-break:break-all; }
.og-table td.na{ color:#cbd5e1; }

@media (max-width:480px){ .og-title{ font-size:30px; } .og-form{ flex-direction:column; } }