/* pengyouquan.css —— 主题主样式（原创重写，clean-room）
 * 视觉风格：仿微信朋友圈的信息流卡片。类名/ID 与 PHP 模板、JS 契约保持一致，
 * 但全部规则为本主题独立实现，不复制任何第三方主题的字面代码。
 * 依赖 RemixIcon（图标）与 fancyBox（灯箱，由 JS 调用）。 */

/* ============ 设计令牌 ============ */
:root {
    --theme: #09c362;
    --themetm: rgba(9, 195, 98, 0.12);
    --thetitle: #2b7de0;
    --protext: #ff8c00;
    --protextbg: #fff4e6;
    --backbg: #f5f5f5;
    --cobg: #ffffff;
    --bganh: rgba(0, 0, 0, 0.04);
    --textqh: #2c2c2c;
    --textbs: #ffffff;
    --texths: #9a9a9a;
    --fgxys: #ededed;
    --iconhs: #9a9a9a;
    --iconbs: #ffffff;
    --bodys: #f2f2f2;
    --dzplcdfg: #f0f0f0;
    --dbztlys: #ffffff;
    --dbztlysh: rgba(255, 255, 255, 0);
    --dbztlyshs: rgba(0, 0, 0, 0.25);
    --gdwys: #cdcdcd;
    --zsgfh: rgba(0, 0, 0, 0.05);
    --imgbgy: #f0f0f0;
    --menu: #ffffff;
    --adgg: #f0f0f0;

    /* 顶栏按钮令牌（pyq-topbar-scroll.js 通过 .pyq-topbar-scrolled 切换） */
    --topbar-btn-size: 40px;
    --topbar-btn-icon: 20px;
    --topbar-btn-gap: 10px;
    --topbar-btn-radius: 12px;
    --topbar-btn-border: 1px solid rgba(0, 0, 0, 0.05);
    --topbar-btn-bg: rgba(255, 255, 255, 0.85);
    --topbar-btn-icon-color: #444;
    --topbar-btn-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    --topbar-btn-transition: all 0.3s ease;
}

html.dark-theme,
body.dark-theme,
.dark-theme {
    --theme: #1aad6f;
    --themetm: rgba(26, 173, 111, 0.18);
    --thetitle: #4ea1ff;
    --backbg: #161616;
    --cobg: #1e1e1e;
    --bganh: rgba(255, 255, 255, 0.06);
    --textqh: #e6e6e6;
    --textbs: #e6e6e6;
    --texths: #8a8a8a;
    --fgxys: #2c2c2c;
    --iconhs: #8a8a8a;
    --iconbs: #e6e6e6;
    --bodys: #121212;
    --dzplcdfg: #2a2a2a;
    --dbztlys: #1e1e1e;
    --dbztlysh: rgba(20, 20, 20, 0);
    --dbztlyshs: rgba(0, 0, 0, 0.5);
    --gdwys: #3a3a3a;
    --zsgfh: rgba(255, 255, 255, 0.05);
    --imgbgy: #2a2a2a;
    --menu: #1e1e1e;
    --adgg: #262626;

    --topbar-btn-bg: rgba(40, 40, 40, 0.85);
    --topbar-btn-icon-color: #ddd;
    --topbar-btn-border: 1px solid rgba(255, 255, 255, 0.08);
}

/* ============ 布局容器 ============ */
.centent {
    min-height: 100vh;
}

.pyq-main {
    max-width: 640px;
    margin: 0 auto;
    background: var(--bodys);
    min-height: 100vh;
    position: relative;
}

.pyq-nrbk {
    padding: 10px 0 60px;
}

.pyq-homecontent {
    padding: 0 12px;
}

/* ============ 顶部封面 + 资料 ============ */
.pyq-main-head {
    position: relative;
}

.pyq-main-head-img {
    width: 100%;
    height: var(--pyq-cover-h, 200px);   /* 跟随主题设置 cover_height（由 header.php 注入变量） */
    background-size: cover;
    background-position: center;
    background-color: var(--imgbgy);
}

.pyq-bg-video {
    width: 100%;
    height: 100%;                        /* 填满海报容器（高度由 --pyq-cover-h 决定） */
    object-fit: cover;
}

