/* ============================================================================
 * guji-typeset.css — 古籍排版样式（从「古籍工作室」迁移）
 * 所有规则限定在 .wtc-page 作用域内，避免污染网站既有样式（Tailwind）。
 * ==========================================================================*/

.wtc-page{
  /* 主题变量（原工作室 :root 子集，限定于此作用域） */
  --accent:#9c3b2e;
  --accent2:#b8862f;
  --paper:#f4ecd8;
  --framecol:rgba(70,45,15,.82);
  --framew:2px;
  --shadow:0 2px 10px rgba(60,45,20,.12);
  position:relative;padding:0;margin:0 auto 0;background:var(--paper);
  box-shadow:none;border:none;display:inline-block;text-align:start;max-width:100%;
  box-sizing:border-box;
}
.wtc-page.vertical{writing-mode:vertical-rl;text-orientation:upright;padding-top:calc(var(--fs)*1.3);}
.wtc-page.vertical.show-border{
  background-image:repeating-linear-gradient(to left,transparent 0,transparent calc(var(--colw) - 1px),var(--linecol) calc(var(--colw) - 1px),var(--linecol) var(--colw));
  background-size:calc(var(--ncols,20) * var(--colw)) 100%;
  background-repeat:no-repeat;
  background-position:right top;
  /* 烏絲欄只畫在版框內：以內容盒為定位基準，天頭、地腳留白 */
  background-origin:content-box;
}
/* 适配阅读页容器：高度撑满、宽度随列数收缩并水平居中（最右列与最左列到边界距离相等） */
.wtc-page.guji-fit{width:fit-content;height:100%;display:block;margin:0 auto;}
/* 版框固定：頁高 = 天頭 + 全書最長純正文列 + 地腳，各頁版框等高（字少則框內留白）
   直排時改為 height:auto，避免 height:100% 把頁面撐滿容器、版框也跟著變高 */
.wtc-page.guji-fit.vertical{height:auto;min-height:calc(var(--padtop, 0px) + var(--guji-bodyh, 0px) + var(--padbottom, 0px));}

/* 頂格基准线 = 不縮進、不抬眼時正文第一字的起排線（版框基準上緣）。
   它是校對輔助線，不是版式的一部分：只在編輯模式下顯示（body.guji-editing），
   讀者視圖永遠看不到。定位直接取 --padtop，不再用寫死的 fs*1.3。 */
.wtc-page .baseline-mark{display:none;position:absolute;top:var(--padtop,calc(var(--fs)*1.3));left:6px;right:6px;border-top:1px dashed rgba(156,59,46,.6);pointer-events:none;z-index:3;}
body.guji-editing .wtc-page .baseline-mark{display:block;}
.wtc-page .baseline-mark::after{content:"頂格";position:absolute;left:0;top:-1.4em;font-size:10px;line-height:1;color:rgba(156,59,46,.55);writing-mode:horizontal-tb;font-family:sans-serif;letter-spacing:.08em;}

/* 外版框：線比烏絲欄（1px, alpha .3~.5）明顯粗、明顯實。
   框頂 = 本頁最高字頂（抬眼後的起排線）；上緣在抬眼處凸起成「凸」字形階梯，由引擎逐欄吐 <i>。
   下邊貼地腳，左右豎邊各自從本側欄位的字頂起畫。 */
.wtc-page .ts-frame{position:absolute;pointer-events:none;z-index:0;}
.wtc-page .ts-frame i{position:absolute;display:block;box-sizing:border-box;margin:0;padding:0;}
.wtc-page .ts-frame .ft{border-top:var(--framew,2px) solid var(--framecol);}
.wtc-page .ts-frame .fb{border-bottom:var(--framew,2px) solid var(--framecol);}
.wtc-page .ts-frame .fl{width:0;border-left:var(--framew,2px) solid var(--framecol);}
.wtc-page .ts-frame .fr{width:0;border-right:var(--framew,2px) solid var(--framecol);}
.wtc-page .ts-frame .fv{width:0;border-left:var(--framew,2px) solid var(--framecol);}
.wtc-page .ts-frame .fu{width:0;border-left:1px solid var(--linecol);}
/* 外版框與界欄（烏絲欄）是兩個獨立開關：.no-frame 關版框，.show-border 開界欄 */
.wtc-page.no-frame .ts-frame{display:none;}

