/* ============================================================
 * theme-monokai — 博客 MONOKAI 深色皮肤
 * ------------------------------------------------------------
 * 底色调性：Monokai 经典深色（代码区 #272822 / 语法色经典 Monokai）
 * 框架配色：at-web-theme-kit 深色规范
 *   - 页面底 #0d0f13 / 卡片 #1e2028 / 侧栏 #16181e / 顶栏 #1a1c23
 *   - 边框 #2a2d38 / 文字 #e5e7eb · #9ca3af · #6b7280
 *   - 主色 Indigo 深色档 #6d70f6（hover #7c7ffa / active #5b5ef0）
 *   - 语义色深色档：#3bb97e / #ff8c3a / #f26a6f / #1fa3ff
 * 保留元素（不改配置）：
 *   - profile：ScofieldYu / 高筑墙｜广积粮｜缓称王
 *   - 头像 hover 旋转动画（img-rotate，style.css 自带，此处不覆盖）
 *   - 网易云音乐播放器（social.ejs iframe）
 *   - GitHub 社交链接
 *   - Mac 窗口风格代码容器（红黄绿圆点 + 语法高亮，此文件内重绘为深色）
 * 所有规则收敛在 body.theme-monokai 作用域内，不影响其他皮肤。
 * ============================================================ */

body.theme-monokai {
  /* 主题变量（仅本皮肤内使用） */
  --mk-page: #0d0f13;
  --mk-card: #1e2028;
  --mk-card-alt: #262a34;
  --mk-header: #1a1c23;
  --mk-sidebar: #16181e;
  --mk-border: #2a2d38;
  --mk-border-light: #202329;
  --mk-text: #e5e7eb;
  --mk-text-2: #9ca3af;
  --mk-text-3: #6b7280;
  --mk-accent: #6d70f6;
  --mk-accent-hover: #7c7ffa;
  --mk-accent-active: #5b5ef0;
  --mk-accent-bg: rgba(109, 112, 246, 0.15);
  --mk-success: #3bb97e;
  --mk-warning: #ff8c3a;
  --mk-error: #f26a6f;
  --mk-info: #1fa3ff;

  background-color: var(--mk-page);
  color: var(--mk-text);
  font-size: 14px;
}

/* ── 全局：选中色 / 滚动条 ─────────────────────────── */
body.theme-monokai ::selection {
  background: rgba(109, 112, 246, 0.35);
  color: #ffffff;
}
body.theme-monokai {
  scrollbar-color: #333745 #14161c;
}
body.theme-monokai ::-webkit-scrollbar {
  width: 6px;
  height: 4px;
  background-color: #14161c;
}
body.theme-monokai ::-webkit-scrollbar-thumb {
  background: #333745;
  border-radius: 3px;
}
body.theme-monokai ::-webkit-scrollbar-thumb:hover {
  background: #4b5563;
}
body.theme-monokai ::-webkit-scrollbar-track {
  background-color: #14161c;
  box-shadow: none;
}
body.theme-monokai ::-webkit-scrollbar-track-piece {
  background-color: #14161c;
}

/* ── 顶栏：kit 深色顶部栏（毛玻璃 + 吸顶）──────────── */
body.theme-monokai .header {
  background-color: var(--mk-header);
  background-color: rgba(22, 24, 31, 0.85);
  -webkit-backdrop-filter: saturate(180%) blur(12px);
  backdrop-filter: saturate(180%) blur(12px);
  color: var(--mk-text);
  border-bottom: 1px solid var(--mk-border);
  box-shadow: none;
}
body.theme-monokai .header a {
  color: #d4d4d8;
}
body.theme-monokai .navbar-toggle .icon-bar {
  background-color: #9ca3af;
}
body.theme-monokai .navbar-header .topbar-profile {
  text-align: left;
}

/* 顶栏 profile：头像 + 名字/座右铭（保留 ScofieldYu / 座右铭） */
body.theme-monokai .topbar-avatar {
  display: block;
  line-height: 1;
}
body.theme-monokai .topbar-avatar img {
  border: 2px solid var(--mk-border);
  box-shadow: 0 0 0 3px rgba(109, 112, 246, 0.15);
}
body.theme-monokai .topbar-meta {
  line-height: 1.25;
  min-width: 0;
}
body.theme-monokai #name {
  margin: 0;
  color: var(--mk-text);
  font-weight: 600;
}
body.theme-monokai #title.topbar-motto {
  display: block;
  margin: 1px 0 0;
  color: var(--mk-text-3);
  font-size: 11px;
  font-weight: 400;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── 顶栏搜索框 ─────────────────────────────────────── */
body.theme-monokai .search .sidebar-form {
  background: #262a34;
  border: 1px solid #333745;
  border-radius: 4px;
}
body.theme-monokai .search .sidebar-form input {
  color: var(--mk-text);
  border: 0;
  background: transparent;
  font-size: 13px;
}
body.theme-monokai .search .sidebar-form input::-webkit-input-placeholder,
body.theme-monokai .search .sidebar-form input::-moz-placeholder,
body.theme-monokai .search .sidebar-form input:-ms-input-placeholder {
  color: var(--mk-text-3);
}
body.theme-monokai .search .sidebar-form:focus-within {
  border-color: var(--mk-accent);
  box-shadow: 0 0 0 3px rgba(109, 112, 246, 0.18);
}
body.theme-monokai .search input[type="text"] + .input-group-btn .btn {
  color: var(--mk-text-3);
}
body.theme-monokai .search input[type="text"]:focus,
body.theme-monokai .search input[type="text"]:focus + .input-group-btn .btn {
  background-color: #262a34;
  color: var(--mk-accent-hover);
}