.pyq-main-head-headimg {
    position: relative;
    padding: 0 16px;
    margin-top: -46px;
}

.pyq-main-head-headimg-tx {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;   /* 昵称/签名紧贴右侧头像，去掉两端大留白 */
    gap: 10px;
}

.pyq-main-head-headimg-tx > a img {
    width: 72px;
    height: 72px;
    border-radius: 8px;
    border: 3px solid var(--cobg);
    object-fit: cover;
}

.pyq-main-head-headimg-info {
    text-align: right;
    padding-bottom: 8px;
}

.pyq-main-head-headimg-info h4 {
    margin: 0;
    font-size: 18px;
    color: #fff;                                  /* 站长昵称：白色 */
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);   /* 叠在海报上保证可读 */
}

.pyq-main-head-headimg-qm {
    margin: 4px 0 0;
    font-size: 13px;
    color: var(--texths);
}

/* ============ 顶栏导航 ============ */
.pyq-main-head-top {
    position: sticky;
    top: 0;
    z-index: 50;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 52px;
    padding: 0 14px;
    margin-bottom: -52px;   /* 上提封面：让按钮初始就叠在封面顶部，而非页面最顶部 */
    background: var(--dbztlysh);
    transition: var(--topbar-btn-transition);
}

.pyq-main-head-top-left,
.pyq-main-head-top-right {
    display: flex;
    align-items: center;
    gap: var(--topbar-btn-gap);
}

.pyq-main-head-top-left-s,
.pyq-main-head-top-right-s {
    width: var(--topbar-btn-size);
    height: var(--topbar-btn-size);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--topbar-btn-radius);
    border: var(--topbar-btn-border);
    background: transparent;
    box-shadow: var(--topbar-btn-shadow);
    color: var(--topbar-btn-icon-color);
    cursor: pointer;
    transition: var(--topbar-btn-transition);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
}

.pyq-main-head-top-left-s .ri-sxzytx,
.pyq-main-head-top-right-s .ri-sx {
    font-size: var(--topbar-btn-icon);
    color: var(--topbar-btn-icon-color);
}

/* 滚动后的顶栏实底态（JS 加 .pyq-topbar-scrolled 到 html 与本元素） */
.pyq-topbar-scrolled .pyq-main-head-top,
html.pyq-topbar-scrolled .pyq-main-head-top {
    background: var(--dbztlys);
    box-shadow: 0 1px 0 var(--fgxys);
}

/* 悬浮：菜单按钮背景变白（覆盖各状态下的透明背景） */
.pyq-main-head-top-left-s:hover,
.pyq-main-head-top-right-s:hover,
.pyq-topbar-scrolled .pyq-main-head-top-left-s:hover,
.pyq-topbar-scrolled .pyq-main-head-top-right-s:hover,
html.pyq-topbar-scrolled .pyq-main-head-top-left-s:hover,
html.pyq-topbar-scrolled .pyq-main-head-top-right-s:hover {
    background: #fff;
}

/* ============ 动态卡片 ============ */
.pyq-content {
    display: flex;
    gap: 10px;
    background: var(--cobg);
    border-radius: 10px;
    padding: 14px;
    margin: 10px 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.pyq-content-left {
    flex: 0 0 38px;
}

.pyq-content-left img {
    width: 38px;
    height: 38px;
    border-radius: 6px;
    object-fit: cover;
    cursor: pointer;
}

.pyq-content-right {
    flex: 1 1 auto;
    min-width: 0;
}

.pyq-content-right-head {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}

.pyq-content-right-head-title p {
    margin: 0;
    color: var(--theme);
    font-weight: 600;
    font-size: 15px;
    cursor: pointer;
}

.pyq-content-right-head-title-ad {
    padding: 1px 6px;
    border-radius: 4px;
    font-size: 12px;
}

/* 状态徽标组（置顶/广告）：作为标题行最后一个弹性子项，靠右到卡片右上角 */
.pyq-content-right-head-ad {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-left: auto;
    line-height: 0.2;
}

/* 页脚 ICP 备案号（位于 .pyq-copyright 内，换行居中） */
.pyq-beian {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--texths);
    font-size: 12px;
}
.pyq-beian i {
    font-size: 13px;
}

