@charset "utf-8";
/* POST */
.post
{
	position: relative;
	display: -webkit-flex;
	-webkit-flex-direction: column;
	display: flex;
	flex-direction: column;
}

.p-user
{
	position: relative;
	display: flex;
	padding: 15px;
}

.p-imga
{
	float: left;
	width: 40px; height: 40px;
	margin-right: 15px;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background-repeat: no-repeat;
	background-size: 100% 100%;
	background-image:url(../icos/user.jpg);
	cursor: pointer;
}

.p-user-table
{
	position: relative;
	height: 40px;
	display: table;
}

.p-user-middle
{
	display: table-cell;
	vertical-align: middle;
	line-height: 18px;
}

.p-options
{
	position: absolute;
	top: 15px; right: 0px;
	float: right;
	width: 50px; height: 40px;
	background-repeat: no-repeat;
	background-position: center center;
	background-image:url(../icos/more.svg);
	background-size: 50% 50%;
	cursor: pointer;
}

.p-text
{
	position: absolute;
	left: 0px; right: 0px;
	bottom: 0px;
	padding: 15px;
    color: #FFFFFF;
	display: none;
	z-index: 1;
}

.p-text span
{
	color: #FFFFFF;
}

.p-line-clamp {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;  
	overflow: hidden;
}

.p-inte
{
	position: relative;
	display: flex;
	padding: 10px;
}

.p-button
{
	position: relative;
	margin: auto;
	text-align: center;
	z-index: 0;
}

.p-button .pb
{
	position: relative;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100% auto;
	display: inline-block;
	float: left;
	cursor: pointer;
}

.p-button .li
{
	width: 40px; height: 40px;
	margin: -4px; 
}

.p-button .in
{
	width: 30px; height: 30px;
	margin: 2.5px;
}

.p-button .pl
{
	position: relative;
	width: 25px;
	height: 25px;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	display: inline-block;
	margin: -1px 0px -1px -10px;
	border: 4px solid #FFFFFF;
	background-repeat: no-repeat;
	background-size: 100% 100%;
	background-image:url(../icos/user.jpg);
	cursor: pointer;
	float: left;
}

.p-button .pc
{
	position: relative;
	height: 25px;
	border: 4px solid #FFFFFF;
	background-color: #4fa6f8;
	display: flex;
	align-items: center;
	color: #FFFFFF;
	float: left;
}

.p-button .pc::after {
	position: absolute;
	top: 0px; left: -12.5px;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	width: 25px;
	height: 25px;
	content: " ";
	background-color: #4fa6f8;
	z-index: -1;
}

.p-button .pc::before {
	position: absolute;
	top: 0px; right: -12.5px;
	-moz-border-radius: 50%  50%;
	-webkit-border-radius: 50%  50%;
	border-radius: 50%  50%;
	width: 25px;
	height: 25px;
	content: " ";
	background-color: #4fa6f8;
	z-index: -1;
}

/* COMENTARY */
.y-more
{
	position: relative;
	margin-left: 20px;
	margin-top: 5px;
	margin-bottom: 15px;
	padding-left: 50px;
}

.y-more::after
{
	top: 7px;
	left: 0px;
	content: " ";
	height: 1px;
	width: 40px;
	position: absolute;
	background-color: #D0D0D0;
}

.commentary
{
	position: relative;
	padding: 0px 15px;
	margin-top: 5px;
}

.y-user
{
	position: relative;
	padding-left: 45px;
}

.y-imga
{
	position: absolute;
	left: 0px; top: 2px;
	width: 30px; height: 30px;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background-repeat: no-repeat;
	background-size: 100% 100%;
	background-image:url(../icos/user.jpg);
}

.y-cont
{
	position: relative;
	padding: 10px;
	float: left;
	background-color: #f0f2f5;
	color: #000;
	-moz-border-radius: 22px ;
	-webkit-border-radius: 22px ;
	border-radius: 22px ;
	margin-bottom: 20px;
	max-width: 80%;
	text-overflow: ellipsis;
	white-space: nowrap; 
	overflow: hidden;
}

/* COMMENTS */
.cs-reply
{
	position: relative;
	padding: 15px 25px;
	margin: 0 -70px;
}

.cs-reply .cs-remove
{
	position: absolute;
	top: 18px; right: 30px;
}

.cs-bottom
{
	position: fixed;
	left: 0px; right: 0px;
	bottom: 0px;
	padding: 0px 70px;
	z-index: 1;
}

.cs-imge
{
	position: absolute;
	left: 20px; bottom: 6.5px;
	width: 35px; height: 35px;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background-repeat: no-repeat;
	background-size: 100% 100%;
	background-image:url(../icos/user.jpg);
	cursor: pointer;
}

.cs-box
{
	width: 100%;
	max-height: 100px;
	resize: none;
	border: 0px;
	outline: 0px;
	overflow: auto;
	padding: 15px 0px;
}

.cs-box[placeholder]:empty:before {
	font-style: italic;
    content: attr(placeholder);
    color: #949494;
}

.cs-send
{
	position: absolute;
	bottom: 10px; right: 20px;
	text-align: center;
	width: 28px; height: 28px;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100% auto;
	background-image:url("../icos/comment.svg");
}

.comment
{
	position: relative;
	margin-left: 15px;
}

.c-user
{
	position: relative;
	margin-top: 20px;
	padding-left: 45px;
}

.c-imga
{
	position: absolute;
	left: 0px; top: 2px;
	width: 30px; height: 30px;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background-repeat: no-repeat;
	background-size: 100% 100%;
	background-image:url(../icos/user.jpg);
	cursor: pointer;
}

.c-cont
{
	position: relative;
	padding: 10px;
	-moz-border-radius: 22px ;
	-webkit-border-radius: 22px ;
	border-radius: 22px;
	max-width: 70%;
	background-color: #f0f2f5;
	word-wrap: break-word;
	display:inline-block;
}

.ats .wg
{
	color: #336699;
}

.c-like
{
	position: absolute;
	top: 7px; right: 20px;
	height: 20px; width: 20px;
}

.c-like a
{
	position: absolute;
	top: 0px; right: 0px;
	width: 20px; height: 20px;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100% auto;
	cursor: pointer;
}

.c-like span
{
	position: absolute;
	bottom: -20px; right: -20px;
	width: 60px;
	text-align: center
}

.c-inte
{
	margin: 8px 0px 0px 10px;
}

.c-inte a
{
	margin-left: 20px;
	display: inline-block;
	width: auto;
	text-align: left;
	cursor: pointer;
}

.c-inte .op
{
	width: 18px; height: 18px;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100% 100%;
	background-image:url(../icos/morc.svg);
	margin-bottom: -5px;
	cursor: pointer;
}

.c-more
{
	position: relative;
	margin-left: 20px;
	padding-left: 50px;
	margin-top: 15px;
	cursor: pointer;
}

