:root{
  --text:#17191d;
  --muted:#6f7682;
  --soft:#9299a5;
  --line:#e8eaee;
  --blue:#2563eb;
  --page:#fff;
  --panel:#f7f8fa;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--text);
  font:15px/1.7 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  background:var(--page);
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}

.site-header{
  height:66px;
  border-bottom:1px solid var(--line);
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 max(24px,calc((100vw - 1120px)/2));
  position:sticky;
  top:0;
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(16px);
  z-index:20;
}
.site-brand{display:flex;align-items:center;gap:10px}
.site-brand span{
  width:30px;height:30px;border-radius:9px;
  background:#15171a;color:#fff;
  display:grid;place-items:center;
  font-size:14px;font-weight:700;
}
.site-brand strong{font-size:14px;letter-spacing:-.01em}
.site-header nav{
  display:flex;align-items:center;gap:28px;
  font-size:13px;color:#777e89;
}
.site-header nav a{transition:.18s}
.site-header nav a.active,
.site-header nav a:hover{color:#111318}

/* HELP */
.help-home{min-height:calc(100vh - 130px)}

.help-hero{
  background:
    radial-gradient(circle at 50% -10%,rgba(61,110,255,.08),transparent 46%),
    #fafbfc;
  border-bottom:1px solid #f0f1f3;
}
.help-hero-inner{
  max-width:900px;
  margin:0 auto;
  padding:72px 24px 68px;
  text-align:center;
}
.help-kicker{
  display:inline-flex;
  align-items:center;
  margin:0 0 10px;
  font-size:12px;
  font-weight:650;
  color:#5d6571;
  letter-spacing:.02em;
}
.help-hero h1{
  margin:0;
  font-size:42px;
  line-height:1.2;
  letter-spacing:-.045em;
  font-weight:700;
}
.help-subtitle{
  margin:14px auto 28px;
  max-width:620px;
  color:#777f8a;
  font-size:15px;
}
.help-search{
  width:100%;
  max-width:680px;
  margin:0 auto;
  display:flex;
  align-items:center;
  gap:8px;
  padding:6px;
  background:#fff;
  border:1px solid #dfe3e9;
  border-radius:14px;
  box-shadow:0 10px 30px rgba(22,28,45,.06);
}
.help-search:focus-within{
  border-color:#b9c7ed;
  box-shadow:0 12px 32px rgba(37,99,235,.09);
}
.help-search input{
  min-width:0;
  flex:1;
  height:46px;
  border:0;
  outline:0;
  padding:0 16px;
  color:#20232a;
  background:transparent;
  font:inherit;
}
.help-search input::placeholder{color:#a0a6b0}
.help-search button{
  height:42px;
  min-width:76px;
  border:0;
  border-radius:9px;
  padding:0 18px;
  background:#181a1f;
  color:#fff;
  font:inherit;
  font-size:13px;
  cursor:pointer;
}
.help-search button:hover{background:#000}

.help-browser{
  max-width:1080px;
  margin:0 auto;
  padding:48px 24px 88px;
}
.help-section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  margin-bottom:18px;
}
.help-section-head p{
  margin:0 0 2px;
  color:#949aa4;
  font-size:11px;
  font-weight:650;
  letter-spacing:.08em;
}
.help-section-head h2{
  margin:0;
  font-size:22px;
  letter-spacing:-.025em;
}
.help-section-head>span{
  color:#9aa0aa;
  font-size:12px;
}

.help-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}
.help-card{
  position:relative;
  min-height:226px;
  padding:24px 25px 19px;
  border:1px solid var(--line);
  border-radius:15px;
  background:#fff;
  transition:border-color .18s,box-shadow .18s,transform .18s;
}
.help-card:hover{
  border-color:#d8dde5;
  box-shadow:0 10px 26px rgba(20,25,36,.045);
  transform:translateY(-1px);
}
.help-card-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;
  padding-bottom:18px;
}
.help-card-title{
  min-width:0;
  display:flex;
  align-items:flex-start;
  gap:14px;
}
.help-card-index{
  flex:none;
  width:34px;
  height:34px;
  border-radius:9px;
  display:grid;
  place-items:center;
  background:#f1f4fa;
  color:#526078;
  font-size:11px;
  font-weight:700;
  letter-spacing:.04em;
}
.help-card h2{
  margin:-2px 0 3px;
  font-size:17px;
  line-height:1.5;
  letter-spacing:-.015em;
}
.help-card-title p{
  margin:0;
  color:#8a919c;
  font-size:12px;
  line-height:1.55;
}
.help-count{
  flex:none;
  padding-top:2px;
  color:#a0a6af;
  font-size:11px;
}
.help-links{
  border-top:1px solid #f0f1f3;
  padding-top:6px;
}
.help-links a{
  min-height:38px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:6px 2px;
  color:#565d68;
  font-size:13px;
  border-bottom:1px solid #f5f5f6;
}
.help-links a:last-child{border-bottom:0}
.help-links a span{
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.help-links a b{
  flex:none;
  color:#b4bac3;
  font-weight:400;
  transition:.18s;
}
.help-links a:hover{color:#15171a}
.help-links a:hover b{
  color:#15171a;
  transform:translateX(2px);
}
.help-empty{
  padding:13px 2px 4px;
  color:#b0b5bd;
  font-size:12px;
}

.help-results{
  max-width:900px;
  margin:0 auto;
  padding:42px 24px 90px;
}
.section-title{
  display:flex;
  justify-content:space-between;
  align-items:end;
  margin-bottom:14px;
}
.section-title h2{
  margin:0;
  font-size:20px;
  letter-spacing:-.02em;
}
.section-title span{color:#949aa5;font-size:12px}
.article-list a{
  display:flex;
  justify-content:space-between;
  gap:30px;
  border-top:1px solid var(--line);
  padding:18px 0;
}
.article-list strong{font-size:14px}
.article-list p{
  margin:4px 0 0;
  color:#818792;
  font-size:13px;
}
.article-list>a>span{color:#b0b5bd}

/* BLOG */
.eyebrow{
  font-size:11px;
  letter-spacing:.14em;
  color:#8d94a1;
  font-weight:700;
}
.blog-home{max-width:1160px;margin:auto;padding:0 24px 80px}
.blog-hero{padding:76px 0 48px;border-bottom:1px solid var(--line)}
.blog-hero h1{
  font-size:46px;line-height:1.18;
  letter-spacing:-.045em;
  margin:10px 0 0;
  max-width:740px;
}
.blog-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:32px 20px;
  padding-top:36px;
}
.blog-card{display:block}
.blog-cover{
  aspect-ratio:16/10;
  background:#f2f3f5;
  border-radius:12px;
  overflow:hidden;
}
.blog-cover img{
  width:100%;height:100%;
  object-fit:cover;
  transition:.25s;
}
.blog-card:hover .blog-cover img{transform:scale(1.02)}
.cover-placeholder{
  height:100%;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,#eef2ff,#f7f7f8);
  font-weight:700;
  color:#8a93a5;
}
.blog-card-body{padding:14px 3px}
.blog-meta{font-size:11px;color:#989eaa}
.blog-card h2{font-size:20px;line-height:1.45;margin:7px 0 6px}
.blog-card p{
  margin:0;
  color:#737a86;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

/* ARTICLE */
.article-wrap{
  max-width:820px;
  margin:auto;
  padding:46px 24px 100px;
}
.breadcrumbs{
  font-size:12px;
  color:#969ca8;
  display:flex;
  gap:8px;
  margin-bottom:31px;
}
.breadcrumbs a:hover{color:#111}
.article-wrap article>h1{
  font-size:38px;
  line-height:1.25;
  letter-spacing:-.035em;
  margin:0 0 10px;
}
.article-meta{
  font-size:12px;
  color:#9a9faa;
  margin-bottom:28px;
}
.article-cover{
  width:100%;
  border-radius:14px;
  margin:24px 0 34px;
}
.article-content{
  font-size:16px;
  line-height:1.85;
  color:#30343a;
}
.article-content h2{
  font-size:27px;
  line-height:1.35;
  margin:46px 0 15px;
  color:#15171a;
  letter-spacing:-.025em;
}
.article-content h3{
  font-size:20px;
  margin:34px 0 10px;
}
.article-content p{margin:14px 0}
.article-content img{
  max-width:100%;
  border-radius:12px;
  display:block;
  margin:30px auto;
}
.article-content figure{margin:30px 0}
.article-content figcaption{
  text-align:center;
  color:#999fa9;
  font-size:12px;
}
.article-content blockquote{
  border-left:3px solid #9db9ff;
  background:#f7f9ff;
  padding:10px 18px;
  margin:24px 0;
  color:#5c6573;
}
.article-content a{
  color:#245fd4;
  text-decoration:underline;
}

.site-footer{
  border-top:1px solid var(--line);
  text-align:center;
  padding:30px 20px;
  color:#a0a5af;
  font-size:11px;
}
.empty-public{text-align:center;padding:80px;color:#999}

@media(max-width:850px){
  .help-grid{grid-template-columns:1fr}
  .blog-grid{grid-template-columns:1fr 1fr}
  .blog-hero h1{font-size:38px}
}
@media(max-width:600px){
  .site-header{height:60px;padding:0 18px}
  .site-header nav{gap:17px}
  .site-header nav a:last-child{display:none}

  .help-hero-inner{padding:52px 20px 48px}
  .help-hero h1{font-size:31px}
  .help-subtitle{font-size:13px;margin-top:11px}
  .help-search{border-radius:12px}
  .help-search button{min-width:64px;padding:0 14px}
  .help-browser{padding:36px 18px 70px}
  .help-card{padding:21px 19px}
  .help-card-title{gap:11px}

  .blog-grid{grid-template-columns:1fr}
  .blog-hero h1,
  .article-wrap article>h1{font-size:31px}
  .article-content{font-size:15px}
}


/* ==========================================================
   XJ official website shell
   All selectors are namespaced to avoid CMS style collisions
   ========================================================== */

.xj-site-header{
  height:72px;
  position:fixed;
  top:0;
  left:0;
  right:0;
  width:100%;
  z-index:100;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.86);
  -webkit-backdrop-filter:blur(22px);
  backdrop-filter:blur(22px);
  border-bottom:1px solid rgba(230,232,245,.78);
  box-shadow:0 10px 32px rgba(30,41,59,.08);
}

.xj-site-header-spacer{
  height:72px;
}

.xj-site-nav-inner{
  width:min(1180px,calc(100% - 48px));
  height:100%;
  margin:0 auto;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
}

.xj-site-brand{
  display:flex;
  align-items:center;
  gap:10px;
  flex:none;
  font-weight:800;
  font-size:20px;
  line-height:1;
  letter-spacing:-.02em;
  color:#111827;
  white-space:nowrap;
}

.xj-site-brand-mark{
  width:34px;
  height:34px;
  flex:0 0 34px;
  border-radius:10px;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
  box-shadow:0 10px 24px rgba(91,75,255,.18);
}

.xj-site-brand-mark img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.xj-site-nav-links{
  display:flex;
  align-items:center;
  gap:34px;
  margin-left:auto;
  margin-right:auto;
  font-size:14px;
  color:#1f2937;
  font-weight:600;
}

.xj-site-nav-links a{
  position:relative;
  color:#1f2937;
  white-space:nowrap;
  transition:color .22s ease;
}

.xj-site-nav-links a::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-6px;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,#5b4bff,#2562ee);
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .22s ease;
}

.xj-site-nav-links a:hover,
.xj-site-nav-links a.xj-site-current{
  color:#5b4bff;
}

.xj-site-nav-links a:hover::after,
.xj-site-nav-links a.xj-site-current::after{
  transform:scaleX(1);
}

.xj-site-nav-actions{
  flex:none;
  display:flex;
  align-items:center;
  gap:16px;
  font-size:14px;
  font-weight:700;
}

.xj-site-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:14px 24px;
  border-radius:999px;
  white-space:nowrap;
  font-weight:800;
  transition:.2s ease;
}

.xj-site-btn-primary{
  color:#fff;
  border:0;
  background:linear-gradient(135deg,#5b4bff,#2562ee);
  box-shadow:0 18px 42px rgba(91,75,255,.28);
}

.xj-site-btn-primary:hover{
  color:#fff;
  transform:translateY(-2px);
  box-shadow:0 18px 42px rgba(91,75,255,.18);
}


/* footer */

.xj-site-footer{
  width:100%;
  background:#071023;
  color:#cbd5e1;
  padding:32px 0;
}

.xj-site-footer-inner{
  width:min(1180px,calc(100% - 48px));
  margin:0 auto;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
}

.xj-site-footer-left{
  min-width:0;
}

.xj-site-footer-brand{
  display:flex;
  align-items:center;
  gap:10px;
  color:#cbd5e1;
  font-weight:800;
  font-size:20px;
  letter-spacing:-.02em;
}

.xj-site-footer-brand-mark{
  width:30px;
  height:30px;
  flex:0 0 30px;
  border-radius:9px;
  display:block;
  overflow:hidden;
  background:#fff;
  border:1px solid rgba(255,255,255,.08);
}

.xj-site-footer-brand-mark img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.xj-site-footer-note{
  margin-top:14px;
  max-width:720px;
  color:#64748b;
  font-size:13px;
  line-height:1.8;
}

.xj-site-footer-info{
  margin-top:18px;
  color:#64748b;
  font-size:13px;
  line-height:1.9;
  display:flex;
  flex-wrap:wrap;
  gap:8px 18px;
  align-items:center;
}

.xj-site-footer-info a{
  margin:0;
  color:#64748b;
}

.xj-site-footer-info a:hover{
  color:#fff;
}

.xj-site-footer-nav{
  flex:none;
  display:flex;
  align-items:center;
}

.xj-site-footer-nav a{
  margin-left:22px;
  color:#cbd5e1;
  font-size:14px;
  white-space:nowrap;
}

.xj-site-footer-nav a:hover{
  color:#fff;
}


@media(max-width:980px){
  .xj-site-nav-links{
    display:none;
  }

  .xj-site-footer-inner{
    display:block;
  }

  .xj-site-footer-nav{
    margin-top:18px;
    flex-wrap:wrap;
    gap:10px 18px;
  }

  .xj-site-footer-nav a{
    margin:0;
  }
}

@media(max-width:760px){
  .xj-site-header{
    height:60px;
  }

  .xj-site-header-spacer{
    height:60px;
  }

  .xj-site-nav-inner{
    width:100%;
    padding:0 14px;
    gap:10px;
  }

  .xj-site-brand{
    min-width:0;
    gap:8px;
    font-size:16px;
  }

  .xj-site-brand-mark{
    width:30px;
    height:30px;
    flex-basis:30px;
    border-radius:9px;
  }

  .xj-site-nav-actions{
    gap:0;
  }

  .xj-site-btn{
    width:auto;
    padding:9px 13px;
    font-size:13px;
    box-shadow:0 10px 22px rgba(91,75,255,.18);
  }

  .xj-site-footer{
    padding:28px 0;
  }

  .xj-site-footer-inner{
    width:min(100% - 28px,1180px);
  }

  .xj-site-footer-brand{
    font-size:17px;
  }

  .xj-site-footer-note,
  .xj-site-footer-info{
    font-size:12px;
  }

  .xj-site-footer-nav{
    margin-top:16px;
    gap:10px 16px;
  }

  .xj-site-footer-nav a{
    font-size:13px;
  }
}


/* ==========================================================
   Compact help center homepage
   ========================================================== */

.help-hero-inner{
  max-width:760px;
  padding:34px 24px 32px;
}

.help-kicker{
  margin:0 0 5px;
  font-size:11px;
  color:#8b919b;
  font-weight:650;
  letter-spacing:.04em;
}

.help-hero h1{
  margin:0 0 18px;
  font-size:30px;
  line-height:1.2;
  letter-spacing:-.035em;
  font-weight:700;
}

.help-subtitle{
  display:none;
}

.help-search{
  max-width:620px;
  padding:5px;
  border-radius:12px;
  box-shadow:0 7px 22px rgba(22,28,45,.045);
}

.help-search input{
  height:40px;
  padding:0 14px;
  font-size:14px;
}

.help-search button{
  height:38px;
  min-width:68px;
  padding:0 15px;
  border-radius:8px;
  font-size:12px;
}

.help-browser{
  max-width:1040px;
  padding:25px 24px 42px;
}

.help-section-head{
  margin-bottom:12px;
}

.help-section-head p{
  display:none;
}

.help-section-head h2{
  font-size:18px;
}

.help-section-head>span{
  font-size:11px;
}

.help-grid{
  gap:12px;
}

.help-card{
  min-height:172px;
  padding:18px 20px 15px;
  border-radius:13px;
}

.help-card-top{
  gap:14px;
  padding-bottom:12px;
}

.help-card-title{
  gap:11px;
}

.help-card-index{
  width:30px;
  height:30px;
  border-radius:8px;
  font-size:10px;
}

.help-card h2{
  margin:-2px 0 1px;
  font-size:15px;
}

.help-card-title p{
  font-size:11px;
  line-height:1.45;
}

.help-count{
  font-size:10px;
}

.help-links{
  padding-top:4px;
}

.help-links a{
  min-height:30px;
  padding:3px 1px;
  font-size:12px;
}

.help-empty{
  padding:10px 1px 2px;
  font-size:11px;
}

@media(max-width:600px){
  .help-hero-inner{
    padding:28px 18px 26px;
  }

  .help-hero h1{
    font-size:25px;
    margin-bottom:15px;
  }

  .help-browser{
    padding:22px 16px 40px;
  }

  .help-card{
    min-height:auto;
    padding:17px;
  }
}


/* ==========================================================
   Help Center — Linear inspired
   ========================================================== */

.help-linear-home{
  width:min(1080px,calc(100% - 48px));
  margin:0 auto;
  padding:54px 0 72px;
  color:#17171a;
}

.help-linear-top{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:40px;
  padding-bottom:30px;
  border-bottom:1px solid #ececef;
}

.help-linear-heading h1{
  margin:0;
  font-size:28px;
  line-height:1.2;
  font-weight:650;
  letter-spacing:-.035em;
  color:#161618;
}

.help-linear-heading p{
  margin:7px 0 0;
  font-size:13px;
  color:#8a8a92;
}

.help-linear-search{
  width:310px;
  height:40px;
  padding:0 13px;
  display:flex;
  align-items:center;
  gap:9px;
  background:#fafafa;
  border:1px solid #e3e3e7;
  border-radius:9px;
  transition:.16s ease;
}

.help-linear-search:focus-within{
  background:#fff;
  border-color:#c9c5f7;
  box-shadow:0 0 0 3px rgba(91,75,255,.07);
}

.help-linear-search svg{
  width:16px;
  height:16px;
  flex:none;
  fill:none;
  stroke:#92929a;
  stroke-width:1.7;
  stroke-linecap:round;
}

.help-linear-search input{
  width:100%;
  min-width:0;
  padding:0;
  border:0;
  outline:0;
  background:transparent;
  color:#252529;
  font:13px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
}

.help-linear-search input::placeholder{
  color:#9b9ba3;
}


/* content */

.help-linear-content{
  padding-top:27px;
}

.help-linear-section-label{
  margin-bottom:15px;
  color:#9b9ba3;
  font-size:11px;
  line-height:1;
  font-weight:600;
  letter-spacing:.04em;
}

.help-linear-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:46px;
  row-gap:0;
}

.help-linear-topic{
  min-width:0;
  padding:22px 0 21px;
  border-top:1px solid #ededf0;
}

.help-linear-topic:nth-child(-n+2){
  border-top:0;
}

.help-linear-topic-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}

.help-linear-topic-name{
  display:flex;
  align-items:center;
  min-width:0;
  gap:10px;
}

.help-linear-dot{
  width:7px;
  height:7px;
  flex:0 0 7px;
  border-radius:2px;
  background:#665cf6;
  box-shadow:0 0 0 4px rgba(102,92,246,.07);
}

.help-linear-topic h2{
  margin:0;
  color:#202024;
  font-size:15px;
  line-height:1.4;
  font-weight:620;
  letter-spacing:-.015em;
}

.help-linear-count{
  flex:none;
  color:#aaaab1;
  font-size:11px;
}

.help-linear-desc{
  margin:7px 0 13px 17px;
  color:#898991;
  font-size:12px;
  line-height:1.55;
}

.help-linear-links{
  margin-left:17px;
}

.help-linear-links a{
  min-height:29px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:4px 6px 4px 0;
  border-radius:5px;
  color:#56565d;
  font-size:12px;
  transition:.14s ease;
}

.help-linear-links a span{
  min-width:0;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.help-linear-links a b{
  opacity:0;
  flex:none;
  color:#756bf5;
  font-size:12px;
  font-weight:400;
  transform:translateX(-3px);
  transition:.14s ease;
}

.help-linear-links a:hover{
  color:#29282e;
}

.help-linear-links a:hover b{
  opacity:1;
  transform:translateX(0);
}

.help-linear-empty{
  display:block;
  padding:4px 0;
  color:#b5b5bb;
  font-size:11px;
}


/* search results */

.help-linear-results{
  padding-top:28px;
  max-width:760px;
}

.help-linear-results-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  padding-bottom:13px;
}

.help-linear-results-head span{
  color:#9999a1;
  font-size:11px;
}

.help-linear-results-head h2{
  margin:3px 0 0;
  font-size:17px;
  font-weight:600;
}

.help-linear-results-head small{
  color:#aaaab1;
  font-size:11px;
}

.help-linear-result-list{
  border-top:1px solid #ececef;
}

.help-linear-result-list>a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  padding:16px 2px;
  border-bottom:1px solid #efeff1;
}

.help-linear-result-list strong{
  color:#303036;
  font-size:13px;
  font-weight:580;
}

.help-linear-result-list p{
  margin:4px 0 0;
  color:#8c8c94;
  font-size:12px;
}

.help-linear-result-list>a>span{
  color:#aaaab1;
}

.help-linear-no-result{
  padding:42px 0;
  color:#9c9ca3;
  font-size:13px;
}


/* subtle interaction, no card-template feeling */

.help-linear-topic{
  transition:opacity .16s ease;
}

.help-linear-grid:hover .help-linear-topic:not(:hover){
  opacity:.72;
}


/* responsive */

@media(max-width:760px){
  .help-linear-home{
    width:calc(100% - 32px);
    padding:36px 0 54px;
  }

  .help-linear-top{
    display:block;
    padding-bottom:22px;
  }

  .help-linear-heading h1{
    font-size:24px;
  }

  .help-linear-search{
    width:100%;
    margin-top:20px;
  }

  .help-linear-grid{
    grid-template-columns:1fr;
  }

  .help-linear-topic,
  .help-linear-topic:nth-child(-n+2){
    border-top:1px solid #ededf0;
  }

  .help-linear-topic:first-child{
    border-top:0;
  }
}


/* =========================================================
   XJ Help Center
   Notion comfort + XJ purple/blue
   ========================================================= */

.help-nx-home{
  width:min(1030px,calc(100% - 48px));
  margin:0 auto;
  padding:27px 0 52px;
  color:#252525;
}


/* Search */

.help-nx-search-top{
  min-height:112px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:13px;
}

.help-nx-label{
  color:#73737b;
  font-size:13px;
  line-height:1;
  font-weight:550;
  letter-spacing:.025em;
}

.help-nx-search{
  width:520px;
  height:44px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 14px;
  background:#fff;
  border:1px solid #dedee5;
  border-radius:10px;
  box-shadow:
    0 1px 2px rgba(20,20,30,.025),
    0 5px 18px rgba(40,40,70,.025);
  transition:
    border-color .16s ease,
    box-shadow .16s ease;
}

.help-nx-search:focus-within{
  border-color:#bdb7ff;
  box-shadow:
    0 0 0 3px rgba(91,75,255,.07),
    0 6px 20px rgba(40,40,80,.035);
}

.help-nx-search svg{
  width:17px;
  height:17px;
  flex:none;
  fill:none;
  stroke:#8d8d96;
  stroke-width:1.7;
  stroke-linecap:round;
}

.help-nx-search input{
  width:100%;
  height:100%;
  padding:0;
  border:0;
  outline:0;
  background:transparent;
  color:#303036;
  font:14px/1.4 -apple-system,BlinkMacSystemFont,
       "Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
}

.help-nx-search input::placeholder{
  color:#a0a0a7;
}


/* topics */

.help-nx-topics{
  padding-top:13px;
}

.help-nx-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}

.help-nx-card{
  position:relative;
  min-height:190px;
  padding:20px 21px 15px;
  overflow:hidden;

  background:#fff;
  border:1px solid #e8e8ed;
  border-radius:13px;

  transition:
    transform .16s ease,
    border-color .16s ease,
    box-shadow .16s ease;
}

.help-nx-card::before{
  content:"";
  position:absolute;
  width:150px;
  height:150px;
  top:-95px;
  right:-80px;
  border-radius:50%;
  opacity:.38;
  pointer-events:none;
}

.help-nx-card-blue::before{
  background:#e6f0ff;
}

.help-nx-card-purple::before{
  background:#eee9ff;
}

.help-nx-card-cyan::before{
  background:#e5f8f8;
}

.help-nx-card-indigo::before{
  background:#eaeaff;
}

.help-nx-card:hover{
  transform:translateY(-1px);
  border-color:#d8d6e6;
  box-shadow:0 9px 25px rgba(34,30,70,.045);
}


/* card head */

.help-nx-card-head{
  position:relative;
  z-index:1;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;
  padding-bottom:14px;
}

.help-nx-card-title{
  min-width:0;
  display:flex;
  align-items:flex-start;
  gap:12px;
}

.help-nx-icon{
  width:38px;
  height:38px;
  flex:0 0 38px;

  display:flex;
  align-items:center;
  justify-content:center;

  border-radius:10px;

  font-size:18px;
  line-height:1;
  font-weight:500;
}

.help-nx-card-blue .help-nx-icon{
  color:#3478f6;
  background:#edf4ff;
}

.help-nx-card-purple .help-nx-icon{
  color:#6855e8;
  background:#f2efff;
}

.help-nx-card-cyan .help-nx-icon{
  color:#178f94;
  background:#ebf8f7;
}

.help-nx-card-indigo .help-nx-icon{
  color:#5854e9;
  background:#f0efff;
}

.help-nx-card h2{
  margin:0 0 3px;
  color:#242428;
  font-size:16px;
  line-height:1.45;
  font-weight:620;
  letter-spacing:-.012em;
}

.help-nx-card-title p{
  margin:0;
  color:#898991;
  font-size:12.5px;
  line-height:1.55;
}

.help-nx-count{
  position:relative;
  z-index:1;
  flex:none;
  padding-top:2px;
  color:#a0a0a8;
  font-size:11px;
}


/* article links */

.help-nx-card-links{
  position:relative;
  z-index:1;
  border-top:1px solid #f0f0f2;
  padding-top:6px;
}

.help-nx-card-links a{
  min-height:30px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;

  color:#5e5e65;
  font-size:12px;
  line-height:1.45;

  border-bottom:1px solid #f5f5f6;
  transition:color .14s ease;
}

.help-nx-card-links a:last-child{
  border-bottom:0;
}

.help-nx-card-links a span{
  min-width:0;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.help-nx-card-links a b{
  flex:none;
  color:#aaaab2;
  font-weight:400;
  transition:
    color .14s ease,
    transform .14s ease;
}

.help-nx-card-links a:hover{
  color:#28282d;
}

.help-nx-card-links a:hover b{
  color:#655af2;
  transform:translateX(2px);
}

.help-nx-empty{
  display:block;
  padding:11px 0 2px;
  color:#b0b0b6;
  font-size:11px;
}


/* results */

.help-nx-results{
  width:min(760px,100%);
  margin:12px auto 0;
}

.help-nx-result-heading{
  display:flex;
  align-items:end;
  justify-content:space-between;
  padding:13px 2px;
  border-bottom:1px solid #eaeaec;
}

.help-nx-result-heading h2{
  margin:0;
  color:#29292e;
  font-size:15px;
  font-weight:600;
}

.help-nx-result-heading span{
  color:#a0a0a8;
  font-size:11px;
}

.help-nx-result{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  padding:15px 2px;
  border-bottom:1px solid #ededf0;
}

.help-nx-result strong{
  color:#343439;
  font-size:13px;
  font-weight:580;
}

.help-nx-result p{
  margin:3px 0 0;
  color:#8e8e95;
  font-size:12px;
}

.help-nx-result b{
  color:#aaaab2;
  font-weight:400;
}

.help-nx-no-result{
  padding:48px 2px;
  color:#9999a0;
  font-size:13px;
}


/* responsive */

@media(max-width:760px){

  .help-nx-home{
    width:calc(100% - 32px);
    padding:18px 0 42px;
  }

  .help-nx-search-top{
    min-height:102px;
  }

  .help-nx-search{
    width:100%;
  }

  .help-nx-grid{
    grid-template-columns:1fr;
  }

  .help-nx-card{
    min-height:auto;
    padding:18px;
  }
}


/* =========================================================
   XJ Help Center V2
   Compact illustrated hero + professional cards
   ========================================================= */

.help-pro-home{
  background:#fff;
}


/* HERO */

.help-pro-hero{
  position:relative;
  width:min(1180px,calc(100% - 48px));
  height:258px;
  margin:20px auto 0;
  overflow:hidden;
  border-radius:18px;
  background:#f4f6ff;
}

.help-pro-hero-bg{
  position:absolute;
  inset:0;
  background-image:url('help-center-hero.webp');
  background-repeat:no-repeat;
  background-position:center 52%;
  background-size:cover;
}

.help-pro-hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(
      circle at 50% 45%,
      rgba(255,255,255,.34),
      rgba(255,255,255,.05) 55%,
      transparent 76%
    );
  pointer-events:none;
}

.help-pro-hero-content{
  position:relative;
  z-index:2;
  width:560px;
  margin:0 auto;
  padding-top:35px;
  text-align:center;
}

.help-pro-kicker{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:24px;
  padding:0 11px;
  border-radius:999px;
  background:rgba(255,255,255,.64);
  color:#635d91;
  font-size:11px;
  font-weight:600;
  letter-spacing:.02em;
  backdrop-filter:blur(5px);
}

.help-pro-hero h1{
  margin:9px 0 14px;
  color:#20213e;
  font-size:29px;
  line-height:1.2;
  font-weight:680;
  letter-spacing:-.035em;
}


/* SEARCH */

.help-pro-search{
  width:510px;
  height:44px;
  margin:0 auto;
  padding:0 15px;
  display:flex;
  align-items:center;
  gap:10px;

  background:rgba(255,255,255,.94);
  border:1px solid rgba(130,130,170,.22);
  border-radius:11px;

  box-shadow:
    0 5px 18px rgba(51,55,100,.07),
    0 1px 2px rgba(30,35,70,.025);

  transition:.16s ease;
}

.help-pro-search:focus-within{
  border-color:#b3acf9;
  box-shadow:
    0 0 0 3px rgba(91,75,255,.08),
    0 7px 22px rgba(51,55,100,.08);
}

.help-pro-search svg{
  width:17px;
  height:17px;
  flex:none;
  fill:none;
  stroke:#81838f;
  stroke-width:1.8;
  stroke-linecap:round;
}

.help-pro-search input{
  width:100%;
  height:100%;
  padding:0;
  border:0;
  outline:0;
  background:transparent;

  color:#34343b;
  font:13px/1.4 -apple-system,
       BlinkMacSystemFont,
       "Segoe UI",
       "PingFang SC",
       "Microsoft YaHei",
       sans-serif;
}

.help-pro-search input::placeholder{
  color:#92949e;
}


/* QUICK LINKS */

.help-pro-quick{
  margin-top:13px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
}

.help-pro-quick a{
  padding:5px 11px;
  border-radius:999px;

  background:rgba(255,255,255,.58);
  border:1px solid rgba(103,94,230,.08);

  color:#625b9a;
  font-size:11px;
  line-height:1;

  backdrop-filter:blur(4px);
  transition:.15s ease;
}

.help-pro-quick a:hover{
  color:#4f46d7;
  background:#fff;
  border-color:#d8d3ff;
}


/* CONTENT */

.help-pro-content{
  width:min(1040px,calc(100% - 48px));
  margin:0 auto;
  padding:30px 0 48px;
}

.help-pro-content-title{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  margin-bottom:12px;
}

.help-pro-content-title h2{
  margin:0;
  color:#2d2e34;
  font-size:16px;
  line-height:1.4;
  font-weight:620;
}

.help-pro-content-title>span{
  color:#a0a1a9;
  font-size:11px;
}


/* CARDS */

.help-pro-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:13px;
}