/* ── 内容区：kit 深色卡片 #1e2028，无阴影 ───────────── */
body.theme-monokai .content {
  background-color: var(--mk-card);
  border: 1px solid var(--mk-border);
  border-radius: 4px;
  box-shadow: none;
}

/* ── 文章列表 ───────────────────────────────────────── */
body.theme-monokai .article-list article {
  border-bottom: 1px solid var(--mk-border-light);
}
body.theme-monokai .article-title {
  color: var(--mk-text);
  transition: color 0.15s ease;
}
body.theme-monokai .article-title:hover {
  color: var(--mk-accent-hover);
}
body.theme-monokai .collection-item {
  color: #d4d4d8;
  font-size: 14px;
  padding: 8px 4px;
  border-radius: 4px;
  transition: background-color 0.12s ease, color 0.12s ease;
}
body.theme-monokai .collection-item:hover {
  color: var(--mk-accent-hover);
  background: rgba(255, 255, 255, 0.05);
}
body.theme-monokai .collection-item time {
  color: var(--mk-text-3);
  font-size: 13px;
}

/* ── 元信息 / 标签（12% 淡底，kit 深色档）──────────── */
body.theme-monokai .article-meta {
  color: var(--mk-text-3);
}
body.theme-monokai .article-meta a {
  color: var(--mk-text-2);
  transition: color 0.15s ease;
}
body.theme-monokai .article-meta a:hover {
  color: var(--mk-accent-hover);
}
body.theme-monokai .label {
  font-size: 12px;
  font-weight: 500;
  border-radius: 4px;
  padding: 2px 8px;
}
body.theme-monokai .label-default,
body.theme-monokai .label-default[href]:hover,
body.theme-monokai .label-default[href]:focus {
  background-color: rgba(109, 112, 246, 0.15);
  color: #8b8ff8;
  border: 1px solid rgba(109, 112, 246, 0.35);
}
body.theme-monokai .article-more-link a {
  color: var(--mk-accent-hover);
}
body.theme-monokai .article-more-link a:hover {
  color: #9a9dff;
}

/* ── 正文排版 ───────────────────────────────────────── */
body.theme-monokai .article-entry {
  color: var(--mk-text);
  line-height: 1.75;
}
body.theme-monokai .article-entry a {
  color: var(--mk-accent-hover);
  text-decoration: none;
  border-bottom: 1px solid rgba(109, 112, 246, 0.35);
  transition: color 0.15s ease, border-color 0.15s ease;
}
body.theme-monokai .article-entry a:hover {
  color: #9a9dff;
  border-bottom-color: #9a9dff;
}
body.theme-monokai .article-entry strong {
  color: #ffffff;
}
body.theme-monokai .article-entry h1,
body.theme-monokai .article-entry h2,
body.theme-monokai .article-entry h3,
body.theme-monokai .article-entry h4 {
  color: #ffffff;
  font-weight: 600;
}
body.theme-monokai .article-entry h2 {
  padding-bottom: 6px;
  border-bottom: 1px solid var(--mk-border);
}
body.theme-monokai .article-entry blockquote {
  border-left: 2px solid rgba(109, 112, 246, 0.55);
  background: rgba(109, 112, 246, 0.08);
  color: var(--mk-text-2);
  border-radius: 0 4px 4px 0;
}
body.theme-monokai .article-entry blockquote p {
  margin: 0;
}
body.theme-monokai .article-entry img {
  border-radius: 4px;
}
body.theme-monokai .article-entry hr {
  border-top: 1px solid var(--mk-border);
}
body.theme-monokai .article-entry table {
  border: 1px solid var(--mk-border);
  border-radius: 4px;
  font-size: 13px;
}
body.theme-monokai .article-entry table th {
  background: var(--mk-card-alt);
  color: var(--mk-text);
  font-weight: 500;
}
body.theme-monokai .article-entry table th,
body.theme-monokai .article-entry table td {
  border: 1px solid var(--mk-border);
  padding: 8px 12px;
}
/* 行内代码 */
body.theme-monokai .article-entry code {
  background: rgba(109, 112, 246, 0.12);
  color: #a5b4fc;
  border: 1px solid rgba(109, 112, 246, 0.2);
  border-radius: 3px;
  font-size: 13px;
  padding: 1px 5px;
}