.c-more::after
{
	top: 7px;
	left: 0px;
	content: " ";
	height: 1px;
	width: 40px;
	position: absolute;
	background-color: #D0D0D0;
}
/* BRINTAGE 2026 - posts/cards */
.post{background:rgba(255,255,255,.94);border:1px solid #e5edf6;border-radius:18px;box-shadow:0 14px 35px rgba(15,23,42,.07);overflow:hidden;margin-bottom:18px;}
.p-user{padding:13px 15px!important;background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(255,255,255,.88));}
.p-imga{box-shadow:0 6px 16px rgba(15,23,42,.12);}
.p-options{opacity:.66;right:4px!important;}
.p-inte{background:#fff;padding:12px 10px!important;border-top:1px solid #f0f4f8;}
.p-button .pc,.p-button .pc:before,.p-button .pc:after{background:#2f7df6!important;}
.p-text{background:linear-gradient(180deg,rgba(15,23,42,0),rgba(15,23,42,.62));}
.y-more,.more{color:#2f7df6!important;}

/* =========================================================
   BRINTAGE 2026 - retoques finales solicitados
   Botones, modales, formularios, busquedas y crear publicacion.
   ========================================================= */
:root{--bt-blue:#2f7df6;--bt-blue2:#3e91ff;--bt-ink:#172033;--bt-muted:#7a8494;--bt-line:#d9e2ef;--bt-soft:#f6f8fb;}

/* Botones consistentes: menos redondeados y sin sombra flotante */
.myButton1,
.se-bottom a,
#ads .myButton1,
.rand-pos .myButton1,
.zi-pos .myButton1,
.n-reques .myButton1,
.cp-bottom .myButton1,
#profile .myButton1,
#user .myButton1,
#usposts .myButton1,
.bf,
a[class*="bf-"]{
    border-radius:10px!important;
    min-height:36px!important;
    line-height:36px!important;
    padding:0 18px!important;
    box-sizing:border-box!important;
    background:linear-gradient(135deg,var(--bt-blue),var(--bt-blue2))!important;
    color:#fff!important;
    box-shadow:0 3px 8px rgba(47,125,246,.14)!important;
    font-weight:600!important;
    text-decoration:none!important;
    transform:none!important;
    transition:background .15s ease,box-shadow .15s ease,border-color .15s ease!important;
}
.myButton1:hover,
.se-bottom a:hover,
.cp-bottom .myButton1:hover,
a[class*="bf-"]:hover{
    transform:none!important;
    box-shadow:0 4px 10px rgba(47,125,246,.18)!important;
}
.myButton0,
.se-bottom .can,
.se-bottom a.can,
.se-bottom a:first-child:not(.myButton1),
#profile .myButton0,
#user .myButton0,
#usposts .myButton0{
    border-radius:10px!important;
    min-height:36px!important;
    line-height:36px!important;
    padding:0 18px!important;
    box-sizing:border-box!important;
    background:#f3f5f8!important;
    color:#415068!important;
    border:1px solid #dfe6ef!important;
    box-shadow:none!important;
    font-weight:600!important;
    text-decoration:none!important;
}
.se-bottom{gap:8px!important;}
.se-bottom a{margin:0 4px!important;}

/* Perfil: Seguir y Mensajes con la misma altura y el mismo radio */
.ag .myButton1,.af .myButton1,.fr,a.fo,.bt{
    border-radius:10px!important;
}
a.bt:not(.del):not(.ace), .p-menu a.bt{
    box-shadow:none!important;
}

/* Modales opacos, no transparentes */
#mod .cont,
#box .cont,
.mod .cont,
.alert{
    background:#ffffff!important;
    opacity:1!important;
    border:1px solid rgba(226,232,240,.98)!important;
    box-shadow:0 18px 45px rgba(15,23,42,.14)!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
}
#mod .bo,#box .bo,.opacity{
    background:rgba(15,23,42,.42)!important;
}
.p-menu a{background:#fff!important;}

/* Textos informativos/settings: sin efecto hover cuando no corresponde */
.sb-box,.pr-box{transform:none!important;transition:none!important;}
.sb-box:hover,.pr-box:hover{
    background:rgba(255,255,255,.72)!important;
    border-color:transparent!important;
    transform:none!important;
    cursor:default!important;
}
.sb-box .spA,.sb-box .spB,.pr-box .spA,.pr-box .spB{cursor:default!important;}

/* Formularios: etiquetas con mas aire */
.se-index{margin:8% 5% 0 5%!important;}
.se-index .ta{padding-left:1px!important;margin-bottom:8px!important;color:#7a8494!important;}
.se-input,.se-text{margin-top:6px!important;}

/* Buscadores: ocupar todo el ancho disponible */
.s-text,
#s-key,
.sh-input,
#l-key.bs{
    width:100%!important;
    box-sizing:border-box!important;
    border:1px solid #d9e2ef!important;
    border-radius:10px!important;
    background:#fff!important;
    color:#172033!important;
    padding:12px 14px!important;
    box-shadow:none!important;
}
.fixed-stx{left:42%!important;right:15px!important;}
.mobile-stx{left:15px!important;right:15px!important;}

/* Estado vacio para compartir/enviar por mensaje */
.sh-empty{
    position:relative!important;
    min-height:165px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    background:none!important;
    color:#7a8494!important;
    text-align:center!important;
    font-size:14px!important;
}
.sh-empty:before{
    content:"";
    width:44px;
    height:44px;
    margin-bottom:12px;
    background:url(../icos/cloud.svg) center/contain no-repeat;
    opacity:.42;
}
.sh-empty:after{content:"No se han encontrado resultados";}

/* Crear publicacion */
#createpost{background:#fff!important;}
#createpost.pg,#createpost .pg{background:#fff!important;}
.cp-bottom{
    background:#fff!important;
    border-top:1px solid #edf2f7!important;
    box-shadow:0 -8px 24px rgba(15,23,42,.04)!important;
}
.cp-bottom a{
    border-radius:10px!important;
    min-height:38px!important;
    line-height:38px!important;
    padding:0 18px!important;
    box-shadow:0 3px 8px rgba(47,125,246,.14)!important;
}
.cp-mode-loading{
    position:absolute;
    left:50%;top:50%;
    width:24px;height:24px;
    margin:-12px 0 0 -12px;
    border-radius:50%;
    background:radial-gradient(farthest-side,#949494 94%,#0000) top/3px 3px no-repeat,conic-gradient(#0000 30%,#949494);
    -webkit-mask:radial-gradient(farthest-side,#0000 calc(100% - 2px),#000 0);
    animation:s3 .55s infinite linear;
    opacity:.72;
    z-index:8;
}
.cp-desings.is-loading:after{
    content:"";
    position:absolute;left:50%;top:50%;
    width:24px;height:24px;margin:-12px 0 0 -12px;
    border-radius:50%;
    background:radial-gradient(farthest-side,#949494 94%,#0000) top/3px 3px no-repeat,conic-gradient(#0000 30%,#949494);
    -webkit-mask:radial-gradient(farthest-side,#0000 calc(100% - 2px),#000 0);
    animation:s3 .55s infinite linear;
    opacity:.72;
    z-index:8;
}

/* BRINTAGE AJUSTES FINOS 2026-07-05 */
:root{--bt-radius:9px;--bt-blue:#2f7df6;--bt-blue2:#3f8fff;--bt-ink:#172033;--bt-muted:#7a8494;--bt-line:#e2e8f0;}

/* Botones generales: menos redondeo, menos sombra, más finos */
.myButton1,
a[class*="bf-"],
.ca-int .myButton1,
.cp-bottom a,
.se-bottom a,
.du-bottom a,
.fr,a.fo,.ag .myButton1,.af .myButton1{
    border-radius:var(--bt-radius)!important;
    min-height:38px!important;
    height:auto!important;
    line-height:38px!important;
    padding:0 16px!important;
    box-sizing:border-box!important;
    background:linear-gradient(135deg,var(--bt-blue),var(--bt-blue2))!important;
    color:#fff!important;
    box-shadow:0 2px 5px rgba(47,125,246,.12)!important;
    font-weight:600!important;
    text-decoration:none!important;
    transform:none!important;
}
.myButton1:hover,
a[class*="bf-"]:hover,
.ca-int .myButton1:hover,
.cp-bottom a:hover,
.se-bottom a:hover{
    box-shadow:0 3px 7px rgba(47,125,246,.16)!important;
    transform:none!important;
}
.myButton0,
.se-bottom a:first-child:not(.myButton1),
.se-bottom .can,
.ca-int .myButton0,
.ca-int .msg,
.ca-int a:not(.myButton1):not([class*="bf-"]),
.du-bottom a:first-child:not(.myButton1){
    border-radius:var(--bt-radius)!important;
    min-height:38px!important;
    line-height:38px!important;
    padding:0 16px!important;
    box-sizing:border-box!important;
    background:#f4f6f9!important;
    color:#415068!important;
    border:1px solid #dfe6ef!important;
    box-shadow:none!important;
    font-weight:600!important;
    text-decoration:none!important;
}
.se-bottom{display:flex!important;gap:8px!important;align-items:center!important;}
.se-bottom a{margin:0!important;flex:1!important;}

/* Formularios: etiquetas más separadas y mejor alineadas */
.se-index .ta,
.se-index label,
label.ta{
    display:block!important;
    padding-left:2px!important;
    margin-bottom:9px!important;
    color:#7a8494!important;
    line-height:1.35!important;
}
.se-input,.se-text,.editbox,textarea.editbox{margin-top:5px!important;}
.se-index{margin-top:28px!important;}

/* Textos informativos sin hover; opciones reales de seguridad/configuración con hover */
.sb-box,.pr-box{transition:background .15s ease,border-color .15s ease!important;}
.sb-box:not([onclick]):hover,.pr-box:not([onclick]):hover{
    background:transparent!important;
    border-color:transparent!important;
    cursor:default!important;
}
.sb-box[onclick],.pr-box[onclick],.se-option[onclick],.t-user[onclick]{cursor:pointer!important;}
.sb-box[onclick]:hover,.pr-box[onclick]:hover,.se-option[onclick]:hover,.t-user[onclick]:hover{
    background:#f5f8fc!important;
    border-color:#e7eef7!important;
}

/* Buscadores */
.s-text,#s-key,#l-key.bs{
    width:100%!important;
    box-sizing:border-box!important;
    border:1px solid #d9e2ef!important;
    border-radius:9px!important;
    background:#fff!important;
    color:#172033!important;
    padding:11px 14px!important;
    box-shadow:none!important;
}

/* Modal enviar por mensaje: opaco, cierre visible y buscador integrado */
#mod .cont,#box .cont,.mod .cont{
    background:#fff!important;
    opacity:1!important;
    border:1px solid rgba(226,232,240,.98)!important;
    box-shadow:0 18px 45px rgba(15,23,42,.16)!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
}
#mod .close,#box .close,.mod .close,#mod .cont .close,#box .cont .close{
    background-color:#d8dee7!important;
    opacity:1!important;
    filter:none!important;
    box-shadow:none!important;
}
#mod .close:hover,#box .close:hover,.mod .close:hover{background-color:#c8d0db!important;}
.sh-input{
    display:block!important;
    width:100%!important;
    box-sizing:border-box!important;
    border:0!important;
    border-top:1px solid #e7edf5!important;
    border-bottom:1px solid #e7edf5!important;
    border-radius:0!important;
    background:#fff!important;
    padding:13px 15px!important;
    outline:0!important;
    box-shadow:none!important;
}
#box .cont .sh-input,#mod .cont .sh-input{margin:0!important;}
.sh-middle{background:#fff!important;}
.sh-bottom{border-top:1px solid #edf2f7!important;background:#fff!important;}
.sh-empty{
    position:relative!important;
    min-height:165px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    background:none!important;
    color:#7a8494!important;
    text-align:center!important;
    font-size:14px!important;
}
.sh-empty:before{content:"";width:46px;height:46px;margin-bottom:12px;background:url(../icos/cloud.svg) center/contain no-repeat;opacity:.42;}
.sh-empty:after{content:"No se han encontrado resultados";}

/* Crear publicación */
#createpost{background:#fff!important;}
#createpost.pg,#createpost .pg,.cp-middle{background:#fff!important;}
.cp-bottom{background:#fff!important;border-top:1px solid #edf2f7!important;box-shadow:0 -6px 18px rgba(15,23,42,.035)!important;}
.cp-bottom a{border-radius:9px!important;min-height:38px!important;line-height:38px!important;box-shadow:0 2px 5px rgba(47,125,246,.12)!important;}
.cp-spinner{display:block!important;margin:7px auto 0 auto!important;width:22px!important;height:22px!important;background:radial-gradient(farthest-side,#fff 94%,#0000) top/3px 3px no-repeat,conic-gradient(#0000 30%,#fff)!important;-webkit-mask:radial-gradient(farthest-side,#0000 calc(100% - 2px),#000 0)!important;}

/* Spinner gris para Modelos/Filtros */
.pos-m-b a{position:relative!important;}
.pos-m-b a.is-loading-icon{background-image:none!important;}
.pos-m-b a.is-loading-icon:after{
    content:"";
    position:absolute;
    left:50%;top:50%;
    width:22px;height:22px;
    margin:-11px 0 0 -11px;
    border-radius:50%;
    background:radial-gradient(farthest-side,#8b95a3 94%,#0000) top/3px 3px no-repeat,conic-gradient(#0000 30%,#8b95a3);
    -webkit-mask:radial-gradient(farthest-side,#0000 calc(100% - 2px),#000 0);
    animation:s3 .55s infinite linear;
    opacity:.8;
}
.cp-desings.is-loading:after{display:none!important;}

/* Mensajes: header + búsqueda con aire */
.chat-top{background:#fff!important;box-shadow:0 8px 24px rgba(15,23,42,.045)!important;}
.chat-top .fixed-aling{padding-top:14px!important;padding-bottom:54px!important;}
.chat-top .mobile-aling{padding-bottom:54px!important;}
.fixed-stx{left:42%!important;right:18px!important;bottom:10px!important;top:auto!important;}
.mobile-stx{left:15px!important;right:15px!important;bottom:10px!important;top:auto!important;}
.fixed-stx .s-text,.mobile-stx .s-text,.s-text{height:42px!important;line-height:20px!important;}

/* Modal de opciones de publicación: blanco sólido */
.p-menu,.p-menu a{background:#fff!important;opacity:1!important;}



/* BRINTAGE FIX FINAL - barras, botones siguiendo y header chat */
@media (min-width: 769px){
    /* Las barras vuelven a tomar el ancho del contenedor central (.ce169). */
    .bar-top.ce169,
    .bar-bottom.ce169{
        left:0!important;
        right:0!important;
        width:auto!important;
        margin-left:20%!important;
        margin-right:20%!important;
        background:#fff!important;
        border:1px solid #e5edf6!important;
        box-shadow:0 8px 24px rgba(15,23,42,.055)!important;
        overflow:hidden!important;
    }
    .bar-top.ce169{
        top:0!important;
        border-radius:0 0 12px 12px!important;
        border-top:0!important;
    }
    .bar-bottom.ce169{
        bottom:0!important;
        border-radius:12px 12px 0 0!important;
        border-bottom:0!important;
    }
}

/* Estado Siguiendo: gris/secundario, no azul */
[class*="bf-"].myButton0,
a[class*="bf-"].myButton0,
.myButton0[class*="bf-"]{
    background:#f3f5f8!important;
    background-image:none!important;
    color:#415068!important;
    border:1px solid #dfe6ef!important;
    box-shadow:none!important;
    border-radius:9px!important;
    font-weight:600!important;
}
[class*="bf-"].myButton0:hover,
a[class*="bf-"].myButton0:hover{
    background:#eef2f6!important;
    color:#344054!important;
    box-shadow:none!important;
}

/* Header real del chat: compacto, alineado y con logo Brintage */
.chat-top.fixed-wto{
    height:58px!important;
    background:#fff!important;
    border:1px solid #e5edf6!important;
    border-top:0!important;
    border-radius:0 0 12px 12px!important;
    box-shadow:0 8px 24px rgba(15,23,42,.055)!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
}
.chat-top .chat-brand{
    position:absolute!important;
    left:30px!important;
    top:50%!important;
    transform:translateY(-50%)!important;
    font-family:'Lucida Handwriting'!important;
    font-size:22px!important;
    line-height:1!important;
    color:#2f7df6!important;
    text-shadow:0 6px 18px rgba(47,125,246,.12)!important;
    cursor:pointer!important;
    z-index:2!important;
}
.chat-top .fixed-aling{
    height:58px!important;
    min-height:58px!important;
    margin:0!important;
    padding:0 14px 0 170px!important;
    display:flex!important;
    align-items:center!important;
    box-sizing:border-box!important;
}
.chat-top .mobile-aling{
    min-height:54px!important;
    padding:0 10px!important;
    display:flex!important;
    align-items:center!important;
    box-sizing:border-box!important;
}
.chat-top .w-arrow,
.chat-top .w-options{
    width:42px!important;
    height:42px!important;
    flex:0 0 42px!important;
    background-size:46% 46%!important;
}
.chat-top .chat-user{
    flex:1 1 auto!important;
    min-width:0!important;
    display:flex!important;
    align-items:center!important;
}
.chat-top .w-user-imge{
    width:38px!important;
    height:38px!important;
    margin-right:12px!important;
    flex:0 0 38px!important;
}
.chat-top .w-user-table{
    height:38px!important;
    display:table!important;
}
.chat-top .w-user-middle{
    vertical-align:middle!important;
    line-height:17px!important;
}
@media (max-width:768px){
    .chat-top .chat-brand{display:none!important;}
}

/* BRINTAGE AJUSTE FINAL - headers, buscadores, chat y compartir */
@media (min-width: 769px){
    /* Barras: mismo ancho que el layout principal, pegadas al borde y solo esquinas externas */
    .bar-top.ce169,
    .bar-bottom.ce169{
        left:3%!important;
        right:3%!important;
        width:auto!important;
        margin-left:0!important;
        margin-right:0!important;
        background:#fff!important;
        border:1px solid #e5edf6!important;
        box-shadow:0 8px 24px rgba(15,23,42,.055)!important;
        overflow:hidden!important;
    }
    .bar-top.ce169{
        top:0!important;
        border-top:0!important;
        border-radius:0 0 10px 10px!important;
    }
    .bar-bottom.ce169{
        bottom:0!important;
        border-bottom:0!important;
        border-radius:10px 10px 0 0!important;
    }

    /* Mensajes y búsqueda: buscador contenido, con margen derecho/izquierdo y aire con el título */
    #messages .bar-top,
    #chat .bar-top{
        height:104px!important;
    }
    #messages .fixed-ptt,
    #chat .fixed-ptt{
        left:42%!important;
        right:18px!important;
        bottom:66px!important;
        line-height:22px!important;
    }
    #messages .fixed-psi,
    #chat .fixed-psi{
        left:42%!important;
        top:20px!important;
    }
    #messages .fixed-stx,
    #chat .fixed-stx,
    .bar-top .fixed-stx{
        left:42%!important;
        right:18px!important;
        bottom:10px!important;
        top:auto!important;
        width:auto!important;
        box-sizing:border-box!important;
    }
    #messages .fixed-stx.s-text,
    #chat .fixed-stx.s-text,
    .bar-top .fixed-stx.s-text,
    #s-key.fixed-stx{
        width:auto!important;
        height:42px!important;
        line-height:20px!important;
        box-sizing:border-box!important;
    }

    /* Header del chat abierto: conserva Brintage a la izquierda y alinea el usuario con la columna central */
    .chat-top.fixed-wto{
        left:3%!important;
        right:3%!important;
        width:auto!important;
        height:64px!important;
        margin:0!important;
        background:#fff!important;
        border:1px solid #e5edf6!important;
        border-top:0!important;
        border-radius:0 0 10px 10px!important;
        box-shadow:0 8px 24px rgba(15,23,42,.055)!important;
        overflow:hidden!important;
        box-sizing:border-box!important;
    }
    .chat-top .chat-brand{
        display:block!important;
        position:absolute!important;
        left:30px!important;
        top:50%!important;
        transform:translateY(-50%)!important;
        font-family:'Lucida Handwriting'!important;
        font-size:22px!important;
        line-height:1!important;
        color:#2f7df6!important;
        text-shadow:0 6px 18px rgba(47,125,246,.12)!important;
        cursor:pointer!important;
        z-index:2!important;
    }
    .chat-top .fixed-aling{
        height:64px!important;
        min-height:64px!important;
        margin:0!important;
        padding:0 14px 0 42%!important;
        display:flex!important;
        align-items:center!important;
        box-sizing:border-box!important;
    }
    .chat-top .w-arrow,
    .chat-top .w-options{
        width:42px!important;
        height:42px!important;
        flex:0 0 42px!important;
        background-size:46% 46%!important;
        background-position:center!important;
        background-repeat:no-repeat!important;
    }
    .chat-top .chat-user{
        flex:1 1 auto!important;
        min-width:0!important;
        display:flex!important;
        align-items:center!important;
        height:42px!important;
    }
    .chat-top .w-user-imge{
        width:38px!important;
        height:38px!important;
        margin-right:12px!important;
        flex:0 0 38px!important;
    }
    .chat-top .w-user-table{height:38px!important;display:table!important;}
    .chat-top .w-user-middle{vertical-align:middle!important;line-height:17px!important;}
}

/* Modal compartir: quitar doble línea del buscador para que quede más limpio */
#mod .cont .sh-input,
#box .cont .sh-input,
.sh-input{
    border-top:0!important;
    border-bottom:1px solid #edf2f7!important;
    border-left:0!important;
    border-right:0!important;
    border-radius:0!important;
    box-shadow:none!important;
}
#mod .cont .p-title,
#box .cont .p-title{
    border-bottom:1px solid #edf2f7!important;
}


/* BRINTAGE FIX: barras desktop al ancho del contenido central */
@media (min-width: 769px){
    .bar-top.ce169,
    .bar-bottom.ce169{
        left:20%!important;
        right:20%!important;
        width:auto!important;
        margin-left:0!important;
        margin-right:0!important;
        background:#fff!important;
        border:1px solid #e5edf6!important;
        box-shadow:0 8px 24px rgba(15,23,42,.055)!important;
        overflow:hidden!important;
        box-sizing:border-box!important;
    }
    .bar-top.ce169{
        top:0!important;
        border-top:0!important;
        border-radius:0 0 10px 10px!important;
    }
    .bar-bottom.ce169{
        bottom:0!important;
        border-bottom:0!important;
        border-radius:10px 10px 0 0!important;
    }
}

/* BRINTAGE FIX URGENTE: header del chat con el mismo ancho del contenido central */
@media (min-width: 769px){
    #window .chat-top.fixed-wto,
    .chat-top.fixed-wto{
        left:20%!important;
        right:20%!important;
        width:auto!important;
        margin:0!important;
        height:64px!important;
        border-radius:0 0 10px 10px!important;
        border-left:1px solid #e5edf6!important;
        border-right:1px solid #e5edf6!important;
        border-bottom:1px solid #e5edf6!important;
        border-top:0!important;
        box-sizing:border-box!important;
        overflow:hidden!important;
        background:#fff!important;
    }
    #window .chat-top .chat-brand,
    .chat-top .chat-brand{
        display:block!important;
        left:30px!important;
        top:50%!important;
        transform:translateY(-50%)!important;
    }
    #window .chat-top .fixed-aling,
    .chat-top .fixed-aling{
        height:64px!important;
        min-height:64px!important;
        padding:0 14px 0 42%!important;
        margin:0!important;
        display:flex!important;
        align-items:center!important;
        box-sizing:border-box!important;
    }
    #window .chat-top .w-options,
    .chat-top .w-options{
        margin-left:auto!important;
    }
}


/* BRINTAGE FIX REAL - header mensajes con aire y ancho correcto */
@media (min-width: 769px){
    .bar-top.ce169.messages-top{
        left:18%!important;
        right:18%!important;
        width:auto!important;
        height:110px!important;
        margin-left:0!important;
        margin-right:0!important;
        box-sizing:border-box!important;
        overflow:hidden!important;
        background:#fff!important;
        border:1px solid #e5edf6!important;
        border-top:0!important;
        border-radius:0 0 10px 10px!important;
        box-shadow:0 8px 24px rgba(15,23,42,.055)!important;
    }
    .bar-top.ce169.messages-top .fixed-psi{
        left:42%!important;
        top:16px!important;
        width:26px!important;
        height:26px!important;
    }
    .bar-top.ce169.messages-top .fixed-ptt{
        left:42%!important;
        right:28px!important;
        top:16px!important;
        bottom:auto!important;
        height:24px!important;
        line-height:24px!important;
        text-align:center!important;
        box-sizing:border-box!important;
    }
    .bar-top.ce169.messages-top .fixed-stx,
    .bar-top.ce169.messages-top #s-key.fixed-stx{
        left:42%!important;
        right:28px!important;
        top:58px!important;
        bottom:auto!important;
        width:auto!important;
        height:42px!important;
        line-height:20px!important;
        box-sizing:border-box!important;
        margin:0!important;
    }
    .bar-top.ce169.messages-top + #key,
    #key:has(#messages){
        top:111px!important;
    }

    /* Barra simple de busqueda: mismo margen derecho e izquierdo */
    .bar-top.ce169.search-top{
        left:18%!important;
        right:18%!important;
        width:auto!important;
        height:58px!important;
        box-sizing:border-box!important;
    }
    .bar-top.ce169.search-top .fixed-stx,
    .bar-top.ce169.search-top #s-key.fixed-stx{
        left:28px!important;
        right:28px!important;
        top:9px!important;
        bottom:auto!important;
        width:auto!important;
        height:40px!important;
        box-sizing:border-box!important;
        margin:0!important;
    }
}

/* BRINTAGE FINAL AJUSTE: headers proporcionados (desktop + mobile) */
@media (min-width: 769px){
    /* Mantiene las barras con el ancho del contenido central, no pantalla completa */
    .bar-top.ce169,
    .bar-bottom.ce169{
        left:3%!important;
        right:3%!important;
        width:auto!important;
        margin:0!important;
        box-sizing:border-box!important;
        background:#fff!important;
        border:1px solid #e5edf6!important;
        box-shadow:0 8px 24px rgba(15,23,42,.055)!important;
        overflow:hidden!important;
    }
    .bar-top.ce169{top:0!important;border-top:0!important;border-radius:0 0 10px 10px!important;}
    .bar-bottom.ce169{bottom:0!important;border-bottom:0!important;border-radius:10px 10px 0 0!important;}

    /* Mensajes: header más alto para que título y búsqueda respiren */
    .bar-top.ce169.messages-top{
        height:124px!important;
        left:3%!important;
        right:3%!important;
        border-radius:0 0 10px 10px!important;
    }
    .bar-top.ce169.messages-top .banner{
        display:block!important;
        left:30px!important;
        top:16px!important;
        z-index:2!important;
    }
    .bar-top.ce169.messages-top .fixed-psi{
        left:42%!important;
        top:18px!important;
        width:26px!important;
        height:26px!important;
    }
    .bar-top.ce169.messages-top .fixed-ptt{
        left:42%!important;
        right:30px!important;
        top:17px!important;
        bottom:auto!important;
        height:28px!important;
        line-height:28px!important;
        text-align:center!important;
        box-sizing:border-box!important;
    }
    .bar-top.ce169.messages-top .fixed-stx,
    .bar-top.ce169.messages-top #s-key.fixed-stx{
        left:42%!important;
        right:30px!important;
        top:66px!important;
        bottom:auto!important;
        width:auto!important;
        height:42px!important;
        line-height:20px!important;
        margin:0!important;
        box-sizing:border-box!important;
    }

    /* Buscar/Explorar: logo a la izquierda y búsqueda alineada a la columna central */
    .bar-top.ce169.search-top{
        height:72px!important;
        left:3%!important;
        right:3%!important;
        border-radius:0 0 10px 10px!important;
    }
    .bar-top.ce169.search-top .banner{
        display:block!important;
        left:30px!important;
        top:20px!important;
        z-index:2!important;
    }
    .bar-top.ce169.search-top .fixed-stx,
    .bar-top.ce169.search-top #s-key.fixed-stx{
        left:42%!important;
        right:30px!important;
        top:15px!important;
        bottom:auto!important;
        width:auto!important;
        height:42px!important;
        line-height:20px!important;
        margin:0!important;
        box-sizing:border-box!important;
    }

    /* El contenido central acompaña la altura real de las barras */
    #key:has(#messages){top:125px!important;}
    body:has(.bar-top.search-top) #key{top:73px!important;}
}

@media (max-width: 768px){
    .bar-top.messages-top{
        height:118px!important;
        box-sizing:border-box!important;
        overflow:hidden!important;
        background:#fff!important;
    }
    .bar-top.messages-top .mobile-psi{
        left:14px!important;
        top:16px!important;
        width:26px!important;
        height:26px!important;
    }
    .bar-top.messages-top .mobile-ptt{
        left:54px!important;
        right:16px!important;
        top:15px!important;
        bottom:auto!important;
        height:28px!important;
        line-height:28px!important;
        text-align:center!important;
    }
    .bar-top.messages-top .mobile-stx,
    .bar-top.messages-top #s-key.mobile-stx{
        left:14px!important;
        right:14px!important;
        top:62px!important;
        bottom:auto!important;
        width:auto!important;
        height:40px!important;
        margin:0!important;
        box-sizing:border-box!important;
    }
    .bar-top.search-top{
        height:64px!important;
        box-sizing:border-box!important;
        overflow:hidden!important;
        background:#fff!important;
    }
    .bar-top.search-top .mobile-stx,
    .bar-top.search-top #s-key.mobile-stx{
        left:14px!important;
        right:14px!important;
        top:12px!important;
        bottom:auto!important;
        width:auto!important;
        height:40px!important;
        margin:0!important;
        box-sizing:border-box!important;
    }
    body:has(.bar-top.messages-top) #key{top:119px!important;}
    body:has(.bar-top.search-top) #key{top:65px!important;}
}

/* ==========================================================
   BRINTAGE FIX DEFINITIVO - barras y contenido proporcional
   Pedido: las barras NO ocupan toda la pantalla. Deben medir
   lo mismo que el contenido central (margen original .ce169).
   ========================================================== */
@media (min-width: 769px){
    /* Regla madre: ancho del contenido central real */
    .bar-top.ce169,
    .bar-bottom.ce169,
    #window .chat-top.fixed-wto,
    .chat-top.fixed-wto{
        position:fixed!important;
        left:20%!important;
        right:20%!important;
        width:auto!important;
        margin:0!important;
        box-sizing:border-box!important;
        background:#fff!important;
        border-color:#e5edf6!important;
        box-shadow:0 8px 24px rgba(15,23,42,.055)!important;
        overflow:hidden!important;
    }

    .bar-top.ce169,
    #window .chat-top.fixed-wto,
    .chat-top.fixed-wto{
        top:0!important;
        border-top:0!important;
        border-left:1px solid #e5edf6!important;
        border-right:1px solid #e5edf6!important;
        border-bottom:1px solid #e5edf6!important;
        border-radius:0 0 10px 10px!important;
    }

    .bar-bottom.ce169{
        bottom:0!important;
        border-bottom:0!important;
        border-left:1px solid #e5edf6!important;
        border-right:1px solid #e5edf6!important;
        border-top:1px solid #e5edf6!important;
        border-radius:10px 10px 0 0!important;
    }

    /* Header normal */
    .bar-top.ce169:not(.messages-top):not(.search-top){
        height:50px!important;
    }

    /* Mensajes: título arriba, buscador abajo con aire real */
    .bar-top.ce169.messages-top{
        height:124px!important;
        min-height:124px!important;
    }
    .bar-top.ce169.messages-top .banner{
        display:block!important;
        position:absolute!important;
        left:30px!important;
        top:18px!important;
        z-index:2!important;
    }
    .bar-top.ce169.messages-top .fixed-psi{
        left:42%!important;
        top:18px!important;
        width:28px!important;
        height:28px!important;
    }
    .bar-top.ce169.messages-top .fixed-ptt{
        left:42%!important;
        right:30px!important;
        top:17px!important;
        bottom:auto!important;
        height:30px!important;
        line-height:30px!important;
        text-align:center!important;
        box-sizing:border-box!important;
    }
    .bar-top.ce169.messages-top .fixed-stx,
    .bar-top.ce169.messages-top #s-key.fixed-stx{
        left:42%!important;
        right:30px!important;
        top:68px!important; /* separación de 15px aprox. respecto al bloque superior */
        bottom:auto!important;
        width:auto!important;
        height:42px!important;
        line-height:20px!important;
        margin:0!important;
        box-sizing:border-box!important;
    }

    /* Buscar / Explorar: logo a izquierda, buscador alineado a la columna central */
    .bar-top.ce169.search-top{
        height:72px!important;
        min-height:72px!important;
    }
    .bar-top.ce169.search-top .banner{
        display:block!important;
        position:absolute!important;
        left:30px!important;
        top:20px!important;
        z-index:2!important;
    }
    .bar-top.ce169.search-top .fixed-stx,
    .bar-top.ce169.search-top #s-key.fixed-stx{
        left:42%!important;
        right:30px!important;
        top:15px!important;
        bottom:auto!important;
        width:auto!important;
        height:42px!important;
        line-height:20px!important;
        margin:0!important;
        box-sizing:border-box!important;
    }

    /* Contenido central acompaña la altura REAL de la barra */
    #key{
        top:51px!important;
        bottom:51px!important;
    }
    body:has(.bar-top.ce169.messages-top) #key{
        top:125px!important;
        bottom:0!important;
    }
    body:has(.bar-top.ce169.search-top) #key{
        top:73px!important;
        bottom:51px!important;
    }

    /* Chat abierto: mismo ancho que las barras, logo Brintage a la izquierda,
       usuario alineado con la columna central. */
    #window .chat-top.fixed-wto,
    .chat-top.fixed-wto{
        height:64px!important;
        min-height:64px!important;
    }
    #window .chat-top .chat-brand,
    .chat-top .chat-brand{
        display:block!important;
        position:absolute!important;
        left:30px!important;
        top:50%!important;
        transform:translateY(-50%)!important;
        font-family:'Lucida Handwriting','Segoe Script',cursive!important;
        font-size:22px!important;
        line-height:1!important;
        color:#2f7df6!important;
        text-shadow:0 6px 18px rgba(47,125,246,.12)!important;
        cursor:pointer!important;
        z-index:2!important;
    }
    #window .chat-top .fixed-aling,
    .chat-top .fixed-aling{
        height:64px!important;
        min-height:64px!important;
        padding:0 14px 0 42%!important;
        margin:0!important;
        display:flex!important;
        align-items:center!important;
        box-sizing:border-box!important;
    }
    #window .chat-top .w-options,
    .chat-top .w-options{
        margin-left:auto!important;
    }
    #window{
        top:65px!important;
    }
    #window .w-bottom.fixed-wbx,
    .w-bottom.fixed-wbx{
        left:20%!important;
        right:20%!important;
        width:auto!important;
        margin:0!important;
        box-sizing:border-box!important;
    }
}

