/* =============================================================
   帮助中心页 - PC 端 (lists_single_help.htm / lists_article_help.htm)
   ============================================================= */

body.page-help{
    overflow-x: hidden;
    color: #1A2440;
    background: #F6F9FF;
}
body.page-help .justify-between,
body.page-help .justify-around,
body.page-help .justify-left,
body.page-help .justify-center,
body.page-help .align-center{
    min-width: 0;
}
body.page-help .justify-between > *,
body.page-help .justify-around > *,
body.page-help .justify-left > *,
body.page-help .justify-center > *,
body.page-help .align-center > *{
    min-width: 0;
    flex-shrink: 1;
}
body.page-help .logo,
body.page-help .logo img,
body.page-help .head_lang{
    flex-shrink: 0;
}

:root{
    --help-blue: #2B78F6;
    --help-blue-2: #0A56C9;
    --help-cyan: #22D0FF;
    --help-deep: #061B45;
    --help-text: #1A2440;
    --help-text-2: #3F4F71;
    --help-muted: #7C8AA6;
    --help-line: rgba(43, 120, 246, .12);
    --help-radius: 18px;
    --help-shadow: 0 18px 44px rgba(28, 68, 156, .12);
    --help-grad: linear-gradient(135deg, #2B78F6, #22D0FF);
    --help-glow: 0 0 24px rgba(34, 208, 255, .5);
}

/* =============================================================
   兼容：未升级的旧版 .banner（lists_search / lists_article / view_article / lists_tags / view_product 等）
   ============================================================= */
.banner:not(.help_banner){
    position: relative;
    width: 100%;
    height: 400px;
}
body:not(.page-help) .ban_seabox{
    width: 1000px;
    position: absolute;
    bottom: -80px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 24px;
}
body:not(.page-help) .ban_search{
    display: flex;
    padding: 20px 32px;
    align-items: center;
    gap: 32px;
    align-self: stretch;
    border-radius: 52px;
    background: #FFF;
    box-shadow: 0 20px 56px 0 rgba(88, 134, 252, 0.07);
}
body:not(.page-help) .sea_input{
    color: rgba(0, 0, 0, 0.85);
    text-align: left;
    font-family: PingFang SC, Microsoft YaHei, sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 22px;
    width: 760px;
    height: 32px;
    border: none;
    outline: none;
}
body:not(.page-help) .sea_line{
    width: 1px;
    height: 32px;
    background: #D9D9D9;
}
body:not(.page-help) .search_btn{
    color: #2B78F6;
    text-align: center;
    font-family: PingFang SC, Microsoft YaHei, sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 32px;
    background: transparent;
    border: 0;
    cursor: pointer;
}
body:not(.page-help) .sea_hot{
    color: rgba(37, 53, 84, 0.65);
    text-align: center;
    font-family: PingFang SC, Microsoft YaHei, sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 22px;
}
body:not(.page-help) .sea_hot .hot_key{
    color: rgba(37, 53, 84, 0.65);
}
body:not(.page-help) .ban_cont{
    color: #253554;
    text-align: center;
    font-family: PingFang SC, Microsoft YaHei, sans-serif;
}
body:not(.page-help) .ban_cont h3{
    font-size: 36px;
    font-weight: 600;
    line-height: 44px;
}
body:not(.page-help) .ban_cont p{
    font-size: 18px;
    font-weight: 400;
    line-height: 28px;
}

/* =============================================================
   1. Banner（新版 help_banner，仅 page-help 启用）
   ============================================================= */
.help_banner{
    position: relative;
    width: 100%;
    height: auto;
    min-height: 480px;
    padding: 140px 0 130px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    overflow: hidden;
}
.help_banner_bg{
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 14% 22%, rgba(34, 208, 255, .35), transparent 38%),
        radial-gradient(circle at 86% 78%, rgba(43, 120, 246, .35), transparent 40%),
        linear-gradient(135deg, rgba(6, 27, 69, .92) 0%, rgba(10, 86, 201, .82) 56%, rgba(3, 36, 110, .9) 100%);
    z-index: 0;
}
.help_banner::before{
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, .06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .06) 1px, transparent 1px);
    background-size: 56px 56px;
    -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, .55), rgba(0, 0, 0, .08));
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, .55), rgba(0, 0, 0, .08));
    z-index: 1;
    pointer-events: none;
}
.help_banner::after{
    content: "";
    position: absolute;
    right: -60px;
    top: 70px;
    width: 380px;
    height: 380px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(34, 208, 255, .3), rgba(43, 120, 246, .1) 44%, transparent 70%);
    filter: blur(2px);
    animation: helpPulse 6s ease-in-out infinite;
    z-index: 1;
    pointer-events: none;
}
@keyframes helpPulse{
    0%, 100%{ transform: scale(1); opacity: .85; }
    50%{ transform: scale(1.1); opacity: 1; }
}

