/* AI生成 */
/* ============================================================
   织码 Weave Code — 应用网站公共样式
   单文件、离线可用、无外部依赖。
   语言切换：html[data-lang="zh"|"en"] + .lang-zh / .lang-en
   ============================================================ */

:root{
  --bg:#14171d; --panel:#1b1f27; --panel-2:#20252f; --text:#e7eaf1; --muted:#9aa5b6;
  --accent:#4ea1ff; --accent-2:#7bd88f; --warn:#ffb454; --danger:#ff6b6b;
  --border:#2a303c; --code-bg:#10131a; --code-border:#2b3240;
  --wrap:1180px; --radius:12px;
  --shadow:0 10px 30px rgba(0,0,0,.35);
}
html[data-theme="light"]{
  --bg:#f6f8fb; --panel:#ffffff; --panel-2:#f0f3f8; --text:#1c2330; --muted:#5b6675;
  --accent:#0b64d0; --accent-2:#0f8a4a; --warn:#a35b00; --danger:#c22; --border:#dde3ec;
  --code-bg:#f2f5f9; --code-border:#dbe2ec; --shadow:0 10px 30px rgba(20,30,50,.08);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:"HarmonyOS Sans SC","Microsoft YaHei","PingFang SC","Noto Sans SC",-apple-system,"Segoe UI",Roboto,sans-serif;
  font-size:15.5px; line-height:1.75; -webkit-font-smoothing:antialiased;
}
a{color:var(--accent); text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%}
.muted{color:var(--muted)}
.wrap{max-width:var(--wrap); margin:0 auto; padding:0 22px}

/* ---------- 语言切换 ---------- */
html[data-lang="zh"] .lang-en{display:none !important}
html[data-lang="en"] .lang-zh{display:none !important}

