
:root{
  --blanco:#FFFFFF; --cielo:#87CEEB; --verde:#43AA8B;
  --tinta:#10242C; --gris:#6E8592; --nube:#F3F8FA;
  --linea:rgba(16,36,44,.12);
  --sombra:0 1px 2px rgba(16,36,44,.04), 0 12px 32px rgba(16,36,44,.06);
  --font:"Helvetica Neue","HelveticaNeue",Helvetica,Arial,"Liberation Sans",sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:var(--font);
  -webkit-font-smoothing:antialiased;font-size:16px;line-height:1.5;}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--verde);outline-offset:3px;border-radius:2px}
img{display:block;max-width:100%}

.eyebrow{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--gris);margin:0}
.display{font-weight:200;letter-spacing:-.03em;line-height:.92;margin:0}
.screen{display:none}
/* Sólo la principal deja ver el cielo: el resto va sobre fondo blanco. */
#screen-aporte,#screen-deseos,#screen-registro,#screen-admin,#screen-stats,
#screen-subastas,#screen-fundaciones,#screen-eventos{
  position:relative;z-index:2;min-height:100dvh}
.muted{color:var(--gris)}

/* ---------- botones / campos ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:13px 20px;border-radius:10px;border:1px solid transparent;
  font-size:14.5px;font-weight:600;cursor:pointer;
  transition:background .15s,border-color .15s,color .15s,transform .1s}
.btn:active{transform:translateY(1px)}
.btn--primary{background:var(--verde);color:var(--blanco)}
.btn--primary:hover{background:#379479}
.btn--ghost{border-color:var(--linea);}
.btn--ghost:hover{border-color:var(--verde);color:var(--verde)}
.btn--cielo:hover{background:#6dbfe2}
.btn--block{width:100%}
.btn--congelado{opacity:.45;cursor:not-allowed;filter:grayscale(.5)}
.btn--sm{padding:9px 15px;font-size:13px;border-radius:8px}
.btn--xs{padding:6px 11px;font-size:12px;border-radius:8px}

.field{margin-bottom:14px}
.field label{display:block;font-size:11px;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--gris);margin-bottom:7px}
.field input,.field select,.field textarea{width:100%;padding:13px 14px;border:1px solid var(--linea);
  border-radius:10px;background:var(--blanco);font-size:15px;transition:border-color .15s,box-shadow .15s}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--verde);
  box-shadow:0 0 0 3px rgba(67,170,139,.14)}
.field textarea{resize:vertical;min-height:74px}
.field input[type=file]{padding:9px;font-size:13px}
.field input[type=number]{-moz-appearance:textfield}
.field input[type=number]::-webkit-outer-spin-button,
.field input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.field__moneda{display:block;margin-top:3px;font-weight:400;letter-spacing:.02em;text-transform:none;color:var(--gris);font-size:10.5px}
.pesos{position:relative;display:flex;align-items:center}
.pesos__signo{position:absolute;left:15px;font-size:16px;font-weight:600;color:var(--gris);pointer-events:none}
.pesos input{padding-left:38px !important;font-variant-numeric:tabular-nums}
.pesos input:focus + .pesos__signo,.pesos:focus-within .pesos__signo{color:var(--verde)}
.campo-bloqueado{cursor:not-allowed;}
.field__hint{font-size:12px;color:var(--gris);margin:6px 0 0}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}

/* ================= HOME ================= */
.brand{display:flex;align-items:center;gap:12px}
.brand__mark{width:26px;height:26px;border-radius:0;background:var(--cielo);position:relative;flex:none}
.brand__mark::after{content:"";position:absolute;inset:7px;border-radius:0;background:var(--verde)}
.brand__name{font-size:13px;font-weight:700;letter-spacing:.28em;text-transform:uppercase}
/* En el home el logo manda: cuadrado grande de esquinas rectas. */
.brand--grande{gap:20px}
.brand--grande .brand__mark{width:64px;height:64px}
.brand--grande .brand__mark::after{inset:17px}
.brand--grande .brand__name{font-size:26px;letter-spacing:.24em}
.creditos{display:flex;align-items:center;gap:10px;margin-top:auto;padding-top:34px;opacity:.28;
  transition:opacity .25s;text-decoration:none;width:fit-content}
.creditos:hover{opacity:.55}
.creditos span{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--tinta)}
.creditos img{width:132px;height:auto}
/* El bloque se apoya contra el borde interno: queda cerca del centro
   de la pantalla en vez de flotar al fondo a la derecha. */
.auth{width:100%;max-width:400px;margin:0 auto 0 0}
.linkish{background:none;border:0;padding:0;font-weight:600;cursor:pointer;
  text-decoration:underline;text-underline-offset:3px;}
.alert{font-size:13px;color:#B3261E;background:rgba(179,38,30,.07);padding:9px 12px;border-radius:8px;
  margin-bottom:14px;display:none}
.alert.is-on{display:block}

/* ================= APP ================= */
.topbar{position:sticky;top:0;z-index:40;background:var(--blanco);border-bottom:1px solid var(--linea)}
.topbar{background:var(--blanco)}
.topbar__row{max-width:1120px;margin:0 auto;padding:14px 24px;display:flex;align-items:center;
  justify-content:space-between;gap:20px}
.logo-perfil{background:none;border:0;padding:6px;cursor:pointer;line-height:0;
  transition:transform .15s,opacity .15s}
.logo-perfil:hover{opacity:.8}
.logo-perfil:active{transform:scale(.94)}
.logo-perfil__marca{display:block;width:36px;height:36px;object-fit:contain;
  filter:drop-shadow(0 0 10px rgba(103,232,249,.5))}
.topbar__user{display:flex;align-items:center;gap:12px;font-size:13px;color:var(--gris)}
.avatar{width:32px;height:32px;border-radius:50%;background:var(--cielo);color:var(--tinta);display:grid;
  place-items:center;font-size:12px;font-weight:700;flex:none;background-size:cover;background-position:center}
.avatar--lg{width:76px;height:76px;font-size:24px}
.seg{background:none;border:0;cursor:pointer;padding:18px 8px 16px;font-size:12px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--gris);transition:color .2s;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.seg:hover,.seg[aria-selected="true"]{color:var(--tinta)}
.seg--centro[aria-selected="true"]{color:var(--verde)}
.viewport{max-width:1120px;margin:0 auto;padding:0 24px;}
.panel__head{margin-bottom:22px}
.panel__title{font-size:clamp(28px,4.4vw,44px);font-weight:200;letter-spacing:-.03em;margin:6px 0 0}
.panel__note{color:var(--gris);font-size:14.5px;margin:10px 0 0;max-width:56ch}
.btn--grande{font-size:17px;padding:17px 42px;border-radius:12px}
.panel-donar{margin-top:18px;border:1px solid var(--linea);border-radius:16px;padding:26px 22px;
  display:grid;align-items:center;}
.panel-donar--dos{grid-template-columns:1fr 1fr;align-items:start}
.panel-donar__lado{min-width:0}
.panel-donar__centro{display:flex;justify-content:center}
.panel-donar__centro .btn{white-space:nowrap}
.panel-donar__sub{font-size:12.5px;color:var(--gris);margin:10px 0 0;text-align:center}
.titulazo--cielo{border-bottom-color:var(--verde)}
.titulazo--cielo h3{color:var(--cielo)}
.titulazo{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;
  margin:44px 0 20px;padding-bottom:14px;border-bottom:3px solid var(--cielo)}
.titulazo h3{font-size:clamp(28px,4vw,40px);font-weight:200;letter-spacing:-.03em;margin:0;}
.titulazo h3 b{font-weight:600}
.titulazo__nota{font-size:13px;color:var(--gris)}
.subhead{font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gris);display:flex;align-items:center;justify-content:space-between;gap:14px;}

/* ---- buscador ---- */
.buscador{position:relative;display:flex;align-items:center;margin-bottom:26px}
.buscador__icono{position:absolute;left:16px;width:17px;height:17px;pointer-events:none;}
.buscador input{width:100%;padding:14px 90px 14px 44px;border:1px solid var(--linea);border-radius:12px;
  background:var(--nube);font-size:15px;transition:border-color .15s,box-shadow .15s,background .15s}
.buscador input:focus{outline:none;border-color:var(--verde);background:var(--blanco);
  box-shadow:0 0 0 3px rgba(67,170,139,.14)}
.buscador__count{position:absolute;right:16px;font-size:12px;color:var(--gris);white-space:nowrap}

/* ---- buscador con sugerencias ---- */
.buscador-wrap{position:relative;margin-bottom:26px}
.buscador-wrap .buscador{margin-bottom:0}
.buscador__limpiar{position:absolute;right:14px;background:none;border:0;font-size:22px;line-height:1;
  color:var(--gris);cursor:pointer;padding:0 4px;transition:color .15s}
.buscador__limpiar:hover{color:var(--tinta)}
.sugerencias{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:30;background:var(--blanco);
  border:1px solid var(--linea);border-radius:14px;box-shadow:0 16px 40px rgba(16,36,44,.14);
  overflow:hidden;max-height:340px;overflow-y:auto}
.sug{display:flex;align-items:center;gap:13px;padding:12px 16px;cursor:pointer;border:0;width:100%;
  background:none;text-align:left;transition:background .12s}
.sug:hover,.sug.is-marcada{background:var(--nube)}
/* El avatar es un span: hay que excluirlo del flex:1 o se estira. */
.sug > span:not(.avatar){display:block;min-width:0;flex:1}
.sug .avatar{width:38px;height:38px;font-size:12px;flex:0 0 38px;border-radius:50%;
  background-size:cover;background-position:center;overflow:hidden}
.sug__n{display:block;font-size:14.5px;font-weight:600;letter-spacing:-.01em}
.sug__m{display:block;font-size:12px;color:var(--gris);margin-top:2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sug__match{background:rgba(135,206,235,.35);border-radius:3px}
.sug--top{border-bottom:1px solid var(--linea);background:rgba(67,170,139,.05)}
.sug__tag{margin-left:auto;font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--verde);white-space:nowrap}
.sug__vacio{padding:16px;font-size:13.5px;color:var(--gris);text-align:center}

/* ---- tarjetas de evento en carrusel ---- */
.ecard{border:1px solid var(--linea);border-radius:16px;overflow:hidden;background:var(--blanco);
  transition:border-color .18s,box-shadow .18s}
.ecard:hover{border-color:var(--cielo);box-shadow:var(--sombra)}
.ecard__img{height:180px;background-size:contain;background-repeat:no-repeat;background-position:center;
  background-color:var(--nube);background-image:linear-gradient(115deg,rgba(135,206,235,.45),rgba(67,170,139,.3))}
.ecard__body{padding:18px 20px 20px}
.ecard__fund{display:flex;align-items:center;gap:9px;font-size:12.5px;color:var(--gris)}
.ecard__fund .avatar{width:26px;height:26px;font-size:10px}
.ecard__fecha{font-size:13px;font-weight:700;color:var(--verde);letter-spacing:.04em;margin-top:12px}
.ecard__nombre{font-size:18px;font-weight:600;letter-spacing:-.02em;margin-top:4px}
.ecard__desc{font-size:13px;color:var(--gris);line-height:1.5;margin-top:6px}
.ecard__pie{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:16px}

/* ---- carrusel ---- */
.carrusel{display:flex;align-items:center;gap:10px}
.carrusel__viewport{flex:1;overflow-x:auto;overflow-y:hidden;padding:16px 0;
  scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;
  overscroll-behavior-x:contain}
.carrusel__viewport::-webkit-scrollbar{display:none}
.carrusel__track{transform:none !important;transition:none !important}
.carrusel__slide{scroll-snap-align:center}
.carrusel__track{display:flex;transition:transform .55s cubic-bezier(.4,0,.2,1)}
.carrusel__slide{flex:0 0 74%;max-width:640px;padding:0 12px;box-sizing:border-box;
  opacity:.38;transform:scale(.93);transition:opacity .55s ease,transform .55s cubic-bezier(.4,0,.2,1)}
.carrusel__slide.is-active{opacity:1;transform:scale(1)}
.carrusel__flecha{flex:none;width:38px;height:38px;border-radius:50%;border:1px solid var(--linea);
  background:var(--blanco);color:var(--tinta);font-size:20px;line-height:1;cursor:pointer;display:grid;
  place-items:center;transition:border-color .15s,color .15s,background .15s}
.carrusel__flecha:hover{border-color:var(--verde);color:var(--verde)}
.carrusel__puntos{display:flex;justify-content:center;gap:7px;margin:14px 0 6px}
.punto{width:6px;height:6px;border-radius:50%;border:0;padding:0;cursor:pointer;
  transition:background .2s,transform .2s;}
.punto.is-on{transform:scale(1.4);}
.sin-resultados{padding:40px 10px;text-align:center;color:var(--gris);font-size:14.5px}

/* ---- tarjetas de fundación ---- */
.stack{display:flex;flex-direction:column;gap:16px}
.card{border:1px solid var(--linea);border-radius:16px;background:var(--blanco);cursor:pointer;
  transition:border-color .18s,box-shadow .18s,transform .18s}
.card:hover{border-color:var(--cielo);box-shadow:var(--sombra);transform:translateY(-2px)}
.card:hover .card__ver{color:var(--verde)}
.banner{height:76px;background-size:cover;background-position:center;background-repeat:no-repeat}
.card__body{padding:26px 24px 22px;display:grid;grid-template-columns:1fr 220px;gap:28px}
.card__id{display:flex;gap:14px;align-items:center;margin-top:0}
.card__id .avatar{width:66px;height:66px;font-size:20px;border:2px solid var(--linea);
  background-size:contain;background-repeat:no-repeat;background-color:var(--blanco);box-shadow:none}
.card__name{font-size:20px;font-weight:600;letter-spacing:-.02em;margin:0}
.card__place{font-size:12px;color:var(--gris);margin:3px 0 0}
.campana-click{position:relative;border-radius:12px;padding:12px 14px;margin:-12px -14px;cursor:pointer;
  transition:background .16s}
.campana-click:hover{background:var(--nube)}
.campana-click__cta{display:block;font-size:11.5px;font-weight:600;color:var(--cielo);margin-top:8px;
  opacity:0;transform:translateY(-3px);transition:opacity .18s,transform .18s}
.campana-click:hover .campana-click__cta{opacity:1;transform:none}
.card__causas{margin:18px 0 0;display:grid;gap:14px}
.causa__row{display:flex;justify-content:space-between;gap:14px;font-size:13.5px;margin-bottom:6px}
.causa__meta{font-size:12.5px;white-space:nowrap;}
.meter{height:8px;border-radius:99px;background:var(--nube);overflow:hidden;border:1px solid var(--linea)}
.meter__fill{height:100%;border-radius:99px;transition:width .6s cubic-bezier(.4,0,.2,1);}
.meter__fill.is-full{background:var(--verde)}
.causa__pie{display:flex;justify-content:space-between;gap:12px;font-size:12px;color:var(--gris);margin-top:6px}
.causa__pie b{font-weight:600;}
.aporte-general{margin-top:16px;padding-top:14px;border-top:1px dashed var(--linea)}
.card__ver{font-size:12px;font-weight:600;color:var(--cielo);margin:18px 0 0;transition:color .18s}
.card__side{border-left:1px solid var(--linea);padding:20px 0 0 24px;display:flex;flex-direction:column;
  justify-content:space-between;gap:16px}
.evento-click{border-radius:12px;padding:12px 14px;margin:-12px -14px;cursor:pointer;transition:background .16s}
.evento-click:hover{background:var(--nube)}
.evento-click__cta{display:block;font-size:11.5px;font-weight:600;color:var(--cielo);margin-top:8px;
  opacity:0;transform:translateY(-3px);transition:opacity .18s,transform .18s}
.evento-click:hover .evento-click__cta{opacity:1;transform:none}
.evento__fecha{font-size:15px;font-weight:600;margin:6px 0 2px}
.evento__nombre{font-size:13px;color:var(--gris);margin:0}
.chiprow{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.minitag{font-size:11px;color:var(--gris);border:1px solid var(--linea);border-radius:999px;padding:4px 9px}
.minitag--link{cursor:pointer;transition:border-color .15s,color .15s}
.minitag--link:hover{border-color:var(--verde);color:var(--verde)}

/* ---- tarjetas de subasta: la imagen manda ---- */
.subastas-nav{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:20px}
.subastas-nav__txt{font-size:12.5px;color:var(--gris)}
.subastas-grid{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;scrollbar-width:none;overscroll-behavior-x:contain;padding-bottom:4px}
.subastas-grid::-webkit-scrollbar{display:none}
.subastas-grid > .lote,.subastas-grid > .sueno{flex:0 0 82%;scroll-snap-align:center}
.subastas-nav{display:flex;justify-content:center;gap:7px;margin-top:14px}
.subastas-grid--viejo{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px}
.subasta-card{border:1px solid var(--linea);border-radius:18px;background:var(--blanco);overflow:hidden;
  display:flex;flex-direction:column;transition:border-color .18s,box-shadow .18s,transform .18s}
.subasta-card:hover{border-color:var(--cielo);box-shadow:var(--sombra);transform:translateY(-2px)}
.subasta-foto{position:relative;aspect-ratio:4/3;background-size:contain;background-repeat:no-repeat;
  background-position:center;background-color:var(--nube);
  background-image:linear-gradient(115deg,rgba(135,206,235,.5),rgba(67,170,139,.32))}
.subasta-foto__mini{position:absolute;left:12px;bottom:12px;gap:6px;}
.subasta-foto__mini img{width:42px;height:42px;border-radius:9px;object-fit:cover;border:2px solid var(--blanco);
  box-shadow:var(--sombra)}
.subasta-foto__cant{position:absolute;right:12px;top:12px;background:rgba(16,36,44,.72);color:var(--blanco);
  font-size:11px;font-weight:600;padding:5px 9px;border-radius:999px}
.subasta-card__body{padding:16px 18px 18px;display:flex;flex-direction:column;flex:1}
.subasta-card__titulo{font-size:16.5px;font-weight:600;letter-spacing:-.015em}
.subasta-card__oferta{margin-top:14px;padding:10px 0;border-radius:12px;background:transparent}
.subasta-card__label{font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gris)}
.subasta-card__precio{font-size:24px;font-weight:600;letter-spacing:-.03em;margin-top:3px}
.subasta-card__min{font-size:11.5px;color:var(--gris);margin-top:3px}
.subasta-card__cierre{display:flex;align-items:center;gap:7px;}
.subasta-card__cierre b{font-weight:600;}
.subasta-card__oferta.es-boton{cursor:pointer;border-radius:12px;
  transition:background .15s;}
.subasta-card__fund{display:flex;align-items:center;gap:11px;margin-top:14px;padding-top:14px;
  border-top:1px solid var(--linea);font-size:13.5px;}
.subasta-card__fund .avatar{width:34px;height:34px;font-size:11px;flex:none}
.subasta-card__benef{font-size:11px;letter-spacing:.1em;text-transform:uppercase}
.subasta-card__fund span{cursor:pointer;display:block;font-size:16px;font-weight:600;letter-spacing:-.015em;margin-top:1px;}
.subasta-card__fund span:hover{color:var(--verde)}
.subasta-card__accion{margin-top:14px}
.subasta-card__accion .btn{width:100%}

