/* ===========================================================
   SALAS DE ENSAYO — Mapa full-screen minimalista (Kinetics)
   Fiel a HomeMap.tsx (CARTO, pines gota, controles flot.)
   + Expanding Search Kinetics (abajo-derecha / móvil abajo-centro).
   Tema oscuro por defecto (sin switch, acordado con el usuario).
   + Preloader Equalizer Bars KINETICS (sin overlay oscuro).
   + Buscador: barra abajo, resultados ARRIBA de la barra.
   =========================================================== */

html,body{height:100%;margin:0}
/* Marco naranja de contorno de toda la pagina + capa negra exterior (efecto inmersivo) */
body::before{ /* capa negra exterior: oscurece lo que queda fuera del borde */
  content:"";
  position:fixed;inset:0;z-index:697;pointer-events:none;
  box-shadow:0 0 0 26px var(--graphite), 0 0 60px 26px rgba(0,0,0,.85);
}
body::after{ /* borde naranja grueso encima de todo (sin redondeo) */
  content:"";
  position:fixed;inset:0;z-index:700;pointer-events:none;
  border:6px solid var(--amber);
  box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--amber-deep) 70%,transparent),
             0 0 0 1px rgba(0,0,0,.6);
}
#map{
  position:fixed;inset:0;
  width:100vw;height:100vh;
  background:var(--graphite-2);
  z-index:0;
}

/* Tiles CARTO claro (mapa limpio, sin filtro oscuro que lo tape) */
#map .leaflet-tile-pane{transition:filter .4s ease}

/* ---------- Contextual Dock inferior (Kinetics) ---------- */
.dock{
  position:fixed;bottom:22px;left:0;right:0;margin:0 auto;width:max-content;max-width:calc(100vw - 48px);
  z-index:660;
  display:flex;align-items:center;justify-content:center;gap:10px;
  padding:8px;border-radius:100px;
  background:color-mix(in srgb,var(--graphite) 92%,transparent);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  border:1px solid var(--line);
  box-shadow:0 18px 40px -22px rgba(0,0,0,.85);
  transition:gap .35s var(--glide);
}
.dock-btn{
  pointer-events:auto;
  width:46px;height:46px;border-radius:50%;flex:0 0 46px;
  display:grid;place-items:center;
  font-size:22px;font-weight:700;line-height:1;
  color:var(--bone);cursor:pointer;
  background:color-mix(in srgb,var(--card) 80%,transparent);
  border:1px solid var(--line);
  box-shadow:0 8px 18px -12px rgba(0,0,0,.7);
  transition:transform .25s var(--spring),background .2s ease,color .2s ease,
             opacity .3s var(--glide),width .35s var(--glide),
             margin .35s var(--glide),filter .3s var(--glide);
}
.dock-btn svg{width:20px;height:20px}
.dock-btn:hover{background:var(--amber);color:var(--graphite);transform:scale(1.06)}
.dock-btn:active{transform:scale(.92)}

/* Al abrir el buscador, los laterales colapsan para no superponerse */
.dock.search-open .dock-btn{
  width:0;flex-basis:0;margin:0;padding:0;
  opacity:0;pointer-events:none;
  border-width:0;box-shadow:none;
}
.dock.search-open{gap:0}
/* Al buscar, el fondo del dock (contenedor de botones) desaparece: sin blur ni borde,
   para que no quede superpuesto sobre el mapa. Solo queda la barra + resultados. */
.dock.search-open{
  background:transparent;
  -webkit-backdrop-filter:none;backdrop-filter:none;
  border-color:transparent;
  box-shadow:none;
}

