/* Meta Tag Generator — tool-specific styles */
.mt-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.mt-form { display: flex; flex-direction: column; gap: 12px; }
.mt-form .field span { font-size: .8rem; font-weight: 600; color: var(--muted); }
.mt-form input, .mt-form textarea { background: var(--bg-soft); border: 1px solid var(--line); color: var(--text);
  padding: 10px 12px; border-radius: var(--radius-sm); font-size: .92rem; font-family: inherit; width: 100%; }
.mt-form input:focus, .mt-form textarea:focus { outline: none; border-color: var(--accent); }
.mt-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

.mt-prev-label { font-size: .74rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--muted-2); margin: 6px 0 8px; }
.mt-google { background: #fff; border-radius: 10px; padding: 14px 16px; margin-bottom: 16px; }
.mt-g-url { color: #202124; font-size: .8rem; }
.mt-g-title { color: #1a0dab; font-size: 1.1rem; margin: 2px 0; line-height: 1.3; }
.mt-g-desc { color: #4d5156; font-size: .85rem; line-height: 1.4; }
.mt-social { background: #fff; border: 1px solid #dadde1; border-radius: 10px; overflow: hidden; }
.mt-s-img { aspect-ratio: 1200/630; background: #e4e6eb center/cover no-repeat; }
.mt-s-body { padding: 10px 12px; }
.mt-s-domain { color: #606770; font-size: .72rem; text-transform: uppercase; }
.mt-s-title { color: #1c1e21; font-weight: 600; font-size: .95rem; margin: 3px 0; line-height: 1.3; }
.mt-s-desc { color: #606770; font-size: .82rem; line-height: 1.35; }

.mt-out-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 20px 0 8px; color: var(--muted); font-size: .88rem; }
.mt-out { background: #0c0f1d; border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 14px 16px; margin: 0;
  font-family: ui-monospace, Menlo, Consolas, monospace; font-size: .82rem; line-height: 1.6; color: var(--accent-2); overflow: auto; white-space: pre-wrap; word-break: break-word; }
@media (max-width: 720px) { .mt-grid { grid-template-columns: 1fr; } }