/* ==========================================================================
   PureBlog 八大模块集成样式（饺子移植）
   命名空间：jzpb / data-jzpb-*，仅在后台开启对应开关时生效
   - 未开启任何开关时本文件不产生任何视觉变化（全部选择器带属性前提）
   - 深色模式通过 html[data-night="night"] 适配
   - prefers-reduced-motion 下自动关闭全部动画
   ========================================================================== */

/* ===================== ① 顶部导航高度 / LOGO ===================== */
:root { --jzpb-header-h: 0px; --jzpb-thumb-h: 0px; --jzpb-roll-speed: 30s; }

html[data-jzpb-header="1"] .joe_header__above { min-height: var(--jzpb-header-h); }
html[data-jzpb-header="1"] .joe_header__above-logo img { max-height: calc(var(--jzpb-header-h) - 24px) !important; }

/* ===================== ② 10 套精选配色（昼夜双版，不含蓝紫） ===================== */
/* 注意：Juzi 内联样式把 --theme 写在 body 上，此处必须同打到 body 才能覆盖（优先级 0,1,2 > 0,0,1） */
html[data-jzpb-tone="slate"] body   { --theme: #475569; }
html[data-jzpb-tone="stone"] body   { --theme: #78716c; }
html[data-jzpb-tone="zinc"] body    { --theme: #52525b; }
html[data-jzpb-tone="emerald"] body { --theme: #059669; }
html[data-jzpb-tone="teal"] body    { --theme: #0d9488; }
html[data-jzpb-tone="lime"] body    { --theme: #65a30d; }
html[data-jzpb-tone="amber"] body   { --theme: #d97706; }
html[data-jzpb-tone="orange"] body  { --theme: #ea580c; }
html[data-jzpb-tone="rose"] body    { --theme: #e11d48; }
html[data-jzpb-tone="cyan"] body    { --theme: #0891b2; }

html[data-night="night"][data-jzpb-tone="slate"] body   { --theme: #94a3b8; }
html[data-night="night"][data-jzpb-tone="stone"] body   { --theme: #a8a29e; }
html[data-night="night"][data-jzpb-tone="zinc"] body    { --theme: #a1a1aa; }
html[data-night="night"][data-jzpb-tone="emerald"] body { --theme: #34d399; }
html[data-night="night"][data-jzpb-tone="teal"] body    { --theme: #2dd4bf; }
html[data-night="night"][data-jzpb-tone="lime"] body    { --theme: #a3e635; }
html[data-night="night"][data-jzpb-tone="amber"] body   { --theme: #fbbf24; }
html[data-night="night"][data-jzpb-tone="orange"] body  { --theme: #fb923c; }
html[data-night="night"][data-jzpb-tone="rose"] body    { --theme: #fb7185; }
html[data-night="night"][data-jzpb-tone="cyan"] body    { --theme: #22d3ee; }

/* ===================== ③ 页面皮肤质感 ===================== */
/* 作用对象统一 */
html[data-jzpb-skin] .joe_list__item,
html[data-jzpb-skin] .joe_aside__item,
html[data-jzpb-skin] .joe_comment__respond,
html[data-jzpb-skin] .joe_detail,
html[data-jzpb-skin] .joe_pagination li a,
html[data-jzpb-skin] .jzpb-roll { border-color: transparent; }

html[data-jzpb-skin="none"] .joe_list__item,
html[data-jzpb-skin="none"] .joe_aside__item,
html[data-jzpb-skin="none"] .joe_comment__respond,
html[data-jzpb-skin="none"] .joe_detail { background: transparent !important; box-shadow: none !important; }

html[data-jzpb-skin="transparent"] .joe_list__item,
html[data-jzpb-skin="transparent"] .joe_aside__item,
html[data-jzpb-skin="transparent"] .joe_comment__respond,
html[data-jzpb-skin="transparent"] .joe_detail { background: transparent !important; backdrop-filter: none; }

html[data-jzpb-skin="alpha"] .joe_list__item,
html[data-jzpb-skin="alpha"] .joe_aside__item,
html[data-jzpb-skin="alpha"] .joe_comment__respond,
html[data-jzpb-skin="alpha"] .joe_detail { background: rgba(255,255,255,.62) !important; }
html[data-night="night"][data-jzpb-skin="alpha"] .joe_list__item,
html[data-night="night"][data-jzpb-skin="alpha"] .joe_aside__item,
html[data-night="night"][data-jzpb-skin="alpha"] .joe_comment__respond,
html[data-night="night"][data-jzpb-skin="alpha"] .joe_detail { background: rgba(35,35,35,.55) !important; }

html[data-jzpb-skin="frost"] .joe_list__item,
html[data-jzpb-skin="frost"] .joe_aside__item,
html[data-jzpb-skin="frost"] .joe_comment__respond,
html[data-jzpb-skin="frost"] .joe_detail {
    background: rgba(245,247,250,.78) !important; backdrop-filter: blur(6px) saturate(1.1);
}
html[data-night="night"][data-jzpb-skin="frost"] .joe_list__item,
html[data-night="night"][data-jzpb-skin="frost"] .joe_aside__item,
html[data-night="night"][data-jzpb-skin="frost"] .joe_comment__respond,
html[data-night="night"][data-jzpb-skin="frost"] .joe_detail {
    background: rgba(40,42,48,.72) !important; backdrop-filter: blur(6px) saturate(1.1);
}

html[data-jzpb-skin="glass"] .joe_list__item,
html[data-jzpb-skin="glass"] .joe_aside__item,
html[data-jzpb-skin="glass"] .joe_comment__respond,
html[data-jzpb-skin="glass"] .joe_detail {
    background: rgba(255,255,255,.55) !important;
    backdrop-filter: blur(16px) saturate(1.4);
    border: 1px solid rgba(255,255,255,.55) !important;
    box-shadow: 0 8px 32px rgba(0,0,0,.08) !important;
}
html[data-night="night"][data-jzpb-skin="glass"] .joe_list__item,
html[data-night="night"][data-jzpb-skin="glass"] .joe_aside__item,
html[data-night="night"][data-jzpb-skin="glass"] .joe_comment__respond,
html[data-night="night"][data-jzpb-skin="glass"] .joe_detail {
    background: rgba(48,50,58,.48) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    box-shadow: 0 8px 32px rgba(0,0,0,.35) !important;
}

html[data-jzpb-skin="apple"] .joe_list__item,
html[data-jzpb-skin="apple"] .joe_aside__item,
html[data-jzpb-skin="apple"] .joe_comment__respond,
html[data-jzpb-skin="apple"] .joe_detail {
    background: rgba(255,255,255,.72) !important;
    backdrop-filter: blur(22px) saturate(1.6);
    border: 1px solid rgba(0,0,0,.05) !important;
    box-shadow: 0 2px 10px rgba(0,0,0,.05), 0 10px 30px rgba(0,0,0,.06) !important;
}
html[data-night="night"][data-jzpb-skin="apple"] .joe_list__item,
html[data-night="night"][data-jzpb-skin="apple"] .joe_aside__item,
html[data-night="night"][data-jzpb-skin="apple"] .joe_comment__respond,
html[data-night="night"][data-jzpb-skin="apple"] .joe_detail {
    background: rgba(44,44,46,.72) !important;
    border: 1px solid rgba(255,255,255,.06) !important;
}

html[data-jzpb-skin="liquid"] .joe_list__item,
html[data-jzpb-skin="liquid"] .joe_aside__item,
html[data-jzpb-skin="liquid"] .joe_comment__respond,
html[data-jzpb-skin="liquid"] .joe_detail {
    position: relative;
    background: linear-gradient(135deg, rgba(255,255,255,.6), rgba(255,255,255,.35)) !important;
    backdrop-filter: blur(28px) saturate(1.8);
    border: 1px solid rgba(255,255,255,.65) !important;
    box-shadow: 0 12px 40px rgba(31,38,135,.12), inset 0 1px 0 rgba(255,255,255,.7) !important;
}
html[data-night="night"][data-jzpb-skin="liquid"] .joe_list__item,
html[data-night="night"][data-jzpb-skin="liquid"] .joe_aside__item,
html[data-night="night"][data-jzpb-skin="liquid"] .joe_comment__respond,
html[data-night="night"][data-jzpb-skin="liquid"] .joe_detail {
    background: linear-gradient(135deg, rgba(60,64,75,.55), rgba(40,42,50,.35)) !important;
    border: 1px solid rgba(255,255,255,.1) !important;
    box-shadow: 0 12px 40px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.08) !important;
}

/* 自定义背景：作用到整页 + 遮罩 */
html[data-jzpb-skin="custom"] body {
    background-image: var(--jzpb-skin-bg) !important;
    background-size: cover; background-position: center; background-attachment: fixed;
}
html[data-jzpb-skin="custom"] body::after {
    content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
}
html[data-jzpb-mask="light"][data-jzpb-skin="custom"] body::after { background: rgba(255,255,255,.55); }
html[data-jzpb-mask="dark"][data-jzpb-skin="custom"] body::after { background: rgba(0,0,0,.45); }
html[data-jzpb-skin="custom"] .joe_list__item,
html[data-jzpb-skin="custom"] .joe_aside__item,
html[data-jzpb-skin="custom"] .joe_comment__respond,
html[data-jzpb-skin="custom"] .joe_detail {
    background: rgba(255,255,255,.82) !important; backdrop-filter: blur(10px);
}
html[data-night="night"][data-jzpb-skin="custom"] .joe_list__item,
html[data-night="night"][data-jzpb-skin="custom"] .joe_aside__item,
html[data-night="night"][data-jzpb-skin="custom"] .joe_comment__respond,
html[data-night="night"][data-jzpb-skin="custom"] .joe_detail {
    background: rgba(35,35,35,.78) !important;
}

/* ===================== ③ 全局圆角 ===================== */
html[data-jzpb-radius] .joe_list__item,
html[data-jzpb-radius] .joe_aside__item,
html[data-jzpb-radius] .joe_detail,
html[data-jzpb-radius] .joe_comment__respond,
html[data-jzpb-radius] .joe_pagination li a,
html[data-jzpb-radius] .jzpb-roll,
html[data-jzpb-radius] .jzpb-signrank__btn,
html[data-jzpb-radius] .joe_list__item .thumbnail,
html[data-jzpb-radius] .joe_list__item img,
html[data-jzpb-radius] .joe_aside__item img.avatar,
html[data-jzpb-radius] .jzpb-sideposts__thumb img,
html[data-jzpb-radius] input[type="text"],
html[data-jzpb-radius] input[type="email"],
html[data-jzpb-radius] input[type="password"],
html[data-jzpb-radius] textarea,
html[data-jzpb-radius] .btn,
html[data-jzpb-radius] button {
    border-radius: var(--jzpb-r, 0) !important;
}
html[data-jzpb-radius="0"]  { --jzpb-r: 0px; }
html[data-jzpb-radius="1"]  { --jzpb-r: 1px; }
html[data-jzpb-radius="4"]  { --jzpb-r: 4px; }
html[data-jzpb-radius="8"]  { --jzpb-r: 8px; }
html[data-jzpb-radius="12"] { --jzpb-r: 12px; }
html[data-jzpb-radius="18"] { --jzpb-r: 18px; }

/* ===================== ③ 卡片悬停光影（35 种 + 自定义） ===================== */
html[data-jzpb-shadow] .joe_list__item,
html[data-jzpb-shadow] .joe_aside__item { transition: box-shadow .35s ease, transform .35s ease, background .3s; }

html[data-jzpb-shadow="none"] .joe_list__item,
html[data-jzpb-shadow="none"] .joe_aside__item { box-shadow: none !important; }

html[data-jzpb-shadow="s1"] .joe_list__item:hover, html[data-jzpb-shadow="s1"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(245,158,11,.45) !important; }
html[data-jzpb-shadow="s2"] .joe_list__item:hover, html[data-jzpb-shadow="s2"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(234,88,12,.5) !important; }
html[data-jzpb-shadow="s3"] .joe_list__item:hover, html[data-jzpb-shadow="s3"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(180,120,40,.45) !important; }
html[data-jzpb-shadow="s4"] .joe_list__item:hover, html[data-jzpb-shadow="s4"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(176,102,54,.5) !important; }
html[data-jzpb-shadow="s5"] .joe_list__item:hover, html[data-jzpb-shadow="s5"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(217,200,30,.5) !important; }
html[data-jzpb-shadow="s6"] .joe_list__item:hover, html[data-jzpb-shadow="s6"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(101,163,13,.42) !important; }
html[data-jzpb-shadow="s7"] .joe_list__item:hover, html[data-jzpb-shadow="s7"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(5,150,105,.4) !important; }
html[data-jzpb-shadow="s8"] .joe_list__item:hover, html[data-jzpb-shadow="s8"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(16,185,129,.4) !important; }
html[data-jzpb-shadow="s9"] .joe_list__item:hover, html[data-jzpb-shadow="s9"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(8,145,178,.42) !important; }
html[data-jzpb-shadow="s10"] .joe_list__item:hover, html[data-jzpb-shadow="s10"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(14,165,180,.42) !important; }
html[data-jzpb-shadow="s11"] .joe_list__item:hover, html[data-jzpb-shadow="s11"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(79,70,229,.4) !important; }
html[data-jzpb-shadow="s12"] .joe_list__item:hover, html[data-jzpb-shadow="s12"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(100,116,139,.42) !important; }
html[data-jzpb-shadow="s13"] .joe_list__item:hover, html[data-jzpb-shadow="s13"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(124,58,237,.42) !important; }
html[data-jzpb-shadow="s14"] .joe_list__item:hover, html[data-jzpb-shadow="s14"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(139,92,246,.4) !important; }
html[data-jzpb-shadow="s15"] .joe_list__item:hover, html[data-jzpb-shadow="s15"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(225,29,72,.42) !important; }
html[data-jzpb-shadow="s16"] .joe_list__item:hover, html[data-jzpb-shadow="s16"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(244,114,182,.42) !important; }
html[data-jzpb-shadow="s17"] .joe_list__item:hover, html[data-jzpb-shadow="s17"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(251,146,160,.45) !important; }
html[data-jzpb-shadow="s18"] .joe_list__item:hover, html[data-jzpb-shadow="s18"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(220,60,70,.45) !important; }
html[data-jzpb-shadow="s19"] .joe_list__item:hover, html[data-jzpb-shadow="s19"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(255,99,71,.45) !important; }
html[data-jzpb-shadow="s20"] .joe_list__item:hover, html[data-jzpb-shadow="s20"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(190,30,80,.45) !important; }
html[data-jzpb-shadow="s21"] .joe_list__item:hover, html[data-jzpb-shadow="s21"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(120,85,60,.45) !important; }
html[data-jzpb-shadow="s22"] .joe_list__item:hover, html[data-jzpb-shadow="s22"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(109,66,45,.45) !important; }
html[data-jzpb-shadow="s23"] .joe_list__item:hover, html[data-jzpb-shadow="s23"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(30,41,59,.5) !important; }
html[data-jzpb-shadow="s24"] .joe_list__item:hover, html[data-jzpb-shadow="s24"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(148,163,184,.45) !important; }
html[data-jzpb-shadow="s25"] .joe_list__item:hover, html[data-jzpb-shadow="s25"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(16,200,120,.5), 0 2px 10px rgba(34,197,94,.25) !important; }
html[data-jzpb-shadow="s26"] .joe_list__item:hover, html[data-jzpb-shadow="s26"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(34,211,238,.5), 0 2px 10px rgba(6,182,212,.25) !important; }
html[data-jzpb-shadow="s27"] .joe_list__item:hover, html[data-jzpb-shadow="s27"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(255,46,150,.5), 0 2px 14px rgba(255,46,150,.2) !important; }
html[data-jzpb-shadow="s28"] .joe_list__item:hover, html[data-jzpb-shadow="s28"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px rgba(168,85,247,.5), 0 2px 14px rgba(168,85,247,.22) !important; }
html[data-jzpb-shadow="s29"] .joe_list__item:hover, html[data-jzpb-shadow="s29"] .joe_aside__item:hover { box-shadow: 0 12px 30px -8px rgba(239,68,68,.4), 0 2px 18px rgba(245,158,11,.35) !important; }
html[data-jzpb-shadow="s30"] .joe_list__item:hover, html[data-jzpb-shadow="s30"] .joe_aside__item:hover { box-shadow: 0 12px 30px -8px rgba(14,165,180,.4), 0 2px 18px rgba(59,130,246,.3) !important; }
html[data-jzpb-shadow="s31"] .joe_list__item:hover, html[data-jzpb-shadow="s31"] .joe_aside__item:hover { box-shadow: 0 12px 30px -8px rgba(5,150,105,.4), 0 2px 18px rgba(132,204,22,.3) !important; }
html[data-jzpb-shadow="s32"] .joe_list__item:hover, html[data-jzpb-shadow="s32"] .joe_aside__item:hover { box-shadow: 0 12px 30px -8px rgba(236,72,153,.4), 0 2px 18px rgba(245,158,11,.32) !important; }
html[data-jzpb-shadow="s33"] .joe_list__item:hover, html[data-jzpb-shadow="s33"] .joe_aside__item:hover { box-shadow: 0 8px 24px -6px rgba(244,63,94,.32), 0 8px 24px -6px rgba(245,158,11,.32), 0 8px 24px -6px rgba(34,197,94,.32) !important; }
html[data-jzpb-shadow="s34"] .joe_list__item:hover, html[data-jzpb-shadow="s34"] .joe_aside__item:hover { box-shadow: 0 8px 24px -6px rgba(202,138,4,.35), 0 8px 24px -6px rgba(120,113,70,.3) !important; }
html[data-jzpb-shadow="s35"] .joe_list__item:hover, html[data-jzpb-shadow="s35"] .joe_aside__item:hover { box-shadow: 0 6px 20px -6px rgba(125,211,252,.4), 0 10px 30px -10px rgba(196,181,253,.4) !important; }
html[data-jzpb-shadow="custom"] .joe_list__item:hover,
html[data-jzpb-shadow="custom"] .joe_aside__item:hover { box-shadow: 0 14px 34px -10px var(--jzpb-shadow-custom, rgba(0,0,0,.3)) !important; }

/* 卡片悬停浮起 */
html[data-jzpb-cardhover="1"] .joe_list__item:hover,
html[data-jzpb-cardhover="1"] .joe_aside__item:hover { transform: translateY(-4px); }

/* ===================== ③ 版心宽度 ===================== */
html[data-jzpb-width="std"] .joe_container { max-width: 1280px !important; }
html[data-jzpb-width="wide"] .joe_container { max-width: 1520px !important; }

/* ===================== ④ 全站无侧栏 ===================== */
html[data-jzpb-noside="1"] .joe_aside { display: none !important; }
html[data-jzpb-noside="1"] .joe_main,
html[data-jzpb-noside="1"] .joe_container .joe_main { width: 100% !important; max-width: 100% !important; flex: 0 0 100% !important; padding-right: 0 !important; }

/* ===================== ④ 列表：经典/网格 + 列数 + 封面高（桌面 ≥769px） ===================== */
@media screen and (min-width: 769px) {
    html[data-jzpb-list="grid"] .joe_archive .joe_list,
    html[data-jzpb-list="grid"] .joe_index__list .joe_list { display: grid !important; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 18px; }
    html[data-jzpb-cols="2"][data-jzpb-list="grid"] .joe_list { grid-template-columns: repeat(2, minmax(0,1fr)); }
    html[data-jzpb-cols="3"][data-jzpb-list="grid"] .joe_list { grid-template-columns: repeat(3, minmax(0,1fr)); }
    html[data-jzpb-cols="4"][data-jzpb-list="grid"] .joe_list { grid-template-columns: repeat(4, minmax(0,1fr)); }

    html[data-jzpb-list="grid"] .joe_list > .joe_list__item { display: block !important; width: 100% !important; margin: 0 !important; }
    html[data-jzpb-list="grid"] .joe_list__item .thumbnail { display: block; width: 100% !important; height: 180px; }
    html[data-jzpb-list="grid"] .joe_list__item .thumbnail img { height: 100% !important; width: 100% !important; object-fit: cover; }
    html[data-jzpb-list="grid"] .joe_list__item .information { display: block !important; padding: 14px 16px !important; }
    html[data-jzpb-list="grid"] .joe_list__item .abstract { display: block; height: 42px; overflow: hidden; }
    html[data-jzpb-list="grid"] .joe_list__item .meta { display: block; }
    html[data-jzpb-list="grid"] .joe_list__item .meta .items { display: flex; flex-wrap: wrap; gap: 12px; }

    html[data-jzpb-list="classic"] .joe_list__item .thumbnail { height: var(--jzpb-thumb-h, auto) !important; }

    /* 网格模式下滚动文章条跨满整行 */
    html[data-jzpb-list="grid"] .joe_list .jzpb-roll-li { grid-column: 1 / -1; }
}
/* 封面高度（不切换列表模式、仅加高封面；两端都生效） */
html[data-jzpb-thumb="1"] .joe_list__item .thumbnail { transition: height .3s; }
@media screen and (min-width: 769px) {
    html[data-jzpb-thumb="1"]:not([data-jzpb-list="grid"]) .joe_list__item .thumbnail { height: var(--jzpb-thumb-h) !important; }
}

/* 移动端列表模式 */
@media screen and (max-width: 768px) {
    html[data-jzpb-listm="grid"] .joe_archive .joe_list,
    html[data-jzpb-listm="grid"] .joe_index__list .joe_list { display: grid !important; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
    html[data-jzpb-colsm="3"][data-jzpb-listm="grid"] .joe_list { grid-template-columns: repeat(3, minmax(0,1fr)); }
    html[data-jzpb-listm="grid"] .joe_list > .joe_list__item { display: block !important; width: 100% !important; margin: 0 !important; }
    html[data-jzpb-listm="grid"] .joe_list__item .thumbnail { display: block; width: 100% !important; height: 130px; }
    html[data-jzpb-listm="grid"] .joe_list__item .information { display: block !important; padding: 10px 12px !important; }
    html[data-jzpb-listm="grid"] .joe_list__item .abstract { display: none; }
    html[data-jzpb-listm="classic"] .joe_list > .joe_list__item { display: flex !important; }
    html[data-jzpb-listm="classic"] .joe_list__item .thumbnail { display: block; width: 130px !important; height: 100px !important; flex: 0 0 130px; }
    html[data-jzpb-listm="classic"] .joe_list__item .information { display: block !important; }
    html[data-jzpb-thumb="1"][data-jzpb-listm="classic"] .joe_list__item .thumbnail { height: var(--jzpb-thumb-h) !important; }
    html[data-jzpb-listm="grid"] .joe_list .jzpb-roll-li { grid-column: 1 / -1; }
}

/* ===================== ④ 滚动文章条 ===================== */
.jzpb-roll-li { list-style: none !important; width: 100% !important; flex: 0 0 100% !important; padding: 0 !important; margin: 0 0 16px !important; border: 0 !important; background: none !important; }
.jzpb-roll {
    display: flex; align-items: center; gap: 12px;
    padding: 10px 16px; border-radius: 10px;
    background: var(--background, #fff);
    border: 1px solid rgba(0,0,0,.06);
    overflow: hidden; position: relative;
}
html[data-night="night"] .jzpb-roll { border-color: rgba(255,255,255,.08); }
.jzpb-roll__label {
    flex: 0 0 auto; display: inline-flex; align-items: center; gap: 4px;
    font-size: 13px; font-weight: 700; color: var(--theme);
    background: currentColor; -webkit-background-clip: initial;
    padding: 3px 10px; border-radius: 999px; color: #fff !important;
    background: linear-gradient(135deg, var(--theme), color-mix(in srgb, var(--theme) 55%, #ff8a00)) !important;
}
.jzpb-roll__viewport { flex: 1 1 auto; overflow: hidden; mask-image: linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent); }
.jzpb-roll__track { display: inline-flex; gap: 28px; white-space: nowrap; width: max-content; animation: jzpbRoll var(--jzpb-roll-speed,30s) linear infinite; }
.jzpb-roll--left .jzpb-roll__track { animation-name: jzpbRollL; }
.jzpb-roll--right .jzpb-roll__track { animation-name: jzpbRollR; animation-direction: reverse; }
.jzpb-roll--none .jzpb-roll__track { animation: none; flex-wrap: wrap; white-space: normal; gap: 10px 20px; width: 100%; }
.jzpb-roll__item { display: inline-flex; align-items: center; gap: 6px; font-size: 13.5px; color: var(--main,#303133); text-decoration: none; transition: color .25s; }
.jzpb-roll__item:hover { color: var(--theme); }
.jzpb-roll__item svg { color: var(--theme); flex: 0 0 auto; }
.jzpb-roll:hover .jzpb-roll__track { animation-play-state: paused; }
@keyframes jzpbRollL { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes jzpbRollR { from { transform: translateX(-50%); } to { transform: translateX(0); } }

/* ===================== ④ 列表标签 chips ===================== */
.jzpb-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.jzpb-tag {
    display: inline-flex; align-items: center; height: 22px; padding: 0 10px;
    font-size: 12px; line-height: 22px; border-radius: 999px; text-decoration: none;
    color: var(--theme); background: transparent; border: 1px solid currentColor;
    opacity: .85; transition: all .25s;
}
.jzpb-tag:hover { opacity: 1; color: #fff !important; background: var(--theme); }
.jzpb-tags .jzpb-tag:nth-child(3n+1) { color: #0d9488; }
.jzpb-tags .jzpb-tag:nth-child(3n+2) { color: #d97706; }
.jzpb-tags .jzpb-tag:nth-child(3n)   { color: #e11d48; }
html[data-night="night"] .jzpb-tags .jzpb-tag:nth-child(3n+1) { color: #2dd4bf; }
html[data-night="night"] .jzpb-tags .jzpb-tag:nth-child(3n+2) { color: #fbbf24; }
html[data-night="night"] .jzpb-tags .jzpb-tag:nth-child(3n)   { color: #fb7185; }

/* 文章页自动关键词标签区（标题下方） */
.jzpb-auto-tags { margin: 6px 0 16px; }
.jzpb-auto-tags .jzpb-tag::before { content: "#"; margin-right: 2px; }

/* ===================== ⑤ 标题随机色（颜色由 JS 按文章 ID 固定注入） ===================== */
.jzpb-title-colored { color: var(--jzpb-tc, var(--theme)) !important; }
.jzpb-title-colored:hover { color: var(--jzpb-tc, var(--theme)) !important; opacity: .82; }

/* ===================== ⑦ 站长名片吸附 / 壁纸 ===================== */
@media screen and (min-width: 992px) {
    html[data-jzpb-bsticky="1"] .joe_aside .joe_aside__item.author {
        position: sticky; top: 16px; z-index: 20;
    }
}

/* ===================== ⑦ 侧栏：签到排行榜 ===================== */
.jzpb-signrank__list { list-style: none; margin: 0; padding: 4px 0; }
.jzpb-signrank__item { display: flex; align-items: center; gap: 10px; padding: 7px 2px; }
.jzpb-signrank__no {
    flex: 0 0 22px; width: 22px; height: 22px; border-radius: 6px;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 12px; font-weight: 700; color: #94a3b8; background: rgba(148,163,184,.16);
}
.jzpb-signrank__item.rank-1 .jzpb-signrank__no { color: #fff; background: linear-gradient(135deg,#f59e0b,#ef4444); }
.jzpb-signrank__item.rank-2 .jzpb-signrank__no { color: #fff; background: linear-gradient(135deg,#94a3b8,#64748b); }
.jzpb-signrank__item.rank-3 .jzpb-signrank__no { color: #fff; background: linear-gradient(135deg,#d97706,#b45309); }
.jzpb-signrank__avatar { width: 32px !important; height: 32px !important; border-radius: 50% !important; object-fit: cover; flex: 0 0 32px; }
.jzpb-signrank__name { flex: 1 1 auto; font-size: 13.5px; color: var(--main); text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.jzpb-signrank__name:hover { color: var(--theme); }
.jzpb-signrank__cnt { flex: 0 0 auto; font-size: 12px; color: var(--theme); font-weight: 600; }
.jzpb-signrank__btn {
    display: flex; align-items: center; justify-content: center; gap: 6px;
    margin: 10px 4px 4px; height: 38px; border-radius: 999px;
    color: #fff !important; text-decoration: none; font-size: 13.5px; font-weight: 600;
    background: linear-gradient(135deg, var(--theme), color-mix(in srgb, var(--theme) 55%, #ff8a00));
    transition: transform .25s, box-shadow .25s;
}
.jzpb-signrank__btn:hover { transform: translateY(-1px); box-shadow: 0 6px 18px -6px var(--theme); color: #fff !important; }

/* ===================== ⑦ 侧栏：文章列表模块 ===================== */
.jzpb-sideposts__list { list-style: none; margin: 0; padding: 0; }
.jzpb-sideposts__item + .jzpb-sideposts__item { margin-top: 12px; }
.jzpb-sideposts__item a { display: flex; gap: 10px; text-decoration: none; color: var(--main); }
.jzpb-sideposts__thumb { position: relative; flex: 0 0 108px; width: 108px; height: 70px; border-radius: 8px; overflow: hidden; }
.jzpb-sideposts__thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.jzpb-sideposts__item a:hover .jzpb-sideposts__thumb img { transform: scale(1.08); }
.jzpb-sideposts__info { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; justify-content: space-between; }
.jzpb-sideposts__title {
    margin: 0; font-size: 13.5px; font-weight: 600; line-height: 1.5;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.jzpb-sideposts__item a:hover .jzpb-sideposts__title { color: var(--theme); }
.jzpb-sideposts__meta { display: flex; gap: 10px; font-size: 12px; opacity: .65; }
/* 第 1 条大图 */
.jzpb-sideposts__item.is-first { margin-bottom: 14px; }
.jzpb-sideposts__item.is-first a { display: block; }
.jzpb-sideposts__item.is-first .jzpb-sideposts__thumb { width: 100%; flex-basis: auto; height: 150px; border-radius: 10px; }
.jzpb-sideposts__item.is-first .jzpb-sideposts__info { margin-top: 8px; }
.jzpb-sideposts__item.is-first .jzpb-sideposts__title { font-size: 15px; -webkit-line-clamp: 1; }
.jzpb-sideposts__flag {
    position: absolute; left: 8px; top: 8px; z-index: 2;
    font-size: 11px; padding: 2px 8px; border-radius: 999px; color: #fff;
    background: linear-gradient(135deg, var(--theme), color-mix(in srgb, var(--theme) 50%, #ff8a00));
}

/* ===================== ⑥ 评论：楼层 / 用户等级徽章 开关 ===================== */
html[data-jzpb-floor="0"] .badg-floor { display: none !important; }
html[data-jzpb-badge="0"] .jz-member-badge,
html[data-jzpb-badge="0"] .jz-lv-badge,
html[data-jzpb-badge="0"] .jz-lv-badge-img { display: none !important; }

/* 自定义表情追加项 */
.jzpb-emo-item img { width: 24px; height: 24px; object-fit: contain; vertical-align: middle; cursor: pointer; }

/* ===================== ⑧ 粒子星河背景 ===================== */
#jzpb-bgfx { position: fixed; inset: 0; z-index: 0; pointer-events: none; }
body:has(#jzpb-bgfx) > *:not(#jzpb-bgfx) { position: relative; z-index: 1; }

/* ===================== ⑧ 头像彩色旋转光环（纯 CSS 蒙版） ===================== */
html[data-jzpb-avaring="1"] img.jzfx-avatar-img,
html[data-jzpb-avaring="1"] .comt-avatar img { border-radius: 50%; }
html[data-jzpb-avaring="1"] .comt-avatar,
html[data-jzpb-avaring="1"] .joe_aside__item.author .avatar,
html[data-jzpb-avaring="1"] .jzpb-signrank__avatar { position: relative; z-index: 0; }
html[data-jzpb-avaring="1"] .comt-avatar::before,
html[data-jzpb-avaring="1"] .joe_aside__item.author .avatar::before,
html[data-jzpb-avaring="1"] .jzpb-signrank__avatar::before {
    content: ""; position: absolute; inset: -3px; border-radius: 50%; z-index: -1;
    background: conic-gradient(from 0deg, #f43f5e, #f59e0b, #10b981, #06b6d4, #8b5cf6, #f43f5e);
    animation: jzpbSpin 4s linear infinite; opacity: .9;
}
html[data-jzpb-avaring="1"] .joe_aside__item.author .avatar::before { inset: -4px; }
@keyframes jzpbSpin { to { transform: rotate(360deg); } }

/* ===================== ⑧ 滚动淡入上浮 ===================== */
.jzpb-fade { opacity: 0; transform: translateY(26px); transition: opacity .6s ease, transform .6s cubic-bezier(.22,.61,.36,1); will-change: opacity, transform; }
.jzpb-fade.jzpb-in { opacity: 1; transform: none; }

/* ===================== ⑧ 翻页横滑 + 顶部进度条 ===================== */
.jzpb-turn-bar {
    position: fixed; top: 0; left: 0; height: 3px; width: 0; z-index: 99999;
    background: linear-gradient(90deg, var(--theme), #ff8a00);
    box-shadow: 0 0 10px var(--theme); border-radius: 0 3px 3px 0;
    transition: width .25s ease; pointer-events: none;
}
#Juzi { transform-origin: center; }

/* ===================== ⑧ 12 种整页转场 ===================== */
.jzpb-flip-veil {
    position: fixed; inset: 0; z-index: 99998; pointer-events: none;
    background: var(--background, #fff); opacity: 0;
    transition: opacity .3s ease;
}
html[data-night="night"] .jzpb-flip-veil { background: #1b1b1b; }
html.jzpb-leaving .jzpb-flip-veil { opacity: 1; }

/* 离场：#Juzi 动作 */
html.jzpb-leaving[data-jzpb-flip] #Juzi { transition: transform .32s cubic-bezier(.4,0,.2,1), opacity .32s ease, filter .32s ease; }
html.jzpb-leaving[data-jzpb-flip="slide-l"] #Juzi { transform: translateX(-10%); opacity: .25; }
html.jzpb-leaving[data-jzpb-flip="slide-r"] #Juzi { transform: translateX(10%); opacity: .25; }
html.jzpb-leaving[data-jzpb-flip="slide-u"] #Juzi { transform: translateY(-8%); opacity: .25; }
html.jzpb-leaving[data-jzpb-flip="slide-d"] #Juzi { transform: translateY(8%); opacity: .25; }
html.jzpb-leaving[data-jzpb-flip="zoom-in"] #Juzi { transform: scale(1.08); opacity: 0; }
html.jzpb-leaving[data-jzpb-flip="zoom-out"] #Juzi { transform: scale(.94); opacity: 0; }
html.jzpb-leaving[data-jzpb-flip="fade"] #Juzi { opacity: 0; }
html.jzpb-leaving[data-jzpb-flip="blur"] #Juzi { filter: blur(14px) saturate(1.4); transform: scale(1.04); opacity: 0; }
html.jzpb-leaving[data-jzpb-flip="flip-x"] #Juzi { transform: perspective(1200px) rotateX(12deg) scale(.96); opacity: 0; }
html.jzpb-leaving[data-jzpb-flip="flip-y"] #Juzi { transform: perspective(1200px) rotateY(-14deg) scale(.96); opacity: 0; }
html.jzpb-leaving[data-jzpb-flip="wave"] #Juzi { transform: perspective(900px) translateY(-6%) rotateX(8deg); opacity: 0; }
html.jzpb-leaving[data-jzpb-flip="circle"] #Juzi { opacity: 0; }

/* 圆形展开遮罩 */
.jzpb-circle-mask {
    position: fixed; inset: 0; z-index: 99997; pointer-events: none;
    background: var(--theme); opacity: .92;
    clip-path: circle(0% at 50% 60%);
}
html.jzpb-leaving[data-jzpb-flip="circle"] .jzpb-circle-mask {
    transition: clip-path .4s cubic-bezier(.4,0,.2,1);
    clip-path: circle(160% at 50% 60%);
}

/* 入场：新页面 #Juzi 起始态 → 归位（由 jzpb.js 加 jzpb-enter 后下一帧移除） */
html.jzpb-enter #Juzi { transition: transform .38s cubic-bezier(.22,.61,.36,1), opacity .38s ease, filter .38s ease; }
html.jzpb-enter[data-jzpb-flip="slide-l"] #Juzi { transform: translateX(10%); opacity: 0; }
html.jzpb-enter[data-jzpb-flip="slide-r"] #Juzi { transform: translateX(-10%); opacity: 0; }
html.jzpb-enter[data-jzpb-flip="slide-u"] #Juzi { transform: translateY(8%); opacity: 0; }
html.jzpb-enter[data-jzpb-flip="slide-d"] #Juzi { transform: translateY(-8%); opacity: 0; }
html.jzpb-enter[data-jzpb-flip="zoom-in"] #Juzi { transform: scale(.94); opacity: 0; }
html.jzpb-enter[data-jzpb-flip="zoom-out"] #Juzi { transform: scale(1.06); opacity: 0; }
html.jzpb-enter[data-jzpb-flip="fade"] #Juzi { opacity: 0; }
html.jzpb-enter[data-jzpb-flip="blur"] #Juzi { filter: blur(14px); opacity: 0; }
html.jzpb-enter[data-jzpb-flip="flip-x"] #Juzi { transform: perspective(1200px) rotateX(-10deg) scale(.97); opacity: 0; }
html.jzpb-enter[data-jzpb-flip="flip-y"] #Juzi { transform: perspective(1200px) rotateY(14deg) scale(.97); opacity: 0; }
html.jzpb-enter[data-jzpb-flip="wave"] #Juzi { transform: perspective(900px) translateY(6%) rotateX(-8deg); opacity: 0; }
html.jzpb-enter[data-jzpb-flip="circle"] #Juzi { }
html.jzpb-enter .jzpb-circle-mask { clip-path: circle(160% at 50% 60%); }
html.jzpb-enter.jzpb-circle-out .jzpb-circle-mask {
    transition: clip-path .45s cubic-bezier(.22,.61,.36,1);
    clip-path: circle(0% at 50% 60%);
}

/* 打开文章卡放大浮起 */
.jzpb-opening .joe_list__item { transition: opacity .25s, transform .25s; }
.jzpb-opening .joe_list__item:not(.jzpb-open-card) { opacity: .35; transform: scale(.985); }
.jzpb-opening .jzpb-open-card { transform: scale(1.045) translateY(-6px); z-index: 5; box-shadow: 0 24px 60px -12px rgba(0,0,0,.3) !important; }

/* 翻页横滑（分页跳转） */
html.jzpb-pageout .joe_main,
html.jzpb-pageout .joe_archive,
html.jzpb-pageout .joe_index { transition: transform .3s ease, opacity .3s ease; transform: translateX(-6%); opacity: .2; }
html.jzpb-pagein .joe_main,
html.jzpb-pagein .joe_archive,
html.jzpb-pagein .joe_index { animation: jzpbPageIn .38s cubic-bezier(.22,.61,.36,1); }
@keyframes jzpbPageIn { from { transform: translateX(6%); opacity: 0; } to { transform: none; opacity: 1; } }

/* ===================== 省流模式：全部动画关闭 ===================== */
@media (prefers-reduced-motion: reduce) {
    .jzpb-fade { opacity: 1 !important; transform: none !important; transition: none !important; }
    .jzpb-roll__track { animation: none !important; }
    html[data-jzpb-avaring] .comt-avatar::before,
    html[data-jzpb-avaring] .avatar::before { animation: none !important; }
    html.jzpb-leaving #Juzi, html.jzpb-enter #Juzi { transition: none !important; transform: none !important; opacity: 1 !important; filter: none !important; }
    .jzpb-circle-mask, .jzpb-flip-veil { display: none !important; }
}
