@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#203e3b;background:#eef1ed;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #18a799;outline-offset:3px}header{height:88px;background:#fbfcf9;display:flex;align-items:center;justify-content:space-between;padding:0 44px;border-bottom:1px solid #dce3de;position:relative;z-index:3}.brand{text-decoration:none;color:inherit;display:flex;gap:14px;align-items:center;font:700 22px Manrope,sans-serif;letter-spacing:5px}.mark{font:42px Georgia;color:#448c7f;letter-spacing:0}.brand small{display:block;font:9px 'DM Sans',sans-serif;letter-spacing:2px;margin-top:5px}.header-right{display:flex;gap:24px;align-items:center}.demo{font-size:11px;color:#64817a}.avatar{border:1px solid #cad8cf;border-radius:50%;padding:12px;font-size:12px}main{position:relative;height:calc(100dvh - 88px);min-height:680px;overflow:hidden}.intro{position:absolute;left:44px;top:34px;z-index:2;pointer-events:none}.eyebrow{font-size:10px;font-weight:700;letter-spacing:1.7px;color:#71877f}h1{font:500 34px Manrope,sans-serif;letter-spacing:-1.5px;margin:12px 0 8px}h1 em{font-family:Georgia,serif;font-weight:400;color:#658a7f}p{font-size:13px;color:#7c8d85}.explorer{position:absolute;left:44px;top:175px;width:300px;background:#ffffffed;border:1px solid #fff;border-radius:18px;padding:23px;box-shadow:0 12px 45px #2d504310;z-index:3}.panel-head{display:flex;justify-content:space-between;align-items:center}h2{font-family:Manrope,sans-serif;font-size:21px;letter-spacing:-.6px;margin:7px 0}.tag{border:1px solid #dbe8df;border-radius:20px;padding:8px;font-size:11px;color:#5c8478}.stats{display:flex;gap:18px;font-size:11px;color:#83948d;margin:17px 0 22px}.stats b{color:#36584d;font-size:15px}.search{display:flex;align-items:center;background:#f3f6f2;padding:10px;border-radius:8px;gap:8px}.search input{background:none;border:0;outline:none;width:100%;font-size:11px}.filters{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0 18px}select{width:100%;min-width:0;padding:10px 5px;border:1px solid #e0e7e1;border-radius:7px;background:#fff;font-size:10px;color:#526b60}.list-heading{display:flex;justify-content:space-between;align-items:center;font-size:10px}.list-heading button{border:0;background:none;color:#397663;font-size:11px}.legend{display:flex;flex-wrap:wrap;gap:12px;font-size:9px;border-top:1px solid #e9ede8;padding-top:18px;margin-top:18px}.legend span{display:flex;align-items:center;gap:5px}i:not(.hint i){width:6px;height:6px;background:#aabbb7;border-radius:50%;display:inline-block}i.green{background:#5b9f87}i.sand{background:#c2a46b}.local-note{font-size:9px;line-height:1.6;margin-bottom:0}#scene{position:absolute;inset:0;touch-action:none}canvas{display:block;width:100%;height:100%}#loading{position:absolute;top:50%;left:55%;font-size:13px}#units{max-height:170px;overflow:auto;margin-top:12px}.unit-row{display:flex;justify-content:space-between;text-align:left;width:100%;background:none;border:0;border-bottom:1px solid #eef1eb;padding:11px 2px;font-size:11px;color:#31574b}.unit-row:hover{background:#edf5ef}.unit-row small{color:#7e9287}.scene-label{position:absolute;right:35px;top:40px;letter-spacing:2px;font-size:10px;display:flex;align-items:center;gap:8px}.scene-label span:last-child{color:#8a9c93;font-size:10px;letter-spacing:0}.dot{width:6px;height:6px;background:#487e6f;border-radius:50%}.compass{position:absolute;right:40px;top:90px;text-align:center;font-size:10px;color:#547265}.compass div{font-size:32px}.bottom{position:absolute;bottom:24px;left:0;right:0;display:flex;flex-direction:column;align-items:center;gap:15px;pointer-events:none}.hint{font-size:11px;color:#607d6f;background:#f9fbf5cf;border-radius:30px;padding:10px 18px}.hint span{margin-right:8px;font-size:19px}.hint i{margin:0 10px}.controls{pointer-events:auto;display:flex;align-items:center;padding:5px 8px;background:#fff;border-radius:13px;box-shadow:0 5px 20px #234a3815;gap:2px}.controls button{width:40px;height:38px;border:0;background:#fff;border-radius:8px;color:#365c4e;font-size:22px}.controls button:hover{background:#eef4ef}.controls>span{height:18px;width:1px;background:#e4ebe4;margin:0 6px}.caption{font-size:8px;letter-spacing:2px;color:#83978a}.caption span{margin-left:20px;color:#a1b0a3}#card{position:absolute;right:28px;top:140px;width:315px;background:#fffffff5;border:1px solid white;border-radius:20px;padding:27px;z-index:5;box-shadow:0 20px 70px #203d3426;max-height:calc(100% - 165px);overflow:auto}#card h2{font-size:24px;margin:12px 0}.close{position:absolute;right:12px;top:10px;border:0;background:none;font-size:24px;color:#81958b}.badge{font-size:10px;background:#e8f1e9;color:#57846e;padding:7px 10px;border-radius:20px;display:inline-block}.owner{display:flex;gap:12px;align-items:center;border-bottom:1px solid #e8eee7;padding:24px 0 18px}.owner-avatar{background:#e9eee5;border-radius:50%;padding:15px;color:#728d70}.owner small,.contact small{font-size:8px;letter-spacing:1.5px;color:#94a396}.owner h3{font-size:14px;margin:5px 0}.contact small{display:block;margin:20px 0 7px}.contact div{font-size:13px;overflow-wrap:anywhere}.data-note{font-size:9px;line-height:1.6;margin:22px 0}.primary{width:100%;background:#315f50;color:#fff;border:0;border-radius:8px;padding:13px;font-size:11px}.primary span{float:right}form label{display:block;font-size:10px;margin:14px 0}form input,form select{width:100%;padding:10px;border:1px solid #d9e2d7;border-radius:6px;margin-top:6px} .handle{display:none}[hidden]{display:none!important}
@media(max-width:760px){header{height:68px;padding:0 20px}.brand{font-size:17px}.brand small{font-size:7px}.demo{font-size:9px}.avatar{display:none}main{height:calc(100dvh - 68px);min-height:650px}.intro{left:20px;top:24px}h1{font-size:27px}.intro p{font-size:11px}.intro .eyebrow{font-size:8px}.explorer{left:16px;right:16px;top:131px;width:auto;padding:12px 15px;border-radius:12px}.panel-head,.stats,.legend,.local-note{display:none}.search{padding:8px}.filters{margin:8px 0}.filters select{padding:8px}.list-heading{font-size:9px}#units{max-height:145px}.scene-label{top:auto;bottom:149px;right:20px;font-size:8px}.scene-label span:last-child{display:none}.compass{right:20px;top:auto;bottom:190px}.bottom{bottom:18px;gap:10px}.hint{font-size:10px;padding:6px 12px}.caption{font-size:7px}#card{top:auto;bottom:0;right:0;width:100%;border-radius:24px 24px 0 0;padding:25px;max-height:65%;box-shadow:0 -12px 50px #203d3422}.handle{display:block;width:34px;height:4px;border-radius:3px;background:#dce4d8;margin:-13px auto 17px}.owner{padding:13px 0}.contact{display:grid;grid-template-columns:1fr 2fr;gap:12px;margin-top:15px}.contact small{margin:0}.contact div{font-size:12px}.data-note{margin:15px 0}#card h2{font-size:22px}}
/* A quieter interface, with the warm yellow and blush of the supplied identity. */
:root{color:#244d43;background:#eef7f1}header{height:90px;padding:0 38px;background:#fffffff5;border:0}.brand{height:86px;width:155px;display:flex;align-items:center}.brand img{width:142px;height:88px;object-fit:contain}.header-right{gap:18px}.demo{font-size:9px;letter-spacing:1.8px;color:#547468}.avatar{background:#fff0c6;border:0;color:#536b50}main{height:calc(100dvh - 90px)}.intro{top:30px}.intro .eyebrow{color:#648c7a;font-size:9px}h1{font-size:43px;font-weight:600;line-height:1.08;letter-spacing:-2px;margin:14px 0 10px}h1 em{color:#298a6b}p{color:#708b7a}.explorer{top:230px;padding:20px;width:292px;border-radius:24px;background:#ffffffde;backdrop-filter:blur(18px);box-shadow:0 14px 50px #365c3910;border:1px solid #fff}.explorer h2{font-size:18px}.tag{background:#e9f5cf;color:#4c813e;border:0}.stats{margin:12px 0 16px}.search{background:#edf5ee;border:1px solid transparent;transition:background .2s,border .2s}.search:focus-within{background:#fff;border-color:#70b892}.filters select{background:#f9fcf7}.list-heading button{font-weight:600}.local-note{font-size:9px;line-height:1.6;color:#94a394}.scene-label{color:#3c8f70}.scene-label .dot{background:#65ba81;box-shadow:0 0 0 5px #65ba811b}.hint{background:#ffffffc9;backdrop-filter:blur(10px);border:1px solid #fff;color:#3e6c55}.controls{border:1px solid #fff;background:#fffffff0;border-radius:40px;padding:6px 10px;box-shadow:0 8px 30px #356e4617}.controls button{border-radius:50%;background:none;transition:transform .18s,background .18s}.controls button:hover{background:#e6f5ca;transform:translateY(-2px)}.controls button:active{transform:scale(.92)}.caption{color:#7c9780}#selection-label{position:absolute;left:54%;top:85px;transform:translateX(-50%);padding:11px 20px;background:#fff2b9;color:#776127;border:1px solid #ffdb78;box-shadow:0 5px 25px #c3a54124;border-radius:30px;font-size:12px;z-index:3;pointer-events:none;animation:labelIn .3s ease-out}#card{border-radius:25px;background:#fffffff5;backdrop-filter:blur(18px);box-shadow:0 20px 70px #244e3821;animation:cardIn .35s cubic-bezier(.2,.8,.2,1)}#card::before{content:'';position:absolute;left:0;right:0;top:0;height:5px;background:linear-gradient(90deg,#ffe38b,#ffd3c5,#8cd9b7)}#card h2{color:#254d40}.badge{background:#ecf7d7;color:#567c3d}.owner-avatar{background:linear-gradient(135deg,#fff0b4,#ffddcf);color:#75654a}.primary{background:#288765;border-radius:12px;box-shadow:0 5px 15px #28876522;transition:background .2s,transform .2s}.primary:hover{background:#1e7153;transform:translateY(-1px)}.close{width:34px;height:34px;background:#f0f6eb;border-radius:50%;font-size:21px}.unit-row{border-radius:7px;padding:11px 7px}.unit-row:hover{background:#f2f8dd}.unit-row:focus{background:#fff1ba}@keyframes cardIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@keyframes labelIn{from{opacity:0;margin-top:10px}to{opacity:1;margin-top:0}}
@media(max-width:760px){header{height:78px;padding:0 18px}.brand{height:76px;width:115px}.brand img{height:76px;width:115px}.demo{font-size:7px;letter-spacing:1px;max-width:130px;line-height:1.6;text-align:right}main{height:calc(100dvh - 78px)}.intro{left:22px;top:22px}h1{font-size:31px;letter-spacing:-1.4px;line-height:1.2;margin:10px 0 7px}h1 br{display:none}h1 em{margin-left:7px}.intro p{font-size:11px}.explorer{top:130px;left:16px;right:16px;width:auto;padding:12px 15px;border-radius:19px}.search{padding:9px}.filters{margin:7px 0}.scene-label{bottom:150px}#selection-label{left:50%;top:264px;font-size:10px;padding:9px 14px;white-space:nowrap}#card{border-radius:25px 25px 0 0}.bottom{bottom:16px}.caption{font-size:6px}.hint{font-size:9px}.controls button{width:39px;height:37px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
.explorer,#card,.hint{backdrop-filter:none}.explorer{background:#ffffffed}#card{background:#fffffff9}
@media(max-width:760px){#card{padding:24px 20px 16px}#card h2{font-size:21px;margin:7px 0}.badge{padding:5px 9px;font-size:9px}.owner{padding:9px 0;gap:10px}.owner-avatar{padding:10px;font-size:11px}.owner h3{font-size:13px}.contact{gap:8px;margin-top:10px}.contact small{font-size:7px}.contact div{font-size:11px}.data-note{font-size:8px;margin:9px 0}.primary{padding:11px}.handle{margin:-13px auto 13px}.close{right:10px;top:9px}}
.sea-context{position:absolute;right:30px;top:145px;z-index:3;display:flex;flex-direction:column;align-items:flex-end;gap:7px}.sea-context button{border:1px solid #cee1e3;background:#ffffffdc;border-radius:22px;padding:10px 16px;color:#347f8b;font-size:11px;cursor:pointer;transition:background .2s}.sea-context button:hover{background:#dff4f2}.sea-context small{font-size:8px;color:#698a90;letter-spacing:.4px}.local-note a{color:#588a78;text-decoration:none}.scene-label{letter-spacing:1px;font-size:9px}.compass{color:#548f9b}
@media(max-width:760px){.sea-context{top:272px;right:20px;gap:4px}.sea-context button{font-size:9px;padding:8px 12px}.sea-context small{font-size:7px}.scene-label{font-size:7px;right:18px}.intro .eyebrow{font-size:7px}#selection-label{top:323px}}
/* Paneles translúcidos y ficha de contacto */
.explorer,#card,.hint,.controls,.sea-context button{background:rgba(255,255,255,.82);backdrop-filter:blur(18px) saturate(125%);-webkit-backdrop-filter:blur(18px) saturate(125%);border:1px solid rgba(255,255,255,.75)}#card{background:rgba(251,255,251,.9)}.gallery{height:118px;border-radius:14px;overflow:hidden;margin-top:14px;background:linear-gradient(135deg,#cceae0,#fff0c9)}.gallery img{width:100%;height:100%;object-fit:cover}.empty-photo{height:100%;display:flex;justify-content:center;align-items:center;gap:8px;color:#568b7a;font-size:11px;text-align:center}.photo-nav{display:flex;justify-content:center;align-items:center;gap:14px;font-size:10px;color:#638879}.photo-nav button{border:0;background:transparent;font-size:20px;color:#33745f}.contact-actions{display:flex;gap:8px;margin-top:15px}.contact-button,.icon-button,.availability{display:flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;border-radius:12px;padding:11px;background:#e9f5ec;color:#286a54;font-size:12px;font-weight:600}.contact-button{flex:1}.icon-button{min-width:42px;font-size:18px}.availability{margin-top:8px;background:#249f68;color:white}.contact-actions [aria-disabled=true],.availability[aria-disabled=true]{opacity:.38;cursor:not-allowed}.contact-hint{font-size:9px;margin:8px 0;color:#738e80}.photo-remove{display:flex;align-items:center;gap:8px}.photo-remove input{width:auto;margin:0}#edit-form input[type=file]{font-size:10px}#card .data-note{margin:9px 0;font-size:9px}#card .owner{padding:11px 0}#card .contact small{margin:10px 0 4px}@media(max-width:760px){#card{max-height:68%;overflow-y:auto}.gallery{height:90px;margin-top:9px}.contact-actions{margin-top:9px}.contact-button,.icon-button,.availability{padding:9px}.contact-hint{margin:5px 0}#card .contact small{margin:0}#card .data-note{margin:6px 0}.explorer{background:rgba(255,255,255,.85)}}
/* Laguna Bahía · azul y vidrio, inspirado en la referencia */
:root{color:#063f50;background:#cdeaf2}header{background:linear-gradient(110deg,#eff9fd,#b6e6f6 72%,#8ad5ee);box-shadow:0 5px 30px #035b7a10}.brand img{filter:saturate(1.2) contrast(1.1)}.demo{color:#075571;letter-spacing:2px;font-weight:700}main{background:#b8dfea}.intro{isolation:isolate;z-index:2}.intro:before{content:'';position:absolute;z-index:-1;pointer-events:none;left:-44px;top:-30px;width:405px;height:276px;background:linear-gradient(135deg,#0084c9,#00b8e1);border-radius:0 0 65% 0;box-shadow:0 18px 60px #0289b829}.intro .eyebrow{color:#dff8ff;letter-spacing:2px}h1{color:white;font-weight:800;letter-spacing:-2px;text-shadow:0 2px 16px #007fb22b}h1 em{color:#ffdf00;font-weight:700} .intro p{color:#f1fcff;font-size:14px}.explorer{background:rgba(217,245,255,.76);border:1px solid #eafaff;box-shadow:0 15px 45px #005d8f24;backdrop-filter:blur(20px) saturate(145%);-webkit-backdrop-filter:blur(20px) saturate(145%)}.eyebrow{color:#537989}.explorer h2{color:#06495e}.tag{color:#007b8e;background:#fff3b4}.search{background:rgba(246,253,255,.8);border:1px solid #ffffffb8;color:#07526a}.search input{color:#073f50}.filters select{background:rgba(238,250,255,.72);border-color:#ffffffb0;color:#07526a}.list-heading{color:#07526a;font-weight:600}.list-heading button{color:#008866}.scene-label,.compass{color:#0c7084}.sea-context button{background:#effcffde;border-color:white;color:#006d8e;box-shadow:0 7px 22px #006d901c;font-weight:600}.sea-context small{color:#255c6a}.hint{color:#07546b;background:#f7ffffd9}.controls{background:#f9ffffeb;box-shadow:0 10px 35px #00628328}.controls button{color:#08647b}.controls button:hover{background:#d6f4f4}#selection-label{background:#ffeb92;border-color:#ffe176;color:#07505b;font-weight:700;box-shadow:0 7px 25px #886d0030}#card{background:rgba(247,255,252,.9);border:1px solid #ffffffd9;box-shadow:0 20px 70px #07516b38;backdrop-filter:blur(22px) saturate(130%);-webkit-backdrop-filter:blur(22px) saturate(130%)}#card::before{background:linear-gradient(90deg,#08be9c,#ffee7f,#49cde4)}#card h2{color:#073f50;font-weight:800}.close{background:#f7ffffdd;color:#07596a;border:2px solid #00a483}.badge{background:#c9efa4;color:#267445;font-weight:700}.owner-avatar{background:linear-gradient(145deg,#ffe0ba,#ffbd9e);color:#07505b;font-weight:700}.contact{color:#07505b}.gallery-wrap{display:grid;grid-template-columns:minmax(0,1fr) 31%;gap:7px;margin-top:14px}.gallery-wrap:has(.gallery-thumbs[hidden]){grid-template-columns:1fr}.gallery{height:154px;margin:0;background:linear-gradient(135deg,#cef2ef,#e6f7ff 55%,#fff0c4)}.gallery-thumbs{display:grid;grid-template-rows:1fr 1fr;gap:7px;min-height:0}.gallery-thumbs button{border:0;border-radius:10px;overflow:hidden;padding:0;min-height:0;background:#d6ece9}.gallery-thumbs button:only-child{grid-row:span 2}.gallery-thumbs img{width:100%;height:100%;object-fit:cover;display:block}.photo-nav button{color:#006e80}.contact-button{border:1px solid #00a67e;background:#f7fffc;color:#00675b}.icon-button{background:#f7fffc;color:#00785f}.availability,.primary{background:linear-gradient(115deg,#0ac782,#008668);box-shadow:0 8px 20px #009a6c2c}.availability:hover,.primary:hover{background:#007f65}.empty-photo{color:#39867d}.contact-hint,.data-note{color:#66838b}
@media(max-width:760px){header{background:linear-gradient(110deg,#f4fbfd,#b8e8f7);height:80px}.intro{top:23px}.intro:before{left:-22px;top:-23px;width:100vw;height:280px;border-radius:0 0 48% 8%;background:linear-gradient(130deg,#0088ca,#00bce4 80%,#78d9ec)}.intro .eyebrow{color:#eafaff;font-size:8px}.intro p{font-size:12px}.intro h1{font-size:32px}.explorer{top:135px;background:rgba(192,235,250,.83);border-radius:22px;box-shadow:0 12px 28px #006a9826}.search{background:rgba(241,252,255,.83)}.filters select{background:rgba(228,247,255,.76)}.sea-context{top:280px}.sea-context button{background:#f3fdffed;color:#006d8e}.sea-context small{color:#285d6d}#selection-label{top:325px}#card{background:rgba(246,255,252,.91)}.gallery-wrap{height:94px;margin-top:9px}.gallery{height:94px}.gallery-thumbs{height:94px}}
main{background:#fff}.intro:before{background:linear-gradient(130deg,#0084bd,#36b8d7)}#scene{background:#fff}.controls{gap:5px}.controls #reset{width:auto;border-radius:24px;padding:0 14px;font-size:20px}.controls #reset small{font-size:10px;vertical-align:middle;margin-left:5px;font-weight:700}.gallery img{cursor:zoom-in}.gallery-thumbs{grid-template-rows:repeat(2,minmax(0,1fr));overflow:auto}.gallery-thumbs button:nth-child(n+3){display:none}.amenities{display:flex;flex-wrap:wrap;gap:6px;margin:13px 0}.amenities span{background:#edf9f5;border:1px solid #d1eee4;border-radius:12px;padding:7px 9px;font-size:10px;font-weight:600;color:#166650}.icon-button{opacity:1!important;background:#e2f8ee;color:#008a65}.contact-button{background:#e2f8ee}.lightbox{position:fixed;inset:0;z-index:20;background:#062a34ed;display:flex;align-items:center;justify-content:center;padding:40px}.lightbox img{max-width:90%;max-height:85dvh;object-fit:contain;border-radius:10px}.lightbox button{border:0;border-radius:50%;background:#fffffff0;color:#164f5c;width:44px;height:44px;font-size:28px;cursor:pointer}.lightbox #lightbox-close{position:absolute;right:20px;top:20px}.lightbox #lightbox-count{position:absolute;bottom:20px;color:white;font-size:12px}.lightbox #lightbox-prev{margin-right:10px}.lightbox #lightbox-next{margin-left:10px}@media(max-width:760px){.controls #reset small{font-size:9px}.amenities span{font-size:9px;padding:6px 7px}#card{background:rgba(248,255,253,.94)}.lightbox{padding:15px}.lightbox img{max-width:74%}}