.help_banner_inner{
    position: relative;
    z-index: 2;
    width: 1200px;
    max-width: calc(100vw - 32px);
    margin: 0 auto;
    padding: 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px;
    text-align: center;
}
.help_banner .ban_cont{
    width: 100%;
    color: #fff;
    text-align: center;
}
.help_banner_badge{
    display: inline-block;
    margin-bottom: 18px;
    padding: 7px 18px;
    border: 1px solid rgba(34, 208, 255, .42);
    border-radius: 999px;
    background: rgba(34, 208, 255, .12);
    box-shadow: inset 0 0 18px rgba(34, 208, 255, .12), 0 0 26px rgba(34, 208, 255, .14);
    color: rgba(214, 246, 255, .94);
    font-family: Arial, sans-serif;
    font-size: 12px;
    line-height: 1;
    letter-spacing: 2px;
}
.help_banner .ban_cont h3{
    margin: 0;
    color: #fff;
    font-family: Microsoft YaHei UI, Microsoft YaHei, PingFang SC, sans-serif;
    font-size: clamp(30px, 3.2vw, 48px);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -.4px;
    text-shadow: 0 12px 36px rgba(0, 42, 120, .4), 0 0 28px rgba(34, 208, 255, .28);
}
.help_banner .ban_cont p{
    width: auto;
    max-width: 700px;
    margin: 18px auto 0;
    color: rgba(255, 255, 255, .82);
    font-family: PingFang SC, Microsoft YaHei, sans-serif;
    font-size: clamp(14px, 1vw, 17px);
    font-weight: 400;
    line-height: 1.75;
}

/* 搜索区 */
.help_banner .ban_seabox{
    position: static;
    width: 100%;
    max-width: 760px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
    bottom: auto;
}
.help_banner .ban_search{
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    padding: 8px 8px 8px 22px;
    gap: 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .98);
    box-shadow:
        0 24px 60px rgba(8, 38, 102, .35),
        0 0 0 1px rgba(255, 255, 255, .35),
        0 0 0 6px rgba(34, 208, 255, .12);
    transition: box-shadow .3s ease, transform .3s ease;
}
.help_banner .ban_search:hover,
.help_banner .ban_search:focus-within{
    transform: translateY(-2px);
    box-shadow:
        0 26px 60px rgba(8, 38, 102, .4),
        0 0 0 1px rgba(255, 255, 255, .35),
        0 0 0 6px rgba(34, 208, 255, .24);
}
.help_banner .ban_search svg{
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    color: var(--help-blue);
}
.help_banner .ban_search svg path{
    fill: currentColor;
}
.help_banner .sea_input{
    flex: 1 1 auto;
    min-width: 0;
    width: auto;
    height: 44px;
    padding: 0 4px;
    border: 0;
    outline: none;
    background: transparent;
    color: var(--help-text);
    font-family: PingFang SC, Microsoft YaHei, sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 44px;
}
.help_banner .sea_input::placeholder{
    color: var(--help-muted);
    font-weight: 400;
}
.help_banner .sea_line{
    flex-shrink: 0;
    width: 1px;
    height: 28px;
    margin: 0 4px;
    background: linear-gradient(180deg, transparent, rgba(43, 120, 246, .25), transparent);
}
.help_banner .search_btn{
    flex-shrink: 0;
    height: 44px;
    padding: 0 28px;
    border: 0;
    border-radius: 999px;
    background: var(--help-grad);
    color: #fff;
    font-family: PingFang SC, Microsoft YaHei, sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 44px;
    letter-spacing: 1px;
    cursor: pointer;
    box-shadow: 0 10px 26px rgba(43, 120, 246, .35);
    transition: transform .22s ease, box-shadow .22s ease, filter .22s ease;
}
.help_banner .search_btn:hover{
    transform: translateY(-1px);
    box-shadow: 0 14px 30px rgba(43, 120, 246, .5);
    filter: brightness(1.08);
}

