/* Main Page Specific Styles */
.main_grid_sub { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 30px; align-items: stretch; }
.main_grid_sub > section { height: 100%; margin: 0; box-sizing: border-box; }

.video_sec { grid-column: span 2; }
.video_grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; margin-top: 15px; }
.video_card { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--border-color); border-radius: 10px; overflow: hidden; transition: box-shadow 0.2s, transform 0.2s; }
.video_card:hover { box-shadow: 0 4px 16px rgba(0,0,0,0.08); transform: translateY(-2px); }
.video_item { position: relative; overflow: hidden; aspect-ratio: 16 / 9; border-radius: 0; flex-shrink: 0; }
.video_item img { width: 100%; height: 100%; object-fit: cover; display: block; }
.video_item .play_icon { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 40px; color: rgba(255,255,255,0.9); text-shadow: 0 0 10px rgba(0,0,0,0.5); font-style: normal; }
.video_info { display: flex; flex-direction: column; gap: 6px; padding: 10px 12px 12px; }
.video_title { font-size: 13px; font-weight: 600; color: var(--text-main); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; line-height: 1.4; }
.video_title:hover { color: var(--point-color); }
/* Card Gallery Badges */
.vcard_cat_badge { position: absolute; top: 8px; left: 8px; z-index: 2; background: var(--point-color); color: #fff; font-size: 10px; font-weight: 700; padding: 2px 7px; border-radius: 4px; line-height: 1.5; pointer-events: none; }
.vcard_vote_badge { display: inline-flex; align-items: center; justify-content: center; padding: 2px 8px; background: #fff1f2; color: #e11d48; border-radius: 4px; font-weight: 800; font-size: 11px; min-width: 32px; line-height: 1; white-space: nowrap; align-self: flex-start; }
.vcard_vote_badge.zero { background: #f1f5f9; color: var(--text-mute); font-weight: 600; }

/* Recent Boards 1+2 (50/50) */
.recent_boards_row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.recent_board_box { background: #fff; border: 1px solid var(--border-color); border-radius: 12px; overflow: hidden; }
.recent_board_box .sec_title { padding: 12px 15px 0; border-bottom: none; }
.recent_board_box .sec_title h3 { font-size: 15px; }
.recent_board_box .rb_list td { padding: 7px 15px; }
.recent_board_box .rb_list td.date { width: 1%; white-space: nowrap; font-size: 11px; color: var(--text-mute); padding-right: 15px; }
.recent_board_box .no_data { font-size: 12px; color: var(--text-mute); padding: 15px; }
@media (max-width: 768px) { .recent_boards_row { grid-template-columns: 1fr; } }

.poll_box { background: #fff; border: 1px solid var(--border-color); padding: 20px; border-radius: 8px; }
.poll_box h3.side_title { margin-top: 0; margin-bottom: 15px; }
.poll_item { margin-bottom: 10px; }
.poll_bar_bg { background: #f1f5f9; height: 8px; border-radius: 4px; margin-top: 5px; position: relative; }
.poll_bar_fill { background: var(--point-color); height: 100%; border-radius: 4px; width: 0; transition: width 0.5s; }

/* Main Boards Tabs (Enhanced Normal List Style) */
.main_boards { background: #fff; border: 1px solid var(--border-color); border-radius: 12px; overflow: hidden; }
.board_tabs .tab_header { display: flex; background: #f8fafc; border-bottom: 1px solid var(--border-color); }
.board_tabs .tab_header button { flex: 1; padding: 12px; border: none; background: none; font-size: 14px; font-weight: 700; color: var(--text-sub); cursor: pointer; transition: all 0.2s; position: relative; }
.board_tabs .tab_header button.active { color: var(--point-color); background: #fff; }
.board_tabs .tab_header button.active::after { content: ''; position: absolute; bottom: -1px; left: 0; right: 0; height: 2px; background: var(--point-color); }
.board_tabs .tab_header button:not(.active):hover { background: #f1f5f9; }

.board_tabs .tab_content { padding: 0; }
.board_list { width: 100%; border-collapse: collapse; table-layout: fixed; }
.board_list tr { border-bottom: 1px solid #f1f5f9; transition: background 0.1s; }
.board_list tr:last-child { border-bottom: none; }
.board_list tr:hover { background: #f8fafc; }
.board_list td { padding: 8px 10px; font-size: 13px; vertical-align: middle; }

/* Vote Badge */
.board_list .vote { width: 1%; white-space: nowrap; text-align: center; padding-right: 0; }
.board_list .vote_num { display: inline-flex; align-items: center; justify-content: center; padding: 2px 8px; background: #fff1f2; color: #e11d48; border-radius: 4px; font-weight: 800; font-size: 11px; min-width: 32px; line-height: 1; white-space: nowrap; }
.board_list .vote_num.zero { background: #f1f5f9; color: var(--text-mute); font-weight: 600; }

/* Title & Badges */
.board_list .title { text-align: left; overflow: hidden; }
.board_list .title_link { display: flex; align-items: center; gap: 4px; width: 100%; }
.board_list .title_text { color: var(--text-main); text-decoration: none; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.board_list .title_link:hover .title_text { text-decoration: underline; color: var(--point-color); }

.board_list .cmt_count { display: inline-flex; align-items: center; justify-content: center; height: 16px; min-width: 16px; padding: 0 4px; background: var(--point-color); color: #fff; border-radius: 3px; font-size: 10px; font-weight: 800; flex-shrink: 0; margin-left: 2px; margin-right: 0; }
.board_list .n_icon { display: inline-flex; align-items: center; justify-content: center; height: 16px; min-width: 16px; padding: 0 4px; background: #ef4444; color: #fff; border-radius: 3px; font-size: 10px; font-weight: 800; line-height: 1; flex-shrink: 0; animation: none !important; margin-left: 2px; margin-right: 0; }

/* Meta Info */
.board_list .read, .board_list .date { color: var(--text-mute); font-size: 11px; }
.board_list .meta { width: 130px; text-align: right; padding-right: 15px; white-space: nowrap; }
.board_list .meta .read { display: inline-flex; align-items: center; gap: 2px; margin-right: 8px; }
.board_list .meta .date { display: inline-flex; align-items: center; gap: 2px; }

.board_list td .svg_icon { width: 12px; height: 12px; vertical-align: middle; opacity: 0.5; flex-shrink: 0; }

/* Board Name Badge (게시판 이름) */
.board_list .board_name_cell { width: 1%; white-space: nowrap; padding-right: 0; padding-left: 10px; }
.board_list .board_name_badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 2px 7px;
    background: #f1f5f9;
    color: var(--text-sub);
    border-radius: 4px;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
    max-width: 80px;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.4;
}

/* Category Badge (카테고리) */
.board_list .cat_badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 2px 7px;
    background: color-mix(in srgb, var(--point-color) 12%, transparent);
    color: var(--point-color);
    border-radius: 4px;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
    flex-shrink: 0;
    line-height: 1.4;
}

/* Split Badge (게시판명 | 카테고리 분할 뱃지) */
.board_list .split_badge {
    display: inline-flex;
    align-items: stretch;
    border-radius: 4px;
    overflow: hidden;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
    flex-shrink: 0;
    line-height: 1.4;
    margin-right: 2px;
}
.board_list .split_badge_board {
    display: inline-flex;
    align-items: center;
    padding: 2px 6px;
    background: #f1f5f9;
    color: var(--text-sub);
    max-width: 70px;
    overflow: hidden;
    text-overflow: ellipsis;
}
.board_list .split_badge_cat {
    display: inline-flex;
    align-items: center;
    padding: 2px 6px;
    background: color-mix(in srgb, var(--point-color) 12%, transparent);
    color: var(--point-color);
    max-width: 70px;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* 카테고리 없을 때 게시판명만 단독 뱃지 */
.board_list .split_badge .split_badge_board:only-child {
    border-radius: 4px;
}

/* Responsive Mobile */
@media (max-width: 768px) {
    .board_list td { padding: 10px 8px; }
    .board_list .read { display: none !important; }
    .board_list .vote { width: 38px; }
    .board_list .vote_num { min-width: 28px; font-size: 10px; }
    .board_list .date { width: 40px; padding-right: 10px; }
    .board_list .board_name_cell { display: none; }
    .board_list .cat_badge { font-size: 10px; padding: 1px 5px; }
    .board_list .title { max-width: 0; }
    .board_list .meta { width: 80px; }
    .video_grid { grid-template-columns: repeat(2, 1fr); }
    .video_grid .video_card:nth-child(n+3) { display: none; }
}

/* Sitemap 구조의 카테고리 */
.bottom_sitemap { margin-top: 50px; padding: 40px 30px; background: #fff; border: 1px solid var(--border-color); border-radius: 16px; }
.sitemap_grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; }
.sitemap_col h4 { font-size: 16px; color: var(--point-color); margin-bottom: 20px; padding-bottom: 10px; border-bottom: 2px solid var(--point-color); display: flex; align-items: center; gap: 8px; }
.sitemap_col h4 span { font-size: 18px; }
.sitemap_col ul { list-style: none; padding: 0; margin: 0; }
.sitemap_col ul li { margin-bottom: 10px; }
.sitemap_col ul li a { font-size: 14px; color: var(--text-sub); text-decoration: none; transition: color 0.2s; }
.sitemap_col ul li a:hover { color: var(--point-color); text-decoration: underline; }