:root {
    --td-brand-color: #2376d1;
    --td-brand-color-hover: #1a66b9;
    --td-brand-color-focus: #dcecff;
    --td-brand-color-active: #175caa;
    --td-brand-color-light: #eff6ff;
    --td-text-color-primary: #1e3043;
    --td-text-color-secondary: #586b7e;
    --td-bg-color-page: #fff;
}

* { box-sizing: border-box; }
html { background: #f2f5f7; }
body { margin: 0; font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif; color: #1e3043; }
[v-cloak] { display: none; }
button { font-family: inherit; }

.help-shell {
    max-width: 800px;
    min-height: 100vh;
    min-height: 100dvh;
    margin: 0 auto;
    background: #fff;
    box-shadow: 0 0 0 1px #e6ebef;
}

.help-shell .t-navbar {
    position: sticky;
    top: 0;
    z-index: 10;
    background: #fff;
    border-bottom: 1px solid #edf0f2;
}
.help-shell .t-navbar__title { font-weight: 650; }
.help-main { padding: 0 20px 36px; }
.help-search { margin: 0; padding: 14px 0 12px; }
.help-search .t-search { padding: 0; background: transparent; }
.help-search .t-search__input-box { min-height: 48px; background: #f4f7f9; border: 1px solid #e5ebef; border-radius: 8px; }
.help-tabs { overflow: hidden; border-bottom: 1px solid #e8edf0; }
.help-tabs .t-tabs__scroll { overflow-x: auto; scrollbar-width: none; }
.help-tabs .t-tabs__scroll::-webkit-scrollbar { display: none; }
.help-tabs .t-tabs__wrapper,
.help-tabs .t-tabs__nav { min-width: 100%; }
.help-tabs .t-tabs__item--evenly { flex: 1 0 0; }
.help-tabs .t-tabs__item { min-width: 0; min-height: 48px; padding-inline: 4px; }
.help-results { min-height: 260px; padding-top: 4px; }
.help-results.is-searching { padding-top: 16px; }
.help-section-label {
    margin: 0 0 10px;
    font-size: 16px;
    line-height: 1.4;
}
.help-collapse { background: #fff; }
.help-collapse .t-collapse-panel { border-bottom: 1px solid #e8edf0; }
.help-collapse .t-collapse-panel__header { min-height: 58px; padding: 15px 2px; font-size: 15px; line-height: 1.45; }
.help-collapse .t-collapse-panel__content { padding-inline: 2px; font-size: 14px; }
.help-answer { padding: 4px 2px 18px; color: #4c6176; line-height: 1.6; }
.help-step { display: flex; align-items: flex-start; gap: 10px; }
.help-step + .help-step { margin-top: 12px; }
.help-step-number { display: grid; flex: none; place-items: center; width: 20px; height: 20px; margin-top: 1px; border-radius: 50%; background: #eaf3fe; color: #2376d1; font-size: 12px; font-weight: 600; line-height: 1; }
.help-answer-note { margin: 16px 0 0; padding: 11px 12px; border-radius: 6px; background: #f2f6f8; color: #586b7e; }
.help-empty { min-height: 200px; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 8px; color: #718395; text-align: center; }
.help-empty strong { color: #354b61; font-size: 14px; }
.help-empty span { font-size: 12px; }
.help-support {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 26px 0 0;
    padding: 12px 16px;
    border: 1px solid #e2e9ee;
    border-radius: 8px;
    background: rgba(255, 255, 255, .97);
}
.help-support > span { min-width: 0; color: #586b7e; font-size: 14px; }
.help-support .t-button { flex: none; gap: 6px; }
.help-support .t-button,
.help-service-close { min-height: 44px; }
.help-service-popup.t-popup { width: min(calc(100vw - 32px), 380px); border-radius: 8px; }
.help-service { position: relative; padding: 27px 22px 22px; text-align: center; }
.help-service-close { position: absolute; top: 8px; right: 8px; width: 44px; height: 44px; display: grid; place-items: center; padding: 0; border: 0; background: transparent; color: #506984; cursor: pointer; }
.help-service-kicker { color: #25845f; font-size: 12px; font-weight: 600; }
.help-service h2 { margin: 9px 0 14px; font-size: 21px; }
.help-service img { display: block; width: min(100%, 260px, max(140px, calc(100dvh - 250px))); height: auto; aspect-ratio: 1; margin: 0 auto; object-fit: contain; border: 1px solid #e3ebf2; border-radius: 8px; -webkit-touch-callout: default; }
.help-service p { margin: 12px 0 0; color: #386790; font-size: 13px; }
.help-shell :focus-visible, .help-service-close:focus-visible { outline: 2px solid #2376d1; outline-offset: 2px; }
@media (max-width: 767px) {
    html { background: #fff; }
    .help-shell { box-shadow: none; }
    .help-main { padding: 0 16px calc(90px + env(safe-area-inset-bottom)); }
    .help-tabs {
        position: sticky;
        top: 49px;
        z-index: 8;
        background: #fff;
    }
    .help-support {
        position: fixed;
        z-index: 9;
        left: 50%;
        bottom: 0;
        width: min(100%, 800px);
        margin: 0;
        padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
        border-width: 1px 0 0;
        border-radius: 0;
        box-shadow: 0 -3px 12px rgba(29, 54, 77, .05);
        transform: translateX(-50%);
    }
}
@media (max-width: 360px) {
    .help-main { padding-inline: 12px; }
    .help-support { gap: 10px; padding-inline: 12px; }
    .help-support > span { font-size: 13px; }
    .help-support .t-button { min-width: 88px; padding-inline: 12px; }
}

@media (min-width: 768px) {
    .help-shell .t-navbar { padding-inline: 18px; }
    .help-shell .t-navbar__title { font-size: 18px; }
    .help-main { padding: 22px 48px 52px; }
    .help-collapse .t-collapse-panel__header { min-height: 58px; }
    .help-support { position: static; }
}