/* 珠內 2.5D 閱讀舞台：清水模 × 侘寂 × 禪意極簡 × 博物館式展覽 × 無印 × 療癒
 * 場景全部以 CSS 繪製（無外部美術資產）；之後可用分層 PNG/WebP 逐件替換 .rm-obj 與 .rm-shell。 */
.room{--tex-fine:none;--tex-cloud:none;--wall:#ddd8d0;--wall2:#e8e3da;--shade:#b6afa5;--wood:#bfa78c;--wood2:#a98e70;--ink:#292622;--acc:#922b27;--metal:#af9270;
  --cw:min(740px,50vw);--chh:min(58vh,540px);--cl:calc(50vw - var(--cw) / 2);--ct:calc(46vh - var(--chh) / 2);
  --lit:255,226,184;--lita:.5;--px:0px;--py:0px;
  position:fixed;inset:0;z-index:60;overflow:hidden;background:#cfc8bd;color:var(--ink);
  font-family:"Noto Serif TC Site","Noto Serif TC","Songti TC",serif;opacity:1;transition:opacity .4s}
.room[hidden]{display:none}
.room.closing{opacity:0}
.rm-stage{position:absolute;inset:0;transform-origin:50% 47%}
.rm-scene{position:absolute;inset:0}
.rm-scene>*{position:absolute}