.pyq-content-right-bt {
    display: inline;
    color: var(--texths);
    font-size: 14px;
}

.pyq-content-right-bt-sep {
    margin: 0 2px;
    color: var(--texths);
}

.pyq-content-qwdid {
    display: block;
    flex: 0 0 100%;   /* 作为 .pyq-content-right-head 的 flex 项必须占满整行：
                        否则正文只有绝对定位的第三方视频时，宽度会塌缩为 0 → 优酷/腾讯 iframe 完全不显示 */
    width: 100%;
    margin-top: 6px;
    color: var(--textqh);
    font-size: 15px;
    word-break: break-word;
}

/* 「阅读全文」：与正文/缩略图各自独占一行，并呈现为可点击链接 */
.pyq-content-quanwenan {
    flex: 0 0 100%;
    margin-top: 4px;
    color: var(--theme);
    font-size: 14px;
    cursor: pointer;
    user-select: none;
}

.pyq-content-qwdid img {
    max-width: 100%;
    height: auto;     /* 带 width/height 属性（如 WP 自动尺寸）时按比例缩放，避免被拉变形 */
    border-radius: 6px;
    margin: 6px 0;
}

/* 图片宫格 */
.pyq-content-right-img {
    flex: 0 0 100%;   /* 作为 .pyq-content-right-head 的 flex 子项必须占满整行，
                        否则会与「阅读全文」被 flex-wrap 挤到同一行 */
    display: grid;
    gap: 6px;
    margin-top: 8px;
}

.pyq-content-right-img.is-single {
    grid-template-columns: 1fr !important;
    max-width: 240px;
}

.pyq-content-right-img.is-flow {
    grid-template-columns: 1fr;
    gap: 8px;
}

.pyq-detail-flow .pyq-content-right-img-pic {
    aspect-ratio: auto;
    max-height: 420px;
}

.pyq-content-right-img-pic {
    position: relative;
    display: block;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    border-radius: 6px;
    background: var(--imgbgy);
}

.pyq-content-right-img-pic img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.pyq-content-right-img-pic-mask {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.45);
    color: #fff;
    font-size: 14px;
}

/* 音乐卡片 */
.music-play {
    margin-top: 8px;
    border-radius: 8px;
    overflow: hidden;
    background: var(--bganh);
}

.music-play-conten {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px;
    cursor: pointer;
    position: relative;
}

.music-play-bg,
.music-play-glass {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
}

.music-play-glass {
    background: var(--bganh);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}

.music-play-conten-left {
    position: relative;
    flex: 0 0 48px;
    height: 48px;
    border-radius: 6px;
    overflow: hidden;
    background-size: cover;
    background-position: center;
}

.music-play-conten-right {
    position: relative;
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-width: 0;
}

.conten-right-z-bt {
    display: block;
    color: var(--textqh);
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.conten-right-z-nr {
    display: block;
    color: var(--texths);
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.conten-right-y-tb {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--theme);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 18px;
}

/* 视频 */
.pyq-video {
    position: relative;
    margin-top: 8px;
    border-radius: 6px;
    overflow: hidden;
    background: #000;
    aspect-ratio: 16 / 9;
}

.pyq-content-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

#pyq-content-videog {
    position: absolute;
    top: 6px;
    right: 6px;
    z-index: 2;
    color: #fff;
    font-size: 20px;
    cursor: pointer;
    background: rgba(0, 0, 0, 0.4);
    border-radius: 50%;
    padding: 2px;
}

.pyq-video-span {
    position: absolute;
    left: 10px;
    bottom: 10px;
    z-index: 2;
    color: #fff;
    font-size: 12px;
    background: rgba(0, 0, 0, 0.4);
    padding: 2px 8px;
    border-radius: 10px;
}

/* 操作行 */
.pyq-content-right-time {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 8px;
}

.pyq-content-right-time-left span {
    color: var(--texths);
    font-size: 13px;
}

.pyq-content-right-time-right {
    display: flex;
    align-items: center;
    gap: 14px;
}

.pyq-content-right-time-right-left {
    display: flex;
    align-items: center;
    gap: 14px;
}

