/* IPKK 整站视觉：深海蓝、青绿与清晰的信息层次。
   共享导航加载此文件；业务状态色、表单逻辑和原有文案由各页面保留。 */
:root {
  --ipkk-navy: #0c2130;
  --ipkk-navy-soft: #153342;
  --ipkk-ink: #182f40;
  --ipkk-muted: #6b7e8e;
  --ipkk-accent: #087f79;
  --ipkk-mint: #79e7c9;
  --ipkk-bg: #f3f6f8;
  --ipkk-line: #dfe7ec;
  --ipkk-shadow: 0 8px 28px rgba(21, 46, 64, .045);
  --ipkk-width: 1200px;
  --ipkk-hero-height: 360px;
  --ipkk-hero-title-size: 36px;
  --ipkk-hero-subtitle-size: 16px;
  --ipkk-font: 'PingFang SC', 'Microsoft YaHei', -apple-system, BlinkMacSystemFont, sans-serif;
}

body.ipkk-page {
  --brand: var(--ipkk-accent);
  --brand-dark: #056963;
  --brand-ghost: rgba(121, 231, 201, .12);
  --hero-bg: var(--ipkk-navy);
  --hero-bg-dark: var(--ipkk-navy);
  --text-primary: var(--ipkk-ink);
  --text-main: var(--ipkk-ink);
  --text-secondary: var(--ipkk-muted);
  --text-soft: var(--ipkk-muted);
  --text-label: #617887;
  --ink: var(--ipkk-ink);
  --soft: #617487;
  --muted: #7a8b98;
  --line: var(--ipkk-line);
  --border-color: var(--ipkk-line);
  --surface: #fff;
  --bg-white: #fff;
  --bg-card: #fff;
  --blue: var(--ipkk-accent);
  --blue-bg: #eaf5f3;
  --font: var(--ipkk-font);
  background: var(--ipkk-bg);
  color: var(--ipkk-ink);
  font-family: var(--ipkk-font);
}

