/* FELINIA visual-novel stage */
#pnTx,.g3dRail{display:block!important}
#pnTx{background:#15120d!important;box-shadow:none!important;
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important}
#pnTx::after{display:none!important}
#vnIsle{position:absolute;inset:0;overflow:hidden;background:#15120d;isolation:isolate}
/* 关掉背景图的原生拖拽：不关的话，按住窗身往边上拖，浏览器以为你要把这张图拖走，
   发一个 pointercancel 把挪窗那一趟掐断。 */
#vnBgA,#vnBgB{-webkit-user-drag:none;user-select:none;-webkit-user-select:none;
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;
  transition:opacity 1.05s ease;filter:saturate(.9) contrast(1.03)}
#vnWash{position:absolute;inset:0;z-index:2;pointer-events:none;
  background:none;box-shadow:none}
#vnCast,#vnEnsemble{position:absolute;inset:0;z-index:3;pointer-events:none;overflow:hidden}
#vnEnsemble{z-index:2}
/* 立绘从 <img> 换成了 <canvas>：出场要一格一格显形（felPix），得有画布可画。
   object-fit 在 canvas 上一样管用（canvas 也是替换元素），所以下面这些一句没改。

   高只写 height，不再写 max-width —— 原先两条一起写，宽度会先卡住：
   卡住之后 contain 在那只变窄的盒子里再缩一道，画出来的高就成了「宽 ÷ 各自的长宽比」。
   一张 1536×1024 的横构图和一张 1200×1200 的方构图并排站，前者矮后者三成；
   屏幕越窄卡得越狠（手机全屏实测：三个人只剩画框高的 16%～25%，还彼此差 33%）。
   现在宽度一律随高走，等高就是真的等高；宽出去多少由 castFit() 统一收，
   收的是所有人同一个系数，所以谁也不会比谁矮。 */
#vnCast .vnActor{position:absolute;top:3%;bottom:auto;left:50%;height:240%;object-fit:contain;
  object-position:center bottom;transform:translateX(-50%);filter:drop-shadow(0 10px 18px rgba(0,0,0,.66));
  opacity:1;transition:left .8s cubic-bezier(.3,.1,.25,1),filter .55s ease,transform .55s ease}
#vnCast .vnActor.speaking{filter:drop-shadow(0 8px 20px rgba(0,0,0,.72)) brightness(1.08);
  transform:translateX(-50%) translateY(-1.5%) scale(1.025)}
#vnEnsemble img,#vnEnsemble canvas{position:absolute;left:50%;top:3%;bottom:auto;width:120%;height:240%;object-fit:contain;
  object-position:center bottom;transform:translateX(-50%);filter:drop-shadow(0 10px 18px rgba(0,0,0,.64));opacity:1}
#game.tx2 #vnCast .vnActor{top:2%;bottom:auto;height:160%}
#game.tx2 #vnEnsemble img,#game.tx2 #vnEnsemble canvas{top:2%;bottom:auto;width:108%;height:160%}
#game.txBig #vnCast .vnActor{top:auto;bottom:0;height:94%}
#game.txBig #vnEnsemble img,#game.txBig #vnEnsemble canvas{top:auto;bottom:0;width:96%;height:94%}
/* 纪年与时地：原先是一块带底色和金色左边框的牌子，压在左上角那一位的头脸上。
   撤掉底与框，照立绘脚下名牌（.vnName）与右上角地名（#vnLoc）同一种写法——
   字直接落在画上，靠一层黑影浮出来。两行一金一浅，主次还在。 */
#vnEra{position:absolute;left:13px;top:10px;z-index:5;max-width:62%;pointer-events:none;
  font:11px/1.6 var(--mono);letter-spacing:.25em;
  /* 比名牌多垫一层贴身的暗影：名牌落在画面下缘（多半是暗处），
     这两行在左上角，背后常常是一整片亮天，只有散影撑不住。
     贴身那一层不是描边，是把笔画根部压深一档，远看仍是「字直接落在画上」。 */
  text-shadow:0 1px 6px #000,0 0 10px rgba(0,0,0,.72),0 0 2px rgba(0,0,0,.95)}
#vnEra b{display:block;font-weight:400;color:rgba(230,204,150,.86);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#vnEra span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  color:rgba(238,228,208,.72)}
#vnLoc{position:absolute;right:12px;top:10px;z-index:5;writing-mode:vertical-rl;max-height:65%;overflow:hidden;
  color:rgba(230,204,150,.86);font:11px/1.5 var(--mono);letter-spacing:.25em;text-shadow:0 1px 6px #000}