/* ---------- 顶栏 ---------- */
.topbar{
  position:sticky; top:0; z-index:60; background:var(--panel);
  border-bottom:1px solid var(--border);
}
.topbar .inner{
  display:flex; align-items:center; gap:18px; height:62px;
  max-width:var(--wrap); margin:0 auto; padding:0 22px;
}
.brand{display:flex; align-items:center; gap:11px; color:var(--text); font-weight:700; white-space:nowrap}
.brand:hover{text-decoration:none}
.brand img{width:32px; height:32px; border-radius:9px; display:block; background:#0e1116}
.brand .names{display:flex; flex-direction:column; line-height:1.15}
.brand .names b{font-size:16px; letter-spacing:.2px}
.brand .names small{color:var(--muted); font-size:11.5px; font-weight:500; letter-spacing:.04em}
.nav{display:flex; align-items:center; gap:2px; flex:1 1 auto; overflow-x:auto}
.nav a{
  color:var(--muted); padding:7px 12px; border-radius:9px; white-space:nowrap; font-size:14.5px;
}
.nav a:hover{color:var(--text); background:var(--panel-2); text-decoration:none}
.nav a.active{color:var(--accent); background:var(--panel-2); font-weight:600}
.actions{display:flex; align-items:center; gap:8px}
.btn{
  border:1px solid var(--border); background:var(--panel-2); color:var(--text);
  padding:7px 12px; border-radius:9px; cursor:pointer; font-size:13.5px; font-family:inherit;
  white-space:nowrap;
}
.btn:hover{border-color:var(--accent); color:var(--accent)}
.btn.primary{
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  color:#08111c; border:none; font-weight:700;
}
.btn.primary:hover{filter:brightness(1.06); color:#08111c}
.btn.lg{padding:11px 20px; font-size:15px}

/* ---------- 页头 ---------- */
.page-head{
  background:var(--panel); border-bottom:1px solid var(--border);
  padding:34px 0 26px; margin-bottom:28px;
}
.page-head h1{margin:0 0 6px; font-size:29px; line-height:1.25}
.page-head p{margin:0; color:var(--muted); max-width:760px}
.crumb{font-size:13px; color:var(--muted); margin-bottom:10px}
.crumb a{color:var(--muted)}

/* ---------- 首页 hero ---------- */
.hero{padding:64px 0 40px; text-align:center}
.hero img.appicon{
  width:104px; height:104px; border-radius:24px; box-shadow:var(--shadow);
  background:#0e1116; margin-bottom:20px;
}
.hero h1{font-size:40px; margin:0 0 4px; letter-spacing:.5px}
.hero .en-name{font-size:16px; color:var(--muted); letter-spacing:.14em; text-transform:uppercase; margin:0 0 14px}
.hero .tagline{font-size:17.5px; color:var(--muted); max-width:720px; margin:0 auto 24px}
.hero .cta{display:flex; gap:12px; justify-content:center; flex-wrap:wrap}
.hero .meta{margin-top:26px; display:flex; gap:9px; justify-content:center; flex-wrap:wrap}

/* ---------- 通用区块 ---------- */
section{padding:34px 0}
section > h2{font-size:22px; margin:0 0 6px}
section > .sub{color:var(--muted); margin:0 0 18px}
h3{font-size:17px; margin:24px 0 8px}
h4{font-size:15px; margin:18px 0 6px; color:var(--muted)}

/* ---------- 卡片 ---------- */
.grid{display:grid; gap:14px}
.grid.c2{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.grid.c3{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.card{
  background:var(--panel); border:1px solid var(--border); border-radius:var(--radius);
  padding:18px 20px; display:block; color:var(--text);
}
a.card:hover{border-color:var(--accent); text-decoration:none; transform:translateY(-1px)}
.card .ico{font-size:22px; display:block; margin-bottom:6px}
.card h3{margin:0 0 6px; font-size:16.5px}
.card p{margin:0; color:var(--muted); font-size:14px}
.card .go{display:inline-block; margin-top:10px; font-size:13.5px; color:var(--accent)}

/* ---------- 徽标 ---------- */
.badges{display:flex; flex-wrap:wrap; gap:8px; margin:12px 0}
.badge{
  font-size:12.5px; padding:3px 10px; border-radius:999px; border:1px solid var(--border);
  background:var(--panel-2); color:var(--muted); white-space:nowrap;
}
.badge.ok{border-color:var(--accent-2); color:var(--accent-2)}
.badge.warn{border-color:var(--warn); color:var(--warn)}
.badge.no{border-color:var(--danger); color:var(--danger)}

/* ---------- 提示块 ---------- */
.note{
  border:1px solid var(--border); border-left:3px solid var(--accent);
  background:var(--panel); border-radius:9px; padding:12px 16px; margin:14px 0; font-size:14.5px;
}
.note.tip{border-left-color:var(--accent-2)}
.note.warn{border-left-color:var(--warn)}
.note.danger{border-left-color:var(--danger)}
.note p{margin:5px 0}
.note p:first-child{margin-top:0}
.note p:last-child{margin-bottom:0}

/* ---------- 表格 ---------- */
table{width:100%; border-collapse:collapse; margin:14px 0; font-size:14px; display:block; overflow-x:auto}
th,td{border:1px solid var(--border); padding:9px 12px; text-align:left; vertical-align:top}
th{background:var(--panel-2); font-weight:600; white-space:nowrap}
tbody tr:nth-child(even){background:var(--panel); background:color-mix(in srgb,var(--panel) 60%,transparent)}

/* ---------- 代码 ---------- */
code{
  background:var(--code-bg); border:1px solid var(--code-border); border-radius:5px;
  padding:.12em .42em; font-family:"JetBrains Mono","Cascadia Code",Consolas,"Courier New",monospace;
  font-size:.88em; word-break:break-word;
}
pre{
  background:var(--code-bg); border:1px solid var(--code-border); border-radius:var(--radius);
  padding:14px 16px; overflow:auto; font-size:13.5px; line-height:1.6; margin:14px 0;
}
pre code{background:none; border:none; padding:0; font-size:13.5px}
.kbd{
  display:inline-block; background:var(--panel-2); border:1px solid var(--border);
  border-bottom-width:2px; border-radius:5px; padding:0 6px; font-size:12.5px; margin:0 1px;
}

/* ---------- FAQ ---------- */
details.faq{border:1px solid var(--border); border-radius:10px; background:var(--panel); padding:2px 16px; margin:10px 0}
details.faq summary{cursor:pointer; padding:11px 0; font-weight:600; list-style:none}
details.faq summary::-webkit-details-marker{display:none}
details.faq summary::before{content:"＋ "; color:var(--accent); font-weight:700}
details.faq[open] summary::before{content:"－ "}
details.faq .body{padding:0 0 13px; color:var(--muted); font-size:14.5px}
details.faq .body p{margin:6px 0}

/* ---------- 表单 ---------- */
label{display:block; font-size:14px; margin:14px 0 5px; font-weight:600}
input,select,textarea{
  width:100%; background:var(--code-bg); color:var(--text); border:1px solid var(--code-border);
  border-radius:9px; padding:10px 12px; font-family:inherit; font-size:14.5px;
}
textarea{min-height:150px; resize:vertical; line-height:1.6}
input:focus,select:focus,textarea:focus{outline:none; border-color:var(--accent)}
.form-row{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px}
.hint{font-size:13px; color:var(--muted); margin:6px 0 0}
.form-actions{margin-top:18px; display:flex; gap:10px; flex-wrap:wrap; align-items:center}

/* ---------- 列表 ---------- */
.steps{counter-reset:s; padding-left:0; list-style:none}
.steps li{position:relative; padding-left:38px; margin:14px 0}
.steps li::before{
  counter-increment:s; content:counter(s);
  position:absolute; left:0; top:1px; width:25px; height:25px; border-radius:50%;
  background:var(--panel-2); border:1px solid var(--border); color:var(--accent);
  display:grid; place-items:center; font-size:13px; font-weight:700;
}

/* ---------- 活动条目 ---------- */
.event{
  background:var(--panel); border:1px solid var(--border); border-radius:var(--radius);
  padding:18px 20px; display:grid; gap:6px;
}
.event .row{display:flex; align-items:center; gap:10px; flex-wrap:wrap}
.event h3{margin:0; font-size:17px}
.event .when{color:var(--muted); font-size:13.5px}
.event .desc{color:var(--muted); font-size:14.5px; margin:2px 0 0}
.empty{
  border:1px dashed var(--border); border-radius:var(--radius); padding:34px 20px;
  text-align:center; color:var(--muted); background:var(--panel);
}
.filters{display:flex; gap:8px; flex-wrap:wrap; margin:4px 0 18px}
.filters .btn.active{border-color:var(--accent); color:var(--accent); font-weight:600}

/* ---------- 页脚 ---------- */
footer.site{
  margin-top:40px; border-top:1px solid var(--border); background:var(--panel);
  padding:30px 0 40px; color:var(--muted); font-size:13.5px;
}
footer.site .cols{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:22px}
footer.site h4{margin:0 0 8px; color:var(--text); font-size:14px}
footer.site a{color:var(--muted); display:block; padding:2px 0}
footer.site a:hover{color:var(--accent)}
/* 备案信息行（工信部要求展示备案号） */
footer.site .footer-bottom{
  margin-top:20px; padding-top:14px; border-top:1px solid var(--border);
  font-size:12.5px; display:flex; flex-wrap:wrap; gap:6px 14px; align-items:center;
}
footer.site .footer-bottom a{display:inline; padding:0; color:var(--muted)}
footer.site .footer-bottom a:hover{color:var(--accent); text-decoration:underline}

.to-top{
  position:fixed; right:22px; bottom:22px; z-index:40; width:42px; height:42px; display:none;
  border-radius:50%; border:1px solid var(--border); background:var(--panel); color:var(--text);
  cursor:pointer; font-size:18px; place-items:center;
}
.to-top.show{display:grid}

/* ---------- 响应式 ---------- */
@media (max-width:880px){
  .topbar .inner{height:auto; padding:10px 16px; flex-wrap:wrap; gap:10px}
  .nav{order:3; flex-basis:100%; padding-bottom:4px}
  .hero{padding:40px 0 28px}
  .hero h1{font-size:31px}
  .page-head{padding:24px 0 18px}
  .page-head h1{font-size:23px}
  .brand .names small{display:none}
}
@media print{
  .topbar,.to-top,footer.site .cols,.filters{display:none}
  body{background:#fff; color:#000}
}