/**

 * 文章/章节阅读页样式（art/detail.html）

 * 容器宽度跟随全站 .container（ululate.css），此处只做阅读区排版

 */

.myui-article-page .myui-panel-box {

	max-width: 100%;

	box-sizing: border-box;

}



.myui-article-page .col-pd {

	padding: 20px;

}



.font-control-panel {

	background: #f8f9fa;

	border: 1px solid #e9ecef;

	border-radius: 5px;

	padding: 15px;

	margin-bottom: 20px;

	text-align: center;

}



.font-control-panel .control-label {

	display: inline-block;

	margin-right: 15px;

	font-weight: bold;

	color: #495057;

}



.font-size-btn {

	display: inline-block;

	padding: 5px 12px;

	margin: 0 3px;

	background: #ff9900;

	color: white;

	border: none;

	border-radius: 3px;

	cursor: pointer;

	font-size: 12px;

	transition: all 0.3s ease;

}



.font-size-btn:hover {

	background: #ff7701;

	transform: translateY(-1px);

}



.font-size-btn.active {

	background: #ff6b35;

	box-shadow: 0 0 8px rgba(255, 107, 53, 0.5);

}



.font-size-display {

	display: inline-block;

	margin: 0 10px;

	padding: 5px 10px;

	background: #fff3e0;

	border-radius: 3px;

	font-weight: bold;

	color: #e65100;

}



:root {

	--novel-font-size: 16px;

}



.myui-article__content {

	max-width: 100% !important;

	word-wrap: break-word !important;

	word-break: break-word !important;

	overflow-wrap: break-word !important;

	white-space: normal !important;

	line-height: 1.8;

	font-size: var(--novel-font-size) !important;

	text-align: justify;

	transition: font-size 0.3s ease;

	padding: 30px;

	border-radius: 8px;

	box-sizing: border-box !important;

}



.myui-article__content * {

	max-width: 100% !important;

	word-wrap: break-word !important;

	word-break: break-word !important;

	overflow-wrap: break-word !important;

	white-space: normal !important;

	box-sizing: border-box !important;

}



.myui-article__content p,

.myui-article__content div,

.myui-article__content span,

.myui-article__content table,

.myui-article__content td,

.myui-article__content th {

	max-width: 100% !important;

	word-wrap: break-word !important;

	word-break: break-word !important;

	overflow-wrap: break-word !important;

	white-space: normal !important;

	width: auto !important;

}



.myui-article__content table {

	table-layout: fixed !important;

	width: 100% !important;

}



.myui-article__content img {

	max-width: 100% !important;

	height: auto !important;

	width: auto !important;

}



.myui-article__content p {

	margin-bottom: 1.5em;

	text-indent: 2em;

	line-height: 2;

	text-align: justify;

}



.myui-article__content p:last-child {

	margin-bottom: 0;

}



.myui-article__title {

	text-align: center;

	margin-bottom: 20px;

	font-size: 24px;

}



.myui-article__sub {

	text-align: center;

	margin-bottom: 30px;

	padding-bottom: 15px;

}



.chapter-nav-panel {

	text-align: center;

	padding: 15px;

	background: #f8f9fa;

	border-radius: 5px;

}



.chapter-nav-panel--top {

	margin: 15px 0;

}



.chapter-nav-panel--bottom {

	margin: 30px 0 15px;

}



.fe-art-detail-fail {

	padding: 40px 0;

}



@media (max-width: 768px) {

	.myui-article-page .col-pd {

		padding: 15px;

	}



	.myui-article__content {

		font-size: 14px;

		line-height: 1.6;

		padding: 20px;

	}



	.myui-article__content p {

		margin-bottom: 1.2em;

		text-indent: 2em;

		line-height: 1.8;

	}



	.myui-article__title {

		font-size: 20px;

	}



	.font-control-panel {

		padding: 10px;

	}



	.font-size-btn {

		padding: 4px 8px;

		font-size: 11px;

		margin: 2px;

	}



	.myui-article__content img,

	.myui-article__content iframe,

	.myui-article__content video {

		max-width: 100% !important;

		height: auto !important;

	}

}



@media (max-width: 480px) {

	.myui-article-page .col-pd {

		padding: 10px;

	}



	.myui-article__content {

		font-size: 13px;

	}



	.font-control-panel .control-label {

		display: block;

		margin-bottom: 10px;

	}

}