/* 列：line-height 决定列的物理宽度（竖排 block 轴），直接 = var(--colw)，
   字形(1em)在行盒内水平居中 → 乌丝栏线与列完全对齐，间距 = colw - 1em = gap */
.wtc-page .col{display:block;writing-mode:vertical-rl;text-orientation:upright;font-family:var(--tsfont);font-size:var(--fs);line-height:var(--colw);letter-spacing:.04em;color:var(--tsink);padding:4px 0;white-space:nowrap;position:relative;height:fit-content;--jz-fs:var(--fs);width:var(--colw);} /* width 必須鎖死：\圈點 的 text-emphasis 畫在行框外，會把該欄撐寬 9px，導致上框線（按 colw 累加）短一截、抬眼階梯錯位。版心、烏絲欄、外框全部以 colw 為單位，欄寬必須全頁一致。 */ /* --jz-fs 为「小字基准字號」：各段再乘 (1/N) 比例 */
.wtc-page .col-empty{width:var(--colw);min-width:var(--colw);}

/* 夹注（双行 / N 行小字） */
.wtc-page .jiazhu{display:inline-flex;flex-direction:column;font-size:var(--jz-fs);vertical-align:top;color:var(--tsink);margin:0;align-items:stretch;} /* font-size 由各段 (1/N) 比例经 calc(var(--jz-fs)*ratio) 控制；此处仅为兜底 */
.wtc-page .jz-col{writing-mode:vertical-rl;text-orientation:upright;line-height:1.05;width:calc(var(--colw)*.5);white-space:nowrap;} /* 解除对列 line-height(colw) 的继承，小字行盒≈0.62em×1.3≈半列宽 */

/* 句读：朱圈 / 朱点（替换原标点） */
.wtc-page .judou{vertical-align:middle;box-sizing:border-box;}
.wtc-page .judou.ju{display:inline-block;width:.62em;height:.62em;border:1.5px solid var(--accent);border-radius:50%;margin:0 .14em;}
.wtc-page .judou.dou{color:var(--accent);font-size:.66em;line-height:1;margin:0 .14em;vertical-align:middle;position:relative;top:.02em;}

.wtc-page .item-mark{color:var(--accent);margin-inline-end:.2em;}

/* 圈点 / 专名号 / 书名号 / 反白 */
.wtc-page .ts-emphasis{text-emphasis:filled circle;text-emphasis-position:left;color:var(--accent);}
.wtc-page .ts-proper,.wtc-page .ts-book{position:relative;text-decoration:none;}
.wtc-page .ts-proper::before,.wtc-page .ts-book::before{content:'';position:absolute;top:.17em;bottom:.17em;pointer-events:none;}
.wtc-page .ts-proper::before{left:-.1em;width:1.4px;background:var(--accent);}
.wtc-page .ts-book::before{left:-.16em;width:3.5px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='4' height='6' viewBox='0 0 4 6' preserveAspectRatio='none'%3E%3Cpath d='M0 0 Q2 1.5 4 3 Q2 4.5 0 6' stroke='%239c3b2e' fill='none' stroke-width='1'/%3E%3C/svg%3E");
  background-repeat:repeat-y;background-size:100% 6px;background-position:left center;}
.wtc-page .ts-invert{background:var(--tsink);color:var(--paper);padding:0 .12em;border-radius:2px;}

