/* ============================================================
   Moments 朋友圈主题 - 原创样式
   微信朋友圈风格 Typecho 主题
   ============================================================ */

:root {
    --pq-theme: #09c362;            /* 主题绿 */
    --pq-theme-alpha: rgba(9, 195, 98, .12);
    --pq-name: #586c97;             /* 昵称蓝 */
    --pq-card: #ffffff;             /* 卡片/页面背景 */
    --pq-text: #282828;             /* 正文 */
    --pq-sub: #7a7a7a;              /* 次要文字 */
    --pq-fill: #f2f2f2;             /* 评论区/分割线 */
    --pq-line: #f2f2f2;             /* 分割线 */
    --pq-mask: rgba(0, 0, 0, .5);   /* 遮罩 */
    --pq-white: #ffffff;
    --pq-like: #576b95;             /* 点赞心形（微信蓝） */
    --pq-radius: 4px;
    --pq-maxw: 550px;
    --pq-nav-h: 52px;
}

html.dark {
    --pq-theme: #09c362;
    --pq-theme-alpha: rgba(9, 195, 98, .16);
    --pq-name: #8ea3d4;
    --pq-card: #3e3e3e;
    --pq-text: #ffffff;
    --pq-sub: #888888;
    --pq-fill: #404040;
    --pq-line: #404040;
    --pq-like: #8ea3d4;             /* 夜景模式提亮，保证对比度 */
    --pq-mask: rgba(0, 0, 0, .7);
}

* { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; }

html { overflow-x: hidden; overflow-y: scroll; max-width: 100%; }
body {
    overflow-x: hidden;
    background: var(--pq-page-bg, var(--pq-card));
    color: var(--pq-text);
    font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "PingFang SC",
        "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", sans-serif;
    font-size: 15px;
    line-height: 1.6;
    transition: background .3s, color .3s;
}
/* 夜间页面底色：仅在固定宽度模式由 header 输出 --pq-page-bg-dark；
   全宽模式未设置该变量，回退为夜间卡片色（与白天 --pq-page-bg 规则一致） */
html.dark body { background: var(--pq-page-bg-dark, var(--pq-card)); }

a { color: var(--pq-name); text-decoration: none; }
img { display: block; max-width: 100%; }
ul { list-style: none; }

/* ---------- 页面容器 ---------- */
.pq-page { max-width: var(--pq-maxw); margin: 0 auto; background: var(--pq-card); min-height: 100vh; }

/* 封面展示模式：固定宽度（卡片居中/直角/无上下边距） / 按页面宽度（全宽） */
.pq-page--fixed {
    width: calc(100% - 20px);
    /* 固定宽度模式取消页面顶部、底部各 10px 边距 */
    margin: 0 auto;
    /* 主体不再使用圆角，避免与背景色之间出现“悬浮卡片”观感 */
    border-radius: 0;
    overflow: hidden;
    min-height: 100vh;
    box-shadow: 0 1px 14px rgba(0, 0, 0, .06);
}
.pq-page--full {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    min-height: 100vh;
}
/* 全宽封面时，信息流与个人资料仍保持易读宽度并居中 */
.pq-page--full .pq-feed,
.pq-page--full .pq-profile {
    max-width: var(--pq-maxw);
    margin-left: auto;
    margin-right: auto;
}

/* ---------- 顶部导航 ---------- */
.pq-navbar {
    position: fixed; top: 0; left: 50%; transform: translateX(-50%);
    width: 100%; max-width: var(--pq-maxw);
    height: var(--pq-nav-h);
    display: flex; align-items: center; justify-content: center;
    padding: 0; z-index: 300;
    transition: background .3s, backdrop-filter .3s, box-shadow .3s;
}
/* 导航内部限宽容器：全宽模式下背景铺满视口，按钮位置仍与固定模式一致 */
.pq-nav__inner {
    width: 100%; max-width: var(--pq-maxw); margin: 0 auto;
    height: 100%; display: flex; align-items: center; justify-content: space-between;
    padding: 0 12px;
}
/* 吸顶导航背景宽度跟随封面模式：全宽铺满页面，固定宽度与主体同宽 */
.pq-page--full .pq-navbar { width: 100%; max-width: 100%; }
.pq-page--fixed .pq-navbar { width: calc(100% - 20px); max-width: var(--pq-maxw); }
/* 全宽模式：内部容器与固定模式主体等宽（左右各留 10px），按钮不贴屏幕两侧 */
.pq-page--full .pq-nav__inner { width: calc(100% - 20px); max-width: var(--pq-maxw); }
/* 吸顶导航：去掉边框，改为半透明磨砂玻璃（blur + 半透明底色） */
.pq-navbar.is-solid {
    background: rgba(255, 255, 255, .72);
    box-shadow: none;
    border-bottom: 0;
    backdrop-filter: saturate(180%) blur(20px);
    -webkit-backdrop-filter: saturate(180%) blur(20px);
}
html.dark .pq-navbar.is-solid { background: rgba(40, 40, 40, .72); }
/* 不支持 backdrop-filter 时提高底色不透明度，保证文字可读 */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .pq-navbar.is-solid { background: rgba(255, 255, 255, .96); }
    html.dark .pq-navbar.is-solid { background: rgba(45, 45, 45, .96); }
}

.pq-nav__side { display: flex; align-items: center; gap: 4px; min-width: 0; }
.pq-nav__btn {
    width: 38px; height: 38px; display: flex; align-items: center; justify-content: center;
    border-radius: 50%; cursor: pointer; color: var(--pq-white);
    font-size: 20px; transition: background .2s, color .3s, border-radius .2s;
}
.pq-navbar.is-solid .pq-nav__btn { color: var(--pq-text); }
/* 无封面页面（登录 / 注册 / 个人中心等）：没有封面图片可依据，按页面实际底色切换图标；
   JS 计算底色亮度后加 pq-nav--on-light / pq-nav--on-dark，服务端先按主题文字色兜底，避免首屏白图标。
   加 body 前缀与上面的兜底规则保持同等特异性，并靠顺序覆盖它 */
