.ip-preview {
    --page-bg: #f6f7fb;
    --control-bg: #fff;
    --text: #111a32;
    --muted: #54617c;
    --input-border: #c6cfe1;
    --blue: #6840b5;
    --blue-light: #efe8fa;
    --accent-ink: #573197;
    --focus-ring: var(--blue);
    --button-bg: #6840b5;
    --button-hover: #573197;
    --button-active: #48287e;
    --width: 82rem;
}
.ip-preview .site-header { border: 0; }
.ip-preview .brand-ai, .ip-preview .ip-caption { display: none; }
.ip-preview main { padding-top: clamp(2.5rem, 6vw, 5.5rem); }
.ip-preview .tool-heading { margin-bottom: 0; text-align: center; }
.ip-preview .tool-heading h1 {
    font-size: clamp(2.5rem, 5.2vw, 4.25rem);
    letter-spacing: -.055em;
}
.ip-preview .tool-heading p {
    margin: .7rem 0 0;
    text-align: center;
    font-size: clamp(1rem, 2vw, 1.35rem);
}
.ip-preview .lookup-form {
    position: relative;
    max-width: 60rem;
    margin: clamp(1.7rem, 4vw, 3.25rem) auto 0;
}
.ip-preview .lookup-form label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
}
.ip-preview .lookup-form :is(input, select, button) {
    min-height: clamp(3rem, 4vw, 3.75rem);
    font-size: 1rem;
}
.ip-preview .lookup-form button { min-width: 8rem; }
.ip-preview .ip-results {
    max-width: 60rem;
    margin: clamp(2.75rem, 6vw, 5rem) auto 0;
    padding: 0;
    border: 0;
}
.ip-preview .ip-results .ip-address {
    border-inline-start: 4px solid var(--blue);
    padding-inline-start: .85rem;
    font-family: var(--sans);
    font-size: clamp(1.7rem, 4vw, 2.75rem);
    overflow-wrap: anywhere;
}
.preview-fields {
    padding-top: .8rem;
    border-top: 1px solid var(--input-border);
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem 1.6rem;
    margin: 1.75rem 0 0;
}
.preview-fields > div + div {
    border-inline-start: 1px solid var(--input-border);
    padding-inline-start: 1.6rem;
}
.preview-fields dd { margin-top: .35rem; font-weight: 650; font-size: 1.12rem; }
@media (max-width: 650px) {
    .preview-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .preview-fields > div:nth-child(odd) { border: 0; padding: 0; }
    .preview-fields dd { font-size: 1rem; }
}
@media (prefers-color-scheme: dark) {
    .ip-preview {
        --page-bg: #111625;
        --control-bg: #191f31;
        --text: #edf1ff;
        --muted: #adb9d3;
        --input-border: #414e6b;
        --blue: #c0a2fa;
        --blue-light: #35264f;
        --accent-ink: #d5c1ff;
    }
}

.ip-preview :is(.tool-ip, .tool-dns, .tool-rdap) > .results {
    max-width: 60rem;
    margin: clamp(2.75rem, 6vw, 5rem) auto 0;
    padding: 0;
    border: 0;
}
.ip-preview .lookup-note {
    max-width: 60rem;
    margin-inline: auto;
}
.ip-preview .tool-page .result-title {
    border-inline-start: 4px solid var(--blue);
    padding-inline-start: .85rem;
    font-family: var(--sans);
    font-size: clamp(1.7rem, 4vw, 2.75rem);
}
.ip-preview :is(.record-list, .rdap-fields) {
    max-width: none;
    border-top: 1px solid var(--input-border);
}
.ip-preview :is(.tool-dns, .tool-rdap) .result-row,
.ip-preview .tool-dns .record-row {
    padding-block: .8rem;
    border-color: var(--input-border);
}
.ip-preview .lookup-note { line-height: 1.75; }
.ip-preview .help-guide section + section {
    padding-top: 1.5rem;
    border-top: 1px solid var(--input-border);
}

.ip-preview .lookup-form .dns-controls > :is(select, input, button) {
    grid-row: 1;
}
@media (max-width: 38rem) {
    .ip-preview .lookup-form .dns-controls > button { grid-row: 2; }
}