/* 剑客 jianke 1.5.26 — 本地封面 · 分类图标 · 搜索居中主栏 · 页脚友链 · 无目录全宽 */
:root {
  --jk-ibm-blue: #0f62fe;
  --jk-ibm-blue-70: #0043ce;
  --jk-ibm-blue-30: #a6c8ff;
  --jk-ibm-blue-10: #edf5ff;
  --jk-blue: var(--jk-ibm-blue);
  --jk-blue-2: var(--jk-ibm-blue-70);
  --jk-bg: #f3f4f6;
  --jk-card: #ffffff;
  --jk-text: #111827;
  --jk-muted: #6b7280;
  --jk-line: rgba(0, 0, 0, 0.06);
  --jk-radius: 16px;
  --jk-radius-sm: 12px;
  --jk-radius-pill: 999px;
  --jk-shadow: 0 1px 2px rgba(0,0,0,.04), 0 8px 24px rgba(0,0,0,.06);
  --jk-shadow-hover: 0 4px 8px rgba(0,0,0,.06), 0 16px 40px rgba(0,0,0,.1);
  --jk-side-w: 220px;
  --jk-side-inset: 18px;
  --jk-side-gap: 16px;
  --jk-side-bg: #ffffff;
  --jk-shell-bg: #f7f8fa;
  --jk-topbar-h: 60px;
  --jk-feed-subnav-h: 44px;
  --bodyBground: var(--jk-shell-bg);
  --conBgcolor: var(--jk-card);
  --fontColor: var(--jk-text);
  --lightColor: var(--jk-muted);
  --buttonBgColor: var(--jk-blue);
  --buttonTextColor: #fff;
  --buttonBorderColor: var(--jk-blue);
  --aHoverColor: var(--jk-blue-2);
  --marRadius: var(--jk-radius-sm);
}


*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
html.jk-instant-scroll { scroll-behavior: auto !important; }

html {
  background: var(--jk-side-bg);
  overflow-x: hidden;
}
body.jk-body.jk-app {
  margin: 0;
  font-family: system-ui, -apple-system, "PingFang SC", "Noto Sans SC", "Helvetica Neue", Arial, sans-serif;
  background: var(--jk-side-bg);
  color: var(--jk-text);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
  min-height: 100dvh;
  padding: 0;
  overflow-x: hidden;
}

a { color: var(--jk-blue); text-decoration: none; }
a:hover { color: var(--jk-blue-2); }
img { max-width: 100%; height: auto; display: block; }

.container { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 20px; }

/* ========== Left sidenav (Marvis-like, light gray) ========== */
.jk-sidenav {
  position: fixed;
  top: 0; left: 0;
  width: var(--jk-side-w);
  height: 100vh;
  height: 100dvh;
  background: var(--jk-side-bg);
  z-index: 1200;
  display: flex;
  flex-direction: column;
  padding: 24px 16px 18px;
  border-right: 1px solid var(--jk-line);
  overflow: hidden;
  box-shadow: none;
}

.jk-sidenav-top { flex: 0 0 auto; }

.jk-sidenav-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border-radius: 0;
  padding: 6px 2px 14px;
  margin-bottom: 14px;
  overflow: visible;
  box-shadow: none;
}
.jk-sidenav-logo img {
  width: 100%;
  height: auto;
  max-height: 52px;
  object-fit: contain;
  display: block;
  background: transparent;
}

.jk-sidenav-search {
  position: relative;
  margin-bottom: 22px;
}
.jk-sidenav-search .jk-search-ico {
  position: absolute; left: 12px; top: 50%; transform: translateY(-50%);
  color: var(--jk-muted); pointer-events: none; display: flex;
}
.jk-sidenav-search input {
  width: 100%;
  border: 0;
  background: #fff;
  border-radius: var(--jk-radius-pill);
  padding: 10px 12px 10px 34px;
  font-size: 0.875rem;
  color: var(--jk-text);
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
  outline: none;
}
.jk-sidenav-search input:focus {
  box-shadow: 0 0 0 3px rgba(15, 98, 254,.18);
}

.jk-sidenav-nav {
  flex: 1 1 auto;
  overflow-y: auto;
  min-height: 0;
  padding-right: 2px;
}

/* Custom short-label sidenav */
.jk-nav-list {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 6px;
}
.jk-nav-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 10px;
  border-radius: 10px;
  color: var(--jk-text) !important;
  font-size: 0.875rem;
  font-weight: 600;
  transition: background .15s, color .15s;
}
.jk-nav-ico {
  width: 18px; height: 18px; flex: 0 0 18px;
  background: currentColor;
  opacity: 0.55;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 11h6V5H4v6zm0 8h6v-6H4v6zm8 0h6v-6h-6v6zm0-14v6h6V5h-6z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 11h6V5H4v6zm0 8h6v-6H4v6zm8 0h6v-6h-6v6zm0-14v6h6V5h-6z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="home"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 3l9 8h-3v9h-5v-6H11v6H6v-9H3l9-8z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 3l9 8h-3v9h-5v-6H11v6H6v-9H3l9-8z'/%3E%3C/svg%3E");
}
.jk-nav-link[data-icon="phone"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 2h10a2 2 0 012 2v16a2 2 0 01-2 2H7a2 2 0 01-2-2V4a2 2 0 012-2zm0 3v12h10V5H7zm5 14a1.2 1.2 0 100-2.4A1.2 1.2 0 0012 19z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 2h10a2 2 0 012 2v16a2 2 0 01-2 2H7a2 2 0 01-2-2V4a2 2 0 012-2zm0 3v12h10V5H7zm5 14a1.2 1.2 0 100-2.4A1.2 1.2 0 0012 19z'/%3E%3C/svg%3E");
}
.jk-nav-link[data-icon="code"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M8.7 16.7L4 12l4.7-4.7 1.4 1.4L6.8 12l3.3 3.3-1.4 1.4zm6.6 0l-1.4-1.4 3.3-3.3-3.3-3.3 1.4-1.4L20 12l-4.7 4.7z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M8.7 16.7L4 12l4.7-4.7 1.4 1.4L6.8 12l3.3 3.3-1.4 1.4zm6.6 0l-1.4-1.4 3.3-3.3-3.3-3.3 1.4-1.4L20 12l-4.7 4.7z'/%3E%3C/svg%3E");
}
.jk-nav-link[data-icon="play"] .jk-nav-ico,
.jk-nav-link[data-icon="game"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M8 5v14l11-7L8 5z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M8 5v14l11-7L8 5z'/%3E%3C/svg%3E");
}
.jk-nav-link[data-icon="star"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 17.3l6.18 3.73-1.64-7.03L21 9.24l-7.19-.62L12 2 10.19 8.62 3 9.24l4.46 4.76L5.82 21z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 17.3l6.18 3.73-1.64-7.03L21 9.24l-7.19-.62L12 2 10.19 8.62 3 9.24l4.46 4.76L5.82 21z'/%3E%3C/svg%3E");
}
.jk-nav-link[data-icon="music"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 3v10.55A4 4 0 1014 17V7h4V3h-6z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 3v10.55A4 4 0 1014 17V7h4V3h-6z'/%3E%3C/svg%3E");
}
.jk-nav-link[data-icon="book"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 4h7a3 3 0 013 3v13a2 2 0 00-2-2H4V4zm9 0h7v14h-5a2 2 0 00-2 2V7a3 3 0 00-3-3z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 4h7a3 3 0 013 3v13a2 2 0 00-2-2H4V4zm9 0h7v14h-5a2 2 0 00-2 2V7a3 3 0 00-3-3z'/%3E%3C/svg%3E");
}
.jk-nav-link[data-icon="explore"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2a10 10 0 100 20 10 10 0 000-20zm3.9 6.1l-2.2 5.1-5.1 2.2 2.2-5.1 5.1-2.2z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2a10 10 0 100 20 10 10 0 000-20zm3.9 6.1l-2.2 5.1-5.1 2.2 2.2-5.1 5.1-2.2z'/%3E%3C/svg%3E");
}
.jk-nav-link[data-icon="video"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M3 6h12a2 2 0 012 2v1.5l4-2.5v11l-4-2.5V16a2 2 0 01-2 2H3V6z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M3 6h12a2 2 0 012 2v1.5l4-2.5v11l-4-2.5V16a2 2 0 01-2 2H3V6z'/%3E%3C/svg%3E");
}
.jk-nav-link[data-icon="image"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M5 4h14a2 2 0 012 2v12a2 2 0 01-2 2H5a2 2 0 01-2-2V6a2 2 0 012-2zm2 11l3-4 2 3 3-4 3 5H7zm1-7a1.5 1.5 0 100 3 1.5 1.5 0 000-3z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M5 4h14a2 2 0 012 2v12a2 2 0 01-2 2H5a2 2 0 01-2-2V6a2 2 0 012-2zm2 11l3-4 2 3 3-4 3 5H7zm1-7a1.5 1.5 0 100 3 1.5 1.5 0 000-3z'/%3E%3C/svg%3E");
}
.jk-nav-link[data-icon="folder"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M10 4l2 2h8a2 2 0 012 2v10a2 2 0 01-2 2H4a2 2 0 01-2-2V6a2 2 0 012-2h6z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M10 4l2 2h8a2 2 0 012 2v10a2 2 0 01-2 2H4a2 2 0 01-2-2V6a2 2 0 012-2h6z'/%3E%3C/svg%3E");
}
.jk-nav-back {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 12px; margin-bottom: 6px;
  border-radius: 12px;
  color: var(--jk-muted) !important;
  font-size: 0.82rem; font-weight: 600;
}
.jk-nav-back:hover { background: #fff; color: var(--jk-text) !important; }
.jk-nav-back .jk-nav-ico {
  width: 16px; height: 16px; flex: 0 0 16px;
  background: currentColor; opacity: .7;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M15.4 7.4L14 6l-6 6 6 6 1.4-1.4L10.8 12z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M15.4 7.4L14 6l-6 6 6 6 1.4-1.4L10.8 12z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.jk-nav-heading {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--jk-muted);
  padding: 8px 12px 6px;
}
.jk-nav-section--cat .jk-nav-link {
  font-size: 0.86rem;
  font-weight: 550;
  padding: 8px 12px;
}
.jk-nav-count {
  margin-left: auto;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--jk-muted);
  background: rgba(0,0,0,.04);
  border-radius: 999px;
  padding: 1px 7px;
  min-width: 1.4em;
  text-align: center;
}
.jk-nav-link.is-active .jk-nav-count,
.jk-nav-link[aria-current="page"] .jk-nav-count {
  color: var(--jk-blue);
  background: rgba(15, 98, 254,.1);
}

.jk-nav-link:hover,
.jk-nav-link.is-active,
.jk-nav-link[aria-current="page"] {
  background: #fff;
  color: var(--jk-text) !important;
}
.jk-nav-link.is-active .jk-nav-ico,
.jk-nav-link[aria-current="page"] .jk-nav-ico {
  opacity: 1;
  color: var(--jk-blue);
}

