/* ==========================================================================
   题库文库 · 文档在线预览器样式（docviewer.css）
   作用域：.tk-doc   —— 只负责预览器组件本身
   整站/侧栏/详情样式见 site.css
   ========================================================================== */

.tk-doc{
  --blue:#4e6ef2; --blue-d:#3b58d9; --blue-l:#eef1fe; --blue-l2:#f6f8ff;
  --gold:#e8a33d; --gold-d:#c9861f; --gold-l:#fff8ec; --gold-b:#f3ddb4;
  --ink:#1a1c23; --ink2:#4a4f5c; --ink3:#8b90a0; --ink4:#b4b9c9;
  --line:#e8eaf0; --line2:#f2f4f8;
  --radius:10px;
  position:relative;
}
.tk-doc *{box-sizing:border-box}
.tk-doc svg{display:block}

/* ---------- 外框 ---------- */
.tk-doc .viewercard{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:0 1px 3px rgba(24,32,64,.06),0 6px 20px rgba(24,32,64,.05)}

/* ---------- 工具栏 ---------- */
.tk-doc .toolbar{height:48px;display:flex;align-items:center;gap:4px;padding:0 12px;border-bottom:1px solid var(--line);background:#fbfcfe}
.tk-doc .tbtn{
  height:32px;min-width:32px;padding:0 9px;border-radius:6px;display:flex;align-items:center;
  justify-content:center;gap:5px;color:var(--ink2);font-size:13px;transition:.15s;
  cursor:pointer;border:none;background:none;font-family:inherit;
}
.tk-doc .tbtn:hover{background:#eef0f7;color:var(--blue)}
.tk-doc .tbtn:active{transform:scale(.95)}
.tk-doc .tsep{width:1px;height:20px;background:var(--line);margin:0 6px}
.tk-doc .zoomval{font-size:13px;color:var(--ink2);min-width:44px;text-align:center;font-variant-numeric:tabular-nums}
.tk-doc .pageindicator{margin-left:auto;display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink3)}
.tk-doc .pageindicator input{
  width:46px;height:28px;border:1px solid var(--line);border-radius:6px;text-align:center;
  font-size:13px;outline:none;color:var(--ink);font-variant-numeric:tabular-nums;font-family:inherit;
}
.tk-doc .pageindicator input:focus{border-color:var(--blue)}
.tk-doc .pgTotal{color:var(--ink2)}

/* ---------- 提示条 ---------- */
.tk-doc .notice{display:none;align-items:center;gap:9px;padding:9px 16px;background:#fffaf0;border-bottom:1px solid #f5e6c8;color:#a16207;font-size:12.5px}
.tk-doc .notice svg{flex:none}
.tk-doc .notice.info{background:var(--blue-l2);border-bottom-color:#dde3fb;color:#3550b8}
.tk-doc .notice.gold{background:var(--gold-l);border-bottom-color:var(--gold-b);color:#8a6417}
.tk-doc .notice a{color:inherit;text-decoration:underline;font-weight:600}

/* ---------- 舞台 ---------- */
.tk-doc .stage{background:#eef0f5;padding:26px 0;min-height:560px;overflow-x:auto;position:relative;box-sizing:border-box}
.tk-doc .stage::-webkit-scrollbar{width:10px;height:10px}
.tk-doc .stage::-webkit-scrollbar-thumb{background:#c8ccda;border-radius:5px;border:2px solid #eef0f5}
.tk-doc .stage::-webkit-scrollbar-thumb:hover{background:#adb3c7}
/* ★ pagewrap 必须「不撑大」stage（2026-10-06）：
   .paper 是固定像素宽度，若 pagewrap 随内容变宽，会把 stage 的可用宽度也带大，
   导致 computeFit() 量到的宽度一轮比一轮宽 —— 表现为「越点适宽越宽 / 点了像没反应」。
   这里改用 width:100% + max-width:100% 锁住 wrap 自身宽度，由 stage 决定可视宽度，
   溢出的页面交给 stage 的横向滚动条处理。 */
.tk-doc .pagewrap{display:flex;flex-direction:column;align-items:center;gap:22px;padding:0 26px;min-height:100%;width:100%;max-width:100%}

.tk-doc .paper{background:#fff;box-shadow:0 2px 10px rgba(30,40,80,.13);position:relative;flex:none;overflow:hidden}
.tk-doc .paper canvas{display:block;width:100%;height:100%}
.tk-doc .paper .pnum{
  position:absolute;bottom:8px;right:12px;background:rgba(26,28,35,.5);color:#fff;
  padding:1px 8px;border-radius:10px;font-size:11px;z-index:3;
}

/* ---------- 全屏浏览 ----------
   浏览器把 .viewercard 提升为全屏元素后：
   · 外框须铺满视口、去掉圆角和阴影
   · 工具栏固定在顶部
   · 舞台占据剩余高度并自己滚动（全屏内独立滚动，退出后回到整页滚动）
   ★ 2026-10-06 补：此前完全没有全屏样式，导致进入/退出全屏后
     宽度错乱、适宽失灵、页面跳回顶部。 */
.tk-doc .viewercard:fullscreen,
.tk-doc .viewercard:-webkit-full-screen{
  width:100vw;height:100vh;border-radius:0;border:none;box-shadow:none;
  display:flex;flex-direction:column;background:#fff;
}
.tk-doc .viewercard:fullscreen .toolbar,
.tk-doc .viewercard:-webkit-full-screen .toolbar{flex:none}
.tk-doc .viewercard:fullscreen .stage,
.tk-doc .viewercard:-webkit-full-screen .stage{
  flex:1 1 auto;min-height:0;max-height:none;overflow-y:auto;
}
.tk-doc .viewercard:fullscreen .notice,
.tk-doc .viewercard:-webkit-full-screen .notice{flex:none}

.tk-doc .placeholder{position:absolute;inset:0;padding:8% 9%;display:flex;flex-direction:column;gap:12px;background:#fff}
.tk-doc .placeholder .bar{height:11px;background:#eef0f5;border-radius:3px}
.tk-doc .placeholder .bar.t{height:20px;width:62%;background:#e3e6ee;margin:0 auto 6px}
.tk-doc .placeholder .bar.s{width:82%}
.tk-doc .placeholder .bar.m{width:94%}
.tk-doc .placeholder .bar.l{width:70%}
.tk-doc .placeholder .blk{height:70px;background:#f6f7fb;border-radius:5px;border-left:3px solid #e3e6ee}

.tk-doc .loading{position:absolute;inset:0;display:grid;place-items:center;background:rgba(255,255,255,.94);z-index:5}
.tk-doc .spinner{width:38px;height:38px;border:3px solid #e3e6f5;border-top-color:var(--blue);border-radius:50%;animation:tk-spin .8s linear infinite}
@keyframes tk-spin{to{transform:rotate(360deg)}}
.tk-doc .loadtxt{color:var(--ink3);font-size:13px;text-align:center;margin-top:14px}

/* ---------- 试读锁定引导 ---------- */
.tk-doc .lock-panel{width:100%;display:flex;flex-direction:column;align-items:center;margin-top:-16px}
.tk-doc .lock-fade{
  width:100%;max-width:680px;height:64px;
  background:linear-gradient(180deg,rgba(238,240,245,0),rgba(238,240,245,.85) 62%,#eef0f5);
  margin-bottom:-6px;pointer-events:none;
}
.tk-doc .lock-card{
  width:100%;max-width:680px;background:#fff;border:1px solid var(--line);border-radius:12px;
  padding:26px 30px 24px;text-align:center;box-shadow:0 10px 34px rgba(24,32,64,.10);
  background-image:linear-gradient(180deg,#fffaf1,#fff 42%);
}
.tk-doc .lock-ico{
  width:52px;height:52px;border-radius:50%;margin:0 auto 12px;display:grid;place-items:center;
  background:linear-gradient(135deg,#fdf1dc,#fbe6c4);color:#c9861f;
}
.tk-doc .lock-card h4{font-size:17px;font-weight:700;color:#8a6417}
.tk-doc .lock-card p{font-size:13.5px;color:var(--ink2);margin-top:8px;line-height:1.8}
.tk-doc .lock-card p b{color:#e2392b}
.tk-doc .lock-feats{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin:14px 0 16px}
.tk-doc .lock-feats span{font-size:12px;color:#8a6417;background:var(--gold-l);border:1px solid var(--gold-b);border-radius:12px;padding:2px 11px}
.tk-doc .lock-btn{
  display:block;height:44px;border-radius:8px;line-height:44px;
  background:linear-gradient(135deg,#f0b050,#e29a2a);color:#fff;font-size:15px;font-weight:600;
  box-shadow:0 6px 18px rgba(232,163,61,.35);max-width:300px;margin:0 auto;text-align:center;
}
.tk-doc .lock-btn:hover{color:#fff;filter:brightness(1.05)}
.tk-doc .lock-sub{font-size:12px;color:var(--ink4);margin-top:11px}
.tk-doc .lock-sub a{color:var(--blue)}

/* ---------- 未登录 / 无权限整块提示 ---------- */
.tk-doc .gate-block{
  min-height:460px;display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:linear-gradient(180deg,#f8f9fd,#eef0f5);padding:48px 24px;text-align:center;
}
.tk-doc .gate-block .gi{
  width:64px;height:64px;border-radius:50%;display:grid;place-items:center;margin-bottom:16px;
  background:linear-gradient(135deg,#eef1fe,#dde3fd);color:var(--blue);
}
.tk-doc .gate-block h4{font-size:18px;font-weight:700;color:var(--ink)}
.tk-doc .gate-block p{font-size:13.5px;color:var(--ink3);margin-top:9px;line-height:1.8;max-width:440px}
.tk-doc .gate-block .gbtns{display:flex;gap:12px;margin-top:20px;flex-wrap:wrap;justify-content:center}
.tk-doc .gate-block .gb{
  height:42px;padding:0 26px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;
  font-size:14.5px;font-weight:600;
}
.tk-doc .gate-block .gb.pri{background:var(--blue);color:#fff;box-shadow:0 6px 16px rgba(78,110,242,.28)}
.tk-doc .gate-block .gb.gold{background:linear-gradient(135deg,#f0b050,#e29a2a);color:#fff;box-shadow:0 6px 16px rgba(232,163,61,.3)}
.tk-doc .gate-block .gb.line{border:1px solid var(--line);color:var(--ink2);background:#fff}
.tk-doc .gate-block .gb.pri:hover,.tk-doc .gate-block .gb.gold:hover{filter:brightness(1.05);color:#fff}
.tk-doc .gate-block .gb.line:hover{color:var(--blue);border-color:var(--blue);background:var(--blue-l)}

@media (max-width:1080px){
  /* 整页滚动后不再限制 stage 高度，第一页始终完整显示 */
}
@media (max-width:640px){
  .tk-doc .stage{padding:14px 0}
  .tk-doc .pagewrap{padding:0 12px;gap:16px}
  .tk-doc .lock-card{padding:22px 18px 20px}
}