/* [성능 최적화 완료] 
   기존 최상단 @import url은 렌더링을 차단하므로 과감히 제거했습니다. 
   HTML head에서 subset(경량화) 버전을 preload(사전 로드)하여 속도를 극대화합니다.
*/

/* [성능 및 가독성 최적화] */
body {
    text-size-adjust: 100%;
    font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo', 'Noto Sans KR', sans-serif;
    font-size: 16px;
    line-height: 1.6;
    color: #333;
    -webkit-font-smoothing: antialiased;
}

body, html { width: 100%; margin: 0; padding: 0; }

/* [CLS 및 애드센스 Width=0 에러 완벽 해결] 
   너비를 명시적으로 100% 채우고 가상 공간을 확보하여 구글 크롤러와 스크립트가 
   광고 크기를 오판해 에러를 뿜는 현상을 완벽하게 차단합니다. */
.adsense-area { 
    width: 100%;
    min-width: 100%;
    min-height: 280px; 
    margin: 20px 0;
    display: flex; 
    align-items: center; 
    justify-content: center; 
    background-color: #fafafa; 
    overflow: hidden;
    contain: layout size;
    contain-intrinsic-size: 100% 280px;
    box-sizing: border-box;
}
#header .inner { min-height: 82px; }

/* [접근성] 텍스트 대비 향상 (구독 버튼 등 명도 대비 최적화) */
.txt_tool_id, .btn_subscription { color: #444 !important; font-weight: 500; }
.btn, a.btn { background-color: #444 !important; color: #fff !important; }

/* [SEO & 가독성 보완] 리팩토링된 하단 페이지네이션 정렬 스타일 추가 */
.pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    margin: 40px 0;
}
.pagination a { 
    color: #222 !important; 
    text-decoration: none;
    font-weight: 500; 
    padding: 6px 12px;
    border-radius: 4px;
    transition: background-color 0.2s;
}
.pagination a:hover {
    background-color: #f0f0f0;
}
.pagination a.num {
    font-size: 15px;
}

/* 레이아웃 구조 */
#header .inner { max-width: 1080px; margin: 0 auto; padding: 40px 20px; box-sizing: border-box; }
.content-wrap { max-width: 1080px; margin: 0 auto; display: flex; flex-wrap: wrap; }
#content { width: 70%; padding: 0 20px; box-sizing: border-box; }
#aside { width: 30%; padding: 0 20px; box-sizing: border-box; }

/* 이미지 및 썸네일 속도 최적화 */
img { 
    max-width: 100%; 
    height: auto; 
    object-fit: cover; 
    content-visibility: auto; /* 화면 밖에 있는 이미지는 필요할 때만 렌더링 */
}
.post-item .thum { 
    display: block; 
    position: relative; 
    width: 100%; 
    padding-bottom: 100%; 
    background-color: #f0f0f0; 
    border-radius: 10px; 
    overflow: hidden; 
    margin-bottom: 10px;
}
.post-item .thum img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/* 본문 가독성 (수익형 블로그 최적화 자간 및 행간) */
.entry-content { 
    font-size: 1.125em; 
    line-height: 1.8; 
    color: #222; 
    letter-spacing: -0.01em; 
}
.entry-content h1, .entry-content h2, .entry-content h3 { color: #000; margin: 1.6em 0 0.8em; font-weight: bold; }
.entry-content p { margin-bottom: 1.6em; word-break: break-word; }

/* 모바일 대응 (반응형 완벽 지원) */
@media screen and (max-width: 767px) {
    #content, #aside { width: 100%; padding: 0 15px; }
    #header .inner { padding: 20px 15px; text-align: center; }
    .entry-content { font-size: 17px; }
    .adsense-area { min-height: 250px; contain-intrinsic-size: 100% 250px; } /* 모바일 광고 높이 최적화 */
    .pagination { gap: 8px; margin: 30px 0; }
}