.lookup-hero{padding-top:54px;padding-bottom:76px}
.lookup-hero .hero-lead{max-width:760px}
.lookup-panel{
  width:100%;
  max-width:920px;
  margin-top:34px;
  overflow:hidden;
  text-align:left
}
.lookup-chrome{
  min-height:46px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:14px;
  padding:8px 16px;
  border-bottom:1px solid var(--border);
  background:var(--bg)
}
.lookup-chrome-dots{display:flex;gap:7px}
.lookup-dot{width:10px;height:10px;border-radius:50%;flex:none}
.lookup-dot-error{background:var(--error)}
.lookup-dot-warn{background:var(--warn)}
.lookup-dot-success{background:var(--success)}
.lookup-chrome .mono{color:var(--text-muted);font-size:12px;letter-spacing:.04em}
.lookup-state{color:var(--text-muted);font-size:13px;text-align:right}
.lookup-state.is-success{color:var(--success)}
.lookup-state.is-error{color:var(--error)}

.result-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1px;
  margin:0;
  background:var(--border)
}
.result-item{
  min-height:122px;
  padding:23px;
  background:var(--bg-panel)
}
.result-item-primary{background:var(--tint-blue-bg)}
.result-item dt{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:12px;
  color:var(--text-muted);
  font-size:13px;
  font-weight:700
}
.result-item dt svg{
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round
}
.result-item dd{
  margin:0;
  overflow-wrap:anywhere;
  color:var(--text);
  font-family:var(--font-display);
  font-size:clamp(19px,2.7vw,27px);
  font-weight:850;
  line-height:1.3
}
.result-item-primary dd{
  color:var(--accent-dark);
  font-family:var(--font-mono);
  font-size:clamp(22px,3.2vw,32px)
}
.value-status.is-ok{color:var(--success)}
.value-status.is-warn{color:var(--warn)}
.value-status.is-error{color:var(--error)}

.lookup-actions{
  display:flex;
  justify-content:center;
  gap:12px;
  padding:22px 22px 12px
}
.lookup-actions .btn svg{
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round
}
.copy-feedback{
  min-height:26px;
  margin:0;
  padding:0 22px 16px;
  color:var(--text-muted);
  font-size:13px;
  text-align:center
}

.interpretation-layout{
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(280px,.75fr);
  gap:42px;
  align-items:start
}
.section-copy h2{
  margin:14px 0 20px
}
.section-copy p{
  color:var(--text-muted);
  font-size:17px
}
.reading-card{
  padding:25px;
  box-shadow:var(--shadow-float)
}
.reading-card h3{
  margin:0 0 19px;
  font-size:22px
}
.check-list{
  display:grid;
  gap:15px;
  margin:0;
  padding:0;
  list-style:none
}
.check-list li{
  display:flex;
  align-items:flex-start;
  gap:11px;
  color:var(--text-muted)
}
.check-list svg{
  width:19px;
  height:19px;
  margin-top:3px;
  padding:3px;
  flex:none;
  border-radius:50%;
  background:var(--tint-green-bg);
  color:var(--success);
  fill:none;
  stroke:currentColor;
  stroke-width:2.2;
  stroke-linecap:round;
  stroke-linejoin:round
}

.dns-layout{
  display:grid;
  grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);
  gap:48px;
  align-items:start
}
.dns-layout h2{
  margin:15px 0 18px;
  font-size:clamp(30px,4vw,46px)
}
.dns-lead{
  color:var(--ink-text-muted);
  font-size:17px
}
.dns-steps{
  display:grid;
  gap:1px;
  overflow:hidden;
  border:1px solid var(--ink-edge);
  border-radius:var(--radius-lg);
  background:var(--ink-edge)
}
.dns-step{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:17px;
  padding:23px;
  background:var(--ink-panel)
}
.dns-step-mark{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  flex:none;
  border:1px solid var(--tint-cyan-line);
  border-radius:var(--radius);
  background:var(--tint-cyan-bg);
  color:var(--tint-cyan-fg);
  font-family:var(--font-mono);
  font-weight:800
}
.dns-step h3{
  margin:3px 0 8px;
  font-size:20px
}
.dns-step p{
  margin:0;
  color:var(--ink-text-muted)
}
.dns-step pre{
  margin:14px 0 0;
  padding:13px 15px;
  border:1px solid var(--ink-edge);
  background:var(--bg-panel-2)
}

.privacy-panel{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:24px;
  align-items:start;
  padding:30px
}
.privacy-icon{
  width:54px;
  height:54px;
  display:grid;
  place-items:center;
  border:1px solid var(--tint-green-line);
  border-radius:var(--radius-lg);
  background:var(--tint-green-bg);
  color:var(--success)
}
.privacy-icon svg{
  width:28px;
  height:28px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round
}
.privacy-panel h2{
  margin:13px 0 13px;
  font-size:clamp(28px,3.5vw,38px)
}
.privacy-panel p{
  margin-bottom:9px;
  color:var(--text-muted)
}

.copy-helper{
  position:fixed;
  width:1px;
  height:1px;
  padding:0;
  border:0;
  opacity:0;
  pointer-events:none
}

@media(max-width:820px){
  .interpretation-layout,.dns-layout{grid-template-columns:1fr}
  .dns-layout{gap:28px}
}
@media(max-width:640px){
  .lookup-hero{padding-top:38px;padding-bottom:56px}
  .lookup-chrome{grid-template-columns:auto 1fr}
  .lookup-state{grid-column:1/-1;text-align:left}
  .result-grid{grid-template-columns:1fr}
  .result-item{min-height:104px;padding:19px}
  .lookup-actions{flex-direction:column}
  .lookup-actions .btn{width:100%}
  .privacy-panel{grid-template-columns:1fr;padding:23px}
  .dns-step{padding:19px}
}
@media(prefers-reduced-motion:reduce){
  .lookup-panel{scroll-behavior:auto}
}