/* ── Mac 窗口代码容器（保留）+ Monokai 语法色 ───────── */
body.theme-monokai .highlight,
body.theme-monokai pre {
  background: #272822;
  color: #f8f8f2;
  margin: 10px 0;
  padding: 15px 10px;
  overflow: auto;
  font-size: 13px;
  line-height: 1.55;
}
body.theme-monokai .highlight {
  position: relative;
  padding: 32px 10px 0;
  border-radius: 4px;
  border: 1px solid var(--mk-border);
}
/* 顶部 Mac 标题栏（深色）+ 保留红黄绿圆点 */
body.theme-monokai .highlight:before {
  display: block;
  content: " ";
  height: 32px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  background-color: #1e1f1a;
  padding: 0 10px;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
body.theme-monokai .highlight:after {
  content: " ";
  position: absolute;
  border-radius: 50%;
  background: #fc625d;
  width: 10px;
  height: 10px;
  top: 0;
  left: 15px;
  margin-top: 11px;
  -webkit-box-shadow: 20px 0 #fdbc40, 40px 0 #35cd4b;
  box-shadow: 20px 0 #fdbc40, 40px 0 #35cd4b;
}
body.theme-monokai .highlight .gutter pre {
  color: #90918b;
  background: transparent;
  border-right: 1px solid rgba(255, 255, 255, 0.06);
}
body.theme-monokai .highlight .code pre {
  background: transparent;
}

/* ── Monokai 经典语法色（highlight.js token 类）─────── */
body.theme-monokai .highlight .hll {
  background-color: #49483e;
}
body.theme-monokai .highlight .c,
body.theme-monokai .highlight .c1,
body.theme-monokai .highlight .cm,
body.theme-monokai .highlight .cs,
body.theme-monokai .highlight .cp,
body.theme-monokai .highlight .c2,
body.theme-monokai .highlight .ch,
body.theme-monokai .highlight .cpf,
body.theme-monokai .highlight .sd {
  color: #75715e;
  font-style: italic;
}
body.theme-monokai .highlight .err {
  color: #f8f8f2;
  background-color: #f92672;
}
body.theme-monokai .highlight .k,
body.theme-monokai .highlight .kc,
body.theme-monokai .highlight .kd,
body.theme-monokai .highlight .kn,
body.theme-monokai .highlight .kp,
body.theme-monokai .highlight .kr,
body.theme-monokai .highlight .kt,
body.theme-monokai .highlight .ow {
  color: #f92672;
}
body.theme-monokai .highlight .na,
body.theme-monokai .highlight .nf,
body.theme-monokai .highlight .fm,
body.theme-monokai .highlight .nc,
body.theme-monokai .highlight .nn,
body.theme-monokai .highlight .no,
body.theme-monokai .highlight .ne,
body.theme-monokai .highlight .ni,
body.theme-monokai .highlight .nt {
  color: #a6e22e;
}
body.theme-monokai .highlight .nb,
body.theme-monokai .highlight .bp {
  color: #66d9ef;
}
body.theme-monokai .highlight .nv,
body.theme-monokai .highlight .vc,
body.theme-monokai .highlight .vg,
body.theme-monokai .highlight .vi,
body.theme-monokai .highlight .vm,
body.theme-monokai .highlight .nl {
  color: #f8f8f2;
}
body.theme-monokai .highlight .s,
body.theme-monokai .highlight .sa,
body.theme-monokai .highlight .sb,
body.theme-monokai .highlight .sc,
body.theme-monokai .highlight .dl,
body.theme-monokai .highlight .s2,
body.theme-monokai .highlight .se,
body.theme-monokai .highlight .sh,
body.theme-monokai .highlight .si,
body.theme-monokai .highlight .sx,
body.theme-monokai .highlight .sr,
body.theme-monokai .highlight .s1,
body.theme-monokai .highlight .ss {
  color: #e6db74;
}
body.theme-monokai .highlight .m,
body.theme-monokai .highlight .mb,
body.theme-monokai .highlight .mf,
body.theme-monokai .highlight .mh,
body.theme-monokai .highlight .mi,
body.theme-monokai .highlight .mo,
body.theme-monokai .highlight .il {
  color: #ae81ff;
}
body.theme-monokai .highlight .o {
  color: #f92672;
}
body.theme-monokai .highlight .p {
  color: #f8f8f2;
}
body.theme-monokai .highlight .gd {
  color: #f92672;
}
body.theme-monokai .highlight .gi {
  color: #a6e22e;
}
body.theme-monokai .highlight .gh {
  color: #66d9ef;
  font-weight: bold;
}
body.theme-monokai .highlight .gp,
body.theme-monokai .highlight .gu,
body.theme-monokai .highlight .ld {
  color: #75715e;
}
body.theme-monokai .highlight .l,
body.theme-monokai .highlight .x,
body.theme-monokai .highlight .w,
body.theme-monokai .highlight .z,
body.theme-monokai .highlight .ge,
body.theme-monokai .highlight .gr {
  color: #f8f8f2;
}
body.theme-monokai .highlight .ge {
  font-style: italic;
}
body.theme-monokai .highlight .gr {
  font-weight: bold;
}

/* ── 目录（TOC）────────────────────────────────────── */
body.theme-monokai .toc-title {
  color: var(--mk-text);
  font-weight: 600;
}
body.theme-monokai .toc a {
  color: var(--mk-text-2);
  transition: color 0.15s ease;
}
body.theme-monokai .toc a:hover,
body.theme-monokai .toc .active a {
  color: var(--mk-accent-hover);
}

/* ── 侧栏：kit 深色侧栏 #16181e ────────────────────── */
body.theme-monokai .sidebar {
  background-color: var(--mk-sidebar);
  border-left: 1px solid var(--mk-border-light);
}
body.theme-monokai .sidebar h3,
body.theme-monokai .sidebar .widget-title {
  color: var(--mk-text);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.02em;
}
body.theme-monokai .sidebar a {
  color: var(--mk-text-2);
  font-size: 13px;
  transition: color 0.15s ease, background-color 0.12s ease;
}
body.theme-monokai .sidebar a:hover {
  color: var(--mk-accent-hover);
}
body.theme-monokai .sidebar .tagcloud a {
  display: inline-block;
  margin: 0 6px 6px 0;
  padding: 2px 8px;
  background: rgba(109, 112, 246, 0.12);
  border: 1px solid rgba(109, 112, 246, 0.3);
  border-radius: 4px;
  color: #8b8ff8;
  font-size: 12px;
}
body.theme-monokai .sidebar .tagcloud a:hover {
  background: rgba(109, 112, 246, 0.22);
  color: #a5b4fc;
}
body.theme-monokai .sidebar .archive-list {
  font-size: 13px;
}
body.theme-monokai .sidebar .archive-list a {
  color: var(--mk-text-2);
}
body.theme-monokai .sidebar .archive-list time {
  color: var(--mk-text-3);
  font-size: 12px;
}
/* 侧栏 about 页技能/项目/个人链接区 */
body.theme-monokai .sidebar .about,
body.theme-monokai .sidebar .profile .skill,
body.theme-monokai .sidebar .profile .project,
body.theme-monokai .sidebar .profile .links {
  color: var(--mk-text-2);
  font-size: 13px;
}
body.theme-monokai .sidebar .profile .skill li,
body.theme-monokai .sidebar .profile .project li,
body.theme-monokai .sidebar .profile .links li {
  color: var(--mk-text-2);
  border-bottom: 1px solid var(--mk-border-light);
}
body.theme-monokai .sidebar .profile .skill .rating {
  color: var(--mk-accent-hover);
}
body.theme-monokai .sidebar .profile .label,
body.theme-monokai .sidebar .profile .label-default {
  background: rgba(109, 112, 246, 0.15);
  color: #8b8ff8;
  border: 1px solid rgba(109, 112, 246, 0.35);
}

/* ── 分页：Indigo 当前页（kit 深色档）──────────────── */
body.theme-monokai .pagination {
  font-size: 13px;
}
body.theme-monokai .pagination .page-number {
  color: #d4d4d8;
}
body.theme-monokai .pagination .page-number:hover {
  color: var(--mk-accent-hover);
  background: rgba(109, 112, 246, 0.12);
}
body.theme-monokai .pagination .page-number.current {
  background: var(--mk-accent);
  border-color: var(--mk-accent);
  color: #ffffff;
}
body.theme-monokai .pagination .extend {
  color: var(--mk-text-3);
}
body.theme-monokai .pagination .extend:hover {
  color: var(--mk-accent-hover);
  background: rgba(109, 112, 246, 0.12);
}

/* ── 按钮 ──────────────────────────────────────────── */
body.theme-monokai .btn {
  border: 1px solid #333745;
  color: #d4d4d8;
  background: transparent;
  font-size: 13px;
  font-weight: 500;
  border-radius: 4px;
  box-shadow: none;
}
body.theme-monokai .btn:hover {
  border-color: var(--mk-accent);
  color: var(--mk-accent-hover);
}
body.theme-monokai .btn-primary {
  background-color: var(--mk-accent);
  border-color: var(--mk-accent);
}
body.theme-monokai .btn-primary:hover,
body.theme-monokai .btn-primary:focus {
  background-color: var(--mk-accent-hover);
  border-color: var(--mk-accent-hover);
}

/* ── 卡片（card 列表/panel）────────────────────────── */
body.theme-monokai .panel {
  background: var(--mk-card);
  border: 1px solid var(--mk-border);
  border-radius: 4px;
  box-shadow: none;
}
body.theme-monokai .panel-heading {
  background: var(--mk-card-alt);
  border-bottom: 1px solid var(--mk-border);
  color: var(--mk-text);
}
body.theme-monokai .panel-footer {
  background: var(--mk-card-alt);
  border-top: 1px solid var(--mk-border);
}
body.theme-monokai .hover-shadow:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.45);
  border-color: rgba(109, 112, 246, 0.35);
}

