@CHARSET "UTF-8";

/**
body, html 기본 세팅
 */
* {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    outline: none;
}

html, body {
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
    font-size: 14px;
    letter-spacing: 0px;
    color: #393941 !important;
    font-family: 'Noto Sans KR', '돋움', Dotum, "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    font-weight: 400 !important;
    word-break: keep-all;
    overflow-x: hidden;
}

#wrap.work-space .container-xl {
    background-color: transparent;
    height: 100% !important;
    min-height: 100%;
}

#wrap.work-space2 .container-xl {
    background-color: transparent;
    height: 100% !important;
    min-height: 100%;
}

/***
스크롤바 표시 안함 - 화면 깜빡임 방지
 */
@media (max-width: 1024px) {

    ::-webkit-scrollbar {
        -webkit-appearance: none;
    }

    ::-webkit-scrollbar:vertical {
        width: 0px;
    }

    ::-webkit-scrollbar:horizontal {
        height: 6px;
    }

    ::-webkit-scrollbar-thumb {
        background-color: rgba(0, 0, 0, .5);
        border-radius: 10px;
        border: 2px solid #ffffff;
    }

    ::-webkit-scrollbar-track {
        border-radius: 10px;
        background-color: #ffffff;
    }
}

#smart_search_result .progress-bar {
    text-align: left;
    padding-left: 5px;
}

/* Google Early Access NotoSansKR OTF (fonts.gstatic.com/ea/...) is discontinued: 404 + no CORS.
   html2canvas PDF capture failed while fetching those files. Remote @font-face removed;
   family name kept for locally installed fonts, then 돋움/Dotum fallback. */

#wrap.work-space {
    background-color: #edf0f5 !important;
    min-height: 100%;
}

#wrap.work-space2 {
    background-color: #edf0f5 !important;
    height: 100% !important;
    min-height: 100%;
}

/*::-webkit-scrollbar { width: 1px; }
::-webkit-scrollbar-thumb { background: #a9a9a9; }*/

@media (max-width: 767px) {
    .fs-xs-5 {
        font-size: 1.25rem !important;
    }

    .fs-xs-6 {
        font-size: 1.00rem !important;
    }

    .fs-xs-7 {
        font-size: 0.75rem !important;
    }

    .fs-xs-8 {
        font-size: 0.5rem !important;
    }

    .col-xs-8 {
        flex: 0 0 auto !important;
        width: 66.6664% !important;
    }

    .col-xs-4 {
        flex: 0 0 auto !important;
        width: 33.3332% !important;
    }

    .col-xs-12 {
        flex: 0 0 auto !important;
        width: 100% !important;
    }

    .col-xs-3 {
        flex: 0 0 auto !important;
        width: 24.9999% !important;
    }

    .col-xs-2 {
        flex: 0 0 auto !important;
        width: 16.6666% !important;
    }

    .col-xs-1 {
        flex: 0 0 auto !important;
        width: 8.3333% !important;
    }

    .pt-xs-2 {
        margin-top: .5rem !important
    }

    /*#wrap.work-space {
        background: linear-gradient(to right, #edf0f5, #edf0f5 1%, white 1%, white 99%, #edf0f5 99%) !important;
        min-height: 100%;
    }

    #wrap.work-space2 {
        !*background-color: #edf0f5;*!
        height: 100% !important;
        background: linear-gradient(to right, #edf0f5, #edf0f5 1%, white 1%, white 99%, #edf0f5 99%) !important;
        min-height: 100%;
    }*/
    .w-xs-100 {
        width: 100% !important;
    }
}

@media (min-width: 768px) {
    .fs-sm-5 {
        font-size: 1.25rem !important;
    }

    .fs-sm-6 {
        font-size: 1.00rem !important;
    }

    .fs-sm-7 {
        font-size: 0.75rem !important;
    }

    .fs-sm-8 {
        font-size: 0.5rem !important;
    }

    body::-webkit-scrollbar {
        display: none;
    }

    /*#wrap.work-space {
        !*background: linear-gradient(to right, #edf0f5, #edf0f5 0.4%, white 0.4%, white 99.6%, #edf0f5 99.6%) !important;*!
        background: linear-gradient(to right, #ffffff, #ffffff 0.4%, #edf0f5 0.4%, #edf0f5 99.6%, #ffffff 99.6%) !important;
        background: #edf0f5 !important;
        min-height: 100%;
    }

    #wrap.work-space2 {
        !*background-color: #edf0f5;*!
        height: 100% !important;
        !*background: linear-gradient(to right, #edf0f5, #edf0f5 0.4%, white 0.4%, white 99.6%, #edf0f5 99.6%) !important;*!
        background: linear-gradient(to right, #ffffff, #ffffff 0.4%, #edf0f5 0.4%, #edf0f5 99.6%, #ffffff 99.6%) !important;
        min-height: 100%;
    }*/
}

@media (min-width: 992px) {
    .fs-md-5 {
        font-size: 1.25rem !important;
    }

    .fs-md-6 {
        font-size: 1.00rem !important;
    }

    .fs-md-7 {
        font-size: 0.75rem !important;
    }

    body::-webkit-scrollbar {
        display: none;
    }

    /*#wrap.work-space {
        !*background: linear-gradient(to right, #edf0f5, #edf0f5 0.4%, white 0.4%, white 99.6%, #edf0f5 99.6%) !important;*!
        background: linear-gradient(to right, #ffffff, #ffffff 0.4%, #edf0f5 0.4%, #edf0f5 99.6%, #ffffff 99.6%) !important;
        min-height: 100%;
    }

    #wrap.work-space2 {
        !*background-color: #edf0f5;*!
        height: 100% !important;
        !*background: linear-gradient(to right, #edf0f5, #edf0f5 0.4%, white 0.4%, white 99.6%, #edf0f5 99.6%) !important;*!
        background: linear-gradient(to right, #ffffff, #ffffff 0.4%,  #edf0f5 0.4%,  #edf0f5 99.6%, #ffffff 99.6%) !important;
        min-height: 100%;
    }*/
}

@media (min-width: 1200px) {
    .fs-lg-5 {
        font-size: 1.25rem !important;
    }

    .fs-lg-6 {
        font-size: 1.00rem !important;
    }

    .fs-lg-6-2 {
        font-size: 1.07rem !important;
        font-weight: 500;
        line-height: 1.07;
    }

    .fs-lg-6-0-7 {
        font-size: 1.07rem !important;
        margin-bottom: 0.5rem;
        font-weight: 500;
        line-height: 1.2;
    }

    .fs-lg-7 {
        font-size: 0.75rem !important;
    }

    body::-webkit-scrollbar {
        display: none;
    }

    /*#wrap.work-space {
        !*background: linear-gradient(to right, #edf0f5, #edf0f5 2%, white 2%, white 98%, #edf0f5 98%) !important;*!
        background: linear-gradient(to right, #ffffff, #ffffff 2%, #edf0f5 2%, #edf0f5 98%, #ffffff 98%) !important;
        min-height: 100%;
    }

    #wrap.work-space2 {
        !*background-color: #edf0f5;*!
        height: 100% !important;
        !*background: linear-gradient(to right, #edf0f5, #edf0f5 2%, white 2%, white 98%, #edf0f5 98%) !important;*!
        background: linear-gradient(to right, #ffffff, #ffffff 2%, #edf0f5 2%, #edf0f5 98%, #ffffff 98%) !important;
        min-height: 100%;
    }*/
}

/*@media only screen and (min-width: 1440px) {
    !* styles for browsers larger than 1440px; *!
    #wrap.work-space {
        !*background: linear-gradient(to right, #edf0f5, #edf0f5 5%, white 5%, white 95%, #edf0f5 95%) !important;*!
        background: linear-gradient(to right, #ffffff, #ffffff 5%, #edf0f5 5%, #edf0f5 95%, #ffffff 95%) !important;
        min-height: 100%;
    }

    #wrap.work-space2 {
        !*background-color: #edf0f5;*!
        height: 100% !important;
        !*background: linear-gradient(to right, #edf0f5, #edf0f5 5%, white 5%, white 95%, #edf0f5 95%) !important;*!
        background: linear-gradient(to right, #ffffff, #ffffff 5%, #edf0f5 5%, #edf0f5 95%, #ffffff 95%) !important;
        min-height: 100%;
    }
}*/

.fs-6-0-7 {
    font-size: 1.07rem !important;
    margin-bottom: 0.5rem;
    font-weight: 500;
    line-height: 1.2;
}

.fs-1-2 {
    font-size: 1.2rem !important;
    font-weight: 400;
    line-height: 1.2;
}

/* 블로그 진단분석 Table Row Font Style */
.fs-0875 {
    font-size: 0.875rem !important;
    font-family: 'Malgun Gothic', '맑은 고딕', '돋움', Dotum, "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

/* 세부 메뉴 Nav Font Style */
.fs-11 {
    font-size: 1.15rem !important;
}

/* 데이터 Font Style */
.fs-105 {
    font-size: 1.05rem !important;
}

/**
각 항목 설명 Font Style
 */
small {
    color: #909090 !important;
    font-size: 1.05em;
}

.fs-malgun-gothic {
    font-family: 'Malgun Gothic', '맑은 고딕' !important;
}

/* 상단메뉴 BackGround Color */
.bg-cs-gray3 {
    background-color: #f8f8f8 !important;
}

.bg-cs-blue {
    background-color: #5aa9ff !important;
}

/* 분석 결과 안내 BackGround color */
.bg-cs-light-gray {
    /*background-color: #d5d5d5 !important;*/
    background-color: #f1f1f1 !important;
}

.shadow-cs-m {
    box-shadow: 0 0.1rem 1rem rgb(0 0 0 / 5%) !important;
}

.row {
    --bs-gutter-x: 0.3rem !important;
}

.cursor-pointer {
    cursor: pointer !important;
}

.btn-search2 {
    border-width: 2px;
    --bs-btn-color: #ffffff;
    --bs-btn-bg: #4c52bc;
    --bs-btn-border-color: #4c52bc;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #4248be;
    --bs-btn-hover-border-color: #4248be;
    --bs-btn-focus-shadow-rgb: 49, 132, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #6065be;
    --bs-btn-active-border-color: #6065be;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #25285b;
    --bs-btn-disabled-border-color: #25285b;
}

.btn-cs-check {
    border-width: 2px;
    --bs-btn-color: #ffffff;
    --bs-btn-bg: #4c52bc;
    --bs-btn-border-color: #f8f8f8;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #4248be;
    --bs-btn-hover-border-color: #f8f8f8;
    --bs-btn-focus-shadow-rgb: 49, 132, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #6065be;
    --bs-btn-active-border-color: #f8f8f8;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #25285b;
    --bs-btn-disabled-border-color: #25285b;
}

/*
.btn-search2 {
    border-width: 2px;
    --bs-btn-color: #ffffff;
    --bs-btn-bg: #5aa9ff;
    --bs-btn-border-color: #5aa9ff;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #3193ff;
    --bs-btn-hover-border-color: #3193ff;
    --bs-btn-focus-shadow-rgb: 49, 132, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #1d88ff;
    --bs-btn-active-border-color: #1d88ff;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #676767;
    --bs-btn-disabled-border-color: #383838;
}*/

.btn-search1 {
    --bs-btn-color: #fff;
    --bs-btn-bg: #383838;
    --bs-btn-border-color: #383838;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #000000;
    --bs-btn-hover-border-color: #383838;
    --bs-btn-focus-shadow-rgb: 49, 132, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #000000;
    --bs-btn-active-border-color: #383838;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #676767;
    --bs-btn-disabled-border-color: #383838;
}

.btn-more {
    --bs-btn-color: #fff;
    --bs-btn-bg: #767676;
    --bs-btn-border-color: #717171;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #2d2d2d;
    --bs-btn-hover-border-color: #606060;
    --bs-btn-focus-shadow-rgb: 49, 132, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #2d2d2d;
    --bs-btn-active-border-color: #606060;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #676767;
    --bs-btn-disabled-border-color: #383838;
}

.btn-guide {
    --bs-btn-color: #fff;
    --bs-btn-bg: #2d2d2d;
    --bs-btn-border-color: #2d2d2d;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #000000;
    --bs-btn-hover-border-color: #2d2d2d;
    --bs-btn-focus-shadow-rgb: 49, 132, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #000000;
    --bs-btn-active-border-color: #2d2d2d;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #676767;
    --bs-btn-disabled-border-color: #383838;
}

.bg-cs-s-black {
    background-color: #202020 !important;
}

#table-column > th {
    font-weight: normal;
    font-size: 13px !important;
}

.text-deep-red {
    color: #c53043 !important;
}

.border-deep-red {
    border-color: #c53043 !important;
}

.text-red {
    color: #bd1328 !important;
}

.border-red {
    border-color: #ce172d !important;
}

.text-cs-gray {
    color: #909090 !important;
}

.text-cs-s-dark {
    color: #3a3a3a !important;
}

.text-cs-s-black {
    border-color: #202020 !important;
}

.text-cs-b-green {
    color: #34cd89 !important;
}

.bg-cs-b-green {
    background-color: #34cd89 !important;
}

.border-cs-gray {
    --bs-border-opacity: 1;
    border-color: #909090 !important;
}

.border-cs-gray2 {
    --bs-border-opacity: 1;
    border-color: #d2d2d2 !important;
}

.border-cs-gray3 {
    --bs-border-opacity: 1;
    border-color: #e1dede !important;
}

.border-cs-s-dark {
    --bs-border-opacity: 1;
    border-color: #3a3a3a !important;
}

.border-cs-s-black {
    --bs-border-opacity: 1;
    border-color: #202020 !important;
}

.border-cs-b-green {
    --bs-border-opacity: 1;
    border-color: #34cd89 !important;
}

#text-point {
    /*color: #4770bd !important;*/
    color: #4c52bc !important;
}

#text-link {
    color: #0313aa !important;
}

.text-link {
    color: #0313aa !important;
}

/**
링크 Font Color Style
 */
.text-cs-point-link {
    color: #0313aa !important;
}

/*
.text-cs-point-blue {
    color: #4770bd !important;
}*/

.text-cs-point-blue {
    color: #4770bd !important;
}

.text-cs-point-purple {
    color: #4c52bc !important;
}

.bg-cs-purple {
    background-color: #4c52bc !important;
}

.bg-cs-purple-m {
    background-color: #4c52bc7a !important;
}

.bg-cs-purple-85 {
    background-color: rgba(76, 82, 188, 0.85) !important;
}

.bg-cs-purple-gray {
    background-color: #4d4f6a7a !important;
}
.bg-cs-point-yellow {
    background-color: #ecc539 !important;
}

.border-cs-point-blue {
    border-color: #4770bd !important;
}

.bg-cs-semi-black {
    background-color: #767676 !important;
}

.nav-tabs .nav-item .nav-link {
    background-color: #f8f8f8 !important;
    color: #8b8b8b !important;
    --bs-border-opacity: 1;
    border-color: #e1e1e1 !important;
}

.nav-tabs .nav-item .nav-link.active {
    background-color: #4c52bc !important;
    color: #FFFFFF !important;
    --bs-border-opacity: 1;
    border-color: #4c52bc !important;
}

@media (min-width: 992px) {
    .col-lg-1-3 {
        flex: 0 0 auto;
        width: 10.8333%;
    }

    .col-lg-1-4 {
        flex: 0 0 auto;
        width: 11.6666%;
    }

    .col-lg-1-5-2 {
        flex: 0 0 auto;
        width: 13%;
    }

    .col-lg-1-5 {
        flex: 0 0 auto;
        width: 14.2857%;
    }
}

#guideModal .modal-content {
    max-height: 800px !important;
}

a {
    text-decoration: none !important;
}

input::placeholder {
    font-size: 14px
}

.navbar-toggler {
    color: #fff !important;
}


footer {
    position: fixed !important;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 19999;
}

.fs-10 {
    font-size: 1.25rem !important
}

.fs-7 {
    font-size: 1.0rem !important
}

.fs-8 {
    font-size: 0.75rem !important
}

.fs-9 {
    font-size: 0.5rem !important
}

.fs-9 {
    font-size: 0.5rem !important
}

.fs-10 {
    font-size: 0.1em !important;
}

.w-49 {
    width: 49%
}

.table-fixed {
    table-layout: fixed;
}

.diagnosis_cate_list_box {
    max-height: 250px;
    overflow-y: hidden
}

.diagnosis_cate_list_box.active {
    max-height: 100%;
    overflow-y: auto
}

.diagnosis_cate_list_box .content {
    height: auto
}

.diagnosis_history_list_box {
    max-height: 250px;
    overflow-y: hidden
}

.diagnosis_history_list_box.active {
    max-height: 100%;
    overflow-y: auto
}

.diagnosis_history_list_box .content {
    height: auto
}

/*
누락분석 키워드 추출표기 박스 - 비활성화
 */
.diagnosis_keyword_list_box {
    max-height: 80px;
    overflow-y: hidden
}

/*
누락분석 키워드 추출표기 박스 - 활성화
 */
.diagnosis_keyword_list_box.active {
    max-height: 100%;
    overflow-y: auto
}

/*
누락분석 키워드 추출표기 박스 > content
 */
.diagnosis_keyword_list_box .content {
    height: auto
}

/*
누락분석 태그 추출표기 박스 - 비활성화
 */
.diagnosis_tag_list_box {
    max-height: 80px;
    overflow-y: hidden
}

/*
누락분석 태그 추출표기 박스 - 활성화
 */
.diagnosis_tag_list_box.active {
    max-height: 100%;
    overflow-y: auto
}

/*
누락분석 태그 추출표기 > content
 */

.diagnosis_tag_list_box .content {
    height: auto
}

.background-sample {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    font-size: 10em;
    color: #dc3545;
    opacity: 0.1;
}

.table-keyword th, .table-keyword td {
    vertical-align: middle;
    font-size: 12px;
    /*
    padding-top: 8px;
    padding-bottom: 8px;
    */
}

.morpheme-list td {
    vertical-align: middle;
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    /*
    padding-top: 8px;
    padding-bottom: 8px;
    */
}

.table-result th, .table-result td {
    font-size: 12px;
    vertical-align: middle;
}


.table-result tbody tr td:nth-child(5) {
    border-left: 2px solid #ce172d;
    border-right: 2px solid #ce172d
}

.table-result tbody tr td:nth-child(6):hover,
.table-result tbody tr td:nth-child(7):hover,
.table-result tbody tr td:nth-child(8):hover,
.table-result tbody tr td:nth-child(9):hover,
.table-result tbody tr td:nth-child(10):hover,
.table-result tbody tr td:nth-child(11):hover,
.table-result tbody tr td:nth-child(12):hover,
.table-result tbody tr td:nth-child(13):hover,
.table-result tbody tr td:nth-child(14):hover,
.table-result tbody tr td:nth-child(15):hover {
    background-color: #cbbbe5;
}


.table-result tbody tr:first-child td:nth-child(5) {
    border-top: 2px solid #ce172d
}

.table-result tbody tr:last-child td:nth-child(5) {
    border-bottom: 2px solid #ce172d
}


.popular_subject {
    max-height: 63px;
    overflow-y: hidden;
}

.popular_subject.active {
    max-height: 100%;
    overflow-y: auto;
}

.popular_subject .content {
    height: auto;
}

.border-bottom-line-danger td {
    border-bottom: 1px solid #ce172d;
}

/*ul.sub-list{
    width:100%;
    display: table;
    border-collapse: collapse;
}*/

ul.sub-list li {
    float: left;
    display: table-cell;
    list-style: none;
    width: 6.328%;
    padding: 1px 0;
    border: 1px solid #dee2e6;
    border-collapse: collapse;
    margin-bottom: -1px;
}

ul.sub-list li {
    margin-left: -1px;
}

ul.sub-list li.sub-title {
    background-color: #f6f6f6;
    font-size: 12px !important;
}

ul.sub-list .sub-cont {
    background: #FFFFFF;
    font-size: 12px !important;
}

ul.sub-list li.sub-none {
    background: #FFFFFF;
    font-size: 12px;
}

.amount-box {
    height: 130px
}

.tooltip-inner {
    max-width: 400px !important;
    /* If max-width does not work, try using width instead */
}

.tooltip-inner {
    background-color: #000000;
    box-shadow: 0px 0px 4px black;
    opacity: 1 !important;
}

#fouc {
    height: 100% !important;
    min-height: 100%;
}

#keyword-detail-card h6 {
    font-size: 1.05rem !important;
    color: #909090 !important;
}

i.bi.bi-question-circle-fill {
    color: #000000 !important;
}

i.bi.bi-exclamation-circle-fill {
    color: #000000 !important;
}

.smart-block-tr {
    font-size: 12px !important;
}

.smart-block-tr > td {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.smart-block-tr > td:nth-child(5) {
    text-align: left;
}

/* 모바일과 전체화면 사이의 애매한 부분부터 적용되는 CSS */
@media (max-width: 991.98px) {
    #top-nav-bar {
        display: block !important;
    }

    .hamburger {
        display: none !important;
    }

    #guideModal .modal-content {
        max-height: 550px !important;
    }

    .main-menu {
        display: none !important;
    }

    #wrap {
        padding-left: 0px !important;
    }
}

.bg-cs-purple {
    background-color: rgb(76, 82, 188);
}

/*

!*
SIDEBAR 시작
*!
@media (min-width: 991.98px) {
    #wrap {
        padding-left: 200px;
    }
    footer {
        padding-left: 200px;
    }
}



!* Sidebar *!
.sidebar {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    padding: 58px 0 0; !* Height of navbar *!
    box-shadow: 0 2px 5px 0 rgb(0 0 0 / 5%), 0 2px 10px 0 rgb(0 0 0 / 5%);
    width: 200px;
    z-index: 600;
}

@media (max-width: 991.98px) {
    .sidebar {
        width: 100%;
    }
}

.sidebar .active {
    border-radius: 5px;
    box-shadow: 0 2px 5px 0 rgb(0 0 0 / 16%), 0 2px 10px 0 rgb(0 0 0 / 12%);
}

.sidebar-sticky {
    position: relative;
    top: 0;
    height: calc(100vh - 48px);
    padding-top: 0.5rem;
    overflow-x: hidden;
    overflow-y: auto; !* Scrollable contents if viewport is shorter than content. *!
}*/

/*
SIDEBAR 종료
*/
/*
 *  STYLE 1
 */

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(255, 255, 255, 0.3) !important;
    border-radius: 12px !important;
    background-color: transparent !important;
}

::-webkit-scrollbar {
    width: 6px !important;
    height: 12px !important;
    background-color: transparent !important;
}

::-webkit-scrollbar-thumb {
    border-radius: 6px !important;
    -webkit-box-shadow: inset 0 0 2px rgba(90, 40, 216, 0.3) !important;
    background-color: #9979d9 !important;
}

/**
페이지 인덱스 표시 부분 purple 컬러 지정
 */
.page-link {
    color: #909090 !important;
    background-color: #f8f8f8 !important;
}

.active > .page-link, .page-link.active {
    z-index: 3 !important;
    color: #ffffff !important;
    background-color: #4c52bc !important;
    border-color: #4c52bc !important;
}


/*
페이지별 서브 헤더 1 클래스
*/
.sub-header-1 {
    box-shadow: 0 0.1rem 1rem rgb(0 0 0 / 5%) !important;

    font-size: 0.875rem !important;
    font-family: "Malgun Gothic", "맑은 고딕", 돋움, Dotum, "Helvetica Neue", Helvetica, Arial, sans-serif !important;

    border-radius: var(--bs-border-radius-lg) !important;

    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-white-rgb), var(--bs-bg-opacity)) !important;

    --bs-text-opacity: 1;
    /*color: rgba(var(--bs-black-rgb),var(--bs-text-opacity))!important;*/
    text-align: center !important;

    padding: 0.5rem !important;

    margin-top: 0.25rem !important;

    --bs-border-width: 1px;

    border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
}

/*
페이지별 서브 헤더 1 클래스
*/
.sub-header-2 {
    box-shadow: 0 0.1rem 1rem rgb(0 0 0 / 5%) !important;

    font-size: 0.875rem !important;
    font-family: "Malgun Gothic", "맑은 고딕", 돋움, Dotum, "Helvetica Neue", Helvetica, Arial, sans-serif !important;

    border-radius: var(--bs-border-radius-lg) !important;

    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-white-rgb), var(--bs-bg-opacity)) !important;

    --bs-text-opacity: 1;
    /*color: rgba(var(--bs-black-rgb),var(--bs-text-opacity))!important;*/
    text-align: center !important;

    padding: 0.5rem !important;

    margin-top: 0.25rem !important;

    --bs-border-width: 1px;

    border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
}

/**
테이블 공통 margin-bottom-0 적용
 */
.table {
    margin-bottom: 0 !important;
}

.fs-12px {
    font-size: 12px !important;
}


/**
스마트 진단분석 > 하단 관련 인기주제 hover
 */
.popular_subject div div:hover {
    background-color: #cbbbe5;
}

/**
프로그래스바 색 변경
 */
div[id*='_progressBar'] {
    background-color: #4c52bc !important;
}

/**
메뉴 오픈시 뒷단 스크롤 막기
 */
.hidden {
    height: 100%;
    min-height: 100%;
    overflow: hidden !important;
    touch-action: none;
}

#guideModalContent img {
    max-width: 100%;
    height: auto;
    display: block;
}

/** 파일 업로드 버튼 css 변경
*/
input[type=file]::file-selector-button {
    border: 2px solid white !important;
    padding: .2em .4em;
    border-radius: .2em;
    color: white;
    background-color: rgba(76, 82, 188, 0.92) !important;
    transition: 1s;
}

/* 2023-04-10 신규 table tr css 수정 */
tr.bg-light {
    background-color: rgb(235, 235, 235) !important;
}

tr.text-cs-gray {
    color: rgb(55, 55, 55) !important;
}

#table-column th {
    background-color: rgb(235, 235, 235) !important;
    color: rgb(55, 55, 55) !important;
}

/*스마트 주제분석 - 비강조 글씨색 */
.text-cs-light-gray {
    color: #c2c2c2 !important;
}

.post_keyword {
    font-weight: bold !important;
    color: #000000 !important;;
}

.post_other {
    font-weight: normal !important;
    color: #b5b5b5 !important;
}

/* 프로그래스바 좌측정렬 */
.progress-bar-text-start {
    text-align: left;
    padding-left: 5px;
}

.fs-7-5 {
    font-size: 0.875rem !important;
}

/**
스마트 주제분석 - 버튼
 */
button[id*='diagnosis_data_btn_'] {
    max-height: 20px !important;
    padding: 0;
    font-size: 0.75rem !important;
}

/*
* 스마트 주제분석 - 활성화시 하얀색 처리 글자
 */
.btn-outline-secondary.active {
    color: #ffffff !important;
}

tr[id*='diagnosis_tr_'] button {
    --bs-btn-font-size: 0.9rem !important;
}

/* 드래그 막기 */
.no-drag {
    user-drag: none; /* 최신 브라우저에서 드래그 막기 */
    -moz-user-drag: none; /* Firefox */
    -webkit-user-drag: none; /* Safari, Chrome 등 */
    -ms-user-drag: none; /* IE/Edge */
    user-select: none; /* 드래그로 선택 막기 */
}

/*
배너 부분 CSS
업데이트 : 2023-11-02
 **/

.text-banner {
    text-align: center;
    width: 100%;
    background-color: #4c52bc;
    font-family: 'NanumGothic';
    cursor: pointer;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;user-select:none
}

.animate-contain {
    height: 30px;
    overflow: hidden;
    text-align: center;
    display: inline-block;
    background-color: #4c52bc;
}

.contain {
    height: 30px;
    overflow: hidden;
    text-align: center;
    display: inline-block;
    background-color: #4c52bc;
}

.animated-text {
    text-shadow: 0 0 7px rgba(255, 255, 255, .3), 0 0 3px rgba(255, 255, 255, .3);
    display: inline-block;
    transition: 300ms all;
    margin-top: 0;
    animation: slide 6s infinite alternate ease-in-out;
    color: #fff;
    background-color: #4c52bc;
}

.text {
    text-shadow: 0 0 7px rgba(255, 255, 255, .3), 0 0 3px rgba(255, 255, 255, .3);
    display: inline-block;
    transition: 300ms all;
    margin-top: 0;
    color: yellow;
    background-color: #4c52bc;
}

.text span {
    display: block;
    font-size: 15px;
    padding: 3px 5px;
    background-color: #4c52bc;
}

.animated-text span {
    display: block;
    font-size: 15px;
    padding: 4px 5px;
    background-color: #4c52bc;
}