.help-pro-card{
  position:relative;
  min-height:204px;
  padding:20px 20px 15px;

  background:#fff;
  border:1px solid #e7e8ed;
  border-radius:14px;

  overflow:hidden;

  transition:
    transform .17s ease,
    border-color .17s ease,
    box-shadow .17s ease;
}

.help-pro-card::after{
  content:"";
  position:absolute;
  width:140px;
  height:140px;
  top:-90px;
  right:-70px;
  border-radius:50%;
  opacity:.34;
  pointer-events:none;
}

.help-pro-card-blue::after{
  background:#dcecff;
}

.help-pro-card-purple::after{
  background:#e9e3ff;
}

.help-pro-card-violet::after{
  background:#e8e6ff;
}

.help-pro-card-indigo::after{
  background:#dde7ff;
}

.help-pro-card:hover{
  transform:translateY(-1px);
  border-color:#d7d7e4;

  box-shadow:
    0 10px 26px rgba(40,42,75,.045);
}


/* CARD HEADER */

.help-pro-card-head{
  position:relative;
  z-index:1;
  display:flex;
  align-items:flex-start;
  gap:13px;
  padding-bottom:15px;
}

.help-pro-icon{
  width:42px;
  height:42px;
  flex:0 0 42px;

  display:grid;
  place-items:center;

  border-radius:11px;
}

