body {
 	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
 	margin: 0;
 	padding: 10px 10px 80px;
 	background-color: white;
 	/* 白色背景 */
 }

 .container {
 	max-width: 600px;
 	margin: 0 auto;
 }

 .group-list {
 	padding: 0;
 	margin: 0;
 }

 .group-item {
 	height: 60px;
 	background: #f8f9fa;
 	/* 浅灰色背景 */
 	border: 1px solid #e9ecef;
 	/* 浅灰色边框 */
 	border-radius: 8px;
 	margin-bottom: 10px;
 	/* 下间距 */
 	padding: 8px;
 	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
 }

 .avatar {
 	width: 60px;
 	height: 60px;
 	border-radius: 8px;
 	margin-right: 15px;
 	object-fit: cover;
 	float: left;
 }

 .group-info {
 	overflow: hidden;
 	margin-top: 8px;
 }

 .group-title {
 	display: flex;
 	justify-content: space-between;
 	margin-bottom: 10px;
 }

 .group-name {
 	font-weight: 500;
 	color: #333;
 	font-size: 15px;
 	white-space: nowrap;
 	overflow: hidden;
 	text-overflow: ellipsis;
 	font-weight: bold;
 }

 .group-time {
 	color: #6c757d;
 	font-size: 12px;
 	flex-shrink: 0;
 	margin-left: 10px;
 }

 .group-desc {
 	color: #666;
 	font-size: 13px;
 	line-height: 1.4;
 	white-space: nowrap;
 	overflow: hidden;
 	text-overflow: ellipsis;
 }

 .join-btn {
 	position: fixed;
 	bottom: 20px;
 	left: 50%;
 	transform: translateX(-50%);
 	width: calc(100% - 40px);
 	max-width: 600px;
 	padding: 14px;
 	background: #2e2e2e;
 	color: white;
 	text-align: center;
 	border-radius: 20px;
 	text-decoration: none;
 	font-weight: 500;
 	font-size: 15px;
 	box-sizing: border-box;
 	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
 }

 /*弹窗*/
 .popup {
 	display: none;
 	position: fixed;
 	top: 0;
 	left: 0;
 	width: 100%;
 	height: 100%;
 	background-color: rgba(0, 0, 0, 0.5);
 	justify-content: center;
 	align-items: center;
 	z-index: 1000;
 }

 .popup-header {
 	margin-bottom: 10px;
 }

 .popup-content {
 	background-color: white;
 	padding: 20px;
 	border-radius: 10px;
 	text-align: center;
 	width: 250px;
 	position: relative;
 	margin-bottom: 40px;
 }

 .popup-title {
 	font-weight: bold;
 	font-size: 18px;
 }

 .popup-body p {
 	margin: 10px 0;
 	/* 上下间距为10px，左右间距为0 */
 	padding: 0;
 	/* 去掉内边距 */
 	font-size: 15px;
 	/* 可选：设置字体大小 */
 	line-height: 1;
 	/* 可选：设置行高，使文本更易读 */
 }

 .popup-yuan {
 	font-size: 40px;
 	color: #fb2020;
 	font-weight: bold;
 }

 .confirm-btn {
 	display: inline-block;
 	padding: 10px 100px;
 	background-color: #007bff;
 	color: white;
 	text-decoration: none;
 	border-radius: 20px;
 	font-size: 16px;
 	margin-top: 30px;
 }

 .confirm-text {
 	display: inline-block;
 	color: #666;
 	text-decoration: none;
 	font-size: 13px;
 	margin-top: 15px;
 }

 .confirm-ds {
 	display: inline-block;
 	color: #8244d3;
 	text-decoration: none;
 	border-radius: 5px;
 	font-size: 14px;
 	margin-top: 10px;
 }

 .close-btn {
 	position: absolute;
 	/* 仍然使用绝对定位 */
 	margin-top: 40px;
 	/* 距离弹窗内容底部10px，考虑按钮自身高度和外边距 */
 	left: 50%;
 	/* 水平居中 */
 	transform: translateX(-50%);
 	/* 精确居中 */
 	width: 30px;
 	height: 30px;
 	border-radius: 50%;
 	background-color: rgba(128, 128, 128, 0.5);
 	color: white;
 	border: 1px solid white;
 	/* 添加白色外圈 */
 	font-size: 20px;
 	cursor: pointer;
 	display: flex;
 	justify-content: center;
 	align-items: center;
 }

 .no-groups {
 	text-align: center;
 	padding: 30px;
 	color: #999;
 	font-size: 16px;
 }

 /*任务进度弹窗*/
 .modal-k {
 	display: none;
 	position: fixed;
 	z-index: 1;
 	left: 0;
 	top: 0;
 	width: 100%;
 	height: 100%;
 	overflow: auto;
 	background-color: rgba(0, 0, 0, 0.4);
 	justify-content: center;
 	align-items: center;
 }

 .modal-content-k {
 	background-color: #fefefe;
 	border: 1px solid #888;
 	width: 220px;
 	border-radius: 8px;
 	text-align: center;
 	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
 	position: relative;
 	padding: 20px;
 }

 .close {
 	position: absolute;
 	top: 0px;
 	right: 10px;
 	color: #aaa;
 	font-size: 28px;
 	cursor: pointer;
 }

 .close:hover,
 .close:focus {
 	color: black;
 	text-decoration: none;
 }

 .buttonlk {
 	background-color: #4CAF50;
 	border: none;
 	color: white;
 	padding: 10px 32px;
 	text-align: center;
 	text-decoration: none;
 	display: inline-block;
 	font-size: 16px;
 	margin: 4px 2px;
 	cursor: pointer;
 	border-radius: 8px;
 	height: 40px;
 	margin-top: 20px;
 }

 .modal-message {
 	margin-bottom: 20px;
 }