.pyq-content-right-time-right-left-z,
.pyq-content-right-time-right-left-y {
    display: flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
    color: var(--textqh);
    font-size: 14px;
}

.pyq-content-right-time-right-left-z .ri-sxdzlike {
    color: var(--iconhs);
}

.pyq-content-right-time-right-left-y .ri-sxdzcomm {
    color: var(--iconhs);
}

.ri-heart-3-fill {
    color: #fa5151 !important;
}

/* 点赞 + 评论区 */
.pyq-zanp {
    margin-top: 8px;
    background: var(--bganh);
    border-radius: 8px;
    padding: 8px 10px;
}

.pyq-zanp-zan {
    display: none;
    align-items: flex-start;
    gap: 6px;
    padding-bottom: 6px;
    border-bottom: 1px solid var(--dzplcdfg);
}

.pyq-zanp-zan-left .ri-sxwzlike {
    color: #fa5151;
}

.pyq-zanp-zan-right {
    list-style: none;
    margin: 0;
    padding: 0;
    flex: 1 1 auto;
}

.pyq-zanp-zan-right li {
    font-size: 14px;
    color: var(--textqh);
}

.pyq-like-text {
    color: var(--textqh);
}

.pyq-zanp-pl {
    list-style: none;
    margin: 6px 0 0;
    padding: 0;
}

.pyq-zanp-pl li {
    font-size: 14px;
    line-height: 1.7;
    padding: 2px 0;
    cursor: pointer;
}

.pyq-zanp-pl-n-nc {
    color: var(--thetitle);
    font-weight: 600;
}

.pyq-zanp-pl-n-huifu {
    color: var(--texths);
}

.pyq-zanp-pl-n-nr {
    color: var(--textqh);
}

.pyq-zanp-pl-ku {
    margin-top: 4px;
}

.pyq-zanp-pl-gd {
    display: inline-block;
    color: var(--texths);
    font-size: 13px;
}

/* ============ 页脚版权 + 悬浮菜单 ============ */
.pyq-copyright {
    text-align: center;
    color: var(--texths);
    font-size: 12px;
    padding: 18px 12px 40px;
}

.pyq-menu {
    position: fixed;
    right: 16px;
    bottom: 24px;
    z-index: 60;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.pyq-menu-k {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--menu);
    color: var(--topbar-btn-icon-color);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12);
    cursor: pointer;
}

/* ============ 全局音乐悬浮播放器 ============ */
.pyq-float-player {
    position: fixed;
    right: 16px;
    bottom: 84px;
    z-index: 61;
    width: 220px;
    background: var(--cobg);
    border-radius: 10px;
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.18);
    overflow: hidden;
    display: none;
}

.pyq-float-cover {
    width: 100%;
    height: 120px;
    background: var(--imgbgy) center/cover no-repeat;
}

.pyq-float-bar {
    position: relative;
    height: 40px;
}

.pyq-float-bar-bg {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 0;
    background: var(--themetm);
}

.pyq-float-bar-glass,
.pyq-float-bar-inner {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 14px;
    padding: 0 14px;
}

.pyq-float-btn {
    font-size: 18px;
    color: var(--textqh);
    cursor: pointer;
}

#pyq-musiccz-zb {
    color: var(--theme);
}

/* ============ 搜索 / 友情链接 弹窗 ============ */
.pyq-search,
.pyq-link {
    position: fixed;
    inset: 0;
    z-index: 200;
    background: rgba(0, 0, 0, 0.45);
    display: none;
    align-items: center;
    justify-content: center;
}

.pyq-search-main,
.pyq-link-main {
    width: 90%;
    max-width: 480px;
    background: var(--cobg);
    border-radius: 12px;
    padding: 16px;
    max-height: 80vh;
    overflow-y: auto;
}

.pyq-search-main-top,
.pyq-link-main-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}

.pyq-news-main-top-xiaoxih span {
    font-size: 16px;
    font-weight: 600;
    color: var(--textqh);
}

.pyq-news-main-top-div {
    cursor: pointer;
    color: var(--texths);
    font-size: 20px;
}

.pyq-search-input-wrap {
    display: flex;
    gap: 8px;
}