/* ---- chips de producto (modal de oferta) ---- */
.subasta-card__productos{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.producto-chip{display:flex;align-items:center;gap:7px;border:1px solid var(--linea);border-radius:999px;
  padding:4px 12px 4px 4px;font-size:12px;background:var(--nube)}
.producto-chip__img{width:24px;height:24px;border-radius:50%;object-fit:cover;flex:none;background:var(--cielo)}
.producto-chip__sin{width:24px;height:24px;border-radius:50%;background:var(--cielo);flex:none}

/* ---- cielo nocturno: cubre el fondo del segmento central ---- */
#screen-app{position:relative;z-index:1;background:transparent}
/* El menú se apoya en el cielo de estrellas, no en un fondo propio. */
body.noche #screen-app{background:transparent !important}
#vistaLista{position:relative;z-index:1}
.cielo-fondo{position:fixed;inset:0;z-index:0;opacity:0;pointer-events:none;overflow:hidden;
  transition:opacity .5s ease;
  background:
    radial-gradient(1px 1px at 6% 12%, #fff, transparent),
    radial-gradient(1px 1px at 14% 31%, rgba(255,255,255,.8), transparent),
    radial-gradient(2px 2px at 21% 8%,  #fff, transparent),
    radial-gradient(1px 1px at 28% 52%, rgba(255,255,255,.7), transparent),
    radial-gradient(1.5px 1.5px at 34% 22%, #fff, transparent),
    radial-gradient(1px 1px at 41% 68%, rgba(255,255,255,.75), transparent),
    radial-gradient(1px 1px at 47% 15%, rgba(255,255,255,.65), transparent),
    radial-gradient(2px 2px at 53% 41%, #fff, transparent),
    radial-gradient(1px 1px at 59% 79%, rgba(255,255,255,.7), transparent),
    radial-gradient(1.5px 1.5px at 66% 27%, rgba(255,255,255,.9), transparent),
    radial-gradient(1px 1px at 72% 58%, rgba(255,255,255,.6), transparent),
    radial-gradient(2px 2px at 78% 11%, #fff, transparent),
    radial-gradient(1px 1px at 84% 44%, rgba(255,255,255,.7), transparent),
    radial-gradient(1.5px 1.5px at 90% 71%, rgba(255,255,255,.85), transparent),
    radial-gradient(1px 1px at 95% 25%, rgba(255,255,255,.6), transparent),
    radial-gradient(1px 1px at 11% 86%, rgba(255,255,255,.55), transparent),
    radial-gradient(1px 1px at 37% 93%, rgba(255,255,255,.5), transparent),
    radial-gradient(2px 2px at 63% 90%, rgba(255,255,255,.8), transparent),
    radial-gradient(1px 1px at 88% 95%, rgba(255,255,255,.5), transparent),
    radial-gradient(1px 1px at 3% 62%, rgba(255,255,255,.6), transparent),
    radial-gradient(130% 90% at 50% 0%, #16324f 0%, #0d2038 48%, #060f1e 100%);
}
body.noche .cielo-fondo{opacity:1}
body.noche{background:#060f1e}

.nube{position:absolute;border-radius:99px;background:rgba(255,255,255,.06);filter:blur(11px)}
.nube--1{width:320px;height:60px;top:18%;left:-60px;animation:deriva 52s linear infinite}
.nube--2{width:240px;height:48px;top:54%;right:-50px;animation:deriva 68s linear infinite reverse}
.nube--3{width:380px;height:66px;bottom:12%;left:24%;animation:deriva 84s linear infinite}
@keyframes deriva{from{transform:translateX(-36px)}to{transform:translateX(36px)}}

/* estrellas que se encandilan: crecen y se apagan en un segundo */
.titila{position:absolute;width:3px;height:3px;border-radius:50%;background:#fff;opacity:.25;
  animation:destello 7s ease-in-out infinite}
@keyframes destello{
  0%,100%{opacity:.2;transform:scale(1);box-shadow:none}
  6%{opacity:1;transform:scale(2.6);box-shadow:0 0 12px 3px rgba(255,255,255,.9)}
  14%{opacity:.2;transform:scale(1);box-shadow:none}
}

/* estrella fugaz: el JS elige de dónde sale, hacia dónde va y cuánto mide */
.fugaz{position:absolute;width:0;height:2px;border-radius:2px;opacity:0;pointer-events:none;
  transform-origin:left center;
  background:linear-gradient(90deg,transparent,#fff);
  box-shadow:0 0 8px rgba(255,255,255,.8)}
.fugaz.is-on{animation:cruza var(--dur,1.5s) ease-in forwards}
.fugaz--btn{z-index:0;height:2px}
@keyframes cruza{
  0%  {opacity:0;width:0;    transform:rotate(var(--ang)) translateX(0)}
  12% {opacity:1;width:var(--largo)}
  100%{opacity:0;width:var(--largo); transform:rotate(var(--ang)) translateX(var(--dist))}
}

/* sobre el cielo, el texto del segmento se aclara */
body.noche #vistaLista .titulazo{border-bottom-color:rgba(255,255,255,.3)}
body.noche #vistaLista .titulazo h3{color:#fff}
body.noche #vistaLista .titulazo--cielo h3{color:var(--cielo)}
body.noche #vistaLista .titulazo__nota,
body.noche #vistaLista .subastas-nav__txt{color:rgba(255,255,255,.65)}
body.noche #vistaLista .carrusel__flecha{background:rgba(255,255,255,.1);
  border-color:rgba(255,255,255,.28);color:#fff}
body.noche #vistaLista .carrusel__flecha:hover{background:rgba(255,255,255,.2)}
body.noche #vistaLista .punto{background:rgba(255,255,255,.28)}
body.noche #vistaLista .punto.is-on{background:var(--cielo)}
body.noche #vistaLista .empty{color:rgba(255,255,255,.7);border-color:rgba(255,255,255,.25)}

@media (prefers-reduced-motion:reduce){
  .nube,.titila{animation:none}
  .fugaz{display:none}
  .fugaz--btn{display:none}
}

/* ---- entrada y listado de deseos ---- */
/* Menú principal: rectángulos apenas teñidos sobre el cielo. */
/* El menú principal se define una sola vez, más abajo. */
@keyframes entraTexto{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.suenos-lista{display:flex;flex-direction:column;gap:16px;}
.borrar-sueno{background:none;border:0;padding:6px 0 0;margin-top:8px;cursor:pointer;
  font-size:11.5px;text-decoration:underline;text-underline-offset:3px;
  align-self:flex-start;}
.borrar-sueno:active{color:#B3261E}
@media (max-width:820px){
}
.oferta-fila{display:flex;align-items:center;gap:12px;border:1px solid var(--linea);border-radius:12px;padding:10px 14px}
.oferta-fila.is-mejor{border-color:var(--verde);background:rgba(67,170,139,.06)}
.oferta-fila .avatar{width:30px;height:30px;font-size:11px;flex:none}
.avatar--anon{background:var(--nube);color:var(--gris);display:grid;place-items:center}
.avatar--anon svg{width:62%;height:62%}
.oferta-fila__t{flex:1;min-width:0}
.oferta-fila__t b{display:block;font-size:13.5px;font-weight:600}
.oferta-fila__t span{display:block;font-size:11.5px;color:var(--gris)}
.oferta-fila__m{font-size:15px;font-weight:600;color:var(--verde);white-space:nowrap}
.deseo-fila{display:flex;align-items:center;gap:16px;padding:16px 0;border-bottom:1px solid var(--linea)}
.deseo-fila .avatar{width:40px;height:40px;font-size:13px;flex:0 0 40px}
.deseo-fila__t{flex:1;min-width:0}
.deseo-fila__t b{display:block;font-size:16px;font-weight:600;letter-spacing:-.015em}
.deseo-fila__t span{display:block;font-size:12.5px;color:var(--gris);margin-top:3px}
.deseo-fila__acc{display:flex;align-items:center;gap:8px;flex:none}
.sobre--wsp:hover{border-color:#25D366;color:#25D366}
.deseo-texto{font-size:16px;line-height:1.7;white-space:pre-wrap;border-radius:14px;
  padding:20px 22px;margin:0;}

/* ---- estadísticas de fundación ---- */
.stats-pantalla{max-width:1120px;margin:0 auto;padding:40px 34px 90px}
.stats-pantalla h2{font-weight:200;letter-spacing:-.035em;}
.stats-pantalla .lede{font-size:14px;color:var(--gris);margin:8px 0 30px}
.st-grupo{margin-bottom:34px}
.st-grupo h3{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--gris);
  margin:0 0 14px;padding-bottom:10px;border-bottom:1px solid var(--linea)}
.st-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:14px}
.st-caja{border:1px solid var(--linea);border-radius:14px;padding:18px}
.st-caja__l{font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gris);
  line-height:1.35}
.st-caja__n{font-size:27px;font-weight:200;letter-spacing:-.035em;margin-top:8px;line-height:1}
.st-caja__s{font-size:12px;color:var(--gris);margin-top:6px;line-height:1.45}
.st-caja--verde .st-caja__n{color:var(--verde)}
.st-barra{height:8px;border-radius:99px;background:var(--nube);overflow:hidden;margin-top:10px;display:flex}
.st-barra span{display:block;height:100%}
.st-tabla{width:100%;border-collapse:collapse;font-size:13.5px}
.st-tabla th{text-align:left;font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gris);padding:0 10px 9px;border-bottom:1px solid var(--linea)}
.st-tabla td{padding:11px 10px;border-bottom:1px solid var(--linea)}
.st-tabla td:last-child{text-align:right;font-weight:600;white-space:nowrap}

/* ---- panel de administración ---- */
.admin{max-width:1180px;margin:0 auto;padding:30px 34px 90px;display:grid;grid-template-columns:230px 1fr;gap:34px}
.admin__nav{display:flex;flex-direction:column;gap:4px;align-self:start;position:sticky;top:86px}
.admin__tab{background:none;border:0;border-radius:10px;padding:12px 14px;text-align:left;font-size:13.5px;
  font-weight:600;color:var(--gris);cursor:pointer;transition:background .15s,color .15s}
.admin__tab:hover{background:var(--nube);color:var(--tinta)}
.admin__tab.is-on{background:var(--tinta);color:var(--blanco)}
.admin__cuerpo{min-width:0}
.admin__titulo{font-size:30px;font-weight:200;letter-spacing:-.03em;margin:0}
.admin__lede{font-size:14px;color:var(--gris);margin:8px 0 22px;max-width:64ch;line-height:1.55}
.admin__barra{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px}
.admin__barra input,.admin__barra select{padding:10px 13px;border:1px solid var(--linea);border-radius:10px;font-size:14px}
.admin__barra input{flex:1;min-width:200px}
.tabla{width:100%;border-collapse:collapse;font-size:13.5px}
.tabla th{text-align:left;font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:0 12px 10px;border-bottom:1px solid var(--linea);}
.tabla td{padding:12px;border-bottom:1px solid var(--linea);vertical-align:middle}
.tabla tr.is-baja td{opacity:.45}
.tabla__quien{display:flex;align-items:center;gap:10px}
.tabla__quien .avatar{width:32px;height:32px;font-size:11px}
.tabla__n{font-weight:600}
.tabla__m{font-size:12px;color:var(--gris)}
.tabla select{padding:7px 9px;border:1px solid var(--linea);border-radius:8px;font-size:12.5px;background:var(--blanco)}
.tabla .acciones{justify-content:flex-end}
.admin__grupo{margin-bottom:34px}
.admin__grupo h4{font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gris);
  margin:0 0 12px;display:flex;align-items:center;justify-content:space-between;gap:14px}
.galeria-admin{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
.archivo{border:1px solid var(--linea);border-radius:12px;overflow:hidden;background:var(--blanco)}
.archivo__img{height:110px;background-size:cover;background-position:center;background-color:var(--nube)}
.archivo__pie{padding:10px 12px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.archivo__t{font-size:11.5px;line-height:1.3;min-width:0}
.archivo__t b{display:block;font-weight:600;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.archivo__t span{color:var(--gris)}
.mini-x{border:0;background:none;color:var(--gris);font-size:16px;cursor:pointer;line-height:1;padding:2px 4px}
.mini-x:hover{color:#B3261E}
.rolchip{font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:4px 8px;
  border-radius:999px;background:var(--nube);color:var(--gris)}
.rolchip--admin{background:rgba(16,36,44,.85);color:var(--blanco)}
.rolchip--mod{background:rgba(135,206,235,.3);color:#1c5c78}
.rolchip--inv{background:rgba(16,36,44,.06);color:var(--gris)}

.crear-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.crear-op{display:grid;gap:6px;text-align:left;border:1px solid var(--linea);background:var(--blanco);
  border-radius:16px;padding:22px 20px;cursor:pointer;transition:border-color .15s,box-shadow .15s,transform .15s}
.crear-op:hover{border-color:var(--verde);box-shadow:var(--sombra);transform:translateY(-2px)}
.crear-op__n{font-size:16px;font-weight:600;letter-spacing:-.015em}
.crear-op__d{font-size:13px;color:var(--gris);line-height:1.45}

.saltar-toggle{display:flex;align-items:center;gap:16px;width:100%;text-align:left;cursor:pointer;
  border:1px solid var(--linea);border-radius:16px;padding:22px;background:var(--blanco);
  transition:border-color .18s,background .18s}
.saltar-toggle:hover{border-color:var(--cielo)}
.saltar-toggle.is-on{border-color:var(--verde);background:rgba(67,170,139,.06)}
.saltar-toggle__luz{width:14px;height:14px;border-radius:50%;background:var(--linea);flex:none;transition:background .18s}
.saltar-toggle.is-on .saltar-toggle__luz{background:var(--verde);box-shadow:0 0 0 5px rgba(67,170,139,.18)}
.saltar-toggle b{display:block;font-size:15px;font-weight:600}
.saltar-toggle span span{font-size:13px;color:var(--gris);line-height:1.5}
.respaldo{display:flex;align-items:center;gap:18px;border:1px solid var(--linea);border-radius:16px;padding:22px}
.respaldo__num{font-size:40px;font-weight:200;letter-spacing:-.04em;color:var(--verde);line-height:1}
.respaldo__t{display:grid;gap:3px}
.respaldo__t b{font-size:15px;font-weight:600}
.respaldo__t span{font-size:12.5px;color:var(--gris)}

/* ---- pantalla de alta ---- */
.alta__intro{align-self:start;position:sticky;top:100px}
.alta--login{align-items:center;min-height:70vh}
.alta--login .alta__intro{position:static}
.alta__pasos-barra{display:flex;align-items:center;gap:8px;margin-bottom:26px;max-width:280px}
.paso-punto{flex:1;height:4px;border-radius:99px;background:var(--linea);transition:background .25s}
.paso-punto.is-on{background:var(--verde)}
.paso-punto.is-hecho{background:var(--cielo)}
.alta__titulo{font-size:clamp(26px,3.4vw,38px) !important}
.tipo-elec{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:6px}
.tipo-op{display:grid;gap:5px;text-align:left;border:1px solid var(--linea);background:var(--blanco);
  border-radius:14px;padding:20px 18px;cursor:pointer;transition:border-color .15s,background .15s}
.tipo-op:hover{border-color:var(--cielo)}
.tipo-op.is-on{border-color:var(--verde);background:rgba(67,170,139,.06)}
.tipo-op__n{font-size:15.5px;font-weight:600;letter-spacing:-.01em}
.tipo-op__d{font-size:12.5px;color:var(--gris);line-height:1.45}
.canal{display:grid;gap:8px;margin-bottom:16px}
.canal-op{display:flex;align-items:center;gap:11px;border:1px solid var(--linea);background:var(--blanco);
  border-radius:11px;padding:12px 14px;cursor:pointer;font-size:14px;transition:border-color .15s,background .15s}
.canal-op:hover{border-color:var(--cielo)}
.canal-op.is-on{border-color:var(--verde);background:rgba(67,170,139,.06)}
.canal-op b{font-weight:600}
.canal-op span{color:var(--gris);font-size:12.5px;margin-left:auto}
.alta__nota{font-size:12.5px;color:var(--gris);line-height:1.55;background:var(--nube);border-radius:12px;
  padding:14px 16px;margin:0 0 18px}

.alta__top{display:flex;align-items:center;justify-content:space-between;gap:20px;}
.alta{max-width:1080px;margin:0 auto;padding:56px 40px 90px;display:grid;
  grid-template-columns:0.9fr 1.1fr;gap:60px;align-items:start}
.alta__titulo{font-weight:200;letter-spacing:-.035em;line-height:1.05;margin:0}
.alta__lede{color:var(--gris);font-size:15.5px;line-height:1.6;margin:16px 0 0;max-width:38ch}
.alta__form{border:1px solid var(--linea);border-radius:18px;padding:30px;background:var(--blanco);
  align-self:start}

/* ---- filas / listas ---- */
.row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0;
  border-bottom:1px solid var(--linea)}
.row__main{font-size:15px;font-weight:500}
.row__sub{font-size:12.5px;color:var(--gris);margin-top:3px}
.row__val{font-size:15px;font-weight:600;color:var(--verde);white-space:nowrap}
.empty{padding:24px;text-align:center;font-size:14px;}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--linea);border:1px solid var(--linea);
  border-radius:14px;overflow:hidden;margin-top:16px}
.stat{background:var(--blanco);padding:18px}
.stat__num{font-size:28px;font-weight:200;letter-spacing:-.03em}
.stat__label{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gris);margin-top:4px}
.perfil__hero{border:1px solid var(--linea);border-radius:16px;overflow:hidden}
.perfil__id{display:flex;align-items:flex-end;gap:18px;}
.perfil__id .avatar{border:4px solid var(--blanco);box-shadow:var(--sombra)}
.estado{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:5px 9px;border-radius:999px}
.estado--pend{background:rgba(135,206,235,.22);color:#1c5c78}
.estado--no{background:rgba(16,36,44,.07);color:var(--gris)}
.tag{font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--verde);
  border:1px solid rgba(67,170,139,.35);border-radius:999px;padding:5px 9px;white-space:nowrap}
.colabs{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:18px}
.colab-card{position:relative;border:1px solid var(--linea);border-radius:18px;padding:30px 20px 22px;
  text-align:center;background:var(--blanco);transition:border-color .18s,box-shadow .18s,transform .18s;
  border-top:3px solid var(--linea)}
.colab-card--persona{border-top-color:var(--cielo)}
.colab-card--org{border-top-color:var(--verde)}
.colab-card__tipo{position:absolute;top:12px;right:14px;font-size:9.5px;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;padding:4px 8px;border-radius:999px}
.colab-card--persona .colab-card__tipo{background:rgba(135,206,235,.28);color:#1c5c78}
.colab-card--org .colab-card__tipo{background:rgba(67,170,139,.12);color:var(--verde)}
.colab-card__aporte{font-size:12.5px;color:var(--gris);line-height:1.5;margin:10px 0 0}
.colab-card__causas{list-style:none;padding:0;margin:8px 0 0;display:grid;gap:7px}
.colab-card__causas li{display:grid;gap:1px;font-size:12px;padding:7px 10px;background:var(--nube);border-radius:9px}
.colab-card__causas b{font-weight:600;font-size:12.5px}
.colab-card__causas span{color:var(--gris);font-size:11px}
.colab-card:hover{border-color:var(--cielo);box-shadow:var(--sombra);transform:translateY(-2px)}
.colab-card__foto{width:92px;height:92px;border-radius:50%;margin:0 auto 14px;display:grid;place-items:center;
  font-size:28px;font-weight:700;color:var(--tinta);background-size:cover;background-position:center;
  border:3px solid var(--blanco);box-shadow:0 0 0 1px var(--linea),var(--sombra)}
.colab-card__nombre{font-size:16.5px;font-weight:600;letter-spacing:-.015em}
.colab-card__rol{font-size:12.5px;color:var(--gris);margin-top:3px}
.colab-card__label{font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gris);
  margin:16px 0 8px}
.colab-card__funds{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.colab{border:1px solid var(--linea);border-radius:14px;padding:16px 18px;display:flex;align-items:center;gap:16px;
  transition:border-color .18s}
.colab:hover{border-color:var(--cielo)}
.colab__body{flex:1;min-width:0}
.colab__name{font-size:16px;font-weight:600;letter-spacing:-.01em}
.colab__rol{font-size:12.5px;color:var(--gris);margin-top:2px}
.rank{display:grid;gap:1px;background:var(--linea);border:1px solid var(--linea);border-radius:14px;overflow:hidden}
.rank__row{background:var(--blanco);display:grid;grid-template-columns:34px 1fr auto;align-items:center;
  gap:14px;padding:13px 18px}
.rank__row--simple{grid-template-columns:1fr auto}
.rank__row.is-me{background:rgba(135,206,235,.12)}
.rank__pos{font-size:14px;font-weight:700;color:var(--gris);text-align:center}
.rank__row:nth-child(1) .rank__pos{color:var(--verde)}
.acciones{display:flex;flex-wrap:wrap;gap:8px}

/* ---- página de fundación (detalle) ---- */
.volver{background:none;border:0;padding:0;color:var(--gris);font-size:13px;font-weight:600;cursor:pointer;
  display:inline-flex;align-items:center;gap:6px;margin-bottom:18px;transition:color .15s}
.volver:hover{color:var(--verde)}
.ficha{border:1px solid var(--linea);border-radius:18px;overflow:hidden}
.ficha__id{display:flex;align-items:flex-end;gap:18px;padding:0 26px 22px;margin-top:-34px}
.card > .banner + .card__body .card__id{margin-top:-26px}
.ficha__id .avatar{border:4px solid var(--blanco);box-shadow:var(--sombra)}
.ficha__nombre{font-size:26px;font-weight:600;letter-spacing:-.025em}
.ficha__lugar{font-size:13.5px;color:var(--gris);margin-top:3px}
.ficha__acciones{display:flex;flex-direction:column;gap:10px;margin-top:16px;padding:0 20px}
.ficha__acciones .btn{width:100%;min-height:50px}

.ficha--colab{border-top:3px solid var(--linea)}
.ficha--colab.colab-card--persona{border-top-color:var(--cielo)}
.ficha--colab.colab-card--org{border-top-color:var(--verde)}
.ficha__texto{font-size:14.5px;color:var(--gris);line-height:1.6;margin:0;padding:0 26px 22px}

/* ---- presentación ---- */
.presentacion__texto{font-size:15.5px;line-height:1.65;white-space:pre-wrap;margin:0}
.galeria{display:grid;grid-template-columns:1fr;gap:12px;margin-top:18px}
.galeria img{width:100%;height:auto;object-fit:contain;border-radius:14px;
  border:1px solid var(--linea);background:var(--nube)}
.video-wrap{position:relative;padding-top:56.25%;margin-top:16px;border-radius:14px;overflow:hidden;
  border:1px solid var(--linea);background:var(--nube)}
.video-wrap iframe,.video-wrap video{position:absolute;inset:0;width:100%;height:100%;border:0}

/* ---- causas / eventos con presentación ---- */
.bloque{border:1px solid var(--linea);border-radius:16px;overflow:hidden;background:var(--blanco);
  transition:border-color .18s}
.bloque:hover{border-color:var(--cielo)}
.bloque__img{height:170px;background-size:contain;background-repeat:no-repeat;background-position:center;
  background-color:var(--nube);background-image:linear-gradient(115deg,rgba(135,206,235,.45),rgba(67,170,139,.3))}
.bloque__body{padding:18px 20px 20px}
.bloque__titulo{font-size:17px;font-weight:600;letter-spacing:-.015em}
.bloque__desc{font-size:13.5px;color:var(--gris);margin-top:6px;line-height:1.55}
.bloque__pie{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:16px}
.bloque__fecha{font-size:13px;font-weight:600;color:var(--verde)}
.asistentes{font-size:12.5px;color:var(--gris);margin-left:auto}

/* ---- destino y niveles dentro de Donar ---- */
.tabs--destino{grid-template-columns:repeat(3,1fr);margin-bottom:16px}
.destino-pane{display:none}
.destino-pane.is-on{display:block}
.niveles{display:grid;gap:8px;margin-bottom:16px}
.nivel{display:grid;gap:2px;text-align:left;border:1px solid var(--linea);background:var(--blanco);
  border-radius:12px;padding:13px 15px;cursor:pointer;transition:border-color .15s,background .15s}
.nivel:hover{border-color:var(--cielo)}
.nivel.is-on{border-color:var(--verde);background:rgba(67,170,139,.06)}
.nivel__nombre{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gris)}
.nivel__monto{font-size:18px;font-weight:600;letter-spacing:-.02em}
.nivel__monto small{font-size:12px;font-weight:400;color:var(--gris)}
.nivel__benef{font-size:12.5px;color:var(--gris);line-height:1.45;margin-top:2px}

/* ---- valor complementario ---- */
.vopciones{display:grid;gap:9px}
.vop{display:grid;gap:3px;text-align:left;border:1px solid var(--linea);background:var(--blanco);
  border-radius:12px;padding:14px 16px;cursor:pointer;transition:border-color .15s,background .15s}
.vop:hover{border-color:var(--cielo)}
.vop.is-on{border-color:var(--verde);background:rgba(67,170,139,.06)}
.vop__n{font-size:14.5px;font-weight:600;letter-spacing:-.01em}
.vop__d{font-size:12.5px;color:var(--gris);line-height:1.4}

.paso-sep{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  margin:24px 0 12px;padding-top:18px;border-top:1px solid var(--linea);}

.avance{margin:-6px 0 20px}
.avance__meter{display:flex;height:12px;border-radius:99px;background:var(--nube);overflow:hidden;
  border:1px solid var(--linea)}
.avance__actual{background:var(--cielo);transition:width .3s}
.avance__suma{background:var(--verde);transition:width .3s;
  background-image:repeating-linear-gradient(45deg,rgba(255,255,255,.25) 0 5px,transparent 5px 10px)}
.avance__pie{display:flex;justify-content:space-between;gap:14px;font-size:12px;color:var(--gris);margin-top:7px}
.avance__pie b{color:var(--verde);font-weight:600}
.destino-fijo{display:flex;align-items:center;gap:14px;border:1px solid var(--linea);border-radius:14px;
  padding:14px 16px;margin-bottom:20px;background:var(--nube)}
.destino-fijo b{display:block;font-size:15px;font-weight:600;letter-spacing:-.01em}
.destino-fijo span{display:block;font-size:12.5px;color:var(--gris);margin-top:2px}
.destino-fijo .avatar{width:40px;height:40px;font-size:13px}
.pago-oculto{max-height:0;opacity:0;overflow:hidden;
  transition:max-height .38s cubic-bezier(.4,0,.2,1),opacity .26s;scroll-margin-top:12px}
.pago-oculto.is-on{max-height:900px;opacity:1}

.statc{border:1px solid var(--linea);border-radius:14px;padding:18px 20px;margin-bottom:12px}
.statc__cab{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.statc__label{font-size:10.5px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--gris)}
.statc__num{font-size:30px;font-weight:200;letter-spacing:-.035em;margin-top:5px;line-height:1}
.statc__sub{font-size:12.5px;color:var(--gris);margin-top:6px}
.statc__toggle{background:none;border:0;padding:0;cursor:pointer;font-size:12px;font-weight:600;
  color:var(--verde);white-space:nowrap;display:flex;align-items:center;gap:5px}
.statc__toggle span{font-size:10px;transition:transform .2s}
.statc.is-on .statc__toggle span{transform:rotate(180deg)}
.statc__cuerpo{display:none;margin-top:16px;padding-top:14px;border-top:1px solid var(--linea)}
.statc.is-on .statc__cuerpo{display:block}
.statc__lista{display:grid;gap:8px}
.statc__fila{display:flex;align-items:center;gap:11px;padding:9px 11px;background:var(--nube);border-radius:10px}
.statc__fila .avatar{width:30px;height:30px;font-size:11px}
.statc__f-t{flex:1;min-width:0}
.statc__f-t b{display:block;font-size:13.5px;font-weight:600;letter-spacing:-.01em}
.statc__f-t span{display:block;font-size:11.5px;color:var(--gris);margin-top:1px}
.statc__f-v{font-size:13px;font-weight:600;color:var(--verde);white-space:nowrap}
.stats-lista .row:last-child{border-bottom:0}
.referidos{border:1px solid rgba(67,170,139,.3);background:rgba(67,170,139,.05);border-radius:16px;padding:22px}
.referidos__num{font-size:32px;font-weight:200;letter-spacing:-.04em;color:var(--verde);line-height:1}
.referidos__t{font-size:13.5px;color:var(--gris);line-height:1.55;margin:8px 0 16px}
.referidos__link{display:flex;gap:8px}
.referidos__link input{flex:1;min-width:0;padding:11px 13px;border:1px solid var(--linea);border-radius:10px;
  font-size:13px;background:var(--blanco);color:var(--gris)}

.envio{border:1px solid rgba(135,206,235,.55);background:rgba(135,206,235,.1);border-radius:12px;
  padding:16px 18px;margin-top:6px}
.envio b{font-size:13px}
.envio p{font-size:12.5px;color:var(--gris);line-height:1.5;margin:6px 0 10px}
.selfund{border:1px solid var(--linea);border-radius:12px;overflow:hidden}
.selfund__q{width:100%;border:0 !important;border-bottom:1px solid var(--linea) !important;border-radius:0 !important;
  padding:12px 14px;font-size:14px}
.selfund__q:focus{outline:none;box-shadow:none !important}
.selfund__lista{max-height:210px;overflow-y:auto}
.selfund__op{display:flex;align-items:center;gap:11px;width:100%;border:0;background:none;text-align:left;
  padding:10px 14px;cursor:pointer;transition:background .12s}
.selfund__op:hover{background:var(--nube)}
.selfund__op.is-on{background:rgba(67,170,139,.09)}
.selfund__op .avatar{width:34px;height:34px;font-size:11px;flex:0 0 34px;border-radius:50%;
  background-size:cover;background-position:center}
.selfund__op > span:not(.avatar){flex:1;min-width:0}
.selfund__op b{display:block;font-size:14px;font-weight:600;letter-spacing:-.01em}
.selfund__op span span{display:block;font-size:12px;color:var(--gris);margin-top:1px}
.selfund__check{margin-left:auto;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;
  border:1px solid var(--linea);font-size:13px;color:var(--gris);flex:none}
.selfund__op.is-on .selfund__check{background:var(--verde);border-color:var(--verde);color:var(--blanco)}
.selfund__vacio{padding:16px;font-size:13px;color:var(--gris);text-align:center;margin:0}
.selfund__elegido{display:flex;align-items:center;gap:11px;padding:11px 14px;background:rgba(67,170,139,.07)}
.selfund__elegido .avatar{width:34px;height:34px;font-size:12px}
.selfund__e-t{flex:1;min-width:0}
.selfund__e-t b{display:block;font-size:14px;font-weight:600;letter-spacing:-.01em}
.selfund__e-t span{display:block;font-size:12px;color:var(--gris);margin-top:1px}
.selfund__cambiar{background:none;border:0;padding:0;cursor:pointer;font-size:12.5px;font-weight:600;
  color:var(--verde);white-space:nowrap}
.selfund__cambiar:hover{text-decoration:underline}

.caja-grande{min-height:190px !important;line-height:1.6;font-size:15px}
.caja-deseo{min-height:230px !important;line-height:1.65;font-size:16px}
.previews{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.preview{width:74px;height:74px;border-radius:10px;background-size:cover;background-position:center;
  border:1px solid var(--linea)}

/* ---- métodos de pago ---- */
.metodos{display:grid;grid-template-columns:1fr 1fr;gap:8px}
@media (max-width:620px){
  .metodo{padding:11px 12px;font-size:13px}
  .metodos{gap:7px}
}
.metodo{display:grid;gap:3px;text-align:left;border:1px solid var(--linea);background:var(--blanco);
  border-radius:12px;padding:13px 14px;cursor:pointer;transition:border-color .15s,background .15s}
.metodo:hover{border-color:var(--cielo)}
.metodo.is-on{border-color:var(--verde);background:rgba(67,170,139,.06)}
.metodo__n{font-size:14px;font-weight:600;letter-spacing:-.01em}
.metodo__d{font-size:11.5px;color:var(--gris);line-height:1.35}
.pago-total{display:flex;justify-content:space-between;align-items:baseline;margin-top:20px;padding-top:16px;
  border-top:1px solid var(--linea);font-size:14px;color:var(--gris)}
.pago-total b{font-size:22px;font-weight:600;color:var(--tinta);letter-spacing:-.02em}

/* ---- plan de aportes mensual ---- */
.planes{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:4px}
.planes::-webkit-scrollbar{display:none}
.planes > .plan{flex:0 0 66%;scroll-snap-align:center}
.plan{border:1px solid var(--linea);border-radius:16px;padding:20px;background:var(--blanco);
  display:flex;flex-direction:column;transition:border-color .18s,box-shadow .18s}
.plan:hover{border-color:var(--cielo);box-shadow:var(--sombra)}
.plan.is-mio{border-color:var(--verde);background:rgba(67,170,139,.04)}
.plan__nombre{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gris)}
.plan__monto{font-size:26px;font-weight:200;letter-spacing:-.03em;margin-top:8px}
.plan__monto span{font-size:13px;font-weight:400;color:var(--gris);letter-spacing:0}
.plan__pie{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:auto;padding-top:16px}
.plan__cant{font-size:12px;color:var(--gris);margin-left:auto}

/* ---- contactar donante ---- */
.sobre{width:30px;height:30px;border-radius:8px;border:1px solid var(--linea);background:var(--blanco);
  cursor:pointer;display:grid;place-items:center;flex:none;color:var(--gris);
  transition:border-color .15s,color .15s}
.sobre:hover{border-color:var(--verde);color:var(--verde)}
.sobre svg{width:15px;height:15px}
.rank__row{position:relative}
.rank__acciones{display:flex;align-items:center;gap:10px}

/* ---- encabezado del perfil con controles ---- */
.perfil-head{display:flex;align-items:center;justify-content:space-between;gap:22px;
  flex-wrap:wrap;margin-bottom:22px}
.buscador-cuentas{flex:1;min-width:230px;margin-bottom:0;}
.buscador-cuentas .buscador input{padding:11px 14px 11px 42px;font-size:14px}
.handle{font-size:13px;color:var(--verde);font-weight:600;margin-top:4px}
.sug__handle{color:var(--verde);font-weight:600}
.sug__tipo{margin-left:auto;font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--gris);white-space:nowrap}
.perfil-head .panel__title{margin:0}
.perfil-head__ctrls{display:flex;flex-wrap:wrap;}
.switch{display:flex;align-items:center;gap:11px;border:1px solid var(--linea);
  border-radius:12px;cursor:pointer;text-align:left;transition:border-color .18s,background .18s;}
.switch:hover{border-color:var(--cielo)}
.switch.is-on{border-color:var(--verde);background:rgba(67,170,139,.06)}
.switch__riel{width:36px;height:20px;border-radius:99px;background:var(--linea);position:relative;flex:none;
  transition:background .2s}
.switch.is-on .switch__riel{background:var(--verde)}
.switch__bola{position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:var(--blanco);
  box-shadow:0 1px 3px rgba(16,36,44,.3);transition:transform .2s}
.switch.is-on .switch__bola{transform:translateX(16px)}
.switch__t b{display:block;font-weight:600;letter-spacing:-.01em;}
.switch__t span{display:block;margin-top:2px;line-height:1.4;}

.deseos-config{margin:18px 0 6px}
.deseos-config .switch{width:100%}

.apoyo{align-items:center;gap:14px;border:1px solid var(--linea);border-radius:14px;}
.apoyo .avatar{width:42px;height:42px;font-size:14px;flex:0 0 42px}
.apoyo__t{flex:1;min-width:0}
.apoyo__t b{display:block;font-size:15.5px;font-weight:600;letter-spacing:-.015em;cursor:pointer}
.apoyo__t b:hover{color:var(--verde)}
.apoyo__t span{display:block;font-size:12.5px;margin-top:2px;}
.apoyo__m{letter-spacing:-.02em;}

/* ---- insignias de fundaciones apoyadas ---- */
.insignias{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:14px}
.insignia{position:relative;border:0;padding:14px 8px 16px;cursor:pointer;text-align:center;
  border-radius:14px;transition:background .15s;}
.insignia:hover{background:var(--nube)}
.insignia__aro{display:grid;place-items:center;width:70px;height:70px;margin:0 auto 10px;border-radius:50%;
  border:2px solid var(--linea);transition:border-color .18s}
.insignia:hover .insignia__aro{border-color:var(--cielo)}
.insignia.is-mensual .insignia__aro{border-color:var(--verde);border-width:3px}
.insignia__foto{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;
  background-size:cover;background-position:center;font-size:16px;font-weight:700;color:var(--tinta)}
.insignia__n{display:block;font-size:12.5px;font-weight:600;line-height:1.25;letter-spacing:-.01em}
.insignia__d{display:block;font-size:11px;color:var(--gris);margin-top:3px}
.insignia__tag{display:inline-block;margin-top:6px;font-size:9.5px;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;color:var(--verde);background:rgba(67,170,139,.12);padding:3px 7px;border-radius:999px}

/* ---- desplegables ---- */
.desplegable{border:1px solid var(--linea);border-radius:14px;overflow:hidden;margin-top:26px}
.desplegable__cab{width:100%;border:0;padding:16px 18px;cursor:pointer;display:flex;
  align-items:center;justify-content:space-between;gap:16px;font-size:12px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;transition:background .15s;}
.desplegable__cab:hover{background:var(--nube)}
.desplegable__meta{display:flex;align-items:center;gap:10px;font-size:11.5px;font-weight:400;
  letter-spacing:0;text-transform:none;}
.desplegable__flecha{transition:transform .25s;font-size:13px}
.desplegable.is-open .desplegable__flecha{transform:rotate(180deg)}
.desplegable__cuerpo{display:none;padding:0 18px 18px;border-top:1px solid var(--linea)}
.desplegable.is-open .desplegable__cuerpo{display:block}
.tabla--hist{margin-top:14px}
.tabla--hist th{padding-bottom:8px}
.tabla--hist td{padding:11px 10px}
.hist__tipo{display:block;font-size:11px;color:var(--gris);margin-top:2px}
.hist__monto{text-align:right;font-weight:600;color:var(--verde);white-space:nowrap}

/* ---- contacto de la fundación ---- */
.contacto{border:1px solid var(--linea);border-radius:14px;overflow:hidden;margin-top:16px}
.contacto__fila{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px 16px;
  border-bottom:1px solid var(--linea)}
.contacto__fila:last-child{border-bottom:0}
.contacto__dir{font-size:14px}
.contacto__link{font-size:13px;font-weight:600;color:var(--verde);text-decoration:none;white-space:nowrap}
.contacto__link:hover{text-decoration:underline}

.provisional{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;
  border:1px solid rgba(135,206,235,.6);background:rgba(135,206,235,.12);border-radius:14px;
  padding:18px 20px;margin-top:16px}
.provisional b{font-size:13px}
.provisional p{margin:5px 0 0;font-size:13px;color:var(--gris);line-height:1.5;max-width:52ch}

/* ---- edición por clic directo ---- */
.editable{cursor:pointer;border-radius:8px;transition:background .15s,box-shadow .15s}
.editable:hover{background:rgba(135,206,235,.14);box-shadow:0 0 0 6px rgba(135,206,235,.14)}
.avatar-edit{position:relative;cursor:pointer}
.avatar-edit::after{content:"";position:absolute;inset:0;border-radius:50%;background:rgba(16,36,44,.45);
  opacity:0;transition:opacity .18s}
.avatar-edit::before{content:"Cambiar";position:absolute;inset:0;display:grid;place-items:center;z-index:2;
  color:#fff;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;opacity:0;
  transition:opacity .18s;pointer-events:none}
.avatar-edit:hover::after,.avatar-edit:hover::before{opacity:1}
.perfil__id .editable{padding:2px 6px;margin-left:-6px}
.pista-edicion{font-size:12px;color:var(--gris);margin:10px 0 0}

/* ---- editar perfil ---- */

/* ---- propuesta de donación ---- */
.propuesta{border:1px solid rgba(67,170,139,.3);background:rgba(67,170,139,.05);border-radius:16px;padding:22px}
.propuesta__sub{font-size:13.5px;color:var(--gris);margin:12px 0 0;line-height:1.55;max-width:60ch}
.propuesta__lista{margin-top:18px}

/* ---- modal ---- */
.modal{position:fixed;inset:0;z-index:80;display:none;align-items:center;justify-content:center;padding:20px;
  background:rgba(16,36,44,.36)}
.modal.is-open{display:flex}
.modal__box{background:var(--blanco);width:100%;max-width:480px;padding:26px;
  box-shadow:0 24px 60px rgba(16,36,44,.24);max-height:90vh;overflow:auto;}
.modal__box--grande{max-width:560px;padding:34px}
.modal__box--grande .modal__title{font-size:27px}
.codigo-input{text-align:center;font-size:26px;letter-spacing:.5em;font-weight:600;text-indent:.5em}
.saltear{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:12px;padding:12px 14px;
  border:1px dashed var(--linea);border-radius:10px;font-size:12.5px;color:var(--gris)}
.saltear b{font-family:ui-monospace,Menlo,Consolas,monospace;color:var(--tinta);letter-spacing:.12em;font-size:14px}
.modal__title{font-size:23px;font-weight:300;letter-spacing:-.02em;margin:8px 0 6px}
.modal__sub{font-size:14px;margin:0 0 20px;}
.modal__actions{display:flex;gap:10px;margin-top:20px}
.modal__actions .btn{flex:1}
.tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;background:var(--nube);padding:5px;
  border-radius:12px;margin-bottom:18px}
.tab{background:none;border:0;border-radius:9px;padding:9px 6px;font-size:12px;font-weight:600;
  color:var(--gris);cursor:pointer;line-height:1.25}
.tab.is-on{background:var(--blanco);color:var(--tinta);box-shadow:var(--sombra)}
.tabpane{display:none}
.tabpane.is-on{display:block}
.check{display:flex;gap:10px;align-items:flex-start;font-size:14px;cursor:pointer}
.check input{margin-top:3px;accent-color:var(--verde)}
.toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,160%);
  padding:13px 20px;border-radius:999px;font-size:14px;z-index:95;transition:transform .35s cubic-bezier(.4,0,.2,1);max-width:90vw;text-align:center;}
.toast.is-on{transform:translate(-50%,0)}

/* ================= MODO DIOS ================= */
.gm.is-open{display:block}
.gm button.gmb{background:#1A1A1A;border:1px solid #2A2A2A;color:#EDEDED;border-radius:9px;padding:9px 10px;
  font-size:12.5px;cursor:pointer;text-align:left;transition:.15s}
.gm button.gmb:hover{background:#242424;border-color:var(--verde);color:#fff}
.gm button.gmb.is-on{border-color:var(--verde);color:var(--verde)}
.gm select{width:100%;background:#1A1A1A;border:1px solid #2A2A2A;color:#EDEDED;border-radius:9px;
  padding:10px;font-size:13px}
body.godmode .topbar{box-shadow:inset 0 3px 0 #000}

@media (max-width:940px){
  .home{grid-template-columns:1fr}
  .card__body{grid-template-columns:1fr;gap:18px}
  .card__side{border-left:0;border-top:1px solid var(--linea);padding:18px 0 0}
  .seg{font-size:10.5px;letter-spacing:.1em;padding:16px 4px 14px}
  .stats{grid-template-columns:1fr}
  .grid2{grid-template-columns:1fr}
  .subasta-card__top{flex-direction:column;align-items:stretch}
  .subasta-card__top .btn{align-self:flex-start}
  .topbar__user span:not(.avatar){display:none}
  .carrusel__slide{flex-basis:88%}
  .alta{grid-template-columns:1fr;gap:24px;padding:30px 18px 70px}
  .alta__intro{position:static}
  .panel-donar,.panel-donar--dos{grid-template-columns:1fr;gap:14px}
  .panel-donar__centro{order:-1}
  .panel-donar__centro .btn{width:100%}
  .stats-pantalla{padding:24px 16px 70px}
  .admin{grid-template-columns:1fr;gap:20px;padding:22px 16px 70px}
  .admin__nav{flex-direction:row;overflow-x:auto;position:static}
  .admin__tab{white-space:nowrap;font-size:12.5px}
  .tabla thead{display:none}
  .tabla td{display:block;border:0;padding:6px 0}
  .tabla tr{display:block;border-bottom:1px solid var(--linea);padding:14px 0}
  .alta__top{padding:16px 18px}
  .alta__form{padding:22px}
  .subastas-grid{grid-template-columns:1fr}
  .carrusel__flecha{width:32px;height:32px;font-size:17px}
  .buscador input{padding:13px 60px 13px 42px;font-size:14px}
  .buscador__count{font-size:11px}
}

/* ==================== APP MÓVIL (siempre activa en la beta) ==================== */
/* En pantallas grandes la app se centra como un teléfono; en el celular ocupa todo. */
html{background:#060f1e;height:100%}
body{
  -webkit-tap-highlight-color:transparent;}
body{-webkit-text-size-adjust:100%}

/* Reglas de la app móvil, activas siempre en la beta */
@media all{

  /* cabecera compacta y siempre a mano */
  .topbar{position:sticky;top:0;z-index:30;padding-top:env(safe-area-inset-top)}
  .alta__top{padding-top:calc(12px + env(safe-area-inset-top))}
  .topbar__row{padding:10px 14px}
  .brand__name{font-size:10px;letter-spacing:.18em}
  .brand__mark{width:22px;height:22px}
  .viewport{padding-top:14px}
  .panels{align-items:start}
  .panel{padding:6px 0 30px}
  .panel[aria-hidden="true"]{display:none}
  .panels{grid-template-columns:1fr;transform:none !important}
  .panel__head{margin-bottom:14px}

  /* menú principal: alto cómodo para el pulgar */


  /* pantallas internas */
  .alta__top{padding:12px 14px;position:sticky;top:0;background:var(--blanco);z-index:20;
    border-bottom:1px solid var(--linea)}
  .stats-pantalla{padding-top:16px}
  .stats-pantalla h2{font-size:26px}
  .stats-pantalla .lede{font-size:13.5px;margin-bottom:20px}

  /* carruseles: una tarjeta por pantalla */
  .carrusel{gap:4px}
  .carrusel__slide{flex-basis:88%;padding:0 5px;transform:none;opacity:1}
  .carrusel__slide:first-child{margin-left:6%}
  .carrusel__slide:last-child{margin-right:6%}
  .carrusel__flecha{display:none}
  .carrusel{gap:0}
  .carrusel__flecha{width:30px;height:30px;font-size:16px;flex:0 0 30px}
  .card__body{padding:20px 18px 18px}
  .card__name{font-size:20px}
  .card__id .avatar{width:54px;height:54px}
  .ecard__img{height:150px}

  /* sueños */

  /* subastas */
  .subasta-card__titulo{font-size:17px}
  .subastas-nav{gap:10px}

  /* modales a pantalla completa, como una app */
  .modal{align-items:flex-end;padding:0}
  .modal__box,.modal__box--grande{max-width:100%;width:100%;max-height:88dvh;padding:20px 16px 16px;
    border-radius:20px 20px 0 0;animation:subeModal .26s cubic-bezier(.2,.8,.3,1)}
  @keyframes subeModal{from{transform:translateY(30px)}to{transform:none}}
  .modal__title,.modal__box--grande .modal__title{font-size:22px}
  .modal__sub{font-size:13px;margin-bottom:16px}
  .modal__actions{position:sticky;bottom:-18px;background:var(--blanco);padding-top:14px;margin-top:18px}

  /* formularios cómodos de tipear */
  .field input,.field select,.field textarea{font-size:16px;padding:13px 14px}
  .caja-deseo{min-height:150px !important}
  .grid2{grid-template-columns:1fr;gap:0}
  .acciones{flex-wrap:wrap}
  .acciones .btn{flex:1;min-width:130px}

  /* perfil */
  .perfil-head{gap:14px;margin-bottom:16px}
  .panel__title{font-size:26px}
  .buscador-cuentas{max-width:100%;order:3}
  .perfil-head__ctrls{width:100%;justify-content:space-between}
  .switch__t span{max-width:26ch}
  .insignias{gap:12px}
  .apoyo{flex-wrap:wrap}
  .apoyo__m{margin-left:auto}

  /* tablas y listas */
  .row{flex-direction:column;align-items:flex-start;gap:10px}
  .row .acciones{width:100%}
  .st-grid{grid-template-columns:1fr 1fr;gap:10px}
  .st-caja{padding:14px}
  .st-caja__n{font-size:22px}

  /* el cielo pesa menos en pantallas chicas */
  .nube{display:none}
}

@media (max-width:380px){
  .st-grid{grid-template-columns:1fr}
}


/* ==================== AJUSTE FINO PARA CELULAR ==================== */
/* Cada ventana entra en una pantalla: cabecera fija, contenido al medio, acción al pie. */
#screen-subastas .stats-pantalla,#screen-deseos .stats-pantalla,
#screen-fundaciones .stats-pantalla{padding:12px 14px 28px;display:flex;flex-direction:column;gap:10px}
.stats-pantalla h2{font-size:22px;margin:0}
.stats-pantalla .lede{display:none}          /* el título alcanza: no repetimos */
.alta__top{flex:none}

/* los carruseles ocupan el alto disponible */
#screen-fundaciones .carrusel__viewport{padding:10px 0}
#screen-fundaciones .titulazo{margin:2px 0 0}
#screen-fundaciones .titulazo h3{font-size:24px;letter-spacing:-.03em}
#screen-fundaciones .titulazo{margin-top:26px;padding-bottom:10px}
#screen-fundaciones .buscador input{padding:11px 14px 11px 40px}
#screen-subastas .subastas-grid{flex:1;min-height:0;align-items:stretch}
#screen-subastas .subasta-card{display:flex;flex-direction:column}
#screen-subastas .subasta-foto{aspect-ratio:auto;}

/* los deseos también se pasan de a uno */
.suenos-lista{flex:1;min-height:0;display:flex;flex-direction:row;gap:12px;overflow-x:auto;
  scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;
  overscroll-behavior-x:contain;margin-top:6px}
.suenos-lista::-webkit-scrollbar{display:none}
#screen-deseos .buscador{max-width:100%}
#screen-deseos .stats-pantalla{padding-top:6px !important}
#screen-deseos .suenos-lista{margin-top:12px}

/* Cumplí tu deseo: formulario que entra y botones cómodos */
#screen-aporte .alta{flex:1;min-height:0;overflow-y:auto;padding:14px 14px 0;
  grid-template-columns:1fr;gap:0;display:block}
#screen-aporte .alta__intro{position:static}
#screen-aporte .alta__titulo{line-height:1.1;}
#screen-aporte .alta__lede{display:none}
#screen-aporte .eyebrow{display:none}
#screen-aporte .caja-deseo{font-size:15px;line-height:1.45;}
/* la acción queda pegada abajo, al alcance del pulgar */
#screen-aporte .field input,#screen-aporte .field select{padding:11px 13px}
#screen-aporte .field__hint{display:none}

/* Perfil: todo al alcance del pulgar */

.perfil-head{flex-direction:column;align-items:stretch;gap:12px}
.perfil-head .panel__title{font-size:24px}
.perfil-head__ctrls{flex-direction:column;align-items:stretch;gap:10px}
.perfil-head__ctrls .btn{width:100%;min-height:46px}
.switch{width:100%;padding:12px 14px}
.switch__t b{font-size:13.5px}
.switch__t span{max-width:none;font-size:11.5px}
.buscador-cuentas{max-width:100%;order:0}
.perfil__hero .banner{height:70px}
.perfil__id{padding:0 16px 16px;margin-top:-24px}
.perfil__id .avatar{width:62px;height:62px;font-size:20px}
.panel-donar{grid-template-columns:1fr;gap:10px}
.panel-donar .btn{min-height:52px}
.insignias{grid-template-columns:repeat(auto-fill,minmax(64px,1fr))}
.stack{gap:10px}
.subhead{margin:22px 0 10px}
.subhead span{font-size:10.5px}

/* botones grandes en todas las ventanas */
.btn{min-height:44px}
.btn--sm{min-height:38px}
.btn--xs{min-height:32px}


/* ===== Tarjetas de carrusel en celular =====
   Regla de oro: una tarjeta = una pantalla, sin scroll interno,
   y la acción principal abajo, dentro del pulgar. */
#screen-fundaciones .card{display:flex;flex-direction:column;height:100%}
#screen-fundaciones .card__body{display:flex;flex-direction:column;flex:1;min-height:0;
  gap:0;padding:18px 16px 14px}
#screen-fundaciones .card__body > div:first-child{flex:1;min-height:0;display:flex;flex-direction:column}
#screen-fundaciones .card__id{margin-bottom:12px}
#screen-fundaciones .card__id .avatar{width:52px;height:52px}
#screen-fundaciones .card__name{font-size:19px;line-height:1.15}
#screen-fundaciones .card__place{font-size:12px;margin-top:2px}
#screen-fundaciones .card__body .eyebrow{margin-top:0 !important;margin-bottom:8px}
/* mostramos la campaña principal: el resto está en la ficha */
#screen-fundaciones .card__causas > div:nth-child(n+3){display:none}
#screen-fundaciones .campana-click__cta{display:none}
#screen-fundaciones .card__ver{margin-top:auto;padding-top:10px;font-size:12.5px}
#screen-fundaciones .card__side{display:none}
#screen-fundaciones .card .btn--primary{width:100%;min-height:50px;margin-top:12px}
#screen-fundaciones .carrusel__slide{display:flex}

/* ===== Subastas ===== */
#screen-subastas .subasta-card{height:100%}
#screen-subastas .subasta-foto{flex:1;min-height:150px}
#screen-subastas .subasta-card__body{padding:14px 16px 16px;gap:2px}
#screen-subastas .subasta-card__titulo{font-size:17px;line-height:1.25}
#screen-subastas .subasta-card__precio{font-size:24px}
#screen-subastas .subasta-card__min{font-size:11.5px}
#screen-subastas .subasta-card__accion{margin-top:12px}
#screen-subastas .subasta-card__accion .btn{width:100%;min-height:50px}


/* ==================== BASE MÓVIL DEFINITIVA ====================
   Un solo scroll: el de la página. iOS se lleva mal con contenedores
   que scrollean adentro de otros, y `overflow-x:clip` no existe antes
   de iOS 16, así que la regla se caía y volvía a recortar todo. */
html,body{overflow-x:hidden;width:100%}
body{overflow-y:auto;-webkit-overflow-scrolling:touch}

.viewport{overflow:visible !important}
.panel{padding:0 0 24px !important;min-width:0}

.screen{min-height:0 !important;height:auto !important}
.screen.is-active{display:block !important}
.topbar__row,.stats-pantalla,.alta{max-width:100% !important;margin:0 !important}
.stats-pantalla{display:block !important}
.alta__top{padding:10px 14px calc(10px) !important;position:sticky;top:0;z-index:20;
  background:var(--blanco);border-bottom:1px solid var(--linea)}

/* nada scrollea adentro de nada, salvo los carruseles horizontales */
#screen-aporte .alta,
#screen-aporte .alta{padding:14px 14px 0 !important;}

/* los carruseles horizontales sí, y sólo en su eje */
.carrusel__viewport,.subastas-grid,.suenos-lista{overflow-y:hidden !important}
.suenos-lista{margin-top:8px}

/* nada se desborda a lo ancho */
img,svg,video{max-width:100%}
h1,h2,h3,p,b,span{overflow-wrap:anywhere}

/* la cinta de aviso no tapa el contenido */
.cielo-fondo{left:0;right:0;transform:none;max-width:100%}
.modal{left:0;right:0;transform:none;max-width:100%}


/* ==================== ESTÉTICA NOCTURNA ====================
   Superficies azul profundo, acento turquesa y bordes que iluminan. */
:root{--noche:#0b2136;--noche2:#0e2a44;--linea-noche:rgba(255,255,255,.12);--turquesa:#3ddbb5}

#screen-deseos,#screen-subastas,#screen-eventos,#screen-apoyo,#screen-avisos{
  background:radial-gradient(120% 80% at 50% 0%, #16324f 0%, #0d2038 45%, #081426 100%) !important;
  color:#fff}
#screen-deseos .alta__top,#screen-subastas .alta__top,#screen-eventos .alta__top,
#screen-apoyo .alta__top,#screen-avisos .alta__top{
  background:rgba(9,20,36,.86);backdrop-filter:blur(12px);border-bottom-color:var(--linea-noche)}
#screen-deseos .brand__name,#screen-subastas .brand__name,#screen-eventos .brand__name,
#screen-apoyo .brand__name,#screen-avisos .brand__name{color:#fff}
#screen-deseos .buscador input{background:rgba(255,255,255,.08);border-color:var(--linea-noche);color:#fff}
#screen-deseos .buscador input::placeholder{color:rgba(255,255,255,.45)}
#screen-deseos .empty,#screen-apoyo .empty,#screen-avisos .empty,#screen-subastas .empty{
  color:rgba(255,255,255,.65);border-color:var(--linea-noche)}

/* tarjetas de sueño */
.borrar-sueno{color:rgba(255,255,255,.45)}

/* subastas y muro */
.subasta-card,.post{background:linear-gradient(180deg,var(--noche2),var(--noche));
  border:1px solid rgba(61,219,181,.22);color:#fff}
.subasta-card__titulo,.post__titulo{color:#fff}
.subasta-card__precio{color:var(--turquesa);text-shadow:0 0 20px rgba(61,219,181,.4)}
.subasta-card__label,.subasta-card__min,.subasta-card__cierre{color:rgba(255,255,255,.55)}
.subasta-card__fund{border-top-color:var(--linea-noche);color:rgba(255,255,255,.6)}
.subasta-card__fund span{color:#fff}
.subasta-card .btn--cielo{background:linear-gradient(180deg,#3ddbb5,#1f9c7f);border:0;color:#06231c;font-weight:600}

/* eventos */
#screen-eventos .ecard{background:linear-gradient(180deg,var(--noche2),var(--noche));
  border:1px solid rgba(61,219,181,.22);color:#fff}
#screen-eventos .ecard__nombre,#screen-eventos .ecard__fecha{color:#fff}
#screen-eventos .ecard__lugar,#screen-eventos .ecard__desc{color:rgba(255,255,255,.6)}
#screen-eventos .carrusel__flecha{background:rgba(255,255,255,.1);border-color:var(--linea-noche);color:#fff}
#screen-eventos .punto{background:rgba(255,255,255,.28)}
#screen-eventos .punto.is-on{background:var(--turquesa)}

/* publicaciones */
.post{border-radius:18px;padding:18px 18px 16px;margin-bottom:14px}
.post__cab{display:flex;align-items:center;gap:11px;margin-bottom:12px}
.post__cab .avatar{width:38px;height:38px;font-size:12px;flex:none;box-shadow:0 0 0 2px rgba(61,219,181,.45)}
.post__cab b{display:block;font-size:14px;cursor:pointer}
.post__cab span{display:block;font-size:11.5px;color:rgba(255,255,255,.5)}
.post__titulo{font-size:19px;font-weight:400;letter-spacing:-.02em;margin:0 0 10px;line-height:1.2}
.post__texto{font-size:14px;line-height:1.6;color:rgba(255,255,255,.78);margin:12px 0 0}
.post__fotos{display:grid;gap:6px;border-radius:14px;overflow:hidden}
.post__fotos.es-varias{grid-template-columns:1fr 1fr}
.post__fotos span{display:block;height:150px;background-size:cover;background-position:center;
  background-color:rgba(255,255,255,.06)}
.post__previas{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.post__previas span{width:62px;height:62px;border-radius:10px;background-size:cover;background-position:center;
  border:1px solid var(--linea)}

/* notificaciones */


/* ==================== PORTADA ==================== */
#screen-home{width:100%;max-width:100%;margin:0;
  background:radial-gradient(130% 90% at 50% -10%, #16324f 0%, #0b2038 45%, #040d1c 100%) !important;
  color:#fff;min-height:100dvh !important}

/* halos de profundidad */
.portada__halo{position:absolute;border-radius:50%;filter:blur(70px);pointer-events:none}
.portada__halo--1{width:62vw;height:62vw;max-width:340px;max-height:340px;top:-8%;left:-18%;
  background:rgba(45,212,191,.34);animation:latir 9s ease-in-out infinite}
.portada__halo--2{width:70vw;height:70vw;max-width:380px;max-height:380px;bottom:-14%;right:-22%;
  background:rgba(163,230,53,.24);animation:latir 12s 1.5s ease-in-out infinite}
@keyframes latir{0%,100%{transform:scale(1);opacity:.8}50%{transform:scale(1.14);opacity:1}}

.portada__logo{position:relative;z-index:1;height:auto;
  filter:drop-shadow(0 0 26px rgba(45,212,191,.55)) drop-shadow(0 0 60px rgba(163,230,53,.28));
  animation:flotar 6s ease-in-out infinite;}
@keyframes flotar{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}

.portada__marca{position:relative;z-index:1;line-height:.95;}
.portada__m1,.portada__m2{display:block;font-weight:800;letter-spacing:-.02em;}
.portada__m1{color:#fff;text-shadow:0 4px 22px rgba(0,0,0,.5),0 0 34px rgba(255,255,255,.18)}
.portada__m2{background:linear-gradient(95deg,#22d3ee 0%,#2dd4a4 45%,#a3e635 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 20px rgba(45,212,191,.45))}

/* la línea con energía corriendo */
.portada__linea{position:relative;z-index:1;width:min(78%,320px);height:1px;margin:22px 0 16px;
  background:linear-gradient(90deg,transparent,rgba(45,212,191,.5),rgba(163,230,53,.5),transparent);
  box-shadow:0 0 14px rgba(45,212,191,.5)}
.portada__linea i{position:absolute;top:-1px;left:0;width:34%;height:3px;border-radius:3px;
  background:linear-gradient(90deg,transparent,#5eead4,#bef264,transparent);
  filter:blur(.4px);animation:corre 2.8s ease-in-out infinite}
@keyframes corre{0%{left:-36%}100%{left:102%}}

.portada__frase{position:relative;z-index:1;margin:0 0 30px;
  letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.82);font-weight:500;
  text-shadow:0 0 18px rgba(255,255,255,.22);}

.portada__zona{position:relative;z-index:1;width:100%;max-width:none;
  animation:apareceZona .38s cubic-bezier(.2,.8,.3,1) both}
@keyframes apareceZona{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}

/* botón principal */
.cta{position:relative;width:88%;margin:0 auto;display:flex;align-items:center;justify-content:center;gap:18px;
  border:0;cursor:pointer;border-radius:26px;padding:22px 26px;
  background:linear-gradient(100deg,#22d3ee 0%,#2dd4a4 50%,#a3e635 100%);
  box-shadow:0 0 26px rgba(45,212,191,.5),0 16px 40px rgba(0,0,0,.45),
    inset 0 1px 0 rgba(255,255,255,.5),inset 0 -3px 10px rgba(0,0,0,.16);
  transition:transform .16s cubic-bezier(.2,.8,.3,1),box-shadow .2s,filter .2s}
.cta:active{transform:scale(.965);
  box-shadow:0 0 46px rgba(94,234,212,.85),0 0 90px rgba(163,230,53,.45),
    inset 0 1px 0 rgba(255,255,255,.6);filter:brightness(1.08)}
.cta__ico{flex:none;width:38px;height:38px;display:grid;place-items:center;color:#06312a}
.cta__ico svg{width:100%;height:100%;filter:drop-shadow(0 1px 2px rgba(255,255,255,.4))}
.cta__linea{width:1px;height:34px;background:rgba(255,255,255,.45);border-radius:1px;flex:none}
.cta__txt{font-weight:800;letter-spacing:.06em;color:#fff;
  text-shadow:0 2px 10px rgba(0,0,0,.32);}
.cta--corto{width:100%;padding:17px 22px;border-radius:18px;margin-top:6px}
.cta--corto .cta__txt{font-size:18px;letter-spacing:.04em}

.portada__pie{margin:16px 0 0;color:rgba(255,255,255,.72);}

/* acceso, con vidrio */
.portada__acceso{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);
  border-radius:24px;padding:22px 20px 18px;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  box-shadow:0 20px 50px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.16)}
.campo-neon{text-align:left;}
.campo-neon label{display:block;font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(255,255,255,.6);margin-bottom:7px}
.campo-neon input{width:100%;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);
  border-radius:14px;color:#fff;font-size:16px;font-family:inherit;
  transition:border-color .18s,box-shadow .18s;}
.campo-neon input:focus{outline:0;border-color:rgba(94,234,212,.7);
  box-shadow:0 0 0 3px rgba(45,212,191,.18),0 0 22px rgba(45,212,191,.3)}
.portada__links{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;margin-top:16px}
.portada__links .linkish{color:rgba(255,255,255,.72);font-size:13px}
.portada__links .linkish:hover{color:#5eead4}
.portada__ayuda{margin:14px 0 0;font-size:11.5px;color:rgba(255,255,255,.5);line-height:1.5}
.portada__ayuda b{color:rgba(94,234,212,.9)}

.portada__sincuenta{position:relative;z-index:1;margin-top:24px;background:none;border:0;cursor:pointer;
  color:rgba(255,255,255,.5);font-size:13px;font-family:inherit;text-decoration:underline;
  text-underline-offset:4px}
.portada__sincuenta:active{color:#fff}

#screen-home .alert{background:rgba(229,72,77,.14);border:1px solid rgba(229,72,77,.4);color:#ffb4b6}

@media (max-height:680px){
  .portada__logo{width:min(30vw,110px)}
  .portada__marca{margin-top:14px}
  .portada__m1,.portada__m2{font-size:clamp(34px,10vw,46px)}
  .portada__linea{margin:14px 0 10px}
  .portada__frase{margin-bottom:20px}
  .cta{padding:18px 22px}
}


/* ============================================================
   SISTEMA VISUAL ÚNICO · vidrio oscuro
   Azul marino casi negro, paneles translúcidos con blur,
   bordes finos cian y luz que entra por los cantos.
   ============================================================ */
:root{
  --fondo:#050c17; --fondo2:#08172a; --petroleo:#0d2a3f;
  --vidrio:rgba(255,255,255,.055);
  --vidrio2:rgba(255,255,255,.085);
  --canto:rgba(103,232,249,.22);
  --canto-vivo:rgba(103,232,249,.5);
  --cian:#67e8f9; --turq:#2dd4bf; --celeste:#9fc4d8;
  --sombra-honda:0 22px 60px rgba(0,0,0,.55);
}

html,body{background:var(--fondo)}
body{color:#fff}

/* todas las pantallas comparten el mismo aire */
#screen-aporte,#screen-fundaciones,#screen-deseos,#screen-subastas,
#screen-eventos,#screen-apoyo,#screen-avisos,#screen-registro,#screen-stats{
  background:
    radial-gradient(90% 60% at 12% -8%, rgba(45,212,191,.10), transparent 60%),
    radial-gradient(80% 55% at 88% 4%, rgba(103,232,249,.09), transparent 62%),
    linear-gradient(180deg, #071426 0%, var(--fondo) 55%, #030913 100%) !important;
  color:#fff !important;min-height:100dvh}

/* barras superiores: vidrio esmerilado */
.topbar,.alta__top{background:rgba(6,17,31,.72) !important;
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(255,255,255,.08) !important}
.brand__name{color:#fff}
.logo-perfil__marca{box-shadow:0 0 18px rgba(103,232,249,.35)}

/* ---------- panel de vidrio, la pieza base ---------- */
.card,.subasta-card,.sueno-fila,.ecard,.post,.plan,.bloque,.ficha,.st-caja,.oferta-fila,
.destino-fijo,.desplegable,.aviso-caja,.selfund,.modal__box,.apoyo,.sug,
.perfil__hero,.tabla--hist{
  background:linear-gradient(180deg, var(--vidrio2), var(--vidrio)) !important;
  border:1px solid var(--canto) !important;
  border-radius:20px;
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  box-shadow:var(--sombra-honda), inset 0 1px 0 rgba(255,255,255,.12),
             inset 0 -18px 34px rgba(3,10,20,.35) !important;
  color:#fff}

/* ---------- tipografía ---------- */
h1,h2,h3,.panel__title,.stats-pantalla h2,.card__name,.ficha__nombre,.subasta-card__titulo,
.lede,.panel__note,.card__place,.ficha__lugar,.row__sub,.field__hint,.muted,.subhead span,
.subhead{border-color:rgba(255,255,255,.1) !important}
.subhead span{color:var(--celeste) !important}
.titulazo{border-bottom-color:rgba(255,255,255,.12) !important}
.titulazo h3{color:#fff !important}
.titulazo h3 b{color:var(--turq) !important}
.pista-edicion,.hist__monto{color:var(--celeste) !important}
b,strong{color:#fff}

/* ---------- campos ---------- */
.field label,.campo-neon label{color:var(--celeste) !important;font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase}
.field input,.field select,.field textarea,.buscador input,.selfund__q{
  background:rgba(255,255,255,.06) !important;border:1px solid rgba(255,255,255,.14) !important;
  color:#fff !important;border-radius:14px !important}
.field input::placeholder,.field textarea::placeholder,.buscador input::placeholder,
.selfund__q::placeholder{color:rgba(159,196,216,.55) !important}
.field input:focus,.field select:focus,.field textarea:focus,.buscador input:focus,
.selfund__q:focus{outline:0;border-color:var(--canto-vivo) !important;
  box-shadow:0 0 0 3px rgba(103,232,249,.14), 0 0 22px rgba(103,232,249,.18) !important}
.campo-bloqueado{background:rgba(255,255,255,.03) !important;color:rgba(159,196,216,.7) !important}
.paso-sep{color:var(--turq) !important;border-color:rgba(255,255,255,.12) !important}
.buscador__icono{color:var(--celeste)}
.selfund__lista,.sugerencias{background:rgba(8,22,38,.96) !important;
  border:1px solid var(--canto) !important;backdrop-filter:blur(16px)}
.sug,.selfund__op{background:transparent !important;border:0 !important;box-shadow:none !important;
  border-radius:0 !important;color:#fff}
.sug:hover,.selfund__op:hover{background:rgba(103,232,249,.08) !important}
.sug__m,.selfund__op span span{color:var(--celeste) !important}
.check{color:var(--celeste)}

/* ---------- botones ---------- */
.btn--primary{background:linear-gradient(100deg,#22d3ee,#2dd4bf 55%,#34d399) !important;
  color:#04222b !important;border:0 !important;font-weight:600;
  box-shadow:0 0 22px rgba(45,212,191,.32), inset 0 1px 0 rgba(255,255,255,.45) !important}
.btn--primary:active{filter:brightness(1.08);box-shadow:0 0 34px rgba(45,212,191,.5) !important}
.btn--cielo{background:rgba(103,232,249,.14) !important;color:var(--cian) !important;
  border:1px solid var(--canto-vivo) !important;box-shadow:inset 0 1px 0 rgba(255,255,255,.12) !important}
.btn--ghost{background:rgba(255,255,255,.05) !important;color:#fff !important;
  border:1px solid rgba(255,255,255,.16) !important}
.volver{color:var(--celeste) !important}
.linkish{color:var(--cian) !important}

/* ---------- barras de avance ---------- */
.meter,.sueno-card__barra,.avance__meter{background:rgba(255,255,255,.08) !important;
  border-color:rgba(255,255,255,.12) !important}
.meter__fill{background:linear-gradient(90deg,#22d3ee,#2dd4bf) !important;
  box-shadow:0 0 14px rgba(45,212,191,.5)}
.causa__row span,.causa__meta{color:var(--celeste) !important}

/* ---------- filas, tablas, desplegables ---------- */
.row{background:transparent !important;border-bottom:1px solid rgba(255,255,255,.08) !important;
  border-radius:0 !important;box-shadow:none !important}
.row__main,.tabla__n{color:#fff !important}
.tabla th{color:var(--celeste) !important;border-color:rgba(255,255,255,.12) !important}
.tabla td{border-color:rgba(255,255,255,.08) !important;color:#fff}
.desplegable__cab{background:transparent !important;color:#fff}
.desplegable__meta{color:var(--celeste) !important}
.empty{background:rgba(255,255,255,.03) !important;border:1px dashed rgba(255,255,255,.16) !important;
  color:var(--celeste) !important;border-radius:16px}
.estado{border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);color:var(--celeste)}
.estado--ok{background:rgba(45,212,191,.16);color:var(--turq);border-color:rgba(45,212,191,.35)}

/* ---------- carruseles ---------- */
.carrusel__flecha{background:rgba(255,255,255,.07) !important;border:1px solid rgba(255,255,255,.16) !important;
  color:#fff !important}
.punto{background:rgba(255,255,255,.22)}
.punto.is-on{background:var(--turq);box-shadow:0 0 10px rgba(45,212,191,.6)}

/* ---------- avatares e imágenes ---------- */
.avatar{box-shadow:0 0 0 1px rgba(103,232,249,.28)}
.banner,.bloque__img,.ecard__img,.subasta-foto,.card__id .avatar{background-color:rgba(255,255,255,.05)}

/* ---------- ventanas ---------- */
.modal{background:rgba(3,9,18,.72);backdrop-filter:blur(6px)}
.modal__box{border-radius:24px 24px 0 0 !important}
.modal__title{color:#fff}
.modal__sub{color:var(--celeste)}
.deseo-texto{background:rgba(255,255,255,.05) !important;color:#fff}
.toast{background:rgba(8,22,38,.96);border:1px solid var(--canto);color:#fff;
  box-shadow:var(--sombra-honda)}

/* ---------- planes ---------- */
.plan__nivel{color:var(--turq) !important}
.plan__monto{color:#fff !important}

/* ---------- perfil ---------- */
.perfil__hero{border-radius:22px;overflow:hidden}
.switch{background:rgba(255,255,255,.05) !important;border-color:rgba(255,255,255,.16) !important}
.switch__t b{color:#fff}
.switch__t span{color:var(--celeste)}
.insignia{background:transparent}
.apoyo__t b{color:#fff}
.apoyo__t span{color:var(--celeste)}

/* la entrada del menú conserva su color pero con el mismo vidrio */



/* ==================== AJUSTES FINALES ==================== */

/* portada */
.cta{gap:0}
.cta__txt{width:100%;text-align:center}
.portada__beta{position:relative;z-index:1;margin:16px 0 0;font-size:12.5px;
  color:rgba(159,196,216,.75);line-height:1.9}
.atajo{background:none;border:0;padding:2px 4px;cursor:pointer;font-family:inherit;
  font-size:12.5px;font-weight:700;letter-spacing:.08em}
.atajo--verde{color:#4ade80;text-shadow:0 0 12px rgba(74,222,128,.65)}
.atajo--cielo{color:#67e8f9;text-shadow:0 0 12px rgba(103,232,249,.65)}
.atajo:active{filter:brightness(1.25)}

/* las 5 entradas, un color cada una */







/* ---------- Cumplí tu sueño: entra en una pantalla ---------- */
#screen-aporte .alta{padding:12px 14px 0 !important}
#screen-aporte .alta__titulo{font-size:26px !important;font-weight:700;letter-spacing:-.03em;
  background:linear-gradient(95deg,#67e8f9,#2dd4bf 55%,#a3e635);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 16px rgba(45,212,191,.35));margin:2px 0 12px !important}
#screen-aporte .field{margin-bottom:9px !important}
#screen-aporte .field label{font-size:10px;margin-bottom:5px}
#screen-aporte .field input{padding:11px 13px !important}
#screen-aporte .paso-sep{margin:10px 0 8px !important;border:0;font-size:11px;
  color:var(--turq) !important;letter-spacing:.04em;text-transform:none;font-weight:600}
/* el buscador de fundación, discreto */
#screen-aporte .selfund{border:0 !important;background:none !important}
#screen-aporte .selfund__q{background:rgba(255,255,255,.04) !important;
  border:1px solid rgba(255,255,255,.1) !important;font-size:14px;padding:10px 13px !important}
#screen-aporte .selfund__lista{max-height:118px;border-radius:14px;margin-top:6px}
#screen-aporte .selfund__op{padding:9px 12px}
#screen-aporte .selfund__elegido{background:rgba(45,212,191,.1);border-radius:14px}

/* ---------- Sueños: la descripción se lee entera ---------- */

/* ---------- Subastas ---------- */
.subasta-foto{background-color:rgba(255,255,255,.04) !important;border-radius:18px 18px 0 0}
.subasta-foto__mini{display:none}
.subasta-card__cierre{color:var(--celeste) !important;background:transparent !important;
  border:0 !important;padding:0 !important;margin-top:10px;font-size:12px}
.subasta-card__cierre b{color:#fff !important}
.subasta-card__cierre span{color:var(--celeste) !important}
.subasta-card__cierre.is-urgente{color:#fca5a5 !important}
.subasta-card__cierre.is-urgente b{color:#fecaca !important}
.subasta-card__oferta.es-boton{background:transparent !important;margin:0;padding:10px 0}
.subasta-card__oferta.es-boton:active{background:rgba(103,232,249,.08) !important}
.subasta-card__productos,.producto-chip{display:none !important}
.subasta-card__accion .btn{background:linear-gradient(100deg,#22d3ee,#2dd4bf 55%,#34d399) !important;
  color:#04222b !important;border:0 !important}

/* ---------- perfil ---------- */
.perfil-head__ctrls{gap:8px}


/* ==================== TARJETAS DE ENTRADA ====================
   Superficie pulida: degradado intenso, brillo alto, canto luminoso,
   halo del mismo color y sombra honda para que floten. */
.menu-principal{display:flex;flex-direction:column;gap:16px;padding:12px 0 28px}

/* La superficie va en el propio botón: sin capas negativas, que rompen
   apenas otro estilo toca el apilado. */
/* reflejo diagonal, como el de una superficie pulida */




/* ==================== BARRA INFERIOR FLOTANTE ==================== */
.stats-pantalla{padding-bottom:120px !important}

/* ==================== NOTIFICACIONES ==================== */


/* ==================== ENCAJE EN PANTALLA ====================
   Todas las vistas usan el mismo ancho y el mismo margen lateral.
   El menú principal entra completo entre la cabecera y la barra. */
:root{--lado:16px; --barra:78px}

.topbar__row,.viewport,.stats-pantalla,.alta,.portada,#vistaLista,#panelIzq{
  max-width:none !important;width:100% !important;margin-left:0 !important;margin-right:0 !important;
  padding-left:16px !important;padding-right:16px !important;box-sizing:border-box}

/* cabecera: sólo el título, centrado */
.topbar__row{justify-content:center !important;padding-top:12px !important;padding-bottom:12px !important}
.topbar__titulo{font-size:12px;font-weight:700;letter-spacing:.3em;text-transform:uppercase;
  color:#fff;text-shadow:0 0 18px rgba(103,232,249,.4)}

/* la pantalla principal no se desplaza: el menú se reparte el alto */
body.menu-fijo{overflow:hidden}

/* la barra inferior es el límite: nada se le mete debajo */
.viewport,.stats-pantalla{padding-top:12px !important}

/* Cumplí tu sueño: la acción queda por encima de la barra */
#screen-aporte .alta{padding-bottom:calc(var(--barra) + 24px + env(safe-area-inset-bottom)) !important}
#screen-aporte .alta__top{padding-left:var(--lado) !important;padding-right:var(--lado) !important}

/* las etiquetas y ayudas de esa pantalla, en verde agua */
#screen-aporte .field label,#screen-aporte .paso-sep,#screen-aporte .field__hint,
#screen-aporte .selfund__vacio{color:#5eead4 !important}
#screen-aporte .selfund__q::placeholder{color:rgba(94,234,212,.55) !important}
#screen-aporte .field input,#screen-aporte .field textarea,#screen-aporte .selfund__q{color:#fff !important}

/* montos de las campañas, más brillantes */
.causa__pie span{color:var(--celeste) !important}
.causa__pie b{color:#5eead4 !important;text-shadow:0 0 14px rgba(94,234,212,.45)}
.causa__row b{color:#67e8f9 !important}
.causa__meta{color:#7dd3fc !important}


/* ==================== CIERRE: UNA SOLA RESOLUCIÓN ====================
   Última capa. Fija el lienzo para que ninguna regla heredada del
   escritorio vuelva a angostar la app ni a permitir scroll de página. */
*,*::before,*::after{box-sizing:border-box}
html{height:100%;background:#050c17 !important}
body{margin:0 !important;padding:0 !important;width:100% !important;max-width:100% !important;
  min-height:100%;background:#050c17 !important;overflow-x:hidden !important}

/* portada y menú: exactamente una pantalla, sin desplazamiento */
body.portada,body.menu-fijo{height:100dvh;overflow:hidden !important;position:fixed;inset:0}
/* el contenido de la portada se mide en alto de pantalla */
.portada__logo{width:min(34vw,140px);max-height:19vh}
.portada__marca{margin-top:clamp(10px,2.2vh,22px)}
.portada__frase{font-size:clamp(11px,1.6vh,14px);}
.cta{padding:clamp(15px,2.4vh,22px) 26px}
.cta__txt{font-size:clamp(21px,3.4vh,30px)}
.portada__pie{margin-top:clamp(8px,1.6vh,16px);font-size:clamp(12px,1.7vh,14px)}
.campo-neon{margin-bottom:clamp(8px,1.6vh,14px)}
.campo-neon input{padding:clamp(10px,1.8vh,14px) 15px}
.portada__beta{margin-top:clamp(8px,1.6vh,16px)}
.portada__halo{opacity:.75}

/* el menú: la barra inferior es el piso exacto */


/* ==================== CIELO DEL MENÚ ====================
   Estrellas quietas que se encandilan, y fugaces que cruzan las tarjetas. */
#vistaLista{position:relative}
.chispas{position:absolute;inset:0;pointer-events:none;overflow:hidden;border-radius:20px}
.chispas{z-index:3}
.titila{position:absolute;width:2.5px;height:2.5px;border-radius:50%;background:#fff;opacity:.22;
  animation:destello 8s ease-in-out infinite}
@keyframes destello{
  0%,100%{opacity:.18;transform:scale(1);box-shadow:none}
  5%{opacity:1;transform:scale(2.4);box-shadow:0 0 10px 3px rgba(180,240,255,.85)}
  13%{opacity:.18;transform:scale(1);box-shadow:none}
}
.chispas .fugaz{position:absolute;width:0;height:2px;border-radius:2px;opacity:0;
  background:linear-gradient(90deg,transparent,rgba(190,245,255,.95));
  box-shadow:0 0 10px rgba(160,235,255,.9)}
.chispas .fugaz.is-on{animation:cruza var(--dur,1.4s) ease-in forwards}


/* ---- Cumplí tu sueño: tarjeta de vidrio y selector en tiras ---- */
.tarjeta-form{background:linear-gradient(180deg, rgba(255,255,255,.085), rgba(255,255,255,.05));
  border:1px solid rgba(103,232,249,.22);border-radius:20px;padding:16px 16px 6px;
  box-shadow:0 18px 44px rgba(2,8,18,.5), inset 0 1px 0 rgba(255,255,255,.14)}
.tarjeta-form .field:last-child{margin-bottom:10px}
#screen-aporte .caja-deseo{background:rgba(255,255,255,.05) !important;
  border:1px solid rgba(255,255,255,.12) !important;border-radius:14px !important;
  font-weight:500;text-align:left}

.fund-tiras{display:flex;gap:9px;overflow-x:auto;padding:2px 0 6px;
  scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.fund-tiras::-webkit-scrollbar{display:none}
.fund-tira{flex:0 0 auto;scroll-snap-align:start;display:flex;align-items:center;gap:9px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:999px;
  padding:7px 14px 7px 7px;cursor:pointer;color:#fff;font-family:inherit;
  transition:border-color .16s,background .16s,box-shadow .16s}
.fund-tira .avatar{width:30px;height:30px;font-size:11px;flex:none}
.fund-tira__n{font-size:13px;white-space:nowrap}
.fund-tira.is-on{border-color:rgba(94,234,212,.8);background:rgba(45,212,191,.16);
  box-shadow:0 0 20px rgba(45,212,191,.28)}
.fund-tira.is-on .fund-tira__n{color:#5eead4;font-weight:600}


/* ==================== REPARTO DEL ESPACIO ====================
   El menú se resuelve con una grilla de cinco filas iguales:
   así no puede quedar aire sobrante abajo. */

/* ==================== PANTALLAS QUIETAS ====================
   Sueños y Subastas se comportan como Fundaciones: sin scroll de página. */
body.sin-scroll{overflow:hidden !important;position:fixed;inset:0}
#screen-deseos.is-active,#screen-subastas.is-active,#screen-eventos.is-active{
  height:100dvh;display:flex;flex-direction:column}
#screen-deseos .stats-pantalla,#screen-subastas .stats-pantalla,#screen-eventos .stats-pantalla{
  flex:1;min-height:0;display:flex !important;flex-direction:column;
  padding-bottom:calc(var(--nav-alto) + 10px) !important}
#screen-deseos .suenos-lista,#screen-subastas .subastas-grid{flex:1;min-height:0;align-items:stretch}
#screen-eventos .carrusel{flex:1;min-height:0}
#screen-eventos .carrusel__viewport{height:100%}
#screen-eventos .carrusel__slide{display:flex}
#screen-eventos .ecard{width:100%;display:flex;flex-direction:column}
#screen-eventos .ecard__img{flex:1;min-height:110px;height:auto}

/* ==================== FORMULARIO EN UN SOLO RECTÁNGULO ==================== */
.alta__form{background:transparent !important;border:0 !important;padding:0 !important;
  box-shadow:none !important}
.alta__intro{margin-bottom:10px}
.tarjeta-form{padding:16px 16px 8px}
.field--fund{position:relative}
.busca-fund{width:100%;background:rgba(255,255,255,.05) !important;
  border:1px solid rgba(255,255,255,.14) !important;border-radius:14px !important;
  padding:11px 13px !important;color:#fff !important;font-family:inherit;font-size:15px}
.busca-fund::placeholder{color:rgba(94,234,212,.5)}
.fund-res{margin-top:8px;max-height:132px;overflow-y:auto;display:flex;flex-direction:column;gap:5px;
  scrollbar-width:none}
.fund-res::-webkit-scrollbar{display:none}
.fund-op{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:7px 11px;cursor:pointer;
  color:#fff;font-family:inherit;text-align:left;transition:border-color .15s,background .15s}
.fund-op .avatar{width:26px;height:26px;font-size:10px;flex:none}
.fund-op__n{font-size:13.5px}
.fund-op.is-on{border-color:rgba(94,234,212,.75);background:rgba(45,212,191,.16)}
.fund-op.is-on .fund-op__n{color:#5eead4;font-weight:600}
.fund-res__vacio{font-size:12.5px;color:var(--celeste);margin:6px 2px}

/* ==================== NOTIFICACIONES ==================== */
#screen-avisos #listaAvisos{display:flex;flex-direction:column;gap:12px}


/* ---- perfil ordenado ---- */
#panelIzq .panel__title{margin:6px 0 14px}
#panelIzq .buscador-wrap{margin-bottom:16px}
#panelIzq .perfil__hero{margin-bottom:14px}
#panelIzq .switch{width:100%;margin-bottom:4px}
.apoyo{display:block;padding:14px 16px}
.apoyo__cab{display:flex;align-items:center;gap:11px;margin-bottom:10px}
.apoyo__cab .avatar{width:34px;height:34px;font-size:12px;flex:none}
.apoyo__cab b{font-size:15px;font-weight:600;line-height:1.25;color:#fff;cursor:pointer;
  overflow-wrap:anywhere}
.apoyo__linea{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap}
.apoyo__m{font-size:19px;font-weight:600;color:var(--turq,#2dd4bf);white-space:nowrap}
.apoyo__m span{font-size:12px;font-weight:400;color:var(--celeste)}
.apoyo__plan{font-size:12px;color:var(--celeste)}
.apoyo__baja{margin-top:12px;width:100%}
.cerrar-zona{margin:20px 0 0}


/* ==================== MENÚ: OCUPA TODO EL ALTO ====================
   La cadena de alturas se cortaba porque .panels estaba forzado a
   display:block. Acá se restablece sólo para la página principal. */
/* cada tarjeta llena su fila, sin altura mínima que la frene */


/* ==================== MENÚ ANCLADO ====================
   En vez de heredar altura por una cadena de contenedores (frágil, y ya
   nos falló dos veces), el menú se ancla al hueco real entre la cabecera
   y la barra inferior. El alto queda definido, no calculado por herencia. */


/* el campo de usuario cambia de rol al deslizarlo */
@keyframes giraRol{
  0%{opacity:0;transform:translateX(14px)}
  100%{opacity:1;transform:none}
}


/* ==================== CORAZÓN Y PERFIL: TODO A LA VISTA ====================
   La ventana no se mueve; si el contenido sobra, se desplaza sólo el
   bloque interior, no la página. */
#screen-apoyo.is-active,#screen-avisos.is-active{height:100dvh;overflow:hidden;
  display:flex;flex-direction:column}
#screen-apoyo .stats-pantalla,#screen-avisos .stats-pantalla{flex:1;min-height:0;
  display:flex !important;flex-direction:column;padding-bottom:0 !important}
.bloque-scroll{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;
  padding-bottom:calc(var(--nav-alto) + 16px);
  scrollbar-width:none}
.bloque-scroll::-webkit-scrollbar{display:none}
#screen-apoyo .subhead:first-child{margin-top:0}
#screen-apoyo .subhead{margin:16px 0 8px}

/* apoyos mensuales, en una línea */
.fila-apoyo{display:flex;align-items:center;gap:11px;background:rgba(255,255,255,.05);
  border:1px solid rgba(103,232,249,.16);border-radius:13px;padding:9px 13px}
.fila-apoyo .avatar{width:28px;height:28px;font-size:10px;flex:none}
.fila-apoyo__n{flex:1;min-width:0;font-size:14px;font-weight:600;cursor:pointer;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fila-apoyo__m{flex:none;font-size:14px;font-weight:600;color:var(--turq)}

/* historial simple: fecha, destino, monto */
.hist-lista{display:flex;flex-direction:column}
.hist-fila{display:grid;grid-template-columns:70px 1fr auto;align-items:center;gap:10px;
  padding:9px 2px;border-bottom:1px solid rgba(255,255,255,.07);font-size:13px}
.hist-fila:last-child{border-bottom:0}
.hist-fila__f{color:var(--celeste);font-size:11.5px}
.hist-fila__d{color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hist-fila__m{color:var(--turq);font-weight:600;white-space:nowrap}

/* perfil: título y estadísticas a la misma altura, y sin mover la ventana */
.perfil-titulo{display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin:2px 0 12px}
.perfil-titulo .panel__title{margin:0;font-size:24px}
#panelIzq{flex-direction:column;min-height:0}
body.perfil-fijo{overflow:hidden}


/* modal a pantalla completa, para el registro */
.modal__box--pleno{max-width:100% !important;width:100% !important;height:100dvh !important;
  max-height:100dvh !important;border-radius:0 !important;display:flex;flex-direction:column;
  padding:calc(18px + env(safe-area-inset-top)) 18px calc(14px + env(safe-area-inset-bottom)) !important}
.modal__box--pleno #modalBody{flex:1;min-height:0;overflow-y:auto}
.modal__box--pleno .modal__actions{margin-top:auto;padding-top:14px;
  border-top:1px solid rgba(255,255,255,.1);background:transparent}
.modal__box--pleno .modal__actions .btn{flex:1;min-height:50px}
.modal__actions{background:transparent !important}


/* ==================== PERFIL Y ESTADÍSTICAS: PANTALLA QUIETA ==================== */
body.perfil-quieto{overflow:hidden !important;position:fixed;inset:0}
body.perfil-quieto #screen-app{height:100dvh;display:flex;flex-direction:column;overflow:hidden}
body.perfil-quieto .viewport{flex:1;min-height:0;display:flex;flex-direction:column;
  padding-bottom:calc(var(--nav-alto) + 10px) !important}
body.perfil-quieto #panelIzq{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;
  scrollbar-width:none;padding-bottom:150px !important}
body.perfil-quieto #panelIzq::-webkit-scrollbar{display:none}
/* medidas compactas para que entre todo */
body.perfil-quieto .volver{margin-bottom:2px}
body.perfil-quieto .perfil-titulo{margin:0 0 10px}
body.perfil-quieto .perfil-titulo .panel__title{font-size:22px}
body.perfil-quieto .buscador-wrap{margin-bottom:12px}
body.perfil-quieto .perfil__hero{margin-bottom:12px}
body.perfil-quieto .perfil__hero .banner{height:56px}
body.perfil-quieto .perfil__id{padding:0 14px 14px;margin-top:-20px}
body.perfil-quieto .perfil__id .avatar{width:54px;height:54px;font-size:17px}
body.perfil-quieto .pista-edicion{display:none}
body.perfil-quieto .switch{padding:11px 13px}
body.perfil-quieto .switch__t span{font-size:11px}
body.perfil-quieto .panel-donar{margin-top:12px}
body.perfil-quieto .cerrar-zona{margin:18px 0 0}

/* estadísticas: cabecera fija y el detalle desplazándose adentro */
#screen-stats.is-active{height:100dvh;overflow:hidden;display:flex;flex-direction:column}
#screen-stats .stats-pantalla{overflow-y:auto;-webkit-overflow-scrolling:touch;
  padding-bottom:calc(24px + env(safe-area-inset-bottom)) !important;scrollbar-width:none;}
#screen-stats .stats-pantalla::-webkit-scrollbar{display:none}


/* Cumplí tu sueño: pantalla quieta, todo a la vista */
#screen-aporte.is-active{height:100dvh;overflow:hidden;
  display:flex !important;flex-direction:column;align-items:center}
#screen-aporte .alta__top{width:100%}
#screen-aporte .alta,#screen-aporte .alta__form,#screen-aporte #apCampos,
#screen-aporte .alta{flex:1;min-height:0;display:flex !important;flex-direction:column;
  width:100% !important;max-width:520px !important;margin:0 auto !important}
#screen-aporte .alta__intro{flex:none}
#screen-aporte .alta__form{flex:1;min-height:0;display:flex;flex-direction:column}
#screen-aporte #apCampos{flex:1;min-height:0;overflow-y:auto;scrollbar-width:none}
#screen-aporte #apCampos::-webkit-scrollbar{display:none}
#screen-aporte .tarjeta-form{height:100%;display:flex;flex-direction:column;padding:14px 14px 6px}
#screen-aporte .tarjeta-form .field{margin-bottom:8px}
#screen-aporte .tarjeta-form .field:nth-child(2){flex:1;min-height:0;display:flex;flex-direction:column}
#screen-aporte .caja-deseo{flex:1;min-height:60px !important;height:auto !important}
#screen-aporte .field--fund{flex:none}
#screen-aporte .fund-res{max-height:96px}


/* ==================== ESTADÍSTICAS: TODO EN UNA PANTALLA ==================== */
#screen-stats.is-active{height:100dvh;display:flex;flex-direction:column;overflow:hidden}
#screen-stats .stats-pantalla{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column;
  padding:10px 16px calc(14px + env(safe-area-inset-bottom)) !important}
#screen-stats h2{font-size:20px;margin:0 0 2px}
#screen-stats .lede{display:none}
.stats-usuario{flex:1;min-height:0;display:grid;grid-template-columns:1fr 1fr;
  grid-auto-rows:1fr;gap:9px;max-width:none;margin-top:8px}
.stats-usuario .statc{margin:0;padding:12px 13px;display:flex;flex-direction:column;
  justify-content:center;border-radius:16px}
.stats-usuario .statc__cab{display:block}
.stats-usuario .statc__label{font-size:10px;letter-spacing:.1em;line-height:1.25;
  text-transform:uppercase;color:var(--celeste)}
.stats-usuario .statc__num{font-size:clamp(20px,3.4vh,28px);font-weight:300;margin-top:4px;color:#fff}
.stats-usuario .statc__sub{font-size:10.5px;margin-top:3px;color:var(--celeste);line-height:1.3}
/* los desgloses y gráficos se ven en su propio detalle, no acá */
.stats-usuario .statc__toggle,.stats-usuario .statc__cuerpo{display:none !important}


/* ==================== PLACA DEL MENÚ ====================
   Capa propia, colgada del cuerpo y no de la cadena de contenedores.
   Se ubica sola entre la cabecera y la barra: nada de lo que pase
   más abajo en el árbol puede afectarla. */
.placa{position:fixed;left:0;right:0;z-index:70;display:none;
  top:66px;bottom:calc(var(--nav-alto) + 12px);
  padding:0 16px;pointer-events:none}
body.menu-fijo .placa{display:flex;flex-direction:column;pointer-events:auto}
.placa .menu-principal{flex:1;min-height:0;display:flex;flex-direction:column;
  gap:12px;padding:0;margin:0}


/* ---- centro de notificaciones: cinco entran cómodas ---- */
#screen-avisos #listaAvisos{gap:9px}
#screen-avisos h2{font-size:20px;margin-bottom:4px}

/* ---- tocar la foto abre el selector ---- */
.avatar-edit{cursor:pointer;position:relative}
.avatar-edit::after{content:"";position:absolute;inset:auto 0 0 0;height:34%;
  background:linear-gradient(transparent, rgba(0,0,0,.5));border-radius:0 0 50% 50%}


/* ==================== PLACA DE SUEÑOS ====================
   El listado se despega de la cadena de contenedores y se ancla entre la
   cabecera y la barra, igual que el menú principal. */
#screen-deseos .stats-pantalla,#screen-subastas .stats-pantalla,#screen-eventos .stats-pantalla{
  position:fixed;left:0;right:0;
  top:88px;bottom:calc(var(--nav-alto) + 4px);
  z-index:5;padding:0 16px !important;display:flex !important;flex-direction:column;
  overflow:hidden}
#screen-deseos .buscador-wrap{flex:none;margin-bottom:8px}
#screen-deseos h2,#screen-subastas h2,#screen-eventos h2{flex:none;font-size:18px;margin:0 0 6px}

/* el carrusel ocupa el alto disponible y la tarjeta se estira dentro */
#screen-deseos .suenos-lista,#screen-subastas .subastas-grid,
#screen-eventos .carrusel{flex:1;min-height:0;margin-top:0}
#screen-eventos .carrusel__viewport{height:100%}
#screen-subastas .subasta-foto,#screen-eventos .ecard__img{flex:1;min-height:110px;height:auto}
#screen-subastas .subastas-nav{flex:none;margin-top:10px}


/* ==================== TARJETAS COMPLETAS A LA VISTA ====================
   Nada de scroll interno ni recortes: la tarjeta reparte su alto entre
   las partes fijas (cabecera, cifras, botón) y le da el resto al texto,
   que se ajusta a las líneas que entren. */

/* ---- Sueños en subasta activa ---- */
#screen-deseos .borrar-sueno{flex:none;padding:6px 0 0;font-size:11px}

/* ---- Subastas solidarias ---- */
#screen-subastas .subasta-card{height:100%;display:flex;flex-direction:column;overflow:hidden}
#screen-subastas .subasta-foto{flex:0 0 34%;min-height:0;height:auto}
#screen-subastas .subasta-card__body{flex:1;min-height:0;display:flex;flex-direction:column;
  padding:12px 15px 14px;gap:0;overflow:hidden}
#screen-subastas .subasta-card__titulo{flex:none;font-size:16px;line-height:1.22;margin:0;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#screen-subastas .subasta-card__oferta{flex:none;margin:8px 0 0;padding:6px 0}
#screen-subastas .subasta-card__label{font-size:9.5px;letter-spacing:.12em}
#screen-subastas .subasta-card__precio{font-size:clamp(21px,3.1vh,27px);line-height:1.05}
#screen-subastas .subasta-card__min{font-size:10.5px;line-height:1.35;margin-top:3px}
#screen-subastas .subasta-card__cierre{flex:none;margin-top:7px;font-size:11px}
#screen-subastas .subasta-card__fund{flex:none;margin-top:9px;padding-top:9px;gap:9px}
#screen-subastas .subasta-card__fund .avatar{width:28px;height:28px;font-size:10px}
#screen-subastas .subasta-card__benef{font-size:9.5px;letter-spacing:.1em}
#screen-subastas .subasta-card__fund span span{font-size:13.5px;margin-top:0}
#screen-subastas .subasta-card__accion{flex:none;margin-top:auto;padding-top:10px}
#screen-subastas .subasta-card__accion .btn{min-height:44px;font-size:14.5px}

/* en pantallas cortas, el texto cede primero */
@media (max-height:700px){
  #screen-subastas .subasta-foto{flex:0 0 26%}
}


/* Aportar desde otra faceta: títulos en negro. Para que se lean, la caja
   pasa a fondo claro; en oscuro el negro sería invisible. */
#screen-aporte .vop{background:rgba(255,255,255,.94) !important;
  border:1px solid rgba(255,255,255,.6) !important;border-radius:14px;padding:13px 15px}
#screen-aporte .vop__n{color:#000 !important;font-weight:700}
#screen-aporte .vop__d{color:#43606d !important}
#screen-aporte .vop.is-on{border-color:#00A6B4 !important;
  box-shadow:0 0 0 2px rgba(0,166,180,.35), 0 0 20px rgba(0,166,180,.3) !important}
#screen-aporte .vopciones{display:flex;flex-direction:column;gap:9px}


/* bajada de la portada */
.portada__bajada{position:relative;z-index:1;margin:clamp(10px,2vh,20px) auto 0;max-width:26ch;
  font-size:clamp(18px,2.9vh,24px);line-height:1.35;color:rgba(255,255,255,.86);font-weight:300;
  text-shadow:0 1px 12px rgba(0,0,0,.4)}
.portada__bajada b{font-weight:700}
.portada__bajada .es-cielo{color:#67e8f9;text-shadow:0 0 14px rgba(103,232,249,.55)}
.portada__bajada .es-verde{color:#4ade80;text-shadow:0 0 14px rgba(74,222,128,.55)}


/* El aviso emergente se escondía sólo desplazándose, y como estaba a 26px
   del borde, su canto superior asomaba como un arco bajo la barra.
   Ahora en reposo está apagado y fuera de alcance. */
.toast{opacity:0;visibility:hidden;pointer-events:none;
  transform:translate(-50%,220%) !important;
  transition:transform .28s cubic-bezier(.2,.8,.3,1), opacity .2s, visibility .2s}
.toast.is-on{opacity:1;visibility:visible;pointer-events:auto;
  transform:translate(-50%,0) !important;
  bottom:calc(var(--nav-alto) + 16px)}


/* ==================== CABECERA DE LA PÁGINA PRINCIPAL ==================== */
.topbar__row{justify-content:flex-start !important;gap:12px;align-items:center;
  padding-top:10px !important;padding-bottom:10px !important}
.cab__logo{width:46px;height:46px;object-fit:contain;flex:none;
  filter:drop-shadow(0 0 12px rgba(103,232,249,.45))}
.cab__texto{flex:1;min-width:0;text-align:left}
.cab__marca{margin:0;font-size:clamp(19px,5.4vw,25px);font-weight:800;letter-spacing:.02em;line-height:1.05}
.cab__marca span{color:#fff}
.cab__marca b{font-weight:800;background:linear-gradient(95deg,#22d3ee,#2dd4a4 45%,#a3e635);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.cab__lema{margin:3px 0 0;font-size:12px;line-height:1.3;color:rgba(159,196,216,.85);font-style:normal}
.cab__lema i{font-style:normal;font-weight:600}
.cab__lema .es-cielo{color:#67e8f9}
.cab__lema .es-verde{color:#4ade80}
.cab__perfil{position:relative;flex:none;width:46px;height:46px;border-radius:50%;
  background:rgba(255,255,255,.05);border:1px solid rgba(103,232,249,.35);
  display:grid;place-items:center;color:rgba(255,255,255,.75);cursor:pointer}
.cab__perfil svg{width:24px;height:24px}
.cab__perfil:active{transform:scale(.94)}

/* ==================== TARJETAS: ÍCONO, TEXTO Y FLECHA ==================== */

/* ==================== BARRA CON ETIQUETAS ==================== */
.nav5__b{grid-template-rows:auto auto;gap:3px;align-content:center}
.nav5__b svg{width:24px;height:24px}
.nav5__txt{font-size:10px;letter-spacing:.01em;color:inherit}
.nav5__punto{top:8px;right:calc(50% - 17px)}


/* Cumplí tu sueño: el título ya está en la cabecera; el de abajo se va
   y su espacio lo aprovecha la tarjeta de campos. */
#screen-aporte .alta__intro{display:none !important}
#screen-aporte .alta{padding-top:10px !important}
#screen-aporte .tarjeta-form{height:100%;padding:16px 16px 8px}


/* ==================== CIELO CON MÁS VIDA ====================
   Más estrellas y algunas que se encandilan a destiempo. */
body.noche .cielo-fondo{opacity:1}
.cielo-fondo::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(1.6px 1.6px at 12% 16%, rgba(255,255,255,.85), transparent),
    radial-gradient(1.2px 1.2px at 27% 62%, rgba(200,240,255,.7), transparent),
    radial-gradient(1.8px 1.8px at 44% 24%, rgba(255,255,255,.9), transparent),
    radial-gradient(1.2px 1.2px at 58% 78%, rgba(200,240,255,.65), transparent),
    radial-gradient(1.5px 1.5px at 73% 34%, rgba(255,255,255,.8), transparent),
    radial-gradient(1.2px 1.2px at 86% 68%, rgba(190,235,255,.7), transparent),
    radial-gradient(1.7px 1.7px at 93% 18%, rgba(255,255,255,.85), transparent),
    radial-gradient(1.2px 1.2px at 34% 91%, rgba(255,255,255,.7), transparent),
    radial-gradient(1.4px 1.4px at 66% 8%, rgba(210,245,255,.75), transparent),
    radial-gradient(1.1px 1.1px at 8% 44%, rgba(255,255,255,.6), transparent),
    radial-gradient(1.3px 1.3px at 51% 47%, rgba(255,255,255,.7), transparent),
    radial-gradient(1.1px 1.1px at 79% 88%, rgba(200,240,255,.6), transparent)}
.titila{width:3.4px;height:3.4px;opacity:.3}
@keyframes destello{
  0%,100%{opacity:.25;transform:scale(1);box-shadow:none}
  5%{opacity:1;transform:scale(3);box-shadow:0 0 16px 5px rgba(200,245,255,.95)}
  15%{opacity:.25;transform:scale(1);box-shadow:none}
}


/* El número arrancaba encima del signo $: le damos su propio espacio. */
.pesos input,#screen-aporte .pesos input{padding-left:40px !important}
.pesos__signo{left:16px;font-size:15px}


/* Cumplí tu sueño: un solo botón, sin franja de fondo desfasada. */
.btn--publicar{width:100%;min-height:56px;font-size:17px;font-weight:700;letter-spacing:.01em;
  border-radius:16px;
  box-shadow:0 0 28px rgba(45,212,191,.4), inset 0 1px 0 rgba(255,255,255,.5)}
.btn--publicar:active{filter:brightness(1.1);box-shadow:0 0 40px rgba(45,212,191,.6)}
#screen-aporte .alta{padding-bottom:0 !important}
#screen-aporte .tarjeta-form{flex:1;min-height:0;display:flex;flex-direction:column}
#screen-aporte .tarjeta-form .field:nth-child(2){flex:1;min-height:0;display:flex;flex-direction:column}
#screen-aporte .caja-deseo{flex:1;min-height:0}

/* Switch: "Este sueño es de una fundación" */
.switch-fundacion{display:flex;align-items:center;gap:12px;margin:12px 0 16px;
  cursor:pointer;-webkit-tap-highlight-color:transparent}
.switch-fundacion__input{position:absolute;opacity:0;width:0;height:0}
.switch-fundacion__track{position:relative;width:46px;height:26px;border-radius:999px;
  background:rgba(255,255,255,.15);transition:background .2s;flex:none}
.switch-fundacion__track::after{content:"";position:absolute;left:3px;top:3px;width:20px;height:20px;
  border-radius:50%;background:#fff;transition:transform .2s}
.switch-fundacion__input:checked + .switch-fundacion__track{background:#43AA8B}
.switch-fundacion__input:checked + .switch-fundacion__track::after{transform:translateX(20px)}
.switch-fundacion__txt{font-size:14px;font-weight:500;color:#F3F8FA}

/* Otros sueños por cumplir: la tarjeta ocupa todo el alto disponible. */
#screen-subastas .stats-pantalla{padding-top:6px !important}
#screen-subastas .subastas-grid{flex:1;min-height:0;padding-bottom:0}


/* La portada no se desplaza: en pantallas cortas todo se achica para entrar. */
@media (max-height:720px){
  .portada__logo{width:min(24vw,92px);max-height:12vh}
  .portada__m1,.portada__m2{font-size:clamp(26px,5.4vh,40px)}
  .portada__bajada{font-size:clamp(14px,2.2vh,17px);margin-top:8px}
  .portada__linea{margin:8px 0 6px}
  .portada__acceso{padding:12px 14px}
  .campo-neon{margin-bottom:8px}
  .campo-neon input{padding:10px 13px}
  .cta--corto{padding:13px 18px}
}
@media (max-height:600px){
  .portada__logo{display:none}
  .portada__m1,.portada__m2{font-size:clamp(22px,5vh,32px)}
  .portada__bajada{font-size:13px}
}


/* ==================== PORTADA: DIFUMINADO SIN CORTES ====================
   Los halos vivían dentro de una caja recortada y se veía el borde duro.
   Ahora el resplandor es parte del fondo de la pantalla. */
.portada__halo{display:none}
#screen-home{background:
    radial-gradient(58vw 58vw at 8% 6%, rgba(45,212,191,.26), transparent 62%),
    radial-gradient(64vw 64vw at 94% 92%, rgba(163,230,53,.18), transparent 62%),
    radial-gradient(130% 90% at 50% -10%, #16324f 0%, #0b2038 45%, #040d1c 100%) !important}

/* ==================== MI PERFIL ==================== */
.perfil-tarjeta{position:relative;overflow:hidden;border-radius:22px;padding:22px 20px;
  display:flex;align-items:center;gap:16px;margin-bottom:16px;
  background:linear-gradient(120deg, rgba(45,212,191,.18), rgba(13,42,63,.55) 55%, rgba(6,17,31,.6));
  border:1px solid rgba(103,232,249,.2);
  box-shadow:0 16px 40px rgba(2,10,20,.5), inset 0 1px 0 rgba(255,255,255,.12)}
.perfil-tarjeta__cielo{position:absolute;inset:0;pointer-events:none;opacity:.8;
  background:
    radial-gradient(1px 1px at 22% 24%, rgba(255,255,255,.9), transparent),
    radial-gradient(1px 1px at 48% 12%, rgba(255,255,255,.7), transparent),
    radial-gradient(1.2px 1.2px at 63% 32%, rgba(255,255,255,.85), transparent),
    radial-gradient(1px 1px at 78% 18%, rgba(210,245,255,.7), transparent),
    radial-gradient(1px 1px at 88% 46%, rgba(255,255,255,.6), transparent),
    radial-gradient(1px 1px at 35% 62%, rgba(255,255,255,.5), transparent)}
.perfil-foto{position:relative;flex:none;background:none;border:0;padding:0;cursor:pointer}
.perfil-foto__img{display:grid;place-items:center;width:88px;height:88px;border-radius:50%;
  border:3px solid #fff;font-size:34px;font-weight:600;color:#0b2136;
  background-size:cover;background-position:center;
  box-shadow:0 8px 22px rgba(0,0,0,.45)}
.perfil-foto__lapiz{position:absolute;right:-2px;bottom:2px;width:30px;height:30px;border-radius:50%;
  display:grid;place-items:center;background:#0d2033;border:2px solid rgba(255,255,255,.9);color:#fff}
.perfil-foto__lapiz svg{width:14px;height:14px}
.perfil-tarjeta__datos{position:relative;z-index:1;min-width:0}
.salir-chico{position:absolute;top:12px;right:12px;z-index:2;display:flex;align-items:center;gap:5px;
  padding:6px 11px;border-radius:999px;cursor:pointer;font-family:inherit;font-size:11.5px;font-weight:600;
  background:rgba(229,72,77,.14);border:1px solid rgba(229,72,77,.4);color:#fca5a5}
.salir-chico svg{width:14px;height:14px}
.salir-chico:active{background:rgba(229,72,77,.26)}
.perfil-tarjeta__nombre{font-size:26px;font-weight:700;letter-spacing:-.02em;color:#fff;line-height:1.1}
.perfil-tarjeta__handle{margin-top:4px;font-size:15px;font-weight:600;color:#5eead4}
.perfil-tarjeta__mail{margin-top:4px;font-size:14px;color:rgba(255,255,255,.72);overflow-wrap:anywhere}

.perfil-rotulo{margin:20px 2px 9px;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(94,234,212,.8);font-weight:600}
.fila-op{display:flex;align-items:center;gap:14px;width:100%;text-align:left;cursor:pointer;
  font-family:inherit;margin:0 0 10px;padding:14px 16px;border-radius:18px;
  background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.09);color:#fff}
.fila-op:active{background:rgba(103,232,249,.10);border-color:rgba(103,232,249,.35)}
.fila-op__ico{flex:none;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);color:#5eead4}
.fila-op__ico svg{width:23px;height:23px}
.fila-op__t{flex:1;min-width:0}
.fila-op__t b{display:block;font-size:16px;font-weight:700;line-height:1.2}
.fila-op__t span{display:block;margin-top:3px;font-size:13px;line-height:1.35;
  color:rgba(159,196,216,.85)}
.fila-op__t i{font-style:normal;font-weight:700;color:rgba(255,255,255,.8)}
.fila-op__t .es-on-txt{color:#5eead4}
.fila-op__chev{flex:none;font-size:24px;line-height:1;color:rgba(94,234,212,.8);font-weight:300}
.fila-op.es-salir{background:rgba(229,72,77,.07);border-color:rgba(229,72,77,.28)}
.fila-op.es-salir .fila-op__ico{color:#f87171;border-color:rgba(229,72,77,.3);
  background:rgba(229,72,77,.1)}
.fila-op.es-salir .fila-op__chev{color:#f87171}

.palanca{flex:none;width:52px;height:30px;border-radius:999px;background:rgba(255,255,255,.14);
  position:relative;transition:background .2s}
.palanca span{position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;
  background:#fff;transition:transform .2s cubic-bezier(.2,.8,.3,1);box-shadow:0 2px 6px rgba(0,0,0,.4)}
.palanca.is-on{background:#34d399}
.palanca.is-on span{transform:translateX(22px)}

#panelIzq .buscador-cuentas{margin-top:22px}


/* ==================== OTROS SUEÑOS POR CUMPLIR ==================== */
.cab-seccion b{display:block;font-size:14px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;
  color:#fff;line-height:1.1}
.cab-seccion i{display:flex;align-items:center;gap:7px;margin-top:4px;font-style:normal;
  font-size:12.5px;color:rgba(159,196,216,.85)}

.lote{height:100%;display:flex;flex-direction:column;overflow:hidden;border-radius:22px;
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border:1px solid rgba(103,232,249,.22);
  box-shadow:0 18px 44px rgba(2,10,20,.5)}
.lote__foto{position:relative;flex:0 0 30%;min-height:0;background-size:cover;background-position:center;
  background-color:rgba(255,255,255,.05)}
.lote__fav{position:absolute;top:12px;right:12px;width:38px;height:38px;border-radius:50%;
  background:rgba(6,17,31,.72);border:1px solid rgba(255,255,255,.16);color:#fff;
  display:grid;place-items:center;cursor:pointer}
.lote__fav svg{width:19px;height:19px}
.lote__fav:active{color:#5eead4;border-color:rgba(94,234,212,.6)}

.lote__cuerpo{flex:1;min-height:0;display:flex;flex-direction:column;padding:14px 16px 14px;gap:0}
.lote__titulo{margin:0;font-size:clamp(17px,2.5vh,21px);font-weight:700;line-height:1.2;color:#fff;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.lote__rotulo{display:block;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
  color:rgba(94,234,212,.85);font-weight:600}
.lote__cifras{display:flex;align-items:flex-start;gap:12px;margin-top:10px}
.lote__precio{flex:1;min-width:0}
.lote__monto{display:block;margin-top:2px;font-size:clamp(23px,3.4vh,30px);font-weight:700;color:#2dd4bf;
  letter-spacing:-.02em;line-height:1.05;text-shadow:0 0 20px rgba(45,212,191,.45)}

.reloj{display:flex;align-items:center;gap:11px;margin-top:11px;padding:10px 12px;border-radius:15px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09)}
.reloj__ico{flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;
  border:1px solid rgba(94,234,212,.45);color:#5eead4}
.reloj__ico svg{width:19px;height:19px}
.reloj__cuenta{flex:1;display:flex;align-items:center;gap:2px}
.reloj__u{flex:1;text-align:center;border-right:1px solid rgba(255,255,255,.12)}
.reloj__u:last-child{border-right:0}
.reloj__u b{display:block;font-size:19px;font-weight:700;color:#fff;line-height:1;
  font-variant-numeric:tabular-nums}
.reloj__u span{display:block;margin-top:2px;font-size:8.5px;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(159,196,216,.75)}
.reloj__fecha{flex:none;display:flex;align-items:center;gap:5px;font-size:11px;
  color:rgba(159,196,216,.85);max-width:74px;line-height:1.15}
.reloj__fecha svg{width:14px;height:14px;flex:none}
.reloj.es-urgente .reloj__u b{color:#fca5a5}
.reloj.es-urgente .reloj__ico{border-color:rgba(252,165,165,.6);color:#fca5a5}

.lote__fund{display:flex;align-items:center;gap:11px;margin-top:11px}
.lote__fund .avatar{width:44px;height:44px;font-size:14px;flex:none;background-color:#fff}
.lote__fund-t{flex:1;min-width:0}
.lote__fund-t b{display:block;font-size:15px;font-weight:700;color:#fff;line-height:1.2;cursor:pointer}

.lote__ofertar{margin-top:auto;letter-spacing:.08em;display:flex;align-items:center;justify-content:center;gap:12px;
  width:100%;min-height:54px;border:0;border-radius:16px;cursor:pointer;font-family:inherit;
  font-size:16px;font-weight:700;letter-spacing:.02em;color:#04222b;
  background:linear-gradient(100deg,#22d3ee,#2dd4bf 55%,#34d399);
  box-shadow:0 0 26px rgba(45,212,191,.4), inset 0 1px 0 rgba(255,255,255,.5)}
.lote__ofertar svg{width:20px;height:20px}
.lote__ofertar:active{filter:brightness(1.1)}


/* ==================== CUMPLÍ TU SUEÑO ====================
   La tarjeta ocupa todo el hueco entre la cabecera y el botón. */
#screen-aporte.is-active{display:flex !important;flex-direction:column;height:100dvh;overflow:hidden}
#screen-aporte .alta__top{flex:none}
#screen-aporte .alta{flex:1;min-height:0;display:flex !important;flex-direction:column;
  padding:12px 16px 0 !important}
#screen-aporte .alta__form{flex:1;min-height:0;display:flex;flex-direction:column}
#screen-aporte #apCampos{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden}
#screen-aporte .tarjeta-form{flex:1;min-height:0;display:flex;flex-direction:column;
  padding:16px 16px 12px;overflow:hidden}
/* el campo del texto se queda con todo lo que sobre */
#screen-aporte .tarjeta-form .field{flex:none;margin-bottom:10px}
#screen-aporte .tarjeta-form .field:nth-child(2){flex:1;min-height:0;display:flex;flex-direction:column}
#screen-aporte .caja-deseo{flex:1;min-height:110px !important;height:auto !important;resize:none}
#screen-aporte .field--fund .fund-res{max-height:104px}


/* ==================== SUBASTAS ACTIVAS: NADA CORTADO ==================== */
#screen-deseos .suenos-lista{align-items:stretch}
.sueno{max-height:100%;overflow:hidden}
.sueno__monto{font-size:clamp(26px,4.4vh,40px);white-space:nowrap}
.sueno__btn{font-size:clamp(14.5px,3.8vw,17px);white-space:nowrap;padding:0 14px}
@media (max-height:740px){
  .sueno{padding:15px 15px 13px}
  .sueno__ava{width:44px;height:44px}
  .sueno__titulo{font-size:clamp(18px,2.6vh,22px)}
  .sueno__btn{min-height:50px}
}


/* la foto del lote se abre en grande */
.lote__foto.es-tocable{cursor:zoom-in}
.visor{position:fixed;inset:0;z-index:120;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:16px;padding:24px;background:rgba(3,9,18,.92);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  opacity:0;transition:opacity .22s}
.visor.is-on{opacity:1}
.visor__marco{margin:0;max-width:100%;max-height:74vh;border-radius:20px;overflow:hidden;
  border:1.5px solid rgba(94,234,212,.7);
  box-shadow:0 0 34px rgba(45,212,191,.28), 0 24px 60px rgba(0,0,0,.6)}
.visor__marco img{display:block;max-width:100%;max-height:74vh;object-fit:contain}
.visor__pie{margin:0;font-size:14px;color:rgba(255,255,255,.85);text-align:center;max-width:32ch}
.visor__cerrar{position:absolute;top:calc(14px + env(safe-area-inset-top));right:16px;
  width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.2);color:#fff;font-size:24px;line-height:1;cursor:pointer}

/* el cronómetro: cuenta arriba, fecha abajo */
.reloj{flex-direction:column;align-items:stretch;gap:8px}
.reloj__fila{display:flex;align-items:center;gap:11px}
.reloj__fecha{justify-content:center;max-width:none;padding-top:8px;
  border-top:1px solid rgba(255,255,255,.1);font-size:11.5px}


/* ==================== AJUSTES DE ESPACIO ====================
   Cumplí tu sueño: la caja de texto crece y el botón baja al ras del menú. */
#screen-aporte .caja-deseo{min-height:150px !important}
#screen-aporte .tarjeta-form .field:nth-child(2){flex:2 1 auto}
#screen-aporte .btn--publicar{min-height:50px}
#screen-aporte .alta{padding-bottom:0 !important}

/* Subastas activas: del buscador al menú, sin aire de más. */
#screen-deseos .stats-pantalla{padding-bottom:calc(var(--nav-alto) + 6px) !important}
#screen-deseos .buscador-wrap{margin-bottom:8px}
#screen-deseos .suenos-lista{margin-top:0;padding-bottom:0}

/* Otros sueños: el botón, algo más contenido. */
.lote__ofertar{min-height:48px;font-size:15px;gap:10px}
.lote__ofertar svg{width:18px;height:18px}


/* ==================== SUBASTAS ACTIVAS: LA TARJETA ENTRA ENTERA ====================
   Todo se mide contra el alto de pantalla, y la cita es lo único elástico:
   cede líneas para que el botón y el pie nunca queden bajo el menú. */
#screen-deseos .stats-pantalla{padding-bottom:0 !important;
  bottom:calc(var(--nav-alto) + 8px) !important}
#screen-deseos .suenos-lista{padding-bottom:0;align-items:stretch}
.sueno{height:100%;max-height:100%;padding:clamp(12px,1.8vh,17px);overflow:hidden}

.sueno__cab{gap:10px}
.sueno__ava{width:clamp(40px,5.6vh,50px);height:clamp(40px,5.6vh,50px)}
.sueno__quien b{font-size:clamp(15px,2.1vh,17px)}
.sueno__quien span{font-size:clamp(11.5px,1.6vh,13px)}

.sueno__titulo{margin-top:clamp(8px,1.4vh,14px);font-size:clamp(17px,2.6vh,24px);line-height:1.16}

.sueno__comilla{font-size:clamp(24px,3.4vh,32px)}

.sueno__rotulo{font-size:clamp(9px,1.3vh,10.5px)}
.sueno__monto{margin-top:2px;font-size:clamp(25px,4.2vh,38px)}

.sueno__btn{margin-top:clamp(9px,1.4vh,14px);min-height:clamp(44px,6vh,52px);
  font-size:clamp(14px,2vh,16px)}
.sueno__pie{margin-top:clamp(6px,1vh,10px);font-size:clamp(10.5px,1.4vh,12px)}
.sueno__pie svg{width:14px;height:14px}

/* si la pantalla es corta, la cita cede primero */
@media (max-height:780px){ .sueno__cita p{-webkit-line-clamp:3} }
@media (max-height:680px){ .sueno__cita p{-webkit-line-clamp:2} }


/* Subastas activas: la tarjeta arranca pegada al buscador. */
#screen-deseos .stats-pantalla{padding-top:0 !important}
#screen-deseos .buscador-wrap,#screen-deseos .buscador{margin:0 0 8px !important;max-width:none !important;flex:none}
#screen-deseos .buscador input{padding-top:12px !important;padding-bottom:12px !important}
#screen-deseos .suenos-lista{margin:0 !important;padding:0 !important;flex:none}
#screen-subastas .subastas-grid,#screen-eventos .carrusel{margin:0 !important;flex:none}
.sueno{height:100%;max-height:100%}


/* ==================== BARRA SEGÚN EL ROL ====================
   La fundación no navega como donante: administra lo suyo. */
.nav5__fila--fundacion{display:none}
body.es-fundacion .nav5__fila--donante{display:none}
body.es-fundacion .nav5__fila--fundacion{display:grid;grid-template-columns:repeat(4,1fr)}
body.es-fundacion .cab__perfil{display:none}
body.es-fundacion .nav5__fila--fundacion .nav5__b{grid-template-rows:auto auto;gap:3px}
body.es-fundacion .nav5__txt{display:block;font-size:9px;letter-spacing:0}
body.es-fundacion .nav5__b svg{width:22px;height:22px}

/* El perfil de la fundación se recorre entero. */
body.es-fundacion.perfil-quieto,body.es-fundacion.menu-fijo{position:static;overflow:visible}
body.es-fundacion #screen-app{height:auto;display:block;overflow:visible}
body.es-fundacion .viewport{padding-bottom:calc(var(--nav-alto) + 20px) !important}
body.es-fundacion #panelIzq{overflow:visible;padding-bottom:0}


/* Todas las tarjetas miden lo mismo y el pie queda a dos píxeles del borde:
   con alto libre, cada una tomaba su propio tamaño y sólo la primera calzaba. */
.sueno{height:100% !important;max-height:100% !important;padding-bottom:1px !important}
.sueno__btn{margin-bottom:4px}
#screen-deseos .suenos-lista{align-items:stretch}


/* ==================== GARANTÍA PARA SUBASTAR ==================== */
.garantia{border-radius:16px;padding:14px 16px;
  background:linear-gradient(150deg, rgba(45,212,191,.16), rgba(255,255,255,.04));
  border:1px solid rgba(94,234,212,.35)}
.garantia__monto{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.garantia__monto span{font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:rgba(94,234,212,.9);font-weight:600}
.garantia__monto b{font-size:26px;font-weight:700;color:#fff;letter-spacing:-.02em}
.garantia__nota{margin:8px 0 0;font-size:12.5px;line-height:1.45;color:rgba(159,196,216,.9)}
.medios{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:14px}
.medio{display:flex;align-items:center;gap:9px;padding:12px 13px;border-radius:14px;cursor:pointer;
  font-family:inherit;font-size:13.5px;font-weight:600;color:#fff;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12)}
.medio__ico{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;
  background:rgba(255,255,255,.06);color:var(--celeste)}
.medio__ico svg{width:17px;height:17px}
.medio.is-on{border-color:rgba(94,234,212,.75);background:rgba(45,212,191,.14)}
.medio.is-on .medio__ico{color:#5eead4;background:rgba(45,212,191,.2)}


/* ==================== SUBASTAS DE LA FUNDACIÓN ==================== */
#screen-fsubastas .stats-pantalla{padding:14px 16px calc(var(--nav-alto) + 20px) !important;
  display:block !important;overflow-y:auto}
.crear-subasta{display:flex;align-items:center;gap:14px;width:100%;text-align:left;cursor:pointer;
  font-family:inherit;padding:18px;border-radius:20px;border:0;color:#04222b;
  background:linear-gradient(105deg,#22d3ee,#2dd4bf 52%,#34d399);
  box-shadow:0 0 34px rgba(45,212,191,.45), inset 0 1px 0 rgba(255,255,255,.5)}
.crear-subasta:active{filter:brightness(1.1)}
.crear-subasta__ico{flex:none;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;
  background:rgba(4,34,43,.16);color:#04222b}
.crear-subasta__ico svg{width:24px;height:24px}
.crear-subasta__t b{display:block;font-size:19px;font-weight:700;line-height:1.15}
.crear-subasta__t span{display:block;margin-top:3px;font-size:12.5px;opacity:.8}
#screen-fsubastas .perfil-rotulo{margin-top:22px}


/* ==================== OTROS SUEÑOS: CAJAS PAREJAS ==================== */
#screen-subastas .subastas-grid{align-items:flex-start}
.lote{height:100% !important;max-height:100% !important;padding-bottom:2px}
.lote__cuerpo{padding:14px 15px 12px}
/* el bloque de la fundación sube y su logo también */
.lote__fund{margin-top:4px;align-items:center}
.lote__fund .avatar{width:48px;height:48px;margin-top:-6px}
.lote__fund-t b{font-size:15.5px}
.reloj{margin-top:9px}
.lote__ofertar{margin-top:10px}

/* ==================== FUNDACIONES: TARJETAS PAREJAS Y GRANDES ==================== */
#screen-fundaciones .carrusel__slide{display:flex;align-items:stretch}
#screen-fundaciones .card{height:100%;display:flex;flex-direction:column;width:100%}
#screen-fundaciones .card__body{flex:1;min-height:0;display:flex;flex-direction:column}
#screen-fundaciones .card__causas{flex:1;min-height:0;overflow:hidden}
#screen-fundaciones .carrusel__viewport{padding:6px 0}
#screen-fundaciones .carrusel__slide{flex-basis:88%}


/* la garantía, en pantalla propia */
#screen-garantia.is-active{display:flex;flex-direction:column;height:100dvh;overflow:hidden}
#screen-garantia .stats-pantalla{flex:1;min-height:0;overflow-y:auto;
  padding:14px 16px 8px !important;display:block !important;position:static !important;height:auto !important}
.gar-pie{flex:none;padding:10px 16px calc(10px + env(safe-area-inset-bottom));
  border-top:1px solid rgba(255,255,255,.1)}
.gar-pie .btn{width:100%}


/* Subastas activas: el texto del sueño cede tamaño y el resto crece. */
.sueno__comilla{font-size:clamp(20px,2.6vh,26px)}
.sueno__ava{width:clamp(46px,6.4vh,58px);height:clamp(46px,6.4vh,58px)}
.sueno__quien b{font-size:clamp(16px,2.3vh,19px)}
.sueno__quien span{font-size:clamp(12px,1.7vh,14px)}
.sueno__titulo{font-size:clamp(19px,3vh,27px)}
.sueno__monto{font-size:clamp(28px,4.8vh,42px)}
.sueno__btn{min-height:clamp(48px,6.6vh,56px);font-size:clamp(15px,2.2vh,17px)}

/* ==================== OTROS SUEÑOS (FUNDACIONES) ====================
   Ahora usan las mismas tarjetas .sueno; se ajustan detalles de espacio. */
#screen-subastas .subastas-grid > .sueno{flex:0 0 74%}
#screen-subastas .sueno__titulo{font-size:clamp(18px,2.7vh,23px);line-height:1.2;margin:0 0 4px;
  -webkit-line-clamp:2;min-height:0}
#screen-subastas .sueno__cita{display:block;margin-top:10px}
#screen-subastas .sueno__oferta{display:block;margin-top:11px}
#screen-subastas .sueno__reloj{margin-top:11px}
#screen-subastas .sueno__badge{display:inline-flex;align-items:center;padding:3px 10px;
  border-radius:999px;font-size:10px;font-weight:700;letter-spacing:.03em;
  background:rgba(135,206,235,.18);color:#87CEEB;border:1px solid rgba(135,206,235,.35)}


/* ==================== REGISTRAR SUBASTA: TODO EN UNA PANTALLA ====================
   Cada bloque se mide contra el alto real: nada de desplazarse. */
#screen-garantia.is-active{height:100dvh;overflow:hidden;display:flex;flex-direction:column}
#screen-garantia .alta__top{flex:none;padding-top:8px !important;padding-bottom:8px !important}
#screen-garantia .stats-pantalla{flex:1;min-height:0;overflow:hidden !important;
  display:flex !important;flex-direction:column;gap:0;padding:8px 16px 4px !important}



#screen-garantia .paso-sep{flex:none;margin:clamp(7px,1.1vh,11px) 0 clamp(5px,.8vh,8px) !important;
  font-size:clamp(9px,1.3vh,10.5px)}
#screen-garantia .medios{flex:none;margin-bottom:clamp(6px,1vh,10px);gap:7px}
#screen-garantia .medio{padding:clamp(8px,1.2vh,11px) 10px;font-size:clamp(11.5px,1.6vh,13px)}
#screen-garantia .medio__ico{width:clamp(22px,3vh,27px);height:clamp(22px,3vh,27px)}
#screen-garantia .medio__ico svg{width:60%;height:60%}
#screen-garantia .field{margin-bottom:clamp(5px,.9vh,9px)}
#screen-garantia .field label{font-size:clamp(8.5px,1.2vh,9.5px);margin-bottom:3px}
#screen-garantia .field input{padding:clamp(8px,1.2vh,11px) 12px !important;
  font-size:clamp(12.5px,1.7vh,14px)}
/* el campo de dinero necesita lugar para el signo: la forma abreviada de
   arriba se lo comía y el número arrancaba encima del $ */
#screen-garantia .pesos input{padding-left:38px !important}
#screen-garantia .pesos__signo{left:15px;font-size:15px}
#screen-garantia .field__hint{font-size:clamp(9.5px,1.3vh,10.5px);margin-top:3px}
#screen-garantia .grid2{gap:7px}

.gar-pie{flex:none;padding:8px 16px calc(8px + env(safe-area-inset-bottom))}
.btn--confirmar{width:100%;min-height:clamp(46px,6.4vh,54px);border-radius:16px;
  font-size:clamp(14px,2vh,16px);font-weight:700;letter-spacing:.09em;
  background:linear-gradient(100deg,#22d3ee,#2dd4bf 55%,#34d399) !important;color:#04222b !important;
  box-shadow:0 0 30px rgba(45,212,191,.45), inset 0 1px 0 rgba(255,255,255,.5) !important}
.btn--confirmar:active{filter:brightness(1.1)}


/* vencimiento y código: campos cortos, en la misma línea */


/* ==================== VOLVER · UN SOLO BOTÓN ====================
   Flecha en un disco chico con el degradado del logo, igual en toda la app. */
.volver-ico{flex:none;width:38px;height:38px;border-radius:50%;border:0;cursor:pointer;
  display:grid;place-items:center;color:#04222b;
  background:linear-gradient(120deg,#22d3ee,#2dd4bf 55%,#a3e635);
  box-shadow:0 0 16px rgba(45,212,191,.4), inset 0 1px 0 rgba(255,255,255,.45)}
.volver-ico svg{width:19px;height:19px}
.volver-ico:active{transform:scale(.92);filter:brightness(1.1)}


/* ==================== HACER OFERTA ==================== */
.of-top{flex:none;display:grid;grid-template-columns:38px 1fr 38px;align-items:center;
  padding:calc(8px + env(safe-area-inset-top)) 16px 10px;
  background:rgba(6,17,31,.75);backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(255,255,255,.08)}
.of-cerrar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;cursor:pointer;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);color:#fff}
.of-cerrar svg{width:18px;height:18px}
.of-cerrar:active{transform:scale(.92)}
.of-titulo{text-align:center;font-size:17px;font-weight:700;color:#fff}

#screen-garantia .stats-pantalla{padding:12px 16px 6px !important}
.of-rot{margin:clamp(9px,1.5vh,15px) 2px clamp(5px,.9vh,9px);font-size:clamp(9.5px,1.3vh,11px);
  letter-spacing:.18em;text-transform:uppercase;color:#5eead4;font-weight:700}

/* el lote */

/* el monto, con menos y más */
.of-monto{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:clamp(7px,1.1vh,11px) clamp(9px,1.3vh,13px);border-radius:18px;
  background:rgba(255,255,255,.04);border:1.5px solid rgba(94,234,212,.75)}
.of-paso{flex:none;width:clamp(38px,5.2vh,46px);height:clamp(38px,5.2vh,46px);border-radius:50%;
  display:grid;place-items:center;cursor:pointer;color:#5eead4;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14)}
.of-paso svg{width:46%;height:46%}
.of-paso:active{background:rgba(45,212,191,.2)}
.of-monto__v{flex:1;text-align:center;font-size:clamp(26px,4.4vh,38px);font-weight:700;color:#fff;
  letter-spacing:-.02em;white-space:nowrap}
.of-monto__v em{font-style:normal;margin-right:6px;font-weight:600;opacity:.9}
.of-supera{display:flex;align-items:center;justify-content:center;gap:8px;margin:clamp(7px,1vh,11px) auto 0;
  width:fit-content;padding:6px 15px;border-radius:999px;
  border:1px solid rgba(94,234,212,.35);background:rgba(45,212,191,.08);
  font-size:clamp(11px,1.5vh,12.5px);color:rgba(255,255,255,.85)}
.of-supera svg{width:16px;height:16px;color:#5eead4;flex:none}
.of-supera b{color:#5eead4}

/* la garantía */
.of-gar{display:flex;gap:13px;margin-top:clamp(9px,1.4vh,14px);padding:clamp(10px,1.5vh,14px);
  border-radius:18px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1)}
.of-gar__ico{flex:none;width:clamp(44px,6vh,52px);height:clamp(44px,6vh,52px);border-radius:50%;
  display:grid;place-items:center;color:#5eead4;
  background:rgba(45,212,191,.14);border:1px solid rgba(94,234,212,.3)}
.of-gar__ico svg{width:52%;height:52%}
.of-gar__t b{display:block;font-size:clamp(14px,2vh,16px);font-weight:700;color:#fff}
.of-gar__t i{display:block;font-style:normal;margin-top:1px;font-size:clamp(19px,2.8vh,25px);
  font-weight:700;color:#5eead4;letter-spacing:-.02em}
.of-gar__t p{margin:5px 0 0;font-size:clamp(10.5px,1.4vh,12px);line-height:1.35;color:var(--celeste)}

/* el medio elegido */
.of-medio{display:flex;align-items:center;gap:13px;margin-top:9px;padding:clamp(9px,1.3vh,13px) 14px;
  border-radius:16px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1)}
.of-marca{flex:none;font-size:15px;font-weight:800;font-style:italic;color:#fff;letter-spacing:.02em}
.of-marca--mp{font-style:normal;color:#5eead4}
.of-medio__t{flex:1;min-width:0}
.of-medio__t b{display:block;font-size:15px;font-weight:600;color:#fff;letter-spacing:.06em}
.of-medio__t span{display:block;font-size:12px;color:var(--celeste)}
.of-cambiar{flex:none;display:flex;align-items:center;gap:4px;background:none;border:0;cursor:pointer;
  font-family:inherit;font-size:13.5px;font-weight:600;color:#5eead4}
.of-cambiar svg{width:15px;height:15px}
.of-cambiar[disabled],.of-cambiar.es-off{opacity:.45;cursor:not-allowed}
.of-seguro{display:flex;align-items:center;justify-content:center;gap:7px;
  margin:clamp(8px,1.2vh,12px) 0 0;font-size:clamp(10px,1.3vh,11.5px);color:rgba(159,196,216,.7)}
.of-seguro svg{width:14px;height:14px;flex:none}

/* el pie */
.gar-pie{flex:none;padding:10px 16px calc(8px + env(safe-area-inset-bottom));border-top:0}
.btn--confirmar{display:flex;align-items:center;justify-content:center;gap:12px}
.btn--confirmar svg{width:20px;height:20px}
.of-pie{margin:8px 0 0;text-align:center;font-size:11.5px;color:rgba(159,196,216,.75)}


/* el encabezado del sueño, sin caja ni ícono */
.of-enc{text-align:center;padding:0 4px}
.of-enc__t{display:block;font-size:clamp(15px,2.2vh,19px);font-weight:700;color:#fff;line-height:1.2;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.of-enc__r{display:block;margin-top:4px;font-size:clamp(9.5px,1.3vh,11px);letter-spacing:.18em;
  text-transform:uppercase;color:#5eead4;font-weight:700}
.of-enc__m{display:block;font-style:normal;margin-top:1px;font-size:clamp(20px,3vh,27px);
  font-weight:700;color:#fff;letter-spacing:-.02em}

/* todo sube: menos aire entre bloques */
#screen-garantia .stats-pantalla{padding-top:8px !important}
.of-rot{margin:clamp(7px,1.1vh,11px) 2px clamp(4px,.7vh,7px)}
.of-supera{margin-top:clamp(5px,.8vh,9px)}
.of-gar{margin-top:clamp(7px,1.1vh,11px);padding:clamp(9px,1.3vh,12px)}
.of-medio{margin-top:7px}
.of-seguro{margin-top:clamp(6px,1vh,10px)}
.gar-pie{padding-top:8px}


/* el monto se escribe tocándolo */
.of-monto__v input{width:100%;background:none;border:0;outline:0;color:#fff;font-family:inherit;
  font-size:inherit;font-weight:inherit;letter-spacing:inherit;text-align:center;padding:0;
  min-width:0;font-variant-numeric:tabular-nums}
.of-monto__v{display:flex;align-items:center;justify-content:center;gap:0}
.of-monto__v em{flex:none}
.of-supera.es-baja{border-color:rgba(252,165,165,.45);background:rgba(229,72,77,.1)}
.of-supera.es-baja svg,.of-supera.es-baja b{color:#fca5a5}

/* el cartel de la garantía, con el monto en color */
.of-gar__t b em{font-style:normal;color:#5eead4}
.of-gar__t p{margin-top:6px}


/* La cápsula del mínimo: el disco del ícono nunca se achica, por largo que
   sea el monto. El texto cede tamaño antes que el ícono. */


/* Actividades y eventos: la tarjeta ocupa más ancho del carril. */
#screen-eventos .carrusel__slide{flex-basis:92%}
#screen-eventos .ecard{width:100%}


/* ==================== PORTADA: LEGIBILIDAD Y USO ====================
   El texto del botón pasa a azul profundo: blanco sobre el degradado claro
   tenía muy poco contraste, y era el elemento más importante de la pantalla. */
.cta__txt{color:#04222b !important;font-weight:800;letter-spacing:.1em}
.cta--corto{box-shadow:0 0 34px rgba(45,212,191,.4), inset 0 1px 0 rgba(255,255,255,.5)}

/* la bajada entra en dos líneas parejas */
.portada__bajada{max-width:22ch}
/* un solo acento: el título lleva el degradado, la bajada va en blanco */
.portada__bajada .es-cielo,.portada__bajada .es-verde{color:rgba(255,255,255,.95);text-shadow:none}

/* ver la contraseña */
.campo-clave{position:relative;display:flex;align-items:center}
.campo-clave input{flex:1;padding-right:46px !important}
.ojo{position:absolute;right:8px;width:34px;height:34px;border-radius:50%;border:0;cursor:pointer;
  background:none;color:rgba(159,196,216,.85);display:grid;place-items:center}
.ojo svg{width:20px;height:20px;grid-area:1/1}
.ojo__no{display:none}
.ojo.es-visible .ojo__ver{display:none}
.ojo.es-visible .ojo__no{display:block}
.ojo:active{color:#5eead4}

.olvide{display:block;margin:7px 0 0 auto;background:none;border:0;cursor:pointer;font-family:inherit;
  font-size:12px;color:rgba(159,196,216,.8);text-decoration:none}
.olvide:active{color:#5eead4}

/* los dos enlaces dejan de competir */
.portada__links{align-items:baseline;gap:16px}
.portada__links .linkish--fuerte{font-size:15.5px !important;font-weight:700 !important;
  color:#5eead4 !important;text-decoration:underline !important;text-underline-offset:4px}
.portada__links .linkish--suave{font-size:12px !important;font-weight:500 !important;
  color:rgba(159,196,216,.7) !important;text-decoration:none !important}
.linkish--suave:active{color:#5eead4}


/* ==================== MENÚ: JERARQUÍA Y COLOR ====================
   La entrada principal manda: es más alta, lleva el borde vivo y su color
   pleno. Las otras cuatro quedan en segundo plano, con el borde quieto. */
.entrada__dato{display:block;margin-top:3px;font-size:clamp(11px,1.6vh,13px);line-height:1.25;
  color:rgba(255,255,255,.62);font-weight:500;letter-spacing:0}
.entrada.es-principal .entrada__dato{color:rgba(255,255,255,.8)}
.entrada.es-principal .entrada__t{font-size:clamp(19px,2.9vh,25px)}

/* sólo la principal respira con la luz recorriendo el borde */
.entrada:not(.es-principal) .entrada__chispa{display:none}
.entrada:not(.es-principal) .entrada__base{stroke-width:1.3;opacity:.55}
.entrada.es-principal .entrada__base{stroke-width:2;opacity:1}
.entrada.es-principal .entrada__chispa{stroke-width:3;animation-duration:2.8s}

/* el color vuelve: cada entrada con su matiz, y el disco bien saturado */
.entrada__ico{box-shadow:inset 0 1px 0 rgba(255,255,255,.24), 0 0 0 1.4px var(--canto-luz),
  0 0 24px var(--halo)}
.entrada__ico svg{filter:drop-shadow(0 0 9px var(--luz))}

/* ==================== BARRA: EL ACTIVO SE VE ==================== */
.nav5__b{position:relative}
.nav5__b.is-on::after{content:"";position:absolute;bottom:9px;width:5px;height:5px;border-radius:50%;
  background:#5eead4;box-shadow:0 0 8px rgba(94,234,212,.9)}
.nav5__b.is-on svg{filter:drop-shadow(0 0 10px rgba(94,234,212,.9))}
.nav5__b:not(.is-on){color:rgba(255,255,255,.38)}


/* ---- paleta de las entradas · definición única ----
   Cada una con su matiz propio: antes se veían todas del mismo azul. */
.entrada--turq{--velo1:rgba(0,196,212,.44);--velo2:rgba(0,140,152,.26);
  --halo:rgba(0,214,224,.55);--canto-luz:rgba(103,232,249,.75);--luz:#7fe3ec}
.entrada--cian{--velo1:rgba(0,138,224,.44);--velo2:rgba(0,96,168,.26);
  --halo:rgba(0,150,235,.52);--canto-luz:rgba(125,200,255,.72);--luz:#9ccfff}
.entrada--azul{--velo1:rgba(0,206,168,.40);--velo2:rgba(0,138,126,.24);
  --halo:rgba(0,214,172,.52);--canto-luz:rgba(94,234,212,.72);--luz:#5eead4}
.entrada--violeta{--velo1:rgba(0,128,186,.44);--velo2:rgba(0,74,106,.26);
  --halo:rgba(0,140,198,.5);--canto-luz:rgba(125,190,225,.7);--luz:#a8d5ea}
.entrada--lima{--velo1:rgba(112,216,112,.40);--velo2:rgba(0,148,138,.24);
  --halo:rgba(140,224,96,.5);--canto-luz:rgba(163,230,53,.7);--luz:#b6e86a}


/* ==================== NOVEDADES · DEFINICIÓN ÚNICA ==================== */
#screen-avisos #listaAvisos{display:block}
.avisos__barra{display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin:0 2px 6px;font-size:11.5px;color:rgba(159,196,216,.8)}
.avisos__todo{background:none;border:0;cursor:pointer;font-family:inherit;font-size:12px;
  font-weight:600;color:#5eead4}
.avisos__todo:active{opacity:.6}
.avisos__grupo{margin:14px 2px 7px;font-size:10px;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(159,196,216,.6);font-weight:600}

.aviso{position:relative;display:flex;gap:11px;width:100%;text-align:left;cursor:pointer;
  font-family:inherit;margin:0 0 8px;padding:11px 13px;border-radius:14px;
  background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.07)}
.aviso:active{background:rgba(103,232,249,.10)}
.aviso__ico{flex:none;width:34px;height:34px;border-radius:11px;display:grid;place-items:center;
  color:var(--tinte-av,#7dd3fc);background:color-mix(in srgb, var(--tinte-av,#7dd3fc) 14%, transparent);
  border:1px solid color-mix(in srgb, var(--tinte-av,#7dd3fc) 34%, transparent)}
.aviso__ico svg{width:18px;height:18px}
.aviso__cuerpo{flex:1;min-width:0}
.aviso__cab{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.aviso__cab b{font-size:13.5px;font-weight:600;color:rgba(255,255,255,.78);line-height:1.25}
.aviso__h{flex:none;font-size:10px;color:rgba(159,196,216,.55)}
.aviso__txt{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  margin-top:2px;font-size:12px;line-height:1.3;color:rgba(159,196,216,.8)}
.aviso__nuevo{position:absolute;top:12px;right:11px;width:7px;height:7px;border-radius:50%;
  background:#22d3ee;box-shadow:0 0 8px rgba(34,211,238,.9)}

/* las no leídas: fondo más claro, título en blanco y borde encendido */
.aviso.es-nuevo{background:rgba(255,255,255,.075);border-color:rgba(103,232,249,.3)}
.aviso.es-nuevo .aviso__cab b{color:#fff}
.aviso.es-nuevo .aviso__cab{padding-right:14px}

/* la que pide acción se distingue */
.aviso.es-urge{border-color:rgba(251,146,60,.42);background:rgba(251,146,60,.09)}
.aviso.es-urge .aviso__cab b{color:#fff}
.aviso__cta{display:inline-block;margin-top:7px;padding:5px 12px;border-radius:999px;
  font-size:11.5px;font-weight:700;color:#fdba74;
  background:rgba(251,146,60,.14);border:1px solid rgba(251,146,60,.4)}

/* un color por tipo */
.av--evento{--tinte-av:#a3e635}
.av--actividad{--tinte-av:#7dd3fc}
.av--superado{--tinte-av:#fb923c}
.av--donacion{--tinte-av:#5eead4}
.av--aporte{--tinte-av:#c4b5fd}

.avisos__fin{margin:16px 0 8px;text-align:center;font-size:11.5px;color:rgba(159,196,216,.45)}

/* el volver deja de competir con el contenido */
#screen-avisos .volver-ico{background:rgba(255,255,255,.06);border:1px solid rgba(94,234,212,.45);
  color:#5eead4;box-shadow:none}
#screen-avisos .volver-ico:active{background:linear-gradient(120deg,#22d3ee,#2dd4bf 55%,#a3e635);
  color:#04222b}


/* ==================== TUS FUNDACIONES ====================
   Primero lo hecho, después lo pendiente: la pantalla ya no abre con vacíos. */
.resumen-apoyo{text-align:center;padding:16px 14px 18px;border-radius:20px;margin-bottom:4px;
  background:linear-gradient(150deg, rgba(45,212,191,.16), rgba(255,255,255,.04));
  border:1px solid rgba(94,234,212,.3)}
.resumen-apoyo__rot{display:block;font-size:10px;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(94,234,212,.9);font-weight:700}
.resumen-apoyo__n{display:block;margin-top:4px;font-size:clamp(30px,5vh,42px);font-weight:700;
  color:#fff;letter-spacing:-.03em;line-height:1;text-shadow:0 0 26px rgba(94,234,212,.45)}
.resumen-apoyo__sub{display:block;margin-top:7px;font-size:12.5px;color:var(--celeste)}

/* los vacíos invitan en vez de sólo avisar */
.vacio-cta{text-align:center;padding:14px 14px 15px;border-radius:16px;
  background:rgba(255,255,255,.03);border:1px dashed rgba(255,255,255,.16)}
.vacio-cta p{margin:0;font-size:12.5px;color:rgba(159,196,216,.8)}
.vacio-cta__b{margin-top:9px;background:none;border:1px solid rgba(94,234,212,.5);cursor:pointer;
  font-family:inherit;font-size:12.5px;font-weight:700;color:#5eead4;
  padding:7px 16px;border-radius:999px}
.vacio-cta__b:active{background:rgba(45,212,191,.16)}

/* cada apoyo dice su plan y desde cuándo */
.fila-apoyo{align-items:center;padding:11px 13px}
.fila-apoyo__t{flex:1;min-width:0}
.fila-apoyo__t b{display:block;font-size:14.5px;font-weight:600;color:#fff;line-height:1.2;
  cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fila-apoyo__t span{display:block;margin-top:2px;font-size:11.5px;color:var(--celeste)}
.fila-apoyo__m{flex:none;font-size:16px;font-weight:700;color:var(--turq)}

/* la acción secundaria, al final y sin peso */
.compl-abajo{margin-top:20px;font-size:13.5px;color:rgba(159,196,216,.85) !important;
  border-color:rgba(255,255,255,.14) !important}

/* el corazón lleva su contador */

#screen-apoyo .subhead{margin-top:18px}


/* ==================== CUMPLÍ TU SUEÑO ====================
   Sin marco doble, rótulos discretos y el texto en su justa medida. */
#screen-aporte .tarjeta-form{background:none !important;border:0 !important;
  box-shadow:none !important;padding:0 !important}
.aporte-intro{margin:0 0 14px;font-size:12.5px;line-height:1.45;color:var(--celeste)}

/* los rótulos dejan de gritar */
#screen-aporte .field label{font-size:12.5px !important;letter-spacing:0 !important;
  text-transform:none !important;font-weight:600 !important;color:rgba(255,255,255,.8) !important;
  margin-bottom:6px}

/* la caja de texto, la mitad de alto */
#screen-aporte .caja-deseo{min-height:88px !important;max-height:26vh}
#screen-aporte .tarjeta-form .field:nth-child(2){flex:0 1 auto}

/* la moneda va dentro del campo */
.pesos__moneda{position:absolute;right:14px;font-size:11.5px;font-weight:600;
  color:rgba(159,196,216,.6);letter-spacing:.06em;pointer-events:none}
#screen-aporte .pesos input{padding-right:48px !important}

/* fundaciones sugeridas */
.fund-sug__rot{display:block;margin:2px 2px 6px;font-size:10px;letter-spacing:.16em;
  text-transform:uppercase;color:rgba(159,196,216,.6);font-weight:600}
.fund-sug{display:flex;flex-wrap:wrap;gap:7px}
.fund-chip{display:flex;align-items:center;gap:7px;padding:6px 12px 6px 6px;border-radius:999px;
  cursor:pointer;font-family:inherit;font-size:12.5px;color:#fff;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12)}
.fund-chip .avatar{width:24px;height:24px;font-size:9px;flex:none}
.fund-chip:active{border-color:rgba(94,234,212,.7);background:rgba(45,212,191,.14)}

/* Publicar apagado hasta que haya datos */
.btn--publicar.es-apagado{opacity:.4;cursor:not-allowed;filter:grayscale(.5);box-shadow:none}


/* ==================== SUBASTAS ACTIVAS · AJUSTES ====================
   La cita se corta por líneas completas: antes quedaba media línea partida. */
@media (max-height:800px){ .sueno__cita p{--lineas:3} }
@media (max-height:700px){ .sueno__cita p{--lineas:2} }

/* la cabecera lleva a ver el perfil */
.sueno__cab{cursor:pointer}
.sueno__mas{margin-left:auto;font-size:20px;color:rgba(159,196,216,.5);font-weight:300}

/* quién va ganando, y cuántas ofertas hubo */

/* el cronómetro del sueño, en una línea */
.sueno__reloj{display:flex;align-items:center;justify-content:center;gap:7px;
  margin-top:9px;padding:6px 14px;border-radius:999px;align-self:center;
  border:1px solid rgba(255,255,255,.13);background:rgba(255,255,255,.04);
  font-size:clamp(11px,1.5vh,12.5px);color:rgba(159,196,216,.85)}
.sueno__reloj svg{width:15px;height:15px;color:#5eead4;flex:none}
.sueno__reloj b{color:#fff;font-weight:700}
.sueno__reloj.es-urgente{border-color:rgba(252,165,165,.5);background:rgba(229,72,77,.1)}
.sueno__reloj.es-urgente svg,.sueno__reloj.es-urgente b{color:#fca5a5}

/* el botón absorbe el monto: la cápsula repetida se fue */
.sueno__btn{margin-top:11px}

/* el buscador se despliega desde la lupa */
.cab-acciones{display:flex;align-items:center;gap:9px}
.lupa-ico{width:38px;height:38px;border-radius:50%;cursor:pointer;display:grid;place-items:center;
  background:rgba(255,255,255,.06);border:1px solid rgba(94,234,212,.4);color:#5eead4}
.lupa-ico svg{width:18px;height:18px}
.lupa-ico:active{background:rgba(45,212,191,.18)}
#screen-deseos .buscador.es-plegado{display:none}

/* puntos del carril */
.carril-puntos{display:flex;justify-content:center;gap:6px;margin-top:9px;flex:none}
.carril-punto{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.22);
  transition:background .2s,width .2s}
.carril-punto.is-on{width:18px;border-radius:999px;background:#5eead4;
  box-shadow:0 0 8px rgba(94,234,212,.8)}


/* ==================== CUMPLÍ TU SUEÑO: NADA TAPADO ====================
   El primer rótulo se comía la T por el recorte del contenedor, y el
   botón quedaba debajo del menú. Ambas cosas eran de espacio, no de texto. */
#screen-aporte .alta{padding:12px 16px 0 !important;overflow:visible}
#screen-aporte #apCampos{overflow-y:auto;overflow-x:visible;padding:2px 2px 0 !important;
  scrollbar-width:none}
#screen-aporte #apCampos::-webkit-scrollbar{display:none}
#screen-aporte .tarjeta-form{overflow:visible}
#screen-aporte .field{overflow:visible}
#screen-aporte .field label{padding-left:2px;overflow:visible;white-space:nowrap}
.aporte-intro{margin:0 0 12px}

/* el botón se apoya sobre el menú, nunca debajo */


/* ==================== SUBASTAS ACTIVAS: SIN HUECO ====================
   La cita se estiraba para llenar el sobrante y quedaba un vacío enorme
   entre el texto y la línea. Ahora ocupa lo que necesita y el aire
   sobrante se reparte: la cita muestra más líneas si hay lugar. */
.sueno__cita{flex:0 1 auto}
.sueno__cita p{--lineas:6}
@media (max-height:820px){ .sueno__cita p{--lineas:5} }
@media (max-height:760px){ .sueno__cita p{--lineas:4} }
@media (max-height:700px){ .sueno__cita p{--lineas:3} }

/* el bloque de la oferta se lleva el espacio libre y queda centrado */
.sueno__monto{margin-top:2px}
.sueno__reloj{margin-top:10px}


/* ==================== PANEL DE FUNDACIÓN ====================
   Una fundación no navega la app como donante: administra lo suyo.
   Primero quién es, después cómo va, después qué puede publicar. */
.fpanel{padding-bottom:20px}
.fcabecera{display:flex;align-items:center;gap:14px;padding:16px;border-radius:20px;margin-bottom:6px;
  background:linear-gradient(120deg, rgba(45,212,191,.14), rgba(13,42,63,.5));
  border:1px solid rgba(103,232,249,.22)}
.fcabecera .avatar{width:62px;height:62px;font-size:20px;flex:none;background-color:#fff}
.fcabecera__t{min-width:0}
.fcabecera__t b{display:flex;align-items:center;gap:9px;flex-wrap:wrap;
  font-size:19px;font-weight:700;color:#fff;line-height:1.2}
.fcabecera__t span{display:block;margin-top:3px;font-size:12.5px;color:var(--celeste)}
.fverif{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:999px;
  font-size:10px;font-weight:700;letter-spacing:.06em;color:#04222b;
  background:linear-gradient(100deg,#2dd4bf,#a3e635)}
.fverif svg{width:11px;height:11px}

.frotulo{margin:20px 2px 9px;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(94,234,212,.85);font-weight:700}

.fmetricas{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.metrica{padding:13px 14px;border-radius:16px;
  background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.09)}
.metrica__r{display:block;font-size:10px;letter-spacing:.12em;text-transform:uppercase;
  color:rgba(159,196,216,.7);font-weight:600}
.metrica__v{display:block;margin-top:4px;font-size:20px;font-weight:700;color:#fff;
  letter-spacing:-.02em;line-height:1.1}
.metrica__p{display:block;margin-top:2px;font-size:11px;color:rgba(159,196,216,.75)}

.facciones{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.faccion{display:flex;flex-direction:column;align-items:center;gap:7px;padding:12px 6px;
  border-radius:16px;cursor:pointer;font-family:inherit;font-size:11px;font-weight:600;color:#fff;
  background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.1)}
.faccion__i{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;color:#5eead4;
  background:rgba(45,212,191,.14);border:1px solid rgba(94,234,212,.28)}
.faccion__i svg{width:20px;height:20px}
.faccion:active{border-color:rgba(94,234,212,.6);background:rgba(45,212,191,.12)}

.fcampana{padding:13px 14px;border-radius:16px;
  background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.09)}
.fcampana__t{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.fcampana__t b{font-size:14.5px;font-weight:600;color:#fff}
.fcampana__t span{font-size:13px;font-weight:700;color:#5eead4}
.fbarra{height:6px;border-radius:999px;background:rgba(255,255,255,.1);margin:8px 0 6px;overflow:hidden}
.fbarra i{display:block;height:100%;border-radius:999px;
  background:linear-gradient(90deg,#22d3ee,#2dd4bf,#a3e635)}
.fcampana__p{font-size:11.5px;color:var(--celeste)}

.fpendientes{display:flex;flex-wrap:wrap;gap:7px}
.fpend{padding:7px 13px;border-radius:999px;font-size:12px;color:#fdba74;
  background:rgba(251,146,60,.1);border:1px dashed rgba(251,146,60,.42)}


/* ==================== SUBASTAS · VISTA DE FUNDACIÓN ====================
   La fundación no oferta: administra. El eje es el ciclo del lote. */
#screen-fsubastas .stats-pantalla{padding:14px 16px calc(var(--nav-alto) + 24px) !important;
  display:block !important;overflow-y:auto;position:static !important;height:auto !important}

.fsub-cifras{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:11px}
.fsub-cifras > div{padding:12px 13px;border-radius:15px;
  background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.09)}
.fsub-cifras span{display:block;font-size:10px;letter-spacing:.1em;text-transform:uppercase;
  color:rgba(159,196,216,.7);font-weight:600}
.fsub-cifras b{display:block;margin-top:4px;font-size:19px;font-weight:700;color:#fff;
  letter-spacing:-.02em}
.fsub-cifras b.es-alerta{color:#fdba74}

.fsub-aviso{display:flex;align-items:center;gap:9px;margin:12px 0 0;padding:11px 13px;
  border-radius:14px;font-size:12.5px;line-height:1.35;color:#fdba74;
  background:rgba(251,146,60,.1);border:1px solid rgba(251,146,60,.38)}
.fsub-aviso svg{width:18px;height:18px;flex:none}

.solapas{display:flex;gap:7px;margin:16px 0 11px}
.solapa{flex:1;padding:9px 6px;border-radius:12px;cursor:pointer;font-family:inherit;
  font-size:12.5px;font-weight:600;color:rgba(255,255,255,.6);
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.09)}
.solapa i{font-style:normal;opacity:.75;font-size:11px}
.solapa.is-on{color:#04222b;background:linear-gradient(100deg,#22d3ee,#2dd4bf 60%,#34d399);
  border-color:transparent;font-weight:700}

.lotef{display:flex;align-items:center;gap:12px;width:100%;text-align:left;cursor:pointer;
  font-family:inherit;padding:11px 13px;border-radius:16px;color:#fff;
  background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.09)}
.lotef:active{border-color:rgba(94,234,212,.5);background:rgba(45,212,191,.1)}
.lotef__foto{flex:none;width:52px;height:52px;border-radius:13px;background-size:cover;
  background-position:center;background-color:rgba(255,255,255,.07);
  display:grid;place-items:center;color:#5eead4}
.lotef__foto svg{width:24px;height:24px}
.lotef__t{flex:1;min-width:0}
.lotef__t b{display:block;font-size:14.5px;font-weight:600;line-height:1.25;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lotef__d{display:block;margin-top:2px;font-size:11.5px;color:rgba(159,196,216,.8)}
.lotef__chev{flex:none;font-size:22px;color:rgba(159,196,216,.5);font-weight:300}

.estadof{display:inline-block;margin-top:5px;padding:3px 10px;border-radius:999px;
  font-size:10px;font-weight:700;letter-spacing:.05em}
.estadof.es-ok{color:#5eead4;background:rgba(45,212,191,.14);border:1px solid rgba(94,234,212,.35)}
.estadof.es-urge{color:#fdba74;background:rgba(251,146,60,.14);border:1px solid rgba(251,146,60,.4)}
.estadof.es-alerta{color:#fca5a5;background:rgba(229,72,77,.14);border:1px solid rgba(229,72,77,.4)}
.estadof.es-medio{color:#93c5fd;background:rgba(96,165,250,.14);border:1px solid rgba(96,165,250,.4)}
.estadof.es-gris{color:rgba(159,196,216,.85);background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14)}

.lote-detalle{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  padding:14px;border-radius:16px;
  background:linear-gradient(120deg, rgba(45,212,191,.14), rgba(255,255,255,.04));
  border:1px solid rgba(94,234,212,.3)}
.lote-detalle span{display:block;font-size:10px;letter-spacing:.12em;text-transform:uppercase;
  color:rgba(94,234,212,.9);font-weight:600}
.lote-detalle b{display:block;margin-top:3px;font-size:22px;font-weight:700;color:#fff}
.lote-detalle__g b{font-size:15px}
.lote-detalle__f{flex-basis:100%;margin:6px 0 0;font-size:12px;color:var(--celeste)}


/* ==================== FUNDACIÓN: LA PANTALLA SE RECORRE ====================
   La regla que fija el perfil de donante usa prioridad máxima; sin esto,
   el panel de fundación quedaba inmóvil y no se podía llegar abajo. */
body.es-fundacion{position:static !important;overflow:visible !important;height:auto !important}
/* Ojo: sólo cuando está activa. Sin el .is-active, la pantalla quedaba
   visible siempre y se encimaba con la sección que se abriera encima. */
body.es-fundacion #screen-app.is-active{height:auto !important;display:block !important;
  overflow:visible !important}
.screen:not(.is-active){display:none !important}
body.es-fundacion #screen-app.is-active .viewport{display:block !important;height:auto !important;
  min-height:0 !important;padding-bottom:calc(var(--nav-alto) + 26px) !important}
body.es-fundacion #screen-app.is-active .panels{display:block !important;height:auto !important}
body.es-fundacion #screen-app.is-active .panel[aria-hidden="false"]{display:block !important;
  height:auto !important}
body.es-fundacion #screen-app.is-active #panelIzq[aria-hidden="false"]{display:block !important;
  overflow:visible !important;height:auto !important;padding-bottom:0 !important}
body.es-fundacion .placa{display:none !important}
/* la barra siempre por encima y tocable */
.nav5{pointer-events:auto}
.nav5__b{pointer-events:auto}


/* ==================== FUNDACIÓN · PENDIENTES Y COMUNIDAD ==================== */
.pendf{display:flex;align-items:center;gap:11px;width:100%;text-align:left;cursor:pointer;
  font-family:inherit;padding:12px 13px;border-radius:14px;color:#fff;font-size:13.5px;
  background:rgba(251,146,60,.08);border:1px solid rgba(251,146,60,.34)}
.pendf:active{background:rgba(251,146,60,.16)}
.pendf__p{flex:none;width:8px;height:8px;border-radius:50%;background:#fb923c;
  box-shadow:0 0 8px rgba(251,146,60,.8)}
.pendf__t{flex:1;min-width:0;line-height:1.3}
.fal-dia{margin-top:14px;padding:14px;border-radius:14px;text-align:center;font-size:13px;
  color:#5eead4;background:rgba(45,212,191,.1);border:1px solid rgba(94,234,212,.3)}

.pers{display:flex;align-items:center;gap:11px;padding:11px 13px;border-radius:15px;
  background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.09)}
.pers__av{flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;
  font-size:13px;font-weight:700;color:#04222b;
  background:linear-gradient(120deg,#22d3ee,#2dd4bf 60%,#a3e635)}
.pers__t{flex:1;min-width:0}
.pers__t b{display:block;font-size:14.5px;font-weight:600;color:#fff;line-height:1.2;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pers__t span{display:block;margin-top:2px;font-size:11.5px;color:var(--celeste)}
.pers__m{flex:none;font-size:15px;font-weight:700;color:var(--turq)}
.pers__m i{font-style:normal;font-size:10.5px;font-weight:400;color:var(--celeste)}
.pers__grax{flex:none;margin-left:4px;padding:6px 12px;border-radius:999px;cursor:pointer;
  font-family:inherit;font-size:11.5px;font-weight:700;color:#5eead4;
  background:rgba(45,212,191,.14);border:1px solid rgba(94,234,212,.4)}
.pers--baja{opacity:.6}
.pers--baja .pers__av{background:rgba(255,255,255,.14);color:rgba(255,255,255,.7)}

#screen-comunidad .stats-pantalla{padding:14px 16px calc(var(--nav-alto) + 24px) !important;
  display:block !important;overflow-y:auto;position:static !important;height:auto !important}


/* ==================== COMUNIDAD ==================== */
.fnota{margin:-4px 2px 9px;font-size:11.5px;line-height:1.35;color:rgba(159,196,216,.75)}
.delta{display:block;margin-top:3px;font-style:normal;font-size:11px;font-weight:600;color:#5eead4}
.delta.es-baja{color:#fdba74}

.pers{position:relative;padding:0 13px 0 0}
.pers__ir{flex:1;min-width:0;display:flex;align-items:center;gap:11px;padding:11px 0 11px 13px;
  background:none;border:0;cursor:pointer;font-family:inherit;text-align:left;color:#fff}
.pers__ir:active{opacity:.7}
.pers--anon{opacity:.75}
.pers--anon .pers__av{background:rgba(255,255,255,.14);color:rgba(255,255,255,.75)}
.pers__grax.es-hecho{color:rgba(159,196,216,.7);background:rgba(255,255,255,.05);
  border-color:rgba(255,255,255,.14)}
#comunidadCuerpo .fsub-cifras b{margin-top:3px}


/* ==================== TARJETA DE FUNDACIÓN ====================
   Menos números gritando, más señales de confianza, y nada cortado. */
#screen-fundaciones .card{display:flex;flex-direction:column;height:100%;overflow:hidden}
#screen-fundaciones .card__body{flex:1;min-height:0;display:flex;flex-direction:column;
  padding:16px 16px 14px;overflow:hidden}
#screen-fundaciones .card__body > div:first-child{flex:1;min-height:0;display:flex;
  flex-direction:column;overflow:hidden}

.card__id{display:flex;align-items:flex-start;gap:12px}
.card__id .avatar{width:54px;height:54px;flex:none;background-color:#fff}
.card__idt{flex:1;min-width:0}
.card__name{margin:0;font-size:clamp(17px,2.4vh,20px);font-weight:700;color:#fff;line-height:1.2}
.card__place{margin:3px 0 0;font-size:12px;color:var(--celeste)}
.card__lema{margin:2px 0 0;font-size:12.5px;line-height:1.3;color:rgba(255,255,255,.72);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card__fav{flex:none;width:36px;height:36px;border-radius:50%;cursor:pointer;display:grid;
  place-items:center;color:rgba(255,255,255,.55);
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14)}
.card__fav svg{width:19px;height:19px}
.card__fav.es-on{color:#fb7185;border-color:rgba(251,113,133,.5);background:rgba(251,113,133,.14)}

.card__sellos{display:flex;flex-wrap:wrap;gap:6px;margin-top:11px}
.sello{padding:4px 10px;border-radius:999px;font-size:10.5px;line-height:1.3;
  color:rgba(159,196,216,.9);background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.13)}
.sello--ok{display:inline-flex;align-items:center;gap:5px;color:#04222b;border:0;font-weight:700;
  background:linear-gradient(100deg,#2dd4bf,#a3e635)}
.sello--ok svg{width:11px;height:11px}

.card__eyebrow{margin:14px 0 8px !important}
#screen-fundaciones .card__causas{flex:1;min-height:0;overflow-y:auto;display:flex;
  flex-direction:column;gap:10px;scrollbar-width:none}
#screen-fundaciones .card__causas::-webkit-scrollbar{display:none}

.cam__t{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.cam__t b{font-size:14px;font-weight:600;color:#fff;line-height:1.25}
.cam__t span{flex:none;font-size:13px;font-weight:700;color:#5eead4}
.cam__barra{height:6px;border-radius:999px;background:rgba(255,255,255,.1);margin:7px 0 5px;
  overflow:hidden}
.cam__barra i{display:block;height:100%;border-radius:999px;
  background:linear-gradient(90deg,#22d3ee,#2dd4bf,#a3e635)}
/* el faltante deja de gritar: sólo lo donado va destacado */
.cam__p{font-size:11.5px;color:rgba(159,196,216,.78)}
.cam__p b{color:#fff;font-weight:600}

.card__mas{width:100%;padding:9px;border-radius:12px;cursor:pointer;font-family:inherit;
  font-size:12.5px;font-weight:600;color:#5eead4;
  background:rgba(45,212,191,.1);border:1px dashed rgba(94,234,212,.4)}

.card__pie{flex:none;display:flex;align-items:center;gap:12px;margin-top:12px}
.card__ver{flex:none;background:none;border:0;cursor:pointer;font-family:inherit;
  font-size:13px;font-weight:700;color:#5eead4;text-decoration:underline;text-underline-offset:4px;
  padding:0}
.card__pie .btn{flex:1;min-height:46px;font-size:14.5px}
#screen-fundaciones .card__side{flex:none}
#screen-fundaciones .evento-click{padding:10px 0 0;border-top:1px solid rgba(255,255,255,.08);
  margin-top:10px}

@media (prefers-reduced-motion:reduce){*{transition-duration:.001ms !important}}

/* ==================== MENÚ FIJO · DEFINICIÓN ÚNICA ====================
   Los contenedores también viven acá, una sola vez. */
body.menu-fijo #screen-app{height:100dvh;display:flex;flex-direction:column;overflow:hidden}
body.menu-fijo .viewport{flex:1;min-height:0;padding-top:0;padding-bottom:0}

   No repetir estas reglas en otro lado: al acumularse, una vieja con
   height:100% hacía que la primera tarjeta ocupara toda la pantalla.
   La altura de cada tarjeta la calcula el JS y la aplica en línea. */
body.menu-fijo .menu-principal{
  display:flex;flex-direction:column;align-items:stretch;
  height:100%;min-height:0;padding:0;margin:0}

/* ==================== PORTADA · DEFINICIÓN ÚNICA ====================
   El contenido vivía en una caja de alto fijo y centrado: si no entraba,
   se recortaba por arriba y por abajo, dejando el título al medio y
   escondiendo el acceso. Ahora la caja interna puede crecer y, si hace
   falta, se desplaza. Centrada cuando entra, completa cuando no. */
#screen-home{width:100%;max-width:100%}
body.portada #screen-home{height:100dvh}
.portada{position:relative;height:100dvh;width:100%;overflow:hidden;
  -webkit-overflow-scrolling:touch;scrollbar-width:none;text-align:center}
.portada::-webkit-scrollbar{display:none}
.portada__caja{position:relative;z-index:1;min-height:100%;width:100%;
  display:flex;flex-direction:column;align-items:stretch;justify-content:center;
  padding:max(18px, env(safe-area-inset-top)) 16px max(18px, env(safe-area-inset-bottom))}
.portada__caja > *{width:100%}
.portada__logo{align-self:center;width:min(32vw,124px);height:auto;max-height:16vh;
  filter:drop-shadow(0 0 22px rgba(45,212,191,.35))}
.portada__marca{margin:clamp(8px,1.8vh,18px) 0 0}
.portada__m1,.portada__m2{font-size:clamp(34px,6.6vh,58px)}
.portada__linea{align-self:center;margin:clamp(8px,1.6vh,18px) 0 clamp(6px,1.2vh,14px)}
.portada__frase{margin-bottom:clamp(12px,2.4vh,26px)}
.portada__acceso{padding:clamp(13px,2.2vh,20px) 16px}

/* ==================== BARRA INFERIOR · DEFINICIÓN ÚNICA ====================
   Sin borde superior ni sombra interna: eran los que dibujaban esa línea
   clara flotando encima de la barra. */

/* ==================== BARRA INFERIOR · NUEVA ====================
   Contrato de espacio, en un solo lugar:
   · alto del contenido: 54px
   · más la franja segura del teléfono
   El resto de la app reserva --nav-alto y nada más. */
:root{--nav-fila:72px; --nav-alto:calc(var(--nav-fila) + env(safe-area-inset-bottom));}

.nav5{position:fixed;left:0;right:0;bottom:0;z-index:80;
  height:var(--nav-alto);
  padding-bottom:env(safe-area-inset-bottom);
  background:#071120;
  border:0;box-shadow:none;border-radius:0}
.nav5__fila{height:var(--nav-fila);display:grid;grid-template-columns:repeat(3,1fr);align-items:center}
.nav5__b{position:relative;height:100%;display:grid;place-items:center;
  background:none;border:0;padding:0;cursor:pointer;color:rgba(255,255,255,.45);
  transition:color .18s,transform .16s}

.nav5__b.is-on{color:#5eead4}
.nav5__b.is-on svg{filter:drop-shadow(0 0 9px rgba(94,234,212,.75))}
.nav5__b:active{transform:scale(.9)}
.nav5__punto{position:absolute;top:22px;right:calc(50% - 21px);width:10px;height:10px;border-radius:50%;
  background:#E5484D;box-shadow:0 0 0 2px #071120;pointer-events:none;
  /* fuera del flujo: no puede alterar el alto de la barra */
  margin:0;padding:0;line-height:0}
.nav5__b{overflow:visible}
body.portada .nav5{display:none}

/* Todo lo que llega hasta abajo reserva exactamente el alto de la barra. */
.viewport,.stats-pantalla,.bloque-scroll{padding-bottom:calc(var(--nav-alto) + 12px) !important}

/* ==================== ESTRUCTURA · DEFINICIÓN ÚNICA ====================
   Contenedor de paneles, panel oculto y caja del menú. Una sola vez cada uno.
   El panel oculto usa display:none (no visibility, que seguiría ocupando lugar). */
.panels{display:block;transform:none}
/* La cápsula beta no se muestra sobre el menú ni en la portada. */

/* El panel oculto se va del flujo, pase lo que pase con la especificidad. */
.panel[aria-hidden="true"],#panelIzq[aria-hidden="true"],
#panelCentro[aria-hidden="true"],#panelDer[aria-hidden="true"]{display:none !important}
body.perfil-quieto .panels,body.perfil-quieto .panel{
  flex:1;min-height:0;display:flex;flex-direction:column}

/* ==================== TARJETAS DE ENTRADA · DEFINICIÓN ÚNICA ====================
   Vidrio translúcido con contorno en degradado celeste→verde y un punto de
   energía que gira por el borde. Una sola definición: no duplicar en otro lado. */
.menu-principal{display:flex;flex-direction:column;gap:12px;padding:0;margin:0}

.entrada:active{transform:scale(.985);filter:brightness(1.08)}


.entrada__ico{position:relative;z-index:1;flex:none;
  width:min(56px,8vh);height:min(56px,8vh);border-radius:50%;display:grid;place-items:center;
  color:var(--luz);
  background:radial-gradient(120% 120% at 30% 20%, rgba(255,255,255,.12), rgba(4,14,26,.75) 65%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22), 0 0 0 1px var(--canto-luz),
    0 0 18px var(--halo)}
.entrada__ico svg{width:54%;height:54%;filter:drop-shadow(0 0 7px var(--luz))}

.entrada__col{position:relative;z-index:1;flex:1;min-width:0;display:flex;flex-direction:column;
  justify-content:center}
.entrada__t{display:block;color:#fff;font-size:clamp(17px,2.6vh,22px);font-weight:700;
  letter-spacing:-.01em;line-height:1.16;text-shadow:0 2px 10px rgba(0,0,0,.45)}
.entrada__chev{position:relative;z-index:1;flex:none;font-size:26px;line-height:1;
  color:rgba(255,255,255,.7);font-weight:300;padding-right:4px}

/* la paleta del logo: celeste a verde, con matiz propio por tarjeta */

@media (prefers-reduced-motion:reduce){
  .entrada::before{animation:none}
}

/* ==================== ENTRADAS · ENERGÍA SÓLO EN EL BORDE ====================
   El fondo es una aurora quieta, muy diluida, que deja ver las estrellas.
   El movimiento vive únicamente en el contorno, recortado con una máscara
   para que el giro no se vea nunca por dentro. */
.entrada{position:relative;width:100%;cursor:pointer;border:0;padding:0 16px 0 18px;
  border-radius:24px;overflow:hidden;isolation:isolate;
  display:flex;align-items:center;gap:16px;text-align:left;
  background:
    radial-gradient(90% 130% at 8% -10%, var(--velo1), transparent 60%),
    radial-gradient(80% 120% at 92% 110%, var(--velo2), transparent 58%),
    radial-gradient(120% 90% at 50% 50%, rgba(255,255,255,.045), transparent 70%);
  backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.13), 0 10px 26px rgba(2,10,20,.35);
  transition:transform .18s cubic-bezier(.2,.8,.3,1),filter .18s}
.entrada:active{transform:scale(.985);filter:brightness(1.1)}


/* ==================== NOVEDADES ==================== */

#screen-avisos #listaAvisos{display:block}
/* las nuevas: fondo apenas más claro y título más brillante */

/* ==================== CIELO: MÁS PUNTOS, MÁS CHICOS ==================== */
.cielo-fondo::after{
  background:
    radial-gradient(1px 1px at 6% 11%, rgba(255,255,255,.9), transparent),
    radial-gradient(1px 1px at 14% 63%, rgba(210,245,255,.7), transparent),
    radial-gradient(.9px .9px at 21% 29%, rgba(255,255,255,.75), transparent),
    radial-gradient(1px 1px at 29% 82%, rgba(255,255,255,.65), transparent),
    radial-gradient(1.1px 1.1px at 37% 18%, rgba(255,255,255,.9), transparent),
    radial-gradient(.9px .9px at 44% 55%, rgba(210,245,255,.6), transparent),
    radial-gradient(1px 1px at 52% 33%, rgba(255,255,255,.8), transparent),
    radial-gradient(.9px .9px at 58% 71%, rgba(255,255,255,.6), transparent),
    radial-gradient(1.1px 1.1px at 65% 12%, rgba(255,255,255,.85), transparent),
    radial-gradient(.9px .9px at 71% 48%, rgba(210,245,255,.65), transparent),
    radial-gradient(1px 1px at 78% 87%, rgba(255,255,255,.7), transparent),
    radial-gradient(1.1px 1.1px at 84% 26%, rgba(255,255,255,.85), transparent),
    radial-gradient(.9px .9px at 90% 59%, rgba(210,245,255,.6), transparent),
    radial-gradient(1px 1px at 96% 38%, rgba(255,255,255,.75), transparent),
    radial-gradient(.9px .9px at 11% 92%, rgba(255,255,255,.6), transparent),
    radial-gradient(1px 1px at 47% 95%, rgba(255,255,255,.7), transparent),
    radial-gradient(.9px .9px at 88% 8%, rgba(255,255,255,.65), transparent),
    radial-gradient(1px 1px at 3% 74%, rgba(210,245,255,.6), transparent)}
.titila{width:2.6px;height:2.6px;opacity:.28}

/* ==================== BORDE VIVO ====================
   Antes rotaba un rectángulo entero, y el giro se veía en el medio.
   Ahora la luz recorre el contorno real: un trazo corto que viaja por el
   perímetro del propio rectángulo, medido en centésimas de su recorrido. */
/* El SVG es un elemento reemplazado: con el ancho en automático toma su
   tamaño propio (300x150) en vez de estirarse, y por eso el trazo doblaba
   antes de llegar al final. Va con medida explícita. */
.entrada__borde{position:absolute;top:1.5px;left:1.5px;
  width:calc(100% - 3px);height:calc(100% - 3px);
  display:block;pointer-events:none;z-index:2;overflow:visible}

/* ==================== BORDE VIVO · CELESTE A VERDE ====================
   Todo el contorno está encendido con el degradado del logo, y encima
   respira un pulso de luz que lo recorre entero. */
.entrada__base{fill:none;stroke:url(#bordeVivo);stroke-width:1.8;opacity:.9;
  filter:drop-shadow(0 0 5px rgba(45,212,191,.5))}
.entrada__chispa{fill:none;stroke:url(#bordeVivo);stroke-width:2.6;
  filter:drop-shadow(0 0 9px rgba(94,234,212,.9)) drop-shadow(0 0 16px rgba(74,222,128,.5));
  animation:respiraBorde 3.4s ease-in-out infinite}
@keyframes respiraBorde{
  0%,100%{opacity:.25}
  50%{opacity:1}
}
.entrada:nth-child(2) .entrada__chispa{animation-delay:-.7s}
.entrada:nth-child(3) .entrada__chispa{animation-delay:-1.4s}
.entrada:nth-child(4) .entrada__chispa{animation-delay:-2.1s}
.entrada:nth-child(5) .entrada__chispa{animation-delay:-2.8s}
@media (prefers-reduced-motion:reduce){.entrada__chispa{animation:none;opacity:.6}}

/* La imagen manda: ocupa casi la mitad de la tarjeta y el título respira. */
.lote__foto{flex:0 0 46%}
.lote__cuerpo{padding:16px 16px 14px}
.lote__titulo{font-size:clamp(19px,2.9vh,24px);line-height:1.18;margin-bottom:2px;
  -webkit-line-clamp:2}
.lote__cifras{margin-top:12px}
.lote__monto{margin-top:3px}
.reloj{margin-top:13px}
.lote__fund{margin-top:13px}
.lote__fund-t b{font-size:16px}
.cab-seccion b{font-size:15px}
@media (max-height:700px){
  .lote__foto{flex:0 0 36%}
}

/* ==================== SUEÑOS EN SUBASTA ACTIVA ==================== */
.cab-punto{width:8px;height:8px;border-radius:50%;background:#2dd4bf;
  box-shadow:0 0 8px rgba(45,212,191,.9)}
#screen-deseos .buscador{border-radius:999px;background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12)}
#screen-deseos .buscador input{background:transparent !important;border:0 !important;
  padding:14px 16px 14px 44px !important;font-size:15px}
#screen-deseos .buscador__icono{left:16px;color:rgba(159,196,216,.8)}

.suenos-lista{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;scrollbar-width:none}
.suenos-lista::-webkit-scrollbar{display:none}
.sueno{flex:0 0 84%;scroll-snap-align:center;height:100%;display:flex;flex-direction:column;
  padding:18px 18px 16px;border-radius:24px;overflow:hidden;
  background:linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025));
  border:1px solid rgba(103,232,249,.25);
  box-shadow:0 18px 44px rgba(2,10,20,.5)}

.sueno__cab{display:flex;align-items:center;gap:12px;flex:none}
.sueno__ava{width:52px;height:52px;border-radius:50%;flex:none;display:grid;place-items:center;
  background-size:cover;background-position:center;border:2px solid rgba(94,234,212,.55);
  font-size:17px;font-weight:600;color:#0b2136}
.sueno__quien{min-width:0}
.sueno__quien b{display:flex;align-items:center;gap:6px;font-size:17px;font-weight:700;color:#fff;
  line-height:1.15}
.sueno__quien span{display:block;margin-top:2px;font-size:13px;color:rgba(159,196,216,.85)}

.sueno__titulo{flex:none;margin:14px 0 0;font-size:clamp(20px,3vh,26px);font-weight:500;
  letter-spacing:-.02em;line-height:1.18;color:#fff;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

.sueno__comilla{position:absolute;left:0;top:-6px;font-size:34px;line-height:1;
  color:rgba(94,234,212,.55);font-family:Georgia,serif}

.sueno__rotulo{display:block;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(94,234,212,.9);font-weight:600}
.sueno__monto{display:block;margin-top:4px;font-size:clamp(30px,5vh,44px);font-weight:700;color:#fff;
  letter-spacing:-.03em;line-height:1;text-shadow:0 0 26px rgba(94,234,212,.55)}

.sueno__btn{flex:none;margin-top:14px;letter-spacing:.08em;display:flex;align-items:center;justify-content:center;gap:12px;
  width:100%;min-height:56px;border:0;border-radius:16px;cursor:pointer;font-family:inherit;
  font-size:17px;font-weight:700;letter-spacing:.02em;color:#04222b;
  background:linear-gradient(100deg,#22d3ee,#2dd4bf 55%,#34d399);
  box-shadow:0 0 30px rgba(45,212,191,.45), inset 0 1px 0 rgba(255,255,255,.5)}
.sueno__btn svg{width:20px;height:20px}
.sueno__btn:active{filter:brightness(1.1)}

.sueno__pie{flex:none;display:flex;align-items:center;justify-content:center;gap:7px;
  margin:11px 0 0;font-size:12px;color:rgba(159,196,216,.75)}
.sueno__pie svg{width:16px;height:16px}
.sueno__pie .borrar-sueno{margin-left:auto;padding:0;font-size:11px;color:rgba(255,255,255,.4)}

/* ---- paleta de las entradas, una sola vez ---- */

/* ---- la cita, definición única: corta por líneas enteras ---- */
.sueno__cita{position:relative;flex:1 1 0;min-height:0;overflow:hidden;
  margin:10px 0 0;padding:0 4px 0 22px;cursor:pointer}
.sueno__comilla{position:absolute;left:0;top:-4px;font-size:clamp(20px,2.6vh,26px);line-height:1;
  color:rgba(94,234,212,.55);font-family:Georgia,serif}
.sueno__cita p{margin:0;font-size:clamp(12px,1.6vh,13.5px);line-height:1.5;
  color:rgba(255,255,255,.82);
  display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;
  -webkit-line-clamp:var(--lineas,4);max-height:calc(1.5em * var(--lineas,4))}
@media (max-height:800px){ .sueno__cita p{--lineas:3} }
@media (max-height:700px){ .sueno__cita p{--lineas:2} }

/* ---- pie de acciones · definición única ----
   Tenía once reglas encimadas y la última anulaba el espacio del menú. */
.alta__acciones{display:flex;gap:10px;margin-top:24px}
.alta__acciones .btn{flex:1}
#screen-aporte .alta__acciones{position:static;flex:none;display:block;
  margin:0;padding:10px 16px 124px;   /* 124 = alto de la barra más aire */
  background:linear-gradient(180deg, transparent, rgba(5,12,23,.94) 30%);
  border:0}
#screen-aporte .alta__acciones .btn{width:100%;min-height:50px;font-size:16px}

/* ---- bloque de la oferta · definición única ----
   Se lleva el aire sobrante para que no quede un hueco bajo la cita. */
.sueno__oferta{flex:1 1 auto !important;min-height:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:4px;
  margin-top:10px;padding-top:12px;text-align:center;
  border-top:1px solid rgba(255,255,255,.1)}
.sueno__gana{display:flex;flex-direction:column;align-items:center;gap:5px;margin:0;
  font-size:clamp(12.5px,1.8vh,14px);color:rgba(255,255,255,.75)}
.sueno__gana b{color:#5eead4;font-weight:700}
.sueno__gana b.es-vos{color:#a3e635}
.sueno__gana i{font-style:italic;color:rgba(159,196,216,.75)}
.sueno__cuantas{display:block;font-size:11px;color:rgba(159,196,216,.6);letter-spacing:.02em}

body{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;color:#10242C;margin:40px;}'+
    'h1{font-weight:200;letter-spacing:-.03em;font-size:30px;margin:0}'+
    'p.sub{color:#6E8592;font-size:13px;margin:6px 0 26px}'+
    'table{width:100%;border-collapse:collapse;font-size:13px}'+
    'td{padding:9px 8px;border-bottom:1px solid #e3eaee}'+
    'td:last-child{text-align:right;font-weight:600}'+
    '.marca{display:flex;align-items:center;gap:10px;margin-bottom:22px}'+
    '.m1{width:20px;height:20px;background:#87CEEB;position:relative}'+
    '.m1 i{position:absolute;inset:5px;background:#43AA8B;display:block}'+
    '.m2{font-size:11px;font-weight:700;letter-spacing:.26em;text-transform:uppercase}'+
    '/* ==================== Acceso con Google ==================== */
.oauth-sep{display:flex;align-items:center;gap:10px;margin:14px 0 10px;color:rgba(243,248,250,.55);font-size:12px;text-transform:uppercase;letter-spacing:.12em}
.oauth-sep::before,.oauth-sep::after{content:"";flex:1;height:1px;background:rgba(243,248,250,.22)}
.btn-google{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:12px 16px;border-radius:999px;border:1px solid rgba(243,248,250,.35);background:#fff;color:#10242C;font:600 15px/1 "Helvetica Neue",Helvetica,Arial,sans-serif;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease}
.btn-google:hover{transform:translateY(-1px);box-shadow:0 8px 22px rgba(0,0,0,.25)}
.btn-google:disabled{opacity:.6;cursor:default;transform:none}
.btn-google svg{width:20px;height:20px;flex:0 0 20px}

/* ==================== COMODIDAD EN COMPUTADORA ====================
   En pantallas grandes el contenido se centra en una columna legible,
   los carruseles muestran sus flechas y una barra fina para que se
   puedan mover con el mouse, y nada queda trabado. */
@media (min-width:900px) and (pointer:fine){
  .carrusel__flecha{display:inline-flex !important}
  .carrusel__slide{flex-basis:38%}
  .sueno-fila{flex-basis:44%}

  /* barra fina y visible en los carriles horizontales */
  .carrusel__viewport,.subastas-grid,.suenos-lista,.planes{
    scrollbar-width:thin;scrollbar-color:rgba(16,36,44,.28) transparent;
    scroll-snap-type:x proximity;cursor:grab}
  .carrusel__viewport.arrastrando,.subastas-grid.arrastrando,
  .suenos-lista.arrastrando,.planes.arrastrando{cursor:grabbing;scroll-snap-type:none}
  .carrusel__viewport::-webkit-scrollbar,.subastas-grid::-webkit-scrollbar,
  .suenos-lista::-webkit-scrollbar,.planes::-webkit-scrollbar{display:block;height:8px}
  .carrusel__viewport::-webkit-scrollbar-thumb,.subastas-grid::-webkit-scrollbar-thumb,
  .suenos-lista::-webkit-scrollbar-thumb,.planes::-webkit-scrollbar-thumb{
    background:rgba(16,36,44,.26);border-radius:99px}
  body.noche .carrusel__viewport::-webkit-scrollbar-thumb,
  body.noche .subastas-grid::-webkit-scrollbar-thumb,
  body.noche .suenos-lista::-webkit-scrollbar-thumb{background:rgba(255,255,255,.3)}

  /* columna centrada: se lee sin barrer la vista de punta a punta */
  .viewport,.stats-pantalla,.alta,.topbar__row{max-width:1040px !important;
    margin-left:auto !important;margin-right:auto !important}
  .nav5{max-width:1040px;margin:0 auto}
}

/* ==================== PULIDO ESTÉTICO ====================
   Una sola familia tipográfica en toda la app (antes cada dispositivo
   caía en una fuente distinta), titulares con el mismo peso y los
   botones de las tarjetas siempre alineados al pie, nunca escalonados. */
:root{
  --font:"Manrope","Helvetica Neue",Helvetica,Arial,"Liberation Sans",sans-serif;
}
body,button,input,select,textarea,h1,h2,h3,h4,h5,h6,
.entrada__t,.cta__txt,.display,.eyebrow,
.subasta-card__titulo,.sueno-fila__titulo,.post__titulo{
  font-family:var(--font)}
h1,h2,h3,h4,h5,h6{letter-spacing:-.02em;line-height:1.22;font-weight:700;margin-top:0}
.entrada__t,.subasta-card__titulo{font-weight:700;letter-spacing:-.02em}
/* letras nítidas: sombra corta en vez del halo difuso que las ensuciaba */
.entrada__t{text-shadow:0 1px 3px rgba(0,0,0,.45)}
.cta__txt{text-shadow:0 1px 3px rgba(0,0,0,.3)}
.portada__frase{text-shadow:none}

/* ---- filas de botones parejas en toda la app ---- */
.modal__actions,.alta__acciones,.ficha__acciones{align-items:stretch}
.modal__actions .btn,.alta__acciones .btn,.ficha__acciones .btn{min-height:48px}

/* Navegación con teclado en los carruseles: foco visible y sin mouse. */
.carril-navegable:focus{outline:none}
.carril-navegable:focus-visible{
  outline:3px solid var(--verde);outline-offset:3px;border-radius:14px}
.carril-navegable :focus-visible{
  outline:3px solid var(--verde);outline-offset:2px;border-radius:12px}

/* ==================== CELULAR: TODO SE LEE HACIA ABAJO ====================
   Antes cada sección se movía de costado (una tarjeta por pantalla) y era
   incómodo con el pulgar. Ahora las tarjetas se apilan y se scrollea la
   página de arriba hacia abajo, como en cualquier app. */
@media (max-width:820px){
  body.sin-scroll{overflow-y:auto !important;position:static !important;inset:auto !important}

  #screen-deseos.is-active,#screen-subastas.is-active,#screen-eventos.is-active,
  #screen-fundaciones.is-active{height:auto !important;min-height:100dvh !important;display:block !important}

  #screen-deseos .stats-pantalla,#screen-subastas .stats-pantalla,
  #screen-eventos .stats-pantalla,#screen-fundaciones .stats-pantalla{
    display:block !important;position:static !important;inset:auto !important;
    height:auto !important;max-height:none !important;overflow:visible !important;
    padding-bottom:calc(var(--nav-alto, 64px) + 24px) !important}

  /* las listas horizontales pasan a ser columnas */
  .suenos-lista,.subastas-grid,.carrusel__viewport,.carrusel__track,.planes{
    display:flex !important;flex-direction:column !important;gap:14px !important;
    overflow:visible !important;height:auto !important;flex:none !important;
    scroll-snap-type:none !important;padding-left:0 !important;padding-right:0 !important}
  .suenos-lista > *,.subastas-grid > *,.carrusel__slide,.planes > *{
    flex:0 0 auto !important;width:100% !important;max-width:none !important;
    margin:0 !important;padding-left:0 !important;padding-right:0 !important;
    opacity:1 !important;transform:none !important;scroll-snap-align:none !important}
  .carrusel{display:block !important}
  .carrusel__flecha,.carrusel__puntos{display:none !important}

  /* las tarjetas recuperan alto natural: nada se recorta */
  #screen-subastas .subasta-card,#screen-fundaciones .card,#screen-eventos .ecard{
    height:auto !important}
  #screen-subastas .subasta-foto,#screen-eventos .ecard__img{flex:none !important;height:190px !important}
  #screen-fundaciones .card__causas > div:nth-child(n+3){display:block}
  #screen-fundaciones .card__side{display:none}
  .stats-pantalla .lede{display:block}

  /* flecha para volver arriba cuando la lista es larga */
  #btnArriba{position:fixed;right:14px;bottom:calc(var(--nav-alto, 64px) + 14px);z-index:55;
    width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.28);
    background:rgba(9,20,36,.78);color:#fff;font-size:20px;line-height:1;cursor:pointer;
    display:none;align-items:center;justify-content:center;backdrop-filter:blur(8px);
    box-shadow:0 8px 22px rgba(0,0,0,.3)}
  #btnArriba.is-on{display:flex}
}

@media (max-width:820px){
  /* las tarjetas ya no se recortan al alto de la pantalla */
  .sueno,.lote,.subasta-card,.ecard,#screen-fundaciones .card{
    height:auto !important;max-height:none !important;overflow:visible !important}
  .sueno__cita,.lote__cita{max-height:none !important;-webkit-line-clamp:unset !important}
  #screen-deseos .stats-pantalla{bottom:auto !important}
}

/* ==================== QUIÉN VA GANANDO LA SUBASTA ==================== */
.lote__gana{display:flex;flex-direction:column;gap:2px;margin-top:10px;padding:10px 12px;
  border-radius:14px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06)}
.lote__gana b{font-size:14.5px;font-weight:700;color:#fff;line-height:1.25}
.lote__gana span{font-size:12.5px;color:rgba(255,255,255,.72);line-height:1.3}
.lote__gana b.es-vos{color:#a3e635}
.lote__gana--vos{border-color:rgba(163,230,53,.55);background:rgba(163,230,53,.12)}

/* ==================== CELULAR: TARJETAS MÁS PROLIJAS ==================== */
@media (max-width:820px){
  .lote,.sueno,.ecard,#screen-fundaciones .card{
    border-radius:20px !important;overflow:hidden !important}
  .lote{display:flex !important;flex-direction:column !important}
  .lote__foto{flex:none !important;height:200px !important;width:100% !important;border-radius:0 !important}
  .lote__cuerpo{padding:14px 16px 16px !important;gap:0 !important}
  .lote__titulo{font-size:19px !important;line-height:1.25 !important;
    display:block !important;-webkit-line-clamp:unset !important;max-height:none !important}
  .lote__monto{font-size:26px !important}
  .lote__gana{margin-top:12px !important}
  .lote__fund{margin-top:12px !important}
  .lote__fund .avatar{width:42px !important;height:42px !important;margin-top:0 !important}
  .lote__ofertar{margin-top:14px !important;width:100% !important;min-height:50px !important}
  .reloj{margin-top:12px !important}
  .stats-pantalla > .lede{margin-bottom:12px}
}

/* ==================== CELULAR: TARJETAS PAREJAS ====================
   Antes cada tarjeta medía distinto según el largo del texto y las fotos,
   los montos y los botones quedaban descalzados entre una y otra. Acá
   fijamos el alto de cada bloque para que todo quede alineado. */
@media (max-width:820px){
  .sueno{display:flex !important;flex-direction:column !important;padding:16px !important}
  .sueno__cab{min-height:56px !important;align-items:center !important;gap:12px !important}
  .sueno__ava{width:48px !important;height:48px !important;flex:0 0 48px !important}
  .sueno__quien{min-width:0 !important}
  .sueno__quien b,.sueno__quien span{display:block !important;overflow:hidden !important;
    text-overflow:ellipsis !important;white-space:nowrap !important}
  .sueno__titulo{margin:12px 0 0 !important;font-size:20px !important;line-height:1.25 !important;
    min-height:50px !important;display:-webkit-box !important;-webkit-box-orient:vertical !important;
    -webkit-line-clamp:2 !important;overflow:hidden !important}
  .sueno__cita{flex:none !important;margin-top:10px !important}
  .sueno__cita p{font-size:13px !important;line-height:1.5 !important;
    min-height:58px !important;display:-webkit-box !important;-webkit-box-orient:vertical !important;
    -webkit-line-clamp:3 !important;overflow:hidden !important;max-height:58px !important}
  .sueno__oferta{margin-top:12px !important;min-height:104px !important}
  .sueno__reloj{margin-top:10px !important}
  .sueno__btn{margin-top:14px !important;width:100% !important;
    height:52px !important;min-height:52px !important;flex:0 0 52px !important}
}

/* ==================== FILAS DEL CORAZÓN ====================
   "Tus sueños publicados" y "Subastas donde participaste" salían como
   botones sin estilo (fondo blanco, texto ilegible). Les damos el mismo
   look que las filas de apoyos. */
.fila-sueno{display:flex;align-items:center;gap:12px;width:100%;text-align:left;
  background:rgba(255,255,255,.05);border:1px solid rgba(103,232,249,.16);
  border-radius:13px;padding:11px 13px;cursor:pointer;font:inherit;color:#fff;
  transition:background .18s ease,border-color .18s ease,transform .18s ease}
.fila-sueno:hover{background:rgba(255,255,255,.09);border-color:rgba(103,232,249,.34)}
.fila-sueno:active{transform:scale(.99)}
.fila-sueno__t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.fila-sueno__t b{font-size:14.5px;font-weight:700;color:#fff;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fila-sueno__t span{font-size:12px;color:var(--celeste,#9fc4d8);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fila-sueno__m{flex:none;font-size:14.5px;font-weight:700;color:var(--turq,#2dd4bf);white-space:nowrap}
.fila-sueno__m.es-mio{color:var(--verde,#43AA8B)}

/* ==================== ESCRITORIO: SUBASTAS Y SUEÑOS HACIA ABAJO ====================
   En la computadora las listas de subastas y sueños activas dejan de scrollear
   de costado; se apilan verticalmente y se lee hacia abajo como en el celular,
   sin quedar una tarjeta flotando en el centro de la pantalla. */
@media (min-width:821px){
  /* permitimos scroll de página mientras estas pantallas estén abiertas */
  body.sin-scroll:has(#screen-deseos.is-active),
  body.sin-scroll:has(#screen-subastas.is-active),
  body:has(#screen-deseos.is-active),
  body:has(#screen-subastas.is-active){overflow-y:auto !important;position:static !important;inset:auto !important}

  #screen-deseos.is-active,#screen-subastas.is-active{
    height:auto !important;min-height:100dvh !important;display:block !important}

  #screen-deseos .stats-pantalla,#screen-subastas .stats-pantalla{
    position:static !important;inset:auto !important;height:auto !important;max-height:none !important;
    overflow:visible !important;display:block !important;padding:18px 20px calc(var(--nav-alto,64px) + 24px) !important}

  #screen-deseos .stats-pantalla{max-width:720px;margin:0 auto}
  #screen-subastas .stats-pantalla{max-width:720px;margin:0 auto}

  /* listas verticales */
  #screen-deseos .suenos-lista,#screen-subastas .subastas-grid{
    display:flex !important;flex-direction:column !important;gap:16px !important;
    overflow:visible !important;height:auto !important;flex:none !important;min-height:0 !important;
    scroll-snap-type:none !important;padding:0 !important;margin:0 !important}

  #screen-deseos .suenos-lista > *,#screen-subastas .subastas-grid > *,
  #screen-deseos .sueno,#screen-subastas .sueno,#screen-subastas .lote,#screen-subastas .subasta-card{
    flex:0 0 auto !important;width:100% !important;max-width:none !important;
    opacity:1 !important;transform:none !important;scroll-snap-align:none !important}

  /* las tarjetas recuperan alto natural y no se estiran por el viewport */
  #screen-subastas .subasta-card,#screen-subastas .sueno,#screen-deseos .sueno{
    height:auto !important;max-height:none !important;overflow:visible !important}

  #screen-deseos .sueno__cita{flex:0 0 auto !important;min-height:0 !important}
  #screen-deseos .sueno__btn{margin-top:18px !important}

  #screen-subastas .subasta-foto{flex:none !important;height:220px !important;min-height:0 !important}
  #screen-subastas .subasta-card__body{flex:none !important;min-height:0 !important;overflow:visible !important}


  /* paginadores no tienen sentido en vertical */
  #screen-subastas .subastas-nav,#screen-deseos .subastas-nav{display:none !important}

  /* el buscador no se queda pegado al borde */
  #screen-deseos .buscador-wrap{position:static !important;margin:0 0 16px !important}
}