.help_banner .sea_hot{
    width: 100%;
    color: rgba(255, 255, 255, .8);
    text-align: center;
    font-family: PingFang SC, Microsoft YaHei, sans-serif;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.7;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.help_banner .sea_hot .sea_hot_label{
    color: rgba(255, 255, 255, .6);
}
.help_banner .sea_hot .hot_key{
    display: inline-flex;
    align-items: center;
    padding: 5px 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .12);
    border: 1px solid rgba(255, 255, 255, .2);
    color: rgba(255, 255, 255, .88);
    font-size: 12px;
    font-weight: 500;
    line-height: 1.4;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    transition: background .22s ease, color .22s ease, transform .22s ease, border-color .22s ease;
}
.help_banner .sea_hot .hot_key:hover{
    background: rgba(255, 255, 255, .25);
    border-color: rgba(34, 208, 255, .55);
    color: #fff;
    transform: translateY(-2px);
}

/* =============================================================
   2. 主区
   ============================================================= */
body.page-help .modbox{
    position: relative;
    width: 100%;
    padding: 64px 0 90px;
    background:
        radial-gradient(circle at 6% 8%, rgba(34, 208, 255, .07), transparent 32%),
        radial-gradient(circle at 96% 4%, rgba(43, 120, 246, .07), transparent 34%),
        linear-gradient(180deg, #F2F7FF 0%, #FAFCFF 100%);
}
body.page-help .modbox::before{
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(43, 120, 246, .04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(43, 120, 246, .04) 1px, transparent 1px);
    background-size: 36px 36px;
    -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, .35), transparent 70%);
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, .35), transparent 70%);
    pointer-events: none;
}
body.page-help .modbox .m12{
    position: relative;
    z-index: 1;
    width: 1200px;
    max-width: calc(100vw - 32px);
    margin: 0 auto;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    box-sizing: border-box;
}

.cont_box{
    position: relative;
    width: 100%;
    display: flex;
    align-items: flex-start;
    gap: 24px;
}

/* 搜索结果页：无侧栏，内容居中、限宽 */
.search_cont_box{
    justify-content: center;
}
.search_cont_box .cont_m{
    width: 100%;
    max-width: 980px;
    flex: 1 1 auto;
}

/* Banner 内高亮关键词 */
.help_search_kw{
    display: inline-block;
    padding: 0 6px;
    color: #fff;
    background: linear-gradient(135deg, rgba(34, 208, 255, .28), rgba(43, 120, 246, .28));
    border-radius: 6px;
    font-weight: 700;
    border-bottom: 2px solid rgba(34, 208, 255, .7);
    word-break: break-word;
}

/* =============================================================
   3. 左侧目录
   ============================================================= */