.pyq-search-input-wrap input {
    flex: 1 1 auto;
    height: 40px;
    border: 1px solid var(--fgxys);
    border-radius: 8px;
    padding: 0 12px;
    background: var(--cobg);
    color: var(--textqh);
}

.pyq-search-input-wrap button {
    flex: 0 0 48px;
    border: none;
    border-radius: 8px;
    background: var(--theme);
    color: #fff;
    cursor: pointer;
}

.pyq-search-results {
    margin-top: 12px;
}

.pyq-search-item {
    padding: 10px 0;
    border-bottom: 1px solid var(--fgxys);
}

.pyq-search-item-title {
    color: var(--textqh);
    font-weight: 600;
}

.pyq-search-item-excerpt {
    color: var(--texths);
    font-size: 13px;
    margin-top: 2px;
}

.pyq-search-item-meta {
    color: var(--texths);
    font-size: 12px;
    margin-top: 2px;
}

.pyq-search-tip,
.pyq-search-loading {
    color: var(--texths);
    font-size: 13px;
    text-align: center;
    padding: 16px 0;
}

.pyq-link-con {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.pyq-link-con a {
    padding: 6px 12px;
    border: 1px solid var(--fgxys);
    border-radius: 16px;
    color: var(--textqh);
    font-size: 13px;
}

/* ============ 主题原生登录弹窗（.pyq-login，erphplogin 未启用时） ============ */
.pyq-login {
    position: fixed;
    inset: 0;
    z-index: 300;
    background: rgba(0, 0, 0, 0.5);
    display: none;
    align-items: center;
    justify-content: center;
}

.pyq-login-main {
    width: 90%;
    max-width: 360px;
    background: var(--cobg);
    border-radius: 12px;
    padding: 16px 18px 22px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}

.pyq-login-main-top {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 4px;
}

.pyq-login-main-top .ri-close-line {
    color: var(--texths);
    font-size: 20px;
    cursor: pointer;
}

.pyq-login-main-kko-kok-p {
    margin: 0 0 14px;
    font-size: 18px;
    font-weight: 700;
    color: var(--textqh);
    text-align: center;
}

.pyq-login-main-con {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.pyq-login-main-con-anu {
    display: flex;
    align-items: center;
    gap: 10px;
}

.pyq-login-main-con-anu p {
    margin: 0;
    color: var(--textqh);
    font-size: 13px;
}

.pyq-login-main-con-anu input {
    flex: 1 1 auto;
    height: 40px;
    border: 1px solid var(--fgxys);
    border-radius: 8px;
    padding: 0 12px;
    background: var(--bodys);
    color: var(--textqh);
}

.pyq-login-main-bot {
    margin-top: 18px;
}

.pyq-right,
.pyq-left {
    width: 100%;
    height: 42px;
    border: none;
    border-radius: 8px;
    background: var(--theme);
    color: #fff;
    font-size: 15px;
    cursor: pointer;
}

.pyq-left {
    background: #e74c3c;
}

.pyq-login-register-link a {
    cursor: pointer;
}

/* ============ 全局评论框（移动于各卡片间） ============ */
#pinglunkfk {
    position: fixed;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    width: 100%;
    max-width: 640px;
    z-index: 250;
    display: none;
}

.pyq-pinglunkuang {
    background: var(--cobg);
    border-radius: 14px;
    padding: 14px;
    box-shadow: 0 -6px 24px rgba(0, 0, 0, 0.15);
}

.pyq-plk-yk {
    display: flex;
    gap: 8px;
    margin-bottom: 10px;
}

.pyq-plk-yk-z {
    flex: 1 1 0;
}

.pyq-plk-yk-z input {
    width: 100%;
    height: 36px;
    border: 1px solid var(--fgxys);
    border-radius: 8px;
    padding: 0 10px;
    background: var(--bodys);
    color: var(--textqh);
    font-size: 13px;
}

.pyq-pinglun-s textarea {
    width: 100%;
    min-height: 64px;
    border: 1px solid var(--fgxys);
    border-radius: 8px;
    padding: 10px;
    background: var(--bodys);
    color: var(--textqh);
    resize: vertical;
}

.pyq-pinglun-biao {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 8px;
    max-height: 120px;
    overflow-y: auto;
}

.pyq-pinglun-biao img {
    width: 28px;
    height: 28px;
    cursor: pointer;
}

.pyq-pinglun-fs {
    display: flex;
    justify-content: flex-end;
    margin-top: 10px;
}

.pyq-pinglun-fs-right {
    display: flex;
    align-items: center;
    gap: 12px;
}

.pyq-pinglun-fs-right-bqimg {
    color: var(--iconhs);
    font-size: 20px;
    cursor: pointer;
}

.pyq-pinglun-fs-right-fs {
    padding: 8px 22px;
    border-radius: 8px;
    cursor: pointer;
    color: #fff;
    font-size: 14px;
}

/* ============ 作者页 ============ */
.pyq-author-header {
    background: var(--cobg);
    border-radius: 10px;
    margin: 10px 12px;
    padding: 16px;
    text-align: center;
}

.pyq-adf-select,
.pyq-adf-btn {
    height: 36px;
    border: 1px solid var(--fgxys);
    border-radius: 8px;
    padding: 0 10px;
    background: var(--bodys);
    color: var(--textqh);
}

.pyq-adf-btn {
    background: var(--theme);
    color: #fff;
    border: none;
    cursor: pointer;
    padding: 0 16px;
}

.pyq-adf-btn-ghost {
    background: transparent;
    color: var(--texths);
    border: 1px solid var(--fgxys);
}

.pyq-adf-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    justify-content: center;
    margin-top: 12px;
}

