/* ==========================================================================
 * Comunidad — perfil, feed y directorio. Interpretación de la referencia
 * visual aprobada: portada de concierto en blanco y negro con borde de
 * papel rasgado, recortes de color, nota manuscrita, avatar superpuesto,
 * estadísticas y pestañas; tarjetas blancas sobre blanco roto.
 * Requiere comunidad-base.css.
 * ========================================================================== */

.comunidad {
	background: var(--indf-blanco-roto);
	padding-bottom: 64px;
}

/* --------------------------------------------------------------------------
 * Portada (Theme 1.16.3): papel rasgado orgánico y collage
 *
 * Tres capas, como en la referencia aprobada: la foto de concierto con su
 * borde inferior rasgado, una tira de papel claro debajo con OTRO rasgado
 * (el "blanco" que asoma bajo la foto) y recortes de color pegados encima,
 * fuera de la máscara para que puedan montar sobre el borde. Las siluetas
 * salen de herramientas/generar-rasgados.js (deterministas).
 * -------------------------------------------------------------------------- */

.perfil-cabecera {
	position: relative;
	--portada-h: 210px;
	--rasgado-foto: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 100' preserveAspectRatio='none'%3E%3Cpolygon points='0,0 1000,0 995.9,89.4 986.1,88.4 975.4,88.3 966.4,88 961.1,86.9 955.9,87.7 949.8,87.2 947,88.5 941.9,88.5 938.4,89 932.1,88.5 928.5,91.3 925.6,88.4 916.8,88.5 911.5,88.8 905.1,90.5 901.3,91.4 898.8,92.1 892.2,91.8 888.4,90.6 882.4,90.7 876.9,91.3 872.8,91.6 863.4,92.7 857.5,93.4 852.2,96.6 847.9,93.4 843.7,92.3 839.4,93.7 835.9,92 832.7,90.5 821.8,90.6 814.9,90.8 811.3,91.7 801.1,91.8 795.7,91.7 787.6,90.7 780.2,90.8 769.6,89.1 767.1,90.2 765,89.2 760.8,89.9 758.5,89 755.2,92.1 752.6,89.5 743.9,89.3 733.1,83.6 722.6,89 719.2,88.1 712.2,88.9 710.2,89.8 705.6,87.7 698.8,87.3 689.2,86.7 683.7,87.9 675.2,88.3 665.2,88.1 662.4,88 659.7,89.8 652.3,88.5 649.4,91.5 647.1,89.1 641.5,90 638.8,89.9 634.6,90.9 628.7,90.5 619,92.1 610.6,91.4 607,90.8 602.1,86.9 593.1,91.4 589.5,92.1 586.3,93 581.8,88.8 577.2,92.4 574.9,92.9 569.3,86.1 559.5,92.2 549.7,92.2 543.4,92.3 539.3,93.4 533,93.4 529.2,93.4 521.5,92.1 517.3,92.3 514.2,92.1 503.6,91.1 495.2,91.1 487.1,89.8 483.8,88.7 480.9,89.6 470.5,89.1 467.6,82.5 462.5,90.8 455.1,91.9 446.3,86.8 436,91.9 428.9,90.9 419.6,92.5 412.9,92.5 405.5,93.3 396.1,92.4 387.7,92.1 384.4,91.6 379.7,92 371.8,92 362.8,91.6 351.9,92.3 343.7,91.6 341.1,90 335.1,85.7 332.7,91.5 322.3,90.9 316.5,91.6 314.2,91.2 307.6,89.8 296.7,89.9 294.3,90.5 288.8,92.6 284.3,89.5 280.6,88 273.6,89.7 263.7,89.4 261.8,92.9 260.2,90.5 257.2,89.7 253.4,91.1 242.8,91.4 235,91.3 230.5,91.2 219.8,90.8 213.8,89.2 204.4,88.8 193.7,88.1 191.8,90.4 190.3,88.1 180.6,86.9 176.7,87.5 174.1,83.6 170.9,87.6 168.5,89.7 163.7,89.9 152.8,89.9 148.2,92.6 144.4,90.3 133.7,90.3 125.5,91.7 117.4,90.4 109.3,90.8 105.7,90.7 99.5,84.9 93.2,89.9 90.6,88.8 81.6,89.4 75.5,89.1 69.5,88.3 61.2,88.1 51,87.6 44.9,83.3 38.8,87.8 33.9,88.1 24,88.5 17.1,87.8 7.1,87.2 0,88.5' fill='white'/%3E%3C/svg%3E");
	--rasgado-papel: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 100' preserveAspectRatio='none'%3E%3Cpolygon points='0,0 1000,0 995.8,93.6 986.4,93.8 982.3,93.2 978.2,93.4 972.4,93.8 966.6,93.4 956.9,93.4 947.2,92.9 944.6,92.9 941.3,92.9 934.2,91.9 931.6,91.9 929.2,87.6 923.5,88.2 918.8,91.2 908.3,91.9 902.7,91.7 898.2,91.8 891.5,91.2 881.9,91.4 878.8,91.2 871.2,91.3 865.7,91.3 858.2,88.2 852.3,92.1 845,92.4 835.4,92.6 829.9,92.7 821.2,92 816.3,91.7 813.9,91.9 809.7,90.7 802,92.6 791.1,92.5 788.3,93.1 786.2,93.6 782.9,93.5 772.5,94.2 769.7,94.2 761.2,94.6 755.7,93.7 752.3,92.9 748.6,92.7 740.6,92.1 735.9,91.8 728.5,91.3 718.6,87.4 717.1,93.4 716,91.7 705.1,91.6 695.4,91.9 692.1,91.5 687.8,91.6 685.3,91.7 682.2,92 674.7,91.8 666,91.6 656.7,88.7 654.1,91.6 645.9,91.9 643.2,92.2 638.8,92.6 629.3,92.6 618.9,92.8 611,92.7 600.7,93.1 598.7,92.7 596.3,92.4 590.2,89.8 581.5,92.5 573.7,92.1 564.1,92.4 559.2,92.7 551.8,92.6 544.4,92.8 539.8,93.1 530.7,92.8 528.3,93 520.1,93.3 517.6,93.5 509.7,93.1 504.7,93.8 501.8,93.7 499.7,93.7 493.2,94.2 484.1,94.1 479.4,94.1 470.1,93.3 463.2,92.5 458.7,92 456.6,92 452.3,92.4 443.1,92.3 432.6,92.7 426.3,93 423.8,92.2 418.1,93.1 408,93.5 400,93.1 394.9,92.2 388.4,92.5 384.3,91.8 379.9,92 377.1,92.5 374.9,92.5 367.4,92.5 358.3,92.5 347.3,89.2 342.1,89.3 335.6,92.5 325.9,92.6 316.2,92.9 307.8,93.2 301.6,93.4 293,93.2 289.4,93.7 282,94.3 277.4,94.4 270.6,94.7 261.6,93.8 252.5,93.5 242.2,93 234.2,93.5 228.1,93.6 219.2,92.9 216.5,93.9 214.3,92.6 204.7,92.9 194.4,92 187.2,91.8 182.3,91.4 178.3,91.9 174.4,91.9 166.1,92.1 158.9,92.1 156.7,91.9 146.2,92.8 139.7,93.1 135.6,93.1 133.4,93 124.5,92.8 117.1,92.5 106.6,92.9 95.7,92.6 85.9,92.7 78.9,91.7 74.8,89 69.9,93.2 60.3,92.6 50.5,92.1 40.9,92.4 35.9,92.1 32.6,92.5 29.9,94.2 27.8,92.6 24.6,92.1 22.5,92.6 12.4,91.6 1.9,91.4 0,91.2' fill='white'/%3E%3C/svg%3E");
	--recorte-rosa: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='4.5,2.3 8.6,9 12.8,8 16.9,1.7 21,6.4 25.2,2.5 29.3,0.1 33.5,1.8 37.6,3.3 41.7,8.4 45.9,3.6 50,7.3 54.1,6 58.3,8.2 62.4,3.3 66.5,5.6 70.7,8.9 74.8,8.4 79,5.6 83.1,0 87.2,7.7 91.4,5.6 98.9,4.5 92.7,12.1 98.4,19.7 94.4,27.3 96,34.8 91.6,42.4 96.9,50 95,57.6 94.9,65.2 94.4,72.8 98.8,80.3 93.2,87.9 95.5,93.6 91.4,95.1 87.2,97.6 83.1,98.9 79,98.3 74.8,96.1 70.7,93.3 66.5,96 62.4,95.8 58.3,96.7 54.1,98.6 50,92.2 45.9,94.3 41.7,98.7 37.6,95.6 33.5,91.3 29.3,91.2 25.2,94.7 21,99.7 16.9,95.5 12.8,95.9 8.6,95.2 8.9,95.5 5.7,87.9 5.1,80.3 8.4,72.8 6.2,65.2 6.8,57.6 1.2,50 7.4,42.4 7,34.8 2.4,27.3 0.7,19.7 1.8,12.1' fill='white'/%3E%3C/svg%3E");
	--recorte-amarillo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='5.5,2.8 9.5,6.9 13.6,2.4 17.6,9.4 21.7,7.8 25.7,8.1 29.8,8.5 33.8,7.6 37.9,5.7 41.9,10.7 46,6.2 50,1.6 54,2.7 58.1,0.5 62.1,5.3 66.2,0.2 70.2,8.2 74.3,2.3 78.3,0 82.4,10.6 86.4,3.3 90.5,8.2 99.4,5.5 94.3,12.9 99.3,20.3 92.7,27.8 92.8,35.2 98.6,42.6 91.6,50 95.1,57.4 89.1,64.8 90.9,72.3 91.3,79.7 90.7,87.1 94.5,93.8 90.5,89.7 86.4,90.6 82.4,96.4 78.3,99.8 74.3,91.3 70.2,93.9 66.2,95.3 62.1,95.7 58.1,96.2 54,96.9 50,90.2 46,94.7 41.9,91.3 37.9,98.6 33.8,93.5 29.8,94.3 25.7,98.8 21.7,98.6 17.6,95.2 13.6,97.9 9.5,98.6 4,94.5 8.7,87.1 0.7,79.7 6,72.3 3.7,64.8 8.9,57.4 1.3,50 6.8,42.6 6.8,35.2 1.2,27.8 1.8,20.3 3.6,12.9' fill='white'/%3E%3C/svg%3E");
	--recorte-turquesa: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='5,2.7 9.1,8.1 13.2,6.5 17.3,7.4 21.4,7 25.5,6.8 29.5,1.2 33.6,6.8 37.7,7.3 41.8,3.5 45.9,4.6 50,5.8 54.1,6.9 58.2,8.9 62.3,9.6 66.4,2 70.5,4.2 74.5,5.7 78.6,1.7 82.7,2.5 86.8,8.9 90.9,2.6 90.3,5 92,12.5 97.6,20 99.4,27.5 97.3,35 92.8,42.5 96.7,50 93.7,57.5 91.1,65 99,72.5 93.3,80 97.1,87.5 95,99.7 90.9,92.1 86.8,97.1 82.7,94 78.6,95.5 74.5,97.3 70.5,90.2 66.4,99.2 62.3,90.4 58.2,90.1 54.1,92.1 50,90.9 45.9,90.5 41.8,90.1 37.7,90.2 33.6,99.1 29.5,91 25.5,95.2 21.4,90.9 17.3,93.3 13.2,98.4 9.1,97.4 5.3,95 3.4,87.5 4,80 0.3,72.5 8.6,65 2.2,57.5 1.1,50 3.5,42.5 4.1,35 9.1,27.5 6,20 8.4,12.5' fill='white'/%3E%3C/svg%3E");
	--recorte-cinta: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='7,3.8 10.9,1.1 14.8,3.3 18.7,3.6 22.6,0.4 26.5,2.1 30.5,2.2 34.4,7.1 38.3,11.9 42.2,2.2 46.1,11.3 50,2.3 53.9,5.2 57.8,3 61.7,2.2 65.6,10.2 69.5,7.9 73.5,11 77.4,4.9 81.3,9.3 85.2,7.8 89.1,1.9 91.8,7 88.8,14.2 91.6,21.3 87.7,28.5 87.7,35.7 86.3,42.8 86.1,50 86.2,57.2 90.8,64.3 87,71.5 97.4,78.7 88.8,85.8 93,93.5 89.1,87.8 85.2,95.8 81.3,98.7 77.4,87.8 73.5,96.9 69.5,89.9 65.6,91.3 61.7,98.3 57.8,97.2 53.9,95.3 50,87.1 46.1,94.4 42.2,91.6 38.3,88.6 34.4,98.1 30.5,97.1 26.5,93.9 22.6,97.1 18.7,89.8 14.8,99.1 10.9,92.9 0.6,93 3.4,85.8 9.4,78.7 0.9,71.5 12.9,64.3 0.6,57.2 1.5,50 7.3,42.8 13.4,35.7 1.8,28.5 10.8,21.3 0.6,14.2' fill='white'/%3E%3C/svg%3E");
}