/* ---------- Search (vive como boton central del dock) ---------- */
.search-wrap{
  width:48px;flex:0 0 auto;transition:width .4s var(--glide);
  display:flex;flex-direction:column-reverse;align-items:stretch;
}
.search-wrap.open{width:min(440px,calc(100vw - 48px))}
.search-pill{
  width:48px;height:48px;border-radius:100px;overflow:hidden;
  display:flex;align-items:center;
  background:var(--amber);
  border:1px solid var(--amber-deep);
  box-shadow:0 14px 32px -18px rgba(0,0,0,.85);
  transition:width .4s var(--glide),background .25s ease,border-color .25s ease;
  flex-shrink:0;
}
.search-wrap.open .search-pill{width:100%;background:color-mix(in srgb,var(--graphite) 80%,transparent);border-color:var(--amber)}
.search-trigger{
  width:48px;height:48px;flex:0 0 48px;border:none;background:transparent;
  display:grid;place-items:center;color:var(--graphite);cursor:pointer;
}
.search-trigger svg{width:21px;height:21px}
.search-input{
  flex:1 1 auto;min-width:0;height:100%;border:none;background:transparent;
  color:var(--bone);font-family:var(--font-body);font-size:15px;font-weight:500;
  padding:0 4px;outline:none;
}
.search-input::placeholder{color:var(--bone-faint)}
.search-clear{
  width:40px;height:48px;flex:0 0 40px;border:none;background:transparent;
  color:var(--bone-dim);font-size:22px;line-height:1;cursor:pointer;
  opacity:0;pointer-events:none;transition:opacity .2s ease;
}
.search-wrap.open.has-text .search-clear{opacity:1;pointer-events:auto}
.search-wrap.open.has-text .search-trigger{display:none}

.search-list{
  flex:1 1 auto;min-width:0;
  width:100%;margin-bottom:10px;max-height:62vh;overflow-y:auto;
  background:var(--card);
  border:1px solid var(--line);border-radius:16px;
  box-shadow:0 24px 50px -26px rgba(0,0,0,.9);
  padding:8px;z-index:665;position:relative;
  animation:listIn .3s var(--glide);
}
@keyframes listIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.search-item{
  display:flex;align-items:flex-start;gap:10px;width:100%;
  padding:11px 12px;border-radius:11px;cursor:pointer;text-align:left;
  background:transparent;border:none;color:var(--bone);
  transition:background .15s ease;
}
.search-item:hover,.search-item.active{background:var(--card-2)}
.si-ava{
  flex:0 0 34px;width:34px;height:34px;border-radius:50%;
  display:grid;place-items:center;font-family:var(--font-display);font-weight:900;font-size:14px;
  color:var(--graphite);background:var(--amber);margin-top:2px;
}
/* Con logo, la imagen tapa la letra. Si la imagen no carga el `onerror` la saca del DOM y
   vuelve a verse la letra, que sigue debajo. */