.cont_l{
    flex-shrink: 0;
    width: 280px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 20px;
    position: sticky;
    top: 90px;
}
.cont_l_box{
    width: 100%;
    padding: 24px;
    box-sizing: border-box;
    border: 1px solid var(--help-line);
    border-radius: var(--help-radius);
    background: rgba(255, 255, 255, .9);
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
    box-shadow: var(--help-shadow);
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 14px;
    position: relative;
    overflow: hidden;
}
.cont_l_box::before{
    content: "";
    position: absolute;
    left: 24px;
    right: 24px;
    top: 0;
    height: 2px;
    border-radius: 999px;
    background: var(--help-grad);
    opacity: .8;
}
.cont_l h1{
    margin: 0;
    padding-bottom: 6px;
    color: var(--help-text);
    font-family: Microsoft YaHei UI, Microsoft YaHei, sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.4;
    display: flex;
    align-items: center;
    gap: 10px;
}
.cont_l h1::before{
    content: "";
    width: 4px;
    height: 18px;
    border-radius: 999px;
    background: var(--help-grad);
    box-shadow: 0 0 10px rgba(34, 208, 255, .5);
}

.cont_l .mdui-panel{
    background: transparent;
    box-shadow: none;
}
.cont_l dl,
.cont_l .mdui-panel-item{
    padding: 0;
    margin: 0;
    display: block;
    align-self: stretch;
    box-shadow: none;
    background: transparent;
    border-bottom: 1px solid rgba(43, 120, 246, .08);
}
.cont_l dl:last-child,
.cont_l .mdui-panel-item:last-child{
    border-bottom: 0;
}

.cont_l dt,
.cont_l .mdui-panel-item-header{
    width: 100%;
    height: auto;
    padding: 12px 4px;
    margin: 0;
    box-sizing: border-box;
    background: transparent;
    color: var(--help-text);
    font-family: PingFang SC, Microsoft YaHei, sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    cursor: pointer;
    transition: color .22s ease;
}
.cont_l dt:hover,
.cont_l .mdui-panel-item-header:hover{
    color: var(--help-blue);
    background: transparent;
}
.cont_l .mdui-panel-item-header:active{
    background-color: transparent;
}
.cont_l dt img,
.cont_l .mdui-panel-item-header img{
    width: 14px;
    height: 14px;
    object-fit: contain;
    transition: transform .3s ease, filter .3s ease;
    filter: opacity(.5);
}
.cont_l .mdui-panel-item-open > .mdui-panel-item-header{
    color: var(--help-blue);
    height: auto;
}
.cont_l .mdui-panel-item-open > .mdui-panel-item-header img{
    transform: rotate(180deg);
    filter: opacity(.9) drop-shadow(0 0 4px rgba(43, 120, 246, .4));
}

.cont_l .qianyan,
.cont_l dl > a.qianyan{
    display: flex;
    align-items: center;
    padding: 12px 4px;
    color: var(--help-text);
    font-family: PingFang SC, Microsoft YaHei, sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    transition: color .22s ease;
}
.cont_l .qianyan:hover{
    color: var(--help-blue);
}
.cont_l .qianyan.cont_arc_active1{
    color: var(--help-blue);
}

/* ----------------------------------------
   折叠/展开 - 纯 CSS max-height 过渡
   - JS 仅做 class toggle（在 help_left.htm 里），不再依赖 mdui-panel 的 jQuery slideToggle
   - !important 强制覆盖 mdui 残留的 inline display:none，保持 dd 始终在 DOM 层 block
   - max-height: 0 + overflow:hidden 实现视觉折叠，过渡 .28s，GPU 友好不会卡
   ---------------------------------------- */
