/* 门厅视图（js/views/hall.js）自己的版式。
   逐条取自 Claude r3 `demos/rooms/foyer.css`（r4 从 r3/foyer.html 的 <style>
   抽出），只写版式；材质、拱窗与门洞卡的外观来自 page-shell.css。
   加载顺序与设计源一致：tokens → fonts → decor → page-shell → 本文件。
   本文件里没有 url()；三间房的房间底图由 hall.js 写在 --room-img 上
   （assets/house/*.webp）。 */

.h-foyer-hero { display: grid; grid-template-columns: 7fr 5fr; gap: var(--pm-s-7); align-items: center; padding: var(--pm-s-8) 0 var(--pm-s-7); }
.h-foyer-hero .pm-lede { max-width: 26em; }
.h-foyer-hero .pm-pagehead__actions { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 14px; }

/* ===========================================================================
   TASK-156 / WEBUI-050 · 20261021 精修：门厅右侧的圆拱彩窗。
   从墙到窗心七层，每层一个节点，灰度下逐级分开（AK-R03）：
     ① 墙面止口   墙厚的可见圈：石质，8px，洞比框大 8px，向内压暗
     ② 后框       洞里的黑，3px：止口与洞壁之间那道缝
     ③ 洞壁       左右各 6px 的侧壁 + 拱腹，光在左上（AK-R62）
     ④ 铜内框     外 3px 铜环 + 3px 台阶 + 内 1px 亮线
     ⑤ 玻璃       每格独立渐变 + 四周 2px 铅条（玻璃压条）
     ⑥ 玫瑰窗     12 扇区 + 2px 铅条 + 外圈铜环 + 中心凸台
     ⑦ 凸窗台     上表面受光、前沿 2px 暗边、台下 4px 落影
   几何从外往里退：8 + 3 + 6 + 7 = 24px，用 px 写死，四层宽度严格递减；
   窄屏那条 140px 横窗沿用同一套 px，不改窄屏方案。
   容器仍是 aria-hidden、pointer-events:none；里面没有可交互元素。
   =========================================================================== */
.h-foyer-hero .h-window {
  --h-w-reveal: 8px;                     /* ① 墙面止口 */
  --h-w-back: 3px;                       /* ② 后框（洞缝） */
  --h-w-jamb: 6px;                       /* ③ 洞壁侧壁 */
  --h-w-frame: 7px;                      /* ④ 铜内框 */
  background: none;                      /* 贴图换成实体层，不再用 window.png */
  width: min(100%, 340px);
  aspect-ratio: 2 / 3;
  isolation: isolate;
}
.h-window__stage { position: absolute; inset: 0; }
/* 全窗一道很淡的受光坡度（左上亮、右下暗，AK-R62）：贴在圆拱轮廓里，
   所以不会在墙上留下一个方形的暗块；只让这扇窗不是一块均匀的贴纸。 */
.h-window__stage::after { content: ""; position: absolute; inset: 0; pointer-events: none;
  border-radius: 50% 50% 0 0 / 33.333% 33.333% 0 0;
  background: linear-gradient(118deg, rgb(255 240 210 / .07) 0%, transparent 34%, transparent 60%, rgb(0 0 0 / .22) 100%); }

/* 每一层都是同一个圆拱：宽 W、高 1.5W，所以拱顶的竖向半径是高度的 33.333% */
.h-window__reveal, .h-window__back, .h-window__jamb, .h-window__frame, .h-window__glass {
  position: absolute; display: block; border-radius: 50% 50% 0 0 / 33.333% 33.333% 0 0;
}

/* ① 墙面止口：墙上凿开的那一圈石口。它是墙厚的可见面，比墙面暗一档，
   外缘只留一线极淡的受光；inset 那道影把洞的深度按下去。 */