.jk-sidenav-foot {
  flex: 0 0 auto;
  padding-top: 12px;
  border-top: 1px solid var(--jk-line);
  margin-top: 8px;
}
.jk-sidenav-profile {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 10px; border-radius: 12px;
  color: var(--jk-text) !important;
}
.jk-sidenav-profile:hover { background: #fff; }
.jk-profile-guest {
  display: flex; align-items: center; justify-content: center;
  background: #fff; color: var(--jk-muted); border: 1px solid var(--jk-line);
}
.jk-profile-name {
  font-size: 0.875rem; font-weight: 600;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

.jk-sidenav-mask {
  display: none;
  position: fixed; inset: 0;
  background: rgba(15, 23, 42, .35);
  z-index: 1100;
}

/* ========== Shell (main column) ========== */
.jk-shell {
  margin-left: var(--jk-side-w);
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  background: var(--jk-shell-bg);
  overflow-x: clip;
  position: relative;
  z-index: 1;
}
.jk-shell-inner {
  flex: 1 1 auto;
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 36px 36px 52px;
}

.jk-topbar {
  display: flex;
  align-items: center;
  gap: 18px;
  height: var(--jk-topbar-h);
  padding: 0 28px 0 22px;
  background: rgba(247,248,250,.92);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--jk-line);
  position: sticky; top: 0; z-index: 1000;
}
.jk-topbar-brand {
  display: none;
  flex: 0 1 auto;
  min-width: 0;
  max-width: min(160px, 42vw);
  line-height: 0;
}
.jk-topbar-brand a {
  display: flex; align-items: center; color: var(--jk-text);
  max-width: 100%;
}
.jk-topbar-brand img {
  display: block;
  height: 32px;
  width: auto;
  max-width: 100%;
  object-fit: contain;
  background: transparent;
}
.jk-topbar-nav {
  display: flex; align-items: center; gap: 8px;
  flex: 1 1 auto; min-width: 0; max-width: none;
  overflow-x: auto; scrollbar-width: none;
}
.jk-topbar-nav::-webkit-scrollbar { display: none; }
.jk-top-link {
  flex: 0 0 auto;
  padding: 8px 14px;
  border-radius: 999px;
  color: var(--jk-text) !important;
  font-size: 0.84rem;
  font-weight: 600;
  white-space: nowrap;
}
.jk-top-link:hover { background: #e8eaef; }
.jk-top-link.is-active {
  background: var(--jk-blue);
  color: #fff !important;
}
.jk-topbar-actions {
  flex: 0 0 auto;
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 10px;
}
.jk-topbar-search-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 50%;
  border: 1px solid var(--jk-line); background: #fff;
  color: var(--jk-muted); cursor: pointer; padding: 0;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
}
.jk-topbar-search-btn:hover {
  color: var(--jk-blue); border-color: var(--jk-blue);
}
.jk-topbar-user {
  display: flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 50%;
  background: #fff; border: 1px solid var(--jk-line);
  overflow: hidden; color: var(--jk-muted);
}
.jk-topbar-user img { width: 100%; height: 100%; object-fit: cover; }

/* Spark-like full-screen search overlay (balanced proportions) */
.jk-search-overlay {
  position: fixed; inset: 0; z-index: 3000;
  background: rgba(247, 248, 250, 0.92);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  display: none;
  align-items: flex-start; justify-content: center;
  padding: min(18vh, 160px) 24px 40px;
  pointer-events: auto;
}
.jk-search-overlay.is-open {
  display: flex;
}
.jk-search-overlay[hidden] { display: none !important; }
.jk-search-overlay-close {
  position: absolute; top: 20px; right: 24px;
  width: 48px; height: 48px; border: 0; border-radius: 50%;
  background: #fff; color: #111; font-size: 30px; line-height: 1;
  cursor: pointer; z-index: 2;
  box-shadow: 0 1px 3px rgba(0,0,0,.08);
  display: inline-flex; align-items: center; justify-content: center;
}
.jk-search-overlay-close:hover { background: #f3f4f6; }
.jk-search-overlay-form {
  width: min(600px, 100%);
  display: flex; flex-direction: column; align-items: stretch; gap: 18px;
  margin-top: 0;
}
.jk-search-overlay-logo {
  display: flex; justify-content: center;
}
.jk-search-overlay-logo img {
  height: 56px; width: auto; max-width: 88%; object-fit: contain;
  background: transparent;
}
.jk-search-overlay-box {
  position: relative; display: flex; align-items: center;
}
.jk-search-overlay-box .jk-search-ico {
  position: absolute; left: 18px; top: 50%; transform: translateY(-50%);
  color: var(--jk-muted); pointer-events: none; display: flex;
}
.jk-search-overlay-input {
  width: 100%; height: 58px; border: 1px solid #e5e7eb; border-radius: 16px;
  padding: 0 108px 0 48px; font-size: 1.05rem; outline: none; background: #fff;
  box-shadow: 0 10px 32px rgba(0,0,0,.07);
}
.jk-search-overlay-input:focus {
  border-color: rgba(15, 98, 254,.45);
  box-shadow: 0 0 0 3px rgba(15, 98, 254,.16), 0 10px 32px rgba(0,0,0,.07);
}
.jk-search-overlay-go {
  position: absolute; right: 7px; top: 7px; bottom: 7px;
  border: 0; border-radius: 12px; padding: 0 20px;
  background: var(--jk-blue); color: #fff; font-weight: 600; cursor: pointer;
  font-size: 0.95rem;
}

.jk-nav-toggle {
  display: none;
  width: 40px; height: 40px;
  border: 0; background: #fff; border-radius: 12px;
  flex-direction: column; align-items: center; justify-content: center; gap: 5px;
  cursor: pointer; box-shadow: var(--jk-shadow);
}
.jk-nav-toggle-bars {
  display: none; flex-direction: column; align-items: center; justify-content: center; gap: 5px;
}
.jk-nav-toggle-bars span {
  display: block; width: 18px; height: 2px; background: var(--jk-text); border-radius: 2px;
}
.jk-nav-toggle-label {
  display: none;
  font-size: 0.72rem;
  font-weight: 650;
  color: #475569;
  line-height: 1;
  letter-spacing: 0.02em;
}

/* ========== Main head + pills ========== */
.jk-main { width: 100%; }
.jk-main-head { margin-bottom: 30px; }
.jk-page-title {
  margin: 0 0 4px;
  font-size: 1.75rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--jk-text);
}
.jk-page-sub { margin: 0 0 20px; color: var(--jk-muted); font-size: 0.95rem; }

.jk-filter-pills {
  display: flex; flex-wrap: wrap; gap: 8px;
  margin-top: 14px;
}
.jk-pill {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 5px 12px;
  border-radius: var(--jk-radius-pill);
  background: #f0f2f5;
  color: #4b5563 !important;
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  border: 1px solid transparent;
  transition: background .15s, color .15s, transform .15s, box-shadow .15s, border-color .15s;
}
.jk-pill:hover { background: #e7eaf0; color: var(--jk-text) !important; }
.jk-pill.is-active {
  background: rgba(15, 98, 254, 0.09);
  color: var(--jk-blue) !important;
  border-color: rgba(15, 98, 254, 0.28);
  box-shadow: none;
  font-weight: 600;
}

/* ========== Bento: large slide + masonry ========== */
.jk-bento {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}

.jk-bento-hero.jk-slide-cell {
  grid-column: 1 / -1;
  border-radius: 22px;
  overflow: hidden;
  box-shadow: var(--jk-shadow);
  background: #111;
  min-height: 280px;
  height: clamp(280px, 36vw, 420px);
}

.jk-carousel { position: relative; width: 100%; height: 100%; }
.jk-carousel-track { position: relative; width: 100%; height: 100%; }
.jk-carousel-slide {
  position: absolute; inset: 0;
  display: block;
  background-size: cover;
  background-position: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity .55s ease;
  color: #fff !important;
}
.jk-carousel-slide.is-active { opacity: 1; pointer-events: auto; }

.jk-carousel-slide.is-grad.tone-0 {
  background: linear-gradient(135deg, #0f172a 0%, #1d4ed8 55%, #38bdf8 100%);
}
.jk-carousel-slide.is-grad.tone-1 {
  background: linear-gradient(135deg, #111827 0%, #7c3aed 50%, #f472b6 100%);
}
.jk-carousel-slide.is-grad.tone-2 {
  background: linear-gradient(135deg, #064e3b 0%, #059669 45%, #a7f3d0 100%);
}

.jk-carousel-overlay {
  position: absolute; inset: 0;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 36px 40px;
  background: linear-gradient(180deg, transparent 35%, rgba(0,0,0,.55) 100%);
}
.jk-carousel-title {
  margin: 0 0 8px;
  font-size: clamp(1.5rem, 3.2vw, 2.4rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  color: #fff;
  text-shadow: 0 2px 12px rgba(0,0,0,.25);
}
.jk-carousel-desc {
  margin: 0;
  max-width: 36rem;
  font-size: 1rem;
  color: rgba(255,255,255,.88);
}

.jk-carousel-btn {
  display: none !important; /* 1.5.6: hide strong circular prev/next */
}
.jk-carousel-prev { left: 14px; }
.jk-carousel-next { right: 14px; }
.jk-carousel-btn:hover { background: #fff; }

.jk-carousel-dots {
  position: absolute; left: 0; right: 0; bottom: 14px;
  display: flex; justify-content: center; align-items: center;
  gap: 10px; z-index: 2; pointer-events: none;
  padding: 0 16px;
}
.jk-carousel-dot {
  width: 7px; height: 7px; border-radius: 50%;
  border: 0; background: rgba(255,255,255,.5); cursor: pointer; padding: 0;
  pointer-events: auto; flex: 0 0 auto;
  transition: width .2s, background .2s;
}
.jk-carousel-dot.is-active { background: #fff; width: 20px; border-radius: 999px; }

/* Even card grid (2–3 cols) — no sparse masonry columns */
.jk-masonry {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
  align-items: stretch;
}
.jk-mcard {
  margin: 0;
  background: var(--jk-card);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: var(--jk-shadow);
  border: 1px solid var(--jk-line);
  transition: transform .2s, box-shadow .2s;
  display: flex;
  flex-direction: column;
  width: 100%;
  min-width: 0;
}
.jk-mcard:hover {
  transform: translateY(-3px);
  box-shadow: var(--jk-shadow-hover);
}

.jk-mcard-cover {
  position: relative;
  display: block;
  background: #e5e7eb;
  overflow: hidden;
  flex: 0 0 auto;
}
.jk-mcard-cover img {
  width: 100%;
  height: 148px;
  object-fit: cover;
  display: block;
}
.jk-mcard--mid .jk-mcard-cover img,
.jk-mcard--tall .jk-mcard-cover img { height: 148px; }
.jk-mcard-cover.is-placeholder .jk-mcard-ph {
  display: block;
  height: 148px;
  background:
    radial-gradient(circle at 30% 30%, rgba(15, 98, 254,.25), transparent 50%),
    linear-gradient(135deg, #e5e7eb, #f3f4f6 60%, #dbeafe);
}
.jk-mcard--tall .jk-mcard-cover.is-placeholder .jk-mcard-ph,
.jk-mcard--mid .jk-mcard-cover.is-placeholder .jk-mcard-ph { height: 148px; }

.jk-badge {
  position: absolute; top: 10px; left: 10px;
  font-size: 0.7rem; font-weight: 700;
  padding: 4px 8px; border-radius: 999px;
  color: #fff;
}
.jk-badge-top { background: #ef4444; }
.jk-badge-new { background: var(--jk-blue); }

.jk-mcard-body { padding: 16px 18px 18px; flex: 1 1 auto; display: flex; flex-direction: column; }
.jk-mcard-meta {
  display: flex; justify-content: space-between; gap: 8px;
  font-size: 0.75rem; color: var(--jk-muted); margin-bottom: 6px;
}
.jk-mcard-meta a { color: var(--jk-muted); }
.jk-mcard-title {
  margin: 0 0 8px;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: -0.01em;
}
.jk-mcard-title a { color: var(--jk-text); }
.jk-mcard-title a:hover { color: var(--jk-blue); }
.jk-mcard-excerpt {
  margin: 0 0 12px;
  font-size: 0.84rem;
  color: var(--jk-muted);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.jk-mcard-foot {
  display: flex; justify-content: space-between; align-items: center;
  font-size: 0.78rem; color: var(--jk-muted);
  margin-top: auto;
}
.jk-mcard-author a { color: var(--jk-muted); }
.jk-mcard-stats { display: inline-flex; align-items: center; gap: 4px; }

.jk-empty {
  text-align: center; color: var(--jk-muted);
  padding: 48px 16px; background: var(--jk-card);
  border-radius: var(--jk-radius); box-shadow: var(--jk-shadow);
}

/* Pagination */
.jk-pagination {
  margin-top: 36px;
  display: flex; justify-content: center; flex-wrap: wrap; gap: 8px;
}
.jk-pagination a, .jk-pagination span {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 36px; height: 36px; padding: 0 12px;
  border-radius: 10px; background: var(--jk-card);
  color: var(--jk-text); border: 1px solid var(--jk-line);
  font-size: 0.875rem;
}
.jk-pagination .active, .jk-pagination .current {
  background: var(--jk-blue); color: #fff; border-color: var(--jk-blue);
}

/* Article */
.jk-article {
  background: var(--jk-card);
  border-radius: 20px;
  box-shadow: var(--jk-shadow);
  border: 1px solid var(--jk-line);
  padding: 36px 40px;
  margin-bottom: 24px;
}
.jk-article-title { margin: 0 0 12px; font-size: 1.75rem; font-weight: 800; letter-spacing: -0.02em; }
.jk-article-meta { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; color: var(--jk-muted); font-size: 0.875rem; margin-bottom: 20px; }
.log-meta-left { display: flex; flex-wrap: wrap; gap: 12px; }
.jk-article-cover { margin-bottom: 20px; border-radius: 14px; overflow: hidden; }
.jk-article-cover img { width: 100%; }
.jk-tags { margin-top: 24px; }
.jk-neighbor { margin: 28px 0 8px; }
.jk-neighbor-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  width: 100%;
}
.jk-neighbor-card {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 14px 16px;
  border-radius: 14px;
  background: var(--jk-bg);
  border: 1px solid var(--jk-line);
  color: var(--jk-text) !important;
  text-decoration: none !important;
  min-width: 0;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.jk-neighbor-card:hover {
  border-color: rgba(15, 98, 254,.35);
  box-shadow: 0 4px 14px rgba(15,23,42,.06);
}
.jk-neighbor-card.is-empty {
  visibility: hidden;
  pointer-events: none;
  border: 0;
  background: transparent;
  padding: 0;
}
.jk-neighbor-label {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--jk-muted);
  letter-spacing: 0.02em;
}
.jk-neighbor-name {
  font-size: 0.92rem;
  font-weight: 600;
  line-height: 1.4;
  color: var(--jk-text);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.jk-neighbor-next { text-align: right; }
.jk-neighbor-next .jk-neighbor-label,
.jk-neighbor-next .jk-neighbor-name { align-self: flex-end; }
@media (max-width: 640px) {
  .jk-neighbor-grid { grid-template-columns: 1fr; }
  .jk-neighbor-next { text-align: left; }
  .jk-neighbor-next .jk-neighbor-label,
  .jk-neighbor-next .jk-neighbor-name { align-self: flex-start; }
}
.jk-article-layout { display: flex; gap: 20px; align-items: flex-start; }
.jk-article-col { flex: 1; min-width: 0; }
.jk-sidebar.column-small, .jk-sidebar.side-bar {
  width: 280px; flex: 0 0 280px;
}
.jk-sidebar .widget {
  background: var(--jk-card); border-radius: 16px; padding: 16px;
  box-shadow: var(--jk-shadow); border: 1px solid var(--jk-line); margin-bottom: 16px;
}

/* Footer — contained inside shell, never under sidenav */
.jk-footer {
  border-top: 1px solid var(--jk-line);
  padding: 22px 28px 32px;
  color: var(--jk-muted);
  font-size: 0.84rem;
  background: var(--jk-shell-bg);
  overflow: hidden;
  position: relative;
  z-index: 1;
}
.jk-footer-inner {
  max-width: 1280px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 16px;
  overflow: hidden;
}
.jk-footer-brand {
  font-weight: 700;
  color: var(--jk-text);
  font-size: 0.95rem;
  letter-spacing: 0.01em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.jk-footer-brand::before {
  content: none;
}
.jk-footer-hooks { display: none !important; }
.jk-footer-icp,
.jk-footer-info {
  color: var(--jk-muted);
  line-height: 1.5;
  word-break: break-word;
}
.jk-footer a { color: var(--jk-muted); }
.jk-footer a:hover { color: var(--jk-blue); }

/* Side toolbar */
.side-toolbar {
  position: fixed; right: 18px; bottom: 24px;
  display: flex; flex-direction: column; gap: 8px; z-index: 900;
}
.side-btn {
  width: 44px; height: 44px; border-radius: 50%;
  background: var(--jk-card); border: 1px solid var(--jk-line);
  box-shadow: var(--jk-shadow);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; color: var(--jk-text);
}
.side-btn:hover { color: var(--jk-blue); }

/* Auth modal */
.auth-modal-mask { position: fixed; inset: 0; background: rgba(0,0,0,.4); z-index: 2000; }
.auth-modal { position: fixed; inset: 0; z-index: 2001; display: flex; align-items: center; justify-content: center; }
.auth-modal-card {
  background: var(--jk-card); border-radius: var(--jk-radius); padding: 28px;
  width: min(400px, 92vw); box-shadow: var(--jk-shadow-hover); position: relative;
}
.auth-modal-close {
  position: absolute; right: 12px; top: 8px; border: 0; background: transparent;
  font-size: 24px; cursor: pointer; color: var(--jk-muted);
}
.auth-form-row { margin-bottom: 12px; }
.auth-form-row input {
  width: 100%; padding: 10px 12px; border: 1px solid var(--jk-line);
  border-radius: 10px; background: var(--jk-bg); color: var(--jk-text);
}
.auth-submit { width: 100%; margin-top: 8px; }
.btn, .auth-submit {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 10px 16px; border-radius: 10px; border: 0;
  background: var(--jk-blue); color: #fff; font-weight: 600; cursor: pointer;
}
.auth-modal-switch { margin-top: 14px; display: flex; gap: 14px; font-size: 0.85rem; }
.auth-captcha-row { display: flex; gap: 8px; align-items: center; }
.auth-captcha-row img { height: 38px; border-radius: 6px; cursor: pointer; }
.auth-checkbox { font-size: 0.85rem; color: var(--jk-muted); }
.auth-modal-alert { margin-bottom: 10px; font-size: 0.85rem; color: #ef4444; }
.auth-inline-row { display: flex; gap: 8px; }
.auth-inline-btn { white-space: nowrap; }

/* 404 / password */
.jk-404-body, .jk-pw-body {
  display: flex; align-items: center; justify-content: center; min-height: 100vh; padding-top: 0;
}
.jk-404-card, .jk-pw-card {
  background: var(--jk-card); border-radius: var(--jk-radius); box-shadow: var(--jk-shadow);
  border: 1px solid var(--jk-line); padding: 40px 36px; text-align: center; width: min(420px, 92vw);
}
.jk-404-code { font-size: 4rem; font-weight: 800; margin: 0; color: var(--jk-blue); opacity: .25; }
.jk-404-msg { color: var(--jk-muted); margin: 8px 0 24px; }
.jk-pw-card h1 { font-size: 1.25rem; margin: 0 0 18px; }
.jk-pw-row { display: flex; gap: 8px; }
.jk-pw-row input {
  flex: 1; padding: 10px 12px; border: 1px solid var(--jk-line);
  border-radius: 10px; background: var(--jk-bg); color: var(--jk-text);
}
.jk-pw-back { display: block; margin-top: 16px; font-size: 0.85rem; color: var(--jk-muted); }

/* Plugin / navsoft compatibility — same chrome, no feature link */
.navsoft-page { padding: 0; }
.jk-shell-inner > .navsoft-page,
.jk-shell-inner .navsoft-page {
  max-width: none;
}

.em-download-btn {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--jk-blue) !important; color: #fff !important;
  border: none !important; padding: 10px 20px !important;
  border-radius: 980px !important; font-weight: 600;
}

.bottom-5 { margin-bottom: 1.25rem; }
.top-5 { margin-top: 1.25rem; }
.m-r-10 { margin-right: 10px; }
.rounded { border-radius: 6px; }
.no-margin-bottom { margin-bottom: 0; }
.fade { animation: jkFade .4s; }
@keyframes jkFade { from { opacity: .4 } to { opacity: 1 } }

/* Comments */
.comment-post,
.jk-comment-post,
.comment { margin-top: 24px; }
.jk-comment-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.jk-comment-body,
.comment-post textarea.log_comment,
.jk-comment-form textarea {
  width: 100%;
  min-height: 120px;
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid var(--jk-line);
  background: var(--jk-bg);
  color: var(--jk-text);
  resize: vertical;
  font: inherit;
  line-height: 1.55;
  box-sizing: border-box;
}
.jk-comment-body:focus,
.jk-comment-fields input:focus {
  outline: none;
  border-color: rgba(15, 98, 254,.45);
  box-shadow: 0 0 0 3px rgba(15, 98, 254,.12);
}
.jk-comment-fields,
.comment-info {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.jk-comment-fields input,
.comment-info input.com_control {
  width: 100%;
  padding: 11px 14px;
  border-radius: 12px;
  border: 1px solid var(--jk-line);
  background: #fff;
  color: var(--jk-text);
  font: inherit;
  box-sizing: border-box;
}
.jk-comment-actions,
.com_submit_p {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 2px;
}
.jk-btn-primary,
.jk-comment-actions .btn:not(.jk-btn-ghost):not(.cancel-reply) {
  appearance: none;
  border: 0;
  border-radius: 999px;
  padding: 10px 20px;
  background: var(--jk-blue);
  color: #fff !important;
  font-weight: 600;
  cursor: pointer;
}
#cancel-reply { display: none; }
.jk-btn-ghost,
.jk-comment-actions .cancel-reply,
.btn.cancel-reply {
  appearance: none;
  border: 1px solid var(--jk-line) !important;
  border-radius: 999px;
  padding: 10px 18px;
  background: #fff !important;
  color: var(--jk-muted) !important;
  font-weight: 600;
  cursor: pointer;
}
.jk-btn-ghost:hover,
.btn.cancel-reply:hover {
  color: var(--jk-text) !important;
  border-color: #c9c9ce !important;
}
.jk-comment-login-tip {
  margin: 0;
  color: var(--jk-muted);
  font-size: 0.9rem;
}
.comment-header {
  margin: 28px 0 12px;
  font-size: 1.05rem;
}
.comment {
  display: flex;
  gap: 12px;
  padding: 14px 0;
  border-bottom: 1px solid var(--jk-line);
}
.comment .avatar img {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
}
.comment-infos { flex: 1; min-width: 0; }
.comment-time { color: var(--jk-muted); font-size: 0.8rem; margin-left: 8px; font-weight: 400; }
.comment-content { margin-top: 6px; line-height: 1.6; }
.comment-reply .com-reply {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--jk-blue);
  font-size: 0.85rem;
  padding: 0;
  cursor: pointer;
}
@media (max-width: 720px) {
  .jk-comment-fields,
  .comment-info { grid-template-columns: 1fr; }
}

/* ========== Responsive ========== */
@media (max-width: 1200px) {
  .jk-masonry { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 960px) {
  .jk-masonry { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
  .jk-shell-inner { padding: 28px 20px 40px; }
  .jk-article { padding: 24px 20px; }
  .jk-article-layout { flex-direction: column; }
  .jk-sidebar.column-small, .jk-sidebar.side-bar { width: 100%; flex: none; }
}
@media (max-width: 860px) {
  .jk-sidenav {
    transform: translateX(-105%);
    transition: transform .25s ease;
    box-shadow: 8px 0 32px rgba(0,0,0,.12);
  }
  body.jk-nav-open .jk-sidenav { transform: translateX(0); }
  body.jk-nav-open .jk-sidenav-mask { display: block; }
  .jk-shell { margin-left: 0; }
  .jk-topbar { display: flex; padding: 0 10px; gap: 10px; }
  .jk-topbar-brand { display: block; max-width: min(140px, 46vw); }
  .jk-topbar-brand img { height: 28px; }
  .jk-topbar-nav { display: none; }
  .jk-nav-toggle { display: flex; }
  .jk-topbar-actions { gap: 6px; }
  .jk-bento-hero.jk-slide-cell { height: 240px; min-height: 220px; }
  .jk-carousel-overlay { padding: 24px; }
}
@media (max-width: 560px) {
  .jk-page-title { font-size: 1.4rem; }
  .jk-carousel-btn { display: none; }
}

.jk-btn {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 10px 18px; border-radius: 999px;
  background: var(--jk-blue); color: #fff !important; font-weight: 600;
}


/* Never paint a black plate behind the logo */


/* Load-more: visible button; exhausted = hidden */
.jk-loadmore {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 28px 12px 36px;
  color: var(--jk-muted);
  font-size: 13px;
}
.jk-loadmore[hidden] { display: none !important; }
.jk-loadmore-btn {
  appearance: none;
  -webkit-appearance: none;
  border: 1px solid #e5e7eb;
  background: #fff;
  color: #1f2937;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .02em;
  padding: 10px 28px;
  border-radius: 999px;
  cursor: pointer;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  transition: background .15s, border-color .15s, box-shadow .15s, transform .12s;
}
.jk-loadmore-btn:hover:not(:disabled) {
  background: #f8fafc;
  border-color: #cbd5e1;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
}
.jk-loadmore-btn:active:not(:disabled) { transform: translateY(1px); }
.jk-loadmore-btn:disabled { opacity: .55; cursor: default; }
.jk-loadmore.is-loading .jk-loadmore-btn { display: none; }
.jk-loadmore-hint { opacity: .75; min-height: 1.2em; }
.jk-pagination.is-fallback,
.jk-pagination[hidden] { display: none !important; }
.jk-cat-empty { padding: 48px 16px; text-align: center; color: var(--jk-muted); }
.jk-cat-count { font-size: 13px; color: var(--jk-muted); font-weight: 500; margin-left: 8px; }

/* Article content polish (1.2.1) */
.jk-article .markdown,
.jk-article .jk-markdown {
  max-width: 58rem;
}
.jk-article a:not(.jk-mcard-title a) {
  /* keep global; article body links handled in markdown.css */
}
.jk-source a { color: #0f62fe; }
.jk-source a:hover { border-bottom: 1px solid #0f62fe; }

/* ========== Article TOC base (1.5.18 hierarchical tree) ========== */
.jk-article-with-toc {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 20px;
  align-items: start;
  position: relative;
}
.jk-toc-panel {
  background: #fff;
  border: 1px solid #e8eaed;
  border-radius: 12px;
  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.04);
  padding: 12px 10px 14px;
  max-height: calc(100vh - 48px);
  overflow: auto;
}
.jk-toc-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
  padding: 0 6px 8px;
  border-bottom: 1px solid #f0f1f3;
}
.jk-toc-title {
  font-size: 0.8125rem;
  font-weight: 700;
  color: #111827;
  letter-spacing: 0.02em;
}
.jk-toc-close {
  display: none;
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #6b7280;
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
}
.jk-toc-close:hover { background: #f3f4f6; color: #111827; }
.jk-toc-nav { display: block; }

/* Tree */
.jk-toc-tree,
.jk-toc-children {
  list-style: none;
  margin: 0;
  padding: 0;
}
.jk-toc-children {
  margin: 2px 0 4px 14px;
  padding-left: 10px;
  border-left: 1.5px solid #d8dbe2;
}
.jk-toc-item { margin: 0; padding: 0; }
.jk-toc-row {
  display: flex;
  align-items: flex-start;
  gap: 2px;
  min-width: 0;
}
.jk-toc-toggle,
.jk-toc-toggle-spacer {
  flex: 0 0 18px;
  width: 18px;
  height: 22px;
  margin-top: 4px;
  border: 0;
  background: transparent;
  padding: 0;
  position: relative;
  cursor: pointer;
  color: #6b7280;
}
.jk-toc-toggle-spacer { cursor: default; visibility: hidden; }
.jk-toc-toggle::before {
  content: '';
  position: absolute;
  left: 4px; top: 7px;
  width: 0; height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 5px solid currentColor;
  transition: transform .15s ease;
}
.jk-toc-item:not(.is-expanded) > .jk-toc-row .jk-toc-toggle::before {
  transform: rotate(-90deg);
}
.jk-toc-item:not(.is-expanded) > .jk-toc-children {
  display: none;
}
.jk-toc-link {
  flex: 1 1 auto;
  min-width: 0;
  display: block;
  padding: 6px 8px;
  border-radius: 8px;
  color: #1f2937; /* solid opaque */
  font-size: 0.8125rem;
  line-height: 1.45;
  font-weight: 500;
  text-decoration: none;
  transition: color .15s ease, background .15s ease;
  word-break: break-word;
  opacity: 1;
}
.jk-toc-link:hover {
  color: #111827;
  background: #f3f4f6;
}
.jk-toc-item.is-active > .jk-toc-row > .jk-toc-link,
.jk-toc-link.is-active {
  color: #111827;
  background: #eceef2;
  font-weight: 600;
}
.jk-toc-lv1 > .jk-toc-row > .jk-toc-link { font-weight: 650; font-size: 0.84rem; }
.jk-toc-lv2 > .jk-toc-row > .jk-toc-link { font-size: 0.8125rem; }
.jk-toc-lv3 > .jk-toc-row > .jk-toc-link { font-size: 0.78rem; color: #374151; }
.jk-toc-fab { display: none; }
.toc-con, #toc-con { display: none !important; }
.toc-link { display: none !important; }

/* ========== 1.5.3 breathing + press + PJAX ========== */
.jk-nav-section { margin-bottom: 8px; }
.jk-nav-section + .jk-nav-section { margin-top: 10px; }
.jk-sidenav-foot { padding-top: 16px; }

.jk-interactive {
  transition: transform .12s ease, background .15s ease, color .15s ease, box-shadow .15s ease, border-color .15s ease, opacity .15s ease;
  -webkit-tap-highlight-color: transparent;
}
.jk-nav-link,
.jk-pill,
.jk-top-link,
.jk-topbar-search-btn,
.jk-nav-toggle,
.jk-carousel-btn,
.jk-carousel-dot,
.jk-mcard,
.jk-toc-fab,
.jk-toc-close,
.jk-search-overlay-close,
.jk-search-overlay-go,
.jk-sidenav-logo,
.jk-topbar-brand a,
.jk-pagination a,
.side-btn {
  transition: transform .12s ease, background .15s ease, color .15s ease, box-shadow .15s ease, border-color .15s ease, opacity .15s ease;
  -webkit-tap-highlight-color: transparent;
}

.jk-nav-link:active,
.jk-pill:active,
.jk-top-link:active,
.jk-topbar-search-btn:active,
.jk-nav-toggle:active,
.jk-carousel-btn:active,
.jk-carousel-dot:active,
.jk-toc-fab:active,
.jk-toc-close:active,
.jk-search-overlay-close:active,
.jk-search-overlay-go:active,
.jk-sidenav-logo:active,
.jk-topbar-brand a:active,
.jk-pagination a:active,
.side-btn:active,
.jk-nav-link.is-press,
.jk-pill.is-press,
.jk-top-link.is-press,
.jk-topbar-search-btn.is-press,
.jk-nav-toggle.is-press,
.jk-carousel-btn.is-press,
.jk-carousel-dot.is-press,
.jk-toc-fab.is-press,
.jk-toc-close.is-press,
.jk-search-overlay-close.is-press,
.jk-search-overlay-go.is-press,
.jk-sidenav-logo.is-press,
.jk-topbar-brand a.is-press,
.jk-pagination a.is-press,
.side-btn.is-press {
  transform: scale(0.94);
}

.jk-mcard:active,
.jk-mcard.is-press {
  transform: translateY(-1px) scale(0.985);
}

.jk-pill:hover:not(.is-active) { transform: none; }
.jk-pill.is-active:active,
.jk-pill.is-active.is-press { transform: scale(0.97); }
.jk-top-link:hover:not(.is-active) { transform: translateY(-1px); }
.jk-topbar-search-btn:hover { transform: scale(1.05); }
.jk-carousel-btn:hover { transform: scale(1.06); }
.jk-carousel-dot:hover { transform: scale(1.15); }

/* slim PJAX progress bar */
#jkPjaxBar {
  position: fixed;
  top: 0; left: 0;
  height: 2px;
  width: 0;
  z-index: 10000;
  background-image: linear-gradient(90deg, rgba(15, 98, 254, 0) 0%, var(--jk-ibm-blue) 62%, var(--jk-ibm-blue-30) 100%);
  background-size: 100% 100%;
  box-shadow: 0 0 10px rgba(15, 98, 254, .75), 0 0 28px rgba(15, 98, 254, .32);
  opacity: 0;
  pointer-events: none;
  transition: width .25s ease, opacity .35s ease;
}
#jkPjaxBar::after {
  content: "";
  position: absolute;
  right: 0;
  top: -3px;
  width: 40px;
  height: 8px;
  background: radial-gradient(ellipse at right, rgba(166, 200, 255, .95), rgba(15, 98, 254, 0) 72%);
  filter: blur(1px);
  opacity: .9;
}
#jkPjaxBar.is-active {
  opacity: 1;
  width: 68%;
  background-image:
    repeating-linear-gradient(115deg, rgba(255, 255, 255, .30) 0 10px, rgba(255, 255, 255, 0) 10px 22px),
    linear-gradient(90deg, rgba(15, 98, 254, 0) 0%, var(--jk-ibm-blue) 62%, var(--jk-ibm-blue-30) 100%);
  background-size: 44px 100%, 100% 100%;
  animation: jk-bar-sweep .72s linear infinite;
  transition: width .45s cubic-bezier(.2,.7,.2,1), opacity .15s ease;
}
#jkPjaxBar.is-finishing {
  opacity: 1;
  width: 100%;
  animation: none;
  transition: width .18s ease, opacity .4s ease .12s;
}
#jkPjaxBar.is-done {
  opacity: 0;
  width: 100%;
}
@keyframes jk-bar-sweep {
  0% { background-position: 0 0, 0 0; }
  100% { background-position: 44px 0, 0 0; }
}

@media (prefers-reduced-motion: no-preference) {
  body.jk-pjax-loading .jk-shell-inner {
    opacity: .58;
    filter: blur(5px);
    transition: opacity .2s ease, filter .2s ease;
  }
  .jk-shell-inner {
    transition: opacity .2s ease, filter .2s ease;
  }
}
@media (prefers-reduced-motion: reduce) {
  body.jk-pjax-loading .jk-shell-inner {
    opacity: .72;
  }
}


/* ========== 1.5.3 UX fixes ========== */
body.jk-search-open { overflow: hidden; }
.jk-nav-back .jk-nav-label { font-weight: 600; }


/* ========== 1.5.4/1.5.5 expandable sidenav ========== */
/* Whole hub row (icon+label+chevron) is one highlight surface */
.jk-nav-hub-row {
  display: flex;
  align-items: center;
  gap: 0;
  border-radius: 12px;
  transition: background .15s, color .15s;
  min-height: 36px;
}
.jk-nav-hub-row:hover,
.jk-nav-hub-row:focus-within,
.jk-nav-hub-row:has(> .jk-nav-link.is-active),
.jk-nav-hub-row:has(> .jk-nav-link[aria-current="page"]) {
  background: #fff;
}
.jk-nav-hub-row .jk-nav-link {
  flex: 1 1 auto;
  min-width: 0;
  background: transparent !important;
  border-radius: 12px;
  padding-right: 8px;
}
.jk-nav-hub-row .jk-nav-link:hover,
.jk-nav-hub-row .jk-nav-link.is-active,
.jk-nav-hub-row .jk-nav-link[aria-current="page"] {
  background: transparent !important;
}
.jk-nav-chevron {
  flex: 0 0 32px;
  width: 32px; height: 32px;
  margin: 0 6px 0 0;
  border: 0; border-radius: 10px;
  background: transparent;
  color: var(--jk-muted);
  cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0;
  transition: background .15s, transform .2s, color .15s;
}
.jk-nav-chevron:hover,
.jk-nav-chevron:focus-visible {
  background: rgba(0, 0, 0, .05);
  color: var(--jk-text);
  outline: none;
}
.jk-nav-chevron span {
  display: block; width: 10px; height: 10px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  margin-top: -3px;
  transition: transform .2s ease;
}
.jk-nav-hub.is-open > .jk-nav-hub-row .jk-nav-chevron span {
  transform: rotate(225deg);
  margin-top: 3px;
}
.jk-nav-children {
  list-style: none;
  margin: 1px 0 4px 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
  border-left: 0;
  margin-left: 0;
}
.jk-nav-children[hidden] { display: none !important; }
.jk-nav-link--child {
  font-size: 0.8rem !important;
  font-weight: 550 !important;
  padding: 5px 8px 5px 10px !important;
  border-radius: 8px;
  gap: 8px;
}
.jk-nav-link--child .jk-nav-ico {
  width: 14px; height: 14px; flex-basis: 14px; opacity: .45;
}
.jk-nav-count {
  margin-left: auto;
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--jk-muted);
  background: #eef0f4;
  padding: 1px 7px;
  border-radius: 999px;
}
/* Parent hub accent when self or child is current — no separate pill on hub when only child active */
.jk-nav-hub.is-current > .jk-nav-hub-row .jk-nav-link {
  color: var(--jk-blue) !important;
}
.jk-nav-hub.is-current > .jk-nav-hub-row .jk-nav-ico {
  opacity: 1;
  color: var(--jk-blue);
}
.jk-nav-hub.is-current > .jk-nav-hub-row .jk-nav-chevron {
  color: var(--jk-blue);
}

/* ========== 1.5.4/1.5.5 topbar inline search (centered in shell) ========== */
.jk-topbar-nav { display: flex; align-items: center; gap: 6px; flex: 0 1 auto; min-width: 0; max-width: 36%; overflow-x: auto; scrollbar-width: none; }
.jk-topbar {
  /* search absolutely centered within this shell topbar (content column) */
  position: sticky;
  /* also establish containing block for absolute search */
}
.jk-shell > .jk-topbar {
  position: sticky;
  /* absolute children (search) use this box = content column, not viewport */
}
.jk-topbar-search {
  /* Center horizontally in the main shell/content column (not full viewport) */
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: min(520px, calc(100% - 48px));
  max-width: 520px;
  margin: 0;
  flex: 0 0 auto;
  z-index: 1001;
}
.jk-topbar-search .jk-search-ico {
  position: absolute; left: 14px; top: 50%; transform: translateY(-50%);
  color: var(--jk-muted); pointer-events: none; display: flex;
}
.jk-topbar-search-input {
  width: 100%;
  height: 40px;
  border: 1px solid var(--jk-line);
  border-radius: 999px;
  padding: 0 16px 0 42px;
  font-size: 0.92rem;
  background: #fff;
  outline: none;
  box-shadow: 0 1px 2px rgba(0,0,0,.03);
  transition: border-color .15s, box-shadow .15s;
}
.jk-topbar-search-input:focus {
  border-color: rgba(15, 98, 254,.45);
  box-shadow: 0 0 0 3px rgba(15, 98, 254,.14);
}
.jk-topbar-search-btn { display: none !important; }
.jk-topbar-actions {
  margin-left: auto;
  position: relative;
  z-index: 2;
}

/* hide category pills if any leftover markup */
.jk-filter-pills { display: none !important; }

/* ========== 1.5.4 Microsoft Store home hero ========== */
.jk-store-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
  gap: 16px;
  grid-column: 1 / -1;
  min-height: clamp(280px, 34vw, 400px);
}
.jk-store-hero-main {
  border-radius: 18px;
  overflow: hidden;
  box-shadow: var(--jk-shadow);
  background: #111;
  min-height: 280px;
  height: 100%;
  position: relative;
}
.jk-store-hero-side {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-height: 0;
}
.jk-feat-card-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  flex: 1 1 auto;
  min-height: 0;
}
.jk-feat-card {
  position: relative;
  display: block;
  border-radius: 16px;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  color: #fff !important;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
  transition: transform .18s ease, box-shadow .18s ease;
  min-height: 0;
}
.jk-feat-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 32px rgba(15, 23, 42, 0.16);
}
.jk-feat-card--lg {
  flex: 1.35 1 auto;
  min-height: 160px;
}
.jk-feat-card--sm {
  min-height: 110px;
  height: 100%;
}
.jk-feat-card-body {
  position: absolute; inset: 0;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 16px 18px;
  background: linear-gradient(180deg, transparent 25%, rgba(0,0,0,.55) 100%);
}
.jk-feat-card.is-grad .jk-feat-card-body {
  background: linear-gradient(180deg, transparent 10%, rgba(0,0,0,.28) 100%);
}
.jk-feat-card-title {
  margin: 0 0 4px;
  font-size: 1.05rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #fff;
  line-height: 1.25;
}
.jk-feat-card--sm .jk-feat-card-title { font-size: 0.92rem; }
.jk-feat-card-desc {
  margin: 0;
  font-size: 0.8rem;
  color: rgba(255,255,255,.88);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.jk-feat-tone-0 {
  background: linear-gradient(135deg, #0f172a 0%, #1d4ed8 55%, #38bdf8 100%);
}
.jk-feat-tone-1 {
  background: linear-gradient(135deg, #1e1b4b 0%, #6d28d9 50%, #f472b6 100%);
}
.jk-feat-tone-2 {
  background: linear-gradient(135deg, #064e3b 0%, #0d9488 50%, #99f6e4 100%);
}
.jk-carousel-cta {
  display: inline-flex;
  align-items: center;
  margin-top: 14px;
  padding: 8px 16px;
  border-radius: 999px;
  background: rgba(17, 24, 39, 0.82);
  color: #fff;
  font-size: 0.85rem;
  font-weight: 600;
  width: fit-content;
  backdrop-filter: blur(6px);
}
.jk-bento--home {
  gap: 28px;
}

@media (max-width: 960px) {
  .jk-store-hero {
    grid-template-columns: 1fr;
    min-height: 0;
  }
  .jk-store-hero-main {
    height: clamp(220px, 48vw, 300px);
  }
  .jk-feat-card--lg { min-height: 140px; }
  .jk-feat-card--sm { min-height: 100px; }
}
@media (max-width: 860px) {
  .jk-topbar-search {
    position: relative;
    left: auto;
    top: auto;
    transform: none;
    width: auto;
    max-width: none;
    flex: 1 1 auto;
    z-index: 1;
  }
  .jk-topbar-search-input {
    height: 36px;
    font-size: 0.86rem;
    padding-left: 38px;
  }
  .jk-topbar-brand { max-width: min(110px, 28vw); }
}
@media (max-width: 560px) {
  .jk-feat-card-row { grid-template-columns: 1fr; }
  .jk-carousel-cta { display: none; }
}


/* ========== 1.5.4 hub strip (scheme1/2) ========== */
.jk-hub-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin: 0 0 22px;
  padding: 2px 0 4px;
}
.jk-hub-strip[hidden] { display: none !important; }
.jk-hub-tag {
  display: inline-flex;
  align-items: center;
  padding: 7px 14px;
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 550;
  color: #4b5563 !important;
  background: transparent;
  border: 1px solid transparent;
  transition: background .15s, color .15s, border-color .15s, transform .15s;
}
.jk-hub-tag:hover {
  background: #f0f2f5;
  color: var(--jk-text) !important;
}
.jk-hub-tag.is-active {
  background: #eef1f6;
  color: var(--jk-text) !important;
  font-weight: 650;
  border-color: #e5e7eb;
}

/* ========== 1.5.4 homepage 推荐 ========== */
.jk-recommend {
  margin-top: 40px;
  padding: 8px 0 12px;
}
.jk-recommend-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px 20px;
  margin-bottom: 22px;
}
.jk-recommend-title {
  margin: 0;
  font-size: 1.45rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--jk-text);
}
.jk-recommend-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 6px;
  align-items: center;
}
.jk-recommend-tab {
  border: 0;
  background: transparent;
  color: #9ca3af;
  font-size: 0.88rem;
  font-weight: 500;
  padding: 7px 14px;
  border-radius: 999px;
  cursor: pointer;
  transition: background .15s, color .15s;
}
.jk-recommend-tab:hover { color: #4b5563; background: #f3f4f6; }
.jk-recommend-tab.is-active {
  background: #edf0f4;
  color: #111827;
  font-weight: 600;
}
.jk-recommend-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 48px;
}
.jk-recommend-item {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 14px;
  padding: 12px 8px;
  border-radius: 14px;
  color: inherit !important;
  transition: background .15s, transform .15s;
}
.jk-recommend-item:hover { background: #f7f8fa; }
.jk-recommend-thumb {
  width: 64px; height: 64px;
  border-radius: 14px;
  overflow: hidden;
  background: #eef1f5;
  flex: 0 0 64px;
}
.jk-recommend-thumb img {
  width: 100%; height: 100%; object-fit: cover; display: block;
}
.jk-recommend-ph {
  display: block; width: 100%; height: 100%;
  background: linear-gradient(135deg, #dbeafe, #e0e7ff 50%, #fce7f3);
}
.jk-recommend-text {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.jk-recommend-name {
  font-size: 0.98rem;
  font-weight: 700;
  color: #111827;
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.jk-recommend-desc {
  font-size: 0.82rem;
  color: #9ca3af;
  line-height: 1.35;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.jk-recommend-new {
  display: inline-flex;
  align-items: center;
  padding: 3px 8px;
  border-radius: 999px;
  background: #e8eef8;
  color: #5b6b86;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.04em;
}
.jk-recommend-go {
  width: 34px; height: 34px;
  border-radius: 50%;
  background: #eef2f7;
  position: relative;
}
.jk-recommend-go::before {
  content: '';
  position: absolute; inset: 0;
  margin: auto;
  width: 14px; height: 14px;
  background: currentColor;
  color: #7b8798;
  opacity: .7;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M8 5v14l11-7z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M8 5v14l11-7z'/%3E%3C/svg%3E") center / contain no-repeat;
}
@media (max-width: 860px) {
  .jk-recommend-grid { grid-template-columns: 1fr; gap: 4px; }
  .jk-recommend-head { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 560px) {
  .jk-recommend-item {
    grid-template-columns: 52px minmax(0, 1fr) auto;
    gap: 10px;
  }
  .jk-recommend-thumb { width: 52px; height: 52px; border-radius: 12px; }
  .jk-recommend-go { display: none; }
}


/* ========== 1.5.4 mobile chrome + hero ========== */
@media (max-width: 860px) {
  .jk-topbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    height: auto;
    min-height: 52px;
    padding: 8px 12px 10px;
    gap: 8px 10px;
  }
  .jk-nav-toggle { order: 1; }
  .jk-topbar-brand {
    order: 2;
    display: block !important;
    flex: 1 1 auto;
    max-width: none;
    min-width: 0;
  }
  .jk-topbar-brand img { height: 30px; }
  .jk-topbar-nav {
    display: none !important; /* custom links: desktop only to keep mobile chrome clean */
  }
  .jk-topbar-actions { order: 3; margin-left: 0; }
  .jk-topbar-search {
    order: 10;
    position: relative;
    left: auto;
    top: auto;
    transform: none;
    flex: 1 1 100%;
    width: 100%;
    max-width: none;
    margin: 0;
    z-index: 1;
  }
  .jk-topbar-search-input {
    height: 38px;
    font-size: 0.9rem;
    border-radius: 999px;
    background: #f3f4f6;
    border-color: transparent;
    box-shadow: none;
  }
  .jk-topbar-search-input:focus {
    background: #fff;
    border-color: rgba(15, 98, 254,.35);
  }
  /* Mobile: hide awkward Store dual-hero; keep cards + recommend */
  .jk-store-hero {
    display: none !important;
  }
  .jk-bento-hero.jk-slide-cell {
    height: 180px;
    min-height: 160px;
  }
}
@media (max-width: 560px) {
  .jk-topbar-brand img { height: 26px; }
  .jk-page-title { font-size: 1.28rem; }
  .jk-main-head { margin-bottom: 18px; }
}

/* ========== 1.5.6 polish ========== */
.jk-sidenav-search { display: none !important; }
.jk-carousel-btn,
.jk-carousel-prev,
.jk-carousel-next { display: none !important; }

/* smaller active/hover pills */
.jk-nav-list { gap: 4px; }
.jk-nav-hub-row { border-radius: 10px; }
.jk-nav-hub-row .jk-nav-link { border-radius: 10px; padding-right: 6px; }
.jk-nav-chevron {
  flex: 0 0 28px;
  width: 28px; height: 28px;
  margin: 0 4px 0 0;
  border-radius: 8px;
}
.jk-nav-link.is-active,
.jk-nav-link[aria-current="page"] {
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
}

/* ========== 1.5.7 spacing + cards + nest ========== */
/* Content hugs sidenav: no fat centered gutter */
.jk-shell-inner {
  max-width: none;
  margin: 0;
  padding: 28px 28px 48px 18px;
}
@media (max-width: 960px) {
  .jk-shell-inner { padding: 24px 18px 36px; }
}
/* 1.5.17: article width owned by rail block below */

/* Nested sidenav: almost under parent icon/label */
.jk-nav-children {
  margin: 1px 0 4px 0 !important;
  margin-left: 0 !important;
  padding: 0 !important;
  border-left: 0 !important;
}
.jk-nav-link--child {
  padding: 5px 8px 5px 10px !important;
  gap: 8px !important;
}
.jk-nav-link--child .jk-nav-ico {
  width: 14px !important;
  height: 14px !important;
  flex-basis: 14px !important;
}

/* List cards: hide gray excerpt under title */
.jk-mcard-excerpt { display: none !important; }
.jk-mcard-body { padding: 14px 16px 16px; }
.jk-mcard-title { margin-bottom: 0; }

/* Article: less empty space above title inside white card */
.jk-article {
  padding: 18px 32px 32px;
}
.jk-article-title { margin-top: 0; }
.jk-article-header { margin: 0; padding: 0; }
@media (max-width: 960px) {
  .jk-article { padding: 16px 18px 24px; }
}

/* Recommend stays visible on homepage */
.jk-recommend { display: block; }

/* ========== 1.5.16 tophub cards + nested sidenav */

/* Nested sidenav: slight indent under parent */
.jk-nav-children {
  margin: 2px 0 6px 0 !important;
  margin-left: 14px !important;
  padding: 0 0 0 2px !important;
  border-left: 0 !important;
}
.jk-nav-link--child {
  padding: 5px 8px 5px 8px !important;
  gap: 8px !important;
}
.jk-nav-link--child .jk-nav-ico {
  width: 14px !important;
  height: 14px !important;
  flex-basis: 14px !important;
}

/* Homepage / full rankings — tophub.today style cards (1.5.16) */
.jk-hot {
  grid-column: 1 / -1;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.jk-hot-head,
.jk-hot-toolbar,
.jk-hot-tab,
.jk-hot-panels { display: none; }

.jk-hot-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
  min-height: 0;
}
.jk-hot-bar--home-top {
  justify-content: flex-end;
  padding: 0 2px;
}
.jk-hot-full-link {
  display: inline-flex;
  align-items: center;
  font-size: 0.78rem;
  font-weight: 600;
  color: #64748b;
  text-decoration: none;
  padding: 2px 4px;
  border: 0;
  background: transparent;
  white-space: nowrap;
}
.jk-hot-full-link:hover { color: #1d4ed8; }

.jk-rank-page .jk-hot { margin-top: 8px; }

.jk-hot-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  align-items: stretch;
  width: 100%;
  min-width: 0;
}
.jk-hot-grid--home {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.jk-hot-grid--full {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px 18px;
}

/* Separate white rounded cards + soft shadow */
.jk-hot-grid--cards .jk-hot-col,
.jk-hot-card {
  background: #fff;
  border: 1px solid rgba(15, 23, 42, 0.06);
  border-radius: 12px;
  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.05);
  padding: 0;
  min-height: 0;
  min-width: 0;
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.jk-hot-grid--cards .jk-hot-col + .jk-hot-col::before,
.jk-hot-grid--blend .jk-hot-col + .jk-hot-col::before {
  display: none;
  content: none;
}

.jk-hot-col-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  padding: 14px 16px 10px;
  border-bottom: 1px solid #f1f5f9;
  margin: 0;
  flex-shrink: 0;
}
.jk-hot-col-title {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 700;
  color: #0f172a;
}
.jk-hot-col-sub {
  font-size: 0.75rem;
  color: #94a3b8;
  font-weight: 500;
  white-space: nowrap;
}
.jk-hot-col--today .jk-hot-col-title,
.jk-hot-col--week .jk-hot-col-title,
.jk-hot-col--month .jk-hot-col-title,
.jk-hot-col--cat .jk-hot-col-title { color: #0f172a; }
.jk-hot-col-hint { display: none; }

.jk-hot-scroll {
  flex: 1 1 auto;
  min-height: 0;
  max-height: 420px;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 6px 8px 8px;
  scrollbar-width: thin;
  scrollbar-color: #cbd5e1 transparent;
}
.jk-hot--home .jk-hot-scroll {
  max-height: none;
  overflow: visible;
}
.jk-hot-scroll::-webkit-scrollbar { width: 6px; }
.jk-hot-scroll::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 999px;
}

.jk-hot-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.jk-hot-item { margin: 0; }
.jk-hot-link {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 8px 8px;
  border-radius: 8px;
  text-decoration: none;
  color: inherit;
  transition: background .15s ease;
}
.jk-hot-link:hover { background: #f8fafc; }

/* Rank badges: 1 red / 2 orange / 3 gold / rest gray — circular */
.jk-hot-rank {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.72rem;
  font-weight: 700;
  color: #fff;
  background: #94a3b8;
  flex-shrink: 0;
  margin-top: 2px;
}
.jk-hot-item.is-medal-1 .jk-hot-rank { background: #ef4444; color: #fff; }
.jk-hot-item.is-medal-2 .jk-hot-rank { background: #f97316; color: #fff; }
.jk-hot-item.is-medal-3 .jk-hot-rank { background: #eab308; color: #fff; }

.jk-hot-name {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 0.88rem;
  font-weight: 500;
  line-height: 1.45;
  color: #1e293b;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.jk-hot--home .jk-hot-name {
  -webkit-line-clamp: 2;
  font-size: 0.86rem;
}

.jk-hot-thumb,
.jk-hot-ph,
.jk-hot-meta,
.jk-hot-score { display: none !important; }

.jk-hot-col-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 16px 12px;
  border-top: 1px solid #f1f5f9;
  flex-shrink: 0;
}
.jk-hot-updated {
  font-size: 0.72rem;
  color: #94a3b8;
}

.jk-hot-empty {
  padding: 24px 12px;
  text-align: center;
  color: var(--jk-muted);
  font-size: 0.88rem;
}

.jk-rank-hero {
  margin: 0 0 12px;
  padding: 4px 2px 0;
}
.jk-rank-title {
  margin: 0 0 6px;
  font-size: 1.35rem;
  font-weight: 800;
}
.jk-rank-desc {
  margin: 0;
  color: var(--jk-muted);
  font-size: 0.88rem;
  line-height: 1.5;
}

@media (max-width: 960px) {
  .jk-hot-grid--home {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .jk-hot-grid--full {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .jk-hot-grid--home,
  .jk-hot-grid--full,
  .jk-hot-grid {
    grid-template-columns: 1fr;
  }
  .jk-hot-grid--full { gap: 12px; }
  .jk-hot-scroll { max-height: 360px; }
  /* Hide only home rankings preview on phone — full rank page stays visible */
  .jk-hot--home {
    display: none !important;
  }
}

/* Article right rail: TOC + ad slots (desktop); hidden on narrow */
.jk-rail {
  display: none;
}
.jk-rail-ads {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 12px;
}
.jk-rail-slot {
  background: #fff;
  border: 1px solid #e8eaed;
  border-radius: 12px;
  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.04);
  padding: 12px;
  overflow: auto;
  max-height: min(42vh, 380px);
}
.jk-rail-slot img { max-width: 100%; height: auto; border-radius: 10px; display: block; }
.jk-rail-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 100px;
  padding: 14px 10px;
  border: 1px dashed #cbd5e1;
  border-radius: 10px;
  background: #f8fafc;
  text-align: center;
}
.jk-rail-placeholder-label {
  font-size: 0.85rem;
  font-weight: 650;
  color: #475569;
}
.jk-rail-placeholder-hint {
  font-size: 0.72rem;
  color: #64748b;
  line-height: 1.4;
}

/* Show rail from 1024px so common laptops see TOC */
@media (min-width: 1024px) {
  .jk-shell-inner:has(.jk-article-with-toc.has-toc),
  .jk-shell-inner:has(.jk-article-with-toc.has-rail) {
    max-width: 1380px;
    margin-left: 0;
    margin-right: auto;
    padding-right: 28px;
    padding-left: 20px;
  }
  main.jk-article-with-toc.has-toc,
  main.jk-article-with-toc.has-rail,
  .jk-article-with-toc.has-toc,
  .jk-article-with-toc.has-rail {
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 24px;
    align-items: start;
  }
  main.jk-article-with-toc.has-toc > .jk-rail,
  main.jk-article-with-toc.has-rail > .jk-rail,
  .jk-article-with-toc.has-toc .jk-rail,
  .jk-article-with-toc.has-rail .jk-rail {
    display: flex;
    flex-direction: column;
    position: sticky;
    top: calc(var(--jk-topbar-h) + 16px);
    width: 280px;
    z-index: 80;
    max-height: calc(100vh - var(--jk-topbar-h) - 32px);
    align-self: start;
    gap: 0;
  }
  .jk-article-with-toc.has-toc .jk-toc {
    display: block;
    position: static;
    width: 100%;
    max-height: none;
  }
  .jk-article-with-toc.has-toc .jk-toc[hidden] {
    display: block;
  }
  .jk-article-with-toc.has-toc .jk-toc-panel {
    max-height: calc(100vh - var(--jk-topbar-h) - 260px);
  }
  .jk-article-with-toc .jk-toc-fab,
  .jk-article-with-toc .jk-toc-close { display: none !important; }
}
@media (min-width: 1480px) {
  .jk-shell-inner:has(.jk-article-with-toc.has-toc),
  .jk-shell-inner:has(.jk-article-with-toc.has-rail) {
    max-width: 1480px;
  }
  main.jk-article-with-toc.has-toc,
  main.jk-article-with-toc.has-rail,
  .jk-article-with-toc.has-toc,
  .jk-article-with-toc.has-rail {
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 30px;
  }
  main.jk-article-with-toc.has-toc > .jk-rail,
  main.jk-article-with-toc.has-rail > .jk-rail,
  .jk-article-with-toc.has-toc .jk-rail,
  .jk-article-with-toc.has-rail .jk-rail { width: 300px; }
}

@media (max-width: 1023px) {
  .jk-rail,
  .jk-toc,
  .jk-toc-fab {
    display: none !important;
  }
  main.jk-article-with-toc.has-toc,
  main.jk-article-with-toc.has-rail,
  .jk-article-with-toc.has-toc,
  .jk-article-with-toc.has-rail {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Rank page */
.jk-rank-page { max-width: none; width: 100%; }
.jk-rank-hero { margin-bottom: 18px; }
.jk-rank-kicker {
  margin: 0 0 6px;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--jk-blue);
}
.jk-rank-title {
  margin: 0 0 8px;
  font-size: clamp(1.6rem, 2.4vw, 2rem);
  font-weight: 850;
  letter-spacing: -0.03em;
}
.jk-rank-desc {
  margin: 0;
  color: var(--jk-muted);
  font-size: 0.92rem;
  line-height: 1.55;
}
.jk-rank-periods,
.jk-rank-cats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 14px;
}
.jk-rank-chip,
.jk-rank-cat {
  display: inline-flex;
  align-items: center;
  padding: 7px 14px;
  border-radius: 999px;
  border: 1px solid var(--jk-line);
  background: var(--jk-card);
  color: var(--jk-text);
  font-size: 0.85rem;
  font-weight: 600;
  text-decoration: none;
}
.jk-rank-chip.is-active,
.jk-rank-cat.is-active {
  background: var(--jk-blue);
  border-color: var(--jk-blue);
  color: #fff;
}
.jk-rank-board {
  background: var(--jk-card);
  border: 1px solid var(--jk-line);
  border-radius: 18px;
  box-shadow: var(--jk-shadow);
  padding: 8px;
  margin-bottom: 28px;
}
.jk-rank-ol { list-style: none; margin: 0; padding: 0; }
.jk-rank-row-link {
  display: grid;
  grid-template-columns: 36px 56px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  padding: 10px 12px;
  border-radius: 14px;
  text-decoration: none;
  color: inherit;
}
.jk-rank-row-link:hover { background: #f5f7fb; }
.jk-rank-num {
  width: 32px; height: 32px; border-radius: 10px;
  display: inline-flex; align-items: center; justify-content: center;
  font-weight: 800; background: #f1f3f7; color: var(--jk-muted);
}
.jk-rank-row.is-medal-1 .jk-rank-num { background: linear-gradient(135deg,#fbbf24,#f59e0b); color:#fff; }
.jk-rank-row.is-medal-2 .jk-rank-num { background: linear-gradient(135deg,#cbd5e1,#94a3b8); color:#fff; }
.jk-rank-row.is-medal-3 .jk-rank-num { background: linear-gradient(135deg,#fdba74,#ea580c); color:#fff; }
.jk-rank-thumb {
  width: 56px; height: 56px; border-radius: 14px; overflow: hidden; background: #eef1f6;
}
.jk-rank-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.jk-rank-body { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.jk-rank-name {
  font-size: 1rem; font-weight: 700; line-height: 1.35;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.jk-rank-sub {
  display: flex; gap: 10px; flex-wrap: wrap;
  font-size: 0.78rem; color: var(--jk-muted);
}
.jk-rank-empty { padding: 36px 16px; text-align: center; color: var(--jk-muted); }
.jk-rank-sitemap {
  border-top: 1px solid var(--jk-line);
  padding-top: 20px;
  margin-bottom: 24px;
}
.jk-rank-sitemap-title { margin: 0 0 6px; font-size: 1.05rem; font-weight: 800; }
.jk-rank-sitemap-desc { margin: 0 0 12px; font-size: 0.85rem; color: var(--jk-muted); }
.jk-rank-sitemap-list {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 10px;
  font-size: 0.85rem; line-height: 1.6;
}
.jk-rank-sitemap-list a { color: var(--jk-blue); text-decoration: none; }
.jk-rank-sitemap-list a:hover { text-decoration: underline; }
.jk-rank-sep { color: #cbd5e1; margin: 0 4px; }

/* Hide default dual hero on home when hot is present (safety) */
.jk-bento--home:has(.jk-hot) .jk-store-hero { display: none !important; }
/* 1.5.8/1.5.30 sidenav: 首页 / 上一级 same size hit area */
.jk-nav-home .jk-nav-link,
.jk-nav-back-item .jk-nav-link,
.jk-nav-back-item .jk-nav-back {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  min-height: 40px !important;
  padding: 7px 10px !important;
  margin: 0 !important;
  border-radius: 10px !important;
  font-size: 0.875rem !important;
  font-weight: 650 !important;
  line-height: 1.3 !important;
  box-sizing: border-box !important;
}
.jk-nav-back-item .jk-nav-back .jk-nav-ico,
.jk-nav-home .jk-nav-link .jk-nav-ico {
  width: 18px !important;
  height: 18px !important;
  flex: 0 0 18px !important;
}


/* ========== 1.5.17 home hubs collapsed + viewport search + wider rail ========== */

/* ========== 1.5.18 mobile top search + mbar + footer + recommend ========== */

/* Article recommend spans full grid width under article+rail */
.jk-article-recommend {
  grid-column: 1 / -1;
  margin-top: 8px;
  width: 100%;
}

/* ---- Spark-like dark footer ---- */
.jk-footer.spark-like {
  margin-top: 30px;
  padding: 56px 28px 26px;
  background: #111214;
  color: rgba(255,255,255,.78);
  border-top: 0;
  overflow: visible;
}
.jk-footer.spark-like a { color: rgba(255,255,255,.78); text-decoration: none; }
.jk-footer.spark-like a:hover { color: #fff; }
.jk-footer-wrap { max-width: 1280px; margin: 0 auto; }
.jk-ftop {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr));
  gap: 36px;
  padding-bottom: 36px;
  border-bottom: 1px solid rgba(255,255,255,.12);
}
.jk-fbrand { min-width: 0; }
.jk-fb { display: inline-flex; align-items: center; margin-bottom: 16px; color: #fff; }
.jk-fb img { display: block; height: 104px; width: auto; max-width: 100%; }
.jk-fb-l img { height: 104px; }
.jk-fb img.jk-fb-white { filter: brightness(0) invert(1); }
.jk-fdesc { max-width: 30em; margin: 0; font-size: 13.5px; line-height: 2; color: rgba(255,255,255,.66); }
.jk-fcol h4 {
  margin: 0 0 16px; font-size: 12px; font-weight: 400;
  letter-spacing: .2em; color: rgba(255,255,255,.5);
}
.jk-fcol ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 11px; }
.jk-fcol li { font-size: 13.5px; line-height: 1.5; word-break: break-word; }
.jk-finfo { font-size: 13px; line-height: 1.9; color: rgba(255,255,255,.7); }
.jk-fbot {
  display: flex; align-items: center; flex-wrap: wrap; gap: 10px 26px;
  padding-top: 22px; font-size: 12px; letter-spacing: .06em; color: rgba(255,255,255,.55);
}
.jk-fbeian a { color: rgba(255,255,255,.65); }
.jk-footer-mount { max-width: 1280px; margin: 0 auto; padding: 0 28px; }
.jk-footer-mount-top { margin-top: 24px; }
.jk-footer-mount-bottom { padding-bottom: 12px; color: rgba(255,255,255,.55); font-size: 12px; }
.jk-footer-links-wrap {
  max-width: 1280px; margin: 24px auto 0; padding: 0 28px;
}
.jk-links {
  background: #fff; border: 1px solid var(--jk-line); border-radius: 14px;
  box-shadow: var(--jk-shadow); overflow: hidden;
}
.jk-links-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px; border-bottom: 1px solid #f0f2f5;
}
.jk-links-head h3 {
  margin: 0; font-size: 16px; font-weight: 700; color: #1d1d1f;
  padding-left: 10px; border-left: 4px solid #ef4444;
}
.jk-links-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 8px; padding: 14px 16px 16px;
}
.jk-link {
  display: inline-flex; align-items: center; gap: 7px; max-width: 100%;
  height: 36px; padding: 0 14px 0 10px; border-radius: 10px;
  background: #f5f7fa; color: #3a4653; font-size: 13px; text-decoration: none;
  transition: background .15s, color .15s;
}
.jk-link:hover { background: #e8f2ff; color: var(--jk-blue); }
.jk-link img { width: 20px; height: 20px; border-radius: 50%; object-fit: cover; background: #fff; }
.jk-link-dot {
  width: 8px; height: 8px; border-radius: 50%; background: #94a3b8; flex: 0 0 auto;
}
.jk-link span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

@media (max-width: 991px) {
  .jk-ftop { grid-template-columns: 1fr 1fr; gap: 30px 20px; }
  .jk-fbrand { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
  .jk-ftop { grid-template-columns: 1fr; }
  .jk-footer.spark-like { padding: 36px 18px 84px; }
  .jk-footer-links-wrap, .jk-footer-mount { padding-left: 18px; padding-right: 18px; }
  .jk-fb img, .jk-fb-l img { height: 72px; }
}

/* Hide legacy flat footer brand styles when spark-like is used */
.jk-footer.spark-like .jk-footer-brand,
.jk-footer.spark-like .jk-footer-hooks { display: none !important; }

/* ---- Mobile topbar: single row + compact top-right search ---- */
@media (max-width: 860px) {
  :root { --jk-topbar-h: 52px; }
  .jk-topbar {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    height: var(--jk-topbar-h);
    min-height: var(--jk-topbar-h);
    max-height: var(--jk-topbar-h);
    padding: 0 10px 0 6px;
    gap: 8px;
    overflow: visible;
  }
  .jk-topbar-brand {
    display: block;
    flex: 1 1 auto;
    min-width: 0;
    max-width: none;
  }
  .jk-topbar-brand img { height: 28px; width: auto; max-width: 120px; }
  .jk-topbar-nav { display: none !important; }
  .jk-topbar-actions { display: none; } /* keep search as the right control */

  /* Compact search box in the blue-box position (top-right) */
  .jk-topbar-search {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    flex: 0 0 auto !important;
    width: 132px !important;
    max-width: 40vw !important;
    margin: 0 0 0 auto !important;
    z-index: 2;
  }
  .jk-topbar-search .jk-search-ico {
    left: 10px;
  }
  .jk-topbar-search-input {
    height: 34px !important;
    font-size: 0.78rem !important;
    padding: 0 10px 0 32px !important;
    border-radius: 10px !important;
    background: #f3f4f6 !important;
    border: 1px solid #e5e7eb !important;
    box-shadow: none !important;
  }
  .jk-topbar-search-input::placeholder {
    color: #9ca3af;
    font-size: 0.75rem;
  }
  .jk-topbar-search-input:focus {
    background: #fff !important;
    border-color: rgba(15, 98, 254,.45) !important;
    box-shadow: 0 0 0 3px rgba(15, 98, 254,.12) !important;
  }

  /* Article breathing room on phone */
  .jk-shell-inner { padding: 16px 14px 28px !important; }
  .jk-article {
    padding: 18px 16px 22px !important;
    border-radius: 14px;
  }
  .jk-article-title {
    font-size: 1.28rem !important;
    line-height: 1.35 !important;
    margin-bottom: 10px !important;
  }
  .jk-article-meta {
    gap: 8px !important;
    font-size: 0.8rem !important;
    margin-bottom: 14px !important;
  }
  .jk-article .markdown,
  .jk-article .jk-markdown {
    max-width: none;
  }
}


/* ---- Mobile bottom bar (Spark-like): 首页/分类/向上/返回 — no search ---- */
.jk-mbar { display: none; }
@media (max-width: 767px) {
  body { padding-bottom: calc(64px + env(safe-area-inset-bottom, 0px)); }
  .jk-mbar {
    display: block;
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 1100;
    background: rgba(255,255,255,.96);
    -webkit-backdrop-filter: saturate(180%) blur(14px);
    backdrop-filter: saturate(180%) blur(14px);
    border-top: 1px solid #e9edf2;
    box-shadow: 0 -4px 18px rgba(15,23,42,.06);
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }
  .jk-mbar-list {
    display: grid;
    grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr));
    list-style: none;
    margin: 0; padding: 0;
    height: 56px;
  }
  .jk-mbar-i { min-width: 0; text-align: center; }
  .jk-mbar-i a {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 3px; height: 56px; padding: 0 2px;
    color: #6b7683; text-decoration: none; font-size: 11px;
    -webkit-tap-highlight-color: transparent;
  }
  .jk-mbar-ic {
    display: inline-flex; align-items: center; justify-content: center;
    width: 26px; height: 26px;
  }
  .jk-mbar-t {
    display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis;
    white-space: nowrap; line-height: 14px; font-weight: 500;
  }
  .jk-mbar-i.is-on a { color: var(--jk-blue); }
  .jk-mbar-i.is-on a:after {
    content: ""; position: absolute; top: 0; left: 50%; width: 22px; height: 3px;
    margin-left: -11px; border-radius: 0 0 3px 3px; background: var(--jk-blue);
  }
  .jk-mbar-i { position: relative; }
  .side-toolbar { bottom: calc(72px + env(safe-area-inset-bottom, 0px)); }
}

/* Desktop: never show mbar */
@media (min-width: 768px) {
  .jk-mbar { display: none !important; }
}


/* 1.5.18: main is page shell; grid lives on #jkArticleRailWrap */
.jk-article-page { display: block; width: 100%; }
.jk-article-page > .jk-article-recommend { margin-top: 20px; }


/* ========== 1.5.18 mobile 2-col cards (Bilibili-like; option for 1-col) ========== */
@media (max-width: 767px) {
  .jk-masonry {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }
  body.jk-mcols-1 .jk-masonry {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  /* Compact cards in 2-col mode */
  body:not(.jk-mcols-1) .jk-mcard {
    border-radius: 12px;
  }
  body:not(.jk-mcols-1) .jk-mcard-cover img,
  body:not(.jk-mcols-1) .jk-mcard-cover.is-placeholder .jk-mcard-ph,
  body:not(.jk-mcols-1) .jk-mcard--mid .jk-mcard-cover img,
  body:not(.jk-mcols-1) .jk-mcard--tall .jk-mcard-cover img {
    height: 96px;
  }
  body:not(.jk-mcols-1) .jk-mcard-body {
    padding: 8px 9px 10px;
  }
  body:not(.jk-mcols-1) .jk-mcard-meta {
    font-size: 0.65rem;
    margin-bottom: 4px;
    gap: 4px;
  }
  body:not(.jk-mcols-1) .jk-mcard-title {
    font-size: 0.78rem;
    line-height: 1.35;
    margin: 0 0 6px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  body:not(.jk-mcols-1) .jk-mcard-excerpt { display: none !important; }
  body:not(.jk-mcols-1) .jk-mcard-foot {
    font-size: 0.65rem;
  }
  body:not(.jk-mcols-1) .jk-mcard-author { display: none; }
  body:not(.jk-mcols-1) .jk-badge {
    top: 6px; left: 6px;
    font-size: 0.6rem;
    padding: 2px 6px;
  }

  /* 1-col option: keep roomier cards */
  body.jk-mcols-1 .jk-mcard-cover img,
  body.jk-mcols-1 .jk-mcard-cover.is-placeholder .jk-mcard-ph {
    height: 148px;
  }
  body.jk-mcols-1 .jk-mcard-body { padding: 14px 14px 16px; }
  body.jk-mcols-1 .jk-mcard-title { font-size: 0.95rem; }
}


/* ========== 1.5.19 Quark compact chrome + mobile ranks ========== */

/* Desktop: keep floating centered search; hide 更多 (sidenav always on) */
.jk-nav-toggle { display: none; }
.jk-hot-brand,
.jk-hot-tabs { display: none; }

@media (min-width: 861px) {
  /* Desktop floating search unchanged; larger brand when shell shows it */
  .jk-topbar-brand img { height: 36px; }
  /* Desktop: always show all home rank panels even if [hidden] for mobile tabs */
  .jk-hot--home .jk-hot-grid [data-jk-hot-panel][hidden] {
    display: flex !important;
  }
  .jk-hot--home .jk-hot-full-link {
    font-size: 0.78rem;
  }
  /* Content a bit more prominent: slightly tighter shell top padding */
  .jk-shell-inner { padding-top: 24px; }
}

@media (max-width: 860px) {
  :root { --jk-topbar-h: 48px; }

  /* Quark-like compact top: [更多] [大Logo] [盒式搜索……] */
  .jk-topbar {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    height: var(--jk-topbar-h) !important;
    min-height: var(--jk-topbar-h) !important;
    max-height: var(--jk-topbar-h) !important;
    padding: 0 10px 0 6px !important;
    gap: 6px !important;
    overflow: visible !important;
  }

  .jk-nav-toggle {
    order: 1;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: auto !important;
    min-width: 0;
    height: 28px !important;
    padding: 0 8px !important;
    margin: 0;
    border-radius: 8px !important;
    background: transparent !important;
    box-shadow: none !important;
    border: 0 !important;
    flex: 0 0 auto;
  }
  .jk-nav-toggle-bars { display: none !important; }
  .jk-nav-toggle-label {
    display: inline !important;
    font-size: 0.7rem !important;
    font-weight: 600 !important;
    color: #64748b !important;
  }
  body.jk-nav-open .jk-nav-toggle-label { color: var(--jk-blue) !important; }

  .jk-topbar-brand {
    order: 2;
    display: block !important;
    flex: 0 1 auto !important;
    min-width: 0;
    max-width: min(160px, 42vw) !important;
  }
  .jk-topbar-brand img {
    height: 34px !important;
    width: auto;
    max-width: 150px;
  }

  .jk-topbar-nav { display: none !important; }

  /* Mobile box-style search (not floating, fills remaining row) */
  .jk-topbar-search {
    order: 3;
    position: relative !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 0 0 2px !important;
    z-index: 2;
  }
  .jk-topbar-search .jk-search-ico { left: 10px; }
  .jk-topbar-search-input {
    height: 34px !important;
    font-size: 0.8rem !important;
    padding: 0 10px 0 32px !important;
    border-radius: 10px !important;
    background: #f3f4f6 !important;
    border: 1px solid #e5e7eb !important;
    box-shadow: none !important;
  }
  .jk-topbar-search-input::placeholder {
    color: #9ca3af;
    font-size: 0.76rem;
  }
  .jk-topbar-search-input:focus {
    background: #fff !important;
    border-color: rgba(15, 98, 254,.45) !important;
    box-shadow: 0 0 0 3px rgba(15, 98, 254,.12) !important;
  }

  .jk-topbar-actions {
    order: 4;
    display: flex !important;
    margin-left: 0 !important;
    gap: 4px;
  }
  .jk-topbar-actions .jk-topbar-user {
    width: 28px; height: 28px;
  }

  /* Content more prominent */
  .jk-shell-inner {
    padding: 12px 12px 24px !important;
  }
  .jk-store-hero { display: none !important; }
}

/* ---- Mobile home rankings: Quark compact hot card ---- */
@media (max-width: 640px) {
  .jk-hot--home {
    display: flex !important;
    flex-direction: column;
    gap: 0;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: 14px;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.05);
    overflow: hidden;
    margin: 0 0 12px;
    padding: 0;
  }

  .jk-hot--home .jk-hot-bar--home-top {
    display: flex !important;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    padding: 10px 12px 6px;
    border-bottom: 0;
  }
  .jk-hot--home .jk-hot-brand {
    display: inline-block !important;
    font-size: 1.05rem;
    font-weight: 800;
    color: #2563eb;
    letter-spacing: -0.01em;
    margin-right: 4px;
    flex: 0 0 auto;
  }
  .jk-hot--home .jk-hot-tabs {
    display: inline-flex !important;
    align-items: center;
    gap: 2px;
    margin-left: auto;
    background: #f1f5f9;
    border-radius: 999px;
    padding: 2px;
    flex: 0 1 auto;
    max-width: 58vw;
    overflow-x: auto;
    scrollbar-width: none;
  }
  .jk-hot--home .jk-hot-tabs::-webkit-scrollbar { display: none; }
  .jk-hot--home .jk-hot-tab {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    border: 0;
    background: transparent;
    color: #64748b;
    font-size: 0.72rem;
    font-weight: 600;
    padding: 4px 9px;
    border-radius: 999px;
    cursor: pointer;
    white-space: nowrap;
    line-height: 1.2;
  }
  .jk-hot--home .jk-hot-tab.is-active {
    background: #fff;
    color: #2563eb;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
  }
  .jk-hot--home .jk-hot-full-link {
    flex: 0 0 auto;
    font-size: 0.72rem !important;
    font-weight: 600;
    color: #94a3b8 !important;
    padding: 2px 0 2px 4px !important;
  }

  .jk-hot--home .jk-hot-grid--home,
  .jk-hot--home .jk-hot-grid {
    display: block !important;
    grid-template-columns: none !important;
    gap: 0 !important;
    padding: 0 4px 6px;
  }
  .jk-hot--home .jk-hot-col,
  .jk-hot--home .jk-hot-card {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
  }
  .jk-hot--home .jk-hot-col-head,
  .jk-hot--home .jk-hot-col-foot,
  .jk-hot--home .jk-hot-col-sub {
    display: none !important;
  }
  .jk-hot--home .jk-hot-scroll {
    max-height: none !important;
    overflow: visible !important;
    padding: 2px 6px 8px !important;
  }
  .jk-hot--home .jk-hot-link {
    align-items: center;
    gap: 8px;
    padding: 6px 6px !important;
    border-radius: 8px;
  }
  .jk-hot--home .jk-hot-rank {
    width: 18px;
    height: 18px;
    font-size: 0.68rem;
    margin-top: 0;
  }
  .jk-hot--home .jk-hot-name {
    font-size: 0.82rem !important;
    font-weight: 500;
    line-height: 1.35;
    -webkit-line-clamp: 1 !important;
    color: #0f172a;
  }
  /* Only one panel visible on phone (tabs) */
  .jk-hot--home [data-jk-hot-panel][hidden] {
    display: none !important;
  }
}

/* Tablet: home still 3-col compact if space; show ranks */
@media (min-width: 641px) and (max-width: 860px) {
  .jk-hot--home { display: flex !important; }
  .jk-hot--home .jk-hot-brand,
  .jk-hot--home .jk-hot-tabs { display: none !important; }
  .jk-hot--home .jk-hot-grid--home {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  .jk-hot--home .jk-hot-grid [data-jk-hot-panel][hidden] {
    display: flex !important;
  }
  .jk-hot--home .jk-hot-name {
    font-size: 0.8rem;
    -webkit-line-clamp: 1;
  }
  .jk-hot--home .jk-hot-link { padding: 6px 6px; }
}


/* ========== 1.5.20 floating sidenav · bottom-center TOC · mobile polish ========== */

/* Floating sidenav: solid white ~20% transparent, content shows through */
.jk-sidenav {
  top: 12px;
  left: 12px;
  bottom: 12px;
  height: auto;
  width: calc(var(--jk-side-w) - 4px);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.8);
  border: 1px solid rgba(15, 23, 42, 0.06);
  box-shadow: 0 8px 28px rgba(15, 23, 42, 0.08);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  padding: 18px 14px 14px;
}
.jk-shell {
  margin-left: calc(var(--jk-side-w) + 8px);
}
html,
body.jk-body.jk-app {
  background: var(--jk-shell-bg);
}

@media (max-width: 860px) {
  .jk-sidenav {
    top: 0;
    left: 0;
    bottom: 0;
    height: 100vh;
    height: 100dvh;
    width: min(86vw, 300px);
    border-radius: 0 16px 16px 0;
    background: rgba(255, 255, 255, 0.82);
    transform: translateX(-105%);
  }
  body.jk-nav-open .jk-sidenav { transform: translateX(0); }
  .jk-shell { margin-left: 0; }
}

/* Article: no right sticky column; full-width article */
.jk-article-with-toc {
  display: block;
  position: relative;
}
@media (min-width: 1024px) {
  .jk-shell-inner:has(.jk-article-with-toc.has-toc),
  .jk-shell-inner:has(.jk-article-with-toc.has-rail),
  main.jk-article-with-toc.has-toc,
  main.jk-article-with-toc.has-rail,
  .jk-article-with-toc.has-toc,
  .jk-article-with-toc.has-rail {
    max-width: none;
    grid-template-columns: minmax(0, 1fr);
    margin-left: 0;
    margin-right: 0;
  }
  main.jk-article-with-toc.has-toc > .jk-rail,
  main.jk-article-with-toc.has-rail > .jk-rail,
  .jk-article-with-toc.has-toc .jk-rail,
  .jk-article-with-toc.has-rail .jk-rail {
    /* overridden by float panel below */
    width: auto;
    max-height: none;
    position: static;
  }
}

/* Bottom-center transparent floating TOC (+ optional ads under it) */
.jk-rail.jk-float-toc,
.jk-float-toc#jkRail {
  display: flex !important;
  flex-direction: column;
  gap: 10px;
  position: fixed;
  left: 50%;
  bottom: max(18px, env(safe-area-inset-bottom, 0px) + 12px);
  transform: translateX(-50%);
  z-index: 900;
  width: min(420px, calc(100vw - 28px));
  max-height: min(52vh, 420px);
  pointer-events: none;
}
.jk-float-toc .jk-toc,
.jk-float-toc .jk-rail-ads,
.jk-float-toc .jk-rail-slot,
.jk-float-toc .jk-toc-panel {
  pointer-events: auto;
}
.jk-float-toc .jk-toc {
  display: block;
  width: 100%;
  max-height: none;
}
.jk-float-toc .jk-toc[hidden] { display: none !important; }
.jk-float-toc .jk-toc-panel {
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 14px;
  box-shadow: 0 10px 32px rgba(15, 23, 42, 0.12);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  padding: 10px 10px 12px;
  max-height: min(42vh, 340px);
  overflow: auto;
}
.jk-float-toc .jk-toc-title {
  color: #111827;
  font-weight: 750;
  opacity: 1;
}
.jk-float-toc .jk-toc-link {
  color: #1f2937;
  opacity: 1;
}
.jk-float-toc .jk-toc-close {
  display: none !important;
}
.jk-float-toc .jk-rail-ads {
  margin-top: 0;
  gap: 8px;
}
.jk-float-toc .jk-rail-slot {
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 12px;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  padding: 10px;
  max-height: min(28vh, 200px);
}
/* Hide empty / placeholder ads */
.jk-rail-placeholder { display: none !important; }
.jk-rail-slot:empty { display: none !important; }
.jk-rail-ads:empty { display: none !important; }

.jk-toc-fab { display: none !important; }

@media (max-width: 1023px) {
  /* Mobile: keep floating TOC usable (smaller) near bottom-center above mbar */
  .jk-rail.jk-float-toc,
  .jk-float-toc#jkRail {
    display: flex !important;
    bottom: calc(64px + env(safe-area-inset-bottom, 0px));
    width: min(360px, calc(100vw - 24px));
    max-height: min(40vh, 280px);
  }
  .jk-float-toc .jk-toc-panel {
    max-height: min(34vh, 240px);
    padding: 8px 8px 10px;
  }
  .jk-float-toc .jk-toc-link { font-size: 0.78rem; padding: 5px 6px; }
  .jk-toc,
  .jk-rail.jk-float-toc {
    display: flex !important;
  }
}

/* Mobile topbar: Logo | search | 更多 (right) */
@media (max-width: 860px) {
  .jk-topbar-brand { order: 1 !important; }
  .jk-topbar-search { order: 2 !important; margin-left: 0 !important; }
  .jk-nav-toggle {
    order: 3 !important;
    margin-left: 2px !important;
    flex: 0 0 auto !important;
  }
  .jk-topbar-actions { order: 4 !important; }

  /* Mobile article header / meta — less cramped */
  .jk-article {
    padding: 20px 16px 24px !important;
  }
  .jk-article-header {
    margin-bottom: 4px;
  }
  .jk-article-title {
    font-size: 1.32rem !important;
    line-height: 1.4 !important;
    margin: 0 0 12px !important;
    letter-spacing: -0.02em;
  }
  .jk-article-meta.log-meta {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px !important;
    margin-bottom: 16px !important;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(15, 23, 42, 0.06);
  }
  .jk-article-meta .log-meta-left {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 10px;
    row-gap: 6px;
    line-height: 1.5;
  }
  .jk-article-meta .log-meta-item {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.78rem !important;
    color: var(--jk-muted);
  }
  .jk-article-meta .log-meta-right {
    align-self: flex-start;
  }
}

/* Tighten mobile home gaps (ranks / cards / empty boxes) */
@media (max-width: 640px) {
  .jk-shell-inner {
    padding: 8px 10px 20px !important;
  }
  .jk-hot--home {
    margin: 0 0 8px !important;
    border-radius: 12px;
  }
  .jk-hot--home .jk-hot-bar--home-top {
    padding: 8px 10px 4px !important;
  }
  .jk-hot--home .jk-hot-grid,
  .jk-hot--home .jk-hot-grid--home {
    gap: 0 !important;
    padding: 0 4px 6px !important;
  }
  .jk-hot--home .jk-hot-link {
    padding: 4px 6px !important;
  }
  .jk-masonry,
  .jk-mlist,
  .jk-card-grid,
  .log-list,
  .jk-home-list {
    gap: 8px !important;
    margin-top: 8px !important;
  }
  .jk-mcard,
  .jk-card {
    margin: 0 !important;
  }
  .jk-main-head,
  .jk-page-head,
  .jk-section-head {
    margin-bottom: 8px !important;
  }
  .jk-bento,
  .jk-store-hero,
  .jk-slide-cell:empty,
  .jk-empty,
  .jk-placeholder-box {
    margin-bottom: 8px !important;
  }
  /* Collapse visually empty decorative boxes */
  .jk-hot--home:empty,
  .jk-recommend:empty,
  .jk-rail-ads:empty {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }
}



/* Spark-like article image lightbox (1.5.20) */
#articleContent img.jk-zoomable,
.jk-markdown img.jk-zoomable { cursor: zoom-in; }
html.jk-lock {
  overflow: hidden !important;
  height: 100%;
}
body.jk-lock {
  overflow: hidden !important;
  position: fixed !important;
  left: 0;
  right: 0;
  width: 100%;
}
.jk-lb {
  position: fixed; left: 0; top: 0; right: 0; bottom: 0; z-index: 10050;
  background: rgba(0,0,0,.88);
  display: flex; align-items: center; justify-content: center;
  touch-action: none;
  animation: jk-lb-in .18s ease-out;
}
@keyframes jk-lb-in { from { opacity: 0; } to { opacity: 1; } }
.jk-lb-img {
  display: block; max-width: 92vw; max-height: 88vh; width: auto; height: auto;
  object-fit: contain; border-radius: 6px;
  box-shadow: 0 10px 40px rgba(0,0,0,.5);
  transition: opacity .2s, transform .12s;
  cursor: zoom-out; user-select: none; -webkit-user-drag: none;
}
.jk-lb-x, .jk-lb-p, .jk-lb-n {
  position: absolute; border: 0; background: rgba(255,255,255,.14); color: #fff;
  cursor: pointer; line-height: 1; border-radius: 50%;
  width: 44px; height: 44px; font-size: 28px; padding: 0; text-align: center;
}
.jk-lb-x:hover, .jk-lb-p:hover, .jk-lb-n:hover { background: rgba(255,255,255,.28); }
.jk-lb-x { top: 16px; right: 16px; }
.jk-lb-p { left: 16px; top: 50%; margin-top: -22px; }
.jk-lb-n { right: 16px; top: 50%; margin-top: -22px; }
.jk-lb.single .jk-lb-p, .jk-lb.single .jk-lb-n { display: none; }
.jk-lb-cap {
  position: absolute; left: 0; right: 0; bottom: 14px; text-align: center;
  color: rgba(255,255,255,.8); font-size: 13px; padding: 0 60px; pointer-events: none;
}
@media (max-width: 767px) {
  .jk-lb-p, .jk-lb-n { width: 36px; height: 36px; font-size: 22px; }
  .jk-lb-p { left: 8px; } .jk-lb-n { right: 8px; }
  .jk-lb-x { top: 10px; right: 10px; }
}

/* ========== 1.5.21 center article + right transparent TOC · solid white scrollable sidenav · mobile hot gap ========== */

/* ---- Sidenav: pure solid white (not gray / not translucent) ---- */
.jk-sidenav {
  top: 12px;
  left: 12px;
  bottom: 12px;
  height: auto;
  max-height: calc(100dvh - 24px);
  width: calc(var(--jk-side-w) - 4px);
  border-radius: 18px;
  background: #ffffff !important; /* solid pure white */
  border: 1px solid rgba(15, 23, 42, 0.06);
  box-shadow: 0 8px 28px rgba(15, 23, 42, 0.08);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  padding: 18px 14px 14px;
  overflow: hidden; /* clip; children scroll */
  display: flex;
  flex-direction: column;
}
.jk-sidenav-nav {
  flex: 1 1 auto;
  min-height: 0; /* allow shrink so overflow-y works */
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}
.jk-sidenav-top,
.jk-sidenav-foot {
  flex: 0 0 auto;
}

/* Page bg stable (home and elsewhere): shell gray, not side-bg flash */
html,
body.jk-body.jk-app {
  background: var(--jk-shell-bg) !important;
}
.jk-shell {
  margin-left: calc(var(--jk-side-w) + 8px);
  background: transparent;
}

@media (max-width: 860px) {
  /* Mobile sidenav: full-height drawer, solid white, scrollable */
  .jk-sidenav {
    top: 0 !important;
    left: 0 !important;
    bottom: 0 !important;
    height: 100vh !important;
    height: 100dvh !important;
    max-height: none !important;
    width: min(88vw, 320px) !important;
    border-radius: 0 16px 16px 0 !important;
    background: #ffffff !important;
    transform: translateX(-105%);
    padding: 16px 14px calc(18px + env(safe-area-inset-bottom, 0px));
  }
  body.jk-nav-open .jk-sidenav {
    transform: translateX(0);
  }
  .jk-shell { margin-left: 0; }
  .jk-sidenav-nav {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
  }
}

/* ---- Article: restore center column + right rail (undo 1.5.20 full-bleed / bottom TOC) ---- */
.jk-article-with-toc,
.jk-article-rail-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 20px;
  align-items: start;
  position: relative;
}

@media (min-width: 1024px) {
  .jk-shell-inner:has(.jk-article-with-toc.has-toc),
  .jk-shell-inner:has(.jk-article-with-toc.has-rail) {
    max-width: 1380px !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    padding-right: 28px;
    padding-left: 20px;
  }
  main.jk-article-with-toc.has-toc,
  main.jk-article-with-toc.has-rail,
  .jk-article-with-toc.has-toc,
  .jk-article-with-toc.has-rail {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 280px !important;
    gap: 24px !important;
    align-items: start !important;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
  }

  /* Right sticky transparent floating TOC rail */
  .jk-rail.jk-side-toc,
  .jk-rail.jk-float-toc,
  .jk-side-toc#jkRail,
  .jk-float-toc#jkRail,
  .jk-article-with-toc.has-toc .jk-rail,
  .jk-article-with-toc.has-rail .jk-rail {
    display: flex !important;
    flex-direction: column;
    gap: 12px;
    position: sticky !important;
    top: calc(var(--jk-topbar-h) + 16px) !important;
    left: auto !important;
    bottom: auto !important;
    transform: none !important;
    width: 280px !important;
    max-width: 280px;
    max-height: calc(100vh - var(--jk-topbar-h) - 32px);
    z-index: 80;
    align-self: start;
    pointer-events: auto;
  }
  .jk-side-toc .jk-toc,
  .jk-float-toc .jk-toc,
  .jk-article-with-toc.has-toc .jk-toc {
    display: block !important;
    width: 100%;
    max-height: none;
    pointer-events: auto;
  }
  .jk-side-toc .jk-toc[hidden],
  .jk-article-with-toc.has-toc .jk-toc[hidden] {
    display: block !important; /* has-toc implies content */
  }
  .jk-side-toc .jk-toc-panel,
  .jk-float-toc .jk-toc-panel,
  .jk-article-with-toc .jk-toc-panel {
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 14px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    padding: 12px 10px 14px;
    max-height: calc(100vh - var(--jk-topbar-h) - 260px);
    overflow: auto;
  }
  .jk-side-toc .jk-toc-title,
  .jk-side-toc .jk-toc-link {
    color: #111827;
    opacity: 1;
  }
  .jk-side-toc .jk-toc-close,
  .jk-side-toc ~ .jk-toc-fab,
  .jk-article-with-toc .jk-toc-fab,
  .jk-article-with-toc .jk-toc-close {
    display: none !important;
  }
  .jk-side-toc .jk-rail-ads,
  .jk-side-toc .jk-rail-slot {
    pointer-events: auto;
  }
  .jk-side-toc .jk-rail-slot {
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 12px;
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.06);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    padding: 10px;
    max-height: min(28vh, 200px);
  }
}

@media (min-width: 1480px) {
  .jk-shell-inner:has(.jk-article-with-toc.has-toc),
  .jk-shell-inner:has(.jk-article-with-toc.has-rail) {
    max-width: 1480px !important;
  }
  main.jk-article-with-toc.has-toc,
  main.jk-article-with-toc.has-rail,
  .jk-article-with-toc.has-toc,
  .jk-article-with-toc.has-rail {
    grid-template-columns: minmax(0, 1fr) 300px !important;
    gap: 30px !important;
  }
  .jk-rail.jk-side-toc,
  .jk-rail.jk-float-toc,
  .jk-article-with-toc.has-toc .jk-rail,
  .jk-article-with-toc.has-rail .jk-rail {
    width: 300px !important;
    max-width: 300px;
  }
}

/* Mobile / tablet: hide TOC (+ fab) entirely; article full width of shell */
@media (max-width: 1023px) {
  .jk-rail,
  .jk-rail.jk-side-toc,
  .jk-rail.jk-float-toc,
  .jk-side-toc#jkRail,
  .jk-float-toc#jkRail,
  .jk-toc,
  .jk-toc-fab {
    display: none !important;
  }
  main.jk-article-with-toc.has-toc,
  main.jk-article-with-toc.has-rail,
  .jk-article-with-toc.has-toc,
  .jk-article-with-toc.has-rail {
    display: block !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Empty ads stay hidden */
.jk-rail-placeholder { display: none !important; }
.jk-rail-slot:empty { display: none !important; }
.jk-rail-ads:empty { display: none !important; }

/* ---- Mobile home: kill large empty gap under 热榜; hide empty containers ---- */
.jk-hub-strip[hidden],
.jk-loadmore[hidden],
.jk-store-hero:empty,
.jk-bento-hero:empty,
.jk-recommend:empty,
.jk-hot-empty:empty,
.jk-placeholder-box:empty,
.jk-slide-cell:empty {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
  height: 0 !important;
  border: 0 !important;
  overflow: hidden !important;
}

@media (max-width: 640px) {
  .jk-bento--home {
    gap: 10px !important;
  }
  .jk-hot--home {
    margin: 0 0 8px !important;
    gap: 0 !important;
  }
  /* Critical: [hidden] is overridden by .jk-hot-card { display:flex } — force hide inactive tabs */
  .jk-hot--home [data-jk-hot-panel][hidden],
  .jk-hot--home .jk-hot-col[hidden],
  .jk-hot--home .jk-hot-card[hidden] {
    display: none !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    visibility: hidden !important;
  }
  .jk-hot--home .jk-hot-grid--home,
  .jk-hot--home .jk-hot-grid {
    display: block !important;
    gap: 0 !important;
    padding: 0 4px 4px !important;
    min-height: 0 !important;
  }
  .jk-hot--home .jk-hot-scroll {
    max-height: none !important;
    min-height: 0 !important;
    padding: 2px 6px 6px !important;
  }
  .jk-masonry,
  .jk-home-list {
    margin-top: 0 !important;
  }
  /* store hero stays hidden on phone when hot mode */
  .jk-store-hero {
    display: none !important;
    min-height: 0 !important;
    height: 0 !important;
    margin: 0 !important;
  }
}


/* ========== 1.5.21b rail order · center margins · TOC no border · typography polish ========== */

/* Content stays a readable center column with side margins (not full-bleed) */
@media (min-width: 1024px) {
  .jk-article-page .jk-article-with-toc,
  #jkArticleRailWrap.jk-article-with-toc {
    width: 100%;
    max-width: 1180px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 12px;
    padding-right: 12px;
  }
  .jk-article-page .jk-article,
  #jkArticle {
    /* article column breathes inside the grid */
    max-width: 100%;
  }
  .jk-shell-inner:has(.jk-article-with-toc) {
    /* keep side margins relative to shell */
    padding-left: 28px !important;
    padding-right: 32px !important;
  }
}

/* Right rail: stacked ad → TOC → ad; empty slots gone */
.jk-rail.jk-side-toc,
.jk-rail.jk-float-toc {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.jk-rail-slot:empty,
.jk-rail-slot:not(:has(*)):empty,
.jk-rail-ads:empty,
.jk-rail-placeholder {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
}

/* TOC: transparent, no border */
@media (min-width: 1024px) {
  .jk-side-toc .jk-toc-panel,
  .jk-float-toc .jk-toc-panel,
  .jk-article-with-toc .jk-toc-panel {
    background: rgba(255, 255, 255, 0.55) !important;
    border: 0 !important;
    box-shadow: none !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-radius: 12px;
    padding: 10px 8px 12px;
  }
  .jk-side-toc .jk-toc-head {
    border-bottom: 0 !important;
    padding-bottom: 4px;
  }
  .jk-side-toc .jk-toc-title {
    font-weight: 750;
    color: #0f172a;
  }
  .jk-side-toc .jk-rail-slot {
    border: 0 !important;
    background: rgba(255, 255, 255, 0.55);
    box-shadow: none;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
  }
}

/* Article title bolder to match body typography */
.jk-article-title,
.jk-article-title.log-title {
  font-weight: 800 !important;
  letter-spacing: -0.025em;
  color: #0f172a;
}
@media (min-width: 768px) {
  .jk-article-title {
    font-size: 1.85rem !important;
    line-height: 1.28 !important;
  }
}

/* Reinforce: pure white sidenav + scroll (in case earlier rules diluted) */
.jk-sidenav {
  background: #ffffff !important;
}
.jk-sidenav-nav {
  overflow-y: auto !important;
  min-height: 0 !important;
  flex: 1 1 auto !important;
}

/* Reinforce mobile hot gap kill */
@media (max-width: 640px) {
  .jk-hot--home [hidden],
  .jk-hot--home [data-jk-hot-panel][hidden] {
    display: none !important;
  }
  .jk-bento--home { gap: 8px !important; }
  .jk-hub-strip[hidden] { display: none !important; height: 0 !important; margin: 0 !important; }
}

/* ========== 1.5.24 flat full-height white sidenav · ~20px content gap · centered sticky TOC ========== */

/* ---- Sidenav: flat edge-to-edge full-height pure white column (NO floating card / NO radius) ---- */
@media (min-width: 861px) {
  .jk-sidenav {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: auto !important;
    bottom: 0 !important;
    height: 100vh !important;
    height: 100dvh !important;
    max-height: none !important;
    width: var(--jk-side-w) !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    border: 0 !important;
    border-right: 1px solid rgba(15, 23, 42, 0.08) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    padding: 18px 14px 16px !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    z-index: 1200 !important;
    transform: none !important;
  }
  /* Shell sits flush against sidenav right edge */
  .jk-shell {
    margin-left: var(--jk-side-w) !important;
    background: var(--jk-shell-bg) !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
  }
  html,
  body.jk-body.jk-app {
    background: var(--jk-shell-bg) !important;
  }
}

/* Soft gray hover on white column — no segmented cards */
.jk-sidenav-top,
.jk-sidenav-nav,
.jk-sidenav-foot {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
.jk-sidenav-logo {
  margin-bottom: 8px !important;
  padding: 4px 2px 8px !important;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}
.jk-sidenav-foot {
  padding-top: 8px !important;
  margin-top: auto !important;
  border-top: 0 !important;
  min-height: 0 !important;
}
.jk-sidenav-foot:empty {
  display: none !important;
  padding: 0 !important;
  margin: 0 !important;
  height: 0 !important;
}
.jk-sidenav-nav {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  padding-right: 0 !important;
}
.jk-sidenav-top { flex: 0 0 auto !important; }
.jk-nav-section { margin-bottom: 0 !important; }
.jk-nav-list { gap: 2px !important; }

.jk-nav-link:hover,
.jk-nav-link.is-active,
.jk-nav-link[aria-current="page"],
.jk-nav-back:hover,
.jk-nav-hub-row:hover,
.jk-nav-hub-row:focus-within,
.jk-nav-hub-row:has(> .jk-nav-link.is-active),
.jk-nav-hub-row:has(> .jk-nav-link[aria-current="page"]),
.jk-sidenav-profile:hover {
  background: #f3f4f6 !important;
  box-shadow: none !important;
}
.jk-nav-link.is-active,
.jk-nav-link[aria-current="page"] {
  box-shadow: none !important;
}
.jk-nav-hub-row .jk-nav-link:hover,
.jk-nav-hub-row .jk-nav-link.is-active,
.jk-nav-hub-row .jk-nav-link[aria-current="page"] {
  background: transparent !important;
}

/* Mobile drawer: keep edge sheet */
@media (max-width: 860px) {
  .jk-sidenav {
    top: 0 !important;
    left: 0 !important;
    bottom: 0 !important;
    height: 100vh !important;
    height: 100dvh !important;
    max-height: none !important;
    width: min(88vw, 320px) !important;
    border-radius: 0 16px 16px 0 !important;
    background: #ffffff !important;
    box-shadow: 8px 0 28px rgba(15, 23, 42, 0.12) !important;
  }
  .jk-shell { margin-left: 0 !important; }
}

/* ---- ~20px gap: home + article + all pages hug sidenav ---- */
@media (min-width: 861px) {
  .jk-shell-inner {
    padding-left: 20px !important;
    padding-right: 28px !important;
    margin-left: 0 !important;
    max-width: none !important;
  }
  .jk-shell-inner:has(.jk-article-page),
  .jk-shell-inner:has(.jk-article-with-toc),
  .jk-shell-inner:has(#jkArticle),
  .jk-shell-inner:has(.jk-article-with-toc.has-toc),
  .jk-shell-inner:has(.jk-article-with-toc.has-rail) {
    padding-left: 20px !important;
    padding-right: 28px !important;
    margin-left: 0 !important;
  }
  /* undo earlier “center column” extra left padding on article */
  .jk-article-page .jk-article-with-toc,
  #jkArticleRailWrap.jk-article-with-toc {
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .jk-topbar {
    padding-left: 20px !important;
  }
  .jk-footer {
    padding-left: 20px !important;
  }
}

/* Sticky / overflow: keep TOC sticky workable */
html,
body.jk-body.jk-app {
  overflow-x: clip;
  overflow-y: visible;
}

/* ---- Article: pull title up + 大气 size ---- */
@media (min-width: 861px) {
  .jk-shell-inner:has(.jk-article-page),
  .jk-shell-inner:has(.jk-article-with-toc),
  .jk-shell-inner:has(#jkArticle) {
    padding-top: 10px !important;
  }
  .jk-article-page,
  #jkArticleRailWrap.jk-article-with-toc {
    margin-top: 0 !important;
  }
  .jk-article,
  #jkArticle.jk-article,
  .jk-article-page .jk-article {
    padding-top: 18px !important;
    margin-top: 0 !important;
  }
  .jk-article-header {
    margin: 0 0 8px !important;
    padding: 0 !important;
  }
  .jk-article-title,
  .jk-article-title.log-title,
  #jkArticle .jk-article-title {
    margin: 0 0 10px !important;
    font-size: clamp(1.85rem, 2.6vw, 2.35rem) !important;
    line-height: 1.25 !important;
    font-weight: 850 !important;
    letter-spacing: -0.03em !important;
    color: #0f172a !important;
  }
}

/* ---- TOC: sticky; on scroll hide top ad & vertically center TOC in viewport ---- */
@media (min-width: 1024px) {
  .jk-article-with-toc.has-toc,
  .jk-article-with-toc.has-rail,
  #jkArticleRailWrap.jk-article-with-toc {
    align-items: stretch !important;
    overflow: visible !important;
  }
  .jk-rail.jk-side-toc,
  .jk-rail.jk-float-toc,
  .jk-side-toc#jkRail,
  .jk-article-with-toc.has-toc > .jk-rail,
  .jk-article-with-toc.has-rail > .jk-rail {
    position: sticky !important;
    top: calc(var(--jk-topbar-h, 60px) + 12px) !important;
    align-self: start !important;
    height: fit-content !important;
    max-height: calc(100vh - var(--jk-topbar-h, 60px) - 24px) !important;
    overflow: visible !important;
    z-index: 90;
    transition: top 0.25s ease;
  }
  /* When scrolled: dismiss upper ad so TOC can sit centered
     (selectors must beat .jk-article-with-toc.has-toc > .jk-rail top !important) */
  .jk-rail.jk-side-toc.is-toc-centered,
  .jk-rail.jk-float-toc.is-toc-centered,
  .jk-side-toc#jkRail.is-toc-centered,
  .jk-article-with-toc.has-toc > .jk-rail.is-toc-centered,
  .jk-article-with-toc.has-rail > .jk-rail.is-toc-centered,
  #jkArticleRailWrap.jk-article-with-toc > .jk-rail.is-toc-centered {
    top: max(12px, calc(50vh - (var(--jk-toc-h, 240px) * 0.5))) !important;
    max-height: calc(100vh - 24px) !important;
  }
  .jk-rail.is-toc-centered .jk-rail-slot--top,
  .jk-article-with-toc > .jk-rail.is-toc-centered .jk-rail-slot--top {
    opacity: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
    border: 0 !important;
    min-height: 0 !important;
    transition: max-height 0.25s ease, opacity 0.2s ease, padding 0.2s ease, margin 0.2s ease;
  }
  .jk-rail-slot--top {
    transition: max-height 0.25s ease, opacity 0.2s ease, padding 0.2s ease, margin 0.2s ease;
  }
  .jk-side-toc .jk-toc,
  .jk-side-toc .jk-toc-panel {
    max-height: calc(100vh - 48px);
    overflow: auto;
  }
  .jk-side-toc .jk-toc-panel,
  .jk-article-with-toc .jk-toc-panel {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
  .jk-side-toc .jk-toc-head {
    border-bottom: 0 !important;
  }
}

.jk-article-with-toc,
#jkArticleRailWrap {
  overflow: visible !important;
}

/* Mobile: hide TOC entirely */
@media (max-width: 1023px) {
  .jk-rail,
  .jk-toc,
  .jk-toc-fab {
    display: none !important;
  }
}

/* ---- Footer brand logo: larger ---- */
.jk-fb img,
.jk-fb-l img,
.jk-footer.spark-like .jk-fb img,
.jk-footer.spark-like .jk-fb-l img {
  height: 148px !important;
  width: auto !important;
  max-width: min(420px, 100%) !important;
}
.jk-fb { margin-bottom: 18px !important; }
@media (max-width: 560px) {
  .jk-fb img,
  .jk-fb-l img {
    height: 96px !important;
  }
}


/* ---- 1.5.24 mobile top nav: pure white (not light gray) ---- */
@media (max-width: 860px) {
  .jk-topbar {
    background: #ffffff !important;
    background-color: #ffffff !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08) !important;
  }
}

/* Reinforced: whole mobile chrome header strip pure white */
@media (max-width: 860px) {
  .jk-topbar,
  .jk-shell > .jk-topbar,
  header.jk-topbar {
    background: #fff !important;
    background-color: #fff !important;
    background-image: none !important;
  }
}


/* ========== 1.5.25 Zhihu-style 推荐/热门 sticky sub-nav ========== */
/* Desktop: hide feed tabs entirely (home shows latest + ranks) */
@media (min-width: 861px) {
  .jk-feed-subnav,
  .jk-feed-subnav--mobile {
    display: none !important;
  }
  /* Force latest panel visible; hide mobile-only panels */
  .jk-feed-panel[data-jk-feed-panel="latest"] {
    display: block !important;
  }
  .jk-feed-panel[data-jk-feed-panel="recommend"],
  .jk-feed-panel[data-jk-feed-panel="hot"] {
    display: none !important;
  }
  .jk-home-hot--desktop { display: block; }
}
@media (max-width: 860px) {
  .jk-home-hot--desktop { display: none !important; }
}
.jk-feed-subnav {
  position: sticky;
  top: var(--jk-topbar-h);
  z-index: 990;
  display: flex;
  align-items: stretch;
  gap: 28px;
  height: var(--jk-feed-subnav-h);
  min-height: var(--jk-feed-subnav-h);
  padding: 0 28px;
  margin: 0;
  background: #ffffff;
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: none;
  transition: box-shadow 0.2s ease;
}
.jk-feed-subnav.is-floating {
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
}
.jk-feed-subnav-tab {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding: 0 2px 2px;
  margin: 0;
  border: 0;
  background: transparent;
  color: #8590a6;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1;
  cursor: pointer;
  white-space: nowrap;
  -webkit-tap-highlight-color: transparent;
}
.jk-feed-subnav-tab:hover {
  color: #444;
}
.jk-feed-subnav-tab.is-active {
  color: #121212;
  font-weight: 700;
}
.jk-feed-subnav-tab.is-active::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 6px;
  transform: translateX(-50%);
  width: 1.1em;
  height: 3px;
  border-radius: 2px;
  background: #121212;
}
.jk-feed-panel[hidden] {
  display: none !important;
}
.jk-feed-panel {
  min-width: 0;
}

/* Home brand strip: one compact row (H1 SEO-hidden; brand+site+更多 in bar) */
.jk-home-h1--seo {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.jk-hot-site { display: none; } /* legacy wrapper */
.jk-hot-site-brand {
  display: none;
  font-size: 0.88rem;
  font-weight: 700;
  color: #0f172a !important;
  letter-spacing: -0.01em;
  font-family: "PingFang SC", "Microsoft YaHei", "Heiti SC", "SimHei", sans-serif;
  white-space: nowrap;
  line-height: 1.2;
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  text-decoration: none !important;
}
.jk-hot-site-brand:hover {
  color: var(--jk-blue) !important;
  text-decoration: none !important;
}
.jk-hot-site-link { display: none !important; } /* removed right duplicate */
@media (min-width: 861px) {
  .jk-hot--home {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  .jk-hot--home .jk-hot-bar--home-top {
    display: flex !important;
    flex-wrap: nowrap;
    align-items: center;
    gap: 10px;
    min-height: 28px;
    padding: 0 2px 2px;
    margin: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
  }
  .jk-hot--home .jk-hot-site-brand {
    display: inline-block !important;
  }
  .jk-hot--home .jk-hot-site-link {
    display: none !important;
  }
  .jk-hot--home .jk-hot-full-link,
  .jk-hot--home .jk-hot-more-toggle {
    margin-left: auto;
    font-size: 0.75rem !important;
    font-weight: 600;
    color: #94a3b8 !important;
    background: transparent;
    border: 0;
    cursor: pointer;
    padding: 2px 0;
    line-height: 1.2;
  }
  .jk-hot--home .jk-hot-full-link:hover,
  .jk-hot--home .jk-hot-more-toggle:hover {
    color: var(--jk-blue) !important;
  }
  .jk-home-hot { margin: 0 0 12px; }
}
@media (max-width: 860px) {
  .jk-hot-site,
  .jk-hot--home .jk-hot-site,
  .jk-hot-site-brand,
  .jk-hot--home .jk-hot-site-brand,
  .jk-hot-site-link,
  .jk-hot--home .jk-hot-site-link { display: none !important; }
}

.jk-hot-wrap {
  padding: 4px 0 20px;
}

@media (max-width: 860px) {
  :root { --jk-feed-subnav-h: 42px; }
  .jk-feed-subnav {
    padding: 0 14px;
    gap: 22px;
    background: #ffffff !important;
  }
  .jk-feed-subnav-tab {
    font-size: 0.98rem;
  }
  .jk-feed-subnav-tab.is-active::after {
    bottom: 5px;
    height: 2.5px;
  }
  .jk-hot-site,
  .jk-hot-site-brand {
    margin-bottom: 0;
    padding: 0;
  }
  .jk-hot-site-link {
    font-size: 0.98rem;
  }
}



/* ========== 1.5.26 fixes: avatar, icons, no-toc, footer links, meta align, mobile topbar ========== */

/* Sidebar login avatar — fixed circle, never stretch */
.jk-sidenav-profile {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}
.jk-profile-avatar,
.jk-sidenav-profile img.jk-profile-avatar,
.jk-sidenav-profile > img {
  width: 36px !important;
  height: 36px !important;
  max-width: 36px !important;
  max-height: 36px !important;
  min-width: 36px !important;
  flex: 0 0 36px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  display: block !important;
}
.jk-profile-name {
  flex: 1 1 auto;
  min-width: 0;
}

/* Topbar user avatar (desktop + mobile) */
.jk-topbar-user {
  width: 32px !important;
  height: 32px !important;
  flex: 0 0 32px !important;
  overflow: hidden !important;
  border-radius: 50% !important;
}
.jk-topbar-user img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

/* Article meta: date + views on one horizontal baseline (no crooked图标) */
.jk-article-meta.log-meta,
.jk-article-meta {
  align-items: center !important;
}
.jk-article-meta .log-meta-left {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center !important;
  gap: 6px 14px;
}
.jk-article-meta .log-meta-item {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px;
  line-height: 1.4;
  vertical-align: middle;
}
.jk-article-meta .log-meta-item .iconfont,
.jk-article-meta .iconfont.icon-view {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  font-size: 0.9em;
  line-height: 1 !important;
  transform: none !important;
  position: static !important;
}

/* No TOC / no ads: do not reserve empty right rail — full width content */
@media (min-width: 1024px) {
  .jk-article-with-toc.no-toc.no-rail,
  .jk-article-with-toc.no-toc:not(.has-toc):not(.has-rail),
  .jk-article-rail-grid.no-toc.no-rail {
    display: block !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .jk-shell-inner:has(.jk-article-with-toc.no-toc.no-rail),
  .jk-shell-inner:has(.jk-article-with-toc.no-toc:not(.has-rail)) {
    max-width: 1080px !important;
  }
  .jk-article-with-toc.no-toc.no-rail .jk-article,
  .jk-article-with-toc.no-toc:not(.has-rail) .jk-article {
    max-width: none;
  }
  .jk-article-with-toc.no-toc .jk-rail,
  .jk-article-with-toc.no-toc.no-rail .jk-rail {
    display: none !important;
  }
}

/* Friend links inside dark footer bottom — single divider, plain tiny text */
.jk-footer.spark-like .jk-flink-bar {
  margin-top: 0;
  padding-top: 18px;
  border-top: 0; /* avoid double line with .jk-ftop border-bottom */
}
.jk-footer.spark-like .jk-links,
.jk-footer.spark-like .jk-links-in-footer {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}
.jk-footer.spark-like .jk-links-head {
  padding: 0 0 6px;
  border-bottom: 0;
}
.jk-footer.spark-like .jk-links-head h3 {
  margin: 0;
  padding: 0;
  border-left: 0 !important;
  color: rgba(255,255,255,.38) !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  letter-spacing: .12em;
}
.jk-footer.spark-like .jk-links-grid {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  padding: 0;
  gap: 2px 0;
}
.jk-footer.spark-like .jk-link {
  display: inline;
  height: auto;
  padding: 0;
  margin: 0;
  border-radius: 0;
  background: transparent !important;
  color: rgba(255,255,255,.42) !important;
  font-size: 11px !important;
  line-height: 1.7;
  text-decoration: none;
}
.jk-footer.spark-like .jk-link::after {
  content: " · ";
  color: rgba(255,255,255,.22);
  pointer-events: none;
}
.jk-footer.spark-like .jk-link:last-child::after { content: ""; }
.jk-footer.spark-like .jk-link:hover {
  background: transparent !important;
  color: rgba(255,255,255,.72) !important;
}
.jk-footer.spark-like .jk-link img,
.jk-footer.spark-like .jk-link-dot { display: none !important; }
.jk-footer.spark-like .jk-link span {
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
}
.jk-footer-links-wrap { display: none !important; } /* legacy mid-page slot removed */

/* Distinct nav icon masks (keyword table keys) */
.jk-nav-link[data-icon="mirror"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2v20M4 7l8-3 8 3M4 17l8 3 8-3M4 7v10M20 7v10'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2v20M4 7l8-3 8 3M4 17l8 3 8-3M4 7v10M20 7v10'/%3E%3C/svg%3E");
}
.jk-nav-link[data-icon="spark"] .jk-nav-ico,
.jk-nav-link[data-icon="star"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2l1.8 5.5L19.5 9l-4.4 3.6L16.5 19 12 15.8 7.5 19l1.4-6.4L4.5 9l5.7-1.5L12 2z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2l1.8 5.5L19.5 9l-4.4 3.6L16.5 19 12 15.8 7.5 19l1.4-6.4L4.5 9l5.7-1.5L12 2z'/%3E%3C/svg%3E");
}
.jk-nav-link[data-icon="bolt"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M13 2L4 14h7l-1 8 10-14h-7l0-6z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M13 2L4 14h7l-1 8 10-14h-7l0-6z'/%3E%3C/svg%3E");
}
.jk-nav-link[data-icon="browser"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 4h16a2 2 0 012 2v12a2 2 0 01-2 2H4a2 2 0 01-2-2V6a2 2 0 012-2zm0 4h16M7 6.5h.01M9.5 6.5h.01M12 6.5h.01'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 4h16a2 2 0 012 2v12a2 2 0 01-2 2H4a2 2 0 01-2-2V6a2 2 0 012-2zm0 4h16M7 6.5h.01M9.5 6.5h.01M12 6.5h.01'/%3E%3C/svg%3E");
}
.jk-nav-link[data-icon="tune"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 6h10v2H4V6zm12 0h4v2h-4V6zM4 11h4v2H4v-2zm6 0h10v2H10v-2zM4 16h12v2H4v-2zm14 0h2v2h-2v-2z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 6h10v2H4V6zm12 0h4v2h-4V6zM4 11h4v2H4v-2zm6 0h10v2H10v-2zM4 16h12v2H4v-2zm14 0h2v2h-2v-2z'/%3E%3C/svg%3E");
}
.jk-nav-link[data-icon="terminal"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M3 5h18v14H3V5zm2 3l4 3-4 3v-2l2-1-2-1V8zm6 7h6v2h-6v-2z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M3 5h18v14H3V5zm2 3l4 3-4 3v-2l2-1-2-1V8zm6 7h6v2h-6v-2z'/%3E%3C/svg%3E");
}
.jk-nav-link[data-icon="network"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 3a3 3 0 110 6 3 3 0 010-6zM5 15a3 3 0 110 6 3 3 0 010-6zm14 0a3 3 0 110 6 3 3 0 010-6zM12 9v3M7.5 15.5L10.5 12M16.5 15.5L13.5 12'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 3a3 3 0 110 6 3 3 0 010-6zM5 15a3 3 0 110 6 3 3 0 010-6zm14 0a3 3 0 110 6 3 3 0 010-6zM12 9v3M7.5 15.5L10.5 12M16.5 15.5L13.5 12'/%3E%3C/svg%3E");
}
.jk-nav-link[data-icon="globe"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2a10 10 0 100 20 10 10 0 000-20zm0 2c1.7 0 3.3 2.7 3.8 6H8.2C8.7 6.7 10.3 4 12 4zm0 16c-1.7 0-3.3-2.7-3.8-6h7.6c-.5 3.3-2.1 6-3.8 6zM4.6 10h3.7c-.1.7-.1 1.3 0 2H4.6a8.1 8.1 0 010-2zm11.1 0h3.7a8.1 8.1 0 010 2h-3.7c.1-.7.1-1.3 0-2z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2a10 10 0 100 20 10 10 0 000-20zm0 2c1.7 0 3.3 2.7 3.8 6H8.2C8.7 6.7 10.3 4 12 4zm0 16c-1.7 0-3.3-2.7-3.8-6h7.6c-.5 3.3-2.1 6-3.8 6zM4.6 10h3.7c-.1.7-.1 1.3 0 2H4.6a8.1 8.1 0 010-2zm11.1 0h3.7a8.1 8.1 0 010 2h-3.7c.1-.7.1-1.3 0-2z'/%3E%3C/svg%3E");
}
.jk-nav-link[data-icon="font"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M5 19l4-14h2l4 14h-2.2l-.9-3H8.1l-.9 3H5zm3.7-5h2.6L10 8.8 8.7 14zM16 19v-2h3V7h-3V5h5v14h-5z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M5 19l4-14h2l4 14h-2.2l-.9-3H8.1l-.9 3H5zm3.7-5h2.6L10 8.8 8.7 14zM16 19v-2h3V7h-3V5h5v14h-5z'/%3E%3C/svg%3E");
}
.jk-nav-link[data-icon="opensource"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2a10 10 0 00-3.2 19.5l1.5-4.3A4 4 0 118 12H4a8 8 0 1112.9 6.3l1.5 4.3A10 10 0 0012 2z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2a10 10 0 00-3.2 19.5l1.5-4.3A4 4 0 118 12H4a8 8 0 1112.9 6.3l1.5 4.3A10 10 0 0012 2z'/%3E%3C/svg%3E");
}
.jk-nav-link[data-icon="system"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 5h16v10H4V5zm2 12h4v2H6v-2zm6 0h6v2h-6v-2z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 5h16v10H4V5zm2 12h4v2H6v-2zm6 0h6v2h-6v-2z'/%3E%3C/svg%3E");
}
.jk-nav-link[data-icon="shield"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2l8 3v6c0 5-3.4 9.4-8 11-4.6-1.6-8-6-8-11V5l8-3zm0 4.2L7 7.7v3.4c0 3.4 2.1 6.5 5 7.8 2.9-1.3 5-4.4 5-7.8V7.7l-5-1.5z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2l8 3v6c0 5-3.4 9.4-8 11-4.6-1.6-8-6-8-11V5l8-3zm0 4.2L7 7.7v3.4c0 3.4 2.1 6.5 5 7.8 2.9-1.3 5-4.4 5-7.8V7.7l-5-1.5z'/%3E%3C/svg%3E");
}
.jk-nav-link[data-icon="wrench"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M22 7a5 5 0 01-6.7 4.7l-7.1 7.1-3.2-3.2 7.1-7.1A5 5 0 117 2l2.1 2.1L7 6.2 8.4 7.6 10.5 5.5 12.6 7.6A5 5 0 0122 7z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M22 7a5 5 0 01-6.7 4.7l-7.1 7.1-3.2-3.2 7.1-7.1A5 5 0 117 2l2.1 2.1L7 6.2 8.4 7.6 10.5 5.5 12.6 7.6A5 5 0 0122 7z'/%3E%3C/svg%3E");
}
.jk-nav-link[data-icon="gamepad"] .jk-nav-ico,
.jk-nav-link[data-icon="game"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M6 8h12a4 4 0 014 4v2a4 4 0 01-4 4h-1l-1.5-2h-5L9 18H8a4 4 0 01-4-4v-2a4 4 0 014-4zm2 3v1H7v2h1v1h2v-1h1v-2H9v-1H8zm8.5 1a1.2 1.2 0 100 2.4 1.2 1.2 0 000-2.4zm2.3 1.8a1 1 0 100 2 1 1 0 000-2z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M6 8h12a4 4 0 014 4v2a4 4 0 01-4 4h-1l-1.5-2h-5L9 18H8a4 4 0 01-4-4v-2a4 4 0 014-4zm2 3v1H7v2h1v1h2v-1h1v-2H9v-1H8zm8.5 1a1.2 1.2 0 100 2.4 1.2 1.2 0 000-2.4zm2.3 1.8a1 1 0 100 2 1 1 0 000-2z'/%3E%3C/svg%3E");
}
.jk-nav-link[data-icon="cube"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2l9 5v10l-9 5-9-5V7l9-5zm0 2.2L5 8v8l7 3.8L19 16V8l-7-3.8z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2l9 5v10l-9 5-9-5V7l9-5zm0 2.2L5 8v8l7 3.8L19 16V8l-7-3.8z'/%3E%3C/svg%3E");
}
.jk-nav-link[data-icon="apps"] .jk-nav-ico {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 4h6v6H4V4zm10 0h6v6h-6V4zM4 14h6v6H4v-6zm10 0h6v6h-6v-6z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 4h6v6H4V4zm10 0h6v6h-6V4zM4 14h6v6H4v-6zm10 0h6v6h-6v-6z'/%3E%3C/svg%3E");
}

/* Mobile logged-in topbar: Logo | search | avatar | 更多 — aligned, not clipped */
@media (max-width: 860px) {
  .jk-topbar {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    overflow: visible !important;
    gap: 6px !important;
  }
  .jk-topbar-search {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
  }
  .jk-topbar-brand { order: 1 !important; flex: 0 1 auto !important; max-width: 36vw !important; }
  .jk-topbar-search { order: 2 !important; }
  .jk-topbar-actions {
    order: 3 !important;
    display: flex !important;
    align-items: center !important;
    margin-left: 0 !important;
    flex: 0 0 auto !important;
  }
  .jk-nav-toggle {
    order: 4 !important;
    display: inline-flex !important;
    align-items: center !important;
    flex: 0 0 auto !important;
    height: 32px !important;
  }
  .jk-topbar-actions .jk-topbar-user {
    width: 30px !important;
    height: 30px !important;
  }
}

/* Card covers: ensure broken remote still shows local once rewritten */
.jk-mcard-cover img {
  background: #e5e7eb;
}


/* ---- 1.5.30 home/category bar: bold plain text, not boxed tags ---- */
.jk-hub-strip {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: baseline !important;
  gap: 0 14px !important;
  row-gap: 6px !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  max-width: 100%;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
.jk-hub-tag {
  display: inline !important;
  align-items: baseline !important;
  justify-content: flex-start;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #1d1d1f !important;
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  font-family: "PingFang SC", "Microsoft YaHei", "Heiti SC", "SimHei", sans-serif !important;
  line-height: 1.5 !important;
  white-space: nowrap;
  text-decoration: none !important;
  transition: color .12s;
}
.jk-hub-tag:hover {
  background: transparent !important;
  color: var(--jk-blue) !important;
  border-color: transparent !important;
}
.jk-hub-tag.is-active {
  background: transparent !important;
  color: var(--jk-blue) !important;
  border-color: transparent !important;
  font-weight: 800 !important;
}
@media (max-width: 860px) {
  .jk-hub-strip {
    gap: 0 12px !important;
    row-gap: 4px !important;
    margin-bottom: 10px !important;
  }
  .jk-hub-tag {
    height: auto !important;
    padding: 0 !important;
    font-size: 0.9rem !important;
  }
}



/* Card foot: date + views horizontal align */
.jk-mcard-foot,
.jk-mcard-stats {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px;
}
.jk-mcard-stats .iconfont,
.jk-mcard-foot .iconfont {
  display: inline-flex !important;
  align-items: center;
  line-height: 1 !important;
  transform: none !important;
  font-size: 0.85em;
}

/* ---- 1.5.26 icon masks via full mask shorthand ---- */
.jk-nav-link[data-icon="mirror"] .jk-nav-ico,
.jk-nav-link--child[data-icon="mirror"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M2%207l10-5%2010%205-10%205L2%207zm0%203.5l10%205%2010-5V14l-10%205-10-5v-3.5zm0%205L12%2020.5%2022%2015.5V18l-10%205-10-5v-2.5z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M2%207l10-5%2010%205-10%205L2%207zm0%203.5l10%205%2010-5V14l-10%205-10-5v-3.5zm0%205L12%2020.5%2022%2015.5V18l-10%205-10-5v-2.5z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="spark"] .jk-nav-ico,
.jk-nav-link--child[data-icon="spark"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M12%202l2.2%206.8H21l-5.4%204.2%202.1%206.8L12%2015.8%206.3%2019.8l2.1-6.8L3%208.8h6.8L12%202z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M12%202l2.2%206.8H21l-5.4%204.2%202.1%206.8L12%2015.8%206.3%2019.8l2.1-6.8L3%208.8h6.8L12%202z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="bolt"] .jk-nav-ico,
.jk-nav-link--child[data-icon="bolt"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M13%202L6%2013h5l-1%209%209-13h-5l-1-7z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M13%202L6%2013h5l-1%209%209-13h-5l-1-7z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="browser"] .jk-nav-ico,
.jk-nav-link--child[data-icon="browser"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M3%204h18a1%201%200%20011%201v14a1%201%200%2001-1%201H3a1%201%200%2001-1-1V5a1%201%200%20011-1zm1%204h16v10H4V8zm1-3h2v2H5V5zm3%200h2v2H8V5zm3%200h2v2h-2V5z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M3%204h18a1%201%200%20011%201v14a1%201%200%2001-1%201H3a1%201%200%2001-1-1V5a1%201%200%20011-1zm1%204h16v10H4V8zm1-3h2v2H5V5zm3%200h2v2H8V5zm3%200h2v2h-2V5z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="tune"] .jk-nav-ico,
.jk-nav-link--child[data-icon="tune"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M3%206h10v2H3V6zm12%200h6v2h-6V6zM3%2011h4v2H3v-2zm6%200h12v2H9v-2zM3%2016h12v2H3v-2zm14%200h4v2h-4v-2z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M3%206h10v2H3V6zm12%200h6v2h-6V6zM3%2011h4v2H3v-2zm6%200h12v2H9v-2zM3%2016h12v2H3v-2zm14%200h4v2h-4v-2z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="terminal"] .jk-nav-ico,
.jk-nav-link--child[data-icon="terminal"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M3%204h18v16H3V4zm2%203v2l3%202-3%202v2l5-3.5L5%207zm7%208h6v2h-6v-2z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M3%204h18v16H3V4zm2%203v2l3%202-3%202v2l5-3.5L5%207zm7%208h6v2h-6v-2z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="network"] .jk-nav-ico,
.jk-nav-link--child[data-icon="network"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M10.5%203.5a2.5%202.5%200%20115%200%202.5%202.5%200%2001-5%200zM2%2017a2.5%202.5%200%20115%200%202.5%202.5%200%2001-5%200zm15%200a2.5%202.5%200%20115%200%202.5%202.5%200%2001-5%200zM12%206.2v4.3M7.1%2015.4l3.4-3.5m6.4%203.5l-3.4-3.5%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M10.5%203.5a2.5%202.5%200%20115%200%202.5%202.5%200%2001-5%200zM2%2017a2.5%202.5%200%20115%200%202.5%202.5%200%2001-5%200zm15%200a2.5%202.5%200%20115%200%202.5%202.5%200%2001-5%200zM12%206.2v4.3M7.1%2015.4l3.4-3.5m6.4%203.5l-3.4-3.5%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="globe"] .jk-nav-ico,
.jk-nav-link--child[data-icon="globe"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M12%202C6.48%202%202%206.48%202%2012s4.48%2010%2010%2010%2010-4.48%2010-10S17.52%202%2012%202zm-1%2017.93c-3.95-.49-7-3.85-7-7.93%200-.62.08-1.21.21-1.79L9%2015v1c0%201.1.9%202%202%202v1.93zm6.9-2.54c-.26-.81-1-1.39-1.9-1.39h-1v-3c0-.55-.45-1-1-1H8v-2h2c.55%200%201-.45%201-1V7h2c1.1%200%202-.9%202-2v-.41c2.93%201.19%205%204.06%205%207.41%200%202.08-.8%203.97-2.1%205.39z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M12%202C6.48%202%202%206.48%202%2012s4.48%2010%2010%2010%2010-4.48%2010-10S17.52%202%2012%202zm-1%2017.93c-3.95-.49-7-3.85-7-7.93%200-.62.08-1.21.21-1.79L9%2015v1c0%201.1.9%202%202%202v1.93zm6.9-2.54c-.26-.81-1-1.39-1.9-1.39h-1v-3c0-.55-.45-1-1-1H8v-2h2c.55%200%201-.45%201-1V7h2c1.1%200%202-.9%202-2v-.41c2.93%201.19%205%204.06%205%207.41%200%202.08-.8%203.97-2.1%205.39z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="opensource"] .jk-nav-ico,
.jk-nav-link--child[data-icon="opensource"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M12%202a10%2010%200%2000-3.2%2019.5l1.5-4.4A4.5%204.5%200%20118.5%2012H3A9%209%200%201112%203zm0%202a7%207%200%20016.9%206h-3.4a4.5%204.5%200%2000-7.3%203.2L6.8%2018A7%207%200%200112%204z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M12%202a10%2010%200%2000-3.2%2019.5l1.5-4.4A4.5%204.5%200%20118.5%2012H3A9%209%200%201112%203zm0%202a7%207%200%20016.9%206h-3.4a4.5%204.5%200%2000-7.3%203.2L6.8%2018A7%207%200%200112%204z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="gamepad"] .jk-nav-ico,
.jk-nav-link--child[data-icon="gamepad"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M8%207h8a5%205%200%20015%205v1a5%205%200%2001-5%205h-1l-2-2H11l-2%202H8a5%205%200%2001-5-5v-1a5%205%200%20015-5zm0%203v1H7v2h1v1h2v-1h1v-2H9v-1H8zm8.2%201a1.2%201.2%200%20100%202.4%201.2%201.2%200%20000-2.4zm2.4%201.8a1%201%200%20100%202%201%201%200%20000-2z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M8%207h8a5%205%200%20015%205v1a5%205%200%2001-5%205h-1l-2-2H11l-2%202H8a5%205%200%2001-5-5v-1a5%205%200%20015-5zm0%203v1H7v2h1v1h2v-1h1v-2H9v-1H8zm8.2%201a1.2%201.2%200%20100%202.4%201.2%201.2%200%20000-2.4zm2.4%201.8a1%201%200%20100%202%201%201%200%20000-2z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="cube"] .jk-nav-ico,
.jk-nav-link--child[data-icon="cube"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M12%202l9%205v10l-9%205-9-5V7l9-5zm0%202.4L5.5%208.1v7.8L12%2019.6l6.5-3.7V8.1L12%204.4z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M12%202l9%205v10l-9%205-9-5V7l9-5zm0%202.4L5.5%208.1v7.8L12%2019.6l6.5-3.7V8.1L12%204.4z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="system"] .jk-nav-ico,
.jk-nav-link--child[data-icon="system"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M3%205h18v11H3V5zm2%202v7h14V7H5zm2%2010h4v2H7v-2zm6%200h4v2h-4v-2z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M3%205h18v11H3V5zm2%202v7h14V7H5zm2%2010h4v2H7v-2zm6%200h4v2h-4v-2z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="shield"] .jk-nav-ico,
.jk-nav-link--child[data-icon="shield"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M12%202l8%203v6c0%205-3.5%209.4-8%2011-4.5-1.6-8-6-8-11V5l8-3zm0%202.5L6%206.8V11c0%203.7%202.4%207.1%206%208.5%203.6-1.4%206-4.8%206-8.5V6.8l-6-2.3z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M12%202l8%203v6c0%205-3.5%209.4-8%2011-4.5-1.6-8-6-8-11V5l8-3zm0%202.5L6%206.8V11c0%203.7%202.4%207.1%206%208.5%203.6-1.4%206-4.8%206-8.5V6.8l-6-2.3z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="wrench"] .jk-nav-ico,
.jk-nav-link--child[data-icon="wrench"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M22.7%2019l-9.1-9.1c.9-2.3.4-5-1.5-6.9-2-2-5-2.4-7.4-1.3L9%206%206%209%201.6%204.7C.5%207.1%201%2010.1%203%2012.1c1.9%201.9%204.6%202.4%206.9%201.5l9.1%209.1c.4.4%201%20.4%201.4%200l2.3-2.3c.5-.4.5-1.1.1-1.4z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M22.7%2019l-9.1-9.1c.9-2.3.4-5-1.5-6.9-2-2-5-2.4-7.4-1.3L9%206%206%209%201.6%204.7C.5%207.1%201%2010.1%203%2012.1c1.9%201.9%204.6%202.4%206.9%201.5l9.1%209.1c.4.4%201%20.4%201.4%200l2.3-2.3c.5-.4.5-1.1.1-1.4z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="font"] .jk-nav-ico,
.jk-nav-link--child[data-icon="font"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M5%2020l4-14h2l4%2014h-2.2l-1-3.5H8.2L7.2%2020H5zm3.5-5.5h3L10%209l-1.5%205.5zM16%2020V8h-2V6h6v2h-2v12h-2z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M5%2020l4-14h2l4%2014h-2.2l-1-3.5H8.2L7.2%2020H5zm3.5-5.5h3L10%209l-1.5%205.5zM16%2020V8h-2V6h6v2h-2v12h-2z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="apps"] .jk-nav-ico,
.jk-nav-link--child[data-icon="apps"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M4%204h7v7H4V4zm9%200h7v7h-7V4zM4%2013h7v7H4v-7zm9%200h7v7h-7v-7z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M4%204h7v7H4V4zm9%200h7v7h-7V4zM4%2013h7v7H4v-7zm9%200h7v7h-7v-7z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="star"] .jk-nav-ico,
.jk-nav-link--child[data-icon="star"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M12%202l2.2%206.8H21l-5.4%204.2%202.1%206.8L12%2015.8%206.3%2019.8l2.1-6.8L3%208.8h6.8L12%202z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M12%202l2.2%206.8H21l-5.4%204.2%202.1%206.8L12%2015.8%206.3%2019.8l2.1-6.8L3%208.8h6.8L12%202z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="game"] .jk-nav-ico,
.jk-nav-link--child[data-icon="game"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M8%207h8a5%205%200%20015%205v1a5%205%200%2001-5%205h-1l-2-2H11l-2%202H8a5%205%200%2001-5-5v-1a5%205%200%20015-5zm0%203v1H7v2h1v1h2v-1h1v-2H9v-1H8zm8.2%201a1.2%201.2%200%20100%202.4%201.2%201.2%200%20000-2.4zm2.4%201.8a1%201%200%20100%202%201%201%200%20000-2z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M8%207h8a5%205%200%20015%205v1a5%205%200%2001-5%205h-1l-2-2H11l-2%202H8a5%205%200%2001-5-5v-1a5%205%200%20015-5zm0%203v1H7v2h1v1h2v-1h1v-2H9v-1H8zm8.2%201a1.2%201.2%200%20100%202.4%201.2%201.2%200%20000-2.4zm2.4%201.8a1%201%200%20100%202%201%201%200%20000-2z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="play"] .jk-nav-ico,
.jk-nav-link--child[data-icon="play"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M8%205v14l11-7L8%205z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M8%205v14l11-7L8%205z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="code"] .jk-nav-ico,
.jk-nav-link--child[data-icon="code"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M8.7%2016.7L4%2012l4.7-4.7%201.4%201.4L6.8%2012l3.3%203.3-1.4%201.4zm6.6%200l-1.4-1.4%203.3-3.3-3.3-3.3%201.4-1.4L20%2012l-4.7%204.7z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M8.7%2016.7L4%2012l4.7-4.7%201.4%201.4L6.8%2012l3.3%203.3-1.4%201.4zm6.6%200l-1.4-1.4%203.3-3.3-3.3-3.3%201.4-1.4L20%2012l-4.7%204.7z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="video"] .jk-nav-ico,
.jk-nav-link--child[data-icon="video"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M3%206h12a2%202%200%20012%202v1.2l4-2.5v11l-4-2.5V16a2%202%200%2001-2%202H3V6z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M3%206h12a2%202%200%20012%202v1.2l4-2.5v11l-4-2.5V16a2%202%200%2001-2%202H3V6z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="image"] .jk-nav-ico,
.jk-nav-link--child[data-icon="image"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M5%204h14a2%202%200%20012%202v12a2%202%200%2001-2%202H5a2%202%200%2001-2-2V6a2%202%200%20012-2zm2%2012l3-4%202%202.5L15%2011l4%207H7zm1.5-7.5a1.5%201.5%200%20100-3%201.5%201.5%200%20000%203z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M5%204h14a2%202%200%20012%202v12a2%202%200%2001-2%202H5a2%202%200%2001-2-2V6a2%202%200%20012-2zm2%2012l3-4%202%202.5L15%2011l4%207H7zm1.5-7.5a1.5%201.5%200%20100-3%201.5%201.5%200%20000%203z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="music"] .jk-nav-ico,
.jk-nav-link--child[data-icon="music"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M12%203v10.55A4%204%200%201014%2017V7h4V3h-6z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M12%203v10.55A4%204%200%201014%2017V7h4V3h-6z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="book"] .jk-nav-ico,
.jk-nav-link--child[data-icon="book"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M4%204h7a3%203%200%20013%203v13a2%202%200%2000-2-2H4V4zm9%200h7v14h-5a2%202%200%2000-2%202V7a3%203%200%2000-3-3z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M4%204h7a3%203%200%20013%203v13a2%202%200%2000-2-2H4V4zm9%200h7v14h-5a2%202%200%2000-2%202V7a3%203%200%2000-3-3z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="explore"] .jk-nav-ico,
.jk-nav-link--child[data-icon="explore"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M12%202a10%2010%200%20100%2020%2010%2010%200%20000-20zm4.5%205.5l-2.5%206-6%202.5%202.5-6%206-2.5z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M12%202a10%2010%200%20100%2020%2010%2010%200%20000-20zm4.5%205.5l-2.5%206-6%202.5%202.5-6%206-2.5z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="phone"] .jk-nav-ico,
.jk-nav-link--child[data-icon="phone"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M7%202h10a2%202%200%20012%202v16a2%202%200%2001-2%202H7a2%202%200%2001-2-2V4a2%202%200%20012-2zm0%203v12h10V5H7zm5%2014a1.2%201.2%200%20100-2.4A1.2%201.2%200%200012%2019z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M7%202h10a2%202%200%20012%202v16a2%202%200%2001-2%202H7a2%202%200%2001-2-2V4a2%202%200%20012-2zm0%203v12h10V5H7zm5%2014a1.2%201.2%200%20100-2.4A1.2%201.2%200%200012%2019z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="home"] .jk-nav-ico,
.jk-nav-link--child[data-icon="home"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M12%203l9%208h-3v9h-5v-6H11v6H6v-9H3l9-8z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M12%203l9%208h-3v9h-5v-6H11v6H6v-9H3l9-8z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}
.jk-nav-link[data-icon="folder"] .jk-nav-ico,
.jk-nav-link--child[data-icon="folder"] .jk-nav-ico {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M10%204l2%202h8a2%202%200%20012%202v10a2%202%200%2001-2%202H4a2%202%200%2001-2-2V6a2%202%200%20012-2h6z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%22M10%204l2%202h8a2%202%200%20012%202v10a2%202%200%2001-2%202H4a2%202%200%2001-2-2V6a2%202%200%20012-2h6z%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}


/* Home default rankings block (1.5.28) */
.jk-home-hot {
  margin: 0 0 18px;
}
.jk-home-hot .jk-hot {
  margin-top: 0;
}


/* Feed mix (mobile 推荐) */
.jk-feed-mix { padding: 8px 0 20px; }
.jk-feed-mix-hot { margin-top: 16px; }


/* ---- 1.5.30 mobile home: compact hot preview (not full tophub) ---- */
@media (max-width: 860px) {
  #jkFeedHot .jk-hot-wrap { padding: 0; }
  #jkFeedHot .jk-hot--home,
  .jk-feed-mix-hot .jk-hot--home {
    display: flex !important;
  }
  /* Keep compact Quark card; hide bulky filter drawer by default */
  #jkFeedHot .jk-hot-filters[hidden],
  .jk-feed-mix-hot .jk-hot-filters[hidden] { display: none !important; }
  #jkFeedHot .jk-hot-filters:not([hidden]),
  .jk-feed-mix-hot .jk-hot-filters:not([hidden]) {
    display: block;
    padding: 6px 10px 10px;
    border-top: 1px solid #f1f5f9;
  }
  /* Limit preview rows on mobile hot tab */
  #jkFeedHot .jk-hot--home .jk-hot-item:nth-child(n+6),
  .jk-feed-mix-hot .jk-hot--home .jk-hot-item:nth-child(n+6) {
    display: none !important;
  }
  /* Never render full multi-col tophub layout inside mobile feed panels */
  #jkFeedHot .jk-hot--all,
  #jkFeedHot .jk-hot-grid--full { display: none !important; }
}

/* Hot filters chips */
.jk-hot-filters {
  padding: 8px 4px 12px;
}
.jk-hot-filter-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 8px;
  margin-bottom: 8px;
}
.jk-hot-filter {
  display: inline-flex;
  align-items: center;
  border: 1px solid #e5e7eb;
  background: #fff;
  color: #475569;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 999px;
  cursor: pointer;
  text-decoration: none !important;
}
.jk-hot-filter.is-active {
  background: #111827;
  border-color: #111827;
  color: #fff;
}
.jk-hot-filter-link { color: var(--jk-blue) !important; border-color: rgba(15, 98, 254,.25); }
button.jk-hot-more-toggle { appearance: none; }

/* Rank page filters */
.jk-rank-filters { margin-top: 14px; }
.jk-rank-filter-row {
  display: flex; flex-wrap: wrap; gap: 6px 8px; margin-bottom: 8px;
}
.jk-rank-filter {
  display: inline-flex; align-items: center;
  border: 1px solid #e5e7eb; background: #fff; color: #475569;
  font-size: 0.78rem; font-weight: 600; padding: 5px 12px;
  border-radius: 999px; text-decoration: none !important;
}
.jk-rank-filter.is-active {
  background: #111827; border-color: #111827; color: #fff;
}

/* Recommend refresh / more */
.jk-recommend-head {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px;
}
.jk-recommend-refresh {
  margin-left: auto;
  border: 0; background: #f3f4f6; color: #475569;
  font-size: 0.78rem; font-weight: 600;
  padding: 5px 12px; border-radius: 999px; cursor: pointer;
}
.jk-recommend-refresh:hover { background: #e8f2ff; color: var(--jk-blue); }
.jk-recommend-more {
  display: flex; justify-content: center; padding: 12px 0 4px;
}
.jk-recommend-more-btn {
  border: 0; background: transparent; color: #94a3b8;
  font-size: 0.78rem; cursor: pointer;
}

/* Home H1 — SEO only (visually clipped via .jk-home-h1--seo) */
.jk-home-h1 {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
  color: #0f172a;
}


/* Never show 最新/推荐/热门 on post/page detail */
body.jk-no-feedtabs .jk-feed-subnav,
body.jk-is-article .jk-feed-subnav,
body.jk-app:has(#jkArticlePage) .jk-feed-subnav,
body.jk-app:has(.jk-article) .jk-feed-subnav {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}


/* Back-nav: hold shell + skeleton so list does not flash at top */
html.jk-scroll-hold,
html.jk-scroll-hold body {
  background: #fff;
}
html.jk-scroll-hold #jkShellInner,
html.jk-scroll-hold .jk-shell-inner,
body.jk-scroll-hold #jkShellInner,
body.jk-scroll-hold .jk-shell-inner {
  opacity: 0 !important;
  pointer-events: none !important;
}
@media (prefers-reduced-motion: no-preference) {
  #jkShellInner,
  .jk-shell-inner {
    transition: opacity .16s ease-out;
  }
}
.jk-scroll-skeleton {
  display: none;
  position: fixed;
  z-index: 40;
  left: max(12px, calc(50% - 420px));
  right: 12px;
  top: calc(var(--jk-topbar-h, 56px) + 16px);
  max-width: 840px;
  margin: 0 auto;
  padding: 8px 4px;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(15, 98, 254, .05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15, 98, 254, .05) 1px, transparent 1px);
  background-size: 24px 24px, 24px 24px;
}
html.jk-scroll-hold .jk-scroll-skeleton,
body.jk-scroll-hold .jk-scroll-skeleton {
  display: block;
}
@media (min-width: 861px) {
  .jk-scroll-skeleton {
    left: calc(var(--jk-sidenav-w, 200px) + 28px);
    right: 28px;
    max-width: 1100px;
  }
}
.jk-sk-line {
  height: 14px;
  border-radius: 8px;
  background-image: linear-gradient(115deg, rgba(15, 98, 254, .05) 0%, rgba(166, 200, 255, .34) 46%, rgba(15, 98, 254, .05) 92%);
  background-size: 220% 100%;
  animation: jk-sk-shine 1.25s linear infinite;
  margin: 0 0 12px;
  width: 62%;
  border: 1px solid rgba(15, 98, 254, .10);
}
.jk-sk-line.jk-sk-wide { width: 88%; height: 18px; }
.jk-sk-line.jk-sk-mid { width: 48%; }
.jk-sk-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 0 0 14px;
}
@media (max-width: 640px) {
  .jk-sk-grid { grid-template-columns: 1fr; }
}
.jk-sk-card {
  height: 110px;
  border-radius: 12px;
  background-image: linear-gradient(115deg, rgba(15, 98, 254, .05) 0%, rgba(166, 200, 255, .34) 46%, rgba(15, 98, 254, .05) 92%);
  background-size: 220% 100%;
  animation: jk-sk-shine 1.25s linear infinite;
  border: 1px solid rgba(15, 98, 254, .10);
}
@keyframes jk-sk-shine {
  0% { background-position: 110% 0; }
  100% { background-position: -110% 0; }
}

/* List cards: reserve space, lazy decode, less layout jump */
.jk-mcard-cover {
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #eef1f6;
}
.jk-mcard-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  content-visibility: auto;
  contain-intrinsic-size: 320px 180px;
}
.jk-mcard {
  content-visibility: auto;
  contain-intrinsic-size: 1px 280px;
}


/* ========== 1.5.32 polish ========== */
/* Mobile: hide topbar avatar (login lives in bottom nav when logged in) */
@media (max-width: 860px) {
  .jk-topbar-user,
  .jk-topbar-user--desk,
  .jk-topbar-actions .jk-topbar-user { display: none !important; }
  .jk-topbar-actions:empty { display: none !important; }
}

/* 榜单 tab: hide site footer under list */
body.jk-feed-hot .jk-footer,
body.jk-feed-hot .jk-footer.spark-like,
body.jk-feed-hot .jk-footer-mount,
body.jk-feed-hot #jkFooterMountTop,
body.jk-feed-hot #jkFooterMountBottom {
  display: none !important;
}

/* Home compact preview stays; 榜单 panel shows expanded full board */
#jkFeedHot .jk-hot--all,
#jkFeedHot .jk-hot-grid--full {
  display: grid !important;
}
#jkFeedHot .jk-hot--home .jk-hot-item:nth-child(n+6) {
  display: list-item !important; /* override compact preview clamp if any leftover */
}
#jkFeedHot .jk-hot-wrap--expanded {
  padding: 0 0 24px;
}
#jkFeedHot .jk-hot-col-foot { display: none !important; } /* no footer block under list rows */

/* Admin-only post toolbar */
.jk-admin-bar {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-left: 8px;
}
.jk-admin-btn {
  display: inline-flex;
  align-items: center;
  height: 28px;
  padding: 0 10px;
  border-radius: 8px;
  border: 1px solid #dbe3ef;
  background: #fff;
  color: #1e293b !important;
  font-size: 0.78rem;
  font-weight: 600;
  text-decoration: none !important;
  cursor: pointer;
  line-height: 1;
}
.jk-admin-btn:hover { border-color: #93c5fd; color: #1d4ed8 !important; }
.jk-admin-btn--warn { color: #b45309 !important; border-color: #fcd34d; background: #fffbeb; }
.jk-admin-form { display: inline-flex; align-items: center; gap: 6px; margin: 0; }
.jk-admin-label {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 0.75rem; color: #64748b; font-weight: 600;
}
.jk-admin-label select {
  height: 28px; border-radius: 8px; border: 1px solid #dbe3ef;
  background: #fff; font-size: 0.75rem; max-width: 140px;
}
@media (max-width: 640px) {
  .jk-admin-bar { margin: 8px 0 0; width: 100%; }
  .log-meta-right { width: 100%; }
}


/* ========== 1.5.35: full rank expanded dense + no right brand dup ========== */
.jk-rank-page .jk-hot--all .jk-hot-scroll,
.jk-hot--all.jk-hot--dense .jk-hot-scroll,
.jk-hot-grid--expanded .jk-hot-scroll {
  max-height: none !important;
  overflow: visible !important;
}
.jk-rank-page .jk-hot-col--dense .jk-hot-col-head,
.jk-hot--dense .jk-hot-col-head {
  padding: 10px 12px 8px;
}
.jk-rank-page .jk-hot-col--dense .jk-hot-link,
.jk-hot--dense .jk-hot-link {
  padding: 5px 6px;
  gap: 8px;
}
.jk-rank-page .jk-hot-col--dense .jk-hot-name,
.jk-hot--dense .jk-hot-name {
  font-size: 0.82rem;
  line-height: 1.35;
  -webkit-line-clamp: 1;
  font-weight: 500;
}
.jk-rank-page .jk-hot-col--dense .jk-hot-rank,
.jk-hot--dense .jk-hot-rank {
  width: 18px;
  height: 18px;
  font-size: 0.68rem;
  margin-top: 1px;
}
.jk-rank-page .jk-hot-grid--full {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px 14px;
}
.jk-feed-mix-hot { display: none !important; }
@media (max-width: 860px) {
  #jkFeedRecommend .jk-feed-mix-hot,
  #jkFeedRecommend .jk-hot--home { display: none !important; }
  #jkRecMore {
    display: flex;
    justify-content: center;
    padding: 16px 12px 28px;
    min-height: 48px;
  }
  #jkRecMore[hidden] { display: none !important; }
  #jkRecMore .jk-recommend-more-btn {
    font-size: 0.85rem;
    color: #64748b;
    background: transparent;
    border: 0;
    padding: 8px 12px;
  }
}


/* ========== 1.5.36: full ranks responsive stack + desktop side-by-side ========== */
/* Desktop: side-by-side 3 cols; tablet 2; phone 1 full-width full text */
.jk-rank-page .jk-hot-grid--full,
.jk-hot--all .jk-hot-grid--full,
.jk-hot-grid--expanded,
#jkFeedHot .jk-hot-grid--full {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px 16px;
  width: 100%;
  min-width: 0;
}
#jkFeedHot .jk-hot--all {
  display: block !important; /* section wraps grid; do not force section itself to grid */
  width: 100%;
}

@media (max-width: 1100px) and (min-width: 861px) {
  .jk-rank-page .jk-hot-grid--full,
  .jk-hot--all .jk-hot-grid--full,
  .jk-hot-grid--expanded,
  #jkFeedHot .jk-hot-grid--full {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Phone / narrow: stack full text — never squash into 3 skinny cols */
@media (max-width: 860px) {
  .jk-rank-page .jk-hot-grid--full,
  .jk-hot--all .jk-hot-grid--full,
  .jk-hot-grid--full,
  .jk-hot-grid--expanded,
  #jkFeedHot .jk-hot-grid--full,
  .jk-rank-page .jk-hot-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  .jk-rank-page .jk-hot-col,
  .jk-hot--all .jk-hot-col,
  #jkFeedHot .jk-hot-col {
    min-width: 0;
    width: 100%;
  }
  .jk-rank-page .jk-hot-scroll,
  .jk-hot--all .jk-hot-scroll,
  .jk-hot-grid--expanded .jk-hot-scroll,
  #jkFeedHot .jk-hot-scroll {
    max-height: none !important;
    overflow: visible !important;
  }
  /* Full titles on mobile — no ellipsis / line-clamp squash */
  .jk-rank-page .jk-hot-name,
  .jk-rank-page .jk-hot-col--dense .jk-hot-name,
  .jk-hot--dense .jk-hot-name,
  .jk-hot--all .jk-hot-name,
  #jkFeedHot .jk-hot-name {
    display: block !important;
    -webkit-line-clamp: unset !important;
    -webkit-box-orient: unset !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: unset !important;
    font-size: 0.92rem !important;
    line-height: 1.45 !important;
    font-weight: 500;
  }
  .jk-rank-page .jk-hot-link,
  .jk-hot--dense .jk-hot-link,
  #jkFeedHot .jk-hot-link {
    align-items: flex-start;
    padding: 8px 10px !important;
    gap: 10px !important;
  }
  .jk-rank-page .jk-hot-col-head,
  .jk-hot--dense .jk-hot-col-head {
    padding: 12px 14px 10px !important;
  }
  .jk-rank-page .jk-rank-filters,
  .jk-rank-filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
  }
}

/* Desktop keep dense single-line titles for compact cards */
@media (min-width: 861px) {
  .jk-rank-page .jk-hot-col--dense .jk-hot-name,
  .jk-hot--dense .jk-hot-name {
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
}

/* Homepage 更多 link (same look as old toggle) */
.jk-hot-more-link {
  cursor: pointer;
}
.jk-hot-more-link:hover { color: #1d4ed8; }

/* PJAX shell switch polish */
.jk-shell-inner {
  transition: opacity .12s ease;
}
body.jk-pjax-loading .jk-shell-inner {
  opacity: 0.72;
  pointer-events: none;
}


/* ========== 1.5.36b: recommend Douyin swipe + hide footer ========== */
body.jk-feed-recommend .jk-footer,
body.jk-feed-recommend .jk-footer.spark-like,
body.jk-feed-recommend .jk-footer-mount,
body.jk-feed-recommend #jkFooterMountTop,
body.jk-feed-recommend #jkFooterMountBottom {
  display: none !important;
}

.jk-recommend-swipe {
  touch-action: pan-y;
  will-change: transform;
  transition: transform .18s ease, opacity .18s ease;
}
.jk-recommend-swipe.is-swipe-anim {
  animation: jkRecSwap .28s ease;
}
@keyframes jkRecSwap {
  0% { opacity: .55; transform: scale(.985); }
  100% { opacity: 1; transform: scale(1); }
}
.jk-recommend-swipe.is-swipe-left::after,
.jk-recommend-swipe.is-swipe-right::after {
  content: '换一批';
  position: sticky;
  top: 40%;
  display: block;
  width: max-content;
  margin: 0 auto;
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(29, 78, 216, 0.92);
  color: #fff;
  font-size: 0.78rem;
  font-weight: 700;
  pointer-events: none;
  z-index: 3;
  box-shadow: 0 4px 14px rgba(29, 78, 216, 0.35);
}
.jk-rec-swipe-hint {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 0 0 10px;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.78);
  color: #fff;
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  transition: opacity .35s ease, transform .35s ease;
}
.jk-rec-swipe-hint.is-fade {
  opacity: 0;
  transform: translateY(-6px);
}
.jk-rec-swipe-hint-ico {
  font-size: 1rem;
  line-height: 1;
  opacity: 0.95;
}
@media (min-width: 861px) {
  .jk-rec-swipe-hint { display: none; }
  .jk-recommend-swipe.is-swipe-left::after,
  .jk-recommend-swipe.is-swipe-right::after { display: none; }
}


/* ========== 1.5.37: hide recommend head (标题/全部/换一批) ========== */
.jk-recommend-head,
.jk-recommend-title,
.jk-recommend-refresh,
.jk-recommend-tabs {
  display: none !important;
}
.jk-recommend {
  padding-top: 4px;
}


/* ========== 1.5.39: recommend tip one ultra-short line ========== */
.jk-recommend {
  padding-top: 0 !important;
  margin-top: 0 !important;
}
.jk-recommend-hint {
  display: block;
  margin: 0 !important;
  padding: 0 !important;
  max-height: 0.95em;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 0.58rem !important;
  line-height: 0.95 !important;
  color: #94a3b8;
  font-weight: 500;
  letter-spacing: 0;
}
body.jk-feed-recommend .jk-feed-mix,
body.jk-feed-recommend #jkFeedRecommend,
body.jk-feed-recommend .jk-recommend {
  padding-top: 0 !important;
  margin-top: 0 !important;
}
.jk-recommend-head { display: none !important; height: 0 !important; margin: 0 !important; padding: 0 !important; }

/* Deep category: grandchild nav under mid-level child */
.jk-nav-grand {
  margin: 2px 0 6px 12px !important;
  padding: 0 0 0 8px !important;
  border-left: 2px solid #e8edf5;
  list-style: none;
}
.jk-nav-link--grand {
  min-height: 30px !important;
  padding-left: 8px !important;
  font-size: 0.82rem;
}
.jk-nav-mid > .jk-nav-hub-row--mid {
  display: flex;
  align-items: center;
}
.jk-hub-strip[data-depth="own"] .jk-hub-tag {
  /* same look; marker for debugging */
}


/* ========== 1.5.40: Bilibili-style floating sub-category bar ========== */
.jk-bili-sticky-stub {
  height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  pointer-events: none;
}
.jk-bili-sub {
  position: relative;
  z-index: 35;
  margin: 0 0 10px;
  padding: 0;
}
.jk-bili-sub[hidden] { display: none !important; }
.jk-bili-sub-bar {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 0 7px;
  background: #fff;
  border-bottom: 1px solid #e7e9ec;
}
.jk-bili-sub.is-floating {
  position: sticky;
  top: var(--jk-topbar-h, 52px);
  z-index: 36;
  background: rgba(255, 255, 255, .86);
  -webkit-backdrop-filter: blur(12px) saturate(1.4);
  backdrop-filter: blur(12px) saturate(1.4);
  box-shadow: 0 4px 14px rgba(0, 0, 0, .07);
}
.jk-bili-sub.is-floating .jk-bili-sub-bar {
  padding-left: 8px;
  padding-right: 8px;
  border-radius: 0 0 10px 10px;
}

/* 副层：母导航子分类（兄弟快速指向），比主层 chip 更小更轻 */
.jk-bili-sub-hub {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 4px 2px 5px;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  border-bottom: 1px solid var(--jk-line);
}
.jk-bili-sub-hub::-webkit-scrollbar { display: none; }
.jk-bili-chip--hub,
a.jk-bili-chip--hub {
  height: 20px !important;
  padding: 0 8px !important;
  font-size: 11px !important;
  background: transparent !important;
  border: 1px solid var(--jk-line) !important;
  color: var(--jk-muted) !important;
}
.jk-bili-chip--hub:hover {
  background: #f1f2f3 !important;
  color: var(--jk-text) !important;
}
.jk-bili-chip--hub.is-active {
  background: var(--jk-ibm-blue) !important;
  border-color: var(--jk-ibm-blue) !important;
  color: #fff !important;
}
.jk-bili-sub-track {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  gap: 6px;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding: 1px 2px;
  min-width: 0;
}
.jk-bili-sub-track::-webkit-scrollbar { display: none; }

/* 二级分类 chip：小平铺 */
.jk-bili-chip,
a.jk-bili-chip {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  height: 24px !important;
  padding: 0 9px !important;
  margin: 0 !important;
  border-radius: 5px !important;
  border: 0 !important;
  background: #f1f2f3 !important;
  color: #18191c !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  white-space: nowrap;
  text-decoration: none !important;
  transition: background .12s, color .12s;
}
.jk-bili-chip:hover,
a.jk-bili-chip:hover {
  background: #e3e5e7 !important;
  color: #18191c !important;
}
.jk-bili-chip.is-active,
a.jk-bili-chip.is-active {
  background: var(--jk-ibm-blue) !important;
  color: #fff !important;
  font-weight: 600 !important;
}

.jk-bili-more {
  flex: 0 0 auto;
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 6px;
  background: #f1f2f3;
  color: #61666d;
  font-size: 12px;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.jk-bili-more:hover { background: #e3e5e7; color: #18191c; }
.jk-bili-sub.is-drop-open .jk-bili-more {
  background: #e3e5e7;
  color: var(--jk-ibm-blue);
}

/* Downward floating dropdown panel */
.jk-bili-drop {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% - 2px);
  z-index: 40;
  padding: 10px 10px 12px;
  background: #fff;
  border: 1px solid #e3e5e7;
  border-radius: 0 0 12px 12px;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.12);
}
.jk-bili-drop[hidden] { display: none !important; }
.jk-bili-drop-inner {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.jk-bili-chip--drop {
  height: 26px !important;
}

/* legacy class aliases so old CSS/JS selectors don't break */
.jk-hub-strip.jk-bili-sub,
#jkHubStrip.jk-bili-sub { display: block; }
.jk-hub-tag { /* superseded by .jk-bili-chip */ }

@media (max-width: 860px) {
  .jk-bili-sub { margin-bottom: 8px; }
  .jk-bili-sub-bar { padding: 5px 0 6px; gap: 4px; }
  .jk-bili-sub-hub { display: none !important; }
  .jk-bili-sub.is-floating { top: var(--jk-topbar-h, 48px); }
  .jk-bili-chip,
  a.jk-bili-chip {
    height: 22px !important;
    padding: 0 8px !important;
    font-size: 11px !important;
    border-radius: 5px !important;
  }
  .jk-bili-more { width: 24px; height: 24px; }
  .jk-bili-drop { padding: 8px; }
  .jk-bili-drop-inner { gap: 6px; }
}

/* Override 1.5.30 "bold plain text" hub styles when bili is present */
.jk-bili-sub .jk-hub-tag,
.jk-bili-sub a.jk-hub-tag {
  display: inline-flex !important;
  height: 24px !important;
  padding: 0 9px !important;
  border-radius: 5px !important;
  background: #f1f2f3 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
}


/* 1.5.42: drop groups — 本类 / 同级 */
.jk-bili-drop-group {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  width: 100%;
  margin-bottom: 8px;
}
.jk-bili-drop-group:last-child { margin-bottom: 0; }
.jk-bili-drop-label {
  flex: 0 0 100%;
  font-size: 0.68rem;
  color: #9499a0;
  font-weight: 600;
  letter-spacing: 0.04em;
  margin: 0 0 2px;
}
.jk-bili-chip--sib {
  background: #f6f7f8 !important;
}


/* ========== 1.5.45 desktop search truly centered in shell topbar ========== */
@media (min-width: 861px) {
  .jk-shell > .jk-topbar,
  header.jk-topbar {
    position: sticky;
    /* containing block for absolute search */
  }
  .jk-topbar-search {
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    right: auto !important;
    bottom: auto !important;
    transform: translate(-50%, -50%) !important;
    width: min(520px, calc(100% - 320px)) !important;
    max-width: 520px !important;
    margin: 0 !important;
    flex: 0 0 auto !important;
    order: 0 !important;
    z-index: 1001 !important;
  }
  .jk-topbar-search .jk-search-ico {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
  }
  .jk-topbar-nav {
    position: relative;
    z-index: 2;
  }
  .jk-topbar-actions {
    position: relative;
    z-index: 2;
    margin-left: auto;
  }
}


/* ========== 1.5.47 mobile: compact search beside Logo; kill overscroll grey gap ========== */
@media (max-width: 860px) {
  html, body.jk-body.jk-app {
    background: #fff !important;
    overscroll-behavior-y: none;
    -webkit-overflow-scrolling: touch;
  }
  .jk-shell {
    background: #fff !important; /* avoid shell灰底在橡皮筋/底栏缝露出 */
    min-height: 100dvh;
  }
  .jk-shell-inner {
    background: transparent;
  }

  /* Logo | 缩小搜索贴旁 | 头像? | 更多 — 搜索不得 flex 撑开挡 Logo */
  .jk-shell > .jk-topbar,
  header.jk-topbar {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 8px !important;
    height: var(--jk-topbar-h, 52px) !important;
    min-height: var(--jk-topbar-h, 52px) !important;
    max-height: var(--jk-topbar-h, 52px) !important;
    padding: 0 10px 0 8px !important;
    overflow: visible !important;
    background: #fff !important;
  }
  .jk-topbar-brand {
    order: 1 !important;
    display: block !important;
    flex: 0 1 auto !important;
    min-width: 0 !important;
    max-width: min(42vw, 148px) !important;
    margin: 0 !important;
    position: relative;
    z-index: 3;
  }
  .jk-topbar-brand img {
    height: 28px !important;
    width: auto !important;
    max-width: 100% !important;
    object-fit: contain !important;
  }
  .jk-topbar-nav { display: none !important; }
  .jk-topbar-search {
    order: 2 !important;
    position: relative !important;
    left: auto !important;
    top: auto !important;
    right: auto !important;
    transform: none !important;
    flex: 1 1 auto !important;          /* 撑满 Logo 与右侧控件之间的空间 */
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 0 0 2px !important;
    z-index: 2;
  }
  .jk-topbar-search .jk-search-ico {
    left: 9px !important;
  }
  .jk-topbar-search-input {
    width: 100% !important;
    height: 32px !important;
    font-size: 0.8rem !important;
    padding: 0 8px 0 30px !important;
    border-radius: 9px !important;
    background: #f3f4f6 !important;
    border: 1px solid #e5e7eb !important;
    box-shadow: none !important;
  }
  .jk-topbar-search-input::placeholder {
    font-size: 0.75rem !important;
    color: #9ca3af;
  }
  .jk-topbar-actions {
    order: 3 !important;
    display: flex !important;
    flex: 0 0 auto !important;
    margin-left: auto !important; /* push 更多 to the right edge */
    gap: 4px !important;
  }
  .jk-nav-toggle {
    order: 4 !important;
    display: inline-flex !important;
    flex: 0 0 auto !important;
    margin-left: 0 !important;
    height: 32px !important;
  }
  /* when actions hidden (visitor), still park 更多 on the right */
  .jk-topbar-actions:empty,
  .jk-topbar-actions:not(:has(*)) {
    display: none !important;
  }
  .jk-nav-toggle {
    margin-left: auto !important;
  }
  .jk-topbar-actions:not(:empty) ~ .jk-nav-toggle,
  .jk-topbar-actions:has(*) ~ .jk-nav-toggle {
    margin-left: 0 !important;
  }
}

@media (max-width: 420px) {
  .jk-topbar-brand { max-width: min(38vw, 120px) !important; }
}

/* 底栏贴底 + 实心延伸进 home indicator，消灭底栏下灰缝 */
@media (max-width: 767px) {
  html, body.jk-body.jk-app {
    overscroll-behavior-y: none;
  }
  body.jk-body.jk-app {
    padding-bottom: calc(56px + env(safe-area-inset-bottom, 0px)) !important;
  }
  .jk-mbar {
    display: block !important;
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 1100 !important;
    background: #fff !important; /*  непро透明，避免透出 shell 灰 */
    border-top: 1px solid #e9edf2;
    box-shadow: 0 -4px 18px rgba(15, 23, 42, 0.06);
    padding-bottom: env(safe-area-inset-bottom, 0px) !important;
    /* 额外向下延伸一块实心，盖住 overscroll / 系统条缝 */
    padding-bottom: max(env(safe-area-inset-bottom, 0px), 0px) !important;
  }
  .jk-mbar::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    height: 80px;
    background: #fff;
    pointer-events: none;
  }
  .jk-mbar-list {
    height: 56px;
    background: #fff;
  }
  /* PJAX/骨架：手机勿用灰底闪 */
  html.jk-scroll-hold,
  html.jk-scroll-hold body,
  body.jk-scroll-hold {
    background: #fff !important;
  }
  .jk-scroll-skeleton {
    background: transparent;
  }
}


/* ========== 1.5.48 深色 / 打印 / 动效 ========== */
@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --jk-blue: var(--jk-ibm-blue-30);
    --jk-blue-2: #78a9ff;
    --jk-bg: #0f1115;
    --jk-card: #171a21;
    --jk-text: #e5e7eb;
    --jk-muted: #9ca3af;
    --jk-line: rgba(255, 255, 255, .09);
    --jk-radius: 16px;
    --jk-shadow: 0 1px 2px rgba(0, 0, 0, .5), 0 8px 24px rgba(0, 0, 0, .35);
    --jk-shadow-hover: 0 4px 8px rgba(0, 0, 0, .5), 0 16px 40px rgba(0, 0, 0, .45);
    --jk-side-bg: #14171d;
    --jk-shell-bg: #0f1115;
    --jk-side-w: 220px;
  }
  html,
  body.jk-body.jk-app {
    background: var(--jk-shell-bg) !important;
    color: var(--jk-text);
  }
  .jk-shell,
  .jk-shell-inner {
    background: transparent !important;
  }
  .jk-mcard,
  .jk-article,
  .jk-hot-card,
  .jk-recommend-card,
  .jk-feat-card,
  .jk-panel,
  .jk-card {
    background: var(--jk-card) !important;
    color: var(--jk-text);
    border-color: var(--jk-line) !important;
  }
  .jk-topbar,
  header.jk-topbar {
    background: var(--jk-card) !important;
    border-color: var(--jk-line) !important;
  }
  .jk-topbar-search-input {
    background: #1e222b !important;
    border-color: rgba(255, 255, 255, .12) !important;
    color: var(--jk-text);
  }
  .jk-topbar-search-input:focus { background: #22262f !important; }
  .jk-sidenav {
    background: var(--jk-side-bg) !important;
    border-color: var(--jk-line) !important;
  }
  .jk-mbar,
  .jk-mbar-list {
    background: var(--jk-card) !important;
    border-color: var(--jk-line) !important;
  }
  .jk-mbar::after { background: var(--jk-card) !important; }
  html.jk-scroll-hold,
  html.jk-scroll-hold body,
  body.jk-scroll-hold {
    background: var(--jk-shell-bg) !important;
  }
  .jk-sk-line,
  .jk-sk-card {
    background-image: linear-gradient(115deg, rgba(15, 98, 254, .12) 0%, rgba(166, 200, 255, .24) 46%, rgba(15, 98, 254, .12) 92%) !important;
    border-color: rgba(166, 200, 255, .18) !important;
  }
  .jk-scroll-skeleton {
    background-image:
      linear-gradient(rgba(166, 200, 255, .07) 1px, transparent 1px),
      linear-gradient(90deg, rgba(166, 200, 255, .07) 1px, transparent 1px) !important;
    background-size: 24px 24px, 24px 24px !important;
  }
  .jk-mcard-cover,
  .jk-mcard-ph {
    background: #22262f;
  }
  img,
  .jk-mcard-cover img { border: 0; }

  .jk-bili-chip,
  a.jk-bili-chip,
  .jk-bili-sub .jk-hub-tag {
    background: #22262f !important;
    color: var(--jk-text) !important;
  }
  .jk-bili-chip:hover {
    background: #2a2f3a !important;
  }
  .jk-bili-sub-bar {
    background: var(--jk-card) !important;
    border-color: var(--jk-line) !important;
  }
  .jk-bili-sub.is-floating .jk-bili-sub-bar {
    background: rgba(23, 26, 33, .84) !important;
  }
  .jk-nav-count {
    background: #22262f;
    color: var(--jk-muted);
  }
  .jk-nav-chevron:hover,
  .jk-nav-chevron:focus-visible {
    background: rgba(255, 255, 255, .08);
  }
}

@media print {
  html, body {
    background: #fff !important;
    color: #000 !important;
  }
  .jk-sidenav,
  .jk-sidenav-mask,
  .jk-topbar,
  .jk-mbar,
  .side-toolbar,
  .jk-feed-subnav,
  .jk-loadmore,
  .jk-hot,
  .jk-recommend,
  .jk-bento-hero,
  .jk-store-hero,
  .jk-footer,
  .jk-toc,
  .jk-rail,
  .jk-ad,
  .jk-pagination,
  .jk-carousel-btn,
  .jk-carousel-dots {
    display: none !important;
  }
  .jk-shell,
  .jk-shell-inner {
    display: block !important;
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  .jk-article,
  .jk-mcard {
    box-shadow: none !important;
    border: 0 !important;
    background: #fff !important;
  }
  a {
    color: #000 !important;
    text-decoration: underline;
  }
  .jk-article-title {
    font-size: 18pt !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *,
  *::before,
  *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}


/* ========== 1.5.49 切换过渡 / IBM 蓝 ========== */
@media (prefers-reduced-motion: no-preference) {
  .jk-feed-panel,
  .jk-hot-col,
  .jk-recommend-grid {
    transition: opacity .22s ease, filter .22s ease;
  }
  .jk-feed-panel.is-fading,
  .jk-hot-col.is-fading,
  .jk-recommend-grid.is-fading {
    opacity: 0;
    filter: blur(10px);
  }
}


/* ========== 1.5.49b strip 切换动画 ========== */
@media (prefers-reduced-motion: no-preference) {
  .jk-bili-sub-track.is-filled {
    animation: jk-strip-in .3s ease;
  }
  .jk-bili-drop {
    transform-origin: top center;
  }
  .jk-bili-drop:not([hidden]) {
    animation: jk-strip-in .2s ease;
  }
}
@keyframes jk-strip-in {
  0% { opacity: 0; transform: translateY(-4px); filter: blur(4px); }
  100% { opacity: 1; transform: none; filter: none; }
}