/* dnsreport — corporate/sleek theme
   Restrained palette, thin rules, small-caps labels, data-dense report. */

:root{
  --ink:#0e1721;
  --ink-2:#22303f;
  --muted:#5d6b7a;
  --muted-2:#8b97a4;
  --line:#dce2e9;
  --line-2:#eef1f5;
  --bg:#f6f7f9;
  --panel:#ffffff;
  --accent:#123a5e;
  --accent-2:#1b5a8f;
  --accent-soft:#eff4f8;
  --ok:#187a4b;   --ok-bg:#eef7f1;
  --note:#8a6414; --note-bg:#fdf7e7;
  --warn:#a95a08; --warn-bg:#fdf1e3;
  --crit:#a11b1b; --crit-bg:#fbeeee;
  --radius:3px;
  --sans:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
  --shadow:0 1px 2px rgba(14,23,33,.05), 0 12px 28px -20px rgba(14,23,33,.35);
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font:15.5px/1.6 var(--sans);
  font-feature-settings:"kern" 1;
}
a{color:var(--accent-2); text-decoration:none}
a:hover{text-decoration:underline}
code{font-family:var(--mono); font-size:.86em; background:var(--accent-soft);
  border:1px solid var(--line); border-radius:var(--radius); padding:.08em .38em; color:var(--ink-2)}
.shell{max-width:1080px; margin:0 auto; padding:0 28px}
.hr{height:1px; background:var(--line); border:0; margin:0}

/* ---------- top bar ---------- */
.topbar{background:var(--panel); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:20}
.topbar .shell{display:flex; align-items:center; justify-content:space-between; gap:24px; height:58px}
.wordmark{display:flex; align-items:center; gap:9px; font-weight:700; font-size:1rem;
  letter-spacing:-.01em; color:var(--ink); text-transform:uppercase}
.wordmark .mark{width:20px; height:20px; display:block}
.wordmark em{font-style:normal; font-weight:400; color:var(--muted); letter-spacing:.06em; margin-left:2px}
.topnav{display:flex; align-items:center; gap:20px; font-size:.82rem; letter-spacing:.02em}
.topnav a{color:var(--muted); font-weight:500; text-transform:uppercase}
.topnav a:hover{color:var(--accent-2); text-decoration:none}
.topnav .sep{width:1px; height:16px; background:var(--line)}
.badge{display:inline-flex; align-items:center; gap:7px; font-size:.74rem; text-transform:uppercase;
  letter-spacing:.07em; color:var(--muted); font-weight:600}
.badge i{width:6px; height:6px; border-radius:50%; background:var(--ok); display:block}

/* ---------- hero ---------- */
.hero{background:var(--panel); border-bottom:1px solid var(--line)}
.hero .shell{display:grid; grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr);
  gap:56px; padding-top:56px; padding-bottom:56px; align-items:start}
.eyebrow{font-size:.72rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent-2); margin:0 0 14px}
.hero h1{margin:0 0 14px; font-size:clamp(1.75rem,3.4vw,2.5rem); line-height:1.15;
  letter-spacing:-.028em; font-weight:700; color:var(--ink); max-width:22ch}
.hero .lede{margin:0 0 26px; color:var(--muted); font-size:1.02rem; max-width:60ch}
.lookup{display:flex; gap:0; max-width:540px; border:1px solid var(--line); border-radius:var(--radius);
  background:var(--panel); box-shadow:var(--shadow); overflow:hidden}
.lookup input{flex:1; min-width:0; padding:14px 16px; font:inherit; font-size:.95rem;
  border:0; background:transparent; color:var(--ink)}
