/* Lit architectural layout studies; isolated from the main site. */
.pj .pj-study-visual.ps-ready { position:relative; isolation:isolate; }
.pj .pj-study-visual.ps-ready > svg { visibility:hidden; }
.pj .ps-canvas { position:absolute; inset:0; width:100%; height:100%; display:block; visibility:hidden; cursor:grab; touch-action:pan-y; -webkit-user-select:none; user-select:none; border-radius:8px; }
.pj .ps-ready .ps-canvas { visibility:visible; }
.pj .ps-canvas:active { cursor:grabbing; }
.pj .ps-canvas:focus-visible { outline:1px solid #5c594d; outline-offset:2px; }
.pj .ps-ui { margin:2px 0 25px; color:#5b554a; font-size:11px; line-height:1.4; }
.pj .ps-topline { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:10px; }
.pj .ps-drag-hint { display:flex; align-items:center; gap:8px; font-size:11px; }
.pj .ps-drag-hint span { font-size:18px; line-height:1; }
.pj .ps-reset { flex-shrink:0; min-height:44px; padding:8px 0 8px 16px; font-size:11px; text-decoration:underline; text-decoration-color:#a9a092; text-underline-offset:4px; }
.pj .ps-views { display:flex; border:1px solid #bdb3a3; border-radius:3px; padding:3px; gap:3px; }
.pj .ps-views button { flex:1; min-height:44px; padding:8px 10px; border-radius:2px; color:#6b6254; font-size:12px; transition:background .2s,color .2s; }
.pj .ps-views button[aria-pressed="true"] { background:#504b41; color:#fff5e4; }
.pj .ps-views button:not([aria-pressed="true"]):hover { background:#d6cebf; color:#35372f; }
.pj .ps-roof { min-height:70px; margin-top:14px; display:flex; align-items:center; gap:18px; }
.pj .ps-roof-label { flex:0 0 104px; font-size:12px; line-height:1.5; }
.pj .ps-roof-label output { display:block; color:#6b6254; font-size:11px; margin-top:3px; }
.pj .ps-range-wrap { display:flex; align-items:center; gap:10px; flex:1; min-width:0; }
.pj .ps-range-wrap > span { color:#6b6254; font-size:11px; }
.pj .ps-range { accent-color:#615444; width:100%; min-width:35px; height:44px; margin:0; cursor:ew-resize; }
.pj .ps-toggle { width:100%; min-height:48px; padding:10px 0; display:flex; align-items:center; justify-content:space-between; gap:18px; text-align:left; font-size:12px; border-bottom:1px solid #bdb3a3; }
.pj .ps-toggle i { flex-shrink:0; position:relative; width:33px; height:19px; border:1px solid #8d8271; border-radius:20px; }
.pj .ps-toggle i::after { content:''; position:absolute; left:3px; top:3px; width:11px; height:11px; background:#8d8271; border-radius:50%; transition:transform .25s,background .25s; }
.pj .ps-toggle[aria-pressed="true"] i { border-color:#514937; }
.pj .ps-toggle[aria-pressed="true"] i::after { transform:translateX(14px); background:#514937; }
.pj .ps-roof-note { max-width:380px; color:#6b6254; font-size:11px; line-height:1.6; }
.pj .ps-status { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.pj .ps-ui :focus-visible { outline:2px solid #4f5843; outline-offset:3px; }
.pj .ps-canvas.ps-failed,.pj .ps-ui[hidden] { display:none; }
.pj[data-motion="off"] .ps-views button,
.pj[data-motion="off"] .ps-toggle i::after { transition:none; }
@media (prefers-reduced-motion:reduce) {
  .pj .ps-views button,.pj .ps-toggle i::after { transition:none; }
}
@media (max-width:700px) {
  .pj .ps-ui { margin-bottom:21px; }
  .pj .ps-topline { margin-bottom:8px; }
  .pj .ps-views button { min-height:44px; font-size:12px; padding-inline:6px; }
  .pj .ps-roof { margin-top:9px; min-height:67px; gap:10px; }
  .pj .ps-roof-label { flex-basis:98px; }
  .pj .ps-range-wrap { gap:7px; }
}