/* ── 页脚：深色 + GitHub 链接保留 ──────────────────── */
body.theme-monokai .footer {
  background: var(--mk-header);
  border-top: 1px solid var(--mk-border);
}
body.theme-monokai .footer a {
  color: var(--mk-text-3);
  transition: color 0.15s ease;
}
body.theme-monokai .footer a:hover {
  color: var(--mk-accent-hover);
}
body.theme-monokai .footer .social-links {
  padding: 0;
}
body.theme-monokai .footer .social-links a .icon {
  color: var(--mk-text-3);
  transition: color 0.15s ease, transform 0.15s ease;
}
body.theme-monokai .footer .social-links a:hover .icon {
  color: var(--mk-accent-hover);
  transform: translateY(-2px);
}
body.theme-monokai .footer .copyright {
  color: var(--mk-text-3);
  font-size: 13px;
}

/* ── 网易云音乐播放器（保留，深色融合）──────────────── */
body.theme-monokai .footer iframe {
  background: transparent;
  border: 1px solid var(--mk-border);
  border-radius: 4px;
}

/* ── 文章导航（上一篇/下一篇）──────────────────────── */
body.theme-monokai .post-nav {
  background: var(--mk-card);
  border: 1px solid var(--mk-border);
  border-radius: 4px;
}
body.theme-monokai .post-nav .label {
  color: var(--mk-text-3);
}
body.theme-monokai .post-nav a {
  color: var(--mk-text);
}
body.theme-monokai .post-nav a:hover {
  color: var(--mk-accent-hover);
}

/* ── 打赏按钮区 ────────────────────────────────────── */
body.theme-monokai .donate {
  border-top: 1px solid var(--mk-border-light);
}

