.bbs-main-wrap {
        
        margin: 0 auto;
        padding: 40px 20px 60px 20px;
    }
    .bbs-search-bar {
        background: var(--secondary-bg);
        border: 1px solid var(--border-soft);
        border-radius: 16px;
        padding: 16px 20px;
        margin-bottom: 22px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        gap: 12px;
    }
    .search-inputs {
        display: flex;
        gap: 8px;
        align-items: center;
        flex: 1;
        max-width: 620px;
        width: 100%;
    }
    .bbs-select {
        padding: 10px 10px;
        border: 1px solid var(--border-color);
        border-radius: 10px;
        font-size: 14px;
        background: var(--color-white);
        outline: none;
        flex-shrink: 0;
    }
    .bbs-input {
        flex: 1;
        min-width: 0;
        padding: 10px 14px;
        border: 1px solid var(--border-color);
        border-radius: 10px;
        font-size: 14px;
        outline: none;
    }
    .bbs-input:focus, .bbs-select:focus {
        border-color: var(--primary-color);
    }
    .btn-search {
        background: var(--text-color);
        color: var(--color-white);
        border: none;
        padding: 10px 18px;
        border-radius: 10px;
        font-size: 14px;
        font-weight: 700;
        cursor: pointer;
        flex-shrink: 0;
    }
    .bbs-board-table {
        width: 100%;
        border-collapse: collapse;
        background: var(--color-white);
        border: 1px solid var(--border-soft);
        border-radius: 16px;
        overflow: hidden;
        box-shadow: 0 4px 20px rgba(0,0,0,0.02);
    }
    .bbs-board-table thead th {
        background: #fbfbfd;
        padding: 14px 18px;
        font-size: 13px;
        font-weight: 700;
        color: var(--gray-text);
        border-bottom: 1px solid var(--border-soft);
        text-align: left;
    }
    .bbs-board-table tbody tr {
        border-bottom: 1px solid var(--surface-muted);
        transition: background 0.15s;
    }
    .bbs-board-table tbody tr:hover {
        background: #f9f9fb;
    }
    .bbs-board-table tbody td {
        padding: 15px 18px;
        font-size: 14px;
        color: var(--text-color);
    }
    .badge-cat {
        font-size: 11.5px;
        font-weight: 700;
        padding: 3px 8px;
        border-radius: 6px;
        background: #e1f0ff;
        color: var(--primary-color);
        display: inline-block;
    }
    .mobile-cat-label {
        display: none;
        font-size: 13px;
        font-weight: 800;
        color: var(--primary-color);
        margin-bottom: 4px;
        line-height: 1.2;
    }
    @media (max-width: 768px) {
        .bbs-main-wrap {
            padding: 20px 10px 40px 10px;
        }
        .bbs-search-bar {
            padding: 12px;
            gap: 10px;
        }
        .search-inputs {
            max-width: 100%;
            width: 100%;
            gap: 6px;
        }
        .bbs-select, .bbs-input, .btn-search {
            padding: 9px 10px;
            font-size: 13.5px;
        }
        .bbs-board-table thead th, .bbs-board-table tbody td {
            padding: 12px 6px;
        }
        .col-cat-separate, .col-btn-separate {
            display: none !important;
        }
        .mobile-cat-label {
            display: block !important;
        }
        .row-sess-title {
            display: block !important;
            font-size: 14.5px !important;
            font-weight: 800 !important;
            line-height: 1.35 !important;
        }
    }
    .pagination-bar {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 6px;
        margin-top: 30px;
    }
    .page-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 38px;
        height: 38px;
        padding: 0 8px;
        border-radius: 10px;
        font-size: 14px;
        font-weight: 600;
        text-decoration: none;
        color: var(--text-color);
        border: 1px solid var(--border-soft);
        background: var(--color-white);
        transition: all 0.2s;
    }
    .page-btn:hover {
        border-color: var(--primary-color);
        color: var(--primary-color);
    }
    .page-btn.active {
        background: var(--primary-color);
        color: var(--color-white);
        border-color: var(--primary-color);
    }
    
.col-btn-separate { white-space:nowrap; }
.ai-list-solve-btn { display:inline-block; margin-left:5px; padding:7px 12px; background:var(--primary-color); color:var(--color-white); border-radius:8px; font-size:12.5px; font-weight:700; text-decoration:none; }
.ai-list-solve-btn:focus-visible { outline:2px solid var(--primary-color); outline-offset:3px; }

/* The library shares the introduction-card style in a muted midnight blue. */
.ai-library-intro { margin-bottom:24px; padding:28px 32px; border-radius:12px; background:linear-gradient(115deg,#202637 0%,#303b50 60%,#242d40 100%); color:#fff; }
.ai-library-intro .ai-library-eyebrow { margin:0 0 12px; font-size:12px; font-weight:700; color:#e5c892; }
.ai-library-intro h1 { margin:0 0 12px; font-size:30px; font-weight:800; line-height:1.4; letter-spacing:-.6px; color:#fff; word-break:keep-all; overflow-wrap:break-word; }
.ai-library-intro .ai-library-description { margin:0; font-size:14px; line-height:1.7; color:#dce2ed; word-break:keep-all; overflow-wrap:break-word; }
@media(max-width:768px) {
 .ai-library-intro { padding:24px 20px; }
 .ai-library-intro h1 { font-size:25px; letter-spacing:-.5px; }
 .ai-library-intro .ai-library-description { font-size:13px; }
}

.bbs-main-wrap { width:100%; }
@media(max-width:480px) {
 .bbs-board-table { table-layout:fixed; }
 .bbs-board-table th:nth-child(1) { width:32px !important; }
 .bbs-board-table th:nth-child(4) { width:58px !important; }
 .bbs-board-table th:nth-child(5) { width:48px !important; }
 .bbs-board-table td, .bbs-board-table th { overflow-wrap:anywhere; }
}