.help-pro-icon svg{
  width:21px;
  height:21px;

  fill:none;
  stroke:currentColor;
  stroke-width:1.65;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.help-pro-card-blue .help-pro-icon{
  color:#3678ec;
  background:#eaf2ff;
}

.help-pro-card-purple .help-pro-icon{
  color:#7059e7;
  background:#f0edff;
}

.help-pro-card-violet .help-pro-icon{
  color:#7058df;
  background:#f0eeff;
}

.help-pro-card-indigo .help-pro-icon{
  color:#536fea;
  background:#edf1ff;
}

.help-pro-card-heading{
  flex:1;
  min-width:0;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
}

.help-pro-card h3{
  margin:0 0 3px;
  color:#27282e;

  font-size:16px;
  line-height:1.45;
  font-weight:630;
  letter-spacing:-.015em;
}

.help-pro-card-heading p{
  margin:0;
  color:#878992;

  font-size:12px;
  line-height:1.55;
}

.help-pro-count{
  padding-top:2px;
  flex:none;

  color:#a1a2aa;
  font-size:10.5px;
}


/* ARTICLE LINKS */

.help-pro-links{
  position:relative;
  z-index:1;

  padding-top:6px;
  border-top:1px solid #f0f0f3;
}

.help-pro-links a{
  min-height:31px;

  display:flex;
  align-items:center;
  gap:8px;

  border-bottom:1px solid #f5f5f7;

  color:#62636b;
  font-size:12px;

  transition:.14s ease;
}

.help-pro-links a:last-child{
  border-bottom:0;
}

.help-pro-links a>svg{
  width:14px;
  height:14px;
  flex:none;

  fill:none;
  stroke:#8b83ef;
  stroke-width:1.6;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.help-pro-links a>span{
  min-width:0;
  flex:1;

  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.help-pro-links a>b{
  flex:none;

  color:#aaaab2;
  font-weight:400;

  opacity:0;
  transform:translateX(-3px);

  transition:.14s ease;
}

.help-pro-links a:hover{
  color:#292a30;
}

.help-pro-links a:hover>b{
  opacity:1;
  color:#6359e8;
  transform:translateX(0);
}

.help-pro-empty{
  padding:13px 0 4px;

  color:#acadb4;
  font-size:11px;
}


/* LOWER QUICK RESOURCE BAR */

.help-pro-more{
  height:54px;
  margin-top:15px;

  display:flex;
  align-items:center;
  justify-content:center;
  gap:28px;

  border:1px solid #ebebef;
  border-radius:12px;

  background:#fafafa;
}

.help-pro-more a{
  color:#6f7078;
  font-size:12px;
  transition:.14s ease;
}

.help-pro-more a:hover{
  color:#5b4bff;
}

.help-pro-more>span{
  width:1px;
  height:13px;
  background:#dedee3;
}


/* SEARCH RESULTS */

.help-pro-results{
  width:min(760px,calc(100% - 48px));
  margin:0 auto;
  padding:27px 0 60px;
}

.help-pro-section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;

  padding-bottom:13px;
  border-bottom:1px solid #e9e9ed;
}

.help-pro-section-head span{
  color:#999aa2;
  font-size:11px;
}

.help-pro-section-head h2{
  margin:3px 0 0;
  color:#303137;

  font-size:16px;
  font-weight:600;
}

.help-pro-section-head small{
  color:#aaaab1;
  font-size:11px;
}

.help-pro-result-list>a{
  padding:15px 2px;

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;

  border-bottom:1px solid #ededf0;
}

.help-pro-result-list strong{
  color:#34353a;

  font-size:13px;
  font-weight:580;
}

.help-pro-result-list p{
  margin:3px 0 0;

  color:#8e8f96;
  font-size:12px;
}

.help-pro-result-list b{
  color:#a6a7ae;
  font-weight:400;
}

.help-pro-no-result{
  padding:45px 2px;

  color:#999aa2;
  font-size:13px;
}


/* MOBILE */

@media(max-width:760px){

  .help-pro-hero{
    width:calc(100% - 24px);
    height:235px;
    margin-top:12px;
  }

  .help-pro-hero-bg{
    opacity:.47;
  }

  .help-pro-hero-content{
    width:calc(100% - 34px);
    padding-top:31px;
  }

  .help-pro-hero h1{
    font-size:25px;
  }

  .help-pro-search{
    width:100%;
  }

  .help-pro-quick{
    flex-wrap:wrap;
  }

  .help-pro-content{
    width:calc(100% - 32px);
    padding-top:24px;
  }

  .help-pro-grid{
    grid-template-columns:1fr;
  }

  .help-pro-card{
    min-height:auto;
  }

}


/* =========================================================
   Help category pages
   ========================================================= */

.help-pro-viewall{
  position:relative;
  z-index:2;
  display:flex;
  justify-content:flex-end;
  padding-top:8px;
  margin-top:3px;
  border-top:1px solid #f1f1f4;
}

.help-pro-viewall a{
  display:inline-flex;
  align-items:center;
  gap:7px;
  color:#665cf0;
  font-size:11.5px;
  font-weight:560;
}

.help-pro-viewall a span{
  transition:transform .15s ease;
}

.help-pro-viewall a:hover span{
  transform:translateX(2px);
}


/* category */

.help-category-page{
  background:#fff;
  min-height:600px;
}

.help-category-wrap{
  width:min(860px,calc(100% - 48px));
  margin:0 auto;
  padding:42px 0 80px;
}

.help-category-breadcrumb{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:27px;
  color:#999aa2;
  font-size:12px;
}

.help-category-breadcrumb a{
  color:#85868e;
}

.help-category-breadcrumb a:hover{
  color:#5b4bff;
}

.help-category-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:32px;
  padding-bottom:27px;
  border-bottom:1px solid #eaeaee;
}

.help-category-heading{
  display:flex;
  align-items:flex-start;
  gap:15px;
}

.help-category-mark{
  width:11px;
  height:11px;
  flex:0 0 11px;
  margin-top:10px;
  border-radius:3px;
  background:linear-gradient(
    135deg,
    #655af1,
    #4984f3
  );
  box-shadow:
    0 0 0 6px rgba(101,90,241,.07);
}

.help-category-header h1{
  margin:0;
  color:#24252b;
  font-size:28px;
  line-height:1.25;
  font-weight:660;
  letter-spacing:-.03em;
}

.help-category-header p{
  margin:8px 0 0;
  color:#85868f;
  font-size:13px;
  line-height:1.6;
}

.help-category-total{
  flex:none;
  margin-top:7px;
  color:#a0a1a9;
  font-size:11px;
}


/* article list */

.help-category-list{
  margin-top:4px;
}

.help-category-list>a{
  min-height:82px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  padding:18px 3px;
  border-bottom:1px solid #ededf0;
  transition:padding .15s ease;
}

.help-category-list>a:hover{
  padding-left:8px;
}

.help-category-list h2{
  margin:0;
  color:#313239;
  font-size:14px;
  line-height:1.5;
  font-weight:590;
}

.help-category-list p{
  margin:5px 0 0;
  max-width:680px;
  color:#8c8d95;
  font-size:12px;
  line-height:1.55;
}

.help-category-list>a>span{
  flex:none;
  color:#aaaab2;
  font-size:14px;
  transition:.15s ease;
}

.help-category-list>a:hover>span{
  color:#6258ea;
  transform:translateX(2px);
}

.help-category-empty{
  padding:60px 0;
  text-align:center;
  color:#a1a2a9;
  font-size:13px;
}


@media(max-width:760px){

  .help-category-wrap{
    width:calc(100% - 32px);
    padding:30px 0 56px;
  }

  .help-category-header{
    display:block;
  }

  .help-category-header h1{
    font-size:24px;
  }

  .help-category-total{
    display:block;
    margin:15px 0 0 26px;
  }

}


/* =========================================================
   XJ Article V2 / Notion-like reading
   ========================================================= */

.article-wrap{
  width:min(100%,820px);
  max-width:820px;

  margin:0 auto;
  padding:44px 30px 96px;
}

.article-wrap article{
  width:100%;
}

.article-wrap article>h1{
  max-width:760px;

  margin:0 auto 12px;

  color:#2c2c2b;

  font-family:
    ui-sans-serif,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    "PingFang SC",
    "Microsoft YaHei",
    sans-serif;

  font-size:40px;
  line-height:1.22;
  font-weight:700;

  letter-spacing:-.035em;
}

.article-meta{
  max-width:760px;

  margin:
    0 auto 30px;

  color:#9b9b98;

  font-size:12px;
}

.article-cover{
  display:block;

  width:100%;
  max-width:760px;
  height:auto;

  margin:28px auto 38px;

  border-radius:10px;
}


/* body */

.article-content{
  width:100%;
  max-width:760px;

  margin:0 auto;

  color:#2c2c2b;

  font-family:
    ui-sans-serif,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    "PingFang SC",
    "Microsoft YaHei",
    sans-serif;

  font-size:16px;
  font-weight:400;
  line-height:1.8;

  word-break:break-word;
}

.article-content p{
  margin:8px 0;
}


/* heading 1 inside content = H2 */

.article-content h2{
  margin:
    38px 0
    10px;

  color:#2c2c2b;

  font-size:24px;
  line-height:1.35;
  font-weight:650;

  letter-spacing:-.02em;
}


/* heading 2 */

.article-content h3{
  margin:
    30px 0
    8px;

  color:#2c2c2b;

  font-size:20px;
  line-height:1.4;
  font-weight:650;

  letter-spacing:-.015em;
}


/* heading 3 */

.article-content h4{
  margin:
    25px 0
    7px;

  color:#2c2c2b;

  font-size:17px;
  line-height:1.45;
  font-weight:650;
}


/* list */

.article-content ul,
.article-content ol{
  margin:8px 0;
  padding-left:1.65em;
}

.article-content li{
  margin:3px 0;
}


/* strong */

.article-content strong{
  font-weight:650;
}


/* links */

.article-content a{
  color:#2783de;

  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:2px;
}


/* quote */

.article-content blockquote{
  margin:20px 0;
  padding:2px 16px;

  border:0;
  border-left:3px solid #d4d4d2;

  background:transparent;

  color:#5c5c59;
}


/* Notion style callout */

.article-content .xj-callout{
  display:flex;
  align-items:flex-start;
  gap:11px;

  margin:20px 0;
  padding:14px 16px;

  border-radius:10px;

  background:#f9f8f7;

  color:#37352f;
}

.article-content .xj-callout-icon{
  flex:none;

  padding-top:1px;

  font-size:18px;
  line-height:1.6;
}

.article-content .xj-callout-content{
  flex:1;
  min-width:0;
}

.article-content .xj-callout-content p{
  margin:0;
}


/* images */

.article-content figure{
  display:block;

  margin:30px auto;
}

.article-content figure.xj-img-50{
  width:50%;
}

.article-content figure.xj-img-75{
  width:75%;
}

.article-content figure.xj-img-100{
  width:100%;
}

.article-content figure img,
.article-content img{
  display:block;

  width:auto;
  max-width:100%;
  height:auto;

  margin-left:auto;
  margin-right:auto;

  border-radius:8px;
}

.article-content figure img{
  width:100%;
}

.article-content figcaption{
  margin-top:7px;

  color:#9b9b98;

  text-align:center;
  font-size:12px;
  line-height:1.5;
}


/* divider */

.article-content hr{
  height:1px;

  margin:32px 0;

  border:0;

  background:#e9e9e7;
}


/* mobile */

@media(max-width:600px){

  .article-wrap{
    padding:
      32px 20px
      70px;
  }

  .article-wrap article>h1{
    font-size:32px;
  }

  .article-content{
    font-size:16px;
    line-height:1.78;
  }

  .article-content figure.xj-img-50,
  .article-content figure.xj-img-75{
    width:100%;
  }

}


/* =========================================================
   Article TOC
   ========================================================= */

html{
  scroll-behavior:smooth;
}

.article-content h2[id],
.article-content h3[id],
.article-content h4[id]{
  scroll-margin-top:90px;
}


.article-content .xj-toc{
  margin:25px 0 30px;

  padding:
    14px
    16px
    14px
    18px;

  border-left:
    2px solid
    #dededb;

  border-radius:
    0 8px 8px 0;

  background:#faf9f8;
}

.article-content .xj-toc-title{
  margin-bottom:8px;

  color:#37352f;

  font-size:13px;
  line-height:1.5;
  font-weight:650;
}

.article-content .xj-toc-list{
  display:flex;
  flex-direction:column;
  gap:3px;
}

.article-content .xj-toc-list a{
  display:block;

  padding:2px 0;

  color:#5f5e5b;

  font-size:13px;
  line-height:1.55;

  text-decoration:none;
}

.article-content .xj-toc-list a:hover{
  color:#2783de;

  text-decoration:underline;
  text-underline-offset:3px;
}

.article-content .xj-toc-level-2{
  padding-left:18px;
}

.article-content .xj-toc-level-3{
  padding-left:36px;

  color:#83827e;
}

.article-content .xj-toc-empty{
  display:none;
}


/* Help homepage article title size */
.help-pro-card .help-pro-links a{
  min-height:35px;
  font-size:14px !important;
  line-height:1.5;
}

.help-pro-card .help-pro-links a > span{
  font-weight:500;
}



/* =========================================================
   Blog article detail refinement
   ========================================================= */

/* 整篇文章 */
.article-wrap{
  max-width:860px;
  margin-left:auto;
  margin-right:auto;
  padding-top:42px;
  padding-bottom:72px;
}

/* 面包屑 */
.article-wrap .breadcrumb,
.article-wrap .article-breadcrumb{
  font-size:13px;
  line-height:20px;
  color:#9097a3;
  margin-bottom:28px;
}

.article-wrap .breadcrumb a,
.article-wrap .article-breadcrumb a{
  color:#7d8795;
  text-decoration:none;
}

.article-wrap .breadcrumb a:hover,
.article-wrap .article-breadcrumb a:hover{
  color:#2783de;
}

/* 文章标题 */
.article-wrap .article-title{
  max-width:820px;
  margin:0 0 10px;
  color:#242424;
  font-size:40px;
  font-weight:700;
  line-height:1.22;
  letter-spacing:-0.025em;
}

/* 日期 / 分类 */
.article-wrap .article-meta{
  margin-top:0;
  margin-bottom:28px;
  color:#969da8;
  font-size:13px;
  line-height:22px;
}

/* 封面 */
.article-wrap .article-cover{
  display:block;
  width:100%;
  max-width:820px;
  height:auto;
  margin:0 auto 38px;
  border-radius:10px;
}

/* 正文阅读宽度 */
.article-content{
  width:100%;
  max-width:760px;
  margin-left:auto;
  margin-right:auto;
  color:#2c2c2b;
  font-size:17px;
  font-weight:400;
  line-height:1.9;
}

/* 普通段落 */
.article-content p{
  margin:0 0 18px;
}

/* 一级正文标题，对应 Gutenberg h2 */
.article-content h2{
  margin:42px 0 18px;
  color:#272727;
  font-size:26px;
  font-weight:650;
  line-height:1.4;
  letter-spacing:-0.015em;
}

/* 二级正文标题，对应 Gutenberg h3 */
.article-content h3{
  margin:32px 0 14px;
  color:#2c2c2b;
  font-size:20px;
  font-weight:600;
  line-height:1.5;
}

/* 三级正文标题 */
.article-content h4{
  margin:28px 0 12px;
  color:#343434;
  font-size:18px;
  font-weight:600;
  line-height:1.5;
}

/* 列表 */
.article-content ul,
.article-content ol{
  margin:8px 0 20px;
  padding-left:1.55em;
}

.article-content li{
  margin:6px 0;
}

/* 引用 */
.article-content blockquote{
  margin:24px 0;
  padding:4px 0 4px 18px;
  border-left:3px solid #d9d9d7;
  color:#62676f;
}

/* 正文图片 */
.article-content img{
  max-width:100%;
  height:auto;
  border-radius:8px;
}

/* Gutenberg figure */
.article-content figure{
  margin:30px auto;
}

.article-content figcaption{
  margin-top:8px;
  color:#9a9a98;
  font-size:12px;
  line-height:1.6;
  text-align:center;
}

/* 链接 */
.article-content a{
  color:#2783de;
  text-decoration:none;
}

.article-content a:hover{
  text-decoration:underline;
  text-underline-offset:3px;
}


/* Mobile */
@media (max-width: 768px){

  .article-wrap{
    width:auto;
    padding:28px 20px 52px;
  }

  .article-wrap .article-title{
    font-size:30px;
    line-height:1.3;
  }

  .article-wrap .article-cover{
    margin-bottom:28px;
    border-radius:8px;
  }

  .article-content{
    font-size:16px;
    line-height:1.85;
  }

  .article-content h2{
    margin-top:36px;
    font-size:23px;
  }

  .article-content h3{
    font-size:19px;
  }
}


/* 博客详情页暂不自动显示封面 */
.article-wrap .article-cover{
  display:none !important;
}



/* ==========================================================
   FEEDBACK
   ========================================================== */

.feedback-page{
  min-height:calc(100vh - 360px);
  padding:64px 24px 88px;
  background:#f7f8fa;
}

.feedback-card{
  width:min(720px,100%);
  margin:0 auto;
  padding:42px 44px 46px;
  background:#fff;
  border:1px solid #e8e9ed;
  border-radius:18px;
  box-shadow:0 16px 50px rgba(23,28,38,.055);
}

.feedback-heading{
  margin-bottom:32px;
}

.feedback-heading h1{
  margin:0 0 12px;
  color:#202126;
  font-size:30px;
  line-height:1.3;
  font-weight:700;
}

.feedback-heading p{
  margin:0;
  color:#6f727b;
  font-size:15px;
  line-height:1.8;
}

.feedback-form{
  display:flex;
  flex-direction:column;
  gap:24px;
}

.feedback-field{
  display:flex;
  flex-direction:column;
  gap:9px;
}

.feedback-field > span{
  color:#292b31;
  font-size:14px;
  line-height:1.5;
  font-weight:600;
}

.feedback-field > span em{
  margin-left:3px;
  color:#dc2626;
  font-style:normal;
}

.feedback-field > span small{
  margin-left:6px;
  color:#9a9ca4;
  font-size:12px;
  font-weight:400;
}

.feedback-field input,
.feedback-field textarea{
  box-sizing:border-box;
  width:100%;
  border:1px solid #dfe1e6;
  border-radius:10px;
  outline:none;
  background:#fff;
  color:#272930;
  font:14px/1.7 -apple-system,BlinkMacSystemFont,
       "Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  transition:border-color .15s ease,box-shadow .15s ease;
}

.feedback-field input{
  height:46px;
  padding:0 14px;
}

.feedback-field textarea{
  min-height:190px;
  padding:13px 14px;
  resize:vertical;
}

.feedback-field input:focus,
.feedback-field textarea:focus{
  border-color:#9aade6;
  box-shadow:0 0 0 3px rgba(71,102,190,.08);
}

.feedback-field input::placeholder,
.feedback-field textarea::placeholder{
  color:#aaaeb6;
}

.feedback-field > small{
  color:#999ca5;
  font-size:12px;
  line-height:1.55;
}

.feedback-submit{
  align-self:flex-start;
  min-width:112px;
  height:44px;
  padding:0 22px;
  border:0;
  border-radius:9px;
  background:#202126;
  color:#fff;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  transition:background .15s ease,transform .15s ease;
}

.feedback-submit:hover{
  background:#0f1013;
}

.feedback-submit:active{
  transform:translateY(1px);
}

.feedback-error{
  margin-bottom:22px;
  padding:12px 14px;
  border:1px solid #fecaca;
  border-radius:9px;
  background:#fff5f5;
  color:#b42318;
  font-size:14px;
}

.feedback-success{
  padding:28px 30px;
  border:1px solid #dce7df;
  border-radius:13px;
  background:#f7fbf8;
}

.feedback-success strong{
  display:block;
  margin-bottom:8px;
  color:#24352a;
  font-size:17px;
}

.feedback-success p{
  margin:0 0 20px;
  color:#657069;
  font-size:14px;
  line-height:1.75;
}

.feedback-success a{
  color:#30343b;
  font-size:14px;
  font-weight:600;
  text-decoration:none;
}

.feedback-honeypot{
  position:absolute !important;
  left:-10000px !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
}

@media (max-width:720px){

  .feedback-page{
    padding:36px 16px 58px;
  }

  .feedback-card{
    padding:28px 22px 32px;
    border-radius:14px;
  }

  .feedback-heading h1{
    font-size:25px;
  }

  .feedback-submit{
    width:100%;
  }

}

/* =========================================================
   XJ related content
   ========================================================= */

.xj-related{
    margin-top:56px;
    padding-top:30px;
    border-top:1px solid rgba(15,23,42,.10);
}

.xj-related-head{
    margin-bottom:18px;
}

.xj-related-head h2{
    margin:0;
    font-size:22px;
    line-height:1.35;
    color:#111827;
}

.xj-related-head p{
    margin:6px 0 0;
    font-size:14px;
    color:#94a3b8;
}

.xj-related-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
}

