/*
 * 服务器查询页（`/lookup`）的样式（2026-11-04 加）。
 *
 * 只给这一页用：外层套的是站里现成的 `.guide-tuned`（见 tune.css），
 * 所以这里**不重写**标题、节间距、卡片那些通用规则，只补这一页特有的三块：
 *   · 查询表单；· 结果卡（在线 / 没探通 / 没有发出探测 三种）；· 底部口径说明。
 *
 * ⚠️ 颜色一律走站里的设计令牌（`--ink` / `--muted` / `--line` / `--blue` / `--soft` …），
 *    深浅主题各写一处覆盖，别在别处再复制一份。
 * ⚠️ MOTD 那一块直接用站里现成的 `.mc-motd`（深浅底色各有一套配色），这里只调尺寸与对齐。
 */

/* ── 查询表单 ─────────────────────────────────────────────────── */
.lookup-form {
  padding: 22px; border: 1px solid var(--line); border-radius: 12px; background: #fff;
}
.lookup-label { display: block; font-size: 13px; color: var(--muted); margin-bottom: 8px; }
.lookup-row { display: flex; gap: 10px; align-items: stretch; }
.lookup-input {
  flex: 1 1 auto; min-width: 0;
  padding: 11px 14px; border: 1px solid var(--line); border-radius: 8px;
  background: #fff; color: var(--ink); font: inherit; font-size: 15px;
  font-family: ui-monospace, Consolas, "Courier New", monospace;
}
.lookup-input:focus { outline: none; border-color: #c9d6f5; box-shadow: 0 0 0 3px rgba(107, 143, 245, .16); }
.lookup-submit {
  flex: 0 0 auto; height: auto; min-height: 42px; padding: 0 24px;
  border-radius: 8px; border: 1px solid #4168d6; background: #4168d6; color: #fff;
  font-size: 14px; cursor: pointer;
}
.lookup-submit[disabled] { opacity: .6; cursor: default; }
.lookup-form code {
  padding: 1px 6px; border-radius: 5px; background: var(--soft);
  font-family: ui-monospace, Consolas, "Courier New", monospace; font-size: 12.5px;
}

/* ── 结果区 ───────────────────────────────────────────────────── */
/* 没查之前那一句话：给个安静的空状态，别让区块看着像加载失败 */
.lookup-empty {
  margin: 0; padding: 22px; border: 1px dashed var(--line); border-radius: 12px;
  color: var(--muted); font-size: 14px; text-align: center;
}
.lookup-card {
  padding: 22px; border: 1px solid var(--line); border-radius: 12px; background: #fff;
}
.lookup-card-online { border-left: 3px solid #2f9e5f; }
.lookup-card-offline { border-left: 3px solid #b9822b; }
.lookup-card-stop { border-left: 3px solid var(--line); }
.lookup-card-busy { border-left: 3px solid #6b8ff5; }
.lookup-card-busy b { font-size: 16px; color: var(--ink); }

.lookup-card-head { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-bottom: 14px; }
.lookup-card-head b { font-size: 16px; color: var(--ink); }

/* 服务器图标：64×64，探测不到就用地址首字顶上（不留空框、不留破图） */
.lookup-icon {
  flex: 0 0 auto; width: 44px; height: 44px; border-radius: 8px; overflow: hidden;
  display: grid; place-items: center; background: var(--soft); border: 1px solid var(--line);
}
.lookup-icon img { width: 44px; height: 44px; display: block; image-rendering: pixelated; }
.lookup-icon-fallback { font-size: 18px; color: var(--muted); text-transform: uppercase; }

.lookup-head-main { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; min-width: 0; }
.lookup-addr {
  font-family: ui-monospace, Consolas, "Courier New", monospace;
  font-size: 15.5px; color: var(--ink); overflow-wrap: anywhere;
}
.lookup-badge {
  display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 11.5px; line-height: 1.8;
  white-space: nowrap;
}
.lookup-badge.is-on { background: #e8f5ec; color: #1f7a45; }
.lookup-badge.is-off { background: #fdf0e6; color: #a35a12; }
.lookup-badge.is-stop { background: #eef1f7; color: var(--muted); }

/* MOTD：站里那套 .mc-motd 已经处理好两种主题的配色，这里只让它占满一行 */
.lookup-motd { display: block; margin: 0 0 14px; font-size: 13px; line-height: 1.6; }

/* 事实表：标签在左、值在右，一行一条；窄屏自动折行 */
.lookup-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px 18px; margin: 0 0 14px; }
.lookup-facts > div { display: flex; flex-direction: column; gap: 3px; }
.lookup-facts dt { font-size: 12.5px; color: var(--muted); }
.lookup-facts dd { margin: 0; font-size: 15px; color: var(--ink); overflow-wrap: anywhere; }

/* 在线玩家（采样） */
.lookup-players { margin: 0 0 14px; }
.lookup-players-cap { display: block; font-size: 12.5px; color: var(--muted); margin-bottom: 7px; }
.lookup-players-list { display: flex; flex-wrap: wrap; gap: 6px; }
.lookup-player {
  padding: 3px 10px; border-radius: 999px; background: var(--soft); border: 1px solid var(--line);
  font-size: 12.5px; color: var(--ink); max-width: 100%;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.lookup-note { margin: 8px 0 0; font-size: 12.5px; line-height: 1.9; color: var(--muted); }

.lookup-reason { margin: 0 0 10px; font-size: 14.5px; line-height: 1.9; color: var(--ink); }
.lookup-hint { margin: 0 0 10px; font-size: 13px; line-height: 1.9; color: var(--muted); }
.lookup-resolved,
.lookup-known {
  margin: 0 0 10px; padding: 10px 14px; border-radius: 8px;
  background: var(--soft); font-size: 13px; line-height: 1.9; color: var(--ink);
}
.lookup-known a { color: var(--blue-deep); }
.lookup-foot { margin: 14px 0 0; font-size: 12.5px; line-height: 1.9; color: var(--muted); }

/* ── 底部口径说明 ─────────────────────────────────────────────── */
.lookup-about {
  padding: 22px; border: 1px solid var(--line); border-radius: 12px; background: #fff;
}
.lookup-about p { margin: 0 0 12px; font-size: 14px; line-height: 1.95; color: var(--ink); }
.lookup-about p:last-child { margin-bottom: 0; }
.lookup-about ul { margin: 0 0 12px; padding-left: 1.25em; }
.lookup-about li { font-size: 13.5px; line-height: 1.95; color: var(--muted); margin-bottom: 6px; }
.lookup-about li b { color: var(--ink); }

/* ── 深色主题 ─────────────────────────────────────────────────── */
html[data-theme="dark"] .lookup-form,
html[data-theme="dark"] .lookup-card,
html[data-theme="dark"] .lookup-about { background: #141b28; }
html[data-theme="dark"] .lookup-input { background: #0f1420; color: var(--ink); border-color: var(--line); }
html[data-theme="dark"] .lookup-badge.is-on { background: #16301f; color: #7fd6a2; }
html[data-theme="dark"] .lookup-badge.is-off { background: #2d2114; color: #e0ab6a; }
html[data-theme="dark"] .lookup-badge.is-stop { background: #1c2434; color: var(--muted); }
html[data-theme="dark"] .lookup-form code { background: #1c2434; }

/* ── 窄屏 ─────────────────────────────────────────────────────── */
@media (max-width: 720px) {
  .lookup-row { flex-wrap: wrap; }
  .lookup-submit { width: 100%; }
  .lookup-form,
  .lookup-card,
  .lookup-about { padding: 18px; }
  .lookup-facts { grid-template-columns: 1fr; }
}