/* ==========================================================================
   北京话儿知识库 —— 配套样式
   沿用「80后怀旧版」的纸黄底纹 + 春联红 / 墨绿配色，变量取自 style/default.css
   ========================================================================== */

.bjkb .kb-total{
	font-family:var(--sans,"Microsoft YaHei",sans-serif);
	float:right;
	font-size:13px;
	font-weight:normal;
	color:var(--ink2,#6b6252);
	letter-spacing:0;
	padding-top:.5em;
}
.bjkb .kb-intro{
	color:var(--ink2,#6b6252);
	font-size:15px;
	line-height:1.9;
	margin-bottom:1em;
}
.bjkb .kb-intro b{
	color:var(--red,#b5342c);
}

/* ---------------------------------------------------------------- 搜索区 */
.bjkb .kb-search{
	display:flex;
	align-items:stretch;
	gap:8px;
	margin:0 0 8px 0;
}
.bjkb .kb-search-icon{
	flex:none;
	width:38px;
	display:flex;
	align-items:center;
	justify-content:center;
	font-family:var(--sans,"Microsoft YaHei",sans-serif);
	font-weight:bold;
	color:#fff8e8;
	background:var(--red,#b5342c);
	border:1px solid var(--red,#b5342c);
	border-radius:var(--r-s,6px) 0 0 var(--r-s,6px);
	letter-spacing:2px;
}
.bjkb .kb-input{
	flex:1 1 auto;
	min-width:0;
	height:40px;
	padding:0 12px;
	font-size:16px;
	font-family:inherit;
	color:var(--ink,#3a3a3a);
	background:var(--card,#fffdf6);
	border:1px solid var(--line,#d9cba6);
	border-radius:0 var(--r-s,6px) var(--r-s,6px) 0;
	outline:none;
}
.bjkb .kb-input:focus{
	border-color:var(--red,#b5342c);
	box-shadow:0 0 0 2px rgba(181,52,44,.12);
}
.bjkb .kb-btn{
	flex:none;
	height:40px;
	padding:0 16px;
	font-size:15px;
	font-family:var(--sans,"Microsoft YaHei",sans-serif);
	color:#fff8e8;
	cursor:pointer;
	background:var(--green,#2f5d50);
	border:1px solid var(--green,#2f5d50);
	border-radius:var(--r-s,6px);
	transition:.15s;
}
.bjkb .kb-btn:hover{
	background:var(--red,#b5342c);
	border-color:var(--red,#b5342c);
}
.bjkb .kb-btn-gray{
	color:var(--ink,#3a3a3a);
	background:var(--paper2,#efe4c8);
	border-color:var(--line2,#c3b18a);
}
.bjkb .kb-btn-gray:hover{
	color:#fff8e8;
}
.bjkb .kb-btn-block{
	display:block;
	width:100%;
	margin-top:10px;
}
.bjkb .kb-tip{
	font-size:12.5px;
	color:var(--ink2,#6b6252);
	margin-bottom:.8em;
}
.bjkb .kb-tip b{
	color:var(--red,#b5342c);
}

/* ---------------------------------------------------------------- 筛选 chip */
.bjkb .kb-cats{
	display:flex;
	flex-wrap:wrap;
	gap:8px;
	margin-bottom:10px;
}
.bjkb .kb-chip{
	display:inline-block;
	padding:4px 12px;
	font-size:14px;
	cursor:pointer;
	color:var(--ink,#3a3a3a);
	background:var(--card,#fffdf6);
	border:1px solid var(--line,#d9cba6);
	border-radius:99px;
	transition:.15s;
}
.bjkb .kb-chip:hover{
	color:var(--red,#b5342c);
	border-color:var(--red,#b5342c);
}
.bjkb .kb-chip.on{
	color:#fff8e8;
	background:var(--red,#b5342c);
	border-color:var(--red,#b5342c);
}
.bjkb .kb-chip i{
	font-style:normal;
	opacity:.65;
	font-size:12px;
	margin-left:2px;
}
.bjkb .kb-chip.on i{
	opacity:.85;
}

/* ---------------------------------------------------------------- 拼音索引 */
.bjkb .kb-az{
	display:flex;
	flex-wrap:wrap;
	gap:4px;
	margin-bottom:10px;
	font-family:var(--sans,"Microsoft YaHei",sans-serif);
}
.bjkb .kb-letter{
	min-width:26px;
	text-align:center;
	padding:2px 4px;
	font-size:13px;
	cursor:pointer;
	text-transform:uppercase;
	color:var(--ink2,#6b6252);
	background:transparent;
	border:1px solid transparent;
	border-radius:4px;
}
.bjkb .kb-letter:hover{
	color:var(--red,#b5342c);
	border-color:var(--line,#d9cba6);
}
.bjkb .kb-letter.off{
	opacity:.35;
	cursor:default;
	text-decoration:line-through;
}
.bjkb .kb-letter.on{
	color:#fff8e8;
	background:var(--green,#2f5d50);
	border-color:var(--green,#2f5d50);
}

/* ---------------------------------------------------------------- 统计条 */
.bjkb .kb-bar{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:10px;
	padding:8px 0 4px 0;
	margin-bottom:8px;
	border-top:1px dashed var(--line2,#c3b18a);
	font-size:13.5px;
	color:var(--ink2,#6b6252);
}
.bjkb .kb-check{
	cursor:pointer;
	user-select:none;
}
.bjkb .kb-check input{
	vertical-align:-2px;
	margin-right:4px;
}

/* ---------------------------------------------------------------- 词卡列表 */
.bjkb .kb-list{
	display:flex;
	flex-direction:column;
	gap:12px;
}
.bjkb .kb-item{
	position:relative;
	padding:14px 16px;
	background:var(--card,#fffdf6);
	border:1px solid var(--line,#d9cba6);
	border-left:4px solid var(--red,#b5342c);
	border-radius:var(--r-s,6px);
	transition:.15s;
}
.bjkb .kb-item:hover{
	box-shadow:0 4px 14px rgba(120,96,50,.14);
}
.bjkb .kb-item.flash{
	animation:kbflash 1.4s ease;
}
@keyframes kbflash{
	0%{background:#fbeecb;}
	100%{background:var(--card,#fffdf6);}
}
.bjkb .kb-hd{
	display:flex;
	align-items:baseline;
	flex-wrap:wrap;
	gap:8px;
	padding-right:70px;
}
.bjkb .kb-t{
	font-family:var(--sans,"Microsoft YaHei",sans-serif);
	font-size:19px;
	font-weight:bold;
	color:var(--ink,#3a3a3a);
	letter-spacing:.03em;
	margin:0;
}
.bjkb .kb-p{
	font-size:13px;
	color:var(--green,#2f5d50);
	letter-spacing:.02em;
}
.bjkb .kb-cat{
	font-size:12px;
	padding:1px 8px;
	color:#fff8e8;
	background:var(--blue,#26456e);
	border-radius:99px;
}
.bjkb .kb-star{
	position:absolute;
	top:10px;
	right:12px;
	font-size:19px;
	line-height:1;
	cursor:pointer;
	color:var(--line2,#c3b18a);
	user-select:none;
}
.bjkb .kb-star.on{
	color:var(--gold,#c9a227);
}
.bjkb .kb-m{
	font-size:15.5px;
	line-height:1.85;
	color:var(--ink,#3a3a3a);
	margin:.5em 0 0 0;
}
.bjkb .kb-e{
	font-size:14.5px;
	line-height:1.8;
	color:var(--ink2,#6b6252);
	margin:.4em 0 0 0;
	padding-left:.8em;
	border-left:2px solid var(--line,#d9cba6);
}
.bjkb .kb-e b{
	color:var(--red,#b5342c);
	font-weight:normal;
}
.bjkb .kb-foot{
	display:flex;
	align-items:center;
	flex-wrap:wrap;
	gap:8px;
	margin-top:.7em;
}
.bjkb .kb-tags span{
	display:inline-block;
	margin-right:6px;
	font-size:12.5px;
	color:var(--green,#2f5d50);
	background:rgba(47,93,80,.08);
	border-radius:4px;
	padding:1px 7px;
}
.bjkb .kb-copy{
	margin-left:auto;
	font-size:12.5px;
	padding:2px 10px;
	cursor:pointer;
	color:var(--ink2,#6b6252);
	background:transparent;
	border:1px solid var(--line2,#c3b18a);
	border-radius:99px;
}
.bjkb .kb-copy:hover{
	color:#fff8e8;
	background:var(--red,#b5342c);
	border-color:var(--red,#b5342c);
}
.bjkb .kb-copy.done{
	color:#fff8e8;
	background:var(--green,#2f5d50);
	border-color:var(--green,#2f5d50);
}
.bjkb mark{
	color:var(--red,#b5342c);
	background:rgba(201,162,39,.28);
	padding:0 1px;
	border-radius:2px;
}
.bjkb .kb-empty{
	padding:26px 0;
	text-align:center;
	font-size:15px;
	color:var(--ink2,#6b6252);
}

/* ---------------------------------------------------------------- 侧栏卡片 */
.bjkb .kb-help{
	list-style:none;
	margin:0;
	padding:0;
}
.bjkb .kb-help li{
	font-size:13.5px;
	line-height:1.85;
	color:var(--ink2,#6b6252);
	padding:3px 0;
}
.bjkb .kb-help b{
	color:var(--red,#b5342c);
	font-weight:normal;
}
.bjkb .kb-daily{
	font-size:14px;
	line-height:1.9;
	color:var(--ink,#3a3a3a);
	min-height:72px;
	padding:8px 10px;
	background:var(--paper2,#efe4c8);
	border:1px dashed var(--line2,#c3b18a);
	border-radius:var(--r-s,6px);
}
.bjkb .kb-daily b{
	display:block;
	color:var(--red,#b5342c);
	font-size:16px;
	margin-bottom:2px;
}

/* ---------------------------------------------------------------- 移动端 */
@media (max-width:700px){
	.bjkb .kb-search{
		flex-wrap:wrap;
	}
	.bjkb .kb-search-icon{
		border-radius:var(--r-s,6px);
	}
	.bjkb .kb-input{
		flex:1 1 60%;
		border-radius:var(--r-s,6px);
	}
	.bjkb .kb-hd{
		padding-right:44px;
	}
	.bjkb .kb-t{
		font-size:17px;
	}
	.bjkb .kb-m{
		font-size:15px;
	}
}