/* 側批：縱向錨定所在列（top 取靜態位置，即命令在該列中的位置），橫向落到版框外的「書耳」。
   絕對定位 → 不佔列寬，列距得以維持 0.40em；--slot 由引擎逐列寫入（0 = 最右欄）。
   右書耳：right = −(該列距右緣欄數 × colw + 側批字道寬 + 距)；right 定的是「右緣」，
           必須把字道寬一起算進去，否則側批會從邊界往左長、壓在最右一列的字上
   左書耳：left  = −(該列距左緣欄數 × colw + 側批字道寬 + 距)（頁面另補等寬 padding）
   字道寬 ≈ 0.46em × line-height 1.25 ≈ 0.6em；距 = --note-dist，默認 2px */
.wtc-page .ts-side{position:absolute;right:calc(-1 * (var(--slot,0) * var(--colw) + var(--fs) * 0.6 + var(--note-dist, 2px)));left:auto;writing-mode:vertical-rl;text-orientation:upright;font-size:.46em;line-height:1.25;color:var(--accent2);max-height:calc(var(--fs)*7);overflow:hidden;white-space:nowrap;z-index:4;pointer-events:none;background:transparent;}
.wtc-page .ts-side[data-ear="left"]{right:auto;left:calc(-1 * ((var(--ncols) - var(--slot,0) - 1) * var(--colw) + var(--fs) * 0.6 + var(--note-dist, 2px)));}

/* 眉批：页面顶部横栏，从右到左，底边贴「本页最高字顶」。
   --mpband = 天頭中留给眉批的那一层（= 上留白 + 眉批高度），其底边即抬眼后的正文起排线。
   字号必须用 calc(var(--fs)*.6) —— 原来的 .6em 以 body 的 16px 为基准，
   算出 9.6px 被浏览器钳到 12px，既不随字号变化，也把 mh 的估算撑出几十 px 空白。
   排版：每一条 \眉批 是一个 .mp-group。
     · 组内 (.mp-group) 逐列 align-items:flex-start —— 上对齐，末列字数少时就悬在上方（直排本来如此）；
     · 组间 (.ts-meipi) align-items:flex-end —— 每条眉批的底边同贴抬眼后的字顶线；
     · 组内列距 --mpg；眉批与眉批之间 = 2 × --mpg。 */
.wtc-page .ts-meipi{position:absolute;top:0;left:0;right:0;height:var(--mpband,var(--padtop,auto));font-size:calc(var(--fs)*.6);--mpg:calc(var(--fs)*.168);writing-mode:horizontal-tb;display:flex;flex-direction:row-reverse;gap:calc(var(--mpg)*2);justify-content:flex-start;align-items:flex-end;padding:0 6px;overflow:hidden;pointer-events:none;z-index:5;}
.wtc-page .ts-meipi .mp-group{display:flex;flex-direction:row-reverse;align-items:flex-start;gap:var(--mpg);flex:0 0 auto;}
.wtc-page .ts-meipi .mp{writing-mode:vertical-rl;text-orientation:upright;font-size:calc(var(--fs)*.6);line-height:1.1;color:var(--accent2);max-height:var(--meipi-h,6em);overflow:hidden;white-space:nowrap;}

/* 批注：页面级浮动批注框（绝对定位、自动分列）
   背景透明：批注文字直接浮在纸面／正文之上，不加白色底块 */
.wtc-page .ts-pizhu{position:absolute;writing-mode:vertical-rl;text-orientation:upright;font-family:var(--tsfont);
  font-size:.62em;color:var(--accent2);line-height:1.7;letter-spacing:.04em;
  background:transparent;padding:3px 2px;
  overflow:hidden;z-index:6;pointer-events:none;}

/* 版心（鱼尾 + 书名 + 章节 + 页码）：line-height 同列宽，与正文列对齐
   高度 = 全書最長純正文列（--guji-bodyh，由 __gujiUF 依 maxMchars × fs × 1.06 算出），
   全書一致；未設定時退回撐滿版框的舊行為。 */