.perfil-cabecera--seccion {
	--portada-h: 170px;
}

.perfil-portada-marco {
	position: relative;
	height: calc(var(--portada-h) + 16px);
	overflow: hidden;
	filter: drop-shadow(0 2px 2px rgba(28, 27, 25, 0.16));
}

.perfil-portada__papel-bajo,
.perfil-portada {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
}

.perfil-portada__papel-bajo {
	height: calc(var(--portada-h) + 14px);
	background: #fffdf7;
	-webkit-mask-image: var(--rasgado-papel);
	mask-image: var(--rasgado-papel);
}

.perfil-portada {
	height: var(--portada-h);
	overflow: hidden;
	background: var(--indf-negro);
	-webkit-mask-image: var(--rasgado-foto);
	mask-image: var(--rasgado-foto);
}

.perfil-portada__foto {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 70% 40%;
	filter: grayscale(1) contrast(1.15) brightness(0.72);
}

.perfil-portada::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(20, 20, 20, 0.35), rgba(20, 20, 20, 0) 45%);
	pointer-events: none;
}

/* Recortes de collage: papel de color con grano, bordes rasgados y un
   punto de sombra; la cinta es semitransparente sobre el rosa. */
.perfil-collage {
	position: absolute;
	z-index: 1;
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	background-image:
		radial-gradient(rgba(255, 255, 255, 0.07) 1px, transparent 1.2px),
		radial-gradient(rgba(0, 0, 0, 0.045) 1px, transparent 1.2px);
	background-size: 5px 5px, 7px 7px;
	background-position: 0 0, 2px 3px;
}

