/* 原帮助中心样式。 */
#help-page{
      color-scheme: light;
      --ink: #333333;
      --muted: #666666;
      --soft-muted: #767f8d;
      --line: #e5e7eb;
      --paper: #ffffff;
      --canvas: #f5f7fa;
      --brand: #0052d9;
      --brand-deep: #003eb1;
      --brand-pale: #e8f2ff;
      --teal: #16b7a2;
      --green: #6bbf52;
      --orange: #f4a62a;
      --violet: #8770e9;
      --shadow: 0 16px 48px rgba(55, 91, 145, .08);
      font-family: "Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", Arial, sans-serif;
    }
#help-page *{ box-sizing: border-box; }
#help-page{ scroll-behavior: smooth; }
#help-page{ margin: 0; color: var(--ink); background: var(--paper); font-size: 16px; line-height: 1.6; }
#help-page button,#help-page input{ font: inherit; }
#help-page button{ color: inherit; }
#help-page a{ color: inherit; text-decoration: none; }
#help-page button:focus-visible,#help-page input:focus-visible,#help-page a:focus-visible{ outline: 3px solid rgba(0, 82, 217, .28); outline-offset: 2px; }
#help-page [hidden]{ display: none !important; }


#help-page .brand-mark{ position: relative; display: grid; width: 34px; height: 34px; place-items: center; border-radius: 8px; background: var(--brand); color: white; }
#help-page .brand-mark::before,#help-page .brand-mark::after{ position: absolute; content: ""; width: 10px; height: 10px; border: 2px solid white; border-radius: 3px; transform: rotate(45deg); }
#help-page .brand-mark::before{ left: 7px; top: 10px; }
#help-page .brand-mark::after{ right: 7px; bottom: 10px; }
#help-page .brand-name{ font-size: 18px; line-height: 1.2; font-weight: 700; }
#help-page .brand-caption{ display: block; margin-top: 3px; color: var(--muted); font-size: 12px; font-weight: 400; }


#help-page .header-menu-button{ display: none; }
#help-page .search-shell{ position: relative; width: 100%; }
#help-page .search-form{ display: flex; align-items: center; width: 100%; height: 48px; gap: 10px; padding: 0 8px 0 16px; border: 1px solid #e4eaf3; border-radius: 8px; background: white; box-shadow: 0 9px 28px rgba(48, 83, 130, .09); }
#help-page .search-form:focus-within{ border-color: #91b7f4; box-shadow: 0 0 0 3px rgba(0, 82, 217, .1); }
#help-page .search-form input{ width: 100%; min-width: 0; padding: 0; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 16px; }
#help-page .search-form input::placeholder{ color: #a4adba; }
#help-page .search-icon{ flex: 0 0 auto; color: #8997a9; }
#help-page .search-submit{ display: grid; flex: 0 0 auto; width: 34px; height: 34px; place-items: center; border: 0; border-radius: 6px; background: var(--brand); color: white; cursor: pointer; }
#help-page .search-submit:hover{ background: var(--brand-deep); }
#help-page .search-results{ position: absolute; z-index: 50; top: calc(100% + 8px); left: 0; right: 0; max-height: min(65vh, 460px); overflow: auto; overscroll-behavior: contain; border: 1px solid var(--line); border-radius: 8px; background: white; box-shadow: var(--shadow); }
#help-page .search-results-head{ padding: 10px 14px 7px; color: var(--soft-muted); font-size: 13px; }
#help-page .search-result{ display: flex; width: 100%; flex-direction: column; align-items: flex-start; gap: 2px; padding: 9px 14px; border: 0; background: white; text-align: left; cursor: pointer; }
#help-page .search-result:hover,#help-page .search-result:focus-visible{ background: #f4f8ff; }
#help-page .search-result-title{ font-size: 15px; font-weight: 600; overflow-wrap: anywhere; }
#help-page .search-result-meta{ color: var(--muted); font-size: 13px; }
#help-page .search-empty{ padding: 15px; color: var(--muted); font-size: 14px; }
#help-page mark{ padding: 0; background: #e8f2ff; color: var(--brand-deep); font-weight: 700; }
#help-page .search-all{ position: sticky; bottom: 0; display: flex; width: 100%; justify-content: center; align-items: center; gap: 6px; padding: 12px 16px; border: 0; border-top: 1px solid var(--line); background: #f8fbff; color: var(--brand); cursor: pointer; font-size: 14px; }
#help-page .search-page{ max-width: 1000px; min-height: calc(100vh - 68px); margin: 0 auto; padding: 40px 28px 70px; }
#help-page .search-page h1{ margin: 0 0 8px; font-size: 28px; }
#help-page .search-query{ margin: 0 0 26px; color: var(--muted); overflow-wrap: anywhere; }
#help-page .search-page-list{ border-top: 1px solid var(--line); }
#help-page .search-page-result{ display: grid; width: 100%; grid-template-columns: minmax(0, 1fr) 20px; align-items: center; gap: 12px; padding: 19px 12px; border: 0; border-bottom: 1px solid var(--line); background: white; text-align: left; cursor: pointer; }
#help-page .search-page-result:hover{ background: #f7faff; }
#help-page .search-page-result .search-result-title{ display: block; margin-bottom: 5px; font-size: 17px; overflow-wrap: anywhere; }
#help-page .search-page-result .search-result-meta{ display: block; font-size: 14px; }
#help-page .search-page-empty{ padding: 48px 20px; border: 1px dashed #d7e1ed; border-radius: 8px; background: #fafcff; text-align: center; }
#help-page .search-page-empty h2{ margin: 0 0 8px; font-size: 20px; }
#help-page .search-page-empty p{ margin: 0 0 18px; color: var(--muted); }
#help-page .hc-hero{
      position: relative;
      overflow: visible;
      display: flex;
      align-items: center;
      padding: 50px 24px 57px;
      background: #eef4ff url("../images/help-ae24589f86.svg") center / cover no-repeat;
    }
