/* ============================================================
   VPN-LG · iplookup.css —— 网络检测页(出口 IP / 归属地 / DNS 泄漏自查)
   全部取值引用 base.css 的设计令牌,不新增硬编码颜色。
   ============================================================ */

/* ------------------------------------------------------------
   页首:氛围光斑 + 居中标题
   ------------------------------------------------------------ */
.ip-hero{position:relative;text-align:center}
.ip-hero-decor{
  position:absolute;left:0;right:0;top:0;height:520px;
  z-index:0;overflow:hidden;pointer-events:none;
}
.ip-glow{
  position:absolute;left:50%;top:-140px;
  width:min(720px,100%);height:440px;
  transform:translateX(-50%);
  border-radius:50%;
  background:radial-gradient(50% 50% at 50% 50%,var(--accent-10) 0%,var(--accent-06) 46%,transparent 74%);
}
.ip-hero > .kicker,
.ip-hero > h1,
.ip-hero > .ip-lede,
.ip-hero > .ip-facts,
.ip-hero > .ip-tool{position:relative;z-index:1}
.ip-lede{
  max-width:620px;margin:16px auto 0;
  font-size:16.5px;line-height:1.75;color:var(--text-muted);
}
.ip-facts{justify-content:center;margin-top:18px}

/* ------------------------------------------------------------
   结果卡
   ------------------------------------------------------------ */
.ip-tool{
  margin-top:28px;text-align:left;
  background:var(--bg-panel);border-radius:var(--r);
  box-shadow:var(--shadow-panel);
  padding:22px 24px 20px;
}
.ip-tool-head{
  display:flex;align-items:baseline;justify-content:space-between;
  gap:10px 16px;flex-wrap:wrap;
  padding-bottom:14px;border-bottom:1px solid var(--border);
}
.ip-tool-head h2{font-size:clamp(18px,1.9vw,22px)}
.ip-tool-note{font-size:12.5px;color:var(--text-muted)}
.ip-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;margin-top:16px;
}
.ip-field{
  display:flex;align-items:center;gap:12px;
  min-width:0;padding:12px 14px;
  background:var(--bg-panel2);border-radius:var(--r-sm);
}
.ip-key{flex:none;width:84px;font-size:12.5px;color:var(--text-muted)}
.ip-val{
  display:flex;align-items:center;gap:8px;
  min-width:0;font-size:14.5px;font-weight:600;
  overflow-wrap:anywhere;
}
.ip-val.is-mono{font-family:var(--font-mono);letter-spacing:-.01em}
.ip-val.is-empty{font-weight:500;color:var(--text-muted)}
.ip-dot{width:8px;height:8px;border-radius:50%;background:var(--text-soft);flex:none}
.ip-field.is-ok .ip-dot{background:var(--success);box-shadow:0 0 0 4px var(--success-18)}
.ip-field.is-warn .ip-dot{background:var(--warn)}
.ip-field.is-unknown .ip-dot{background:var(--text-soft)}
.ip-flags{display:inline-flex;align-items:center;flex:none}
.ip-flags[hidden]{display:none}
.ip-flag{display:none;width:16px;height:16px}
.ip-flag.is-on{display:block}
.ip-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.ip-status{
  margin-top:12px;
  font-size:13px;line-height:1.7;color:var(--text-muted);
  overflow-wrap:anywhere;
}
.ip-status.is-ok{color:var(--success)}
.ip-status.is-error{color:var(--error)}
.ip-noscript{
  margin-top:10px;padding:10px 14px;
  background:var(--bg-panel2);border-radius:var(--r-sm);
  font-size:13px;line-height:1.7;color:var(--text-muted);
}
.ip-copy.is-done{color:var(--success);border-color:var(--success)}
.ip-copy-sink{
  position:fixed;top:0;left:0;width:1px;height:1px;
  padding:0;border:0;opacity:0;pointer-events:none;
}

/* ------------------------------------------------------------
   解读卡
   ------------------------------------------------------------ */
.ip-explain-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;margin-top:28px;
}
.ip-explain{
  background:var(--bg-panel);border-radius:var(--r);
  box-shadow:var(--shadow-card);
  padding:20px 22px;min-width:0;
}
.ip-tag{
  font-family:var(--font-mono);font-size:11.5px;letter-spacing:.06em;
  color:var(--accent-dark);
}
.ip-explain h3{margin:10px 0 8px;font-size:16.5px}
.ip-explain .ip-desc{font-size:14px;line-height:1.78;color:var(--text-muted)}
.ip-callout{margin-top:24px}

/* ------------------------------------------------------------
   DNS 泄漏自查
   ------------------------------------------------------------ */
.ip-dns{max-width:820px;margin:28px auto 0}
.ip-dns > p{font-size:15px;line-height:1.85;color:var(--text-muted)}
.ip-steps{margin-top:22px}
.ip-steps h3{font-size:16.5px}
.ip-steps p{margin-top:6px;font-size:14px;line-height:1.78;color:var(--text-muted)}
.ip-dns .callout{margin-top:22px}

/* ------------------------------------------------------------
   查询与隐私
   ------------------------------------------------------------ */
.ip-privacy{max-width:820px;margin:24px auto 0}
.ip-privacy-note{margin-top:12px;font-size:13.5px;line-height:1.75;color:var(--text-muted)}

/* ------------------------------------------------------------
   断点
   ------------------------------------------------------------ */
@media (max-width:768px){
  .ip-tool{padding:18px}
  .ip-grid{grid-template-columns:1fr}
  .ip-explain-grid{grid-template-columns:1fr}
  .ip-key{width:76px}
}

@media (max-width:480px){
  .ip-field{flex-direction:column;align-items:flex-start;gap:6px}
  .ip-key{width:auto}
}