.perfil-collage--rosa {
	left: -26px;
	top: 14px;
	width: 158px;
	height: 96px;
	background-color: #c93a78;
	transform: rotate(-11deg);
	-webkit-mask-image: var(--recorte-rosa);
	mask-image: var(--recorte-rosa);
}

.perfil-collage--amarillo {
	left: -18px;
	top: calc(var(--portada-h) - 92px);
	width: 104px;
	height: 72px;
	background-color: var(--comunidad-amarillo);
	transform: rotate(7deg);
	-webkit-mask-image: var(--recorte-amarillo);
	mask-image: var(--recorte-amarillo);
}

.perfil-collage--turquesa {
	left: 118px;
	top: -14px;
	width: 88px;
	height: 44px;
	background-color: var(--indf-turquesa);
	transform: rotate(-4deg);
	opacity: 0.92;
	-webkit-mask-image: var(--recorte-turquesa);
	mask-image: var(--recorte-turquesa);
}

.perfil-collage--cinta {
	z-index: 2;
	left: 58px;
	top: 6px;
	width: 74px;
	height: 26px;
	background-color: rgba(243, 233, 201, 0.78);
	background-image: none;
	transform: rotate(-24deg);
	-webkit-mask-image: var(--recorte-cinta);
	mask-image: var(--recorte-cinta);
}

.perfil-portada__nota {
	position: absolute;
	z-index: 2;
	right: 18px;
	top: 14px;
	margin: 0;
	padding: 16px 22px 18px 26px;
	background: #111;
	color: #fff;
	font-family: 'Permanent Marker', 'Comic Sans MS', cursive;
	font-size: 22px;
	line-height: 1.12;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	transform: rotate(-4deg);
	display: flex;
	flex-direction: column;
	-webkit-mask-image: var(--recorte-rosa);
	mask-image: var(--recorte-rosa);
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
}

.perfil-portada__nota span:last-child {
	border-bottom: 2px solid #fff;
	padding-bottom: 2px;
	align-self: flex-start;
}

/* --------------------------------------------------------------------------
 * Cuerpo de cabecera: avatar, identidad, estadísticas y acciones
 * -------------------------------------------------------------------------- */

.perfil-cabecera__cuerpo {
	position: relative;
	display: grid;
	grid-template-columns: 260px minmax(0, 1fr) auto;
	gap: 8px 32px;
	align-items: start;
	padding-top: 0;
	padding-bottom: 26px;
}

.perfil-cabecera__avatar {
	/* 122 px sobre la foto + los 16 px de la tira de papel rasgado. */
	margin-top: -138px;
	position: relative;
	z-index: 3;
}

.comunidad-avatar--perfil {
	width: 244px;
	height: 244px;
	font-size: 110px;
	border: 8px solid #fff;
	box-shadow: 0 2px 0 rgba(0, 0, 0, 0.06), 0 10px 26px rgba(0, 0, 0, 0.18);
	background-clip: padding-box;
}

.comunidad-avatar--perfil.comunidad-avatar--reserva span {
	margin-top: 6px;
}

.perfil-cabecera__identidad {
	padding-top: 22px;
	min-width: 0;
}

.perfil-cabecera__nombre {
	font-family: var(--fuente-titular);
	font-size: clamp(28px, 3.2vw, 36px);
	line-height: 1.05;
	margin: 0;
	word-break: break-word;
}

.perfil-cabecera__alias {
	margin: 4px 0 0;
	color: var(--comunidad-gris);
	font-family: var(--fuente-ui);
	font-size: 15px;
}

.perfil-cabecera__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 22px;
	list-style: none;
	margin: 12px 0 0;
	padding: 0;
	color: #3d3a35;
	font-family: var(--fuente-ui);
	font-size: 15px;
}

.perfil-cabecera__meta li {
	display: inline-flex;
	align-items: center;
	gap: 7px;
}

.perfil-cabecera__bio {
	max-width: 480px;
	margin: 14px 0 0;
	font-size: 16px;
	line-height: 1.55;
}

.perfil-cabecera__bio--vacia {
	color: var(--comunidad-gris);
}

.perfil-cabecera__bio--vacia a {
	color: var(--comunidad-azul);
}

.perfil-cabecera__generos {
	margin-top: 14px;
}

.perfil-cabecera__lateral {
	padding-top: 26px;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}

.perfil-stats {
	display: flex;
	margin: 0;
}

.perfil-stats__item {
	display: flex;
	flex-direction: column-reverse;
	align-items: center;
	padding: 0 18px;
	min-width: 72px;
}

.perfil-stats__item--separado {
	border-left: 1px solid var(--comunidad-linea);
	margin-left: 4px;
}

.perfil-stats dt {
	font-family: var(--fuente-ui);
	font-size: 14px;
	color: #3d3a35;
	margin-top: 4px;
}

.perfil-stats dd {
	margin: 0;
	font-family: var(--fuente-titular);
	font-size: 20px;
	line-height: 1.1;
}

.perfil-stats dd a {
	text-decoration: none;
}

.perfil-stats dd a:hover,
.perfil-stats dd a:focus-visible {
	text-decoration: underline;
}

.perfil-acciones {
	display: flex;
	gap: 12px;
	margin-top: 24px;
}

.perfil-acciones .comunidad-seguir--grande,
.perfil-acciones > .comunidad-boton--negro {
	min-width: 118px;
	min-height: 44px;
}

.perfil-menu {
	position: relative;
}