#help-page .hc-hero-inner{ position: relative; width: 100%; max-width: 900px; margin: 0 auto; text-align: center; }

#help-page .hero-title{ margin: 0 0 7px; color: #17243a; font-size: 34px; line-height: 1.3; font-weight: 700; }
#help-page .hc-hero-subtitle{ margin: 0 0 24px; color: var(--muted); font-size: 16px; }
#help-page .hero-search{ max-width: 600px; margin: 0 auto; }
#help-page .hero-search .search-form{ height: 54px; padding-left: 19px; border-color: rgba(255,255,255,.9); border-radius: 28px; box-shadow: 0 12px 28px rgba(80, 111, 164, .12); }
#help-page .hero-search .search-submit{ width: 38px; height: 38px; border-radius: 50%; }
#help-page .hero-quick{ display: flex; justify-content: center; flex-wrap: wrap; gap: 8px 18px; margin-top: 15px; color: var(--muted); font-size: 14px; }
#help-page .hero-quick button{ padding: 0; border: 0; background: none; color: var(--brand); cursor: pointer; }
#help-page .hero-quick button:hover{ color: var(--brand-deep); text-decoration: underline; }
#help-page .home-main{ max-width: 1180px; margin: 0 auto; padding: 38px 24px 68px; }
#help-page .section-block{ margin-bottom: 43px; }
#help-page .text-action{ display: inline-flex; align-items: center; gap: 5px; padding: 4px 0; border: 0; background: none; color: var(--brand); font-size: 14px; white-space: nowrap; cursor: pointer; }
#help-page .text-action:hover{ color: var(--brand); }
#help-page .starter-list{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 28px; margin: 0; padding: 8px 20px; border: 1px solid #e1eaf7; border-radius: 8px; background: #f8fbff; list-style: none; }
#help-page .starter-list > li{ min-width: 0; border-bottom: 1px solid #e8eef7; }
#help-page .starter-list > li:nth-last-child(-n + 2){ border-bottom: 0; }
#help-page .starter-entry{ display: grid; width: 100%; min-height: 58px; grid-template-columns: 8px minmax(0, 1fr) 16px; align-items: center; gap: 12px; padding: 14px 8px; border: 0; border-radius: 5px; background: transparent; text-align: left; cursor: pointer; }
#help-page .starter-entry:hover{ background: #eaf3ff; color: var(--brand-deep); }
#help-page .starter-entry-bullet{ width: 6px; height: 6px; justify-self: center; border-radius: 50%; background: var(--brand); }
#help-page .starter-entry-title{ font-size: 16px; line-height: 1.6; overflow-wrap: anywhere; }
#help-page .starter-entry-arrow{ display: grid; place-items: center; color: #8c9cb2; }
#help-page .tutorial-section{ margin-top: 38px; padding-top: 29px; border-top: 1px solid #eef1f6; }
#help-page .tutorial-section:first-of-type{ margin-top: 0; padding-top: 0; border-top: 0; }
#help-page .tutorial-section-head{ display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 15px; }
#help-page .tutorial-section-title{ display: flex; align-items: center; gap: 10px; margin: 0; font-size: 20px; line-height: 1.35; }
#help-page .section-symbol{ display: grid; width: 34px; height: 34px; place-items: center; border-radius: 9px; background: var(--brand-pale); color: var(--brand); }
#help-page .topic-tabs-shell{ display: flex; min-width: 0; align-items: center; gap: 8px; }
#help-page .topic-tabs{ display: flex; min-width: 0; flex: 1; gap: 8px; overflow-x: auto; padding: 0 0 8px; scroll-behavior: smooth; scrollbar-color: #d5dfed transparent; scrollbar-width: thin; }
#help-page .topic-scroll-button{ display: grid; flex: 0 0 32px; width: 32px; height: 32px; place-items: center; border: 1px solid var(--line); border-radius: 6px; background: #fff; color: #536274; cursor: pointer; }
#help-page .topic-scroll-button:hover:not(:disabled){ border-color: #b9d0f9; background: var(--brand-pale); color: var(--brand-deep); }
#help-page .topic-scroll-button:disabled{ color: #aeb8c5; cursor: default; opacity: .6; }
#help-page .topic-scroll-button[data-topic-scroll="left"] svg{ transform: rotate(180deg); }
#help-page .topic-tab{ display: inline-flex; min-width: 148px; min-height: 38px; flex: 0 0 auto; align-items: center; justify-content: center; gap: 7px; padding: 8px 16px; border: 1px solid var(--line); border-radius: 6px; background: #fff; color: #435369; font-size: 15px; font-weight: 600; white-space: nowrap; cursor: pointer; }
#help-page .topic-tab:hover{ border-color: #c8d9f7; color: var(--brand-deep); }
#help-page .topic-tab[aria-selected="true"]{ border-color: #b9d0f9; background: var(--brand-pale); color: var(--brand-deep); }
#help-page .topic-tab svg{ color: var(--brand); }
#help-page .topic-tabs[data-topic-section="video"] .topic-tab svg,#help-page .topic-tabs[data-topic-section="image"] .topic-tab svg,#help-page .topic-tabs[data-topic-section="faq"] .topic-tab svg{ color: #666; }
#help-page .topic-tab-image-icon{ display: block; width: 18px; height: 18px; flex: 0 0 auto; object-fit: contain; }
#help-page .topic-panel{ padding-top: 8px; }
#help-page .home-tutorial-list{ border-top: 1px solid #e9edf3; }
#help-page .home-tutorial-list--columns{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 32px; }
#help-page .home-tutorial-list--columns .home-tutorial-row{ grid-template-columns: minmax(0, 1fr) 24px; column-gap: 20px; padding-right: 8px; padding-left: 8px; }
#help-page .home-tutorial-row{ min-height: 62px; padding-top: 12px; padding-bottom: 12px; }
#help-page .home-tutorial-row .browse-row-title{ font-size: 14px; font-weight: 500; }
#help-page .topic-more{ display: inline-flex; align-items: center; gap: 5px; margin-top: 12px; padding: 5px 0; border: 0; background: transparent; color: var(--brand); font-size: 14px; cursor: pointer; }
#help-page .tutorial-section-head .topic-more{ flex: 0 0 auto; margin-top: 0; }
#help-page .topic-more:hover{ color: var(--brand-deep); }
#help-page .video-tutorial-grid{ display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
#help-page .video-tutorial-card{ display: flex; min-width: 0; flex-direction: column; padding: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 7px; background: #fff; text-align: left; cursor: pointer; }
#help-page .video-tutorial-card:hover{ border-color: #b9d0f9; box-shadow: 0 5px 15px rgba(48, 75, 120, .07); }
#help-page .video-card-poster{ position: relative; display: block; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; background: #e8f2ff; }
#help-page .video-card-poster img{ display: block; width: 100%; height: 100%; object-fit: cover; }
#help-page .video-card-play{ position: absolute; inset: 0; display: grid; place-items: center; color: #fff; }
#help-page .video-card-play svg{ width: 40px; height: 40px; padding: 10px; border-radius: 50%; background: rgba(0, 82, 217, .92); }
#help-page .video-card-status{ position: absolute; right: 8px; bottom: 8px; padding: 3px 6px; border-radius: 3px; background: rgba(255, 255, 255, .93); color: #4a607a; font-size: 12px; line-height: 1.4; }
#help-page .video-card-title{ display: block; min-height: 58px; padding: 11px 13px 13px; color: #333; font-size: 15px; line-height: 1.5; font-weight: 600; overflow-wrap: anywhere; }
#help-page .doc-shell{ display: grid; max-width: 1280px; min-height: calc(100vh - 68px); grid-template-columns: 320px minmax(0, 1fr); margin: 0 auto; }
#help-page .toc-side{ position: sticky; top: 68px; display: flex; height: calc(100vh - 68px); flex-direction: column; border-right: 1px solid var(--line); background: #fff; }
#help-page .toc-head{ padding: 21px 19px 15px; border-bottom: 1px solid #edf0f5; }
#help-page .toc-heading-row{ display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
#help-page .toc-title{ margin: 0; font-size: 18px; font-weight: 700; }
#help-page .toc-scroll{ overflow: auto; flex: 1; padding: 10px 10px 28px; scrollbar-color: #d5dfed transparent; scrollbar-width: thin; }
#help-page .toc-group{ margin-bottom: 10px; }
#help-page .toc-group > summary{ display: flex; min-height: 44px; align-items: center; gap: 8px; padding: 7px 10px; border-radius: 5px; background: #f3f6fa; color: #28384c; font-size: 16px; font-weight: 700; cursor: pointer; list-style: none; }
#help-page .toc-group > summary::-webkit-details-marker{ display: none; }
#help-page .toc-chevron{ margin-left: auto; color: #98a4b3; transform: rotate(90deg); transition: transform .15s ease; }
#help-page .toc-group:not([open]) .toc-chevron{ transform: none; }
#help-page .toc-group > summary:hover{ background: #f1f5fb; }
#help-page .toc-category{ margin: 6px 0 3px; }
#help-page .toc-category-row{ display: flex; min-height: 38px; align-items: center; gap: 4px; }
#help-page .toc-category-button{ display: flex; width: 100%; min-width: 0; min-height: 38px; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 10px; border: 0; border-radius: 5px; background: transparent; color: #435369; text-align: left; font-size: 14px; font-weight: 600; cursor: pointer; }
#help-page .toc-category-button:hover{ background: #f3f7fd; color: var(--brand-deep); }
#help-page .toc-category-button > svg{ flex-shrink: 0; color: #98a4b3; transition: transform .15s ease; }
#help-page .toc-category.is-expanded .toc-category-button > svg{ transform: rotate(90deg); }
#help-page .toc-links{ display: grid; gap: 1px; margin: 0; padding: 1px 0 5px; list-style: none; }
#help-page .toc-link{ display: block; width: 100%; padding: 7px 10px; border: 0; border-radius: 5px; background: transparent; color: #536274; text-align: left; overflow-wrap: anywhere; font-size: 14px; line-height: 1.5; cursor: pointer; }
#help-page .toc-links-direct{ padding: 4px 0 8px; }
#help-page .toc-link:hover{ color: var(--brand-deep); background: #f3f7fd; }
#help-page .toc-link.is-active{ background: var(--brand-pale); }
#help-page .toc-backdrop{ display: none; }
#help-page .doc-main{ min-width: 0; padding: 28px clamp(26px, 5vw, 70px) 70px; }
#help-page .doc-topline{ display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 20px; }
#help-page .breadcrumbs{ display: flex; min-width: 0; align-items: center; gap: 7px; color: var(--soft-muted); font-size: 14px; }
#help-page .breadcrumbs button{ max-width: 240px; padding: 0; overflow: hidden; border: 0; background: none; color: #748399; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; }
#help-page .breadcrumbs button:hover{ color: var(--brand); }
#help-page .breadcrumbs span:last-child{ overflow: hidden; color: #4b596d; text-overflow: ellipsis; white-space: nowrap; }
#help-page .doc-title{ max-width: 820px; margin: 0 0 8px; font-size: 30px; line-height: 1.4; font-weight: 700; overflow-wrap: anywhere; }
#help-page .doc-update{ margin: 0 0 22px; color: #718096; font-size: 14px; line-height: 1.5; }
#help-page .article-divider{ height: 1px; margin: 25px 0; border: 0; background: var(--line); }
#help-page .article-section-title{ margin: 0 0 13px; font-size: 20px; font-weight: 700; }
#help-page .step-list{ display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
#help-page .step-item{ padding: 13px 0; border-bottom: 1px solid #edf0f5; }
#help-page .step-item h3{ margin: 0 0 3px; font-size: 16px; font-weight: 700; }
#help-page .step-item p{ margin: 0; color: #526174; font-size: 15px; white-space: pre-line; }
#help-page .step-figure,#help-page .video-cover,#help-page .video-player-shell{ max-width: 780px; margin: 16px 0 6px; overflow: hidden; border: 1px solid #dfe7f2; border-radius: 8px; background: #f3f7fd; }
#help-page .step-figure img,#help-page .video-cover img{ display: block; width: 100%; height: auto; }
#help-page .step-figure figcaption,#help-page .video-cover figcaption{ padding: 8px 12px; border-top: 1px solid #e5eaf2; background: #fff; color: #6b7685; font-size: 13px; }
#help-page .video-cover{ margin: 0 0 12px; }
#help-page .video-player-shell{ margin: 0 0 28px; background: #141b25; }
#help-page .video-player{ display: block; width: 100%; aspect-ratio: 16 / 9; background: #141b25; }
#help-page .video-status{ max-width: 780px; margin: 0 0 28px; color: #69778a; font-size: 14px; }
#help-page .faq-answer{ margin-top: 22px; padding: 16px 18px; border: 1px solid #e8edf4; border-radius: 7px; background: #fbfcfe; }
#help-page .faq-answer h2{ margin: 0 0 6px; font-size: 16px; }
#help-page .faq-answer p{ margin: 0; color: #526174; font-size: 15px; }
#help-page .related-list{ display: flex; flex-wrap: wrap; gap: 7px; }
#help-page .related-link{ max-width: 100%; padding: 6px 10px; border: 1px solid var(--line); border-radius: 5px; background: white; color: #526174; overflow-wrap: anywhere; font-size: 14px; cursor: pointer; }
#help-page .related-link:hover{ border-color: #c8d9f7; color: var(--brand-deep); }
#help-page .article-tools{ display: flex; align-items: center; gap: 8px; margin-top: 28px; padding-top: 17px; border-top: 1px solid var(--line); }
#help-page .tool-button{ display: inline-flex; min-height: 36px; align-items: center; gap: 6px; padding: 6px 10px; border: 1px solid var(--line); border-radius: 5px; background: white; color: #526174; font-size: 14px; cursor: pointer; }
#help-page .tool-button:hover,#help-page .tool-button[aria-pressed="true"]{ border-color: #b9d0f9; background: #f4f8ff; color: var(--brand-deep); }
#help-page .tool-spacer{ flex: 1; }
#help-page .feedback-status{ color: var(--muted); font-size: 13px; }
#help-page .article-pagination{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 28px; }
#help-page .article-page-link{ display: flex; min-width: 0; flex-direction: column; gap: 5px; padding: 16px; border: 1px solid var(--line); border-radius: 8px; background: #fff; text-align: left; cursor: pointer; }
#help-page .article-page-link:hover{ border-color: #a9c5f2; background: #f8fbff; }
#help-page .article-page-label{ display: flex; align-items: center; gap: 4px; color: var(--muted); font-size: 13px; }
#help-page .article-page-title{ color: var(--brand-deep); font-size: 15px; overflow-wrap: anywhere; }
#help-page .article-page-link.previous .article-page-label svg{ transform: rotate(180deg); }
#help-page .article-page-link.next{ grid-column: 2; align-items: flex-end; text-align: right; }
#help-page .browse-title{ margin: 0 0 18px; font-size: 27px; line-height: 1.4; }
#help-page .browse-list{ border-top: 1px solid #e9edf3; }
#help-page .browse-row{ display: grid; width: 100%; grid-template-columns: minmax(0, 1fr) 22px; gap: 12px; align-items: center; padding: 13px 4px; border: 0; border-bottom: 1px solid #edf0f4; background: transparent; text-align: left; cursor: pointer; }
#help-page .browse-row:hover .browse-row-title{ color: var(--brand-deep); }
#help-page .browse-row-title{ display: block; overflow-wrap: anywhere; color: #333; font-size: 16px; font-weight: 600; }
#help-page .browse-arrow{ color: #a3afbd; }
#help-page .empty-article{ padding: 50px 12px; color: var(--muted); text-align: center; }
#help-page .hc-source-footer{ padding: 21px 24px; border-top: 1px solid var(--line); background: #fafbfd; color: var(--muted); text-align: center; font-size: 12px; }
#help-page .hc-source-footer strong{ color: #5b6c82; font-weight: 600; }
#help-page .toast{ position: fixed; z-index: 100; left: 50%; bottom: 25px; max-width: calc(100vw - 32px); padding: 10px 15px; transform: translate(-50%, 12px); border-radius: 6px; background: rgba(28, 40, 57, .94); color: white; opacity: 0; pointer-events: none; font-size: 14px; transition: opacity .18s ease, transform .18s ease; }
#help-page .toast.is-visible{ transform: translate(-50%, 0); opacity: 1; }
@media (max-width: 1040px){
#help-page .home-main{ padding-right: 22px; padding-left: 22px; }
#help-page .video-tutorial-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
#help-page .doc-shell{ grid-template-columns: 290px minmax(0, 1fr); }
#help-page .doc-main{ padding-right: 34px; padding-left: 34px; }

    }