/* ============ 文章（详情）页 ============ */
.single .pyq-content {
    margin: 10px 12px;
}

/* ============ 暗色主题专属微调 ============ */
html.dark-theme .pyq-content,
body.dark-theme .pyq-content {
    box-shadow: none;
    border: 1px solid var(--fgxys);
}

html.dark-theme .pyq-zanp,
body.dark-theme .pyq-zanp {
    background: rgba(255, 255, 255, 0.04);
}

/* ============ 第三方视频（正文 iframe 自适应 + 列表页占位点击播放） ============ */
.pyq-embed {
    position: relative;
    width: 100%;
    max-width: 640px;
    margin: 8px 0;
    border-radius: 8px;
    overflow: hidden;
    background: #000;
}
.pyq-embed::before {
    content: "";
    display: block;
    padding-top: var(--pyq-pad, 56.25%);
}
@supports (aspect-ratio: 1 / 1) {
    .pyq-embed::before { display: none; }
    .pyq-embed { aspect-ratio: var(--pyq-ratio, 16 / 9); }
}
.pyq-embed > iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
}
/* 列表页占位卡：点击后才注入播放器 */
.pyq-embed-lazy {
    cursor: pointer;
    background: linear-gradient(135deg, #2b2f36, #15181d);
}
.pyq-embed-play {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 0;
    background: transparent;
    color: #fff;
    cursor: pointer;
}
.pyq-embed-play i {
    font-size: 42px;
    line-height: 1;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.5);
    transition: transform 0.15s ease;
}
.pyq-embed-play:hover i { transform: scale(1.08); }
.pyq-embed-label {
    font-size: 13px;
    opacity: 0.85;
}

/* ============ 评论表情面板 ============ */
.pyq-emoji {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    border-radius: 6px;
    transition: background 0.15s ease;
}
.pyq-emoji:hover { background: var(--fgxys, rgba(0, 0, 0, 0.06)); }