.si-ava.con-logo,.pin-core.con-logo{position:relative;overflow:hidden}
.si-ava.con-logo img,.pin-core.con-logo img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:50%;
}
.si-main{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}
.si-name{font-family:var(--font-display);font-weight:800;font-size:14px;text-transform:uppercase;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.si-zone{font-size:12px;color:var(--bone-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.si-meta{display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex:0 0 auto}
.si-price{font-family:var(--font-display);font-weight:700;font-size:12px;color:var(--bone)}
.si-stars{display:inline-flex;gap:1px}
.si-stars svg{width:12px;height:12px}
.empty{
  padding:16px 12px;text-align:center;color:var(--bone-faint);font-size:13px;
}

/* ---------- Marca (EQ bars + Gradient Shimmer Text) ---------- */
.brand{
  position:absolute;top:16px;left:50%;transform:translateX(-50%);width:max-content;
  display:flex;align-items:center;gap:10px;
  pointer-events:none;user-select:none;
}
.brand-eq{
  display:flex;align-items:center;gap:3px;height:22px;
}
.brand-eq span{
  display:block;width:3px;height:100%;border-radius:3px;
  background:linear-gradient(180deg,var(--amber),var(--amber-deep));
  transform-origin:center bottom;
  animation:eq 1s ease-in-out infinite;
}
.brand-eq span:nth-child(1){animation-delay:0s}
.brand-eq span:nth-child(2){animation-delay:.18s}
.brand-eq span:nth-child(3){animation-delay:.36s}
.brand-eq span:nth-child(4){animation-delay:.54s}
.brand-eq span:nth-child(5){animation-delay:.72s}
.brand-shimmer{
  font-family:var(--font-display);font-weight:900;font-size:18px;
  letter-spacing:-.02em;text-transform:uppercase;line-height:1;
  background:linear-gradient(100deg,
    var(--bone-faint) 30%,
    var(--amber) 50%,
    var(--bone-faint) 70%);
  background-size:200% auto;
  -webkit-background-clip:text;background-clip:text;
  color:transparent;
  animation:text-shimmer 3s linear infinite;
  text-shadow:none;
}
@keyframes text-shimmer{to{background-position:-200% center}}

/* ---------- Botón de usuario ---------- */
.user-btn{
  pointer-events:auto;
  position:absolute;top:16px;right:16px;
  width:46px;height:46px;border-radius:50%;
  display:grid;place-items:center;
  color:var(--bone);
  background:color-mix(in srgb,var(--graphite) 78%,transparent);
  backdrop-filter:blur(12px);
  border:1px solid var(--line);
  box-shadow:0 12px 26px -16px rgba(0,0,0,.85);
  cursor:pointer;
  transition:transform .18s var(--spring),background .2s ease,color .2s ease,border-color .2s ease;
}
.user-btn svg{width:21px;height:21px}
.user-btn:hover{background:var(--amber);color:var(--graphite);border-color:var(--amber);transform:scale(1.06)}
.user-btn:active{transform:scale(.94)}
.user-btn.logged{background:var(--amber);color:var(--graphite);border-color:var(--amber)}

/* ---------- Modal de login / registro ---------- */
.auth-overlay{
  position:fixed;inset:0;z-index:900;
  display:flex;align-items:center;justify-content:center;padding:24px;
  background:rgba(6,6,8,.72);backdrop-filter:blur(6px);
  opacity:0;visibility:hidden;
  transition:opacity .35s var(--glide),visibility .35s;
}
.auth-overlay.open{opacity:1!important;visibility:visible!important}
.auth-card{
  position:relative;width:min(420px,100%);max-height:92vh;overflow:auto;
  background:linear-gradient(160deg,var(--card) 0%,var(--card-2) 100%);
  border:1px solid var(--line);border-radius:20px;
  box-shadow:var(--shadow-modal);
  padding:30px 26px 24px;
  transform:translateY(14px) scale(.98);
  transition:transform .4s var(--spring);
}
.auth-overlay.open .auth-card{transform:translateY(0) scale(1)}
.auth-close{
  position:absolute;top:14px;right:16px;
  width:34px;height:34px;border-radius:50%;
  border:1px solid var(--line);background:transparent;
  color:var(--bone-dim);font-size:22px;line-height:1;
  cursor:pointer;transition:background .2s,color .2s,border-color .2s;
}
.auth-close:hover{background:var(--card-2);color:var(--bone);border-color:var(--bone-faint)}
.auth-screen{display:flex;flex-direction:column;align-items:stretch;gap:14px;
  animation:authFade .3s var(--glide)}
.auth-screen[hidden]{display:none}
@keyframes authFade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.auth-logo{display:flex;justify-content:center;margin-bottom:6px}
.auth-logo .brand-eq{height:28px}
.auth-title{font-family:var(--font-display);font-weight:900;font-size:24px;letter-spacing:-.02em;text-transform:uppercase;color:var(--bone);margin:0;text-align:center}
.auth-lead{font-family:var(--font-body);font-size:14px;color:var(--bone-dim);text-align:center;margin:0 0 4px;line-height:1.45}
.auth-btn{
  width:100%;padding:13px;border:1px solid var(--line);
  border-radius:12px;cursor:pointer;
  font-family:var(--font-display);font-weight:800;font-size:14px;text-transform:uppercase;letter-spacing:-.01em;
  transition:transform .12s var(--spring),background .2s ease,color .2s ease,border-color .2s ease,box-shadow .12s ease;
}
.auth-btn.primary{
  background:var(--amber);color:var(--graphite);border-color:var(--amber);
  box-shadow:var(--shadow-key-lg);
}
.auth-btn.primary:hover{transform:translateY(-2px)}
.auth-btn.primary:active{transform:translateY(4px);box-shadow:var(--shadow-key-press)}
.auth-btn.ghost{
  background:transparent;color:var(--bone);
}
.auth-btn.ghost:hover{border-color:var(--amber);color:var(--amber)}
.auth-form{display:flex;flex-direction:column;gap:12px;margin-top:6px}
.auth-field{display:flex;flex-direction:column;gap:6px}
.auth-field span{
  font-family:var(--font-display);font-size:11px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--bone-faint);font-weight:700;
}
.auth-field input{
  width:100%;padding:12px 14px;border-radius:11px;
  background:var(--card-2);border:1px solid var(--line);color:var(--bone);
  font-family:var(--font-body);font-size:14px;font-weight:500;
  transition:border-color .25s ease,box-shadow .25s ease,background .25s ease;
}
.auth-field input::placeholder{color:var(--bone-faint);font-weight:500}
.auth-field input:focus{
  outline:none;border-color:var(--amber);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--amber) 22%,transparent);
  background:var(--card);
}
.auth-alt{font-family:var(--font-body);font-size:13px;color:var(--bone-dim);text-align:center;margin:6px 0 0}
.auth-alt a{color:var(--amber);text-decoration:none;font-weight:600}
.auth-alt a:hover{text-decoration:underline}

