/* 教程导航和帮助中心；不影响商品、订单及支付样式。 */
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.site-header .nav { overflow:visible; }
.site-header .header-order-link { display:inline-flex; align-items:center; justify-content:flex-end; gap:8px; font-size:14px; color:#475569; white-space:nowrap; }
.nav-dropdown { position:relative; flex-shrink:0; border-radius:10px; }
.nav .nav-dropdown.active { background:transparent; box-shadow:none; }
.nav .nav-dropdown-toggle { gap:9px; border-radius:10px; }
.nav .nav-dropdown.is-open>.nav-dropdown-toggle,
.nav .nav-dropdown.active>.nav-dropdown-toggle { background:#f0fdfa; color:#0f766e; box-shadow:none; }
.nav-dropdown-toggle>span { transition:transform .18s; font-size:19px; }
.nav-dropdown.is-open .nav-dropdown-toggle>span { transform:rotate(180deg); }
.nav-dropdown-menu { position:absolute; z-index:50; top:calc(100% + 18px); left:50%; transform:translateX(-50%); width:340px; padding:16px 12px 10px; background:#fff; border:1px solid #edf0f3; border-radius:18px; box-shadow:0 24px 65px rgba(15,23,42,.15); animation:support-menu-in .16s ease-out; }
.nav-dropdown-menu::before { content:""; position:absolute; top:-20px; left:0; right:0; height:21px; }
.nav-dropdown-label { font-size:12px; font-weight:600; color:#94a3b8; margin:2px 12px 14px; letter-spacing:.03em; }
.nav .nav-dropdown-menu>a { display:flex; align-items:center; gap:14px; padding:14px 12px; min-height:82px; color:#334155; white-space:normal; border-radius:12px; box-shadow:none; }
.nav .nav-dropdown-menu>a:hover { background:#f8fafc; color:#0f766e; }
.nav-menu-icon { flex:0 0 44px; height:44px; display:grid; place-items:center; border-radius:14px; color:#64748b; background:#f1f5f9; }
.nav-menu-icon svg { width:23px; height:23px; }
.nav-dropdown-menu b { display:block; margin-bottom:7px; font-size:15px; font-weight:700; }
.nav-dropdown-menu small { display:block; color:#94a3b8; font-size:12px; line-height:1.5; }
.nav .nav-dropdown-menu>.nav-dropdown-feedback { min-height:50px; margin-top:12px; padding-top:14px; border-top:1px solid #f1f5f9; font-size:13px; color:#64748b; }
.nav-dropdown-feedback>span:last-child { margin-left:auto; }
.nav-dropdown-menu a:focus-visible,
.nav-dropdown-toggle:focus-visible { outline:2px solid #0d9488; outline-offset:3px; }
@keyframes support-menu-in { from { opacity:0; margin-top:-5px; } to { opacity:1; margin-top:0; } }

.support-page { --support-accent:#0f766e; width:min(1200px,calc(100% - 40px)); max-width:1200px; margin:0 auto; padding:0 0 72px; color:#0f172a; background:#fff; }
.support-page a { overflow-wrap:anywhere; }
.support-hero { text-align:center; padding:58px 20px 22px; }
.support-hero h1 { margin:0 0 16px; font-size:clamp(32px,4vw,44px); line-height:1.25; letter-spacing:-.04em; font-weight:800; color:#0f172a; }
.support-hero p { margin:0; color:#6b7280; font-size:16px; line-height:1.8; }
.support-search { max-width:570px; margin:0 auto 40px; position:relative; display:flex; align-items:center; }
.support-search>svg { position:absolute; width:20px; height:20px; left:17px; color:#94a3b8; pointer-events:none; }
.support-search input { width:100%; min-height:54px; padding:12px 42px 12px 46px; background:#fff; color:#0f172a; border:1px solid #e5e7eb; border-radius:18px; box-shadow:0 3px 5px rgba(15,23,42,.09); outline:none; font-size:14px; }
.support-search input::placeholder { color:#9ca3af; }
.support-search input:focus { border-color:#2dd4bf; box-shadow:0 0 0 4px #f0fdfa; }
.support-callout { display:block; max-width:664px; margin:6px auto 40px; padding:17px 24px; border:1px solid #fef3c7; border-radius:14px; color:#92400e; background:#fffbeb; }
.support-callout b { display:block; font-size:13px; line-height:1.7; }
.support-callout small { display:block; font-size:12px; margin-top:2px; color:#b7791f; }
.help-callout { background:#f0fdfa; border-color:#ccfbf1; color:#115e59; margin-top:-3px; margin-bottom:24px; }
.help-callout small { color:#0f766e; }
.support-body { display:grid; grid-template-columns:206px minmax(0,1fr); gap:32px; align-items:start; }
.support-sidebar { position:sticky; top:110px; }
.support-group-nav { display:grid; gap:5px; }
.support-group-nav button { display:flex; align-items:center; gap:10px; width:100%; min-height:47px; padding:10px 12px; border:0; border-radius:12px; background:transparent; color:#6b7280; text-align:left; cursor:pointer; font-size:14px; white-space:nowrap; }
.support-group-nav button>span { width:27px; height:27px; display:grid; place-items:center; background:#f8fafc; color:#94a3b8; border-radius:8px; font-size:18px; }
.support-group-nav button>b { margin-left:auto; font-size:12px; font-weight:500; }
.support-group-nav button.active { background:#f0fdfa; color:#0f766e; }
.support-group-nav button.active>span { color:#fff; background:#0f766e; }
.support-group-nav button:hover { background:#f8fafc; transform:none; }
.support-sidebar-note { margin:22px 12px; font-size:12px; color:#94a3b8; line-height:1.8; }
.support-sidebar-note b { color:#64748b; }
.support-results { min-width:0; }
.support-group-section { scroll-margin-top:110px; margin:0 0 42px; }
.support-results-head { display:flex; align-items:center; gap:12px; margin:4px 0 20px; }
.support-icon-badge { width:36px; height:36px; display:grid; place-items:center; flex-shrink:0; border-radius:12px; background:#0f766e; color:#fff; font-size:21px; }
.support-results-head h2 { margin:0 0 1px; color:#0f766e; font-size:18px; line-height:1.4; }
.support-results-head small { color:#94a3b8; font-size:12px; }
.support-question-list { display:grid; gap:10px; }
.support-question { background:#fff; border:1px solid #e5e7eb; border-radius:16px; box-shadow:0 1px 2px rgba(15,23,42,.025); overflow:hidden; }
.support-question summary { display:flex; align-items:center; gap:10px; min-height:52px; padding:16px 20px; font-size:14px; line-height:1.6; cursor:pointer; list-style:none; color:#0f172a; }
.support-question summary::-webkit-details-marker { display:none; }
.support-question summary>b { margin-left:auto; flex-shrink:0; color:#94a3b8; font-size:16px; font-weight:400; transition:transform .18s; }
.support-question[open] summary>b { transform:rotate(180deg); }
.support-question[open] { border-color:#99f6e4; }
.support-answer { border-top:1px solid #f1f5f9; padding:16px 20px 20px; color:#475569; font-size:14px; line-height:1.9; overflow-wrap:anywhere; animation:ux-fade-in .2s ease-out; }
.support-answer p { margin:0 0 10px; }
.support-answer p:last-child { margin-bottom:0; }
.support-answer ol { margin:12px 0; padding-left:23px; }
.support-answer li { padding:3px 0 3px 4px; }
.support-inline-link { color:#0f766e; font-weight:600; font-size:14px; line-height:1.8; }
.support-tag { font-size:11px; padding:2px 7px; border-radius:9px; color:#b45309; background:#fffbeb; flex-shrink:0; font-weight:500; }
.help-page .support-group-nav button.active { background:#fef2f2; color:#dc2626; }
.help-page .support-group-nav button.active>span,
.help-page .support-icon-badge { background:#ef4444; }
.help-page .support-results-head h2 { color:#dc2626; }
.help-page .support-tag { background:#fef2f2; color:#dc6868; }
.support-contact { margin:35px 0 0 238px; border:1px solid #e2e8f0; padding:30px; border-radius:20px; text-align:center; }
.support-contact h2 { margin:0 0 10px; font-size:23px; }
.support-contact p { color:#64748b; line-height:1.8; }
.support-empty { text-align:center; padding:42px 20px; border:1px dashed #cbd5e1; border-radius:16px; background:#f8fafc; }
.support-empty p,.support-search-status { color:#64748b; font-size:14px; line-height:1.8; }
.support-search-status { margin:0 0 18px; }

.guide-page { width:min(1120px,calc(100% - 40px)); max-width:1120px; }
.guide-hero { padding:28px 0 22px; text-align:left; }
.guide-hero h1 { font-size:36px; margin-top:15px; margin-bottom:8px; letter-spacing:-.03em; }
.guide-hero p { font-size:14px; }
.support-device { padding:6px 11px; border-radius:20px; background:#f8fafc; color:#6b7280; font-size:11px; }
.guide-shortcuts { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:0 0 18px; }
.guide-shortcuts>a { display:flex; align-items:flex-start; gap:12px; padding:16px; background:#f6f9f8; border:1px solid #e5e7eb; border-radius:14px; color:#335b54; }
.guide-shortcuts>a>span { display:grid; place-items:center; width:36px; height:36px; background:#fff; border-radius:10px; flex-shrink:0; }
.guide-shortcuts b { font-size:13px; line-height:1.6; }
.guide-shortcuts p { font-size:12px; margin:5px 0 9px; line-height:1.7; color:#6b7280; }
.guide-shortcuts small { font-size:12px; font-weight:600; }
.guide-quick-links { display:flex; align-items:center; gap:24px; padding:0 0 38px; color:#64748b; font-size:13px; }
.guide-quick-links>a:first-child { color:#0f766e; font-weight:700; }
.guide-content-surface { padding-top:24px; position:relative; }
.guide-content-surface::before { content:""; position:absolute; top:0; left:50%; width:100vw; transform:translateX(-50%); height:1px; background:#e5e7eb; }
.guide-video,.guide-step,.guide-contact { border:1px solid #e5e7eb; background:#fff; border-radius:18px; margin-bottom:14px; overflow:hidden; scroll-margin-top:110px; }
.guide-video summary,.guide-step summary,.guide-contact summary { display:flex; gap:16px; align-items:center; padding:20px 18px; list-style:none; cursor:pointer; }
.guide-page summary::-webkit-details-marker { display:none; }
.guide-page summary b { display:block; font-size:17px; line-height:1.6; }
.guide-page summary small { display:block; font-size:13px; line-height:1.8; color:#6b7280; margin-top:3px; }
.guide-page summary>strong { margin-left:auto; color:#9ca3af; font-weight:400; }
.guide-page details[open]>summary>strong { transform:rotate(180deg); }
.guide-video-icon { width:34px; height:38px; flex-shrink:0; display:grid; place-items:center; background:#f8fafc; border-radius:9px; color:#64748b; }
.guide-video-icon svg { width:20px; height:20px; }
.guide-step-number { width:32px; flex-shrink:0; font-size:26px; font-family:Georgia,serif; color:#6b7280; text-align:center; }
.guide-step-content { padding:0 26px 24px; border-top:1px solid #f1f5f9; }
.guide-instruction { display:flex; gap:14px; padding:22px 0 0; }
.guide-instruction>span { width:32px; flex-shrink:0; font-size:12px; color:#0f766e; padding-top:5px; }
.guide-instruction h3 { margin:0 0 7px; font-size:16px; }
.guide-instruction p { margin:0; line-height:1.9; font-size:14px; color:#64748b; }
.guide-tip { padding:14px 16px; margin:20px 0 16px; background:#f0fdfa; border-radius:12px; display:flex; align-items:flex-start; gap:10px; color:#0f766e; }
.guide-tip svg { flex-shrink:0; margin-top:4px; }
.guide-tip p { margin:0; font-size:13px; line-height:1.8; }
.guide-tip a { text-decoration:underline; }
.guide-section-title { display:flex; justify-content:space-between; align-items:center; font-size:12px; color:#94a3b8; margin:20px 0 12px; gap:15px; }
.guide-section-title>a { color:#527a70; }
.guide-mock-window { border:1px solid #e2e8f0; border-radius:15px; max-width:590px; margin:24px auto; background:#fff; box-shadow:0 12px 30px rgba(15,23,42,.05); overflow:hidden; }
.guide-mock-top { padding:12px; display:flex; align-items:center; gap:5px; border-bottom:1px solid #e2e8f0; background:#f8fafc; }
.guide-mock-top i { width:7px; height:7px; background:#cbd5e1; border-radius:50%; }
.guide-mock-top span { color:#94a3b8; font-size:10px; margin:auto; }
.guide-mock-body { padding:24px; }
.guide-mock-plans { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.guide-mock-plans>div { padding:18px 10px; border:1px solid #e2e8f0; border-radius:10px; display:grid; gap:15px; }
.guide-mock-plans>div:first-child { border-color:#5eead4; background:#f0fdfa; }
.guide-mock-plans span { font-size:11px; color:#0f766e; }
.guide-mock-plans strong { font-size:14px; }
.guide-mock-plans i { font-size:10px; color:#94a3b8; font-style:normal; }
.guide-mock-action { display:block; width:fit-content; margin:22px auto 0; background:#0f766e; color:#fff; border-radius:9px; padding:10px 20px; font-size:12px; }
.guide-mock-field { padding:15px; margin-bottom:13px; border:1px solid #e2e8f0; border-radius:10px; display:grid; gap:7px; }
.guide-mock-field span,.guide-mock-field small { color:#94a3b8; font-size:11px; }
.guide-mock-field b { font-size:14px; }
.guide-mock-line { display:flex; justify-content:space-between; gap:12px; padding:12px 0; font-size:12px; border-bottom:1px solid #f1f5f9; color:#64748b; }
.guide-mock-line b { color:#0f766e; }
.guide-mock-success { display:grid; place-items:center; width:50px; height:50px; margin:0 auto 16px; background:#ccfbf1; color:#0f766e; border-radius:50%; font-size:24px; }
.guide-mock-title { display:block; text-align:center; }
.guide-mock-title+p { text-align:center; color:#94a3b8; font-size:12px; }
.guide-video-player { padding:0 22px 20px; border-top:1px solid #f1f5f9; }
.guide-demo-controls { display:flex; align-items:center; flex-wrap:wrap; justify-content:center; gap:12px; }
.guide-demo-controls [role="group"] { display:flex; gap:5px; }
.guide-demo-controls [data-demo-step] { width:33px; height:33px; border:1px solid #e2e8f0; background:#fff; color:#64748b; cursor:pointer; border-radius:8px; }
.guide-demo-controls [data-demo-step].active { color:#0f766e; background:#ccfbf1; border-color:#5eead4; }
.guide-demo-controls [data-demo-status] { font-size:12px; width:100%; color:#64748b; text-align:center; }
.guide-media-caption { font-size:12px; color:#94a3b8; line-height:1.8; margin:15px 0 30px; }
.guide-managed-image{display:block;width:100%;max-height:360px;object-fit:contain;border-radius:14px;margin:0 auto 20px;background:#f8fafc}
.guide-video-player .guide-media-caption { text-align:center; margin-bottom:0; }
.guide-troubles { margin:28px 0; display:grid; gap:10px; }
.guide-troubles h2 { font-size:23px; margin:8px 0; }
.guide-contact>div { border-top:1px solid #f1f5f9; padding:20px; color:#64748b; font-size:14px; line-height:1.8; }
.guide-contact .support-inline-link { margin-left:15px; }
.support-note { display:flex; justify-content:space-between; align-items:center; gap:15px; padding:18px; background:#f8fafc; border:1px solid #e5e7eb; border-radius:14px; font-size:14px; color:#64748b; margin-top:22px; }
.support-note a { color:#0f766e; font-weight:700; }
#testimonials { scroll-margin-top:100px; }

@media (max-width:900px) {
  .site-header .brand { min-width:170px; }
  .site-header .nav { flex-wrap:wrap; gap:3px; overflow:visible; }
  .site-header .header-order-link { display:none; }
  .support-body { grid-template-columns:170px minmax(0,1fr); gap:20px; }
  .support-contact { margin-left:190px; }
}
@media (max-width:640px) {
  .site-header { padding:12px; }
  .site-header .nav { justify-content:center; width:100%; }
  .site-header .nav>a,.site-header .nav-dropdown-toggle { font-size:12px; padding:8px 7px; }
  .nav-dropdown-menu { position:fixed; top:calc(var(--header-bottom, 142px) + 8px); left:12px; right:12px; width:auto; transform:none; max-height:calc(100dvh - var(--header-bottom, 142px) - 24px); overflow-y:auto; border-radius:15px; }
  .nav-dropdown-menu::before { display:none; }
  .nav .nav-dropdown-menu>a { min-height:72px; padding:12px; }
  .support-page { width:calc(100% - 28px); padding-bottom:35px; }
  .support-hero { padding:36px 0 20px; }
  .support-hero h1 { font-size:29px; }
  .support-hero p { font-size:13px; }
  .support-callout { margin-bottom:28px; padding:14px 16px; }
  .support-search { margin-bottom:28px; }
  .support-search input { font-size:13px; border-radius:14px; }
  .support-body { display:block; }
  .support-sidebar { position:static; margin-bottom:24px; }
  .support-group-nav { display:flex; flex-wrap:wrap; gap:7px; }
  .support-group-nav button { width:auto; flex:0 0 auto; font-size:12px; min-height:39px; gap:6px; padding:7px 10px; border:1px solid #edf0f3; background:#fff; }
  .support-group-nav button>span { display:none; }
  .support-group-nav button>b { font-size:10px; color:#94a3b8; }
  .support-sidebar-note { display:none; }
  .support-group-section { scroll-margin-top:155px; }
  .support-question summary { padding:15px; font-size:13px; flex-wrap:wrap; }
  .support-question summary>span:not(.support-tag) { flex:1; min-width:120px; }
  .support-answer { font-size:13px; padding:14px 16px 18px; }
  .support-contact { margin-left:0; padding:24px 18px; }
  .guide-hero { padding-top:25px; }
  .guide-shortcuts { grid-template-columns:1fr; }
  .guide-quick-links { padding-bottom:26px; gap:17px; flex-wrap:wrap; }
  .guide-step-content { padding:0 16px 20px; }
  .guide-page summary { padding:17px 14px; gap:10px; }
  .guide-page summary b { font-size:15px; }
  .guide-page summary small { font-size:12px; }
  .guide-step { scroll-margin-top:155px; }
  .guide-instruction { gap:9px; }
  .guide-instruction h3 { font-size:15px; }
  .guide-instruction p { font-size:13px; }
  .guide-mock-body { padding:15px; }
  .guide-mock-plans { gap:5px; }
  .guide-mock-plans>div { padding:12px 7px; }
  .guide-mock-plans strong { font-size:11px; }
  .guide-mock-plans i { font-size:9px; }
  .support-note { flex-wrap:wrap; font-size:13px; }
  .guide-video-player { padding:0 14px 20px; }
}
@media (prefers-reduced-motion:reduce) { .nav-dropdown-menu,.support-answer { animation:none; } }