/* ============ 详情页「相关文章」 ============ */
.pyq-related {
    margin: 14px 12px 44px;
    background: var(--cobg);
    border-radius: 12px;
    padding: 12px 14px;
}
.pyq-related-h {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    color: var(--textqh);
    margin-bottom: 8px;
}
.pyq-related-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.pyq-related-list li + li {
    border-top: 1px solid var(--fgxys);
}
.pyq-related-list a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 0;
}
.pyq-related-t {
    color: var(--textqh);
    font-size: 14px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.pyq-related-d {
    flex: none;
    color: var(--texths);
    font-size: 12px;
}

/* 竖版视频（抖音/快手等）：限制宽度并居中，避免 9:16 撑得过高 */
.pyq-embed-vertical {
    max-width: 380px;
    margin-left: auto;
    margin-right: auto;
}

/* 抖音/快手 blockquote 分享码：容器约束 + 平台脚本注入的 iframe 自适应 */
.pyq-embed-blockquote > blockquote {
    margin: 0;
}
.pyq-embed-blockquote iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* ============ 页面模板：标题 / 提示卡 / 分页器 ============ */
.pyq-page-title {
    margin: 14px 12px 4px;
    font-size: 15px;
    font-weight: 600;
    color: var(--textqh);
}
.pyq-page-tip {
    margin: 10px 12px;
    padding: 34px 18px;
    text-align: center;
    background: var(--cobg);
    border-radius: 10px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}
.pyq-page-tip-code {
    font-size: 44px;
    font-weight: 700;
    line-height: 1;
    color: var(--theme);
}
.pyq-page-tip-t {
    margin: 12px 0 16px;
    font-size: 13px;
    color: var(--texths);
}
.pyq-page-tip-btn {
    display: inline-block;
    padding: 7px 18px;
    border-radius: 18px;
    background: var(--theme);
    color: #fff;
    font-size: 13px;
}
.pyq-pager {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: center;
    margin: 18px 12px 40px;
}
.pyq-pager .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 30px;
    height: 30px;
    padding: 0 8px;
    border: 1px solid var(--fgxys);
    border-radius: 8px;
    background: var(--cobg);
    color: var(--textqh);
    font-size: 13px;
}
.pyq-pager .page-numbers.current {
    background: var(--theme);
    border-color: var(--theme);
    color: #fff;
}

/* ============ 作者页 / 归档页 时间轴 ============ */
.pyq-timeline {
    position: relative;
    padding: 4px 12px 0;
}
.pyq-tl-year {
    position: relative;
    z-index: 2;
    margin: 8px 0 10px;
    padding: 4px 0;
    font-size: 16px;
    font-weight: 700;
    color: var(--textqh);
    background: var(--bg);   /* 遮住穿过它背后的竖线 */
}
.pyq-tl-item {
    position: relative;
    display: flex;
    gap: 12px;
    padding-bottom: 14px;
}
.pyq-tl-item::before {           /* 竖向时间线（贯穿所有项，跨年标题处自然断开） */
    content: '';
    position: absolute;
    left: 51px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: var(--fgxys);
}
.pyq-tl-item::after {            /* 节点圆点 */
    content: '';
    position: absolute;
    left: 48px;
    top: 18px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--theme);
    border: 2px solid var(--bg);
    z-index: 1;
}
.pyq-tl-date {
    flex: 0 0 46px;
    text-align: right;
    padding-top: 12px;
    color: var(--texths);
}
.pyq-tl-date b {
    display: block;
    font-size: 20px;
    font-weight: 700;
    line-height: 1;
    color: var(--textqh);
}
.pyq-tl-date span {
    font-size: 12px;
}
.pyq-tl-card {
    flex: 1;
    min-width: 0;
    display: flex;
    gap: 12px;
    align-items: flex-start;
    background: var(--cobg);
    border-radius: 10px;
    padding: 10px 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}
