/* 推荐位预览区版式（标注 #27/#56/#57/#58）：照原型 renderRecHome()（快照 987~1105 行）与其 CSS（快照 262~356 行），
   按推荐位位序给 5 种版式——主编力荐大卡 / 火爆佳作金色排名角标 / 热门新书列表 / 猜你喜欢 3 列网格 / 免费专区横滚+免费角标。
   设计稿里的装饰性文案（标签、热度、在读人数、分类）在库中无来源，一律不渲染；只显示真实字段。
   styles.css 已超行数上限（棘轮只许缩小），新样式单独成文件（先例 rec-editor.css / ops-status.css / ops-order.css）。 */
.oc .pv-books-editor { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: none; }
.oc .pv-books-editor::-webkit-scrollbar { display: none; }
.oc .pv-books-editor .pv-item { width: 200px; display: flex; gap: 10px; align-items: center; text-align: left; background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .08); border-radius: 8px; padding: 8px; }
.oc .pv-books-editor .pv-cover { width: 62px; height: 82px; margin: 0; flex-shrink: 0; }
.oc .pv-books-editor .pv-name { font-size: 11.5px; font-weight: 700; color: #fff; }
.oc .pv-books-editor .pv-rank { display: none; }
.oc .pv-books-hot .pv-item { width: 58px; }
.oc .pv-books-hot .pv-cover { width: 58px; height: 76px; }
.oc .pv-books-hot .pv-rank { top: 1px; left: 1px; width: 16px; height: 16px; padding: 0; border-radius: 50%; background: linear-gradient(135deg, #fbbf24, #f59e0b); color: #1f2937; font-size: 9px; font-weight: 800; display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 6px rgba(0, 0, 0, .3); }
.oc .pv-books-hot .pv-name { font-size: 9.5px; font-weight: 600; color: rgba(255, 255, 255, .75); }
.oc .pv-books-new { display: flex; flex-direction: column; gap: 8px; }
.oc .pv-books-new .pv-item { width: auto; display: flex; gap: 10px; align-items: center; text-align: left; }
.oc .pv-books-new .pv-cover { width: 44px; height: 58px; margin: 0; flex-shrink: 0; }
.oc .pv-books-new .pv-name { font-size: 11.5px; font-weight: 700; color: #fff; }
.oc .pv-books-new .pv-rank { display: none; }
.oc .pv-books-guess { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 10px; }
.oc .pv-books-guess .pv-item { width: auto; min-width: 0; }
.oc .pv-books-guess .pv-cover { width: 100%; height: auto; aspect-ratio: 3 / 4; margin: 0 0 5px; }
.oc .pv-books-guess .pv-name { font-size: 10px; font-weight: 600; color: rgba(255, 255, 255, .8); }
.oc .pv-books-free { display: flex; gap: 12px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: none; }
.oc .pv-books-free::-webkit-scrollbar { display: none; }
.oc .pv-books-free .pv-item { width: 70px; }
.oc .pv-books-free .pv-cover { width: 70px; height: 92px; }
.oc .pv-books-free .pv-name { font-size: 10px; font-weight: 600; color: rgba(255, 255, 255, .75); }
.oc .pv-books-free .pv-rank { display: none; }
.oc .pv-books-free .pv-free-badge { display: none; }
.oc .pv-books-free.pv-free-on .pv-free-badge { display: block; position: absolute; bottom: 0; left: 0; right: 0; padding: 2px 0; background: linear-gradient(135deg, #16a34a, #15803d); color: #fff; font-size: 8.5px; font-weight: 700; text-align: center; border-radius: 0 0 6px 6px; }

/* 书架页预览（标注 #26/#60/#61/#62）：照原型 renderRecShelf() 与 .shelf-scroll-* 样式（快照 182~211 行）。
   块一「🔥 热门推荐」横向滚动条的无缝左移 / 中心放大由 frontend/rec-shelf.js 逐帧写行内样式，这里只给版式。 */
.oc .pv-shelf-scroll {
  display: flex; gap: 10px; align-items: flex-end; overflow: hidden; padding: 10px 0;
  mask-image: linear-gradient(90deg, transparent 0%, #000 5%, #000 95%, transparent 100%);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 5%, #000 95%, transparent 100%);
}
.oc .pv-shelf-scroll .pv-item { width: 52px; will-change: transform; }
.oc .pv-shelf-scroll .pv-cover { width: 52px; height: 68px; margin: 0 auto 4px; border: 2px solid transparent; transition: box-shadow .3s, border-color .3s; }
.oc .pv-shelf-scroll .pv-rank { display: none; }
/* 位序 6 起（原型只有 5 个位；其余按栏目 layout 回退）与设计稿默认版式一致：只出封面+书名，不带排名角标。 */
.oc .pv-books-scroll .pv-rank, .oc .pv-books-grid .pv-rank, .oc .pv-books-hero .pv-rank { display: none; }
.oc .pv-shelf-scroll .pv-name { font-size: 8.5px; color: rgba(255, 255, 255, .5); transition: color .3s, font-weight .3s; }
.oc .pv-shelf-mine { margin-top: 14px; }
.oc .pv-shelf-mine-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.oc .pv-shelf-mine-title { font-size: 13px; font-weight: 700; color: #fff; }
.oc .pv-shelf-mine-edit { font-size: 10px; color: rgba(255, 255, 255, .4); }
.oc .pv-shelf-empty { background: rgba(255, 255, 255, .04); border-radius: 8px; padding: 20px; text-align: center; }
.oc .pv-shelf-empty-icon { font-size: 24px; margin-bottom: 6px; }
.oc .pv-shelf-empty-text { font-size: 11px; color: rgba(255, 255, 255, .5); }