:root{--morado:#831E5F;--verde:#99BB1E}.element-form{display:grid;grid-template-columns:2fr 1fr 1fr 1.4fr auto auto auto;gap:10px;align-items:end}.element-grid,.element-picker{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px}.element-card,.element-option{border:2px solid transparent;background:#fff;border-radius:16px;padding:10px;text-align:center;box-shadow:0 5px 18px rgba(40,20,35,.08)}.element-card img,.element-option img{width:100%;height:105px;object-fit:contain}.element-card strong,.element-option strong{display:block;font-size:12px;color:#452039}.element-card small{display:block;color:#87909b;font-size:10px;margin:4px}.element-option{cursor:pointer}.element-option.selected{border-color:var(--verde);background:#f7fbe9}.type-choice{display:grid;grid-template-columns:1fr 1fr;gap:8px}.type-choice label{border:1px solid #ddd;border-radius:12px;padding:11px;cursor:pointer;background:#fff}.type-choice input{margin-right:6px}.station-preview{background:#f7fbe9;border:1px solid #dce9ad;border-radius:14px;padding:10px;text-align:center}.station-preview img{height:130px;max-width:100%;object-fit:contain}.player-bar{position:absolute;z-index:30;left:12px;right:12px;top:12px;display:flex;justify-content:space-between;pointer-events:none}.player-pill{pointer-events:auto;background:rgba(70,10,52,.86);color:#fff;border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(10px);border-radius:999px;padding:8px 12px;font-size:11px}.basket-btn{background:var(--verde);color:#3e1733;border:0;font-weight:900}.capture-modal{position:fixed;z-index:1000;inset:0;background:rgba(35,5,26,.72);display:grid;place-items:end center;padding:16px}.capture-sheet{width:min(520px,100%);background:#fff;border-radius:24px 24px 16px 16px;padding:20px;text-align:center}.capture-sheet img{height:180px;max-width:100%;object-fit:contain}.capture-sheet h2{color:var(--morado)}.capture-sheet button{width:100%;border:0;border-radius:14px;padding:14px;font-weight:900;margin-top:8px}.capture-primary{background:var(--verde);color:#351128}.capture-secondary{background:#f0e9ee;color:var(--morado)}.basket-drawer{position:fixed;z-index:1001;inset:0;background:#f7f3f6;color:#331128;overflow:auto;padding:18px}.basket-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.basket-item{background:#fff;border-radius:14px;padding:8px;text-align:center}.basket-item img{width:100%;height:90px;object-fit:contain}.guest-card{background:#fff;border-radius:18px;padding:16px;margin:12px 0}.user-start{position:absolute;z-index:40;inset:0;background:linear-gradient(180deg,#831E5F,#5d0d43);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px;text-align:center;color:#fff}.user-start .start-logo{width:150px;margin-bottom:16px}.user-start h1{font-size:29px;margin:6px 0}.user-start p{max-width:430px;line-height:1.5;color:#f1ddea}.cta-main{display:block;margin:24px auto 10px!important;width:min(330px,88vw)!important;min-height:58px!important;border-radius:18px!important;background:#99BB1E!important;color:#3b1530!important;font-size:17px!important;font-weight:900!important;box-shadow:0 12px 35px rgba(153,187,30,.35)}.start-links{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.start-links button{border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.08);color:#fff;border-radius:999px;padding:9px 13px}.hidden{display:none!important}@media(max-width:900px){.element-form{grid-template-columns:1fr 1fr}.element-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:560px){.element-form{grid-template-columns:1fr}.element-grid,.element-picker{grid-template-columns:repeat(3,1fr)}.element-card img,.element-option img{height:78px}.basket-grid{grid-template-columns:repeat(3,1fr)}}

/* =========================================
   AR COLLECTION MODE - CAPTURA CENTRADA
   ========================================= */

/* Tourist elements are image-only while exploring. */
.collectible-marker{
  width:128px!important;
  height:128px!important;
  min-width:0!important;
  max-width:none!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  overflow:visible!important;
  filter:drop-shadow(0 8px 10px rgba(0,0,0,.28));
  transition:filter .18s ease,opacity .16s ease!important;
}

.collectible-marker .pin{
  width:118px!important;
  height:118px!important;
  margin:0!important;
  padding:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  transform:none!important;
  display:grid!important;
  place-items:center!important;
}

.collectible-marker .pin img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  pointer-events:none!important;
  user-select:none!important;
}

