/* ============================================================
   心岛 v1.0 · 屏 3 · 旅人之屋（定稿）
   ------------------------------------------------------------
   旧版：cover 1920×1080 + SVG 兜底 + 三个 CSS 热区 + 灯池滤镜。
   新版：contain 2560×1440 + B03 底图（由 stage.js 注入 .stage-bg 即可）+ 热区由 stage.hot 创建。
   本文件只保留：屏底色、屏标题、vignette 兼容；其它视觉交给 stage.css。
   ============================================================ */

.s3 {
  background-color: var(--ink-deeper, #1d262e);
}

/* 屏 3 没有任何独立装饰元素需要 .s3-bg 滤镜；
   灯池/热区/底图都走 .stage-box 体系（见 stage.css）。 */


/* v1.0.21 小屋内部热区：用物品所在区域的柔光代替矩形选中框 */
.s3 .stage-hot[data-hot] {
  border: 0;
  outline: 0 !important;
  box-shadow: none;
  background: radial-gradient(ellipse at center, var(--light-faint) 0%, rgba(212, 165, 116, .05) 34%, transparent 72%);
  opacity: .08;
  filter: blur(1px);
  transition: opacity var(--t-quick) var(--e-out), filter var(--t-quick) var(--e-out), transform var(--t-quick) var(--e-out);
}
.s3 .stage-hot[data-hot]:hover,
.s3 .stage-hot[data-hot]:focus-visible {
  opacity: 1;
  outline: 0 !important;
  box-shadow: none;
  filter: blur(0) drop-shadow(0 0 22px var(--light-halo));
  transform: scale(1.025);
}
.s3 .stage-hot[data-hot]:active { transform: scale(1.01); }

/* v1.0.22 笔记/窗户独立光晕层：确保叠加在底图之上且肉眼可见 */
.s3 .stage-hot[data-hot] { background: transparent; overflow: visible; }
.s3 .stage-hot[data-hot]::before {
  content: '';
  position: absolute;
  z-index: 0;
  pointer-events: none;
  inset: -34% -22%;
  border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(212, 165, 116, .78) 0%, rgba(212, 165, 116, .42) 28%, rgba(212, 165, 116, .16) 52%, transparent 74%);
  filter: blur(12px);
  mix-blend-mode: screen;
  opacity: 0;
  transform: scale(.82);
  transition: opacity var(--t-quick) var(--e-out), transform var(--t-quick) var(--e-out);
}
.s3 .stage-hot[data-hot]:hover::before,
.s3 .stage-hot[data-hot]:focus-visible::before {
  opacity: 1;
  transform: scale(1);
}