{"id":3238,"date":"2025-07-11T00:59:03","date_gmt":"2025-07-11T00:59:03","guid":{"rendered":"https:\/\/godsgalaxygame.com\/GGG\/?page_id=3238"},"modified":"2026-04-30T21:17:14","modified_gmt":"2026-04-30T21:17:14","slug":"rent-before-buying","status":"publish","type":"page","link":"https:\/\/godsgalaxygame.com\/GGG\/rent-before-buying\/","title":{"rendered":"Rent Before Buying"},"content":{"rendered":"\n<!-- ===== RENT B4 BUY \u2014 STARFIELD BACKGROUND (behind cube + map) ===== -->\n<canvas id=\"rbStarfield\" aria-hidden=\"true\"><\/canvas>\n\n<style>\n  \/* Fullscreen background behind everything on this page\/block *\/\n  #rbStarfield{\n    position: fixed;\n    inset: 0;\n    width: 100%;\n    height: 100%;\n    display: block;\n    z-index: 0;\n    pointer-events: none;\n  }\n\n  \/* Make sure your UI stays above the starfield *\/\n  #rentb4buyContainer{ position: relative; z-index: 5; }\n\n  \/* Optional: keep page dark *\/\n  body{ background:#000; }\n<\/style>\n\n<script>\n(function(){\n  const c = document.getElementById('rbStarfield');\n  if(!c) return;\n  const ctx = c.getContext('2d');\n\n  let W=0, H=0, dpr=1, stars=[], meteors=[];\n  let rafId=null, running=true;\n\n  function resize(){\n    dpr = Math.max(1, Math.min(2, window.devicePixelRatio||1));\n    W = c.width  = Math.floor(innerWidth  * dpr);\n    H = c.height = Math.floor(innerHeight * dpr);\n    c.style.width  = innerWidth  + 'px';\n    c.style.height = innerHeight + 'px';\n    buildStars();\n  }\n\n  function buildStars(){\n    const count = Math.floor((W*H) \/ (14000*dpr));\n    stars = Array.from({length: count}, () => ({\n      x: Math.random()*W,\n      y: Math.random()*H,\n      r: (Math.random()*1.2+0.4)*dpr,\n      a: Math.random()*1\n    }));\n  }\n\n  function spawnMeteor(){\n    const startX = Math.random()<0.5 ? -50*dpr : W+50*dpr;\n    const dir = startX<0 ? 1 : -1;\n    const startY = Math.random()*H*0.6 + H*0.1;\n    meteors.push({ x:startX, y:startY, vx: dir*(3.2*dpr), vy: 1.2*dpr, life: 0, max: 1600 });\n  }\n\n  let last=0, accum=0;\n  function tick(ts){\n    if(!running) return;\n    const dt = Math.min(33, ts-last || 16); last=ts; accum+=dt;\n    if (accum>900+Math.random()*900) { spawnMeteor(); accum=0; }\n\n    ctx.setTransform(1,0,0,1,0,0);\n    ctx.clearRect(0,0,W,H);\n\n    \/\/ subtle cyan nebula glow\n    const g = ctx.createRadialGradient(W\/2,H*0.15,0, W\/2,H*0.4, Math.hypot(W,H)\/1.4);\n    g.addColorStop(0,'rgba(0,220,255,0.10)');\n    g.addColorStop(1,'rgba(0,0,0,0)');\n    ctx.fillStyle=g; ctx.fillRect(0,0,W,H);\n\n    \/\/ twinkle\n    for(const s of stars){\n      s.a += (Math.random()*0.06-0.03);\n      const a = 0.35+0.35*Math.sin(s.a);\n      ctx.fillStyle = `rgba(200,245,255,${a})`;\n      ctx.beginPath(); ctx.arc(s.x,s.y,s.r,0,Math.PI*2); ctx.fill();\n    }\n\n    \/\/ meteors\n    for (let i=meteors.length-1;i>=0;i--){\n      const m = meteors[i];\n      m.x += m.vx; m.y += m.vy; m.life += dt;\n\n      const trailX = m.x - m.vx*6;\n      const trailY = m.y - m.vy*6;\n      const grad = ctx.createLinearGradient(m.x,m.y, trailX,trailY);\n      grad.addColorStop(0,'rgba(0,255,255,0.9)');\n      grad.addColorStop(1,'rgba(0,255,255,0)');\n      ctx.strokeStyle = grad; ctx.lineWidth = 2*dpr; ctx.lineCap='round';\n      ctx.beginPath(); ctx.moveTo(m.x,m.y); ctx.lineTo(trailX, trailY); ctx.stroke();\n\n      if (m.x<-200*dpr || m.x>W+200*dpr || m.y>H+200*dpr || m.life>m.max){\n        meteors.splice(i,1);\n      }\n    }\n\n    rafId = requestAnimationFrame(tick);\n  }\n\n  \/\/ Optional: expose a tiny controller (if you ever want to pause it)\n  window.rbStarfieldControl = {\n    pause(){ running=false; if(rafId) cancelAnimationFrame(rafId); },\n    play(){ if(running) return; running=true; last=0; accum=0; rafId=requestAnimationFrame(tick); }\n  };\n\n  addEventListener('resize', resize, {passive:true});\n  resize(); rafId = requestAnimationFrame(tick);\n})();\n<\/script>\n<!-- ===== end RENT B4 BUY starfield ===== -->\n\n\n\n<!-- BLOQUE 2 - Rent Before Buying Cube V19 Completo + Mapa Circular + API -->\n<style>\n  @media (max-width: 768px) {\n    #glowMapContainer {\n      margin-top: -50px !important;\n    }\n  }\n<\/style>\n<div id=\"rentb4buyContainer\" style=\"opacity:1; pointer-events: auto; transition: opacity 0.6s ease;\">\n  <!-- ESCENA CUBO -->\n  <div class=\"cube-scene\" style=\"width:180px; height:180px; perspective:1000px; position:fixed; bottom:20px; left:20px; z-index:1000;\">\n    <div class=\"cube\" id=\"rentb4buyCube\" style=\"width:100%; height:100%; position:relative; transform-style:preserve-3d; transform:rotateX(0deg) rotateY(0deg); transition:transform 0.3s ease;\">\n   <!-- FRONT -->\n      <div class=\"face front\" style=\"width:180px; height:180px; background:transparent; border:2px solid white; box-shadow:0 0 20px white; position:absolute; transform:rotateY(0deg) translateZ(90px); display:flex; flex-direction:column; justify-content:center; align-items:center; font-family:Orbitron;\">\n        <div style=\"font-size:42px; color:white; text-shadow:0 0 15px white;\">\ud83d\udcab<\/div>\n        <div style=\"font-size:16px; color:white; font-weight:bold; text-shadow:0 0 10px white; margin-top:6px;\">Rent B4 Buying<\/div>\n      <\/div>\n\n      <!-- Cara Trasera del Cubo: Transportation -->\n<!-- Back Face - Transportation Cube - Nuevo Dise\u00f1o con Botones Circulares -->\n<div class=\"face back\" style=\"width:180px; height:180px; background:#000; border:2px solid white; box-shadow:0 0 15px white; position:absolute; transform:rotateY(180deg) translateZ(90px); font-family:Orbitron,sans-serif;\">\n\n  <!-- Sol central -->\n  <img decoding=\"async\" src=\"http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/06\/1000065346-scaled.jpg\"\n       style=\"width:70px; height:70px; border-radius:50%; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); box-shadow:0 0 20px white;\" \/>\n\n  <!-- Reserve -->\n  <a href=\"https:\/\/godsgalaxygame.com\/GGG\/fractional-ownership\/?fractional=1\" target=\"_blank\"\n     style=\"position:absolute; top:8px; left:8px; width:44px; height:44px; border-radius:50%; background-image:url('http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/06\/Screenshot_20240108-225452_Chrome-scaled.jpg'); background-size:cover; box-shadow:0 0 12px cyan;\"\n     title=\"Reserve\"><\/a>\n\n  <!-- Bliss Coin -->\n  <div onclick=\"openBlissCoinPopup()\"\n       style=\"position:absolute; top:8px; right:8px; width:44px; height:44px; border-radius:50%; background:#222; font-size:40px; display:flex; justify-content:center; align-items:center; color:white; box-shadow:0 0 10px cyan; cursor:pointer;\"\n       title=\"Pay with Bliss Coin\">\ud83d\udcb3<\/div>\n\n  <!-- Coupon Button (Bottom-Left Corner) -->\n<a href=\"https:\/\/godsgalaxygame.com\/GGG\/discounts-gift\/\"\n   target=\"_blank\"\n   style=\"position: absolute;\n          bottom: 8px;\n          left: 8px;\n          width: 44px;\n          height: 44px;\n          border-radius: 50%;\n          background-image: url('http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/06\/Screenshot_20240108-225546_Chrome.jpg');\n          background-size: cover;\n          box-shadow: 0 0 12px cyan;\n          cursor: pointer;\"\n   title=\"Get Coupons\">\n<\/a>\n\n  <!-- Become a Host -->\n  <a href=\"https:\/\/luxus2.godaddysites.com\/\" target=\"_blank\"\n     style=\"position:absolute; bottom:8px; right:8px; width:44px; height:44px; border-radius:50%; background-image:url('http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/06\/Screenshot_20240108-224514_Chrome-scaled.jpg'); background-size:cover; box-shadow:0 0 12px cyan;\"\n     title=\"Become a Host\"><\/a>\n<\/div>\n\n\n\n      <!-- RIGHT (Intervals) -->\n      <div class=\"face right\" style=\"width:180px; height:180px; background:#000; border:2px solid beige; box-shadow:0 0 15px beige; position:absolute; transform:rotateY(90deg) translateZ(90px); font-family:Orbitron;\">\n        <button onclick=\"showHostButtons('interv-1day')\" style=\"position:absolute; top:8px; left:27px; width:126px; height:17px; border:1px solid beige; color:white; background:transparent;\">1 Day<\/button>\n        <button onclick=\"showHostButtons('interv-3day')\" style=\"position:absolute; bottom:8px; left:27px; width:126px; height:17px; border:1px solid beige; color:white; background:transparent;\">3 Days<\/button>\n        <button onclick=\"showHostButtons('interv-5day')\" style=\"position:absolute; top:27px; left:8px; height:126px; width:17px; border:1px solid beige; color:white; writing-mode:vertical-rl; background:transparent;\">5 Days<\/button>\n        <button onclick=\"showHostButtons('interv-1wk')\" style=\"position:absolute; top:27px; right:8px; height:126px; width:17px; border:1px solid beige; color:white; writing-mode:vertical-lr; background:transparent;\">1 Week<\/button>\n        <div style=\"position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); text-align:center;\">\n          <div style=\"color:beige; font-size:16px; font-weight:bold;\">Intervals<\/div>\n          <img decoding=\"async\" src=\"http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/06\/Screenshot_20250612_075245_Gallery.jpg\" style=\"width:65px; height:65px; border-radius:50%; box-shadow:0 0 12px beige;\">\n        <\/div>\n      <\/div>\n\n      <!-- LEFT (Coins) -->\n      <div class=\"face left\" style=\"width:180px; height:180px; background:#000; border:2px solid #00ccff; box-shadow:0 0 15px #00ccff; position:absolute; transform:rotateY(-90deg) translateZ(90px); font-family:Orbitron;\">\n        <button onclick=\"showHostButtons('coins-te')\" style=\"position:absolute; top:8px; left:27px; width:126px; height:17px; border:1px solid #00ccff; color:white; background:transparent;\">Travel Essentials<\/button>\n        <button onclick=\"showHostButtons('coins-points')\" style=\"position:absolute; bottom:8px; left:27px; width:126px; height:17px; border:1px solid #00ccff; color:white; background:transparent;\">Points<\/button>\n        <button onclick=\"showHostButtons('coins-exchange')\" style=\"position:absolute; top:27px; left:8px; height:126px; width:17px; border:1px solid #00ccff; color:white; writing-mode:vertical-rl; background:transparent;\">Exchange<\/button>\n        <button onclick=\"showHostButtons('coins-eco')\" style=\"position:absolute; top:27px; right:8px; height:126px; width:17px; border:1px solid #00ccff; color:white; writing-mode:vertical-lr; background:transparent;\">Eco Club<\/button>\n        <div style=\"position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); text-align:center;\">\n          <div style=\"color:#00ccff; font-size:16px; font-weight:bold;\">Coins<\/div>\n          <img decoding=\"async\" src=\"http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/06\/Screenshot_20250612_075344_Gallery.jpg\" style=\"width:65px; height:65px; border-radius:50%; box-shadow:0 0 12px #00ccff;\">\n        <\/div>\n      <\/div>\n\n      <!-- TOP (City Card) -->\n      <div class=\"face top\" style=\"width:180px; height:180px; background:#000; border:2px solid green; box-shadow:0 0 15px #33ff33; position:absolute; transform:rotateX(90deg) translateZ(90px); font-family:Orbitron;\">\n        <button onclick=\"showHostButtons('city-air')\" style=\"position:absolute; top:8px; left:27px; width:126px; height:17px; border:1px solid green; color:white; background:transparent;\">Air<\/button>\n        <button onclick=\"showHostButtons('city-water')\" style=\"position:absolute; bottom:8px; left:27px; width:126px; height:17px; border:1px solid green; color:white; background:transparent;\">Water<\/button>\n        <button onclick=\"showHostButtons('city-land')\" style=\"position:absolute; top:27px; left:8px; height:126px; width:17px; border:1px solid green; color:white; writing-mode:vertical-rl; background:transparent;\">Land<\/button>\n        <button onclick=\"showHostButtons('city-food')\" style=\"position:absolute; top:27px; right:8px; height:126px; width:17px; border:1px solid green; color:white; writing-mode:vertical-lr; background:transparent;\">Food<\/button>\n        <div style=\"position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); text-align:center;\">\n          <div style=\"color:#33ff33; font-size:16px; font-weight:bold;\">City Card<\/div>\n          <img decoding=\"async\" src=\"http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/06\/Screenshot_20250612_075305_Gallery.jpg\" style=\"width:65px; height:65px; border-radius:50%; box-shadow:0 0 12px #33ff33;\">\n        <\/div>\n      <\/div>\n\n      <!-- BOTTOM (Avatar) -->\n      <div class=\"face bottom\" style=\"width:180px; height:180px; background:#000; border:2px solid red; box-shadow:0 0 15px red; position:absolute; transform:rotateX(-90deg) translateZ(90px); font-family:Orbitron;\">\n        <button onclick=\"showHostButtons('avatar-exchange')\" style=\"position:absolute; top:8px; left:27px; width:126px; height:17px; border:1px solid red; color:white; background:transparent;\">Exchange<\/button>\n        <button onclick=\"showHostButtons('avatar-socialize')\" style=\"position:absolute; bottom:8px; left:27px; width:126px; height:17px; border:1px solid red; color:white; background:transparent;\">Socialize<\/button>\n        <button onclick=\"showHostButtons('avatar-events')\" style=\"position:absolute; top:27px; left:8px; height:126px; width:17px; border:1px solid red; color:white; writing-mode:vertical-rl; background:transparent;\">Events<\/button>\n        <button onclick=\"showHostButtons('avatar-tc')\" style=\"position:absolute; top:27px; right:8px; height:126px; width:17px; border:1px solid red; color:white; writing-mode:vertical-lr; background:transparent;\">Travel Club<\/button>\n        <div style=\"position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); text-align:center;\">\n          <div style=\"color:red; font-size:16px; font-weight:bold;\">Avatar<\/div>\n          <img decoding=\"async\" src=\"http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/06\/Screenshot_20250612_075325_Gallery.jpg\" style=\"width:65px; height:65px; border-radius:50%; box-shadow:0 0 12px red;\">\n        <\/div>\n      <\/div>\n\n    <\/div>\n  <\/div>\n\n  <!-- MAPA CIRCULAR -->\n  <div id=\"glowMapContainer\" style=\"opacity:1; pointer-events:auto; transition: opacity 0.6s ease; margin: 0 auto; margin-top: -95px; margin-bottom: 40px; width: 320px; height: 320px; border-radius: 50%; overflow: hidden; border: 6px solid rgba(0,255,255,0.6); box-shadow: 0 0 25px cyan; position: relative; z-index: 900;\">\n    <div id=\"googleMap\" style=\"width:100%; height:100%;\"><\/div>\n  <\/div>\n<\/div>\n\n<!-- Google Maps API (clave v\u00e1lida y correcta) -->\n<script src=\"https:\/\/maps.googleapis.com\/maps\/api\/js?key=AIzaSyDLPhx98z9AgoqXS6VeoESE9NV6URuOhiE&#038;callback=initMap\" async defer><\/script>\n\n<script>\n  function activaterentb4buyCube() {\n    \/\/ Oculta el grid de opciones\n    const rrGrid = document.getElementById(\"rrGrid\");\n    if (rrGrid) {\n      rrGrid.style.display = \"none\";\n    }\n\n    \/\/ Muestra el contenedor del cubo Rent Before Buying\n    const container = document.getElementById(\"rentb4buyContainer\");\n    if (container) {\n      container.style.opacity = \"1\";\n      container.style.pointerEvents = \"auto\";\n    }\n\n    \/\/ Muestra el mapa\n    const map = document.getElementById(\"glowMapContainer\");\n    if (map) {\n      map.style.opacity = \"1\";\n      map.style.pointerEvents = \"auto\";\n    }\n\n    \/\/ Reinicia el mapa si es necesario\n    if (typeof initMap === \"function\") {\n      initMap();\n    }\n  }\n<\/script>\n<script>\n  function initMap() {\n    const location = { lat: 6.25184, lng: -75.56359 }; \/\/ Puedes cambiar esto a tu zona de inter\u00e9s\n\n    const map = new google.maps.Map(document.getElementById(\"googleMap\"), {\n      zoom: 14,\n      center: location,\n      mapTypeId: google.maps.MapTypeId.HYBRID, \/\/ Aqu\u00ed activas el modo hybrid\n    });\n\n    new google.maps.Marker({\n      position: location,\n      map: map,\n      title: \"Ubicaci\u00f3n Principal\",\n    });\n  }\n<\/script>\n\n<!-- POP-UP para Bliss Coin -->\n<div id=\"blissCoinPopup\" style=\"display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.9); z-index:9999; justify-content:center; align-items:center; font-family:Orbitron;\">\n  <div style=\"background:#111; padding:30px 20px; border:2px solid cyan; border-radius:20px; color:white; width:300px; text-align:center; box-shadow:0 0 20px cyan;\">\n    <h3 style=\"font-size:18px;\">\ud83d\udcb3 Pay with Bliss Coin<\/h3>\n    <p style=\"font-size:14px;\">Enter your digital wallet #:<\/p>\n    <input type=\"text\" placeholder=\"Your Wallet #\" style=\"width:90%; padding:8px; border-radius:10px; border:1px solid white; background:#000; color:white; margin-top:8px;\" \/>\n    <p style=\"margin-top:14px;\">Send payment to:<\/p>\n    <div style=\"margin:8px auto; padding:6px; background:#222; border:1px solid cyan; border-radius:8px;\">\n      <code style=\"font-size:13px;\">HOST-WALLET-ADDRESS-123<\/code>\n    <\/div>\n    <button onclick=\"closeBlissCoinPopup()\" style=\"margin-top:12px; padding:6px 16px; border-radius:10px; background:cyan; border:none; color:#000; font-weight:bold; cursor:pointer;\">\n      Close\n    <\/button>\n  <\/div>\n<\/div>\n\n<script>\n  function openBlissCoinPopup() {\n    document.getElementById('blissCoinPopup').style.display = 'flex';\n  }\n  function closeBlissCoinPopup() {\n    document.getElementById('blissCoinPopup').style.display = 'none';\n  }\n<\/script>\n\n\n\n<!-- BLOQUE 3 \u2013 Movimiento + Swipe + SignIn + Favoritos (First You) -->\n\n<!-- ESTILOS -->\n<style>\n  #floatingButtons {\n    position: fixed;\n    top: 14px;\n    right: 14px;\n    display: flex;\n    flex-direction: row;\n    gap: 10px;\n    z-index: 3000;\n  }\n\n  #favoritesBtn, #signinBtn {\n    font-size: 15px;\n    padding: 6px 10px;\n    border-radius: 8px;\n    border: 2px solid white;\n    color: white;\n    background: rgba(0, 0, 0, 0.6);\n    cursor: pointer;\n    box-shadow: 0 0 8px cyan;\n    font-family: Orbitron;\n  }\n\n  #favoritesBtn:hover::after {\n    content: ' Double click a Host to add \ud83d\udc98';\n    font-size: 10px;\n    margin-left: 8px;\n    color: cyan;\n  }\n\n  #cityCardBtn {\n    width: 39px;\n    height: 39px;\n    border-radius: 50%;\n    border: 2px solid #ffffffaa;\n    background: rgba(0,0,0,0.65);\n    color: #fff;\n    font-size: 11px;\n    font-family: 'Orbitron', system-ui, sans-serif;\n    letter-spacing: 1px;\n    cursor: pointer;\n    box-shadow: 0 0 10px cyan;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    transition: 0.25s ease;\n  }\n  #cityCardBtn:hover {\n    box-shadow: 0 0 16px cyan;\n    transform: translateY(-1px);\n  }\n\n\n#pyramidBtn {\n    width: 38px;\n    height: 38px;\n    background-color: black;\n    border: 2px solid white;\n    border-radius: 50%;\n    box-shadow: 0 0 10px cyan; \/* glow *\/\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    font-size: 20px; \/* emoji size *\/\n    cursor: pointer;\n    margin-top: 2px; \/* align with rose *\/\n  }\n\n  #pyramidBtn:hover {\n    transform: scale(1.2);\n  }\n\n#roseBtn {\n  width: 38px;\n  height: 38px;\n  background-color: black; \/* Keep black background *\/\n  background-image: url('http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/07\/ChatGPT-Image-Jul-7-2025-05_11_38-PM.png');\n  background-size: cover;\n  background-position: center;\n  border: 2px solid white; \/* Optional white border *\/\n  border-radius: 50%;\n  box-shadow: 0 0 10px white; \/* White glow around the button *\/\n  cursor: pointer;\n  margin-top: 2px; \/* Adjust position to align with others *\/\n}\n\n#roseBtn:hover {\n  transform: scale(1.2);\n}\n\n  #signinBtn:hover::after {\n    content: ' Sign in to save your Favorites';\n    font-size: 10px;\n    margin-left: 8px;\n    color: cyan;\n  }\n\n  #swipeImage {\n    position: fixed;\n    top: 0;\n    left: 50%;\n    transform: translateX(-50%);\n    width: 160px;\n    z-index: 1200;\n    display: none;\n  }\n#swipeImage {\n  display: none !important;\n}\n\n<\/style>\n\n<!-- BOTONES FLOTANTES -->\n<div id=\"floatingButtons\">\n<button id=\"cityCardBtn\" class=\"ggg-icon-btn\" title=\"City Card\">\n  <img decoding=\"async\" src=\"http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/12\/Screenshot_20240911_204007_Gallery.jpg\" style=\"width:170%; height:100%; border-radius:50%;\">\n<\/button>\n<button\n    id=\"pyramidBtn\"\n    title=\"Back to MedaYork Pyramid\"\n    onclick=\"window.location.href='https:\/\/godsgalaxygame.com\/GGG\/medayork-pyramid-2\/';\">\n    \ud83e\uddca\n  <\/button>\n<button id=\"roseBtn\"><\/button>\n\n  <button id=\"favoritesBtn\">\ud83d\udc96<\/button>\n  <button id=\"signinBtn\">Sign In \/ Sign Up<\/button>\n<\/div>\n\n<!-- IMAGEN DE SWIPE -->\n<img decoding=\"async\" id=\"swipeImage\" src=\"https:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/06\/Screenshot_20250627_154147_Gallery.jpg\" alt=\"Swipe\" \/>\n\n<!-- SCRIPT DE FUNCIONALIDAD -->\n<script>\n  \/\/ Movimiento del cubo Rent Before Buying\n  let isDragging = false, startX, startY, rotateX = 0, rotateY = 0;\n  const cube = document.getElementById('rentb4buyCube');\n\n  function updateRotation(x, y) {\n    cube.style.transform = `rotateX(${x}deg) rotateY(${y}deg)`;\n  }\n\n  function onMouseDown(e) {\n    isDragging = true;\n    startX = e.clientX;\n    startY = e.clientY;\n  }\n\n  function onMouseMove(e) {\n    if (!isDragging) return;\n    const deltaX = e.clientX - startX;\n    const deltaY = e.clientY - startY;\n    rotateY += deltaX * 0.5;\n    rotateX -= deltaY * 0.5;\n    updateRotation(rotateX, rotateY);\n    startX = e.clientX;\n    startY = e.clientY;\n  }\n\n  function onMouseUp() {\n    isDragging = false;\n  }\n\n  function onTouchStart(e) {\n    isDragging = true;\n    startX = e.touches[0].clientX;\n    startY = e.touches[0].clientY;\n  }\n\n  function onTouchMove(e) {\n    if (!isDragging) return;\n    const deltaX = e.touches[0].clientX - startX;\n    const deltaY = e.touches[0].clientY - startY;\n    rotateY += deltaX * 0.5;\n    rotateX -= deltaY * 0.5;\n    updateRotation(rotateX, rotateY);\n    startX = e.touches[0].clientX;\n    startY = e.touches[0].clientY;\n  }\n\n  function onTouchEnd() {\n    isDragging = false;\n  }\n\n  const cubeContainer = document.querySelector('.cube-scene');\n  if (cubeContainer) {\n    cubeContainer.addEventListener('mousedown', onMouseDown);\n    window.addEventListener('mousemove', onMouseMove);\n    window.addEventListener('mouseup', onMouseUp);\n    cubeContainer.addEventListener('touchstart', onTouchStart);\n    window.addEventListener('touchmove', onTouchMove);\n    window.addEventListener('touchend', onTouchEnd);\n  }\n\n  \/\/ Swipe image cuando aparece el cubo\n  const observer = new MutationObserver(() => {\n    const rentb4buy = document.getElementById('rentb4buyCubeContainer');\n    if (rentb4buy && rentb4buy.style.opacity === \"1\") {\n      const swipe = document.getElementById('swipeImage');\n      swipe.style.display = 'block';\n      setTimeout(() => {\n        swipe.style.display = 'none';\n      }, 3500);\n      observer.disconnect();\n    }\n  });\n  observer.observe(document.body, { childList: true, subtree: true });\n\n  \/\/ Sistema de favoritos \ud83d\udc96 \u2192 \ud83d\udc98\n  const favorites = [];\n\n  function toggleFavorite(id, imgUrl, mapLat, mapLng) {\n    if (!favorites.some(f => f.id === id)) {\n      favorites.push({ id, imgUrl, lat: mapLat, lng: mapLng });\n      document.getElementById(\"favoritesBtn\").textContent = \"\ud83d\udc98\";\n      console.log(\"Favorito agregado:\", id);\n    }\n  }\n\n  function clearFavorites() {\n    favorites.length = 0;\n    document.getElementById(\"favoritesBtn\").textContent = \"\ud83d\udc96\";\n  }\n\n  function focusOnHost(lat, lng) {\n    if (window.ggMap) {\n      window.ggMap.setCenter({ lat, lng });\n      window.ggMap.setZoom(15);\n      new google.maps.Marker({ position: { lat, lng }, map: window.ggMap });\n    }\n  }\n\n  document.getElementById(\"favoritesBtn\").addEventListener(\"click\", () => {\n    if (favorites.length === 0) return;\n    document.querySelectorAll('.host-circle').forEach(btn => btn.style.display = 'none');\n    favorites.forEach(fav => {\n      const existing = document.querySelector(`.${fav.id}`);\n      if (existing) existing.style.display = 'inline-block';\n    });\n  });\n<\/script>\n\n\n\n<!-- HOST CIRCLES \u2014 CSS (Accommodations) -->\n<style>\n  #hostButtons{\n    display:none;                 \/* hidden until a sub-option is clicked *\/\n    position:absolute;\n    top:50%; left:50%;\n    transform:translate(-50%,-50%);\n    width:100%; max-width:500px; height:500px;\n    pointer-events:none;          \/* turned ON in JS when shown *\/\n    z-index:3000;\n  }\n\n  \/* buttons *\/\n  #hostButtons .host-circle{\n    width:80px; height:80px; border-radius:50%;\n    border:2px solid #fff; box-shadow:0 0 14px #fff;\n    background-size:cover; background-position:center;\n    position:absolute; pointer-events:auto; cursor:pointer;\n    transition:transform .3s, box-shadow .3s;\n  }\n  #hostButtons .host-circle:hover{ transform:scale(1.15); box-shadow:0 0 20px cyan; }\n\n  \/* desktop placement (around the circle) *\/\n  #hostButtons .one    { top:4%;    left:10%; }\n  #hostButtons .five   { top:4%;    right:10%; }\n  #hostButtons .seven  { bottom:8%; left:10%; }\n  #hostButtons .month  { bottom:8%; right:10%; }\n\n  \/* color accents per family (match cube face glows) *\/\n  #hostButtons .highrise { border-color:beige;   box-shadow:0 0 14px beige; }\n  #hostButtons .historic { border-color:#00ccff; box-shadow:0 0 14px #00ccff; }\n  #hostButtons .ecostay  { border-color:#33ff33; box-shadow:0 0 14px #33ff33; }\n  #hostButtons .mansions { border-color:red;     box-shadow:0 0 14px red; }\n\n  \/* phone: turn into one row under the map *\/\n  @media (max-width:768px){\n    #hostButtons{\n      position:relative; top:auto; left:auto; transform:none;\n      height:auto; margin-top:-35px;\n      display:none;               \/* still hidden by default *\/\n      flex-wrap:nowrap; justify-content:center; gap:10px;\n    }\n    #hostButtons .host-circle{ position:relative; width:75px; height:75px; margin:0 6px; }\n  }\n\n<\/style>\n\n<!-- HOST CIRCLES \u2014 HTML (Accommodations: High-Rise\n \/ Historic \/ Eco-Stay \/ Mansions) -->\n<div id=\"hostButtons\">\n  <!-- HIGH-RISE (beige) -->\n  <button class=\"host-circle interv interv-1day one\"\n    data-lat=\"6.241568778606768\" data-lng=\"-75.22695655776336\"\n    style=\"background-image:url('http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/12\/Screenshot_20240821_175227_Instagram.jpg');\"\n    title=\"High-Rise \u2022 1\u20133 Days\"><\/button>\n\n  <button class=\"host-circle interv interv-3day five\"\n    data-lat=\"6.241568778606768\" data-lng=\"-75.22695655776336\"\n    style=\"background-image:url('http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/12\/Screenshot_20240706_061611_PowerPoint.jpg');\"\n    title=\"High-Rise \u2022 4\u20136 Days\"><\/button>\n\n  <button class=\"host-circle interv interv-5day seven\"\n    data-lat=\"6.24267\" data-lng=\"-75.22668\"\n    style=\"background-image:url('http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/12\/Screenshot_20240706_061611_PowerPoint.jpg');\"\n    title=\"High-Rise \u2022 7 Days\"><\/button>\n\n  <button class=\"host-circle interv interv-1wk month\"\n    data-lat=\"6.24267\" data-lng=\"-75.22668\"\n    style=\"background-image:url('http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/12\/Screenshot_20240706_061611_PowerPoint.jpg');\"\n    title=\"High-Rise \u2022 1 Month\"><\/button>\n\n  <!-- HISTORIC (cyan) -->\n  <button class=\"host-circle coins coins-te one\"\n    data-lat=\"6.23796\" data-lng=\"-75.21421\"\n    style=\"background-image:url('http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/12\/Screenshot_20240706_061611_PowerPoint.jpg');\"\n    title=\"Historic \u2022 1\u20133 Days\"><\/button>\n\n  <button class=\"host-circle coins coins-points five\"\n    data-lat=\"6.23796\" data-lng=\"-75.21421\"\n    style=\"background-image:url('http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/12\/Screenshot_20240706_061611_PowerPoint.jpg');\"\n    title=\"Historic \u2022 4\u20136 Days\"><\/button>\n\n  <button class=\"host-circle coins coins-exchange seven\"\n    data-lat=\"6.24006\" data-lng=\"-75.18750\"\n    style=\"background-image:url('http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/12\/Screenshot_20240706_061611_PowerPoint.jpg');\"\n    title=\"Historic \u2022 7 Days\"><\/button>\n\n  <button class=\"host-circle coins coins-eco month\"\n    data-lat=\"6.22670\" data-lng=\"-75.18056\"\n    style=\"background-image:url('http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/12\/Screenshot_20240706_061611_PowerPoint.jpg');\"\n    title=\"Historic \u2022 1 Month\"><\/button>\n\n  <!-- ECO-STAY (green) -->\n  <button class=\"host-circle city city-air one\"\n    data-lat=\"6.241568778606768\" data-lng=\"-75.22695655776336\"\n    style=\"background-image:url('http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/12\/Screenshot_20240706_061611_PowerPoint.jpg');\"\n    title=\"Eco-Stay \u2022 1\u20133 Days\"><\/button>\n\n  <button class=\"host-circle city city-water five\"\n    data-lat=\"6.241568778606768\" data-lng=\"-75.22695655776336\"\n    style=\"background-image:url('http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/12\/Screenshot_20240706_061611_PowerPoint.jpg');\"\n    title=\"Eco-Stay \u2022 4\u20136 Days\"><\/button>\n\n  <button class=\"host-circle city city-land seven\"\n    data-lat=\"6.22879\" data-lng=\"-75.21184\"\n    style=\"background-image:url('http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/12\/Screenshot_20240706_061611_PowerPoint.jpg');\"\n    title=\"Eco-Stay \u2022 7 Days\"><\/button>\n\n  <button class=\"host-circle city city-food month\"\n    data-lat=\"6.22879\" data-lng=\"-75.21184\"\n    style=\"background-image:url('http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/12\/Screenshot_20240706_061611_PowerPoint.jpg');\"\n    title=\"Eco-Stay \u2022 1 Month\"><\/button>\n\n  <!-- MANSIONS (red) -->\n  <button class=\"host-circle avatar avatar-exchange one\"\n    data-lat=\"6.24203\" data-lng=\"-75.22696\"\n    style=\"background-image:url('http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/12\/Screenshot_20240706_061611_PowerPoint.jpg');\"\n    title=\"Mansions \u2022 1\u20133 Days\"><\/button>\n\n  <button class=\"host-circle avatar avatar-socialize five\"\n    data-lat=\"6.24203\" data-lng=\"-75.22696\"\n    style=\"background-image:url('http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/12\/Screenshot_20240706_061057_PowerPoint-1.jpg');\"\n    title=\"Mansions \u2022 4\u20136 Days\"><\/button>\n\n  <button class=\"host-circle avatar avatar-events seven\"\n    data-lat=\"6.24203\" data-lng=\"-75.22696\"\n    style=\"background-image:url('http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/12\/Screenshot_20240706_061611_PowerPoint.jpg');\"\n    title=\"Mansions \u2022 7 Days\"><\/button>\n\n  <button class=\"host-circle Avatara avatar-tc month\"\n    data-lat=\"6.24203\" data-lng=\"-75.22696\"\n    style=\"background-image:url('http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/12\/Screenshot_20240821_175227_Instagram.jpg');\"\n    title=\"Mansions \u2022 1 Month\"><\/button>\n<\/div>\n\n<!-- HOST CIRCLES \u2014 JS (Accommodations) -->\n<script>\n  \/* Show only the requested key, e.g., 'highrise-one' *\/\n  function showHostButtons(suboption){\n  loadLevel8Hosts(suboption);\n}\n\n  \/\/ dbl-tap \/ dbl-click to favorite (uses your existing toggleFavorite)\n  document.addEventListener('DOMContentLoaded', () => {\n    document.querySelectorAll('#hostButtons .host-circle').forEach(btn => {\n      btn.addEventListener('dblclick', (e) => {\n        e.preventDefault();\n\n        \/\/ \u2705 Get the specific key like \"heli-around\" \/ \"yacht-goto\"\n        const id = [...btn.classList].find(c =>\n          c.includes('-') &&\n          !['host-circle','around','goto','emergency','adventure'].includes(c)\n        );\n\n        if (!id) {\n          console.warn(\"No favorite id found for button:\", btn.className);\n          return;\n        }\n\n        \/\/ background-image: url(\"...\") or url('...')\n        const bg = btn.style.backgroundImage || '';\n        const img = bg.startsWith('url(')\n          ? bg.slice(4, -1).replace(\/^[\"']|[\"']$\/g, '')\n          : '';\n\n        const lat = parseFloat(btn.dataset.lat);\n        const lng = parseFloat(btn.dataset.lng);\n\n        if (typeof toggleFavorite === 'function') {\n          toggleFavorite(id, img, lat, lng);\n        } else {\n          console.warn(\"toggleFavorite() is not defined yet.\");\n        }\n      });\n    });\n  });\n\n\n\n  \/* Center the map when any host circle is clicked *\/\n  document.addEventListener('click', function (e) {\n    const btn = e.target.closest('#hostButtons .host-circle');\n    if (!btn) return;\n\n    const lat = parseFloat(btn.dataset.lat);\n    const lng = parseFloat(btn.dataset.lng);\n    if (!Number.isFinite(lat) || !Number.isFinite(lng)) return;\n\n    if (typeof window.focusOnHost === 'function') {\n      focusOnHost(lat, lng);\n      return;\n    }\n\n    if (window.ggMap && window.google) {\n      const pos = new google.maps.LatLng(lat, lng);\n      ggMap.setCenter(pos);\n      ggMap.setZoom(15);\n      new google.maps.Marker({ position: pos, map: ggMap });\n    }\n  });\n<\/script>\n<script>\nasync function loadLevel8Hosts(suboption){\n\n  const fd = new FormData();\n  fd.append(\"action\", \"ggg_l8_get_inventory\");\n\n  const res = await fetch(\"\/GGG\/wp-admin\/admin-ajax.php\", {\n    method: \"POST\",\n    credentials: \"same-origin\",\n    body: fd\n  });\n\n  const data = await res.json();\n  if(!data.success) return;\n\n  const items = data.data.items || [];\n\n  const filtered = items.filter(item =>\n    item.suboptionKey === suboption &&\n    item.status === \"active\"\n  );\n\n  const wrap = document.getElementById(\"hostButtons\");\n  if(!wrap) return;\n\n  wrap.innerHTML = \"\";\n\n  if(!filtered.length){\n    wrap.style.display = \"none\";\n    return;\n  }\n\n  const positions = [\"one\",\"five\",\"seven\",\"month\"];\n\n  filtered.forEach((item, index) => {\n    const btn = document.createElement(\"button\");\n    btn.className = \"host-circle \" + positions[index % 4];\n    btn.style.backgroundImage = `url('${item.imageUrl || \"\"}')`;\n    btn.dataset.lat = item.lat || \"\";\n    btn.dataset.lng = item.lng || \"\";\n    btn.title = item.name || \"Level 8 Item\";\n\n    btn.addEventListener(\"dblclick\", function(e){\n      e.preventDefault();\n      if(typeof toggleFavorite === \"function\"){\n        toggleFavorite(item.id, item.imageUrl, item.lat, item.lng);\n      }\n    });\n\n    wrap.appendChild(btn);\n  });\n\n  wrap.style.display = \"flex\";\n  wrap.style.pointerEvents = \"auto\";\n}\n<\/script>\n\n\n\n<!-- ==========================================================\nRENT BEFORE OWNING \u2014 HOST CIRCLES POPUP (CONNECTED)\n\u2705 Opens ONLY when clicking a host circle\n\u2705 Keeps your map focus logic (still centers map)\n\u2705 Interval \/ Coins \/ City Card \/ Avatar content\n\u2705 Sends request to Godsgalaxygame@gmail.com via mailto (invoice later)\n\u2705 Premium glass UI + mobile safe\n========================================================== -->\n\n<style>\n  \/* ===== Popup Overlay ===== *\/\n  #rboPopupOverlay{\n    position:fixed; inset:0;\n    display:none;\n    align-items:center;\n    justify-content:center;\n    z-index:9999999;\n    background:\n      radial-gradient(circle at 12% 0%, rgba(0,255,255,.20), transparent 55%),\n      radial-gradient(circle at 88% 100%, rgba(255,0,100,.12), transparent 60%),\n      rgba(0,0,0,.88);\n    opacity:0;\n    transform:scale(1.02);\n    transition:opacity .22s ease, transform .22s ease;\n    font-family: Orbitron, system-ui, sans-serif !important;\n    padding: 18px;\n  }\n  #rboPopupOverlay.rbo-open{\n    opacity:1;\n    transform:scale(1);\n  }\n\n  \/* ===== Popup Panel ===== *\/\n  #rboPopup{\n    width:min(920px, 94vw);\n    max-height:min(82vh, 760px);\n    overflow:hidden;\n    border-radius:24px;\n    border:1px solid rgba(255,255,255,.16);\n    background: linear-gradient(135deg, rgba(10,12,18,.92), rgba(18,18,26,.80));\n    box-shadow:\n      0 0 60px rgba(0,255,255,.14),\n      0 0 120px rgba(255,0,100,.10);\n    position:relative;\n  }\n\n  \/* top glow line *\/\n  #rboPopup::before{\n    content:\"\";\n    position:absolute; left:0; right:0; top:0; height:2px;\n    background: linear-gradient(90deg, transparent, rgba(0,255,255,.65), rgba(255,0,100,.45), transparent);\n    opacity:.9;\n    pointer-events:none;\n  }\n\n  \/* ===== Header ===== *\/\n  .rboHead{\n    display:flex;\n    align-items:center;\n    justify-content:space-between;\n    gap:14px;\n    padding:16px 16px 10px;\n  }\n  .rboTitleWrap{\n    display:flex; align-items:center; gap:12px;\n    min-width:0;\n  }\n  .rboIcon{\n    width:46px; height:46px; border-radius:14px;\n    border:1px solid rgba(255,255,255,.18);\n    background: radial-gradient(circle at 30% 30%, rgba(0,255,255,.25), rgba(0,0,0,.65));\n    box-shadow: 0 0 22px rgba(0,255,255,.18);\n    overflow:hidden;\n    flex:0 0 auto;\n  }\n  .rboIcon img{\n    width:100%; height:100%;\n    object-fit:cover;\n    opacity:.95;\n    transform: scale(1.02);\n  }\n  .rboTitle{\n    color:#fff;\n    font-weight:900;\n    letter-spacing:.08em;\n    text-transform:uppercase;\n    font-size:13px;\n    margin:0;\n    white-space:nowrap;\n    overflow:hidden;\n    text-overflow:ellipsis;\n  }\n  .rboSub{\n    color:rgba(255,255,255,.70);\n    font-size:12px;\n    margin:3px 0 0;\n    line-height:1.2;\n  }\n\n  .rboClose{\n    width:44px; height:44px;\n    border-radius:14px;\n    border:1px solid rgba(255,255,255,.16);\n    background: rgba(0,0,0,.35);\n    color:#fff;\n    cursor:pointer;\n    box-shadow: 0 0 18px rgba(0,255,255,.10);\n  }\n  .rboClose:hover{ transform: scale(1.03); }\n\n  \/* ===== Body ===== *\/\n  .rboBody{\n    padding: 12px 16px 16px;\n    display:grid;\n    grid-template-columns: 1.15fr .85fr;\n    gap:14px;\n  }\n  .rboCard{\n    border-radius:20px;\n    border:1px solid rgba(255,255,255,.14);\n    background: linear-gradient(135deg, rgba(255,255,255,.06), rgba(0,0,0,.28));\n    box-shadow: 0 0 28px rgba(0,255,255,.10);\n    padding:14px;\n    overflow:hidden;\n  }\n  .rboCard h4{\n    margin:0 0 8px;\n    color:#fff;\n    font-size:12px;\n    letter-spacing:.08em;\n    text-transform:uppercase;\n  }\n  .rboP{\n    margin:0;\n    color:rgba(255,255,255,.78);\n    font-size:13px;\n    line-height:1.35;\n  }\n\n  .rboGrid{\n    display:grid;\n    grid-template-columns: 1fr 1fr;\n    gap:10px;\n    margin-top:10px;\n  }\n  .rboChip{\n    padding:10px 10px;\n    border-radius:16px;\n    border:1px solid rgba(255,255,255,.14);\n    background: rgba(0,0,0,.26);\n    color:#fff;\n    font-size:12px;\n    display:flex;\n    justify-content:space-between;\n    gap:10px;\n  }\n  .rboChip b{ font-weight:900; letter-spacing:.02em; }\n  .rboChip span{ opacity:.8; }\n\n  .rboActions{\n    display:flex;\n    flex-direction:column;\n    gap:10px;\n  }\n  .rboBtn{\n    width:100%;\n    border-radius:18px;\n    padding:12px 12px;\n    border:1px solid rgba(255,255,255,.18);\n    background: rgba(0,0,0,.30);\n    color:#fff;\n    font-weight:800;\n    letter-spacing:.06em;\n    text-transform:uppercase;\n    font-size:12px;\n    cursor:pointer;\n    box-shadow: 0 0 22px rgba(0,255,255,.10);\n  }\n  .rboBtn:hover{ transform: translateY(-1px); }\n  .rboBtnPrimary{\n    background: linear-gradient(135deg, rgba(0,255,255,.22), rgba(255,0,100,.12));\n    border-color: rgba(0,255,255,.35);\n  }\n  .rboTiny{\n    margin-top:10px;\n    font-size:11px;\n    color:rgba(255,255,255,.60);\n    line-height:1.35;\n  }\n\/* \u2705 Make ONLY the LEFT content area scrollable (premium + mobile safe) *\/\n#rboPopup .rboBody .rboCard:first-child{\n  max-height: calc(82vh - 120px);   \/* header space + padding *\/\n  overflow-y: auto;\n  overscroll-behavior: contain;\n  -webkit-overflow-scrolling: touch;\n  padding-right: 10px;             \/* room for scrollbar *\/\n}\n\n\/* Optional: premium scrollbar *\/\n#rboPopup .rboBody .rboCard:first-child::-webkit-scrollbar{\n  width: 6px;\n}\n#rboPopup .rboBody .rboCard:first-child::-webkit-scrollbar-thumb{\n  background: linear-gradient(180deg, rgba(0,255,255,.45), rgba(255,0,100,.35));\n  border-radius: 10px;\n}\n@media (max-width: 860px){\n  #rboPopup{\n    max-height: 88vh;              \/* a bit taller on mobile *\/\n  }\n  #rboPopup .rboBody .rboCard:first-child{\n    max-height: calc(88vh - 260px); \/* leaves room for Request card\/buttons *\/\n  }\n}\n\n\n  \/* Mobile *\/\n  @media (max-width: 860px){\n    .rboBody{ grid-template-columns:1fr; }\n  }\n<\/style>\n\n<!-- ===== Popup Markup ===== -->\n<div id=\"rboPopupOverlay\" aria-hidden=\"true\">\n  <div id=\"rboPopup\" role=\"dialog\" aria-modal=\"true\">\n    <div class=\"rboHead\">\n      <div class=\"rboTitleWrap\">\n        <div class=\"rboIcon\"><img id=\"rboHeroImg\" alt=\"\" \/><\/div>\n        <div style=\"min-width:0\">\n          <p class=\"rboTitle\" id=\"rboTitle\">Rent Before Owning<\/p>\n          <p class=\"rboSub\" id=\"rboSub\">Choose an option to request your invoice.<\/p>\n        <\/div>\n      <\/div>\n      <button class=\"rboClose\" id=\"rboCloseBtn\" type=\"button\">\u2715<\/button>\n    <\/div>\n\n    <div class=\"rboBody\">\n      <div class=\"rboCard\">\n        <h4 id=\"rboLeftHead\">Details<\/h4>\n        <p class=\"rboP\" id=\"rboDescription\"><\/p>\n\n        <div class=\"rboGrid\" id=\"rboPriceGrid\"><\/div>\n\n        <div class=\"rboTiny\" id=\"rboFinePrint\">\n          This is a request \u2014 you will receive an invoice later by email. No payment is processed on this screen.\n        <\/div>\n      <\/div>\n\n      <div class=\"rboCard\">\n        <h4>Request<\/h4>\n        <div class=\"rboActions\">\n          <button class=\"rboBtn rboBtnPrimary\" id=\"rboEmailBtn\" type=\"button\">Send Request Email<\/button>\n          <button class=\"rboBtn\" id=\"rboCopyBtn\" type=\"button\">Copy Request Text<\/button>\n          <button class=\"rboBtn\" id=\"rboCloseBtn2\" type=\"button\">Close<\/button>\n        <\/div>\n        <div class=\"rboTiny\" id=\"rboRequestPreview\"><\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/div>\n\n<script>\n(function(){\n  const OVERLAY = document.getElementById('rboPopupOverlay');\n  const HEROIMG = document.getElementById('rboHeroImg');\n  const TITLE   = document.getElementById('rboTitle');\n  const SUB     = document.getElementById('rboSub');\n  const LHEAD   = document.getElementById('rboLeftHead');\n  const DESC    = document.getElementById('rboDescription');\n  const GRID    = document.getElementById('rboPriceGrid');\n  const PREV    = document.getElementById('rboRequestPreview');\n  const EMAIL   = document.getElementById('rboEmailBtn');\n  const COPY    = document.getElementById('rboCopyBtn');\n  const CLOSE1  = document.getElementById('rboCloseBtn');\n  const CLOSE2  = document.getElementById('rboCloseBtn2');\n\n  let currentPayload = null;\n\n  function getSignedName(){\n    \/\/ tries to read your visible \"Signed in: Edward\" label\n    const label = [...document.querySelectorAll('*')]\n      .find(el => (el.textContent || '').trim().startsWith('Signed in:'));\n    if(label){\n      return (label.textContent || '').replace('Signed in:','').trim();\n    }\n    \/\/ fallback: common localStorage patterns (safe if not present)\n    return localStorage.getItem('gggUserName') ||\n           localStorage.getItem('gggSignedInName') ||\n           localStorage.getItem('signedInName') ||\n           '';\n  }\n\n  function parseBgUrl(styleBg){\n    const bg = styleBg || '';\n    if(!bg.includes('url(')) return '';\n    return bg.slice(bg.indexOf('url(') + 4).replace(')','').replace(\/^[\"']|[\"']$\/g,'').trim();\n  }\n\n  function detectSide(btn){\n    const cl = btn.classList;\n    if(cl.contains('interv')) return 'intervals';\n    if(cl.contains('coins'))  return 'coins';\n    if(cl.contains('city'))   return 'citycard';\n    if(cl.contains('avatar')) return 'avatar';\n    return 'unknown';\n  }\n\n  function detectPick(btn){\n    const cl = btn.classList;\n    \/\/ Intervals\n    if(cl.contains('interv-1day')) return '1 Day';\n    if(cl.contains('interv-3day')) return '3 Days';\n    if(cl.contains('interv-5day')) return '5 Days';\n    if(cl.contains('interv-1wk'))  return '1 Week';\n\n    \/\/ Coins (examples)\n    if(cl.contains('coins-te'))       return 'Coins \u2022 Travel Essentials';\n    if(cl.contains('coins-points'))   return 'Coins \u2022 Points';\n    if(cl.contains('coins-exchange')) return 'Coins \u2022 Exchange';\n    if(cl.contains('coins-eco'))      return 'Coins \u2022 Eco-Club';\n\n    \/\/ City Card (examples)\n    if(cl.contains('city-air'))   return 'City Card \u2022 Air Hours';\n    if(cl.contains('city-water')) return 'City Card \u2022 Water Hours';\n    if(cl.contains('city-land'))  return 'City Card \u2022 Boat Hours';\n    if(cl.contains('city-food'))  return 'City Card \u2022 Food Credits';\n\n    \/\/ Avatar (examples)\n    if(cl.contains('avatar-exchange'))   return 'Avatar \u2022 Exchange';\n    if(cl.contains('avatar-socialize'))  return 'Avatar \u2022 Socialize';\n    if(cl.contains('avatar-events'))     return 'Avatar \u2022 Events';\n    if(cl.contains('avatar-tc'))         return 'Avatar \u2022 Travel Club';\n\n    \/\/ fallback by placement\n    if(cl.contains('one'))   return 'Option A';\n    if(cl.contains('five'))  return 'Option B';\n    if(cl.contains('seven')) return 'Option C';\n    if(cl.contains('month')) return 'Option D';\n    return 'Option';\n  }\n\n  function buildContent(side, pick){\n    \/\/ You said: \"put some prices I can change later\"\n    \/\/ So these are placeholders \u2014 you can edit anytime.\n    const content = {\n      title: '',\n      sub: 'Request goes to Godsgalaxygame@gmail.com \u2014 you invoice later.',\n      head: '',\n      desc: '',\n      prices: []\n    };\n\n    if(side === 'intervals'){\n      content.title = 'Rent Before Owning \u2022 Intervals';\n      content.head  = 'Intervals (Rent Before Buying)';\n      content.desc  = `You selected: ${pick}. This is the exit program \u2014 rent first, then buy when ready. We will review your request and send an invoice.`;\n      content.prices = [\n        {k:'Service', v: pick},\n        {k:'Deposit', v:'$99 (placeholder)'},\n        {k:'Total',   v:'$499 (placeholder)'},\n        {k:'Timing',  v:'Invoice within 24h'}\n      ];\n      return content;\n    }\n\n    if(side === 'coins'){\n      content.title = 'Rent Before Owning \u2022 Coins';\n      content.head  = 'Coins Bundle';\n      content.desc  = `You selected: ${pick}. Choose a coins bundle big enough for your options on this side of the cube. We\u2019ll invoice you for the bundle you request.`;\n      content.prices = [\n        {k:'Bundle',  v: pick},\n        {k:'Coins',   v:'5,000 (placeholder)'},\n        {k:'Total',   v:'$199 (placeholder)'},\n        {k:'Validity',v:'12 months'}\n      ];\n      return content;\n    }\n\n    if(side === 'citycard'){\n      content.title = 'Rent Before Owning \u2022 City Card';\n      content.head  = 'City Card Hours';\n      content.desc  = `You selected: ${pick}. This is where they buy Air \/ Water \/ Boat Hours + credits (Food, etc.) for the City Card.`;\n      content.prices = [\n        {k:'Category', v: pick},\n        {k:'Hours',    v:'10 hours (placeholder)'},\n        {k:'Total',    v:'$299 (placeholder)'},\n        {k:'Valid',    v:'12 months'}\n      ];\n      return content;\n    }\n\n    if(side === 'avatar'){\n      content.title = 'Rent Before Owning \u2022 Avatar';\n      content.head  = 'Avatar (1 Year)';\n      content.desc  = `You selected: ${pick}. This is the 1-year avatar upgrade used to socialize \/ Travel Club \/ events.`;\n      content.prices = [\n        {k:'Plan',   v: pick},\n        {k:'Term',   v:'1 year'},\n        {k:'Total',  v:'$149 (placeholder)'},\n        {k:'Start',  v:'On invoice payment'}\n      ];\n      return content;\n    }\n\n    content.title = 'Rent Before Owning';\n    content.head  = 'Details';\n    content.desc  = `You selected: ${pick}.`;\n    content.prices = [{k:'Selected', v: pick}];\n    return content;\n  }\n\n  function openPopupFromBtn(btn){\n    const side = detectSide(btn);\n    const pick = detectPick(btn);\n\n    const img  = parseBgUrl(btn.style.backgroundImage);\n    if(img){\n      HEROIMG.src = img;\n      HEROIMG.style.display = 'block';\n    }else{\n      HEROIMG.removeAttribute('src');\n      HEROIMG.style.display = 'none';\n    }\n\n    const c = buildContent(side, pick);\n\n    TITLE.textContent = c.title;\n    SUB.textContent   = c.sub;\n    LHEAD.textContent = c.head;\n    DESC.textContent  = c.desc;\n\n    GRID.innerHTML = '';\n    (c.prices || []).forEach(row=>{\n      const div = document.createElement('div');\n      div.className = 'rboChip';\n      div.innerHTML = `<b>${row.k}<\/b><span>${row.v}<\/span>`;\n      GRID.appendChild(div);\n    });\n\n    const name = getSignedName();\n    const lat  = btn.dataset.lat || '';\n    const lng  = btn.dataset.lng || '';\n    const titleAttr = btn.getAttribute('title') || '';\n\n    const reqText =\n`RENT BEFORE OWNING \u2014 REQUEST\nName: ${name || '(not provided)'}\nSide: ${side}\nSelection: ${pick}\nCircle Title: ${titleAttr}\nLocation: ${lat && lng ? (lat + ',' + lng) : '(n\/a)'}\nNotes: Please send invoice.`;\n\n    PREV.textContent = reqText;\n\n    currentPayload = {\n      side, pick,\n      name,\n      reqText\n    };\n\n    \/\/ open\n    OVERLAY.style.display = 'flex';\n    requestAnimationFrame(()=> OVERLAY.classList.add('rbo-open'));\n    document.body.style.overflow = 'hidden';\n  }\n\n  function closePopup(){\n    OVERLAY.classList.remove('rbo-open');\n    setTimeout(()=>{\n      OVERLAY.style.display = 'none';\n      document.body.style.overflow = '';\n    }, 200);\n  }\n\n  \/\/ Close actions\n  CLOSE1.addEventListener('click', closePopup);\n  CLOSE2.addEventListener('click', closePopup);\n  OVERLAY.addEventListener('click', (e)=>{\n    if(e.target === OVERLAY) closePopup();\n  });\n  document.addEventListener('keydown', (e)=>{\n    if(e.key === 'Escape' && OVERLAY.style.display === 'flex') closePopup();\n  });\n\n  \/\/ Email + Copy\n  EMAIL.addEventListener('click', ()=>{\n    if(!currentPayload) return;\n    const subject = encodeURIComponent(`Rent Before Owning Request \u2014 ${currentPayload.side} \u2014 ${currentPayload.pick}`);\n    const body    = encodeURIComponent(currentPayload.reqText);\n    window.location.href = `mailto:Godsgalaxygame@gmail.com?subject=${subject}&body=${body}`;\n  });\n\n  COPY.addEventListener('click', async ()=>{\n    if(!currentPayload) return;\n    try{\n      await navigator.clipboard.writeText(currentPayload.reqText);\n      COPY.textContent = 'Copied \u2705';\n      setTimeout(()=> COPY.textContent = 'Copy Request Text', 1100);\n    }catch(err){\n      alert('Copy failed \u2014 you can manually select and copy the text in the preview.');\n    }\n  });\n\n  \/* ==========================================================\n  CONNECT POPUP TO YOUR HOST CIRCLES\n  Opens on single click ONLY for #hostButtons .host-circle\n  Keeps your existing map focus behavior too\n  ========================================================== *\/\n  document.addEventListener('click', function(e){\n    const btn = e.target.closest('#hostButtons .host-circle');\n    if(!btn) return;\n\n    \/\/ 1) open premium popup\n    openPopupFromBtn(btn);\n\n    \/\/ 2) keep your map behavior (center\/zoom\/marker)\n    const lat = parseFloat(btn.dataset.lat);\n    const lng = parseFloat(btn.dataset.lng);\n    if (Number.isFinite(lat) && Number.isFinite(lng)) {\n      if (typeof window.focusOnHost === 'function') {\n        window.focusOnHost(lat, lng);\n      } else if (window.ggMap && window.google) {\n        const pos = new google.maps.LatLng(lat, lng);\n        ggMap.setCenter(pos);\n        ggMap.setZoom(15);\n        new google.maps.Marker({ position: pos, map: ggMap });\n      }\n    }\n  }, true);\n\n})();\n<\/script>\n\n\n\n&#8211; AVATAR &#8211;>\n<div id=\"avatarContainer\" onclick=\"showAvatarCloud()\" \n     style=\"position:fixed; bottom:80px; right:20px; z-index:9999; cursor:pointer; display:none;\">\n  <img decoding=\"async\" src=\"http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/07\/Screenshot_20231118-120724_Instagram-scaled.jpg\" \n       style=\"width:180px; height:auto; border-radius: 50% \/ 30%; object-fit: cover; box-shadow: 0 0 12px aqua; filter: invert(100%) contrast(120%) brightness(110%);\">\n<\/div>\n\n<!-- CLOUD BUBBLE -->\n<div id=\"avatarCloud\" style=\"position:fixed; bottom:310px; right:30px; max-width:250px; background:rgba(0,0,0,0.7); \n     color:white; font-family:Orbitron, sans-serif; font-size:12px; line-height:16px; border-radius:20px 20px 20px 0px; \n     padding:14px 16px; box-shadow:0 0 15px aqua; display:none; z-index:9999; text-align:center;\n     border: 1px solid aqua;\">\n  <div id=\"avatarCloudMsg\">Loading&#8230;<\/div>\n  <div style=\"margin-top:10px;\">\n    <button onclick=\"acceptAvatarSuggestion()\" style=\"background:lime; color:black; border:none; padding:6px 10px; font-weight:bold;\">Yes<\/button>\n    <button onclick=\"dismissAvatarCloud()\" style=\"background:aqua; color:white; border:none; padding:6px 10px; font-weight:bold;\">No<\/button>\n  <\/div>\n  <div style=\"position:absolute; bottom:-18px; right:10px; width:0; height:0; border-left:10px solid transparent; \n              border-right:10px solid transparent; border-top:18px solid rgba(0,255,255,0.6); filter:blur(0.5px);\">\n  <\/div>\n<\/div>\n\n<!-- MOBILE ASSISTANT BUTTON -->\n<div id=\"avatarMobileBtn\" onclick=\"toggleMobileAvatar()\" style=\"display:none;\">\n  \ud83d\udc64 Assistant\n<\/div>\n\n<!-- ESTILOS -->\n<style>\n  #avatarMobileBtn {\n    position: fixed;\n    bottom: 18px;\n    right: 18px;\n    z-index: 9999;\n    background: rgba(0, 0, 0, 0.7);\n    color: white;\n    font-family: Orbitron, sans-serif;\n    font-size: 13px;\n    padding: 10px 14px;\n    border: 2px solid aqua;\n    border-radius: 14px;\n    box-shadow: 0 0 12px aqua;\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    gap: 8px;\n  }\n\n  @media (min-width: 769px) {\n    #avatarMobileBtn {\n      display: none !important;\n    }\n  }\n\n  @media (max-width: 768px) {\n    #avatarContainer {\n      bottom: 30px !important;\n      right: 90px !important;\n      width: 100px !important;\n      display: none;\n      pointer-events: none;\n    }\n\n    #avatarContainer img {\n      width: 100%;\n      height: auto;\n      border-radius: 50% \/ 30%;\n      object-fit: cover;\n      filter: grayscale(0%) brightness(1.1) contrast(1.2);\n      box-shadow: 0 0 12px aqua;\n    }\n  }\n\n  @media (min-width: 769px) {\n    #avatarContainer {\n      pointer-events: auto;\n    }\n  }\n<\/style>\n\n<!-- L\u00d3GICA -->\n<script>\n  const entertainmentQuestions = [\n    \"Ready to see what\u2019s out there today?\",\n    \"Want entertainment options nearby?\",\n    \"Looking for something fun to do?\",\n    \"Need ideas for your free time?\",\n    \"Want something exciting tonight?\"\n  ];\n\n  const gastronomyQuestions = [\n    \"Want to see gastronomy options nearby?\",\n    \"Ready to have dinner tonight?\",\n    \"Would you like some brunch spots?\",\n    \"Hungry for something special?\",\n    \"Looking for restaurants around you?\"\n  ];\n\n  function showAvatarCloud(forcedType = null) {\n    const hour = new Date().getHours();\n    const type = forcedType || (hour % 2 === 0 ? \"gastronomy\" : \"entertainment\");\n    const question = (type === \"gastronomy\" ? gastronomyQuestions : entertainmentQuestions)[Math.floor(Math.random() * 5)];\n\n    document.getElementById(\"avatarCloudMsg\").innerText = question;\n    document.getElementById(\"avatarCloud\").style.display = \"block\";\n  }\n\n  function acceptAvatarSuggestion() {\n    dismissAvatarCloud();\n    alert(\"\u2705 Showing Aries recommendations near you...\");\n  }\n\n  function dismissAvatarCloud() {\n    document.getElementById(\"avatarCloud\").style.display = \"none\";\n  }\n\n  \/\/ \ud83d\udcbb Show avatar automatically after 3 seconds (desktop only)\n  function showAvatarAssistant() {\n    const avatar = document.getElementById(\"avatarContainer\");\n    if (window.innerWidth > 768) {\n      avatar.style.display = \"block\";\n      avatar.style.pointerEvents = \"auto\";\n    }\n  }\n  setTimeout(showAvatarAssistant, 3000);\n\n  \/\/ \ud83d\udcf1 Toggle mobile avatar on\/off\n  let avatarVisible = false;\n  function toggleMobileAvatar() {\n    const avatar = document.getElementById(\"avatarContainer\");\n    const btn = document.getElementById(\"avatarMobileBtn\");\n\n    if (!avatarVisible) {\n      avatar.style.display = \"block\";\n      avatar.style.pointerEvents = \"auto\";\n      showAvatarCloud();\n      btn.innerHTML = \"\u274c Close\";\n    } else {\n      avatar.style.display = \"none\";\n      avatar.style.pointerEvents = \"none\";\n      dismissAvatarCloud();\n      btn.innerHTML = \"\ud83d\udc64 Assistant\";\n    }\n\n    avatarVisible = !avatarVisible;\n  }\n\n  \/\/ \ud83d\udcf1 Show mobile button on load\n  window.addEventListener(\"load\", () => {\n    if (window.innerWidth <= 768) {\n      document.getElementById(\"avatarMobileBtn\").style.display = \"flex\";\n    }\n  });\n<\/script>\n\n\n\n<style>\nhtml.cityCardActive, body.cityCardActive{\n  margin:0!important;\n  padding:0!important;\n  overflow:hidden!important;\n  background:#000!important;\n}\n\n#cityCardOverlay{\n  display:none;\n  position:fixed;\n  inset:0;\n  z-index:2147483647;\n  background:#000;\n  color:white;\n  font-family:Arial,sans-serif;\n}\n\nbody.cityCardActive #cityCardOverlay{display:block;}\n\n#cityCardScrollArea{\n  position:fixed;\n  inset:0;\n  overflow:hidden;\n  background:#000;\n}\n\n#cityCardWorld{\n  position:relative;\n  width:100vw;\n  height:100vh;\n  min-width:100vw;\n}\n\n#cityCardBgImage{\n  width:100%;\n  height:100%;\n  object-fit:cover;\n  display:block;\n}\n\n.ccTopBack{\n  position:fixed;\n  top:18px;\n  left:18px;\n  z-index:30;\n  border:1px solid rgba(255,255,255,.3);\n  background:rgba(0,0,0,.45);\n  color:#fff;\n  border-radius:999px;\n  padding:10px 16px;\n  cursor:pointer;\n  backdrop-filter:blur(10px);\n}\n\n#cityCardSignInHotspot{\n  position:absolute;\n  top:10%;\n  left:6%;\n  width:12%;\n  height:12%;\n  background:transparent;\n  border:0;\n  cursor:pointer;\n  z-index:20;\n}\n\n\/* LIVE DATA *\/\n.ccData{\n  position:absolute;\n  z-index:10;\n  text-shadow:0 0 12px currentColor;\n  letter-spacing:.08em;\n}\n\n#ccOwnerName{\n  top:16%;\n  left:12%;\n  font-size:clamp(13px,2vw,26px);\n  font-weight:800;\n}\n\n#ccWalletType{\n  top:30%;\n  left:15%;\n  font-size:clamp(42px,7vw,92px);\n  font-weight:900;\n}\n\n#ccWalletLabel{\n  top:53%;\n  left:15%;\n  font-size:clamp(14px,2vw,30px);\n}\n\n#ccBalance{\n  top:27%;\n  right:15%;\n  font-size:clamp(38px,6vw,88px);\n  font-weight:900;\n}\n\n#ccValue{\n  top:44%;\n  right:19%;\n  font-size:clamp(18px,3vw,44px);\n}\n\n#ccUnit{\n  top:58%;\n  right:16%;\n  font-size:clamp(12px,1.8vw,24px);\n  border:1px solid currentColor;\n  border-radius:999px;\n  padding:6px 16px;\n}\n\n#ccStatus{\n  top:17%;\n  right:34%;\n  font-size:clamp(11px,1.5vw,20px);\n}\n\n#ccLastUpdate{\n  top:17%;\n  right:13%;\n  font-size:clamp(10px,1.4vw,18px);\n}\n\n\/* COLOR STATES *\/\n#cityCardWorld.bc{color:#00f0ff;}\n#cityCardWorld.air{color:#ffffff;}\n#cityCardWorld.aqua{color:#008cff;}\n#cityCardWorld.gastro{color:#00ff88;}\n#cityCardWorld.land{color:#ffd166;}\n#cityCardWorld.vip{color:#a855f7;}\n#cityCardWorld.vault{color:#4f46e5;}\n\n.ccTabs{\n  position:fixed;\n  left:50%;\n  bottom:22px;\n  transform:translateX(-50%);\n  z-index:30;\n  display:flex;\n  gap:8px;\n  flex-wrap:wrap;\n  justify-content:center;\n}\n\n.ccTabs button{\n  border:1px solid rgba(255,255,255,.28);\n  background:rgba(0,0,0,.5);\n  color:#fff;\n  border-radius:999px;\n  padding:10px 14px;\n  cursor:pointer;\n  backdrop-filter:blur(10px);\n}\n\n.ccTabs button.active{\n  border-color:currentColor;\n  color:currentColor;\n  box-shadow:0 0 18px currentColor;\n}\n\n#cityCardWorld::after{\n  content:\"\";\n  position:absolute;\n  inset:0;\n  pointer-events:none;\n  z-index:4;\n  background:\n    radial-gradient(circle at 72% 45%, currentColor 0%, transparent 16%),\n    linear-gradient(90deg, transparent 45%, currentColor 70%, transparent 92%);\n  opacity:.18;\n  mix-blend-mode:screen;\n  filter:blur(10px);\n}\n\n\/* LOGIN POPUP *\/\n#ccLoginPopup{\n  display:none;\n  position:fixed;\n  inset:0;\n  z-index:40;\n  background:rgba(0,0,0,.76);\n  align-items:center;\n  justify-content:center;\n  padding:20px;\n}\n\n#ccLoginPopup.show{display:flex;}\n\n.ccLoginBox{\n  width:min(92vw,420px);\n  background:linear-gradient(145deg,#10121f,#000);\n  border:1px solid rgba(255,255,255,.25);\n  border-radius:26px;\n  padding:24px;\n  box-shadow:0 0 40px rgba(0,240,255,.22);\n}\n\n.ccLoginBox h2{margin:0 0 10px;}\n.ccLoginBox p{color:rgba(255,255,255,.75);line-height:1.5;}\n\n.ccLoginBox a,\n.ccLoginBox button{\n  display:block;\n  width:100%;\n  margin-top:12px;\n  text-align:center;\n  border-radius:999px;\n  padding:13px;\n  font-weight:900;\n  text-decoration:none;\n}\n\n.ccLoginBox a{\n  background:#00f0ff;\n  color:#001014;\n}\n\n.ccLoginBox button{\n  background:transparent;\n  color:white;\n  border:1px solid rgba(255,255,255,.3);\n}\n\n\/* MOBILE: FORCE THE CARD TO BE LANDSCAPE INSIDE THE PHONE *\/\n@media (max-width:768px) and (orientation:portrait){\n\n  #cityCardScrollArea{\n    position:fixed !important;\n    inset:0 !important;\n    overflow:hidden !important;\n    background:#000 !important;\n  }\n\n  #cityCardWorld{\n    position:absolute !important;\n    width:100vh !important;\n    height:100vw !important;\n    min-width:100vh !important;\n    min-height:100vw !important;\n    left:50% !important;\n    top:50% !important;\n    transform:translate(-50%, -50%) rotate(90deg) !important;\n    transform-origin:center center !important;\n  }\n\n  #cityCardBgImage{\n    width:100% !important;\n    height:100% !important;\n    object-fit:cover !important;\n    object-position:center center !important;\n  }\n\n  .ccTopBack{\n    top:18px !important;\n    left:18px !important;\n    z-index:80 !important;\n  }\n\n  .ccTabs{\n    position:absolute !important;\n    left:50% !important;\n    bottom:8% !important;\n    transform:translateX(-50%) !important;\n    width:auto !important;\n    flex-wrap:nowrap !important;\n    gap:8px !important;\n    z-index:50 !important;\n  }\n\n  .ccTabs button{\n    font-size:12px !important;\n    padding:9px 12px !important;\n  }\n\n  \/* FIX DATA POSITIONS *\/\n  #ccOwnerName{\n    top:18% !important;\n    left:14% !important;\n  }\n\n  #ccWalletType{\n    top:42% !important;\n    left:23% !important;\n  }\n\n  #ccWalletLabel{\n    top:54% !important;\n    left:23% !important;\n  }\n\n  #ccBalance{\n    top:32% !important;\n    right:16% !important;\n  }\n\n  #ccValue{\n    top:45% !important;\n    right:20% !important;\n  }\n\n  #ccUnit{\n    top:55% !important;\n    right:17% !important;\n  }\n\n  #ccStatus{\n    top:18% !important;\n    right:34% !important;\n  }\n\n  #ccLastUpdate{\n    top:18% !important;\n    right:13% !important;\n  }\n}\n\n\/* MOBILE LANDSCAPE: NORMAL CARD, NO ROTATION *\/\n@media (max-width:900px) and (orientation:landscape){\n\n  #cityCardScrollArea{\n    position:fixed !important;\n    inset:0 !important;\n    overflow:hidden !important;\n    background:#000 !important;\n  }\n\n  #cityCardWorld{\n    position:relative !important;\n    width:100vw !important;\n    height:100vh !important;\n    min-width:100vw !important;\n    min-height:100vh !important;\n    left:auto !important;\n    top:auto !important;\n    transform:none !important;\n  }\n\n#cityCardBgImage{\n  width:100%;\n  height:100%;\n  object-fit:cover;\n  object-position:center center;\n  transform:scale(.95); \/* smaller = zoom out, bigger = zoom in *\/\n  transform-origin:center center;\n  display:block;\n}\n\n  .ccTabs{\n    position:fixed !important;\n    left:50% !important;\n    bottom:18px !important;\n    transform:translateX(-50%) !important;\n    flex-wrap:nowrap !important;\n    z-index:80 !important;\n  }\n\n  .ccTabs button{\n    font-size:14px !important;\n    padding:9px 14px !important;\n  }\n\n  #ccOwnerName{\n    top:17% !important;\n    left:16% !important;\n  }\n\n  #ccWalletType{\n  top:30%;\n  left:16%;\n  font-size:clamp(42px,7vw,92px);\n  font-weight:900;\n}\n\n  #ccWalletLabel{\n  top:53%;\n  left:16%;\n}\n\n  #ccBalance{\n    top:27% !important;\n    right:17% !important;\n  }\n\n  #ccValue{\n    top:43% !important;\n    right:20% !important;\n  }\n\n  #ccUnit{\n    top:55% !important;\n    right:17% !important;\n  }\n\n  #ccStatus{\n    top:18% !important;\n    right:34% !important;\n  }\n\n  #ccLastUpdate{\n    top:18% !important;\n    right:13% !important;\n  }\n}\n\n<\/style>\n\n<div id=\"cityCardOverlay\">\n  <button class=\"ccTopBack\" onclick=\"ccBack()\">\u2190 Back<\/button>\n\n  <div id=\"cityCardScrollArea\">\n    <div id=\"cityCardWorld\" class=\"bc\">\n\n      <img decoding=\"async\" id=\"cityCardBgImage\" src=\"http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2026\/04\/b34153a7-5227-4179-80b4-ec7c182a0cc8.png\" alt=\"City Card\">\n\n      <button id=\"cityCardSignInHotspot\" onclick=\"ccOpenLogin()\"><\/button>\n\n      <div id=\"ccOwnerName\" class=\"ccData\">Guest Member<\/div>\n      <div id=\"ccWalletType\" class=\"ccData\">BC<\/div>\n      <div id=\"ccWalletLabel\" class=\"ccData\">Bliss Coin<\/div>\n      <div id=\"ccBalance\" class=\"ccData\">0.00<\/div>\n      <div id=\"ccValue\" class=\"ccData\">$0.00<\/div>\n      <div id=\"ccUnit\" class=\"ccData\">BCC<\/div>\n      <div id=\"ccStatus\" class=\"ccData\">ACTIVE<\/div>\n      <div id=\"ccLastUpdate\" class=\"ccData\">--\/--\/----<\/div>\n\n    <\/div>\n  <\/div>\n\n  <div class=\"ccTabs\">\n    <button class=\"active\" onclick=\"ccSetMode('bc', this)\">BC<\/button>\n    <button onclick=\"ccSetMode('air', this)\">Air<\/button>\n    <button onclick=\"ccSetMode('aqua', this)\">Aqua<\/button>\n    <button onclick=\"ccSetMode('gastro', this)\">Gastro<\/button>\n    <button onclick=\"ccSetMode('land', this)\">Land<\/button>\n    <button onclick=\"ccSetMode('vip', this)\">VIP<\/button>\n    <button onclick=\"ccSetMode('vault', this)\">Vault<\/button>\n  <\/div>\n<\/div>\n\n<div id=\"ccLoginPopup\">\n  <div class=\"ccLoginBox\">\n    <h2>Activate City Card<\/h2>\n    <p>Sign in to connect your City Card to your Gods Galaxy Game account.<\/p>\n\n    <a href=\"\/GGG\/wp-login.php?redirect_to=\/GGG\/rent-before-buying\/?citycard=1\">\n      Sign In\n    <\/a>\n\n    <a href=\"\/GGG\/wp-login.php?action=register\">\n      Create Account\n    <\/a>\n\n    <button onclick=\"ccCloseLogin()\">Close<\/button>\n  <\/div>\n<\/div>\n\n<script>\n(function(){\n  const params = new URLSearchParams(window.location.search);\n\n  if(params.get(\"citycard\") === \"1\"){\n    document.documentElement.classList.add(\"cityCardActive\");\n    document.body.classList.add(\"cityCardActive\");\n    document.addEventListener(\"DOMContentLoaded\", ccLoadUserData);\n  }\n})();\n\nlet ccUserData = null;\nlet ccCurrentMode = \"bc\";\n\nconst ccModes = {\n  bc:{type:\"BC\", label:\"Bliss Coin\", unit:\"BCC\"},\n  air:{type:\"AIR\", label:\"Heli Time\", unit:\"HRS\"},\n  aqua:{type:\"AQUA\", label:\"Aquatics Time\", unit:\"HRS\"},\n  gastro:{type:\"GASTRO\", label:\"Chef Time\", unit:\"HRS\"},\n  land:{type:\"LAND\", label:\"Property Weeks\", unit:\"WKS\"},\n  vip:{type:\"VIP\", label:\"The Circle Access\", unit:\"VIP\"},\n  vault:{type:\"VAULT\", label:\"Private Owner Vault\", unit:\"KEY\"}\n};\n\nfunction ccLoadUserData(){\n  fetch('\/GGG\/wp-admin\/admin-ajax.php', {\n    method:'POST',\n    headers:{'Content-Type':'application\/x-www-form-urlencoded'},\n    body:'action=ggg_get_city_card_data'\n  })\n  .then(res => res.json())\n  .then(res => {\n    if(!res || !res.success || !res.data){\n      ccOpenLogin();\n      return;\n    }\n\n    ccUserData = res.data;\n\n    if(!ccUserData.logged_in){\n      ccOpenLogin();\n      return;\n    }\n\n    document.getElementById(\"ccOwnerName\").textContent =\n      ccUserData.user_name || \"City Card Member\";\n\n    document.getElementById(\"ccLastUpdate\").textContent =\n      ccUserData.last_update || \"--\/--\/----\";\n\n    ccSetMode(\"bc\", document.querySelector(\".ccTabs button\"));\n  })\n  .catch(() => {\n    ccOpenLogin();\n  });\n}\n\nfunction ccSetMode(mode, btn){\n  ccCurrentMode = mode;\n\n  const world = document.getElementById(\"cityCardWorld\");\n  world.className = mode;\n\n  document.querySelectorAll(\".ccTabs button\").forEach(b => b.classList.remove(\"active\"));\n  if(btn) btn.classList.add(\"active\");\n\n  const m = ccModes[mode];\n\n  document.getElementById(\"ccWalletType\").textContent = m.type;\n  document.getElementById(\"ccWalletLabel\").textContent = m.label;\n  document.getElementById(\"ccUnit\").textContent = m.unit;\n\n  if(!ccUserData || !ccUserData.logged_in){\n    document.getElementById(\"ccBalance\").textContent = \"0.00\";\n    document.getElementById(\"ccValue\").textContent = \"$0.00\";\n    return;\n  }\n\n  if(mode === \"vip\" || mode === \"vault\"){\n    document.getElementById(\"ccBalance\").textContent = \"LOCKED\";\n    document.getElementById(\"ccValue\").textContent = \"PRIVATE\";\n    return;\n  }\n\n  const balanceData = ccUserData.balances && ccUserData.balances[mode]\n    ? ccUserData.balances[mode]\n    : {balance:\"0.00\", value:\"$0.00\"};\n\n  document.getElementById(\"ccBalance\").textContent = balanceData.balance || \"0.00\";\n  document.getElementById(\"ccValue\").textContent = balanceData.value || \"$0.00\";\n}\n\nfunction ccOpenLogin(){\n  document.getElementById(\"ccLoginPopup\").classList.add(\"show\");\n}\n\nfunction ccCloseLogin(){\n  document.getElementById(\"ccLoginPopup\").classList.remove(\"show\");\n}\n\nfunction ccBack(){\n  window.location.href = \"\/GGG\/rent-before-buying\/\";\n}\n<\/script>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>\ud83d\udcab Rent B4 Buying \ud83d\udcb3 1 Day 3 Days 5 Days 1 Week Intervals Travel Essentials Points Exchange Eco Club Coins Air Water Land Food City Card Exchange Socialize Events Travel Club Avatar \ud83d\udcb3 Pay with Bliss Coin Enter your digital wallet #: Send payment to: HOST-WALLET-ADDRESS-123 Close \ud83e\uddca \ud83d\udc96 Sign In \/ Sign Up [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-3238","page","type-page","status-publish","hentry"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/godsgalaxygame.com\/GGG\/wp-json\/wp\/v2\/pages\/3238","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/godsgalaxygame.com\/GGG\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/godsgalaxygame.com\/GGG\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/godsgalaxygame.com\/GGG\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/godsgalaxygame.com\/GGG\/wp-json\/wp\/v2\/comments?post=3238"}],"version-history":[{"count":90,"href":"https:\/\/godsgalaxygame.com\/GGG\/wp-json\/wp\/v2\/pages\/3238\/revisions"}],"predecessor-version":[{"id":8248,"href":"https:\/\/godsgalaxygame.com\/GGG\/wp-json\/wp\/v2\/pages\/3238\/revisions\/8248"}],"wp:attachment":[{"href":"https:\/\/godsgalaxygame.com\/GGG\/wp-json\/wp\/v2\/media?parent=3238"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}