.animated-text span:nth-child(2) {
    padding-top: 3px;
}
.animated-text span:nth-child(3) {
    padding-top: 4px;
    color: yellow;
}

@keyframes slide {
    0% {
        margin-top: 0;
    }
    20% {
        margin-top: 0;
    }
    40% {
        margin-top: -30px;
    }
    60% {
        margin-top: -30px;
    }
    80% {
        margin-top: -60px;
    }
    100% {
        margin-top: -60px;
    }
}
/**
배너 부분 CSS
 */

/**
2024-02-22
모달 내 공지사항 줄 간격 조정
 */
.modal-body p{
    margin-bottom: 0;
}

/**
2024-02-22
공지사항 줄 간격 조정
 */
#board_content p {
    margin-bottom: 0;
}

/* 배경 깜빡임 효과를 위한 애니메이션 */
@keyframes backgroundBlink {
    0% { background-color: #ff5a5a; }
    50% { background-color: #ff8a8a; }
    100% { background-color: #ff5a5a; }
}

/* 배경 깜빡임 효과를 위한 애니메이션 */
@keyframes backgroundBlinkYellow {
    0% { background-color: #ffbb07; }
    50% { background-color: #ffd454; }
    100% { background-color: #ffbd1a; }
}

/* 배경 깜빡임 효과를 위한 애니메이션 */
@keyframes backgroundBlinkPurple {
    0% { background-color: #4c52bc; }
    50% { background-color: #7377be; }
    100% { background-color: #4c52bc; }
}

/* 테두리 깜빡임 효과를 위한 애니메이션 */
@keyframes borderBlink {
    0% { box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.7); }
    50% { box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.9); }
    100% { box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.7); }
}

.badge-new {
    display: inline-block;
    background-color: #ff5a5a;
    color: white;
    font-weight: 600;
    padding: 0.35em 0.65em;
    border-radius: 6px;
    font-size: 0.75em;
    animation:
            backgroundBlink 1.5s infinite,
            borderBlink 1.5s infinite;
}

.badge-new-yellow {
    display: inline-block;
    background-color: #ff5a5a;
    color: white;
    font-weight: 600;
    padding: 0.35em 0.65em;
    border-radius: 6px;
    font-size: 0.75em;
    animation:
            backgroundBlinkYellow 1.5s infinite,
            borderBlink 1.5s infinite;
}

/* 신규 표기 */
.badge-new-result {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    line-height: 15px;
    padding: 4px 8px;
    background-color: #4c52bc;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    border-radius: 4px;
    animation: backgroundBlinkPurple 1.5s infinite, borderBlink 1.5s infinite;
}

/* 블로그 진단 모드 스위치 */
.diagnosis-mode-switch {
    display: flex;
    align-items: center;
    gap: 4px;
    max-width: none;
}
.diagnosis-mode-track {
    display: flex;
    flex-wrap: nowrap;
    gap: 4px;
    overflow: visible;
    max-width: none;
}
.diagnosis-mode-item {
    flex: 0 0 auto;
    border: 1px solid #dee2e6;
    background: #fff;
    border-radius: 6px;
    padding: 6px 10px;
    font-size: 12px;
    white-space: nowrap;
    color: #909090;
    line-height: 1.2;
}
.diagnosis-mode-item.active {
    background: #198754;
    border-color: #198754;
    color: #fff;
    font-weight: 600;
}
.diagnosis-result-tabs {
    display: flex;
    align-items: stretch;
    width: 100%;
}
.diagnosis-result-tabs .nav-item {
    flex: 1 1 50%;
    max-width: 50%;
    display: flex;
}
.diagnosis-result-tabs .nav-item > .nav-link {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}
.diagnosis-result-tabs .nav-link {
    color: #909090;
    font-size: 14px;
    border-radius: 0;
}
.diagnosis-result-tabs .nav-link.active {
    color: #4c52bc;
    font-weight: 600;
    border-bottom-color: #4c52bc;
}
.bd-rel-tab-status {
    font-size: 11px;
    font-weight: 600;
    line-height: 1.2;
    padding: 4px 8px;
    vertical-align: middle;
}
.bd-rel-tab-status.is-loading {
    background: rgba(253, 126, 20, 0.14);
    color: #fd7e14;
}
.bd-rel-tab-status.is-done {
    background: rgba(76, 82, 188, 0.12);
    color: #4c52bc;
}
.bd-rel-tab-status.is-waiting {
    background: rgba(108, 117, 125, 0.12);
    color: #6c757d;
}
/* =============================================================================
 * 신뢰도 지수진단 UI (prefix: .bd-rel-* / #bd_rel_*)
 * 로드 경로: blog_diagnosis.php → blog.js + blog_rel_competitor.js + blog_rel_ai.js
 * 구간: 탭셸 → 히어로 액션(큐/툴팁) → 요약·패널티·근거 → C-Rank 게이지/주제 → 경쟁력/AI 패널
 * ============================================================================= */
/* Reliability tab button (actions live outside the tab bar, below) */
.diagnosis-result-tabs .bd-rel-tab-item {
    display: flex;
}
.bd-rel-tab-shell {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    width: 100%;
    background-color: #f8f8f8;
    border: 1px solid #e1e1e1;
    margin-bottom: -1px;
}
/* 선택만 된 상태(빈/샘플): 연한 톤. 실제 결과 있을 때만 보라 하이라이트(.is-active) */
.bd-rel-tab-shell:has(.nav-link.active) {
    background-color: #eef0ff !important;
    border-color: #c9d4f0 !important;
}
.bd-rel-tab-item.is-active .bd-rel-tab-shell {
    background-color: #4c52bc !important;
    border-color: #4c52bc !important;
}
.bd-rel-tab-trigger.nav-link {
    border: 0 !important;
    background: transparent !important;
    margin-bottom: 0 !important;
    width: 100% !important;
    flex: 1 1 auto;
    padding: 0.5rem 0.75rem !important;
    color: #8b8b8b !important;
}
.bd-rel-tab-trigger.nav-link.active {
    background: transparent !important;
    border-color: transparent !important;
    color: #4c52bc !important;
    font-weight: 600;
}
.bd-rel-tab-item.is-active .bd-rel-tab-trigger.nav-link.active {
    color: #fff !important;
}
/* 모드별 탭 숨김: 좌우 자리 유지, 시각만 숨김 */
.diagnosis-result-tabs .nav-item.is-mode-hidden {
    visibility: hidden !important;
    pointer-events: none !important;
}
/* 히어로 우측 액션: 「경쟁력을 확인하세요 / 눌러보세요」큐 + 버튼 샤인 + hover 안내 툴팁 */
#bd_rel_hero .bd-rel-hero-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 10px 14px;
    margin-left: auto;
}
#bd_rel_hero .bd-rel-hero-actions.d-none {
    display: none !important;
}
#bd_rel_hero .bd-rel-hero-actions .btn {
    font-size: 13px;
    line-height: 1.3;
    min-height: 38px;
    padding: 0.45rem 0.95rem;
    white-space: nowrap;
    border-radius: 0.25rem;
}
.bd-rel-action-wrap {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 7px;
}
.bd-rel-action-cue {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    color: #6366a8;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
    animation: bdRelActionCue 1.6s ease-in-out infinite;
}
.bd-rel-action-cue b {
    display: inline-block;
    margin-right: 1px;
    color: #4c52bc;
    font-size: 13px;
    font-weight: 900;
    line-height: 1;
    animation: bdRelActionCuePoint 1.6s ease-in-out infinite;
}
.bd-rel-action-wrap-ai .bd-rel-action-cue {
    color: #5b6a8a;
}
.bd-rel-action-btn {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    box-shadow: 0 0 0 0 rgba(76, 82, 188, 0);
    animation: bdRelActionBtnPulse 2.8s ease-in-out infinite;
}
.bd-rel-action-btn::after {
    position: absolute;
    z-index: 1;
    top: -55%;
    left: -40%;
    width: 26%;
    height: 210%;
    content: "";
    pointer-events: none;
    background: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0),
        rgba(255, 255, 255, 0.42),
        rgba(255, 255, 255, 0)
    );
    transform: rotate(18deg) translateX(-180%);
    animation: bdRelActionBtnShine 2.8s ease-in-out infinite;
}
.bd-rel-action-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 14px rgba(76, 82, 188, 0.22);
}
.bd-rel-action-hover-tip {
    position: absolute;
    z-index: 80;
    top: calc(100% + 10px);
    right: 0;
    width: min(310px, 78vw);
    padding: 11px 13px;
    border: 1px solid #c9d4f0;
    border-radius: 10px;
    background: #fff;
    color: #3a3a3a;
    font-size: 11px;
    font-weight: 650;
    line-height: 1.55;
    text-align: left;
    box-shadow: 0 12px 28px rgba(49, 46, 129, 0.14);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px);
    transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease;
    pointer-events: none;
}
.bd-rel-action-hover-tip::before {
    content: "";
    position: absolute;
    right: 28px;
    top: -6px;
    width: 10px;
    height: 10px;
    border-left: 1px solid #c9d4f0;
    border-top: 1px solid #c9d4f0;
    background: #fff;
    transform: rotate(45deg);
}
.bd-rel-action-wrap:hover .bd-rel-action-hover-tip,
.bd-rel-action-wrap:focus-within .bd-rel-action-hover-tip {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.bd-rel-action-wrap-ai .bd-rel-action-hover-tip {
    border-color: #c9d4f0;
}
@keyframes bdRelActionCue {
    0%, 100% { opacity: 1; transform: translateX(0); }
    50% { opacity: 0.62; transform: translateX(2px); }
}
@keyframes bdRelActionCuePoint {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(3px); }
}
@keyframes bdRelActionBtnPulse {
    0%, 62%, 100% { box-shadow: 0 0 0 0 rgba(76, 82, 188, 0); }
    76% { box-shadow: 0 0 0 4px rgba(76, 82, 188, 0.12), 0 4px 12px rgba(76, 82, 188, 0.16); }
}
@keyframes bdRelActionBtnShine {
    0%, 55% { transform: rotate(18deg) translateX(-180%); }
    82%, 100% { transform: rotate(18deg) translateX(620%); }
}
@media (max-width: 991.98px) {
    .bd-rel-action-cue { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    .bd-rel-action-cue,
    .bd-rel-action-cue b,
    .bd-rel-action-btn,
    .bd-rel-action-btn::after {
        animation: none;
    }
}
#bd_rel_competitor_panel .bd-rel-comp-panel-actions .btn,
#bd_rel_ai_panel .bd-rel-ai-panel-actions .btn {
    font-size: 13px;
    line-height: 1.3;
    min-height: 38px;
    padding: 0.45rem 0.95rem;
    white-space: nowrap;
    border-radius: 0.25rem;
}
@media (max-width: 767.98px) {
    #bd_rel_hero .bd-rel-hero-actions {
        width: 100%;
        justify-content: stretch;
    }
    #bd_rel_hero .bd-rel-hero-actions .bd-rel-action-wrap {
        flex: 1 1 auto;
        min-width: 0;
    }
    #bd_rel_hero .bd-rel-hero-actions .btn,
    #bd_rel_competitor_panel .bd-rel-comp-panel-actions .btn,
    #bd_rel_ai_panel .bd-rel-ai-panel-actions .btn {
        flex: 1 1 auto;
        width: 100%;
        min-width: 0;
        font-size: 12px;
        padding: 0.4rem 0.55rem;
    }
}
.bd-rel-tab-shell:has(.nav-link.active):not(.has-subview) .bd-rel-tab-trigger {
    font-size: 15px;
    letter-spacing: -0.01em;
}
.bd-rel-tab-shell.has-subview .bd-rel-tab-trigger {
    opacity: 0.92;
    font-weight: 500 !important;
}
.diagnosis-result-tabs .nav-link.active .bd-rel-tab-status.is-done,
.bd-rel-tab-shell:has(.nav-link.active) .bd-rel-tab-status.is-done,
.bd-rel-tab-item.is-active .bd-rel-tab-status.is-done {
    background: rgba(255, 255, 255, 0.22);
    color: #fff;
}
.diagnosis-result-tabs .nav-link.active .bd-rel-tab-status.is-waiting,
.bd-rel-tab-shell:has(.nav-link.active) .bd-rel-tab-status.is-waiting,
.bd-rel-tab-item.is-active .bd-rel-tab-status.is-waiting {
    background: rgba(255, 255, 255, 0.22);
    color: #e9ecef;
}
.diagnosis-result-tabs .nav-link.active .bd-rel-tab-status.is-loading,
.bd-rel-tab-shell:has(.nav-link.active) .bd-rel-tab-status.is-loading {
    background: rgba(255, 255, 255, 0.22);
    color: #ffe8cc;
}
.text-cs-point-orange {
    color: #fd7e14 !important;
}
.bd-rel-summary-top {
    align-items: stretch;
}
/* 신뢰도·경쟁력·AI 공통 디자인 토큰 */
#blog_diagnosis_reliability_pane,
.bd-rel,
.bd-rel-comp,
.bd-rel-ai {
    --bd-rel-r: 8px;
    --bd-rel-r-sm: 6px;
    --bd-rel-r-lg: 10px;
    --bd-rel-r-pill: 6px;
    --bd-rel-fs-body: 12px;
    --bd-rel-fs-label: 11px;
    --bd-rel-c-muted: #6b7280;
    --bd-rel-c-data: #3a3a3a;
    --bd-rel-badge-pad: 3px 8px;
    --bd-rel-badge-fs: 12px;
    --bd-rel-space-section: 16px;
    --bd-rel-divider: #eef0f3;
    --bd-rel-progress-h: 8px;
}
.bd-rel-comp {
    --bd-rel-comp-r: var(--bd-rel-r);
    --bd-rel-comp-r-sm: var(--bd-rel-r-sm);
    --bd-rel-comp-r-pill: var(--bd-rel-r-pill);
}
.bd-rel-ai {
    --bd-rel-ai-r: var(--bd-rel-r);
    --bd-rel-ai-r-sm: var(--bd-rel-r-sm);
    --bd-rel-ai-r-pill: var(--bd-rel-r-pill);
}

