/* Meta Tag Generator — gap widgets (reuses blog.css + tools.css tokens) */
.mt-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem}
@media(max-width:880px){.mt-grid{grid-template-columns:1fr}}
.mt-form{display:grid;gap:.9rem}
.mt-field{display:flex;flex-direction:column;gap:.35rem}
.mt-field label{font-weight:600;font-size:.85rem;color:var(--text-soft)}
.mt-field .cnt{font-weight:600}
.mt-field input,.mt-field select,.mt-field textarea{font-family:inherit;font-size:.95rem;color:var(--text);
  background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.6rem .8rem;box-sizing:border-box;width:100%}
.mt-field textarea{min-height:74px;resize:vertical;line-height:1.5}
.mt-field input:focus,.mt-field select:focus,.mt-field textarea:focus{outline:none;border-color:var(--orange);box-shadow:0 0 0 3px rgba(255,138,76,.15)}
.mt-2col{display:grid;grid-template-columns:1fr 1fr;gap:.9rem}
.mt-side{display:flex;flex-direction:column;gap:1.1rem}
.mt-pv{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:1rem;box-shadow:var(--sh-sm)}
.mt-pv h4{margin:0 0 .7rem;font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;color:var(--text-muted)}
/* google snippet */
.g-url{color:#3c4043;font-size:.82rem}
#pvTitle{color:#1a0dab;font-size:1.15rem;line-height:1.3;margin:.15rem 0;font-weight:500}
#pvDesc{color:#4d5156;font-size:.86rem;line-height:1.5}
/* social card */
.sc-card{border:1px solid var(--border);border-radius:12px;overflow:hidden;background:#fff}
#scImg{width:100%;aspect-ratio:1200/630;background-size:cover;background-position:center;background-color:#e9edf2;
  display:grid;place-items:center;color:#9aa3b0;font-size:.85rem}
.sc-meta{padding:.7rem .9rem}
#scDomain{color:#8a939f;font-size:.72rem;text-transform:uppercase;letter-spacing:.03em}
#scTitle{color:#1d2129;font-weight:700;font-size:.98rem;margin:.2rem 0;line-height:1.3}
#scDesc{color:#606770;font-size:.82rem;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mt-out-wrap{margin-top:1.2rem}
#mtOut{width:100%;min-height:230px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.85rem;line-height:1.55;
  color:var(--text);background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.8rem 1rem;box-sizing:border-box;resize:vertical}
#mtOut:focus{outline:none;border-color:var(--orange)}
