/* 블로그별 꾸미기 값(관리 > 디자인)을 기본 스킨에 입힌다. 값은 모듈이 :root 에 넣는 --bz-* 변수와 body 의 bz-* 클래스로 온다 */
.bzs { --bzs-accent: var(--bz-accent, #3B5BFD); --bzs-accent-text: var(--bz-accent-text, #3050F0); --bzs-on-accent: var(--bz-on-accent, #fff);
	--bzs-bg: #fff; --bzs-card: #fff; --bzs-code: #f0f2f5; --bzs-code-text: #c0392b;
	background: var(--bzs-bg); font-family: var(--bz-font-body, 'Pretendard Variable', Pretendard, system-ui, sans-serif); }
.bzs h1, .bzs h2, .bzs h3, .bzs-brand b, .bzs-post-title, .bzs-hero h1 { font-family: var(--bz-font-head, inherit); }
.bzs-content { font-family: var(--bz-font-body, inherit); }
.bzs-write, .bzs-content [data-bz="button"] a { background: var(--bzs-accent); color: var(--bzs-on-accent) !important; }
.bzs-kicker, .bzs-cat { color: var(--bzs-accent-text); }
.bzs-content a { color: var(--bzs-accent-text); }
.bzs-share a, .bzs-share button, .bzs-search input:focus { background: var(--bzs-card); }

/* 밝기 */
body.bz-scheme-dark, body.bz-scheme-dark .bzs { color-scheme: dark; }
body.bz-scheme-dark { background: #121214; }
body.bz-scheme-dark .bzs {
	--bzs-text: #ececef; --bzs-sub: #b0b0ba; --bzs-mute: #9a9aa4; --bzs-line: #2e2e34; --bzs-soft: #1f1f24;
	--bzs-bg: #121214; --bzs-card: #1a1a1e; --bzs-code: #26262c; --bzs-code-text: #ff9b8f; --bzs-accent-text: var(--bz-accent-text-dark, #9AABFF); }
@media (prefers-color-scheme: dark) {
	body.bz-scheme-auto, body.bz-scheme-auto .bzs { color-scheme: dark; }
	body.bz-scheme-auto { background: #121214; }
	body.bz-scheme-auto .bzs {
		--bzs-text: #ececef; --bzs-sub: #b0b0ba; --bzs-mute: #9a9aa4; --bzs-line: #2e2e34; --bzs-soft: #1f1f24;
		--bzs-bg: #121214; --bzs-card: #1a1a1e; --bzs-code: #26262c; --bzs-code-text: #ff9b8f; --bzs-accent-text: var(--bz-accent-text-dark, #9AABFF); }
}
.bzs-btn, .bzs-pages strong, .bzs-brand span { background: var(--bzs-text); color: var(--bzs-bg) !important; }
.bzs-btn:hover { background: var(--bzs-accent); color: var(--bzs-on-accent) !important; }
.bzs-content code { background: var(--bzs-code); color: var(--bzs-code-text); }
.bzs-search input { color: var(--bzs-text); }
.bzs-search input:focus { background: var(--bzs-card); }
.bzs-content mark { color: #1a1d23; }

/* 사이드바 위치 */
body.bz-side-left .bzs-layout { grid-template-columns: 280px minmax(0, 1fr); }
body.bz-side-left .bzs-layout > .bzs-side { order: -1; }
body.bz-side-none .bzs-layout { grid-template-columns: minmax(0, 1fr); }
body.bz-side-none .bzs-layout > .bzs-side { display: none; }

/* 목록 모양: 격자 */
.bzs-posts.is-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 20px; }
.bzs-posts.is-grid a { display: flex; flex-direction: column-reverse; gap: 12px; }
.bzs-posts.is-grid .bzs-thumb { width: 100%; height: auto; aspect-ratio: 1 / 1; }
.bzs-posts.is-grid h2 { font-size: 17px; }
.bzs-posts.is-grid .bzs-excerpt, .bzs-posts.is-grid .bzs-sub { display: none; }
body.bz-side-none .bzs-posts.is-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }

/* 대문 묶음 */
.bzs-home-sec + .bzs-home-sec { margin-top: 56px; }
.bzs-home-sec > h2.bzs-sec-title { margin: 0 0 20px; font-size: 20px; font-weight: 800; letter-spacing: -.02em; }
.bzs-home-rank { margin: 0; padding: 0; list-style: none; counter-reset: r; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 32px; }
.bzs-home-rank li { counter-increment: r; border-top: 1px solid var(--bzs-line); }
.bzs-home-rank a { display: flex; gap: 14px; padding: 14px 0; font-weight: 600; color: var(--bzs-text); }
.bzs-home-rank a::before { content: counter(r); flex: none; width: 20px; color: var(--bzs-accent-text); font-weight: 800; }
.bzs-home-rank a:hover { text-decoration: underline; text-underline-offset: 4px; }
.bzs-home-series { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.bzs-home-series a { display: flex; flex-direction: column; gap: 6px; padding: 20px; border: 1px solid var(--bzs-line); border-radius: 14px; background: var(--bzs-card); color: var(--bzs-text); }
.bzs-home-series a:hover { border-color: var(--bzs-accent); }
.bzs-home-series b { font-size: 16px; }
.bzs-home-series small { color: var(--bzs-mute); font-size: 13px; }
.bzs-home-about { display: flex; gap: 20px; align-items: flex-start; padding: 24px; border-radius: 16px; background: var(--bzs-soft); }
.bzs-home-about img { flex: none; width: 64px; height: 64px; border-radius: 50%; object-fit: cover; }
.bzs-home-about p { margin: 6px 0 0; color: var(--bzs-sub); line-height: 1.7; }

@media (max-width: 960px) {
	body.bz-side-left .bzs-layout { grid-template-columns: minmax(0, 1fr); }
	body.bz-side-left .bzs-layout > .bzs-side { order: 0; }
	.bzs-posts.is-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.bzs-home-series { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
	.bzs-home-rank, .bzs-home-series { grid-template-columns: minmax(0, 1fr); }
	.bzs-posts.is-grid { gap: 20px 12px; }
	.bzs-posts.is-grid h2 { font-size: 15px; }
}