/* ── Insight 本地搜索（深色浮层）───────────────────── */
body.theme-monokai .ins-search {
  background: #14161c;
  border: 1px solid var(--mk-border);
}
body.theme-monokai .ins-search .ins-search-mask {
  background: rgba(0, 0, 0, 0.65);
}
body.theme-monokai .ins-search .ins-search-container {
  background: var(--mk-card);
  border: 1px solid var(--mk-border);
  color: var(--mk-text);
}
body.theme-monokai .ins-search .ins-search-input {
  color: var(--mk-text);
  border-bottom: 1px solid var(--mk-border);
}
body.theme-monokai .ins-search .ins-search-input::-webkit-input-placeholder,
body.theme-monokai .ins-search .ins-search-input::-moz-placeholder,
body.theme-monokai .ins-search .ins-search-input:-ms-input-placeholder {
  color: var(--mk-text-3);
}
body.theme-monokai .ins-search .ins-search-result-item {
  color: var(--mk-text-2);
  border-bottom: 1px solid var(--mk-border-light);
}
body.theme-monokai .ins-search .ins-search-result-item:hover,
body.theme-monokai .ins-search .ins-search-result-item.active {
  background: rgba(109, 112, 246, 0.1);
}
body.theme-monokai .ins-search .ins-search-result-title {
  color: var(--mk-accent-hover);
}
body.theme-monokai .ins-search .ins-search-result-content {
  color: var(--mk-text-3);
}
body.theme-monokai .ins-search .ins-search-stats {
  color: var(--mk-text-3);
}
body.theme-monokai .ins-search .ins-search-toggle {
  color: var(--mk-text-2);
}

/* ── 输入框聚焦光圈（kit 深色档 Indigo）────────────── */
body.theme-monokai input:focus,
body.theme-monokai textarea:focus,
body.theme-monokai select:focus {
  border-color: var(--mk-accent);
  box-shadow: 0 0 0 3px rgba(109, 112, 246, 0.18);
  outline: none;
}

/* ── 杂项：markdown 分割线 / 列表 / 链接下划线清理 ──── */
body.theme-monokai .article-entry ul,
body.theme-monokai .article-entry ol {
  padding-left: 1.5em;
}
body.theme-monokai .article-entry li {
  margin-bottom: 4px;
}
body.theme-monokai .article-entry li::marker {
  color: var(--mk-accent-hover);
}

/* ============================================================
 * 页面整体布局 — 顶部菜单栏模式
 * ------------------------------------------------------------
 * 参考主流深色博客（GitHub / Linear / Medium dark）：
 *   吸顶毛玻璃全宽顶栏：
 *     行 1：profile（头像 + 名字/座右铭）左 | 搜索 右
 *     行 2：导航胶囊水平居中（图标+文字，激活项 Indigo 淡底）
 *   内容区：文章 720px 居中（阅读最舒适宽度）
 *   宽屏（≥1460px）：文章 TOC 右侧悬浮卡（文章头按钮切换）
 *   页脚：网易云音乐播放器 + GitHub + 版权，居中
 * 根因修复（上一版"挤左上角"的原因）：
 *   基础 CSS ≥768px 是三栏布局：.header 与 .footer 都是
 *   position:fixed 的左侧窄条（width 4.17%→16.67%），
 *   body.main-center .main 被 margin-left:16.67% 推向右侧。
 *   上一版只覆盖了 position，width/bottom/left 仍生效 →
 *   顶栏缩成左上角窄条、内容偏右。
 *   本版用 body.theme-monokai（特异性 1,2,0）整体覆盖固定栏
 *   几何，回到"全宽顶栏 + 居中内容"模式。
 * ============================================================ */

/* ── ≥768px：全宽顶栏（覆盖基础左侧固定栏布局）── */
@media (min-width: 768px) {
  body.theme-monokai .header {
    position: sticky;
    top: 0;
    bottom: auto;
    left: 0;
    width: 100%;
    z-index: 1030;
    display: block;
    padding: 0;
    overflow: visible;
    border-right: 0;
    border-bottom: 1px solid var(--mk-border);
  }
  body.theme-monokai .header .slimContent {
    padding: 0 20px;
  }

  /* 行 1：profile 左 | 搜索右 */
  body.theme-monokai .navbar-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    float: none;
    margin: 0;
    padding: 10px 0 4px;
  }
  body.theme-monokai .navbar-header .topbar-profile {
    display: flex;
    align-items: center;
    text-align: left;
  }
  body.theme-monokai #avatar {
    display: flex;
    width: 34px;
    height: 34px;
    margin: 0 12px 0 0;
    flex: 0 0 auto;
  }
  body.theme-monokai #avatar img {
    width: 34px;
    height: 34px;
  }
  body.theme-monokai #name {
    font-size: 14px;
    letter-spacing: -0.01em;
  }
  body.theme-monokai #title.topbar-motto {
    max-width: 240px;
  }
  body.theme-monokai .navbar-header .search {
    margin: 0;
    flex: 0 0 auto;
  }
  body.theme-monokai .search .sidebar-form {
    width: 180px;
    border-radius: 6px;
  }
  body.theme-monokai .search .input-group {
    border: 0;
    background: transparent;
  }
  body.theme-monokai .search .search-form-input {
    border-radius: 6px;
  }

  /* 行 2：导航胶囊（拉回文档流 + 水平居中）*/
  body.theme-monokai #main-navbar {
    position: static;
    width: auto;
    float: none;
    background: transparent;
    border: 0;
    margin: 0;
    padding: 0 0 10px;
    text-align: center;
  }
  body.theme-monokai .main-nav {
    float: none;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid var(--mk-border-light);
    border-radius: 8px;
    padding: 4px;
    height: auto;
  }
  body.theme-monokai .main-nav > li {
    float: none;
    display: flex;
    align-items: center;
  }
  body.theme-monokai .main-nav > li > a {
    display: flex;
    align-items: center;
    height: 32px;
    padding: 0 12px;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: -0.01em;
    color: var(--mk-text-2);
    border-radius: 6px;
    transition: color 0.15s ease, background-color 0.15s ease;
  }
  body.theme-monokai .main-nav > li > a .icon {
    font-size: 13px;
    margin-right: 6px;
    color: var(--mk-text-3);
  }
  body.theme-monokai .main-nav > li > a:hover {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.06);
  }
  body.theme-monokai .main-nav > li > a:hover .icon {
    color: var(--mk-text-2);
  }
  body.theme-monokai .main-nav > .active > a,
  body.theme-monokai .main-nav > li > a.active {
    color: var(--mk-accent-hover) !important;
    background: var(--mk-accent-bg) !important;
  }
  body.theme-monokai .main-nav > .active > a .icon {
    color: var(--mk-accent-hover);
  }

  /* 右侧 widget 侧栏隐藏（排除 sidebar-toc，TOC 由下方规则单独处理）*/
  body.theme-monokai .sidebar:not(.sidebar-toc) {
    display: none !important;
  }

  /* 文章 TOC：窄桌面（768~1399）侧边空间不够悬浮卡，保持收起
     （≥1400px 显示为右侧悬浮卡，见下方媒体查询）*/
  body.theme-monokai .sidebar-toc.in {
    display: none !important;
  }

  /* 页脚：基础 CSS 是 fixed 左下窄条 → 居中块（保留音乐播放器 + GitHub）*/
  body.theme-monokai .footer {
    position: static;
    width: 100%;
    bottom: auto;
    margin: 48px auto 0;
    max-width: 720px;
    padding: 28px 24px 36px;
    background: transparent;
    color: var(--mk-text-3);
    text-align: center;
    z-index: auto;
  }
  body.theme-monokai .footer iframe {
    display: block;
    margin: 0 auto 16px;
    border-radius: 8px;
  }
  body.theme-monokai .footer .social-links {
    display: block;
    text-align: center;
    margin: 0 0 12px;
  }
  body.theme-monokai .footer .social-links li {
    display: inline-block;
    margin: 0 10px;
  }
  body.theme-monokai .footer .social-links li a {
    color: var(--mk-text-3);
    font-size: 18px;
    transition: color 0.15s ease;
  }
  body.theme-monokai .footer .social-links li a:hover {
    color: var(--mk-accent-hover);
  }
  body.theme-monokai .footer .copyright {
    font-size: 12px;
    color: var(--mk-text-3);
  }
}

