/* Meta title checker (22 Oct 2026). Inputs reuse .form-field from styles.css; nothing here is a form. */
.mtc { margin-bottom: 48px; padding: 28px; background: var(--surface); border: 1px solid var(--line); border-radius: 6px; }
.mtc .form-field { margin-bottom: 26px; }
.mtc .form-field label { font-size: 15px; }
.mtc .form-field input, .mtc .form-field textarea { font-size: 16px; }
.mtc-meter { position: relative; height: 8px; margin-top: 4px; background: var(--ink); border: 1px solid var(--line); border-radius: 4px; overflow: hidden; }
.mtc-meter span { display: block; width: 0; height: 100%; background: var(--yellow); transition: width .15s; }
.mtc-meter span.mtc-over { background: #ff7a59; }
.mtc-meter--desc::before, .mtc-meter--desc::after { content: ''; position: absolute; top: 0; bottom: 0; width: 2px; background: var(--muted); }
.mtc-meter--desc::before { left: 66.67%; }
.mtc-meter--desc::after { left: 86.11%; }
.mtc-note { color: var(--muted); font-size: 14px; line-height: 1.6; }
.mtc-local { margin: 4px 0 26px; border-top: 1px solid var(--line); padding-top: 18px; }
.mtc-local summary { cursor: pointer; font-weight: 650; font-size: 15px; }
.mtc-local summary:focus-visible { outline: 2px solid var(--yellow); outline-offset: 4px; }
.mtc-local-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 16px; }
.mtc-local-grid .form-field { margin-bottom: 10px; }
.mtc-checks { margin: 6px 0 0; padding: 0; list-style: none; font-size: 14px; line-height: 1.6; }
.mtc-checks li { position: relative; padding-left: 26px; margin-block: 6px; }
.mtc-checks li::before { position: absolute; left: 0; font-weight: 700; }
.mtc-checks .mtc-ok::before { content: '\2713'; color: #7ad37a; }
.mtc-checks .mtc-warn::before { content: '!'; left: 5px; color: #ff9b7f; }
.mtc-preview-label { margin-bottom: 10px; font-size: 13px; font-weight: 650; letter-spacing: .04em; text-transform: uppercase; color: var(--muted); }
.mtc-serp { padding: 18px 20px; background: #fff; border-radius: 6px; font-family: Arial, Arimo, 'Liberation Sans', sans-serif; overflow-wrap: anywhere; }
.mtc-serp-site { color: #202124; font-size: 14px; line-height: 1.4; }
.mtc-serp-title { margin: 4px 0 3px; color: #1a0dab; font-size: 20px; line-height: 1.3; }
.mtc-serp-desc { color: #4d5156; font-size: 14px; line-height: 1.58; }
.mtc-serp.mtc-example { opacity: .72; }
@media (max-width: 760px) {
  .mtc { padding: 20px; }
  .mtc-local-grid { grid-template-columns: 1fr; gap: 0; }
}