.xj-related-card{
    display:block;
    padding:18px;
    border:1px solid #e5e7eb;
    border-radius:14px;
    text-decoration:none;
    background:#fff;
    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.xj-related-card:hover{
    transform:translateY(-2px);
    border-color:#cbd5e1;
    box-shadow:0 10px 28px rgba(15,23,42,.07);
}

.xj-related-type{
    margin-bottom:8px;
    font-size:12px;
    color:#64748b;
}

.xj-related-card h3{
    margin:0;
    font-size:16px;
    line-height:1.55;
    color:#111827;
}

.xj-related-card p{
    margin:8px 0 0;
    font-size:13px;
    line-height:1.7;
    color:#64748b;
}

@media(max-width:720px){

    .xj-related{
        margin-top:40px;
    }

    .xj-related-grid{
        grid-template-columns:1fr;
    }
}



/* XJ BLOG CTA PUBLIC V1 */

.article-content .xj-blog-cta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;

  margin:40px 0;
  padding:26px 28px;

  border:1px solid #e5e7ef;
  border-radius:16px;

  background:
    radial-gradient(
      circle at 92% 8%,
      rgba(99,102,241,.10),
      transparent 40%
    ),
    #f8f8fc;
}

.article-content .xj-blog-cta__content{
  flex:1;
  min-width:0;
}