@media (max-width: 768px){
    /* En mobile no se fuerza el ancho desktop. Solo se respeta la altura
       para que el contenido no quede tapado ni con espacios raros. */
    .bar-top.messages-top{
        height:118px!important;
        min-height:118px!important;
        box-sizing:border-box!important;
        overflow:hidden!important;
        background:#fff!important;
    }
    .bar-top.messages-top .mobile-psi{
        left:14px!important;
        top:16px!important;
        width:26px!important;
        height:26px!important;
    }
    .bar-top.messages-top .mobile-ptt{
        left:54px!important;
        right:16px!important;
        top:15px!important;
        bottom:auto!important;
        height:28px!important;
        line-height:28px!important;
        text-align:center!important;
    }
    .bar-top.messages-top .mobile-stx,
    .bar-top.messages-top #s-key.mobile-stx{
        left:14px!important;
        right:14px!important;
        top:62px!important;
        bottom:auto!important;
        width:auto!important;
        height:40px!important;
        margin:0!important;
        box-sizing:border-box!important;
    }
    .bar-top.search-top{
        height:64px!important;
        min-height:64px!important;
        box-sizing:border-box!important;
        overflow:hidden!important;
        background:#fff!important;
    }
    .bar-top.search-top .mobile-stx,
    .bar-top.search-top #s-key.mobile-stx{
        left:14px!important;
        right:14px!important;
        top:12px!important;
        bottom:auto!important;
        width:auto!important;
        height:40px!important;
        margin:0!important;
        box-sizing:border-box!important;
    }
    body:has(.bar-top.messages-top) #key{top:119px!important;bottom:0!important;}
    body:has(.bar-top.search-top) #key{top:65px!important;bottom:51px!important;}
}

/* ==========================================================
   BRINTAGE 2026 - FIX REAL DE LAYOUT PROPORCIONAL
   No depende de :has(). JS agrega clases al body:
   bt-home / bt-sub / bt-messages / bt-search / bt-chat
   ========================================================== */
:root{
    --bt-desk-left:20%;
    --bt-desk-right:20%;
    --bt-bar-normal:50px;
    --bt-bar-messages:124px;
    --bt-bar-search:72px;
    --bt-chat-top:64px;
    --bt-bottom:50px;
}

#key{
    box-sizing:border-box!important;
    transition:top .12s ease,bottom .12s ease!important;
}
#key .pg{
    box-sizing:border-box!important;
}

@media (min-width:769px){
    body.bt-home #key{top:51px!important;bottom:51px!important;}
    body.bt-sub #key{top:51px!important;bottom:1px!important;}
    body.bt-messages #key{top:125px!important;bottom:0!important;}
    body.bt-search #key{top:73px!important;bottom:51px!important;}
    body.bt-chat #key{top:0!important;bottom:0!important;}

    /* Barras desktop: mismo ancho que el contenedor central, nunca full screen. */
    body:not(.bt-chat) .bar-top.ce169,
    .bar-bottom.ce169{
        position:fixed!important;
        left:var(--bt-desk-left)!important;
        right:var(--bt-desk-right)!important;
        width:auto!important;
        margin:0!important;
        box-sizing:border-box!important;
        background:#fff!important;
        border-left:1px solid #e5edf6!important;
        border-right:1px solid #e5edf6!important;
        overflow:hidden!important;
    }
    body:not(.bt-chat) .bar-top.ce169{
        top:0!important;
        height:var(--bt-bar-normal)!important;
        min-height:var(--bt-bar-normal)!important;
        border-top:0!important;
        border-bottom:1px solid #e5edf6!important;
        border-radius:0 0 10px 10px!important;
        box-shadow:0 8px 24px rgba(15,23,42,.055)!important;
        z-index:30!important;
    }
    .bar-bottom.ce169{
        bottom:0!important;
        height:var(--bt-bottom)!important;
        min-height:var(--bt-bottom)!important;
        border-top:1px solid #e5edf6!important;
        border-bottom:0!important;
        border-radius:10px 10px 0 0!important;
        box-shadow:0 -8px 24px rgba(15,23,42,.045)!important;
        z-index:30!important;
    }

    /* Mensajes: header alto, logo a izquierda, título y buscador separados. */
    body.bt-messages .bar-top.ce169.messages-top{
        height:var(--bt-bar-messages)!important;
        min-height:var(--bt-bar-messages)!important;
        overflow:hidden!important;
    }
    body.bt-messages .bar-top.ce169.messages-top .banner{
        display:block!important;
        position:absolute!important;
        left:30px!important;
        top:18px!important;
        z-index:3!important;
        color:#2f7df6!important;
    }
    body.bt-messages .bar-top.ce169.messages-top .fixed-psi{
        position:absolute!important;
        left:42%!important;
        top:18px!important;
        width:28px!important;
        height:28px!important;
        z-index:4!important;
    }
    body.bt-messages .bar-top.ce169.messages-top .fixed-ptt{
        position:absolute!important;
        left:42%!important;
        right:30px!important;
        top:17px!important;
        bottom:auto!important;
        height:30px!important;
        line-height:30px!important;
        text-align:center!important;
        box-sizing:border-box!important;
    }
    body.bt-messages .bar-top.ce169.messages-top .fixed-stx,
    body.bt-messages .bar-top.ce169.messages-top #s-key.fixed-stx{
        position:absolute!important;
        left:42%!important;
        right:30px!important;
        top:68px!important;
        bottom:auto!important;
        width:auto!important;
        height:42px!important;
        line-height:20px!important;
        margin:0!important;
        box-sizing:border-box!important;
        z-index:4!important;
    }

    /* Búsqueda: logo Brintage a izquierda y caja alineada con columna central. */
    body.bt-search .bar-top.ce169.search-top{
        height:var(--bt-bar-search)!important;
        min-height:var(--bt-bar-search)!important;
        overflow:hidden!important;
    }
    body.bt-search .bar-top.ce169.search-top .banner{
        display:block!important;
        position:absolute!important;
        left:30px!important;
        top:20px!important;
        z-index:3!important;
        color:#2f7df6!important;
    }
    body.bt-search .bar-top.ce169.search-top .fixed-stx,
    body.bt-search .bar-top.ce169.search-top #s-key.fixed-stx{
        position:absolute!important;
        left:42%!important;
        right:30px!important;
        top:15px!important;
        bottom:auto!important;
        width:auto!important;
        height:42px!important;
        line-height:20px!important;
        margin:0!important;
        box-sizing:border-box!important;
    }

    /* Chat abierto: header propio del chat, misma dimensión que el contenido. */
    body.bt-chat #bop{display:none!important;}
    body.bt-chat #bom{display:none!important;}
    body.bt-chat #window.pg.wtp{
        position:absolute!important;
        top:0!important;
        left:0!important;
        right:0!important;
        bottom:0!important;
        padding:0!important;
        overflow:hidden!important;
        box-sizing:border-box!important;
    }
    body.bt-chat #window .chat-top.fixed-wto,
    body.bt-chat .chat-top.fixed-wto{
        position:fixed!important;
        top:0!important;
        left:var(--bt-desk-left)!important;
        right:var(--bt-desk-right)!important;
        width:auto!important;
        height:var(--bt-chat-top)!important;
        min-height:var(--bt-chat-top)!important;
        margin:0!important;
        background:#fff!important;
        border-left:1px solid #e5edf6!important;
        border-right:1px solid #e5edf6!important;
        border-bottom:1px solid #e5edf6!important;
        border-top:0!important;
        border-radius:0 0 10px 10px!important;
        box-shadow:0 8px 24px rgba(15,23,42,.055)!important;
        overflow:hidden!important;
        box-sizing:border-box!important;
        z-index:50!important;
    }
    body.bt-chat #window .w-middle,
    body.bt-chat .w-middle{
        position:absolute!important;
        top:var(--bt-chat-top)!important;
        left:var(--bt-desk-left)!important;
        right:var(--bt-desk-right)!important;
        bottom:58px!important;
        height:auto!important;
        padding:15px 15px 30px 15px!important;
        overflow:auto!important;
        box-sizing:border-box!important;
    }
    body.bt-chat #window .w-bottom.fixed-wbx,
    body.bt-chat .w-bottom.fixed-wbx{
        position:fixed!important;
        left:var(--bt-desk-left)!important;
        right:var(--bt-desk-right)!important;
        bottom:0!important;
        width:auto!important;
        margin:0!important;
        box-sizing:border-box!important;
        background:#fff!important;
        border-left:1px solid #e5edf6!important;
        border-right:1px solid #e5edf6!important;
        border-top:1px solid #e5edf6!important;
        box-shadow:0 -8px 24px rgba(15,23,42,.045)!important;
        z-index:50!important;
    }
    body.bt-chat #window .chat-top .fixed-aling,
    body.bt-chat .chat-top .fixed-aling{
        height:var(--bt-chat-top)!important;
        min-height:var(--bt-chat-top)!important;
        padding:0 14px 0 42%!important;
        margin:0!important;
        display:flex!important;
        align-items:center!important;
        box-sizing:border-box!important;
    }
}

@media (max-width:768px){
    body.bt-home #key{top:51px!important;bottom:51px!important;}
    body.bt-sub #key{top:51px!important;bottom:1px!important;}
    body.bt-messages #key{top:119px!important;bottom:0!important;}
    body.bt-search #key{top:65px!important;bottom:51px!important;}
    body.bt-chat #key{top:0!important;bottom:0!important;}

    body.bt-messages .bar-top.messages-top{
        height:118px!important;
        min-height:118px!important;
        background:#fff!important;
        overflow:hidden!important;
        box-sizing:border-box!important;
    }
    body.bt-messages .bar-top.messages-top .mobile-psi{
        left:14px!important;
        top:16px!important;
        width:26px!important;
        height:26px!important;
    }
    body.bt-messages .bar-top.messages-top .mobile-ptt{
        left:54px!important;
        right:16px!important;
        top:15px!important;
        bottom:auto!important;
        height:28px!important;
        line-height:28px!important;
        text-align:center!important;
    }
    body.bt-messages .bar-top.messages-top .mobile-stx,
    body.bt-messages .bar-top.messages-top #s-key.mobile-stx{
        left:14px!important;
        right:14px!important;
        top:62px!important;
        bottom:auto!important;
        width:auto!important;
        height:40px!important;
        margin:0!important;
        box-sizing:border-box!important;
    }
    body.bt-search .bar-top.search-top{
        height:64px!important;
        min-height:64px!important;
        background:#fff!important;
        overflow:hidden!important;
        box-sizing:border-box!important;
    }
    body.bt-search .bar-top.search-top .mobile-stx,
    body.bt-search .bar-top.search-top #s-key.mobile-stx{
        left:14px!important;
        right:14px!important;
        top:12px!important;
        bottom:auto!important;
        width:auto!important;
        height:40px!important;
        margin:0!important;
        box-sizing:border-box!important;
    }
    body.bt-chat #bop{display:none!important;}
    body.bt-chat #bom{display:none!important;}
    body.bt-chat #window.pg.wtp{
        top:0!important;
        bottom:0!important;
        left:0!important;
        right:0!important;
        padding:0!important;
        overflow:hidden!important;
    }
    body.bt-chat #window .chat-top{
        height:56px!important;
        min-height:56px!important;
        z-index:50!important;
    }
    body.bt-chat #window .w-middle{
        position:absolute!important;
        top:56px!important;
        left:0!important;
        right:0!important;
        bottom:56px!important;
        height:auto!important;
        overflow:auto!important;
        box-sizing:border-box!important;
    }
    body.bt-chat #window .w-bottom{
        z-index:50!important;
        background:#fff!important;
        border-top:1px solid #e5edf6!important;
    }
}

/* ==========================================================
   BRINTAGE FIX 2026-07-05
   Chat mobile: volver a permitir scroll y recuperar margenes.
   Los mensajes se agregan directo dentro de #window, no dentro de .w-middle.
   Por eso #window tiene que ser el contenedor scrolleable.
   ========================================================== */
@media (max-width:768px){
    body.bt-chat #key{
        top:0!important;
        bottom:0!important;
        overflow:hidden!important;
    }

    body.bt-chat #window.pg.wtp{
        position:absolute!important;
        top:0!important;
        left:0!important;
        right:0!important;
        bottom:0!important;
        width:auto!important;
        height:auto!important;
        padding:66px 12px 78px 12px!important;
        margin:0!important;
        overflow-y:auto!important;
        overflow-x:hidden!important;
        box-sizing:border-box!important;
        -webkit-overflow-scrolling:touch!important;
        overscroll-behavior:contain!important;
    }

    body.bt-chat #window .chat-top,
    body.bt-chat .chat-top{
        position:fixed!important;
        top:0!important;
        left:8px!important;
        right:8px!important;
        width:auto!important;
        height:56px!important;
        min-height:56px!important;
        margin:0!important;
        background:#fff!important;
        border-left:1px solid #e5edf6!important;
        border-right:1px solid #e5edf6!important;
        border-bottom:1px solid #e5edf6!important;
        border-top:0!important;
        border-radius:0 0 10px 10px!important;
        box-sizing:border-box!important;
        overflow:hidden!important;
        z-index:60!important;
    }

    body.bt-chat #window .mobile-aling,
    body.bt-chat .mobile-aling{
        height:56px!important;
        min-height:56px!important;
        padding:8px 10px!important;
        display:flex!important;
        align-items:center!important;
        box-sizing:border-box!important;
    }

    body.bt-chat #window .w-bottom,
    body.bt-chat .w-bottom{
        position:fixed!important;
        left:8px!important;
        right:8px!important;
        bottom:8px!important;
        width:auto!important;
        margin:0!important;
        padding:0 56px!important;
        background:#fff!important;
        border:1px solid #e5edf6!important;
        border-radius:10px!important;
        box-shadow:0 -6px 20px rgba(15,23,42,.045)!important;
        box-sizing:border-box!important;
        z-index:60!important;
    }

    body.bt-chat #window .w-atta,
    body.bt-chat .w-atta{
        left:16px!important;
    }

    body.bt-chat #window .w-send,
    body.bt-chat .w-send{
        right:16px!important;
    }

    body.bt-chat #window .zm{
        width:100%!important;
        max-width:100%!important;
        box-sizing:border-box!important;
        clear:both!important;
    }

    body.bt-chat #window .w-bubble-left,
    body.bt-chat #window .w-bubble-right{
        max-width:78%!important;
        box-sizing:border-box!important;
    }
}

/* ==========================================================
   BRINTAGE FIX CHAT PANEL - 2026-07-05
   El chat se limita al panel derecho: mensajes + caja de escritura.
   Desktop: no usa todo el viewport; Mobile: scroll real con margenes.
   ========================================================== */
@media (min-width:769px){
    body.bt-chat{
        --bt-chat-left:44%;
        --bt-chat-right:20%;
        --bt-chat-top-final:64px;
        --bt-chat-bottom-final:58px;
    }

    body.bt-chat #key{
        top:0!important;
        bottom:0!important;
        overflow:hidden!important;
    }

    body.bt-chat #window.pg.wtp{
        position:absolute!important;
        top:0!important;
        left:0!important;
        right:0!important;
        bottom:0!important;
        width:auto!important;
        height:auto!important;
        margin:0!important;
        padding:calc(var(--bt-chat-top-final) + 14px) 0 calc(var(--bt-chat-bottom-final) + 18px) 0!important;
        overflow-y:auto!important;
        overflow-x:hidden!important;
        box-sizing:border-box!important;
        -webkit-overflow-scrolling:touch!important;
    }

    body.bt-chat #window .chat-top.fixed-wto,
    body.bt-chat .chat-top.fixed-wto{
        position:fixed!important;
        top:0!important;
        left:var(--bt-desk-left)!important;
        right:var(--bt-desk-right)!important;
        width:auto!important;
        height:var(--bt-chat-top-final)!important;
        min-height:var(--bt-chat-top-final)!important;
        margin:0!important;
        box-sizing:border-box!important;
        z-index:60!important;
    }

    body.bt-chat #window .w-bottom.fixed-wbx,
    body.bt-chat .w-bottom.fixed-wbx{
        position:fixed!important;
        left:var(--bt-chat-left)!important;
        right:var(--bt-chat-right)!important;
        bottom:0!important;
        width:auto!important;
        min-height:var(--bt-chat-bottom-final)!important;
        margin:0!important;
        padding:0 64px!important;
        background:#fff!important;
        border:1px solid #e5edf6!important;
        border-bottom:0!important;
        border-radius:10px 10px 0 0!important;
        box-shadow:0 -8px 24px rgba(15,23,42,.045)!important;
        box-sizing:border-box!important;
        z-index:60!important;
    }

    body.bt-chat #window > .zm,
    body.bt-chat #window .zm{
        float:none!important;
        clear:both!important;
        width:auto!important;
        max-width:none!important;
        margin-left:var(--bt-chat-left)!important;
        margin-right:var(--bt-chat-right)!important;
        margin-bottom:10px!important;
        box-sizing:border-box!important;
    }

    body.bt-chat #window .w-pos-left{
        padding-left:44px!important;
    }

    body.bt-chat #window .w-bubble-left,
    body.bt-chat #window .w-bubble-right{
        max-width:78%!important;
        box-sizing:border-box!important;
    }
}

