:root{
  --ink:#0F2330; --mist:#EEF2F1; --champagne:#E2C792; --champagne-d:#B89A62;
  --lagoon:#7FD3DC; --reserved:#D9A877; --sold:#8E8A84;
  --glass:rgba(246,248,247,.74); --glass-strong:rgba(250,251,250,.95); --glass-line:rgba(15,35,48,.14);
  --text:#0F2330; --text-2:#4A5D67; --accent:#8A6A2E; --on-accent:#fff;
  --shadow:0 18px 50px rgba(8,22,32,.24);
  --display:'Forum','Cormorant Garamond',Georgia,'Times New Roman',serif;
  --ui:'Jost','Avenir Next','Segoe UI',system-ui,sans-serif;
  color-scheme:light dark; box-sizing:border-box;
}
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]){
  --glass:rgba(13,30,42,.62); --glass-strong:rgba(13,30,42,.94); --glass-line:rgba(226,199,146,.2);
  --text:#EEF2F1; --text-2:#A9BAC1; --accent:#E2C792; --on-accent:#0F2330; color-scheme:dark; }}
:root[data-theme="dark"]{ --glass:rgba(13,30,42,.62); --glass-strong:rgba(13,30,42,.94); --glass-line:rgba(226,199,146,.2); --text:#EEF2F1; --text-2:#A9BAC1; --accent:#E2C792; --on-accent:#0F2330; color-scheme:dark; }
*,*::before,*::after{box-sizing:inherit}
html,body{height:100%;margin:0;background:#0F2330;color:var(--text);font-family:var(--ui);font-size:15px;line-height:1.45;overflow:hidden;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--champagne);outline-offset:2px}
.glass{background:var(--glass);backdrop-filter:blur(18px) saturate(1.35);-webkit-backdrop-filter:blur(18px) saturate(1.35);border:1px solid var(--glass-line);box-shadow:var(--shadow)}
.glass-strong{background:var(--glass-strong);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);border:1px solid var(--glass-line);box-shadow:var(--shadow)}

/* ---------- fullscreen photo stage */
#viewport{position:fixed;inset:0;width:100vw;height:100vh;height:100dvh;overflow:hidden;touch-action:none;cursor:grab;background:#0F2330;perspective:1800px}
#viewport.dragging{cursor:grabbing}
#tilt{position:absolute;inset:0;transform-style:preserve-3d;transform-origin:50% 50%}
#world{position:absolute;left:0;top:0;transform-origin:0 0;will-change:transform}
#render{display:block;width:100%;height:100%;user-select:none;-webkit-user-drag:none;pointer-events:none;transition:opacity .35s, filter .6s}
#render.swap{opacity:0}
#grade{position:absolute;inset:0;pointer-events:none;transition:background .6s}
#glitter{position:absolute;width:34%;height:16%;transform:translate(-50%,-50%);pointer-events:none;mix-blend-mode:screen;opacity:0;transition:opacity .6s,left .6s,top .6s;
  background:radial-gradient(ellipse at center,rgba(255,244,214,.75) 0%,rgba(255,214,150,.35) 30%,rgba(255,200,120,0) 70%);filter:blur(6px)}
#overlay{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
#pins{position:absolute;inset:0;pointer-events:none}
body.mode3d #viewport{visibility:hidden}
#stage3d{position:fixed;inset:0;display:none;background:#0F2330}
body.mode3d #stage3d{display:block}
#stage3d canvas{display:block;touch-action:none}
#load3d{display:none;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);color:#E2C792;font-family:var(--display);font-size:24px}
#stage3d.loading #load3d{display:block}

/* ---------- shapes */
.pgrp .glow{fill:url(#veil);opacity:.42;transition:opacity .3s;pointer-events:none}
.pgrp .rim{fill:none;stroke:#F6E3B8;stroke-opacity:.45;stroke-width:calc(1.1px * var(--inv,1));pointer-events:none;transition:stroke-opacity .3s}
.pgrp .mask{fill:#fff;fill-opacity:0;stroke:none;cursor:pointer;pointer-events:all}
.pgrp:hover .glow{opacity:.95}
.pgrp:hover .rim{stroke-opacity:1}
.pgrp.dim .glow{opacity:.14}
.pgrp.dim .rim{stroke-opacity:.18}
.pgrp.dim:hover .glow{opacity:.5}
.pgrp.focus .glow.soft{opacity:.2}
.pgrp.focus .bgrp:hover .glow.soft{opacity:.5}
.pgrp.focus .rim{stroke-opacity:.75}
.bld{fill:#fff;fill-opacity:.02;stroke:none}
.bld.click{cursor:pointer;pointer-events:all}
.bld.click:hover{fill:var(--champagne);fill-opacity:.35}
.bld.match{fill:url(#veilC);fill-opacity:1}
.band{fill:#F3D08A;fill-opacity:0;stroke:none;cursor:pointer;pointer-events:all;transition:fill-opacity .12s}
.band:hover{fill-opacity:.62}
.band.match{fill:#7FD3DC;fill-opacity:.34}
.band.match:hover{fill:#F3D08A;fill-opacity:.7}
.band.nores{cursor:help}
.band.nores:hover{fill:#000;fill-opacity:.28}
.band.sel,.band.sel:hover{fill:#1FA9BB;fill-opacity:.82}
.bandline{fill:none;stroke:#fff;stroke-opacity:0;stroke-width:calc(.7px * var(--inv,1));pointer-events:none;transition:stroke-opacity .2s}
.bgrp:hover .bandline{stroke-opacity:.42}
.villa{fill:url(#veil);fill-opacity:1;stroke:#F6E3B8;stroke-opacity:.7;stroke-width:calc(1px * var(--inv,1));cursor:pointer;pointer-events:all}
.villa.available.match{fill:url(#veilC)}
.villa.reserved{fill:var(--reserved);fill-opacity:.35}
.villa.sold{fill:#2a2a2a;fill-opacity:.35;stroke-opacity:.3}
.villa.nomatch{fill-opacity:.08;stroke-opacity:.3}
.villa:hover{fill:#F3D08A;fill-opacity:.7}
.villa.sel{fill:#1FA9BB;fill-opacity:.85}

/* ---------- pins */
.pin{position:absolute;transform:translate(-50%,-100%) scale(var(--inv,1));transform-origin:50% 100%}
.pin-proj{pointer-events:auto;cursor:pointer;display:flex;flex-direction:column;align-items:center}
.pin-proj .tag{background:var(--glass);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);border:1px solid var(--glass-line);padding:7px 14px 8px;border-radius:2px;white-space:nowrap;font-family:var(--display);font-size:18px;letter-spacing:.02em;box-shadow:var(--shadow)}
.pin-proj .tag small{display:block;font-family:var(--ui);font-size:11.5px;color:var(--text-2);letter-spacing:0}
.pin-proj .cnt{color:var(--accent)}
.pin-proj .stem{width:1px;height:30px;background:linear-gradient(#F3E4C2,rgba(243,228,194,0))}
.pin-poi{pointer-events:auto;cursor:help;display:flex;align-items:center;gap:6px;transform:translate(-11px,-50%) scale(var(--inv,1));transform-origin:11px 50%;color:#fff;font-size:12px;text-shadow:0 1px 6px rgba(0,0,0,.75);white-space:nowrap}
.pin-poi i{font-style:normal;width:22px;height:22px;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(255,255,255,.7);background:rgba(15,35,48,.55);backdrop-filter:blur(6px);font-size:11px}
.pin-bld{color:#fff;font-size:12.5px;font-weight:500;white-space:nowrap;text-shadow:0 1px 8px rgba(0,0,0,.85);transform:translate(-50%,-140%) scale(var(--inv,1))}
.dimpins .pin-poi span{opacity:.6}

/* 3D labels */
.labels3d{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.l3d{position:absolute;left:0;top:0;white-space:nowrap;will-change:transform}
.l3d.proj{pointer-events:auto;cursor:pointer;margin:-58px 0 0 0;translate:-50% 0;background:var(--glass);backdrop-filter:blur(12px);border:1px solid var(--glass-line);padding:6px 12px;border-radius:2px;box-shadow:var(--shadow);text-align:center}
.l3d.proj b{display:block;font-family:var(--display);font-weight:400;font-size:17px}
.l3d.proj small{font-size:11.5px;color:var(--accent)}
.l3d.poi{color:#fff;font-size:12px;text-shadow:0 1px 6px rgba(0,0,0,.8);display:flex;gap:6px;align-items:center;translate:-6px -50%}
.l3d.poi i{width:9px;height:9px;border-radius:50%;border:1.5px solid #fff;background:rgba(15,35,48,.6)}

/* ---------- chrome */
header{position:fixed;top:calc(env(safe-area-inset-top,0px) + 14px);left:16px;right:16px;display:flex;align-items:flex-start;gap:12px;pointer-events:none;z-index:20}
header>*{pointer-events:auto}
.brand{padding:9px 16px 10px;border-radius:2px}
.brand b{display:block;font-family:var(--display);font-weight:400;font-size:24px;line-height:1;letter-spacing:.04em}
.brand span{font-size:11.5px;color:var(--text-2);white-space:nowrap}
#dock{margin:0 auto;display:flex;padding:4px;border-radius:999px;gap:2px;max-width:100%;overflow-x:auto;scrollbar-width:none}
#dock::-webkit-scrollbar{display:none}
#dock button{border:0;background:transparent;padding:9px 16px;border-radius:999px;white-space:nowrap;font-size:13.5px;color:var(--text-2)}
#dock button:hover{color:var(--text)}
#dock button[aria-pressed="true"]{background:var(--accent);color:var(--on-accent)}
.hdr-r{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.chip-btn{border:1px solid var(--glass-line);background:var(--glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-radius:999px;padding:8px 13px;font-size:13px;display:flex;align-items:center;gap:7px;white-space:nowrap}
.chip-btn .n{background:var(--accent);color:var(--on-accent);border-radius:999px;min-width:20px;height:20px;display:inline-grid;place-items:center;font-size:11.5px;padding:0 6px}
#clock b{font-variant-numeric:tabular-nums;font-weight:500}
#clock .ic{color:#E2B04A}
#clock .live{font-size:10.5px;padding:1px 6px;border-radius:999px;background:#59C08A;color:#fff}
.langs{padding:3px}
.langs button{border:0;background:none;padding:4px 8px;border-radius:999px;font-size:12px;color:var(--text-2)}
.langs button[aria-pressed="true"]{background:var(--accent);color:var(--on-accent)}
.demo-chip{font-size:12px;color:var(--text-2)}
.demo-chip::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--reserved)}
.demo-chip.live::before{background:#59C08A}
#timepanel{position:fixed;top:calc(env(safe-area-inset-top,0px) + 66px);right:16px;width:360px;max-width:calc(100% - 32px);padding:14px 16px;border-radius:3px;z-index:30;display:none}
#timepanel.on{display:block}
#timepanel .th{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px}
#timepanel .th b{font-family:var(--display);font-weight:400;font-size:20px}
#timepanel .th span{font-variant-numeric:tabular-nums;font-size:20px}
#tslider{width:100%;accent-color:var(--champagne-d)}
.ticks{display:flex;justify-content:space-between;font-size:10.5px;color:var(--text-2);margin:-2px 2px 10px}
#timepanel .chips button small{color:var(--text-2);margin-left:3px}
#timepanel .chips button[aria-pressed="true"] small{color:inherit}

/* filters */
#filters{position:fixed;left:16px;top:var(--panel-top,calc(env(safe-area-inset-top,0px) + 96px));width:296px;max-height:calc(100% - var(--panel-top,96px) - 120px);overflow:auto;border-radius:3px;padding:16px 16px 14px;z-index:15;transition:transform .35s ease,opacity .35s}
#filters.closed{transform:translateX(-120%);opacity:0;pointer-events:none}
#filters h3{font-family:var(--display);font-weight:400;font-size:21px;margin:0 0 2px}
.scope{font-size:12.5px;color:var(--text-2);margin-bottom:6px}
.fgroup{margin:12px 0 0}
.fgroup.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.fgroup label,.fgroup .lbl{display:block;font-size:12.5px;color:var(--text-2);margin-bottom:6px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chips button{border:1px solid var(--glass-line);background:transparent;border-radius:999px;padding:5px 11px;font-size:12.5px}
.chips button[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.range{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.range input{width:100%;border:1px solid var(--glass-line);background:transparent;border-radius:3px;padding:6px 7px;font-size:13px}
.toggle{display:flex;align-items:center;gap:8px;font-size:13px;margin:10px 0 0;cursor:pointer}
.toggle input{accent-color:var(--champagne-d);width:16px;height:16px}
.results{margin-top:14px;border-top:1px solid var(--glass-line);padding-top:12px}
.results .total{font-family:var(--display);font-size:23px}
.prow{display:grid;grid-template-columns:1fr auto;gap:2px 8px;align-items:center;padding:6px 0;border:0;background:none;width:100%;text-align:left;font-size:12.5px}
.prow .bar,.li .bar{grid-column:1/-1;height:3px;background:var(--glass-line);border-radius:2px;overflow:hidden}
.prow .bar i,.li .bar i{display:block;height:100%;background:var(--lagoon)}
.prow:hover{color:var(--accent)}
.seg{display:flex;border:1px solid var(--glass-line);border-radius:999px;padding:3px;margin:10px 0 8px}
.seg button{flex:1;border:0;background:none;padding:6px 4px;border-radius:999px;font-size:12.5px}
.seg button:hover{background:rgba(226,199,146,.18)}
.btn{border:1px solid var(--accent);background:var(--accent);color:var(--on-accent);border-radius:2px;padding:9px 14px;font-size:13px;letter-spacing:.02em}
.btn.ghost{background:transparent;color:var(--text);border-color:var(--glass-line)}
.btn.ghost:hover{border-color:var(--champagne)}
.btn.wide{width:100%}
.btn[disabled]{opacity:.4;cursor:not-allowed}

/* cameras */
#cams{position:fixed;left:16px;bottom:calc(env(safe-area-inset-bottom,0px) + 16px);display:flex;gap:6px;z-index:15;padding:6px;border-radius:3px}
#cams button{border:1px solid transparent;padding:0;background:none;width:96px;text-align:left;border-radius:2px;overflow:hidden}
#cams button img{display:block;width:96px;height:58px;object-fit:cover;opacity:.78}
#cams button span{display:block;font-size:11.5px;padding:4px 4px 2px;color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#cams button[aria-pressed="true"]{border-color:var(--champagne)}
#cams button[aria-pressed="true"] img,#cams button:hover img{opacity:1}
#cams button[disabled]{opacity:.3;cursor:not-allowed}
#cams .b3d{display:flex;flex-direction:column;justify-content:center;align-items:center;background:linear-gradient(160deg,#173647,#0F2330);color:#E2C792}
#cams .b3d .ico{font-size:26px;line-height:58px;height:58px;padding:0;color:#E2C792}
#cams .b3d span:last-child{color:#E2C792;text-align:center;width:100%}
#crumbs{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(env(safe-area-inset-bottom,0px) + 18px);z-index:14;padding:8px 14px;border-radius:999px;font-size:12.5px;display:flex;gap:6px;align-items:center;white-space:nowrap;max-width:calc(100% - 560px);overflow:hidden}
#crumbs button{border:0;background:none;padding:0;color:var(--text-2)}
#crumbs button:hover{color:var(--accent)}
#crumbs .cur{color:var(--text)}
#crumbs .sep{opacity:.4}
#zoomctl{position:fixed;right:16px;bottom:calc(env(safe-area-inset-bottom,0px) + 16px);display:flex;z-index:14;border-radius:3px;overflow:hidden}
#zoomctl button{border:0;background:transparent;width:38px;height:38px;font-size:18px}
#zoomctl button+button{border-left:1px solid var(--glass-line)}
body.mode3d #zin,body.mode3d #zout{display:none}

/* tooltip */
#tip{position:fixed;z-index:40;pointer-events:none;min-width:200px;max-width:310px;padding:12px 14px;border-radius:3px;opacity:0;transform:translateY(6px);transition:opacity .15s,transform .15s}
#tip.on{opacity:1;transform:none}
#tip h4{font-family:var(--display);font-weight:400;font-size:19px;margin:0 0 2px;line-height:1.15}
#tip h4 .dot{color:var(--champagne-d)}
#tip .sub{font-size:12px;color:var(--text-2);margin-bottom:8px}
#tip dl{display:grid;grid-template-columns:auto 1fr;gap:3px 12px;margin:0;font-size:12.5px}
#tip dt{color:var(--text-2)}
#tip dd{margin:0;text-align:right}
#tip .go{margin-top:8px;font-size:11.5px;color:var(--accent)}

/* drawer */
#drawer{position:fixed;top:var(--panel-top,calc(env(safe-area-inset-top,0px) + 96px));right:16px;bottom:calc(env(safe-area-inset-bottom,0px) + 70px);width:430px;max-width:calc(100% - 32px);border-radius:3px;z-index:16;display:flex;flex-direction:column;transform:translateX(calc(100% + 30px));transition:transform .45s cubic-bezier(.22,.8,.18,1)}
#drawer.open{transform:none}
.dh{display:flex;align-items:flex-start;gap:10px;padding:16px 16px 10px;border-bottom:1px solid var(--glass-line)}
.dh h2{font-family:var(--display);font-weight:400;font-size:27px;line-height:1.05;margin:0}
.dh p{margin:3px 0 0;font-size:12.5px;color:var(--text-2)}
.dh .x{margin-left:auto;border:0;background:none;font-size:22px;line-height:1;padding:2px 6px;color:var(--text-2)}
.dh .back{border:0;background:none;padding:2px 4px;font-size:20px;color:var(--text-2)}
.db{overflow:auto;padding:14px 16px 18px;flex:1}
.row1{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.price{font-family:var(--display);font-weight:400;font-size:23px}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:10px}
.stats div{border-left:1px solid var(--glass-line);padding-left:10px}
.stats b{display:block;font-family:var(--display);font-weight:400;font-size:21px;line-height:1.1}
.stats span{font-size:11.5px;color:var(--text-2)}
.list{display:flex;flex-direction:column}
.li{display:grid;grid-template-columns:1fr auto;gap:2px 10px;align-items:center;padding:10px 2px;border:0;border-bottom:1px solid var(--glass-line);background:none;text-align:left;width:100%}
.li:hover{background:rgba(226,199,146,.08)}
.li .t{font-size:14px}
.li .m{font-size:12px;color:var(--text-2)}
.li .r{text-align:right;font-size:12.5px}
.li .bar{margin-top:4px}
.li.dim{opacity:.45}
.sec{font-size:12.5px;color:var(--text-2);margin:16px 0 6px}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:8px}
.tile{border:1px solid var(--glass-line);background:transparent;border-radius:2px;padding:9px 10px;text-align:left;position:relative}
.tile b{display:block;font-weight:500;font-size:13px}
.tile span{display:block;font-size:12px;color:var(--text-2)}
.tile::after{content:"";position:absolute;right:8px;top:10px;width:7px;height:7px;border-radius:50%}
.tile.available::after{background:var(--lagoon)}
.tile.reserved::after{background:var(--reserved)}
.tile.sold::after{background:var(--sold)}
.tile.nomatch{opacity:.4}
.tile:hover{border-color:var(--champagne)}
.status{display:inline-flex;align-items:center;gap:6px;font-size:12.5px}
.status::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--sold)}
.status.available::before{background:var(--lagoon)}
.status.reserved::before{background:var(--reserved)}
.tabs{display:flex;gap:4px;margin-bottom:10px;flex-wrap:wrap}
.tabs button{border:1px solid var(--glass-line);background:none;border-radius:999px;padding:5px 12px;font-size:12.5px}
.tabs button[aria-pressed="true"]{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
.plan{display:block;width:100%;aspect-ratio:4/3;border:1px solid var(--glass-line);border-radius:2px;background:rgba(255,255,255,.04);object-fit:contain}
.plan.pdf{aspect-ratio:3/4}
.plan text{font-family:var(--ui);fill:var(--text);font-size:11px}
.plan .rm{fill:none;stroke:var(--text);stroke-opacity:.55;stroke-width:1.2}
.plan .rm.terr{stroke-dasharray:4 3;fill:var(--lagoon);fill-opacity:.12}
.plan .wall{fill:none;stroke:var(--text);stroke-width:3}
.plan .fur{fill:none;stroke:var(--accent);stroke-width:1.1}
.plan .fur.pool{fill:var(--lagoon);fill-opacity:.35;stroke:var(--lagoon)}
.plan .fur.plant{fill:#6d8549;fill-opacity:.35;stroke:#6d8549}
.note{font-size:12px;color:var(--text-2);margin:6px 0 0}
.facts{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px;margin:14px 0}
.facts div span{display:block;font-size:11.5px;color:var(--text-2)}
.facts div b{font-weight:500;font-size:14px}
.facts .full{grid-column:1/-1}
table.expl{width:100%;border-collapse:collapse;font-size:12.5px}
table.expl td{padding:5px 0;border-bottom:1px solid var(--glass-line)}
table.expl td:last-child{text-align:right;color:var(--text-2)}
.sunchart{width:100%;display:block}
.sunchart rect{fill:var(--glass-line)}
.sunchart rect.on{fill:#E2B04A}
.sunchart .now{stroke:var(--accent);stroke-width:1.5;stroke-dasharray:3 2}
.sunchart text{font-size:9px;fill:var(--text-2);font-family:var(--ui)}
.duo{display:grid;grid-template-columns:124px 1fr;gap:12px;margin-top:14px;align-items:start}
.compass text{font-family:var(--ui);fill:var(--text);font-size:10px}
.facade{width:100%;max-height:130px;display:block}
.facade rect{fill:var(--glass-line)}
.facade rect.res{fill:var(--lagoon);fill-opacity:.35}
.facade rect.cur{fill:#1FA9BB}
.minimap{position:relative;border:1px solid var(--glass-line);border-radius:2px;overflow:hidden;margin-top:12px}
.duo .minimap{margin-top:0}
.minimap img{display:block;width:100%}
.minimap i{position:absolute;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--champagne);box-shadow:0 0 0 4px rgba(226,199,146,.35),0 0 0 10px rgba(226,199,146,.15)}
.actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}

/* modal */
.modal{position:fixed;inset:0;z-index:50;display:none;place-items:center;background:rgba(8,20,28,.45);padding:16px}
.modal.on{display:grid}
.modal .card{width:min(760px,100%);max-height:calc(100% - 32px);overflow:auto;border-radius:3px;padding:18px 20px}
.modal .card.wide{width:min(1080px,100%)}
.modal h2{font-family:var(--display);font-weight:400;font-size:27px;margin:0 0 4px}
.modal .row{display:flex;align-items:center;gap:10px}
.modal .row .x{margin-left:auto;border:0;background:none;font-size:22px;color:var(--text-2)}
.legend{display:flex;gap:16px;margin:4px 0 10px}
.chess-wrap{display:flex;flex-wrap:wrap;gap:22px}
.chess h4{font-family:var(--display);font-weight:400;font-size:18px;margin:0 0 6px}
.chess h4 span{color:var(--text-2);font-family:var(--ui);font-size:13px}
.chess table{border-collapse:separate;border-spacing:3px}
.chess th{font-weight:400;font-size:11px;color:var(--text-2);text-align:right;padding-right:4px}
.chess .c{width:30px;height:24px;border:0;border-radius:2px;font-size:11px;color:#0F2330;background:var(--sold)}
.chess .c.available{background:var(--lagoon)}
.chess .c.reserved{background:var(--reserved)}
.chess .c.nomatch{opacity:.3}
.chess .c:hover{outline:2px solid var(--accent)}
.chess .vrow{display:flex;flex-wrap:wrap;gap:3px;max-width:360px}
.chess .vrow .c{width:40px}
.cmp-wrap{overflow-x:auto;margin-top:10px}
table.cmp{border-collapse:collapse;font-size:13px;min-width:520px;width:100%}
table.cmp th,table.cmp td{padding:7px 10px;border-bottom:1px solid var(--glass-line);text-align:left;vertical-align:top}
table.cmp th{font-weight:400;color:var(--text-2);width:140px}
.fav-li{display:grid;grid-template-columns:auto 1fr auto auto;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--glass-line);font-size:13px}
.fav-li .m{color:var(--text-2)}
.fav-li button{border:0;background:none;color:var(--text-2);font-size:18px}
form.lead{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
form.lead label{font-size:12px;color:var(--text-2);display:flex;flex-direction:column;gap:4px}
form.lead .full{grid-column:1/-1}
form.lead input,form.lead select,form.lead textarea{border:1px solid var(--glass-line);background:transparent;border-radius:3px;padding:8px 10px;font-size:14px;color:var(--text)}
form.lead .chk{flex-direction:row;align-items:flex-start;gap:8px;font-size:12.5px}
pre.payload{font-size:11.5px;background:rgba(0,0,0,.12);padding:10px;border-radius:3px;overflow:auto;max-height:260px;white-space:pre-wrap}
.sp-bar,.sp-manual{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end;margin:10px 0}
.sp-bar label{display:flex;flex-direction:column;font-size:12px;color:var(--text-2);gap:4px}
.sp-bar select,.sp-bar input,.sp-manual input{border:1px solid var(--glass-line);background:transparent;border-radius:3px;padding:7px 9px;min-width:240px;color:var(--text)}
.sp-manual input{flex:1}
.sp-list{max-height:300px;overflow:auto}
.sp-li{display:grid;grid-template-columns:42px 1fr auto;gap:10px;align-items:center;padding:6px 0;border-bottom:1px solid var(--glass-line);font-size:13px}
.sp-li .ic{font-size:10.5px;color:var(--accent);border:1px solid var(--glass-line);border-radius:2px;text-align:center;padding:3px 0}
.sp-li small{display:block;color:var(--text-2);font-size:11.5px}

/* dev */
#dev{position:fixed;left:16px;right:16px;bottom:calc(env(safe-area-inset-bottom,0px) + 92px);z-index:30;border-radius:3px;padding:10px 12px;display:none;font-size:12.5px}
body.dev #dev{display:block}
body.dev #viewport{cursor:crosshair}
body.dev .pin,body.dev #tip,body.dev #filters,body.dev #drawer,body.dev #crumbs{display:none}
#dev .r1{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
#dev .r1+.r1{margin-top:8px;padding-top:8px;border-top:1px solid var(--glass-line)}
#dev select,#dev .num{border:1px solid var(--glass-line);background:transparent;border-radius:3px;padding:6px 8px;color:var(--text)}
#dev select{min-width:250px}
#dev .num{width:58px}
#dev .tens{display:flex;align-items:center;gap:6px}
#dev .btn{padding:6px 10px;font-size:12.5px}
#dev .hint{margin-top:6px;color:var(--text-2)}
#dev .xy{font-variant-numeric:tabular-nums;margin-left:auto;color:var(--accent)}
.dshape{fill:#fff;fill-opacity:.05;stroke:#FFE08A;stroke-opacity:.95;stroke-width:calc(1.6px * var(--inv,1));cursor:pointer}
.dshape.line{fill:none;stroke-dasharray:calc(6px * var(--inv,1)) calc(4px * var(--inv,1))}
.dshape.on{stroke:#FF5C5C;stroke-width:calc(2.2px * var(--inv,1));fill-opacity:.12}
.dctrl{fill:none;stroke:#FF5C5C;stroke-opacity:.45;stroke-width:calc(1px * var(--inv,1));stroke-dasharray:calc(3px * var(--inv,1));pointer-events:none}
.dvert{fill:#fff;stroke:#FF5C5C;stroke-width:calc(2px * var(--inv,1));cursor:move}
.dpt{fill:#FFE08A;stroke:#0F2330;stroke-width:calc(1px * var(--inv,1));cursor:pointer}
.dpt.on{fill:#FF5C5C}
.dslice{fill:none;stroke:#7CFFB2;stroke-opacity:.8;stroke-width:calc(1px * var(--inv,1));pointer-events:none}
.ddraft{fill:none;stroke:#7CFFB2;stroke-width:calc(2px * var(--inv,1));stroke-dasharray:calc(6px * var(--inv,1)) calc(4px * var(--inv,1));pointer-events:none}

#toast{position:fixed;left:50%;top:calc(env(safe-area-inset-top,0px) + 80px);transform:translate(-50%,-10px);z-index:60;padding:10px 16px;border-radius:3px;font-size:13px;opacity:0;transition:.25s;pointer-events:none;max-width:min(640px,calc(100% - 32px));text-align:center}
#toast.on{opacity:1;transform:translate(-50%,0)}
#fbtn{display:none}

@media (max-width:1100px){ .langs{display:none} #crumbs{display:none} }
@media (max-width:860px){
  header{flex-wrap:wrap}
  .brand b{font-size:20px}
  #dock{order:3;flex:1 1 100%;margin:0}
  #fbtn{display:flex}
  .demo-chip{display:none}
  #filters{top:auto;bottom:calc(env(safe-area-inset-bottom,0px) + 92px);left:12px;right:12px;width:auto;max-height:58%}
  #filters.closed{transform:translateY(120%)}
  #drawer{top:auto;left:0;right:0;bottom:0;width:auto;max-width:none;height:74%;border-radius:12px 12px 0 0;transform:translateY(105%);padding-bottom:env(safe-area-inset-bottom,0px)}
  #drawer.open{transform:none}
  #cams button{width:66px}#cams button img{width:66px;height:42px}
  #cams .b3d .ico{line-height:42px;height:42px}
  .duo{grid-template-columns:100px 1fr}
  #zoomctl{display:none}
  #timepanel{left:12px;right:12px;width:auto}
}
@media (prefers-reduced-motion:reduce){ #drawer,#filters,#render,#grade,#glitter{transition:none} }

/* v3: St. Regis twin, dollhouse, sound */
.chip-btn.icon{width:36px;justify-content:center;padding:8px 0}
#sound[aria-pressed="true"]{background:var(--accent);color:var(--on-accent)}
#srframe{position:fixed;inset:0;z-index:70;display:none;background:#0F2330}
#srframe.on{display:block}
#srframe iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.srbar{position:absolute;z-index:2;left:50%;top:calc(env(safe-area-inset-top,0px) + 10px);transform:translateX(-50%);display:flex;gap:10px;align-items:center;padding:6px 8px;border-radius:999px;font-size:13px;white-space:nowrap}
.srbar b{font-family:var(--display);font-weight:400;font-size:16px;padding:0 6px}
.srbar .btn{padding:6px 12px;border-radius:999px;text-decoration:none}
body.srmode header,body.srmode #filters,body.srmode #drawer,body.srmode #cams,body.srmode #crumbs,body.srmode #zoomctl{visibility:hidden}
#dollhouse{position:fixed;inset:0;z-index:65;display:none;background:#e9eef0}
#dollhouse.on{display:block}
#dh-stage{position:absolute;inset:0}
.dhbar{position:absolute;z-index:3;left:16px;right:16px;top:calc(env(safe-area-inset-top,0px) + 12px);display:flex;gap:10px;align-items:center;padding:8px 10px;border-radius:3px;flex-wrap:wrap}
.dhbar>div:first-child{margin-right:auto}
.dhbar b{font-family:var(--display);font-weight:400;font-size:22px;display:block;line-height:1.1}
.dhbar span{font-size:12px;color:var(--text-2)}
.dhbar .seg{margin:0;min-width:320px}
.p3d-labels{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:2}
.p3d-mk{position:absolute;left:0;top:0;pointer-events:auto;translate:-50% -50%;display:flex;align-items:center;gap:6px;border:0;background:rgba(15,35,48,.82);color:#fff;border-radius:999px;padding:3px 10px 3px 3px;font-size:12px;white-space:nowrap;cursor:pointer}
.p3d-mk b{width:22px;height:22px;border-radius:50%;background:#8A6A2E;display:grid;place-items:center;font-weight:500}
.p3d-mk.on{background:#8A6A2E}
.p3d-mk span{max-width:180px;overflow:hidden;text-overflow:ellipsis}
.imglink{display:block}
.plan.sheet{aspect-ratio:auto;background:#fff}
img.plan{aspect-ratio:auto;background:#fff}
.mk{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#8A6A2E;color:#fff;font-style:normal;font-size:10.5px;margin-right:6px}
.note.src{padding:7px 9px;border-radius:3px;background:rgba(127,211,220,.12)}
.note.src.demo{background:rgba(217,168,119,.16)}
.copyurl{width:100%;padding:8px;border:1px solid var(--glass-line);border-radius:3px;background:transparent;color:var(--text);margin-top:10px}
#fx,#birds{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
#fx{opacity:0;transition:opacity .5s, filter .6s}
#fx.on{opacity:1}

#zq{display:none;font-size:11px}
body.mode3d #zq{display:block}
#zq[aria-pressed="true"]{background:var(--accent);color:var(--on-accent)}

/* R11: анти-коллизия и непрозрачные панели */
.pin.cull,.l3d.cull{visibility:hidden}
.pin,.l3d{transition:margin .25s ease}
#drawer{background:var(--glass-strong);backdrop-filter:blur(20px) saturate(1.2);-webkit-backdrop-filter:blur(20px) saturate(1.2);z-index:25}
#filters{z-index:24}
header{z-index:30}

.fplate{position:relative;border:1px solid var(--glass-line);border-radius:2px;background:#fff;overflow:hidden}
.fplate img{display:block;width:100%}
.fpu{position:absolute;translate:-50% -50%;min-width:26px;height:26px;border-radius:13px;border:2px solid #fff;background:var(--sold);color:#0F2330;font-size:11px;font-weight:600;box-shadow:0 2px 8px rgba(0,0,0,.25);cursor:pointer;padding:0 5px}
.fpu.available{background:var(--lagoon)}.fpu.reserved{background:var(--reserved)}.fpu.nomatch{opacity:.35}
.fpu:hover,.fpu.sel{background:#1FA9BB;color:#fff;transform:scale(1.15)}
svg.fplate polygon.fpu,svg.fp-arch polygon.fpu{stroke:#0F2330;stroke-width:1.5;fill:var(--sold);fill-opacity:.45;cursor:pointer;transform:none}
svg polygon.fpu.available{fill:var(--lagoon)} svg polygon.fpu.reserved{fill:var(--reserved)} svg polygon.fpu.nomatch{fill-opacity:.12}
svg polygon.fpu:hover,svg polygon.fpu.sel{fill:#1FA9BB;fill-opacity:.8}
svg.fplate text,svg.fp-arch text{font-family:var(--ui);font-size:12px;fill:#0F2330;pointer-events:none}
.fp-arch{aspect-ratio:auto;background:#fbfaf7}
.fp-arch .core{fill:#d9d2c4;stroke:#0F2330;stroke-width:1.2}.fp-arch .corr{fill:none;stroke:#0F2330;stroke-dasharray:4 3;stroke-width:1}
.fp-arch .slabline{fill:none;stroke:#0F2330;stroke-width:3}.fp-arch .vw{stroke:#8A6A2E;stroke-width:1.5;marker-end:none}
.fp-arch .ct{font-size:10px;fill:#5B6B73}

#tourframe{position:fixed;inset:0;z-index:72;display:none;background:#0F2330}
#tourframe.on{display:block}
#tourframe iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
#tourframe .srbar{left:16px;transform:none;top:auto;bottom:calc(env(safe-area-inset-bottom,0px) + 80px)}
.tourgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}

.is-night .pgrp .glow{opacity:.06}.is-night .pgrp .rim{stroke-opacity:.12}.is-night .pgrp:hover .glow{opacity:.35}
svg .fpu,svg .fpu:hover,svg .fpu.sel{translate:none;transform:none;box-shadow:none;min-width:0;height:auto;padding:0;border-radius:0}

.dwgplate{width:100%;display:block;background:#fbfaf7;border:1px solid var(--glass-line);border-radius:2px}
.dwgplate .rm{fill:#fff;stroke:#9a9286;stroke-width:.06}
.dwgplate .terr{fill:#e9f3f1;stroke:#7FB8BE;stroke-width:.08;stroke-dasharray:.4 .3}
.dwgplate polygon.fpu{fill:var(--sold);fill-opacity:.12;stroke:#0F2330;stroke-width:.18;cursor:pointer;transition:fill .15s,fill-opacity .15s}
.dwgplate polygon.fpu.available{fill:var(--lagoon);fill-opacity:.16}
.dwgplate polygon.fpu.nomatch{fill-opacity:.03;stroke-opacity:.4}
.dwgplate polygon.fpu:hover,.dwgplate polygon.fpu.sel{fill:rgb(212,175,55);fill-opacity:.35;stroke:#8A6A2E;stroke-width:.3}
.dwgplate .lb{font:600 1.6px var(--ui);fill:#0F2330;pointer-events:none}

/* R12.1 — панель облёта 360° и ракурсов 3D (только в режиме 3D-модели) */
#orbitbar{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(env(safe-area-inset-bottom,0px) + 64px);z-index:16;display:none;gap:6px;align-items:center;padding:6px;border-radius:999px;max-width:calc(100vw - 24px);flex-wrap:wrap;justify-content:center;width:max-content}
#orbitbar select{max-width:190px}
body.mode3d #orbitbar{display:flex}
#orbitbar button,#orbitbar select{font:500 12.5px/1 Jost,system-ui,sans-serif;color:var(--text);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:8px 12px;min-height:34px}
#orbitbar button:hover,#orbitbar select:hover{border-color:var(--champagne)}
#orbitbar .ob-play[aria-pressed="true"]{background:var(--champagne);color:#14202a;border-color:transparent}
#orbitbar :focus-visible{outline:2px solid var(--champagne);outline-offset:2px}
#orbitbar .ob-sel{display:inline-flex}
#orbitbar select option{color:#14202a}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (max-width:700px){#orbitbar .ob-focus{max-width:120px}#orbitbar .ob-shot{max-width:130px}}
@media (prefers-reduced-motion:reduce){#orbitbar .ob-play{display:none}}
/* облёт: кинематографичный кадр без конкурирующих панелей; ручной ввод/пауза возвращают интерфейс */
body.cinema #filters,body.cinema #drawer,body.cinema #cams,body.cinema #crumbs,body.cinema #tip{opacity:0;pointer-events:none;transition:opacity .35s ease}
body.cinema #stage3d .l3d.poi{opacity:0}
#filters,#drawer,#cams,#crumbs{transition:opacity .35s ease}
@media (prefers-reduced-motion:reduce){#filters,#drawer,#cams,#crumbs{transition:none}}
#vol{display:none;width:84px;accent-color:var(--champagne)}
#sound[aria-pressed="true"] + #vol{display:inline-block}
@media (max-width:700px){#sound[aria-pressed="true"] + #vol{width:64px}}
/* полоса фото-ракурсов внизу слева: на средних ширинах и в горизонтальной ориентации телефона панель облёта — над ней */
body.mode3d #orbitbar{bottom:calc(env(safe-area-inset-bottom,0px) + 120px)}   /* всегда над полосой фото-ракурсов */
@media (max-height:520px){#orbitbar button,#orbitbar select{min-height:32px;padding:6px 10px}}