.article-content .xj-blog-cta__label{
  margin-bottom:7px;

  color:#6366f1;

  font-size:13px;
  font-weight:650;
  line-height:1.5;
}

.article-content .xj-blog-cta__title{
  margin-bottom:7px;

  color:#18181b;

  font-size:21px;
  font-weight:700;
  line-height:1.5;
}

.article-content .xj-blog-cta__desc{
  max-width:600px;

  color:#71717a;

  font-size:14px;
  line-height:1.75;
}

.article-content .xj-blog-cta__button{
  flex:none;

  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;

  min-height:46px;
  padding:0 19px;

  border-radius:10px;

  background:#18181b;

  color:#fff !important;

  font-size:14px;
  font-weight:600;
  line-height:1;

  text-decoration:none !important;
  white-space:nowrap;

  transition:
    transform .18s ease,
    opacity .18s ease;
}

.article-content .xj-blog-cta__button:hover{
  color:#fff !important;
  text-decoration:none !important;

  transform:translateY(-1px);
  opacity:.88;
}

@media(max-width:720px){

  .article-content .xj-blog-cta{
    display:block;

    margin:32px 0;
    padding:22px 20px;
  }

  .article-content .xj-blog-cta__title{
    font-size:19px;
  }

  .article-content .xj-blog-cta__button{
    width:100%;
    margin-top:18px;
  }

}


