/* Stage: building cards, apartment slots and household chips. Chips move with transform only. */
.st-root { width: 100%; }
.st-scale { position: relative; width: 100%; overflow: hidden; }
.stage { position: absolute; left: 0; top: 0; transform-origin: top left; }
.st-card { position: absolute; border-radius: 16px; background: var(--surface); border: 1px solid var(--line); transition: border-color 400ms var(--ease-out), background-color 400ms var(--ease-out); }
.st-card.is-renovating { border-color: var(--orange); background: #FFF6EF; }
.st-card.is-done { border-color: var(--success); }
.st-head { position: absolute; left: 12px; right: 12px; top: 10px; height: 30px; display: flex; align-items: center; gap: 8px; font-size: 13px; line-height: 1.1; }
.st-head b { font-weight: 700; font-size: 14px; }
.st-head small { color: var(--ink-muted); font-size: 11px; margin-left: auto; white-space: nowrap; }
.st-card[data-building="EXT"] .st-head small { display: none; }
.st-badge { font-size: 11px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; padding: 3px 7px; border-radius: 999px; background: var(--orange-strong); color: #fff; opacity: 0; transition: opacity 300ms; white-space: nowrap; }
.st-card.is-renovating .st-badge { opacity: 1; }
.st-card.is-done .st-badge { opacity: 1; background: var(--success); }
.st-slot { position: absolute; border-radius: 8px; border: 1.5px dashed var(--line-strong); display: flex; align-items: center; justify-content: center; font: 500 10px var(--font-mono); color: var(--ink-muted); transition: border-color 300ms, background-color 300ms, opacity 300ms; }
.st-slot.is-home, .st-slot.is-temp { border-color: transparent; color: transparent; }
.st-slot.is-renovation, .st-slot.is-away { background: repeating-linear-gradient(135deg, #FDE3D0 0 4px, transparent 4px 9px); border-color: var(--orange); color: var(--orange-strong); }
.st-slot.is-vacant { background: transparent; }
.st-slot.is-unavailable { opacity: 0.35; }
.st-tokens { position: absolute; inset: 0; pointer-events: none; }
.st-token { position: absolute; left: 0; top: 0; border-radius: 8px; background: var(--ink); color: var(--paper); font: 600 12px/1 var(--font-sans); display: flex; align-items: center; justify-content: center; padding: 0 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; box-shadow: 0 1px 2px rgba(28,35,38,0.12); transition: transform 700ms cubic-bezier(0.2, 0.8, 0.2, 1), background-color 400ms var(--ease-out), box-shadow 400ms; will-change: transform; }
.st-token.is-away { background: var(--slate); color: #fff; }
.st-token.is-moving { box-shadow: 0 8px 20px rgba(242,106,27,0.35); z-index: 2; }
.st-token.is-conflict { background: var(--danger); color: #fff; }
.stage.no-anim .st-token { transition: none; }
.st-caption { margin-top: 14px; font: 500 0.9375rem/1.45 var(--font-sans); color: var(--ink); min-height: 2.9em; text-wrap: pretty; }
@media (max-width: 640px) { .st-caption { font-size: 0.875rem; } }