.cont_l dd,
.cont_l .mdui-panel-item-body{
    display: block !important;
    width: 100%;
    margin: 0;
    padding: 0 12px 0 24px;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    box-sizing: border-box;
    position: relative;
    border-radius: 10px;
    font-family: PingFang SC, Microsoft YaHei, sans-serif;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.6;
    transition:
        max-height .3s cubic-bezier(.4, 0, .2, 1),
        opacity .25s ease .03s,
        padding .25s cubic-bezier(.4, 0, .2, 1),
        background .22s ease;
}
.cont_l .mdui-panel-item-open > .mdui-panel-item-body,
.cont_l .mdui-panel-item-open > dd{
    max-height: 40px;
    opacity: 1;
    padding-top: 8px;
    padding-bottom: 8px;
}
/* 圆点用 translateY 垂直居中，与单行文字基线对齐 */
.cont_l .dd_yuan{
    position: absolute;
    left: 10px;
    top: 50%;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: rgba(43, 120, 246, .35);
    transform: translateY(-50%);
    transition: background .22s ease, box-shadow .22s ease, transform .22s ease;
}
/* 单行省略，超出 ... */
.cont_l .cont_arclist{
    display: block;
    width: 100%;
    color: #454861;
    font-size: 13px;
    line-height: 1.6;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: color .22s ease;
}
.cont_l dd:hover,
.cont_l .mdui-panel-item-body:hover{
    background: rgba(43, 120, 246, .06);
}
.cont_l dd:hover .dd_yuan{
    background: var(--help-blue);
    box-shadow: 0 0 8px rgba(43, 120, 246, .5);
    transform: translateY(-50%) scale(1.3);
}
.cont_l dd:hover .cont_arclist{
    color: var(--help-blue);
}

/* 当前文章 active */
.cont_l .cont_arc_active{
    background: linear-gradient(90deg, rgba(43, 120, 246, .14), rgba(34, 208, 255, .04));
    color: var(--help-blue);
}
.cont_l .cont_arc_active::before{
    content: "";
    position: absolute;
    left: 0;
    top: 20%;
    bottom: 20%;
    width: 3px;
    border-radius: 0 2px 2px 0;
    background: var(--help-grad);
    box-shadow: 0 0 8px rgba(34, 208, 255, .55);
}
.cont_l .cont_arc_active .dd_yuan{
    background: var(--help-blue);
    box-shadow: 0 0 8px rgba(43, 120, 246, .5);
}
.cont_l .cont_arc_active .cont_arclist{
    color: var(--help-blue);
    font-weight: 600;
}

/* 折叠开关动画：由 max-height + opacity 过渡完成，mdui 的 JS 已被 capture 阶段 stopImmediatePropagation 接管 */

.cont_l_line{
    height: 1px;
    width: 100%;
    background: rgba(43, 120, 246, .08);
}

/* =============================================================
   4. 中间内容
   ============================================================= */
.cont_m{
    flex: 1 1 0;
    min-width: 0;
    width: auto;
    padding: 32px 36px 40px;
    border-radius: var(--help-radius);
    border: 1px solid var(--help-line);
    background: rgba(255, 255, 255, .94);
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
    box-shadow: var(--help-shadow);
    position: relative;
}
.cont_m::before{
    content: "";
    position: absolute;
    left: 32px;
    right: 32px;
    top: 0;
    height: 2px;
    border-radius: 999px;
    background: var(--help-grad);
    opacity: .8;
}
/* cont_m 内的各模块统一间距 - 用 margin 而不是 flex gap，确保兼容性 */
.cont_m > *{
    width: 100%;
    margin-bottom: 22px;
}
.cont_m > *:last-child{
    margin-bottom: 0;
}
.cont_m > .cont_position{
    margin-bottom: 16px;
}
.cont_m > .cont_tt{
    margin-bottom: 18px;
}

.cont_position{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    padding: 10px 14px;
    border-radius: 12px;
    background: rgba(43, 120, 246, .05);
    color: var(--help-text-2);
    font-family: PingFang SC, Microsoft YaHei, sans-serif;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.6;
}
.cont_position a,
.cont_position .position_l a,
.cont_position .position_l{
    color: var(--help-text-2);
    text-decoration: none;
    transition: color .2s ease;
}
.cont_position a:hover{
    color: var(--help-blue);
}
.cont_position a:last-child{
    color: var(--help-text);
    font-weight: 600;
}