/* CTA label alignment fix */
.article-content .xj-blog-cta__content{
  text-align:left;
}

.article-content .xj-blog-cta__label{
  margin:0 0 3px 0;
  padding:0;
  text-align:left;
  line-height:1.4;
}

.article-content .xj-blog-cta__title{
  margin-top:0;
}

/* CTA label hard alignment fix */
.article-content .xj-blog-cta__content{
  display:block !important;
  text-align:left !important;
}

.article-content .xj-blog-cta__label{
  display:block !important;
  width:100% !important;

  margin:0 0 4px 0 !important;
  padding:0 !important;

  text-align:left !important;
  text-indent:0 !important;

  transform:none !important;
}

.article-content .xj-blog-cta__title{
  margin-left:0 !important;
  padding-left:0 !important;
  text-align:left !important;
}

/* XJ CTA label final reset */
.article-content .xj-blog-cta .xj-blog-cta__label{
  all:unset !important;

  display:block !important;
  box-sizing:border-box !important;

  position:static !important;

  width:auto !important;
  max-width:none !important;

  margin:0 0 5px 0 !important;
  padding:0 !important;

  margin-left:0 !important;
  margin-right:0 !important;
  margin-inline:0 !important;

  padding-left:0 !important;
  padding-right:0 !important;
  padding-inline:0 !important;

  text-indent:0 !important;
  text-align:left !important;

  transform:none !important;

  color:#6366f1 !important;
  font-family:inherit !important;
  font-size:13px !important;
  font-weight:650 !important;
  line-height:1.5 !important;
}

.article-content .xj-blog-cta .xj-blog-cta__label::before,
.article-content .xj-blog-cta .xj-blog-cta__label::after{
  content:none !important;
  display:none !important;
}

.article-content .xj-blog-cta__content,
.article-content .xj-blog-cta__title,
.article-content .xj-blog-cta__desc{
  margin-left:0 !important;
  padding-left:0 !important;
  text-indent:0 !important;
  text-align:left !important;
}