.collectible-marker .label{
  display:none!important;
}

/* The centered element becomes tappable. */
.collectible-marker.capture-ready{
  cursor:pointer;
  filter:
    drop-shadow(0 0 8px rgba(153,187,30,.95))
    drop-shadow(0 8px 12px rgba(0,0,0,.32));
}

.collectible-marker.capture-ready .pin{
  animation:capturePulse 1.05s ease-in-out infinite;
}

@keyframes capturePulse{
  0%,100%{transform:scale(1)}
  50%{transform:scale(1.08)}
}

/* Central capture reticle. No tourism text is shown. */
.capture-reticle{
  position:absolute;
  z-index:24;
  left:50%;
  top:50%;
  width:104px;
  height:104px;
  transform:translate(-50%,-50%);
  pointer-events:none;
  opacity:.72;
  transition:opacity .18s ease,transform .18s ease;
}

.capture-reticle:before,
.capture-reticle:after,
.capture-reticle span:before,
.capture-reticle span:after{
  content:"";
  position:absolute;
  width:26px;
  height:26px;
  border-color:rgba(255,255,255,.88);
  border-style:solid;
}

.capture-reticle:before{
  left:0;top:0;border-width:3px 0 0 3px;border-radius:12px 0 0 0;
}
.capture-reticle:after{
  right:0;top:0;border-width:3px 3px 0 0;border-radius:0 12px 0 0;
}
.capture-reticle span:before{
  left:0;bottom:0;border-width:0 0 3px 3px;border-radius:0 0 0 12px;
}
.capture-reticle span:after{
  right:0;bottom:0;border-width:0 3px 3px 0;border-radius:0 0 12px 0;
}

.capture-reticle i{
  position:absolute;
  left:50%;
  top:50%;
  width:7px;
  height:7px;
  margin:-3.5px 0 0 -3.5px;
  border-radius:50%;
  background:rgba(255,255,255,.9);
}

.capture-reticle.ready{
  opacity:1;
  transform:translate(-50%,-50%) scale(1.08);
}

.capture-reticle.ready:before,
.capture-reticle.ready:after,
.capture-reticle.ready span:before,
.capture-reticle.ready span:after{
  border-color:#99BB1E;
}

.capture-reticle.ready i{
  background:#99BB1E;
  box-shadow:0 0 14px rgba(153,187,30,.9);
}

/* Station markers keep their informative label. */
.station-marker{
  max-width:160px!important;
}

.station-marker .pin{
  background:transparent!important;
  box-shadow:none!important;
  transform:none!important;
  width:90px!important;
  height:115px!important;
  margin:0 auto 4px!important;
}

.station-marker .pin img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
}

/* Score is revealed only AFTER successful capture. */
.capture-score{
  display:inline-block;
  margin:2px auto 8px;
  padding:8px 14px;
  border-radius:999px;
  background:#99BB1E;
  color:#351128;
  font-size:20px;
  font-weight:950;
  line-height:1;
}

@media(max-width:560px){
  .collectible-marker{
    width:116px!important;
    height:116px!important;
  }
  .collectible-marker .pin{
    width:108px!important;
    height:108px!important;
  }
  .capture-reticle{
    width:96px;
    height:96px;
  }
}


/* ===== CESTA INFERIOR PARA USUARIO GENERAL ===== */
.public-diagnostics-hidden{
  display:none!important;
}

.player-bar-account{
  justify-content:flex-end!important;
}

.public-basket-bar{
  position:absolute;
  z-index:36;
  left:10px;
  right:10px;
  bottom:max(10px,env(safe-area-inset-bottom));
  pointer-events:none;
}