@media (max-width:768px){
    body.bt-chat{
        --bt-chat-mobile-gap:10px;
        --bt-chat-mobile-top:64px;
        --bt-chat-mobile-bottom:74px;
    }

    body.bt-chat #key{
        top:0!important;
        bottom:0!important;
        left:0!important;
        right:0!important;
        width:100%!important;
        transform:none!important;
        -webkit-transform:none!important;
        overflow:hidden!important;
    }

    body.bt-chat #window.pg.wtp{
        position:absolute!important;
        top:0!important;
        left:0!important;
        right:0!important;
        bottom:0!important;
        width:auto!important;
        height:auto!important;
        margin:0!important;
        padding:var(--bt-chat-mobile-top) var(--bt-chat-mobile-gap) var(--bt-chat-mobile-bottom) var(--bt-chat-mobile-gap)!important;
        overflow-y:auto!important;
        overflow-x:hidden!important;
        box-sizing:border-box!important;
        -webkit-overflow-scrolling:touch!important;
        overscroll-behavior:contain!important;
    }

    body.bt-chat #window .chat-top,
    body.bt-chat .chat-top{
        position:fixed!important;
        top:0!important;
        left:var(--bt-chat-mobile-gap)!important;
        right:var(--bt-chat-mobile-gap)!important;
        width:auto!important;
        height:58px!important;
        min-height:58px!important;
        margin:0!important;
        box-sizing:border-box!important;
        z-index:70!important;
    }

    body.bt-chat #window .w-bottom,
    body.bt-chat .w-bottom{
        position:fixed!important;
        left:var(--bt-chat-mobile-gap)!important;
        right:var(--bt-chat-mobile-gap)!important;
        bottom:8px!important;
        width:auto!important;
        min-height:52px!important;
        margin:0!important;
        padding:0 54px!important;
        box-sizing:border-box!important;
        z-index:70!important;
    }

    body.bt-chat #window > .zm,
    body.bt-chat #window .zm{
        float:none!important;
        clear:both!important;
        width:100%!important;
        max-width:100%!important;
        margin-left:0!important;
        margin-right:0!important;
        margin-bottom:10px!important;
        box-sizing:border-box!important;
    }

    body.bt-chat #window .w-pos-left{
        padding-left:42px!important;
    }

    body.bt-chat #window .w-bubble-left,
    body.bt-chat #window .w-bubble-right{
        max-width:78%!important;
        box-sizing:border-box!important;
    }
}

/* ==========================================================
   BRINTAGE FIX - contenido pegado a la barra superior
   Evita el hueco grande al volver desde chat/post/búsqueda.
   El borde superior de #key queda calculado por JS con la altura
   real de la barra, y el feed solo conserva un margen pequeño.
   ========================================================== */
#key,
#key .pg{
    box-sizing:border-box!important;
}
@media (min-width:769px){
    body:not(.bt-chat) #key{
        overflow:hidden!important;
    }
    body:not(.bt-chat) #key .pg.fx,
    body:not(.bt-chat) #key .pg.na,
    body:not(.bt-chat) #key .pg.us{
        padding-top:8px!important;
        padding-bottom:8px!important;
        box-sizing:border-box!important;
    }
    body:not(.bt-chat) #key .pg.mg{
        padding-top:8px!important;
    }
    body:not(.bt-chat) #key .post.zq:first-child{
        margin-top:0!important;
    }
}
@media (max-width:768px){
    body:not(.bt-chat) #key .pg.fx,
    body:not(.bt-chat) #key .pg.na,
    body:not(.bt-chat) #key .pg.us{
        padding-top:8px!important;
        box-sizing:border-box!important;
    }
}

/* ==========================================================
   BRINTAGE FIX REAL - layout único para todas las vistas
   2026-07-05
   El mismo sistema de mensajes ahora gobierna home/favoritos/
   búsqueda/perfiles/posts: #key siempre arranca debajo de la
   altura REAL de #bop y termina arriba de #bom.
   ========================================================== */
:root{
    --bt-app-top:51px;
    --bt-app-bottom:51px;
    --bt-chat-top-real:64px;
    --bt-chat-bottom-real:64px;
}

body.bt-home #key,
body.bt-profile #key,
body.bt-sub #key,
body.bt-messages #key,
body.bt-search #key{
    position:absolute!important;
    top:var(--bt-app-top)!important;
    bottom:var(--bt-app-bottom)!important;
    height:auto!important;
    overflow:hidden!important;
}

body.bt-home #key > .pg,
body.bt-profile #key > .pg,
body.bt-sub #key > .pg,
body.bt-messages #key > .pg,
body.bt-search #key > .pg{
    position:absolute!important;
    top:0!important;
    right:0!important;
    bottom:0!important;
    left:0!important;
    height:auto!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    box-sizing:border-box!important;
    -webkit-overflow-scrolling:touch!important;
}

body.bt-home #key > .pg.fx,
body.bt-profile #key > .pg.us,
body.bt-sub #key > .pg.fx,
body.bt-sub #key > .pg.na,
body.bt-messages #key > .pg.na,
body.bt-search #key > .pg.na{
    padding-top:8px!important;
}

body.bt-chat #key{
    position:absolute!important;
    top:0!important;
    bottom:0!important;
    height:auto!important;
    overflow:hidden!important;
}

body.bt-chat #window.pg.wtp{
    position:absolute!important;
    top:0!important;
    right:0!important;
    bottom:0!important;
    left:0!important;
    height:auto!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    box-sizing:border-box!important;
    -webkit-overflow-scrolling:touch!important;
    padding-top:calc(var(--bt-chat-top-real) + 12px)!important;
    padding-bottom:calc(var(--bt-chat-bottom-real) + 14px)!important;
}

@media (max-width:768px){
    body.bt-home #key,
    body.bt-profile #key,
    body.bt-sub #key,
    body.bt-messages #key,
    body.bt-search #key{
        left:0!important;
        right:0!important;
        width:auto!important;
        transform:none!important;
        -webkit-transform:none!important;
    }

    body.bt-home #key > .pg,
    body.bt-profile #key > .pg,
    body.bt-sub #key > .pg,
    body.bt-messages #key > .pg,
    body.bt-search #key > .pg{
        padding-left:0!important;
        padding-right:0!important;
    }
}

/* ==========================================================
   BRINTAGE FIX AMBOS MODOS - mobile + fixed
   El contenido usa siempre las variables calculadas por JS,
   sin quedar limitado solo a mobile.
   ========================================================== */
body.bt-home #key,
body.bt-profile #key,
body.bt-sub #key,
body.bt-messages #key,
body.bt-search #key{
    top:var(--bt-app-top)!important;
    bottom:var(--bt-app-bottom)!important;
}

body.bt-chat #window.pg.wtp{
    padding-top:calc(var(--bt-chat-top-real) + 12px)!important;
    padding-bottom:calc(var(--bt-chat-bottom-real) + 14px)!important;
}

/* ==========================================================
   BRINTAGE FIX FINAL CHAT DESKTOP - altura real
   2026-07-05
   El chat de escritorio estaba usando valores viejos/fijos y además
   chat.js pisaba el padding del #window. Estas reglas fuerzan que el
   cuerpo del chat use el mismo sistema que Home/Favoritos/Búsqueda:
   medir header real + input real y dejar el scroll sólo en #window.
   Mobile queda intacto.
   ========================================================== */
@media (min-width:769px){
    body.bt-chat #key{
        position:absolute!important;
        top:0!important;
        right:0!important;
        bottom:0!important;
        left:0!important;
        height:auto!important;
        overflow:hidden!important;
    }

    body.bt-chat #window.pg.wtp{
        position:absolute!important;
        top:0!important;
        right:0!important;
        bottom:0!important;
        left:0!important;
        width:auto!important;
        height:auto!important;
        margin:0!important;
        overflow-y:auto!important;
        overflow-x:hidden!important;
        box-sizing:border-box!important;
        -webkit-overflow-scrolling:touch!important;
        padding-top:calc(var(--bt-chat-top-real) + 10px)!important;
        padding-bottom:calc(var(--bt-chat-bottom-real) + 12px)!important;
        padding-left:0!important;
        padding-right:0!important;
    }

    body.bt-chat #window .chat-top.fixed-wto,
    body.bt-chat .chat-top.fixed-wto{
        position:fixed!important;
        top:0!important;
        left:var(--bt-desk-left)!important;
        right:var(--bt-desk-right)!important;
        width:auto!important;
        height:auto!important;
        min-height:0!important;
        margin:0!important;
        box-sizing:border-box!important;
        z-index:80!important;
    }

    body.bt-chat #window .w-bottom.fixed-wbx,
    body.bt-chat .w-bottom.fixed-wbx{
        position:fixed!important;
        left:var(--bt-desk-left)!important;
        right:var(--bt-desk-right)!important;
        bottom:0!important;
        width:auto!important;
        height:auto!important;
        min-height:0!important;
        margin:0!important;
        box-sizing:border-box!important;
        z-index:80!important;
    }

    body.bt-chat #window > .zm,
    body.bt-chat #window .zm{
        box-sizing:border-box!important;
        clear:both!important;
        max-width:none!important;
        margin-left:var(--bt-desk-left)!important;
        margin-right:var(--bt-desk-right)!important;
    }
}

/* ==========================================================
   BRINTAGE FIX CHAT DESKTOP - ancho del panel derecho
   2026-07-05
   El alto ya usa la altura real. Faltaba que en escritorio los
   mensajes y el input no usen toda la pantalla: ahora se alinean
   con el inicio real de .fixed-aling (barra del usuario), dejando
   intacto mobile.
   ========================================================== */
:root{
    --bt-chat-content-left:0px;
    --bt-chat-content-right:0px;
}

@media (min-width:769px){
    body.bt-chat #window.pg.wtp{
        padding-left:var(--bt-chat-content-left)!important;
        padding-right:var(--bt-chat-content-right)!important;
    }

    body.bt-chat #window .w-bottom.fixed-wbx,
    body.bt-chat .w-bottom.fixed-wbx{
        left:var(--bt-chat-content-left)!important;
        right:var(--bt-chat-content-right)!important;
        width:auto!important;
        margin:0!important;
        box-sizing:border-box!important;
    }

    body.bt-chat #window > .zm,
    body.bt-chat #window .zm{
        margin-left:0!important;
        margin-right:0!important;
        max-width:none!important;
        box-sizing:border-box!important;
    }

    body.bt-chat #window .w-pos-left,
    body.bt-chat #window .w-pos-right{
        max-width:100%!important;
    }
}

/* ==========================================================
   BRINTAGE FIX DEFINITIVO CHAT PANEL - 2026-07-05
   Header, mensajes e input usan el mismo panel real.
   Los mensajes ya no se agregan directo sobre toda la ventana:
   viven en #w-messages, con su propio scroll.
   ========================================================== */
body.bt-chat #window.pg.wtp{
    overflow:hidden!important;
    padding:0!important;
}

body.bt-chat #window .w-messages{
    box-sizing:border-box!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
}

@media (min-width:769px){
    body.bt-chat #window .w-messages{
        position:fixed!important;
        top:var(--bt-chat-top-real)!important;
        bottom:var(--bt-chat-bottom-real)!important;
        left:var(--bt-chat-content-left)!important;
        right:var(--bt-chat-content-right)!important;
        width:auto!important;
        height:auto!important;
        padding:12px 0 14px 0!important;
        margin:0!important;
        background:#fff!important;
        z-index:1!important;
    }

    body.bt-chat #window .w-bottom.fixed-wbx,
    body.bt-chat .w-bottom.fixed-wbx{
        position:fixed!important;
        left:var(--bt-chat-content-left)!important;
        right:var(--bt-chat-content-right)!important;
        bottom:0!important;
        width:auto!important;
        margin:0!important;
        padding:0 70px!important;
        box-sizing:border-box!important;
        z-index:90!important;
    }

    body.bt-chat #window .w-messages > .zm,
    body.bt-chat #window .w-messages .zm{
        margin-left:0!important;
        margin-right:0!important;
        max-width:100%!important;
        box-sizing:border-box!important;
        clear:both!important;
    }

    body.bt-chat #window .w-messages .w-pos-left{
        padding-left:18px!important;
        padding-right:12px!important;
    }

    body.bt-chat #window .w-messages .w-pos-right{
        padding-left:12px!important;
        padding-right:18px!important;
    }

    body.bt-chat #window .w-messages .w-bubble-left,
    body.bt-chat #window .w-messages .w-bubble-right{
        max-width:520px!important;
    }
}

@media (max-width:768px){
    body.bt-chat #window .w-messages{
        position:absolute!important;
        top:var(--bt-chat-top-real)!important;
        bottom:var(--bt-chat-bottom-real)!important;
        left:10px!important;
        right:10px!important;
        width:auto!important;
        height:auto!important;
        padding:10px 0 12px 0!important;
        margin:0!important;
        z-index:1!important;
    }

    body.bt-chat #window .w-messages > .zm,
    body.bt-chat #window .w-messages .zm{
        margin-left:0!important;
        margin-right:0!important;
        max-width:100%!important;
        box-sizing:border-box!important;
    }
}

/* ==========================================================
   BRINTAGE CHAT DESKTOP PANEL REAL - 2026-07-05
   El panel de mensajes/input arranca donde arranca el contenido
   real de la barra de usuario (después del padding de .fixed-aling),
   no en el borde del header/logo. La variable la calcula parts.js.
   ========================================================== */
@media (min-width:769px){
    body.bt-chat #window.pg.wtp{
        overflow:hidden!important;
        padding:0!important;
    }
    body.bt-chat #window .w-messages{
        position:fixed!important;
        top:var(--bt-chat-top-real)!important;
        bottom:var(--bt-chat-bottom-real)!important;
        left:var(--bt-chat-content-left)!important;
        right:var(--bt-chat-content-right)!important;
        width:auto!important;
        height:auto!important;
        overflow-y:auto!important;
        overflow-x:hidden!important;
        box-sizing:border-box!important;
        padding:12px 0 14px 0!important;
        margin:0!important;
    }
    body.bt-chat #window .w-bottom.fixed-wbx,
    body.bt-chat .w-bottom.fixed-wbx{
        position:fixed!important;
        left:var(--bt-chat-content-left)!important;
        right:var(--bt-chat-content-right)!important;
        bottom:0!important;
        width:auto!important;
        margin:0!important;
        box-sizing:border-box!important;
    }
}

/* ==========================================================
   BRINTAGE CHAT SCROLL LATERAL + MARGENES PAREJOS - 2026-07-05
   Desktop: el scrollbar del chat queda pegado al borde derecho del navegador,
   igual que Home/User/Favoritos, pero el contenido visual respeta el panel
   del chat y deja el mismo aire a ambos lados de los mensajes.
   Mobile queda intacto.
   ========================================================== */
@media (min-width:769px){
    body.bt-chat{
        --bt-chat-msg-gap:18px;
    }

    body.bt-chat #window .w-messages,
    body.bt-chat #w-messages.w-messages{
        position:fixed!important;
        top:var(--bt-chat-top-real)!important;
        bottom:var(--bt-chat-bottom-real)!important;
        left:var(--bt-chat-content-left)!important;
        right:0!important;
        width:auto!important;
        height:auto!important;
        overflow-y:auto!important;
        overflow-x:hidden!important;
        box-sizing:border-box!important;
        padding-top:12px!important;
        padding-bottom:14px!important;
        padding-left:var(--bt-chat-msg-gap)!important;
        padding-right:calc(var(--bt-chat-content-right) + var(--bt-chat-msg-gap))!important;
        scrollbar-width:thin;
        scrollbar-color:#c8d6e8 transparent;
    }

    body.bt-chat #window .w-messages::-webkit-scrollbar,
    body.bt-chat #w-messages.w-messages::-webkit-scrollbar{
        width:8px;
    }

    body.bt-chat #window .w-messages::-webkit-scrollbar-track,
    body.bt-chat #w-messages.w-messages::-webkit-scrollbar-track{
        background:transparent;
    }

    body.bt-chat #window .w-messages::-webkit-scrollbar-thumb,
    body.bt-chat #w-messages.w-messages::-webkit-scrollbar-thumb{
        background:#c8d6e8;
        border-radius:8px;
    }

    body.bt-chat #window .w-messages > .zm,
    body.bt-chat #window .w-messages .zm,
    body.bt-chat #w-messages.w-messages > .zm,
    body.bt-chat #w-messages.w-messages .zm{
        margin-left:0!important;
        margin-right:0!important;
        max-width:100%!important;
        box-sizing:border-box!important;
        clear:both!important;
    }

    body.bt-chat #window .w-messages .w-pos-left,
    body.bt-chat #w-messages.w-messages .w-pos-left{
        padding-left:0!important;
        padding-right:12px!important;
    }

    body.bt-chat #window .w-messages .w-pos-right,
    body.bt-chat #w-messages.w-messages .w-pos-right{
        padding-left:12px!important;
        padding-right:0!important;
    }

    body.bt-chat #window .w-messages .w-bubble-left,
    body.bt-chat #window .w-messages .w-bubble-right,
    body.bt-chat #w-messages.w-messages .w-bubble-left,
    body.bt-chat #w-messages.w-messages .w-bubble-right{
        max-width:520px!important;
        box-sizing:border-box!important;
    }
}


/* FIX comments fo state: .fo is also used as follower-state on comments;
   do not let button styles paint refreshed comments blue. */
.comment.fo{
    background:transparent!important;
    color:inherit!important;
    box-shadow:none!important;
    border-radius:0!important;
    padding:0!important;
    min-height:0!important;
    height:auto!important;
    line-height:normal!important;
    font-weight:inherit!important;
}
.comment.fo .c-cont{
    background-color:#f0f2f5!important;
    color:inherit!important;
}
.comment.fo .c-inte,
.comment.fo .c-inte a{
    color:inherit!important;
}
.comment.fo .c-datime{
    color:#949494!important;
}

/* ==========================================================
   BRINTAGE PERFIL AZUL PREMIUM - mockup lago / tarjetas
   Ajuste aplicado solo a la pantalla de perfil.
   ========================================================== */
:root{
    --btp-blue:#2f84f6;
    --btp-blue2:#74bbff;
    --btp-ink:#263142;
    --btp-muted:#5d6878;
    --btp-line:#d7e8ff;
    --btp-card:rgba(255,255,255,.94);
}

body.bt-profile #key > .pg.us{
    background:linear-gradient(180deg,#fbfdff 0%,#ffffff 100%)!important;
    padding:10px 10px 28px!important;
}

body.bt-profile .d-dab{
    height:auto!important;
    min-height:0!important;
    position:relative!important;
    width:100%!important;
    padding:0 0 178px!important;
    margin:0 0 70px!important;
    overflow:visible!important;
    background:#fff!important;
    border-radius:18px 18px 0 0!important;
}

body.bt-profile .d-cover{
    height:370px!important;
    position:relative!important;
    overflow:hidden!important;
    border-radius:18px 18px 0 0!important;
    background:#fbfdff!important;
    box-shadow:0 12px 38px rgba(47,132,246,.14)!important;
}

body.bt-profile .d-cover .imge{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    background-position:center center!important;
    background-size:cover!important;
    filter:saturate(1.04) contrast(.96) brightness(1.08)!important;
    transform:scale(1.01)!important;
}

body.bt-profile .d-cover:before{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    z-index:1!important;
    pointer-events:none!important;
    background:
      linear-gradient(90deg,rgba(255,255,255,.92) 0%,rgba(255,255,255,.72) 25%,rgba(255,255,255,.32) 53%,rgba(255,255,255,.08) 100%),
      linear-gradient(180deg,rgba(255,255,255,.34) 0%,rgba(255,255,255,.08) 50%,rgba(255,255,255,.38) 100%),
      radial-gradient(circle at 52% 35%,rgba(255,255,255,.35),transparent 34%);
}

body.bt-profile .d-cover:after{
    content:""!important;
    position:absolute!important;
    left:-8%!important;
    right:-8%!important;
    bottom:-118px!important;
    height:210px!important;
    z-index:3!important;
    pointer-events:none!important;
    background:#fff!important;
    border-radius:50% 50% 0 0/100% 100% 0 0!important;
    box-shadow:0 -12px 38px rgba(255,255,255,.72)!important;
}

body.bt-profile .d-dab:before{
    content:""!important;
    position:absolute!important;
    top:0!important;
    right:0!important;
    width:28%!important;
    height:370px!important;
    z-index:4!important;
    pointer-events:none!important;
    opacity:.62!important;
    background:
      linear-gradient(110deg,transparent 0 35%,rgba(47,132,246,.28) 36% 50%,transparent 51%),
      repeating-linear-gradient(110deg,transparent 0 14px,rgba(47,132,246,.18) 15px 16px,transparent 17px 28px)!important;
    clip-path:polygon(35% 0,100% 0,100% 100%,0 100%)!important;
}

body.bt-profile .d-dab:after{
    content:""!important;
    position:absolute!important;
    top:40px!important;
    left:48px!important;
    width:120px!important;
    height:240px!important;
    z-index:4!important;
    opacity:.58!important;
    pointer-events:none!important;
    background:linear-gradient(var(--btp-blue),var(--btp-blue)) left center/2px 100% no-repeat!important;
}

