/* 本番背景はroom-a.css / room-bc.cssの既存設定をそのまま使用。
   元画像3枚は1672×941。同じ縦横比・座標面を全端末で保つ。
   狭い画面では画像を横スクロールし、対象物が小さくなりすぎるのを防ぐ。 */
.scene-viewport { width: 100%; overflow-x: auto; border-radius: 5px; }
.scene-viewport:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
.scene-viewport .scene {
  width: 100%; min-width: 680px; aspect-ratio: 1672 / 941;
  border: 0; background-origin: padding-box;
  background-position: 0 0; background-repeat: no-repeat;
  background-size: 100% 100% !important;
}
.scene-scroll-help { display: none; color: var(--muted); font-size: 14px; }
@media (max-width: 750px) { .scene-scroll-help { display: block; } }

/* CSS家具・装飾は非表示。buttonとaria-label、クリック処理は保持。 */
.scene-viewport .scene .drawing,
.scene-viewport .scene .counter-decor,
.scene-viewport .scene .window-decor,
.scene-viewport .scene .side-table,
.scene-viewport .scene::before,
.scene-viewport .scene::after { visibility: hidden; pointer-events: none; }
.scene-viewport .scene > button.object {
  min-width: 0; min-height: 0; padding: 0; border: 0;
  background: transparent; box-shadow: none; outline: none;
}
.scene-viewport .scene > button.object .label { display: none; pointer-events: none; }
/* テーブルと椅子が重なる部分は、天板を優先して調べる。 */
.scene-viewport .scene > .table { z-index: 2; }
/* キーボード利用者には現在位置を残す。本番の常時枠は出さない。 */
.scene-viewport .scene > button.object:focus-visible {
  outline: 3px solid #ffe4a7; outline-offset: -3px;
}
.scene-viewport .scene > button.object:focus-visible .label { display: block; }
body[data-debug-hotspots="on"] .scene-viewport .scene > button.object {
  outline: 2px dashed #ffe091; outline-offset: -2px; background: #f5c86024;
}
body[data-debug-hotspots="on"] .scene-viewport .scene > button.object .label {
  display: block; color: #fff3d6; background: #17251ff2; border: 1px solid #ffe091;
}

/* 第2作の仮画像用：新しい対象名を表示。背景差し替え後にこのブロックを外す。 */
.scene-viewport .scene > button.object .label {
  display: none; top: 50%; bottom: auto; transform: translate(-50%, -50%);
  max-width: none; white-space: nowrap; text-align: center;
  color: #fff3d6; background: #17251ff2; border: 1px solid #d7bc82;
  padding: 5px 7px; font-size: 14px; line-height: 1.5;
}
.scene-viewport .scene > .redBook .label { border-left: 5px solid #d77869; }
.scene-viewport .scene > .blueBook .label { border-left: 5px solid #80b7d5; }
.scene-viewport .scene > .greenBook .label { border-left: 5px solid #8eb676; }