#vnSpeaker{position:absolute;left:13px;bottom:calc(var(--vnGap,0px) + 10px);z-index:5;padding:4px 8px;
  border:1px solid rgba(201,155,63,.45);
  background:rgba(18,13,7,.72);color:#f1e7d2;font:10px/1.2 var(--mono);letter-spacing:.12em;opacity:0;
  transition:opacity .35s ease,bottom .3s ease}
#vnSpeaker.on{opacity:1}
/* 对话框开着的时候，框上那一枚说话人牌已经在说这件事了，这一枚不必再说一遍。 */
#vnIsle.talkOn #vnSpeaker{opacity:0}
/* 窗上的两枚小钮。档位钮按的是左边那一列同一个循环（__txCycle）——
   眼睛在窗里，手不必再伸到窗外去。归位钮平时不占地方，窗子挪过位才浮出来。 */
#vnZoom,#vnHome{position:absolute;right:10px;z-index:7;width:24px;height:24px;padding:0;
  display:flex;align-items:center;justify-content:center;
  border:1px solid rgba(235,219,184,.3);background:rgba(18,13,7,.66);
  color:rgba(241,231,210,.86);font:12px/1 var(--mono);cursor:pointer}
#vnZoom{top:8px}
#vnHome{top:38px;display:none}
#vnHome.on{display:flex}
#vnZoom:hover,#vnHome:hover{border-color:rgba(201,155,63,.7);color:#fff}
/* 竖排的地名原来贴着右上角，两枚钮就压在它头上——让它往下挪一档，宽度也收一点。 */
#vnLoc{top:68px;max-height:calc(65% - 58px)}
/* ── 立绘脚下的名牌 ──
   贴着框底站，横向跟着各自那一位的位置走。名牌不做成立绘的孩子：
   立绘是画布（装不下别的元素），而且它的盒子比人高出好几倍——
   靠 object-fit 裁出上半身，名字挂在它身上会飘到画外去。

   不挂框、不垫底色，照右上角那枚地名的写法：一样的等宽字、一样的暖金、
   一样疏的字距，靠一层黑影从画面里浮出来。字直接落在图上，人就不被挡。
   说话的那一位亮成白的，影子再厚一档——和立绘那边同一个记号。

   字距是加在每个字后面的（末一个也加），盒子于是比看得见的字宽出一格，
   translateX(-50%) 居中就会整体偏左半格；补一个同样大的首行缩进正好抵平。 */
#vnCast .vnName{position:absolute;bottom:calc(var(--vnTalkH,0px) + var(--vnGap,0px) + 6px);z-index:4;
  transform:translateX(-50%);white-space:nowrap;pointer-events:none;
  color:rgba(230,204,150,.86);font:11px/1.5 var(--mono);font-weight:400;
  letter-spacing:.25em;text-indent:.25em;
  text-shadow:0 1px 6px #000,0 0 10px rgba(0,0,0,.72);
  transition:bottom .3s ease,color .35s ease,text-shadow .35s ease}
#vnCast .vnName.speaking{color:#fff;
  text-shadow:0 1px 6px #000,0 0 12px rgba(0,0,0,.85),0 0 20px rgba(201,155,63,.45)}
/* ── 全屏那一档：底下那只对话框 ──
   只在全屏出现。小窗与放大两档的框本来就矮，压上一条对话框就什么也看不见了。 */
#vnTalk{display:none;position:absolute;left:0;right:0;bottom:var(--vnGap,0px);z-index:9;
  box-sizing:border-box;min-height:var(--vnTalkH,150px);padding:20px 26px 24px;
  border-top:1px solid rgba(201,155,63,.5);
  background:linear-gradient(180deg,rgba(14,10,6,.62) 0%,rgba(14,10,6,.9) 26%,rgba(14,10,6,.94) 100%);
  color:#f2e9d6;font:15px/1.85 var(--mono);letter-spacing:.05em;cursor:pointer;
  -webkit-user-select:none;user-select:none}
/* 出场：从底下托上来，缓动与时长取地图·装备·商店那三扇（.gPanel）的同一条。
   框本身的样子不动 —— 玻璃、投影、罩子那一套已经撤了，只留这一下。
   用 animation 不用 transition：这只框是 display:none 翻成 block 的，
   过渡在那一帧不生效（同一帧里既显形又改形，浏览器直接画在终点上），
   动画则照常从头跑。而 talkPaint 每念一句都调一次 classList.toggle('on',true)，
   同一个类反复写不算重加，所以只在开口那一次托，不会每句都来一遍。 */