.wtc-page .banxin{writing-mode:vertical-rl;text-orientation:upright;line-height:var(--colw);white-space:nowrap;overflow:hidden;display:flex;flex-direction:row;align-items:center;justify-content:space-between;font-family:var(--tsfont);font-size:calc(var(--fs)*.72);color:var(--tsink);box-sizing:border-box;width:var(--colw);height:var(--guji-bodyh,auto);min-height:0;padding:6px 2px;}
.wtc-page .banxin .yuwei{writing-mode:horizontal-tb;text-orientation:upright;color:var(--accent);font-size:calc(var(--fs)*1.1);line-height:1;}
.wtc-page .banxin .bx-title{letter-spacing:.12em;font-weight:600;}
.wtc-page .banxin .bx-chap-wrap{display:flex;flex-direction:row;gap:.3em;align-items:center;}
.wtc-page .banxin .bx-chap{font-size:calc(var(--fs)*.6);}
.wtc-page .banxin .bx-page{font-size:calc(var(--fs)*.7);}

/* 模板 */
.wtc-page.tpl-siku{--tsfont:"Noto Serif CJK SC","Source Han Serif SC","Songti SC","SimSun",serif;--tsink:#1c140c;--linecol:rgba(90,60,20,.45);--framecol:rgba(62,40,12,.85);}
.wtc-page.tpl-honglou{--tsfont:"Noto Serif CJK SC","KaiTi","STKaiti","SimSun",serif;--tsink:#5a1a12;--linecol:rgba(150,40,30,.5);--framecol:rgba(118,28,20,.85);--paper:#f7efe2;}
.wtc-page.tpl-modern{--tsfont:"Noto Sans CJK SC","PingFang SC","Microsoft YaHei",sans-serif;--tsink:#222;--linecol:rgba(80,80,90,.35);--framecol:rgba(58,58,68,.72);--paper:#ffffff;}
.wtc-page.tpl-minimal{--tsfont:"Noto Serif CJK SC","Songti SC","SimSun",serif;--tsink:#333;--linecol:rgba(120,120,120,.3);--framecol:rgba(88,88,88,.62);--paper:#faf7f0;}

/* 阅读页宿主容器 */
.guji-typeset-host{display:flex;align-items:center;justify-content:center;overflow:hidden;}

/* ============================================================================
 * 書衣（書皮）：磁青布面
 * 傳統書衣是一整面布／紙，只貼一張題簽寫書名，沒有版框、界欄、版心，
 * 也不編葉次。故這裡覆蓋掉一般頁的紙色與書寫模式，只留布面質感。
 * 語法：\書衣（純布面）／\書衣{名蹟日錄}（帶題簽）
 * ==========================================================================*/
.wtc-page.guji-shouyi{
  writing-mode:horizontal-tb;
  display:block;
  padding:0;margin:0 auto;
  border-radius:2px;
  /* 兩層極細斜紋模擬布紋（經線／緯線）＋中心柔光＋磁青底色 */
  background:
    repeating-linear-gradient(90deg, rgba(255,255,255,.045) 0 1px, transparent 1px 3px),
    repeating-linear-gradient(0deg, rgba(0,0,0,.07) 0 1px, transparent 1px 3px),
    radial-gradient(120% 85% at 28% 8%, rgba(255,255,255,.09), transparent 62%),
    linear-gradient(158deg,#37455f 0%,#28344c 46%,#1b2434 100%);
  box-shadow:inset 0 0 70px rgba(0,0,0,.42);
}
/* 題簽：豎排簽條，米色宣紙底、細褐邊，貼左上 */
.wtc-page.guji-shouyi .shouyi-tiqian{
  position:absolute;left:7%;top:5%;
  box-sizing:border-box;
  width:var(--tq-w,60px);height:var(--tq-h,220px);
  writing-mode:vertical-rl;text-orientation:upright;
  display:flex;align-items:center;justify-content:center;
  padding:4px 2px;
  background:linear-gradient(100deg,#f7f0dc 0%,#ecdcbb 55%,#e0cba2 100%);
  border:1px solid rgba(96,72,36,.5);
  border-radius:1px;
  box-shadow:0 2px 6px rgba(0,0,0,.42), inset 0 0 10px rgba(160,120,60,.16);
  color:#241708;
  font-family:var(--tsfont);
  letter-spacing:.16em;line-height:1.05;
  white-space:nowrap;overflow:hidden;
}

/* ============================================================================
 * 牌記：四周雙邊（外粗內細）長方框
 * 排在書名頁之後那半頁，四周大量留白，正中一圈雙線墨框，框內豎排小字，
 * 由右往左，記刻版時間／機構／藏版處。不編葉次。
 * 語法：\牌記{乾隆壬辰秋鐫|池北草堂藏板}
 * ==========================================================================*/
.wtc-page.guji-paiji{
  writing-mode:horizontal-tb;
  display:block;padding:0;margin:0 auto;
  background:var(--paper);
}
.wtc-page.guji-paiji .pj-frame{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  box-sizing:border-box;
  /* 外框：粗 */
  border:var(--framew,2px) solid var(--framecol);
  /* 兩框之間留白（此值即「雙邊」中間那道白線的寬度） */
  padding:5px;
}
.wtc-page.guji-paiji .pj-inner{
  box-sizing:border-box;
  /* 內框：細 */
  border:1px solid var(--framecol);
  display:flex;flex-direction:row-reverse;align-items:center;justify-content:center;
}
.wtc-page.guji-paiji .pj-col{
  writing-mode:vertical-rl;text-orientation:upright;
  font-family:var(--tsfont);
  line-height:1.12;letter-spacing:.08em;
  color:var(--tsink);white-space:nowrap;
}

/* ============================================================================
 * 著錄印章（印文 / yinwen）
 * 外層 .yinwen-wrap 寬度 = 一列（--colw），負責「列居中」——
 *   這是它與單行小字註文的根本區別：注文靠列右，印章在列內居中。
 * 內層 .ts-yinwen 才是看得見的印框（方／圓／葫蘆）。
 * 類名一律 yinwen-*，不佔用 seal-*：那組留給 luatex-cn 語義的「藏書印」。
 * ==========================================================================*/
.wtc-page .yinwen-wrap{
  display:inline-block;
  writing-mode:horizontal-tb;
  width:var(--colw);
  text-align:center;
  vertical-align:top;
  line-height:1;
}
.wtc-page .ts-yinwen{
  display:inline-block;
  position:relative;
  box-sizing:border-box;
  vertical-align:top;
  color:var(--tsink);
  line-height:1;
}
.wtc-page .ts-yinwen.yinwen-square,
.wtc-page .ts-yinwen.yinwen-circle{
  border:1.5px solid var(--framecol);
}
.wtc-page .ts-yinwen.yinwen-circle{ border-radius:50%; }

/* 框內文字：每列各自垂直排，整體在框中央 */
.wtc-page .ts-yinwen .yinwen-cols{
  position:absolute;inset:0;
  display:flex;flex-direction:row-reverse;
  align-items:center;justify-content:center;
}
.wtc-page .ts-yinwen .yinwen-col{
  writing-mode:vertical-rl;text-orientation:upright;
  line-height:1;
  white-space:nowrap;
  height:100%;
  display:flex;align-items:center;justify-content:center;
}

/* 葫蘆：SVG 畫雙線輪廓（上球 70%、下球滿寬、中間收腰） */
.wtc-page .ts-yinwen.yinwen-gourd .yinwen-shape{
  position:absolute;inset:0;width:100%;height:100%;
  fill:none;stroke:var(--framecol);stroke-width:1.6;
  vector-effect:non-scaling-stroke;
  pointer-events:none;
}
.wtc-page .ts-yinwen.yinwen-gourd .yinwen-ch{
  position:absolute;left:50%;
  transform:translate(-50%,-50%);
  writing-mode:vertical-rl;text-orientation:upright;
  line-height:1;white-space:nowrap;
  color:var(--tsink);
}
