.place-tabs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-5); margin-bottom: var(--space-6); }
.place-tab {
  position: relative; display: grid; gap: var(--space-1); min-height: var(--tap); padding: var(--space-4) 0;
  border: 0; border-top: var(--hairline) solid var(--border); background: none; text-align: left; cursor: pointer; color: var(--muted);
  transition: color var(--dur-med) var(--ease-out);
}
.place-tab::before { content: ""; position: absolute; top: -1px; left: 0; right: 0; height: 2px; background: var(--fg); transform: scaleX(0); transform-origin: left; transition: transform var(--dur-slow) var(--ease-out); }
.place-tab b { font-family: var(--font-display); font-weight: var(--weight-light); font-size: var(--fs-h2); line-height: 1.05; }
.place-tab span { font-family: var(--font-mono); font-size: var(--fs-caption); letter-spacing: 0.06em; text-transform: uppercase; }
.place-tab:hover, .place-tab[aria-selected="true"] { color: var(--fg); }
.place-tab[aria-selected="true"]::before { transform: scaleX(1); }

.estate-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(var(--space-6), 4vw, var(--space-8)); align-items: stretch; }
.estate-photo { position: relative; min-height: 34rem; overflow: hidden; background: var(--tint); }
.estate-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; animation: photo-in 1.2s var(--ease-in-out); }
.estate-cap { position: absolute; left: var(--space-4); bottom: var(--space-4); z-index: 1; padding: var(--space-2) var(--space-3); background: var(--surface); font-family: var(--font-mono); font-size: var(--fs-caption); letter-spacing: 0.06em; text-transform: uppercase; }

.estate-side { display: grid; gap: var(--space-5); align-content: start; }
.estate-copy { display: grid; gap: var(--space-3); animation: copy-in var(--dur-slow) var(--ease-out); }
.estate-copy h3 { font-size: var(--fs-h3); font-style: italic; font-weight: var(--weight-regular); }
.estate-copy p { color: var(--muted); }
@keyframes copy-in { from { opacity: 0; transform: translateY(10px); } }
.setup-tabs { display: flex; flex-wrap: wrap; gap: var(--space-2); }

.plan {
  --morph: 900ms var(--ease-in-out);
  position: relative; aspect-ratio: 16 / 10; margin-bottom: var(--space-5);
  background-color: var(--surface);
  background-image: linear-gradient(var(--border) var(--hairline), transparent var(--hairline)), linear-gradient(90deg, var(--border) var(--hairline), transparent var(--hairline));
  background-size: 5% 8%;
  border: var(--hairline) solid var(--fg);
  transition: background-color var(--dur-med);
}
.plan.is-outdoor { background-image: none; background-color: var(--tint); border-style: dashed; border-color: var(--muted); }

.piece, .fx, .plan-zone {
  position: absolute; left: var(--x); top: var(--y); width: var(--w); height: var(--h);
  transition: left var(--morph), top var(--morph), width var(--morph), height var(--morph), border-radius var(--morph), transform var(--morph), opacity var(--dur-med), background-color var(--dur-fast);
}
.piece { border-radius: var(--r); background: var(--fg); transform: rotate(var(--rot, 0deg)); transition-delay: calc(var(--i) * 18ms); }
.piece.is-off, .plan-zone.is-off, .fx.is-off { opacity: 0; pointer-events: none; }
.piece.is-off { width: 0; height: 0; }
.piece:hover { background: var(--accent); }

.plan-zone { display: grid; place-items: center; overflow: hidden; border: var(--hairline) dashed var(--muted); background: var(--surface); }
.plan-zone em, .fx em, .plan-door-label { font-family: var(--font-mono); font-size: var(--fs-caption); font-style: normal; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); white-space: nowrap; }
.plan-zone.is-tall em { writing-mode: vertical-rl; }

.fx { display: grid; place-items: center; }
.fx[data-kind="tree"] { border: var(--hairline) solid var(--muted); border-radius: 50%; }
.fx[data-kind="bed"] { background: var(--surface); border: var(--hairline) dashed var(--muted); }
.fx[data-kind="solid"], .fx[data-kind="window"] { background: var(--fg); }
.fx[data-kind="solid"] em { position: absolute; left: calc(100% + 6px); top: 2px; }
.fx[data-kind="window"] em { position: absolute; left: 0; top: calc(100% + 4px); }

.plan-door { position: absolute; left: 44%; bottom: -3px; width: 12%; height: 5px; background: var(--surface); border-inline: var(--hairline) solid var(--fg); }
.plan-door-label { position: absolute; left: 50%; bottom: -1.7rem; translate: -50% 0; }

.setup-count { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--space-5); align-items: center; padding-top: var(--space-4); border-top: var(--hairline) solid var(--border); }
.setup-count b { min-width: 2.2ch; font-family: var(--font-display); font-weight: var(--weight-light); font-size: clamp(3.2rem, 5vw, 4.6rem); line-height: 0.9; font-variant-numeric: tabular-nums; }
.setup-count span { font-family: var(--font-mono); font-size: var(--fs-caption); letter-spacing: 0.06em; text-transform: uppercase; }
.setup-count p { margin-top: var(--space-1); color: var(--muted); font-size: var(--fs-small); animation: copy-in var(--dur-med) var(--ease-out); }

@media (max-width: 960px) {
  .estate-grid { grid-template-columns: 1fr; }
  .estate-photo { min-height: 0; aspect-ratio: 3 / 2; }
}
@media (max-width: 860px) {
  .place-tabs { grid-template-columns: 1fr 1fr; gap: 0 var(--space-4); }
  .place-tab b { font-size: var(--fs-h3); }
  .place-tab span { display: none; }
  .fx[data-kind="bed"] em, .plan-zone em { font-size: 0.62rem; }
}
@media (prefers-reduced-motion: reduce) {
  .piece, .fx, .plan-zone { transition: none; }
  .estate-photo img, .estate-copy, .setup-count p { animation: none; }
}
.setup-plan { justify-self: start; }
