/* =====================================================================
 * Carnet · 页数轴   （样式 7 / 16）
 * ---------------------------------------------------------------------
 * ① 长按页码出现的临时页数轴与玻璃滑块
 * ② 浮在轴上方的页码
 *
 * 说明：样式拆分成多个文件后靠 <link> 顺序层叠，脱离这块上下文单独看时请留意。
 * ===================================================================== */
/* 长按页码出现的临时页数轴：细长一条，页码浮在轴上方 */
.scrub{
  position:absolute;left:0;right:0;bottom:100%;padding:0 14px 12px;z-index:30;
  opacity:0;transform:translateY(10px);pointer-events:none;
  transition:opacity .18s ease,transform .2s cubic-bezier(.3,.9,.3,1)
}
.scrub.show{opacity:1;transform:none;pointer-events:auto}
.scrub-wrap{position:relative}
.scrub-track{
  position:relative;height:28px;border-radius:14px;overflow:hidden;touch-action:none;
  /* 毛玻璃：半透明渐层 + 背景模糊，再加一道顶部高光和内侧描边 */
  background:linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,.08));
  border:1px solid rgba(255,255,255,.32);
  backdrop-filter:blur(18px) saturate(1.7) brightness(1.06);
  -webkit-backdrop-filter:blur(18px) saturate(1.7) brightness(1.06);
  box-shadow:0 14px 30px -18px rgba(0,0,0,.7),
    inset 0 1px 0 rgba(255,255,255,.5),inset 0 -1px 0 rgba(255,255,255,.1)
}
.scrub-ticks{position:absolute;inset:0;display:flex;align-items:center;pointer-events:none}
.scrub-ticks i{flex:1 1 0;display:flex;align-items:center;justify-content:center;height:100%}
.scrub-ticks i::before{content:"";width:1px;height:6px;border-radius:1px;background:rgba(255,255,255,.5)}
.scrub-ticks i.maj::before{width:1.5px;height:13px;background:rgba(255,255,255,.8)}
.scrub-fill{
  position:absolute;left:0;top:0;bottom:0;pointer-events:none;
  background:linear-gradient(90deg,rgba(255,255,255,.16),rgba(224,102,138,.38));
  border-right:1px solid rgba(255,255,255,.28)
}
/* 拖动条：玻璃滑块，中间留一道粉色竖线做焦点 */
.scrub-bar{
  position:absolute;left:0;top:50%;width:7px;height:26px;margin-top:-13px;margin-left:-3.5px;
  border-radius:7px;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,.62));
  backdrop-filter:blur(10px) saturate(1.5);-webkit-backdrop-filter:blur(10px) saturate(1.5);
  border:1px solid rgba(255,255,255,.85);
  box-shadow:0 4px 14px -3px rgba(20,22,40,.55),0 0 0 1px rgba(224,102,138,.5),
    inset 0 1px 0 rgba(255,255,255,.95);
  transition:height .14s ease,margin-top .14s ease,width .14s ease,margin-left .14s ease
}
.scrub-bar::after{
  content:"";position:absolute;left:50%;top:50%;width:2px;height:10px;margin:-5px 0 0 -1px;
  border-radius:1px;background:rgba(224,102,138,.85)
}
.scrub.dragging .scrub-bar{width:9px;margin-left:-4.5px;height:30px;margin-top:-15px}
/* 页码：浮在轴上方 */
.scrub-num{
  position:absolute;bottom:calc(100% + 7px);left:0;transform:translateX(-50%);
  min-width:34px;height:24px;padding:0 8px;border-radius:8px;
  display:grid;place-items:center;pointer-events:none;
  background:rgba(224,102,138,.5);color:#fff;font-size:12.5px;font-weight:700;
  font-variant-numeric:tabular-nums;letter-spacing:0;
  backdrop-filter:blur(14px) saturate(1.6);-webkit-backdrop-filter:blur(14px) saturate(1.6);
  border:1px solid rgba(255,255,255,.55);
  box-shadow:0 6px 16px -6px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.35)
}
.scrub-num::after{
  content:"";position:absolute;top:100%;left:50%;margin-left:-4px;
  border:4px solid transparent;border-top-color:rgba(224,102,138,.72)
}

/* 封面页：整页铺满，不留白 */
.paper.coverpage{display:block;padding:0}
.paper.coverpage .cover{
  width:100%;height:100%;max-height:none;aspect-ratio:auto;border-radius:0;box-shadow:none
}
/* 铺满时封面比例随纸张变化，图案贴片改按「封面宽度」取尺寸（--pw），
   形状不会跟着纸张比例变形，疏密也与主页 3:4.05 封面完全一致 */
.paper.coverpage .pattern[data-pat="dots"]{background-size:calc(var(--pw,340px)*.094) calc(var(--pw,340px)*.094)!important}
.paper.coverpage .pattern[data-pat="grid"]{background-size:calc(var(--pw,340px)*.141) calc(var(--pw,340px)*.141),calc(var(--pw,340px)*.141) calc(var(--pw,340px)*.141)!important}
.paper.coverpage .pattern[data-pat="circle"]{background-size:calc(var(--pw,340px)*.33) calc(var(--pw,340px)*.5716)!important}
.paper.coverpage .pattern[data-pat="triangle"]{background-size:calc(var(--pw,340px)*.282) calc(var(--pw,340px)*.329)!important}
.paper.coverpage .pattern[data-pat="star"],.paper.coverpage .pattern[data-pat="leaf"]{background-size:calc(var(--pw,340px)*.271) calc(var(--pw,340px)*.271)!important}
.paper.coverpage .pattern[data-pat="heart"]{background-size:calc(var(--pw,340px)*.2) calc(var(--pw,340px)*.2)!important}
.paper.coverpage .pattern[data-pat="check"]{background-size:calc(var(--pw,340px)*.235) calc(var(--pw,340px)*.235)!important}