/* ── ≥1200px：内容居中 + 顶栏尺寸 ── */
@media (min-width: 1200px) {
  body.theme-monokai .header .slimContent {
    max-width: 1280px;
    margin: 0 auto;
  }
  body.theme-monokai #avatar {
    width: 38px;
    height: 38px;
  }
  body.theme-monokai #avatar img {
    width: 38px;
    height: 38px;
  }
  body.theme-monokai #name {
    font-size: 15px;
  }
  body.theme-monokai .main {
    width: auto !important;
    max-width: 720px;
    margin: 28px auto 0;
    padding: 0 24px;
  }
}

/* ── 768~1199：窄屏顶栏（图标菜单，不显搜索框）── */
@media (min-width: 768px) and (max-width: 1199px) {
  body.theme-monokai .navbar-header .search {
    display: none;
  }
  body.theme-monokai #title.topbar-motto {
    display: none;
  }
  body.theme-monokai .main-nav > li > a {
    padding: 0 10px;
  }
  body.theme-monokai .main-nav > li > a .menu-title {
    display: none;
  }
  body.theme-monokai .main-nav > li > a .icon {
    font-size: 15px;
    margin-right: 0;
  }
  body.theme-monokai .main {
    width: auto !important;
    max-width: 760px;
    margin: 20px auto 0;
    padding: 0 20px;
  }
}

/* ── ≥1400px：文章 TOC 右侧悬浮卡 ── */
/* TOC 是 aside.sidebar.sidebar-toc（默认 .collapse 收起，文章头按钮切换 .in）；
   此处覆盖为右侧悬浮卡。right 用 max() 保证与 720px 文章之间留 48px 间隙，
   窄于此间隙的宽度由上方 768px 段隐藏 TOC 兜底。*/
@media (min-width: 1400px) {
  body.theme-monokai .sidebar-toc.in {
    display: block !important;
    position: fixed !important;
    top: 132px;
    bottom: auto;
    left: auto;
    right: max(24px, calc((100vw - 720px) / 2 - 272px - 48px));
    width: 272px;
    max-height: calc(100vh - 152px);
    overflow-y: auto;
    background: var(--mk-card);
    border: 1px solid var(--mk-border);
    border-radius: 8px;
    padding: 0;
    margin: 0;
    z-index: 950;
  }
  body.theme-monokai .sidebar-toc.in .slimContent {
    padding: 14px 16px;
  }
  body.theme-monokai .sidebar-toc.in .toc-title {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--mk-text-3);
    margin-bottom: 8px;
  }
  body.theme-monokai .sidebar-toc.in .toc {
    font-size: 12px;
    line-height: 1.7;
  }
  body.theme-monokai .sidebar-toc.in .toc ul {
    padding-left: 0;
    list-style: none;
  }
  body.theme-monokai .sidebar-toc.in .toc ul ul {
    padding-left: 12px;
  }
  body.theme-monokai .sidebar-toc.in .toc a {
    display: block;
    padding: 2px 0 2px 10px;
    margin-left: -12px;
    border-left: 2px solid transparent;
    color: var(--mk-text-3);
    transition: color 0.15s ease, border-color 0.15s ease;
  }
  body.theme-monokai .sidebar-toc.in .toc a:hover {
    color: var(--mk-text);
  }
  body.theme-monokai .sidebar-toc.in .toc .active a,
  body.theme-monokai .sidebar-toc.in .toc a.on {
    color: var(--mk-accent-hover);
    border-left-color: var(--mk-accent);
  }
}