@media (max-width: 760px){





#help-page .header-menu-button{ display: inline-flex; align-items: center; gap: 5px; padding: 7px 8px; border: 1px solid var(--line); border-radius: 5px; background: white; color: #52647a; font-size: 14px; cursor: pointer; }
#help-page .hc-hero{ padding: 37px 18px 42px; }
#help-page .hero-title{ font-size: 28px; }
#help-page .hc-hero-subtitle{ max-width: 370px; margin-right: auto; margin-left: auto; font-size: 15px; }
#help-page .home-main{ padding: 28px 16px 45px; }
#help-page .starter-list{ grid-template-columns: 1fr; padding: 5px 12px; }
#help-page .starter-list > li:nth-last-child(2){ border-bottom: 1px solid #e8eef7; }
#help-page .starter-entry{ min-height: 54px; gap: 10px; padding: 12px 4px; }
#help-page .topic-tabs{ gap: 6px; }
#help-page .home-tutorial-list--columns{ grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 24px; }
#help-page .search-page{ padding: 26px 18px 50px; }
#help-page .search-page h1{ font-size: 24px; }

#help-page .article-pagination{ gap: 9px; }
#help-page .article-page-link{ padding: 12px; }
#help-page .video-tutorial-grid{ gap: 10px; }
#help-page .video-card-title{ padding: 9px 10px 11px; font-size: 14px; }
#help-page .doc-shell{ display: block; min-height: calc(100vh - 62px); }
#help-page .toc-side{ position: fixed; z-index: 61; top: 62px; left: 0; width: min(340px, 88vw); height: calc(100dvh - 62px); transform: translateX(-102%); transition: transform .2s ease; box-shadow: 10px 0 32px rgba(25, 46, 78, .08); }
#help-page .toc-side.is-open{ transform: translateX(0); }
#help-page .toc-backdrop{ position: fixed; z-index: 60; inset: 62px 0 0; display: block; border: 0; background: rgba(17, 30, 49, .28); }
#help-page .doc-main{ padding: 21px 18px 52px; }
#help-page .doc-topline{ align-items: flex-start; margin-bottom: 16px; }
#help-page .breadcrumbs{ flex: 1; gap: 4px; font-size: 12px; }
#help-page .breadcrumbs button{ max-width: 76px; }
#help-page .doc-title{ font-size: 23px; }
#help-page .tool-button{ padding: 6px 8px; }
#help-page .tool-button span{ display: none; }
#help-page .feedback-status{ max-width: 92px; }
#help-page .browse-title{ font-size: 23px; }
#help-page .hc-source-footer{ padding: 17px 16px; }

    }