.h-window__reveal {
  inset: 0;
  background: linear-gradient(168deg, #4E4536 0%, #423A2E 28%, #332C23 64%, #26211A 100%);
  box-shadow:
    inset 0 4px 10px rgb(0 0 0 / .55),
    inset 5px 0 8px -6px rgb(0 0 0 / .5),
    inset -5px 0 8px -6px rgb(0 0 0 / .55),
    inset 0 -3px 5px rgb(0 0 0 / .5),
    inset 0 1px 0 rgb(255 240 210 / .14);
}
/* 拱心石：洞口顶上凸出的一小块，让“这是石头上的洞”有个落点 */
.h-window__reveal::before {
  content: ""; position: absolute; left: 50%; top: -5px; width: 19%; height: 12px;
  transform: translateX(-50%); pointer-events: none;
  border-radius: 2px 2px 0 0;
  background: linear-gradient(180deg, #514838 0%, #3C342A 55%, #241F18 100%);
  box-shadow: inset 0 1px 0 rgb(255 242 214 / .16), 0 1px 0 rgb(0 0 0 / .5), 0 3px 4px -1px rgb(0 0 0 / .5);
}
/* ② 后框：止口与洞壁之间那道缝，几乎全黑，止口因此有一道硬边 */
.h-window__back {
  inset: var(--h-w-reveal);
  background: linear-gradient(160deg, #201B13 0%, #0E0C07 46%, #050403 100%);
  box-shadow: inset 0 1px 0 rgb(255 236 196 / .10), inset 0 2px 5px rgb(0 0 0 / .9);
}
/* ③ 洞壁：墙的厚度。左右各 6px：外深内浅（受光的一半朝洞里），顶上拱腹压暗 */
.h-window__jamb {
  inset: calc(var(--h-w-reveal) + var(--h-w-back));
  background:
    linear-gradient(90deg,
      #2A2116 0 2px, #4A3C2C 2px var(--h-w-jamb),
      transparent var(--h-w-jamb) calc(100% - var(--h-w-jamb)),
      #4A3C2C calc(100% - var(--h-w-jamb)) calc(100% - 2px), #2A2116 calc(100% - 2px));
  box-shadow:
    inset 0 8px 10px -4px rgb(0 0 0 / .9),
    inset 0 1px 0 rgb(255 236 206 / .07),
    inset 0 -8px 10px -5px rgb(0 0 0 / .7);
}
/* ④ 铜内框：只有 7px 宽的一圈。外 3px 是铜环（左亮右暗、上沿一道高光），
   中间 3px 是往玻璃落下去的台阶，最里面 1px 是内缘亮线。 */
.h-window__frame {
  inset: calc(var(--h-w-reveal) + var(--h-w-back) + var(--h-w-jamb));
  background: linear-gradient(104deg, #C6A468 0%, #A78550 16%, #7C6136 46%, #5A4526 72%, #3C2D18 100%);
  box-shadow:
    inset 0 1px 0 rgb(255 246 222 / .50),
    inset 0 0 0 3px #8A6A3A,
    inset -3px -3px 0 rgb(0 0 0 / .38),
    0 0 0 1px rgb(10 7 3 / .8);
}
.h-window__frame::before {
  content: ""; position: absolute; inset: 3px; border-radius: inherit; pointer-events: none;
  box-shadow:
    inset 0 0 0 3px #1E170D,                      /* 铜环里的台阶 */
    inset 0 2px 3px rgb(0 0 0 / .55),
    inset 0 -1px 0 rgb(176 144 92 / .18);
}
.h-window__frame::after {
  content: ""; position: absolute; inset: 6px; border-radius: inherit; pointer-events: none;
  box-shadow:
    inset 0 0 0 1px #B08F55,                      /* 内缘 1px 亮线，贴着玻璃 */
    inset 0 2px 3px rgb(0 0 0 / .5);
}
/* ⑤ 玻璃：比铜框低一层。底色是深青的玻璃腔，四条内阴影就是凹进去的槽。
   玻璃本身（扇区与格窗）单独挂 filter，三态只动这一层，框不动。 */
.h-window__glass {
  inset: calc(var(--h-w-reveal) + var(--h-w-back) + var(--h-w-jamb) + var(--h-w-frame));
  overflow: hidden;
  background: radial-gradient(ellipse 88% 50% at 40% 16%, #12302C 0%, #0B1F1C 52%, #050D0C 100%);
  box-shadow:
    inset 0 0 0 1px rgb(0 0 0 / .85),
    inset 0 6px 12px -2px rgb(0 0 0 / .8),
    inset 3px 0 8px -4px rgb(0 0 0 / .6);
}
/* 玫瑰窗与铜框之间那圈是**石**，不是空玻璃：底石色 + 12 条放射石缝 + 一层压暗，
   外缘 1px 亮线接铜框。只铺到横楣上沿（57.6%），下缘被横楣压住。
   选石拱腹、不选再补一圈小玻璃：小扇只填得满左右两条 23px 窄带，拱顶两个角
   还是空的，而且会和下面三列六行抢格子；石腹能跟着拱形裁，两个角一次填掉，
   材质也和玻璃一眼分开。 */
.h-window__glass::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 57.6%; pointer-events: none;
  background:
    repeating-conic-gradient(from 15deg at 50% 50%,
      rgb(30 23 13 / .85) 0 1.5deg, transparent 1.5deg 30deg),
    linear-gradient(180deg, rgb(0 0 0 / .28), rgb(0 0 0 / .28)),
    linear-gradient(180deg, #6E6252, #3A3229);
  box-shadow: inset 0 0 0 1px rgb(255 238 200 / .18);
}
/* ⑥ 玫瑰窗：12 扇区逐格一个节点（clip-path 扇形）。外圈 3px 铜环走 border-box
   的渐变（左亮右暗），环内再压一道 1px 暗线。 */
.h-window__rose { position: absolute; left: 8%; top: 3%; width: 84%; aspect-ratio: 1 / 1;
  border: 3px solid transparent; border-radius: 50%; overflow: hidden;
  background:
    #0B1D1A padding-box,
    linear-gradient(158deg, #9A7A46 0%, #7A5E33 22%, #5E4726 54%, #3A2C16 100%) border-box;
  box-shadow: 0 2px 4px rgb(0 0 0 / .55), 0 0 0 1px rgb(0 0 0 / .6); }
/* 每扇区一块独立渐变（--g1 → --g2）：所有扇区共用 140° 的光向，合起来是
   一整片从左上传光、往右下压暗的玻璃，而不是每格各自一块贴纸 */
.h-window__sector { position: absolute; inset: 0;
  background: linear-gradient(140deg, var(--g1, #4E857A) 0%, var(--g2, #31574F) 100%);
  box-shadow: inset -1px -1px 0 rgb(0 0 0 / .35); }
/* 扇区上的三样：中间 1.5px 内圈铅条（半径 62%）＋贴外缘 3px 压暗＋左上反光。
   都用径向而不是 90° 线性：扇区被 clip 成扇形，盒子仍是整圆，线性会把右半个
   玫瑰一起压暗，径向才只作用在弧上。内圈铅条被 12 道放射铅条打断成 12 段，
   正是真窗的箍法。 */
.h-window__sector::after { content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(circle closest-side at 50% 50%,
      transparent 0 calc(62% - .75px), #241B10 calc(62% - .75px) calc(62% + .75px), transparent calc(62% + .75px)),
    radial-gradient(circle closest-side at 50% 50%,
      transparent 0 calc(100% - 3px), rgb(0 0 0 / .35) calc(100% - 3px) 100%),
    linear-gradient(135deg, rgb(255 255 255 / .20) 0%, rgb(255 255 255 / .04) 26%, transparent 46%); }
/* 中心凸台：铜环 9px + 内芯玻璃 34px + 环内一道 1px 亮边，左上受光。
   芯是整扇窗最亮的一片玻璃（它对着窗外的光），但仍是玻璃的冷色，不是金属。 */
.h-window__boss { position: absolute; left: 50%; top: 50%; width: 56px; height: 56px;
  margin: -28px 0 0 -28px; border-radius: 50%;
  background:
    radial-gradient(circle at 36% 30%, rgb(255 248 226 / .26), transparent 54%),
    radial-gradient(circle at 50% 50%,
      #5A8C7E 0 9px, #4A7A6E 9px 14px, #2E574E 14px 17px,
      #D8BC84 17px 18px, #6E5430 18px 100%);
  box-shadow:
    0 1px 3px rgb(0 0 0 / .7),
    inset 0 -3px 4px rgb(0 0 0 / .40),
    inset 0 1px 0 rgb(255 240 206 / .35),
    0 0 0 1px rgb(0 0 0 / .6); }
/* 十二道铅条 + 环内 1px 暗线：都画在扇区之上（::after 是最后一个子层），
   从凸台铜环外缘一直压到外圈，中间不留空档 */
.h-window__rose::after { content: ""; position: absolute; inset: 0; border-radius: 50%; pointer-events: none;
  background:
    radial-gradient(circle closest-side at 50% 50%,
      transparent 0 calc(50% - 2.5px), rgb(10 7 3 / .85) calc(50% - 2.5px) calc(50% - 1.5px), transparent calc(50% - 1.5px)),
    repeating-conic-gradient(from -90.85deg at 50% 50%,
      #17110A 0deg 1.7deg,
      transparent 1.7deg 30deg);
  -webkit-mask: radial-gradient(circle closest-side, transparent 0 24.5%, #000 26% 100%);
  mask: radial-gradient(circle closest-side, transparent 0 24.5%, #000 26% 100%); }

/* ⑦ 三列六行：逐格一个节点，位置由 hall.js 按 LEAD_X / LEAD_Y 算 */
.h-window__panes { position: absolute; left: 4.6%; right: 4.6%; top: 58.5%; bottom: 3%; }
.h-window__pane { position: absolute; border-radius: 1px;
  background: linear-gradient(180deg, var(--g1, #62948A) 0%, var(--g2, #24413C) 100%);
  box-shadow:
    0 0 0 2px #241B10,                            /* 四周 2px 铅条 */
    0 1px 2px 2px rgb(0 0 0 / .45),               /* 铅条落在玻璃上的投影（略软） */
    inset 2px 2px 0 rgb(255 255 255 / .20),       /* 内斜面 2px：左上受光的切边 */
    inset -2px -2px 0 rgb(0 0 0 / .60); }         /* 内斜面 2px：右下压暗，玻璃因此有厚度 */
/* 格内反光：上沿 3px 硬边折光（一眼看出这块玻璃吃了光）+ 左上斜光 */
.h-window__pane::before { content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    linear-gradient(180deg, rgb(255 244 214 / .22) 0 3px, transparent 3px),
    linear-gradient(135deg, rgb(255 255 255 / .20) 0%, rgb(255 255 255 / .05) 22%, transparent 42%); }
/* 玻璃压条（铅条）：压在格缝上，投影只有 1–2px，朝右下 */
.h-window__bar { position: absolute; display: block; pointer-events: none;
  background: linear-gradient(90deg, #17100A, #241B10 55%, #14100A 100%);
  box-shadow: 1px 1px 0 rgb(0 0 0 / .5), inset 1px 1px 0 rgb(140 112 66 / .35); }
.h-window__bar--v { top: 0; bottom: 0; }
.h-window__bar--h { left: 0; right: 0; background: linear-gradient(180deg, #17100A, #241B10 55%, #14100A 100%);
  box-shadow: 1px 1px 0 rgb(0 0 0 / .45), inset 0 1px 0 rgb(140 112 66 / .35); }
/* 玫瑰窗下的横压条：比格缝粗一点，把花窗和格窗分开 */
.h-window__bar--crown { left: 1.6%; right: 1.6%; top: 55.4%; height: 2.2%;
  background: linear-gradient(180deg, #17100A, #241B10 45%, #120D07 100%);
  box-shadow: 0 2px 2px rgb(0 0 0 / .55), inset 0 1px 0 rgb(150 122 74 / .35); }

/* 玻璃的三态：原位是冷玻璃（压一点饱和与亮度）；经过只提亮玻璃，框不动 */
.h-window__rose, .h-window__panes { filter: saturate(.9) brightness(.92);
  transition: filter 180ms var(--pm-ease-out); }

/* 光学层：冷通光（经过）与暖反光（点亮），都只改 opacity */
.h-window__glow { position: absolute; inset: 0; pointer-events: none; opacity: 0;
  transition: opacity 180ms var(--pm-ease-out); }
.h-window__glow--cold {
  opacity: .10;
  background:
    linear-gradient(118deg, transparent 24%, rgb(214 238 232 / .10) 33%, transparent 46%),
    radial-gradient(ellipse 64% 46% at 46% 32%, rgb(168 214 222 / .32), transparent 74%);
}
.h-window__glow--warm {
  background:
    radial-gradient(ellipse 56% 40% at 50% 33%, rgb(255 206 128 / .40), rgb(255 190 110 / .10) 62%, transparent 82%),
    linear-gradient(0deg, rgb(255 198 118 / .12), transparent 42%);
}

/* ⑦ 凸窗台：比窗洞各宽 6px、往下凸 6px；上表面受光、前沿 2px 暗边、台下 4px 落影 */
.h-window__sill { position: absolute; left: -.9%; right: -.9%; bottom: -6px; height: 10px;
  border-radius: 1px 1px 2px 2px;
  background: linear-gradient(180deg, #6E5A36 0 24%, #57472A 24% 56%, #3A2E1A 56% 88%, #211A0E 88% 100%);
  box-shadow:
    inset 0 1px 0 rgb(255 240 200 / .32),        /* 上表面受光 */
    inset 0 -2px 0 rgb(0 0 0 / .6),              /* 前沿 2px 暗边 */
    0 1px 0 rgb(0 0 0 / .6),
    0 4px 5px -2px rgb(0 0 0 / .65); }           /* 台下 4px 落影 */
.h-window__sill::before { content: ""; position: absolute; inset: 0 0 auto; height: 26%; pointer-events: none;
  background: linear-gradient(90deg, rgb(255 248 222 / .34), rgb(255 248 222 / .06) 46%, rgb(0 0 0 / .22)); }

/* 点亮（状态三）：一圈很细的暖铜轮廓 + 窗台上的短光池，220ms 显、320ms 收 */
.h-window__rim { position: absolute; inset: calc(var(--h-w-reveal) + var(--h-w-back) + var(--h-w-jamb));
  border-radius: 50% 50% 0 0 / 33.333% 33.333% 0 0;
  border: 1px solid rgb(232 206 144 / .78); opacity: 0; pointer-events: none;
  box-shadow: 0 0 7px rgb(232 200 120 / .40), inset 0 0 7px rgb(232 200 120 / .20);
  transition: opacity 320ms var(--pm-ease-out); }
.h-window__pool { position: absolute; left: -8%; right: -8%; top: 100%; margin-top: 7px; height: 7%; opacity: 0;
  pointer-events: none;
  background: radial-gradient(ellipse 48% 100% at 50% 0%, rgb(232 190 120 / .46), rgb(232 190 120 / .12) 56%, transparent 80%);
  filter: blur(3px); transition: opacity 320ms var(--pm-ease-out); }

/* 状态二：精细指针在 hero 里 → 只提亮玻璃（240ms），铜框一点不动。
   只在细指针媒体查询里生效，触屏点一下不会留下 hover 的亮窗。 */
@media (hover: hover) and (pointer: fine) {
  .h-window.is-passed .h-window__glow--cold { opacity: .42; transition-duration: 240ms; }
  .h-window.is-passed .h-window__rose,
  .h-window.is-passed .h-window__panes { filter: saturate(.96) brightness(1.02); transition-duration: 240ms; }
}
/* 状态三：原下载 / 先看看按钮获得 :focus-visible 或被按下 → 窗被点亮 */
.h-window.is-lit .h-window__glow--warm { opacity: .88; transition-duration: 220ms; }
.h-window.is-lit .h-window__rim { opacity: 1; transition-duration: 220ms; }
.h-window.is-lit .h-window__pool { opacity: 1; transition-duration: 220ms; }

/* 减少动效 / 原关闭动效：只留终态，时长压到 80ms 以内 */
@media (prefers-reduced-motion: reduce) {
  .h-window__glow, .h-window__rim, .h-window__pool,
  .h-window__rose, .h-window__panes { transition-duration: 60ms; }
}
html.pm-motion-off .h-window__glow, html.pm-motion-off .h-window__rim, html.pm-motion-off .h-window__pool,
html.pm-motion-off .h-window__rose, html.pm-motion-off .h-window__panes { transition-duration: 0ms; }

.h-foyer-row { display: grid; grid-template-columns: 5fr 7fr; gap: var(--pm-s-6); align-items: start; margin-top: var(--pm-s-5); }
.h-foyer-ver__no { font-family: var(--pm-font-serif); font-weight: 600; font-size: 2.25rem; line-height: 1.05; }
.h-foyer-ver__chan { display: inline-flex; height: 22px; padding: 0 8px; align-items: center; border: 1px solid var(--pm-ink); border-radius: 3px; font-size: 12px; margin-left: 10px; vertical-align: 6px; }
.h-foyer-hash { font: 13px var(--pm-font-mono); color: var(--pm-ink-2); }
.h-foyer-note { font-size: var(--pm-fs-sm); color: var(--pm-ink-3); margin-top: 10px; }
.h-foyer-feats { display: grid; grid-template-columns: 1fr 1fr; gap: var(--pm-s-4) var(--pm-s-6); margin-top: 14px; }
.h-foyer-feats .pm-feat ul { line-height: 1.7; font-size: 14px; }
.h-foyer-section-title { display: flex; align-items: center; gap: 14px; margin: var(--pm-s-8) 0 var(--pm-s-6); color: var(--h-on); }
.h-foyer-section-title h2 { margin: 0; font-family: var(--pm-font-serif); font-size: var(--pm-fs-h2); color: var(--h-on); }
.h-foyer-section-title::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, rgb(211 180 116 / .6), transparent); }
.h-foyer-two { display: grid; grid-template-columns: 1fr 1fr 2fr; gap: var(--pm-s-6); }
.h-foyer-two ul { margin: 8px 0 0; padding-left: 1.1em; line-height: 1.8; color: var(--pm-ink-2); }
.pm-qa { border-top: 1px solid rgb(120 92 48 / .3); }
.pm-qa summary { list-style: none; display: flex; justify-content: space-between; gap: 12px; padding: 12px 0; cursor: pointer; font-family: var(--pm-font-serif); font-weight: 600; }
.pm-qa summary::-webkit-details-marker { display: none; }
.pm-qa summary svg { width: 16px; height: 16px; flex: none; margin-top: 4px; transition: transform var(--pm-t-ctl); }
.pm-qa[open] summary svg { transform: rotate(180deg); }
.pm-qa p { padding: 0 0 12px; color: var(--pm-ink-2); line-height: 1.8; }
@media (max-width: 899px) { .h-foyer-hero, .h-foyer-row, .h-foyer-two, .h-foyer-feats { grid-template-columns: 1fr; } .h-foyer-hero { padding-top: var(--pm-s-6); } }

/* r4 窄屏（<600）：彩窗不再夹在下载按钮和版本铭牌之间，改成门楣下的一条横窗（只露玫瑰窗），下载在一屏半之内
   唯一一处与设计源不同的数值：横向负边距 -16px 收成 -12px。产品的 .pm-wrap 在 <600
   是 24px 沟槽（每边 12px），示范页是 16px；照抄 -16px 会让彩窗每边多出 4px、390 宽下
   横向溢出，收成 -12px 正好通到屏幕边。 */
@media (max-width: 599px) {
  /* TASK-156：实体层不改这条窄屏方案——还是 140px 横窗；只是把「贴图裁切」换成
     「240×360 的实体窗按原尺寸居中、上沿对齐、其余裁掉」，露出来的仍是玫瑰窗那一截。
     高度不加，首屏的下载钮与版本铭牌位置不变。 */
  .h-foyer-hero .h-window { order: -1; justify-self: stretch; width: auto; aspect-ratio: auto; height: 140px; margin: -24px -12px 8px;
    overflow: hidden; border-bottom: 3px solid #5E4520; filter: drop-shadow(0 10px 12px rgb(0 0 0 / .6)); }
  .h-foyer-hero .h-window__stage { inset: auto; top: 0; left: 50%; width: 240px; height: 360px; transform: translateX(-50%); }
  .h-foyer-hero .h-window::after { display: none; }
}

/* r4 DEC-W066：导语下一行题记，像卡面下的小字——斜体衬线、铜褐、前面一道短线；不是按钮，不可点 */
.h-foyer-epigraph { margin: 14px 0 0; padding-left: 26px; position: relative; max-width: 26em;
  font: italic 400 15px/1.7 var(--pm-font-serif); letter-spacing: .04em; color: #CDB98E; }
.h-foyer-epigraph::before { content: ""; position: absolute; left: 0; top: .85em; width: 16px; border-top: 1px solid rgb(205 185 142 / .7); }

/* ---------------------------------------------------------------------------
   DEC-W054 / 20261020 缺陷 A：入梦的暗锁回到门楣右端。
   锁孔的标记与交互来自 js/ui/lock.js（.pm-lock 的 44×44 铜环），这里的规则只
   解决三件事，全部以 .pm-lintel 前缀限定，不碰 components/lock.css 的既有规则：
     1. 落位：门楣里的 flex 子项、右端、与菜单钮之间留 10px（窄屏 4px）；
     2. 看得见：静止时锁眼有一道缓呼吸的洞光（复用 lock.css 的 h-keyhole-moon）
        + 一圈极淡的铜色光晕，让人知道这枚铜饰不是纯装饰；
     3. 认出来要时间：静止与刚悬停时是普通小箭头，也没有任何标签；悬停满 3 秒
        （js/ui/lock.js 打上 data-armed）才变可抓的手并浮出「按住」；
        按住之后才是抓紧的手，盘与那条红线（「若已无事，不妨入梦」）才出现。
   --------------------------------------------------------------------------- */
.pm-lintel .h-foyer-lock { display: flex; align-items: center; margin-left: 10px; flex: none; }
.pm-lintel .h-foyer-lock .pm-lock__link { position: relative; cursor: default; }
.pm-lintel .h-foyer-lock .pm-lock[data-armed] .pm-lock__link { cursor: grab; }
.pm-lintel .h-foyer-lock .pm-lock:is([data-phase="holding"], [data-phase="turning"], [data-phase="auto"], [data-phase="committing"]) .pm-lock__link { cursor: grabbing; }
/* 锁眼里那道月亮似的洞光：比 components/lock.css 的 11s / 4s 略紧一档，
   在门楣这么窄的地方才能被看见（同一条 keyframes，不改既有规则）。 */
.pm-lintel .h-foyer-lock .pm-lock__rose .hole { animation: h-keyhole-moon 9s ease-in-out 1.6s infinite; }
/* 铜色光晕：锁孔外一圈，6.5s 一次，幅度很小——是“有东西在这儿”，不是闪光灯 */
.pm-lintel .h-foyer-lock .pm-lock__link::after { content: ""; position: absolute; inset: 2px; border-radius: 50%; pointer-events: none;
  animation: h-lock-alight 6.5s ease-in-out 1.6s infinite; }
@keyframes h-lock-alight {
  0%, 74%, 100% { box-shadow: 0 0 0 0 rgb(232 200 120 / 0); }
  86% { box-shadow: 0 0 9px 2px rgb(232 200 120 / .30), inset 0 0 4px rgb(232 200 120 / .22); }
}
@media (prefers-reduced-motion: reduce) {
  .pm-lintel .h-foyer-lock .pm-lock__rose .hole { animation: none; }
  .pm-lintel .h-foyer-lock .pm-lock__link::after { animation: none; }
}
html.pm-motion-off .pm-lintel .h-foyer-lock .pm-lock__rose .hole { animation: none; }
html.pm-motion-off .pm-lintel .h-foyer-lock .pm-lock__link::after { animation: none; }
/* 门楣里的锁：悬停**不再**提前把那条红线给出来（用户：鼠标一放上去就出标签，
   不是设计）。现在只有"悬停满 3 秒 → 按住 → 转起来"之后才由 lock.css 的
   [data-phase] 规则显出来；悬停阶段只给「按住」标签和可抓手型。 */
@media (prefers-reduced-motion: reduce) { .pm-lintel .h-foyer-lock .pm-lock__line { transform: none; } }
/* 门楣里的锁不抢戏：静止时铜面比页面里的暗一档（page-shell.css 已有同一条，
   这里只在窄屏把间距收窄，不隐藏——窄屏也必须能入梦）。 */
@media (max-width: 899px) { .pm-lintel .h-foyer-lock { margin-left: 4px; } }

/* ---------------------------------------------------------------------------
   TASK-156 / §4：三间房共用同一档受光。
   只给原 .h-door 的灯光层（.h-door__room::before）加 240ms 的受光过渡、给
   石拱加一圈铜压条的加深；原 href、可访问名、门牌文案、WEB-M54 与
   page-shell.css 的既有规则都不动（这里只叠 filter / box-shadow，不改尺寸和
   结构）。卡上没有“当前项”：门厅的三间房是并列入口，当前栏目由顶栏的真实
   nav VM 表示，不在这里硬编码选中第一张。
   --------------------------------------------------------------------------- */
@media (hover: hover) and (pointer: fine) {
  .h-door .h-door__room::before { filter: brightness(.9); transition: filter 180ms var(--pm-ease-out); }
  .h-door:hover .h-door__room::before { filter: brightness(1.12); transition-duration: 240ms; }
  .h-door:hover .h-door__arch { box-shadow: inset 0 2px 0 rgb(255 240 210 / .30), inset 0 -2px 6px rgb(0 0 0 / .45),
    inset 0 0 0 1px rgb(211 180 116 / .40), var(--pm-light-x) 16px 26px -14px rgb(0 0 0 / .85); transition-duration: 240ms; }
}
.h-door .h-door__arch { transition: box-shadow 180ms var(--pm-ease-out); }
.h-door:focus-visible .h-door__arch { box-shadow: inset 0 2px 0 rgb(255 240 210 / .30), inset 0 -2px 6px rgb(0 0 0 / .45),
  inset 0 0 0 1px rgb(211 180 116 / .45), var(--pm-light-x) 16px 26px -14px rgb(0 0 0 / .85); transition-duration: 240ms; }
.h-door:focus-visible .h-door__room::before { filter: brightness(1.12); transition-duration: 240ms; }
@media (prefers-reduced-motion: reduce) {
  .h-door .h-door__room::before, .h-door .h-door__arch { transition-duration: 60ms; }
}
html.pm-motion-off .h-door .h-door__room::before, html.pm-motion-off .h-door .h-door__arch { transition-duration: 0ms; }