/* ============================================================
   Joe 皮肤层：复刻 yifun.cn（易航版）视觉氛围到原版 Joe
   来源令牌：joe/assets/css/main.min.css（与 blog.yifun.cn 线上同源 md5 9ee4e38d）
   原理：原版 Joe 昼夜模式全部走 CSS 变量（joe.mode.min.css 的 html{--theme…}），
        本层只重新赋值变量 + 少量氛围规则，不改布局结构，可整体摘除。
   ============================================================ */

/* ---- 亮色（yifun: --theme-color #f04494 / body-bg #f5f6f7 / main #4e5358）---- */
html {
  --theme: #f04494;                                   /* 品红主色 */
  --background: rgba(255, 255, 255, 0.92);            /* yifun 卡片微透明 */
  --main: #333;                                       /* --key-color */
  --routine: #4e5358;                                 /* --main-color */
  --minor: #888;                                      /* yifun 高频灰 */
  --seat: #bbb;
  --classA: #e3e5e8;
  --classB: #eceef1;
  --classC: #f2f4f6;
  --classD: #f5f6f7;                                  /* yifun body 背景 */
  --radius-wrap: 10px;                                /* yifun 圆角语言 4-16px，取 10 */
  --radius-inner: 6px;
  --box-shadow: 0 3px 8px rgba(0, 0, 0, 0.06);        /* 近似 yifun -3px 3px 6px .1 */
}

/* ---- 暗色（yifun night: body-bg #292a2d / main-bg #323335；主色降饱和保可读）---- */
html[data-night='night'] body {
  --theme: #d64d8f;
  --background: #323335;
  --main: #c9c9c9;
  --routine: #a0a0a0;
  --minor: #8a8a8a;
  --seat: #6a6a6a;
  --classA: #4a4b4e;
  --classB: #3e3f42;
  --classC: #38393c;
  --classD: #292a2d;
  --box-shadow: none;
}
html[data-night='night'] body::before { background: #232427; }

/* ---- yifun 焦点氛围：主色光晕（--focus-shadow-color rgba(253,83,161,.4)）---- */
.joe_index__list .item:hover,
.joe_archive__list .item:hover,
.joe_aside__item:not(.author):hover {
  box-shadow: 0 3px 14px rgba(240, 68, 148, 0.14);
}
html[data-night='night'] .joe_index__list .item:hover,
html[data-night='night'] .joe_archive__list .item:hover,
html[data-night='night'] .joe_aside__item:not(.author):hover {
  box-shadow: 0 3px 14px rgba(214, 77, 143, 0.10);
}

/* 选中/滚动条用主色（yifun 全局 focus 语言） */
::selection { background: var(--theme); color: #fff; }
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-thumb { border-radius: 3px; background: var(--seat); }
::-webkit-scrollbar-thumb:hover { background: var(--theme); }

/* 分类小胶囊：yifun 卡片用主色渐变的替代——沿用 Joe 自带 category 配色，仅统一圆角 */
.joe_detail__category .item { border-radius: var(--radius-inner); }

/* ============================================================
   Phase B1：文章列表卡片网格化（复刻 yifun posts-row/item 语言）
   yifun 参照：.card{margin:8px;padding:10px} + item-thumbnail padding-bottom:70%
   作用域：归档页列表（分类/标签/搜索/日期）+ 首页 AJAX 列表
   ============================================================ */

/* --- 归档容器变透明面板：灰底浮白卡（yifun 氛围） --- */
.joe_archive {
  background: transparent;
  box-shadow: none;
  padding: 0;
}
.joe_archive__title {
  background: var(--background);
  box-shadow: var(--box-shadow);
  border-radius: var(--radius-wrap);
  padding: 0 15px;
  margin-bottom: 15px;
}

/* --- 列表 → 双列网格 --- */
.joe_archive__list.joe_list,
.joe_index__list .joe_list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 15px;
}
.joe_index__list .joe_list { padding: 15px 0; }   /* 首页保留白面板，列表内缩 */

/* --- 行 → 卡片 --- */
.joe_archive__list .joe_list__item,
.joe_index__list .joe_list__item {
  display: flex;
  flex-direction: column;
  width: auto;
  padding: 0;
  margin: 0;
  border-bottom: none;
  border-radius: var(--radius-wrap);
  background: var(--background);
  box-shadow: var(--box-shadow);
  overflow: hidden;
  transition: box-shadow 0.35s;
}
.joe_index__list .joe_list__item { background: var(--classD); } /* 白面板内用浅灰底分层 */
.joe_archive__list .joe_list__item:hover,
.joe_index__list .joe_list__item:hover {
  box-shadow: 0 6px 18px rgba(240, 68, 148, 0.14);
}
.joe_list__item .line { display: none; }           /* 卡片模式去掉左侧竖条 */

/* --- default：左图右文 → 上图下文（yifun 卡片语义） --- */
.joe_list__item.default .thumbnail {
  flex-shrink: 0;
  width: 100%;
  height: 0;
  padding-bottom: 70%;                /* = yifun --posts-list-scale */
  margin: 0;
}
.joe_list__item.default .thumbnail img {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  border-radius: 0;
}
.joe_list__item.default .information {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 12px 15px 14px;
  min-width: 0;
}

/* --- single：280px 定高 → 响应比例 --- */
.joe_list__item.single .thumbnail {
  width: 100%;
  height: 0;
  padding-bottom: 56%;
  margin: 0 0 0 0;
}
.joe_list__item.single .thumbnail img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 0; }
.joe_list__item.single .information,
.joe_list__item.multiple .information {
  margin: 0 !important;
  padding: 12px 15px 14px;
  flex: 1;
  display: flex;
  flex-direction: column;
}

/* --- multiple：三图带内边距 --- */
.joe_list__item.multiple .thumbnail {
  margin: 0;
  padding: 10px 15px 0;
  grid-template-rows: 110px;
  gap: 8px;
}
.joe_list__item.multiple .thumbnail img { border-radius: var(--radius-inner); }

/* --- none：去掉 140px 定高 --- */
.joe_list__item.none .information {
  height: auto;
  padding: 14px 15px;
  flex: 1;
}

/* --- 信息区通用：标题两行、meta 沉底 --- */
.joe_list__item .information .title { font-size: 16px; line-height: 22px; max-height: 44px; margin-bottom: 8px; }
.joe_list__item .information .abstract { -webkit-line-clamp: 2; max-height: 44px; margin-bottom: 10px; }
.joe_list__item .meta { margin-top: auto; }

/* --- 窄屏：单列 --- */
@media (max-width: 768px) {
  .joe_archive__list.joe_list,
  .joe_index__list .joe_list { grid-template-columns: 1fr; }
  .joe_list__item.default .thumbnail { padding-bottom: 56%; }
}