/* ---------- cena (parede) — medida em cm: --cm = px por cm ---------- */
.cp-scene { position: relative; width: 100%; overflow: hidden; container-type: inline-size; --cm: calc(100cqw / var(--vw)); border-radius: var(--r-lg); background: #E6DACA; isolation: isolate; }
.cp-scene-in { position: absolute; left: 0; top: 0; }
.cp-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: fill; pointer-events: none; user-select: none; }
.cp-room { background: radial-gradient(ellipse at 6% 38%, rgba(255, 236, 200, .7), transparent 22%), linear-gradient(180deg, #EFE6D8, #E5D9C8); }
:root[data-theme="dark"] .cp-room, :root[data-theme="dark"] .cp-photo { filter: brightness(.9); }
.cp-room > i, .cp-room > span { position: absolute; display: block; }
.cp-room i { display: block; }
.r-light { inset: 0; background: radial-gradient(ellipse at 40% 0%, rgba(255, 255, 255, .5), transparent 55%); }
.r-base { left: 0; right: 0; top: calc(var(--cm) * 255); height: calc(var(--cm) * 7); background: #F7F2EA; box-shadow: 0 calc(var(--cm) * -.6) 0 rgba(0, 0, 0, .05); }
.r-floor { left: 0; right: 0; top: calc(var(--cm) * 262); bottom: 0; background: linear-gradient(#C8A47A, #AE875D); }
.r-sofa { left: calc(var(--cm) * 50); top: calc(var(--cm) * 178); width: calc(var(--cm) * 200); height: calc(var(--cm) * 84); }
.r-sofa i { position: absolute; }
.s-back { left: 6%; right: 6%; top: 0; height: 58%; background: #7D919C; border-radius: calc(var(--cm) * 10) calc(var(--cm) * 10) calc(var(--cm) * 3) calc(var(--cm) * 3); }
.s-seat { left: 9%; right: 9%; top: 46%; height: 32%; background: #71868F; border-radius: calc(var(--cm) * 5); box-shadow: inset 0 calc(var(--cm) * -3) 0 rgba(0, 0, 0, .08); }
.s-arm { top: 30%; width: 11%; height: 52%; background: #697E88; border-radius: calc(var(--cm) * 9) calc(var(--cm) * 9) calc(var(--cm) * 4) calc(var(--cm) * 4); }
.s-arm.s-l { left: 0; } .s-arm.s-r { right: 0; }
.s-pil { top: 24%; width: 15%; height: 30%; border-radius: calc(var(--cm) * 5); }
.s-pil.p1 { left: 15%; background: #E8C27C; rotate: -8deg; }
.s-pil.p2 { right: 16%; background: #D98E6E; rotate: 7deg; }
.s-leg { top: 82%; width: 2.5%; height: 18%; background: #4B3A2C; border-radius: 0 0 calc(var(--cm) * 1) calc(var(--cm) * 1); }
.s-leg.s-l { left: 7%; } .s-leg.s-r { right: 7%; }
.r-plant { left: calc(var(--cm) * 254); top: calc(var(--cm) * 140); width: calc(var(--cm) * 42); height: calc(var(--cm) * 122); }
.r-plant svg { position: absolute; left: 0; top: 0; width: 100%; height: 74%; }
.p-pot { position: absolute; left: 18%; right: 18%; bottom: 0; height: 30%; background: #C9785A; border-radius: calc(var(--cm) * 2) calc(var(--cm) * 2) calc(var(--cm) * 6) calc(var(--cm) * 6); }
.r-lamp { left: calc(var(--cm) * 8); top: calc(var(--cm) * 108); width: calc(var(--cm) * 34); height: calc(var(--cm) * 154); }
.r-lamp i { position: absolute; }
.l-shade { left: 4%; right: 4%; top: 0; height: 16%; background: linear-gradient(#E9D2A6, #DDBF8A); clip-path: polygon(24% 0, 76% 0, 100% 100%, 0 100%); }
.l-pole { left: calc(50% - var(--cm) * .8); width: calc(var(--cm) * 1.6); top: 14%; bottom: 2%; background: #3A3438; }
.l-foot { left: 24%; right: 24%; bottom: 0; height: calc(var(--cm) * 2.5); background: #3A3438; border-radius: 99px; }

/* molduras (em cm) */
.cp-frame { position: absolute; box-sizing: border-box; display: block; background: #FBFAF7; box-shadow: 0 calc(var(--cm) * 1.6) calc(var(--cm) * 3.6) rgba(25, 18, 10, .34), 0 calc(var(--cm) * .3) calc(var(--cm) * .6) rgba(0, 0, 0, .18); }
.cp-frame img { width: 100%; height: 100%; object-fit: contain; pointer-events: none; user-select: none; -webkit-user-select: none; }
.cp-f-poster { border: max(1px, calc(var(--cm) * 1.4)) solid #CDAE80; padding: calc(var(--cm) * 1.8); }
.cp-f-fine { border: max(1px, calc(var(--cm) * 2.4)) solid #1E1D22; padding: calc(var(--cm) * 5); }
.cp-f-tela { padding: calc(var(--cm) * 1); background: #EEE8DD; box-shadow: calc(var(--cm) * .6) calc(var(--cm) * 2) calc(var(--cm) * 3.6) rgba(25, 18, 10, .42), inset 0 0 0 1px rgba(0, 0, 0, .06); }

/* ---------- v5: "Put it on your wall" sheet ---------- */
.wl .cp-scene { margin: 12px 0 14px; }
.wl-frame { border: calc(var(--cm) * 2.2) solid #3B2E22; }
.wl-sizes { margin-bottom: 8px; }
.wl-sizes button { display: flex; flex-direction: column; align-items: center; gap: 1px; line-height: 1.15; }
.wl-sizes small { font-size: 11px; font-weight: 700; color: var(--muted); }
.wl-note { margin: 6px 0 14px; }
.lv-wall { margin-top: 8px; }
.lv-wall svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; }
.wl-sizes button[aria-checked="true"] { background: var(--surface); color: var(--ink); box-shadow: 0 2px 0 var(--line); }
