:root{--bg:#f4f6f8;--card:#fff;--text:#17191d;--muted:#667085;--line:#dce1e6;--line2:#edf0f2;--dark:#17191d;--accent:#2563eb;--container:1240px;--r:4px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font:17px/1.72 Inter,"PingFang SC","Microsoft YaHei",Arial,sans-serif}a{color:inherit;text-decoration:none}img{display:block;max-width:100%;height:auto}button,input,textarea,select{font:inherit}.container{width:min(calc(100% - 32px),var(--container));margin:auto}.site-top{height:40px;background:#fff;border-bottom:1px solid var(--line2);font-size:14px;color:var(--muted)}.site-top .container,.site-top .container>div{height:100%;display:flex;align-items:center;justify-content:space-between;gap:20px}.site-top a{text-decoration:underline;text-underline-offset:3px}.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.97);border-bottom:1px solid var(--line);backdrop-filter:blur(10px)}.header-main{min-height:78px;display:grid;grid-template-columns:190px minmax(340px,1fr) 160px auto;gap:18px;align-items:center}.site-logo{font-size:29px;font-weight:850;letter-spacing:-1px;white-space:nowrap}.site-search{display:flex;height:48px;border:2px solid var(--dark);background:#fff;border-radius:var(--r);overflow:hidden}.site-search input{flex:1;min-width:0;border:0;outline:0;padding:0 17px;font-size:16px}.site-search button,.hero-search button{border:0;background:var(--dark);color:#fff;padding:0 28px;font-weight:750;display:inline-flex;align-items:center;justify-content:center}.feedback-link{height:48px;padding:6px 15px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;border:1px solid var(--line);background:#f8f9fa;border-radius:var(--r);line-height:1.2}.feedback-link strong{font-size:15px}.feedback-link small{margin-top:3px;color:var(--muted);font-size:12px}.feedback-link:hover{border-color:#8d96a3;background:#fff}.mobile-menu{display:none;width:46px;height:46px;border:1px solid var(--line);background:#fff;border-radius:var(--r)}.site-nav{border-top:1px solid var(--line2)}.site-nav .container{height:49px;display:flex;align-items:center;gap:28px;overflow:auto}.site-nav a{font-size:16px;font-weight:600;white-space:nowrap;text-decoration:underline;text-decoration-color:#c9cfd6;text-underline-offset:5px}.site-nav a:hover{color:var(--accent)}.site-main{min-height:65vh}.hero{padding:66px 0;background:#fff;border-bottom:1px solid var(--line)}.hero .container{max-width:1000px}.eyebrow{display:inline-block;margin-bottom:10px;color:var(--accent);font-size:14px;font-weight:750;letter-spacing:.05em}.hero h1{margin:0;font-size:clamp(42px,6vw,64px);line-height:1.12;letter-spacing:-2px}.hero p{max-width:760px;margin:18px 0;color:var(--muted);font-size:19px}.hero-search{display:flex;max-width:760px;height:56px;margin-top:26px;background:#fff;border:2px solid var(--dark);border-radius:var(--r);overflow:hidden;box-shadow:0 10px 28px rgba(16,24,40,.08)}.hero-search input{flex:1;min-width:0;border:0;outline:0;padding:0 18px;font-size:17px}.section{padding:50px 0}.section.soft{background:#eef1f4}.section-title{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:24px}.section-title span{display:block;color:var(--muted);font-size:14px}.section-title h2,.page-heading h1{margin:4px 0 0;font-size:31px;line-height:1.25;letter-spacing:-.5px}.section-title>a{font-weight:700;text-decoration:underline;text-underline-offset:5px}.featured-links{display:grid;grid-template-columns:repeat(4,1fr);gap:11px}.featured-links a{padding:14px 15px;background:#fff;border:1px solid var(--line);border-radius:var(--r);font-size:17px;font-weight:650;text-decoration:underline;text-decoration-color:#c7ccd3;text-underline-offset:4px}.category-columns{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.category-column{background:#fff;border:1px solid var(--line);border-top:3px solid #aeb7c4;padding:21px;border-radius:var(--r)}.category-column h3{margin:0 0 13px;font-size:20px}.category-column h3 a,.category-column li a{text-decoration:underline;text-underline-offset:4px}.category-column ul{list-style:none;padding:0;margin:0}.category-column li{border-top:1px solid var(--line2)}.category-column li:first-child{border-top:0}.category-column li a{display:block;padding:9px 0;font-size:16px;text-decoration-color:#d0d4da}.tool-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}.tool-card{min-width:0;display:grid;grid-template-columns:74px minmax(0,1fr);gap:15px;padding:17px;background:#fff;border:1px solid var(--line);border-radius:var(--r);transition:.18s}.tool-card:hover{border-color:#929ca9;transform:translateY(-2px);box-shadow:0 10px 24px rgba(16,24,40,.07)}.tool-thumb{width:74px;height:64px;object-fit:cover;border:1px solid var(--line2);border-radius:3px;background:#f4f5f7}.tool-placeholder{display:block;background:linear-gradient(135deg,#f4f5f7 0 48%,#eceff2 48% 52%,#f4f5f7 52%)}.tool-card span,.tool-list-card span{color:var(--muted);font-size:13px}.tool-card h3{margin:2px 0 4px;font-size:18px;line-height:1.35;text-decoration:underline;text-decoration-color:#c4c9cf;text-underline-offset:4px}.tool-card p{margin:0;color:var(--muted);font-size:14px;line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.article-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.article-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}.article-card img,.cover-placeholder{width:100%;height:190px;object-fit:cover}.cover-placeholder{display:grid;place-items:center;background:#e9edf2;color:#556070;font-weight:700}.article-card>div{padding:19px}.article-card span{font-size:13px;color:var(--accent)}.article-card h3{font-size:20px;line-height:1.45;margin:5px 0;text-decoration:underline;text-decoration-color:#c7ccd3;text-underline-offset:4px}.article-card p{margin:0;color:var(--muted);font-size:14px}.directory-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}.directory-grid a{display:flex;flex-direction:column;min-height:136px;padding:19px;background:#fff;border:1px solid var(--line);border-radius:var(--r)}.directory-grid strong{font-size:19px;text-decoration:underline;text-underline-offset:4px}.directory-grid span{color:var(--muted);font-size:14px;margin:6px 0}.directory-grid em{margin-top:auto;font-style:normal;font-size:13px}.page-wrap{padding:32px 0 58px}.breadcrumb{display:flex;gap:8px;margin-bottom:20px;color:var(--muted);font-size:14px}.breadcrumb a{text-decoration:underline}.content-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:24px;align-items:start}.content-main,.content-sidebar .side-panel{background:#fff;border:1px solid var(--line);border-radius:var(--r)}.content-main{min-width:0;padding:28px}.page-heading{margin-bottom:24px}.page-heading p{color:var(--muted);font-size:16px}.filter-bar{display:grid;grid-template-columns:minmax(220px,1fr) 230px 110px;gap:12px;margin:0 0 24px;padding:16px;background:#f7f8fa;border:1px solid var(--line);border-radius:var(--r)}.filter-bar input,.filter-bar select{width:100%;height:48px;padding:0 14px;border:1px solid #cbd1d8;background:#fff;border-radius:3px;outline:0}.filter-bar input:focus,.filter-bar select:focus{border-color:#4b5563;box-shadow:0 0 0 3px rgba(17,24,39,.08)}.filter-bar button{height:48px;border:0;background:var(--dark);color:#fff;border-radius:3px;font-weight:750}.content-sidebar{display:grid;gap:16px}.side-panel{padding:19px}.side-panel h3{margin:0 0 10px;font-size:19px}.side-panel a{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid var(--line2);font-size:15px;text-decoration:underline;text-decoration-color:#d2d6db;text-underline-offset:3px}.side-panel em{font-style:normal;color:var(--muted)}.tool-list-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.tool-list-card{min-width:0;display:grid;grid-template-columns:82px minmax(0,1fr);gap:15px;padding:16px;border:1px solid var(--line);background:#fff;border-radius:var(--r)}.tool-list-card .tool-thumb{width:82px;height:72px}.tool-list-card h2,.tool-list-card h3{margin:3px 0;font-size:20px;line-height:1.35;text-decoration:underline;text-underline-offset:4px}.tool-list-card p{margin:5px 0;color:var(--muted);font-size:14px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.pagination{display:flex;flex-wrap:wrap;gap:8px;margin-top:25px}.pagination a{min-width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--line);background:#fff;border-radius:3px}.pagination a.active{background:var(--dark);color:#fff}.detail-head{display:flex;gap:17px;margin-bottom:22px}.detail-head>img{width:76px;height:76px;object-fit:cover;border:1px solid var(--line);border-radius:3px}.detail-head h1{font-size:34px;margin:2px 0}.detail-head p{margin:5px 0;color:var(--muted)}.tool-frame{width:100%;border:1px solid var(--line);border-radius:3px;overflow:hidden;background:#fff}.tool-frame iframe{display:block;width:100%;height:720px;min-height:620px;border:0}.rich-content{font-size:17px;line-height:1.9}.rich-content h2{font-size:28px;margin-top:36px}.rich-content h3{font-size:22px}.rich-content img{display:block;max-width:100%;height:auto;margin:24px auto;border-radius:3px}.article-list{display:grid;gap:15px}.article-row{display:grid;grid-template-columns:230px minmax(0,1fr);gap:19px;padding:15px;border:1px solid var(--line);border-radius:var(--r)}.article-row img,.article-row .cover-placeholder{width:230px;height:150px;object-fit:cover}.article-row h2{margin:4px 0;font-size:21px;line-height:1.4;text-decoration:underline;text-underline-offset:4px}.article-row p{font-size:14px;color:var(--muted);margin:5px 0}.article-row small{color:var(--muted)}.article-detail h1{font-size:39px;line-height:1.25;margin:8px 0}.article-hero,.page-cover{width:100%;max-height:520px;object-fit:cover;margin:22px 0;border-radius:3px}.article-meta{color:var(--muted);font-size:14px}.tag-list{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}.tag-list a{padding:5px 10px;background:#eef1f4;border:1px solid var(--line);border-radius:3px;font-size:14px;text-decoration:underline}.contact-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px}.contact-side{display:grid;gap:16px;align-content:start}.contact-side section{padding:20px;background:#fff;border:1px solid var(--line)}.contact-side h2{font-size:20px;margin:0 0 6px}.contact-side p{margin:0;color:var(--muted)}.contact-form{display:grid;gap:17px}.contact-form label{display:grid;gap:7px;font-weight:700}.contact-form input,.contact-form textarea,.contact-form select{width:100%;min-height:48px;padding:11px 13px;border:1px solid #cbd1d8;border-radius:3px;background:#fff;outline:0}.contact-form textarea{min-height:190px;resize:vertical}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.contact-submit{width:fit-content;min-height:48px;padding:0 24px;border:0;background:var(--dark);color:#fff;border-radius:3px;font-weight:750}.form-note{color:var(--muted);font-size:13px}.honeypot{position:absolute!important;left:-9999px!important}.notice{padding:13px 15px;margin-bottom:18px;border:1px solid var(--line)}.notice.success{background:#edf8f1;border-color:#bfe1ca}.notice.error{background:#fff2f2;border-color:#ebc1c1}.image-error{visibility:hidden}.ad-slot{margin-block:18px}.empty{color:var(--muted)}@media(max-width:1000px){.header-main{grid-template-columns:1fr auto auto}.site-search{grid-column:1/-1;order:5;margin-bottom:14px}.mobile-menu{display:block}.site-nav{display:none}.site-nav.open{display:block}.site-nav .container{height:auto;flex-wrap:wrap;padding:12px 16px}.tool-grid,.category-columns,.featured-links,.directory-grid{grid-template-columns:repeat(2,1fr)}.article-grid{grid-template-columns:repeat(2,1fr)}.content-layout,.contact-layout{grid-template-columns:1fr}.content-sidebar{grid-template-columns:repeat(2,1fr)}}@media(max-width:650px){body{font-size:16px}.container{width:min(calc(100% - 20px),var(--container))}.site-top{display:none}.header-main{min-height:64px;grid-template-columns:1fr auto auto;gap:8px;padding:10px 0}.site-logo{font-size:23px}.feedback-link{width:44px;padding:0;align-items:center}.feedback-link strong{font-size:0}.feedback-link strong:before{content:'反馈';font-size:12px}.feedback-link small{display:none}.site-search{height:45px}.hero{padding:42px 0}.hero h1{font-size:33px}.hero p{font-size:16px}.hero-search{height:50px}.featured-links,.category-columns,.tool-grid,.directory-grid,.article-grid,.tool-list-grid{grid-template-columns:1fr}.tool-card{grid-template-columns:68px 1fr}.article-row{grid-template-columns:1fr}.article-row img,.article-row .cover-placeholder{width:100%;height:190px}.filter-bar{grid-template-columns:1fr}.content-sidebar{grid-template-columns:1fr}.content-main{padding:18px}.page-heading h1,.detail-head h1,.article-detail h1{font-size:27px}.footer-grid,.form-row{grid-template-columns:1fr}.tool-frame iframe{min-height:620px}.section{padding:38px 0}.section-title{align-items:flex-start;flex-direction:column;gap:8px}.section-title h2{font-size:26px}}/* V12 tool detail: workspace first, information below */
.tool-detail-page{display:grid;gap:22px}.tool-detail-head{margin:0}.tool-workspace{width:100%;padding:18px;background:#fff;border:1px solid var(--line);border-radius:3px;overflow:hidden}.tool-workspace .tool-iframe{display:block;width:100%;min-height:680px;border:0;background:#fff}.tool-after-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:24px;align-items:start}.tool-description{min-width:0}.tool-after-layout .sidebar{position:static}@media(max-width:900px){.tool-after-layout{grid-template-columns:1fr}.tool-workspace{padding:10px}.tool-workspace .tool-iframe{min-height:620px}}

/* XI5 V13 front-end refinements */
.home-tool-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.home-tool-card{display:flex;min-height:190px;flex-direction:column;align-items:flex-start;padding:22px;background:#fff;border:1px solid var(--line);border-radius:3px}.home-tool-card:hover{transform:translateY(-2px);border-color:#9da6b2;box-shadow:0 10px 24px rgba(16,24,40,.07)}.home-tool-card .tool-category-label{display:inline-flex;margin-bottom:13px;padding:3px 8px;background:#f1f3f5;color:#596273;border:1px solid #e2e6ea;font-size:13px}.home-tool-card h3{margin:0 0 9px;font-size:20px;line-height:1.35;text-decoration:underline;text-decoration-color:#c3c9d0;text-underline-offset:5px}.home-tool-card p{margin:0;color:var(--muted);font-size:15px;line-height:1.65;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.home-tool-card em{margin-top:auto;padding-top:17px;color:#20242a;font-size:14px;font-style:normal;font-weight:700}
.tool-list-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.tool-list-card{position:relative;display:flex;min-height:210px;flex-direction:column;align-items:flex-start;padding:22px;background:#fff;border:1px solid var(--line);border-radius:3px;transition:.18s}.tool-list-card.has-icon{display:grid;grid-template-columns:72px minmax(0,1fr);min-height:210px;align-content:start}.tool-list-card:hover{border-color:#98a1ad;box-shadow:0 9px 22px rgba(16,24,40,.07);transform:translateY(-2px)}.tool-list-icon{width:72px;height:72px;object-fit:contain;padding:6px;background:#f7f8fa;border:1px solid var(--line2);border-radius:3px}.tool-list-content{min-width:0;display:flex;height:100%;flex-direction:column;align-items:flex-start}.tool-list-card.no-icon .tool-list-content{width:100%}.tool-list-card span{display:inline-flex;margin-bottom:8px;padding:2px 7px;background:#f3f4f6;border:1px solid #e6e8eb;color:#596273;font-size:12px}.tool-list-card h2{margin:0 0 8px;font-size:21px;line-height:1.35;text-decoration:underline;text-decoration-color:#c2c8cf;text-underline-offset:5px}.tool-list-card p{margin:0;color:var(--muted);font-size:14px;line-height:1.65;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.tool-list-card em{margin-top:auto;padding-top:16px;color:#20242a;font-size:14px;font-style:normal;font-weight:700}.filter-bar{grid-template-columns:minmax(260px,1fr) 230px 120px;padding:18px;gap:13px;background:#fff;box-shadow:0 4px 16px rgba(16,24,40,.04)}
.tool-page-wrap{max-width:1440px}.tool-detail-page{display:block;width:100%}.tool-detail-head{padding:28px;background:#fff;border:1px solid var(--line);border-radius:3px}.tool-detail-head>img{width:82px;height:82px;object-fit:contain;padding:7px;background:#f8f9fa}.tool-detail-category{display:inline-flex;padding:3px 8px;background:#f1f3f5;border:1px solid #e3e6e9;color:#5b6573;font-size:13px}.tool-detail-head h1{font-size:38px;line-height:1.2}.tool-workspace-section{width:100%;margin:22px 0;padding:0;background:#fff;border:1px solid var(--line);border-radius:3px;overflow:hidden}.workspace-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;padding:19px 22px;border-bottom:1px solid var(--line);background:#f8f9fa}.workspace-heading span{font-size:13px;color:var(--muted)}.workspace-heading h2{margin:3px 0 0;font-size:22px}.workspace-heading small{color:var(--muted)}.tool-workspace{display:block;width:100%;min-width:0;padding:0;background:#fff;overflow:visible}.tool-iframe{display:block;width:100%!important;max-width:none!important;min-width:100%!important;height:760px;min-height:680px;border:0!important;background:#fff}.tool-description{margin-top:22px;padding:30px;background:#fff;border:1px solid var(--line);border-radius:3px}.tool-related-area{margin-top:22px}.tool-related-area .content-sidebar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.tool-related-area .side-panel{height:100%;background:#fff}.tool-related-area .side-panel a{font-size:16px}.tool-related-area .side-panel h3{font-size:21px}
@media(max-width:1100px){.home-tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tool-list-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tool-related-area .content-sidebar{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.home-tool-grid,.tool-list-grid{grid-template-columns:1fr}.tool-list-card,.tool-list-card.has-icon{min-height:0}.filter-bar{grid-template-columns:1fr}.tool-detail-head{padding:20px}.tool-detail-head h1{font-size:30px}.workspace-heading{align-items:flex-start;flex-direction:column}.tool-iframe{min-height:740px}.tool-description{padding:21px}.tool-related-area .content-sidebar{grid-template-columns:1fr}}


/* Footer */
.site-footer{
  margin-top:64px;
  padding:0;
  color:#d9dee7;
  background:#15181d;
  border-top:1px solid #2b3038;
}
.site-footer .footer-grid{
  display:grid;
  grid-template-columns:minmax(0,2fr) minmax(150px,1fr) minmax(150px,1fr);
  gap:56px;
  align-items:start;
  padding-top:48px;
  padding-bottom:40px;
}
.site-footer .footer-grid>div{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:11px;
  min-width:0;
}
.site-footer .footer-grid strong{
  display:block;
  margin:0 0 4px;
  color:#fff;
  font-size:25px;
  line-height:1.2;
  letter-spacing:.2px;
}
.site-footer .footer-grid p{
  max-width:430px;
  margin:0;
  color:#aeb6c2;
  font-size:15px;
  line-height:1.85;
}
.site-footer .footer-grid a{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  color:#d9dee7;
  font-size:15px;
  line-height:1.5;
  text-decoration:underline;
  text-decoration-color:#525b68;
  text-decoration-thickness:1px;
  text-underline-offset:5px;
  transition:color .18s ease,text-decoration-color .18s ease,transform .18s ease;
}
.site-footer .footer-grid a:hover{
  color:#fff;
  text-decoration-color:#fff;
  transform:translateX(2px);
}
.site-footer .copyright{
  margin-top:0;
  padding-top:19px;
  padding-bottom:21px;
  color:#88919e;
  border-top:1px solid #30353d;
  font-size:13px;
  line-height:1.5;
  text-align:center;
}
@media(max-width:760px){
  .site-footer{margin-top:46px}
  .site-footer .footer-grid{
    grid-template-columns:1fr;
    gap:25px;
    padding-top:34px;
    padding-bottom:30px;
  }
  .site-footer .footer-grid>div{gap:8px}
  .site-footer .footer-grid strong{font-size:23px}
  .site-footer .copyright{padding-top:16px;padding-bottom:18px}
}