body.bt-profile .bt-cover-quote{
    position:absolute!important;
    left:84px!important;
    top:70px!important;
    width:250px!important;
    z-index:5!important;
    color:#2e3a4d!important;
    font-size:19px!important;
    line-height:1.55!important;
    font-style:italic!important;
    text-shadow:0 1px 0 rgba(255,255,255,.62)!important;
    max-height:205px!important;
    overflow:hidden!important;
}
body.bt-profile .bt-quote-mark{
    display:block!important;
    color:var(--btp-blue)!important;
    font-size:48px!important;
    line-height:.65!important;
    font-style:normal!important;
    font-weight:900!important;
    margin-bottom:4px!important;
}
body.bt-profile .bt-quote-text{
    display:-webkit-box!important;
    -webkit-line-clamp:5!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
}

body.bt-profile .d-pos{
    top:235px!important;
    left:0!important;
    right:0!important;
    z-index:8!important;
    position:absolute!important;
}
body.bt-profile .d-auto{
    width:168px!important;
    height:168px!important;
    margin:0 auto!important;
}
body.bt-profile .d-photo{
    width:168px!important;
    height:168px!important;
    border-radius:50%!important;
    background:#fff!important;
    box-shadow:0 18px 45px rgba(18,45,84,.18)!important;
    padding:8px!important;
    box-sizing:border-box!important;
}
body.bt-profile .d-photo:before{
    content:""!important;
    position:absolute!important;
    inset:-7px!important;
    border-radius:50%!important;
    background:conic-gradient(from 20deg, rgba(47,125,246,0) 0deg, #9fd2ff 22deg, var(--btp-blue) 55deg, #d9efff 105deg, #fff 165deg, var(--btp-blue2) 225deg, #fff 285deg, #b9e1ff 330deg, rgba(47,125,246,0) 360deg)!important;
    z-index:-1!important;
    box-shadow:0 0 0 8px rgba(255,255,255,.82)!important;
}
body.bt-profile .d-photo .imge{
    width:100%!important;
    height:100%!important;
    border:0!important;
    border-radius:50%!important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.92)!important;
}
body.bt-profile .d-up-ip{
    right:-14px!important;
    bottom:18px!important;
    z-index:12!important;
}
body.bt-profile .d-up-ip .myButton-upload-photos,
body.bt-profile .d-up-ic .myButton-upload-photos{
    background-color:#fff!important;
    border-radius:50%!important;
    box-shadow:0 10px 24px rgba(15,23,42,.18)!important;
    border:1px solid rgba(220,235,255,.98)!important;
    background-size:52% 52%!important;
}
body.bt-profile .d-up-ip .myButton-upload-photos{width:54px!important;height:54px!important;}
body.bt-profile .d-up-ic{left:24px!important;top:20px!important;z-index:9!important;}
body.bt-profile .d-up-ic .myButton-upload-photos{width:48px!important;height:48px!important;}

body.bt-profile .d-fullname{
    position:absolute!important;
    top:414px!important;
    left:0!important;
    right:0!important;
    z-index:7!important;
    min-width:0!important;
    text-align:center!important;
    filter:none!important;
}
body.bt-profile .d-fullname .d-text-a,
body.bt-profile .d-fullname .d-text-b{
    filter:none!important;
    text-shadow:none!important;
}
body.bt-profile .d-fullname .d-text-a{
    color:var(--btp-ink)!important;
    font-size:50px!important;
    line-height:1.05!important;
    font-weight:900!important;
    letter-spacing:-1.6px!important;
}
body.bt-profile .bt-name-main{font-family:Arial,'Segoe UI',sans-serif!important;}
body.bt-profile .bt-name-script{
    font-family:'Lucida Handwriting','Segoe Script',cursive!important;
    color:#66aaf7!important;
    font-weight:400!important;
    letter-spacing:-3px!important;
}
body.bt-profile .d-fullname .d-text-b{
    display:inline-flex!important;
    align-items:center!important;
    gap:18px!important;
    color:#4b586b!important;
    font-size:22px!important;
    line-height:1.2!important;
    margin-top:4px!important;
    font-weight:500!important;
}
body.bt-profile .d-fullname .d-text-b:before,
body.bt-profile .d-fullname .d-text-b:after{
    content:""!important;
    display:block!important;
    width:110px!important;
    height:2px!important;
    background:linear-gradient(90deg,transparent,var(--btp-blue))!important;
}
body.bt-profile .d-fullname .d-text-b:after{background:linear-gradient(90deg,var(--btp-blue),transparent)!important;}

body.bt-profile .d-menu{
    position:absolute!important;
    left:8%!important;
    right:8%!important;
    bottom:-52px!important;
    height:86px!important;
    z-index:12!important;
    display:flex!important;
    align-items:center!important;
    overflow:hidden!important;
    background:var(--btp-card)!important;
    border:1px solid rgba(214,232,255,.96)!important;
    border-radius:18px!important;
    box-shadow:0 18px 48px rgba(15,23,42,.10)!important;
    backdrop-filter:blur(12px)!important;
    -webkit-backdrop-filter:blur(12px)!important;
}
body.bt-profile .d-menu .d-om{display:none!important;}
body.bt-profile .d-menu a{
    color:#445166!important;
    text-shadow:none!important;
    padding:0!important;
    height:100%!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    position:relative!important;
    gap:4px!important;
}
body.bt-profile .d-menu a:not(:last-of-type):after{
    content:""!important;
    position:absolute!important;
    right:0!important;
    top:22%!important;
    bottom:22%!important;
    width:1px!important;
    background:#c9def6!important;
}
body.bt-profile .m-text-a{
    font-size:13px!important;
    letter-spacing:.4px!important;
    text-transform:uppercase!important;
    color:#4b586b!important;
    font-weight:500!important;
}
body.bt-profile .m-text-b{
    font-size:30px!important;
    color:#2f7df6!important;
    font-weight:800!important;
    line-height:1!important;
}

body.bt-profile .ca{
    width:82%!important;
    margin:0 auto 26px!important;
    padding:30px 56px!important;
    box-sizing:border-box!important;
    background:rgba(255,255,255,.96)!important;
    border:1px solid rgba(214,232,255,.92)!important;
    border-radius:18px!important;
    box-shadow:0 20px 50px rgba(15,23,42,.09)!important;
    min-height:170px!important;
    overflow:hidden!important;
}
body.bt-profile .ca:before{
    content:""!important;
    position:absolute!important;
    left:34px!important;
    top:30px!important;
    bottom:30px!important;
    width:2px!important;
    background:linear-gradient(var(--btp-blue),var(--btp-blue2))!important;
    border-radius:2px!important;
}
body.bt-profile .ca:after{
    content:"BRINTAGE"!important;
    position:absolute!important;
    right:35px!important;
    bottom:10px!important;
    font-size:46px!important;
    font-weight:900!important;
    letter-spacing:8px!important;
    color:rgba(47,132,246,.045)!important;
    pointer-events:none!important;
}
body.bt-profile .ca-about{
    font-size:16px!important;
    line-height:1.55!important;
    color:#344256!important;
    max-width:78%!important;
    padding-bottom:18px!important;
    margin-bottom:20px!important;
    border-bottom:1px solid #d7e2ef!important;
}
body.bt-profile .ca-info{
    padding-left:34px!important;
    margin-top:10px!important;
    font-size:15px!important;
    color:#344256!important;
    min-height:22px!important;
}
body.bt-profile .ca-info img.ob{
    width:20px!important;
    height:20px!important;
    left:0!important;
    top:1px!important;
    filter: invert(46%) sepia(96%) saturate(1711%) hue-rotate(196deg) brightness(101%) contrast(94%)!important;
    opacity:.9!important;
}
body.bt-profile .ca-info .link,
body.bt-profile .ca-info a{
    color:#2f84f6!important;
    font-weight:500!important;
}
body.bt-profile .ca-int{margin-top:22px!important;}
body.bt-profile .ca-int .flex{gap:10px!important;justify-content:flex-start!important;}

body.bt-profile .post{
    width:82%!important;
    margin-left:auto!important;
    margin-right:auto!important;
}

@media (max-width:768px){
    body.bt-profile #key > .pg.us{padding:0 6px 22px!important;}
    body.bt-profile .d-dab{
        padding-bottom:142px!important;
        margin-bottom:62px!important;
        border-radius:0!important;
    }
    body.bt-profile .d-cover{
        height:286px!important;
        border-radius:0 0 16px 16px!important;
    }
    body.bt-profile .d-cover:after{
        bottom:-86px!important;
        height:150px!important;
    }
    body.bt-profile .d-dab:before{
        height:286px!important;
        width:38%!important;
        opacity:.45!important;
    }
    body.bt-profile .d-dab:after{
        top:46px!important;
        left:18px!important;
        height:130px!important;
    }
    body.bt-profile .bt-cover-quote{
        left:38px!important;
        top:48px!important;
        width:170px!important;
        font-size:14px!important;
        line-height:1.45!important;
        max-height:130px!important;
    }
    body.bt-profile .bt-quote-mark{font-size:34px!important;}
    body.bt-profile .d-pos{top:176px!important;}
    body.bt-profile .d-auto,
    body.bt-profile .d-photo{width:126px!important;height:126px!important;}
    body.bt-profile .d-photo{padding:6px!important;}
    body.bt-profile .d-photo:before{inset:-5px!important;box-shadow:0 0 0 6px rgba(255,255,255,.82)!important;}
    body.bt-profile .d-up-ip{right:-12px!important;bottom:10px!important;}
    body.bt-profile .d-up-ip .myButton-upload-photos{width:44px!important;height:44px!important;}
    body.bt-profile .d-up-ic{left:14px!important;top:14px!important;}
    body.bt-profile .d-up-ic .myButton-upload-photos{width:42px!important;height:42px!important;}
    body.bt-profile .d-fullname{top:306px!important;}
    body.bt-profile .d-fullname .d-text-a{font-size:38px!important;letter-spacing:-1.2px!important;}
    body.bt-profile .bt-name-script{letter-spacing:-2px!important;}
    body.bt-profile .d-fullname .d-text-b{font-size:18px!important;gap:10px!important;}
    body.bt-profile .d-fullname .d-text-b:before,
    body.bt-profile .d-fullname .d-text-b:after{width:64px!important;}
    body.bt-profile .d-menu{
        left:6%!important;
        right:6%!important;
        bottom:-46px!important;
        height:76px!important;
        border-radius:16px!important;
    }
    body.bt-profile .m-text-a{font-size:11px!important;}
    body.bt-profile .m-text-b{font-size:24px!important;}
    body.bt-profile .ca{
        width:88%!important;
        margin-bottom:20px!important;
        padding:24px 24px 24px 42px!important;
        border-radius:18px!important;
        min-height:150px!important;
    }
    body.bt-profile .ca:before{left:26px!important;top:24px!important;bottom:24px!important;}
    body.bt-profile .ca:after{font-size:32px!important;letter-spacing:5px!important;right:15px!important;bottom:4px!important;}
    body.bt-profile .ca-about{
        max-width:100%!important;
        font-size:14px!important;
        padding-bottom:15px!important;
        margin-bottom:16px!important;
    }
    body.bt-profile .ca-info{font-size:14px!important;margin-top:9px!important;padding-left:30px!important;}
    body.bt-profile .post{width:88%!important;}
}

@media (max-width:420px){
    body.bt-profile .bt-cover-quote{display:none!important;}
    body.bt-profile .d-dab:after{display:none!important;}
    body.bt-profile .d-cover{height:250px!important;}
    body.bt-profile .d-cover:after{bottom:-72px!important;height:126px!important;}
    body.bt-profile .d-dab{padding-bottom:136px!important;}
    body.bt-profile .d-pos{top:156px!important;}
    body.bt-profile .d-auto,
    body.bt-profile .d-photo{width:118px!important;height:118px!important;}
    body.bt-profile .d-fullname{top:278px!important;}
    body.bt-profile .d-fullname .d-text-a{font-size:33px!important;}
    body.bt-profile .d-fullname .d-text-b{font-size:16px!important;}
    body.bt-profile .d-menu{left:4%!important;right:4%!important;}
    body.bt-profile .ca{width:92%!important;padding-right:18px!important;}
    body.bt-profile .post{width:92%!important;}
}

/* ==========================================================
   BRINTAGE PROFILE V2 - ajustes finales 2026-07-06
   - mismo layout para perfil propio y externo
   - perfil siempre en la columna derecha en escritorio
   - curva inferior fundida con el fondo real de la app
   - la tarjeta inferior ya no reserva espacio para "acerca de mí"
   ========================================================== */
body.bt-profile #key > .pg{
    background:linear-gradient(180deg,#fbfdff 0%,#ffffff 48%,#fbfdff 100%)!important;
    padding:10px 10px 28px!important;
}

@media (min-width:769px){
    body.bt-profile #key{
        left:45%!important;
        right:20%!important;
        width:auto!important;
        transform:none!important;
        -webkit-transform:none!important;
        background:transparent!important;
    }
    body.bt-profile #key.fx169 > .pg,
    body.bt-profile #key > .pg,
    body.bt-profile #key > .pg.us{
        padding:10px 0 30px!important;
        left:0!important;
        right:0!important;
        width:auto!important;
        box-sizing:border-box!important;
    }
    body.bt-profile .d-dab,
    body.bt-profile .post,
    body.bt-profile .ca{
        width:100%!important;
        max-width:100%!important;
    }
}

body.bt-profile .d-dab{
    background:transparent!important;
    box-shadow:none!important;
}

body.bt-profile .d-cover{
    background:#fbfdff!important;
    box-shadow:0 10px 34px rgba(47,132,246,.08)!important;
}

body.bt-profile .d-cover:after{
    left:-14%!important;
    right:-14%!important;
    bottom:-122px!important;
    height:218px!important;
    background:
        radial-gradient(130% 92% at 50% 0%, rgba(255,255,255,.99) 0%, rgba(255,255,255,.985) 58%, rgba(251,253,255,.96) 76%, rgba(251,253,255,0) 100%)!important;
    border-radius:50% 50% 0 0/100% 100% 0 0!important;
    box-shadow:none!important;
    filter:blur(.15px)!important;
}

body.bt-profile .d-cover:before{
    background:
      linear-gradient(90deg,rgba(255,255,255,.92) 0%,rgba(255,255,255,.70) 25%,rgba(255,255,255,.30) 53%,rgba(255,255,255,.08) 100%),
      linear-gradient(180deg,rgba(255,255,255,.36) 0%,rgba(255,255,255,.08) 52%,rgba(251,253,255,.54) 100%),
      radial-gradient(circle at 52% 35%,rgba(255,255,255,.34),transparent 34%)!important;
}

body.bt-profile .d-dab:before{
    opacity:.42!important;
}

body.bt-profile .ca{
    margin-top:0!important;
    padding-top:30px!important;
    min-height:138px!important;
}
body.bt-profile .ca-about{
    display:none!important;
}
body.bt-profile .ca-info:first-child{
    margin-top:0!important;
}

@media (max-width:768px){
    body.bt-profile #key{
        left:0!important;
        right:0!important;
        width:auto!important;
    }
    body.bt-profile #key > .pg,
    body.bt-profile #key > .pg.us{
        padding:0 6px 22px!important;
    }
    body.bt-profile .d-cover:after{
        bottom:-88px!important;
        height:154px!important;
        background:radial-gradient(130% 92% at 50% 0%, rgba(255,255,255,.99) 0%, rgba(255,255,255,.985) 60%, rgba(251,253,255,.96) 78%, rgba(251,253,255,0) 100%)!important;
        box-shadow:none!important;
    }
    body.bt-profile .ca{
        padding-top:24px!important;
        min-height:124px!important;
    }
}

@media (max-width:420px){
    body.bt-profile .d-cover:after{
        bottom:-74px!important;
        height:132px!important;
    }
}

/* ==========================================================
   BRINTAGE PERFIL - ajuste limpio solicitado 2026-07-06
   - sin sombras pesadas en el perfil
   - curva fundida con el color real del fondo
   - scroll del perfil pegado al lateral derecho del navegador
   ========================================================== */
:root{--btp-body-blend:#fbfdff;}

@media (min-width:769px){
    body.bt-profile #key{
        left:42%!important;
        right:0!important;
        width:auto!important;
        transform:none!important;
        -webkit-transform:none!important;
        overflow:hidden!important;
    }
    body.bt-profile #key > .pg,
    body.bt-profile #key > .pg.us{
        right:0!important;
        left:0!important;
        overflow-y:auto!important;
        overflow-x:hidden!important;
        scrollbar-gutter:stable!important;
        padding-right:6px!important;
    }
    body.bt-profile .d-dab,
    body.bt-profile .ca,
    body.bt-profile .post{
        width:100%!important;
        max-width:100%!important;
    }
}

body.bt-profile #key > .pg,
body.bt-profile #key > .pg.us{
    background:var(--btp-body-blend)!important;
}
body.bt-profile #key > .pg.us{
    padding-bottom:34px!important;
}

/* Quitar sombreado general del perfil */
body.bt-profile .d-cover,
body.bt-profile .d-photo,
body.bt-profile .d-menu,
body.bt-profile .ca,
body.bt-profile .d-up-ip .myButton-upload-photos,
body.bt-profile .d-up-ic .myButton-upload-photos{
    box-shadow:none!important;
    filter:none!important;
}
body.bt-profile .d-cover .imge{
    filter:saturate(1.02) contrast(.98) brightness(1.05)!important;
}
body.bt-profile .bt-cover-quote,
body.bt-profile .d-fullname .d-text-a,
body.bt-profile .d-fullname .d-text-b{
    text-shadow:none!important;
}

/* Curva: mismo color del fondo para que no parezca pegada */
body.bt-profile .d-cover:after{
    background:var(--btp-body-blend)!important;
    box-shadow:none!important;
    filter:none!important;
    opacity:1!important;
    bottom:-118px!important;
    height:218px!important;
    border-radius:50% 50% 0 0/100% 100% 0 0!important;
}

/* Transición inferior más limpia: sin halo ni borde visible */
body.bt-profile .d-dab{
    background:var(--btp-body-blend)!important;
    box-shadow:none!important;
}
body.bt-profile .d-cover{
    background:var(--btp-body-blend)!important;
    border:0!important;
}
body.bt-profile .d-cover:before{
    background:
      linear-gradient(90deg,rgba(251,253,255,.92) 0%,rgba(251,253,255,.66) 27%,rgba(251,253,255,.25) 55%,rgba(251,253,255,.05) 100%),
      linear-gradient(180deg,rgba(251,253,255,.24) 0%,rgba(251,253,255,.04) 52%,rgba(251,253,255,.62) 100%)!important;
}

/* Tarjetas limpias: sin sombra, solo borde fino */
body.bt-profile .d-menu,
body.bt-profile .ca{
    background:rgba(255,255,255,.72)!important;
    border:1px solid rgba(202,225,255,.9)!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
}

@media (max-width:768px){
    :root{--btp-body-blend:#fbfdff;}
    body.bt-profile #key > .pg,
    body.bt-profile #key > .pg.us{
        background:var(--btp-body-blend)!important;
        padding-right:0!important;
    }
    body.bt-profile .d-cover:after{
        background:var(--btp-body-blend)!important;
        box-shadow:none!important;
        filter:none!important;
        bottom:-86px!important;
        height:154px!important;
    }
}

@media (max-width:420px){
    body.bt-profile .d-cover:after{
        bottom:-72px!important;
        height:132px!important;
    }
}

/* ==========================================================
   BRINTAGE PERFIL - FIX COLUMNA DERECHA + RESPONSIVE
   2026-07-06
   - perfil vuelve a respetar el mismo panel que Home/Favorite
   - en escritorio NO ocupa hasta el borde del navegador
   - en móvil elimina desbordes horizontales
   ========================================================== */