body.pq-nav-over-surface .pq-navbar:not(.is-solid) .pq-nav__btn { color: var(--pq-text); }
body .pq-navbar.pq-nav--on-light:not(.is-solid) .pq-nav__btn { color: #19191A; }
body .pq-navbar.pq-nav--on-dark:not(.is-solid) .pq-nav__btn { color: #FFFFFF; }
.pq-nav__btn:active { background: rgba(127, 127, 127, .2); }
/* 顶部图标按钮悬停：半透明灰色圆角色块，图标尺寸不变 */
@media (hover: hover) {
    .pq-nav__btn:hover { background: rgba(127, 127, 127, .18); border-radius: 8px; }
}
.pq-nav__btn--user, .pq-nav__btn--login { position: relative; }

/* ---------- 封面 ---------- */
.pq-cover { position: relative; width: 100%; height: 300px; overflow: hidden; background: #d9d9d9; }
/* 封面图统一用背景铺满裁切（background-size: cover 是最早被广泛支持的标准写法），
   不依赖 object-fit：旧内核（如 Via 使用的老 Chromium WebView）不支持 object-fit 时，
   width/height:100% 会把图片拉伸变形；背景图方式在旧内核下仍是等比裁切 */
.pq-cover__img {
    display: block; width: 100%; height: 100%;
    background-color: #d9d9d9;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
/* 未设置封面时的默认图：内联 SVG 渐变（不新增图片文件），固定/全宽都按 cover 铺满裁切 */
.pq-cover__img--default {
    background-color: #b9c0cc;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1200' height='600'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%23dfe3e9'/%3E%3Cstop offset='.5' stop-color='%23c2c9d4'/%3E%3Cstop offset='1' stop-color='%23a5aebd'/%3E%3C/linearGradient%3E%3CradialGradient id='h' cx='.28' cy='.18' r='.72'%3E%3Cstop offset='0' stop-color='%23ffffff' stop-opacity='.55'/%3E%3Cstop offset='1' stop-color='%23ffffff' stop-opacity='0'/%3E%3C/radialGradient%3E%3C/defs%3E%3Crect width='1200' height='600' fill='url(%23g)'/%3E%3Crect width='1200' height='600' fill='url(%23h)'/%3E%3C/svg%3E");
}
/* 暗色模式压低亮度，避免默认封面过亮突兀 */
html.dark .pq-cover__img--default { filter: brightness(.55) saturate(.9); }
/* 视频封面：用“最小尺寸撑满 + 居中”的经典写法实现等比裁切，
   不依赖 object-fit；宽高 auto 保证保持视频原始比例，超出容器的部分由 .pq-cover 裁掉 */
.pq-cover__video {
    position: absolute; top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: auto; height: auto;
    min-width: 100%; min-height: 100%;
    max-width: none; max-height: none;
}
.pq-cover--slide { position: relative; }
.pq-cover__slide {
    position: absolute; top: 0; right: 0; bottom: 0; left: 0;
    background-size: cover; background-position: center;
    opacity: 0; transition: opacity 1.5s ease-in-out;
}
.pq-cover__slide.is-active { opacity: 1; }
.pq-cover__dots {
    position: absolute; bottom: 12px; left: 50%; transform: translateX(-50%);
    display: flex; gap: 6px; z-index: 5;
}
.pq-cover__dot { width: 6px; height: 6px; border-radius: 3px; background: rgba(255, 255, 255, .5); transition: all .3s; }
.pq-cover__dot.is-active { width: 16px; background: rgba(255, 255, 255, .95); }

/* ---------- 用户信息 ---------- */
.pq-profile { padding: 0 25px 10px; text-align: right; }
.pq-profile__row {
    display: flex; align-items: flex-end; justify-content: flex-end;
    margin-top: -38px; position: relative; z-index: 6;
}
.pq-profile__name {
    color: #fff; font-size: 16px; font-weight: bold; line-height: 1.2;
    max-width: 350px; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    margin-right: 15px;
    /* 昵称重叠在封面上层：底边距封面下沿 10px（行底=封面下沿+22px） */
    margin-bottom: 32px;
    text-shadow: 0 1px 4px rgba(0, 0, 0, .55);
}
.pq-profile__name a { color: inherit; }
.pq-profile__avatar {
    width: 60px; height: 60px; border-radius: 7px; object-fit: cover;
    border: 1px solid rgba(255, 255, 255, .85); background: var(--pq-card);
}
.pq-signature {
    font-size: 12px; color: var(--pq-sub); margin-top: 8px;
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;
    user-select: text;
}
/* 个人资料区日期筛选：年 / 月 / 日三个下拉 + 筛选 / 重置 */
.pq-date-filter {
    display: flex; align-items: center; flex-wrap: wrap; gap: 8px;
    margin-top: 12px; padding: 9px 11px;
    background: var(--pq-fill);
    border: 1px solid var(--pq-line);
    border-radius: 10px;
    text-align: left;
}
.pq-date-filter__tag {
    display: inline-flex; align-items: center; justify-content: center; gap: 4px;
    flex-shrink: 0; height: 24px; padding: 0 9px; border-radius: 6px;
    font-size: 12px; color: var(--pq-theme); background: var(--pq-theme-alpha);
}
.pq-date-filter__tag i { font-size: 13px; }
.pq-date-filter__group {
    display: flex; align-items: center; gap: 6px;
    flex: 1 1 auto; min-width: 0;
}
.pq-date-select {
    flex: 1 1 0; min-width: 0; height: 30px;
    padding: 0 22px 0 9px;
    font-size: 12.5px; color: var(--pq-text); cursor: pointer;
    background-color: var(--pq-card);
    /* 用两段渐变画出下拉箭头，避免额外图片依赖 */
    background-image:
        linear-gradient(45deg, transparent 50%, #9a9a9a 50%),
        linear-gradient(135deg, #9a9a9a 50%, transparent 50%);
    background-position: calc(100% - 13px) calc(50% - 2px), calc(100% - 9px) calc(50% - 2px);
    background-size: 4px 4px, 4px 4px;
    background-repeat: no-repeat;
    border: 1px solid var(--pq-line);
    border-radius: 7px;
    outline: none;
    -webkit-appearance: none; -moz-appearance: none; appearance: none;
    transition: border-color .2s, opacity .2s;
}
.pq-date-select:focus { border-color: var(--pq-theme); }
.pq-date-select:disabled {
    /* 未选年 / 未选月时禁用：灰度锁定，固定显示“全部月 / 全部日” */
    color: var(--pq-sub);
    background-color: var(--pq-fill);
    border-color: transparent;
    opacity: .5;
    cursor: not-allowed;
    filter: grayscale(1);
}
.pq-date-filter__actions {
    display: flex; align-items: center; gap: 6px; flex-shrink: 0;
}
.pq-date-filter__btn {
    height: 30px; padding: 0 13px; border-radius: 7px;
    font-size: 12.5px; line-height: 1; cursor: pointer;
    border: 1px solid transparent;
    transition: background .2s, color .2s, border-color .2s;
}
.pq-date-filter__btn--apply { background: var(--pq-theme); color: #fff; }
.pq-date-filter__btn--apply:hover { background: #08b359; }
.pq-date-filter__btn--reset { background: transparent; color: var(--pq-sub); border-color: var(--pq-line); }
.pq-date-filter__btn--reset:hover { color: var(--pq-text); border-color: var(--pq-sub); }

/* ---------- 信息流 ---------- */
.pq-feed { padding-bottom: 30px; }
/* 文章详情页：顶部返回入口 */
.pq-detail__back {
    display: inline-flex; align-items: center; gap: 2px;
    margin: 12px 25px 0; font-size: 13px; color: var(--pq-name);
}
.pq-detail__back i { font-size: 18px; }

.pq-post {
    display: flex; align-items: flex-start;
    padding: 15px 25px 12px; border-bottom: 1px solid var(--pq-line);
}
.pq-post__avatar {
    width: 46px; height: 46px; border-radius: var(--pq-radius); object-fit: cover;
    margin-right: 10px; margin-top: 2px; flex-shrink: 0; cursor: pointer;
}
/* 作者页列表：头像位置改为发布日期（纯文本、不可点击；当年只显示月日） */
.pq-post__date {
    width: 58px; min-height: 46px; flex-shrink: 0;
    margin-right: 8px; margin-top: 2px; padding: 2px 0;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    color: #19191A; font-size: 11px; font-weight: normal;
    line-height: 1.2; text-align: center;
    cursor: default; user-select: none;
}
html.dark .pq-post__date { color: #f2f2f2; }
/* 日期行：日在前（20px 两位数字）、月在后（12px 数字+“月”），同一行 */
.pq-post__date-row { display: flex; align-items: baseline; justify-content: center; gap: 3px; }
.pq-post__date-day { font-size: 20px; font-weight: normal; line-height: 1; }
.pq-post__date-md { font-size: 12px; font-weight: normal; line-height: 1; }
/* 作者页文章内容整体一个可点击块（纯文字 / 纯图片都跳详情页） */
.pq-post--author .pq-post__link { display: block; color: inherit; text-decoration: none; }
.pq-post--author .pq-post__link:active { opacity: .85; }
/* 作者页纯文字卡片：浅灰圆角背景（日期块不套背景），悬停加深 */
.pq-post--author .pq-post__link--text {
    margin-top: 2px; padding: 10px 12px;
    background: #F0F0F0; border-radius: 8px;
    transition: background .2s;
}
/* 悬停加深：不依赖 @media(hover) 判定，桌面端鼠标悬停稳定生效 */
.pq-post--author .pq-post__link--text:hover { background: #E3E3E3; }
html.dark .pq-post--author .pq-post__link--text { background: rgba(255, 255, 255, .1); }
html.dark .pq-post--author .pq-post__link--text:hover { background: rgba(255, 255, 255, .16); }
/* 作者页纯文字卡片：正文最多 4 行，超出在第 4 行末尾显示省略号（与图文右侧规则一致） */
.pq-post--author.pq-post--text .pq-post__text {
    display: -webkit-box; -webkit-box-orient: vertical;
    -webkit-line-clamp: 4; line-clamp: 4; overflow: hidden;
    white-space: normal;
}
/* 作者页图文卡片：左图固定 145×145 缩放裁切，右侧文字最多 4 行（原生多行截断） */
.pq-post--author .pq-post__media { display: flex; align-items: flex-start; gap: 12px; }
.pq-post--author .pq-post__thumb {
    position: relative;
    width: 145px; height: 145px; flex: 0 0 145px;
    border-radius: 6px; overflow: hidden; background: var(--pq-fill);
}
.pq-post--author .pq-post__thumb img { width: 100%; height: 100%; object-fit: cover; }
/* 作者页音乐缩略图无封面时的统一占位：渐变底 + 音符图标 */
.pq-post--author .pq-post__thumb--music {
    display: flex; align-items: center; justify-content: center;
    color: #fff;
    background: linear-gradient(135deg, #6a8dff 0%, #8b5cf6 100%);
}
.pq-post--author .pq-post__thumb--music i { font-size: 40px; line-height: 1; }
/* 音乐缩略图内的统一音频按钮图标固定 26px（不被上面的占位图标规则放大） */
.pq-post--author .pq-post__thumb--music .pq-audio__btn i { font-size: 26px; }
/* 作者页音频外链（平台嵌入 / 仅链接）：整块作为外链入口，封面铺满并带平台角标 */
.pq-post--author .pq-post__thumb--ext { display: block; color: #fff; text-decoration: none; }
/* 作者页媒体卡（音频/视频）：桌面（>550px）左右两列、整体透明，不套灰块也不做悬停底色；
   灰块只属于纯文字卡，窄屏下“有正文文字”时才出现（见文末 550px 媒体查询） */
.pq-post--author .pq-post__media--action {
    display: flex; align-items: flex-start; gap: 12px;
    margin-top: 2px; padding: 0;
    background: transparent;
}
/* 右侧空白/文字区：独立链接铺满媒体右侧高度，点击进详情页（不触发播放） */
.pq-post--author .pq-post__media-body {
    flex: 1 1 auto; min-width: 0; align-self: stretch; min-height: 145px;
    display: flex; flex-direction: column; align-items: flex-start;
    color: inherit; text-decoration: none; cursor: pointer; border-radius: 6px;
}
.pq-post--author .pq-post__media-text {
    width: 100%; min-width: 0; margin-top: 2px;
    font-size: 15.5px; line-height: 1.6; color: var(--pq-text);
    word-break: break-word;
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden;
}
/* 无正文文字的媒体卡：桌面本就透明；窄屏同样不加灰块、不留文字列占位 */
.pq-post--author .pq-post__media--action.pq-post__media--bare { padding: 0; background: transparent; }
/* 无正文文字的媒体卡：媒体右侧等高（145px）透明块，只负责进入详情页；
   背景透明、无边框；不可触发播放（播放只绑在媒体自身的按钮/封面上） */
.pq-post--author .pq-post__media-side {
    flex: 1 1 auto; min-width: 64px; height: 145px;
    display: block; background: transparent; border: 0; border-radius: 6px;
    cursor: pointer;
}
.pq-post--author .pq-post__media-side:focus-visible {
    outline: 2px solid var(--pq-theme); outline-offset: 2px;
}
/* 视频展开后播放器占满媒体行，透明块随之隐藏 */
.pq-post--author .pq-post__media--action.is-video-open .pq-post__media-side { display: none; }
/* 作者页视频：与首页共用 .pq-video 同一套 DOM；收起时占据媒体行左侧 145×145 */
.pq-post--author .pq-post__media--action .pq-video {
    flex: 0 0 145px; width: 145px; max-width: 145px; margin-top: 0;
}
.pq-post--author .pq-post__media--action .pq-video .pq-video__thumb {
    width: 145px; height: 145px;
}
/* 展开后封面收起，播放器在当前媒体卡内原位显示；媒体行改纵向，文字/空白区排在播放器下方 */
.pq-post--author .pq-post__media--action.is-video-open { display: block; }
.pq-post--author .pq-post__media--action.is-video-open .pq-video {
    width: 100%; max-width: 420px;
}
.pq-post--author .pq-post__media--action.is-video-open .pq-post__media-body {
    min-height: 0; margin-top: 8px;
}
/* 作者页音频：PC 与移动端一致——文字在上、音频长条卡在下，不再左右并排。
   仅音频卡这样；图片/视频卡仍沿用 .pq-post__media 桌面默认的“左媒体、右文字”。
   DOM 顺序是“媒体在前、文字在后”，用 column-reverse 反转成文字在上。 */
.pq-post--author .pq-post__media--action.pq-post__media--audio {
    flex-direction: column-reverse; align-items: stretch; gap: 10px;
    margin-top: 0; padding: 0; background: transparent;
}
/* 音频长条卡铺满正文列宽，但最宽仍与多图网格一致（377px） */
.pq-post--author .pq-post__media--audio .pq-audio--bar {
    flex: 0 0 auto; width: 100%; max-width: 377px; margin-top: 0;
}
/* 文字区占满整行，位于音频卡上方（column-reverse 的视觉顺序） */
.pq-post--author .pq-post__media--audio .pq-post__media-body {
    width: 100%; min-width: 0; min-height: 0; margin-top: 0;
}
/* 无文字音频卡：音频卡自身可点进详情，不再保留右侧等高透明块 */
.pq-post--author .pq-post__media--audio.pq-post__media--bare .pq-post__media-side { display: none; }
.pq-post--author .pq-post__media--audio.pq-post__media--bare { flex-direction: column; }
/* 作者页卡片之间去掉分隔线，改用 35px 空白间隔（微信朋友圈观感） */
.pq-post--author { border-bottom: 0; }
.pq-post--author + .pq-post--author { margin-top: 35px; }
/* 跨年年份标记：该年最后一条文章上方，年份 18px 粗体，与下方卡片间隔 35px */
.pq-year-bar {
    margin: 30px 25px 35px;
    font-size: 18px; font-weight: 700; line-height: 1.2;
    color: #19191A;
}
html.dark .pq-year-bar { color: #f2f2f2; }
.pq-post__main { flex: 1; min-width: 0; }

.pq-post__head { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.pq-post__name {
    font-size: 15px; font-weight: bold; color: var(--pq-name);
    line-height: 1.4; cursor: pointer; max-width: 100%;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.pq-tag {
    min-width: 35px; height: 20px; padding: 0 6px;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 11px; border-radius: 2px; flex-shrink: 0;
}
.pq-tag--top { background: var(--pq-theme-alpha); color: var(--pq-theme); }
.pq-tag--ad  { background: var(--pq-fill); color: var(--pq-sub); }

.pq-post__text {
    margin-top: 4px; font-size: 15.5px; color: var(--pq-text);
    word-break: break-word; white-space: pre-wrap; user-select: text;
}
.pq-post__text.is-clamped { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 6; overflow: hidden; }
.pq-fulltext {
    display: inline-block; margin-top: 4px; padding: 0;
    border: 0; background: transparent; font-size: 14.5px;
    color: var(--pq-name); cursor: pointer; white-space: nowrap;
}

/* ---------- 图片九宫格 ---------- */
.pq-grid {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px;
    width: 85%; margin-top: 8px;
}
.pq-grid--single { grid-template-columns: minmax(0, 65%); width: 85%; }
.pq-grid--double { grid-template-columns: repeat(2, 1fr); }
.pq-grid__item { position: relative; width: 100%; padding-top: 100%; overflow: hidden; border-radius: var(--pq-radius); cursor: zoom-in; background: var(--pq-fill); }
.pq-grid__item img { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.pq-grid--single .pq-grid__item { padding-top: 0; height: auto; }
.pq-grid--single .pq-grid__item img { position: static; height: auto; }

/* ---------- 统一自定义音频控件（首页 / 详情页长条卡 + 作者页圆环） ---------- */
/* 不使用 <audio controls>，避免各浏览器原生控件外观差异 */
.pq-audio { position: relative; }
.pq-audio__btn {
    display: flex; align-items: center; justify-content: center;
    padding: 0; border: 0; background: transparent; color: inherit;
    cursor: pointer; -webkit-appearance: none; appearance: none;
    font-size: 22px; line-height: 1;
}
/* 音频元素不参与布局，但必须保持“已渲染”：
   旧版安卓内核（魅族/夸克等）对 display:none 的 <audio> 会拒绝加载与播放，
   因此改为 1px 透明定位隐藏（不占布局、不可见，但元素仍参与渲染树） */
.pq-audio__media {
    position: absolute; left: 0; bottom: 0;
    width: 1px; height: 1px; opacity: 0;
    pointer-events: none; overflow: hidden;
}

/* 首页 / 详情页 / 作者页统一音频长条卡：85px 高、最宽 377px（与多图网格同宽）
   三段式：左 85×85 封面 / 中间名称+专辑 / 右 85×85 播放按钮
   背景色由 moments.js 从封面主色写入 --pq-audio-bg；取色失败时回退主题默认底色 */
.pq-audio--bar {
    display: flex; align-items: stretch;
    width: 100%; max-width: 377px; height: 85px;
    margin-top: 8px; box-sizing: border-box;
    background: var(--pq-audio-bg, var(--pq-fill));
    color: var(--pq-audio-fg, var(--pq-text));
    /* 取色失败（跨域/无封面）时的兜底文字色：专辑名比名称低一档但仍保证可读；
       JS 取色成功会以内联变量覆盖这两个默认值 */
    --pq-audio-fg: var(--pq-text);
    --pq-audio-sub: #666666;
    border-radius: var(--pq-radius);
    overflow: hidden;
}
html.dark .pq-audio--bar { --pq-audio-sub: #b3b3b3; }
/* 封面区：85×85 等比裁切铺满。用 background-size: cover（而非 object-fit），
   旧 Chromium WebView（如 Via）不支持 object-fit 时也不会把封面拉伸变形；无封面时用默认图 */
.pq-audio__cover {
    flex: 0 0 85px; width: 85px; height: 85px;
    background-color: #d9d9d9;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    pointer-events: none;
}
/* 中间文字区：上下居中，左右各留 15px，与两侧 85px 区域保持间距不贴边 */
.pq-audio--bar .pq-audio__main {
    flex: 1 1 auto; min-width: 0;
    display: flex; flex-direction: column; justify-content: center;
    padding: 0 15px;
}
.pq-audio--bar .pq-audio__title {
    font-size: 14px; font-weight: 700; line-height: 1.35;
    color: var(--pq-audio-fg, var(--pq-text));
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pq-audio--bar .pq-audio__meta {
    display: flex; align-items: center; gap: 6px;
    min-width: 0; margin-top: 3px;
}
.pq-audio--bar .pq-audio__artist {
    flex: 0 1 auto; min-width: 0;
    font-size: 12px; line-height: 1.35;
    color: var(--pq-audio-sub, var(--pq-sub));
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
/* 平台角标放在专辑名同行尾部，不占第三段 */
.pq-audio--bar .pq-audio__meta .pq-media__badge--static {
    flex: 0 0 auto; max-width: 55%;
}
/* 播放按钮区：85×85，图标居中；只切换播放/暂停（交互由 moments.js 统一接管） */
.pq-audio--bar .pq-audio__btn {
    flex: 0 0 85px; width: 85px; height: 85px;
    padding: 0; border: 0; border-radius: 0;
    display: flex; align-items: center; justify-content: center;
    background: transparent;
    color: var(--pq-audio-fg, var(--pq-theme));
    font-size: 26px; cursor: pointer;
}
.pq-audio--bar .pq-audio__btn:active { background: rgba(127, 127, 127, .16); }
@media (hover: hover) {
    .pq-audio--bar .pq-audio__btn:hover { background: rgba(127, 127, 127, .14); }
}
/* 窄屏下中间文字区较窄，平台角标会挤占专辑名，直接省略（不破坏三段式） */
@media (max-width: 480px) {
    .pq-audio--bar .pq-audio__meta .pq-media__badge--static { display: none; }
}
/* 非直链音频：整条卡片为外链入口，右侧按钮为静态外链图标 */
.pq-audio--link { text-decoration: none; color: inherit; }

/* 作者页音频：圆环进度围绕圆形按钮外侧（r=45，周长≈282.743） */
.pq-post--author .pq-post__thumb--music .pq-audio { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 3; pointer-events: none; }
.pq-audio--ring .pq-audio__btn {
    position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
    width: 52px; height: 52px; border-radius: 50%;
    background: rgba(0, 0, 0, .55); color: #fff; font-size: 26px;
    pointer-events: auto;
}
.pq-audio--ring .pq-audio__ring {
    position: absolute; left: 50%; top: 50%;
    width: 66px; height: 66px;
    transform: translate(-50%, -50%) rotate(-90deg);
    pointer-events: none;
}
.pq-audio--ring .pq-audio__ring-track { fill: none; stroke: rgba(255, 255, 255, .32); stroke-width: 3; }
.pq-audio--ring .pq-audio__ring-fill {
    fill: none; stroke: var(--pq-theme); stroke-width: 3; stroke-linecap: round;
    transition: stroke-dashoffset .15s linear;
}

/* ---------- 视频卡片（145×145 封面；点击在页面内展开播放） ---------- */
.pq-video { margin-top: 8px; width: 145px; max-width: 85%; }
.pq-video__thumb {
    position: relative; display: block; width: 145px; height: 145px;
    padding: 0; border: 0; border-radius: 6px; overflow: hidden;
    background: #171b22; color: #fff; cursor: pointer;
    -webkit-appearance: none; appearance: none;
}
.pq-video__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pq-video__play {
    position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
    width: 46px; height: 46px; border-radius: 50%;
    background: rgba(0, 0, 0, .5); color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 26px; line-height: 1; pointer-events: none;
}
.pq-video__play i { font-size: 26px; }
/* 展开后封面收起，改为卡片内 <video>，不弹层 */
.pq-video.is-expanded { width: 100%; max-width: 420px; }
.pq-video.is-expanded .pq-video__thumb { display: none; }
.pq-video.is-expanded .pq-video-inline { margin-top: 0; }
.pq-video-inline { position: relative; width: 100%; margin-top: 8px; }
.pq-video-inline__video {
    display: block; width: 100%; max-width: 420px; max-height: 70vh;
    border-radius: var(--pq-radius); background: #000; object-fit: contain;
}
.pq-video-inline__close {
    position: absolute; top: 6px; right: 6px; z-index: 2;
    width: 30px; height: 30px; border: 0; border-radius: 50%;
    background: rgba(0, 0, 0, .55); color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 18px; cursor: pointer; -webkit-appearance: none; appearance: none;
}
.pq-video-inline__close:active { background: rgba(0, 0, 0, .78); }

/* ---------- 外部媒体：平台角标 / 官方播放器 iframe / 仅链接卡片 ---------- */
.pq-media__badge {
    position: absolute; left: 6px; bottom: 6px; z-index: 2;
    padding: 2px 6px; border-radius: 4px;
    background: rgba(0, 0, 0, .62); color: #fff;
    font-size: 11px; line-height: 1.5; white-space: nowrap; pointer-events: none;
}
.pq-media__badge--static {
    position: static; display: inline-block; pointer-events: auto;
    max-width: 100%; overflow: hidden; text-overflow: ellipsis;
}
/* 仅链接的视频卡：整卡为外链，沿用封面尺寸与播放按钮样式 */
.pq-video--link { display: block; text-decoration: none; color: inherit; }
/* 卡片内展开的官方播放器：固定 16:9，移动端不横向溢出 */
.pq-video-inline--frame {
    width: 100%; max-width: 420px; aspect-ratio: 16 / 9;
    border-radius: var(--pq-radius); overflow: hidden; background: #000;
}
.pq-video-inline--frame iframe { display: block; width: 100%; height: 100%; border: 0; }
/* 详情页 iframe：视频固定 16:9；网易云 outchain 为 66px 高的条状播放器 */
.pq-embed {
    width: 100%; max-width: 100%;
    border-radius: var(--pq-radius, 6px); overflow: hidden; background: #000;
}
.pq-embed--video { aspect-ratio: 16 / 9; }
.pq-embed--music { height: 86px; background: var(--pq-fill); }
.pq-embed iframe { display: block; width: 100%; height: 100%; border: 0; }
/* 仅链接跳转卡（详情页），明确提示将离开本站 */
.pq-link-card {
    display: flex; align-items: center; gap: 10px;
    width: 100%; padding: 12px 14px; box-sizing: border-box;
    border-radius: var(--pq-radius, 6px);
    background: var(--pq-fill); color: var(--pq-text); text-decoration: none;
}
.pq-link-card > i { flex: 0 0 auto; font-size: 20px; color: var(--pq-theme); }
.pq-link-card__main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.pq-link-card__title,
.pq-link-card__url { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pq-link-card__title { font-size: 14px; line-height: 1.4; font-weight: 500; }
.pq-link-card__url { font-size: 12px; line-height: 1.4; color: var(--pq-sub); }

/* ---------- 详情页：音视频播放器 ---------- */
.pq-post__media-player {
    display: flex; flex-direction: column; gap: 8px;
    width: 100%; margin-top: 8px;
}
.pq-player {
    display: block; width: 100%; max-width: 100%;
    border-radius: var(--pq-radius, 6px); background: var(--pq-fill);
    overflow: hidden;
}
.pq-player--video {
    aspect-ratio: 16 / 9; max-height: 70vh;
    object-fit: contain; background: #000;
}
/* 详情页音频沿用同一套 .pq-audio--bar（85px）；容器已有 8px 间距，不再叠加外边距 */
.pq-post__media-player .pq-audio--bar { margin-top: 0; }
@media (max-width: 550px) {
    .pq-post__media-player { margin-top: 6px; }
    .pq-player--video { max-height: 56vh; }
    /* 移动端：页面内展开的视频不撑破卡片宽度/高度 */
    .pq-video.is-expanded { width: 100%; max-width: 100%; }
    .pq-video-inline__video { max-width: 100%; max-height: 56vh; }
}

/* ---------- 底部：时间 + 操作 ---------- */
.pq-post__foot {
    display: flex; align-items: center; justify-content: space-between;
    margin-top: 8px; min-height: 22px; position: relative;
}
.pq-time { font-size: 12px; color: var(--pq-sub); }
.pq-actions { display: flex; align-items: center; gap: 14px; }
.pq-time__link { color: var(--pq-sub); font-size: 12px; }

/* 微信"两点"按钮 + 赞/评论弹出条 */
.pq-dots-wrap { position: relative; }
.pq-dots {
    width: 30px; height: 20px; background: var(--pq-fill);
    display: flex; justify-content: center; align-items: center; gap: 3px;
    border-radius: 2px; cursor: pointer;
}
.pq-dots span { width: 3px; height: 3px; border-radius: 50%; background: var(--pq-sub); }
.pq-dots-menu {
    position: absolute; right: 38px; top: 50%; transform: translateY(-50%);
    display: flex; align-items: center; background: #4c4c4c; border-radius: var(--pq-radius);
    overflow: hidden; opacity: 0; pointer-events: none; transition: opacity .2s;
    white-space: nowrap;
}
html.dark .pq-dots-menu { background: #2e2e2e; }
.pq-dots-menu.is-open { opacity: 1; pointer-events: auto; }
.pq-dots-menu__item {
    display: flex; align-items: center; gap: 5px; padding: 7px 14px;
    color: #fff; font-size: 13px; cursor: pointer;
}
/* 点赞 / 评论图标与页面其他心形保持同一尺寸（16px） */
.pq-dots-menu__item i {
    font-size: 16px; width: 16px; height: 16px; line-height: 1;
    display: inline-flex; align-items: center; justify-content: center;
}
.pq-dots-menu__item.is-liked, .pq-dots-menu__item.is-liked i { color: #fa5151; }
.pq-dots-menu__item + .pq-dots-menu__item { border-left: 1px solid rgba(255, 255, 255, .2); }
.pq-dots-menu__item:active { opacity: .7; }
/* 点赞 / 评论按钮 hover：浅灰半透明底色，与顶部按钮风格协调但范围更贴合按钮 */
@media (hover: hover) {
    .pq-dots-menu__item:hover { background: rgba(255, 255, 255, .16); }
    .pq-dots:hover { background: rgba(127, 127, 127, .2); }
}

/* ---------- 赞 & 评论区 ---------- */
.pq-comments {
    width: 85%; background: var(--pq-fill); border-radius: var(--pq-radius);
    margin-top: 8px; overflow: hidden;
}
.pq-likes { display: none; padding: 7px 10px 2px; }
.pq-likes.is-visible { display: flex; }
.pq-likes__icon { color: var(--pq-like); font-size: 16px; line-height: 1; margin-right: 8px; flex-shrink: 0; margin-top: 6px; }
/* 点赞列表：只显示头像（微信样式，头像 24px） */
.pq-likes__list {
    display: flex; flex-wrap: wrap; align-items: flex-start;
    gap: 6px 8px; flex: 1; min-width: 0; padding: 1px 0 3px;
}
.pq-like-user {
    display: block; width: 24px; text-decoration: none; cursor: default;
}
.pq-like-user img {
    width: 24px; height: 24px; border-radius: 4px;
    object-fit: cover; background: var(--pq-line); display: block;
}
/* 点赞总数文案 */
.pq-likes__text {
    flex: 1; min-width: 0; padding: 1px 0 3px;
    font-size: 13px; color: var(--pq-sub); line-height: 24px;
}
/* 超过 30 个赞：30 个头像 + 总数文案（上下排列） */
.pq-likes__body { flex: 1; min-width: 0; display: flex; flex-direction: column; padding: 1px 0 3px; }
.pq-likes__body .pq-likes__list { padding: 0; }
.pq-likes__body .pq-likes__text { padding: 2px 0 0; line-height: 20px; }
.pq-likes.is-visible + .pq-cmnt-list { border-top: 1px solid var(--pq-card); margin-top: 4px; }

.pq-cmnt-list { padding: 5px 10px 8px; font-size: 13.5px; }
.pq-cmnt { padding: 3px 0; cursor: pointer; line-height: 1.55; }
/* 评论超过 10 条：第 11 行位置显示“…”（点击展开剩余），display 覆盖规则见评论头像段末 */
.pq-cmnt-fold { padding: 2px 0; list-style: none; }
.pq-cmnt-fold__btn {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 22px; height: 18px; color: var(--pq-name);
    font-size: 14px; line-height: 1; cursor: pointer; user-select: none;
}
.pq-cmnt__name { color: var(--pq-name); font-weight: bold; }
.pq-cmnt__reply { color: var(--pq-sub); }
.pq-cmnt__body { color: var(--pq-text); word-break: break-word; user-select: text; white-space: pre-wrap; }
/* 长评论：JS 内联截断，点“全文/收起”即时切换（不刷新页面） */
.pq-cmnt-more { color: var(--pq-name); cursor: pointer; white-space: nowrap; margin-left: 4px; }

/* ---------- 评论输入框 ---------- */
.pq-composer {
    display: none; align-items: center; gap: 8px;
    width: 85%; margin-top: 8px;
}
.pq-composer.is-open { display: flex; }
.pq-composer__inner {
    flex: 1; display: flex; align-items: center; height: 36px;
    background: var(--pq-fill); border-radius: var(--pq-radius); padding: 0 10px;
}
.pq-composer__inner i { color: var(--pq-sub); font-size: 16px; margin-right: 6px; }
.pq-composer__input {
    flex: 1; border: 0; outline: none; background: transparent;
    font-size: 13px; color: var(--pq-text); height: 100%;
}
.pq-composer__input::placeholder { color: #8b8b8b; }
.pq-composer__send {
    background: var(--pq-theme); color: #fff; border: 0; outline: none;
    padding: 8px 18px; border-radius: var(--pq-radius);
    font-size: 13px; cursor: pointer; flex-shrink: 0;
}
.pq-composer__send:active { opacity: .8; }
/* 游客提示：点赞/评论入口禁用后给出登录引导 */
.pq-guest-tip {
    display: flex; align-items: center; gap: 6px; width: 85%;
    margin-top: 8px; padding: 9px 12px; cursor: pointer;
    background: var(--pq-fill); border-radius: var(--pq-radius);
    color: var(--pq-sub); font-size: 13px;
}
.pq-guest-tip i { color: var(--pq-theme); font-size: 15px; }

/* ---------- 加载更多 ---------- */
.pq-more {
    text-align: center; padding: 16px 0 26px; color: var(--pq-name);
    font-size: 14px; cursor: pointer; user-select: none;
}
.pq-more span { cursor: pointer; }
.pq-more--end { color: var(--pq-sub); cursor: default; }
.pq-more__loading { display: inline-flex; gap: 4px; align-items: center; }
.pq-more__loading i { animation: pq-spin 1s linear infinite; }
@keyframes pq-spin { to { transform: rotate(360deg); } }

/* ---------- 弹窗 / 遮罩 ---------- */
.pq-modal {
    position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 500; display: none;
    align-items: center; justify-content: center; padding: 24px;
}
.pq-modal.is-open { display: flex; }
.pq-modal__mask { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: var(--pq-mask); }
.pq-modal__box {
    position: relative; width: 100%; max-width: 340px;
    background: var(--pq-card); border-radius: 12px; padding: 26px 22px 20px;
    animation: pq-pop .25s ease;
}
@keyframes pq-pop { from { transform: scale(.9); opacity: 0; } to { transform: scale(1); opacity: 1; } }
.pq-modal__title { text-align: center; font-size: 16px; font-weight: bold; margin-bottom: 18px; }
.pq-reg-form { margin: 0; }
.pq-field { margin-bottom: 14px; }
.pq-field input {
    width: 100%; height: 40px; border: 1px solid var(--pq-line); border-radius: var(--pq-radius);
    background: var(--pq-fill); color: var(--pq-text); padding: 0 12px;
    font-size: 14px; outline: none;
}
.pq-field input:focus { border-color: var(--pq-theme); }
.pq-btn {
    width: 100%; height: 40px; border: 0; border-radius: var(--pq-radius);
    background: var(--pq-theme); color: #fff; font-size: 15px; cursor: pointer;
}
.pq-btn:active { opacity: .85; }
.pq-btn--ghost {
    background: transparent; color: var(--pq-sub); border: 1px solid var(--pq-line); margin-top: 10px;
}
.pq-modal__foot { text-align: center; margin-top: 14px; font-size: 13px; color: var(--pq-sub); }
.pq-modal__foot a { color: var(--pq-theme); cursor: pointer; }
.pq-modal__foot--tip { font-size: 12.5px; line-height: 1.6; }

/* ---------- iOS 旧版（<16，如 iPhone 7 / iOS 15.8）弹层与密码框加固 ---------- */
/* 旧设备关闭吸顶导航磨砂合成层，避免键盘弹起时 backdrop-filter 反复重绘造成卡顿 */
html.pq-ios-legacy .pq-navbar.is-solid {
    backdrop-filter: none; -webkit-backdrop-filter: none;
    background: rgba(255, 255, 255, .97);
}
html.pq-ios-legacy.dark .pq-navbar.is-solid { background: rgba(45, 45, 45, .97); }
/* 弹层不播放 scale 动画，避免聚焦瞬间新增合成图层 */
html.pq-ios-legacy .pq-modal__box { animation: none; }
/* 键盘弹起时从顶部开始，弹层自身可滚动，避免 100vh 居中反复重排；
   同时阻止滚动链传递到页面（注册弹层更高，含 4 个输入框时尤为明显） */
html.pq-ios-legacy .pq-modal.is-open {
    align-items: flex-start; overflow-y: auto; -webkit-overflow-scrolling: auto;
    padding-top: 72px; overscroll-behavior: contain;
}
html.pq-ios-legacy .pq-page { min-height: 0; }
html.pq-ios-legacy .pq-field input { font-size: 16px; }
/* 固定导航不用 transform 居中（fixed + transform 在旧 WebKit 上易生成额外合成层） */
html.pq-ios-legacy .pq-navbar { left: 0; right: 0; transform: none; margin-left: auto; margin-right: auto; }
/* 默认封面改用纯色，去掉内联 SVG 背景与暗色 filter */
html.pq-ios-legacy .pq-cover__img--default { background-image: none; background-color: #b9c0cc; }
html.pq-ios-legacy.dark .pq-cover__img--default { background-image: none; background-color: #3e3e3e; filter: none; }
/* 关闭封面淡入过渡等合成层 */
html.pq-ios-legacy .pq-cover__slide { transition: none; }
html.pq-ios-legacy .pq-modal__box { box-shadow: none; }

/* 任意系统打开弹层期间：临时关闭导航磨砂 */
html.pq-modal-open .pq-navbar.is-solid {
    backdrop-filter: none; -webkit-backdrop-filter: none;
    background: rgba(255, 255, 255, .97);
}
html.pq-modal-open.dark .pq-navbar.is-solid { background: rgba(45, 45, 45, .97); }

/* ---------- 图片灯箱 ---------- */
.pq-lightbox {
    position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 600; display: none;
    align-items: center; justify-content: center;
    background: rgba(0, 0, 0, .92);
    -webkit-overflow-scrolling: touch;
}
.pq-lightbox.is-open { display: flex; }
.pq-lightbox__stage {
    position: relative; width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: center;
    overflow: hidden; touch-action: pan-y;
}
.pq-lightbox__item {
    display: none; align-items: center; justify-content: center;
    width: 100%; height: 100%;
    animation: pq-fade .25s ease;
}
.pq-lightbox__item.is-active { display: flex; }
@keyframes pq-fade { from { opacity: 0; } to { opacity: 1; } }
.pq-lightbox__item img {
    max-width: 92vw; max-height: 84vh; border-radius: 6px;
    object-fit: contain; user-select: none; -webkit-user-drag: none;
}
.pq-lightbox__close {
    position: absolute; top: 14px; right: 14px; z-index: 3;
    width: 40px; height: 40px; border-radius: 50%;
    background: rgba(127, 127, 127, .25); color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 22px; cursor: pointer;
}
.pq-lightbox__count {
    position: absolute; top: 22px; left: 50%; transform: translateX(-50%);
    color: #fff; font-size: 13px; opacity: .8; z-index: 3; letter-spacing: 1px;
}
.pq-lightbox__prev, .pq-lightbox__next {
    position: absolute; top: 50%; transform: translateY(-50%); z-index: 3;
    width: 44px; height: 44px; border-radius: 50%;
    background: rgba(127, 127, 127, .22); color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 26px; cursor: pointer;
}
.pq-lightbox__prev { left: 12px; }
.pq-lightbox__next { right: 12px; }
.pq-lightbox__prev:active, .pq-lightbox__next:active { background: rgba(127, 127, 127, .45); }
.pq-lightbox__dots {
    position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%);
    display: flex; gap: 6px; z-index: 3; max-width: 92vw; flex-wrap: wrap; justify-content: center;
}
.pq-lightbox__dot {
    width: 6px; height: 6px; border-radius: 3px;
    background: rgba(255, 255, 255, .4); transition: width .3s, background .3s;
    cursor: pointer;
}
.pq-lightbox__dot.is-active { width: 16px; background: #fff; }
/* 触屏设备：隐藏左右箭头，改用滑动切换 */
@media (hover: none) and (pointer: coarse) {
    .pq-lightbox__prev, .pq-lightbox__next { display: none; }
}

/* ---------- Toast ---------- */
.pq-toast {
    position: fixed; top: 70px; left: 50%; transform: translateX(-50%) translateY(-8px);
    background: rgba(0, 0, 0, .75); color: #fff; font-size: 13px;
    padding: 8px 18px; border-radius: 18px; z-index: 999;
    opacity: 0; pointer-events: none; transition: all .3s; max-width: 80%;
}
.pq-toast.is-show { opacity: 1; transform: translateX(-50%) translateY(0); }

/* ---------- 夜景模式切换 / 回到顶部 ----------
   两个悬浮圆形按钮共用同一视觉尺寸（宽高 / 内边距 / 字号 / 边框），
   仅 bottom 偏移与 top 的显隐动画不同，避免出现一大一小。 */
.pq-night-btn,
.pq-top-btn {
    position: fixed; right: 14px; z-index: 150;
    width: 42px; height: 42px; padding: 0; box-sizing: border-box;
    border-radius: 50%;
    background: var(--pq-card); color: var(--pq-text);
    box-shadow: 0 2px 14px rgba(0, 0, 0, .15);
    display: flex; align-items: center; justify-content: center;
    font-size: 20px; line-height: 1; cursor: pointer; border: 1px solid var(--pq-line);
}
/* 图标继承按钮字号，remixicon 默认行高会撑开视觉尺寸 */
.pq-night-btn i,
.pq-top-btn i { font-size: inherit; line-height: 1; }

.pq-night-btn { bottom: 90px; }

.pq-top-btn {
    bottom: 144px;      /* 与夜空按钮保持 12px 间距：144 - (90 + 42) */
    opacity: 0; visibility: hidden; transform: translateY(8px);
    transition: opacity .25s, transform .25s, visibility .25s;
}
.pq-top-btn.is-show { opacity: 1; visibility: visible; transform: none; }
.pq-top-btn:active { background: var(--pq-fill); }
html.dark .pq-top-btn { background: #4a4a4a; color: #fff; }

/* ---------- 文章页 ---------- */
.pq-article { padding: 20px 25px 40px; }
.pq-article__content img { border-radius: var(--pq-radius); margin: 8px 0; max-width: 100%; height: auto; }
.pq-article__content p { margin: 10px 0; }
.pq-article__content a { word-break: break-all; }

/* ---------- 响应式 ---------- */
@media (max-width: 550px) {
    .pq-cover { height: 260px; }
    .pq-post { padding: 14px 15px 12px; }
    /* 作者页媒体卡：窄屏纵向且文字在上、媒体在下（column-reverse 反转 DOM 顺序）；
       桌面仍左右两列 */
    .pq-post--author .pq-post__media {
        flex-direction: column-reverse; align-items: flex-start; gap: 10px;
    }
    /* 音视频卡：有正文文字时才出现灰块；无文字的 bare 卡保持透明、不留文字列占位 */
    .pq-post--author .pq-post__media--action {
        align-items: stretch; gap: 10px;
        padding: 10px 12px; background: #F0F0F0; border-radius: 8px;
    }
    html.dark .pq-post--author .pq-post__media--action { background: rgba(255, 255, 255, .1); }
    /* 音频卡窄屏同样套灰块：桌面端 .pq-post__media--audio 的 transparent 规则特异性更高，
       会把这里的灰块覆盖掉，导致正文文字悬空在音频条上方、看着像跑到色块外 */
    .pq-post--author .pq-post__media--action.pq-post__media--audio:not(.pq-post__media--bare) {
        padding: 10px 12px; background: #F0F0F0; border-radius: 8px;
    }
    html.dark .pq-post--author .pq-post__media--action.pq-post__media--audio:not(.pq-post__media--bare) {
        background: rgba(255, 255, 255, .1);
    }
    .pq-post--author .pq-post__media--action.pq-post__media--bare {
        padding: 0; background: transparent;
        /* 无文字音视频卡：窄屏仍为媒体在左、透明块在右（不在媒体下方另起一行） */
        flex-direction: row; align-items: stretch;
    }
    html.dark .pq-post--author .pq-post__media--action.pq-post__media--bare { background: transparent; }
    .pq-post--author .pq-post__media--action .pq-post__media-body { min-height: 0; width: 100%; }
    /* 窄屏音频：column-reverse 后文字在上、媒体在下，音频长条卡铺满文字列宽 */
    .pq-post--author .pq-post__media--audio .pq-audio--bar {
        flex: 0 0 auto; width: 100%; max-width: 377px;
    }
    /* 图文卡：同样只在有正文文字时套灰块（圆角/内边距与纯文字卡一致） */
    .pq-post--author .pq-post__link--media-text {
        padding: 10px 12px; background: #F0F0F0; border-radius: 8px;
        transition: background .2s;
    }
    html.dark .pq-post--author .pq-post__link--media-text { background: rgba(255, 255, 255, .1); }
    .pq-post--author .pq-post__media-body { flex: 0 0 auto; width: 100%; }
    .pq-post--author .pq-post__media-text { flex: 0 0 auto; width: 100%; }
    .pq-post--author .pq-post__thumb { align-self: flex-start; }
    /* 图文/视频卡窄屏：灰块内的媒体铺满整行，去掉灰块右侧大片空白（否则视觉上像一条内容被切成多个色块） */
    .pq-post--author .pq-post__link--media-text .pq-post__thumb,
    .pq-post--author .pq-post__media--action:not(.is-video-open) .pq-video {
        flex: 0 0 auto; width: 100%; max-width: 100%; height: 180px;
    }
    .pq-post--author .pq-post__media--action:not(.is-video-open) .pq-video .pq-video__thumb {
        width: 100%; height: 100%;
    }
    .pq-profile { padding: 0 15px 10px; }
    .pq-grid, .pq-comments, .pq-composer, .pq-guest-tip { width: 92%; }
    /* 窄屏两个悬浮按钮同步缩放，right 对齐、垂直间距仍为 12px */
    .pq-night-btn,
    .pq-top-btn { right: 12px; width: 38px; height: 38px; font-size: 18px; }
    .pq-night-btn { bottom: 88px; }
    .pq-top-btn { bottom: 138px; }
    /* 窄屏：三下拉整行展示，筛选/重置按钮留在右上 */
    .pq-date-filter__group { order: 3; flex-basis: 100%; }
    .pq-date-filter__actions { margin-left: auto; }
    /* 移动端去掉页面与吸顶导航的左右留白：固定宽度模式在窄屏铺满视口（桌面端行为不变） */
    .pq-page--fixed { width: 100%; max-width: 100%; box-shadow: none; }
    .pq-page--fixed .pq-navbar { width: 100%; max-width: 100%; }
    .pq-page--full .pq-nav__inner { width: 100%; }
    /* iOS 聚焦输入框不再自动缩放：表单输入字号不小于 16px */
    .pq-field input { font-size: 16px; }
}

@media (max-width: 380px) {
    .pq-cover { height: 220px; }
    /* 与评论区/输入框保持同一宽度：漏掉 .pq-guest-tip 会让未登录提示比灰色评论块窄 */
    .pq-grid, .pq-comments, .pq-composer, .pq-guest-tip { width: 100%; }
}

/* ---------- 用户菜单 ---------- */
.pq-user-menu {
    position: absolute; right: 0; top: 46px; z-index: 120;
    min-width: 150px; background: var(--pq-card); border-radius: 10px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, .14); padding: 6px;
    display: none;
}
.pq-user-menu.is-open { display: block; }
.pq-user-menu__name {
    font-size: 13px; font-weight: bold; color: var(--pq-sub);
    padding: 8px 12px 6px; border-bottom: 1px solid var(--pq-line); margin-bottom: 4px;
}
.pq-user-menu__item {
    display: flex; align-items: center; gap: 8px;
    padding: 9px 12px; font-size: 14px; color: var(--pq-text);
    border-radius: 6px; cursor: pointer; text-decoration: none;
}
.pq-user-menu__item:hover { background: var(--pq-fill); }
.pq-user-menu__item i { font-size: 16px; }

/* ---------- 弹出面板（消息通知 / 友情链接通用） ---------- */
.pq-nav__btn--notify, .pq-nav__btn--links { position: relative; }
.pq-pop {
    position: absolute; top: 46px; right: 0; z-index: 130;
    width: 300px; max-width: calc(100vw - 24px);
    background: var(--pq-card); border-radius: 10px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, .16);
    overflow: hidden;
    display: none; /* 默认彻底隐藏，不占位不渲染 */
}
.pq-pop.is-open { display: block; animation: pq-pop-in .18s ease; }
@keyframes pq-pop-in {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: none; }
}
.pq-pop__head {
    padding: 11px 14px; font-size: 14px; font-weight: bold; color: var(--pq-text);
    border-bottom: 1px solid var(--pq-line);
}
.pq-notify-badge {
    position: absolute; top: 1px; right: 1px; z-index: 2;
    min-width: 16px; height: 16px; padding: 0 4px;
    border-radius: 8px; background: #fa5151; color: #fff;
    font-size: 10px; line-height: 16px; text-align: center;
    font-style: normal; border: 1.5px solid var(--pq-card);
    box-sizing: content-box;
}
.pq-notify__list { max-height: 350px; overflow-y: auto; }
.pq-notify__item {
    display: flex; align-items: flex-start; gap: 10px;
    padding: 10px 14px; text-decoration: none;
    border-bottom: 1px solid var(--pq-line);
}
.pq-notify__item:last-child { border-bottom: 0; }
.pq-notify__item:hover { background: var(--pq-fill); }
.pq-notify__item.is-unread { background: var(--pq-theme-alpha); }
.pq-notify__item.is-unread:hover { background: var(--pq-theme-alpha); filter: brightness(.96); }
.pq-notify__avatar {
    width: 32px; height: 32px; border-radius: 6px; object-fit: cover;
    flex-shrink: 0; background: var(--pq-line);
}
.pq-notify__body { flex: 1; min-width: 0; }
.pq-notify__text { font-size: 13px; color: var(--pq-text); line-height: 1.5; word-break: break-word; }
.pq-notify__text b { color: var(--pq-name); font-weight: 500; }
.pq-notify__time { font-size: 11px; color: var(--pq-sub); margin-top: 2px; }
.pq-notify__type { font-size: 15px; margin-left: auto; flex-shrink: 0; }
.pq-notify__type--like { color: var(--pq-theme); }
.pq-notify__type--comment { color: #5b8def; }
.pq-notify__empty { padding: 34px 0; text-align: center; color: var(--pq-sub); font-size: 13px; }

/* 窄屏：通知 / 友链面板改为导航下方整宽展开。
   原面板以按钮为定位基准（right:0），而通知按钮左侧还有搜索/友链/用户按钮，
   300px 宽度会向左溢出视口并遮挡内容；改为相对导航条全宽定位，完整可见且不越界。 */
@media (max-width: 550px) {
    .pq-pop {
        position: fixed; top: var(--pq-nav-h); left: 0; right: 0;
        width: auto; max-width: none; border-radius: 0 0 12px 12px;
    }
}

/* ---------- 友情链接弹出菜单 ---------- */
.pq-links__list { max-height: 320px; overflow-y: auto; padding: 6px; }
.pq-links__item {
    display: flex; align-items: center; gap: 8px;
    padding: 9px 12px; font-size: 13.5px; color: var(--pq-text);
    border-radius: 6px; text-decoration: none; word-break: break-all;
}
.pq-links__item::before {
    content: ''; width: 5px; height: 5px; border-radius: 50%;
    background: var(--pq-theme); flex-shrink: 0;
}
.pq-links__item:hover { background: var(--pq-fill); color: var(--pq-name); }
.pq-links__empty {
    padding: 26px 12px; text-align: center; color: var(--pq-sub); font-size: 13px; line-height: 1.8;
}
.pq-links__empty small { font-size: 11px; opacity: .8; }

/* ---------- 搜索弹窗 ---------- */
.pq-search-bar {
    display: flex; align-items: center; gap: 8px;
    height: 46px; padding: 0 14px; margin-bottom: 14px;
    background: var(--pq-fill); border-radius: 23px;
    border: 1px solid var(--pq-line);
    transition: border-color .2s;
}
.pq-search-bar:focus-within { border-color: var(--pq-theme); }
.pq-search-bar i { font-size: 17px; color: var(--pq-sub); }
.pq-search-bar input {
    flex: 1; border: 0; outline: none; background: transparent;
    font-size: 14.5px; color: var(--pq-text); height: 100%;
}
.pq-search-bar input::placeholder { color: #9a9a9a; }
.pq-btn i { vertical-align: -1px; margin-right: 4px; }

/* ---------- 评论头像 ---------- */
.pq-cmnt { display: flex; align-items: flex-start; gap: 7px; padding: 4px 0; }
.pq-cmnt__avatar {
    width: 22px; height: 22px; border-radius: 4px; object-fit: cover;
    flex-shrink: 0; margin-top: 2px;
}
.pq-cmnt__body-wrap { flex: 1; min-width: 0; line-height: 1.55; }
.pq-cmnt__body { user-select: text; }
/* 折叠规则放在 .pq-cmnt 之后，确保覆盖其 display:flex */
.pq-cmnt.pq-cmnt--folded { display: none; }

/* ---------- 评论输入框（游客昵称/邮箱行） ---------- */
.pq-composer { flex-wrap: wrap; }
.pq-remember {
    display: flex; align-items: center; gap: 6px;
    font-size: 12.5px; color: var(--pq-sub); margin-bottom: 12px; cursor: pointer;
}
.pq-remember input { accent-color: var(--pq-theme); }

/* ---------- 发布页（独立页面，普通文档流） ---------- */
.pq-publish {
    padding: calc(var(--pq-nav-h) + 18px) 16px calc(96px + env(safe-area-inset-bottom));
    max-width: 640px; margin: 0 auto;
}
.pq-publish__head { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.pq-publish__back {
    width: 34px; height: 34px; flex: 0 0 auto;
    display: flex; align-items: center; justify-content: center;
    border-radius: 50%; background: var(--pq-fill); color: var(--pq-text); font-size: 18px;
}
.pq-publish__title { margin: 0; font-size: 18px; line-height: 1.3; color: var(--pq-text); font-weight: 600; }
.pq-publish__card { background: var(--pq-fill); border-radius: var(--pq-radius); padding: 12px; }
.pq-publish__card .pq-textarea { background: var(--pq-card); }
.pq-publish__type {
    display: flex; align-items: center; gap: 4px; flex-wrap: wrap;
    margin: 10px 0 8px; font-size: 13px; color: var(--pq-sub);
}
.pq-publish__type b { color: var(--pq-theme); font-weight: 600; }
.pq-publish__upload { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 10px; }
.pq-publish__hint { font-size: 12px; color: var(--pq-sub); }
.pq-publish__preview { margin-top: 10px; }
/* 发长文入口：与发动态区分，放在发布页标题右侧 */
.pq-publish__switch {
    margin-left: auto; flex: 0 0 auto; display: inline-flex; align-items: center; gap: 5px;
    height: 32px; padding: 0 12px; border-radius: 16px;
    background: var(--pq-fill); color: var(--pq-theme);
    font-size: 13px; font-weight: 500; white-space: nowrap;
}
.pq-publish__switch i { font-size: 15px; }

/* 长文发布：桌面放宽到 860px，移动端仍满宽单列 */
.pq-publish--long { max-width: 860px; }
.pq-publish--long .pq-publish-bar { max-width: 860px; }
.pq-publish--long .pq-publish-bar__inner { max-width: 860px; }
.pq-long-card {
    background: var(--pq-fill); border-radius: var(--pq-radius);
    padding: 18px 20px 20px;
}
.pq-long__title {
    width: 100%; border: 0; outline: none; background: transparent;
    padding: 0 0 12px; border-bottom: 1px solid var(--pq-line);
    color: var(--pq-text); font-size: 20px; font-weight: 600; line-height: 1.4;
    font-family: inherit;
}
.pq-long__title::placeholder { color: var(--pq-sub); font-weight: 400; }
.pq-long__meta {
    display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
    margin: 12px 0 4px; font-size: 13px; color: var(--pq-sub);
}
.pq-long__forum { display: inline-flex; align-items: center; gap: 6px; }
.pq-long__count { margin-left: auto; color: var(--pq-sub); font-size: 12px; }
.pq-long__editor {
    width: 100%; min-height: 360px; margin-top: 12px;
    border: 0; outline: none; resize: vertical;
    background: transparent; color: var(--pq-text);
    padding: 0; font-size: 15px; line-height: 1.8; font-family: inherit;
}
.pq-long__editor::placeholder { color: var(--pq-sub); }
.pq-publish__file { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.pq-publish__file audio { display: block; width: 100%; height: 40px; }
.pq-publish__file video {
    display: block; width: 100%; max-height: 220px; object-fit: contain;
    border-radius: 8px; background: #000;
}
.pq-publish__remove {
    display: inline-flex; align-items: center; gap: 4px; padding: 5px 10px;
    border: 1px solid var(--pq-line); border-radius: var(--pq-radius);
    background: transparent; color: var(--pq-sub); font-size: 12.5px; font-family: inherit; cursor: pointer;
}
.pq-publish__remove:active { opacity: .7; }
.pq-publish__tip { margin: 10px 0 0; font-size: 12px; line-height: 1.6; color: var(--pq-sub); }
.pq-publish__guest {
    padding: 48px 20px; text-align: center; color: var(--pq-sub);
    background: var(--pq-fill); border-radius: var(--pq-radius);
}
.pq-publish__guest i { font-size: 34px; color: var(--pq-theme); }
.pq-publish__guest p { margin: 12px 0 18px; font-size: 14px; }
.pq-publish__guest .pq-btn { display: block; max-width: 200px; margin: 0 auto; }
/* 底部固定操作栏：吸附视口底部，内容再长也能点到“发布” */
.pq-publish-bar {
    position: fixed; left: 50%; transform: translateX(-50%); bottom: 0;
    width: 100%; max-width: var(--pq-maxw); z-index: 260;
    padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
    background: var(--pq-card); border-top: 1px solid var(--pq-line);
    box-shadow: 0 -4px 16px rgba(0, 0, 0, .06);
}
.pq-page--fixed .pq-publish-bar { width: calc(100% - 20px); max-width: var(--pq-maxw); }
.pq-publish-bar__inner { max-width: 640px; margin: 0 auto; }
.pq-publish-bar__btns { display: flex; gap: 10px; }
.pq-publish-bar__btns .pq-btn {
    flex: 1 1 0; width: auto; display: flex; align-items: center; justify-content: center;
}
.pq-publish-bar__btns .pq-btn--ghost { margin-top: 0; }
.pq-publish-bar .pq-pub-progress { margin: 0 0 8px; }
.pq-textarea {
    width: 100%; min-height: 110px; border: 1px solid var(--pq-line);
    border-radius: var(--pq-radius); background: var(--pq-fill);
    color: var(--pq-text); padding: 10px 12px; font-size: 14px;
    outline: none; resize: vertical; font-family: inherit;
}
.pq-textarea:focus { border-color: var(--pq-theme); }
.pq-pub-thumbs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.pq-pub-thumb {
    position: relative; width: 62px; height: 62px; border-radius: var(--pq-radius);
    overflow: hidden; background: var(--pq-fill);
}
.pq-pub-thumb img { width: 100%; height: 100%; object-fit: cover; }
.pq-pub-thumb__del {
    position: absolute; top: 0; right: 0; width: 18px; height: 18px;
    background: rgba(0, 0, 0, .55); color: #fff; font-size: 12px;
    display: flex; align-items: center; justify-content: center; cursor: pointer;
}
.pq-pub-tool {
    display: flex; align-items: center; gap: 5px; padding: 7px 14px;
    background: var(--pq-card); border: 1px solid var(--pq-line); border-radius: var(--pq-radius);
    font-size: 13px; color: var(--pq-text); cursor: pointer; user-select: none;
}
.pq-pub-tool:active { opacity: .7; }
.pq-pub-tool i { font-size: 16px; color: var(--pq-theme); }
/* 文件输入：不用 display:none，避免 iOS Safari 拒绝弹出文件选择器 */
.pq-file-input {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap;
    border: 0; opacity: 0; pointer-events: none;
}
.pq-pub-progress { margin: 0 0 10px; }
.pq-pub-progress__bar {
    height: 6px; border-radius: 999px; overflow: hidden;
    background: var(--pq-line);
}
.pq-pub-progress__bar span {
    display: block; width: 0; height: 100%; border-radius: inherit;
    background: var(--pq-theme); transition: width .15s linear;
}
.pq-pub-progress__text {
    margin-top: 5px; font-size: 12px; color: var(--pq-sub);
    word-break: break-all;
}
.pq-pub-progress.is-error .pq-pub-progress__bar span { background: #e54d42; }
.pq-pub-progress.is-error .pq-pub-progress__text { color: #e54d42; }
/* ---------- 个人资料页（?my.html） ---------- */
.pq-main {
    padding: calc(var(--pq-nav-h) + 18px) 16px calc(40px + env(safe-area-inset-bottom));
    max-width: var(--pq-maxw); margin: 0 auto;
}
.pq-card {
    background: var(--pq-fill);
    border-radius: 12px;
    padding: 20px 22px;
}
.pq-card__title {
    margin: 0 0 16px;
    font-size: 17px; font-weight: 600; line-height: 1.3; color: var(--pq-text);
}
/* 通用表单（my / my_avatar / my_password / my_bind 共用） */
.pq-form__row { margin-bottom: 16px; }
.pq-form__label {
    display: block; margin-bottom: 8px;
    font-size: 13px; color: var(--pq-sub);
}
.pq-input {
    display: block; width: 100%; height: 40px; padding: 0 12px;
    font: inherit; font-size: 14px;
    color: var(--pq-text); background: var(--pq-card);
    border: 1px solid var(--pq-line); border-radius: var(--pq-radius); outline: none;
}
.pq-input:focus, .pq-textarea:focus { border-color: var(--pq-theme); }
.pq-card .pq-textarea { background: var(--pq-card); min-height: 92px; }
.pq-form__actions { display: flex; justify-content: flex-end; gap: 10px; }
.pq-form__submit {
    height: 38px; padding: 0 26px;
    font-family: inherit; font-size: 14px;
    color: #fff; background: var(--pq-theme);
    border: 0; border-radius: var(--pq-radius); cursor: pointer;
}
.pq-form__submit:active { opacity: .85; }
.pq-form__submit:disabled { opacity: .6; cursor: default; }
.pq-form__hint { margin: 10px 0 0; font-size: 12.5px; line-height: 1.6; color: var(--pq-sub); }
.pq-tip {
    display: none; margin: 12px 0 0; padding: 9px 12px;
    font-size: 13px; line-height: 1.5; border-radius: var(--pq-radius);
    background: var(--pq-theme-alpha); color: var(--pq-theme);
    word-break: break-all;
}
.pq-tip.is-show { display: block; }
.pq-tip--error { background: rgba(229, 77, 66, .12); color: #e54d42; }

/* 我的资料页入口分组 */
.pq-hub { margin-top: 16px; }
.pq-hub__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.pq-hub__item {
    display: flex; align-items: center; gap: 10px;
    padding: 12px; border-radius: 10px;
    background: var(--pq-card); color: var(--pq-text);
    border: 1px solid transparent;
}
.pq-hub__item:active { border-color: var(--pq-theme); opacity: .85; }
.pq-hub__icon {
    flex: 0 0 34px; width: 34px; height: 34px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: var(--pq-theme-alpha); color: var(--pq-theme); font-size: 17px;
}
.pq-hub__text { min-width: 0; }
.pq-hub__text strong { display: block; font-size: 14px; font-weight: 600; line-height: 1.4; }
.pq-hub__text em { display: block; margin-top: 2px; font-size: 12px; font-style: normal; color: var(--pq-sub); }

/* 头像上传 */
.pq-avatar-pick { position: relative; display: block; width: 100px; height: 100px; cursor: pointer; }
.pq-avatar-pick__img {
    width: 100px; height: 100px; border-radius: 50%;
    object-fit: cover; background: var(--pq-fill);
    border: 1px solid var(--pq-line);
}
.pq-avatar-pick__badge {
    position: absolute; right: 0; bottom: 0;
    width: 30px; height: 30px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: var(--pq-theme); color: #fff; font-size: 15px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .2);
}
.pq-avatar-pick { margin: 4px auto 18px; }
.pq-avatar-pick input[type="file"] { display: none; }
.pq-page-back {
    display: inline-flex; align-items: center; gap: 2px;
    margin-bottom: 10px; font-size: 13px; color: var(--pq-sub);
}
.pq-list__link {
    display: inline-flex; align-items: center; height: 30px; padding: 0 12px;
    border: 1px solid var(--pq-line); border-radius: 15px;
    background: var(--pq-card); color: var(--pq-text); font-size: 13px;
}
.pq-list__link--danger { color: #e54d42; border-color: rgba(229, 77, 66, .35); }
.pq-bind__icon { width: 28px; height: 28px; border-radius: 6px; object-fit: contain; background: var(--pq-card); }

/* 内容列表（我的文章 / 我的评论 / 待审 / 退稿 / 审核） */
.pq-list { list-style: none; margin: 0; padding: 0; }
.pq-list__item {
    display: flex; gap: 12px; padding: 14px 0;
    border-bottom: 1px solid var(--pq-line);
}
.pq-list__item:last-child { border-bottom: 0; }
.pq-list__check { margin-top: 4px; }
.pq-list__main { flex: 1; min-width: 0; }
.pq-list__title { font-size: 14.5px; font-weight: 600; line-height: 1.5; color: var(--pq-text); word-break: break-all; }
.pq-list__title a { color: inherit; }
.pq-list__meta { margin-top: 4px; font-size: 12px; color: var(--pq-sub); }
.pq-list__body { margin-top: 6px; font-size: 13.5px; line-height: 1.6; color: var(--pq-sub); word-break: break-all; }
/* 评论正文等富文本：保留可读色，图片/附件不撑破容器 */
.pq-list__body--html { color: var(--pq-text); }
.pq-list__body img { max-width: 100%; height: auto; border-radius: 6px; }
.pq-list__body a { color: var(--pq-theme); }
.pq-list__body .blockquote {
    margin: 6px 0; padding: 4px 10px;
    border-left: 3px solid var(--pq-line); color: var(--pq-sub);
}
.pq-list__body fieldset { border: 0; margin: 8px 0 0; padding: 0; }
.pq-list__body legend { margin: 0 0 4px; padding: 0; font-size: 12px; color: var(--pq-sub); }
.pq-list__body .attachlist { margin: 0; padding: 0; list-style: none; }
.pq-list__body .attachlist li {
    display: flex; align-items: center; justify-content: space-between; gap: 8px;
    padding: 3px 0; overflow: hidden;
}
.pq-list__body .attachlist a {
    display: inline-flex; align-items: center; gap: 4px;
    min-width: 0; max-width: 100%; overflow: hidden;
    color: var(--pq-text); text-overflow: ellipsis; white-space: nowrap;
}
.pq-list__actions { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; }
/* 绑定/解绑等文字按钮保持胶囊尺寸，不要被图标按钮的 30×30 规则压成竖排 */
.pq-list__actions .pq-list__link {
    width: auto; height: 30px; padding: 0 12px;
    border-radius: 15px; white-space: nowrap; font-size: 13px;
}
.pq-list__actions a {
    display: inline-flex; align-items: center; justify-content: center;
    width: 30px; height: 30px; border-radius: 50%;
    border: 1px solid var(--pq-line); background: var(--pq-card);
    color: var(--pq-text); font-size: 15px;
}
.pq-list__actions a:active { opacity: .7; }
.pq-list__danger { color: #e54d42 !important; }
.pq-list__status {
    display: inline-block; padding: 1px 8px; font-size: 11.5px;
    border-radius: 10px; background: var(--pq-theme-alpha); color: var(--pq-theme);
}
.pq-list__bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 14px; }
.pq-list__bar .pq-btn { width: auto; height: 32px; padding: 0 14px; font-size: 13px; }
.pq-list__bar label { font-size: 12.5px; color: var(--pq-sub); }

/* 分页（核心 pagination 生成的 Bootstrap 结构） */
.pq-pager { margin: 18px 0 4px; text-align: center; }
.pq-pager .pagination { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin: 0; padding: 0; list-style: none; }
.pq-pager .pagination > li > a,
.pq-pager .pagination > li > span {
    display: inline-flex; min-width: 30px; height: 30px; padding: 0 8px;
    align-items: center; justify-content: center;
    border: 1px solid var(--pq-line); border-radius: var(--pq-radius);
    background: var(--pq-card); color: var(--pq-text); font-size: 13px;
}
.pq-pager .pagination > .active > a,
.pq-pager .pagination > .active > span {
    background: var(--pq-theme); border-color: var(--pq-theme); color: #fff;
}

/* 空状态 */
.pq-empty { padding: 36px 10px; text-align: center; color: var(--pq-sub); }
.pq-empty i { display: block; margin-bottom: 8px; font-size: 34px; color: var(--pq-line); }
.pq-empty p { font-size: 13px; }

@media (max-width: 550px) {
    .pq-modal { padding: 10px; }
    .pq-main { padding: calc(var(--pq-nav-h) + 12px) 12px calc(40px + env(safe-area-inset-bottom)); }
    .pq-card { padding: 15px; }
    /* iOS 聚焦输入框不缩放：表单控件字号不小于 16px */
    .pq-main .pq-textarea, .pq-main .pq-input { font-size: 16px; }
    .pq-main .pq-textarea { min-height: 84px; }
    .pq-hub__grid { grid-template-columns: 1fr; }
    .pq-publish { padding: calc(var(--pq-nav-h) + 12px) 12px calc(92px + env(safe-area-inset-bottom)); }
    .pq-publish__card { padding: 10px; }
    /* 长文页移动端：保持单列、标题与正文可读，按钮不溢出 */
    .pq-publish--long { max-width: 100%; }
    .pq-publish--long .pq-publish-bar { max-width: var(--pq-maxw); }
    .pq-publish--long .pq-publish-bar__inner { max-width: 100%; }
    .pq-publish__switch { height: 30px; padding: 0 10px; font-size: 12.5px; }
    .pq-long-card { padding: 14px; }
    .pq-long__title { font-size: 17px; padding-bottom: 10px; }
    .pq-long__editor { min-height: 300px; font-size: 14.5px; line-height: 1.7; }
    .pq-publish__card .pq-textarea { min-height: 110px; padding: 9px 10px; font-size: 14px; }
    .pq-pub-thumb { width: 56px; height: 56px; }
    .pq-pub-tool { padding: 6px 12px; font-size: 12.5px; }
    /* 移动端紧凑排列：音频用原生紧凑高度，视频预览限高，避免把表单撑长 */
    .pq-publish__file audio { height: 36px; }
    .pq-publish__file video { max-height: 180px; }
    .pq-publish-bar { padding: 8px 12px calc(8px + env(safe-area-inset-bottom)); }
}

/* ---------- 日期筛选提示 ---------- */
.pq-month-tip {
    display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
    margin: 10px 25px; padding: 9px 12px; border-radius: 8px;
    background: var(--pq-fill); color: var(--pq-sub); font-size: 13px;
}
.pq-month-tip i { color: var(--pq-theme); }
.pq-month-tip a { margin-left: auto; color: var(--pq-theme); text-decoration: none; }
@media (max-width: 768px) {
    .pq-month-tip { margin: 10px 15px; }
}

/* 无障碍：文本可选 */
.pq-post__text, .pq-cmnt__body, .pq-signature { -webkit-user-select: text; user-select: text; }

/* 打印友好 */
@media print {
    .pq-navbar, .pq-player, .pq-night-btn, .pq-top-btn, .pq-dots, .pq-composer { display: none !important; }
}