/* 全站导航：固定高度与内容边界，菜单交互继续由 site-nav.js 管理。 */
[data-site-nav] {
  height: 80px;
  padding: 12px 24px;
  background: rgba(12, 33, 48, .97);
  border-bottom: 1px solid rgba(195, 221, 226, .1);
  box-shadow: none;
  font-family: var(--ipkk-font);
}
[data-site-nav].scrolled { background: rgba(12, 33, 48, .98); box-shadow: 0 5px 24px rgba(7, 23, 35, .16); }
[data-site-nav] :is(.header-nav-inner-box, .ipkkx-nav-box, .ipkk-nav-box) { max-width: var(--ipkk-width); gap: 32px; }
[data-site-nav] :is(.nav-logo-svg, .ipkkx-logo, .ipkk-logo) img { width: 148px; height: 60px; padding: 0; object-fit: contain; }
[data-site-nav] :is(.nav-tabs, .ipkkx-tabs, .ipkk-tabs) { gap: 8px; }
[data-site-nav] :is(.nav-tab, .ipkkx-tab, .ipkk-tab) {
  min-height: 42px;
  padding: 10px 16px;
  border-radius: 8px;
  color: #b9c8d2;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: .01em;
}
[data-site-nav] :is(.nav-tab, .ipkkx-tab, .ipkk-tab):hover { color: #fff; background: rgba(255, 255, 255, .05); }
[data-site-nav] :is(.nav-tab, .ipkkx-tab, .ipkk-tab).active {
  color: #9bf2da;
  background: transparent;
  box-shadow: none;
  font-weight: 600;
}
[data-site-nav] [data-nav-toggle="more"] { color: #b9c8d2; border-radius: 8px; }
[data-site-nav] [data-nav-menu] {
  padding: 8px;
  background: #fff;
  border: 1px solid var(--ipkk-line);
  border-radius: 14px;
  box-shadow: 0 18px 48px rgba(5, 25, 41, .18);
}
[data-site-nav] [data-nav-menu] a { border-radius: 8px; color: #526a7c; text-align: left; }
[data-site-nav] [data-nav-menu] a:hover { color: var(--ipkk-accent); background: #eff7f5; }
[data-site-nav] [data-nav-menu] a:is(.active, .on) { background: #eaf5f1; color: #087f79; }
[data-site-nav] [data-nav-menu] .t { color: var(--ipkk-ink); font-size: 14px; }
[data-site-nav] [data-nav-menu] a:is(.active, .on) .t { color: #087f79; }
[data-site-nav] [data-nav-menu] .d { color: #7a8b98; font-size: 12px; margin-top: 4px; }

/* 顶部：AI 核心与神经网络轻动画，不覆盖正文或操作控件。 */
.ipkk-page :is(.header, .hero, .ipkk-hero) {
  position: relative;
  display: flex;
  align-items: center;
  min-height: var(--ipkk-hero-height);
  /* 扣除 80px 导航和 40px 卡片重叠区，内容上下各留至少 12px。 */
  padding: 92px 24px 52px;
  background: linear-gradient(112deg, #0c2130, #153342);
  border: 0;
  overflow: hidden;
  isolation: isolate;
}
.ipkk-page :is(.header, .hero, .ipkk-hero)::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url('/ai-network.svg') no-repeat calc(50% + 410px) 48%;
  background-size: 640px auto;
  opacity: .72;
  pointer-events: none;
  z-index: -1;
}
.ipkk-page :is(.header, .hero, .ipkk-hero)::after { content: none; }
.ipkk-page :is(.hero-inner, .ipkk-hero-inner, .header-search) {
  position: relative;
  width: 100%;
  max-width: var(--ipkk-width);
  margin: 0 auto;
  padding: 0;
  text-align: left;
}
.ipkk-page :is(.header, .hero, .ipkk-hero) :is(h1, .hero-title) {
  max-width: 880px;
  margin: 0;
  color: #f4fafc;
  font-size: var(--ipkk-hero-title-size);
  font-weight: 650;
  line-height: 1.4;
  letter-spacing: -.025em;
  overflow-wrap: anywhere;
}
.ipkk-page :is(.hero-subtitle, .hero .sub, .hero-sub, .ipkk-hero-sub) {
  min-height: 0;
  max-width: 860px;
  margin: 12px 0 0;
  color: #adc0cb;
  font-size: var(--ipkk-hero-subtitle-size);
  font-weight: 400;
  line-height: 1.8;
  letter-spacing: 0;
}
.ipkk-page .hero-privacy { max-width: 700px; margin-top: 16px; color: #8fa9b6; font-size: 13px; line-height: 1.8; }
.ipkk-page .hero-stage { width: 100%; min-height: 0; margin: 16px 0 0; }
.ipkk-page .hero-actions { justify-content: flex-start; align-items: flex-start; margin-top: 0; gap: 12px; }
.ipkk-page .hero-actions-buttons { justify-content: flex-start; gap: 12px; }
.ipkk-page .hero-btn {
  min-width: 0;
  min-height: 50px;
  height: auto;
  padding: 13px 24px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: #79e7c9;
  color: #0a3431;
  box-shadow: none;
  font-family: inherit;
  font-size: 15px;
  font-weight: 650;
  line-height: 1.5;
}
.ipkk-page .hero-btn:hover { background: #9bf2da; transform: translateY(-1px); }
.ipkk-page .hero-btn-ghost { color: #d1e9e8; background: rgba(255, 255, 255, .04); border-color: rgba(191, 223, 225, .25); }
.ipkk-page .hero-btn-ghost:hover { background: rgba(255, 255, 255, .1); }
.ipkk-page .hero-btn.is-hint { color: #d1e9e8; background: rgba(121, 231, 201, .1); border-color: rgba(121, 231, 201, .2); }

/* 内容容器与卡片；说明文章沿用 info-block.css 的原样式。 */
.ipkk-page :is(.main, .wrap) {
  position: relative;
  width: calc(100% - 48px);
  max-width: var(--ipkk-width);
  margin: -40px auto 0;
  padding: 0 0 72px;
  z-index: 5;
}
.ipkk-page :is(.dns-result-shell, .webrtc-result-shell, .fp-result-shell) { margin: 0 0 24px; }
.ipkk-page .card {
  min-width: 0;
  border: 1px solid var(--ipkk-line);
  border-radius: 18px;
  background: #fff;
  box-shadow: var(--ipkk-shadow);
}
.ipkk-page .card-header { padding: 22px 26px; background: #fff; border-bottom: 1px solid #e8eef2; }
.ipkk-page .card-title { color: var(--ipkk-ink); font-size: 16px; font-weight: 650; letter-spacing: 0; text-transform: none; gap: 10px; }
.ipkk-page .card-title h1 { font-size: 16px !important; font-weight: 650 !important; }
.ipkk-page :is(.card-action, .btn-ghost) { min-height: 36px; padding: 7px 12px; border-color: #dfe7ec; border-radius: 8px; background: #f8fafb; color: #607889; }
.ipkk-page :is(.card-action, .btn-ghost):hover { border-color: #a9c9c2; background: #edf6f3; color: var(--ipkk-accent); }
.ipkk-page :is(.btn-primary, .search-btn, .btn-store) { background: var(--ipkk-accent); color: #fff; border-radius: 10px; box-shadow: none; }
.ipkk-page :is(.btn-primary, .search-btn, .btn-store):hover { background: #056c67; }
.ipkk-page :is(.webrtc-desc, .card-body) { padding: 22px 26px; }
.ipkk-page :is(.webrtc-grid, .conn-grid) { gap: 16px; padding: 0 26px 26px; }
.ipkk-page :is(.webrtc-item, .conn-item) { border: 1px solid #e3ebef; border-radius: 12px; background: #f9fbfc; padding: 18px; box-shadow: none; }
.ipkk-page :is(.webrtc-item-name, .conn-site) { color: var(--ipkk-ink); }
.ipkk-page .webrtc-disabled-notice { background: #eff8f3; border-color: #d7eade; }

/* 首页保留原有标题与地址排列，查询结果维持左侧名称、右侧值。 */
.ipkk-page.ipkk-home .main { padding-bottom: 0; }
.ipkk-home .hero-title .hero-ip {
  color: #8cedd2;
  font-variant-numeric: tabular-nums;
}
.ipkk-home .hero-subtitle strong { color: #c0d4dd !important; font-weight: 500; }
.ipkk-home .card { margin-bottom: 24px; }
.ipkk-home .info-table { table-layout: fixed; }
.ipkk-home .result-label-column { width: 20%; }
.ipkk-home .result-menu-column { width: 288px; }
.ipkk-home .info-table tr { border-color: #e8eef2; }
.ipkk-home .info-table tr:nth-child(even) { background: #f6f9fb; }
.ipkk-home .info-table td { padding: 14px 24px; }
.ipkk-home .result-value-cell { color: var(--text-primary); word-break: break-all; }
.ipkk-home .info-table .result-menu-cell { padding: 14px 24px; word-break: normal; }
.ipkk-home .result-row-actions { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; min-width: 0; }
.ipkk-home .result-row-actions :is(a, button) { display: inline-flex; align-items: center; justify-content: center; min-height: 34px; max-width: 100%; padding: 6px 0; border: 0; border-radius: 0; color: var(--ipkk-accent); background: transparent; font-family: inherit; font-size: 12px; line-height: 1.6; text-align: center; text-decoration: none; cursor: pointer; }
.ipkk-home .result-row-actions :is(a, button):hover { color: #056963; text-decoration: underline; text-underline-offset: 3px; }
.ipkk-home .result-row-actions :is(a, button):focus-visible { outline: 2px solid var(--ipkk-accent); outline-offset: 3px; }
.ipkk-home #ip-local-time { font-variant-numeric: tabular-nums; word-break: normal; overflow-wrap: anywhere; }
.ipkk-home .ip-time-offset { white-space: nowrap; }
.ipkk-home .ip-addr { font-variant-numeric: tabular-nums; }
.ipkk-home .sysinfo-table td { padding: 15px 26px; border-color: #e8eef2; }
.ipkk-home .sysinfo-table tr:nth-child(even) { background: #f9fbfc; }
.ipkk-home :is(.asn-table, .dns-leak-table) th { background: #f3f7f9; }
.ipkk-home :is(.asn-table, .dns-leak-table) td { padding-block: 15px; }

/* 地图与世界时间使用原生模态窗口，键盘焦点与 Esc 关闭由浏览器管理。 */
html:is(.world-clock-open, .location-map-open), html:is(.world-clock-open, .location-map-open) body { overflow: hidden; }
.ipkk-home :is(.world-clock-dialog, .location-map-dialog) { width: min(820px, calc(100% - 32px)); max-width: none; max-height: calc(100dvh - 32px); margin: auto; padding: 28px; border: 1px solid var(--ipkk-line); border-radius: 18px; background: #fff; color: var(--ipkk-ink); box-shadow: 0 24px 80px rgba(7, 23, 35, .24); overflow-y: auto; overscroll-behavior: contain; }
.ipkk-home :is(.world-clock-dialog, .location-map-dialog)::backdrop { background: rgba(7, 23, 35, .55); backdrop-filter: blur(3px); }
.ipkk-home :is(.world-clock-heading, .location-map-heading) { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 20px; background: #fff; }
.ipkk-home :is(.world-clock-heading, .location-map-heading) h2 { margin: 0; font-size: 24px; font-weight: 650; line-height: 1.4; }
.ipkk-home :is(.world-clock-close, .location-map-close) { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 40px; height: 40px; padding: 0; border: 1px solid var(--ipkk-line); border-radius: 9px; background: #f6f9fb; color: #607889; cursor: pointer; }
.ipkk-home :is(.world-clock-close, .location-map-close):hover { background: #edf6f3; color: var(--ipkk-accent); }
.ipkk-home :is(.world-clock-close, .location-map-close):focus-visible { outline: 2px solid var(--ipkk-accent); outline-offset: 3px; }
.ipkk-home :is(.world-clock-description, .location-map-description) { margin: 10px 0 0; color: var(--ipkk-muted); font-size: 13px; line-height: 1.8; }
.ipkk-home .location-map-dialog { width: min(960px, calc(100% - 32px)); }
.ipkk-home .location-map-frame { display: block; width: 100%; height: min(460px, 55dvh); min-height: 220px; margin-top: 20px; border: 1px solid var(--ipkk-line); border-radius: 12px; background: #f3f6f8; }
.ipkk-home .location-map-reference { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; margin-top: 16px; font-size: 12px; line-height: 1.8; }
.ipkk-home .location-map-reference p { min-width: 0; color: var(--ipkk-muted); overflow-wrap: anywhere; }
.ipkk-home .location-map-reference a { color: var(--ipkk-accent); text-decoration: none; }
.ipkk-home .location-map-reference a:hover { text-decoration: underline; text-underline-offset: 3px; }
.ipkk-home .location-map-reference a:focus-visible { outline: 2px solid var(--ipkk-accent); outline-offset: 3px; }
.ipkk-home .world-clock-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 24px 0 0; padding: 0; list-style: none; }
.ipkk-home .world-clock-item { min-width: 0; padding: 16px 14px; border: 1px solid #e1e9ee; border-radius: 12px; background: #f6f9fb; }
.ipkk-home .world-clock-city { margin: 0; color: var(--ipkk-ink); font-size: 15px; font-weight: 650; line-height: 1.5; }
.ipkk-home .world-clock-time { display: block; margin-top: 14px; color: var(--ipkk-accent); font-size: 26px; font-weight: 650; font-variant-numeric: tabular-nums; line-height: 1.4; white-space: nowrap; }
.ipkk-home .world-clock-date, .ipkk-home .world-clock-offset { display: block; margin-top: 6px; color: #677c8c; font-size: 12px; line-height: 1.7; }
.ipkk-home .world-clock-date { display: flex; flex-wrap: wrap; gap: 0 4px; }
.ipkk-home .world-clock-date span { white-space: nowrap; }
.ipkk-home .world-clock-offset { color: var(--ipkk-muted); }
.ipkk-home .world-clock-reference { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 16px; margin: 20px 0 0; padding-top: 18px; border-top: 1px solid var(--ipkk-line); color: #677c8c; font-size: 12px; line-height: 1.8; }
.ipkk-home .world-clock-reference time { font-variant-numeric: tabular-nums; }

@media (min-width: 901px) {
  .ipkk-home .info-table .result-value-cell { padding-left: clamp(100px, 12vw, 168px); }
}

/* DNS 进度与按钮保留原有节点，桌面上并排展示。 */
.ipkk-dns .hero-inner { display: block; min-height: 160px; padding-right: 244px; }
.ipkk-dns .hero-stage { display: contents; }
.ipkk-dns .leak-animation { position: absolute; top: 50%; right: 10px; left: auto; width: 160px; height: 160px; margin: 0; transform: translateY(-50%); }
.ipkk-dns .leak-animation .box { width: 160px; height: 160px; background: #0e454b; border: 1px solid rgba(130, 232, 205, .3); box-shadow: 0 0 0 8px rgba(121, 231, 201, .03), 0 0 0 16px rgba(121, 231, 201, .025); }
.ipkk-dns .leak-animation .box .percent { color: #dcfff4; font-size: 40px; font-weight: 500; }
.ipkk-dns .hero-actions { margin-top: 16px; min-width: 0; }
.ipkk-dns .hero-actions-status { width: 100%; border-radius: 12px; box-shadow: none; }
.ipkk-dns .hero-actions-status-title { font-size: var(--ipkk-hero-subtitle-size); }
.ipkk-dns .info-grid { gap: 24px; }

/* 指纹检测的隐私说明与检测按钮并排显示。 */
.ipkk-fingerprint .hero-actions { flex-direction: row; align-items: center; gap: 20px; }
.ipkk-fingerprint .hero-btn { flex-shrink: 0; max-width: 42%; }
.ipkk-fingerprint .hero-privacy { flex: 1; min-width: 0; margin: 0; }

/* Claude、手机号与应用列表。 */
.ipkk-claude .hero-inner { align-items: flex-start; gap: 32px; }
.ipkk-claude .hero-text { min-width: 0; }
.ipkk-claude .trust-heading { display: flex; align-items: center; gap: 16px; min-width: 0; }
.ipkk-claude .trust-heading .trust-title { min-width: 0; line-height: 1.5; }
.ipkk-claude .toggle-wrap { margin: 0; flex-shrink: 0; }
.ipkk-claude .switch input:focus-visible + .slider { outline: 2px solid var(--ipkk-accent); outline-offset: 3px; }
.ipkk-claude #card-trust .card-h { flex-wrap: wrap; gap: 12px 24px; }
.ipkk-claude .grid { gap: 20px; }
.ipkk-claude .card { padding: 26px; }
.ipkk-claude .card-h { margin-bottom: 20px; }
.ipkk-claude .trust-support-h { max-width: 100%; flex-wrap: wrap; }
.ipkk-claude .trust-support-k { min-width: 0; overflow-wrap: anywhere; }
.ipkk-claude .kv-k { min-width: 0; flex-shrink: 1; }
.ipkk-claude .ip-label { font-size: 13px; color: #748896; }
.ipkk-claude .ip-value { font-size: 23px; font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.ipkk-claude .ip-loc { margin-top: 10px; line-height: 1.75; }
.ipkk-claude .trust-desc { font-size: 18px; line-height: 1.7; }
.ipkk-claude .kv-row { padding-block: 11px; border-color: #edf1f4; }
.ipkk-claude .status-card { margin: 24px 0; }
.ipkk-claude .st-row { padding: 24px 0; }
.ipkk-phone .wrap > .card { padding: 32px; }
.ipkk-phone .search-input { min-width: 0; height: 56px; padding: 14px 18px; border-color: #dce6ec; border-radius: 10px; background: #f7fafb; font-size: 16px; }
.ipkk-phone .search-input:focus { border-color: #168f83; box-shadow: 0 0 0 4px rgba(8, 127, 121, .08); }
.ipkk-phone .search-btn { min-height: 56px; padding: 14px 32px; font-size: 16px; }
.ipkk-phone .result { margin-top: 28px; }
.ipkk-phone .kv-row { padding-block: 17px; }
.ipkk-phone .result-number { font-variant-numeric: tabular-nums; }
.ipkk-appstore .wrap > .card { padding: 28px; }
.ipkk-appstore .section { margin-top: 24px; }
.ipkk-appstore .section-head h2 { font-size: 22px; font-weight: 650; }
.ipkk-appstore .section-note { margin: 0 0 22px; }
.ipkk-appstore .app-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.ipkk-appstore .app-card { padding: 20px; border-color: #e4ebef; border-radius: 14px; background: #f9fbfc; gap: 16px; }
.ipkk-appstore .app-name { font-size: 16px; line-height: 1.6; }
.ipkk-appstore .app-desc { margin-top: 8px; line-height: 1.75; }
.ipkk-appstore .app-actions { margin-top: 16px; }
.ipkk-appstore .date-btn { min-height: 36px; font-weight: 500; }

/* 文章维持阅读版式；知识库首页使用 Hero、分类卡片和文章网格。 */
body.ipkk-docs { padding-top: 80px; }
.ipkk-docs article { margin-top: 48px; border-color: var(--ipkk-line); box-shadow: var(--ipkk-shadow); }
body.ipkk-docs.ipkk-guides { padding-top: 0; }
.ipkk-guides .guide-meta { margin: 12px 0 0; color: #8fa9b6; font-size: 13px; line-height: 1.8; }
.ipkk-docs .guide-index { color: #3e4a5d; font-size: 16px; line-height: 1.95; }
.ipkk-docs .guide-categories { gap: 10px; padding: 26px; }
.ipkk-docs .guide-categories a { background: #f6f9fb; border: 1px solid #dce6eb; padding: 11px 16px; border-radius: 10px; }
.ipkk-docs .guide-categories a:hover { color: var(--ipkk-accent); background: #edf7f3; border-color: #bad6ce; }
.ipkk-docs .guide-index section > h2 { margin: 44px 0 20px; color: var(--ipkk-ink); font-size: 22px; font-weight: 650; line-height: 1.55; }
.ipkk-docs .guide-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.ipkk-docs .guide-card { padding: 26px; border-radius: 16px; border-color: #dfe7ed; box-shadow: 0 3px 10px rgba(21, 46, 64, .02); transition: border-color .18s, box-shadow .18s, transform .18s; }
.ipkk-docs .guide-card:hover { background: #fff; border-color: #a7cfc4; box-shadow: var(--ipkk-shadow); transform: translateY(-2px); }
.ipkk-docs .guide-card h3 { font-size: 18px; line-height: 1.65; font-weight: 650; }
.ipkk-docs .guide-card p { margin: 14px 0 24px; color: #718493; }
.ipkk-docs .guide-read { color: var(--ipkk-accent); font-weight: 600; }

/* 工具目录与所有工具页共享的站点外壳。 */
.ipkk-tools { --bg-deep: var(--ipkk-bg); --bg-surface: #fff; --bg-card-hover: #f8fbfa; --border-subtle: #dfe7ec; --border-strong: #c6d5dd; --accent-cyan: #087f79; --text-muted: #80919d; }
.ipkk-tools :is(.bg-grid, .bg-gradient) { display: none; }
.ipkk-tools .container { width: calc(100% - 48px); max-width: var(--ipkk-width); margin: -40px auto 0; padding: 0 0 72px; }
.ipkk-tools .top-panel { padding: 30px; margin-bottom: 28px; border-color: var(--ipkk-line); border-radius: 18px; box-shadow: var(--ipkk-shadow); }
.ipkk-tools .search-wrapper { max-width: 720px; }
.ipkk-tools .search-box input { height: 56px; border: 1px solid #dce6ec; border-radius: 10px; background: #f5f9fa; font-family: inherit; font-size: 16px; }
.ipkk-tools .search-box input:focus { border-color: #168f83; box-shadow: 0 0 0 4px rgba(8, 127, 121, .08); }
.ipkk-tools .category-btn { border-color: transparent; background: #f5f8fa; border-radius: 8px; color: #637b8c; }
.ipkk-tools .category-btn.active { color: #fff; background: #163849; border-color: #163849; box-shadow: none; }
.ipkk-tools .category-btn.active :is(.cat-count, .cat-icon) { color: #a3dbc9; background: transparent; }
.ipkk-tools .tools-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.ipkk-tools .tool-card { min-width: 0; min-height: 198px; padding: 26px; border-color: #dfe7ec; border-radius: 16px; gap: 16px; animation: none; }
.ipkk-tools .tool-card::before { content: none; }
.ipkk-tools .tool-card:hover { border-color: #a7cfc4; background: #fff; box-shadow: var(--ipkk-shadow); transform: translateY(-2px); }
.ipkk-tools .tool-card h3 { font-family: inherit; font-size: 18px; font-weight: 650; line-height: 1.55; }
.ipkk-tools .tool-card p { font-size: 14px; color: #718493; line-height: 1.8; }
.ipkk-tools .tool-tag { font-family: inherit; border: 0; border-radius: 6px; background: #f1f6f8; color: #7c909d; text-transform: none; letter-spacing: 0; }
.ipkk-tools .tool-arrow { color: #087f79; }
[data-ipkk-tool] { --ipkkx-nav-h: 80px; padding-top: 80px; }
[data-ipkk-tool] .ipkkx-page-head { margin-bottom: 28px; padding-bottom: 24px; border-bottom: 1px solid var(--border-subtle, #dfe7ec); }
[data-ipkk-tool] .ipkkx-page-head h1 { font-size: 32px; font-weight: 650; line-height: 1.4; letter-spacing: -.02em; }
[data-ipkk-tool] .ipkkx-page-head p { max-width: 820px; font-size: 15px; line-height: 1.85; }
.ipkk-app .shell { width: calc(100% - 48px); max-width: var(--ipkk-width); padding: 0 0 72px; margin-top: -40px; }
.ipkk-app :is(.pane, .upload-area, .file-meta-card) { border-color: #dfe7ec; border-radius: 16px; }
.ipkk-app { --text: #182f40; --text-muted: #6b7e8e; --accent: #087f79; --border: #dfe7ec; }
.ipkk-app .workspace { display: grid; grid-template-columns: minmax(300px, 380px) minmax(0, 1fr); gap: 24px; }
.ipkk-app .pane-left { padding: 0; }
.ipkk-app .upload-area { min-height: 270px; display: flex; align-items: center; justify-content: center; background: #fff; border: 1px dashed #a9c9c3; box-shadow: var(--ipkk-shadow); }
.ipkk-app .pane-right { min-height: 270px; padding: 32px; border: 1px solid var(--ipkk-line); box-shadow: var(--ipkk-shadow); }
.ipkk-app .upload-mark { color: var(--ipkk-accent); }
.ipkk-app .empty-checks { gap: 16px; }
.ipkk-app .empty-check { color: #60798a; font-size: 15px; line-height: 1.75; }
.ipkk-app .ec-dot { background: #48aa95; }

/* 页脚保留完整关键词和信息入口。 */
body :is(.footer, .ipkkx-footer, .ipkk-footer) {
  padding: 44px 24px 32px;
  margin-top: 0;
  background: #0c2130;
  color: #8ea5b4;
  font-family: var(--ipkk-font);
  font-size: 12px;
  line-height: 1.9;
  border-top: 1px solid rgba(195, 221, 226, .1);
}
body :is(.footer, .ipkkx-footer, .ipkk-footer)::before { content: ''; display: block; width: 108px; height: 44px; margin: 0 auto 24px; background: url('/ipkk.com.logo.svg') center / contain no-repeat; opacity: .9; }
body :is(.footer, .ipkkx-footer, .ipkk-footer) > :is(nav, p) { max-width: var(--ipkk-width); margin-inline: auto !important; }
body :is(.footer, .ipkkx-footer, .ipkk-footer) nav a { color: #c0d3de !important; text-decoration: none; }
body :is(.footer, .ipkkx-footer, .ipkk-footer) nav a:hover { color: #92ecd0 !important; }

@media (max-width: 1100px) {
  [data-site-nav] :is(.nav-tab, .ipkkx-tab, .ipkk-tab) { padding-inline: 12px; }
  [data-site-nav] :is(.nav-tabs, .ipkkx-tabs, .ipkk-tabs) { gap: 4px; }
  .ipkk-page :is(.header, .hero, .ipkk-hero)::before { background-position: calc(50% + 320px) 50%; opacity: .4; }
  .ipkk-appstore .app-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
  :root { --ipkk-hero-title-size: 32px; }
  .ipkk-dns .hero-inner { min-height: 144px; padding-right: 208px; }
  .ipkk-dns .leak-animation, .ipkk-dns .leak-animation .box { width: 144px; height: 144px; }
  .ipkk-docs .guide-grid, .ipkk-tools .tools-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ipkk-claude .card { padding: 22px; }
  .ipkk-app .workspace { grid-template-columns: 1fr; }
  /* DOM 保持三个 TD；窄屏菜单排到值下方，空菜单单元格不占空间。 */
  .ipkk-home .info-table, .ipkk-home .info-table tbody { display: block; }
  .ipkk-home .info-table colgroup { display: none; }
  .ipkk-home .info-table tr { display: grid; grid-template-columns: 20% minmax(0, 1fr); }
  .ipkk-home .info-table td:first-child { width: auto; min-width: 0; white-space: normal; }
  .ipkk-home .result-label-cell { grid-column: 1; grid-row: 1 / span 2; align-self: center; }
  .ipkk-home .result-value-cell { grid-column: 2; grid-row: 1; align-self: center; min-width: 0; }
  .ipkk-home .info-table .result-menu-cell { grid-column: 2; grid-row: 2; padding: 0 24px 14px; min-width: 0; }
  .ipkk-home .result-menu-cell:empty { display: none; }
}

@media (max-width: 760px) {
  .ipkk-home .world-clock-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
  :root { --ipkk-hero-title-size: 26px; --ipkk-hero-subtitle-size: 14px; }
  [data-site-nav] { height: 64px; padding: 10px 12px; }
  [data-site-nav] :is(.header-nav-inner-box, .ipkkx-nav-box, .ipkk-nav-box) { gap: 0; }
  [data-site-nav] :is(.nav-logo-svg, .ipkkx-logo, .ipkk-logo) img { width: clamp(96px, calc(100vw - 264px), 112px); height: 46px; }
  [data-site-nav] :is(.nav-tabs, .ipkkx-tabs, .ipkk-tabs) { gap: 4px; }
  [data-site-nav] :is(.nav-tab, .ipkkx-tab, .ipkk-tab) { min-height: 40px; padding: 6px 8px; font-size: 12px; letter-spacing: 0; }
  /* 手机导航 64px、卡片重叠 28px，继续保持内容上下等距。 */
  .ipkk-page :is(.header, .hero, .ipkk-hero) { padding: 76px 20px 40px; }
  .ipkk-page :is(.header, .hero, .ipkk-hero)::before { background-position: calc(100% + 245px) center; opacity: .22; }
  .ipkk-page .hero-privacy { font-size: 12px; }
  .ipkk-page .hero-btn { width: auto; min-height: 46px; padding: 12px 18px; font-size: 14px; }
  .ipkk-page :is(.main, .wrap) { width: calc(100% - 24px); margin-top: -28px; padding-bottom: 48px; }
  .ipkk-page .card { border-radius: 14px; }
  .ipkk-page .card-header { padding: 18px; gap: 10px; }
  .ipkk-page .card-title, .ipkk-page .card-title h1 { font-size: 14px !important; }
  .ipkk-page .card-title { gap: 7px; }
  .ipkk-page :is(.card-action, .btn-ghost) { padding: 6px 10px; font-size: 12px; flex-shrink: 0; }
  .ipkk-page :is(.webrtc-desc, .card-body) { padding: 18px; }
  .ipkk-page :is(.webrtc-grid, .conn-grid) { padding: 0 18px 18px; gap: 12px; }
  .ipkk-page :is(.webrtc-item, .conn-item) { padding: 13px; }
  .ipkk-home .card { margin-bottom: 18px; }
  .ipkk-home .info-table tr { grid-template-columns: 120px minmax(0, 1fr); }
  .ipkk-home .info-table td { padding: 12px 10px; }
  .ipkk-home .info-table td:first-child { width: auto; min-width: 0; white-space: normal; overflow-wrap: anywhere; }
  .ipkk-home .info-table .result-menu-cell { padding: 0 10px 12px; }
  .ipkk-home .risk-row { max-width: 100%; flex-wrap: wrap; justify-content: center; gap: 6px; }
  .ipkk-home .risk-segments { max-width: 100%; flex-wrap: wrap; justify-content: center; row-gap: 6px; }
  .ipkk-home .seg:not(.active) { width: clamp(6px, 2vw, 14px); }
  .ipkk-home .sysinfo-table td { padding: 13px 18px; }
  .ipkk-home :is(.world-clock-dialog, .location-map-dialog) { width: calc(100% - 24px); max-height: calc(100dvh - 24px); padding: 20px; border-radius: 14px; }
  .ipkk-home :is(.world-clock-heading, .location-map-heading) h2 { font-size: 22px; }
  .ipkk-home :is(.world-clock-close, .location-map-close) { width: 36px; height: 36px; }
  .ipkk-home .world-clock-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 20px; }
  .ipkk-home .world-clock-item { padding: 12px; }
  .ipkk-home .world-clock-time { font-size: 24px; margin-top: 10px; }
  .ipkk-dns .hero-inner { min-height: 0; padding-right: 0; }
  .ipkk-dns .hero-stage { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 20px; align-items: center; }
  .ipkk-dns .leak-animation { position: relative; top: auto; right: auto; grid-column: 1; grid-row: 1; align-self: center; margin: 0; transform: none; }
  .ipkk-dns .leak-animation, .ipkk-dns .leak-animation .box { width: 96px; height: 96px; }
  .ipkk-dns .leak-animation .box { box-shadow: 0 0 0 8px rgba(121, 231, 201, .03), 0 0 0 16px rgba(121, 231, 201, .025); }
  .ipkk-dns .leak-animation .box .percent { font-size: 28px; }
  .ipkk-dns .hero-actions { grid-column: 2; grid-row: 1; width: 100%; margin-top: 0; }
  .ipkk-dns .hero-actions-buttons { width: 100%; display: grid; grid-template-columns: 1fr; gap: 8px; }
  .ipkk-dns .hero-btn { width: 100%; min-height: 44px; padding: 9px 12px; font-size: 13px; }
  .ipkk-dns .hero-actions-status { padding: 12px 14px; }
  .ipkk-dns .hero-actions-status-subtitle { margin-top: 6px; font-size: 12px; }
  .ipkk-dns .info-grid { gap: 18px; }
  .ipkk-fingerprint .hero-actions { gap: 12px; }
  .ipkk-claude .hero-inner { flex-direction: column; align-items: flex-start; gap: 18px; }
  .ipkk-claude .toggle-wrap { margin-top: 0; }
  .ipkk-claude .grid { gap: 16px; }
  .ipkk-claude .card { padding: 20px; }
  .ipkk-claude .card-h { gap: 10px; }
  .ipkk-claude #card-trust .card-h { flex-direction: column; align-items: flex-start; }
  .ipkk-claude .trust-heading { width: 100%; gap: 12px; }
  .ipkk-claude .trust-support-h { flex-shrink: 1; }
  .ipkk-claude .trust-support-k { flex: 1; }
  .ipkk-claude .ip-value { font-size: 22px; }
  .ipkk-claude .trust-desc { font-size: 16px; }
  .ipkk-claude .status-card { margin-top: 18px; }
  .ipkk-phone .wrap > .card { padding: 20px; }
  .ipkk-phone .search-form { gap: 8px; }
  .ipkk-phone .search-input { height: 50px; padding: 12px; font-size: 14px; }
  .ipkk-phone .search-btn { min-height: 50px; padding: 12px 18px; font-size: 14px; }
  .ipkk-appstore .wrap > .card { padding: 20px; }
  .ipkk-appstore .app-grid { grid-template-columns: 1fr; gap: 14px; }
  .ipkk-appstore .app-card { padding: 16px; gap: 14px; }
  .ipkk-appstore .app-icon { width: 52px; height: 52px; border-radius: 12px; }
  .ipkk-appstore .meta-bar .meta-title { font-size: 16px; }
  body.ipkk-docs { padding-top: 64px; }
  .ipkk-docs article { margin-top: 28px; }
  .ipkk-guides .guide-meta { font-size: 12px; }
  .ipkk-docs .guide-categories { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 18px; gap: 8px; }
  .ipkk-docs .guide-categories a { flex-direction: column; align-items: flex-start; justify-content: space-between; gap: 4px; padding: 10px 12px; font-size: 13px; }
  .ipkk-docs .guide-grid { grid-template-columns: 1fr; gap: 14px; }
  .ipkk-docs .guide-card { padding: 22px; }
  .ipkk-docs .guide-index section > h2 { margin-top: 32px; font-size: 21px; }
  .ipkk-tools .container, .ipkk-app .shell { width: calc(100% - 24px); margin-top: -28px; padding-bottom: 48px; }
  .ipkk-tools .top-panel { padding: 22px 18px; }
  .ipkk-tools .search-box input { height: 50px; font-size: 14px; }
  .ipkk-tools .tools-grid { grid-template-columns: 1fr; gap: 14px; }
  .ipkk-tools .tool-card { min-height: 0; padding: 22px; }
  .ipkk-app .workspace { grid-template-columns: 1fr; gap: 18px; }
  .ipkk-app .upload-area { min-height: 220px; }
  .ipkk-app .pane-right { min-height: 0; padding: 24px; }
  [data-ipkk-tool] { --ipkkx-nav-h: 64px; padding-top: 64px; }
  [data-ipkk-tool] .ipkkx-page-head h1 { font-size: 25px; }
  [data-ipkk-tool] .ipkkx-page-head p { font-size: 14px; }
  body :is(.footer, .ipkkx-footer, .ipkk-footer) { padding: 34px 20px 26px; }
}

@media (max-width: 359px) {
  [data-site-nav] :is(.nav-logo-svg, .ipkkx-logo, .ipkk-logo) img { width: 88px; height: 36px; }
  [data-site-nav] :is(.nav-tabs, .ipkkx-tabs, .ipkk-tabs) { gap: 2px; }
  [data-site-nav] :is(.nav-tab, .ipkkx-tab, .ipkk-tab) { padding-inline: 5px; }
  .ipkk-home .world-clock-item { padding: 10px; }
  .ipkk-home .world-clock-time { font-size: 22px; }
}

@media (prefers-reduced-motion: reduce) {
  .ipkk-page :is(.hero-btn, .tool-card, .guide-card) { transition: none; transform: none; }
}