@media (min-width:769px){
    body.bt-profile #key{
        left:42%!important;
        right:20%!important;
        width:auto!important;
        max-width:none!important;
        transform:none!important;
        -webkit-transform:none!important;
        overflow:hidden!important;
    }
    body.bt-profile #key > .pg,
    body.bt-profile #key > .pg.us{
        left:0!important;
        right:0!important;
        width:auto!important;
        max-width:none!important;
        padding-left:0!important;
        padding-right:0!important;
        overflow-y:auto!important;
        overflow-x:hidden!important;
        scrollbar-gutter:auto!important;
    }
    body.bt-profile .d-dab,
    body.bt-profile .d-cover,
    body.bt-profile .d-menu,
    body.bt-profile .ca,
    body.bt-profile .post{
        max-width:100%!important;
        box-sizing:border-box!important;
    }
}

@media (max-width:768px){
    body.bt-profile,
    body.bt-profile #key,
    body.bt-profile #key > .pg,
    body.bt-profile #key > .pg.us{
        max-width:100vw!important;
        overflow-x:hidden!important;
    }
    body.bt-profile #key{
        left:0!important;
        right:0!important;
        width:100%!important;
        transform:none!important;
        -webkit-transform:none!important;
    }
    body.bt-profile #key > .pg,
    body.bt-profile #key > .pg.us{
        left:0!important;
        right:0!important;
        width:100%!important;
        padding-left:0!important;
        padding-right:0!important;
        box-sizing:border-box!important;
    }
    body.bt-profile .d-dab,
    body.bt-profile .d-cover{
        width:100%!important;
        max-width:100%!important;
        margin-left:0!important;
        margin-right:0!important;
        box-sizing:border-box!important;
    }
    body.bt-profile .d-menu{
        left:7%!important;
        right:7%!important;
        width:auto!important;
        max-width:none!important;
        min-width:0!important;
        box-sizing:border-box!important;
        overflow:hidden!important;
    }
    body.bt-profile .d-menu a{
        flex:1 1 0!important;
        width:auto!important;
        min-width:0!important;
        max-width:none!important;
        box-sizing:border-box!important;
    }
    body.bt-profile .m-text-a{
        font-size:10px!important;
        letter-spacing:.25px!important;
        white-space:nowrap!important;
    }
    body.bt-profile .m-text-b{
        font-size:23px!important;
    }
    body.bt-profile .d-fullname{
        left:8px!important;
        right:8px!important;
        width:auto!important;
        max-width:none!important;
        box-sizing:border-box!important;
        overflow:visible!important;
    }
    body.bt-profile .d-fullname .d-text-a{
        font-size:clamp(32px,9vw,40px)!important;
        line-height:1.08!important;
        white-space:nowrap!important;
    }
    body.bt-profile .bt-name-script{
        letter-spacing:-2px!important;
    }
    body.bt-profile .d-fullname .d-text-b{
        font-size:17px!important;
        gap:10px!important;
    }
    body.bt-profile .d-fullname .d-text-b:before,
    body.bt-profile .d-fullname .d-text-b:after{
        width:54px!important;
    }
    body.bt-profile .ca,
    body.bt-profile .post{
        width:92%!important;
        max-width:92%!important;
        margin-left:auto!important;
        margin-right:auto!important;
        box-sizing:border-box!important;
    }
}

@media (max-width:420px){
    body.bt-profile .d-menu{
        left:4%!important;
        right:4%!important;
    }
    body.bt-profile .d-fullname .d-text-a{
        font-size:32px!important;
        letter-spacing:-1px!important;
    }
    body.bt-profile .d-fullname .d-text-b:before,
    body.bt-profile .d-fullname .d-text-b:after{
        width:42px!important;
    }
}

/* ==========================================================
   BRINTAGE PERFIL - FIX REAL PANEL + SCROLL LATERAL
   2026-07-06
   - #key vuelve al sistema original de Home/Favorite: pantalla completa
     con padding interno para que el contenido viva en la columna derecha.
   - El scrollbar queda pegado al lateral derecho del navegador.
   - El contenido del perfil no se mete sobre la columna izquierda.
   ========================================================== */
@media (min-width:769px){
    body.bt-profile #key{
        position:absolute!important;
        top:var(--bt-app-top,51px)!important;
        bottom:var(--bt-app-bottom,51px)!important;
        left:0!important;
        right:0!important;
        width:auto!important;
        max-width:none!important;
        transform:none!important;
        -webkit-transform:none!important;
        overflow:hidden!important;
        background:transparent!important;
    }

    body.bt-profile #key > .pg,
    body.bt-profile #key > .pg.us,
    body.bt-profile #key.fx169 > .pg,
    body.bt-profile #key.fx169 > .pg.us{
        position:absolute!important;
        top:0!important;
        right:0!important;
        bottom:0!important;
        left:0!important;
        width:auto!important;
        max-width:none!important;
        height:auto!important;
        overflow-y:auto!important;
        overflow-x:hidden!important;
        box-sizing:border-box!important;
        padding-top:8px!important;
        padding-left:42%!important;
        padding-right:0!important;
        padding-bottom:28px!important;
        background:transparent!important;
        scrollbar-gutter:auto!important;
        -webkit-overflow-scrolling:touch!important;
    }

    body.bt-profile .d-dab,
    body.bt-profile .ca,
    body.bt-profile .post{
        width:100%!important;
        max-width:100%!important;
        margin-left:0!important;
        margin-right:0!important;
        box-sizing:border-box!important;
    }

    body.bt-profile .d-cover{
        width:100%!important;
        max-width:100%!important;
        margin-left:0!important;
        margin-right:0!important;
        box-sizing:border-box!important;
    }

    /* La curva se funde con el fondo real de la app, sin halo ni corte */
    body.bt-profile .d-cover:after{
        background:#fbfdff!important;
        box-shadow:none!important;
        filter:none!important;
        opacity:1!important;
    }
    body.bt-profile .d-dab{
        background:#fbfdff!important;
    }
}

@media (max-width:768px){
    body.bt-profile #key{
        left:0!important;
        right:0!important;
        width:auto!important;
        max-width:100vw!important;
        overflow:hidden!important;
        background:transparent!important;
    }
    body.bt-profile #key > .pg,
    body.bt-profile #key > .pg.us{
        padding-left:0!important;
        padding-right:0!important;
        overflow-x:hidden!important;
        background:#fbfdff!important;
    }
    body.bt-profile .d-dab,
    body.bt-profile .d-cover,
    body.bt-profile .ca,
    body.bt-profile .post{
        max-width:100vw!important;
        box-sizing:border-box!important;
    }
    body.bt-profile .d-cover:after{
        background:#fbfdff!important;
        box-shadow:none!important;
        filter:none!important;
    }
}

/* ==========================================================
   BRINTAGE PERFIL - FIX DEFINITIVO SCROLL + FONDO BODY
   2026-07-06
   - El scroller ocupa todo el ancho de #key para que la barra quede
     pegada al borde derecho del navegador.
   - El contenido del perfil se empuja a la columna derecha con padding,
     como Home/Favorites/Users.
   - Body, pg, curva y perfil usan el mismo celeste claro.
   ========================================================== */
:root{--btp-body-blend:#eaf6ff!important;}
html,body{
    background:#fbfdff!important;
    background-color:#fbfdff!important;
    overflow:hidden!important;
}
#key{background:#fbfdff!important;background-color:#fbfdff!important;}

body.bt-profile #key,
body.bt-profile #key.fx169{
    position:absolute!important;
    top:var(--bt-app-top,51px)!important;
    right:0!important;
    bottom:var(--bt-app-bottom,51px)!important;
    left:0!important;
    width:auto!important;
    max-width:none!important;
    overflow:hidden!important;
    background:#fbfdff!important;
    background-color:#fbfdff!important;
}

body.bt-profile #key > .pg,
body.bt-profile #key > .pg.us,
body.bt-profile #key.fx169 > .pg,
body.bt-profile #key.fx169 > .pg.us{
    position:absolute!important;
    top:0!important;
    right:0!important;
    bottom:0!important;
    left:0!important;
    width:auto!important;
    max-width:none!important;
    height:auto!important;
    margin:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    box-sizing:border-box!important;
    background:#fbfdff!important;
    background-color:#fbfdff!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-gutter:auto!important;
}

@media (min-width:769px){
    body.bt-profile #key > .pg,
    body.bt-profile #key > .pg.us,
    body.bt-profile #key.fx169 > .pg,
    body.bt-profile #key.fx169 > .pg.us{
        padding:8px 0 30px 42%!important;
    }
    body.bt-profile .d-dab,
    body.bt-profile .d-cover,
    body.bt-profile .d-menu,
    body.bt-profile .ca,
    body.bt-profile .post{
        width:100%!important;
        max-width:100%!important;
        margin-left:0!important;
        margin-right:0!important;
        box-sizing:border-box!important;
    }
}

@media (max-width:768px){
    body.bt-profile #key > .pg,
    body.bt-profile #key > .pg.us,
    body.bt-profile #key.fx169 > .pg,
    body.bt-profile #key.fx169 > .pg.us{
        padding:0 0 24px 0!important;
        max-width:100vw!important;
    }
}

body.bt-profile #key > .pg,
body.bt-profile #key > .pg.us,
body.bt-profile .d-dab,
body.bt-profile .d-cover{
    background:#fbfdff!important;
    background-color:#fbfdff!important;
}

body.bt-profile .d-cover:after{
    background:#fbfdff!important;
    background-color:#fbfdff!important;
    box-shadow:none!important;
    filter:none!important;
    opacity:1!important;
}

body.bt-profile .d-cover,
body.bt-profile .d-photo,
body.bt-profile .d-menu,
body.bt-profile .ca,
body.bt-profile .d-up-ip .myButton-upload-photos,
body.bt-profile .d-up-ic .myButton-upload-photos{
    box-shadow:none!important;
    filter:none!important;
}


/* ==========================================================
   BRINTAGE PERFIL - MISMA COLUMNA QUE POSTS
   2026-07-06
   El scroller sigue ocupando todo #key para que la barra quede al
   borde derecho del navegador, pero el contenido visual del perfil
   queda encerrado en la misma columna derecha que usan los posts
   (.fx169 .pg: 45% izquierda / 20% derecha).
   ========================================================== */
@media (min-width:769px){
    body.bt-profile #key,
    body.bt-profile #key.fx169{
        position:absolute!important;
        top:var(--bt-app-top,51px)!important;
        right:0!important;
        bottom:var(--bt-app-bottom,51px)!important;
        left:0!important;
        width:auto!important;
        max-width:none!important;
        overflow:hidden!important;
        background:#fbfdff!important;
    }

    body.bt-profile #key > .pg,
    body.bt-profile #key > .pg.us,
    body.bt-profile #key.fx169 > .pg,
    body.bt-profile #key.fx169 > .pg.us{
        position:absolute!important;
        inset:0!important;
        width:auto!important;
        max-width:none!important;
        height:auto!important;
        margin:0!important;
        overflow-y:auto!important;
        overflow-x:hidden!important;
        box-sizing:border-box!important;
        padding-top:8px!important;
        padding-left:45%!important;
        padding-right:20%!important;
        padding-bottom:30px!important;
        background:#fbfdff!important;
        -webkit-overflow-scrolling:touch!important;
        scrollbar-gutter:auto!important;
    }

    body.bt-profile .d-dab,
    body.bt-profile .d-cover,
    body.bt-profile .d-menu,
    body.bt-profile .ca,
    body.bt-profile .post{
        width:100%!important;
        max-width:100%!important;
        margin-left:0!important;
        margin-right:0!important;
        box-sizing:border-box!important;
    }

    body.bt-profile .d-menu{
        left:8%!important;
        right:8%!important;
        width:auto!important;
    }

    body.bt-profile .ca,
    body.bt-profile .post{
        width:100%!important;
        max-width:100%!important;
    }
}

@media (max-width:768px){
    body.bt-profile #key > .pg,
    body.bt-profile #key > .pg.us,
    body.bt-profile #key.fx169 > .pg,
    body.bt-profile #key.fx169 > .pg.us{
        padding-left:0!important;
        padding-right:0!important;
        max-width:100vw!important;
        overflow-x:hidden!important;
    }
}


/* ==========================================================
   BRINTAGE PERFIL - AJUSTE FINAL COLOR + PORTADAS
   2026-07-06
   Fondo vuelve al tono claro suave de la version anterior y la
   imagen de portada deja de ser tapada por el background global.
   ========================================================== */
:root{--btp-body-blend:#fbfdff!important;--bt-bg:#fbfdff!important;}
html,body{
    background:#fbfdff!important;
    background-color:#fbfdff!important;
}
body.bt-profile #key,
body.bt-profile #key.fx169,
body.bt-profile #key > .pg,
body.bt-profile #key > .pg.us,
body.bt-profile #key.fx169 > .pg,
body.bt-profile #key.fx169 > .pg.us{
    background:#fbfdff!important;
    background-color:#fbfdff!important;
}
body.bt-profile .d-dab,
body.bt-profile .d-cover{
    background:#fbfdff!important;
    background-color:#fbfdff!important;
}
body.bt-profile .d-cover:after{
    background:#fbfdff!important;
    background-color:#fbfdff!important;
}
body.bt-profile .d-cover .imge{
    background-color:#eef7ff!important;
    background-repeat:no-repeat!important;
    background-position:center center!important;
    background-size:cover!important;
    filter:saturate(1.04) contrast(.96) brightness(1.08)!important;
    transform:scale(1.01)!important;
}
/* No usar background: ... !important en .d-cover .imge porque pisa la portada cargada por JS. */

/* ==========================================================
   BRINTAGE PERFIL - limpieza final quote/info 2026-07-06
   - Sin marca BRINTAGE fantasma en la tarjeta.
   - Comillas más prolijas.
   - La línea de la portada solo aparece si hay contenido.
   - La tarjeta inferior toma la altura del contenido.
   ========================================================== */
body.bt-profile .ca:after{
    content:none!important;
    display:none!important;
}
body.bt-profile .ca{
    min-height:0!important;
    height:auto!important;
    padding-top:24px!important;
    padding-bottom:24px!important;
}
body.bt-profile .ca:empty{
    display:none!important;
}
body.bt-profile .ca:before{
    top:24px!important;
    bottom:24px!important;
    height:auto!important;
}
body.bt-profile .d-dab:after{
    content:none!important;
    display:none!important;
}
body.bt-profile .d-dab.bt-has-quote:after,
body.bt-profile .d-dab:has(.bt-cover-quote):after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    top:74px!important;
    left:48px!important;
    width:2px!important;
    height:var(--bt-quote-line-h, 215px)!important;
    z-index:4!important;
    opacity:.65!important;
    pointer-events:none!important;
    background:linear-gradient(180deg,rgba(47,132,246,.98),rgba(102,170,247,.55),rgba(47,132,246,.12))!important;
    border-radius:999px!important;
}
body.bt-profile .bt-cover-quote{
    left:84px!important;
    top:62px!important;
    width:250px!important;
    padding-left:0!important;
    max-height:none!important;
    overflow:visible!important;
}
body.bt-profile .bt-quote-mark{
    display:block!important;
    width:54px!important;
    height:28px!important;
    margin:0 0 12px!important;
    font-size:0!important;
    line-height:1!important;
    position:relative!important;
}
body.bt-profile .bt-quote-mark:before,
body.bt-profile .bt-quote-mark:after{
    content:""!important;
    position:absolute!important;
    top:7px!important;
    width:18px!important;
    height:12px!important;
    border-radius:2px!important;
    background:linear-gradient(135deg,#2f84f6,#66aaf7)!important;
    transform:skewX(-20deg)!important;
    box-shadow:0 6px 14px rgba(47,132,246,.22)!important;
}
body.bt-profile .bt-quote-mark:before{left:0!important;}
body.bt-profile .bt-quote-mark:after{left:26px!important;}
body.bt-profile .bt-quote-text{
    display:-webkit-box!important;
    -webkit-line-clamp:6!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
}
@media (max-width: 767px){
    body.bt-profile .d-dab.bt-has-quote:after,
    body.bt-profile .d-dab:has(.bt-cover-quote):after{
        display:none!important;
        content:none!important;
    }
}

/* ==========================================================
   BRINTAGE PERFIL MOBILE - ajuste nombre + quote + linea
   2026-07-06
   ========================================================== */
@media (max-width:768px){
    body.bt-profile .bt-cover-quote{
        display:block!important;
        left:66px!important;
        top:48px!important;
        width:calc(100vw - 92px)!important;
        max-width:300px!important;
        font-size:14px!important;
        line-height:1.42!important;
        max-height:132px!important;
        overflow:hidden!important;
        z-index:6!important;
        text-align:left!important;
    }
    body.bt-profile .bt-quote-mark{
        width:48px!important;
        height:22px!important;
        margin:0 0 8px!important;
    }
    body.bt-profile .bt-quote-mark:before,
    body.bt-profile .bt-quote-mark:after{
        top:5px!important;
        width:16px!important;
        height:11px!important;
        border-radius:3px!important;
        box-shadow:none!important;
    }
    body.bt-profile .bt-quote-mark:after{left:24px!important;}
    body.bt-profile .bt-quote-text{
        -webkit-line-clamp:4!important;
        overflow:hidden!important;
    }
    body.bt-profile .d-dab.bt-has-quote:after,
    body.bt-profile .d-dab:has(.bt-cover-quote):after{
        content:""!important;
        display:block!important;
        position:absolute!important;
        top:58px!important;
        left:48px!important;
        width:2px!important;
        height:118px!important;
        z-index:5!important;
        opacity:.68!important;
        pointer-events:none!important;
        background:linear-gradient(180deg,rgba(47,132,246,.95),rgba(102,170,247,.52),rgba(47,132,246,.08))!important;
        border-radius:999px!important;
    }
    body.bt-profile .d-dab:not(.bt-has-quote):after{
        content:none!important;
        display:none!important;
    }
    body.bt-profile .d-fullname{
        top:288px!important;
    }
}

@media (max-width:420px){
    body.bt-profile .bt-cover-quote{
        display:block!important;
        left:66px!important;
        top:47px!important;
        width:calc(100vw - 86px)!important;
        font-size:14px!important;
        line-height:1.42!important;
        max-height:126px!important;
    }
    body.bt-profile .d-dab.bt-has-quote:after,
    body.bt-profile .d-dab:has(.bt-cover-quote):after{
        top:58px!important;
        left:48px!important;
        height:116px!important;
        display:block!important;
        content:""!important;
    }
    body.bt-profile .d-dab:not(.bt-has-quote):after{
        content:none!important;
        display:none!important;
    }
    body.bt-profile .d-fullname{
        top:260px!important;
    }
}

/* ==========================================================
   BRINTAGE PERFIL MOBILE - bajar nombre/usuario
   2026-07-06
   Centra Brian Urigo y @usuario entre la foto y las estadisticas.
   ========================================================== */
@media (max-width:768px){
    body.bt-profile .d-fullname{
        top:326px!important;
    }
}
@media (max-width:420px){
    body.bt-profile .d-fullname{
        top:298px!important;
    }
}

/* ==========================================================
   BRINTAGE PERFIL - quote mas a la izquierda + barra proporcional
   2026-07-06
   ========================================================== */
body.bt-profile .d-dab:after,
body.bt-profile .d-dab.bt-has-quote:after,
body.bt-profile .d-dab:has(.bt-cover-quote):after{
    content:none!important;
    display:none!important;
}
body.bt-profile .bt-cover-quote{
    left:48px!important;
    top:62px!important;
    width:286px!important;
    padding-left:24px!important;
    box-sizing:border-box!important;
    position:absolute!important;
}
body.bt-profile .bt-cover-quote:before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:0!important;
    top:0!important;
    width:2px!important;
    height:100%!important;
    min-height:0!important;
    opacity:.68!important;
    pointer-events:none!important;
    background:linear-gradient(180deg,rgba(47,132,246,.95),rgba(102,170,247,.55),rgba(47,132,246,.10))!important;
    border-radius:999px!important;
}
body.bt-profile .bt-cover-quote:empty,
body.bt-profile .d-dab:not(.bt-has-quote) .bt-cover-quote{
    display:none!important;
}
body.bt-profile .d-dab:not(.bt-has-quote) .bt-cover-quote:before{
    content:none!important;
    display:none!important;
}
body.bt-profile .bt-quote-text{
    display:-webkit-box!important;
    -webkit-line-clamp:6!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
}