.basket-bottom-main{
  pointer-events:auto;
  width:100%;
  min-height:68px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:10px;
  align-items:center;
  border:1px solid rgba(255,255,255,.28);
  border-radius:19px;
  padding:8px 11px;
  background:rgba(78,18,60,.90);
  color:#fff;
  backdrop-filter:blur(14px);
  box-shadow:0 8px 28px rgba(0,0,0,.20);
}

.basket-bottom-title{
  font-size:12px;
  font-weight:950;
  white-space:nowrap;
}

.basket-bottom-preview{
  min-width:0;
  display:flex;
  align-items:center;
  gap:4px;
  overflow:hidden;
}

.basket-mini-item{
  width:40px;
  height:40px;
  flex:0 0 40px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:#fff;
  overflow:hidden;
}

.basket-mini-item img{
  width:36px;
  height:36px;
  object-fit:contain;
  display:block;
}

.basket-mini-fallback{
  color:#831E5F;
  font-weight:900;
}

.basket-empty-mini{
  color:rgba(255,255,255,.70);
  font-size:11px;
}

.basket-bottom-count{
  font-size:10px;
  text-align:right;
  color:#e9dce5;
  white-space:nowrap;
}

.basket-bottom-count strong{
  display:block;
  color:#C6E34A;
  font-size:18px;
  line-height:1;
}

.basket-subtitle{
  color:#766573;
  margin-top:-8px;
}

.basket-grid{
  grid-template-columns:repeat(auto-fill,minmax(105px,1fr))!important;
}

.basket-item{
  display:flex;
  flex-direction:column;
  align-items:center;
  min-width:0;
  gap:5px;
}

.basket-item-image{
  width:100%;
  height:92px;
  display:grid;
  place-items:center;
}

.basket-item img{
  width:100%!important;
  height:88px!important;
  object-fit:contain!important;
  display:block!important;
}

.basket-item strong{
  font-size:12px;
  line-height:1.15;
  color:#4c213e;
  word-break:break-word;
}

.basket-item small{
  font-size:10px;
  color:#7d727a;
}

.basket-empty{
  grid-column:1/-1;
  text-align:center;
  padding:30px 12px;
}

@media(max-width:480px){
  .basket-bottom-main{
    grid-template-columns:auto 1fr auto;
    gap:7px;
    padding:7px 9px;
  }

  .basket-mini-item{
    width:35px;
    height:35px;
    flex-basis:35px;
  }

  .basket-mini-item img{
    width:32px;
    height:32px;
  }

  .basket-bottom-preview .basket-mini-item:nth-child(n+5){
    display:none;
  }
}
/* =========================================================
   INTERFAZ PÚBLICA RESTAURADA
   La mira conserva EXACTAMENTE su diseño original de arriba.
   Este bloque solo organiza usuario, cesta y zona turística.
   ========================================================= */

:root{
  --tourism-safe-height:112px;
}

/* Barra turística: zona visual exclusiva inferior. */
.tourism-places-bar{
  position:absolute;
  z-index:50;
  left:0;
  right:0;
  bottom:0;
  min-height:var(--tourism-safe-height);
  padding:13px 14px calc(13px + env(safe-area-inset-bottom));
  color:#fff;
  background:
    linear-gradient(
      180deg,
      rgba(49,35,83,.18) 0%,
      rgba(43,31,75,.76) 34%,
      rgba(40,28,68,.90) 100%
    );
  backdrop-filter:blur(7px);
  -webkit-backdrop-filter:blur(7px);
  box-shadow:0 -8px 28px rgba(0,0,0,.08);
  overflow:hidden;
  pointer-events:auto;
}

.tourism-places-bar.hidden{
  display:none!important;
}

.tourism-places-title{
  margin-bottom:9px;
  font-size:13px;
  line-height:1.15;
  font-weight:900;
  text-shadow:0 2px 7px rgba(0,0,0,.24);
}

.tourism-places-content{
  min-height:28px;
  font-size:12px;
  line-height:1.35;
}

.tourism-places-empty{
  display:flex;
  align-items:center;
  color:rgba(255,255,255,.88);
}