.lookup input:focus{outline:2px solid var(--accent-2); outline-offset:-2px}
.lookup button{padding:14px 26px; font:inherit; font-size:.82rem; font-weight:700;
  letter-spacing:.09em; text-transform:uppercase; border:0; border-left:1px solid var(--line);
  background:var(--accent); color:#fff; cursor:pointer}
.lookup button:hover{background:var(--accent-2)}
.hint{margin:12px 0 0; color:var(--muted-2); font-size:.8rem}
.spec{border-left:1px solid var(--line); padding-left:28px}
.spec h2{font-size:.72rem; letter-spacing:.13em; text-transform:uppercase; color:var(--muted);
  margin:0 0 14px; font-weight:700}
.spec dl{margin:0; display:grid; gap:12px}
.spec div{display:flex; justify-content:space-between; align-items:baseline; gap:16px;
  border-bottom:1px solid var(--line-2); padding-bottom:9px}
.spec dt{color:var(--muted); font-size:.86rem}
.spec dd{margin:0; font-weight:700; font-variant-numeric:tabular-nums; font-size:.95rem; color:var(--ink)}

/* ---------- page body ---------- */
.wrap{max-width:1080px; margin:0 auto; padding:32px 28px 8px}
.section{margin:0 0 26px}
.section > header{display:flex; align-items:baseline; gap:12px; margin:0 0 14px;
  border-bottom:1px solid var(--line); padding-bottom:9px}
.section h2{margin:0; font-size:.78rem; letter-spacing:.13em; text-transform:uppercase;
  font-weight:700; color:var(--ink)}
.section .count{margin-left:auto; font-size:.76rem; color:var(--muted); letter-spacing:.04em;
  text-transform:uppercase; font-weight:600}
.panel{background:var(--panel); border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:var(--shadow)}

.alert{background:var(--crit-bg); border:1px solid #eed3d3; border-left:3px solid var(--crit);
  border-radius:var(--radius); padding:18px 20px}
.alert strong{display:block; margin-bottom:4px}
.alert p{margin:0; color:var(--ink-2); font-size:.92rem}

/* ---------- scorecard ---------- */
.scorecard{display:grid; grid-template-columns:minmax(220px,.9fr) minmax(0,1.6fr);
  gap:0; background:var(--panel); border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:var(--shadow); margin-bottom:26px; overflow:hidden}
.score-block{padding:26px 28px; border-right:1px solid var(--line)}
.score-top{display:flex; align-items:flex-end; gap:10px}
.score-num{font-size:3.6rem; line-height:.9; font-weight:700; letter-spacing:-.045em;
  font-variant-numeric:tabular-nums}
.score-den{font-size:.9rem; color:var(--muted); padding-bottom:.45em}
.meter{height:5px; background:var(--line-2); border-radius:2px; overflow:hidden; margin:16px 0 12px}
.meter span{display:block; height:100%; background:var(--ok)}
.grade-fair .meter span{background:var(--warn)}
.grade-critical .meter span{background:var(--crit)}
.scoregrade{font-size:.78rem; font-weight:700; letter-spacing:.11em; text-transform:uppercase}
.g-healthy{color:var(--ok)} .g-fair{color:var(--warn)} .g-critical{color:var(--crit)}
.score-blurb{margin:6px 0 0; color:var(--muted); font-size:.88rem}

.score-meta{padding:26px 28px}
.score-meta h1{margin:0 0 4px; font-size:1.4rem; letter-spacing:-.02em; word-break:break-all; font-weight:700}
.score-meta .sub{margin:0 0 18px; color:var(--muted); font-size:.84rem}
.tally{width:100%; border-collapse:collapse; font-size:.88rem}
.tally td{padding:6px 0; border-top:1px solid var(--line-2); vertical-align:middle}
.tally tr:first-child td{border-top:0}
.tally .n{width:44px; text-align:right; font-weight:700; font-variant-numeric:tabular-nums}
.tally .lbl{color:var(--muted); padding-left:10px}
.tally .t-critical .n{color:var(--crit)} .t-warning .n{color:var(--warn)}
.tally .t-note .n{color:var(--note)} .t-ok .n{color:var(--ok)}
.tally .bar{width:120px; padding-left:14px}
.tally .bar i{display:block; height:4px; border-radius:2px; background:var(--line-2)}
.t-critical .bar i{background:var(--crit)} .t-warning .bar i{background:var(--warn)}
.t-note .bar i{background:var(--note)} .t-ok .bar i{background:var(--ok)}
.footlinks{margin:16px 0 0; padding-top:14px; border-top:1px solid var(--line-2);
  font-size:.82rem; color:var(--muted)}
.footlinks a{margin-right:16px; font-weight:600}
.footlinks .ts{display:block; margin-top:6px; color:var(--muted-2); font-size:.78rem}

/* ---------- checks ---------- */
.group{margin-bottom:26px}
.checks{list-style:none; margin:0; padding:0}
.check{display:grid; grid-template-columns:88px minmax(0,1fr); gap:20px; padding:14px 0;
  border-bottom:1px solid var(--line-2)}
.check:last-child{border-bottom:0}
.sevtag{font-size:.68rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  padding:3px 0; color:var(--muted)}
.chip{display:inline-block; padding:2px 8px; border-radius:2px; border:1px solid var(--line);
  background:var(--bg)}
.sev-critical .chip{color:var(--crit); border-color:#e7c6c6; background:var(--crit-bg)}
.sev-warning .chip{color:var(--warn); border-color:#ecd6bd; background:var(--warn-bg)}
.sev-note .chip{color:var(--note); border-color:#e9dcbb; background:var(--note-bg)}
.sev-ok .chip{color:var(--ok); border-color:#c6e2d3; background:var(--ok-bg)}
.check-title{margin:0; font-weight:600; font-size:.95rem; color:var(--ink)}
.check-detail{margin:4px 0 0; color:var(--muted); font-size:.87rem; word-break:break-word}
.check-fix{margin:9px 0 0; padding:8px 12px; border-left:2px solid var(--accent);
  background:var(--accent-soft); color:var(--ink-2); font-size:.85rem; border-radius:0 var(--radius) var(--radius) 0}
.check-fix b{font-weight:700}

/* ---------- records table ---------- */
.table-wrap{background:var(--panel); border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:var(--shadow); overflow:hidden}
table.data{width:100%; border-collapse:collapse; font-size:.87rem}
table.data thead th{text-align:left; font-size:.69rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--muted); font-weight:700; background:var(--bg); padding:10px 16px;
  border-bottom:1px solid var(--line)}
table.data td{padding:11px 16px; border-bottom:1px solid var(--line-2); vertical-align:top}
table.data tbody tr:last-child td{border-bottom:0}
table.data tbody tr:hover{background:#fbfcfd}
.rtype{width:88px; font-weight:700; letter-spacing:.02em; white-space:nowrap}
.rt-absent{color:var(--muted-2); font-weight:600}
.val{font-family:var(--mono); font-size:.82rem; word-break:break-all; color:var(--ink-2)}
.val + .val{margin-top:3px}
.none{color:var(--muted-2); font-size:.84rem; font-family:var(--sans)}
.ttl{width:90px; text-align:right; color:var(--muted); font-variant-numeric:tabular-nums; white-space:nowrap}
.table-note{padding:12px 16px; border-top:1px solid var(--line); background:var(--bg);
  color:var(--muted); font-size:.79rem}

/* ---------- landing blocks ---------- */
.grid{display:grid; gap:1px; background:var(--line); border:1px solid var(--line);
  border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow)}
.grid-3{grid-template-columns:repeat(auto-fit,minmax(270px,1fr))}
.grid .cell{background:var(--panel); padding:22px 24px}
.cell h3{margin:0 0 8px; font-size:.95rem; letter-spacing:-.01em}
.cell h3 .num{display:block; font-size:.7rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--accent-2); font-weight:700; margin-bottom:7px}
.cell p{margin:0; color:var(--muted); font-size:.88rem}
.steps{counter-reset:s; list-style:none; margin:0; padding:0}
.steps li{counter-increment:s; position:relative; padding:16px 0 16px 44px;
  border-bottom:1px solid var(--line-2)}
.steps li:last-child{border-bottom:0}
.steps li::before{content:counter(s,decimal-leading-zero); position:absolute; left:0; top:16px;
  font-size:.76rem; font-weight:700; color:var(--accent-2); letter-spacing:.06em;
  border:1px solid var(--line); border-radius:var(--radius); padding:2px 7px; background:var(--bg)}
.steps strong{display:block; margin-bottom:2px; font-size:.95rem}
.steps span{color:var(--muted); font-size:.88rem}

/* ---------- footer ---------- */
.foot{border-top:1px solid var(--line); background:var(--panel); margin-top:24px}
.foot .shell{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:28px;
  padding-top:34px; padding-bottom:34px}
.foot h4{margin:0 0 10px; font-size:.7rem; letter-spacing:.13em; text-transform:uppercase; color:var(--muted)}
.foot p{margin:0 0 6px; color:var(--muted); font-size:.84rem}
.foot .colophon{border-top:1px solid var(--line-2); margin-top:0}
.foot .colophon .shell{display:block; padding-top:16px; padding-bottom:22px;
  color:var(--muted-2); font-size:.78rem}

/* ---------- responsive ---------- */
@media (max-width:820px){
  .hero .shell{grid-template-columns:1fr; gap:32px; padding-top:38px; padding-bottom:38px}
  .spec{border-left:0; padding-left:0; border-top:1px solid var(--line); padding-top:24px}
  .scorecard{grid-template-columns:1fr}
  .score-block{border-right:0; border-bottom:1px solid var(--line)}
  .topnav a:not(:last-child){display:none}
  .check{grid-template-columns:1fr; gap:8px}
  .tally .bar{display:none}
}
@media print{
  .topbar,.hero .lookup,.foot{display:none}
  body{background:#fff}
  .panel,.table-wrap,.scorecard{box-shadow:none}
}