.cont_tt{
    display: block;
    width: 100%;
    margin-top: 4px;
}
.cont_tt > *{
    margin-bottom: 12px;
}
.cont_tt > *:last-child{
    margin-bottom: 0;
}
.cont_tt .cont_title{
    color: var(--help-text);
    font-family: Microsoft YaHei UI, Microsoft YaHei, sans-serif;
    font-size: clamp(22px, 2vw, 30px);
    font-weight: 700;
    line-height: 1.35;
    margin: 0;
    word-break: break-word;
    position: relative;
    padding-left: 16px;
}
.cont_tt .cont_title::before{
    content: "";
    position: absolute;
    left: 0;
    top: .25em;
    bottom: .25em;
    width: 4px;
    border-radius: 999px;
    background: var(--help-grad);
    box-shadow: 0 0 10px rgba(34, 208, 255, .55);
}

.cont_timebox{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px 22px;
    padding: 12px 16px;
    border-radius: 10px;
    background: linear-gradient(90deg, rgba(43, 120, 246, .06), rgba(34, 208, 255, .03));
    color: var(--help-muted);
    font-family: PingFang SC, Microsoft YaHei, sans-serif;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.6;
}
.cont_timebox span{
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.cont_timebox span::before{
    content: "";
    flex-shrink: 0;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--help-grad);
    box-shadow: 0 0 6px rgba(34, 208, 255, .45);
}

.content{
    display: block;
    width: 100%;
    min-height: 60px;
    color: var(--help-text);
    font-family: Microsoft YaHei UI, Microsoft YaHei, PingFang SC, sans-serif;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.85;
    word-break: break-word;
    overflow: visible;
}
.content > *{
    display: block;
}
.content img,
.content video,
.content iframe{
    display: block;
    max-width: 100%;
    height: auto;
}
.content p{
    margin: 0 0 14px;
}
.content h1, .content h2, .content h3, .content h4{
    margin: 28px 0 14px;
    color: var(--help-text);
    font-weight: 700;
    line-height: 1.4;
}
.content h1{ font-size: 22px; }
.content h2{
    font-size: 20px;
    padding-left: 12px;
    position: relative;
}
.content h2::before{
    content: "";
    position: absolute;
    left: 0;
    top: .2em;
    bottom: .2em;
    width: 4px;
    border-radius: 2px;
    background: var(--help-grad);
}
.content h3{ font-size: 17px; }
.content a{
    color: var(--help-blue);
    text-decoration: none;
    border-bottom: 1px dashed rgba(43, 120, 246, .35);
    transition: color .2s ease, border-color .2s ease;
}
.content a:hover{
    color: var(--help-blue-2);
    border-bottom-color: var(--help-blue-2);
}
.content img,
.content video{
    max-width: 100%;
    height: auto;
    border-radius: 12px;
    box-shadow: 0 12px 28px rgba(20, 60, 140, .12);
    margin: 12px 0;
}
.content ul,
.content ol{
    padding-left: 22px;
    margin: 0 0 14px;
}
.content ul li,
.content ol li{
    margin-bottom: 6px;
    line-height: 1.8;
}
.content blockquote{
    margin: 16px 0;
    padding: 14px 18px;
    border-left: 4px solid var(--help-blue);
    border-radius: 0 12px 12px 0;
    background: linear-gradient(90deg, rgba(43, 120, 246, .06), transparent);
    color: var(--help-text-2);
}
.content code{
    padding: 2px 8px;
    border-radius: 6px;
    background: rgba(43, 120, 246, .08);
    color: var(--help-blue-2);
    font-family: Menlo, Consolas, monospace;
    font-size: .92em;
}
.content pre{
    padding: 16px 18px;
    margin: 14px 0;
    overflow-x: auto;
    border-radius: 12px;
    background: #0F1B33;
    color: #E2EAF7;
    line-height: 1.7;
    font-family: Menlo, Consolas, monospace;
    font-size: 13px;
    box-shadow: 0 12px 28px rgba(15, 27, 51, .25);
}
.content pre code{
    padding: 0;
    background: transparent;
    color: inherit;
    font-size: inherit;
}
.content table{
    width: 100%;
    margin: 14px 0;
    border-collapse: collapse;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--help-line);
}
.content table th{
    padding: 10px 14px;
    background: linear-gradient(135deg, rgba(43, 120, 246, .12), rgba(34, 208, 255, .08));
    color: var(--help-text);
    font-weight: 600;
    text-align: left;
    border-bottom: 1px solid var(--help-line);
}
.content table td{
    padding: 10px 14px;
    border-bottom: 1px solid rgba(43, 120, 246, .06);
}
.content table tr:last-child td{ border-bottom: 0; }
.content table tr:nth-child(even) td{
    background: rgba(43, 120, 246, .03);
}