/* Tarjetas de tipo de registro */
.auth-type-card{
  display:flex;align-items:center;gap:14px;
  padding:16px;border-radius:14px;
  background:var(--card);border:1px solid var(--line);
  cursor:pointer;text-align:left;
  transition:transform .25s var(--glide),border-color .2s ease,background .2s ease;
}
.auth-type-card:hover{border-color:var(--amber);background:color-mix(in srgb,var(--amber) 6%,var(--card));transform:translateY(-2px)}
.auth-type-card .at-ico{
  width:44px;height:44px;flex:0 0 44px;border-radius:12px;
  display:grid;place-items:center;
  background:var(--card-2);border:1px solid var(--line);
  color:var(--amber);
}
.auth-type-card .at-ico svg{width:22px;height:22px}
.auth-type-card .at-body{display:flex;flex-direction:column;gap:2px;min-width:0}
.auth-type-card .at-body b{font-family:var(--font-display);font-weight:800;font-size:15px;color:var(--bone);text-transform:uppercase;letter-spacing:-.01em}
.auth-type-card .at-body small{font-family:var(--font-body);font-size:12.5px;color:var(--bone-dim);line-height:1.4}

/* Success check */
.auth-check{width:80px;height:80px;border-radius:50%;display:grid;place-items:center;margin:0 auto 6px;background:var(--card-2);border:1px solid var(--line)}
.auth-check svg{width:50px;height:50px}
.auth-check .ring{fill:none;stroke:var(--line);stroke-width:3;stroke-dasharray:151;stroke-dashoffset:151;transition:stroke-dashoffset .5s cubic-bezier(.65,0,.35,1),stroke .5s ease}
.auth-check .tick{fill:none;stroke:var(--ok);stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:28;stroke-dashoffset:28;transition:stroke-dashoffset .3s ease-out .4s}
.auth-check.done{background:color-mix(in srgb,var(--ok) 14%,transparent);border-color:color-mix(in srgb,var(--ok) 50%,transparent)}
.auth-check.done .ring{stroke:var(--ok);stroke-dashoffset:0}
.auth-check.done .tick{stroke-dashoffset:0}

/* ---------- Controles flotantes ---------- */
.map-ui{position:fixed;inset:0;z-index:600;pointer-events:none}
.ctrl-col{position:absolute;display:flex;flex-direction:column;gap:10px}
.ctrl-col.left{bottom:16px;left:16px}
.ctrl-col.right{top:16px;right:16px}

.ctrl{
  pointer-events:auto;
  width:44px;height:44px;border-radius:50%;
  display:grid;place-items:center;
  font-size:22px;font-weight:700;line-height:1;
  color:var(--bone);
  background:color-mix(in srgb,var(--graphite) 78%,transparent);
  backdrop-filter:blur(12px);
  border:1px solid var(--line);
  box-shadow:0 12px 26px -16px rgba(0,0,0,.85);
  cursor:pointer;
  transition:transform .18s var(--spring),background .2s ease,color .2s ease;
}
.ctrl svg{width:20px;height:20px}
.ctrl:hover{background:var(--amber);color:var(--graphite);transform:scale(1.06)}
.ctrl:active{transform:scale(.94)}
.ctrl.is-loading{animation:pulse 1s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.5}}