/* ---------- 房間外殼：一點透視（後牆、天花、地面、左右牆） ---------- */
.rm-shell{inset:0;translate:calc(var(--px) * -.25) calc(var(--py) * -.25);transition:opacity .55s ease}
.rm-shell>i{position:absolute;inset:0;display:block}
.rm-shell .back{inset:auto;left:15%;right:15%;top:9%;bottom:26%;
  background:radial-gradient(ellipse 60% 70% at 50% 0%,rgba(var(--lit),calc(var(--lita) * .9)),transparent 70%),
    var(--tex-fine),
    var(--tex-cloud) 0 0/100% 100%,
    linear-gradient(180deg,var(--wall2),var(--wall) 70%,#cdc6bc 96%,#bdb5aa);border-radius:0}
.rm-shell .back .ties{position:absolute;inset:6% 4%;display:block;opacity:.85; /* 清水模的模板孔 */
  background:radial-gradient(circle,rgba(100,90,78,.6) 0 2.4px,rgba(150,140,128,.3) 3.4px,transparent 5px) 0 0/25% 33.33%}
.rm-shell .back .seam{position:absolute;inset:0;display:block;opacity:.5;
  background:linear-gradient(90deg,transparent calc(50% - .5px),rgba(140,130,118,.35) 50%,transparent calc(50% + .5px)),linear-gradient(180deg,transparent calc(50% - .5px),rgba(140,130,118,.25) 50%,transparent calc(50% + .5px))}
.rm-shell .ceil{clip-path:polygon(0 0,100% 0,85% 9%,15% 9%);background:linear-gradient(180deg,#e6e1d9,#d9d3ca)}
.rm-shell .wl{clip-path:polygon(0 0,15% 9%,15% 74%,0 100%);background:linear-gradient(90deg,#c6bfb4,#d6d0c7 90%)}
.rm-shell .wr{clip-path:polygon(100% 0,85% 9%,85% 74%,100% 100%);background:linear-gradient(270deg,#c3bcb1,#d4cec5 90%)}
.rm-shell .floor{clip-path:polygon(0 100%,100% 100%,85% 74%,15% 74%);
  background:radial-gradient(ellipse 40% 30% at 50% 78%,rgba(var(--lit),calc(var(--lita) * .55)),transparent 70%),
    linear-gradient(180deg,rgba(110,95,78,.22),transparent 8%),repeating-linear-gradient(90deg,transparent 0 9vw,rgba(120,100,78,.07) 9vw 9.1vw),linear-gradient(180deg,#dcd2c3,#d1c4b1 40%,#c2b199)}
.rm-shell .well{inset:auto;left:41%;width:18%;top:1.5%;height:5%;border-radius:50%; /* 圓形天井 */
  background:radial-gradient(ellipse at 50% 50%,#fffdf7,#fbf1e1 45%,rgba(var(--lit),.55) 75%,rgba(205,196,183,.7));box-shadow:0 0 30px rgba(var(--lit),.35),inset 0 -4px 8px rgba(150,135,115,.35)}
.rm-shell .well::after{content:"";position:absolute;left:-20%;right:-20%;top:60%;height:900%;
  background:linear-gradient(180deg,rgba(var(--lit),calc(var(--lita) * .45)),transparent 85%);clip-path:polygon(25% 0,75% 0,100% 100%,0 100%);filter:blur(10px)}
.rm-shell .light{opacity:0}
.rm-shell .rain{opacity:0}

/* ---------- 光影（ambience） ---------- */
.amb-warm_morning{--lit:255,222,178;--lita:.55}
.amb-warm_morning .rm-shell .light{opacity:.55;clip-path:polygon(2% 30%,13% 34%,13% 62%,2% 72%);background:linear-gradient(120deg,rgba(255,230,190,.9),rgba(255,220,170,.4));filter:blur(6px);mix-blend-mode:soft-light}
.amb-filtered_daylight{--lit:252,238,214;--lita:.45}
.amb-filtered_daylight .rm-shell .light{opacity:.6;inset:auto;left:2%;width:11%;top:20%;height:50%;transform:skewY(18deg);filter:blur(1.5px);
  background:repeating-linear-gradient(180deg,rgba(255,244,222,.85) 0 9px,transparent 9px 16px)}
.amb-amber_evening{--lit:255,190,130;--lita:.6}
.amb-amber_evening .rm-scene,.amb-amber_evening .rm-shell .back{filter:saturate(1.05)}
.amb-amber_evening .rm-shell .light{opacity:.5;inset:0;background:radial-gradient(ellipse 30% 45% at 92% 55%,rgba(255,170,100,.55),transparent 70%)}
.amb-soft_cloudy{--lit:240,236,228;--lita:.3}
.amb-late_afternoon{--lit:255,206,150;--lita:.5}
.amb-late_afternoon .rm-shell .light{opacity:.5;clip-path:polygon(55% 76%,72% 76%,92% 100%,62% 100%);background:linear-gradient(180deg,rgba(255,214,160,.7),rgba(255,214,160,.3));filter:blur(5px)}
.amb-quiet_rain{--lit:228,230,228;--lita:.25;--wall:#d6d4cf;--wall2:#e2e0db}
.amb-quiet_rain .rm-shell .rain{opacity:.18;inset:0;background:repeating-linear-gradient(100deg,transparent 0 22px,rgba(255,255,255,.6) 22px 23px);mask:linear-gradient(90deg,transparent 80%,#000 90%)}

/* ---------- 物件（RoomObjects） ---------- */
.rm-obj{display:block;translate:calc(var(--px) * .7) calc(var(--py) * .5);transition:transform .38s cubic-bezier(.2,.8,.25,1) calc(var(--d) * 60ms),opacity .3s ease calc(var(--d) * 60ms);filter:drop-shadow(0 1.2vh 1.4vh rgba(70,55,40,.18))}
.rm-obj>i,.rm-carrier>i{position:absolute;display:block}
.rm-obj svg{position:absolute}
.s-l{left:2.5vw;bottom:9vh}.s-r{right:2.5vw;bottom:9vh}
.s-lb{left:39vw;bottom:2vh}.s-rb{right:18vw;bottom:9vh}
.s-lp{left:19.5vw;bottom:6vh}.s-rp{right:19.5vw;bottom:6vh}
.wood{background:linear-gradient(180deg,#cdb595,#b99d7c)}
/* 書桌＋文件 */
.o-desk{width:17vw;height:20vh}
.o-desk .top{left:0;right:0;top:0;height:3vh;clip-path:polygon(5% 0,95% 0,100% 100%,0 100%);background:linear-gradient(180deg,#d8c3a5,#c3a885)}
.o-desk .top::after{content:"";position:absolute;left:0;right:0;bottom:0;height:35%;background:#ad906d}
.o-desk .leg{top:3vh;bottom:0;width:1.1vh;background:linear-gradient(90deg,#a98c6b,#b99c7a)}
.o-desk .leg.a{left:7%}.o-desk .leg.b{right:7%}
.o-desk .paper{left:22%;top:.4vh;width:26%;height:1.4vh;background:#f6f2ea;transform:skewX(-20deg) rotate(-3deg);box-shadow:0 1px 1px rgba(0,0,0,.12)}
.o-desk .p2{left:30%;top:.2vh;transform:skewX(-20deg) rotate(4deg);background:#eee7da}
.o-desk .ink{right:22%;top:-1.6vh;width:2.2vh;height:2.2vh;border-radius:30% 30% 45% 45%;background:linear-gradient(90deg,#e9e4dc,#cbc4b9)}
/* 書架 */
.o-shelf,.o-boxes{width:14vw;height:46vh}
.o-shelf .frame,.o-boxes .frame{inset:0;border:.7vh solid #bfa281;border-bottom-width:1.2vh;background:rgba(214,205,192,.55);box-shadow:inset 0 0 2vh rgba(90,70,50,.18)}
.o-shelf .row,.o-boxes .row{left:.7vh;right:.7vh;height:.7vh;background:#b39572}
.r1{top:25%}.r2{top:50%}.r3{top:75%}
.o-shelf .bk{height:8vh;left:12%;width:50%;background:repeating-linear-gradient(90deg,#c6b79f 0 1.4vh,#a89478 1.4vh 2.3vh,#d8ccb7 2.3vh 3.8vh,#9c8a73 3.8vh 4.6vh,#e2d8c6 4.6vh 6vh)}
.o-shelf .k1{top:calc(25% - 8vh)}.o-shelf .k2{top:calc(50% - 7vh);left:38%;width:46%;height:7vh}.o-shelf .k3{top:calc(100% - 9.2vh);width:62%}
.o-shelf .bowl{right:18%;top:calc(75% - 3vh);width:5vh;height:3vh;border-radius:0 0 50% 50%/0 0 100% 100%;background:linear-gradient(180deg,#e9e3d8,#c9c0b2)}
/* 落地燈（和紙燈罩） */
.o-lamp{width:6vh;height:36vh}
.o-lamp .shade{left:0;right:0;top:0;height:9vh;border-radius:45% 45% 40% 40%/30% 30% 70% 70%;background:radial-gradient(ellipse at 50% 60%,#fff8e8,#f1e2c6);box-shadow:0 0 4vh rgba(255,214,160,.7)}
.o-lamp .pole{left:calc(50% - 2px);width:4px;top:9vh;bottom:1vh;background:#8f7a62}
.o-lamp .foot{left:15%;right:15%;bottom:0;height:1vh;border-radius:50%;background:#7d6a55}
/* 展示台／玻璃展櫃 */
.o-plinthL,.o-vitrine{width:11vw;height:34vh}
.o-plinthL .block,.o-vitrine .block{left:0;right:0;bottom:0;height:18vh;background:linear-gradient(90deg,#d9d3ca,#e6e1d8 40%,#c9c2b7);border-top:1px solid #f0ece5}
.o-plinthL .stone{left:28%;right:28%;bottom:18vh;height:6vh;border-radius:48% 52% 40% 44%/60% 55% 40% 40%;background:radial-gradient(ellipse at 35% 30%,#a9a196,#6f675d)}
.o-plinthL .plaque{left:30%;right:30%;bottom:10vh;height:2.2vh;background:#efe9df;box-shadow:inset 0 -2px 0 rgba(146,43,39,.5)}
.o-vitrine .glass{left:6%;right:6%;bottom:18vh;height:15vh;background:linear-gradient(115deg,rgba(255,255,255,.55),rgba(255,255,255,.12) 40%,rgba(255,255,255,.3));border:1px solid rgba(175,146,112,.7)}
.o-vitrine .scroll{left:30%;right:30%;bottom:20vh;height:2.8vh;border-radius:1.4vh;background:linear-gradient(180deg,#f2e8d4,#d7c7a8);box-shadow:inset .7vh 0 0 #b49d7c,inset -.7vh 0 0 #b49d7c}
.o-vitrine .scroll::after{content:"";position:absolute;left:46%;width:8%;top:-10%;bottom:-10%;background:var(--acc)}
.o-spot{width:9vw;height:66vh;bottom:9vh!important}
.o-spot .beam{inset:0;background:linear-gradient(180deg,rgba(255,236,200,.5),transparent 80%);clip-path:polygon(40% 0,60% 0,100% 100%,0 100%);filter:blur(6px);mix-blend-mode:screen}
/* 對照展板 */
.o-standL,.o-standR{width:12vw;height:48vh}
.o-standL .board,.o-standR .board{left:0;right:0;top:0;height:66%;background:linear-gradient(180deg,#f2eee7,#e4ded4);border:1px solid #cfc7bb;
  background-image:repeating-linear-gradient(180deg,transparent 0 2.6vh,rgba(120,105,90,.18) 2.6vh calc(2.6vh + 1px)),linear-gradient(180deg,#f2eee7,#e4ded4);background-clip:content-box;padding:3vh 1.6vw}
.o-standL .board::before,.o-standR .board::before{content:"";position:absolute;left:1.6vw;top:1.2vh;width:30%;height:.5vh;background:var(--acc);opacity:.7}
.o-standL .post,.o-standR .post{left:calc(50% - .5vh);width:1vh;top:66%;bottom:1vh;background:#a98e70}
.o-standL .base,.o-standR .base{left:25%;right:25%;bottom:0;height:1vh;background:#8f7a62;border-radius:2px}
/* 長凳、小凳 */
.o-bench{width:22vw;height:8vh}
.o-bench .top,.o-stool .top{left:0;right:0;top:0;height:2.2vh;background:linear-gradient(180deg,#d4bd9c,#b49674);border-radius:3px}
.o-bench .leg,.o-stool .leg{top:2.2vh;bottom:0;width:3.2vh;background:linear-gradient(90deg,#cfc8bd,#bdb5a9)}
.o-bench .leg.a{left:8%}.o-bench .leg.b{right:8%}
.o-stool{width:8vh;height:7vh}
.o-stool .leg{width:1vh;background:#a98e70}.o-stool .leg.a{left:12%}.o-stool .leg.b{right:12%}
/* 抽屜櫃 */
.o-drawers{width:17vw;height:30vh}
.o-drawers .body{inset:0;background:linear-gradient(180deg,#cdb494,#b99d7b);border-radius:2px}
.o-drawers .grid{inset:1vh;background:radial-gradient(circle,#8b7258 0 .35vh,transparent .45vh) 0 0/25% 20%,repeating-linear-gradient(90deg,transparent 0 calc(25% - 1px),rgba(90,70,50,.35) calc(25% - 1px) 25%),repeating-linear-gradient(180deg,transparent 0 calc(20% - 1px),rgba(90,70,50,.35) calc(20% - 1px) 20%)}
.o-boxes{height:40vh}
.o-boxes .box{height:8vh;width:28%;background:linear-gradient(180deg,#ece7de,#d8d1c6);border:1px solid #c7bfb2;box-shadow:inset 0 -1.2vh 0 rgba(0,0,0,.04)}
.o-boxes .box::after{content:"";position:absolute;left:25%;right:25%;top:30%;height:1.2vh;background:#f8f5ef;border:1px solid #d2cabd}
.o-boxes .b1{left:8%;top:calc(25% - 8vh)}.o-boxes .b2{left:38%;top:calc(25% - 8vh)}.o-boxes .b3{left:8%;top:calc(50% - 8vh)}.o-boxes .b4{left:52%;top:calc(100% - 9.2vh)}
/* 模型台（分層展具） */
.o-model{width:15vw;height:30vh}
.o-model .table{left:0;right:0;bottom:0;height:15vh;background:linear-gradient(90deg,#dcd6cd,#e8e3db 50%,#cdc6bb)}
.o-model .disc{left:50%;border-radius:50%;transform:translateX(-50%);background:linear-gradient(180deg,#efe9df,#cfc6b8);box-shadow:0 .6vh 0 #b8ae9f}
.o-model .d1{bottom:15vh;width:11vw;height:3vh}.o-model .d2{bottom:19.5vh;width:7.5vw;height:2.4vh}.o-model .d3{bottom:23.4vh;width:4.5vw;height:2vh;background:linear-gradient(180deg,#e6d5bb,#c9b08c)}
.o-model .rod{left:calc(50% - 1px);width:2px;bottom:15vh;height:13vh;background:rgba(175,146,112,.8)}
/* 橢圓窗（側牆） */
.o-ovalwin{right:4vw!important;top:20vh;bottom:auto!important;width:8vw;height:36vh;transform-origin:100% 50%}
.o-ovalwin .win{inset:0;border-radius:50%;background:linear-gradient(180deg,#f4f1ea,#e3ddd0);box-shadow:inset 1.2vh 0 2vh rgba(120,110,95,.45);transform:perspective(400px) rotateY(-34deg)}
.o-ovalwin .sky{inset:12%;border-radius:50%;background:radial-gradient(ellipse at 40% 40%,#fffdf6,#e8efe9);transform:perspective(400px) rotateY(-34deg)}
.o-ovalwin .sill{display:none}
.o-well{display:none}
.tpl-observation_lab .rm-shell .well,.tpl2-observation_lab .rm-shell .well{left:38%;width:24%;box-shadow:0 0 60px rgba(var(--lit),.9)}
/* 單椅＋矮几 */
.o-chair{width:17vw;height:22vh}
.o-chair .seat{left:0;width:60%;bottom:7vh;height:2.6vh;background:linear-gradient(180deg,#e8e1d4,#d3c8b6);border-radius:1vh}
.o-chair .back{left:2%;width:1.6vh;bottom:7vh;height:14vh;background:#b99d7b;transform:rotate(-10deg);transform-origin:bottom}
.o-chair .leg{bottom:0;height:7vh;width:1vh;background:#a98e70}.o-chair .leg.a{left:6%}.o-chair .leg.b{left:52%}
.o-chair .tbl{right:0;width:32%;bottom:0;height:8vh;background:linear-gradient(180deg,#cdb494 0 1.4vh,#d8d2c9 1.4vh)}
.o-chair .cup{right:12%;bottom:8vh;width:2vh;height:2.2vh;border-radius:0 0 40% 40%;background:#e9e3d8}
/* 窗與亞麻布簾 */
.o-curtain{right:1vw!important;top:11vh;bottom:auto!important;width:12vw;height:62vh}
.o-curtain .win{inset:4vh 1vw 0 2vw;background:linear-gradient(180deg,#fbf9f3,#ebe6da);transform:perspective(500px) rotateY(-30deg);transform-origin:100% 50%;box-shadow:inset 0 0 3vh rgba(150,140,120,.35)}
.o-curtain .cloth{top:2vh;bottom:-2vh;left:0;width:60%;background:repeating-linear-gradient(90deg,#ece5d8 0 1.6vw,#ddd4c4 1.6vw 2.2vw,#efe9de 2.2vw 3vw);opacity:.92;filter:blur(.3px)}
.o-curtain .rod{left:-1vw;right:0;top:1.4vh;height:.6vh;background:#8f7a62}
/* 坐墊 */
.o-cushion{width:13vw;height:6vh}
.o-cushion .pad{inset:0;border-radius:50%;background:radial-gradient(ellipse at 50% 35%,#eee7da,#d6ccbb);box-shadow:inset 0 -.8vh 1vh rgba(0,0,0,.08)}
/* 植栽 */
.o-plant{width:5.5vw;height:20vh}
.o-plant .pot{left:20%;right:20%;bottom:0;height:6vh;border-radius:0 0 30% 30%;background:linear-gradient(90deg,#d0c7ba,#e2dbd0 40%,#bcb3a6)}
.o-plant svg{left:0;bottom:5.5vh;width:100%;height:14vh}

/* ---------- 中央載體（CarrierFrame）：位置緊貼固定的閱讀核 ---------- */
.rm-carrier{--m:2.2vh;left:calc(var(--cl) - var(--m));top:calc(var(--ct) - var(--m));width:calc(var(--cw) + 2 * var(--m));height:calc(var(--chh) + 2 * var(--m));
  translate:calc(var(--px) * .12) calc(var(--py) * .1);transition:transform .42s cubic-bezier(.2,.8,.25,1) 120ms,opacity .3s ease 120ms}
.rm-carrier .face{inset:var(--m);background:rgba(248,245,239,.9)}
.c-glass_panel{--m:2.4vh}
.c-glass_panel .face{inset:0;background:linear-gradient(115deg,rgba(255,255,255,.62),rgba(250,248,244,.42) 45%,rgba(255,255,255,.55));backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(175,146,112,.65);box-shadow:0 2vh 4vh rgba(80,60,40,.12)}
.c-glass_panel .hi{inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.35) 32%,transparent 40%);z-index:1;pointer-events:none}
.c-glass_panel .foot{bottom:-4vh;width:.8vh;height:4vh;background:var(--metal)}.c-glass_panel .foot.a{left:5%}.c-glass_panel .foot.b{right:5%}
.c-architectural_niche{--m:4vh}
.c-architectural_niche .face{inset:0;border-radius:calc(var(--cw) / 3) calc(var(--cw) / 3) 6px 6px/14vh 14vh 6px 6px;background:radial-gradient(ellipse 70% 40% at 50% 0%,rgba(var(--lit),.55),transparent 70%),linear-gradient(180deg,#efebe4,#e6e0d6);box-shadow:inset 0 2vh 4vh rgba(110,95,80,.35),inset 0 -1vh 2vh rgba(110,95,80,.15)}
.c-architectural_niche .ledge{left:-1vh;right:-1vh;bottom:-1.4vh;height:1.6vh;background:linear-gradient(180deg,#e9e4dc,#c9c2b7);z-index:1}
.c-wall_projection{--m:1.6vh}
.c-wall_projection .face{inset:0;background:rgba(253,248,238,.82);box-shadow:0 0 6vh 2vh rgba(255,240,214,.75);filter:blur(.2px)}
.c-wall_projection .cone{left:30%;right:30%;top:calc(-1 * var(--ct));height:var(--ct);background:linear-gradient(180deg,rgba(255,242,220,0),rgba(255,242,220,.35));clip-path:polygon(44% 0,56% 0,100% 100%,0 100%);filter:blur(8px)}
.c-built_in_display{--m:6.5vh}
.c-built_in_display .slats{top:0;bottom:0;width:calc(var(--m) * .8);background:repeating-linear-gradient(90deg,#c4aa89 0 1.4vh,#b3977a 1.4vh 1.8vh)}
.c-built_in_display .slats.l{left:0}.c-built_in_display .slats.r{right:0}
.c-built_in_display .face{inset:calc(var(--m) - 1.2vh);border:1.2vh solid #4a423b;border-radius:6px;background:#f6f3ec;box-shadow:0 1.5vh 3vh rgba(60,45,30,.25)}
.c-cabinet_panel{--m:5vh}
.c-cabinet_panel::before{content:"";position:absolute;inset:0 0 -6vh;background:linear-gradient(180deg,#cdb494,#b99d7b);border-radius:3px;box-shadow:0 1.5vh 3vh rgba(60,45,30,.2)}
.c-cabinet_panel .door{top:var(--m);bottom:var(--m);width:calc(var(--m) * .7);background:linear-gradient(90deg,#c3a886,#b0946f);box-shadow:inset 0 0 0 1px rgba(90,70,50,.25)}
.c-cabinet_panel .door.l{left:calc(var(--m) * .15)}.c-cabinet_panel .door.r{right:calc(var(--m) * .15)}
.c-cabinet_panel .base{left:0;right:0;bottom:-6vh;height:5vh;background:repeating-linear-gradient(90deg,transparent 0 calc(33.33% - 1px),rgba(90,70,50,.35) calc(33.33% - 1px) 33.33%)}
.c-cabinet_panel .face{background:#f3efe7;box-shadow:inset 0 .6vh 1.4vh rgba(90,70,50,.2)}
.c-fabric_screen{--m:3vh}
.c-fabric_screen .face{inset:0;background:repeating-linear-gradient(90deg,rgba(255,255,255,.0) 0 4vw,rgba(150,135,115,.06) 4vw 6vw),linear-gradient(180deg,#f1ece2,#e9e2d5);box-shadow:0 1.5vh 3vh rgba(80,60,40,.12)}
.c-fabric_screen .rod{left:-2vh;right:-2vh;top:-1.2vh;height:1.2vh;border-radius:.6vh;background:linear-gradient(180deg,#c3a886,#9d8162);z-index:1}
.c-paper_board{--m:2.6vh}
.c-paper_board .face{inset:0;background:var(--tex-fine),#f7f2e8;border:1vh solid #c9ae8b;box-shadow:0 1.5vh 3vh rgba(80,60,40,.18)}
.c-paper_board .clip{top:-1.2vh;width:3vh;height:2.6vh;background:var(--metal);border-radius:3px;z-index:1}.c-paper_board .clip.a{left:22%}.c-paper_board .clip.b{right:22%}
.c-paper_board .leg{bottom:-7vh;width:1vh;height:9vh;background:#a98e70}.c-paper_board .leg.a{left:12%;transform:rotate(8deg)}.c-paper_board .leg.b{right:12%;transform:rotate(-8deg)}
.c-display_backdrop{--m:3.4vh}
.c-display_backdrop .face{inset:0;background:linear-gradient(180deg,#ebe6dd,#e1dbd1);box-shadow:0 0 0 1px rgba(160,150,135,.4),1.2vh 1.2vh 0 rgba(160,150,135,.25)}
.c-display_backdrop .plinth{left:12%;right:12%;bottom:-6vh;height:5vh;background:linear-gradient(180deg,#d2b999,#b79b79);box-shadow:0 1vh 2vh rgba(60,45,30,.2);z-index:1}

/* ---------- 卡匣式換景 ---------- */
.rm-scene.pre .rm-shell,.rm-scene.fade-pre{opacity:0}
.rm-scene.in .rm-shell{transition:opacity .5s ease}
.rm-scene.pre .s-l,.rm-scene.pre .s-lb,.rm-scene.pre .s-lp{transform:translate3d(-30vw,-1.5vh,0) scale(.94);opacity:0}
.rm-scene.pre .s-r,.rm-scene.pre .s-rb,.rm-scene.pre .s-rp{transform:translate3d(30vw,-1.5vh,0) scale(.94);opacity:0}
.rm-scene.pre .rm-carrier{transform:translateY(14vh) scale(.97);opacity:0}
.rm-scene.eject .rm-obj{transition:transform .24s cubic-bezier(.55,0,.85,.4) calc(var(--d) * 40ms),opacity .2s ease calc(var(--d) * 40ms)}
.rm-scene.eject .s-l,.rm-scene.eject .s-lb,.rm-scene.eject .s-lp{transform:translate3d(-38vw,2vh,0) scale(.96);opacity:0}
.rm-scene.eject .s-r,.rm-scene.eject .s-rb,.rm-scene.eject .s-rp{transform:translate3d(38vw,2vh,0) scale(.96);opacity:0}
.rm-scene.eject .rm-carrier{transition:transform .26s cubic-bezier(.55,0,.85,.4) 40ms,opacity .22s ease 40ms;transform:translateY(-12vh) scale(.95);opacity:0}
.rm-scene.fade-out{transition:opacity .14s;opacity:0}
.rm-scene.in.fade-pre,.rm-scene.in{transition:opacity .16s}
.rm-scene.settle .rm-carrier{animation:rmSettle .17s ease-out}
@keyframes rmSettle{0%{transform:translateY(.5vh)}100%{transform:none}}

/* ---------- 固定閱讀核（StableReadingCore） ---------- */
.rm-core{position:absolute;z-index:3;left:var(--cl);top:var(--ct);width:var(--cw);height:var(--chh);box-sizing:border-box;padding:4.2vh 3.4vw 3.4vh}
.rm-text{height:100%;overflow:auto;scrollbar-width:thin;outline:none;transition:opacity .15s ease,filter .15s}
.rm-text.swap{opacity:0}
.rm-text.mask{opacity:.12;filter:blur(1px);transition:opacity .2s,filter .2s}
.rk-crumb{display:flex;flex-wrap:wrap;gap:.3em 1em;margin:0 0 1.2vh;font-size:13px;letter-spacing:.12em;color:#6c6258}
.rk-crumb .rk-lv{color:var(--acc)}.rk-code{margin-left:auto;font-family:ui-monospace,Menlo,monospace;letter-spacing:.04em;color:#9a9086}
.rk-title{text-align:center;margin:0 0 2.4vh;font-size:clamp(24px,2.5vw,35px);line-height:1.45;letter-spacing:.1em;font-weight:700;text-wrap:balance}
.rm-core[data-level="目"] .rk-title{font-size:clamp(22px,2.2vw,31px)}
.rk-q{display:flex;gap:14px;align-items:flex-start;margin:0 0 2.2vh}
.rk-mark{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--acc);color:#fff;font-size:16px;font-weight:700;margin-top:2px}
.rk-q p{margin:0;font-size:clamp(19px,1.65vw,24px);line-height:1.7;font-weight:700;letter-spacing:.06em}
.rk-pend{color:#9a9086;font-style:italic}
.rk-sum{margin:0 0 2.2vh;font-size:clamp(18px,1.42vw,21.5px);line-height:1.95;letter-spacing:.05em;color:#2a2622;text-align:justify}
.rk-src{margin:0;font-size:13.5px;color:#6c6258;letter-spacing:.08em;border-top:1px solid rgba(146,130,110,.3);padding-top:1.4vh}
.rk-src em{color:#8a6d57}
.rk-open{font:inherit;border:1px solid #cdbfa9;background:#fff;padding:1px 10px;border-radius:12px;cursor:pointer}
.rk-body{margin-top:1vh;font-size:15px;line-height:1.9}
.rk-note{font-size:13px;color:#7a6e62;margin:1vh 0 0}
.rk-end{margin-top:2.2vh;padding:1.6vh 1.2vw;border:1px solid rgba(146,43,39,.3);border-radius:8px;background:rgba(255,255,255,.55);text-align:center}
.rk-end b{color:var(--acc);letter-spacing:.2em}.rk-end small{display:block;color:#7a6e62;margin-top:.4em}
.rk-end p{margin:1.2vh 0 0;display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.rk-btn{font:inherit;font-size:14px;letter-spacing:.12em;padding:8px 18px;border-radius:20px;border:1px solid #cdbfa9;background:#fff;cursor:pointer}
.rk-btn.pri{background:var(--acc);border-color:var(--acc);color:#fff}

/* ---------- 介面（UI） ---------- */
.rm-nav{position:absolute;z-index:4;left:var(--cl);width:var(--cw);top:calc(var(--ct) + var(--chh) + 2.2vh);display:flex;align-items:center;justify-content:space-between;gap:12px}
.rm-nav button,.rm-ib{font:inherit;font-size:14px;letter-spacing:.12em;padding:8px 18px;border-radius:20px;border:1px solid rgba(160,140,115,.45);background:rgba(250,247,241,.82);color:var(--ink);cursor:pointer;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.rm-nav button:hover:not(:disabled),.rm-ib:hover{border-color:var(--acc);color:var(--acc)}
.rm-nav button:disabled{opacity:.35;cursor:default}
.rm-nav button:focus-visible,.rm-ib:focus-visible,.rk-btn:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.rm-nav button,.rm-pos{white-space:nowrap}
.rm-pos{font-size:13px;letter-spacing:.1em;color:#5d544b;background:rgba(250,247,241,.7);padding:4px 12px;border-radius:12px}
.rm-top{position:absolute;z-index:5;left:0;right:0;top:0;display:flex;align-items:center;gap:14px;padding:14px 20px}
.rm-ttl{font-size:15px;letter-spacing:.18em;color:#4a423a;background:rgba(250,247,241,.6);padding:5px 12px;border-radius:12px}
.rm-tools{margin-left:auto;display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.rm-ib{padding:6px 14px;font-size:13px}
.rm-vol{width:90px;accent-color:var(--acc)}
.rm-scene-lab{position:absolute;z-index:4;left:20px;bottom:14px;font-size:12px;letter-spacing:.1em;color:#6c6258;background:rgba(250,247,241,.6);padding:4px 10px;border-radius:10px}
.rm-bar{position:absolute;z-index:4;left:0;right:0;bottom:0;height:3px;background:rgba(146,43,39,.12)}
.rm-bar i{position:absolute;inset:0;background:var(--acc);transform-origin:0 50%;transition:transform .3s}
.rm-toc{position:absolute;z-index:6;top:64px;right:20px;width:min(360px,calc(100vw - 40px));max-height:calc(100vh - 120px);overflow:auto;background:rgba(250,247,241,.96);border:1px solid rgba(160,140,115,.4);border-radius:10px;padding:12px 14px;box-shadow:0 1vh 3vh rgba(60,45,30,.18)}
.rm-toc h3{margin:0 0 8px;font-size:15px;letter-spacing:.2em;color:var(--acc)}
.rm-toc ol{list-style:none;margin:0;padding:0}
.rm-toc button{display:flex;gap:10px;width:100%;text-align:left;font:inherit;font-size:14px;line-height:1.6;padding:6px 6px;border:0;background:none;cursor:pointer;border-radius:6px}
.rm-toc li.on button{background:rgba(146,43,39,.08);color:var(--acc)}
.rm-toc li.seen button::after{content:"✓";margin-left:auto;color:#8a9a70}
.rm-toc .g{flex:none;width:20px;height:20px;border-radius:50%;background:#e4ddd1;font-size:11px;display:grid;place-items:center;color:#6c6258}
/* 入珠轉場：念珠鏡頭推近 → 珠面色的柔霧遮住鏡頭 → 霧中室內由模糊轉清晰（room.js entryFrame 逐格設定變數） */
.rm-entry{position:absolute;inset:0;z-index:8;overflow:hidden;pointer-events:auto;opacity:var(--veil,0)}
.rm-entry[hidden]{display:none}
.rm-veil{position:absolute;inset:-8%;background:
  radial-gradient(ellipse 60% 55% at 50% 47%,rgba(252,248,240,.98),rgba(244,236,223,.96) 45%,rgba(226,209,184,.95) 78%,rgba(205,183,152,.95));
  transform:scale(var(--vs,1.08))}
.rm-veil::after{content:"";position:absolute;inset:0;background:radial-gradient(42% 38% at 32% 36%,rgba(255,253,248,.45),transparent 70%),radial-gradient(48% 44% at 70% 62%,rgba(196,168,132,.16),transparent 72%),radial-gradient(36% 30% at 46% 82%,rgba(255,249,238,.3),transparent 70%)} /* 不重複的柔和明暗，避免貼圖接縫 */
.room.entering{background:transparent;transition:none}
.room.entering .rm-stage{opacity:var(--rv,0);filter:blur(var(--bl,0px));transform:scale(var(--sc,1))}
.room.entering .rm-core,.room.entering .rm-nav,.room.entering .rm-top,.room.entering .rm-scene-lab,.room.entering .rm-bar{opacity:var(--ui,0)}
.rm-skip{position:absolute;right:20px;bottom:20px;font:inherit;font-size:13px;letter-spacing:.12em;padding:6px 14px;border-radius:16px;border:1px solid rgba(120,95,70,.4);background:rgba(255,255,255,.7);cursor:pointer}
.room.reduce .rm-obj,.room.reduce .rm-carrier,.room.reduce .rm-shell{translate:none}

/* ---------- 筆電、手機 ---------- */
@media (max-height:800px){.room{--chh:min(62vh,520px)}}
@media (max-width:760px){
  .room{--cw:calc(100vw - 32px);--chh:min(62vh,560px);--ct:calc(48vh - var(--chh) / 2)}
  .rm-shell .back{left:0;right:0;top:6%;bottom:18%;border-radius:0}
  .rm-shell .ceil{clip-path:polygon(0 0,100% 0,100% 6%,0 6%)}.rm-shell .wl,.rm-shell .wr{display:none}
  .rm-shell .floor{clip-path:polygon(0 82%,100% 82%,100% 100%,0 100%)}
  .rm-obj{display:none}.rm-obj.o-plant{display:block;bottom:2vh}.s-lp{left:3vw}.s-rp{right:3vw}
  .rm-carrier{--m:1.2vh!important}.rm-carrier>i:not(.face){display:none}.c-cabinet_panel::before{display:none}
  .c-built_in_display .face{inset:0;border-width:.8vh}
  .rm-core{padding:3vh 18px 2.4vh}
  .rm-top{padding:10px 12px;gap:8px;flex-wrap:wrap}.rm-ttl{display:none}.rm-ib{padding:5px 10px;font-size:12px;letter-spacing:.06em}.rm-vol{width:70px}
  .rm-scene-lab{display:none}
  .rm-nav{top:auto;bottom:3vh}
  .rm-nav{gap:6px}.rm-nav button{padding:8px 13px;letter-spacing:.06em}.rm-pos{font-size:12px;padding:4px 8px;letter-spacing:.04em}
}

/* ---------- 3D 室內（room3d.js）：有 WebGL 時取代 CSS 場景 ---------- */
.rm-glhost{position:absolute;inset:0}
.rm-gl{display:block;width:100%;height:100%}
.room:not(.gl) .rm-glhost{display:none}
.room.gl .rm-scene{display:none}
/* 閱讀核與 3D 載體融合：HTML 文字保持平面、位置不變；底色只留下讓文字清楚所需的一層薄紗，載體本身由 3D 呈現。
   border-radius 會被 room3d.js 讀取，讓 3D 載體的圓角與這裡完全一致。 */
.room.gl .rm-core{border-radius:12px;background:rgba(250,246,239,.22);transition:background .3s ease,backdrop-filter .3s ease,box-shadow .3s ease}
.room.gl[data-car="glass_panel"] .rm-core{border-radius:22px;background:linear-gradient(160deg,rgba(255,253,249,.5),rgba(250,246,240,.36));backdrop-filter:blur(16px) saturate(1.06) brightness(1.05);-webkit-backdrop-filter:blur(16px) saturate(1.06) brightness(1.05);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.55),inset 0 1px 0 rgba(255,255,255,.95),inset 0 -1px 0 rgba(170,150,125,.18)}
.room.gl[data-car="architectural_niche"] .rm-core{border-radius:6px;background:linear-gradient(rgba(253,249,242,.3),rgba(250,245,236,.2))}
.room.gl[data-car="cabinet_panel"] .rm-core{border-radius:14px;background:rgba(252,248,240,.14)}
.room.gl[data-car="fabric_screen"] .rm-core{border-radius:0;background:rgba(252,249,243,.26)}
.room.gl[data-car="wall_projection"] .rm-core{border-radius:14px;background:rgba(240,234,224,.3)}
.room.gl[data-car="built_in_display"] .rm-core{border-radius:12px;background:rgba(252,248,240,.14)}
.room.gl[data-car="paper_board"] .rm-core{border-radius:10px;background:rgba(252,248,240,.1)}
/* 天色變暗時（--dusk 0→1，由 room3d.js 依閱讀時間設定），文字底色同步加厚，維持對比度 */
.room.gl .rm-core::before{content:"";position:absolute;inset:0;border-radius:inherit;background:rgba(250,246,239,calc(var(--dusk,0) * .5));pointer-events:none;z-index:-1;transition:background 2s linear}
.room.gl .rm-core{isolation:isolate}
/* 換景時載體先離場：這層薄紗也一起淡出，避免文字框懸空 */
.room.gl[data-phase="ejecting"] .rm-core,.room.gl[data-phase="inserting"] .rm-core{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none}
.rm-gl.rm-glswap{animation:rmGlSwap .5s ease}
@keyframes rmGlSwap{0%{opacity:.35}100%{opacity:1}}
@media (prefers-reduced-motion:reduce){.rm-gl.rm-glswap{animation:none}}
@media (max-width:760px){.room.gl .rm-core,.room.gl[data-car] .rm-core{background:rgba(250,247,241,.62);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}}
.rm-cred{margin:10px 0 0;padding-top:8px;border-top:1px solid rgba(160,140,115,.3);font-size:11px;line-height:1.6;color:#8a7e72}

/* ---------- 聲音面板（audio.js）：右上角展開，手機由下緣展開；不占中央閱讀區 ---------- */
.kma{position:fixed;z-index:80;top:62px;right:max(16px,env(safe-area-inset-right,0px));width:min(340px,calc(100vw - 32px));box-sizing:border-box;padding:14px 16px 12px;border-radius:14px;
  background:rgba(250,247,241,.96);color:#292622;border:1px solid rgba(160,140,115,.35);box-shadow:0 12px 36px rgba(60,45,30,.18);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);font-size:14px;letter-spacing:.04em}
.kma.from-mini{top:auto;right:auto;left:max(16px,env(safe-area-inset-left,0px));bottom:calc(68px + env(safe-area-inset-bottom,0px))}
.kma-h{display:flex;align-items:center;gap:10px}.kma-h b{font-weight:600;letter-spacing:.12em;margin-right:auto}
.kma button{font:inherit;color:inherit;cursor:pointer;border:1px solid rgba(160,140,115,.45);background:rgba(255,255,255,.6);border-radius:16px;padding:5px 12px;min-height:34px}
.kma button[aria-pressed="true"]{border-color:#922b27;color:#922b27;background:rgba(146,43,39,.06)}
.kma button:focus-visible,.kma input:focus-visible{outline:2px solid #922b27;outline-offset:2px}
.kma-x{border:none!important;background:none!important;font-size:20px!important;padding:2px 6px!important;line-height:1}
.kma-l{margin:12px 0 6px;font-size:12.5px;color:#6b6259}.kma-l small{color:#9a9086;margin-left:6px}
.kma-row{display:flex;flex-wrap:wrap;gap:6px}
.kma-s{display:grid;grid-template-columns:5.5em 1fr 3em;align-items:center;gap:8px;margin-top:10px;font-size:12.5px;color:#6b6259}
.kma-s input{width:100%;accent-color:#922b27}.kma-s output{text-align:right;font-variant-numeric:tabular-nums}
.kma-f{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:12px;flex-wrap:wrap}.kma-t{display:flex;align-items:center;gap:6px;font-size:13px}
.kma-n{margin:10px 0 0;font-size:11px;color:#9a9086}
.kma-mini{position:fixed;z-index:70;left:max(16px,env(safe-area-inset-left,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));width:44px;height:44px;border-radius:22px;border:1px solid rgba(160,140,115,.45);
  background:rgba(250,247,241,.92);color:#922b27;font-size:18px;cursor:pointer;box-shadow:0 6px 18px rgba(60,45,30,.15)}
.kma-mini.muted{color:#9a9086}
@media (max-width:760px){.kma,.kma.from-mini{top:auto;left:0;right:0;bottom:0;width:100%;border-radius:16px 16px 0 0;padding:14px max(16px,env(safe-area-inset-right,0px)) calc(14px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px))}
  .kma button{min-height:40px}}
.rm-ib[hidden]{display:none}

/* 房內換章（上一章／下一章）：鏡頭穿過柔霧、霧中浮現章名，新房間由模糊轉清晰（room.js switchChapter） */
.room .rm-chp,.room .rm-chn{font-weight:700;letter-spacing:.14em}
.room .rm-chp[hidden],.room .rm-chn[hidden]{display:none}
.rm-chcard{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%) translateY(var(--cty,0px));text-align:center;color:#4a3d31;opacity:var(--ctc,0);pointer-events:none;white-space:nowrap}
.rm-chcard small{display:block;font-size:14px;letter-spacing:.4em;color:#9a2f28;margin-bottom:10px}
.rm-chcard b{font-size:clamp(26px,3vw,40px);letter-spacing:.18em;font-weight:700}
.room.chswap .rm-entry .rm-skip{display:none}
.room.chswap .rm-stage{transform:scale(var(--css,1));filter:blur(var(--csb,0px))}
.room.chswap .rm-core,.room.chswap .rm-nav,.room.chswap .rm-scene-lab,.room.chswap .rm-bar,.room.chswap .rm-ttl{opacity:var(--csu,1)}
@media (max-width:760px){.rk-sum{font-size:17px;line-height:1.9}.rk-q p{font-size:18px}.rm-chcard b{font-size:24px}}
/* 到底／到頂時，上一則／下一則換成上一章／下一章（換顏色讓人知道） */
.rm-nav button.to-ch{background:var(--acc);border-color:var(--acc);color:#fff8ef;font-weight:700}
.rm-nav button.to-ch:hover:not(:disabled){background:#7f1b1e;color:#fff8ef}
