/* Explorer + panorama viewer + glue for the 3D tour */
:root {
  --st-available:#2E6BD8; --st-interim:#F5B833; --st-proposal:#E4633C; --st-storage:#B98A62; --st-leased:#8C877A;
  --pano:#FFD42A; --ex-bg:#F4F2EB; --ex-line:#E6E2D6;
}
.hidden { display:none !important; }

/* ---- mode visibility ---- */
body:not(.mode-splat) #ui, body:not(.mode-splat) #dock, body:not(.mode-splat) #popup, body:not(.mode-splat) #intro,
body:not(.mode-splat) #mlabel, body:not(.mode-splat) #placeHud, body:not(.mode-splat) #xhair,
body:not(.mode-splat) #align, body:not(.mode-splat) #stats, body:not(.mode-splat) #status { display:none !important; }
body.mode-pano #app { cursor:grab; }
body:not(.has-xr) .xr-only { display:none !important; }

/* ---- mode bar: 3D · Plan · 360° · Spaces ---- */
.modebar { display:flex; gap:2px; padding:3px; background:#fff; border-radius:13px; font-family:var(--f-display); }
#modeBar { position:fixed; top:10px; left:16px; z-index:95; border:1px solid var(--ex-line); box-shadow:0 6px 18px rgba(0,0,0,.18); }
#exModeSlot { width:var(--mb-w, 330px); flex:none; align-self:stretch; }
.pn-top { padding-left:calc(var(--mb-w, 330px) + 32px) !important; }
#status { padding-left:calc(var(--mb-w, 330px) + 32px); }
#stats { top:62px !important; }
.modebar button { display:flex; align-items:center; gap:6px; padding:7px 12px; border-radius:10px; background:transparent; color:var(--ink);
  font-family:var(--f-display); font-weight:600; font-size:14px; border:none; white-space:nowrap; }
.modebar button svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linejoin:round; stroke-linecap:round; flex:none; }
.modebar button:hover { background:var(--ex-bg); }
.modebar button.on { background:var(--ink); color:#fff; }
#pFoot { display:flex; flex-direction:column; gap:10px; }
#pAction { width:100%; background:var(--pAccent,#0E9488); color:var(--pInk,#fff); padding:11px 14px; font-size:14px; text-align:left; }
#pNext.to-explorer { color:var(--ink); }
.ed-act { display:flex; gap:6px; }
.ed-act select, .ed-act input { flex:1; min-width:0; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.16); color:#fff; border-radius:8px; padding:7px 9px; font:13px/1.4 var(--f-body); }
.ed-act select option { color:#000; }
#saveTour.dirty { background:var(--accent); color:var(--ink); border-color:var(--accent); }
#saveState { color:var(--mut); font-size:11px; margin-top:6px; }
#saveState a { color:#fff; }

/* ================= explorer ================= */
#explorer { position:fixed; inset:0; z-index:80; background:var(--ex-bg); color:var(--ink); display:grid;
  grid-template-columns:92px 1fr; grid-template-rows:auto auto 1fr; font:14px/1.45 var(--f-body); }
.ex-top { grid-column:1/3; display:flex; align-items:center; gap:14px; padding:10px 16px; background:#fff; border-bottom:1px solid var(--ex-line); min-height:58px; }
.ex-btn, .ex-seg button, #exZoom button, .pn-bar button { font-family:var(--f-display); font-weight:600; font-size:14px; padding:8px 13px; border-radius:10px;
  background:var(--ex-bg); color:var(--ink); border:1px solid var(--ex-line); }
.ex-btn:hover, .ex-seg button:hover, #exZoom button:hover { background:var(--ex-line); }
.ex-btn.on { background:var(--ink); color:#fff; border-color:var(--ink); }
.ex-title { display:flex; flex-direction:column; line-height:1.15; min-width:0; }
.ex-title b { font-family:var(--f-display); font-weight:600; font-size:18px; }
.ex-title span { font-family:var(--f-mono); font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:var(--mut); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ex-preview { font-family:var(--f-mono); font-size:11px; background:var(--st-proposal); color:#fff; padding:4px 8px; border-radius:6px; }
.ex-tools { margin-left:auto; display:flex; gap:8px; align-items:center; }
.ex-seg { display:flex; }
.ex-seg button { border-radius:0; }
.ex-seg button:first-child { border-radius:10px 0 0 10px; } .ex-seg button:last-child { border-radius:0 10px 10px 0; border-left:none; }
.ex-seg button.on { background:var(--ink); color:#fff; border-color:var(--ink); }

#exFilter { grid-column:1/3; background:#fff; border-bottom:1px solid var(--ex-line); padding:10px 16px; display:flex; flex-wrap:wrap; gap:10px 24px; }
.fl-row { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.fl-row label { font-size:13px; }
.fl-row input[type=number] { width:86px; padding:6px 8px; border:1px solid var(--ex-line); border-radius:8px; font:13px var(--f-body); }
.fl-row button { padding:6px 10px; border-radius:8px; background:var(--ex-bg); border:1px solid var(--ex-line); font-size:13px; }
.chk { display:inline-flex; align-items:center; gap:6px; cursor:pointer; }
.sw { display:inline-block; width:12px; height:12px; border-radius:3px; margin-right:6px; vertical-align:-1px; }
.sw.st-available { background:var(--st-available); } .sw.st-interim { background:var(--st-interim); } .sw.st-proposal { background:var(--st-proposal); }
.sw.st-storage { background:var(--st-storage); } .sw.st-leased { background:var(--st-leased); }
.sw.pdot { background:var(--pano); border-radius:50%; border:2px solid var(--ink); width:11px; height:11px; }

#exFloors { grid-row:3; display:flex; flex-direction:column; gap:4px; padding:10px 8px; overflow:auto; background:#fff; border-right:1px solid var(--ex-line); }
.ex-floor { display:flex; flex-direction:column; align-items:center; padding:7px 4px; border-radius:10px; background:transparent; color:var(--ink); border:1px solid transparent; }
.ex-floor b { font-family:var(--f-display); font-size:15px; font-weight:600; }
.ex-floor { position:relative; }
.ex-floor .cnt { position:absolute; top:3px; right:5px; min-width:17px; height:17px; padding:0 4px; border-radius:9px; background:var(--st-available); color:#fff; font:700 10px/17px var(--f-mono); }
.ex-floor:hover { background:var(--ex-bg); }
.ex-floor.on { background:var(--ink); color:#fff; }

#exMain { grid-row:3; position:relative; overflow:hidden; }
#exPlan { position:absolute; inset:0; }
.planview { touch-action:none; user-select:none; -webkit-user-select:none; }
.pv-svg { width:100%; height:100%; display:block; }
.pv-panning { cursor:grabbing !important; }
.pv-img { opacity:.95; }
#exPlan .u { fill-opacity:.42; stroke-width:1.2; vector-effect:non-scaling-stroke; transition:fill-opacity .15s; }
#exPlan .u.st-available { fill:var(--st-available); stroke:var(--st-available); }
#exPlan .u.st-interim { fill:var(--st-interim); stroke:#c58d10; }
#exPlan .u.st-proposal { fill:var(--st-proposal); stroke:var(--st-proposal); }
#exPlan .u.st-storage { fill:var(--st-storage); stroke:var(--st-storage); }
#exPlan .u.st-leased { fill:var(--st-leased); stroke:var(--st-leased); fill-opacity:.3; }
#exPlan .u.hov { fill-opacity:.62; }
#exPlan .u.on { fill-opacity:.18; }
#exPlan .u.dim { fill-opacity:.07; stroke-opacity:.25; }
#exPlan .u.grey { fill:#bbb; stroke:#999; fill-opacity:.25; }
#exPlan .u-sel { fill:none; stroke:var(--ink); stroke-width:3; vector-effect:non-scaling-stroke; pointer-events:none; }
#exPlan .r { fill:#fff; fill-opacity:.01; stroke:var(--ink); stroke-opacity:.45; stroke-width:1; vector-effect:non-scaling-stroke; }
#exPlan .r.hov { fill:var(--accent); fill-opacity:.35; }
#exPlan .r.on { fill:var(--accent); fill-opacity:.6; stroke-opacity:1; stroke-width:2; }
#exPlan .rl { font-family:var(--f-mono); fill:var(--ink); text-anchor:middle; dominant-baseline:central; pointer-events:none; paint-order:stroke; stroke:#fff; stroke-opacity:.8; }
.pd { fill:var(--pano); stroke:var(--ink); vector-effect:non-scaling-stroke; cursor:pointer; }
#exPlan .pd { stroke-width:2; }
#exPlan .pd.faint { opacity:.45; }
#exPlan .pd:hover { fill:#fff; }

#exLegend { position:absolute; left:14px; bottom:14px; background:rgba(255,255,255,.94); border:1px solid var(--ex-line); border-radius:12px; padding:8px 12px;
  display:flex; flex-wrap:wrap; gap:4px 14px; font-size:12px; max-width:calc(100% - 28px); }
#exLegend .compass { font-family:var(--f-mono); font-weight:700; }
#exZoom { position:absolute; right:14px; bottom:14px; display:flex; flex-direction:column; gap:6px; }
#exZoom button { width:40px; height:40px; padding:0; background:#fff; font-size:17px; }
#exList { position:absolute; inset:0; overflow:auto; padding:16px; }
#exList .empty { color:var(--mut); }
#exMain.listmode #exLegend, #exMain.listmode #exZoom { display:none; }

#exTip { position:fixed; z-index:95; transform:translate(14px, 14px); background:var(--ink); color:#fff; font-size:12.5px; padding:6px 10px; border-radius:8px; pointer-events:none; white-space:nowrap; }

/* side panel */
#exPanel { position:absolute; z-index:5; top:74px; right:16px; bottom:16px; width:390px; max-width:calc(100% - 120px); background:#fff; border-radius:20px;
  box-shadow:0 30px 70px rgba(0,0,0,.22); display:flex; flex-direction:column; overflow:hidden; }
#exPanelGrip { display:none; }
#exPanelClose { position:absolute; top:12px; right:12px; width:34px; height:34px; border-radius:50%; background:var(--ex-bg); color:var(--ink); font-size:14px; z-index:2; }
#exPanelBody { overflow:auto; padding:22px 24px 24px; }
.pp-kicker { font-family:var(--f-mono); font-size:11px; letter-spacing:1.8px; text-transform:uppercase; color:var(--mut); margin-bottom:6px; padding-right:36px; }
.pp-kicker a { color:var(--ink); }
#exPanelBody h2 { font-family:var(--f-display); font-weight:600; font-size:28px; line-height:1.05; margin:0 0 10px; padding-right:30px; }
#exPanelBody h3 { font-family:var(--f-mono); font-weight:400; font-size:11px; letter-spacing:2px; text-transform:uppercase; color:var(--mut); margin:22px 0 8px; }
.pp-status { display:inline-flex; align-items:center; font-weight:600; font-size:13px; background:var(--ex-bg); border:1px solid var(--ex-line); border-radius:8px; padding:5px 10px; }
.pp-facts { margin:16px 0 0; display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.pp-facts div { background:var(--ex-bg); border-radius:10px; padding:9px 11px; }
.pp-facts dt { font-family:var(--f-mono); font-size:10px; letter-spacing:1.2px; text-transform:uppercase; color:var(--mut); }
.pp-facts dd { margin:2px 0 0; font-weight:600; }
.pp-note { color:var(--mut); }
.pp-text { color:var(--ink2); margin-top:14px; } .pp-text p { margin:0 0 10px; }
.pp-panos { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.pp-pano { position:relative; display:block; border-radius:10px; overflow:hidden; aspect-ratio:2/1; background:#ddd; color:#fff; text-decoration:none; }
.pp-pano img { width:100%; height:100%; object-fit:cover; display:block; }
.pp-pano span { position:absolute; left:0; right:0; bottom:0; padding:14px 8px 5px; font-size:11.5px; background:linear-gradient(transparent, rgba(0,0,0,.6)); }
.pp-docs, .pp-rooms { list-style:none; margin:0; padding:0; }
.pp-docs li, .pp-rooms li { display:flex; justify-content:space-between; gap:10px; padding:8px 0; border-bottom:1px solid var(--ex-line); }
.pp-docs a, .pp-rooms a { color:var(--ink); font-weight:600; }
.pp-rooms span { color:var(--mut); font-variant-numeric:tabular-nums; white-space:nowrap; }
.pp-enquire { display:block; text-align:center; margin-top:22px; background:var(--accent); color:var(--ink); font-family:var(--f-display); font-weight:600; font-size:16px;
  padding:13px; border-radius:12px; text-decoration:none; }

@media (max-width:720px) {
  #explorer { grid-template-columns:1fr; grid-template-rows:auto auto auto 1fr; }
  .ex-top { grid-column:1; padding:8px 8px; gap:6px; min-height:52px; }
  .ex-title b { display:none; }
  .ex-title span { font-size:10px; letter-spacing:1px; }
  .ex-preview { position:absolute; left:8px; top:56px; z-index:3; font-size:9px; padding:2px 6px; }
  .ex-tools { gap:5px; }
  .ex-btn, .ex-seg button { padding:7px 9px; font-size:13px; }
  #exList { padding:8px; }
  .ex-floor .cnt { top:0; right:0; min-width:15px; height:15px; font-size:9px; line-height:15px; }
  #exFilter { grid-column:1; }
  #exFloors { grid-row:3; flex-direction:row; overflow-x:auto; border-right:none; border-bottom:1px solid var(--ex-line); padding:6px; }
  .ex-floor { min-width:62px; flex:none; }
  #exMain { grid-row:4; }
  #exPanel { top:auto; left:0; right:0; bottom:0; width:auto; max-width:none; max-height:64vh; border-radius:20px 20px 0 0; transition:max-height .3s ease; }
  #exPanel.peek { max-height:136px; }
  #exPanel.peek #exPanelBody { overflow:hidden; cursor:pointer; }
  #exPanelGrip { display:block; height:22px; flex:none; cursor:pointer; position:relative; }
  #exPanelGrip::after { content:''; position:absolute; left:50%; top:8px; width:44px; height:5px; margin-left:-22px; border-radius:3px; background:var(--ex-line); }
  #exPanelBody { padding:4px 18px 22px; }
  #exPanelBody h2 { font-size:23px; }
  body.ex-sel #exLegend, body.ex-sel #exZoom { display:none; }
  #exLegend { font-size:11px; left:8px; bottom:8px; }
}

/* ================= panorama ================= */
#pano { position:fixed; inset:0; z-index:70; pointer-events:none; color:#fff; font:14px/1.4 var(--f-body); }
#pano > * { pointer-events:auto; }
#pano.xr > * { display:none; }
.pn-top { position:absolute; top:0; left:0; right:0; display:flex; align-items:center; gap:14px; padding:14px 16px;
  background:linear-gradient(rgba(0,0,0,.55), transparent); pointer-events:none; }
.pn-top > * { pointer-events:auto; }
.pn-title { display:flex; flex-direction:column; min-width:0; text-shadow:0 2px 8px rgba(0,0,0,.6); }
.pn-title b { font-family:var(--f-display); font-weight:600; font-size:20px; }
.pn-title span { font-family:var(--f-mono); font-size:11px; letter-spacing:1.4px; text-transform:uppercase; opacity:.85; }
#panoSpots { position:absolute; inset:0; pointer-events:none; overflow:hidden; }
.hs { position:absolute; left:0; top:0; pointer-events:auto; background:none; border:none; padding:0; display:flex; flex-direction:column; align-items:center; gap:4px; color:#fff; }
.hs i { display:flex; align-items:center; justify-content:center; width:46px; height:46px; border-radius:50%; background:rgba(255,255,255,.88); color:var(--ink);
  font-style:normal; font-size:22px; font-weight:700; box-shadow:0 6px 18px rgba(0,0,0,.35); border:3px solid var(--pano); }
.hs span { font-size:12px; font-weight:600; text-shadow:0 1px 6px rgba(0,0,0,.8); white-space:nowrap; max-width:160px; overflow:hidden; text-overflow:ellipsis; }
.hs:hover i { background:var(--pano); }
#panoLoad { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); font-family:var(--f-mono); font-size:12px; background:rgba(0,0,0,.6); padding:8px 12px; border-radius:8px; pointer-events:none; }
.pn-mini { position:absolute; left:16px; bottom:16px; width:240px; height:170px; border-radius:14px; overflow:hidden; background:#fff; box-shadow:0 14px 34px rgba(0,0,0,.35); transition:width .25s, height .25s; }
#pano.mini-big .pn-mini { width:min(520px, calc(100% - 32px)); height:min(380px, 55vh); }
#panoMini { position:absolute; inset:0; }
#panoMiniBig { position:absolute; top:6px; right:6px; width:30px; height:30px; padding:0; border-radius:8px; background:#fff; color:var(--ink); border:1px solid var(--ex-line); }
#panoMini .pd { stroke-width:1.5; }
#panoMini .me { fill:var(--st-proposal); stroke:#fff; stroke-width:2; vector-effect:non-scaling-stroke; }
#panoMini .cone { fill:var(--st-proposal); fill-opacity:.35; stroke:var(--st-proposal); stroke-width:1; vector-effect:non-scaling-stroke; }
.pn-bar { position:absolute; right:16px; bottom:16px; display:flex; align-items:center; gap:6px; background:rgba(255,255,255,.96); padding:8px; border-radius:16px; box-shadow:0 14px 34px rgba(0,0,0,.35); color:var(--ink); }
.pn-bar button { padding:0 12px; height:38px; min-width:38px; background:var(--ex-bg); }
.pn-bar button.on { background:var(--ink); color:#fff; }
#panoVR { background:var(--accent); border-color:var(--accent); }
#panoCount { font-family:var(--f-mono); font-size:12px; min-width:44px; text-align:center; }
.pn-sep { width:1px; height:24px; background:var(--ex-line); }
@media (max-width:720px) {
  .pn-mini { width:150px; height:112px; left:10px; bottom:76px; }
  .pn-bar { left:10px; right:10px; bottom:10px; justify-content:center; flex-wrap:wrap; }
  .pn-title b { font-size:16px; }
}

/* ---- panorama: info card + gallery ---- */
#panoInfo { position:absolute; top:72px; right:16px; width:330px; max-width:calc(100% - 32px); max-height:calc(100% - 170px); overflow:auto;
  background:#fff; color:var(--ink); border-radius:18px; padding:18px 20px; box-shadow:0 20px 50px rgba(0,0,0,.35); }
#panoInfo h2 { font-family:var(--f-display); font-weight:600; font-size:22px; line-height:1.1; margin:0 0 8px; padding-right:28px; }
#panoInfoClose { position:absolute; top:10px; right:10px; width:30px; height:30px; border-radius:50%; background:var(--ex-bg); color:var(--ink); font-size:13px; border:none; }
#panoInfo .pp-facts { margin-top:12px; }
.pi-btns { display:flex; gap:8px; margin-top:14px; flex-wrap:wrap; }
.pi-btns a, .pi-btns button { flex:1; text-align:center; font-family:var(--f-display); font-weight:600; font-size:13.5px; padding:9px 10px; border-radius:10px;
  background:var(--ex-bg); color:var(--ink); border:1px solid var(--ex-line); text-decoration:none; white-space:nowrap; }
.pi-btns button { background:var(--accent); border-color:var(--accent); }
.pn-bar .pn-ico { padding:0; width:38px; font-family:var(--f-display); font-size:16px; display:inline-flex; align-items:center; justify-content:center; }
#panoGallery { position:absolute; left:16px; right:16px; bottom:84px; max-height:min(300px, 42vh); display:flex; flex-direction:column;
  background:rgba(255,255,255,.97); color:var(--ink); border-radius:16px; box-shadow:0 14px 34px rgba(0,0,0,.35); overflow:hidden; }
.pg-head { display:flex; align-items:center; gap:10px; padding:10px 12px 6px; }
.pg-head b { font-family:var(--f-display); font-weight:600; font-size:15px; }
.pg-head select { margin-left:auto; font:13px var(--f-body); padding:6px 8px; border-radius:8px; border:1px solid var(--ex-line); background:var(--ex-bg); max-width:60%; }
#panoGalClose { width:30px; height:30px; border-radius:50%; background:var(--ex-bg); border:none; color:var(--ink); }
#panoGalBody { overflow:auto; padding:2px 12px 12px; display:flex; gap:18px; }
.pg-grp { flex:none; }
.pg-grp h4 { margin:2px 0 6px; font-family:var(--f-mono); font-weight:400; font-size:10.5px; letter-spacing:1.4px; text-transform:uppercase; color:var(--mut); white-space:nowrap; }
.pg-row { display:flex; gap:8px; }
.pg-it { position:relative; display:block; width:150px; aspect-ratio:2/1; border-radius:9px; overflow:hidden; background:#ddd; color:#fff; text-decoration:none; flex:none; }
.pg-it img { width:100%; height:100%; object-fit:cover; display:block; }
.pg-it span { position:absolute; left:0; right:0; bottom:0; padding:12px 7px 4px; font-size:11px; background:linear-gradient(transparent, rgba(0,0,0,.65)); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pg-it.on { outline:3px solid var(--accent); outline-offset:-3px; }
.pg-empty { color:var(--mut); }
#pano.gal-open .pn-mini { display:none; }

/* ---- spaces page ---- */
#explorer.ex-list #exFloors { display:none; }
#explorer.ex-list #exMain { grid-column:1/3; }
.sp-wrap { max-width:1180px; margin:0 auto; padding:4px 4px 40px; }
.sp-about { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:22px; background:#fff; border-radius:18px; padding:24px; margin-bottom:26px; }
.sp-about h2 { font-family:var(--f-display); font-weight:600; font-size:30px; line-height:1.05; margin:0 0 6px; }
.sp-about h3 { font-family:var(--f-mono); font-weight:400; font-size:11px; letter-spacing:2px; text-transform:uppercase; color:var(--mut); margin:20px 0 6px; }
.sp-addr { margin:0 0 10px; color:var(--mut); }
.sp-contact { margin:0; color:var(--ink2); }
.sp-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.sp-btn { font-family:var(--f-display); font-weight:600; font-size:14px; padding:10px 14px; border-radius:11px; background:var(--ex-bg); color:var(--ink);
  border:1px solid var(--ex-line); text-decoration:none; }
.sp-btn.primary { background:var(--accent); border-color:var(--accent); }
.sp-gallery { display:grid; grid-template-columns:1fr 1fr; gap:10px; align-content:start; }
.sp-gallery figure { margin:0; }
.sp-gallery figure:first-child { grid-column:1/3; }
.sp-gallery img { width:100%; aspect-ratio:3/2; object-fit:cover; border-radius:12px; display:block; background:var(--ex-line); }
.sp-gallery figcaption { font-size:12px; color:var(--mut); margin-top:4px; }
.sp-gallery figcaption:empty { display:none; }
.sp-head { display:flex; align-items:baseline; gap:12px; margin:0 0 4px; }
.sp-head h2 { font-family:var(--f-display); font-weight:600; font-size:24px; margin:0; }
.sp-head span { color:var(--mut); font-size:13px; }
.sp-floor { font-family:var(--f-display); font-weight:500; font-size:16px; margin:22px 0 10px; }
.sp-floor b { display:inline-block; min-width:42px; font-weight:600; background:var(--ink); color:#fff; border-radius:8px; padding:2px 8px; margin-right:6px; text-align:center; }
.sp-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(250px, 1fr)); gap:14px; }
.sp-card { background:#fff; border-radius:16px; overflow:hidden; display:flex; flex-direction:column; border:1px solid var(--ex-line); }
.sp-card.grey { opacity:.55; }
.sp-thumb { position:relative; aspect-ratio:2/1; background:var(--ex-bg); cursor:pointer; display:flex; align-items:center; justify-content:center; }
.sp-thumb img { width:100%; height:100%; object-fit:cover; display:block; }
.sp-thumb svg { width:78%; height:78%; }
.sp-thumb svg path { fill:var(--st-available); fill-opacity:.18; stroke:var(--ink); stroke-width:1.4; vector-effect:non-scaling-stroke; }
.sp-st { position:absolute; left:10px; top:10px; background:rgba(255,255,255,.95); border-radius:8px; padding:3px 8px; font-size:12px; font-weight:600; }
.sp-body { padding:12px 14px 14px; display:flex; flex-direction:column; gap:6px; flex:1; }
.sp-body h4 { margin:0; font-family:var(--f-display); font-weight:600; font-size:18px; line-height:1.15; cursor:pointer; }
.sp-meta { display:flex; flex-wrap:wrap; gap:4px 12px; font-size:13px; color:var(--ink2); }
.sp-btns { display:flex; gap:6px; margin-top:auto; padding-top:6px; }
.sp-btns a, .sp-btns button { flex:1; text-align:center; font-family:var(--f-display); font-weight:600; font-size:13px; padding:7px 8px; border-radius:9px;
  background:var(--ex-bg); color:var(--ink); border:1px solid var(--ex-line); text-decoration:none; white-space:nowrap; }
.sp-card.grey .sp-thumb, .sp-card.grey h4 { cursor:default; }
.pp-dossier { display:block; width:100%; text-align:center; margin-top:22px; background:var(--ex-bg); color:var(--ink); border:1px solid var(--ex-line);
  font-family:var(--f-display); font-weight:600; font-size:15px; padding:11px; border-radius:12px; }
.pp-dossier + .pp-enquire { margin-top:10px; }
.pp-price { margin-top:8px; }
.pp-price div { background:#fff8d6; }
#exTip.tip-img { padding:5px; display:flex; flex-direction:column; gap:4px; }
#exTip.tip-img img { width:200px; height:100px; object-fit:cover; border-radius:5px; display:block; }

/* ---- dossier progress ---- */
#dossierBusy { position:fixed; inset:0; z-index:120; background:rgba(14,14,18,.45); display:flex; align-items:center; justify-content:center; }
.db-card { background:#fff; color:var(--ink); border-radius:16px; padding:22px 26px; min-width:260px; display:flex; flex-direction:column; align-items:center; gap:8px;
  box-shadow:0 20px 60px rgba(0,0,0,.4); font-family:var(--f-body); }
.db-card b { font-family:var(--f-display); font-weight:600; font-size:17px; }
.db-card small { color:var(--mut); min-height:1.2em; }
.db-spin { width:30px; height:30px; border-radius:50%; border:3px solid var(--ex-line); border-top-color:var(--ink); animation:dbspin .8s linear infinite; }
@keyframes dbspin { to { transform:rotate(360deg); } }

@media (max-width:720px) {
  .modebar button { padding:7px 8px; font-size:12.5px; gap:4px; }
  .modebar button svg { width:16px; height:16px; }
  #modeBar { top:7px; left:8px; }
  #modeBar button span { display:none; }
  #modeBar button.on span { display:inline; }
  .ex-title { display:none; }
  .pn-top { padding-left:16px !important; padding-top:62px; }
  #status { padding-left:calc(var(--mb-w, 200px) + 20px); }
  #panoInfo { top:auto; bottom:76px; left:10px; right:10px; width:auto; max-width:none; max-height:52vh; }
  #panoGallery { left:10px; right:10px; bottom:76px; }
  #pano.info-open .pn-mini { display:none; }
  #panoZoomIn, #panoZoomOut, #panoZoomOut + .pn-sep, .pn-bar .pn-sep:has(+ #panoZoomOut) { display:none; }
  .pn-bar { flex-wrap:nowrap; gap:5px; padding:6px; }
  .pn-bar button { min-width:34px; padding:0 9px; }
  .pn-bar .pn-ico { width:34px; }
  .sp-about { grid-template-columns:1fr; padding:18px; }
  .sp-about h2 { font-size:24px; }
  .sp-grid { grid-template-columns:1fr; }
}
#align .rowbtn { margin-top:10px; } #align .rowbtn button { flex:1; } #alignState { color:var(--mut); font-size:11px; margin-top:6px; } #alignState a { color:#fff; }