.ft-page { color: #1e293b; }
.ft-content { padding-top: 30px; padding-bottom: 48px; }
.ft-form .dns-form__row { align-items: end; }
.ft-label { display: block; position: absolute; left: 0; top: -25px; color: #1e293b; font-size: .92rem; font-weight: 700; }
.ft-label span { color: #64748b; font-weight: 500; }
.ft-form .dns-input-group { margin-top: 24px; display: block; }
.ft-form .dns-input-group .dns-input { min-height: 52px; }
.ft-hint, .ft-input-help { margin: 0; color: #64748b; font-size: .9rem; line-height: 1.6; }
.ft-loading { padding: 10px 0 0; color: #0056b3; font-weight: 700; }
.ft-loading:not([hidden]) { display: block; }
.ft-results { margin-top: 28px; }
.ft-results > h2 { font-size: 1.7rem; margin: 0 0 18px; }
.ft-result-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 16px 0; }
.ft-result-card { min-width: 0; background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; padding: 20px; box-shadow: 0 5px 18px rgba(15, 23, 42, .05); }
.ft-result-card h3 { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin: 0 0 14px; font-size: 1.14rem; }
.ft-result-card h4 { margin: 20px 0 8px; }
.ft-result-card p { line-height: 1.6; }
.ft-status { display: inline-flex; align-items: center; border-radius: 99px; padding: 5px 10px; font-size: .78rem; font-weight: 800; line-height: 1.3; background: #e2e8f0; color: #334155; }
.ft-status--valid { color: #166534; background: #dcfce7; }
.ft-status--warning, .ft-status--missing, .ft-status--expired, .ft-status--not_yet_valid { color: #92400e; background: #fef3c7; }
.ft-status--invalid, .ft-status--lookup_error { color: #991b1b; background: #fee2e2; }
.ft-status--unverified, .ft-status--unable, .ft-status--info { color: #1e40af; background: #dbeafe; }
.ft-record { max-height: 180px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; padding: 12px; border-radius: 8px; background: #f1f5f9; color: #0f172a; font-size: .88rem; }
.ft-details { margin: 0; }
.ft-details > div, .ft-header-list > div { padding: 10px 0; border-top: 1px solid #e2e8f0; }
.ft-details dt, .ft-header-list dt { color: #64748b; font-size: .85rem; font-weight: 700; }
.ft-details dd, .ft-header-list dd { margin: 4px 0 0; overflow-wrap: anywhere; }
.ft-header-list { margin: 0; }
.ft-header-list code { display: block; margin: 3px 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.ft-header-recommendation { display: block; margin-top: 4px; color: #64748b; line-height: 1.5; }
.ft-chain { padding-left: 24px; margin: 0; }
.ft-chain li { padding: 9px 0; }
.ft-chain code { display: block; margin-top: 6px; overflow-wrap: anywhere; }
.ft-issues { margin-top: 16px; }
.ft-issues ul { padding-left: 22px; }
.ft-issues li { margin: 8px 0; line-height: 1.5; }
.ft-good { color: #166534; font-weight: 700; }
.ft-warn { color: #92400e; font-weight: 700; }
.ft-muted { color: #64748b; font-size: .9rem; line-height: 1.55; }
.ft-related { padding: 20px 0 0; color: #64748b; }
.ft-related a { color: #0056b3; font-weight: 700; }
.ft-page button:focus-visible, .ft-page a:focus-visible, .ft-page input:focus-visible { outline: 3px solid #60a5fa; outline-offset: 2px; }
@media (max-width: 768px) {
    .ft-result-grid { grid-template-columns: 1fr; }
    .ft-form .dns-form__row { display: block; }
    .ft-form .dns-input-group { margin: 24px 0 10px; min-height: auto; }
    .ft-form .dns-submit-btn { width: 100%; margin-top: 10px; }
    .ft-results > h2 { font-size: 1.45rem; }
    .ft-result-card { padding: 16px; }
}