.tourism-places-list{
  display:flex;
  gap:8px;
  overflow-x:auto;
  padding-bottom:2px;
  scrollbar-width:none;
  overscroll-behavior-x:contain;
}

.tourism-places-list::-webkit-scrollbar{
  display:none;
}

.tourism-place-card{
  flex:0 0 156px;
  min-height:48px;
  display:flex;
  align-items:center;
  gap:7px;
  padding:5px 7px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:11px;
  background:rgba(255,255,255,.09);
  color:#fff;
  text-align:left;
  backdrop-filter:blur(7px);
  -webkit-backdrop-filter:blur(7px);
}

.tourism-place-card img,
.tourism-place-fallback{
  width:38px;
  height:38px;
  flex:0 0 38px;
  border-radius:8px;
  object-fit:cover;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.12);
}

.tourism-place-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.tourism-place-copy strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:10px;
  line-height:1.1;
}

.tourism-place-copy small{
  color:#dfe9bd;
  font-size:9px;
  font-weight:800;
}

/*
  Usuario: ubicación superior derecha.
  Conservamos la estética de píldora original.
*/
.tele-ar-ui-active .player-bar-account{
  position:absolute!important;
  z-index:55!important;
  top:max(12px,env(safe-area-inset-top))!important;
  left:auto!important;
  right:12px!important;
  width:auto!important;
  pointer-events:none!important;
}

.tele-ar-ui-active #playerBtn{
  pointer-events:auto!important;
  max-width:148px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  box-shadow:0 6px 20px rgba(0,0,0,.16);
}

/*
  Cesta: botón compacto debajo del usuario.
  Se reutiliza el botón REAL de la cesta para no romper su lógica.
*/
.tele-ar-ui-active .public-basket-bar{
  position:absolute!important;
  z-index:54!important;
  top:56px!important;
  right:12px!important;
  left:auto!important;
  bottom:auto!important;
  width:auto!important;
  pointer-events:none!important;
}

.tele-ar-ui-active .basket-bottom-main{
  pointer-events:auto!important;
  width:auto!important;
  min-width:92px!important;
  min-height:43px!important;
  grid-template-columns:auto auto!important;
  gap:7px!important;
  padding:7px 10px!important;
  border-radius:15px!important;
  background:rgba(78,18,60,.86)!important;
  box-shadow:0 6px 20px rgba(0,0,0,.16)!important;
}

.tele-ar-ui-active .basket-bottom-preview{
  display:none!important;
}

.tele-ar-ui-active .basket-bottom-title{
  font-size:10px!important;
}

.tele-ar-ui-active .basket-bottom-count{
  display:flex!important;
  align-items:center!important;
  gap:3px!important;
  font-size:0!important;
}

.tele-ar-ui-active .basket-bottom-count strong{
  display:block!important;
  font-size:14px!important;
}

/*
  La zona turística queda encima de marcadores/flecha por z-index,
  por lo que visualmente NADA del AR se encimará dentro de ella.
  No reducimos #arLayer: así NO alteramos el centro, proyección
  ni movimiento del motor AR.
*/
.tele-ar-ui-active .message{
  bottom:calc(var(--tourism-safe-height) + 14px)!important;
  z-index:51!important;
}

/* HUD antiguo nunca invade la zona turística. */
.tele-ar-ui-active .hud{
  bottom:calc(var(--tourism-safe-height) + 10px)!important;
}

/*
  IMPORTANTE:
  NO hay overrides para .capture-reticle.
  Se conservan 104x104 y 96x96 móvil del CSS original.
*/

@media(max-width:560px){
  :root{
    --tourism-safe-height:108px;
  }

  .tourism-places-bar{
    padding-left:12px;
    padding-right:12px;
  }

  .tourism-place-card{
    flex-basis:146px;
  }

  .tele-ar-ui-active .player-bar-account{
    right:10px!important;
  }

  .tele-ar-ui-active .public-basket-bar{
    right:10px!important;
  }

  .tele-ar-ui-active #playerBtn{
    max-width:132px;
  }
}
