/* Open Graph generator: generic, approximate link-preview mockups (no network branding). */
.og-stage { padding: 18px; border-radius: var(--r); background: var(--glass-soft); border: 1px solid var(--line); }
.og-wrap { max-width: 520px; margin: 0 auto; }
.og-card { overflow: hidden; background: #fff; color: #1c1e21; border: 1px solid #dadde1; font-family: system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; }
.og-media { position: relative; background: #e9ebee; overflow: hidden; display: grid; place-items: center; }
.og-media.r191 { aspect-ratio: 1.91 / 1; }
.og-media.sq { aspect-ratio: 1 / 1; width: 130px; flex-shrink: 0; }
.og-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.og-noimg { color: #65676b; font-size: 0.85rem; padding: 8px; text-align: center; }
.og-body { display: grid; gap: 3px; padding: 10px 12px; min-width: 0; }
.og-domain { font-size: 0.75rem; color: #65676b; letter-spacing: 0.02em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.og-title { font-size: 1rem; line-height: 1.3; color: inherit; }
.og-desc { font-size: 0.88rem; color: #65676b; line-height: 1.35; }
.c1, .c2 { display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; }
.c1 { -webkit-line-clamp: 1; }
.c2 { -webkit-line-clamp: 2; }
.og-fb { border-radius: 0; }
.og-fb .og-body { background: #f0f2f5; }
.og-x { border-radius: 16px; border-color: #cfd9de; }
.og-x-small { display: flex; align-items: stretch; }
.og-x-small .og-media.sq { border-right: 1px solid #cfd9de; }
.og-x-small .og-body { align-content: center; }
.og-overlay { position: absolute; left: 12px; bottom: 12px; max-width: calc(100% - 24px); padding: 2px 6px; border-radius: 4px; background: rgba(0, 0, 0, 0.77); color: #fff; font-size: 0.8rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.og-from { display: block; margin-top: 4px; font-size: 0.82rem; color: var(--muted); }
.og-li { border-radius: 8px; }
.og-li .og-title { font-size: 0.92rem; }
:root[data-theme='dark'] .og-card { background: #242526; color: #e4e6eb; border-color: #3e4042; }
:root[data-theme='dark'] .og-fb .og-body { background: #3a3b3c; }
:root[data-theme='dark'] .og-media { background: #3a3b3c; }
:root[data-theme='dark'] .og-domain, :root[data-theme='dark'] .og-desc, :root[data-theme='dark'] .og-noimg { color: #b0b3b8; }