.pyq-tl-thumb {
    flex: 0 0 84px;
    width: 84px;
    height: 84px;
    border-radius: 8px;
    overflow: hidden;
}
.pyq-tl-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.pyq-tl-main {
    flex: 1;
    min-width: 0;
}
.pyq-tl-title {
    display: block;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.4;
    color: var(--textqh);
    word-break: break-word;
}
.pyq-tl-desc {
    margin-top: 4px;
    font-size: 13px;
    line-height: 1.5;
    color: var(--texths);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* 作者页日期筛选条 */
.pyq-author-date-filter {
    background: var(--cobg);
    border-radius: 10px;
    margin: 10px 12px;
    padding: 16px;
}

/* ============ 首页置顶条（朋友圈式） ============ */
.pyq-pinned-bar {
    display: flex;
    align-items: center;
    gap: 10px;
    background: var(--cobg);
    border-radius: 12px;
    margin: 10px 12px;
    padding: 10px 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}
.pyq-pinned-label {
    flex: 0 0 auto;
    padding-right: 10px;
    border-right: 1px solid var(--fgxys);
    font-size: 13px;
    font-weight: 600;
    color: var(--theme);
    writing-mode: vertical-rl;
    letter-spacing: 2px;
    line-height: 1.1;
}
.pyq-pinned-track {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    gap: 8px;
    overflow-x: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.pyq-pinned-track::-webkit-scrollbar { display: none; }
.pyq-pinned-item {
    position: relative;
    flex: 0 0 auto;
    width: 72px;
    height: 72px;
    border-radius: 8px;
    overflow: hidden;
    background: var(--imgbgy);
    display: block;
}
.pyq-pinned-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.pyq-pinned-ph {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--texths);
    font-size: 22px;
}
.pyq-pinned-play {
    position: absolute;
    right: 5px;
    bottom: 5px;
    color: #fff;
    font-size: 18px;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.6);
    pointer-events: none;
}
.pyq-pinned-arrow {
    flex: 0 0 auto;
    display: none;                 /* 默认隐藏，仅缩略图溢出宽度时显示 */
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    color: var(--texths);
    background: var(--fgxys);
}
.pyq-pinned-bar.has-overflow .pyq-pinned-arrow { display: flex; }
.pyq-pinned-arrow i { font-size: 20px; }

@media (max-width: 560px) {
    .pyq-pinned-item { width: 60px; height: 60px; }
}

/* ============ 全站导航页（/nav/） ============ */
.pyq-nav {
    padding: 4px 12px 0;
}
.pyq-nav-head {
    padding: 6px 2px 10px;
}
.pyq-nav-title {
    margin: 0;
    font-size: 19px;
    font-weight: 700;
    color: var(--textqh);
}
.pyq-nav-sub {
    margin: 4px 0 0;
    font-size: 13px;
    color: var(--texths);
}
.pyq-nav-search {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 14px;
    padding: 0 12px;
    height: 42px;
    background: var(--cobg);
    border-radius: 22px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}
.pyq-nav-search i {
    font-size: 18px;
    color: var(--texths);
}
.pyq-nav-search input {
    flex: 1;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    font-size: 14px;
    color: var(--textqh);
}
.pyq-nav-search button {
    flex: 0 0 auto;
    border: 0;
    background: var(--theme);
    color: #fff;
    font-size: 13px;
    padding: 6px 14px;
    border-radius: 16px;
    cursor: pointer;
}
.pyq-nav-group {
    margin-bottom: 16px;
}
.pyq-nav-group-h {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0 2px 8px;
    font-size: 14px;
    font-weight: 600;
    color: var(--textqh);
}
.pyq-nav-group-h i {
    font-size: 16px;
    color: var(--theme);
}
.pyq-nav-group-n {
    margin-left: auto;
    font-size: 12px;
    font-weight: 400;
    color: var(--texths);
}
.pyq-nav-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.pyq-nav-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 12px 14px;
    background: var(--cobg);
    border-radius: 10px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    color: var(--textqh);
    text-decoration: none;
    transition: transform .12s ease, box-shadow .12s ease;
}
.pyq-nav-item:active {
    transform: scale(.99);
}
.pyq-nav-item:hover {
    box-shadow: 0 2px 10px rgba(7, 193, 96, 0.16);
}
.pyq-nav-item-sub {
    box-shadow: none;
    border: 1px solid var(--fgxys);
}
.pyq-nav-item-t {
    font-size: 15px;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.pyq-nav-item-m {
    flex: 0 0 auto;
    font-size: 12px;
    color: var(--texths);
}
.pyq-nav-empty {
    padding: 16px;
    text-align: center;
    font-size: 13px;
    color: var(--texths);
    background: var(--cobg);
    border-radius: 10px;
}

/* ============ 视频容器外壳 + 「在原站打开」降级出口 ============ */
.pyq-embed-wrap {
    margin: 0;
}
.pyq-embed-fallback {
    display: block;
    margin: -4px 0 10px;
    text-align: right;
    font-size: 12px;
    color: var(--texths);
}
.pyq-embed-fallback:hover {
    color: var(--theme);
}