/* ---------- Pin Radar Pulse (Kinetics) ---------- */
.sala-pin{background:transparent;border:none}
.pin-pulse{
  position:relative;width:40px;height:40px;
  display:grid;place-items:center;
  --pin-color:var(--amber);
}
.pin-pulse .pin-wave{
  position:absolute;inset:0;margin:auto;
  width:24px;height:24px;border-radius:50%;
  border:2px solid var(--pin-color);
  animation:ping 2.4s cubic-bezier(0,0.4,0.2,1) infinite;
  pointer-events:none;
}
.pin-pulse .pin-wave:nth-child(2){animation-delay:0.8s}
.pin-pulse .pin-wave:nth-child(3){animation-delay:1.6s}
@keyframes ping{
  0%   { transform:scale(0.4); opacity:0.9; }
  100% { transform:scale(4.2); opacity:0; }
}
.pin-core{
  position:relative;z-index:2;
  width:28px;height:28px;border-radius:50%;
  display:grid;place-items:center;
  font-family:var(--font-display);font-weight:900;font-size:12px;
  color:var(--graphite);
  background:var(--pin-color);
  border:2px solid color-mix(in srgb,#fff 60%,transparent);
  box-shadow:0 4px 12px -3px rgba(0,0,0,.5);
  transition:transform .25s var(--spring),box-shadow .25s ease;
  pointer-events:auto;
  cursor:pointer;
}
/* Pin activo: el núcleo escala y brilla; el radar acelera */
.sala-pin.active .pin-core{
  transform:scale(1.25);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--pin-color) 40%,transparent),
             0 6px 16px -3px rgba(0,0,0,.55);
}
.sala-pin.active .pin-wave{
  animation-duration:1.6s;
  border-width:3px;
}
/* Pin del usuario (azul) */
.pin-pulse.user .pin-core{
  background:#5b8def;color:#fff;
  border-color:rgba(255,255,255,.8);
  width:24px;height:24px;
}

/* ---------- Popup minimalista ---------- */
.leaflet-popup-content-wrapper{
  background:var(--card);color:var(--bone);
  border:1px solid var(--line);border-radius:14px;
  box-shadow:0 22px 50px -28px rgba(0,0,0,.85);
}
.leaflet-popup-tip{background:var(--card);border:1px solid var(--line)}
.leaflet-popup-content{margin:0;width:240px!important;font-family:var(--font-body);overflow:visible}
.leaflet-container a.leaflet-popup-close-button{color:var(--bone-dim);padding:8px 8px 0 0}
.leaflet-popup-close-button{display:none}

.pop-gallery{background:var(--graphite-2);border-top-left-radius:14px;border-top-right-radius:14px}
.pop-gallery .mq-img{box-shadow:none}
.pop-gallery .mq-img img{height:118px;border-radius:8px}
.pop-body{padding:12px 14px 14px}
.pop-name{font-family:var(--font-display);font-weight:800;font-size:15px;text-transform:uppercase;letter-spacing:-.01em}
.pop-addr{color:var(--bone-dim);font-size:12px;margin-top:2px}
.pop-row{display:flex;align-items:center;gap:8px;margin-top:8px;flex-wrap:wrap}
.pop-price{font-family:var(--font-display);font-weight:700;font-size:13px}
.pop-stars{display:inline-flex;gap:1px}
.pop-stars svg{width:13px;height:13px}
.star-full{fill:var(--amber);stroke:var(--amber);stroke-width:1.4}
.star-half{fill:var(--amber);stroke:var(--amber);stroke-width:1.4;fill-opacity:.35}
.star-empty{fill:none;stroke:var(--bone-faint);stroke-width:1.4}
.pop-actions{display:flex;flex-direction:column;gap:6px;margin-top:11px}
.pop-btn{
  box-sizing:border-box;
  width:100%;padding:9px 12px;border-radius:9px;
  font-family:var(--font-display);font-weight:700;font-size:12px;text-align:center;
  text-decoration:none;cursor:pointer;
  transition:transform .15s var(--spring),filter .2s ease;
}
.pop-btn:hover{filter:brightness(1.08)}
.pop-btn:active{transform:scale(.97)}
.pop-btn.primary{background:var(--amber);color:var(--graphite);box-shadow:var(--shadow-key)}
.pop-btn.ghost{background:var(--card-2);color:var(--bone);border:1px solid var(--line)}

