.page-diablo-board {
    margin: 0;
    color: #c7c9ce;
    background: #15161a;
    font-family: Pretendard, "Noto Sans KR", "Apple SD Gothic Neo", Arial, sans-serif;
}
.page-diablo-board,
.page-diablo-board * { box-sizing: border-box; }
.page-diablo-board a { color: inherit; text-decoration: none; }
.page-diablo-board button,
.page-diablo-board input,
.page-diablo-board textarea { font: inherit; }
.page-diablo-board .community-board-page {
    min-height: 640px;
    padding: 34px 0 72px;
    background: #15161a;
}
.page-diablo-board .community-board-shell { width: min(calc(100% - 48px), 1220px); }
.page-diablo-board .community-board-breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 24px;
    color: #747984;
    font-size: 11px;
}
.page-diablo-board .community-board-breadcrumb a:hover { color: #d6d8dc; }
.page-diablo-board .community-board-breadcrumb strong { color: #aeb1b7; font-weight: 700; }
.page-diablo-board .community-board-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 28px;
    padding: 28px 30px;
    margin-bottom: 20px;
    background: #1a1b1f;
    border: 1px solid #303238;
    border-top: 3px solid #8e1714;
}
.page-diablo-board .community-board-heading.is-compact { padding-block: 24px; }
.page-diablo-board .community-board-heading p {
    margin: 0 0 8px;
    color: #d96c68;
    font: 800 9px/1 Arial, sans-serif;
    letter-spacing: .15em;
}
.page-diablo-board .community-board-heading h1 {
    margin: 0;
    color: #e1e2e5;
    font-size: 30px;
    line-height: 1.2;
    letter-spacing: -.045em;
}
.page-diablo-board .community-board-heading span {
    display: block;
    margin-top: 9px;
    color: #81858e;
    font-size: 12px;
    line-height: 1.6;
}
.page-diablo-board .community-board-primary {
    flex: 0 0 auto;
    display: inline-flex;
    min-height: 40px;
    padding: 0 18px;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: #6f2522;
    border: 1px solid #a64039;
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
}
.page-diablo-board .community-board-primary:hover { background: #7e2c27; }
.page-diablo-board .community-board-alert {
    margin-bottom: 14px;
    padding: 12px 14px;
    border: 1px solid #3a3d43;
    background: #1c1e23;
    color: #bfc3ca;
    font-size: 12px;
}
.page-diablo-board .community-board-alert.is-success { border-color: #355843; color: #9fceb0; }
.page-diablo-board .community-board-alert.is-error { border-color: #6d3737; color: #e2a3a3; }
.page-diablo-board .community-board-search {
    display: flex;
    justify-content: flex-end;
    gap: 7px;
    margin: 0 0 12px;
}
.page-diablo-board .community-board-search input {
    width: min(100%, 330px);
    min-height: 38px;
    padding: 0 12px;
    color: #d8dade;
    background: #191a1e;
    border: 1px solid #34363c;
    outline: none;
}
.page-diablo-board .community-board-search input:focus { border-color: #69504d; }
.page-diablo-board .community-board-search button,
.page-diablo-board .community-board-search a {
    min-height: 38px;
    padding: 0 13px;
    display: inline-flex;
    align-items: center;
    border: 1px solid #3c3e44;
    background: #202126;
    color: #c5c7cc;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
}
.page-diablo-board .community-board-table-wrap { border-top: 2px solid #55585f; overflow-x: auto; }
.page-diablo-board .community-board-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    background: #18191d;
}
.page-diablo-board .community-board-table th {
    height: 42px;
    padding: 0 12px;
    color: #8f939c;
    background: #1d1e22;
    border-bottom: 1px solid #34363c;
    font-size: 10px;
    font-weight: 700;
    text-align: center;
}
.page-diablo-board .community-board-table td {
    height: 52px;
    padding: 0 12px;
    color: #8f939b;
    border-bottom: 1px solid #2b2d32;
    font-size: 11px;
    text-align: center;
}
.page-diablo-board .community-board-table tbody tr:hover { background: #1d1e23; }
.page-diablo-board .community-board-table tbody tr.is-pinned { background: #1b1b1f; }
.page-diablo-board .community-board-table .is-number { width: 78px; }
.page-diablo-board .community-board-table .is-author { width: 130px; }
.page-diablo-board .community-board-table .is-date { width: 110px; }
.page-diablo-board .community-board-table .is-count { width: 78px; }
.page-diablo-board .community-board-title-cell { text-align: left !important; }
.page-diablo-board .community-board-title-cell a {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 7px;
}
.page-diablo-board .community-board-title-cell strong {
    overflow: hidden;
    color: #d0d2d6;
    font-size: 12px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.page-diablo-board .community-board-title-cell span { flex: 0 0 auto; color: #c65e56; font-size: 10px; }
.page-diablo-board .community-board-notice-badge {
    display: inline-flex;
    min-width: 34px;
    height: 21px;
    padding: 0 7px;
    align-items: center;
    justify-content: center;
    color: #f0b0aa;
    background: #40211f;
    border: 1px solid #6c302c;
    font-size: 9px;
    font-weight: 800;
}
.page-diablo-board .community-board-empty td { height: 150px; color: #666a72; }
.page-diablo-board .community-board-pagination {
    display: flex;
    justify-content: center;
    gap: 5px;
    margin-top: 22px;
}
.page-diablo-board .community-board-pagination a {
    min-width: 34px;
    height: 34px;
    padding: 0 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #8e929b;
    border: 1px solid #32343a;
    background: #1a1b1f;
    font-size: 11px;
}
.page-diablo-board .community-board-pagination a.is-current { color: #fff; border-color: #7c302b; background: #52221f; }

/* Editor */
.page-diablo-board .community-editor-form {
    padding: 26px 28px 30px;
    background: #18191d;
    border: 1px solid #303238;
}
.page-diablo-board .community-field { display: block; margin-bottom: 18px; }
.page-diablo-board .community-field > span {
    display: block;
    margin-bottom: 8px;
    color: #aeb1b7;
    font-size: 11px;
    font-weight: 800;
}
.page-diablo-board .community-field > input {
    width: 100%;
    height: 44px;
    padding: 0 13px;
    color: #e0e2e6;
    background: #141519;
    border: 1px solid #373940;
    outline: none;
}
.page-diablo-board .community-field > input:focus { border-color: #76504c; }
.page-diablo-board .community-pin-field {
    margin: -4px 0 18px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #a5a8af;
    font-size: 11px;
    cursor: pointer;
}
.page-diablo-board .community-editor { border: 1px solid #393b42; background: #141519; }
.page-diablo-board .community-editor-toolbar {
    min-height: 44px;
    padding: 6px 8px;
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
    background: #202126;
    border-bottom: 1px solid #393b42;
}
.page-diablo-board .community-editor-toolbar button {
    min-width: 31px;
    height: 30px;
    padding: 0 8px;
    color: #b9bcc3;
    background: #18191d;
    border: 1px solid #34363c;
    font-size: 10px;
    cursor: pointer;
}
.page-diablo-board .community-editor-toolbar button:hover { color: #fff; border-color: #5b5e67; }
.page-diablo-board .community-editor-toolbar > span { width: 1px; height: 20px; margin: 0 3px; background: #3b3d43; }
.page-diablo-board .community-editor-canvas {
    min-height: 430px;
    padding: 24px 26px;
    color: #c7c9ce;
    outline: none;
    font-size: 14px;
    line-height: 1.85;
    overflow-wrap: anywhere;
}
.page-diablo-board .community-editor-canvas:empty::before { content: attr(data-placeholder); color: #62666f; }
.page-diablo-board .community-editor-canvas p { margin: 0 0 1em; }
.page-diablo-board .community-editor-canvas h2 { margin: 1.5em 0 .65em; color: #e1e2e5; font-size: 24px; }
.page-diablo-board .community-editor-canvas h3 { margin: 1.35em 0 .55em; color: #d5d7db; font-size: 19px; }
.page-diablo-board .community-editor-canvas blockquote { margin: 1.2em 0; padding: 8px 14px; border-left: 3px solid #7d302b; background: #1b1c20; color: #aeb2ba; }
.page-diablo-board .community-editor-canvas a { color: #8aa6d8; text-decoration: underline; }
.page-diablo-board .community-editor-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}
.page-diablo-board .community-editor-actions > a {
    min-height: 40px;
    padding: 0 17px;
    display: inline-flex;
    align-items: center;
    color: #a4a7ae;
    border: 1px solid #393b41;
    background: #1b1c20;
    font-size: 11px;
    font-weight: 700;
}

/* View */
.page-diablo-board .community-post {
    border-top: 2px solid #55585f;
    background: #18191d;
}
.page-diablo-board .community-post-header { padding: 26px 28px 20px; border-bottom: 1px solid #32343a; }
.page-diablo-board .community-post-title-row { display: flex; align-items: center; gap: 10px; }
.page-diablo-board .community-post-title-row h1 { margin: 0; color: #e2e3e6; font-size: 25px; line-height: 1.35; letter-spacing: -.035em; }
.page-diablo-board .community-post-header dl { margin: 14px 0 0; display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.page-diablo-board .community-post-header dl div { display: flex; align-items: center; gap: 6px; }
.page-diablo-board .community-post-header dt { color: #686c74; font-size: 10px; }
.page-diablo-board .community-post-header dd { margin: 0; color: #9da1aa; font-size: 10px; }
.page-diablo-board .community-post-content {
    min-height: 340px;
    padding: 34px 30px 54px;
    color: #c3c6cc;
    font-size: 14px;
    line-height: 1.9;
    overflow-wrap: anywhere;
}
.page-diablo-board .community-post-content p { margin: 0 0 1.2em; }
.page-diablo-board .community-post-content h2 { margin: 1.7em 0 .7em; color: #e2e3e6; font-size: 25px; }
.page-diablo-board .community-post-content h3 { margin: 1.5em 0 .65em; color: #d7d9dd; font-size: 20px; }
.page-diablo-board .community-post-content ul,
.page-diablo-board .community-post-content ol { padding-left: 1.5em; }
.page-diablo-board .community-post-content blockquote { margin: 1.4em 0; padding: 10px 16px; color: #acb0b8; background: #1e1f24; border-left: 3px solid #81332d; }
.page-diablo-board .community-post-content a { color: #8da8da; text-decoration: underline; }
.page-diablo-board .community-post-actions {
    min-height: 58px;
    padding: 10px 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid #303238;
}
.page-diablo-board .community-post-actions > a,
.page-diablo-board .community-post-actions > div a,
.page-diablo-board .community-post-actions button {
    min-height: 34px;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    color: #a8abb2;
    background: #202126;
    border: 1px solid #393b41;
    font-size: 10px;
    font-weight: 700;
    cursor: pointer;
}
.page-diablo-board .community-post-actions > div { display: flex; gap: 6px; }
.page-diablo-board .community-post-actions form { margin: 0; }

/* Comments */
.page-diablo-board .community-comments { margin-top: 22px; background: #18191d; border: 1px solid #303238; }
.page-diablo-board .community-comments > header { padding: 18px 22px; border-bottom: 1px solid #303238; }
.page-diablo-board .community-comments h2 { margin: 0; color: #d5d7db; font-size: 16px; }
.page-diablo-board .community-comments h2 span { color: #c4574f; font-size: 12px; }
.page-diablo-board .community-comment-list { padding: 0 22px; }
.page-diablo-board .community-comments-empty { margin: 0; padding: 32px 0; color: #666a72; font-size: 11px; text-align: center; }
.page-diablo-board .community-comment { padding: 18px 0; border-bottom: 1px solid #2b2d32; }
.page-diablo-board .community-comment:last-child { border-bottom: 0; }
.page-diablo-board .community-comment > header { display: flex; align-items: baseline; gap: 10px; }
.page-diablo-board .community-comment > header strong { color: #cfd1d5; font-size: 11px; }
.page-diablo-board .community-comment > header time { color: #646871; font-size: 9px; }
.page-diablo-board .community-comment > p { margin: 10px 0 0; color: #b0b3ba; font-size: 12px; line-height: 1.75; }
.page-diablo-board .community-comment-tools { margin-top: 10px; display: flex; align-items: start; gap: 8px; }
.page-diablo-board .community-comment-tools summary,
.page-diablo-board .community-comment-tools > form button { color: #777b84; background: transparent; border: 0; padding: 0; font-size: 9px; cursor: pointer; }
.page-diablo-board .community-comment-tools details form { margin-top: 8px; display: flex; gap: 6px; }
.page-diablo-board .community-comment-tools textarea { width: min(520px, 65vw); min-height: 74px; padding: 9px; resize: vertical; color: #c9ccd2; background: #141519; border: 1px solid #36383e; }
.page-diablo-board .community-comment-tools details button { align-self: end; min-height: 30px; color: #b8bbc1; background: #25262b; border: 1px solid #3b3d43; cursor: pointer; }
.page-diablo-board .community-comment-form { padding: 20px 22px 22px; border-top: 1px solid #303238; }
.page-diablo-board .community-comment-form > div { margin-bottom: 8px; display: flex; align-items: center; gap: 9px; }
.page-diablo-board .community-comment-form strong { color: #d0d2d6; font-size: 11px; }
.page-diablo-board .community-comment-form span { color: #666a72; font-size: 9px; }
.page-diablo-board .community-comment-form textarea { width: 100%; min-height: 92px; padding: 12px; display: block; resize: vertical; color: #cbd0d6; background: #141519; border: 1px solid #373940; outline: none; font-size: 12px; line-height: 1.65; }
.page-diablo-board .community-comment-form textarea:focus { border-color: #6d4946; }
.page-diablo-board .community-comment-form button { margin-top: 8px; margin-left: auto; display: flex; }
.page-diablo-board .community-comment-login { padding: 22px; border-top: 1px solid #303238; color: #777b84; font-size: 11px; }
.page-diablo-board .community-comment-login a { color: #d0d2d6; font-weight: 800; }

@media (max-width: 760px) {
    .page-diablo-board .community-board-page { padding: 22px 0 52px; }
    .page-diablo-board .community-board-shell { width: min(calc(100% - 28px), 1220px); }
    .page-diablo-board .community-board-heading { padding: 22px 18px; align-items: flex-start; flex-direction: column; gap: 18px; }
    .page-diablo-board .community-board-heading h1 { font-size: 25px; }
    .page-diablo-board .community-board-search { justify-content: stretch; }
    .page-diablo-board .community-board-search input { width: 100%; min-width: 0; }
    .page-diablo-board .community-board-table .is-author,
    .page-diablo-board .community-board-table .is-count { display: none; }
    .page-diablo-board .community-board-table .is-number { width: 58px; }
    .page-diablo-board .community-board-table .is-date { width: 82px; }
    .page-diablo-board .community-board-table th,
    .page-diablo-board .community-board-table td { padding-inline: 7px; }
    .page-diablo-board .community-board-title-cell strong { font-size: 11px; }
    .page-diablo-board .community-editor-form { padding: 18px 14px 22px; }
    .page-diablo-board .community-editor-canvas { min-height: 330px; padding: 18px 14px; font-size: 13px; }
    .page-diablo-board .community-editor-toolbar { gap: 3px; }
    .page-diablo-board .community-post-header { padding: 22px 18px 17px; }
    .page-diablo-board .community-post-title-row { align-items: flex-start; flex-direction: column; }
    .page-diablo-board .community-post-title-row h1 { font-size: 21px; }
    .page-diablo-board .community-post-header dl { gap: 11px 14px; }
    .page-diablo-board .community-post-content { min-height: 260px; padding: 26px 18px 42px; font-size: 13px; }
    .page-diablo-board .community-comment-list,
    .page-diablo-board .community-comment-form { padding-inline: 16px; }
}