/* ── <768px：移动端（沿用基础 float 布局：头像行 + 全宽搜索 + 汉堡菜单）── */
@media (max-width: 767px) {
  /* 固定顶栏变高（头像行+搜索框），加大 body 顶部补偿避免内容被遮。
     搜索框沿用基础 width:91.67% + float（已为右上角汉堡按钮留位）。*/
  body.theme-monokai {
    padding-top: 112px;
  }
  body.theme-monokai .navbar-header .topbar-profile {
    display: flex;
    align-items: center;
    margin: 10px 0 4px;
  }
  /* 移动端下拉菜单：基础 CSS 是浅色 #fbfbfb → 深色 */
  body.theme-monokai #main-navbar {
    background-color: var(--mk-header);
    border-bottom: 1px solid var(--mk-border);
  }
  body.theme-monokai #main-navbar .main-nav > li {
    display: block;
    width: 100%;
  }
  body.theme-monokai #main-navbar .main-nav > li > a {
    height: auto;
    padding: 10px 20px;
  }
}

/* ============================================================
 * 深色白色残留修复（全端，对齐 at-web 深色规范）
 * ------------------------------------------------------------
 * 根因：style.css 的浅色基线（table tr #fff / .bar-footer #fff /
 * .highlight pre #fafafa / form-control #fff / .bg #f6f6f6 等）
 * 未被皮肤覆盖。hexo 代码块是 <figure.highlight><table><td> 结构，
 * 正好命中 "table tr { background:#fff }"，故代码区发白。
 * ============================================================ */

/* ── 代码区：figure.highlight 内的表格强制透明（最高优先级压掉 table tr #fff）── */
body.theme-monokai figure.highlight,
body.theme-monokai figure.highlight table,
body.theme-monokai figure.highlight table tr,
body.theme-monokai figure.highlight table td,
body.theme-monokai figure.highlight pre,
body.theme-monokai figure.highlight .gutter,
body.theme-monokai figure.highlight .code {
  background: #272822 !important;
  color: #f8f8f2;
}
body.theme-monokai figure.highlight {
  padding: 0;
  margin: 14px 0;
  border: 1px solid var(--mk-border);
  border-radius: 4px;
  overflow: hidden;
}
body.theme-monokai figure.highlight table {
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
  margin: 0;
}
/* Mac 窗口标题栏（深色，红黄绿圆点保留）*/
body.theme-monokai figure.highlight:before {
  content: " ";
  display: block;
  height: 32px;
  background: #1e1f1a;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  position: relative;
}
body.theme-monokai figure.highlight:after {
  content: " ";
  position: absolute;
  top: 11px;
  left: 15px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #fc625d;
  -webkit-box-shadow: 20px 0 #fdbc40, 40px 0 #35cd4b;
  box-shadow: 20px 0 #fdbc40, 40px 0 #35cd4b;
}
body.theme-monokai figure.highlight td.gutter {
  width: 1%;
  border-right: 1px solid rgba(255, 255, 255, 0.06);
}
body.theme-monokai figure.highlight td.gutter pre {
  color: #75715e;
  margin: 0;
  padding: 14px 12px;
}
body.theme-monokai figure.highlight td.code {
  width: 100%;
}
body.theme-monokai figure.highlight td.code pre {
  margin: 0;
  padding: 14px 12px;
}
/* 兼容旧 .highlight 类（非 figure 包裹时）*/
body.theme-monokai .highlight,
body.theme-monokai .highlight table,
body.theme-monokai .highlight table tr,
body.theme-monokai .highlight table td,
body.theme-monokai .highlight pre {
  background: #272822 !important;
}
body.theme-monokai .highlight:before {
  background-color: #1e1f1a !important;
}
body.theme-monokai .highlight table:before {
  background-color: #1e1f1a !important;
}
/* 正文中独立 pre（非代码块场景）*/
body.theme-monokai pre,
body.theme-monokai .article-entry pre {
  background: #272822;
  color: #f8f8f2;
}

/* ── 翻页区：bar-footer 白底 → 深色卡片 ── */
body.theme-monokai .bar.bar-footer,
body.theme-monokai .bar.bar-footer:before,
body.theme-monokai .bar.bar-footer:after {
  background-color: var(--mk-card);
}
body.theme-monokai .bar.bar-footer {
  border-top: 1px solid var(--mk-border);
  border-radius: 4px;
  margin: 20px 0 10px;
}
body.theme-monokai .bar-inner {
  padding-top: 12px;
  padding-bottom: 12px;
}
body.theme-monokai .pager > li > a,
body.theme-monokai .pager > li > span,
body.theme-monokai .pager a {
  background: var(--mk-card-alt);
  border: 1px solid var(--mk-border);
  color: var(--mk-text-2);
  font-size: 13px;
  font-weight: 500;
  border-radius: 4px;
  margin: 0 4px;
  transition: color 0.15s ease, border-color 0.15s ease, background-color 0.15s ease;
}
body.theme-monokai .pager > li > a:hover,
body.theme-monokai .pager a:hover {
  color: var(--mk-accent-hover);
  border-color: var(--mk-accent);
  background: var(--mk-accent-bg);
}
body.theme-monokai .pager .disabled a,
body.theme-monokai .pager a.disabled {
  color: var(--mk-text-3) !important;
  background: var(--mk-card) !important;
  border-color: var(--mk-border-light) !important;
  cursor: not-allowed;
}
/* 数字分页（pagination.number 模式）*/
body.theme-monokai .page-number {
  display: inline-block;
  min-width: 30px;
  text-align: center;
  padding: 5px 8px;
  margin: 0 2px;
  border-radius: 4px;
  color: var(--mk-text-2);
  font-size: 13px;
  transition: color 0.15s ease, background-color 0.15s ease;
}
body.theme-monokai .page-number:hover {
  color: var(--mk-accent-hover);
  background: var(--mk-accent-bg);
}
body.theme-monokai .page-number.current {
  background: var(--mk-accent);
  color: #ffffff;
}
body.theme-monokai .total-article {
  color: var(--mk-text-3);
  font-size: 13px;
  line-height: 34px;
}