/* ---------- Modal de lugar ---------- */
.place-overlay{
  position:fixed;inset:0;z-index:800;
  background:rgba(6,6,8,.62);backdrop-filter:blur(4px);
  display:flex;align-items:center;justify-content:center;padding:20px;
  opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s;
}
.place-overlay.open{opacity:1;visibility:visible}
.place-card{
  position:relative;width:min(560px,100%);max-height:88vh;overflow:hidden;
  background:var(--card);border:1px solid var(--line);border-radius:18px;
  box-shadow:0 30px 70px -30px rgba(0,0,0,.9);
  display:flex;flex-direction:column;
  transform:translateY(14px) scale(.98);transition:transform .35s var(--spring);
}
.place-overlay.open .place-card{transform:translateY(0) scale(1)}
.place-close{
  position:absolute;top:12px;right:12px;z-index:2;
  width:34px;height:34px;border-radius:50%;border:1px solid var(--line);
  background:color-mix(in srgb,var(--graphite) 70%,transparent);color:var(--bone);
  font-size:20px;line-height:1;cursor:pointer;
}
/* ---------- Galería: Marquee Reveal (Kinetics) ---------- */
.place-gallery{margin:0;background:var(--graphite-2)}
.marquee-zone{
  position:relative;overflow:hidden;padding:12px 0;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
}
.marquee-track{
  display:flex;gap:8px;width:max-content;
  animation:marquee-scroll 30s linear infinite;
}
.marquee-zone:hover .marquee-track{animation-play-state:paused}
@keyframes marquee-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.mq-img{
  flex:0 0 auto;border:none;background:transparent;padding:0;cursor:pointer;
  line-height:0;border-radius:12px;overflow:hidden;
  box-shadow:0 8px 22px -16px rgba(0,0,0,.8);
  transition:transform .25s var(--spring);
}
.mq-img:hover{transform:scale(1.03)}
.mq-img img{display:block;height:160px;width:auto;object-fit:cover;background:var(--card-2)}
.place-body{padding:16px 18px 20px;overflow-y:auto}
.place-reserve{
  box-sizing:border-box;
  width:100%;margin:14px 0 6px;
  padding:12px 26px;border:none;border-radius:12px;cursor:pointer;
  font-family:var(--font-display);font-weight:800;font-size:15px;text-transform:uppercase;letter-spacing:-.01em;
  color:var(--graphite);background:var(--amber);
  box-shadow:var(--shadow-key-lg);
  transition:transform .12s var(--spring),box-shadow .12s var(--spring),filter .2s ease;
}
.place-reserve:hover{filter:brightness(1.05)}
.place-reserve:active{transform:translateY(4px);box-shadow:var(--shadow-key-press)}
.place-directions{
  box-sizing:border-box;
  display:block;width:100%;margin:0 0 2px;text-align:center;
  padding:10px 26px;border-radius:12px;cursor:pointer;text-decoration:none;
  font-family:var(--font-display);font-weight:800;font-size:14px;text-transform:uppercase;letter-spacing:-.01em;
  color:var(--bone);background:transparent;
  border:1px solid var(--line);
  transition:border-color .2s ease,background .2s ease,color .2s ease;
}
.place-directions:hover{border-color:var(--amber);color:var(--amber);background:color-mix(in srgb,var(--amber) 8%,transparent)}
.place-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.place-top h3{margin:0;font-family:var(--font-display);font-weight:800;font-size:20px;text-transform:uppercase;letter-spacing:-.01em}
.place-zone{color:var(--bone-dim);font-size:13px;margin-top:3px}
.place-rating{text-align:right;flex:0 0 auto}
.place-rating .stars{display:inline-flex;gap:1px}
.place-rating .stars svg{width:15px;height:15px}
.rating-num{display:block;font-size:12px;color:var(--bone-dim);margin-top:2px}
.place-row{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--line)}
.place-k{color:var(--bone-dim);font-size:13px}
.place-v{font-family:var(--font-display);font-weight:700;font-size:14px}
.place-reviews{margin-top:14px;display:flex;flex-direction:column;gap:12px}
.review{display:flex;gap:11px}
.r-ava{width:34px;height:34px;border-radius:50%;background:var(--card-2);border:1px solid var(--line);display:grid;place-items:center;font-family:var(--font-display);font-weight:800;color:var(--amber);flex:0 0 34px}
.review b{font-size:13px}
.review p{margin:3px 0 0;font-size:13px;color:var(--bone-dim)}
.mini-stars{display:inline-flex;gap:1px;margin-bottom:2px}
.mini-stars svg{width:12px;height:12px}

