[data-seo-tool="open-graph-generator"]{--og-accent:#6d28d9;--og-soft:#f3e8ff;--og-border:var(--tool-border,#dce3ed);--og-panel:var(--tool-panel,#fff);--og-strong:var(--tool-panel-strong,#f8fafc);--og-text:var(--tool-text,#172033);--og-muted:var(--tool-muted,#667085);color:var(--og-text)}
[data-seo-tool="open-graph-generator"] .og-pro__layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.04fr);gap:18px;align-items:start}
[data-seo-tool="open-graph-generator"] .og-pro__panel{min-width:0;background:var(--og-panel);border:1px solid var(--og-border);border-radius:18px;box-shadow:0 14px 35px rgba(15,23,42,.07);overflow:hidden}
[data-seo-tool="open-graph-generator"] .og-pro__panel-head,[data-seo-tool="open-graph-generator"] .og-pro__result-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;border-bottom:1px solid var(--og-border);background:var(--og-strong)}
[data-seo-tool="open-graph-generator"] .og-pro__panel-head>span,[data-seo-tool="open-graph-generator"] .og-pro__result-head>div:first-child>span{display:flex;align-items:center;gap:9px;font-weight:800}[data-seo-tool="open-graph-generator"] .og-pro__result-head small{display:block;margin-top:3px;color:var(--og-muted)}
[data-seo-tool="open-graph-generator"] button,[data-seo-tool="open-graph-generator"] input,[data-seo-tool="open-graph-generator"] textarea,[data-seo-tool="open-graph-generator"] select{font:inherit}[data-seo-tool="open-graph-generator"] button,[data-seo-tool="open-graph-generator"] summary{cursor:pointer}
[data-seo-tool="open-graph-generator"] .og-pro__panel-head button{border:0;background:transparent;color:var(--og-accent);font-weight:750}
[data-seo-tool="open-graph-generator"] .og-pro__notice{display:flex;gap:10px;margin:16px 18px 4px;padding:12px 14px;border:1px solid #c4b5fd;border-radius:12px;background:var(--og-soft);color:#5b21b6;font-size:.87rem;line-height:1.5}
[data-seo-tool="open-graph-generator"] .og-pro__field{display:flex;flex-direction:column;gap:7px;margin:14px 18px}[data-seo-tool="open-graph-generator"] .og-pro__field>span{font-size:.87rem;font-weight:800}[data-seo-tool="open-graph-generator"] .og-pro__field>span small,[data-seo-tool="open-graph-generator"] .og-pro__field>small{color:var(--og-muted);font-weight:500}[data-seo-tool="open-graph-generator"] .og-pro__field>small{display:flex;justify-content:space-between;gap:8px;font-size:.76rem}
[data-seo-tool="open-graph-generator"] .og-pro__field-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:0 12px}[data-seo-tool="open-graph-generator"] .og-pro__field-grid--three{grid-template-columns:1fr .65fr .65fr}
[data-seo-tool="open-graph-generator"] input,[data-seo-tool="open-graph-generator"] textarea,[data-seo-tool="open-graph-generator"] select{width:100%;box-sizing:border-box;border:1px solid var(--og-border);border-radius:10px;background:var(--og-panel);color:var(--og-text);padding:10px 12px;outline:none}[data-seo-tool="open-graph-generator"] textarea{resize:vertical;line-height:1.5}[data-seo-tool="open-graph-generator"] input:focus,[data-seo-tool="open-graph-generator"] textarea:focus,[data-seo-tool="open-graph-generator"] select:focus{border-color:var(--og-accent);box-shadow:0 0 0 3px rgba(109,40,217,.14)}
[data-seo-tool="open-graph-generator"] .og-pro__details{margin:12px 18px;border:1px solid var(--og-border);border-radius:12px;background:var(--og-strong);overflow:hidden}[data-seo-tool="open-graph-generator"] .og-pro__details summary{display:flex;justify-content:space-between;padding:12px 14px;font-size:.85rem;font-weight:800}[data-seo-tool="open-graph-generator"] .og-pro__details summary span{color:var(--og-muted);font-size:.72rem;font-weight:600}[data-seo-tool="open-graph-generator"] .og-pro__details-body{padding:1px 0;border-top:1px solid var(--og-border)}[data-seo-tool="open-graph-generator"] .og-pro__details .og-pro__field{margin-left:14px;margin-right:14px}[data-seo-tool="open-graph-generator"] .og-pro__details.is-disabled .og-pro__details-body{opacity:.62}
[data-seo-tool="open-graph-generator"] .og-pro__actions{display:flex;justify-content:flex-end;gap:10px;padding:14px 18px;border-top:1px solid var(--og-border);background:var(--og-strong)}[data-seo-tool="open-graph-generator"] .og-pro__actions button,[data-seo-tool="open-graph-generator"] .og-pro__copy-card button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--og-border);border-radius:10px;background:var(--og-panel);color:var(--og-text);padding:10px 14px;font-weight:800}[data-seo-tool="open-graph-generator"] .og-pro__actions .og-pro__primary,[data-seo-tool="open-graph-generator"] .og-pro__copy-card button{border-color:var(--og-accent);background:var(--og-accent);color:#fff}
[data-seo-tool="open-graph-generator"] .og-pro__status{margin:0;padding:10px 18px;border-top:1px solid var(--og-border);color:var(--og-muted);font-size:.82rem}
[data-seo-tool="open-graph-generator"] .og-pro__score{display:flex;flex-direction:column;align-items:center;min-width:58px;padding:7px 10px;border-radius:11px;background:var(--og-panel)}[data-seo-tool="open-graph-generator"] .og-pro__score strong{font-size:1.08rem}[data-seo-tool="open-graph-generator"] .og-pro__score span{font-size:.7rem;color:var(--og-muted)}[data-seo-tool="open-graph-generator"] .og-pro__score.is-good{color:#067647;background:#ecfdf3}[data-seo-tool="open-graph-generator"] .og-pro__score.is-warn{color:#b54708;background:#fffaeb}[data-seo-tool="open-graph-generator"] .og-pro__score.is-error{color:#b42318;background:#fef3f2}
[data-seo-tool="open-graph-generator"] .og-pro__metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:14px 16px}[data-seo-tool="open-graph-generator"] .og-pro__metrics>div{display:flex;flex-direction:column;gap:4px;padding:10px;border:1px solid var(--og-border);border-radius:11px;background:var(--og-strong)}[data-seo-tool="open-graph-generator"] .og-pro__metrics span{font-size:.72rem;color:var(--og-muted)}[data-seo-tool="open-graph-generator"] .og-pro__metrics strong{font-size:1.05rem}
[data-seo-tool="open-graph-generator"] .og-pro__tabs{display:flex;gap:4px;padding:0 16px;border-bottom:1px solid var(--og-border);overflow-x:auto}[data-seo-tool="open-graph-generator"] .og-pro__tabs button{white-space:nowrap;border:0;border-bottom:2px solid transparent;background:transparent;color:var(--og-muted);padding:11px 12px;font-weight:750}[data-seo-tool="open-graph-generator"] .og-pro__tabs button.is-active{border-bottom-color:var(--og-accent);color:var(--og-accent)}
[data-seo-tool="open-graph-generator"] .og-pro__tab-panel{padding:16px;min-height:460px}[data-seo-tool="open-graph-generator"] .og-pro__preview-note{display:flex;gap:8px;margin-bottom:14px;color:var(--og-muted);font-size:.78rem;line-height:1.45}
[data-seo-tool="open-graph-generator"] .og-pro__card{max-width:610px;margin:20px auto;border:1px solid var(--og-border);border-radius:14px;background:var(--og-panel);box-shadow:0 18px 44px rgba(15,23,42,.12);overflow:hidden}[data-seo-tool="open-graph-generator"] .og-pro__card-media{position:relative;aspect-ratio:1.91/1;background:linear-gradient(135deg,var(--og-soft),var(--og-strong));overflow:hidden}[data-seo-tool="open-graph-generator"] .og-pro__card-media img{width:100%;height:100%;display:block;object-fit:cover}[data-seo-tool="open-graph-generator"] .og-pro__card-media>span{position:absolute;right:9px;bottom:9px;padding:4px 7px;border-radius:6px;background:rgba(15,23,42,.76);color:#fff;font-size:.68rem}[data-seo-tool="open-graph-generator"] .og-pro__image-empty{height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:9px;color:var(--og-muted)}[data-seo-tool="open-graph-generator"] .og-pro__image-empty i{font-size:2rem}[data-seo-tool="open-graph-generator"] .og-pro__image-empty span{max-width:80%;text-align:center;font-size:.78rem}
[data-seo-tool="open-graph-generator"] .og-pro__card-body{padding:13px 15px 16px}[data-seo-tool="open-graph-generator"] .og-pro__card-body small{color:var(--og-muted);font-size:.72rem;letter-spacing:.04em}[data-seo-tool="open-graph-generator"] .og-pro__card-body h3{margin:6px 0 5px;font-size:1.08rem;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}[data-seo-tool="open-graph-generator"] .og-pro__card-body p{margin:0;color:var(--og-muted);font-size:.84rem;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
[data-seo-tool="open-graph-generator"] .og-pro__issue-list{display:flex;flex-direction:column;gap:9px}[data-seo-tool="open-graph-generator"] .og-pro__issue-list article{display:flex;align-items:flex-start;gap:9px;padding:11px 12px;border:1px solid var(--og-border);border-radius:10px;font-size:.84rem;line-height:1.45}[data-seo-tool="open-graph-generator"] .og-pro__issue-list .is-error{border-left:4px solid #f04438}[data-seo-tool="open-graph-generator"] .og-pro__issue-list .is-warn{border-left:4px solid #f79009}[data-seo-tool="open-graph-generator"] .og-pro__issue-list .is-error i{color:#f04438}[data-seo-tool="open-graph-generator"] .og-pro__issue-list .is-warn i{color:#f79009}
[data-seo-tool="open-graph-generator"] .og-pro__success,[data-seo-tool="open-graph-generator"] .og-pro__copy-card{display:flex;align-items:center;gap:12px;padding:16px;border:1px solid var(--og-border);border-radius:13px;background:var(--og-strong)}[data-seo-tool="open-graph-generator"] .og-pro__success>i{font-size:1.35rem;color:#12b76a}[data-seo-tool="open-graph-generator"] .og-pro__success div,[data-seo-tool="open-graph-generator"] .og-pro__copy-card div{display:flex;flex:1;flex-direction:column;gap:3px}[data-seo-tool="open-graph-generator"] .og-pro__success span,[data-seo-tool="open-graph-generator"] .og-pro__copy-card span{color:var(--og-muted);font-size:.8rem}[data-seo-tool="open-graph-generator"] .og-pro__copy-card>i{font-size:1.3rem;color:var(--og-accent)}
[data-seo-tool="open-graph-generator"] .og-pro__code-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;color:var(--og-muted);font-size:.8rem}[data-seo-tool="open-graph-generator"] .og-pro__code-head b{color:var(--og-accent)}[data-seo-tool="open-graph-generator"] pre{box-sizing:border-box;margin:0;white-space:pre-wrap;word-break:break-word;max-height:650px;overflow:auto;padding:16px;border:1px solid var(--og-border);border-radius:12px;background:var(--og-strong);color:var(--og-text);font-size:.82rem;line-height:1.6}[data-seo-tool="open-graph-generator"] .og-pro__rating-note{display:flex;gap:8px;margin:12px 0;color:var(--og-muted);font-size:.8rem}[data-seo-tool="open-graph-generator"] .og-pro__rating-note i{color:#f79009}[data-seo-tool="open-graph-generator"] [hidden]{display:none!important}
body.theme-dark [data-seo-tool="open-graph-generator"]{--og-accent:#c4b5fd;--og-soft:rgba(109,40,217,.2);--og-border:#334155;--og-panel:#111827;--og-strong:#172033;--og-text:#e5e7eb;--og-muted:#9ca3af}body.theme-dark [data-seo-tool="open-graph-generator"] .og-pro__notice{color:#ddd6fe;border-color:#6d28d9}body.theme-dark [data-seo-tool="open-graph-generator"] .og-pro__score.is-good{background:rgba(18,183,106,.15);color:#6ce9a6}body.theme-dark [data-seo-tool="open-graph-generator"] .og-pro__score.is-warn{background:rgba(247,144,9,.14);color:#fec84b}body.theme-dark [data-seo-tool="open-graph-generator"] .og-pro__score.is-error{background:rgba(240,68,56,.14);color:#fda29b}
@media (max-width:960px){[data-seo-tool="open-graph-generator"] .og-pro__layout{grid-template-columns:1fr}[data-seo-tool="open-graph-generator"] .og-pro__result{scroll-margin-top:16px}}
@media (max-width:620px){[data-seo-tool="open-graph-generator"] .og-pro__field-grid,[data-seo-tool="open-graph-generator"] .og-pro__field-grid--three{grid-template-columns:1fr}[data-seo-tool="open-graph-generator"] .og-pro__metrics{grid-template-columns:repeat(2,1fr)}[data-seo-tool="open-graph-generator"] .og-pro__actions,[data-seo-tool="open-graph-generator"] .og-pro__copy-card{align-items:stretch;flex-direction:column}[data-seo-tool="open-graph-generator"] .og-pro__actions button,[data-seo-tool="open-graph-generator"] .og-pro__copy-card button{width:100%}[data-seo-tool="open-graph-generator"] .og-pro__tab-panel{min-height:360px;padding:13px}[data-seo-tool="open-graph-generator"] .og-pro__card{margin:8px auto}}