@media (max-width: 420px){
#help-page .brand-mark{ width: 30px; height: 30px; }
#help-page .brand-name{ font-size: 16px; }
#help-page .brand-caption{ font-size: 12px; }



#help-page .video-card-title{ min-height: 54px; }
#help-page .home-tutorial-list--columns{ grid-template-columns: 1fr; }

#help-page .hero-title{ font-size: 26px; }
#help-page .hero-quick{ gap: 6px 12px; }

    }
@media print{
#help-page .toc-side,#help-page .article-tools,#help-page .article-pagination,#help-page .hc-source-footer,#help-page .toast{display:none !important}
#help-page .doc-shell{ display: block; }
#help-page .doc-main{ padding: 0; }
#help-page .step-figure,#help-page .video-cover{ break-inside: avoid; }

    }

  
/* 官网共用导航、1260px 内容区与教程阅读布局。 */
#help-page{--brand:#527dff;--brand-deep:#3f66e8;--brand-pale:#edf3ff;font-family:inherit;min-height:70vh}


#help-page .hc-hero{height:420px;overflow:visible}
#help-page .hc-hero-inner{height:auto;display:block}
#help-page .home-main{max-width:1308px}
#help-page .doc-shell{max-width:1260px;min-height:calc(100vh - var(--header-height))}
#help-page .search-page{max-width:1260px}
#help-page .toc-side{top:var(--header-height);height:calc(100dvh - var(--header-height))}
#help-page .step-item>div{min-width:0}
#help-page .step-item p{white-space:pre-line;overflow-wrap:anywhere}
#help-page .step-item a{color:var(--brand-deep);text-decoration:underline;text-underline-offset:3px}
#help-page .article-intro{color:var(--muted);line-height:1.9;white-space:pre-line;margin:20px 0 28px;overflow-wrap:anywhere}
#help-page .hc-code{padding:20px;border-radius:8px;background:#f5f7fb;border:1px solid #e7ecf4;white-space:pre;overflow:auto;font:13px/1.8 Consolas,monospace;tab-size:2}
#help-page .hc-image-trigger{display:block;width:100%;padding:0;border:0;background:transparent;cursor:zoom-in}
#help-page .hc-image-trigger img{display:block;width:100%;height:auto}
#help-page #hc-image-dialog{position:fixed;inset:0;width:calc(100vw - 24px);max-width:none;height:calc(100vh - 24px);height:calc(100dvh - 24px);max-height:none;margin:auto;padding:64px 0 0;border:0;border-radius:0;overflow:hidden;background:transparent;box-shadow:none;color:#fff}
#help-page #hc-image-dialog:not([open]){display:none}
#help-page #hc-image-dialog[open]{display:flex;flex-direction:column}
#help-page #hc-image-dialog::backdrop{background:rgba(10,18,32,.92);backdrop-filter:blur(3px)}
#help-page .hc-image-scroll{display:flex;flex:1;min-width:0;min-height:0;width:100%;overflow:auto;overscroll-behavior:contain;touch-action:pan-x pan-y pinch-zoom;-webkit-overflow-scrolling:touch}
#help-page .hc-image-scroll img{display:block;flex:none;width:auto;height:auto;max-width:100%;max-height:100%;margin:auto;object-fit:contain;cursor:default}
#help-page .hc-image-scroll.is-zoomed img{max-width:none;max-height:none}
#help-page .hc-image-close,#help-page .hc-image-zoom{position:absolute;z-index:2;top:8px;min-width:44px;min-height:44px;padding:0 14px;border:1px solid rgba(255,255,255,.28);border-radius:8px;background:#253247;color:#fff;line-height:1.4;cursor:pointer;touch-action:manipulation}
#help-page .hc-image-close{right:0;width:44px;height:44px;padding:0;font-size:28px}
#help-page .hc-image-zoom{left:0;font-size:14px}
#help-page .hc-image-zoom:disabled{opacity:.55;cursor:default}
#help-page .hc-image-close:focus-visible,#help-page .hc-image-zoom:focus-visible{outline:2px solid #8bc0ff;outline-offset:2px}
#help-page .hc-image-status{position:absolute;inset:64px 0 0;display:flex;align-items:center;justify-content:center;margin:0;padding:24px;text-align:center;color:#fff;font-size:14px;line-height:1.8;pointer-events:none}
@media(max-width:760px){#help-page #hc-image-dialog{padding-top:calc(60px + env(safe-area-inset-top,0px));padding-bottom:env(safe-area-inset-bottom,0px)}#help-page .hc-image-close,#help-page .hc-image-zoom{top:calc(4px + env(safe-area-inset-top,0px))}}
@media(max-width:760px){
 
 
 #help-page .toc-side{top:var(--header-height);height:calc(100dvh - var(--header-height))}
 #help-page .toc-backdrop{top:var(--header-height)}
 
 #help-page .step-item{gap:10px}
 #help-page .hc-code{padding:12px;font-size:12px}
}

/* 保留文档自己的段落、标题与编号，不再包裹生成的步骤结构。 */
#help-page .hc-document{color:#526174;font-size:16px;line-height:1.9;overflow-wrap:anywhere}
#help-page .hc-document p{margin:22px 0;white-space:pre-wrap}
#help-page .hc-document h2{margin:32px 0 16px;color:var(--ink);font-size:20px;line-height:1.6}
#help-page .hc-document a{color:var(--brand-deep);text-decoration:underline;text-underline-offset:3px}
#help-page .hc-document .step-figure{margin:20px 0 28px}
#help-page .video-tutorial-card[data-article-id="guide-041"] .video-card-poster{background:#e0efff}
#help-page .video-tutorial-card[data-article-id="guide-041"] .video-card-poster img{object-fit:contain}
#help-page .search-page>.breadcrumbs{margin-bottom:24px}
#help-page .doc-topline .header-menu-button{flex-shrink:0}

/* Programmatic route focus: the result region has an accessible name. */
#help-page .search-page:focus{outline:none}

@media(max-width:760px){
  #help-page .hc-hero{height:auto;min-height:360px;padding:44px 18px;background-position:46% center}
}

/* 视频网格：电脑四列，平板两列，手机一列。 */
@media(max-width:1100px){#help-page .video-tutorial-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){#help-page .video-tutorial-grid{grid-template-columns:1fr}}

/* 手机搜索区与文章路径：减少留白，保留完整路径词组及独立目录按钮。 */
@media(max-width:760px){
  body #help-page .hc-hero{display:block;height:auto;min-height:0;margin-top:0;border-top:0;padding:32px 16px 28px}
  body #help-page .hero-title{font-size:28px;line-height:1.4;margin-bottom:8px}
  body #help-page .hc-hero-subtitle{max-width:540px;margin:0 auto 20px;font-size:14px;line-height:1.8}
  body #help-page .hero-search .search-form{height:52px;padding-left:16px;padding-right:6px;gap:10px}
  body #help-page .hero-search .search-submit{width:40px;height:40px}
  body #help-page .hero-quick{align-items:center;gap:4px 12px;margin-top:12px;font-size:12px;line-height:1.8}
  body #help-page .hero-quick button{display:inline-flex;align-items:center;min-height:32px}
  #help-page .doc-topline{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:10px;margin-bottom:18px}
  body #help-page .breadcrumbs{min-width:0;flex-wrap:wrap;align-items:center;gap:4px 7px;font-size:12px;line-height:1.8}
  body #help-page .breadcrumbs>a,body #help-page .breadcrumbs>span{flex:0 0 auto;max-width:100%;white-space:normal;word-break:normal;overflow-wrap:anywhere}
  body #help-page .breadcrumbs>span:last-child{overflow:visible;text-overflow:clip;white-space:normal}
  #help-page .doc-topline .header-menu-button{min-width:68px;min-height:40px;align-self:start;justify-content:center;white-space:nowrap;padding:8px 10px;font-size:13px}
  #help-page .doc-title{line-height:1.5}
  #help-page .doc-update{font-size:12px;line-height:1.8;margin-bottom:18px;overflow-wrap:anywhere}
  #help-page .doc-main,#help-page .hdd-article-body{min-width:0}
  #help-page .hdd-article-body iframe{max-width:100%}
  #help-page .article-pagination{grid-template-columns:minmax(0,1fr);gap:12px}
  body #help-page .article-pagination .next{text-align:left}
  #help-page .article-pagination a{overflow-wrap:anywhere}
  #help-page .topic-scroll-button{flex-basis:36px;width:36px;height:36px}
  #help-page .hdd-toc-close{min-width:40px;min-height:40px}
}
@media(max-width:600px){
  #help-page .home-tutorial-list--columns{grid-template-columns:minmax(0,1fr)}
  #help-page .home-tutorial-row{min-height:54px}
}
@media(max-width:360px){body #help-page .hero-title{font-size:25px}}