.perfil-menu__lista {
	position: absolute;
	right: 0;
	top: calc(100% + 6px);
	z-index: 20;
	min-width: 240px;
	margin: 0;
	padding: 6px;
	list-style: none;
	background: #fff;
	border: 1.5px solid var(--indf-negro);
	border-radius: var(--comunidad-radio);
	box-shadow: 4px 4px 0 var(--indf-negro);
}

.perfil-menu__lista button,
.perfil-menu__lista a {
	display: block;
	width: 100%;
	padding: 10px 12px;
	text-align: left;
	font-family: var(--fuente-ui);
	font-size: 15px;
	background: none;
	border: 0;
	border-radius: 4px;
	color: var(--indf-negro);
	text-decoration: none;
	cursor: pointer;
}

.perfil-menu__lista button:hover,
.perfil-menu__lista a:hover,
.perfil-menu__lista button:focus-visible,
.perfil-menu__lista a:focus-visible {
	background: var(--comunidad-chip);
}

.perfil-menu__peligro {
	color: #a4322a !important;
}

.perfil-cabecera__lateral .comunidad-feedback {
	text-align: right;
}

/* Cabecera de sección (feed/directorio). */
.perfil-cabecera__seccion {
	padding-top: 18px;
	padding-bottom: 18px;
}

.perfil-cabecera__titulo-seccion {
	font-family: var(--fuente-titular);
	font-size: clamp(30px, 4vw, 42px);
	margin: 0;
}

.perfil-cabecera__seccion p {
	margin: 6px 0 0;
	color: #3d3a35;
}

/* --------------------------------------------------------------------------
 * Pestañas
 * -------------------------------------------------------------------------- */

.perfil-pestanas {
	position: relative;
	border-bottom: 1px solid var(--comunidad-linea);
}

.perfil-pestanas ul {
	display: flex;
	gap: 4px;
	margin: 0;
	padding: 0;
	list-style: none;
	overflow-x: auto;
	scrollbar-width: none;
	scroll-padding-inline: 16px 48px;
}

.perfil-pestanas li {
	flex: none;
}

/* Indicador de "hay más pestañas" (Theme 1.16.3): degradado en el lado
   con contenido oculto y un chevrón que desplaza; lo activa
   community-social.js según el desplazamiento real. */
.perfil-pestanas::before,
.perfil-pestanas::after {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	width: 56px;
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.2s ease;
	z-index: 1;
}

.perfil-pestanas::before {
	left: 0;
	background: linear-gradient(90deg, var(--indf-blanco-roto) 20%, rgba(247, 244, 234, 0));
}

.perfil-pestanas::after {
	right: 0;
	background: linear-gradient(270deg, var(--indf-blanco-roto) 35%, rgba(247, 244, 234, 0));
}

.perfil-pestanas[data-mas-izquierda]::before,
.perfil-pestanas[data-mas-derecha]::after {
	opacity: 1;
}

.perfil-pestanas__mas {
	position: absolute;
	right: 6px;
	top: 50%;
	z-index: 2;
	display: none;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	margin-top: -15px;
	padding: 0;
	border: 1px solid var(--comunidad-linea);
	border-radius: 50%;
	background: #fff;
	color: var(--indf-negro);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
	cursor: pointer;
}

.perfil-pestanas[data-mas-derecha] .perfil-pestanas__mas {
	display: flex;
}

@media (prefers-reduced-motion: reduce) {
	.perfil-pestanas::before,
	.perfil-pestanas::after {
		transition: none;
	}
}

.perfil-pestanas ul::-webkit-scrollbar {
	display: none;
}

.perfil-pestanas a {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 16px 22px 14px;
	font-family: var(--fuente-ui);
	font-size: 16px;
	font-weight: 500;
	color: #2a2824;
	text-decoration: none;
	white-space: nowrap;
	border-bottom: 3px solid transparent;
}

.perfil-pestanas a[aria-current="page"] {
	font-weight: 700;
	border-bottom-color: var(--comunidad-rosa);
}

.perfil-pestanas a:hover {
	border-bottom-color: var(--comunidad-linea);
}

.perfil-pestanas a[aria-current="page"]:hover {
	border-bottom-color: var(--comunidad-rosa);
}

.perfil-pestanas a:focus-visible {
	outline: 3px solid var(--comunidad-amarillo);
	outline-offset: -3px;
}

/* --------------------------------------------------------------------------
 * Cuerpo: columna principal + lateral
 * -------------------------------------------------------------------------- */

.perfil-cuerpo {
	padding-top: 28px;
}

.perfil-cuerpo--con-lateral {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 440px;
	gap: 24px;
	align-items: start;
}

.perfil-titulo {
	font-family: var(--fuente-titular);
	font-size: 23px;
	margin: 0 0 16px;
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
}

.perfil-titulo--secundario {
	margin-top: 36px;
}

.comunidad-privado {
	font-family: var(--fuente-ui);
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	background: var(--indf-negro);
	color: #fff;
	padding: 4px 8px;
	border-radius: 999px;
}