/* ---------- Lightbox ---------- */
.lb-overlay{
  position:fixed;inset:0;z-index:900;
  background:rgba(4,4,6,.9);display:flex;align-items:center;justify-content:center;flex-direction:column;padding:24px;
  opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s;
}
.lb-overlay.open{opacity:1;visibility:visible}
.lb-overlay img{max-width:92vw;max-height:80vh;border-radius:12px;box-shadow:0 30px 70px -30px rgba(0,0,0,.9)}
.lb-close{position:absolute;top:18px;right:20px;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:var(--card);color:var(--bone);font-size:24px;cursor:pointer}
#lbCaption{margin-top:14px;color:var(--bone-dim);font-family:var(--font-body);font-size:13px}

/* ---------- Toast ---------- */

/* Tema Leaflet base al estilo Kinetics */
.leaflet-bar a{background:var(--card);color:var(--bone);border-color:var(--line)}
.leaflet-bar a:hover{background:var(--card-2)}
.leaflet-control-attribution{
  background:color-mix(in srgb,var(--graphite) 70%,transparent)!important;
  color:var(--bone-faint)!important;font-size:10px;
}
.leaflet-control-attribution a{color:var(--bone-dim)!important}

@media(max-width:560px){
  .ctrl{width:40px;height:40px}
  .brand-shimmer{font-size:23px}
  .brand-eq{height:26px;gap:3px}
  .brand-eq span{width:4px}
  .dock{bottom:18px;max-width:calc(100vw - 36px)}
  .search-wrap.open{width:calc(100vw - 36px)}
}

