.bsk-help-center-detail,
.bsk-help-center-detail * { box-sizing: border-box; }
.bsk-help-center-detail { min-height: 900px; color: var(--bsk-text-primary); background: #fff; }
.bsk-help-center-detail-layout { display: flex; align-items: stretch; border-bottom: 1px solid var(--bsk-divider)}
.bsk-help-detail-content { width: calc(100% - 310px); min-height: 900px; padding: 0 0 100px 36px; border-left: 1px solid var(--bsk-divider); }

.bsk-help-detail-breadcrumb { display: flex; height: 68px; align-items: center; gap: 16px; overflow: hidden; border-bottom: 1px solid var(--bsk-divider); color: var(--bsk-text-secondary); font-size: 14px; font-weight: 500; line-height: 1.5; white-space: nowrap; }
.bsk-help-detail-breadcrumb a { flex: 0 0 auto; color: var(--bsk-text-primary); font-weight: 600; text-decoration: none; }
.bsk-help-detail-breadcrumb > span[aria-hidden] { width: 8px; height: 8px; flex: 0 0 8px; border-top: 1.5px solid var(--bsk-text-tertiary); border-right: 1.5px solid var(--bsk-text-tertiary); transform: rotate(45deg); }
.bsk-help-detail-breadcrumb > span[aria-current] { min-width: 0; overflow: hidden; color: var(--bsk-text-secondary); font-weight: 500; text-overflow: ellipsis; }

.bsk-help-detail-header { width: 800px; margin: 0 auto; padding: 60px 0 40px; }
.bsk-help-detail-header h1 { margin: 0; color: var(--bsk-text-primary); font-size: 50px; font-weight: 800; line-height: 1.5; }
.bsk-help-detail-author-label { display: inline-flex; margin-top: 24px; padding: 12px 20px; align-items: center; gap: 12px; border-radius: 40px; background: var(--bsk-bg-gray); color: var(--bsk-text-primary); font-size: 18px; line-height: 1.4; }
.bsk-help-detail-author-label img { display: block; width: 32px; height: 32px; flex: 0 0 32px; border-radius: 50%; object-fit: cover; }
.bsk-help-detail-author-label span { font-weight: 400; }
.bsk-help-detail-author-label strong { font-weight: 700; }

.bsk-help-detail-written { display: flex; width: 800px; margin: 80px auto 0; flex-direction: column; gap: 16px; }
.bsk-help-detail-written-title { margin: 0; color: var(--bsk-text-primary); font-size: 24px; font-weight: 700; line-height: 1.6; }
.bsk-help-detail-written-card { display: flex; width: 100%; padding: 24px; align-items: flex-start; gap: 20px; border-radius: 24px; background: var(--bsk-bg-gray); }
.bsk-help-detail-written-card > img { width: 56px; height: 56px; flex: 0 0 56px; border-radius: 50%; object-fit: cover; }
.bsk-help-detail-written-card > div { display: flex; min-width: 0; flex: 1; flex-direction: column; justify-content: center; gap: 8px; }
.bsk-help-detail-written-card span { width: fit-content; color: var(--bsk-text-primary); font-size: 18px; font-weight: 700; line-height: 1.4; }
.bsk-help-detail-written-card p { margin: 0; color: var(--bsk-text-secondary); font-size: 16px; font-weight: 400; line-height: 1.5; }

.bsk-help-detail-feedback { display: flex; width: 800px; margin: 80px auto 0; padding: 24px 0; align-items: center; gap: 32px; border-top: 1px solid var(--bsk-divider); border-bottom: 1px solid var(--bsk-divider); }
.bsk-help-detail-feedback > p { margin: 0; color: var(--bsk-text-primary); font-size: 20px; font-weight: 800; line-height: 1.5; }
.bsk-help-detail-feedback-actions { display: flex; align-items: center; gap: 16px; }
.bsk-help-detail-feedback-actions button { display: inline-flex; min-width: 94px; padding: 8px 0; align-items: center; justify-content: center; gap: 8px; border: 1px solid var(--bsk-text-tertiary); border-radius: 8px; background: #fff; color: var(--bsk-text-secondary); font-family: var(--bsk-font-base); font-size: 18px; font-weight: 700; line-height: 1.6; cursor: pointer; transition: border-color .2s ease, background-color .2s ease, color .2s ease; }
.bsk-help-detail-feedback-yes img { display: none; width: 16px; height: 16px; flex: 0 0 16px; }
.bsk-help-detail-feedback-actions button.is-selected { border-color: var(--bsk-primary); background: var(--bsk-primary); color: #fff; }
.bsk-help-detail-feedback-yes.is-selected img { display: block; }
.bsk-help-detail-feedback-actions button.is-muted { border-color: var(--bsk-divider); background: #fff; color: var(--bsk-divider); }
.bsk-help-detail-feedback-actions button:not(.is-selected):hover,
.bsk-help-detail-feedback-actions button:not(.is-selected):focus-visible { border-color: rgba(6, 52, 230, .43); color: var(--bsk-primary); }

.bsk-help-detail-related { width: 800px; margin: 80px auto 0; }
.bsk-help-detail-related h2 { margin: 0; color: var(--bsk-text-primary); font-size: 36px; font-weight: 800; line-height: 1.4; }
.bsk-help-detail-related-list { display: flex; margin-top: 32px; flex-direction: column; gap: 16px; }
.bsk-help-detail-related-list a { width: fit-content; color: var(--bsk-text-primary); font-size: 18px; font-weight: 400; line-height: 1.6; text-decoration: underline; transition: color .2s ease; }
.bsk-help-detail-related-list a:hover,
.bsk-help-detail-related-list a:focus { color: var(--bsk-primary); }