/* Align reliability spacing with blog diagnosis tab (section header → body gap) */
#blog_diagnosis_reliability_body > .row > span.text-cs-s-dark.fs-6-0-7,
#blog_diagnosis_reliability_body #bd_rel_detail_stack > .row > span.text-cs-s-dark.fs-6-0-7,
#blog_diagnosis_reliability_body .row > .col-12 > span.text-cs-s-dark.fs-6-0-7 {
    display: block;
    margin-bottom: 0.35rem;
}
#blog_diagnosis_reliability_body .card small,
#blog_diagnosis_reliability_body .bd-rel-eq-card small {
    display: block;
    line-height: 1.4;
    margin-bottom: 0;
}
#blog_diagnosis_reliability_body .card p.fs-105,
#blog_diagnosis_reliability_body .bd-rel-eq-card p.fs-105 {
    margin-top: 0.5rem !important;
}
#blog_diagnosis_reliability_body .bd-rel-evidence-box > .fw-bold {
    margin-bottom: 0.5rem !important;
}
#blog_diagnosis_reliability_body .bd-rel-evidence-box > p.fs-12px {
    margin-bottom: 0.75rem !important;
    line-height: 1.55;
}
#blog_diagnosis_reliability_body .bd-rel-nested-box + .bd-rel-nested-box {
    margin-top: 1rem !important;
}
.bd-rel-eq-card {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 88px;
}
/* C-Rank / 네이버 메이트 값+뱃지 세로 중앙 정렬 */
.bd-rel-value-with-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center;
    flex-wrap: nowrap;
    gap: 0.35rem;
    line-height: 1.2;
    min-height: 1.4em;
}
.bd-rel-value-with-badge > span:not(.badge) {
    display: inline-block;
    line-height: 1.2;
    vertical-align: middle;
}
/* d-none / 빈 배지는 숨김 — display:!important 가 Bootstrap d-none 을 덮어쓰지 않도록 */
.bd-rel-value-with-badge .badge.d-none,
.bd-rel-value-with-badge .badge:empty {
    display: none !important;
}
.bd-rel-value-with-badge .badge:not(.d-none):not(:empty) {
    display: inline-flex !important;
    align-items: center;
    align-self: center !important;
    vertical-align: middle;
    line-height: 1.25;
    font-size: 12px !important;
    font-weight: 700 !important;
    padding: 3px 8px !important;
    border-radius: 6px !important;
    position: static !important;
    top: auto !important;
    margin: 0;
}
.bd-rel-metric-row {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 4px;
    border-bottom: 1px solid #f0f0f0;
}
.bd-rel-metric-row:last-child {
    border-bottom: 0;
}
.bd-rel-metric-meta {
    min-width: 0;
    flex: 1 1 auto;
    padding-right: 4px;
}
.bd-rel-metric-bar-wrap {
    flex: 0 0 150px;
    max-width: 40%;
    margin: 0 4px;
}
.bd-rel-category-card {
    border: 1px solid #eee;
    border-radius: 8px;
    padding: 12px;
    height: 100%;
    background: #fff;
}
.bd-rel-category-card.is-primary {
    background: #f0faf3;
    border-color: #198754;
}
.bd-rel-penalty-desc {
    background: transparent;
    border: 1px solid #e9ecef;
}
.bd-rel-quality-block {
    padding: 12px;
    border: 1px solid #e6e8ec;
    border-radius: var(--bd-rel-r, 8px);
    background: #fafbff;
    overflow: visible;
}
.bd-rel-quality-cards { margin: 0; overflow: visible; }
.bd-rel-quality-cards > [class*="col-"] {
    position: relative;
    z-index: 1;
}
.bd-rel-quality-cards > [class*="col-"]:has(.bd-rel-crank-topics-tip:hover),
.bd-rel-quality-cards > [class*="col-"]:has(.bd-rel-crank-topics-tip:focus),
.bd-rel-quality-cards > [class*="col-"]:has(.bd-rel-crank-topics-tip:focus-visible) {
    z-index: 40;
}
.bd-rel-quality-cards .card {
    overflow: visible;
}
.bd-rel-quality-sub {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--bd-rel-divider, #eef0f3);
    display: grid;
    gap: 10px;
}
.bd-rel-quality-stages {
    display: grid;
    grid-template-columns: minmax(120px, .9fr) repeat(6, minmax(0, 1fr));
    gap: 6px;
    padding: 10px;
    border: 1px solid #c9d4f0;
    border-radius: var(--bd-rel-r-lg, 10px);
    background: linear-gradient(135deg, #f7f8ff, #eef3fb 52%, #fafbff);
}
.bd-rel-quality-stage-ticket {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 8px 10px;
    border: 1px solid #a5b4fc;
    border-radius: var(--bd-rel-r, 8px);
    background: linear-gradient(135deg, #e0e7ff, #c7d2fe);
    color: #3730a3;
    text-align: center;
    box-shadow: 0 4px 12px rgba(76, 82, 188, 0.12);
}
.bd-rel-quality-stage-ticket span {
    font-size: 11px;
    font-weight: 800;
    line-height: 1.2;
    white-space: nowrap;
}
.bd-rel-quality-stage-ticket strong {
    margin-top: 2px;
    font-size: 13px;
    font-weight: 900;
    line-height: 1.2;
}
.bd-rel-quality-stages > span[data-stage] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 48px;
    padding: 8px 6px;
    border: 1px solid #e2e8f0;
    border-radius: var(--bd-rel-r, 8px);
    background: #fff;
    color: #64748b;
    font-size: 12px;
    font-weight: 800;
    text-align: center;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease, background .15s ease;
}
.bd-rel-quality-stages > span[data-stage] em {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 999px;
    background: #e2e8f0;
    color: #475569;
    font-size: 11px;
    font-style: normal;
    font-weight: 900;
}
.bd-rel-quality-stages > span[data-stage] b {
    font-size: 12px;
    font-weight: 900;
    white-space: nowrap;
}
.bd-rel-quality-stages > span[data-stage].is-active {
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.12);
}
.bd-rel-quality-stages > span[data-tone="stable"].is-active {
    border-color: #059669;
    background: linear-gradient(135deg, #d1fae5, #a7f3d0);
    color: #047857;
}
.bd-rel-quality-stages > span[data-tone="normal"].is-active {
    border-color: #4c52bc;
    background: linear-gradient(135deg, #e0e7ff, #c7d2fe);
    color: #3730a3;
}
.bd-rel-quality-stages > span[data-tone="caution"].is-active {
    border-color: #d97706;
    background: linear-gradient(135deg, #fef3c7, #fde68a);
    color: #92400e;
}
.bd-rel-quality-stages > span[data-tone="warning"].is-active {
    border-color: #ea580c;
    background: linear-gradient(135deg, #ffedd5, #fed7aa);
    color: #c2410c;
}
.bd-rel-quality-stages > span[data-tone="danger"].is-active {
    border-color: #dc2626;
    background: linear-gradient(135deg, #fee2e2, #fecaca);
    color: #b91c1c;
}
.bd-rel-quality-stages > span[data-stage].is-active em {
    background: rgba(255,255,255,.85);
    color: inherit;
}
.bd-rel-quality-final-card {
    border-radius: var(--bd-rel-r, 8px);
    transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.bd-rel-quality-final-card.tone-stable { background: #d1fae5; border-color: #059669; color: #047857; }
.bd-rel-quality-final-card.tone-stable #bd_rel_penalty_final,
.bd-rel-quality-final-card.tone-stable small { color: #047857 !important; }
.bd-rel-quality-final-card.tone-normal { background: #e0e7ff; border-color: #4c52bc; color: #3730a3; }
.bd-rel-quality-final-card.tone-normal #bd_rel_penalty_final,
.bd-rel-quality-final-card.tone-normal small { color: #3730a3 !important; }
.bd-rel-quality-final-card.tone-caution { background: #fef3c7; border-color: #d97706; color: #92400e; }
.bd-rel-quality-final-card.tone-caution #bd_rel_penalty_final,
.bd-rel-quality-final-card.tone-caution small { color: #92400e !important; }
.bd-rel-quality-final-card.tone-warning { background: #ffedd5; border-color: #ea580c; color: #c2410c; }
.bd-rel-quality-final-card.tone-warning #bd_rel_penalty_final,
.bd-rel-quality-final-card.tone-warning small { color: #c2410c !important; }
.bd-rel-quality-final-card.tone-danger { background: #fee2e2; border-color: #dc2626; color: #b91c1c; }
.bd-rel-quality-final-card.tone-danger #bd_rel_penalty_final,
.bd-rel-quality-final-card.tone-danger small { color: #b91c1c !important; }
.bd-rel-quality-final-card.tone-missing { background: #eff6ff; border-color: #60a5fa; color: #1d4ed8; }
.bd-rel-quality-final-card.tone-missing #bd_rel_penalty_final,
.bd-rel-quality-final-card.tone-missing small { color: #1d4ed8 !important; }
/* 최종 진단 · 가이드: 래퍼(테두리·패딩) 유지, 배경색 없음. 안내 문구는 단계/휴면 tone 글씨색 */
.bd-rel-quality-block .bd-rel-penalty-desc {
    display: grid;
    gap: 8px;
    border-radius: var(--bd-rel-r-lg, 10px);
    padding: 12px 14px;
    border: 1px solid #e9ecef;
    background: transparent;
}
.bd-rel-penalty-desc .bd-rel-final-label {
    display: block;
    width: fit-content;
    border-radius: var(--bd-rel-r-pill, 6px);
    background: rgba(76, 82, 188, 0.12);
    color: #4c52bc;
}
.bd-rel-penalty-guide {
    font-size: 12px;
    line-height: 1.55;
    color: #3a3a3a;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    font-style: normal;
    font-weight: 600;
}
/* 휴면·단계 경고 글씨색 (박스 배경 없음) */
.bd-rel-penalty-guide.is-caution,
.bd-rel-penalty-guide.tone-caution {
    color: #92400e !important;
}
.bd-rel-penalty-guide.tone-warning {
    color: #c2410c !important;
}
.bd-rel-penalty-guide.is-severe,
.bd-rel-penalty-guide.tone-danger {
    color: #b91c1c !important;
}
.bd-rel-penalty-guide.tone-missing {
    color: #1d4ed8 !important;
}
.bd-rel-penalty-guide.tone-stable,
.bd-rel-penalty-guide.tone-normal {
    color: #3a3a3a !important;
}
/* 래퍼에는 tone 배경색을 넣지 않음. 뱃지는 고정 */
.bd-rel-penalty-desc.tone-stable,
.bd-rel-penalty-desc.tone-normal,
.bd-rel-penalty-desc.tone-caution,
.bd-rel-penalty-desc.tone-warning,
.bd-rel-penalty-desc.tone-danger,
.bd-rel-penalty-desc.tone-missing {
    background: transparent;
    border-color: #e9ecef;
}
.bd-rel-penalty-desc.tone-stable .bd-rel-final-label,
.bd-rel-penalty-desc.tone-normal .bd-rel-final-label,
.bd-rel-penalty-desc.tone-caution .bd-rel-final-label,
.bd-rel-penalty-desc.tone-warning .bd-rel-final-label,
.bd-rel-penalty-desc.tone-danger .bd-rel-final-label,
.bd-rel-penalty-desc.tone-missing .bd-rel-final-label {
    background: rgba(76, 82, 188, 0.12);
    color: #4c52bc;
}
@media (max-width: 991.98px) {
    .bd-rel-quality-stages {
        grid-template-columns: minmax(110px, 1fr) repeat(3, minmax(0, 1fr));
    }
}
@media (max-width: 575.98px) {
    .bd-rel-quality-stages {
        grid-template-columns: 1fr 1fr;
    }
    .bd-rel-quality-stage-ticket { grid-column: 1 / -1; }
}
.bd-rel-evidence-box {
    border: 1px solid #e9ecef;
    border-radius: 10px;
    background: #fff;
    padding: 14px 16px;
}
.bd-rel-evidence-notice {
    background: #eef3fb;
    border: 1px solid #d9e3f5;
    border-radius: 8px;
    padding: 10px 12px;
    font-size: 12px;
    color: #3a3a3a;
    line-height: 1.45;
}
.bd-rel-evidence-scroll {
    max-height: 292px; /* thead + 기본 5행 */
    overflow-y: auto;
    border: 1px solid #eef0f3;
    border-radius: 8px;
}
.bd-rel-evidence-dist-box {
    border: 1px solid #e9ecef;
    border-radius: 8px;
    background: #fafbfc;
    padding: 12px 14px;
}
.bd-rel-evidence-table thead th {
    background: rgb(235, 235, 235) !important;
    color: rgb(55, 55, 55) !important;
    font-weight: 700;
    font-size: 12px;
    border-color: #e0e0e0;
    padding: 10px 8px;
    position: sticky;
    top: 0;
    z-index: 1;
}
.bd-rel-evidence-table tbody td {
    vertical-align: middle;
    padding: 10px 8px;
    border-color: #eef0f3;
}
.bd-rel-evidence-table .progress {
    height: var(--bd-rel-progress-h, 8px);
    min-width: 80px;
}
.bd-rel-ev-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.25;
    padding: 3px 8px;
    border-radius: 6px;
    white-space: nowrap;
}
.bd-rel-ev-badge.state-clear_stable {
    background: rgba(25, 135, 84, 0.12);
    color: #198754;
}
.bd-rel-ev-badge.state-stable {
    background: rgba(52, 205, 137, 0.14);
    color: #1f9d6a;
}
.bd-rel-ev-badge.state-variable {
    background: rgba(253, 126, 20, 0.14);
    color: #fd7e14;
}
.bd-rel-ev-badge.state-weakened {
    background: rgba(220, 53, 69, 0.12);
    color: #dc3545;
}
.bd-rel-ev-badge.state-unavailable {
    background: #f1f3f5;
    color: #3a3a3a;
}
.bd-rel-ev-bar-clear_stable { background-color: #198754 !important; }
.bd-rel-ev-bar-stable { background-color: #34cd89 !important; }
.bd-rel-ev-bar-variable { background-color: #fd7e14 !important; }
.bd-rel-ev-bar-weakened { background-color: #dc3545 !important; }
.bd-rel-ev-bar-unavailable { background-color: #adb5bd !important; }
.bd-rel-dist-row {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
}
.bd-rel-dist-row:last-child { margin-bottom: 0; }
.bd-rel-dist-label {
    flex: 0 0 120px;
    font-size: 12px;
    color: #3a3a3a;
}
.bd-rel-dist-track {
    flex: 1 1 auto;
    height: 8px;
    background: #eef0f3;
    border-radius: 999px;
    overflow: hidden;
}
.bd-rel-dist-fill {
    height: 100%;
    border-radius: 999px;
}
.bd-rel-dist-count {
    flex: 0 0 28px;
    text-align: right;
    font-size: 12px;
    font-weight: 700;
    color: #3a3a3a;
}
.bd-rel-aux-summary {
    border: 1px solid #d9e3f5;
    border-radius: 10px;
    background: #f7f9fd;
    padding: 12px;
}
.bd-rel-aux-card {
    border: 1px solid #d9e3f5;
    border-radius: 8px;
    background: #eef3fb;
    padding: 12px;
    height: 100%;
}
.bd-rel-aux-card-label {
    font-size: 11px;
    color: var(--bd-rel-c-muted, #6b7280);
    margin-bottom: 10px;
}
.bd-rel-aux-card-value {
    font-size: 15px;
    font-weight: 700;
    color: #3a3a3a;
    line-height: 1.35;
    margin-top: 2px;
}
.bd-rel-aux-progress {
    height: 8px;
    background: #e4e8f0;
}
.bd-rel-final-label {
    background: rgba(71, 112, 189, 0.12);
    color: #4770bd;
    font-weight: 600;
    font-size: 12px;
    padding: 6px 10px;
}
.bd-rel-nested-box {
    border: 1px solid #e9ecef;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
}
/* C-Rank '독창적 경험 세부 지표' 그룹 헤더와 동일 톤 */
.bd-rel-nested-title {
    background: #e8f5ef;
    border-bottom: 1px solid #d4edda;
    padding: 12px 14px;
    font-size: 13px;
    font-weight: 700;
    color: #198754;
}
.bd-rel-nested-body {
    padding: 16px 14px;
}
.bd-rel-split-row {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 20px;
}
.bd-rel-split-label {
    flex: 0 0 118px;
    font-size: 12px;
    font-weight: 700;
    color: #3a3a3a;
    line-height: 1.4;
    padding-top: 4px;
}
.bd-rel-split-body {
    flex: 1 1 auto;
    min-width: 0;
}
@media (max-width: 767.98px) {
    .bd-rel-split-row {
        flex-direction: column;
        gap: 8px;
    }
    .bd-rel-split-label {
        flex-basis: auto;
    }
}
.bd-rel-eval-box {
    background: #f3f6fc;
    border: 1px solid #d9e3f5;
}
/* 신뢰도 평가/AI 평가 테이블 — 라운드 래퍼 + 셀 여백 */
.bd-rel-ai-table-wrap {
    border: 1px solid #e9ecef;
    border-radius: var(--bd-rel-r, 8px);
    overflow: hidden;
    background: #fff;
}
.bd-rel-ai-table-wrap > .bd-rel-ai-table {
    margin-bottom: 0 !important;
    border: 0 !important;
}
.bd-rel-ai-table thead th {
    background: rgb(235, 235, 235) !important;
    color: rgb(55, 55, 55) !important;
    font-weight: 700;
    font-size: 12px !important;
    font-family: 'Malgun Gothic', '맑은 고딕' !important;
}
.bd-rel-ai-table th,
.bd-rel-ai-table td {
    vertical-align: middle;
    font-size: 12px !important;
    font-family: 'Malgun Gothic', '맑은 고딕' !important;
    padding: 10px 12px !important;
}
.bd-rel-ai-table .progress {
    height: 8px;
    margin-top: 4px;
}
.bd-rel-ai-table th.bd-rel-th-item,
.bd-rel-ai-table th.bd-rel-th-desc,
.bd-rel-ai-table th.bd-rel-th-score {
    text-align: left !important;
}
.bd-rel-ai-table th.bd-rel-th-status {
    text-align: center !important;
}
.bd-rel-ai-table-wrap .bd-rel-ai-table > :not(caption) > * > * {
    border-left: 0;
    border-right: 0;
}
.bd-rel-ai-table-wrap .bd-rel-ai-table > tbody > tr:last-child > * {
    border-bottom: 0;
}

/* 신뢰도 탭 블로그 지수 결과 — 파란/빨강 분기 없이 고정색 */
#bd_rel_blog_index {
    color: #4c52bc !important;
}

/* 신뢰도 히스토리 열 너비 — 텍스트 열 우선, 점수(xx.xx)·ID복사 축소 */
#bd_rel_history {
    width: 100%;
    min-width: 1100px;
}
#bd_rel_history col.bd-rel-hist-col-check { width: 32px; }
#bd_rel_history col.bd-rel-hist-col-seq { width: 28px; }
#bd_rel_history col.bd-rel-hist-col-date { width: 108px; }
#bd_rel_history col.bd-rel-hist-col-copy { width: 48px; }
#bd_rel_history col.bd-rel-hist-col-blog { width: 140px; }
#bd_rel_history col.bd-rel-hist-col-index { width: 90px; }
#bd_rel_history col.bd-rel-hist-col-subject { width: 90px; }
#bd_rel_history col.bd-rel-hist-col-num { width: 72px; }
#bd_rel_history col.bd-rel-hist-col-trust { width: 112px; }
#bd_rel_history col.bd-rel-hist-col-quality { width: 110px; }
#bd_rel_history th.bd-rel-hist-seq,
#bd_rel_history_body td.bd-rel-hist-seq {
    padding-left: 2px !important;
    padding-right: 2px !important;
}
/* 헤더: 말줄임 금지, 줄바꿈으로 전체 표기 */
#bd_rel_history thead th {
    overflow: visible;
    text-overflow: clip;
    white-space: normal !important;
    word-break: keep-all;
    line-height: 1.25;
    vertical-align: middle;
    padding-left: 4px !important;
    padding-right: 4px !important;
}
/* 본문: 값만 말줄임 */
#bd_rel_history_body td {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: middle;
}
#bd_rel_history th:nth-child(4),
#bd_rel_history_body td:nth-child(4) {
    padding-left: 2px !important;
    padding-right: 2px !important;
}

/* 제목별 신뢰도 분석 / 신뢰도 히스토리 — 진단분석 히스토리와 동일 열 텍스트 */
#bd_rel_title_rows_body td,
#bd_rel_history_body td {
    font-size: 12px !important;
    font-family: 'Malgun Gothic', '맑은 고딕' !important;
}
#blog_diagnosis_reliability_body table.table-sm thead th {
    font-size: 12px !important;
    font-family: 'Malgun Gothic', '맑은 고딕' !important;
}
.bd-rel-nested-title .bd-rel-ai-inline-btn {
    font-size: 12px;
    padding: 0.12rem 0.55rem;
    line-height: 1.35;
    border-width: 1px;
    white-space: nowrap;
}
.bd-rel-stage-card {
    border: 1px solid #eee;
    border-radius: 8px;
    padding: 10px 12px;
    background: #fff;
    height: 100%;
}
.bd-rel-stage-card.is-active {
    border-color: #198754;
    background: #f0faf3;
}
/* C-Rank 세부 지표 게이지 그룹 (독창적 경험 / C-Rank / 창작 발행도) */
.bd-rel-gauge-group {
    border: 1px solid #e9ecef;
    border-radius: 8px;
    background: #fafbfc;
    overflow: visible;
}
.bd-rel-gauge-group-head {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 8px 14px;
    background: #e8f5ef;
    color: #198754;
    padding: 10px 14px;
    border-bottom: 1px solid #d4edda;
    border-radius: 8px 8px 0 0;
}
.bd-rel-gauge-group-title {
    font-weight: 700;
    font-size: 13px;
    white-space: nowrap;
}
.bd-rel-gauge-group-title .bd-rel-gauge-tip,
.bd-rel-gauge-label .bd-rel-gauge-tip {
    margin-left: 3px;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 11px;
    cursor: help;
    vertical-align: 0;
}
.bd-rel-gauge-group-title .bd-rel-gauge-tip:hover,
.bd-rel-gauge-label .bd-rel-gauge-tip:hover,
.bd-rel-gauge-group-title .bd-rel-gauge-tip:hover > .bi,
.bd-rel-gauge-label .bd-rel-gauge-tip:hover > .bi {
    color: #4c52bc;
}
.bd-rel-gauge-group-title .bd-rel-gauge-tip > .bi,
.bd-rel-gauge-label .bd-rel-gauge-tip > .bi {
    font-size: inherit;
    color: inherit;
}
.bd-rel-gauge-row {
    overflow: visible;
}
.bd-rel-gauge-group:has(.bd-rel-crank-topics-tip:hover),
.bd-rel-gauge-group:has(.bd-rel-crank-topics-tip:focus),
.bd-rel-gauge-group:has(.bd-rel-crank-topics-tip:focus-visible) {
    z-index: 30;
    position: relative;
}
.bd-rel-gauge-group-desc {
    font-size: 12px;
    font-weight: 400;
    color: #3a3a3a;
    line-height: 1.45;
}
/* 신뢰도 보조진단 —「왜 보조진단이 필요한가?」안내 박스 */
.bd-rel-validation-purpose {
    padding: 10px 12px;
    border: 1px solid #e6e8ec;
    border-radius: 8px;
    background: #f8f9fb;
}
.bd-rel-validation-purpose strong {
    display: block;
    margin-bottom: 4px;
    color: #4c52bc;
    font-size: 12px;
}
.bd-rel-validation-purpose p {
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 14px;
    line-height: 1.55;
}
.bd-rel-validation-purpose ol {
    margin: 0;
    padding-left: 1.35rem;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 14px;
    line-height: 1.55;
}
.bd-rel-validation-purpose ol > li + li {
    margin-top: 6px;
}
.bd-rel-validation-purpose ol b {
    color: #3a3a3a;
    font-weight: 700;
}
/* C-Rank 분석취지: 보조진단 안내보다 2px 작게, bold 없음 */
.bd-rel-crank-purpose .bd-rel-crank-purpose-title {
    display: block;
    margin-bottom: 4px;
    color: #4c52bc;
    font-size: 12px; /* 「왜 보조진단이 필요한가?」제목과 동일 */
    font-weight: 700;
}
.bd-rel-crank-purpose ol {
    font-size: 12px;
}
.bd-rel-crank-purpose ol b,
.bd-rel-crank-purpose strong {
    font-weight: 400;
    color: inherit;
}
/* 분석취지 순번: 연한 원형 배지 */
.bd-rel-crank-purpose-list {
    list-style: none;
    padding-left: 0;
    counter-reset: bd-rel-crank-purpose;
}
.bd-rel-crank-purpose-list > li {
    position: relative;
    padding-left: 1.65rem;
    counter-increment: bd-rel-crank-purpose;
}
.bd-rel-crank-purpose-list > li::before {
    content: counter(bd-rel-crank-purpose);
    position: absolute;
    left: 0;
    top: 0.05em;
    width: 1.2em;
    height: 1.2em;
    border-radius: 50%;
    background: #e8eaef;
    color: #2f3136;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.2em;
    text-align: center;
}
.bd-rel-crank-purpose-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 1.2em;
    height: 1.2em;
    margin-right: 0.35em;
    border-radius: 50%;
    background: #e8eaef;
    color: #2f3136;
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
    vertical-align: -0.05em;
}
.bd-rel-crank-purpose-sub {
    display: flex;
    align-items: flex-start;
    gap: 0;
}
.bd-rel-col-5 {
    flex: 0 0 50% !important;
    max-width: 50% !important;
}
@media (min-width: 768px) {
    .bd-rel-col-5 {
        flex: 0 0 33.3333% !important;
        max-width: 33.3333% !important;
    }
}
@media (min-width: 1200px) {
    .bd-rel-col-5 {
        flex: 0 0 20% !important;
        max-width: 20% !important;
    }
}
.bd-rel-gauge-card {
    position: relative;
    z-index: 1;
    border: 1px solid #eee;
    border-radius: 8px;
    padding: 14px 12px 16px;
    background: #fff;
    height: 100%;
    display: flex;
    flex-direction: column;
}
.bd-rel-gauge-card:hover,
.bd-rel-gauge-card:focus-within {
    z-index: 20;
}
.bd-rel-gauge-label-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 18px;
}
.bd-rel-gauge-label {
    font-size: 12px;
    color: #3a3a3a;
    line-height: 1.35;
}
.bd-rel-gauge-value {
    font-size: 15px;
    font-weight: 700;
    color: #3a3a3a;
    line-height: 1.2;
    white-space: nowrap;
}
.bd-rel-gauge-foot {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    margin-top: 18px;
}
.bd-rel-gauge-bench {
    font-size: 12px;
    color: #3a3a3a;
    line-height: 1.3;
}
.bd-rel-gauge-track {
    position: relative;
    height: 8px;
    background: #e9ecef;
    border-radius: 999px;
    overflow: visible;
    margin: 8px 0;
}
.bd-rel-gauge-card:has(.bd-rel-gauge-baseline) {
    padding-top: 10px;
}
.bd-rel-gauge-fill {
    height: 100%;
    border-radius: 999px;
}
/* CLI score-bar-benchmark / competitor-summary-gauge: 검정 핀 + 하단 삼각 캡 */
.bd-rel-gauge-baseline {
    position: absolute;
    z-index: 2;
    top: -5px;
    width: 2px;
    height: 15px;
    margin-left: -1px;
    border: 0;
    border-radius: 2px;
    background: #0f172a;
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.9);
    transform: none;
    pointer-events: none;
}
.bd-rel-gauge-baseline::before {
    content: "";
    position: absolute;
    top: -4px;
    left: 50%;
    width: 0;
    height: 0;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
    border-top: 4px solid #0f172a;
    transform: translateX(-50%);
}
.bd-rel-gauge-baseline em { display: none; }
.bd-rel-score-card .bd-rel-gauge-track {
    margin-top: 14px;
    margin-bottom: 8px;
}
.bd-rel-crank-legend {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}
.bd-rel-legend-bar {
    display: inline-block;
    width: 18px;
    height: 4px;
    background: #198754;
    border-radius: 2px;
    vertical-align: middle;
}
.bd-rel-legend-mark {
    position: relative;
    display: inline-block;
    width: 2px;
    height: 12px;
    margin: 0 4px 0 2px;
    border-radius: 2px;
    background: #0f172a;
    vertical-align: middle;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.9);
}
.bd-rel-legend-mark::before {
    content: "";
    position: absolute;
    top: -3px;
    left: 50%;
    border-right: 3px solid transparent;
    border-left: 3px solid transparent;
    border-top: 3px solid #0f172a;
    transform: translateX(-50%);
}
.bd-rel-term-list {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}
.bd-rel-term {
    display: inline-flex;
    align-items: center;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.25;
    padding: 3px 8px;
    margin: 0;
    border-radius: 6px;
    border: 1px solid #dee2e6;
    white-space: nowrap;
}
/* n차 평가 단어 색상 (CLI stage-N 동일, 표시 순서 무관) */
.bd-rel-term.stage-0 {
    border-color: #e2e8f0;
    color: #475569;
    background: #f8fafc;
}
.bd-rel-term.stage-1 {
    border-color: #bfdbfe;
    color: #1d4ed8;
    background: #eff6ff;
}
.bd-rel-term.stage-2 {
    border-color: #a7f3d0;
    color: #047857;
    background: #ecfdf5;
}
.bd-rel-term.stage-3 {
    border-color: #ddd6fe;
    color: #6d28d9;
    background: #f5f3ff;
}
.bd-rel-term.stage-4 {
    border-color: #fed7aa;
    color: #c2410c;
    background: #fff7ed;
}
/* legacy class names kept for safety */
.bd-rel-term-a { background: #e8f5ef; border-color: #c3e6cb; }
.bd-rel-term-b { background: #e7f1ff; border-color: #b6d4fe; }
.bd-rel-term-c { background: #fff3cd; border-color: #ffe69c; }
.bd-rel-badge-ok,
.bd-rel-badge-warn,
.bd-rel-badge-bad,
.bd-rel-badge-muted {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.25;
    padding: 3px 8px;
    border-radius: 6px;
    white-space: nowrap;
}
.bd-rel-badge-ok {
    background: rgba(25, 135, 84, 0.12);
    color: #198754;
}
.bd-rel-badge-warn {
    background: rgba(253, 126, 20, 0.12);
    color: #fd7e14;
}
.bd-rel-badge-bad {
    background: rgba(220, 53, 69, 0.12);
    color: #dc3545;
}
.bd-rel-badge-muted {
    background: #f1f3f5;
    color: #3a3a3a;
}

/* 신뢰도 결과 영역: 데이터/라벨 회색 → #3a3a3a (가독성) */
#blog_diagnosis_reliability_body .text-cs-gray,
#blog_diagnosis_reliability_pane .text-cs-gray,
#bd_rel_competitor_panel .text-cs-gray,
#bd_rel_ai_panel .text-cs-gray,
#blog_diagnosis_reliability_body tr.text-cs-gray,
#blog_diagnosis_reliability_body thead.text-cs-gray,
#blog_diagnosis_reliability_body th.text-cs-gray,
#blog_diagnosis_reliability_body td.text-cs-gray,
#blog_diagnosis_reliability_body .bd-rel-topic-pill > span,
#blog_diagnosis_reliability_body .bd-rel-crank-legend,
#blog_diagnosis_reliability_body .bd-rel-topic-strength span,
#blog_diagnosis_reliability_body .bd-rel-subtopic-name small,
#blog_diagnosis_reliability_body .bd-rel-subtopic-detail span,
#blog_diagnosis_reliability_body .bd-rel-dist-tier-head span,
#blog_diagnosis_reliability_body .bd-rel-dist-card .bd-rel-dist-metrics small,
#blog_diagnosis_reliability_body .bd-rel-dist-compact-value span,
#blog_diagnosis_reliability_body .bd-rel-topic-direction {
    color: #3a3a3a !important;
}

/* 결과 영역 배지 통일: badge token */
#blog_diagnosis_reliability_body .badge,
#bd_rel_competitor_panel .badge,
#bd_rel_ai_panel .badge,
.bd-rel-topic-rank,
.bd-rel-dist-name > em,
.bd-rel-ev-badge,
.bd-rel-badge-info {
    font-size: var(--bd-rel-badge-fs, 12px) !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    padding: var(--bd-rel-badge-pad, 3px 8px) !important;
    border-radius: var(--bd-rel-r-pill, 6px) !important;
}
.bd-rel-badge-info {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.25;
    padding: 3px 8px;
    border-radius: 6px;
    white-space: nowrap;
    background: rgba(13, 110, 253, 0.12);
    color: #0d6efd;
}
.bd-rel-topic-card {
    border: 1px solid #d9e4f0;
    border-radius: 12px;
    background: #fff;
    height: 100%;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    overflow: hidden;
}
.bd-rel-topic-card.is-core {
    border-color: #9ec5fe;
}
.bd-rel-topic-card-body {
    padding: 16px;
}
.bd-rel-topic-rank {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    padding: 3px 8px;
    border-radius: 6px;
    background: rgba(71, 112, 189, 0.12);
    color: #4770bd;
}
.bd-rel-topic-strength {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    font-size: 12px;
}
.bd-rel-topic-strength strong {
    color: #3a3a3a;
}
.bd-rel-topic-strength span {
    color: var(--bd-rel-c-muted, #6b7280);
}
/* C-Rank 상위주제: 헤더 시장평균 설명 + 카드 주황 점선「시장 평균」마커 */
.bd-rel-topic-portfolio-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}
/* C-Rank 상위주제 설명: 경쟁력「시장 대응력」summary-tip 패널 스타일 + 신뢰도 bi 아이콘 */
.bd-rel-crank-topics-title {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.bd-rel-crank-topics-tip {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    background: transparent;
    line-height: 1;
    cursor: help;
    vertical-align: middle;
}
.bd-rel-crank-topics-tip > .bi {
    font-size: inherit;
    color: inherit;
}
/* fixed + JS(.is-open) 위치 보정: overflow 클리핑/스크롤바 깜빡임 방지 */
.bd-rel-crank-topics-tooltip {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1080;
    display: none;
    width: min(420px, 86vw);
    max-height: min(70vh, 520px);
    overflow-y: auto;
    padding: 13px 14px;
    border: 1px solid #93c5fd;
    border-radius: 10px;
    color: #334155;
    background: #fff;
    box-shadow: 0 16px 34px rgba(15, 23, 42, 0.2);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.6;
    text-align: left;
    white-space: normal;
    pointer-events: auto;
}
.bd-rel-crank-topics-tooltip.is-open {
    display: block;
}
.bd-rel-crank-topics-tooltip strong {
    display: block;
    margin: 0;
    color: #1d4ed8;
    font-size: 12px;
}
.bd-rel-crank-topics-tooltip p {
    margin: 3px 0 10px;
    color: #334155;
    font-size: 12px;
    font-weight: 650;
    line-height: 1.6;
}
.bd-rel-crank-topics-tooltip p.mb-0,
.bd-rel-crank-topics-tooltip p:last-child {
    margin-bottom: 0;
}
@media (max-width: 575.98px) {
    .bd-rel-crank-topics-tooltip {
        width: min(320px, 88vw);
    }
}
.bd-rel-topic-portfolio-note {
    max-width: none;
    flex: 1 1 auto;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: var(--bd-rel-fs-label, 11px);
    line-height: 1.35;
    text-align: right;
    white-space: nowrap;
}
@media (max-width: 991.98px) {
    .bd-rel-topic-portfolio-note {
        white-space: normal;
        text-align: left;
        max-width: 100%;
    }
}
.bd-rel-topic-score-line {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}
.bd-rel-topic-score-line.has-market-benchmark {
    padding-top: 18px;
}
.bd-rel-topic-score-line > i {
    position: relative;
    display: block;
    flex: 1 1 auto;
    height: 8px;
    border-radius: 999px;
    background: #eef1f5;
    overflow: visible;
}
.bd-rel-topic-score-line > i > b {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: #4c52bc;
}
.bd-rel-topic-score-line.gauge-strong > i > b,
.bd-rel-topic-score-line.gauge-excellent > i > b {
    background: #198754;
}
.bd-rel-topic-score-line.gauge-growth > i > b {
    background: #4c52bc;
}
.bd-rel-topic-score-line.gauge-support > i > b,
.bd-rel-topic-score-line.gauge-weak > i > b {
    background: #fd7e14;
}
.bd-rel-topic-score-line > i > em {
    position: absolute;
    top: -4px;
    z-index: 2;
    width: 2px;
    height: 16px;
    border-radius: 999px;
    background: repeating-linear-gradient(
        to bottom,
        #f97316 0,
        #f97316 2px,
        transparent 2px,
        transparent 4px
    );
    transform: translateX(-50%);
}
.bd-rel-topic-score-line.has-market-benchmark > i > em::after {
    position: absolute;
    bottom: 18px;
    left: 50%;
    padding: 2px 5px;
    border: 1px solid #fed7aa;
    border-radius: 5px;
    color: #9a3412;
    background: #fff7ed;
    font-size: var(--bd-rel-fs-label, 11px);
    font-style: normal;
    font-weight: 900;
    line-height: 1.15;
    white-space: nowrap;
    content: "시장 평균";
    transform: translateX(-50%);
}
.bd-rel-topic-score-line > strong {
    min-width: 42px;
    text-align: right;
    font-size: 14px;
    color: #3a3a3a;
}
.bd-rel-topic-market-benchmark {
    display: grid;
    grid-template-columns: auto auto minmax(0, 1fr) auto;
    gap: 6px 8px;
    align-items: center;
    margin-bottom: 10px;
    padding: 8px 9px;
    border: 1px solid #e6e8ec;
    border-radius: var(--bd-rel-r, 8px);
    background: #f8f9fa;
    font-size: 11px;
}
.bd-rel-topic-market-benchmark.above {
    border-color: #c3e6cb;
    background: #f0faf3;
}
.bd-rel-topic-market-benchmark.below {
    border-color: #ffc107;
    background: #fff8e8;
}
.bd-rel-topic-market-benchmark.pending {
    border-color: #e6e8ec;
    background: #f8f9fa;
}
.bd-rel-topic-market-benchmark > span {
    color: var(--bd-rel-c-muted, #6b7280);
    font-weight: 700;
    white-space: nowrap;
}
.bd-rel-topic-market-benchmark > strong {
    color: #3a3a3a;
    font-size: 13px;
}
.bd-rel-topic-market-benchmark > b {
    overflow: hidden;
    color: #334155;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.bd-rel-topic-market-benchmark.above > b { color: #157347; }
.bd-rel-topic-market-benchmark.below > b { color: #c2410c; }
.bd-rel-topic-market-benchmark > small {
    min-width: 48px;
    padding: 3px 8px;
    border-radius: 999px;
    color: #475569 !important;
    background: #e2e8f0;
    font-size: 11px;
    font-weight: 800;
    text-align: center;
    white-space: nowrap;
}
.bd-rel-topic-market-benchmark > small[data-grade="우수"] {
    color: #146c43 !important;
    background: #d1e7dd;
}
.bd-rel-topic-market-benchmark > small[data-grade="적합"] {
    color: #0f5132 !important;
    background: #d1e7dd;
}
.bd-rel-topic-market-benchmark > small[data-grade="보통"] {
    color: #9a3412 !important;
    background: #ffedd5;
}
.bd-rel-topic-market-benchmark > small[data-grade="부적합"],
.bd-rel-topic-market-benchmark > small[data-grade="미달"] {
    color: #b42318 !important;
    background: #fee4e2;
}
.bd-rel-topic-market-benchmark > small[data-grade="대기"] {
    color: #92400e !important;
    background: #fef3c7;
}
.bd-rel-topic-direction {
    margin: 0 0 12px;
    color: #6c757d;
    font-size: 12px;
    line-height: 1.5;
}
.bd-rel-topic-evidence {
    border-top: 1px solid #eef0f3;
    padding-top: 12px;
}
.bd-rel-topic-bar {
    height: 8px !important;
}
.bd-rel-topic-score {
    min-width: 42px;
    text-align: right;
    font-size: 14px;
    color: #3a3a3a;
}
.bd-rel-topic-pill {
    border: 1px solid #eef0f3;
    border-radius: 8px;
    background: #f7f9fb;
    padding: 9px 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    height: 100%;
}
.bd-rel-topic-pill b {
    font-size: 13px;
    color: #3a3a3a;
}
.bd-rel-crank-cell {
    background: rgba(76, 82, 188, 0.12) !important;
    border-color: rgba(76, 82, 188, 0.25) !important;
}
.bd-rel-sub-portfolio {
    border: 1px solid #e9ecef;
    border-radius: 10px;
    background: #fafbfc;
    padding: 14px;
}
.bd-rel-sub-portfolio-head {
    font-size: 13px;
    font-weight: 700;
    color: #3a3a3a;
    margin-bottom: 12px;
    line-height: 1.4;
}
.bd-rel-sub-topics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 12px;
}
@media (max-width: 991.98px) {
    .bd-rel-sub-topics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 575.98px) {
    .bd-rel-sub-topics {
        grid-template-columns: 1fr;
    }
}
.bd-rel-subtopic-row {
    position: relative;
    border: 1px solid #e6e8ec;
    border-radius: 10px;
    background: #fff;
    min-width: 0;
}
.bd-rel-subtopic-row:hover,
.bd-rel-subtopic-row:focus-within {
    border-color: #9ec5fe;
    box-shadow: 0 4px 12px rgba(76, 82, 188, 0.08);
    z-index: 20;
}
.bd-rel-subtopic-summary {
    display: grid;
    grid-template-columns: 24px minmax(70px, 1fr) minmax(50px, 1fr) auto;
    gap: 8px;
    align-items: center;
    padding: 10px;
}
.bd-rel-subtopic-summary .progress {
    height: var(--bd-rel-progress-h, 8px);
}
.bd-rel-sub-order {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    border-radius: 6px;
    background: #eef1f5;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 11px;
    font-weight: 700;
    flex-shrink: 0;
}
.bd-rel-subtopic-name {
    min-width: 0;
    overflow: hidden;
}
.bd-rel-subtopic-name strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 12px;
    color: #3a3a3a;
}
.bd-rel-subtopic-name small {
    display: block;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 11px;
}
.bd-rel-subtopic-score {
    font-size: 12px;
    font-weight: 700;
    color: #3a3a3a;
    white-space: nowrap;
    text-align: right;
}
.bd-rel-subtopic-detail {
    display: none;
    position: absolute;
    z-index: 30;
    top: calc(100% + 6px);
    left: 0;
    width: min(420px, calc(100vw - 48px));
    flex-wrap: wrap;
    gap: 6px;
    padding: 11px 12px;
    border: 1px solid #9ec5fe;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.16);
}
.bd-rel-subtopic-row:hover .bd-rel-subtopic-detail,
.bd-rel-subtopic-row:focus-within .bd-rel-subtopic-detail {
    display: flex;
}
.bd-rel-subtopic-detail span {
    padding: 4px 6px;
    border-radius: 5px;
    color: #6c757d;
    background: #f1f3f5;
    font-size: 12px;
    font-weight: 600;
}
.bd-rel-dist-tier-head {
    display: flex;
    align-items: baseline;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 10px;
}
.bd-rel-dist-tier-head strong {
    font-size: 13px;
    color: #3a3a3a;
}
.bd-rel-dist-tier-head span,
.bd-rel-dist-tier-head.secondary span {
    font-size: 12px;
    color: var(--bd-rel-c-muted, #6b7280);
}
.bd-rel-dist-tier-head.secondary {
    margin-top: 8px;
    padding-top: 12px;
    border-top: 1px solid #eef0f3;
}
.bd-rel-dist-grid {
    display: grid;
    gap: 9px;
}
.bd-rel-dist-grid.featured {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}
.bd-rel-dist-grid.compact {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 7px;
}
@media (max-width: 1199.98px) {
    .bd-rel-dist-grid.featured {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .bd-rel-dist-grid.compact {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}
@media (max-width: 767.98px) {
    .bd-rel-dist-grid.featured {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .bd-rel-dist-grid.compact {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
.bd-rel-dist-card {
    border: 1px solid #e6e8ec;
    border-radius: 10px;
    padding: 12px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
    min-width: 0;
}
.bd-rel-dist-card.featured {
    display: grid;
    grid-template-rows: auto 1fr auto;
    gap: 10px;
    min-height: 124px;
    padding: 14px 15px;
}
.bd-rel-dist-card.compact {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    min-height: 49px;
    padding: 7px 10px;
}
.bd-rel-dist-card.is-primary {
    border-color: rgba(76, 82, 188, 0.35);
    background: rgba(76, 82, 188, 0.04);
}
.bd-rel-dist-card.is-subject {
    border-color: #6ee7b7;
    background: linear-gradient(145deg, #ecfdf5, #ffffff);
    box-shadow: inset 3px 0 0 #10b981, 0 2px 8px rgba(5, 150, 105, 0.06);
}
.bd-rel-dist-card-head {
    display: flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
}
.bd-rel-dist-rank {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    border-radius: 6px;
    color: #4c52bc;
    background: rgba(76, 82, 188, 0.1);
    font-size: 12px;
    font-weight: 700;
}
.bd-rel-dist-card.is-subject .bd-rel-dist-rank {
    color: #047857;
    background: #d1fae5;
}
.bd-rel-dist-card.compact .bd-rel-dist-rank {
    width: 24px;
    height: 24px;
    font-size: 12px;
    color: #3a3a3a;
    background: #f1f3f5;
}
.bd-rel-dist-name {
    display: flex;
    align-items: center;
    gap: 5px;
    min-width: 0;
    flex-wrap: wrap;
}
.bd-rel-dist-name > span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #3a3a3a;
    font-size: 12px;
    font-weight: 700;
}
.bd-rel-dist-card.compact .bd-rel-dist-name > span {
    font-size: 11px;
}
.bd-rel-dist-name > em {
    flex: 0 0 auto;
    padding: 3px 8px;
    border-radius: 6px;
    background: rgba(16, 185, 129, 0.12);
    color: #047857;
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
}
.bd-rel-dist-card .bd-rel-dist-metrics {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 8px;
}
.bd-rel-dist-card .bd-rel-dist-metrics > span {
    display: grid;
    gap: 4px;
    min-width: 0;
    padding: 8px 9px;
    border: 1px solid #eef0f3;
    border-radius: var(--bd-rel-r, 8px);
    background: #f8f9fa;
}
.bd-rel-dist-card.is-subject .bd-rel-dist-metrics > span {
    border-color: #bbf7d0;
    background: rgba(236, 253, 245, 0.92);
}
.bd-rel-dist-card .bd-rel-dist-metrics small {
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: var(--bd-rel-fs-label, 11px);
    font-weight: 700;
    line-height: 1;
}
.bd-rel-dist-card .bd-rel-dist-metrics strong {
    color: #3a3a3a;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.1;
}
.bd-rel-dist-card .bd-rel-dist-metrics b {
    color: #4c52bc;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.1;
}
.bd-rel-dist-card.is-subject .bd-rel-dist-metrics b {
    color: #047857;
}
.bd-rel-dist-meter {
    overflow: hidden;
    height: 8px;
    border-radius: 999px;
    background: #eef1f5;
}
.bd-rel-dist-meter > i {
    display: block;
    min-width: 3px;
    height: 100%;
    border-radius: inherit;
    background: #4c52bc;
}
.bd-rel-dist-card:not(.is-subject):not(.is-primary) .bd-rel-dist-meter > i {
    background: #0d6efd;
}
.bd-rel-dist-card.is-subject .bd-rel-dist-meter > i {
    background: linear-gradient(90deg, #34d399, #059669);
}
.bd-rel-dist-compact-value {
    display: flex;
    align-items: baseline;
    gap: 4px;
    white-space: nowrap;
    flex: 0 0 auto;
}
.bd-rel-dist-compact-value strong {
    color: #3a3a3a;
    font-size: 12px;
    font-weight: 700;
}
.bd-rel-dist-compact-value span {
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 11px;
}
.bd-rel-dist-compact-value b {
    margin-left: 4px;
    color: #4c52bc;
    font-size: 12px;
    font-weight: 700;
}
.bd-rel-history-current {
    background: #f0faf3;
    outline: 1px solid #198754;
}
#bd_rel_view_loading {
    position: fixed;
    inset: 0;
    z-index: 1080;
    background: rgba(20, 24, 28, 0.28);
    display: flex;
    align-items: center;
    justify-content: center;
}
#bd_rel_view_loading.d-none {
    display: none !important;
}
.bd-rel-view-loading-card {
    background: #fff;
    border: 1px solid #d8dce1;
    min-width: 240px;
    max-width: 360px;
    padding: 20px 22px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    text-align: center;
}
.bd-rel-view-loading-card strong {
    font-size: 14px;
}
.bd-rel-score-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}
@media (min-width: 992px) {
    .bd-rel-score-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}
.bd-rel-score-card {
    border: 1px solid #e6e8ec;
    background: #fafbfc;
    padding: 10px 12px;
}
.bd-rel-score-card small {
    display: block;
    color: #909090 !important;
    font-size: 12px;
    margin-bottom: 8px;
    line-height: 1.4;
    font-weight: 400;
}
.bd-rel-score-card strong {
    display: block;
    margin-top: 2px;
    font-size: 16px;
    color: #3a3a3a;
    line-height: 1.35;
    font-weight: 700;
}
.bd-rel-chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.bd-rel-chip {
    border: 1px solid #e6e8ec;
    background: #fff;
    padding: 4px 8px;
    font-size: 12px;
    color: #374151;
}
.bd-rel-list-plain {
    margin: 0;
    padding-left: 1.1rem;
    font-size: 12px;
}
.bd-rel-list-plain li + li {
    margin-top: 4px;
}
.bd-rel-section-block + .bd-rel-section-block {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid #eef0f3;
}


/* 패널/섹션 헤더 구분선 (CLI에 있고 사이트에 없던 것만) */
#bd_rel_competitor_panel .bd-rel-comp-panel-head,
#bd_rel_ai_panel .bd-rel-ai-panel-head {
    box-shadow: inset 0 -1px 0 var(--bd-rel-divider, #eef0f3);
}
.bd-rel-ai-roadmap-head {
    padding-bottom: 8px;
    border-bottom: 1px solid var(--bd-rel-divider, #eef0f3);
}
.bd-rel-comp-deep-card header {
    padding-bottom: 8px;
    border-bottom: 1px solid var(--bd-rel-divider, #eef0f3);
}
.bd-rel-comp-campaign-head {
    padding-bottom: 10px;
    border-bottom: 1px solid #a7f3d0;
}
.bd-rel-topic-portfolio-head {
    padding-bottom: 8px;
    margin-bottom: 4px;
    border-bottom: 1px solid var(--bd-rel-divider, #eef0f3);
}
#blog_diagnosis_reliability_body .bd-rel-section-block + .bd-rel-section-block {
    margin-top: var(--bd-rel-space-section, 16px);
}

/* =============================================================================
 * 경쟁력 진단 (.bd-rel-comp-*) — CLI CompetitorAnalysisSection 패리티, 사이트 팔레트
 * 핵심: summary 4축 / primary 핵심결과 / deep-flow 6단계 / keyword 6열 구성 / 시장평균 점선
 * ============================================================================= */
.bd-rel-comp {
    font-size: 13px;
    color: #1f2933;
}
#bd_rel_competitor_panel .bd-rel-comp-panel-head {
    width: 100%;
    padding: 14px 16px;
    border: 1px solid #c9d4f0;
    border-radius: var(--bd-rel-comp-r, 8px);
    background: #f7f8ff;
}
#bd_rel_competitor_panel .bd-rel-comp-panel-head-copy > span {
    display: block;
    line-height: 1.35;
}
#bd_rel_competitor_panel .bd-rel-comp-panel-head-copy > small {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    line-height: 1.45;
    color: var(--bd-rel-c-muted, #6b7280) !important;
}
.bd-rel-comp-block {
    margin-top: 20px;
    padding: 18px 14px;
    border: 1px solid #e6e8ec;
    border-radius: var(--bd-rel-comp-r, 8px);
    background: #fff;
}
.bd-rel-comp-block:first-child { margin-top: 0; }
.bd-rel-comp-suite {
    border: 2px solid #c9d4f0;
    border-radius: var(--bd-rel-r-lg, 10px);
    background: #fafbff;
}
.bd-rel-comp-desc-section {
    border-color: #b8e0d4;
    background: #f7fcfa;
}
.bd-rel-comp-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: flex-start;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #e6e8ec;
}
.bd-rel-comp-suite > .bd-rel-comp-head { border-bottom-color: #d5dcf3; }
.bd-rel-comp-head-main { min-width: 0; flex: 1 1 auto; }
.bd-rel-comp-title-with-tip {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.bd-rel-comp-title-with-tip .bd-rel-comp-title { margin: 0; }
.bd-rel-comp-section-tip {
    position: relative;
    display: inline-grid;
    width: 18px;
    height: 18px;
    padding: 0;
    place-items: center;
    border: 1px solid #93c5fd;
    border-radius: 50%;
    color: #1d4ed8;
    background: #eff6ff;
    font-size: 11px;
    font-weight: 950;
    line-height: 1;
    cursor: help;
}
.bd-rel-comp-section-tooltip {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    z-index: 90;
    display: none;
    width: min(410px, 82vw);
    padding: 13px 14px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 10px;
    color: #fff;
    background: #0f172a;
    box-shadow: 0 16px 34px rgba(15, 23, 42, 0.35);
    font-size: 12px;
    font-weight: 650;
    line-height: 1.6;
    text-align: left;
    white-space: normal;
}
.bd-rel-comp-section-tip:hover .bd-rel-comp-section-tooltip,
.bd-rel-comp-section-tip:focus .bd-rel-comp-section-tooltip,
.bd-rel-comp-section-tip:focus-visible .bd-rel-comp-section-tooltip {
    display: block;
}
.bd-rel-comp-section-tooltip strong,
.bd-rel-comp-section-tooltip em,
.bd-rel-comp-section-tooltip b,
.bd-rel-comp-section-tooltip small {
    display: block;
    color: #fff;
    font-size: 12px;
    font-style: normal;
    letter-spacing: normal;
    text-align: left;
}
.bd-rel-comp-section-tooltip strong {
    margin-bottom: 7px;
    color: #93c5fd;
    font-size: 13px;
}
.bd-rel-comp-section-tooltip em,
.bd-rel-comp-section-tooltip b {
    margin-bottom: 7px;
    font-weight: 650;
    line-height: 1.6;
}
.bd-rel-comp-section-tooltip b { color: #ccfbf1; }
.bd-rel-comp-section-tooltip small {
    padding-top: 7px;
    border-top: 1px solid rgba(255, 255, 255, 0.17);
    color: #dbeafe;
    font-weight: 650;
    line-height: 1.6;
}
.bd-rel-comp-title-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px 28px;
}
.bd-rel-comp-title-row .bd-rel-comp-title,
.bd-rel-comp-title-row h3,
.bd-rel-comp-title-row h4 {
    flex: 0 0 auto;
    margin: 0;
}
.bd-rel-comp-title-row .bd-rel-comp-desc,
.bd-rel-comp-title-row > p {
    flex: 1 1 220px;
    margin: 0 !important;
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}
.bd-rel-comp-eyebrow {
    display: block;
    font-size: 11px;
    color: #4c52bc;
    font-weight: 700;
    margin-bottom: 6px;
    letter-spacing: 0.04em;
}
.bd-rel-comp-title, .bd-rel-comp-h4, .bd-rel-comp-block h3, .bd-rel-comp-block h4 {
    margin: 0;
    font-size: 15px;
    font-weight: 700;
    color: #1f2933;
    line-height: 1.4;
}
.bd-rel-comp-desc {
    margin: 8px 0 0;
    font-size: 12px;
    color: var(--bd-rel-c-muted, #6b7280);
    line-height: 1.55;
}
.bd-rel-comp-read-order {
    display: grid;
    gap: 4px;
    margin: 0 0 14px;
    padding: 12px 14px;
    border: 1px solid #c9d4f0;
    border-radius: var(--bd-rel-comp-r, 8px);
    background: #f0f3ff;
    font-size: 12px;
    color: #4b5563;
    line-height: 1.6;
}
.bd-rel-comp-read-order > b {
    color: #4c52bc;
    font-size: 12px;
}
.bd-rel-comp-read-order > p {
    margin: 0;
    color: #4b5563;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.6;
}
.bd-rel-comp-desc.is-inline {
    margin: 0;
    color: #4b5563;
    font-weight: 600;
}
.bd-rel-comp-desc-tag {
    flex: 0 0 auto;
    display: inline-block;
    padding: 3px 8px;
    border-radius: var(--bd-rel-comp-r-pill, 6px);
    background: #eef0ff;
    color: #4c52bc;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}
.bd-rel-comp-badge {
    flex: 0 0 auto;
    padding: 6px 10px;
    border: 1px solid #c9d4f0;
    border-radius: var(--bd-rel-comp-r-pill, 6px);
    background: #eef0ff;
    color: #4c52bc;
    font-size: 12px;
    font-weight: 700;
}
.bd-rel-comp-badge.is-high { border-color: #9fd4b0; background: #edf8f1; color: #1f7a3d; }
.bd-rel-comp-badge.is-low { border-color: #f0b4b4; background: #fff1f1; color: #b42318; }
.bd-rel-comp-inline-head {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}
.bd-rel-comp-side-note {
    flex: 0 0 auto;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 11px;
    font-weight: 700;
}
.bd-rel-comp-position-title {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: flex-start;
    margin-bottom: 12px;
}
.bd-rel-comp-position-title p { margin: 4px 0 0; font-size: 12px; color: var(--bd-rel-c-muted, #6b7280); }
.bd-rel-comp-position-title > strong {
    flex: 0 0 auto;
    padding: 8px 12px;
    border: 1px solid #c9d4f0;
    border-radius: var(--bd-rel-comp-r-pill, 6px);
    background: #eef2ff;
    color: #4c52bc;
    font-size: 13px;
}
.bd-rel-comp-levels {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}
.bd-rel-comp-ctype-levels,
.bd-rel-comp-levels-5 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (min-width: 768px) {
    .bd-rel-comp-ctype-levels,
    .bd-rel-comp-levels-5 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 992px) {
    .bd-rel-comp-levels { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .bd-rel-comp-ctype-levels,
    .bd-rel-comp-levels-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .bd-rel-comp-levels-6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 1400px) {
    .bd-rel-comp-levels-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}
.bd-rel-comp-level {
    position: relative;
    display: flex;
    gap: 8px;
    min-height: 96px;
    padding: 10px;
    border: 1px solid #e6e8ec;
    border-radius: var(--bd-rel-comp-r, 8px);
    background: #fafbfc;
}
.bd-rel-comp-level.is-active {
    border-color: #4c52bc;
    background: #f3f5ff;
    box-shadow: inset 0 0 0 1px #4c52bc;
}
.bd-rel-comp-ctype-levels .bd-rel-comp-level.is-active {
    border-color: #1f7a3d;
    background: #e8f6ee;
    box-shadow: inset 0 0 0 1px #1f7a3d;
}
.bd-rel-comp-level-ord {
    flex: 0 0 auto;
    display: grid;
    width: 27px;
    height: 27px;
    place-items: center;
    border-radius: var(--bd-rel-comp-r-sm, 6px);
    background: #eef0f3;
    font-size: 11px;
    font-weight: 800;
    color: #8a94a6;
}
.bd-rel-comp-level.is-active .bd-rel-comp-level-ord {
    background: #4c52bc;
    color: #fff;
}
.bd-rel-comp-ctype-levels .bd-rel-comp-level.is-active .bd-rel-comp-level-ord {
    background: #1f7a3d;
}
.bd-rel-comp-level-body strong { display: block; font-size: 12px; margin-bottom: 4px; }
.bd-rel-comp-level-body p { margin: 0; font-size: 11px; color: var(--bd-rel-c-muted, #6b7280); line-height: 1.4; }
.bd-rel-comp-level-badge {
    position: absolute;
    top: 6px;
    right: 6px;
    padding: 3px 7px;
    border-radius: var(--bd-rel-comp-r-pill, 6px);
    background: #4c52bc;
    color: #fff;
    font-size: var(--bd-rel-fs-label, 11px);
    font-weight: 700;
}
.bd-rel-comp-ctype-levels .bd-rel-comp-level-badge { background: #1f7a3d; }
.bd-rel-comp-desc-head {
    display: flex;
    flex-wrap: nowrap;
    align-items: baseline;
    gap: 10px;
    margin-bottom: 12px;
    padding: 11px 12px;
    border: 1px solid #cfe8de;
    border-radius: var(--bd-rel-comp-r, 8px);
    background: #fff;
}
.bd-rel-comp-desc-head em {
    flex: 0 0 auto;
    display: inline-block;
    margin: 0;
    padding: 4px 9px;
    border-radius: var(--bd-rel-comp-r-pill, 6px);
    background: #e8f6ee;
    color: #1f7a3d;
    font-style: normal;
    font-weight: 800;
    font-size: 12px;
    white-space: nowrap;
}
.bd-rel-comp-desc-head p {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
    font-size: 12px;
    color: #4b5563;
    line-height: 1.55;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.bd-rel-comp-desc-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 10px;
}
@media (min-width: 768px) {
    .bd-rel-comp-desc-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 1200px) {
    .bd-rel-comp-desc-metrics { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}
.bd-rel-comp-desc-metrics article {
    min-width: 0;
    padding: 10px;
    border: 1px solid #cfe8de;
    border-radius: var(--bd-rel-comp-r, 8px);
    background: #fff;
}
.bd-rel-comp-desc-metrics span {
    display: block;
    color: #4b5563;
    font-size: 11px;
    font-weight: 700;
}
.bd-rel-comp-desc-metrics strong {
    display: block;
    margin-top: 5px;
    color: #1f7a3d;
    font-size: 17px;
}
.bd-rel-comp-desc-metrics i {
    display: block;
    overflow: hidden;
    height: 5px;
    margin-top: 7px;
    border-radius: 999px;
    background: #e9edf3;
}
.bd-rel-comp-desc-metrics i b {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: #1f7a3d;
}
.bd-rel-comp-desc-metrics small {
    display: block;
    margin-top: 6px;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: var(--bd-rel-fs-label, 11px);
}
.bd-rel-comp-brief h3 { font-size: 16px; margin-bottom: 8px; }
.bd-rel-comp-brief p { margin: 0 0 6px; font-size: 13px; }
.bd-rel-comp-brief mark {
    padding: 0 4px;
    background: #eef0ff;
    color: #4c52bc;
    font-weight: 700;
}
.bd-rel-comp-brief small { color: var(--bd-rel-c-muted, #6b7280); font-size: 12px; }
.bd-rel-comp-summary-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 14px;
}
@media (min-width: 992px) {
    .bd-rel-comp-summary-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.bd-rel-comp-summary-card {
    padding: 14px;
    border: 1px solid #dbeafe;
    border-radius: var(--bd-rel-r-lg, 10px);
    background: rgba(255, 255, 255, 0.94);
}
.bd-rel-comp-summary-label {
    position: relative;
    display: flex;
    align-items: center;
    gap: 6px;
}
.bd-rel-comp-summary-label > span {
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: var(--bd-rel-fs-label, 11px);
    font-weight: 850;
}
.bd-rel-comp-summary-tip {
    position: relative;
    display: inline-grid;
    width: 18px;
    height: 18px;
    padding: 0;
    place-items: center;
    border: 1px solid #bae6fd;
    border-radius: 50%;
    color: #0369a1;
    background: #e0f2fe;
    font-size: 11px;
    font-weight: 950;
    line-height: 1;
    cursor: help;
}
.bd-rel-comp-summary-tooltip {
    position: absolute;
    top: calc(100% + 8px);
    left: -8px;
    z-index: 80;
    display: none;
    width: min(330px, 78vw);
    padding: 13px 14px;
    border: 1px solid #93c5fd;
    border-radius: 10px;
    color: #334155;
    background: #fff;
    box-shadow: 0 16px 34px rgba(15, 23, 42, 0.2);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.6;
    text-align: left;
    white-space: normal;
}
.bd-rel-comp-summary-card:nth-child(n+3) .bd-rel-comp-summary-tooltip {
    right: -8px;
    left: auto;
}
.bd-rel-comp-summary-tip:hover .bd-rel-comp-summary-tooltip,
.bd-rel-comp-summary-tip:focus .bd-rel-comp-summary-tooltip,
.bd-rel-comp-summary-tip:focus-visible .bd-rel-comp-summary-tooltip {
    display: block;
}
.bd-rel-comp-summary-tooltip strong {
    display: block;
    margin: 0;
    color: #1d4ed8;
    font-size: 12px;
}
.bd-rel-comp-summary-tooltip p {
    margin: 3px 0 10px;
    color: #475569;
    font-size: 12px;
    font-weight: 650;
    line-height: 1.6;
}
.bd-rel-comp-summary-tooltip p:last-child { margin-bottom: 0; }
.bd-rel-comp-summary-card > strong {
    display: block;
    margin-top: 5px;
    font-size: 21px;
    color: #312e81;
}
.bd-rel-comp-summary-card > small {
    display: block;
    margin-top: 6px;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 9.5px;
}
.bd-rel-comp-summary-card .bd-rel-comp-meter {
    height: 5px;
    margin-top: 14px;
    margin-bottom: 4px;
    border-radius: 999px;
    background: #e2e8f0;
    overflow: visible;
}
.bd-rel-comp-summary-card .bd-rel-comp-meter-fill {
    border-radius: inherit;
    background: linear-gradient(90deg, #6366f1, #06b6d4);
}
/* CLI competitor-summary-gauge: 검정 핀 + 삼각 캡 (주황 점선/필 라벨 아님) */
.bd-rel-comp-summary-card .bd-rel-comp-meter-bench {
    top: -5px;
    width: 2px;
    height: 15px;
    margin-left: -1px;
    border: 0;
    border-radius: 2px;
    background: #0f172a;
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.9);
    transform: none;
}
.bd-rel-comp-summary-card .bd-rel-comp-meter-bench::before {
    content: "";
    display: block;
    position: absolute;
    top: -4px;
    left: 50%;
    width: 0;
    height: 0;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
    border-top: 4px solid #0f172a;
    transform: translateX(-50%);
}
.bd-rel-comp-summary-card .bd-rel-comp-meter-bench em {
    display: none;
}
.bd-rel-comp-summary-avg {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 3px 7px;
    align-items: center;
    margin-top: 9px;
    padding-top: 8px;
    border-top: 1px dashed #cbd5e1;
    font-size: 11px;
}
.bd-rel-comp-summary-avg > span {
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: var(--bd-rel-fs-label, 11px);
    font-weight: 800;
}
.bd-rel-comp-summary-avg > b {
    color: #0f172a;
    font-size: 11.5px;
}
.bd-rel-comp-summary-avg em {
    grid-column: 1 / -1;
    width: fit-content;
    padding: 3px 6px;
    border-radius: 99px;
    font-size: 9.5px;
    font-style: normal;
    font-weight: 850;
}
.bd-rel-comp-summary-avg em.is-above {
    color: #047857;
    background: #d1fae5;
}
.bd-rel-comp-summary-avg em.is-below {
    color: #c2410c;
    background: #ffedd5;
}
.bd-rel-comp-cohort {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    margin-top: 9px;
    padding: 10px;
    border: 1px solid #c7d2fe;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.75);
}
@media (min-width: 768px) {
    .bd-rel-comp-cohort { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .bd-rel-comp-cohort > div:nth-child(3) { border-right: 0; }
}
@media (min-width: 1100px) {
    .bd-rel-comp-cohort { grid-template-columns: repeat(6, minmax(0, 1fr)); }
    .bd-rel-comp-cohort > div:nth-child(3) { border-right: 1px solid #e0e7ff; }
}
.bd-rel-comp-cohort > div {
    min-width: 0;
    padding: 7px 9px;
    border-right: 1px solid #e0e7ff;
}
.bd-rel-comp-cohort > div:last-child { border-right: 0; }
.bd-rel-comp-cohort span {
    display: block;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 11px;
    font-weight: 800;
    margin-bottom: 0;
}
.bd-rel-comp-cohort strong {
    display: block;
    overflow: hidden;
    margin-top: 4px;
    color: #3730a3;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.bd-rel-comp-meter {
    position: relative;
    height: 8px;
    margin-top: 6px;
    background: #e9edf3;
    overflow: visible;
}
.bd-rel-comp-meter-fill {
    display: block;
    height: 100%;
    background: #4c52bc;
}
.bd-rel-comp-meter-bench {
    position: absolute;
    top: -3px;
    width: 0;
    height: 14px;
    border-left: 2px dotted #d97706;
    transform: translateX(-1px);
}
.bd-rel-comp-meter-bench em {
    position: absolute;
    top: -16px;
    left: 50%;
    transform: translateX(-50%);
    padding: 1px 6px;
    border: 1px solid #f0c48a;
    background: #fff7ed;
    color: #b45309;
    font-size: var(--bd-rel-fs-label, 11px);
    font-style: normal;
    font-weight: 700;
    white-space: nowrap;
    line-height: 1.3;
}
.bd-rel-comp-mini-bars { display: grid; gap: 8px; margin-top: 10px; }
.bd-rel-comp-mini-bar {
    display: grid;
    grid-template-columns: 110px minmax(0, 1fr) 48px;
    gap: 8px;
    align-items: center;
}
.bd-rel-comp-mini-bar-label { font-size: 12px; color: #334155; font-weight: 800; }
.bd-rel-comp-mini-bar > strong { font-size: 12.5px; text-align: right; color: #4338ca; font-weight: 800; }
.bd-rel-comp-mini-bar > .bd-rel-comp-meter { margin-top: 0; }
.bd-rel-comp-mini-bar small {
    grid-column: 1 / -1;
    display: block;
    margin-top: -2px;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 11px;
}
.bd-rel-comp-scoreboard {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    margin-bottom: 14px;
}
.bd-rel-comp-pill {
    display: inline-flex;
    align-items: center;
    padding: 3px 9px;
    border-radius: var(--bd-rel-comp-r-pill, 6px);
    background: #4c52bc;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.3;
}
.bd-rel-comp-grade-badge,
.bd-rel-comp-stage-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 9px;
    border-radius: var(--bd-rel-comp-r-pill, 6px);
    background: #eef0f3;
    color: #4b5563;
    font-size: 11px;
    font-style: normal;
    font-weight: 800;
    white-space: nowrap;
    line-height: 1.3;
}
.bd-rel-comp-grade-badge.is-high,
.bd-rel-comp-stage-badge.is-high {
    color: #1f7a3d;
    background: #e8f6ee;
}
.bd-rel-comp-grade-badge.is-low,
.bd-rel-comp-stage-badge.is-low {
    color: #b42318;
    background: #fdecec;
}
.bd-rel-comp-grade-badge.is-mid,
.bd-rel-comp-stage-badge.is-mid {
    color: #9a6700;
    background: #fff7e8;
}
.bd-rel-comp-tone-badge {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: var(--bd-rel-comp-r-pill, 6px);
    background: #eef0ff;
    color: #4c52bc;
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}
.bd-rel-comp-deep-card.is-strong .bd-rel-comp-tone-badge {
    color: #1f7a3d;
    background: #e8f6ee;
}
.bd-rel-comp-deep-card.is-weak .bd-rel-comp-tone-badge {
    color: #9a6700;
    background: #fff7e8;
}
.bd-rel-comp-primary {
    padding: 16px 18px;
    border: 2px solid #c9d4f0;
    border-top-width: 4px;
    border-top-color: #4c52bc;
    border-radius: var(--bd-rel-comp-r, 8px);
    background: #fafbff;
}
.bd-rel-comp-primary.is-above {
    border-color: #9fd4b0;
    border-top-color: #1f7a3d;
}
.bd-rel-comp-primary.is-below {
    border-color: #f0b4b4;
    border-top-color: #b42318;
}
.bd-rel-comp-primary-top {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: start;
    margin-bottom: 14px;
}
.bd-rel-comp-primary-copy .bd-rel-comp-pill { margin-bottom: 6px; }
.bd-rel-comp-primary-copy h4 { margin: 4px 0; font-size: 16px; }
.bd-rel-comp-primary-copy p { margin: 0; font-size: 12px; color: #4b5563; }
.bd-rel-comp-primary-score {
    display: block;
    margin: 0;
    font-size: 34px;
    line-height: 1;
    color: #4c52bc;
    text-align: right;
}
.bd-rel-comp-primary .bd-rel-comp-meter { margin: 22px 0 10px; }
.bd-rel-comp-bench {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 14px;
    padding: 10px 12px;
    border: 1px solid #f0d9a8;
    border-radius: var(--bd-rel-comp-r-sm, 6px);
    background: #fffaf0;
    font-size: 12px;
}
.bd-rel-comp-bench-copy {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
    align-items: baseline;
    min-width: 0;
}
.bd-rel-comp-bench-copy span { color: #4b5563; }
.bd-rel-comp-bench-copy strong { color: #1f2933; }
.bd-rel-comp-bench-copy b { color: #4c52bc; font-weight: 800; }
.bd-rel-comp-bench.is-below .bd-rel-comp-bench-copy b { color: #b42318; }
.bd-rel-comp-bench.is-above .bd-rel-comp-bench-copy b { color: #1f7a3d; }
.bd-rel-comp-support-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
}
.bd-rel-comp-support-grid::before {
    grid-column: 1 / -1;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 11px;
    font-weight: 700;
    content: "시장 노출 경쟁력의 검증 기반 수치";
}
@media (min-width: 992px) {
    .bd-rel-comp-support-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.bd-rel-comp-support-grid article {
    padding: 11px 12px;
    border: 1px solid #e6e8ec;
    border-top: 2px solid #4c52bc;
    border-radius: var(--bd-rel-comp-r, 8px);
    background: #fafbfc;
}
.bd-rel-comp-support-grid span { display: block; font-size: 11px; color: var(--bd-rel-c-muted, #6b7280); }
.bd-rel-comp-support-grid strong { display: block; margin: 4px 0; font-size: 18px; }
.bd-rel-comp-support-grid small { color: var(--bd-rel-c-muted, #6b7280); font-size: 11px; }
.bd-rel-comp-support-grid .is-penalized { border-color: #f0b4b4; border-top-color: #dc3545; background: #fff8f8; }
.bd-rel-comp-result-analysis {
    margin: 12px 0;
    overflow: hidden;
    border: 1px solid #c9d4f0;
    border-radius: var(--bd-rel-comp-r, 8px);
    background: #fff;
}
.bd-rel-comp-result-analysis header {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    margin: 0;
    padding: 12px 14px;
    background: #eef0ff;
}
.bd-rel-comp-result-analysis header span {
    display: inline-block;
    color: #4c52bc;
    font-size: 12px;
    font-weight: 800;
}
.bd-rel-comp-result-analysis header strong {
    color: #1f2933;
    font-size: 14px;
    line-height: 1.45;
}
.bd-rel-comp-result-body {
    display: grid;
    gap: 8px;
    padding: 14px;
}
.bd-rel-comp-result-body p {
    position: relative;
    margin: 0;
    padding-left: 14px;
    font-size: 12px;
    color: #374151;
    line-height: 1.7;
}
.bd-rel-comp-result-body p::before {
    content: "";
    position: absolute;
    top: 0.65em;
    left: 0;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #4c52bc;
}
.bd-rel-comp-result-analysis .bd-rel-comp-foot {
    margin: 0 14px 14px;
    padding: 10px 12px;
    border-left: 4px solid #1f7a3d;
    border-radius: var(--bd-rel-comp-r-sm, 6px);
    background: #eef8f1;
}
.bd-rel-comp-result-analysis .bd-rel-comp-foot b {
    display: block;
    margin-bottom: 4px;
    color: #1f7a3d;
    font-size: 12px;
}
.bd-rel-comp-result-analysis .bd-rel-comp-foot p {
    margin: 0;
    font-size: 12px;
    color: #374151;
    line-height: 1.6;
}
.bd-rel-comp-deep-card .bd-rel-comp-foot,
.bd-rel-comp-product-grid .bd-rel-comp-foot {
    margin-top: 8px;
    font-size: 12px;
    color: #4b5563;
}
.bd-rel-comp-flow {
    --bd-rel-flow-n: 6;
    display: grid;
    grid-template-columns: repeat(calc(var(--bd-rel-flow-n) - 1), minmax(0, 1fr) 22px) minmax(0, 1fr);
    align-items: center;
    gap: 4px;
    margin: 14px 0;
}
.bd-rel-comp-flow article {
    display: flex;
    gap: 7px;
    align-items: center;
    min-height: 48px;
    min-width: 0;
    padding: 8px 10px;
    border: 1px solid #d9dff5;
    border-radius: var(--bd-rel-comp-r, 8px);
    background: #fff;
}
.bd-rel-comp-flow article span {
    display: grid;
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    place-items: center;
    border-radius: var(--bd-rel-comp-r-sm, 6px);
    background: #4c52bc;
    color: #fff;
    font-size: var(--bd-rel-fs-label, 11px);
    font-weight: 800;
}
.bd-rel-comp-flow article strong {
    min-width: 0;
    color: #374151;
    font-size: 12px;
    line-height: 1.35;
}
.bd-rel-comp-flow > i {
    display: grid;
    place-items: center;
    width: 22px;
    height: 28px;
    border-radius: 999px;
    background: #eef0ff;
    color: #4c52bc;
    font-size: 15px;
    font-style: normal;
    font-weight: 900;
    text-align: center;
    line-height: 1;
    box-shadow: inset 0 0 0 1px #c9d0ef;
}
@media (max-width: 991.98px) {
    .bd-rel-comp-flow {
        grid-template-columns: 1fr;
        gap: 6px;
    }
    .bd-rel-comp-flow > i {
        transform: rotate(90deg);
        font-size: 14px;
    }
}
.bd-rel-comp-val-grid, .bd-rel-comp-lower, .bd-rel-comp-deep-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 12px;
}
.bd-rel-comp-val-grid > article, .bd-rel-comp-lower > article {
    padding: 12px 14px;
    border: 1px solid #e6e8ec;
    border-radius: var(--bd-rel-comp-r, 8px);
    background: #fff;
}
.bd-rel-comp-val-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between;
    gap: 12px;
    margin: 0 0 10px;
    padding: 0;
    border: 0;
    background: transparent;
}
.bd-rel-comp-val-copy {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px 24px;
    min-width: 0;
    flex: 1 1 auto;
}
.bd-rel-comp-val-copy > span {
    flex: 0 0 auto;
    font-size: 14px;
    font-weight: 700;
    color: #1f2933;
    white-space: nowrap;
}
.bd-rel-comp-val-copy > p {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 !important;
    min-width: 0;
    flex: 1 1 180px;
    font-size: 12.5px;
    color: #334155;
    font-weight: 600;
    line-height: 1.5;
}
.bd-rel-comp-val-copy > p .bd-rel-comp-desc-tag {
    font-weight: 800;
}
.bd-rel-comp-val-header > strong {
    flex: 0 0 auto;
    min-width: 56px;
    padding: 4px 10px;
    border: 1px solid #c9d4f0;
    background: #fff;
    color: #4c52bc;
    font-size: 16px;
    font-weight: 700;
    text-align: center;
}
/* CLI competitor-validation-guide 패리티: 라벨/본문 2열 + 상태·활용 색 구분 */
.bd-rel-comp-guide {
    display: grid;
    gap: 7px;
    margin: 10px 0 12px;
    padding: 11px 12px;
    border: 1px solid #e2e8f0;
    border-radius: var(--bd-rel-r, 8px);
    background: #f8fafc;
}
.bd-rel-comp-guide p {
    display: grid !important;
    grid-template-columns: 88px minmax(0, 1fr);
    gap: 9px;
    align-items: start;
    margin: 0 !important;
    padding: 8px 10px;
    border-radius: var(--bd-rel-r-sm, 6px);
    font-size: 12.5px !important;
    font-weight: 600 !important;
    line-height: 1.65 !important;
    color: #334155 !important;
}
.bd-rel-comp-guide p > b {
    display: block;
    margin: 0;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1.45;
    white-space: nowrap;
}
.bd-rel-comp-guide p > span {
    min-width: 0;
    color: inherit;
    font-weight: 600 !important;
    word-break: keep-all;
}
.bd-rel-comp-guide p.is-state {
    border: 1px solid #a7f3d0;
    background: #ecfdf5;
    color: #0f5132 !important;
}
.bd-rel-comp-guide p.is-state > b { color: #047857 !important; }
.bd-rel-comp-guide p.is-use {
    border: 1px solid #fde68a;
    background: #fffbeb;
    color: #78350f !important;
}
.bd-rel-comp-guide p.is-use > b { color: #b45309 !important; }
@media (max-width: 680px) {
    .bd-rel-comp-guide p {
        grid-template-columns: 1fr;
        gap: 4px;
    }
}
.bd-rel-comp-facts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 10px;
}
.bd-rel-comp-facts span {
    padding: 10px 8px;
    border: 1px solid #e2e8f0;
    border-radius: var(--bd-rel-r-sm, 6px);
    background: #f8fafc;
    font-size: var(--bd-rel-fs-label, 11px);
    font-weight: 700;
    text-align: center;
    color: var(--bd-rel-c-muted, #6b7280);
    line-height: 1.4;
}
.bd-rel-comp-facts b {
    display: block;
    margin-top: 4px;
    color: #b45309;
    font-size: 13.5px;
    font-weight: 800;
}
.bd-rel-comp-state {
    display: inline-block;
    margin-bottom: 6px;
    padding: 2px 6px;
    background: #eef0ff;
    color: #4c52bc;
    font-size: 11px;
}
.bd-rel-comp-topic-table { margin-top: 8px; width: 100%; overflow-x: auto; }
.bd-rel-comp-topic-head, .bd-rel-comp-topic-row, .bd-rel-comp-kw-head, .bd-rel-comp-kw-row {
    display: grid;
    gap: 8px;
    align-items: center;
    font-size: 12px;
}
.bd-rel-comp-topic-head, .bd-rel-comp-kw-head {
    padding: 10px 8px;
    color: rgb(55, 55, 55);
    background: rgb(235, 235, 235);
    font-weight: 700;
    font-size: 12px;
}
.bd-rel-comp-topic-table-5 .bd-rel-comp-topic-head,
.bd-rel-comp-topic-table-5 .bd-rel-comp-topic-row {
    grid-template-columns: minmax(90px, 1.4fr) 56px 64px 64px minmax(120px, 1.2fr);
}
.bd-rel-comp-topic-table-6 .bd-rel-comp-topic-head,
.bd-rel-comp-topic-table-6 .bd-rel-comp-topic-row {
    grid-template-columns: 48px minmax(90px, 1.3fr) 56px 56px 72px minmax(80px, 1fr);
}
.bd-rel-comp-topic-row, .bd-rel-comp-kw-row {
    padding: 8px;
    border-bottom: 1px solid #f3f4f6;
}
.bd-rel-comp-topic-row > .text-center,
.bd-rel-comp-topic-head > .text-center {
    text-align: center;
}
.bd-rel-comp-kw-table { width: 100%; overflow-x: auto; }
.bd-rel-comp-kw-head, .bd-rel-comp-kw-row {
    grid-template-columns: minmax(150px, 1.45fr) 88px minmax(110px, 0.9fr) 84px;
    min-width: 460px;
}
.bd-rel-comp-kw-term {
    display: grid;
    grid-template-columns: 26px minmax(0, 1fr);
    column-gap: 8px;
    align-items: center;
}
.bd-rel-comp-kw-term > b {
    grid-row: 1 / span 2;
    display: grid;
    width: 24px;
    height: 24px;
    place-items: center;
    background: #eef0ff;
    color: #4c52bc;
    font-size: 11px;
    font-weight: 700;
}
.bd-rel-comp-kw-term > strong {
    overflow: hidden;
    color: #1f2933;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.bd-rel-comp-kw-term > small {
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 11px;
}
.bd-rel-comp-kw-intent {
    display: inline-flex;
    justify-self: center;
    align-items: center;
    justify-content: center;
    padding: 4px 8px;
    border-radius: 999px;
    background: #f5f7fa;
    color: #4b5563;
    font-size: 11px;
    font-style: normal;
    font-weight: 700;
    text-align: center;
    line-height: 1.25;
}
.bd-rel-comp-kw-meter, .bd-rel-comp-topic-row > span:last-child {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 6px;
    align-items: center;
}
.bd-rel-comp-kw-meter > strong {
    color: #4c52bc;
    font-size: 12px;
    text-align: right;
    min-width: 42px;
}
.bd-rel-comp-kw-opp {
    display: grid;
    justify-items: end;
    text-align: right;
    gap: 2px;
}
.bd-rel-comp-kw-opp strong { color: #1f7a3d; font-size: 13px; }
.bd-rel-comp-kw-opp.is-warn strong { color: #b42318; }
.bd-rel-comp-kw-opp-badge {
    display: inline-block;
    padding: 1px 6px;
    border-radius: 999px;
    background: #edf8f1;
    color: #1f7a3d;
    font-size: var(--bd-rel-fs-label, 11px);
    font-weight: 700;
}
.bd-rel-comp-kw-opp.is-warn .bd-rel-comp-kw-opp-badge {
    background: #fff1f1;
    color: #b42318;
}
.bd-rel-comp-kw-opp:not(.is-hot):not(.is-warn) .bd-rel-comp-kw-opp-badge {
    background: #f5f7fa;
    color: var(--bd-rel-c-muted, #6b7280);
}
.bd-rel-comp-kw-head > .text-center { text-align: center; }
.bd-rel-comp-kw-head > .text-end { text-align: right; }
.bd-rel-comp-roadmap-sum {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin: 12px 0;
}
.bd-rel-comp-roadmap-sum article {
    padding: 10px;
    border: 1px solid #e6e8ec;
    border-radius: var(--bd-rel-comp-r, 8px);
    background: #fafbfc;
}
.bd-rel-comp-roadmap-sum span { display: block; font-size: 11px; color: var(--bd-rel-c-muted, #6b7280); }
.bd-rel-comp-roadmap-sum strong { display: block; margin: 4px 0; font-size: 14px; }
.bd-rel-comp-roadmap-sum small { color: var(--bd-rel-c-muted, #6b7280); }
.bd-rel-comp-roadmap-sum .is-strong { border-color: #9fd4b0; background: #edf8f1; }
.bd-rel-comp-roadmap-sum .is-weak { border-color: #f0c48a; background: #fff8ef; }
.bd-rel-comp-deep-flow {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin: 14px 0 12px;
    padding: 11px;
    border: 1px solid #e6e8ec;
    background: #fafbfc;
}
@media (min-width: 992px) {
    .bd-rel-comp-deep-flow { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 1400px) {
    .bd-rel-comp-deep-flow { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}
.bd-rel-comp-deep-flow > div {
    position: relative;
    display: grid;
    grid-template-columns: 27px minmax(0, 1fr) auto;
    gap: 5px;
    align-items: center;
    min-width: 0;
    padding: 8px;
    border: 1px solid #e6e8ec;
    background: rgba(255, 255, 255, 0.92);
}
.bd-rel-comp-deep-flow > div:not(:last-child)::after {
    content: none;
}
@media (min-width: 1400px) {
    .bd-rel-comp-deep-flow > div:not(:last-child)::after {
        content: "›";
        position: absolute;
        z-index: 2;
        top: 50%;
        right: -9px;
        color: #4c52bc;
        font-size: 18px;
        font-weight: 900;
        transform: translateY(-52%);
        line-height: 1;
    }
}
.bd-rel-comp-deep-flow span {
    display: grid;
    width: 25px;
    height: 25px;
    place-items: center;
    background: #4c52bc;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
}
.bd-rel-comp-deep-flow strong {
    grid-column: 2 / -1;
    overflow: hidden;
    color: #374151;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.bd-rel-comp-deep-flow em {
    grid-column: 3;
    color: #4c52bc;
    font-size: 11px;
    font-style: normal;
    font-weight: 800;
    white-space: nowrap;
}
.bd-rel-comp-deep-flow i {
    grid-column: 2;
    display: block;
    overflow: hidden;
    height: 4px;
    background: #e9edf3;
}
.bd-rel-comp-deep-flow i b {
    display: block;
    height: 100%;
    background: #4c52bc;
}
.bd-rel-comp-deep-card {
    padding: 12px;
    border: 1px solid #e6e8ec;
    border-radius: var(--bd-rel-comp-r, 8px);
    background: #fff;
}
.bd-rel-comp-deep-card.is-strong { border-color: #9fd4b0; }
.bd-rel-comp-deep-card.is-weak { border-color: #f0c48a; }
.bd-rel-comp-deep-card header {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 8px;
    margin-bottom: 10px;
}
.bd-rel-comp-deep-card header small { display: block; color: var(--bd-rel-c-muted, #6b7280); font-size: 11px; }
.bd-rel-comp-stage-meaning {
    /* 전역 footer{position:fixed} 가 카드 내 footer 태그에 먹히지 않도록 고정 해제 */
    position: static !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    z-index: auto !important;
    display: grid;
    grid-template-columns: minmax(128px, 168px) minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    margin: 0 0 12px;
    padding: 11px 13px;
    border-left: 4px solid #14b8a6;
    background: #f0fdfa;
    color: #334155;
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.65;
}
.bd-rel-comp-stage-meaning b {
    color: #0f766e;
    font-size: 12.5px;
    font-weight: 800;
}
.bd-rel-comp-stage-meaning span {
    color: #334155;
    font-weight: 600;
}
.bd-rel-comp-score-line {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr) 48px;
    gap: 8px;
    align-items: center;
    margin-top: 10px;
}
.bd-rel-comp-score-line > span {
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 11px;
    font-weight: 700;
}
.bd-rel-comp-score-line > i {
    display: block;
    overflow: hidden;
    height: 8px;
    background: #e9edf3;
}
.bd-rel-comp-score-line > i b {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #4c52bc, #2a9d8f);
}
.bd-rel-comp-score-line > strong {
    color: #4c52bc;
    font-size: 12px;
    text-align: right;
}
.bd-rel-comp-deep-body {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 12px;
    align-items: start;
}
#bd_rel_competitor_panel .bd-rel-comp-panel-actions .btn {
    white-space: nowrap;
}
.bd-rel-comp-ring, .bd-rel-comp-ring-card {
    --bd-rel-ring: 0deg;
    width: 108px;
    height: 108px;
    border-radius: 50%;
    background: conic-gradient(#4c52bc var(--bd-rel-ring), #e9edf3 0);
    display: grid;
    place-items: center;
}
.bd-rel-comp-ring > div, .bd-rel-comp-ring-card > div {
    width: 84px;
    height: 84px;
    border-radius: 50%;
    background: #fff;
    display: grid;
    place-content: center;
    text-align: center;
    gap: 2px;
    padding: 6px 8px;
    line-height: 1.2;
    box-sizing: border-box;
}
.bd-rel-comp-ring strong, .bd-rel-comp-ring-card strong { font-size: 17px; }
.bd-rel-comp-ring small, .bd-rel-comp-ring-card span, .bd-rel-comp-ring-card b {
    font-size: var(--bd-rel-fs-label, 11px);
    color: var(--bd-rel-c-muted, #6b7280);
    line-height: 1.25;
}
/* CLI competitor-evidence-chips 패리티: 인디고 강조 + 여유 패딩 + bold */
.bd-rel-comp-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 10px;
}
.bd-rel-comp-chips span {
    display: inline-flex;
    align-items: center;
    padding: 6px 10px;
    border: 1px solid #e0e7ff;
    border-radius: 999px;
    background: #f5f7ff;
    color: #4338ca;
    font-size: 11.5px;
    font-weight: 800;
    line-height: 1.35;
    letter-spacing: -0.01em;
    white-space: nowrap;
}
.bd-rel-comp-deep-body > div > p {
    margin: 11px 0 0;
    color: #334155;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.72;
}
.bd-rel-comp-pattern {
    margin-top: 14px;
    padding: 14px;
    border: 1px solid #f0c48a;
    border-radius: var(--bd-rel-comp-r, 8px);
    background: #fffaf3;
}
.bd-rel-comp-pattern header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 12px;
}
.bd-rel-comp-pattern header h3 { margin: 0; font-size: 15px; }
.bd-rel-comp-pattern header p {
    margin: 5px 0 0;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 12px;
    line-height: 1.5;
}
.bd-rel-comp-pattern-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}
@media (min-width: 768px) {
    .bd-rel-comp-pattern-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.bd-rel-comp-pattern-grid > div,
.bd-rel-comp-kw-overview article {
    padding: 12px 10px;
    border: 1px solid #bfdbfe;
    border-radius: var(--bd-rel-r, 8px);
    background: #fff;
    text-align: center;
}
.bd-rel-comp-pattern-grid span,
.bd-rel-comp-kw-overview span {
    display: block;
    font-size: var(--bd-rel-fs-label, 11px);
    color: var(--bd-rel-c-muted, #6b7280);
    font-weight: 800;
}
.bd-rel-comp-pattern-grid strong,
.bd-rel-comp-kw-overview strong {
    display: block;
    overflow: hidden;
    margin: 6px 0 4px;
    color: #1e3a8a;
    font-size: 18px;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.bd-rel-comp-pattern-grid small,
.bd-rel-comp-kw-overview small {
    display: block;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: var(--bd-rel-fs-label, 11px);
}
.bd-rel-comp-kw-overview {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin: 12px 0;
}
@media (min-width: 992px) {
    .bd-rel-comp-kw-overview { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.bd-rel-comp-kw-components {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 12px;
}
@media (min-width: 768px) {
    .bd-rel-comp-kw-components { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 1200px) {
    .bd-rel-comp-kw-components { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}
.bd-rel-comp-kw-components article {
    min-width: 0;
    padding: 11px;
    border: 1px solid #bfdbfe;
    border-radius: var(--bd-rel-r, 8px);
    background: rgba(255, 255, 255, 0.94);
}
.bd-rel-comp-kw-components span {
    display: block;
    overflow: hidden;
    font-size: 11px;
    color: #475569;
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.bd-rel-comp-kw-components strong {
    display: block;
    margin-top: 5px;
    font-size: 18px;
    color: #1d4ed8;
}
.bd-rel-comp-kw-components i {
    display: block;
    overflow: hidden;
    height: 6px;
    margin-top: 7px;
    border-radius: 999px;
    background: #dbeafe;
}
.bd-rel-comp-kw-components i b {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #2563eb, #06b6d4);
}
.bd-rel-comp-kw-components small {
    display: block;
    margin-top: 6px;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: var(--bd-rel-fs-label, 11px);
}
.bd-rel-comp-intent, .bd-rel-comp-card, .bd-rel-comp-kw-op {
    margin-top: 12px;
    padding: 14px;
    border: 1px solid #bfdbfe;
    border-radius: var(--bd-rel-r-lg, 10px);
    background: #fff;
}
.bd-rel-comp-intent header, .bd-rel-comp-card header, .bd-rel-comp-kw-op header {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 10px;
}
.bd-rel-comp-intent-bars { display: grid; gap: 6px; }
.bd-rel-comp-intent-bars > div {
    display: grid;
    grid-template-columns: 90px 1fr auto;
    gap: 8px;
    align-items: center;
    font-size: 12px;
}
.bd-rel-comp-intent-bars i {
    display: block;
    height: 8px;
    background: #e9edf3;
}
.bd-rel-comp-intent-bars b {
    display: block;
    height: 100%;
    background: #4c52bc;
}
.bd-rel-comp-kw-op-flow {
    display: grid;
    grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr auto 1fr;
    align-items: stretch;
    gap: 8px;
}
.bd-rel-comp-kw-op-flow > article {
    min-width: 0;
    padding: 12px 10px;
    border: 1px solid #d9dff5;
    border-radius: var(--bd-rel-comp-r, 8px);
    background: rgba(255, 255, 255, 0.92);
    text-align: center;
}
.bd-rel-comp-kw-op-flow > article > span {
    display: block;
    margin-bottom: 7px;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 12px;
    font-weight: 700;
}
.bd-rel-comp-kw-op-flow > article > strong {
    color: #4c52bc;
    font-size: 20px;
    line-height: 1.1;
}
.bd-rel-comp-kw-op-flow > article > strong small {
    margin-left: 2px;
    font-size: 11px;
}
.bd-rel-comp-kw-op-flow > article > p {
    margin: 7px 0 0;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 11px;
}
.bd-rel-comp-kw-op-flow > i {
    align-self: center;
    display: grid;
    place-items: center;
    width: 26px;
    height: 26px;
    border-radius: 999px;
    background: #eef0ff;
    color: #4c52bc;
    font-size: 15px;
    font-style: normal;
    font-weight: 900;
    text-align: center;
    line-height: 1;
    box-shadow: inset 0 0 0 1px #c9d0ef;
}
@media (max-width: 991.98px) {
    .bd-rel-comp-kw-op-flow {
        grid-template-columns: repeat(5, minmax(120px, 1fr));
        overflow-x: auto;
    }
    .bd-rel-comp-kw-op-flow > i { display: none; }
}
.bd-rel-comp-kw-op-conclusion {
    margin-top: 14px;
    overflow: hidden;
    border: 1px solid #c9d4f0;
    border-radius: var(--bd-rel-comp-r, 8px);
    background: #fff;
}
.bd-rel-comp-kw-op-conclusion-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 16px;
    background: #4c52bc;
    color: #fff;
}
.bd-rel-comp-kw-op-conclusion-head strong {
    color: #fff;
    font-size: 14px;
    font-weight: 800;
}
.bd-rel-comp-kw-op-conclusion-head span {
    color: rgba(255, 255, 255, 0.85);
    font-size: 11px;
    font-weight: 600;
    text-align: right;
    margin-left: auto;
}
.bd-rel-comp-kw-op-conclusion-copy {
    padding: 16px 18px;
    background: #f7f8ff;
}
.bd-rel-comp-kw-op-conclusion-copy > .bd-rel-comp-grade-badge {
    margin-bottom: 8px;
}
.bd-rel-comp-kw-op-conclusion-copy p {
    margin: 0;
    color: #374151;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.7;
}
.bd-rel-comp-kw-support {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 14px;
}
@media (min-width: 992px) {
    .bd-rel-comp-kw-support { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.bd-rel-comp-kw-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 4px;
}
.bd-rel-comp-kw-cloud > span {
    padding: 5px 9px;
    border: 1px solid #e6e8ec;
    border-radius: var(--bd-rel-comp-r-pill, 6px);
    background: #f7f8fb;
    color: #4b5563;
    font-size: 12px;
    font-weight: 700;
}
.bd-rel-comp-kw-cloud > span.is-hot {
    border-color: #c9d4f0;
    background: #eef0ff;
    color: #4c52bc;
}
.bd-rel-comp-kw-cloud b {
    margin-left: 5px;
    color: #4c52bc;
}
.bd-rel-comp-structure-bars { display: grid; gap: 8px; }
.bd-rel-comp-structure-bars > div {
    display: grid;
    grid-template-columns: 70px minmax(0, 1fr) 110px;
    gap: 8px;
    align-items: center;
    font-size: 12px;
}
.bd-rel-comp-structure-bars i {
    display: block;
    overflow: hidden;
    height: var(--bd-rel-progress-h, 8px);
    border-radius: 999px;
    background: #e9edf3;
}
.bd-rel-comp-structure-bars i b {
    display: block;
    height: 100%;
    background: #4c52bc;
}
.bd-rel-comp-structure-bars strong {
    text-align: right;
    color: #4c52bc;
    font-size: 12px;
}
.bd-rel-comp-kw-guide {
    margin: 12px 0 0;
    padding: 10px 12px;
    border-left: 3px solid #4c52bc;
    border-radius: var(--bd-rel-comp-r-sm, 6px);
    background: #f0f3ff;
    color: #4b5563;
    font-size: 12px;
    line-height: 1.55;
}
.bd-rel-comp-final-head {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 12px;
    align-items: start;
    margin-bottom: 12px;
}
.bd-rel-comp-final-head > strong {
    display: grid;
    min-width: 72px;
    min-height: 48px;
    place-items: center;
    padding: 8px 12px;
    border-radius: var(--bd-rel-r-lg, 10px);
    background: #4c52bc;
    color: #fff;
    font-size: 15px;
    font-weight: 900;
}
.bd-rel-comp-final-head h3 { margin: 0; font-size: 17px; line-height: 1.35; }
.bd-rel-comp-final-head .bd-rel-comp-desc { margin: 6px 0 0; }
.bd-rel-comp-verdict {
    padding: 14px 16px;
    border: 1px solid #d7dce3;
    border-left: 4px solid #4c52bc;
    background: #f8f9fc;
    margin-bottom: 12px;
}
.bd-rel-comp-verdict span { font-size: 11px; color: #4c52bc; font-weight: 800; }
.bd-rel-comp-verdict h4 { margin: 6px 0; font-size: 16px; }
.bd-rel-comp-verdict p { margin: 0 0 8px; font-size: 12px; color: #4b5563; }
.bd-rel-comp-verdict > strong {
    display: block;
    margin-top: 8px;
    padding: 8px 10px;
    background: #eef8f1;
    color: #1f7a3d;
    font-size: 12px;
    line-height: 1.55;
}
.bd-rel-comp-final-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 12px;
}
.bd-rel-comp-bench-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 12px;
}
.bd-rel-comp-quick-read {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 12px;
}
.bd-rel-comp-final-metrics article,
.bd-rel-comp-bench-grid article,
.bd-rel-comp-quick-read article {
    padding: 12px;
    border: 1px solid #e6e8ec;
    background: #fff;
}
.bd-rel-comp-final-metrics article.is-low { border-color: #f0b4b4; background: #fff8f8; }
.bd-rel-comp-final-metrics article > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
.bd-rel-comp-final-metrics article > strong {
    display: block;
    margin-top: 8px;
    font-size: 22px;
    color: #4c52bc;
}
.bd-rel-comp-final-metrics article p {
    margin: 8px 0 0;
    font-size: 11px;
    color: var(--bd-rel-c-muted, #6b7280);
    line-height: 1.5;
}
.bd-rel-comp-bench-grid .is-learn { border-top: 3px solid #4c52bc; }
.bd-rel-comp-bench-grid .is-opp { border-top: 3px solid #1f7a3d; }
.bd-rel-comp-bench-grid .is-avoid { border-top: 3px solid #b42318; }
.bd-rel-comp-bench-grid ul { margin: 8px 0 0; padding-left: 1.1rem; font-size: 12px; }
.bd-rel-comp-quick-read article { display: grid; grid-template-columns: auto 1fr; gap: 8px; }
.bd-rel-comp-quick-read article > span {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    border-radius: 8px;
    background: #4c52bc;
    color: #fff;
    font-size: 11px;
    font-weight: 900;
}
.bd-rel-comp-quick-read strong { font-size: 12px; }
.bd-rel-comp-quick-read p { margin: 4px 0 0; font-size: 11.5px; color: var(--bd-rel-c-muted, #6b7280); line-height: 1.55; }
.bd-rel-comp-campaign-head {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 12px;
    margin-bottom: 12px;
}
.bd-rel-comp-campaign-head > strong {
    display: grid;
    min-width: 72px;
    min-height: 48px;
    place-items: center;
    padding: 8px 12px;
    border-radius: var(--bd-rel-r-lg, 10px);
    background: #1f7a3d;
    color: #fff;
    font-size: 14px;
    font-weight: 900;
}
.bd-rel-comp-campaign-head h3 { margin: 0; font-size: 17px; }
.bd-rel-comp-campaign-gauge-frame {
    margin-bottom: 12px;
    padding: 14px;
    border: 1px solid #d7dce3;
    background: #fafbfc;
}
.bd-rel-comp-campaign-gauges {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    justify-items: center;
}
@media (min-width: 768px) {
    .bd-rel-comp-campaign-gauges { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.bd-rel-comp-ring-card { width: 132px; height: 132px; }
.bd-rel-comp-ring-card > div { width: 104px; height: 104px; }
.bd-rel-comp-ring-card span {
    font-size: 10px;
    font-weight: 700;
    max-width: 100%;
    padding: 0 2px;
}
.bd-rel-comp-ring-card b {
    font-size: 11px;
    font-weight: 700;
}
.bd-rel-comp-ring-card.is-rejected {
    background: conic-gradient(#b42318 var(--bd-rel-ring), #e9edf3 0);
}
.bd-rel-comp-campaign-ops {
    display: grid;
    grid-template-columns: auto repeat(3, minmax(0, 1fr));
    gap: 8px 12px;
    align-items: center;
    margin-bottom: 10px;
    padding: 12px;
    border: 1px solid #e6e8ec;
    background: #fff8eb;
    font-size: 12px;
}
.bd-rel-comp-campaign-ops.is-dead { background: #fff5f5; border-color: #f0b4b4; }
.bd-rel-comp-campaign-ops > small {
    grid-column: 1 / -1;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 11px;
}
.bd-rel-comp-campaign-summary { font-size: 13px; margin-bottom: 10px; }
.bd-rel-comp-campaign-summary.is-rejected { color: #b42318; }
.bd-rel-comp-campaign-metrics-frame {
    margin-bottom: 12px;
    padding: 14px;
    border: 1px solid #d7dce3;
    background: #f7f8fb;
}
.bd-rel-comp-campaign-metrics { display: grid; gap: 9px; }
.bd-rel-comp-campaign-metrics > div {
    display: grid;
    grid-template-columns: 110px minmax(0, 1fr) 48px;
    gap: 8px;
    align-items: center;
}
.bd-rel-comp-campaign-metrics span { font-size: 12px; color: #4b5563; font-weight: 700; }
.bd-rel-comp-campaign-metrics i {
    display: block;
    overflow: hidden;
    height: var(--bd-rel-progress-h, 8px);
    background: #e9edf3;
}
.bd-rel-comp-campaign-metrics i b {
    display: block;
    height: 100%;
    background: #4c52bc;
}
.bd-rel-comp-campaign-metrics strong {
    font-size: 12px;
    text-align: right;
    color: #4c52bc;
}
.bd-rel-comp-foundation {
    margin: 14px 0;
    padding: 14px;
    border: 1px solid #f0c48a;
    background: #fffaf3;
}
.bd-rel-comp-foundation > header {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: flex-start;
    margin-bottom: 12px;
}
.bd-rel-comp-foundation > header strong { display: block; font-size: 14px; }
.bd-rel-comp-foundation > header p { margin: 4px 0 0; font-size: 12px; color: var(--bd-rel-c-muted, #6b7280); line-height: 1.5; }
.bd-rel-comp-foundation-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
}
@media (min-width: 992px) {
    .bd-rel-comp-foundation-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.bd-rel-comp-foundation-grid article {
    position: relative;
    padding: 12px;
    border: 1px solid #f0c48a;
    background: #fff;
}
.bd-rel-comp-foundation-grid article.is-passed { border-color: #9fd4b0; }
.bd-rel-comp-foundation-grid article > span {
    display: block;
    padding-right: 42px;
    font-size: 12px;
    color: var(--bd-rel-c-muted, #6b7280);
    font-weight: 700;
}
.bd-rel-comp-foundation-grid article > em {
    position: absolute;
    top: 10px;
    right: 10px;
}
.bd-rel-comp-foundation-grid article > strong {
    display: block;
    margin: 8px 0;
    font-size: 18px;
}
.bd-rel-comp-foundation-grid article > strong small {
    margin-left: 2px;
    font-size: 11px;
    color: var(--bd-rel-c-muted, #6b7280);
}
.bd-rel-comp-foundation-grid article i {
    display: block;
    overflow: hidden;
    height: 6px;
    background: #e9edf3;
}
.bd-rel-comp-foundation-grid article i b {
    display: block;
    height: 100%;
    background: #d97706;
}
.bd-rel-comp-foundation-grid article.is-passed i b { background: #1f7a3d; }
.bd-rel-comp-card-note {
    margin: 10px 0 0;
    font-size: 11px;
    color: var(--bd-rel-c-muted, #6b7280);
    line-height: 1.5;
}
.bd-rel-comp-campaign-reject {
    display: grid;
    gap: 6px;
    margin: 12px 0;
    padding: 12px;
    border: 1px solid #f0b4b4;
    background: #fff8f8;
}
.bd-rel-comp-campaign-reject > strong { color: #b42318; font-size: 12px; }
.bd-rel-comp-campaign-reject p {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    gap: 8px;
    align-items: start;
    margin: 0;
    font-size: 12px;
    color: #7f1d1d;
    line-height: 1.5;
}
.bd-rel-comp-campaign-reject p span {
    display: grid;
    width: 18px;
    height: 18px;
    place-items: center;
    border-radius: 50%;
    background: #b42318;
    color: #fff;
    font-size: var(--bd-rel-fs-label, 11px);
    font-weight: 900;
}
.bd-rel-comp-campaign-topics {
    margin: 14px 0;
    padding: 14px;
    border: 1px solid #9fd4b0;
    background: #f4fbf6;
}
.bd-rel-comp-campaign-topics > strong {
    display: block;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid #cfead8;
    color: #1f7a3d;
    font-size: 13px;
}
.bd-rel-comp-campaign-topic-list { display: grid; gap: 6px; }
.bd-rel-comp-campaign-topic-head,
.bd-rel-comp-campaign-topic-list > article {
    display: grid;
    grid-template-columns: 42px minmax(120px, 1fr) 70px 70px minmax(140px, .9fr) 100px;
    gap: 8px;
    align-items: center;
}
.bd-rel-comp-campaign-topic-head {
    padding: 0 10px 4px;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 11px;
    font-weight: 700;
}
.bd-rel-comp-campaign-topic-list > article {
    padding: 10px;
    border: 1px solid #cfead8;
    background: #fff;
}
.bd-rel-comp-campaign-topic-list > article.is-rejected {
    border-color: #f0b4b4;
    background: #fff8f8;
}
.bd-rel-comp-campaign-topic-list > article > span {
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    border-radius: 8px;
    background: #1f7a3d;
    color: #fff;
    font-size: 11px;
    font-weight: 900;
}
.bd-rel-comp-campaign-topic-list > article.is-rejected > span { background: #b42318; }
.bd-rel-comp-campaign-topic-name { font-size: 13px; }
.bd-rel-comp-campaign-topic-count,
.bd-rel-comp-campaign-topic-ratio { font-size: 12px; color: #4b5563; }
.bd-rel-comp-campaign-topic-score {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 42px;
    gap: 6px;
    align-items: center;
}
.bd-rel-comp-campaign-topic-score i {
    display: block;
    overflow: hidden;
    height: var(--bd-rel-progress-h, 8px);
    background: #e9edf3;
}
.bd-rel-comp-campaign-topic-score i b {
    display: block;
    height: 100%;
    background: #d97706;
}
.bd-rel-comp-campaign-topic-list > article.is-mid .bd-rel-comp-campaign-topic-score i b { background: #ca8a04; }
.bd-rel-comp-campaign-topic-list > article.is-high .bd-rel-comp-campaign-topic-score i b { background: #1f7a3d; }
.bd-rel-comp-campaign-topic-score strong { font-size: 12px; text-align: right; }
.bd-rel-comp-product-fit {
    margin-top: 14px;
    padding: 16px;
    border: 1px solid #c9d4f0;
    background: #f7f8ff;
}
.bd-rel-comp-product-fit-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}
.bd-rel-comp-product-fit-head h4 { margin: 0; font-size: 16px; }
.bd-rel-comp-product-fit-head p { margin: 6px 0 0; font-size: 12px; color: var(--bd-rel-c-muted, #6b7280); line-height: 1.55; }
.bd-rel-comp-product-summary {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    margin-bottom: 12px;
    padding: 11px 12px;
    border-left: 4px solid #4c52bc;
    background: #fff;
}
.bd-rel-comp-product-summary.is-dormant { border-left-color: #b42318; }
.bd-rel-comp-product-summary > span {
    padding: 5px 8px;
    border-radius: var(--bd-rel-r-sm, 6px);
    background: #eef0ff;
    color: #4c52bc;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
}
.bd-rel-comp-product-summary.is-dormant > span {
    background: #fdecec;
    color: #b42318;
}
.bd-rel-comp-product-summary p { margin: 0; font-size: 12px; color: #4b5563; line-height: 1.55; }
.bd-rel-comp-product-grid {
    display: grid;
    gap: 8px;
}
@media (min-width: 992px) {
    .bd-rel-comp-product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.bd-rel-comp-product-grid article {
    padding: 10px;
    border: 1px solid #e6e8ec;
    background: #fff;
}
.bd-rel-comp-product-grid article.is-rejected { opacity: 0.75; border-color: #f0b4b4; }
.bd-rel-comp-product-grid header {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
    margin-bottom: 8px;
}
.bd-rel-comp-product-grid header > span {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    border-radius: 8px;
    background: #4c52bc;
    color: #fff;
    font-size: 11px;
    font-weight: 900;
}
.bd-rel-comp-product-grid header > div {
    min-width: 0;
}
.bd-rel-comp-product-grid header small {
    display: block;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 11px;
    font-weight: 600;
    line-height: 1.3;
}
.bd-rel-comp-product-grid header strong {
    display: block;
    margin-top: 2px;
    color: #1f2933;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.3;
}
.bd-rel-comp-product-grid header > b {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 99px;
    background: #eef0ff;
    color: #4c52bc;
    font-size: 14px;
    font-weight: 800;
    white-space: nowrap;
}
.bd-rel-comp-product-grid .bd-rel-comp-foot {
    display: inline-block;
    width: fit-content;
    margin-top: 10px;
    padding: 4px 10px;
    border-radius: 99px;
    background: #d1fae5;
    color: #1f7a3d;
    font-size: 12px;
    font-weight: 800;
}
.bd-rel-comp-product-grid article.is-rejected .bd-rel-comp-foot {
    background: #fee2e2;
    color: #b91c1c;
}
.bd-rel-comp-product-grid article > p {
    margin: 8px 0 0;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 12px;
    line-height: 1.45;
}
.bd-rel-comp-product-empty {
    grid-column: 1 / -1;
    margin: 0;
    padding: 14px;
    background: #fff;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 12px;
    text-align: center;
}
/* 협업 체크리스트 — CLI parity (부모 body 폭 초과 금지) */
.bd-rel-comp-checklist {
    margin-top: 17px;
    width: 100%;
    max-width: 100%;
    border: 1px solid #9fd4b0;
    border-radius: 12px;
    background: linear-gradient(120deg, #f4fbf6, #fff 62%, #f7f8ff);
    overflow: hidden;
    box-sizing: border-box;
}
.bd-rel-comp-checklist[open] {
    box-shadow: 0 10px 24px rgba(31, 122, 61, 0.09);
}
.bd-rel-comp-checklist > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    min-height: 72px;
    padding: 14px 17px;
    cursor: pointer;
    list-style: none;
}
.bd-rel-comp-checklist > summary::-webkit-details-marker { display: none; }
.bd-rel-comp-checklist > summary:hover { background: rgba(209, 250, 229, 0.45); }
.bd-rel-comp-checklist > summary > span {
    display: flex;
    flex: 1 1 auto;
    flex-wrap: wrap;
    gap: 6px;
    align-items: baseline;
    min-width: 0;
}
.bd-rel-comp-checklist > summary b { color: #14532d; font-size: 14px; }
.bd-rel-comp-checklist > summary strong { color: #1f7a3d; font-size: 14px; }
.bd-rel-comp-checklist > summary small {
    display: block;
    flex-basis: 100%;
    margin-top: 3px;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 12px;
    line-height: 1.55;
}
.bd-rel-comp-checklist > summary > em {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 8px;
    padding: 8px 11px;
    border-radius: 8px;
    background: linear-gradient(120deg, #1f7a3d, #0d9488);
    color: #fff;
    font-size: 12px;
    font-style: normal;
    font-weight: 800;
    white-space: nowrap;
    box-shadow: 0 6px 14px rgba(31, 122, 61, 0.18);
}
.bd-rel-comp-checklist > summary > em i {
    display: inline-block;
    font-size: 16px;
    font-style: normal;
    line-height: 1;
    transition: transform 0.18s ease;
}
.bd-rel-comp-check-toggle-open { display: none; }
.bd-rel-comp-checklist[open] > summary > em .bd-rel-comp-check-toggle-closed { display: none; }
.bd-rel-comp-checklist[open] > summary > em .bd-rel-comp-check-toggle-open { display: inline; }
.bd-rel-comp-checklist[open] > summary > em i { transform: rotate(180deg); }
.bd-rel-comp-checklist-body {
    margin: 0 12px 12px;
    padding: 14px;
    border: 1px solid #9fd4b0;
    border-radius: var(--bd-rel-r-lg, 10px);
    background: #f8fffb;
}
.bd-rel-comp-checklist-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 13px;
}
.bd-rel-comp-checklist-head strong { color: #14532d; font-size: 15px; }
.bd-rel-comp-checklist-head p { margin: 5px 0 0; color: var(--bd-rel-c-muted, #6b7280); font-size: 12.5px; }
.bd-rel-comp-checklist-tools {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.bd-rel-comp-checklist-tools > b {
    color: #1f7a3d;
    font-size: 12px;
    white-space: nowrap;
}
.bd-rel-comp-checklist-tools button {
    height: 29px;
    padding: 0 9px;
    border: 1px solid #6ee7b7;
    border-radius: var(--bd-rel-r-sm, 6px);
    color: #1f7a3d;
    background: #fff;
    font-size: 12px;
    font-weight: 700;
}
.bd-rel-comp-checklist-tools .bd-rel-comp-check-fold {
    border-color: #cbd5e1;
    color: #475569;
}
.bd-rel-comp-check-progress {
    overflow: hidden;
    height: var(--bd-rel-progress-h, 8px);
    margin-top: 11px;
    border-radius: 99px;
    background: #d1fae5;
}
.bd-rel-comp-check-progress > b {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #34d399, #1f7a3d);
    transition: width 0.28s ease;
}
.bd-rel-comp-check-cards { display: grid; gap: 9px; margin-top: 11px; }
.bd-rel-comp-check-cards > article {
    overflow: hidden;
    border: 1px solid #d1fae5;
    border-radius: 10px;
    background: #fff;
    transition: border-color 0.2s ease, background 0.2s ease;
}
.bd-rel-comp-check-cards > article.completed {
    border-color: #10b981;
    background: #ecfdf5;
}
.bd-rel-comp-check-cards > article > label {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) 72px 28px;
    gap: 10px;
    align-items: center;
    padding: 11px 13px;
    cursor: pointer;
    margin: 0;
}
.bd-rel-comp-check-cards input.bd-rel-comp-check-input {
    appearance: none;
    -webkit-appearance: none;
    display: grid;
    width: 22px;
    height: 22px;
    margin: 0 auto;
    place-items: center;
    border: 2px solid #86d9bb;
    border-radius: var(--bd-rel-r-sm, 6px);
    background: #fff;
    cursor: pointer;
}
.bd-rel-comp-check-cards input.bd-rel-comp-check-input::after {
    content: "";
    width: 9px;
    height: 5px;
    border: solid #fff;
    border-width: 0 0 2px 2px;
    opacity: 0;
    transform: translateY(-1px) rotate(-45deg) scale(0.6);
}
.bd-rel-comp-check-cards input.bd-rel-comp-check-input:checked {
    border-color: #1f7a3d;
    background: #1f7a3d;
}
.bd-rel-comp-check-cards input.bd-rel-comp-check-input:checked::after {
    opacity: 1;
    transform: translateY(-1px) rotate(-45deg) scale(1);
}
.bd-rel-comp-check-cards label > span {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border-radius: var(--bd-rel-r, 8px);
    color: #fff;
    background: #1f7a3d;
    font-size: 12px;
    font-weight: 900;
}
.bd-rel-comp-check-cards label > div > strong { color: #1f2933; font-size: 14px; }
.bd-rel-comp-check-cards label p {
    margin: 4px 0 0;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 12.5px;
    line-height: 1.5;
}
.bd-rel-comp-check-badge {
    padding: 5px 6px;
    border-radius: 99px;
    color: #b45309;
    background: #fef3c7;
    font-size: 12px;
    text-align: center;
    font-weight: 700;
}
.bd-rel-comp-check-cards article.completed .bd-rel-comp-check-badge {
    color: #1f7a3d;
    background: #d1fae5;
}
.bd-rel-comp-check-cards article.completed label > div { opacity: 0.7; }
.bd-rel-comp-check-detail {
    display: grid;
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.25fr) minmax(0, 1fr);
    gap: 8px;
    padding: 0 13px 11px 59px;
}
.bd-rel-comp-check-detail > section,
.bd-rel-comp-check-detail > div > section {
    padding: 9px;
    border-radius: 8px;
    background: #f8fafc;
}
.bd-rel-comp-check-detail > div { display: grid; gap: 7px; }
.bd-rel-comp-check-detail > div > section { background: #f0fdf4; }
.bd-rel-comp-check-detail > div > section.is-warn { background: #fff7ed; }
.bd-rel-comp-check-detail section > strong { color: #1f7a3d; font-size: 12px; }
.bd-rel-comp-check-detail section.is-warn > strong { color: #c2410c; }
.bd-rel-comp-check-detail p {
    margin: 5px 0 0;
    color: #475569;
    font-size: 12px;
    line-height: 1.55;
}
.bd-rel-comp-check-detail ol {
    display: grid;
    gap: 5px;
    margin: 7px 0 0;
    padding: 0;
    list-style: none;
}
.bd-rel-comp-check-detail li {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    gap: 6px;
    align-items: start;
    color: #475569;
    font-size: 12px;
    line-height: 1.5;
}
.bd-rel-comp-check-detail li span {
    display: grid;
    width: 19px;
    height: 19px;
    place-items: center;
    border-radius: 5px;
    color: #fff;
    background: #14b8a6;
    font-size: 11px;
    font-weight: 900;
}
.bd-rel-comp-check-complete {
    margin: 10px 0 0;
    padding: 9px 11px;
    border-radius: 8px;
    color: #14532d;
    background: #d1fae5;
    font-size: 12.5px;
    font-weight: 700;
}

@media (max-width: 991.98px) {
    .bd-rel-comp-final-metrics,
    .bd-rel-comp-bench-grid { grid-template-columns: 1fr; }
    .bd-rel-comp-campaign-topic-list {
        overflow-x: auto;
    }
    .bd-rel-comp-campaign-topic-head,
    .bd-rel-comp-campaign-topic-list > article {
        min-width: 640px;
    }
}
@media (max-width: 767.98px) {
    .bd-rel-comp-title-row {
        align-items: flex-start;
        flex-direction: column;
        gap: 6px;
    }
    .bd-rel-comp-val-copy {
        align-items: flex-start;
        flex-direction: column;
        gap: 6px;
    }
    /* 핵심어 테이블은 가로 스크롤 유지 (열을 세로로 무너뜨리지 않음) */
    .bd-rel-comp-topic-head, .bd-rel-comp-kw-head { display: grid; }
    .bd-rel-comp-final-head, .bd-rel-comp-campaign-head {
        grid-template-columns: 1fr;
    }
    .bd-rel-comp-deep-body { grid-template-columns: 1fr; }
    .bd-rel-comp-roadmap-sum { grid-template-columns: 1fr; }
    .bd-rel-comp-quick-read { grid-template-columns: 1fr; }
    .bd-rel-comp-primary-top { grid-template-columns: 1fr; }
    .bd-rel-comp-primary-score { text-align: left; }
    .bd-rel-comp-bench { flex-direction: column; align-items: flex-start; }
    .bd-rel-comp-campaign-ops { grid-template-columns: 1fr; }
    .bd-rel-comp-campaign-metrics > div { grid-template-columns: 90px minmax(0, 1fr) 42px; }
    .bd-rel-comp-product-fit-head,
    .bd-rel-comp-foundation > header,
    .bd-rel-comp-checklist > summary {
        flex-direction: column;
        align-items: stretch;
    }
    .bd-rel-comp-checklist > summary > em { justify-content: center; width: 100%; }
    .bd-rel-comp-checklist-head {
        align-items: flex-start;
        flex-direction: column;
    }
    .bd-rel-comp-check-cards > article > label {
        grid-template-columns: 36px minmax(0, 1fr) 28px;
    }
    .bd-rel-comp-check-badge {
        grid-column: 2;
        grid-row: 2;
        width: fit-content;
    }
    .bd-rel-comp-check-cards input.bd-rel-comp-check-input {
        grid-column: 3;
        grid-row: 1 / span 2;
    }
    .bd-rel-comp-check-detail {
        grid-template-columns: 1fr;
        padding-left: 13px;
    }
    .bd-rel-comp-product-summary { grid-template-columns: 1fr; }
    .bd-rel-comp-product-summary > span { width: fit-content; }
    .bd-rel-comp-desc-head {
        flex-wrap: wrap;
        align-items: flex-start;
    }
    .bd-rel-comp-desc-head p {
        white-space: normal;
        overflow: visible;
        text-overflow: unset;
        flex-basis: 100%;
    }
    .bd-rel-comp-kw-op-conclusion-head {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }
    .bd-rel-comp-kw-op-conclusion-head span { text-align: left; margin-left: 0; }
    .bd-rel-comp-structure-bars > div {
        grid-template-columns: 60px minmax(0, 1fr) 90px;
    }
}

/* 경쟁력 진단 body: bordered surface / progress track radius 통일 */
#bd_rel_competitor_body .bd-rel-comp-deep-flow,
#bd_rel_competitor_body .bd-rel-comp-deep-flow > div,
#bd_rel_competitor_body .bd-rel-comp-verdict,
#bd_rel_competitor_body .bd-rel-comp-verdict > strong,
#bd_rel_competitor_body .bd-rel-comp-final-metrics article,
#bd_rel_competitor_body .bd-rel-comp-bench-grid article,
#bd_rel_competitor_body .bd-rel-comp-quick-read article,
#bd_rel_competitor_body .bd-rel-comp-campaign-gauge-frame,
#bd_rel_competitor_body .bd-rel-comp-campaign-ops,
#bd_rel_competitor_body .bd-rel-comp-campaign-metrics-frame,
#bd_rel_competitor_body .bd-rel-comp-foundation,
#bd_rel_competitor_body .bd-rel-comp-foundation-grid article,
#bd_rel_competitor_body .bd-rel-comp-campaign-reject,
#bd_rel_competitor_body .bd-rel-comp-campaign-topics,
#bd_rel_competitor_body .bd-rel-comp-campaign-topic-list > article,
#bd_rel_competitor_body .bd-rel-comp-product-fit,
#bd_rel_competitor_body .bd-rel-comp-product-summary,
#bd_rel_competitor_body .bd-rel-comp-product-grid article,
#bd_rel_competitor_body .bd-rel-comp-val-header > strong,
#bd_rel_competitor_body .bd-rel-comp-guide p.is-state,
#bd_rel_competitor_body .bd-rel-comp-guide p.is-use,
#bd_rel_competitor_body .bd-rel-comp-meter-bench em {
    border-radius: var(--bd-rel-comp-r, 8px);
}
#bd_rel_competitor_body .bd-rel-comp-meter,
#bd_rel_competitor_body .bd-rel-comp-meter-fill,
#bd_rel_competitor_body .bd-rel-comp-campaign-metrics i,
#bd_rel_competitor_body .bd-rel-comp-campaign-metrics i b,
#bd_rel_competitor_body .bd-rel-comp-campaign-topic-score i,
#bd_rel_competitor_body .bd-rel-comp-campaign-topic-score i b,
#bd_rel_competitor_body .bd-rel-comp-foundation-grid article i,
#bd_rel_competitor_body .bd-rel-comp-foundation-grid article i b {
    border-radius: 999px;
}


/* =============================================================================
 * AI 신뢰도 보완 진단 (.bd-rel-ai-*) — CLI AI diagnosis 패리티
 * 핵심: 레이더 / 우선보완 카드 / 교차진단 / 로드맵 체크 → 예상 투영
 * ============================================================================= */
.bd-rel-ai {
    font-size: 13px;
    color: #1f2933;
}
#bd_rel_ai_panel .bd-rel-ai-panel-head {
    width: 100%;
    padding: 14px 16px;
    border: 1px solid #c9d4f0;
    border-radius: var(--bd-rel-ai-r, 8px);
    background: #f7f8ff;
}
#bd_rel_ai_panel .bd-rel-ai-panel-head-copy > span {
    display: block;
    line-height: 1.35;
}
#bd_rel_ai_panel .bd-rel-ai-panel-head-copy > small {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    line-height: 1.45;
    color: var(--bd-rel-c-muted, #6b7280) !important;
}
.bd-rel-ai-lead-copy { display: none; }
.bd-rel-ai-lead { margin-bottom: 18px; }
.bd-rel-ai-lead span { display: block; font-size: 11px; color: var(--bd-rel-c-muted, #6b7280); margin-bottom: 6px; }
.bd-rel-ai-lead h2 { margin: 0 0 8px; font-size: 18px; font-weight: 700; line-height: 1.35; }
.bd-rel-ai-lead p { margin: 0; font-size: 12px; color: #4b5563; line-height: 1.55; }
.bd-rel-ai-overview {
    display: grid;
    /* 종합 보조평가·현재 진단 수준 = col-3씩, 우선 보완 영역 = col-6 */
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2fr);
    gap: 10px;
    margin-bottom: 18px;
}
.bd-rel-ai-overview > div {
    padding: 14px 12px;
    border: 1px solid #e6e8ec;
    border-radius: var(--bd-rel-ai-r, 8px);
    background: #fafbfc;
}
.bd-rel-ai-overview span { display: block; font-size: 11px; color: var(--bd-rel-c-muted, #6b7280); margin-bottom: 8px; }
.bd-rel-ai-overview strong { display: block; margin-top: 2px; font-size: 16px; line-height: 1.35; }
.bd-rel-ai-block {
    margin-top: 18px;
    padding: 18px 14px;
    border: 1px solid #e6e8ec;
    border-radius: var(--bd-rel-ai-r, 8px);
    background: #fff;
}
.bd-rel-ai-block h3 { margin: 0 0 10px; font-size: 15px; font-weight: 700; line-height: 1.4; }
.bd-rel-ai-block h4 { margin: 0 0 10px; font-size: 14px; font-weight: 700; line-height: 1.4; }
.bd-rel-ai-intro { margin: 0 0 16px; font-size: 12px; color: var(--bd-rel-c-muted, #6b7280); line-height: 1.55; }
.bd-rel-ai-visual,
.bd-rel-ai-topic,
.bd-rel-ai-priority,
.bd-rel-ai-cross,
.bd-rel-ai-roadmap-wrap,
.bd-rel-ai-projection {
    border: 1px solid #c9d4f0;
    background: #fbfcff;
}
.bd-rel-ai-chip,
.bd-rel-ai-chip-solid {
    display: inline-flex;
    align-items: center;
    height: fit-content;
    padding: 6px 10px;
    border-radius: var(--bd-rel-ai-r-pill, 6px);
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}
.bd-rel-ai-chip {
    border: 1px solid #c9d4f0;
    background: #eef2ff;
    color: #4c52bc;
}
.bd-rel-ai-chip-solid {
    border: none;
    background: #4c52bc;
    color: #fff;
}
.bd-rel-ai-help {
    position: relative;
    display: inline-grid;
    width: 17px;
    height: 17px;
    margin-left: 4px;
    place-items: center;
    border: 1px solid #c9d4f0;
    border-radius: 50%;
    color: #4c52bc;
    background: #eef2ff;
    font-size: var(--bd-rel-fs-label, 11px);
    font-weight: 900;
    cursor: help;
    outline: none;
    vertical-align: middle;
}
.bd-rel-ai-help > span {
    position: absolute;
    z-index: 40;
    top: calc(100% + 7px);
    left: -8px;
    display: none;
    width: 290px;
    max-width: min(290px, 70vw);
    padding: 9px 11px;
    border: 1px solid #c9d4f0;
    border-radius: var(--bd-rel-ai-r-sm, 6px);
    color: #334155;
    background: #fff;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.14);
    font-size: 11px;
    font-weight: 600;
    line-height: 1.55;
    text-align: left;
}
.bd-rel-ai-help:hover > span,
.bd-rel-ai-help:focus > span,
.bd-rel-ai-help:focus-visible > span {
    display: block;
}
.bd-rel-ai-visual-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}
.bd-rel-ai-visual-head span { display: block; font-size: 11px; color: var(--bd-rel-c-muted, #6b7280); }
.bd-rel-ai-visual-head h3 { margin: 2px 0 0; }
.bd-rel-ai-visual-head p,
.bd-rel-ai-visual-head p.bd-rel-ai-legend-line {
    margin: 0;
    font-size: 12px;
    color: var(--bd-rel-c-muted, #6b7280);
    max-width: none;
    white-space: nowrap;
    flex-shrink: 0;
}
@media (max-width: 767.98px) {
    .bd-rel-ai-visual-head p,
    .bd-rel-ai-visual-head p.bd-rel-ai-legend-line {
        white-space: normal;
    }
}
.bd-rel-ai-visual-subhead {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 8px;
}
.bd-rel-ai-visual-subhead b { font-size: 12px; }
.bd-rel-ai-visual-grid {
    display: grid;
    gap: 10px;
}
@media (min-width: 992px) {
    .bd-rel-ai-visual-grid { grid-template-columns: 0.9fr 1.2fr 1fr; }
}
.bd-rel-ai-gauge-card, .bd-rel-ai-radar-card, .bd-rel-ai-dual-card {
    padding: 12px;
    border: 1px solid #e6e8ec;
    border-radius: var(--bd-rel-ai-r, 8px);
    background: #fff;
}
.bd-rel-ai-gauge {
    --bd-rel-ai-gauge: 0deg;
    width: 120px;
    height: 120px;
    margin: 10px auto;
    border-radius: 50%;
    background: conic-gradient(#4c52bc var(--bd-rel-ai-gauge), #e9edf3 0);
    display: grid;
    place-items: center;
}
.bd-rel-ai-gauge > div {
    width: 92px;
    height: 92px;
    border-radius: 50%;
    background: #fff;
    display: grid;
    place-content: center;
    text-align: center;
}
.bd-rel-ai-gauge strong { font-size: 22px; color: #4c52bc; }
.bd-rel-ai-gauge span, .bd-rel-ai-gauge-card > p { font-size: 11px; color: var(--bd-rel-c-muted, #6b7280); }
.bd-rel-ai-radar-wrap {
    display: grid;
    grid-template-columns: 155px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
}
.bd-rel-ai-radar-svg {
    width: 155px;
    height: 155px;
    max-width: none;
    margin: 0;
    display: block;
}
.bd-rel-ai-radar-grid { fill: none; stroke: #e6e8ec; stroke-width: 1; }
.bd-rel-ai-radar-axis { stroke: #eef0f3; stroke-width: 1; }
.bd-rel-ai-radar-data { fill: rgba(76, 82, 188, 0.22); stroke: #4c52bc; stroke-width: 1.5; }
.bd-rel-ai-radar-expected { fill: rgba(31, 122, 61, 0.12); stroke: #1f7a3d; stroke-width: 1.5; }
.bd-rel-ai-radar-dot { fill: #4c52bc; }
.bd-rel-ai-radar-dot-expected { fill: #1f7a3d; }
.bd-rel-ai-radar-legend { display: grid; gap: 6px; min-width: 0; }
.bd-rel-ai-radar-legend span {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 5px;
    align-items: center;
    padding: 5px 7px;
    border-radius: var(--bd-rel-ai-r-sm, 6px);
    color: #475569;
    background: #f8fafc;
    font-size: var(--bd-rel-fs-label, 11px);
    font-weight: 700;
}
.bd-rel-ai-radar-legend em {
    min-width: 0;
    overflow: hidden;
    font-style: normal;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.bd-rel-ai-radar-legend i {
    position: absolute;
    z-index: 0;
    left: 0;
    right: auto;
    bottom: 0;
    height: 2px;
    border-radius: 0;
    background: #4c52bc;
}
.bd-rel-ai-radar-legend b { color: #4c52bc; font-weight: 800; }
.bd-rel-ai-radar-legend .is-ok i { background: #1f7a3d; }
.bd-rel-ai-radar-legend .is-ok b { color: #1f7a3d; }
.bd-rel-ai-radar-legend .is-warn i { background: #d97706; }
.bd-rel-ai-radar-legend .is-warn b { color: #d97706; }
.bd-rel-ai-radar-legend .is-danger i { background: #b42318; }
.bd-rel-ai-radar-legend .is-danger b { color: #b42318; }
.bd-rel-ai-dual-meter { display: grid; gap: 10px; margin-top: 8px; }
.bd-rel-ai-dual-meter > div {
    display: grid;
    grid-template-columns: 90px 1fr auto;
    gap: 8px;
    align-items: center;
    font-size: 12px;
}
.bd-rel-ai-meter {
    position: relative;
    height: 8px;
    border-radius: 999px;
    background: #e9edf3;
    overflow: hidden;
}
.bd-rel-ai-meter-fill, .bd-rel-ai-meter > i {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: #4c52bc;
}
.bd-rel-ai-meter-fill.is-danger, .bd-rel-ai-meter > i.is-danger { background: #b42318; }
.bd-rel-ai-meter > i.is-current { background: #64748b; }
.bd-rel-ai-meter > i.is-target { background: #1f7a3d; }
.bd-rel-ai-status-model {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 8px;
    margin-top: 10px;
    padding: 8px;
    border: 1px solid #d9dff5;
    border-radius: var(--bd-rel-ai-r-sm, 6px);
    background: #f4f5ff;
    font-size: 12px;
}
.bd-rel-ai-priority-flow {
    margin-top: 12px;
    padding: 14px;
    border: 1px solid #e6e8ec;
    border-radius: var(--bd-rel-ai-r, 8px);
    background: #f7f8fb;
}
.bd-rel-ai-priority-flow > div:first-child p { margin: 2px 0 12px; font-size: 12px; color: var(--bd-rel-c-muted, #6b7280); }
.bd-rel-ai-flow {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
    align-items: stretch;
}
.bd-rel-ai-flow > div {
    position: relative;
    display: flex;
    min-width: 0;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    padding: 12px;
    border: 1px solid #d9dff5;
    border-radius: var(--bd-rel-ai-r-sm, 6px);
    background: #fff;
    text-align: center;
}
.bd-rel-ai-flow span { display: block; font-size: 11px; color: var(--bd-rel-c-muted, #6b7280); font-weight: 700; }
.bd-rel-ai-flow strong { display: block; margin: 0; font-size: 13px; line-height: 1.35; }
.bd-rel-ai-flow small { color: var(--bd-rel-c-muted, #6b7280); }
.bd-rel-ai-flow b {
    position: absolute;
    right: -16px;
    top: 50%;
    color: #4c52bc;
    font-size: 18px;
    font-weight: 900;
    line-height: 1;
    transform: translateY(-50%);
}
@media (max-width: 767.98px) {
    .bd-rel-ai-radar-wrap { grid-template-columns: 1fr; justify-items: center; }
    .bd-rel-ai-radar-svg { margin: 0 auto; }
    .bd-rel-ai-radar-legend { width: 100%; }
    .bd-rel-ai-flow {
        grid-template-columns: 1fr;
        gap: 8px;
    }
    .bd-rel-ai-flow b { display: none; }
}
.bd-rel-ai-topic-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}
.bd-rel-ai-topic-head span { display: block; font-size: 11px; color: var(--bd-rel-c-muted, #6b7280); }
.bd-rel-ai-topic-dir { margin: 0 0 12px; font-size: 13px; line-height: 1.55; }
.bd-rel-ai-tendency {
    padding: 14px;
    border: 1px solid #9fd4b0;
    border-radius: var(--bd-rel-ai-r, 8px);
    background: #f3fbf6;
    margin-bottom: 12px;
}
.bd-rel-ai-tendency.is-warn { border-color: #f0c48a; background: #fff8ef; }
.bd-rel-ai-tendency.is-danger { border-color: #f0b4b4; background: #fff1f1; }
.bd-rel-ai-tendency.is-ok { border-color: #9fd4b0; background: #f3fbf6; }
.bd-rel-ai-tendency-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 8px;
}
.bd-rel-ai-tendency-head span { display: block; font-size: 11px; color: #1f7a3d; font-weight: 800; }
.bd-rel-ai-tendency-head h4 { margin: 4px 0 0; font-size: 15px; }
.bd-rel-ai-tendency-head > .bd-rel-ai-chip {
    max-width: 45%;
    text-align: center;
    white-space: normal;
    line-height: 1.45;
}
.bd-rel-ai-tendency-summary { margin: 0; font-size: 12px; color: #334155; line-height: 1.65; }
.bd-rel-ai-signal-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 12px;
}
.bd-rel-ai-signal-grid article {
    display: flex;
    gap: 10px;
    min-width: 0;
    padding: 12px;
    border: 1px solid #e6e8ec;
    border-radius: var(--bd-rel-ai-r, 8px);
    background: #fff;
}
.bd-rel-ai-signal-grid article > span {
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border-radius: var(--bd-rel-ai-r-sm, 6px);
    background: #eef2ff;
    color: #4c52bc;
    font-weight: 900;
    font-size: 12px;
}
.bd-rel-ai-signal-grid b { display: block; font-size: 12px; color: var(--bd-rel-c-muted, #6b7280); }
.bd-rel-ai-signal-grid strong { display: block; margin: 4px 0; font-size: 14px; line-height: 1.35; }
.bd-rel-ai-signal-grid p { margin: 0; font-size: 11.5px; color: var(--bd-rel-c-muted, #6b7280); line-height: 1.55; }
.bd-rel-ai-guidance {
    margin-top: 12px;
    padding: 12px 14px;
    border-left: 4px solid #4c52bc;
    border-radius: var(--bd-rel-ai-r-sm, 6px);
    background: rgba(255,255,255,.88);
    font-size: 12px;
}
.bd-rel-ai-guidance b { color: #4c52bc; }
.bd-rel-ai-guidance p { margin: 5px 0 0; color: #334155; }
.bd-rel-ai-risk-grid {
    display: grid;
    gap: 10px;
    margin-top: 12px;
}
@media (min-width: 768px) {
    .bd-rel-ai-risk-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.bd-rel-ai-risk-grid > article {
    display: flex;
    flex-direction: column;
    padding: 12px;
    border: 1px solid #e6e8ec;
    border-radius: var(--bd-rel-ai-r, 8px);
    background: #fff;
}
.bd-rel-ai-risk-grid > article.is-ok { border-color: #9fd4b0; background: #f8fbf9; }
.bd-rel-ai-risk-grid > article.is-warn { border-color: #f0c48a; background: #fffaf3; }
.bd-rel-ai-risk-grid > article.is-danger { border-color: #f0b4b4; background: #fff8f8; }
.bd-rel-ai-quality-panel.is-ok { border-color: #9fd4b0; }
.bd-rel-ai-risk-grid h4 { margin: 0 0 8px; font-size: 13px; }
.bd-rel-ai-risk-grid ul {
    flex: 1;
    margin: 0 0 10px;
    padding-left: 1.1rem;
    font-size: 12px;
    color: #475569;
}
.bd-rel-ai-risk-result {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 5px 8px;
    margin-top: auto;
    padding: 10px 11px;
    border: 1px solid #e6e8ec;
    border-radius: var(--bd-rel-ai-r-sm, 6px);
    background: #fafbfc;
}
.bd-rel-ai-risk-result span {
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: var(--bd-rel-fs-label, 11px);
    font-weight: 800;
}
.bd-rel-ai-risk-result strong {
    justify-self: start;
    padding: 3px 8px;
    border-radius: 999px;
    color: #fff;
    background: #64748b;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.3;
}
.bd-rel-ai-risk-result p {
    grid-column: 1 / -1;
    margin: 0;
    color: #334155;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.55;
}
.bd-rel-ai-risk-result.is-ok {
    border-color: #9fd4b0;
    background: #edf8f1;
}
.bd-rel-ai-risk-result.is-ok strong { background: #1f7a3d; }
.bd-rel-ai-risk-result.is-warn {
    border-color: #f0c48a;
    background: #fff8ef;
}
.bd-rel-ai-risk-result.is-warn strong { background: #d97706; }
.bd-rel-ai-risk-result.is-danger {
    border-color: #f0b4b4;
    background: #fff8f8;
}
.bd-rel-ai-risk-result.is-danger strong { background: #b42318; }
.bd-rel-ai-next-actions {
    margin-top: 14px;
    padding: 12px;
    border: 1px solid #c9d4f0;
    border-radius: var(--bd-rel-ai-r, 8px);
    background: #f4f5ff;
}
.bd-rel-ai-next-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 11px;
}
.bd-rel-ai-next-head h4 {
    margin: 0 0 3px;
    color: #4c52bc;
    font-size: 15px;
}
.bd-rel-ai-next-head p { margin: 0; font-size: 12px; color: var(--bd-rel-c-muted, #6b7280); line-height: 1.5; }
.bd-rel-ai-next-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 28px;
}
@media (min-width: 992px) {
    .bd-rel-ai-next-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.bd-rel-ai-next-list > article {
    position: relative;
    padding: 12px;
    border: 1px solid #c9d4f0;
    border-radius: var(--bd-rel-ai-r, 8px);
    background: #fff;
    min-width: 0;
}
@media (min-width: 992px) {
    .bd-rel-ai-next-list > article:not(:last-child)::after {
        content: "→";
        position: absolute;
        top: 50%;
        left: calc(100% + 4px);
        display: grid;
        width: 20px;
        height: 20px;
        place-items: center;
        border-radius: 50%;
        color: #fff;
        background: #4c52bc;
        font-size: 12px;
        font-weight: 900;
        transform: translateY(-50%);
    }
}
.bd-rel-ai-next-card-head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}
.bd-rel-ai-next-card-head > span {
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #4c52bc;
    color: #fff;
    display: grid;
    place-items: center;
    font-weight: 700;
}
.bd-rel-ai-next-card-head > div {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 2px;
}
.bd-rel-ai-next-card-head small {
    color: #4c52bc;
    font-size: var(--bd-rel-fs-label, 11px);
    font-weight: 900;
    letter-spacing: 0.06em;
}
.bd-rel-ai-next-card-head strong {
    color: #1f2933;
    font-size: 14px;
    line-height: 1.35;
}
.bd-rel-ai-cycle { display: grid; gap: 5px; }
.bd-rel-ai-cycle > div {
    min-height: 84px;
    padding: 9px 10px;
    border: 1px solid #d9dff5;
    border-radius: var(--bd-rel-ai-r-sm, 6px);
    background: #f4f5ff;
    font-size: 12px;
}
.bd-rel-ai-cycle .is-action {
    border-color: #9fd4b0;
    background: #edf8f1;
}
.bd-rel-ai-cycle .is-target {
    border-color: #c9d4f0;
    background: #eef2ff;
}
.bd-rel-ai-cycle-label {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-bottom: 5px;
}
.bd-rel-ai-cycle-label b { color: #4c52bc; font-size: 12px; }
.bd-rel-ai-cycle .is-action .bd-rel-ai-cycle-label b { color: #1f7a3d; }
.bd-rel-ai-cycle .is-target .bd-rel-ai-cycle-label b { color: #4338ca; }
.bd-rel-ai-cycle > div > p { margin: 0; color: #334155; font-size: 12px; line-height: 1.55; }
.bd-rel-ai-cycle > i {
    text-align: center;
    color: #4c52bc;
    font-size: 14px;
    font-style: normal;
    font-weight: 900;
    line-height: 1;
}
.bd-rel-ai-cycle-return {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    align-items: center;
    justify-content: center;
    margin-top: 12px;
    padding: 9px 12px;
    border: 1px dashed #4c52bc;
    border-radius: 999px;
    background: rgba(255,255,255,.75);
    font-size: 12px;
}
.bd-rel-ai-cycle-return span {
    padding: 3px 8px;
    border-radius: 999px;
    color: #4c52bc;
    background: #eef2ff;
    font-size: 11px;
    font-weight: 900;
}
.bd-rel-ai-cycle-return i {
    color: #4c52bc;
    font-size: 13px;
    font-style: normal;
    font-weight: 900;
}
.bd-rel-ai-cycle-return strong { color: #4c52bc; font-size: 12px; }
.bd-rel-ai-priority-list { display: grid; gap: 14px; }
.bd-rel-ai-priority-card {
    min-width: 0;
    padding: 16px 18px;
    border: 1px solid #e6e8ec;
    border-left: 4px solid #d97706;
    border-radius: var(--bd-rel-ai-r, 8px);
    background: #fff;
    box-shadow: 0 3px 12px rgba(15, 23, 42, 0.04);
}
.bd-rel-ai-priority-card[data-priority-index="1"] { border-left-color: #4c52bc; }
.bd-rel-ai-priority-card[data-priority-index="2"] { border-left-color: #1f7a3d; }
.bd-rel-ai-priority-card[data-priority-index="3"] { border-left-color: var(--bd-rel-c-muted, #6b7280); }
.bd-rel-ai-priority-card[data-priority-index="4"] { border-left-color: #b42318; }
.bd-rel-ai-priority-card[data-priority-index="5"] { border-left-color: var(--bd-rel-c-muted, #6b7280); }
.bd-rel-ai-priority-head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid #eef0f3;
}
.bd-rel-ai-priority-head span {
    flex: 0 0 auto;
    padding: 4px 9px;
    border-radius: 999px;
    color: #fff;
    background: #d97706;
    font-size: 11px;
    font-weight: 800;
}
.bd-rel-ai-priority-card[data-priority-index="1"] .bd-rel-ai-priority-head span { background: #4c52bc; }
.bd-rel-ai-priority-card[data-priority-index="2"] .bd-rel-ai-priority-head span { background: #1f7a3d; }
.bd-rel-ai-priority-card[data-priority-index="3"] .bd-rel-ai-priority-head span { background: #64748b; }
.bd-rel-ai-priority-card[data-priority-index="4"] .bd-rel-ai-priority-head span { background: #b42318; }
.bd-rel-ai-priority-head h4 { margin: 0; font-size: 15px; line-height: 1.35; }
.bd-rel-ai-priority-finding {
    margin-top: 0;
    padding: 11px 13px;
    border: none;
    border-radius: var(--bd-rel-ai-r-sm, 6px);
    background: #f8fafc;
    font-size: 12px;
}
.bd-rel-ai-priority-finding strong {
    display: block;
    margin-bottom: 5px;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 11px;
}
.bd-rel-ai-priority-finding p {
    margin: 0;
    color: #0f172a;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.55;
}
.bd-rel-ai-priority-visual {
    margin-top: 12px;
    padding: 12px 13px;
    border: 1px solid #d9dff5;
    border-radius: var(--bd-rel-ai-r, 8px);
    background: linear-gradient(145deg, #f8f9ff, #fff);
}
.bd-rel-ai-visual-subhead {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 10px;
}
.bd-rel-ai-visual-subhead strong,
.bd-rel-ai-visual-subhead b {
    color: #4c52bc;
    font-size: 12px;
    font-weight: 900;
}
.bd-rel-ai-compare-table {
    display: grid;
    overflow: hidden;
    border: 1px solid #d9dff5;
    border-radius: var(--bd-rel-ai-r-sm, 6px);
}
@media (min-width: 768px) {
    .bd-rel-ai-compare-table { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.bd-rel-ai-compare-table > div {
    display: flex;
    min-width: 0;
    min-height: 96px;
    flex-direction: column;
    gap: 5px;
    padding: 10px 11px;
    border: none;
    border-radius: 0;
    background: #fff;
}
@media (min-width: 768px) {
    .bd-rel-ai-compare-table > div + div { border-left: 1px solid #d9dff5; }
}
.bd-rel-ai-compare-table > div:last-child { background: #f4f5ff; }
.bd-rel-ai-compare-table span { display: block; font-size: var(--bd-rel-fs-label, 11px); color: var(--bd-rel-c-muted, #6b7280); font-weight: 800; }
.bd-rel-ai-compare-table b { display: block; margin: 0; font-size: 14px; }
.bd-rel-ai-compare-table small {
    display: -webkit-box;
    overflow: hidden;
    color: #334155;
    font-size: var(--bd-rel-fs-label, 11px);
    line-height: 1.5;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}
.bd-rel-ai-process {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 28px minmax(0, 1.25fr) 28px minmax(0, 1fr);
    align-items: stretch;
    gap: 0;
}
.bd-rel-ai-process > div {
    display: flex;
    min-width: 0;
    min-height: 100px;
    flex-direction: column;
    gap: 6px;
    padding: 11px 12px;
    border: 1px solid #d9dff5;
    border-radius: var(--bd-rel-ai-r-sm, 6px);
    background: #f4f5ff;
}
.bd-rel-ai-process > div:nth-of-type(2) {
    border-color: #9fd4b0;
    background: #edf8f1;
}
.bd-rel-ai-process > div:nth-of-type(3) {
    border-color: #c9d4f0;
    background: #eef2ff;
}
.bd-rel-ai-process span {
    display: grid;
    width: 20px;
    height: 20px;
    place-items: center;
    border-radius: 50%;
    background: #4c52bc;
    color: #fff;
    font-size: 11px;
    line-height: 1;
    margin: 0;
}
.bd-rel-ai-process > div:nth-of-type(2) span { background: #1f7a3d; }
.bd-rel-ai-process b { display: block; margin: 0; font-size: 12px; }
.bd-rel-ai-process small { color: #334155; font-size: var(--bd-rel-fs-label, 11px); line-height: 1.5; }
.bd-rel-ai-process i {
    display: grid;
    place-items: center;
    color: #4c52bc;
    font-style: normal;
    font-size: 18px;
    font-weight: 900;
}
@media (max-width: 767.98px) {
    .bd-rel-ai-signal-grid { grid-template-columns: 1fr; }
    .bd-rel-ai-process {
        grid-template-columns: 1fr;
        gap: 6px;
    }
    .bd-rel-ai-process i { transform: rotate(90deg); }
}
.bd-rel-ai-target-chart { display: grid; gap: 9px; }
.bd-rel-ai-target-chart > div {
    display: grid;
    grid-template-columns: 96px 1fr 42px;
    gap: 8px;
    align-items: center;
    font-size: 12px;
}
.bd-rel-ai-target-chart > div > span { color: #475569; font-size: var(--bd-rel-fs-label, 11px); font-weight: 800; }
.bd-rel-ai-target-chart > div > b { text-align: right; font-size: 12px; }
.bd-rel-ai-target-chart > p {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 2px 0 0;
    padding: 8px 10px;
    border-radius: var(--bd-rel-ai-r-sm, 6px);
    background: #edf8f1;
    font-size: 12px;
}
.bd-rel-ai-target-chart > p strong { flex: 0 0 auto; color: #1f7a3d; font-size: 11px; }
.bd-rel-ai-target-chart > p span {
    overflow: hidden;
    color: #475569;
    font-size: var(--bd-rel-fs-label, 11px);
    text-overflow: ellipsis;
    white-space: nowrap;
}
.bd-rel-ai-priority-evidence {
    margin-top: 11px;
    padding-top: 0;
    border-top: none;
    font-size: 12px;
}
.bd-rel-ai-priority-evidence > strong {
    display: block;
    margin-bottom: 5px;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 11px;
}
.bd-rel-ai-priority-evidence > p { margin: 0; color: #334155; line-height: 1.6; }
.bd-rel-ai-priority-evidence ul {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin: 9px 0 0;
    padding: 0;
    list-style: none;
}
.bd-rel-ai-priority-evidence li {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 3px;
    justify-content: flex-start;
    padding: 8px 10px;
    border: 1px solid #e6e8ec;
    border-radius: var(--bd-rel-ai-r-sm, 6px);
    border-bottom: 1px solid #e6e8ec;
    background: #f8fafc;
}
.bd-rel-ai-priority-evidence li span {
    overflow: hidden;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: var(--bd-rel-fs-label, 11px);
    text-overflow: ellipsis;
    white-space: nowrap;
}
.bd-rel-ai-priority-evidence li b {
    color: #0f172a;
    font-size: 12px;
    line-height: 1.4;
    word-break: break-word;
}
@media (max-width: 767.98px) {
    .bd-rel-ai-priority-evidence ul { grid-template-columns: 1fr; }
}
.bd-rel-ai-priority-action {
    margin-top: 11px;
    padding: 11px 13px;
    border: 1px solid #9fd4b0;
    border-radius: var(--bd-rel-ai-r-sm, 6px);
    background: #edf8f1;
    font-size: 12px;
}
.bd-rel-ai-priority-action strong {
    display: block;
    margin-bottom: 5px;
    color: #1f7a3d;
    font-size: 11px;
}
.bd-rel-ai-priority-action p { margin: 0; color: #334155; line-height: 1.6; }
.bd-rel-ai-priority-steps {
    margin-top: 11px;
    padding-top: 0;
    border-top: none;
    font-size: 12px;
}
.bd-rel-ai-priority-steps > strong {
    display: block;
    margin-bottom: 5px;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 11px;
}
.bd-rel-ai-priority-steps ol {
    display: grid;
    gap: 5px;
    margin: 0;
    padding-left: 20px;
}
.bd-rel-ai-priority-steps li {
    color: #334155;
    font-size: 12px;
    line-height: 1.6;
}
.bd-rel-ai-priority-example {
    margin-top: 11px;
    padding: 10px 12px;
    border-top: none;
    border-left: 3px solid #4c52bc;
    border-radius: 0 var(--bd-rel-ai-r-sm, 6px) var(--bd-rel-ai-r-sm, 6px) 0;
    background: #f4f5ff;
    font-size: 12px;
}
.bd-rel-ai-priority-example strong {
    display: block;
    margin-bottom: 5px;
    color: #4c52bc;
    font-size: 11px;
}
.bd-rel-ai-priority-example p { margin: 0; color: #334155; line-height: 1.6; }
.bd-rel-ai-expand-btn {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    gap: 7px;
    margin-top: 12px;
    padding: 10px 14px;
    border: 1px solid #c9d4f0;
    border-radius: var(--bd-rel-ai-r, 8px);
    color: #4c52bc;
    background: linear-gradient(145deg, #f4f5ff, #fff);
    font-size: 12px;
    font-weight: 900;
    cursor: pointer;
}
.bd-rel-ai-expand-btn > span {
    display: grid;
    width: 20px;
    height: 20px;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: #4c52bc;
    font-size: 14px;
    line-height: 1;
}
.bd-rel-ai-expand-btn:hover {
    border-color: #4c52bc;
    background: #eef2ff;
}

.bd-rel-ai-cross-list { display: grid; gap: 10px; }
.bd-rel-ai-cross-list > article {
    padding: 12px;
    border: 1px solid #e6e8ec;
    border-radius: var(--bd-rel-ai-r, 8px);
    background: #fff;
}
.bd-rel-ai-cross-title {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 8px;
    margin-bottom: 8px;
}
.bd-rel-ai-cross-title span { color: #8a94a6; font-weight: 700; }
.bd-rel-ai-cross-panel {
    margin-top: 10px;
    padding: 10px;
    border: 1px solid #e6e8ec;
    border-radius: var(--bd-rel-ai-r-sm, 6px);
    background: #fafbfc;
}
.bd-rel-ai-cross-diagram {
    display: grid;
    grid-template-columns: 1fr auto 1fr auto 1fr;
    gap: 8px;
    align-items: stretch;
    margin: 4px 0 0;
}
.bd-rel-ai-cross-diagram > div {
    min-width: 0;
    padding: 10px;
    border: 1px solid #d9dff5;
    border-radius: var(--bd-rel-ai-r-sm, 6px);
    background: #fff;
    font-size: 12px;
}
.bd-rel-ai-cross-diagram span { display: block; font-size: 11px; color: var(--bd-rel-c-muted, #6b7280); margin-bottom: 4px; }
.bd-rel-ai-cross-diagram i {
    align-self: center;
    color: #4c52bc;
    font-size: 18px;
    font-style: normal;
    font-weight: 900;
    text-align: center;
    line-height: 1;
}
@media (max-width: 767.98px) {
    .bd-rel-ai-cross-diagram {
        grid-template-columns: 1fr;
        gap: 6px;
    }
    .bd-rel-ai-cross-diagram i {
        transform: rotate(90deg);
        font-size: 14px;
    }
}
.bd-rel-ai-cross-metrics { display: grid; gap: 6px; margin-top: 4px; }
.bd-rel-ai-cross-metrics > div {
    display: grid;
    grid-template-columns: 100px 1fr auto;
    gap: 8px;
    align-items: center;
    font-size: 12px;
}
.bd-rel-ai-cross-table { display: grid; gap: 6px; margin-top: 4px; }
.bd-rel-ai-cross-table > div {
    padding: 8px;
    border: 1px solid #eef0f3;
    border-radius: var(--bd-rel-ai-r-sm, 6px);
    background: #fff;
    font-size: 12px;
}
.bd-rel-ai-cross-table b { display: block; margin-bottom: 2px; }
.bd-rel-ai-roadmap { display: grid; gap: 10px; }
.bd-rel-ai-roadmap > article {
    padding: 12px;
    border: 1px solid #e6e8ec;
    border-radius: var(--bd-rel-ai-r, 8px);
    background: #fff;
}
.bd-rel-ai-roadmap > article.is-completed { border-color: #9fd4b0; background: #edf8f1; }
.bd-rel-ai-roadmap-head {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    margin-bottom: 8px;
}
.bd-rel-ai-roadmap-head h4 { margin: 0; flex: 1; font-size: 14px; min-width: 120px; }
.bd-rel-ai-roadmap-head-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}
.bd-rel-ai-roadmap-progress {
    padding: 2px 8px;
    border: 1px solid #d7dce3;
    border-radius: var(--bd-rel-ai-r-pill, 6px);
    background: #fff;
    font-size: 11px;
}
.bd-rel-ai-roadmap > article.is-completed .bd-rel-ai-roadmap-progress {
    border-color: #9fd4b0;
    background: #edf8f1;
    color: #1f7a3d;
    font-weight: 700;
}
.bd-rel-ai-roadmap-goal { font-size: 12px; margin-bottom: 8px; }
.bd-rel-ai-roadmap-checks ul { list-style: none; margin: 6px 0 0; padding: 0; }
.bd-rel-ai-roadmap-checks li {
    position: relative;
    margin-bottom: 6px;
    padding: 8px 10px;
    border: 1px solid #e6e8ec;
    border-radius: var(--bd-rel-ai-r-sm, 6px);
    background: #fff;
}
.bd-rel-ai-roadmap-checks li.is-done {
    border-color: #9fd4b0;
    background: #f3fbf6;
}
.bd-rel-ai-roadmap-checks li.is-cue {
    padding-right: 105px;
    border-color: #9fd4b0;
    animation: bd-rel-ai-roadmap-row-pulse 1.8s ease-in-out infinite;
}
.bd-rel-ai-roadmap-checks label {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 8px;
    align-items: start;
    font-size: 12px;
    cursor: pointer;
}
.bd-rel-ai-roadmap-checks input[type="checkbox"] {
    appearance: none;
    display: grid;
    width: 18px;
    height: 18px;
    margin: 0;
    place-items: center;
    border: 1px solid #c9d4f0;
    border-radius: 5px;
    background: #eef2ff;
    cursor: pointer;
}
.bd-rel-ai-roadmap-checks input[type="checkbox"]::after {
    content: "✓";
    color: #fff;
    font-size: 11px;
    font-weight: 900;
    opacity: 0;
    transform: scale(0.6);
}
.bd-rel-ai-roadmap-checks input[type="checkbox"]:checked {
    border-color: #1f7a3d;
    background: #1f7a3d;
}
.bd-rel-ai-roadmap-checks input[type="checkbox"]:checked::after {
    opacity: 1;
    transform: scale(1);
}
.bd-rel-ai-roadmap-checks li.is-cue input[type="checkbox"] {
    animation: bd-rel-ai-roadmap-check-pulse 1.15s ease-in-out infinite;
}
.bd-rel-ai-check-cue {
    display: none;
    position: absolute;
    top: 50%;
    right: 10px;
    padding: 4px 7px;
    border-radius: 999px;
    color: #1f7a3d;
    background: #d8f3e3;
    font-size: var(--bd-rel-fs-label, 11px);
    font-weight: 900;
    font-style: normal;
    white-space: nowrap;
    transform: translateY(-50%);
    animation: bd-rel-ai-roadmap-cue-move 1.15s ease-in-out infinite;
}
.bd-rel-ai-roadmap-checks li.is-cue .bd-rel-ai-check-cue { display: inline-block; }
@keyframes bd-rel-ai-roadmap-check-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(31, 122, 61, 0.1); transform: scale(1); }
    50% { box-shadow: 0 0 0 6px rgba(31, 122, 61, 0.18); transform: scale(1.1); }
}
@keyframes bd-rel-ai-roadmap-row-pulse {
    0%, 100% { background: #fff; }
    50% { background: #f3fbf6; }
}
@keyframes bd-rel-ai-roadmap-cue-move {
    0%, 100% { transform: translateY(-50%) translateX(0); }
    50% { transform: translateY(-50%) translateX(-3px); }
}
.bd-rel-ai-roadmap-result {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #eef0f3;
    font-size: 12px;
}
.bd-rel-ai-roadmap-result p { margin: 0 0 4px; }
.bd-rel-ai-projection-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}
.bd-rel-ai-projection-head span { display: block; font-size: 11px; color: var(--bd-rel-c-muted, #6b7280); }
.bd-rel-ai-projection-head h3 b { color: #1f7a3d; font-weight: 700; }
.bd-rel-ai-projection.has-progress { border-color: #9fd4b0; }
.bd-rel-ai-projection.is-complete { border-color: #c9d4f0; background: #f7f8ff; }
.bd-rel-ai-projection-summary {
    display: grid;
    grid-template-columns: 1fr auto 1fr 1fr;
    gap: 8px;
    align-items: stretch;
    margin-bottom: 12px;
}
.bd-rel-ai-projection-summary article {
    padding: 10px;
    border: 1px solid #e6e8ec;
    border-radius: var(--bd-rel-ai-r, 8px);
    background: #fff;
}
.bd-rel-ai-projection-summary .is-expected { border-color: #9fd4b0; background: #edf8f1; }
.bd-rel-ai-projection-summary .is-quality { border-color: #c9d4f0; background: #f4f5ff; }
.bd-rel-ai-projection-summary span { display: block; font-size: 11px; color: var(--bd-rel-c-muted, #6b7280); }
.bd-rel-ai-projection-summary strong { display: block; margin: 4px 0; font-size: 18px; }
.bd-rel-ai-projection-summary small { color: var(--bd-rel-c-muted, #6b7280); font-size: 11px; }
.bd-rel-ai-arrow { align-self: center; font-weight: 700; color: #8a94a6; }
.bd-rel-ai-projection-visual {
    display: grid;
    gap: 10px;
}
@media (min-width: 992px) {
    .bd-rel-ai-projection-visual { grid-template-columns: 0.9fr 1.1fr; }
}
.bd-rel-ai-projection-visual > article {
    padding: 12px;
    border: 1px solid #e6e8ec;
    border-radius: var(--bd-rel-ai-r, 8px);
    background: #fff;
}
.bd-rel-ai-mini-gauges {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: center;
    margin: 10px 0;
}
.bd-rel-ai-mini-gauge {
    --bd-rel-ai-gauge: 0deg;
    position: relative;
    width: 84px;
    height: 84px;
    border-radius: 50%;
    background: conic-gradient(#4c52bc var(--bd-rel-ai-gauge), #e9edf3 0);
    display: grid;
    place-items: center;
}
.bd-rel-ai-mini-gauge.is-expected {
    background: conic-gradient(#1f7a3d var(--bd-rel-ai-gauge), #e9edf3 0);
}
.bd-rel-ai-mini-gauge::after {
    content: "";
    width: 62px;
    height: 62px;
    border-radius: 50%;
    background: #fff;
    position: absolute;
}
.bd-rel-ai-mini-gauge strong {
    position: relative;
    z-index: 1;
    font-size: 14px;
}
.bd-rel-ai-mini-gauges > div { text-align: center; }
.bd-rel-ai-mini-gauges span { display: block; margin-top: 4px; font-size: 11px; color: var(--bd-rel-c-muted, #6b7280); }
.bd-rel-ai-mini-gauges > b { color: #8a94a6; }
.bd-rel-ai-mini-note { margin: 0; font-size: 11px; color: var(--bd-rel-c-muted, #6b7280); text-align: center; }
.bd-rel-ai-proj-chart-title {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}
.bd-rel-ai-proj-chart-title p { margin: 2px 0 0; font-size: 11px; color: var(--bd-rel-c-muted, #6b7280); }
.bd-rel-ai-proj-legend { display: flex; gap: 8px; font-size: 11px; }
.bd-rel-ai-proj-legend .is-current { color: #4c52bc; }
.bd-rel-ai-proj-legend .is-expected { color: #1f7a3d; }
.bd-rel-ai-proj-values { display: grid; gap: 4px; margin-top: 8px; }
.bd-rel-ai-proj-values > div {
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: 8px;
    font-size: 11px;
    align-items: center;
}
.bd-rel-ai-proj-values small { color: #1f7a3d; }
.bd-rel-ai-proj-values i { font-style: normal; color: #8a94a6; }
.bd-rel-ai-projection-conclusion {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr);
    gap: 9px;
    align-items: center;
    margin-top: 11px;
    padding: 10px 12px;
    border-radius: var(--bd-rel-ai-r, 8px);
    background: #edf8f1;
}
.bd-rel-ai-projection-conclusion > span {
    display: grid;
    width: 29px;
    height: 29px;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: #1f7a3d;
    font-size: 14px;
}
.bd-rel-ai-projection-conclusion strong {
    color: #1f7a3d;
    font-size: 11px;
}
.bd-rel-ai-projection-conclusion p {
    margin: 3px 0 0;
    color: #334155;
    font-size: 11px;
    line-height: 1.55;
}
.bd-rel-ai-projection-next {
    display: grid;
    grid-template-columns: 78px minmax(0, 1fr);
    gap: 9px;
    align-items: center;
    margin-top: 11px;
    padding: 10px 12px;
    border: 1px dashed #c9d4f0;
    border-radius: var(--bd-rel-ai-r, 8px);
    background: #f4f5ff;
}
.bd-rel-ai-projection-next b { color: #4c52bc; font-size: 11px; }
.bd-rel-ai-projection-next p {
    margin: 0;
    color: #334155;
    font-size: 11px;
    line-height: 1.55;
}
.bd-rel-ai-footer {
    margin-top: 18px;
    padding: 14px 12px;
    border-top: 1px solid #e6e8ec;
    color: var(--bd-rel-c-muted, #6b7280);
    font-size: 11px;
    line-height: 1.55;
}
.bd-rel-ai-section-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}
@media (min-width: 992px) {
    .bd-rel-ai-section-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.bd-rel-ai-section-grid article {
    padding: 10px;
    border: 1px solid #e6e8ec;
    border-radius: var(--bd-rel-ai-r, 8px);
    background: #fafbfc;
}
.bd-rel-ai-section-grid header {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 8px;
}
.bd-rel-ai-section-grid p { margin: 8px 0 4px; font-size: 12px; }
.bd-rel-ai-section-grid small { color: var(--bd-rel-c-muted, #6b7280); font-size: 11px; }
.bd-rel-ai-section-grid .is-ok { border-color: #9fd4b0; }
.bd-rel-ai-section-grid .is-warn { border-color: #f0c48a; }
.bd-rel-ai-section-grid .is-danger { border-color: #f0b4b4; }

@media (max-width: 767.98px) {
    .bd-rel-ai-overview { grid-template-columns: 1fr; }
    .bd-rel-ai-projection-summary { grid-template-columns: 1fr; }
    .bd-rel-ai-arrow { display: none; }
    .bd-rel-ai-visual-head { flex-direction: column; }
    .bd-rel-ai-topic-head { flex-direction: column; }
    .bd-rel-ai-signal-grid { grid-template-columns: 1fr; }
    .bd-rel-ai-projection-next { grid-template-columns: 1fr; }
    .bd-rel-ai-help > span { left: auto; right: 0; }
    .bd-rel-ai-roadmap-checks li.is-cue { padding-right: 10px; padding-bottom: 28px; }
    .bd-rel-ai-check-cue { top: auto; bottom: 6px; right: 8px; transform: none; }
}

/*
 * 블로그 진단분석: 레이아웃은 그대로 두고 페이지 세로 스크롤바만 표시
 * (기존 @media 의 body::-webkit-scrollbar{display:none},
 *  max-width:1024 의 ::-webkit-scrollbar:vertical{width:0} 을 이 페이지에서만 해제)
 */
html:has(body.bd-blog-diagnosis-page),
body.bd-blog-diagnosis-page {
    overflow-y: auto !important;
}
html:has(body.bd-blog-diagnosis-page)::-webkit-scrollbar,
body.bd-blog-diagnosis-page::-webkit-scrollbar {
    display: block !important;
    -webkit-appearance: auto !important;
    width: 10px !important;
    height: 10px !important;
    background-color: transparent !important;
}
html:has(body.bd-blog-diagnosis-page)::-webkit-scrollbar:vertical,
body.bd-blog-diagnosis-page::-webkit-scrollbar:vertical {
    width: 10px !important;
}
html:has(body.bd-blog-diagnosis-page)::-webkit-scrollbar-thumb,
body.bd-blog-diagnosis-page::-webkit-scrollbar-thumb {
    border-radius: 6px !important;
    background-color: #9979d9 !important;
    -webkit-box-shadow: inset 0 0 2px rgba(90, 40, 216, 0.3) !important;
    border: 0 !important;
}
html:has(body.bd-blog-diagnosis-page)::-webkit-scrollbar-track,
body.bd-blog-diagnosis-page::-webkit-scrollbar-track {
    background-color: transparent !important;
    -webkit-box-shadow: inset 0 0 6px rgba(255, 255, 255, 0.3) !important;
}

/* 블로그 진단분석 전용 가이드/맨위로 버튼 (footer z-index:19999 보다 위) */
body > .bd-diagnosis-backtop,
.bd-diagnosis-backtop,
body > .bd-diagnosis-guidefloat,
.bd-diagnosis-guidefloat {
    position: fixed !important;
    right: 22px !important;
    left: auto !important;
    top: auto !important;
    z-index: 2147483000 !important;
    display: inline-flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    width: 56px !important;
    height: 56px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid #c9d4f0 !important;
    border-radius: 50% !important;
    background: #4c52bc !important;
    color: #fff !important;
    box-shadow: 0 8px 20px rgba(76, 82, 188, 0.35) !important;
    cursor: pointer !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    text-decoration: none !important;
    transition: transform 0.15s ease, opacity 0.15s ease, background 0.15s ease;
}
body > .bd-diagnosis-backtop,
.bd-diagnosis-backtop {
    bottom: 44px !important;
}
body > .bd-diagnosis-guidefloat,
.bd-diagnosis-guidefloat {
    bottom: 112px !important;
}
body > .bd-diagnosis-backtop:hover,
.bd-diagnosis-backtop:hover,
body > .bd-diagnosis-guidefloat:hover,
.bd-diagnosis-guidefloat:hover {
    background: #3a40a8 !important;
    color: #fff !important;
    transform: translateY(-2px);
}
.bd-diagnosis-backtop i,
.bd-diagnosis-backtop .fa,
.bd-diagnosis-backtop .bi,
.bd-diagnosis-guidefloat i,
.bd-diagnosis-guidefloat .fa,
.bd-diagnosis-guidefloat .bi {
    position: static !important;
    display: block !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    top: auto !important;
    font-size: 18px !important;
    line-height: 1 !important;
    color: #fff !important;
    text-align: center;
}
.bd-diagnosis-backtop span,
.bd-diagnosis-guidefloat span {
    display: block !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    color: #fff !important;
}
body > .bd-diagnosis-backtop.is-hidden,
.bd-diagnosis-backtop.is-hidden,
body > .bd-diagnosis-backtop.d-none,
.bd-diagnosis-backtop.d-none,
body > .bd-diagnosis-guidefloat.is-hidden,
.bd-diagnosis-guidefloat.is-hidden,
body > .bd-diagnosis-guidefloat.d-none,
.bd-diagnosis-guidefloat.d-none {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}
@media (max-width: 767.98px) {
    body > .bd-diagnosis-backtop,
    .bd-diagnosis-backtop,
    body > .bd-diagnosis-guidefloat,
    .bd-diagnosis-guidefloat {
        right: 14px !important;
        width: 50px !important;
        height: 50px !important;
    }
    body > .bd-diagnosis-backtop,
    .bd-diagnosis-backtop {
        bottom: 28px !important;
    }
    body > .bd-diagnosis-guidefloat,
    .bd-diagnosis-guidefloat {
        bottom: 90px !important;
    }
}

/* 상단 navbar 가 좌측 메뉴 위에 오도록 */
.navbar.navbar-expand-lg.navbar-white {
    position: relative;
    z-index: 1030;
}



/* 신뢰도 탭 완료 깜빡임 — shell 테두리에만 적용 (버튼 내부 radius 금지) */
@keyframes bdRelTabAttentionPulse {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(76, 82, 188, 0.45);
        border-color: #c9d4f0;
    }
    50% {
        box-shadow: 0 0 0 3px rgba(76, 82, 188, 0.35);
        border-color: #4c52bc;
    }
}
.bd-rel-tab-shell.is-attention {
    animation: bdRelTabAttentionPulse 1s ease-in-out infinite;
    border-radius: var(--bd-rel-r-sm, 6px);
}
#blog_diagnosis_reliability_tab.is-attention {
    animation: none;
    border-radius: 0;
    box-shadow: none;
}

/* 제목별 신뢰도 분석: sticky thead
   - 스크롤 컨테이너에서만 overflow
   - border-collapse:separate 필수 (collapse면 sticky 깨짐)
   - table에 .text-truncate(overflow:hidden) 붙이면 sticky 무력화 */
.bd-rel-title-table-scroll {
    max-height: 320px;
    overflow: auto;
    border: 1px solid #eef0f3;
    border-radius: var(--bd-rel-r, 8px);
}
.bd-rel-title-table {
    border-collapse: separate !important;
    border-spacing: 0;
    width: 100%;
    margin-bottom: 0;
}
.bd-rel-title-table .bd-rel-title-terms-col {
    min-width: 220px;
    width: 32%;
}
.bd-rel-title-table thead th {
    position: sticky;
    top: 0;
    z-index: 3;
    background: rgb(235, 235, 235) !important;
    color: rgb(55, 55, 55) !important;
    font-weight: 700;
    font-size: 12px;
    border-color: #e0e0e0;
    box-shadow: 0 1px 0 #e0e0e0;
}
.bd-rel-title-table .bd-rel-term,
.bd-rel-title-table .bd-rel-badge-ok,
.bd-rel-title-table .bd-rel-badge-info,
.bd-rel-title-table .bd-rel-badge-warn,
.bd-rel-title-table .bd-rel-badge-muted {
    font-size: 10px !important;
    padding: 2px 6px !important;
}

/* 경쟁력/AI 패널 헤더 — 사이트 보라 톤 */
#bd_rel_competitor_panel .bd-rel-comp-panel-head,
#bd_rel_ai_panel .bd-rel-ai-panel-head {
    background: linear-gradient(135deg, #eef0ff 0%, #e3e6fc 55%, #f7f8ff 100%);
    border-color: #a5b4fc;
}
#bd_rel_competitor_panel .bd-rel-comp-panel-head-copy > span,
#bd_rel_ai_panel .bd-rel-ai-panel-head-copy > span,
#bd_rel_competitor_panel .bd-rel-comp-panel-head-copy > span.fs-6-0-7,
#bd_rel_ai_panel .bd-rel-ai-panel-head-copy > span.fs-6-0-7 {
    font-size: calc(1.07rem + 2px) !important;
    font-weight: 800;
    color: #3730a3 !important;
}

/* 경쟁력·AI 액션 버튼 초록 */
.bd-rel-action-btn-green,
#bd_rel_btn_competitor.bd-rel-action-btn-green,
#bd_rel_btn_ai.bd-rel-action-btn-green {
    background-color: #198754 !important;
    border-color: #198754 !important;
    color: #fff !important;
    animation-name: bdRelActionBtnPulseGreen;
}
.bd-rel-action-btn-green:hover,
#bd_rel_btn_competitor.bd-rel-action-btn-green:hover,
#bd_rel_btn_ai.bd-rel-action-btn-green:hover {
    background-color: #157347 !important;
    border-color: #146c43 !important;
    box-shadow: 0 6px 14px rgba(25, 135, 84, 0.28) !important;
}
.bd-rel-action-wrap-comp .bd-rel-action-cue,
.bd-rel-action-wrap-ai .bd-rel-action-cue {
    color: #198754 !important;
}
.bd-rel-action-wrap-comp .bd-rel-action-btn.is-action-active,
.bd-rel-action-wrap-ai .bd-rel-action-btn.is-action-active,
.bd-rel-action-btn-green.is-action-active {
    box-shadow: 0 0 0 3px rgba(25, 135, 84, 0.28);
}
@keyframes bdRelActionBtnPulseGreen {
    0%, 62%, 100% { box-shadow: 0 0 0 0 rgba(25, 135, 84, 0); }
    76% { box-shadow: 0 0 0 4px rgba(25, 135, 84, 0.14), 0 4px 12px rgba(25, 135, 84, 0.2); }
}

/* radius 통일 보강 */
.bd-rel-comp-meter,
.bd-rel-comp-kw-meter,
.bd-rel-comp-topic-table,
.bd-rel-comp-kw-table,
.bd-rel-ai-table,
.bd-rel-evidence-scroll,
.bd-rel-nested-box,
.bd-rel-comp-guide,
.bd-rel-comp-facts span {
    border-radius: var(--bd-rel-r, 8px);
}
.bd-rel-comp-meter,
.bd-rel-comp-meter-fill {
    border-radius: 999px;
}
.bd-rel-comp-topic-head, .bd-rel-comp-kw-head {
    border-radius: var(--bd-rel-r-sm, 6px) var(--bd-rel-r-sm, 6px) 0 0;
}

/* =========================================================
   메인 유튜브 영상 (Facade 패턴) - 2026-08-04
   참조: __ARCHIVE/PLANS/2026-08/02.nside-메인-dash보드-화면변경계획/00.목업.md §4.4
   ========================================================= */
.ns-video {
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
}

.ns-video__frame {
    background: #000;
}

.ns-video__btn {
    display: block;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: none;
    cursor: pointer;
}

.ns-video__thumb {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: filter .2s ease;
}

.ns-video__play {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 64px;
    height: 64px;
    transform: translate(-50%, -50%);
    background: #4c52bc;
    border-radius: 50%;
    /* 썸네일 문구 위에 겹쳐도 버튼이 구분되도록 (시인성 목적) */
    box-shadow: 0 .125rem .75rem rgba(0, 0, 0, .3);
    transition: width .2s ease, height .2s ease, box-shadow .2s ease;
}

.ns-video__play::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 54%;
    transform: translate(-50%, -50%);
    border-style: solid;
    border-width: 11px 0 11px 18px;
    border-color: transparent transparent transparent #fff;
}

.ns-video__btn:hover .ns-video__play,
.ns-video__btn:focus-visible .ns-video__play {
    width: 72px;
    height: 72px;
    box-shadow: 0 .25rem 1.25rem rgba(0, 0, 0, .25);
}

.ns-video__btn:hover .ns-video__thumb {
    filter: brightness(1.06);
}

.ns-video__btn:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 2px;
}

.ns-video__meta {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 14px 16px;
    font-size: 13px;
    border-top: 1px solid #eee;
}

.ns-video__badge {
    padding: 3px 8px;
    font-size: 12px;
    font-weight: 700;
    color: #4c52bc;
    background: rgba(76, 82, 188, .12);
    border-radius: 6px;
}

.ns-video__label {
    min-width: 0;
    overflow: hidden;
    font-weight: 700;
    color: #393941;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ns-video__channel {
    flex: 0 0 auto;
    margin-left: auto;
    padding-left: 8px;
    font-weight: 600;
    color: #4c52bc !important;
    white-space: nowrap;
}

@media (max-width: 767px) {
    .ns-video__play {
        width: 56px;
        height: 56px;
    }

    .ns-video__play::after {
        border-width: 9px 0 9px 15px;
    }

    .ns-video__meta {
        padding: 12px;
        font-size: 12px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ns-video__thumb,
    .ns-video__play {
        transition: none;
    }

    .ns-video__btn:hover .ns-video__play,
    .ns-video__btn:focus-visible .ns-video__play {
        width: 64px;
        height: 64px;
    }
}