/* Actividad */
.comunidad-actividades {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.comunidad-actividad {
	background: var(--comunidad-papel);
	border: 1px solid var(--comunidad-linea);
	border-radius: var(--comunidad-radio);
	padding: 16px 18px 18px;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.comunidad-actividad__cabecera {
	display: flex;
	align-items: flex-start;
	gap: 14px;
}

.comunidad-actividad__frase {
	flex: 1;
	min-width: 0;
}

.comunidad-actividad__frase p {
	margin: 4px 0 0;
	font-family: var(--fuente-ui);
	font-size: 16px;
	line-height: 1.35;
}

.comunidad-actividad__frase a {
	text-decoration: none;
}

.comunidad-actividad__actor {
	font-weight: 700;
}

.comunidad-actividad__frase a:hover,
.comunidad-actividad__frase a:focus-visible {
	text-decoration: underline;
}

.comunidad-actividad__frase time {
	display: block;
	margin-top: 2px;
	font-size: 14px;
	color: var(--comunidad-gris);
}

.comunidad-actividad__lateral {
	flex: none;
	align-self: center;
}

.comunidad-actividad__cuerpo {
	display: flex;
	gap: 18px;
	margin-top: 14px;
	padding-left: 62px;
}

.comunidad-actividad__media {
	flex: none;
	width: 112px;
	height: 86px;
	border-radius: 4px;
	overflow: hidden;
	background: var(--indf-negro);
	display: flex;
	align-items: center;
	justify-content: center;
}

.comunidad-actividad__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.comunidad-actividad__media--cartel {
	width: 112px;
	height: 120px;
}

.comunidad-actividad__media--miembro {
	width: 96px;
	height: 76px;
}

.comunidad-actividad__sin-foto {
	color: var(--indf-crema);
	font-family: var(--fuente-display);
	font-size: 30px;
}

.comunidad-actividad__sin-foto .comunidad-icono {
	width: 36px;
	height: 36px;
}

.comunidad-actividad__detalle {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 10px;
}

.comunidad-actividad__titulo {
	margin: 0;
	font-family: var(--fuente-titular);
	font-size: 18px;
	line-height: 1.2;
}

.comunidad-actividad__titulo a {
	text-decoration: none;
}

.comunidad-actividad__titulo a:hover,
.comunidad-actividad__titulo a:focus-visible {
	text-decoration: underline;
}

.comunidad-actividad__cita {
	margin: 0;
	font-size: 15px;
	line-height: 1.5;
	color: #34312c;
}

.comunidad-datos {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 5px;
	font-family: var(--fuente-ui);
	font-size: 15px;
	color: #34312c;
}

.comunidad-datos li {
	display: flex;
	align-items: center;
	gap: 9px;
}

.comunidad-datos__pasado {
	color: var(--comunidad-gris);
}

.comunidad-flechazo {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--comunidad-rosa);
	font-family: var(--fuente-ui);
	font-weight: 700;
	font-size: 14px;
}

.comunidad-flechazo .comunidad-icono {
	width: 26px;
	height: 26px;
	fill: var(--comunidad-rosa);
}

.comunidad-actividad__contador {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: var(--fuente-ui);
	font-size: 15px;
	text-decoration: none;
	color: #34312c;
}

.comunidad-mas {
	text-align: center;
	margin: 18px 0 0;
}

/* Lateral */
.perfil-lateral {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.perfil-caja {
	background: var(--comunidad-papel);
	border: 1px solid var(--comunidad-linea);
	border-radius: var(--comunidad-radio);
	padding: 18px;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.perfil-caja__cabecera {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 12px;
	margin-bottom: 14px;
}

.perfil-caja h2 {
	margin: 0;
	font-family: var(--fuente-titular);
	font-size: 19px;
}

.perfil-caja__cabecera a {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-family: var(--fuente-ui);
	font-size: 14px;
	color: var(--comunidad-azul);
	text-decoration: none;
	white-space: nowrap;
}

.perfil-caja__cabecera a:hover {
	text-decoration: underline;
}

.perfil-caja__vacio {
	margin: 0;
	color: var(--comunidad-gris);
	font-size: 15px;
}

.perfil-caja--cta p {
	margin: 8px 0 14px;
	font-size: 15px;
}

.perfil-caja--yo {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.perfil-caja__yo {
	display: flex;
	align-items: center;
	gap: 12px;
	text-decoration: none;
	font-family: var(--fuente-ui);
}

.perfil-favoritos {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 10px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.perfil-favoritos a,
.perfil-rejilla-artistas a {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	text-decoration: none;
	text-align: center;
}

.perfil-artista__foto {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	max-width: 72px;
	aspect-ratio: 1;
	border-radius: 50%;
	overflow: hidden;
	background: var(--indf-negro);
	color: var(--indf-crema);
	font-family: var(--fuente-display);
	font-size: 22px;
}

.perfil-artista__foto img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.perfil-favoritos li,
.perfil-rejilla-artistas li {
	min-width: 0;
}

/* Nombres largos ("Socunbohemio", "Ultraligera") en celdas de ~70 px: se
   parten dentro de su celda en vez de invadir la vecina. */
.perfil-artista__nombre {
	max-width: 100%;
	font-family: var(--fuente-ui);
	font-size: 13px;
	font-weight: 500;
	line-height: 1.25;
	overflow-wrap: anywhere;
	hyphens: auto;
}

.perfil-rejilla-artistas {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(116px, 1fr));
	gap: 22px 14px;
	list-style: none;
	margin: 0;
	padding: 22px;
	background: var(--comunidad-papel);
	border: 1px solid var(--comunidad-linea);
	border-radius: var(--comunidad-radio);
}

.perfil-rejilla-artistas .perfil-artista__foto {
	max-width: 104px;
}

.perfil-rejilla-artistas--flechazo .perfil-artista__foto {
	box-shadow: 0 0 0 3px var(--comunidad-rosa);
}

/* Conciertos */
.perfil-lista-conciertos {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.comunidad-concierto {
	display: grid;
	grid-template-columns: 88px minmax(0, 1fr) auto;
	gap: 14px;
	align-items: start;
	background: var(--comunidad-papel);
	border: 1px solid var(--comunidad-linea);
	border-radius: var(--comunidad-radio);
	padding: 12px;
}

.perfil-lista-conciertos--compacta {
	gap: 14px;
}

.perfil-lista-conciertos--compacta .comunidad-concierto {
	border: 0;
	padding: 0;
	grid-template-columns: 80px minmax(0, 1fr) auto;
}

.comunidad-concierto__cartel {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 88px;
	height: 80px;
	border-radius: 4px;
	overflow: hidden;
	background: var(--indf-negro);
}

.perfil-lista-conciertos--compacta .comunidad-concierto__cartel {
	width: 80px;
	height: 80px;
}

.comunidad-concierto__cartel img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.comunidad-concierto__info h3 {
	margin: 0 0 6px;
	font-family: var(--fuente-titular);
	font-size: 16px;
	line-height: 1.2;
}

.comunidad-concierto__info h3 a {
	text-decoration: none;
}

.comunidad-concierto .comunidad-datos {
	font-size: 13px;
	gap: 3px;
}

.comunidad-concierto .comunidad-datos .comunidad-icono {
	width: 15px;
	height: 15px;
}

.comunidad-concierto__estado {
	align-self: center;
}

.perfil-lista-conciertos--pasados .comunidad-concierto {
	opacity: 0.85;
}

/* Comentarios del perfil */
.perfil-comentarios {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.perfil-comentario {
	background: var(--comunidad-papel);
	border: 1px solid var(--comunidad-linea);
	border-radius: var(--comunidad-radio);
	padding: 16px 18px;
}

.perfil-comentario__post {
	font-family: var(--fuente-titular);
	font-size: 16px;
	text-decoration: none;
}

.perfil-comentario p {
	margin: 8px 0 6px;
}

.perfil-comentario time {
	font-size: 13px;
	color: var(--comunidad-gris);
}

/* Sobre mí */
.perfil-sobre {
	margin: 0;
	background: var(--comunidad-papel);
	border: 1px solid var(--comunidad-linea);
	border-radius: var(--comunidad-radio);
	padding: 6px 22px;
}

.perfil-sobre > div {
	display: grid;
	grid-template-columns: 180px minmax(0, 1fr);
	gap: 16px;
	padding: 14px 0;
	border-bottom: 1px solid var(--comunidad-linea);
}

.perfil-sobre > div:last-child {
	border-bottom: 0;
}

.perfil-sobre dt {
	font-family: var(--fuente-ui);
	font-weight: 700;
}

.perfil-sobre dd {
	margin: 0;
}

.perfil-sobre__vacio,
.perfil-nota {
	color: var(--comunidad-gris);
}

.perfil-nota {
	margin-top: 16px;
	font-size: 14px;
}

/* --------------------------------------------------------------------------
 * Miembros (directorio, seguidores, sugerencias)
 * -------------------------------------------------------------------------- */

.comunidad-directorio {
	padding-top: 28px;
}

.comunidad-buscador {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 220px auto;
	gap: 10px;
	margin-bottom: 22px;
}

.comunidad-buscador input,
.comunidad-buscador select {
	min-height: 46px;
	padding: 10px 14px;
	font-family: var(--fuente-ui);
	font-size: 16px;
	border: 1.5px solid var(--indf-negro);
	border-radius: var(--comunidad-radio);
	background: #fff;
}

.comunidad-directorio__total {
	margin: 0 0 14px;
	color: var(--comunidad-gris);
	font-family: var(--fuente-ui);
}

.comunidad-rejilla-miembros {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
	gap: 14px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.comunidad-miembro {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	padding: 20px 14px;
	background: var(--comunidad-papel);
	border: 1px solid var(--comunidad-linea);
	border-radius: var(--comunidad-radio);
	text-align: center;
}

.comunidad-miembro__enlace {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	text-decoration: none;
}

.comunidad-miembro__enlace .comunidad-avatar {
	margin-bottom: 6px;
}

.comunidad-miembro__nombre {
	font-family: var(--fuente-titular);
	font-size: 16px;
	word-break: break-word;
}

.comunidad-miembro__alias,
.comunidad-miembro__provincia {
	font-size: 14px;
	color: var(--comunidad-gris);
	display: inline-flex;
	align-items: center;
	gap: 4px;
}

.comunidad-miembro__tu {
	font-size: 13px;
	font-weight: 700;
	color: var(--comunidad-gris);
}

.comunidad-lista-miembros {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.comunidad-lista-miembros li {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}

.comunidad-lista-miembros a {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
	text-decoration: none;
	font-family: var(--fuente-ui);
}

.comunidad-lista-miembros small {
	display: block;
	color: var(--comunidad-gris);
}

/* Mensajes (no disponible, entrar) */
.comunidad-mensaje {
	max-width: 640px;
	padding-top: 64px;
	padding-bottom: 32px;
}

.comunidad-mensaje__etiqueta {
	font-family: var(--fuente-display);
	text-transform: uppercase;
	color: var(--comunidad-rosa);
	margin: 0 0 6px;
	letter-spacing: 0.02em;
}

.comunidad-mensaje h1 {
	font-family: var(--fuente-titular);
	font-size: clamp(28px, 4vw, 40px);
	margin: 0 0 12px;
}

.comunidad-mensaje__acciones {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 22px;
}

/* --------------------------------------------------------------------------
 * Mi perfil (edición en Mi Indiferentes)
 * -------------------------------------------------------------------------- */

.mi-perfil.mi-indiferentes__ajustes {
	max-width: 640px;
}

.mi-perfil__garantias {
	margin: 12px 0 18px;
	padding-left: 20px;
	line-height: 1.6;
}

.mi-perfil__form {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.mi-perfil__form label {
	font-weight: 700;
	font-size: 15px;
}

.mi-perfil__form input[type="text"],
.mi-perfil__form textarea,
.mi-perfil__form select {
	width: 100%;
	padding: 10px 14px;
	border: 2px solid var(--indf-negro);
	border-radius: var(--radio);
	font-size: 16px;
	font-family: var(--fuente-ui);
	background: #fff;
	box-sizing: border-box;
}

.mi-perfil__form input[aria-invalid="true"] {
	border-color: #a4322a;
}

.mi-perfil__alias {
	display: flex;
	align-items: center;
	gap: 6px;
	font-weight: 700;
	font-size: 18px;
}

.mi-perfil__visibilidad {
	margin: 14px 0 6px;
	padding: 14px 16px;
	border: 1.5px solid var(--comunidad-linea);
	border-radius: var(--comunidad-radio);
	background: #fff;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.mi-perfil__visibilidad legend {
	font-weight: 700;
	padding: 0 6px;
}

.mi-perfil__visibilidad label {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	font-weight: 500 !important;
}

.mi-perfil__visibilidad input {
	margin-top: 4px;
	width: 18px;
	height: 18px;
	flex: none;
}

.mi-perfil__visibilidad small {
	display: block;
	color: var(--comunidad-gris);
	font-size: 13px;
}

.mi-perfil__guardar {
	padding: 20px 0;
}

.mi-perfil__vista {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
}

.mi-perfil__tarjeta {
	display: flex;
	align-items: center;
	gap: 14px;
	text-decoration: none;
}

.mi-perfil__foto {
	display: flex;
	gap: 20px;
	align-items: center;
	flex-wrap: wrap;
}

.comunidad-avatar--perfil-edicion {
	width: 120px;
	height: 120px;
	font-size: 54px;
	border: 4px solid #fff;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
}

.mi-perfil__subir {
	cursor: pointer;
	position: relative;
}

.mi-perfil__subir:focus-within {
	outline: 3px solid var(--comunidad-amarillo);
	outline-offset: 2px;
}

.mi-perfil__quitar {
	margin-left: 10px;
	background: none;
	border: 0;
	text-decoration: underline;
	cursor: pointer;
	font: inherit;
}

.mi-perfil__bloqueados {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.mi-perfil__bloqueados li {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}

/* --------------------------------------------------------------------------
 * Responsive: el móvil es una composición propia, no el escritorio encogido
 * -------------------------------------------------------------------------- */

@media (max-width: 1100px) {
	.perfil-cuerpo--con-lateral {
		grid-template-columns: minmax(0, 1fr) 340px;
	}

	.perfil-cabecera__cuerpo {
		grid-template-columns: 200px minmax(0, 1fr);
	}

	.comunidad-avatar--perfil {
		width: 196px;
		height: 196px;
		font-size: 90px;
	}

	.perfil-cabecera__avatar {
		margin-top: -116px;
	}

	.perfil-cabecera__lateral {
		grid-column: 1 / -1;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		flex-wrap: wrap;
		padding-top: 6px;
		gap: 12px;
	}

	.perfil-acciones {
		margin-top: 0;
	}

	.perfil-stats__item:first-child {
		padding-left: 0;
	}
}

@media (max-width: 860px) {
	.perfil-cuerpo--con-lateral {
		grid-template-columns: minmax(0, 1fr);
	}

	/* En una columna, la actividad sigue siendo lo principal: la primera
	   caja (artistas favoritos / tu perfil) va antes, el resto después. */
	.perfil-lateral {
		display: contents;
	}

	.perfil-lateral > .perfil-caja {
		order: 1;
	}

	.perfil-lateral > .perfil-caja:first-child {
		order: -1;
	}
}

/* Cabecera del sitio más baja SOLO en vistas de Comunidad y en móvil
   (clase body .comunidad-social): mismo logo y mismo menú, menos aire. */
@media (max-width: 860px) {
	.comunidad-social .site-header__inner {
		padding-top: 8px;
		padding-bottom: 8px;
	}

	.comunidad-social .site-header__logo img {
		width: 108px;
		height: 36px;
	}
}

@media (max-width: 640px) {
	/* Theme 1.16.3: cabecera de perfil compacta. Avatar a la izquierda con
	   nombre, alias y ubicación al lado; bio, géneros, cifras y botones a
	   todo el ancho. En 390 × 812 la primera pantalla ya deja ver el
	   comienzo de artistas/actividad. */
	.perfil-cabecera {
		--portada-h: 104px;
	}

	.perfil-cabecera--seccion {
		--portada-h: 88px;
	}

	.perfil-collage--rosa {
		width: 96px;
		height: 58px;
		top: 8px;
	}

	.perfil-collage--amarillo {
		width: 60px;
		height: 42px;
		top: calc(var(--portada-h) - 54px);
	}

	.perfil-collage--turquesa {
		left: 70px;
		width: 56px;
		height: 30px;
	}

	.perfil-collage--cinta {
		left: 36px;
		top: 4px;
		width: 48px;
		height: 18px;
	}

	.perfil-portada__nota {
		font-size: 12px;
		padding: 8px 12px 10px 14px;
		right: 10px;
		top: 8px;
	}

	.perfil-cabecera__cuerpo {
		display: grid;
		grid-template-columns: 96px minmax(0, 1fr);
		gap: 0 14px;
		align-items: start;
		padding-top: 0;
		padding-bottom: 14px;
	}

	.perfil-cabecera__avatar {
		grid-column: 1;
		grid-row: 1 / span 3;
		margin-top: -52px;
	}

	.comunidad-avatar--perfil {
		width: 96px;
		height: 96px;
		font-size: 44px;
		border-width: 4px;
	}

	.perfil-cabecera__identidad {
		display: contents;
	}

	.perfil-cabecera__nombre {
		grid-column: 2;
		padding-top: 8px;
		font-size: 22px;
		line-height: 1.1;
	}

	.perfil-cabecera__alias {
		grid-column: 2;
		margin-top: 2px;
		font-size: 13px;
	}

	.perfil-cabecera__meta {
		grid-column: 2;
		margin-top: 4px;
		gap: 2px 12px;
		font-size: 13px;
	}

	.perfil-cabecera__meta .comunidad-icono {
		width: 15px;
		height: 15px;
	}

	.perfil-cabecera__bio,
	.perfil-cabecera__generos {
		grid-column: 1 / -1;
	}

	.perfil-cabecera__bio {
		margin-top: 10px;
		font-size: 14px;
		line-height: 1.45;
	}

	.perfil-cabecera__generos {
		margin-top: 8px;
	}

	.perfil-cabecera__generos li {
		font-size: 12px;
		padding: 6px 10px;
	}

	.perfil-cabecera__lateral {
		grid-column: 1 / -1;
		width: 100%;
		flex-direction: column;
		align-items: stretch;
		padding-top: 10px;
		gap: 0;
	}

	.perfil-stats {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
		border-top: 1px solid var(--comunidad-linea);
		border-bottom: 1px solid var(--comunidad-linea);
		padding: 8px 0;
	}

	.perfil-stats__item {
		padding: 0 4px;
		min-width: 0;
	}

	.perfil-stats__item--separado {
		border-left: 0;
		margin-left: 0;
	}

	.perfil-stats dd {
		font-size: 18px;
	}

	.perfil-stats dt {
		font-size: 12px;
		margin-top: 2px;
	}

	.perfil-acciones {
		width: 100%;
		margin-top: 10px;
	}

	.perfil-acciones > :first-child {
		flex: 1;
	}

	.perfil-cabecera__lateral .comunidad-feedback {
		text-align: center;
	}

	/* Cabecera de sección (feed/directorio) también más baja. */
	.perfil-cabecera__seccion {
		padding-top: 6px;
		padding-bottom: 10px;
	}

	.perfil-cabecera__titulo-seccion {
		font-size: 26px;
	}

	.perfil-cabecera__seccion p {
		font-size: 14px;
		margin-top: 2px;
	}

	.perfil-pestanas .contenedor {
		padding: 0;
	}

	.perfil-pestanas ul {
		padding: 0 44px 0 10px;
	}

	.perfil-pestanas a {
		min-height: 44px;
		padding: 12px 12px 10px;
		font-size: 15px;
		gap: 7px;
	}

	.perfil-cuerpo {
		padding-top: 20px;
	}

	.comunidad-actividad {
		padding: 14px;
	}

	.comunidad-actividad__cabecera {
		gap: 10px;
	}

	.comunidad-actividad__cabecera .comunidad-avatar--pequeno {
		width: 40px;
		height: 40px;
	}

	.comunidad-actividad__frase p {
		font-size: 15px;
	}

	.comunidad-actividad__cuerpo {
		padding-left: 0;
		gap: 12px;
	}

	.comunidad-actividad__media,
	.comunidad-actividad__media--cartel {
		width: 88px;
		height: 88px;
	}

	.comunidad-actividad__titulo {
		font-size: 16px;
	}

	.comunidad-datos {
		font-size: 14px;
	}

	.perfil-favoritos {
		grid-template-columns: repeat(5, minmax(56px, 1fr));
		overflow-x: auto;
		scrollbar-width: none;
	}

	.perfil-favoritos::-webkit-scrollbar {
		display: none;
	}

	.comunidad-concierto {
		grid-template-columns: 72px minmax(0, 1fr);
	}

	.comunidad-concierto__cartel {
		width: 72px;
		height: 72px;
	}

	.comunidad-concierto__estado {
		grid-column: 2;
		justify-self: start;
	}

	.comunidad-buscador {
		grid-template-columns: minmax(0, 1fr);
	}

	.comunidad-rejilla-miembros {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
	}

	.perfil-rejilla-artistas {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		padding: 16px;
	}

	.perfil-sobre > div {
		grid-template-columns: minmax(0, 1fr);
		gap: 4px;
	}
}

/* --------------------------------------------------------------------------
 * Estado vacío útil (Theme 1.16.3): artistas para empezar y acciones
 * -------------------------------------------------------------------------- */

.comunidad-vacio__acciones {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
}

.comunidad-sugerencias__intro {
	margin: 0 0 14px;
	font-size: 14px;
	color: var(--comunidad-gris);
}

.comunidad-sugerencias__lista {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 12px 10px;
	margin: 0 0 14px;
	padding: 0;
	list-style: none;
}

.comunidad-sugerencias__lista li {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	min-width: 0;
	text-align: center;
}

.comunidad-sugerencias__artista {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	width: 100%;
	text-decoration: none;
}

.comunidad-sugerencias__lista .comunidad-plan__boton {
	min-height: 36px;
	padding: 6px 12px;
}

.comunidad-sugerencias__lista .comunidad-plan__boton.is-activo {
	background: var(--indf-negro);
	color: #fff;
}

.comunidad-sugerencias__todos {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-family: var(--fuente-ui);
	font-size: 14px;
	font-weight: 700;
	color: var(--comunidad-azul);
	text-decoration: none;
}

.comunidad-sugerencias__todos:hover,
.comunidad-sugerencias__todos:focus-visible {
	text-decoration: underline;
}

@media (max-width: 640px) {
	.comunidad-sugerencias__lista {
		gap: 12px 6px;
	}
}

/* --------------------------------------------------------------------------
 * Recorte de la foto de perfil (Theme 1.16.5)
 * -------------------------------------------------------------------------- */

.recorte {
	width: min(100% - 32px, 440px);
	max-height: calc(100dvh - 32px);
	padding: 0;
	border: 2px solid var(--indf-negro);
	border-radius: var(--comunidad-radio);
	background: var(--indf-blanco-roto);
	color: var(--indf-negro);
	box-shadow: 6px 6px 0 var(--indf-negro);
}

.recorte::backdrop {
	background: rgba(17, 17, 17, 0.7);
}

.recorte__caja {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 18px 18px 16px;
}

.recorte__titulo {
	margin: 0;
	font-family: var(--fuente-titular);
	font-size: 22px;
}

.recorte__ayuda {
	margin: 0;
	font-size: 14px;
	color: var(--comunidad-gris);
}

.recorte__visor {
	position: relative;
	width: 100%;
	aspect-ratio: 1;
	overflow: hidden;
	border-radius: 4px;
	background: #111;
	touch-action: none;
	cursor: grab;
	user-select: none;
}

.recorte__visor:active {
	cursor: grabbing;
}

.recorte__visor:focus-visible {
	outline: 3px solid var(--comunidad-amarillo);
	outline-offset: 3px;
}

.recorte__lienzo {
	display: block;
	width: 100%;
	height: 100%;
}

/* Esquinas oscurecidas: lo que queda fuera del círculo existe en el
   recorte cuadrado pero no se ve en el avatar. */
.recorte__mascara {
	position: absolute;
	inset: 0;
	pointer-events: none;
	border-radius: 50%;
	box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.9), 0 0 0 999px rgba(17, 17, 17, 0.62);
}

.recorte__controles {
	display: flex;
	align-items: center;
	gap: 12px;
}

.recorte__zoom {
	flex: 1;
	display: flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
}

.recorte__zoom input {
	flex: 1;
	accent-color: var(--comunidad-rosa);
	min-height: 32px;
}

.recorte__zoom-icono {
	font-family: var(--fuente-ui);
	font-weight: 700;
	font-size: 18px;
	width: 14px;
	text-align: center;
}

.recorte__girar {
	flex: none;
	min-height: 44px;
	padding: 8px 14px;
	font-size: 14px;
}

.recorte__previas {
	display: flex;
	align-items: center;
	gap: 14px;
}

.recorte__previa-texto {
	font-family: var(--fuente-ui);
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--comunidad-gris);
}

.recorte__previa {
	border-radius: 50%;
	background: var(--indf-negro);
}

.recorte__previa--perfil {
	width: 96px;
	height: 96px;
	border: 3px solid #fff;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
}

.recorte__previa--tarjeta {
	width: 44px;
	height: 44px;
}

.recorte__estado {
	min-height: 1.3em;
	margin: 0;
	font-size: 14px;
}

.recorte__estado:empty {
	min-height: 0;
}

.recorte__acciones {
	display: flex;
	justify-content: flex-end;
	gap: 10px;
}

.recorte__acciones .comunidad-boton[disabled] {
	opacity: 0.6;
	cursor: progress;
}

/* Móvil: el diálogo ocupa toda la pantalla y el visor todo el ancho. */
@media (max-width: 640px) {
	.recorte {
		width: 100%;
		max-width: 100%;
		height: 100dvh;
		max-height: 100dvh;
		margin: 0;
		border: 0;
		border-radius: 0;
		box-shadow: none;
	}

	.recorte__caja {
		min-height: 100%;
		box-sizing: border-box;
		padding: max(14px, env(safe-area-inset-top)) 16px max(14px, env(safe-area-inset-bottom));
	}

	.recorte__acciones {
		margin-top: auto;
	}

	.recorte__acciones .comunidad-boton {
		flex: 1;
	}
}

/* --------------------------------------------------------------------------
 * Theme 1.17.0 · una sola cuenta
 * -------------------------------------------------------------------------- */

.perfil-cabecera__seccion p.perfil-cabecera__acciones {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 12px;
}

.perfil-aviso-privado {
	margin: 14px 0 0;
	padding: 10px 14px;
	background: var(--indf-crema);
	border-left: 4px solid var(--indf-turquesa-oscuro);
	font-size: 15px;
}

.mi-perfil__estado {
	align-items: flex-start;
}

.mi-perfil__estado-texto {
	flex: 1 1 320px;
	min-width: 0;
}

.mi-perfil__estado-texto p {
	margin: 0 0 8px;
	line-height: 1.55;
}

.mi-perfil__estado--privado {
	border-left: 5px solid var(--indf-turquesa-oscuro);
}

.mi-perfil__estado-acciones {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	width: 100%;
}

.mi-perfil__estado-acciones .mi-indiferentes__feedback {
	flex-basis: 100%;
	margin: 0;
}

.mi-perfil__estado--privado {
	padding-left: 18px;
}

/* Móvil: con el perfil privado, la caja va antes de la actividad (orden de
   la columna única); se queda en una fila compacta para no empujarla. */
@media (max-width: 860px) {
	.perfil-caja--cta {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 10px 14px;
	}

	.perfil-caja--cta > p {
		display: none;
	}

	.perfil-caja--cta .perfil-caja__yo {
		flex: 1 1 180px;
	}

	.perfil-caja--cta .comunidad-avatar--mediano {
		width: 48px;
		height: 48px;
		font-size: 22px;
	}
}

.perfil-nota--privados {
	margin-top: 16px;
}