#game.txBig #vnTalk.on{display:block;
  animation:vnTalkUp .34s cubic-bezier(.2,.85,.25,1) both}
@keyframes vnTalkUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
#game.txBig #vnIsle{--vnTalkH:clamp(120px,22vh,190px)}
#vnTalkWho{position:absolute;left:22px;top:-13px;padding:4px 12px;opacity:0;
  border:1px solid rgba(201,155,63,.72);background:rgba(28,19,8,.96);
  color:#e7c684;font:11px/1.2 var(--mono);font-weight:500;letter-spacing:.2em;
  text-shadow:0 1px 4px #000;transition:opacity .25s ease}
#vnTalkWho.on{opacity:1}
#vnTalkBody{min-height:calc(1.85em * 2);max-height:calc(1.85em * 4);overflow:hidden}
#vnTalkNum{position:absolute;right:52px;bottom:8px;font:9px/1 var(--mono);font-style:normal;
  letter-spacing:.18em;color:rgba(230,214,182,.5)}
#vnTalkTip{position:absolute;right:26px;bottom:6px;font:11px/1 var(--mono);font-style:normal;
  color:rgba(215,181,109,.9);opacity:0;transition:opacity .2s ease}
#vnTalkTip.on{opacity:1;animation:vnTip 1.1s ease-in-out infinite}
@keyframes vnTip{0%,100%{transform:translateY(0)}50%{transform:translateY(3px)}}
#vnReplay{display:none;position:absolute;right:10px;bottom:calc(var(--vnGap,0px) + 9px);z-index:8;padding:5px 10px;
  border:1px solid rgba(201,155,63,.5);background:rgba(18,13,7,.72);
  color:rgba(235,214,170,.9);font:10px/1.2 var(--mono);letter-spacing:.12em;cursor:pointer}
#game.txBig #vnReplay.on{display:block}
#vnReplay:hover{border-color:rgba(201,155,63,.9);color:#fff}
#vnTalkX{position:absolute;right:14px;top:10px;width:22px;height:22px;padding:0;
  display:flex;align-items:center;justify-content:center;
  border:1px solid rgba(235,219,184,.26);background:rgba(18,13,7,.6);
  color:rgba(241,231,210,.7);font:11px/1 var(--mono);cursor:pointer}
#vnTalkX:hover{border-color:rgba(201,155,63,.7);color:#fff}
/* 轨上的名字有四个字，字距收一档，免得连同「·全屏」一起横着摊出去。 */
#arr3d .t{font-size:0;letter-spacing:.1em}
#arr3d .t::before{content:'视觉小说';font-size:8px}
#game.txOpen.tx2 #arr3d .t::after{content:'·放大';font-size:8px}
#game.txOpen.txBig #arr3d .t::after{content:'·全屏';font-size:8px}
@media(max-width:760px){
  #vnCast .vnActor{top:2%;height:240%}
  #vnEnsemble img,#vnEnsemble canvas{top:2%;height:240%;width:130%}
  #game.tx2 #vnCast .vnActor{height:150%}
  #game.tx2 #vnEnsemble img,#game.tx2 #vnEnsemble canvas{height:150%;width:114%}
  #game.txBig #vnCast .vnActor{top:auto;height:92%}
  #game.txBig #vnEnsemble img,#game.txBig #vnEnsemble canvas{top:auto;height:92%;width:102%}
  #vnEra{left:8px;top:7px;max-width:68%;font-size:9px;letter-spacing:.18em}
  #vnLoc{right:7px;top:7px;font-size:9px}
  #vnSpeaker{left:8px;bottom:7px;font-size:8px}
  #vnZoom,#vnHome{right:6px;width:22px;height:22px;font-size:11px}
  #vnCast .vnName{font-size:9px;letter-spacing:.18em;text-indent:.18em}
  #game.txBig #vnIsle{--vnTalkH:clamp(104px,26vh,170px)}
  #vnTalk{padding:16px 16px 20px;font-size:13.5px;line-height:1.75}
  #vnTalkWho{left:14px;font-size:10px;padding:3px 9px}
  #vnTalkNum{right:44px}
  #vnTalkTip{right:20px}
  #vnZoom{top:6px}
  #vnHome{top:32px}
  #vnLoc{top:58px;max-height:calc(65% - 50px)}
}
@media(prefers-reduced-motion:reduce){#vnBgA,#vnBgB,#vnCast .vnActor,#vnCast .vnName{transition:none}
  #vnTalkTip.on{animation:none}
  #game.txBig #vnTalk.on{animation:none}}