:root { font-family: system-ui, sans-serif; color: #17243b; background: #f3f6fb; }
body { margin: 0; padding: 3rem 1rem; }
main { max-width: 30rem; margin: auto; padding: 2rem; background: white; border-radius: 1rem; box-shadow: 0 8px 30px #17243b12; }
.brand { font-weight: 700; font-size: 1.3rem; text-decoration: none; }
h1 { font-size: 1.8rem; } h2 { font-size: 1.2rem; }
p { line-height: 1.6; } label { display: block; font-weight: 600; }
input { box-sizing: border-box; width: 100%; padding: .75rem; border: 1px solid #a2afc3; border-radius: .4rem; font: inherit; }
button { padding: .8rem 1.2rem; border: 0; border-radius: .4rem; color: white; background: #284eb6; font: inherit; cursor: pointer; }
a { color: #284eb6; } .errorlist { color: #a52323; } .helptext { font-size: .9rem; }
input:focus-visible, a:focus-visible, button:focus-visible { outline: 3px solid #6d9afa; outline-offset: 3px; }
.dns-value { display: block; overflow-wrap: anywhere; padding: .75rem; background: #f3f6fb; border-radius: .4rem; }
h3 { font-size: 1rem; overflow-wrap: anywhere; } form { margin: 1.5rem 0; } li { margin: .6rem 0; }
textarea, select { box-sizing: border-box; width: 100%; padding: .75rem; border: 1px solid #a2afc3; border-radius: .4rem; font: inherit; }
textarea { min-height: 7rem; resize: vertical; } input[type="checkbox"] { width: auto; }
pre { white-space: pre-wrap; overflow-wrap: anywhere; } iframe { width: 100%; min-height: 20rem; border: 1px solid #a2afc3; }
textarea:focus-visible, select:focus-visible { outline: 3px solid #6d9afa; outline-offset: 3px; }
.reputation-main { max-width: 60rem; }
.table-scroll { overflow-x: auto; }
.table-scroll:focus-visible { outline: 3px solid #6d9afa; outline-offset: 3px; }
.provider-table { width: 100%; min-width: 44rem; border-collapse: collapse; text-align: left; }
.provider-table th, .provider-table td { padding: .75rem; border-bottom: 1px solid #dfe5ef; vertical-align: top; overflow-wrap: anywhere; }