/* ---------- Modal de bienvenida (1ra visita, a los 7s) ---------- */
.welcome{
  position:fixed;inset:0;z-index:900;
  display:grid;place-items:center;
  padding:24px;
  background:color-mix(in srgb,var(--graphite) 88%,transparent);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  opacity:0;visibility:hidden;
  transition:opacity .4s var(--glide),visibility .4s var(--glide);
}
.welcome.show{opacity:1;visibility:visible}
.welcome-card{
  width:min(480px,100%);
  background:linear-gradient(160deg,var(--card) 0%,var(--card-2) 100%);
  border:1px solid var(--line);border-radius:22px;
  box-shadow:var(--shadow-modal);
  padding:34px 30px 30px;
  text-align:center;
  transform:translateY(18px) scale(.98);
  transition:transform .45s var(--spring);
}
.welcome.show .welcome-card{transform:translateY(0) scale(1)}
.welcome-eq{height:34px;display:flex;align-items:flex-end;justify-content:center;gap:5px;margin-bottom:14px}
.welcome-eq span{
  width:6px;background:var(--amber);border-radius:3px;
  animation:eq 1.1s ease-in-out infinite;
}
.welcome-eq span:nth-child(1){height:40%;animation-delay:0s}
.welcome-eq span:nth-child(2){height:75%;animation-delay:.14s}
.welcome-eq span:nth-child(3){height:100%;animation-delay:.28s}
.welcome-eq span:nth-child(4){height:65%;animation-delay:.42s}
.welcome-eq span:nth-child(5){height:50%;animation-delay:.56s}
@keyframes eq{0%,100%{transform:scaleY(.35)}50%{transform:scaleY(1)}}
.welcome-title{
  font-family:var(--font-display);font-weight:900;font-size:30px;letter-spacing:-.02em;
  background:linear-gradient(100deg,var(--amber) 0%,#ffd089 50%,var(--amber) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  text-transform:uppercase;
}
.welcome-lead{
  font-family:var(--font-body);color:var(--bone-dim);
  font-size:15px;margin:8px 0 18px;line-height:1.45;
}
.welcome-list{
  list-style:none;text-align:left;margin:0 0 22px;padding:0;
  display:flex;flex-direction:column;gap:11px;
}
.welcome-list li{
  display:flex;gap:10px;align-items:flex-start;
  font-family:var(--font-body);font-size:14px;color:var(--bone);
  line-height:1.4;
}
.welcome-list .wi{
  flex:0 0 auto;margin-top:1px;
  font-family:var(--font-display);font-weight:800;font-size:12px;
  color:var(--amber);
}
.welcome-continue{
  box-sizing:border-box;
  width:100%;padding:13px 26px;border:none;border-radius:12px;cursor:pointer;
  font-family:var(--font-display);font-weight:800;font-size:15px;text-transform:uppercase;letter-spacing:-.01em;
  color:var(--graphite);background:var(--amber);
  box-shadow:var(--shadow-key-lg);
  transition:transform .12s ease,box-shadow .12s ease,filter .2s ease;
}
.welcome-continue:hover{filter:brightness(1.05)}
.welcome-continue:active{transform:translateY(4px);box-shadow:var(--shadow-key-press)}

/* ---------- Form "Dejá tu reseña" (modal de lugar) ---------- */
.rev-form{margin-top:16px;padding-top:14px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:9px}
.rev-form-title{font-family:var(--font-display);font-weight:800;font-size:13px;text-transform:uppercase;letter-spacing:.04em;color:var(--bone)}
.rev-stars{display:inline-flex;gap:3px}
.rev-star{background:none;border:0;padding:2px;cursor:pointer;line-height:0;transition:transform .15s var(--spring)}
.rev-star svg{width:19px;height:19px}
.rev-star .star-full{fill:var(--amber)}
.rev-star .star-empty{fill:none;stroke:var(--bone-faint);stroke-width:1.5}
.rev-star:hover{transform:scale(1.15)}
.rev-star:disabled{cursor:default;opacity:.6}
.rev-input{background:var(--card-2);border:1px solid var(--line);border-radius:10px;padding:9px 12px;font-family:var(--font-body);font-size:13px;color:var(--bone);width:100%;resize:vertical}
.rev-input:focus{outline:none;border-color:var(--amber)}
.rev-input::placeholder{color:var(--bone-faint)}
.rev-submit{align-self:flex-start;background:var(--amber);color:var(--on-amber,#1a1a1d);border:0;border-radius:100px;padding:9px 18px;font-family:var(--font-display);font-weight:800;font-size:13px;cursor:pointer;transition:filter .2s ease,transform .12s ease}
.rev-submit:hover{filter:brightness(1.06)}
.rev-submit:disabled{opacity:.55;cursor:default}
.rev-note{font-size:12.5px;color:var(--bone-dim)}

/* Bloque "necesitás cuenta", el que ve todo el que llega al mapa sin sesión. No tenía una
   sola regla: se pegaba a la última reseña sin separador, el texto salía en tamaño de
   párrafo y el botón era el del navegador (Arial gris con borde outset) en medio de una
   ficha oscura. Espeja a `.rev-form`, que es el mismo bloque para quien sí tiene sesión. */
.rev-gate{margin-top:16px;padding-top:14px;border-top:1px solid var(--line);display:flex;flex-direction:column;align-items:flex-start;gap:9px}
.rev-gate-txt{margin:0;font-size:12.5px;line-height:1.5;color:var(--bone-dim)}
.rev-gate-btn{align-self:flex-start;background:none;color:var(--amber);border:1px solid var(--amber);border-radius:100px;padding:9px 18px;font-family:var(--font-display);font-weight:800;font-size:13px;cursor:pointer;transition:background .2s ease,color .2s ease}
.rev-gate-btn:hover{background:var(--amber);color:var(--on-amber,#1a1a1d)}

/* Respuesta pública del dueño, dentro de la reseña. */
.review .r-reply{margin-top:7px;padding:7px 10px;border-left:2px solid var(--amber);background:color-mix(in srgb,var(--amber) 7%,transparent);border-radius:0 7px 7px 0;font-size:12.5px;line-height:1.5;color:var(--bone-dim)}
.review .r-reply b{color:var(--amber);font-weight:700}