/* ============================================================
   1. 字体与基础设置 (Fonts & Basics)
   ============================================================ */

body {
  width: 96%;
  max-width: 800px;
  margin: 100px auto 30px !important;
  font-family: "Bitter-Regular", serif;
  font-size: 16px;
  cursor: default;
}

::selection {
  background-color: #000;
  color: white;
}

/* ============================================================
   2. 文章内容布局 (Article Content Layout)
   ============================================================ */

.article-content > p {
  line-height: 1.7em;
  margin: 10px 0;
}

.article-content blockquote {
  border-left: 2px solid #000;
  padding-left: calc(1em - 1px);
}

.article-content em {
  border-bottom: 1px solid black;
  font-style: normal;
}

/* 行内代码与链接 */
p code {
  background-color: #000000;
  color: white;
  border-radius: 4px;
  padding: 4px;
}

p a {
  border-bottom: 2px dashed black;
}

p img {
  border: 2px solid black;
  margin: 20px 0;
}

.highlight pre {
  border-radius: 8px;
  padding: 20px;
  overflow: scroll;
}

/* ============================================================
   3. 标题系统 (Typography - Headings)
   ============================================================ */

.article-content h2, 
.article-content h3, 
.article-content h4, 
.article-content h5 {
  font-weight: 700;
  color: #000;
  line-height: 1.3;
}

.article-content h2 { font-size: 2rem; margin: 2.5rem 0 1.2rem; }   /* 32px */
.article-content h3 { font-size: 1.5rem; margin: 2rem 0 1rem; }     /* 24px */
.article-content h4 { font-size: 1.25rem; margin: 1.5rem 0 0.8rem; } /* 20px */
.article-content h5 { font-size: 1rem; margin: 1.2rem 0 0.6rem; }    /* 16px */

/* ============================================================
   4. 列表设计 (Sophisticated Lists)
   ============================================================ */

.article-content ul, 
.article-content ol {
  padding-left: 0;
  margin: 2rem 0;
  list-style: none;
}

.article-content li {
  position: relative;
  padding-left: 1.5rem;
  margin-bottom: 1rem;
  color: #333;
  font-size: 0.95rem;
  line-height: 1.6;
}

/* 无序列表：Em Dash 细线 */
.article-content ul > li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.75rem;
  width: 0.6rem;
  height: 1px;
  background-color: #000;
  transition: width 0.3s ease;
}

/* 有序列表：Georgia 衬线数字与斜杠 */
.article-content ol {
  counter-reset: custom-counter;
}

.article-content ol > li {
  counter-increment: custom-counter;
}

.article-content ol > li::before {
  content: counter(custom-counter, decimal-leading-zero) " /";
  position: absolute;
  left: 0;
  font-family: "Georgia", serif;
  font-size: 0.75rem;
  font-weight: 300;
  color: #999;
  letter-spacing: 1px;
}

/* 嵌套列表 */
.article-content li > ul,
.article-content li > ol {
  margin: 0.8rem 0 0.5rem 0.5rem;
  padding-left: 1rem;
  border-left: 1px solid #eee;
}

.article-content li > ul li::before {
  width: 0.3rem;
  background-color: #999;
}

/* ============================================================
   5. 目录与交互 (TOC & Interaction)
   ============================================================ */

.neobrutalism-toc ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.neobrutalism-toc li ul {
  padding-left: 1.5rem !important;
  margin: 0.25rem 0 !important;
  border-left: 2px solid #000;
}

.neobrutalism-toc li {
  margin: 0.5rem 0 !important;
}

.neobrutalism-toc a {
  display: block;
  color: black !important;
  text-decoration: none;
  padding: 2px 0;
}

.neobrutalism-toc a:hover {
  text-decoration: underline !important;
}

/* 目录激活状态 */
.toc-active {
  transform: translate(4px, 4px) !important;
  box-shadow: none !important;
  background-color: #fde047 !important;
}

html {
  scroll-behavior: smooth;
}

/* ============================================================
   6. 动效设计 (Animations)
   ============================================================ */

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(15px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* .article-content > * {
  animation: fadeInUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.article-content > *:nth-child(1) { animation-delay: 0.1s; }
.article-content > *:nth-child(2) { animation-delay: 0.2s; }
.article-content > *:nth-child(3) { animation-delay: 0.3s; }
.article-content > *:nth-child(n+4) { animation-delay: 0.4s; } */



















/* ==========================================================================
   GLightbox 皮肤高定优化（不改变原有布局与图片尺寸）
   ========================================================================== */

/* 1. 遮罩层背景：改用极简的暗黑磨砂玻璃质感（或者纯粹的高级黑） */
.goverlay {
    background: rgba(18, 18, 18, 0.92) !important; /* 更深邃、更现代的纯黑偏暗色调 */
    backdrop-filter: blur(8px); /* 适度的毛玻璃模糊，瞬间拉开档次 */
}

/* 2. 描述文字外层容器：去除死板的底色，增加呼吸感 */
.gslide-description {
    background: transparent !important; /* 隐藏原本死板的背景块 */
    padding: 24px 16px !important;
}

/* 3. 描述文字内层卡片：打造悬浮现代感 */
.gdesc-inner {
    background: rgba(255, 255, 255, 0.06) !important; /* 极轻微的白透明 */
    border: 1px solid rgba(255, 255, 255, 0.1) !important; /* 极其细腻的边框线 */
    border-radius: 12px !important; /* 现代圆角 */
    padding: 16px 24px !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3) !important; /* 柔和阴影 */
    text-align: center; /* 文字居中 */
}

/* 4. 标题/描述文本样式优化：更换高级字体与字距 */
.gslide-desc {
    color: rgba(255, 255, 255, 0.9) !important; /* 护眼的高级白，非纯白 */
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    line-height: 1.6 !important;
    letter-spacing: 0.05em !important; /* 稍微拉开字距，更具呼吸感 */
}

.gslide-image
{
  
  margin-top: 20px !important;
}
/* 5. 图片微调：为其增加非常克制的圆角（不改变大小） */
.gslide-image img {
    border-radius: 8px !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4) !important; /* 给图片本身加深层阴影，使其更立体 */
}

/* 6. 控制按钮（左右箭头、关闭按钮）现代感优化 */
.gbtn svg path {
    fill: rgba(255, 255, 255, 0.7) !important; /* 默认半透明 */
    transition: fill 0.2s ease;
}
.gbtn:hover svg path {
    fill: rgba(255, 255, 255, 1) !important; /* 悬浮全亮 */
}