/* PDF 線上閱讀頁 */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body { background: #525659; font-family: "Microsoft JhengHei", "PingFang TC", "PingFang SC", "Microsoft YaHei", Arial, sans-serif; color: #333; }

/* 上方工具列 */
.pv_bar { position: fixed; top: 0; left: 0; right: 0; z-index: 10; display: flex; align-items: center; justify-content: space-between; height: 48px; padding: 0 10px; background: #323639; color: #fff; box-shadow: 0 1px 4px rgba(0,0,0,.4); }
.pv_title { font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-right: 10px; }
.pv_tools { display: flex; align-items: center; flex-shrink: 0; }
.pv_page { font-size: 14px; margin-right: 8px; white-space: nowrap; }
.pv_btn { display: inline-block; min-width: 34px; height: 32px; line-height: 32px; margin-left: 4px; padding: 0 8px; border: 0; border-radius: 4px; background: #4a4e51; color: #fff; font-size: 15px; text-align: center; text-decoration: none; cursor: pointer; }
.pv_btn:active { background: #666; }
.pv_download { font-size: 14px; }

/* 微信 / QQ 提示列 */
.pv_tip { display: none; position: fixed; top: 48px; left: 0; right: 0; z-index: 9; align-items: center; justify-content: space-between; padding: 8px 10px; background: #fff8d6; color: #6b5300; font-size: 14px; line-height: 1.4; }
.pv_inapp .pv_tip { display: flex; }
.pv_tip_close { flex-shrink: 0; margin-left: 10px; border: 0; background: none; color: #6b5300; font-size: 22px; line-height: 1; cursor: pointer; }

/* 閱讀區 */
.pv_viewer { padding: 56px 8px 16px; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.pv_inapp .pv_viewer { padding-top: 100px; }
.pv_page_wrap { position: relative; margin: 0 auto 8px; background: #fff; box-shadow: 0 1px 4px rgba(0,0,0,.4); }
.pv_page_wrap canvas { display: block; }
/* 頁面還沒畫好時，中間顯示轉圈 */
.pv_page_wrap:not(.pv_done)::before { content: ""; position: absolute; top: 50%; left: 50%; width: 28px; height: 28px; margin: -14px 0 0 -14px; border: 3px solid #ddd; border-top-color: #888; border-radius: 50%; animation: pv_spin .8s linear infinite; }

/* 載入中 / 錯誤 */
.pv_loading { display: flex; align-items: center; justify-content: center; min-height: 60vh; color: #fff; font-size: 16px; }
.pv_spin { width: 24px; height: 24px; margin-right: 10px; border: 3px solid rgba(255,255,255,.3); border-top-color: #fff; border-radius: 50%; animation: pv_spin .8s linear infinite; }
@keyframes pv_spin { to { transform: rotate(360deg); } }
.pv_error { display: none; min-height: 60vh; padding-top: 20vh; color: #fff; text-align: center; }
.pv_error .pv_btn { height: 40px; line-height: 40px; padding: 0 24px; }
.pv_error_detail { max-width: 600px; margin: 24px auto 0; padding: 0 16px; color: #bbb; font-size: 12px; line-height: 1.5; word-break: break-all; user-select: text; -webkit-user-select: text; }