@media (max-width:768px){
    body.bt-profile .bt-cover-quote{
        left:42px!important;
        top:48px!important;
        width:calc(100vw - 58px)!important;
        max-width:315px!important;
        padding-left:22px!important;
        box-sizing:border-box!important;
        max-height:none!important;
        overflow:hidden!important;
    }
    body.bt-profile .bt-cover-quote:before{
        height:100%!important;
        top:0!important;
        left:0!important;
    }
    body.bt-profile .bt-quote-text{
        -webkit-line-clamp:4!important;
    }
}

@media (max-width:420px){
    body.bt-profile .bt-cover-quote{
        left:42px!important;
        top:47px!important;
        width:calc(100vw - 54px)!important;
        max-width:300px!important;
        padding-left:22px!important;
        max-height:none!important;
    }
}

/* ==========================================================
   BRINTAGE FIX CHAT + SUGERENCIAS - 2026-07-06
   Al abrir un chat en escritorio, #key volvía a cubrir la columna
   izquierda y tapaba visualmente las sugerencias. Dejamos el fondo
   transparente en esa capa y mantenemos las sugerencias visibles.
   Además, el área de mensajes usa el mismo color claro del body.
   Mobile queda intacto.
   ========================================================== */
body.bt-chat #key,
body.bt-chat #window.pg.wtp{
    background:transparent!important;
    background-color:transparent!important;
}

body.bt-chat #window .w-messages,
body.bt-chat #w-messages.w-messages{
    background:#fbfdff!important;
    background-color:#fbfdff!important;
}

@media (min-width:769px){
    body.bt-chat #ads{
        display:block!important;
        visibility:visible!important;
        opacity:1!important;
        z-index:60!important;
    }

    body.bt-chat #ads .rands{
        visibility:visible!important;
    }

    body.bt-chat #key{
        pointer-events:none!important;
    }

    body.bt-chat #window,
    body.bt-chat #window *{
        pointer-events:auto!important;
    }
}

/* ==========================================================
   BRINTAGE PERFIL MOBILE - separación vertical final 2026-07-29
   Baja estadísticas y todo el contenido posterior 18-20 px.
   El nombre y @usuario quedan centrados entre foto y estadísticas.
   ========================================================== */
@media (max-width:768px){
    body.bt-profile .d-dab{
        margin-bottom:82px!important;
    }

    body.bt-profile .d-menu{
        bottom:-64px!important;
    }

    body.bt-profile .d-fullname{
        top:326px!important;
    }
}

@media (max-width:420px){
    body.bt-profile .d-fullname{
        top:298px!important;
    }
}


/* ==========================================================
   BRINTAGE FIX NOTIFICACIONES/MENSAJES VISTOS - 2026-07-06
   Los items ya vistos no deben quedar con caja blanca: se funden
   con el fondo de la app. Los no vistos conservan el celeste.
   ========================================================== */
#notifications .note,
#messages .note{
    background:transparent!important;
    background-color:transparent!important;
    box-shadow:none!important;
}

#notifications .note.bt-unread,
#messages .note.bt-unread{
    background:#F0F8FF!important;
    background-color:#F0F8FF!important;
}

body.bt-messages #key,
body.bt-messages #key > .pg,
body.bt-messages #messages,
body.bt-messages #messages .la,
body.bt-notifications #key,
body.bt-notifications #key > .pg,
body.bt-notifications #notifications{
    background:transparent!important;
    background-color:transparent!important;
}

/* =========================================================
   BRINTAGE - ONLINE RESPONSIVE 3/2
   Márgenes proporcionados y simétricos en cualquier móvil.
   ========================================================= */
#online.pg.us{
    display:block !important;
    width:100% !important;
    padding:24px clamp(14px, 4vw, 24px) 24px !important;
    box-sizing:border-box !important;
    background:transparent !important;
}

#online .on-honey-group{
    width:100% !important;
    max-width:480px !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    gap:26px !important;
    margin:0 auto 30px !important;
    clear:both !important;
}

#online .on-honey-group:last-child{
    margin-bottom:0 !important;
}

#online .on-honey-row{
    display:grid !important;
    align-items:start !important;
    justify-items:center !important;
    box-sizing:border-box !important;
    margin-left:auto !important;
    margin-right:auto !important;
}

#online .on-row-3{
    width:100% !important;
    grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
}

#online .on-row-2{
    width:68% !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
}

#online .on-honey-row > .on-user3,
#online .on-honey-row > .on-user2,
#online .on-honey-row > .zq.on-user3{
    float:none !important;
    width:min(100%, 112px) !important;
    min-width:0 !important;
    max-width:112px !important;
    margin:0 !important;
    display:block !important;
    text-align:center !important;
    transition:transform .18s ease, filter .18s ease !important;
}

#online .on-honey-row > .zq:hover{
    transform:translateY(-2px) scale(1.02) !important;
}

#online .on-pos{
    width:86px !important;
    height:86px !important;
    margin:0 auto !important;
    position:relative !important;
}

#online .on-imge{
    width:86px !important;
    height:86px !important;
    border-radius:50% !important;
    background-size:cover !important;
    background-position:center !important;
}

#online .on-imge.on{
    border:3px solid #4fd063 !important;
    box-shadow:0 0 0 3px rgba(79,208,99,.16), 0 7px 18px rgba(0,0,0,.08) !important;
}

#online .myButton-send{
    right:-4px !important;
    bottom:-3px !important;
    width:28px !important;
    height:28px !important;
    border:3px solid #fff !important;
    box-shadow:0 4px 10px rgba(79,166,248,.25) !important;
}

#online .on-user{
    width:100% !important;
    padding:0 !important;
    margin-top:10px !important;
    color:#7b858f !important;
    font-size:13px !important;
    line-height:18px !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
}

@media (max-width:560px){
    #online.pg.us{
        padding:22px clamp(12px, 3.8vw, 18px) 22px !important;
    }

    #online .on-honey-group{
        gap:25px !important;
        margin-bottom:28px !important;
    }

    #online .on-row-2{
        width:67% !important;
    }

    #online .on-honey-row > .on-user3,
    #online .on-honey-row > .on-user2,
    #online .on-honey-row > .zq.on-user3{
        width:min(100%, 100px) !important;
        max-width:100px !important;
    }

    #online .on-pos,
    #online .on-imge{
        width:74px !important;
        height:74px !important;
    }

    #online .myButton-send{
        right:-4px !important;
        bottom:-4px !important;
        width:25px !important;
        height:25px !important;
    }

    #online .on-user{
        font-size:12px !important;
        margin-top:9px !important;
    }
}

@media (max-width:360px){
    #online.pg.us{
        padding-left:10px !important;
        padding-right:10px !important;
    }

    #online .on-pos,
    #online .on-imge{
        width:70px !important;
        height:70px !important;
    }
}



/* ==========================================================
   BRINTAGE FIX FINAL 2026-07-18
   - Evita doble línea bajo el encabezado/TOP.
   - Evita textos cortados en opciones y perfiles externos.
   ========================================================== */
#bop.bar-top,
.bar-top.ce169{
    border-top:0!important;
    border-bottom:1px solid #e7edf5!important;
    box-shadow:none!important;
}

body:not(.bt-chat) #key,
body:not(.bt-chat) #key > .pg{
    border-top:0!important;
    outline:0!important;
}

/* El primer bloque no vuelve a dibujar una línea pegada al header. */
body:not(.bt-chat) #key > .pg > :first-child,
body:not(.bt-chat) #key .post.zq:first-child{
    border-top-color:transparent!important;
}

/* Opciones: altura por contenido, texto multilínea visible y flecha estable. */
#settings .us-menu .a,
#settings .sb-box,
#settings .pr-box,
.us-menu .a,
.sb-box,
.pr-box{
    min-height:58px!important;
    height:auto!important;
    box-sizing:border-box!important;
    overflow:visible!important;
    white-space:normal!important;
    line-height:1.35!important;
    align-items:center!important;
    padding-right:48px!important;
    word-break:normal!important;
    overflow-wrap:anywhere!important;
}

.us-menu .a > span,
.sb-box .spA,
.sb-box .spB,
.pr-box .spA,
.pr-box .spB{
    max-width:100%!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
}

.us-menu .a img{
    top:50%!important;
    transform:translateY(-50%)!important;
}


/* BRINTAGE FIX OPCIONES DE USUARIO 2026-07-18
   Las acciones del modal no deben heredar estados visuales .fo/.fr/.hd
   del perfil, porque esos estados dejaban filas vacías. */
#mod .p-menu > a.bt,
#box .p-menu > a.bt{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    width:100%!important;
    min-height:0!important;
    height:auto!important;
    margin:0!important;
    padding:15px 18px!important;
    box-sizing:border-box!important;
    line-height:1.35!important;
    color:#27364d!important;
    background:#fff!important;
    text-align:center!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    box-shadow:none!important;
    border-radius:0!important;
}
#mod .p-menu > a.bt:first-child,
#box .p-menu > a.bt:first-child{
    border-top:1px solid #e7ebf0!important;
}
#mod .p-menu > a.bt:last-child,
#box .p-menu > a.bt:last-child{
    border-radius:0 0 20px 20px!important;
}

/* BRINTAGE — selector "Muéstrame" con identidad visual de género */
#mod .cont.show-pref-modal,
#box .cont.show-pref-modal{
    overflow:hidden!important;
    background:#fff!important;
}

#mod .show-pref-title,
#box .show-pref-title{
    padding:17px 52px!important;
    font-weight:700!important;
    color:#172033!important;
    border-bottom:1px solid #e6edf5!important;
}

#mod .show-pref-menu,
#box .show-pref-menu{
    display:flex!important;
    flex-direction:column!important;
    gap:10px!important;
    padding:14px 16px 18px!important;
    background:#fff!important;
    box-sizing:border-box!important;
}

#mod .show-pref-menu > a.show-pref-option,
#box .show-pref-menu > a.show-pref-option{
    display:flex!important;
    align-items:center!important;
    width:100%!important;
    min-height:54px!important;
    padding:8px 13px!important;
    margin:0!important;
    border:1px solid #dfe8f2!important;
    border-radius:13px!important;
    box-sizing:border-box!important;
    background:#fff!important;
    color:#536176!important;
    text-align:left!important;
    line-height:1.2!important;
    transition:border-color .18s ease, background-color .18s ease, transform .18s ease!important;
}

#mod .show-pref-menu > a.show-pref-option:first-child,
#box .show-pref-menu > a.show-pref-option:first-child{
    border-top:1px solid #ffd3e6!important;
}

#mod .show-pref-menu > a.show-pref-option:last-child,
#box .show-pref-menu > a.show-pref-option:last-child{
    border-radius:13px!important;
}

#mod .show-pref-option .show-pref-icon,
#box .show-pref-option .show-pref-icon{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    flex:0 0 36px!important;
    width:36px!important;
    height:36px!important;
    margin-right:12px!important;
    border-radius:50%!important;
    font-size:27px!important;
    font-family:Arial, sans-serif!important;
    font-weight:400!important;
    line-height:1!important;
}

#mod .show-pref-option .show-pref-label,
#box .show-pref-option .show-pref-label{
    flex:1 1 auto!important;
    font-size:15px!important;
    font-weight:500!important;
}

#mod .show-pref-option .show-pref-radio,
#box .show-pref-option .show-pref-radio{
    position:relative!important;
    flex:0 0 18px!important;
    width:18px!important;
    height:18px!important;
    margin-left:12px!important;
    border:2px solid #cbd2da!important;
    border-radius:50%!important;
    box-sizing:border-box!important;
    background:#fff!important;
}

#mod .show-pref-option.is-selected .show-pref-radio:after,
#box .show-pref-option.is-selected .show-pref-radio:after{
    content:""!important;
    position:absolute!important;
    inset:3px!important;
    border-radius:50%!important;
    background:currentColor!important;
}

#mod .show-pref-women,
#box .show-pref-women{
    border-color:#ffd3e6!important;
}
#mod .show-pref-women .show-pref-icon,
#box .show-pref-women .show-pref-icon{
    color:#ff79b8!important;
    background:#fff1f7!important;
}
#mod .show-pref-women.is-selected,
#box .show-pref-women.is-selected{
    color:#e95098!important;
    background:#fff8fb!important;
    border-color:#ffadd2!important;
}

#mod .show-pref-men,
#box .show-pref-men{
    border-color:#cfe9ff!important;
}
#mod .show-pref-men .show-pref-icon,
#box .show-pref-men .show-pref-icon{
    color:#35a9ff!important;
    background:#eef8ff!important;
}
#mod .show-pref-men.is-selected,
#box .show-pref-men.is-selected{
    color:#258fdb!important;
    background:#f7fcff!important;
    border-color:#80c9ff!important;
}

#mod .show-pref-both,
#box .show-pref-both{
    border-color:#e4d7ff!important;
}
#mod .show-pref-both .show-pref-icon,
#box .show-pref-both .show-pref-icon{
    width:42px!important;
    flex-basis:42px!important;
    color:#8b62dd!important;
    background:#f5f0ff!important;
    font-size:21px!important;
}
#mod .show-pref-both.is-selected,
#box .show-pref-both.is-selected{
    color:#7651c8!important;
    background:#fbf9ff!important;
    border-color:#c6aff6!important;
}
#mod .show-pref-pair,
#box .show-pref-pair{
    letter-spacing:-7px!important;
    transform:translateX(-3px)!important;
}

@media (hover:hover){
    #mod .show-pref-menu > a.show-pref-option:hover,
    #box .show-pref-menu > a.show-pref-option:hover{
        transform:translateY(-1px)!important;
    }
}

/* ==========================================================
   BRINTAGE - COMENTARIOS: barra inferior y espacio de scroll
   2026-07-19
   El espacio inferior se aplica solo a la vista completa, nunca
   a cada comentario individual.
   ========================================================== */

/* Restaurar el espaciado natural de cada fila. */
.comment,
.commentary{
    padding-bottom:0!important;
}

/* Reservar únicamente el alto de la barra para que el último
   comentario pueda desplazarse completamente por encima de ella. */
#comments,
#comment,
#answer{
    padding-bottom:78px!important;
    box-sizing:border-box!important;
}

/* Barra de escritura alineada con la columna de contenido. */
#comments .cs-bottom,
#comment .cs-bottom,
#answer .cs-bottom{
    min-height:60px!important;
    height:auto!important;
    margin:0!important;
    padding:0 54px 0 58px!important;
    box-sizing:border-box!important;
    display:flex!important;
    align-items:center!important;
    background:#fff!important;
    border:1px solid #e4eaf2!important;
    border-bottom:0!important;
    border-radius:12px 12px 0 0!important;
    box-shadow:0 -4px 16px rgba(15,23,42,.05)!important;
    z-index:50!important;
}

/* Foto de perfil centrada verticalmente. */
#comments .cs-imge,
#comment .cs-imge,
#answer .cs-imge{
    left:14px!important;
    top:50%!important;
    bottom:auto!important;
    width:35px!important;
    height:35px!important;
    transform:translateY(-50%)!important;
}

/* Campo sin separación duplicada: la barra ya reserva el lugar
   correspondiente a la foto y al botón de envío. */
#comments .cs-box,
#comment .cs-box,
#answer .cs-box{
    width:100%!important;
    min-height:58px!important;
    max-height:100px!important;
    margin:0!important;
    padding:18px 0 16px!important;
    box-sizing:border-box!important;
    line-height:1.35!important;
    align-self:center!important;
}

/* Botón centrado verticalmente, igual que en el chat. */
#comments .cs-send,
#comment .cs-send,
#answer .cs-send{
    right:14px!important;
    top:50%!important;
    bottom:auto!important;
    transform:translateY(-50%)!important;
}

/* Escritorio: respetar exactamente la columna derecha del layout. */
@media (min-width:769px){
    #comments .cs-bottom.fixed-wbx,
    #comment .cs-bottom.fixed-wbx,
    #answer .cs-bottom.fixed-wbx{
        left:45%!important;
        right:20%!important;
        width:auto!important;
        margin:0!important;
    }
}

/* Mobile/tablet: margen lateral pequeño y simétrico. */
@media (max-width:768px){
    #comments,
    #comment,
    #answer{
        padding-bottom:76px!important;
    }

    #comments .cs-bottom,
    #comment .cs-bottom,
    #answer .cs-bottom{
        left:12px!important;
        right:12px!important;
        width:auto!important;
        margin:0!important;
    }
}

/* ==========================================================
   BRINTAGE - AJUSTE FINAL COMENTARIOS 2026-07-19
   - Separación avatar/texto idéntica al chat.
   - Espaciador real al final del scroll para que ningún comentario
     quede debajo de la barra fija.
   ========================================================== */

/* El padding del panel no siempre genera recorrido adicional porque
   la barra es fixed. Este pseudo-elemento sí forma parte del flujo y
   crea espacio desplazable después del último comentario. */
#comments::after,
#comment::after,
#answer::after{
    content:""!important;
    display:block!important;
    clear:both!important;
    width:100%!important;
    height:92px!important;
    min-height:92px!important;
    pointer-events:none!important;
}

/* Evitar sumar dos reservas inferiores. El espacio efectivo lo aporta
   el pseudo-elemento anterior. */
#comments,
#comment,
#answer{
    padding-bottom:0!important;
}

/* Igualar la geometría horizontal del chat:
   avatar a 15px, 35px de ancho y unos 22px libres antes del texto. */
#comments .cs-bottom,
#comment .cs-bottom,
#answer .cs-bottom{
    padding-left:72px!important;
    padding-right:54px!important;
}

#comments .cs-imge,
#comment .cs-imge,
#answer .cs-imge{
    left:15px!important;
}

/* El editable comienza exactamente donde termina la reserva de la
   barra, sin márgenes ni padding laterales adicionales. */
#comments .cs-box,
#comment .cs-box,
#answer .cs-box{
    margin-left:0!important;
    padding-left:0!important;
    text-indent:0!important;
}

@media (max-width:768px){
    #comments::after,
    #comment::after,
    #answer::after{
        height:88px!important;
        min-height:88px!important;
    }
}

/* ==========================================================
   BRINTAGE - RESPUESTAS Y FECHAS DE COMENTARIOS
   2026-07-24
   La referencia de respuesta ocupa una fila propia sobre el
   editor y todas las fechas usan el mismo gris de metadatos.
   ========================================================== */

/* El contenedor fijo tiene dos filas: referencia (si existe)
   y, debajo, avatar + editor + envío. */
#comments .cs-bottom,
#comment .cs-bottom,
#answer .cs-bottom{
    display:block!important;
    padding:0!important;
    overflow:hidden!important;
}

#comments .cs-reply-slot:empty,
#comment .cs-reply-slot:empty,
#answer .cs-reply-slot:empty{
    display:none!important;
}

#comments .cs-reply-slot,
#comment .cs-reply-slot,
#answer .cs-reply-slot{
    display:block;
    width:100%;
}

#comments .cs-reply,
#comment .cs-reply,
#answer .cs-reply{
    position:relative!important;
    width:100%!important;
    min-height:38px!important;
    margin:0!important;
    padding:10px 46px 9px 16px!important;
    box-sizing:border-box!important;
    background:#f0f2f5!important;
    border-bottom:1px solid #e1e6ed!important;
    color:#6f7783!important;
    line-height:19px!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
}

#comments .cs-reply .cs-tag,
#comment .cs-reply .cs-tag,
#answer .cs-reply .cs-tag{
    color:#336699!important;
    font-weight:600!important;
}

#comments .cs-reply .cs-remove,
#comment .cs-reply .cs-remove,
#answer .cs-reply .cs-remove{
    top:50%!important;
    right:16px!important;
    width:15px!important;
    height:15px!important;
    transform:translateY(-50%)!important;
    cursor:pointer!important;
}

#comments .cs-input-row,
#comment .cs-input-row,
#answer .cs-input-row{
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    width:100%!important;
    min-height:60px!important;
    padding:0 54px 0 72px!important;
    box-sizing:border-box!important;
    background:#fff!important;
}