/* =============================================================
   5. 右侧（如有）
   ============================================================= */
.cont_r{
    flex-shrink: 0;
    display: flex;
    width: 250px;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    border-radius: var(--help-radius);
    border: 1px solid var(--help-line);
    background: rgba(255, 255, 255, .94);
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
    box-shadow: var(--help-shadow);
    padding: 22px;
    box-sizing: border-box;
}
.cont_r ol{
    margin: 0;
    padding: 0;
    list-style: none;
    width: 100%;
}
.cont_r ol a{
    display: block;
    padding: 8px 0;
    color: var(--help-text);
    font-family: PingFang SC, Microsoft YaHei, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.7;
    border-bottom: 1px dashed rgba(43, 120, 246, .08);
    transition: color .22s ease, padding .22s ease;
}
.cont_r ol a:hover{
    color: var(--help-blue);
    padding-left: 6px;
}
.c_r_tt{
    width: 100%;
    padding-bottom: 12px;
    margin-bottom: 4px;
    color: var(--help-text);
    font-family: Microsoft YaHei, sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.4;
    border-bottom: 1px solid var(--help-line);
    display: flex;
    align-items: center;
    gap: 10px;
}
.c_r_tt::before{
    content: "";
    width: 4px;
    height: 16px;
    border-radius: 999px;
    background: var(--help-grad);
}
.c_r_c{
    padding-left: 0;
    width: 100%;
}
.fixed_hottest{
    position: fixed;
    top: 84px;
    z-index: 2;
}

/* =============================================================
   6. 兼容 mdui-panel
   ============================================================= */
.mdui-panel-item-header{ padding: 0; }
.mdui-panel-item-header:active{ background-color: transparent; }
.mdui-panel-item-open{ margin: 0; }
.mdui-panel-item{ box-shadow: none; }
.mdui-panel-item-open > .mdui-panel-item-header{ height: auto; }

/* =============================================================
   7. 响应式
   ============================================================= */
@media (max-width: 1180px){
    .help_banner{ padding: 130px 0 110px; min-height: 440px; }
    .cont_l{ width: 240px; }
}

@media (max-width: 980px){
    .help_banner{ padding: 120px 0 90px; min-height: auto; }
    .help_banner::after{ display: none; }
    .help_banner_inner{ gap: 24px; }
    .help_banner .ban_search{ padding: 6px 6px 6px 18px; }
    .help_banner .search_btn{ padding: 0 22px; }

    body.page-help .modbox{ padding: 48px 0 70px; }
    .cont_box{ flex-direction: column; gap: 20px; }
    .cont_l{
        position: static;
        width: 100%;
    }
    .cont_m{ width: 100%; padding: 24px 22px 32px; }
}

@media (max-width: 768px){
    .help_banner{ padding: 100px 0 70px; }
    .help_banner_badge{ font-size: 11px; padding: 6px 14px; }
    .help_banner .ban_search{
        flex-wrap: wrap;
        border-radius: 18px;
        padding: 12px;
    }
    .help_banner .sea_input{ height: 40px; line-height: 40px; flex: 1 1 60%; }
    .help_banner .sea_line{ display: none; }
    .help_banner .search_btn{
        height: 40px;
        line-height: 40px;
        width: 100%;
        flex-basis: 100%;
    }
    .cont_l_box{ padding: 20px; }
    .cont_m{ padding: 22px 18px 28px; }
}