/* The Holiday House / four tactile openings on a pine-patterned lodge. */
.holiday-world-page,
.inside-studio-page .home-two-rooms {
  background-color: #eee8dc;
  background-image: linear-gradient(#eee8dcf0, #eee8dcf0),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='190' viewBox='0 0 180 190'%3E%3Cg fill='none' stroke='%23485843' stroke-opacity='.17' stroke-width='1.35'%3E%3Cpath d='M35 20 17 48h12L12 71h15L8 95h54L45 71h15L43 48h11zM35 95v20m110-82-17 25h11l-16 22h13l-19 24h49l-18-24h13l-16-22h11zM145 84v17'/%3E%3C/g%3E%3C/svg%3E");
}
.holiday-world-page main.quiet-threshold { background: transparent; }
.holiday-world-page .threshold-intro { position: relative; }
.holiday-world-page .threshold-intro > h1,
.holiday-world-page .threshold-intro > p { text-shadow: 0 1px 0 #fff8ec; }

.gingerbread-lodge-v1 .gingerbread-scene {
  background: #19382f;
  border: 1px solid #a48b5e;
  box-shadow: 0 20px 55px #26382b30, 0 0 0 6px #f5efe3;
}
.gingerbread-lodge-v1 .gingerbread-scene > img {
  aspect-ratio: 3 / 2;
  object-fit: cover;
}
.gingerbread-lodge-v1 .gingerbread-brand {
  top: auto;
  bottom: 2.2%;
  left: 50%;
  padding: 7px 14px;
  background: #183a30f2;
  border-color: #b39a68;
  color: #f5ecd9;
  box-shadow: 0 3px 10px #07160f70;
}
.gingerbread-lodge-v1 .gingerbread-brand img {
  filter: brightness(0) invert(1);
  mix-blend-mode: normal;
  opacity: .94;
}
.gingerbread-lodge-v1 .gingerbread-brand small { color: #dbc79a; }
.gingerbread-lodge-v1 .gingerbread-brand strong { font-size: 1.2rem; }
.gingerbread-lodge-v1 .ginger-portal {
  top: var(--portal-top);
  left: var(--portal-left);
  width: var(--portal-width);
  height: var(--portal-height);
  border-radius: 22% 22% 2% 2%;
  background: transparent;
}
.gingerbread-lodge-v1 .ginger-portal.house {
  --portal-left: 8.5%; --portal-top: 52%; --portal-width: 22%; --portal-height: 32%;
  --portal-bg-width: 455%; --portal-bg-height: 313%; --portal-bg-x: 10.9%; --portal-bg-y: 76.5%;
}
.gingerbread-lodge-v1 .ginger-portal.apparel {
  --portal-left: 34%; --portal-top: 49%; --portal-width: 13.5%; --portal-height: 40%;
  --portal-bg-width: 741%; --portal-bg-height: 250%; --portal-bg-x: 39.3%; --portal-bg-y: 81.7%;
}
.gingerbread-lodge-v1 .ginger-portal.nine {
  --portal-left: 55%; --portal-top: 49%; --portal-width: 14%; --portal-height: 40%;
  --portal-bg-width: 714%; --portal-bg-height: 250%; --portal-bg-x: 64%; --portal-bg-y: 81.7%;
}
.gingerbread-lodge-v1 .ginger-portal.color-room {
  --portal-left: 74.5%; --portal-top: 52%; --portal-width: 16%; --portal-height: 32%;
  --portal-bg-width: 625%; --portal-bg-height: 313%; --portal-bg-x: 88.7%; --portal-bg-y: 76.5%;
}
.gingerbread-lodge-v1 .portal-leaf {
  background-image: url('holiday/gingerbread-lodge-four-rooms-v1.webp');
  background-size: var(--portal-bg-width) var(--portal-bg-height);
  background-position: var(--portal-bg-x) var(--portal-bg-y);
  transform-origin: left center;
  opacity: 0;
}
.gingerbread-lodge-v1 .ginger-portal.opening .portal-leaf { opacity: 1; }
.gingerbread-lodge-v1 .ginger-portal::before {
  background: radial-gradient(ellipse, #f3d89b85 0, #f3d89b18 55%, transparent 78%);
}
.gingerbread-lodge-v1 .portal-name {
  bottom: -1%;
  left: 2%; right: 2%;
  padding: 5px 2px;
  background: #f3ead8f2;
  border-color: #a58c60;
  color: #19382f;
  font-size: clamp(9px, 1.15vw, 15px);
}
.gingerbread-lodge-v1 .gingerbread-caption {
  margin: 10px 0 0;
  color: #52624f;
}
.gingerbread-lodge-v1 .gingerbread-room-nav {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
  margin-top: 12px;
}
.gingerbread-lodge-v1 .gingerbread-room-nav a {
  border-top: 1px solid #a99772;
  color: #19382f;
}
.gingerbread-lodge-v1 .gingerbread-room-nav a:hover,
.gingerbread-lodge-v1 .gingerbread-room-nav a:focus-visible {
  background: #fbf7efba;
}
@media (max-width: 720px) {
  .gingerbread-lodge-v1 .gingerbread-brand { bottom: 1.4%; gap: 6px; padding: 4px 7px; }
  .gingerbread-lodge-v1 .gingerbread-brand img { width: 27px; height: 19px; }
  .gingerbread-lodge-v1 .gingerbread-brand small { font-size: 6px; }
  .gingerbread-lodge-v1 .gingerbread-brand strong { font-size: .82rem; }
  .gingerbread-lodge-v1 .gingerbread-room-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .gingerbread-lodge-v1 .gingerbread-room-nav a { padding: 12px 7px; }
  .gingerbread-lodge-v1 .gingerbread-room-nav small { font-size: 7px; }
  .gingerbread-lodge-v1 .portal-name { font-size: 8px; padding: 3px 1px; }
}
@media (prefers-reduced-motion: reduce) {
  .gingerbread-lodge-v1 .portal-leaf { transition: none; }
}

/* The lodge's framed wall becomes a three-scene, user-controlled display. */
.lodge-wall-display {
  position: absolute;
  z-index: 4;
  left: 37.8%; top: 12.7%; width: 17.8%; height: 30.5%;
  box-sizing: border-box;
  padding: .55%;
  overflow: visible;
  background: #4a3b2d;
  box-shadow: 0 0 0 2px #b09055, 0 2px 8px #23180f55;
}
.lodge-wall-slide { position: absolute; inset: 1.5%; overflow: hidden; background: #f3ead9; }
.lodge-wall-slide[hidden] { display: none; }
.lodge-wall-nine { display: block; width: 100%; height: 100%; text-decoration: none; }
.lodge-wall-nine .lodge-nine-grid { position: absolute; inset: 8% 0 0; width: 100%; height: 92%; }
.lodge-wall-nine .lodge-nine-grid > span { display: grid; place-items: center; }
.lodge-wall-nine .lodge-nine-grid img { object-fit: contain; }
.lodge-wall-swag {
  position: absolute; z-index: 2;
  left: -17%; top: -23%; width: 134%; height: 31%;
  object-fit: fill;
  pointer-events: none;
  filter: drop-shadow(0 2px 2px #18221a55);
}
.lodge-wall-film-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 2%; height: 100%; padding: 4%; box-sizing: border-box; background: #17392f; }
.lodge-wall-film-pair a { display: flex; min-width: 0; flex-direction: column; justify-content: space-between; color: #f5eddb; text-decoration: none; border: 1px solid #b79a67; background: #102c25; }
.lodge-wall-film-pair img { display: block; width: 100%; height: 72%; object-fit: cover; }
.lodge-wall-film-pair span { display: grid; align-content: center; flex: 1; padding: 2px; text-align: center; font: 600 clamp(5px, .55vw, 9px)/1.1 Arial, sans-serif; letter-spacing: .025em; }
.lodge-wall-gift { display: grid; place-items: center; padding: 8%; box-sizing: border-box; color: #233d31; text-align: center; text-decoration: none; background: #e9e0ce; }
.lodge-wall-gift img { display: block; height: 74%; max-width: 78%; object-fit: contain; box-shadow: 0 3px 9px #1c2e2233; }
.lodge-wall-gift span { display: block; padding-top: 5px; font: 600 clamp(6px, .6vw, 10px)/1.2 Arial, sans-serif; letter-spacing: .05em; }
.lodge-wall-controls { display: flex; justify-content: center; gap: 7px; flex-wrap: wrap; padding: 8px 2px 2px; }
.lodge-wall-controls button { border: 1px solid #9e875e; background: #f2eadc; color: #1d3b31; padding: 7px 10px; cursor: pointer; font: 9px/1.3 Arial, sans-serif; letter-spacing: .06em; }
.lodge-wall-controls button[aria-pressed="true"] { background: #1b4034; color: #f3ead8; border-color: #ad925f; }
.lodge-wall-controls button:hover { box-shadow: inset 0 0 0 1px #ad925f; }
.lodge-wall-controls button:focus-visible { outline: 3px solid #8c6e44; outline-offset: 2px; }
.lodge-wall-status { margin: 5px 0 0; text-align: center; color: #635c49; font: 9px/1.4 Arial, sans-serif; }
@media (max-width: 640px) {
  .lodge-wall-controls { gap: 5px; }
  .lodge-wall-controls button { padding: 7px 8px; font-size: 8px; }
  .lodge-wall-film-pair span { font-size: 5px; }
  .lodge-wall-gift span { font-size: 6px; }
}