/* Avatar y envío se centran respecto de la fila del editor,
   nunca respecto del bloque completo de respuesta. */
#comments .cs-input-row .cs-imge,
#comment .cs-input-row .cs-imge,
#answer .cs-input-row .cs-imge,
#comments .cs-input-row .cs-send,
#comment .cs-input-row .cs-send,
#answer .cs-input-row .cs-send{
    top:50%!important;
    bottom:auto!important;
    transform:translateY(-50%)!important;
}

/* Estado .fo y clases de tema ya no pueden volver negra una fecha. */
#comments .c-datime,
#comment .c-datime,
#answer .c-datime,
#comments .comment.fo .c-datime,
#comment .comment.fo .c-datime,
#answer .comment.fo .c-datime{
    color:#949494!important;
    opacity:1!important;
    font-weight:400!important;
}

/* La fila extra aumenta el alto real de .zr; zr() actualiza el
   límite del scroll. Se amplía también el espaciador de respaldo. */
#comments:has(.cs-reply)::after,
#comment:has(.cs-reply)::after,
#answer:has(.cs-reply)::after{
    height:132px!important;
    min-height:132px!important;
}

/* ==========================================================
   BRINTAGE CHAT MOBILE — MÁRGENES Y COLAS DEFINITIVOS
   2026-07-23
   - elimina el padding izquierdo heredado de 42px
   - deja 12px útiles y simétricos en ambos laterales
   - conserva la columna del avatar solo dentro del grupo recibido
   - reemplaza la punta triangular por una cola redondeada tipo Messenger
   ========================================================== */
@media (max-width:768px){
    body.bt-chat #window .w-messages,
    body.bt-chat #w-messages.w-messages{
        left:0!important;
        right:0!important;
        width:100%!important;
        padding-left:12px!important;
        padding-right:12px!important;
        box-sizing:border-box!important;
    }

    body.bt-chat #window .w-messages > .zm,
    body.bt-chat #window .w-messages .zm,
    body.bt-chat #w-messages.w-messages > .zm,
    body.bt-chat #w-messages.w-messages .zm{
        width:100%!important;
        max-width:100%!important;
        margin-left:0!important;
        margin-right:0!important;
        padding-left:0!important;
        padding-right:0!important;
        box-sizing:border-box!important;
    }

    body.bt-chat #window .w-messages .w-pos-left,
    body.bt-chat #w-messages.w-messages .w-pos-left{
        padding-left:0!important;
        padding-right:0!important;
        gap:7px!important;
        justify-content:flex-start!important;
    }

    body.bt-chat #window .w-messages .w-pos-right,
    body.bt-chat #w-messages.w-messages .w-pos-right{
        padding-left:0!important;
        padding-right:0!important;
        justify-content:flex-end!important;
    }

    body.bt-chat #window .w-messages .w-bubble-left,
    body.bt-chat #window .w-messages .w-bubble-right,
    body.bt-chat #w-messages.w-messages .w-bubble-left,
    body.bt-chat #w-messages.w-messages .w-bubble-right{
        max-width:78%!important;
    }

    body.bt-chat #window .w-messages .w-pos-left .w-bubble-left,
    body.bt-chat #w-messages.w-messages .w-pos-left .w-bubble-left{
        max-width:calc(78% - 37px)!important;
    }
}

/* Quitar la punta triangular anterior. */
#window .w-pos-right.chat-group-end .w-bubble-right::after,
#window .w-pos-right.chat-group-single .w-bubble-right::after,
#window .w-pos-left.chat-group-end .w-bubble-left::after,
#window .w-pos-left.chat-group-single .w-bubble-left::after{
    clip-path:none!important;
}

/* Última viñeta enviada: esquina compacta y cola redondeada. */
#window .w-pos-right.chat-group-end .w-bubble-right,
#window .w-pos-right.chat-group-single .w-bubble-right{
    border-bottom-right-radius:5px!important;
}

#window .w-pos-right.chat-group-end .w-bubble-right::after,
#window .w-pos-right.chat-group-single .w-bubble-right::after{
    content:""!important;
    position:absolute!important;
    right:-5px!important;
    bottom:0!important;
    width:10px!important;
    height:11px!important;
    background:#4fa6f8!important;
    border-bottom-left-radius:10px!important;
    z-index:-1!important;
}

#window .w-pos-right.chat-group-end .w-bubble-right::before,
#window .w-pos-right.chat-group-single .w-bubble-right::before{
    content:""!important;
    position:absolute!important;
    right:-9px!important;
    bottom:-1px!important;
    width:8px!important;
    height:13px!important;
    background:#fbfdff!important;
    border-bottom-left-radius:9px!important;
    z-index:0!important;
}

/* Última viñeta recibida: espejo exacto de la enviada. */
#window .w-pos-left.chat-group-end .w-bubble-left,
#window .w-pos-left.chat-group-single .w-bubble-left{
    border-bottom-left-radius:5px!important;
}

#window .w-pos-left.chat-group-end .w-bubble-left::after,
#window .w-pos-left.chat-group-single .w-bubble-left::after{
    content:""!important;
    position:absolute!important;
    left:-5px!important;
    bottom:0!important;
    width:10px!important;
    height:11px!important;
    background:#f0f2f5!important;
    border-bottom-right-radius:10px!important;
    z-index:-1!important;
}

#window .w-pos-left.chat-group-end .w-bubble-left::before,
#window .w-pos-left.chat-group-single .w-bubble-left::before{
    content:""!important;
    position:absolute!important;
    left:-9px!important;
    bottom:-1px!important;
    width:8px!important;
    height:13px!important;
    background:#fbfdff!important;
    border-bottom-right-radius:9px!important;
    z-index:0!important;
}

/* ==========================================================
   BRINTAGE CHAT MOBILE - ADJUNTOS SIMETRICOS + COLA LIMPIA
   2026-07-23
   ========================================================== */
@media (max-width:768px){
    /* La galería ocupa el ancho del input, pero conserva 12px reales
       de margen dentro del contenedor inferior. */
    body.bt-chat #window .w-bottom .cp-imgs{
        display:flex!important;
        align-items:center!important;
        gap:10px!important;
        width:auto!important;
        min-width:0!important;
        margin:0 -58px!important;
        padding:12px!important;
        box-sizing:border-box!important;
        overflow-x:auto!important;
        overflow-y:hidden!important;
        float:none!important;
        clear:both!important;
        -webkit-overflow-scrolling:touch!important;
        scrollbar-width:none!important;
    }

    body.bt-chat #window .w-bottom .cp-imgs::-webkit-scrollbar{
        display:none!important;
    }

    body.bt-chat #window .w-bottom .cp-imgs .ig{
        flex:0 0 80px!important;
        width:80px!important;
        height:80px!important;
        margin:0!important;
        float:none!important;
        box-sizing:border-box!important;
        border-radius:0!important;
        overflow:hidden!important;
    }

    /* Las X quedan completamente contenidas en cada miniatura. */
    body.bt-chat #window .w-bottom .cp-imgs .ig a{
        top:5px!important;
        right:5px!important;
    }

    /* Dejar espacio útil para la cola sin que toque ni sea cortada
       por el borde lateral del área desplazable. */
    body.bt-chat #window .w-messages .w-pos-right{
        padding-right:5px!important;
        overflow:visible!important;
    }

    body.bt-chat #window .w-messages .w-pos-left{
        padding-left:5px!important;
        overflow:visible!important;
    }

    /* Eliminar la máscara clara que producía la raya vertical. */
    body.bt-chat #window .w-pos-right.chat-group-end .w-bubble-right::before,
    body.bt-chat #window .w-pos-right.chat-group-single .w-bubble-right::before,
    body.bt-chat #window .w-pos-left.chat-group-end .w-bubble-left::before,
    body.bt-chat #window .w-pos-left.chat-group-single .w-bubble-left::before{
        content:none!important;
        display:none!important;
    }

    /* Cola compacta, redondeada y ubicada dentro del margen lateral. */
    body.bt-chat #window .w-pos-right.chat-group-end .w-bubble-right::after,
    body.bt-chat #window .w-pos-right.chat-group-single .w-bubble-right::after{
        right:-4px!important;
        bottom:0!important;
        width:9px!important;
        height:10px!important;
        background:#4fa6f8!important;
        border-radius:0 0 0 9px!important;
        z-index:0!important;
        clip-path:none!important;
    }

    body.bt-chat #window .w-pos-left.chat-group-end .w-bubble-left::after,
    body.bt-chat #window .w-pos-left.chat-group-single .w-bubble-left::after{
        left:-4px!important;
        bottom:0!important;
        width:9px!important;
        height:10px!important;
        background:#f0f2f5!important;
        border-radius:0 0 9px 0!important;
        z-index:0!important;
        clip-path:none!important;
    }

    body.bt-chat #window .w-bubble-left,
    body.bt-chat #window .w-bubble-right{
        isolation:isolate!important;
        overflow:visible!important;
    }
}

/* ==========================================================
   BRINTAGE AJUSTE FINAL CHAT - 2026-07-23
   - Sin espacio superior cuando no hay adjuntos
   - Adjuntos con margen interno simetrico en mobile y fixed
   - Ultima viñeta con esquina cuadrada, sin cola artificial
   ========================================================== */

/* Un contenedor de adjuntos vacio no debe ocupar alto ni generar margen. */
body.bt-chat #window .w-bottom .cp-imgs:empty,
body.bt-chat #window .w-bottom .cp-imgs:not(:has(.ig)){
    display:none!important;
    height:0!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
}

/* Al existir imagenes, conservar el mismo margen interno en ambos lados. */
body.bt-chat #window .w-bottom .cp-imgs:not(:empty){
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
    width:auto!important;
    min-width:0!important;
    margin:0 -58px!important;
    padding:12px!important;
    box-sizing:border-box!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    float:none!important;
    clear:both!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
}

body.bt-chat #window .w-bottom .cp-imgs:not(:empty)::-webkit-scrollbar{
    display:none!important;
}

body.bt-chat #window .w-bottom .cp-imgs:not(:empty) .ig{
    flex:0 0 80px!important;
    width:80px!important;
    height:80px!important;
    margin:0!important;
    float:none!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
}

/* Punta simple: esquina inferior cuadrada y ningun pseudo-elemento. */
body.bt-chat #window .w-pos-right.chat-group-end .w-bubble-right,
body.bt-chat #window .w-pos-right.chat-group-single .w-bubble-right{
    border-bottom-right-radius:0!important;
}

body.bt-chat #window .w-pos-right.chat-group-end .w-bubble-right::before,
body.bt-chat #window .w-pos-right.chat-group-single .w-bubble-right::before,
body.bt-chat #window .w-pos-right.chat-group-end .w-bubble-right::after,
body.bt-chat #window .w-pos-right.chat-group-single .w-bubble-right::after{
    content:none!important;
    display:none!important;
}

/* ==========================================================
   BRINTAGE ULTIMO DETALLE CHAT - 2026-07-23
   Ultimo mensaje recibido: solo esquina inferior izquierda
   cuadrada. Sin cola, cuadrado ni pseudo-elementos.
   ========================================================== */
body.bt-chat #window .w-pos-left.chat-group-end .w-bubble-left,
body.bt-chat #window .w-pos-left.chat-group-single .w-bubble-left{
    border-bottom-left-radius:0!important;
}

body.bt-chat #window .w-pos-left.chat-group-end .w-bubble-left::before,
body.bt-chat #window .w-pos-left.chat-group-single .w-bubble-left::before,
body.bt-chat #window .w-pos-left.chat-group-end .w-bubble-left::after,
body.bt-chat #window .w-pos-left.chat-group-single .w-bubble-left::after{
    content:none!important;
    display:none!important;
    width:0!important;
    height:0!important;
    background:transparent!important;
}

/* ==========================================================
   BRINTAGE NOTIFICACIONES - ALINEACION Y ALTURAS UNIFORMES
   2026-07-23
   ========================================================== */
body.bt-notifications #notifications{
    width:100%!important;
    box-sizing:border-box!important;
    padding:8px 0 24px!important;
}

body.bt-notifications #notifications .note{
    width:100%!important;
    min-height:76px!important;
    padding:12px 16px!important;
    margin:0!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
}

body.bt-notifications #notifications .n-int{
    display:grid!important;
    grid-template-columns:52px minmax(0,1fr)!important;
    column-gap:12px!important;
    align-items:center!important;
    width:100%!important;
    min-height:52px!important;
}

body.bt-notifications #notifications .n-int-imge{
    float:none!important;
    width:52px!important;
    height:52px!important;
    margin:0!important;
    align-self:center!important;
    border-radius:50%!important;
    background-position:center!important;
    background-size:cover!important;
    flex:none!important;
}

body.bt-notifications #notifications .n-int-table{
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
}

body.bt-notifications #notifications .n-int-middle{
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    width:100%!important;
    min-width:0!important;
    min-height:52px!important;
    padding:0!important;
    box-sizing:border-box!important;
}

body.bt-notifications #notifications .i-nb{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    line-height:1.25!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
}

body.bt-notifications #notifications .datime{
    position:static!important;
    display:block!important;
    width:auto!important;
    margin:3px 0 0!important;
    padding:0!important;
    line-height:1.2!important;
    text-align:left!important;
}

body.bt-notifications #notifications .n-reques{
    position:static!important;
    display:flex!important;
    align-items:center!important;
    flex-wrap:wrap!important;
    gap:8px!important;
    width:100%!important;
    max-width:100%!important;
    margin:7px 0 1px!important;
    padding:0!important;
    box-sizing:border-box!important;
}

body.bt-notifications #notifications .n-reques .sol{
    display:block!important;
    margin:0!important;
    padding:0!important;
    line-height:1.25!important;
}

body.bt-notifications #notifications .n-reques a{
    margin:0!important;
}

body.bt-notifications #notifications .n-cl{
    top:50%!important;
    right:16px!important;
    transform:translateY(-50%)!important;
}

body.bt-notifications #notifications .note:has(.n-cl) .n-int-table{
    padding-right:62px!important;
    box-sizing:border-box!important;
}

@media (max-width:768px){
    body.bt-notifications #notifications .note{
        min-height:72px!important;
        padding:10px 14px!important;
    }

    body.bt-notifications #notifications .n-int{
        grid-template-columns:46px minmax(0,1fr)!important;
        column-gap:11px!important;
        min-height:50px!important;
    }

    body.bt-notifications #notifications .n-int-imge{
        width:46px!important;
        height:46px!important;
    }

    body.bt-notifications #notifications .n-int-middle{
        min-height:50px!important;
    }

    body.bt-notifications #notifications .i-nb{
        font-size:16px!important;
    }

    body.bt-notifications #notifications .datime,
    body.bt-notifications #notifications .n-reques .sol{
        font-size:14px!important;
    }
}

/* ==========================================================
   BRINTAGE NOTIFICACIONES - CONTENIDO ADAPTABLE REAL
   Cada fila crece solo según su contenido. Avatar fijo a la
   izquierda y todo el contenido alineado a su derecha.
   ========================================================== */
#notifications{
    width:100%!important;
    padding:8px 0 24px!important;
    box-sizing:border-box!important;
}

#notifications .note{
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    padding:12px 16px!important;
    box-sizing:border-box!important;
    overflow:visible!important;
    clear:both!important;
}

#notifications .n-int{
    position:relative!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:flex-start!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    gap:12px!important;
    box-sizing:border-box!important;
}

#notifications .n-int-imge{
    position:relative!important;
    display:block!important;
    float:none!important;
    flex:0 0 46px!important;
    width:46px!important;
    height:46px!important;
    margin:0!important;
    border-radius:50%!important;
    align-self:flex-start!important;
    background-position:center!important;
    background-size:cover!important;
}

#notifications .n-int-table{
    position:relative!important;
    display:block!important;
    flex:1 1 auto!important;
    width:auto!important;
    min-width:0!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    box-sizing:border-box!important;
}

#notifications .n-int-middle{
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:flex-start!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    box-sizing:border-box!important;
}

#notifications .i-nb{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
    line-height:1.28!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    overflow-wrap:anywhere!important;
}

#notifications .n-reques{
    position:relative!important;
    display:flex!important;
    flex-wrap:wrap!important;
    align-items:center!important;
    width:auto!important;
    max-width:100%!important;
    height:auto!important;
    margin:9px 0 0!important;
    padding:0!important;
    gap:8px!important;
    box-sizing:border-box!important;
}

#notifications .n-reques a{
    margin:0!important;
}

#notifications .n-reques .sol{
    display:block!important;
    margin:0!important;
    padding:0!important;
    line-height:1.25!important;
}

#notifications .datime{
    position:static!important;
    display:block!important;
    width:auto!important;
    height:auto!important;
    margin:5px 0 0!important;
    padding:0!important;
    line-height:1.2!important;
    text-align:left!important;
}

#notifications .n-cl{
    top:12px!important;
    right:16px!important;
    transform:none!important;
}

#notifications .note:has(.n-cl) .n-int-table{
    padding-right:62px!important;
}

@media (max-width:768px){
    #notifications .note{
        padding:12px 16px!important;
    }

    #notifications .n-int{
        gap:11px!important;
    }
}

/* ==========================================================
   BRINTAGE - CORRECCION DE POSICION DE NOTIFICACIONES DESKTOP
   Mantiene la lista debajo del titulo, dentro de la columna central.
   No modifica la estructura ni la logica de las notificaciones.
   ========================================================== */
@media (min-width:769px){
    #key.fx169 > #notifications.pg.na{
        padding:8px 20% 24px 45%!important;
        box-sizing:border-box!important;
    }
}

@media (max-width:768px){
    #key > #notifications.pg.na{
        padding:8px 0 24px!important;
        box-sizing:border-box!important;
    }
}

/* ==========================================================
   BRINTAGE - BOTON SIGUIENDO Y CONFIRMACION
   Compatible con mouse, pantallas tactiles y Android WebView.
   ========================================================== */
.br-following-button{
    position:relative!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-width:126px!important;
    white-space:nowrap!important;
    cursor:pointer!important;
    touch-action:manipulation;
    -webkit-tap-highlight-color:transparent;
}

.br-following-button .br-following-label{
    display:inline!important;
    pointer-events:none!important;
}

/* El cambio de texto se limita a dispositivos con hover real.
   En celulares y WebView el botón sigue diciendo "Siguiendo". */
@media (hover:hover) and (pointer:fine){
    .br-following-button:hover{
        background:#fff2f4!important;
        background-image:none!important;
        color:#e02f4f!important;
        border-color:#ffc8d1!important;
        box-shadow:none!important;
    }

    .br-following-button:hover .br-following-label{
        display:none!important;
    }

    .br-following-button:hover::after{
        content:attr(data-unfollow-label);
        display:inline;
        color:inherit;
        font:inherit;
    }
}

#mod .cont.br-unfollow-confirm{
    width:500px!important;
    max-width:calc(100vw - 24px)!important;
    border-radius:22px!important;
    overflow:hidden!important;
    background:#fff!important;
}

#mod .br-unfollow-confirm .p-title{
    margin:0!important;
    padding:18px 52px 16px!important;
    box-sizing:border-box!important;
    border-bottom:1px solid #e7ebf0!important;
    color:#172033!important;
    font-weight:700!important;
    line-height:1.35!important;
}

#mod .br-unfollow-confirm > .ace,
#mod .br-unfollow-confirm > .del{
    display:block!important;
    width:100%!important;
    margin:0!important;
    padding:16px 18px!important;
    box-sizing:border-box!important;
    background:#fff!important;
    border-radius:0!important;
    line-height:1.25!important;
    text-decoration:none!important;
}

#mod .br-unfollow-confirm > .ace{
    color:#2f84f6!important;
    border-bottom:1px solid #e7ebf0!important;
}

#mod .br-unfollow-confirm > .del{
    color:#ff304f!important;
    border-radius:0 0 22px 22px!important;
}

#mod .br-unfollow-confirm > .ace:hover,
#mod .br-unfollow-confirm > .del:hover{
    background:#f8fafc!important;
}

@media (max-width:768px){
    #mod .cont.br-unfollow-confirm{
        width:calc(100% - 24px)!important;
        max-width:500px!important;
    }
}