/* ── 表格：正文表格行底色（压掉 table tr #fff / nth-child #f8f8f8）── */
body.theme-monokai table tr,
body.theme-monokai table tr:nth-child(2n),
body.theme-monokai table > tbody > tr:hover {
  background-color: transparent;
}
body.theme-monokai .article-entry table {
  background: transparent;
}
body.theme-monokai .table td,
body.theme-monokai .table th {
  background-color: transparent;
}
body.theme-monokai .table-bordered td,
body.theme-monokai .table-bordered th {
  border: 1px solid var(--mk-border);
}
body.theme-monokai .table > thead > tr > th {
  border-bottom: 1px solid var(--mk-border);
  color: var(--mk-text);
  font-weight: 500;
}

/* ── 表单控件：白底 → 深色 ── */
body.theme-monokai .form-control,
body.theme-monokai input[type="text"],
body.theme-monokai input[type="email"],
body.theme-monokai input[type="password"],
body.theme-monokai input[type="search"],
body.theme-monokai textarea,
body.theme-monokai select {
  background-color: #262a34;
  border: 1px solid #333745;
  color: var(--mk-text);
}
body.theme-monokai .form-control:focus,
body.theme-monokai input:focus,
body.theme-monokai textarea:focus,
body.theme-monokai select:focus {
  background-color: #262a34;
  border-color: var(--mk-accent);
  box-shadow: 0 0 0 3px rgba(109, 112, 246, 0.18);
}

/* ── 按钮：btn-default 白底 → 深色描边 ── */
body.theme-monokai .btn-default {
  background-color: var(--mk-card-alt);
  border-color: #333745;
  color: #d4d4d8;
}
body.theme-monokai .btn-default:hover,
body.theme-monokai .btn-default:focus {
  background-color: #2f3542;
  border-color: var(--mk-accent);
  color: var(--mk-accent-hover);
}

/* ── 下拉菜单 / modal / well / mark 等杂项白面 ── */
body.theme-monokai .dropdown-menu {
  background-color: var(--mk-card-alt);
  border: 1px solid var(--mk-border);
  color: var(--mk-text-2);
}
body.theme-monokai .dropdown-menu > li > a {
  color: var(--mk-text-2);
}
body.theme-monokai .dropdown-menu > li > a:hover,
body.theme-monokai .dropdown-menu > li > a:focus {
  background-color: var(--mk-accent-bg);
  color: var(--mk-accent-hover);
}
body.theme-monokai .modal-content {
  background-color: var(--mk-card);
  color: var(--mk-text);
}
body.theme-monokai .modal-header,
body.theme-monokai .modal-footer {
  border-color: var(--mk-border);
}
body.theme-monokai .modal-backdrop.in {
  opacity: 0.65;
}
body.theme-monokai .well {
  background-color: var(--mk-card-alt);
  border: 1px solid var(--mk-border);
  color: var(--mk-text-2);
}
body.theme-monokai .mark,
body.theme-monokai mark {
  background-color: rgba(255, 214, 102, 0.25);
  color: #ffd666;
}
body.theme-monokai .navbar-default {
  background-color: var(--mk-header);
  border-color: var(--mk-border);
}
body.theme-monokai .thumbnail,
body.theme-monokai .img-thumbnail {
  background-color: var(--mk-card-alt);
  border: 1px solid var(--mk-border);
}
body.theme-monokai .list-group-item {
  background-color: transparent;
  border-color: var(--mk-border-light);
  color: var(--mk-text-2);
}
body.theme-monokai .list-group-item.active {
  background-color: var(--mk-accent-bg);
  border-color: var(--mk-accent);
  color: var(--mk-accent-hover);
}
body.theme-monokai .nav-tabs > li > a {
  color: var(--mk-text-2);
}
body.theme-monokai .nav-tabs > li.active > a,
body.theme-monokai .nav-tabs > li.active > a:hover,
body.theme-monokai .nav-tabs > li.active > a:focus {
  background-color: var(--mk-card);
  color: var(--mk-accent-hover);
  border-color: var(--mk-border) var(--mk-border) var(--mk-border);
}
body.theme-monokai .radio label:before,
body.theme-monokai .checkbox label:before {
  background-color: #262a34;
  border-color: #333745;
}
body.theme-monokai .radio label:after,
body.theme-monokai .checkbox label:after {
  background-color: var(--mk-accent);
}

/* ── Insight 本地搜索：覆盖浅色浮层残留 ── */
body.theme-monokai .ins-section-container {
  background: #1a1c23;
}
body.theme-monokai .ins-search-input {
  background: transparent;
}

/* ── 页面级背景类（.bg #f6f6f6!important 压深色底）── */
body.theme-monokai .bg {
  background-color: var(--mk-page) !important;
}
body.theme-monokai .bg-inverse {
  background-color: #000000;
}

/* ── 文章头 / 文章卡细节 ── */
body.theme-monokai .article-header {
  color: var(--mk-text);
}
body.theme-monokai .article-header h1 {
  color: #ffffff;
}
body.theme-monokai .text-muted {
  color: var(--mk-text-3) !important;
}

