/* W3-EDA mini 1.6 · shell
   纸面 + 单一深蓝 accent；零圆角、零阴影、零渐变 */
:root{
  --paper:#f3f2ee;
  --panel:#fbfaf7;
  --panel2:#f7f6f1;
  --ink:#141413;
  --ink2:#4a4a46;
  --ink3:#8b8a83;
  --line:#dcdad1;
  --line2:#c6c3b8;
  --accent:#1b3f6e;
  --accent2:#2c5c94;
  --soft:#e9eef5;
  --good:#1c6b3f;
  --bad:#9e2b21;
  --warn:#8a5c12;
  --mono:"SF Mono",Consolas,"Cascadia Mono",monospace;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--paper);color:var(--ink);
  font:14px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI","Helvetica Neue","Microsoft YaHei",Arial,sans-serif;
  -webkit-font-smoothing:antialiased;min-height:100vh;
}
button,input,textarea,select{font-family:inherit;font-size:inherit;color:inherit;border-radius:0}
button{cursor:pointer}
h1,h2,h3,h4{margin:0;font-weight:600;letter-spacing:-.01em}
table{border-collapse:collapse}

/* ---------- 顶栏 ---------- */
.top{
  height:54px;display:flex;align-items:center;gap:22px;padding:0 18px;
  background:var(--panel);border-bottom:1px solid var(--line2);
  position:sticky;top:0;z-index:40;
}
.brand{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.mark{
  width:28px;height:28px;display:grid;place-items:center;
  background:var(--ink);color:var(--paper);font:600 12px/1 var(--mono);letter-spacing:.04em;
}
.brandtxt{display:flex;flex-direction:column;line-height:1.25}
.brandtxt b{font-size:13.5px;letter-spacing:-.01em}
.brandtxt i{font-style:normal;font-size:10.5px;color:var(--ink3);letter-spacing:.02em}
.projwrap{display:flex;align-items:center;gap:8px;flex:1 1 auto;min-width:0}
.projwrap label{font-size:10.5px;color:var(--ink3);letter-spacing:.08em;text-transform:uppercase}
.projinput{
  background:transparent;border:0;border-bottom:1px solid transparent;
  padding:3px 2px;font-size:13.5px;font-weight:600;min-width:120px;max-width:340px;width:34%;
}
.projinput:hover{border-bottom-color:var(--line2)}
.projinput:focus{outline:none;border-bottom-color:var(--accent)}
.topright{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.dot{width:7px;height:7px;background:var(--ink3);display:inline-block}
.dot.on{background:var(--good)}
.dot.off{background:var(--bad)}
.statustext{font-size:11.5px;color:var(--ink2);min-width:96px}
.verchip{
  font:10.5px/1 var(--mono);color:var(--ink2);border:1px solid var(--line2);
  padding:4px 6px;letter-spacing:.02em;
}
.ghost{
  background:transparent;border:1px solid var(--line2);padding:4px 9px;
  font-size:11.5px;color:var(--ink2);
}
.ghost:hover{border-color:var(--accent);color:var(--accent)}
.ghost:active{background:var(--soft)}

/* 功能页主题色：进哪个页，整站 accent 跟着变色（工作区彩色的主来源） */
body[data-view="batch"]{--accent:#a05a12;--accent2:#c07a2e;--soft:#f6efe2}
body[data-view="boundary"]{--accent:#1c6b3f;--accent2:#2c8a58;--soft:#e7f2ec}
body[data-view="calibrate"]{--accent:#5b4a8a;--accent2:#7763a8;--soft:#efecf6}
body[data-view="benchmark"]{--accent:#0e6b66;--accent2:#2a8a84;--soft:#e6f2f1}
body[data-view="history"]{--accent:#7a5230;--accent2:#96683f;--soft:#f4ede5}
body[data-view="reports"]{--accent:#3a4a5e;--accent2:#56697f;--soft:#eaedf1}
body[data-view="settings"]{--accent:#5b4a8a;--accent2:#7763a8;--soft:#efecf6}

/* 侧栏图标固定彩色 */
.nav[data-view="evaluate"] .ni{color:#1b3f6e}
.nav[data-view="batch"] .ni{color:#a05a12}
.nav[data-view="boundary"] .ni{color:#1c6b3f}
.nav[data-view="calibrate"] .ni{color:#5b4a8a}
.nav[data-view="benchmark"] .ni{color:#0e6b66}
.nav[data-view="history"] .ni{color:#7a5230}
.nav[data-view="reports"] .ni{color:#3a4a5e}
.nav[data-view="settings"] .ni{color:#6b6b66}

/* ---------- 框架 ---------- */
.app{display:flex;min-height:calc(100vh - 54px)}
.side{
  width:232px;flex:0 0 232px;background:var(--panel);border-right:1px solid var(--line);
  padding:14px 0 10px;display:flex;flex-direction:column;
  position:sticky;top:54px;height:calc(100vh - 54px);overflow-y:auto;
}
.navgroup{
  font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink3);
  padding:12px 16px 6px;
}
.navgroup:first-child{padding-top:2px}
.nav{
  display:flex;align-items:center;gap:9px;width:100%;text-align:left;
  background:transparent;border:0;border-left:2px solid transparent;
  padding:8px 14px;font-size:13.5px;color:var(--ink2);
}
.nav:hover{background:var(--panel2);color:var(--ink)}
.nav.on{background:var(--soft);border-left-color:var(--accent);color:var(--accent);font-weight:600}
.nav .ni{width:14px;text-align:center;font-size:11px;color:var(--ink3)}
.nav.on .ni{color:var(--accent)}
.nav em{font-style:normal;margin-left:auto;font-size:10.5px;color:var(--ink3)}
.recent{padding:0 8px 8px}
.empty-mini{font-size:11px;color:var(--ink3)}
.rlink{
  display:block;width:100%;text-align:left;background:transparent;border:0;
  padding:5px 7px;font-size:11px;color:var(--ink2);border-left:2px solid transparent;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.rlink:hover{background:var(--panel2);border-left-color:var(--line2)}
.rlink b{font-weight:600;color:var(--ink)}
.rlink.v-pass b{color:var(--good)}
.rlink.v-fail b{color:var(--bad)}
.sidefoot{margin-top:auto;border-top:1px solid var(--line);padding-top:6px}
.kerneltag{font:10px/1.5 var(--mono);color:var(--ink3);padding:4px 16px 6px}

.main{padding:26px 34px 90px;flex:1 1 auto;min-width:0;max-width:1600px}

/* ---------- 通用块 ---------- */
.pagehead{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:18px}
.pagehead h1{font-size:23px;letter-spacing:-.02em}
.pagehead p{margin:4px 0 0;font-size:12.5px;color:var(--ink3);max-width:680px}
.panel{background:var(--panel);border:1px solid var(--line);padding:17px 19px}
.panel + .panel{margin-top:12px}
.panel h3{
  font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink3);
  margin-bottom:10px;font-weight:600;
}
.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.grow{flex:1 1 auto}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
.muted{color:var(--ink3)}
.small{font-size:11px}
.hint{font-size:11px;color:var(--ink3);line-height:1.6}
.primary{
  background:var(--ink);color:var(--paper);border:1px solid var(--ink);
  padding:7px 16px;font-size:13px;font-weight:600;letter-spacing:.01em;
}
.main .primary{background:var(--accent);border-color:var(--accent)}
.main .primary:hover{background:var(--accent2);border-color:var(--accent2)}
.primary:disabled{background:var(--line2);border-color:var(--line2);cursor:not-allowed;color:#fff}
.primary.wide{width:100%}
.linkish{background:none;border:0;padding:0;color:var(--accent);font-size:11.5px;text-decoration:underline;text-underline-offset:2px}

/* ---------- 评估：两栏 ---------- */
.split{display:grid;grid-template-columns:308px minmax(0,1fr);gap:16px;align-items:start}
@media (max-width:1080px){.split{grid-template-columns:1fr}}

.field{margin-bottom:13px}
.field:last-child{margin-bottom:0}
.field label{display:flex;justify-content:space-between;align-items:baseline;font-size:11.5px;color:var(--ink2);margin-bottom:5px}
.field label b{font:600 12px/1 var(--mono);color:var(--ink)}
.field label span{font-size:10.5px;color:var(--ink3)}
.numline{display:flex;gap:6px;align-items:center}
.num{
  width:74px;background:var(--panel);border:1px solid var(--line2);padding:4px 6px;
  font:12px/1.4 var(--mono);text-align:right;
}
.num:focus{outline:none;border-color:var(--accent);background:#fff}
input[type=range]{
  -webkit-appearance:none;appearance:none;width:100%;height:18px;background:transparent;margin:5px 0 0;
}
input[type=range]::-webkit-slider-runnable-track{height:2px;background:var(--line2)}
input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none;width:11px;height:11px;background:var(--accent);
  margin-top:-4.5px;border:0;border-radius:0;
}
input[type=range]:focus{outline:none}
.seg{display:flex;border:1px solid var(--line2)}
.seg button{
  flex:1;background:var(--panel);border:0;border-right:1px solid var(--line2);
  padding:5px 4px;font-size:11.5px;color:var(--ink2);
}
.seg button:last-child{border-right:0}
.seg button.on{background:var(--accent);color:#fff}
.presets{display:flex;gap:6px;flex-wrap:wrap;margin-top:4px}
.preset{
  background:var(--panel);border:1px solid var(--line2);padding:4px 8px;font-size:11px;color:var(--ink2);
}
.preset:hover{border-color:var(--accent);color:var(--accent)}

/* 结论条 */
.verdict{
  border:1px solid var(--line2);background:var(--panel);
  padding:16px 18px;display:flex;align-items:center;gap:18px;
}
.verdict .big{font:600 38px/1 var(--mono);letter-spacing:-.02em}
.verdict .big.pass{color:var(--good)}
.verdict .big.fail{color:var(--bad)}
.verdict .vtext{flex:1 1 auto;min-width:0}
.verdict .vtext b{display:block;font-size:14px;margin-bottom:2px}
.verdict .vtext span{font-size:11.5px;color:var(--ink3)}
.verdict .vside{text-align:right;font:11px/1.7 var(--mono);color:var(--ink3)}

/* 指标 */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(112px,1fr));border:1px solid var(--line);border-top:0;background:var(--panel)}
.kpi{padding:11px 13px;border-right:1px solid var(--line)}
.kpi:last-child{border-right:0}
.kpi .k{font-size:10px;color:var(--ink3);letter-spacing:.06em;text-transform:uppercase}
.kpi .v{font:600 19px/1.3 var(--mono);margin-top:3px}
.kpi .u{font-size:10px;color:var(--ink3);margin-left:2px;font-weight:400}
.kpi.good .v{color:var(--good)}
.kpi.bad .v{color:var(--bad)}

/* 图表 */
.chartbox{background:var(--panel);border:1px solid var(--line);border-top:0;padding:12px 14px 8px}
.tabs{display:flex;gap:0;border-bottom:1px solid var(--line);margin-bottom:10px;flex-wrap:wrap}
.tabs button{
  background:none;border:0;border-bottom:2px solid transparent;padding:5px 11px 6px;
  font-size:11.5px;color:var(--ink3);
}
.tabs button.on{color:var(--accent);border-bottom-color:var(--accent);font-weight:600}
.tabs button:hover{color:var(--ink)}
svg.chart{display:block;width:100%;height:216px}
.chartcap{font-size:10.5px;color:var(--ink3);margin-top:4px;line-height:1.5}

/* 表格 */
.tbl{width:100%;font-size:12px}
.tbl th{
  text-align:left;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink3);
  border-bottom:1px solid var(--line2);padding:6px 8px;font-weight:600;white-space:nowrap;
  background:var(--panel2);position:sticky;top:0;
}
.tbl td{border-bottom:1px solid var(--line);padding:6px 8px;vertical-align:top}
.tbl tr:hover td{background:var(--panel2)}
.tbl td.n,.tbl th.n{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums}
.tag{display:inline-block;padding:1px 5px;font-size:10px;letter-spacing:.04em;border:1px solid}
.tag.pass{color:var(--good);border-color:#bdd8c8;background:#eef5f1}
.tag.fail{color:var(--bad);border-color:#e0c4c0;background:#f8efee}
.tag.unk{color:var(--warn);border-color:#e2d3b6;background:#f9f4e9}

/* 上传区 */
.drop{
  border:1px dashed var(--line2);background:var(--panel2);padding:22px 18px;text-align:center;
  transition:background .12s,border-color .12s;
}
.drop.hot{border-color:var(--accent);background:var(--soft)}
.drop b{display:block;font-size:13px;margin-bottom:3px}
.drop span{font-size:11px;color:var(--ink3)}
.codein{
  width:100%;background:var(--panel);border:1px solid var(--line2);padding:8px;
  font:11px/1.6 var(--mono);resize:vertical;
}
.codein:focus{outline:none;border-color:var(--accent)}

/* 历史 */
.hitem{border-bottom:1px solid var(--line);padding:9px 2px;display:flex;gap:12px;align-items:center}
.hitem:hover{background:var(--panel2)}
.hitem .hmain{flex:1 1 auto;min-width:0}
.hitem .ht{font-size:12px}
.hitem .hs{font-size:10.5px;color:var(--ink3);font-family:var(--mono)}
.hitem .hact{display:flex;gap:6px;opacity:0;transition:opacity .1s}
.hitem:hover .hact{opacity:1}
.star{background:none;border:0;font-size:13px;color:var(--line2);padding:0 2px}
.star.on{color:var(--warn)}

/* 报告 */
.rep{display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--line);padding:9px 2px}
.rep .rn{flex:1 1 auto;font-size:12px;min-width:0;overflow:hidden;text-overflow:ellipsis}
.rep .rm{font:10.5px/1 var(--mono);color:var(--ink3)}

/* toast */
.toast{
  position:fixed;left:50%;bottom:26px;transform:translateX(-50%);
  background:var(--ink);color:var(--paper);padding:9px 16px;font-size:12px;z-index:90;
  max-width:70vw;
}
.toast.err{background:var(--bad)}

/* ---------- AI ---------- */
.aifab{
  position:fixed;right:20px;bottom:20px;width:46px;height:46px;background:var(--accent);
  color:#fff;border:0;font:600 12px/1 var(--mono);letter-spacing:.06em;z-index:70;
}
.aifab:hover{background:var(--ink)}
.aipanel{
  position:fixed;right:20px;bottom:20px;width:392px;max-height:calc(100vh - 90px);
  background:var(--panel);border:1px solid var(--ink2);z-index:80;
  display:flex;flex-direction:column;
}
.aihead{display:flex;align-items:baseline;gap:8px;padding:10px 12px;border-bottom:1px solid var(--line)}
.aihead b{font-size:12.5px}
.aisub{font-size:10px;color:var(--ink3);flex:1 1 auto}
.aigroups{display:flex;border-bottom:1px solid var(--line)}
.aigroups button{
  flex:1;background:var(--panel);border:0;border-right:1px solid var(--line);
  padding:5px 2px;font-size:10.5px;color:var(--ink3);
}
.aigroups button:last-child{border-right:0}
.aigroups button.on{color:var(--accent);font-weight:600;background:var(--soft)}
.aitpls{max-height:168px;overflow-y:auto;border-bottom:1px solid var(--line)}
.aitpl{
  display:block;width:100%;text-align:left;background:var(--panel);border:0;
  border-bottom:1px solid var(--line);padding:6px 11px;
}
.aitpl:hover{background:var(--panel2)}
.aitpl.on{background:var(--soft);box-shadow:inset 2px 0 0 var(--accent)}
.aitpl b{display:block;font-size:11.5px;font-weight:600}
.aitpl span{font-size:10px;color:var(--ink3)}
.aibody{padding:10px 11px;display:flex;flex-direction:column;gap:8px;min-height:0}
.aiout{
  background:#fff;border:1px solid var(--line);padding:9px 10px;font-size:12px;line-height:1.75;
  max-height:230px;overflow-y:auto;white-space:pre-wrap;min-height:64px;
}
.aictx{
  width:100%;background:var(--panel);border:1px solid var(--line2);padding:6px 8px;
  font-size:11.5px;resize:vertical;
}
.aictx:focus{outline:none;border-color:var(--accent)}
.airow{display:flex;align-items:center;gap:8px}
.aihint{flex:1 1 auto;font-size:10px;color:var(--ink3);line-height:1.4}
.aiactions{display:flex;gap:6px}
.aiactions .ghost{flex:1}

@media (max-width:900px){
  .app{flex-direction:column}
  .side{width:100%;flex:0 0 auto;height:auto;position:static;flex-direction:row;flex-wrap:wrap;padding:8px}
  .navgroup,.sidefoot .kerneltag,.recent{display:none}
  .nav{width:auto;border-left:0;border-bottom:2px solid transparent;padding:6px 10px}
  .nav.on{border-left:0;border-bottom-color:var(--accent)}
  .sidefoot{margin:0;border:0;padding:0}
  .main{padding:16px}
  .aipanel{right:8px;left:8px;width:auto;bottom:8px}
}

/* 历史对比与热图 */
.hchk{accent-color:var(--accent);width:13px;height:13px;cursor:pointer;flex:0 0 auto}
.heatlegend{display:flex;flex-wrap:wrap;gap:14px;margin-top:9px;font-size:10px;color:var(--ink3);align-items:center}
.heatlegend i{display:inline-block;width:10px;height:10px;margin-right:4px;vertical-align:-1px}

/* ================================================================
   1.6.1 首页（门厅）· Google 清爽风：纯白、大留白、胶囊搜索、轻圆角卡片
   工作区（工作间）保持纸面 + 零圆角，两者靠 at-home 切换
   ================================================================ */
[hidden]{display:none !important}

:focus-visible{outline:2px solid var(--accent2);outline-offset:2px}
.panel,.primary,.ghost,.preset,.nav{transition:background .15s,border-color .15s,color .15s}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:#cfcec6;border:3px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover{background:#b3b2a9;border:3px solid transparent;background-clip:content-box}
::-webkit-scrollbar-track{background:transparent}

body.at-home{background:#fff}
.home{min-height:100vh;display:flex;flex-direction:column;background:#fff;color:#1b1c1e}

/* 顶条 */
.hbar{height:64px;display:flex;align-items:center;gap:16px;padding:0 28px;flex:0 0 auto}
.hbrand{display:flex;align-items:center;gap:9px}
.hmark{
  width:26px;height:26px;border-radius:7px;background:var(--accent);color:#fff;
  display:grid;place-items:center;font:600 10.5px/1 var(--mono);letter-spacing:.04em;
}
.hname{font-size:13px;font-weight:600;letter-spacing:-.01em;color:#202124}
.hmeta{display:flex;align-items:center;gap:9px;font:10.5px/1 var(--mono);color:#9aa0a6;margin-left:4px}
.hdot{width:6px;height:6px;border-radius:50%;background:#dadce0;display:inline-block}
.hdot.on{background:var(--good)}
.hsep{width:1px;height:11px;background:#e4e5e7;display:inline-block}
.hright{margin-left:auto}
.hlink{
  background:#fff;border:1px solid #dfe1e5;border-radius:999px;padding:8px 17px;
  font-size:12.5px;color:#3c4043;transition:border-color .16s,color .16s,background .16s,box-shadow .16s;
}
.hlink:hover{border-color:#c6d2e2;color:var(--accent);background:#f7f9fc;box-shadow:0 1px 4px rgba(32,33,36,.08)}

/* 主区 */
.hmain{flex:1 1 auto;width:100%;max-width:1080px;margin:0 auto;padding:0 32px 44px}
.hhero{text-align:center;margin:8vh 0 0}
.htitle{font-size:54px;line-height:1.08;letter-spacing:-.035em;font-weight:600;color:#161718}
.ht-mini{font-size:.52em;font-weight:500;letter-spacing:-.01em;color:var(--accent);vertical-align:6%}
.hrole{margin:14px 0 0;font-size:14px;color:#70757a;letter-spacing:.05em}
.hslogan{
  margin:28px 0 0;font-size:28px;line-height:1.55;letter-spacing:-.02em;
  font-weight:600;color:var(--accent);
}
.hby{margin:15px 0 0;font-size:12.5px;color:#8a9096;letter-spacing:.03em}

/* 搜索框（视觉焦点） */
.hsearch{
  max-width:820px;margin:48px auto 0;height:104px;display:flex;align-items:center;gap:14px;
  padding:0 12px 0 28px;background:#fff;border:1px solid #dfe1e5;border-radius:999px;
  box-shadow:0 2px 10px rgba(32,33,36,.08);
  transition:box-shadow .18s,border-color .18s;
}
.hsearch:hover{border-color:transparent;box-shadow:0 1px 6px rgba(32,33,36,.16)}
.hsearch:focus-within{border-color:transparent;box-shadow:0 1px 9px rgba(32,33,36,.18)}
.hglass{width:26px;height:26px;flex:0 0 auto;color:#9aa0a6}
#homeAsk{
  flex:1 1 auto;min-width:0;height:100%;border:0;outline:none;background:transparent;
  font-size:20px;color:#202124;
}
#homeAsk::placeholder{color:#9aa0a6}
.hgo{
  flex:0 0 auto;background:var(--accent);color:#fff;border:0;border-radius:999px;
  padding:16px 32px;font-size:15px;font-weight:600;letter-spacing:.02em;
  transition:background .16s,opacity .16s;
}
.hgo:hover{background:#16345a}
.hgo:disabled{background:#9aaec6;cursor:default}
.hsearch:focus-within{box-shadow:0 4px 22px rgba(27,63,110,.16);border-color:transparent}

/* 视频 */
.hvideo{max-width:860px;margin:64px auto 0;text-align:center}
.hvTitle{font-size:22px;letter-spacing:-.02em;font-weight:600;color:#161718}
.hvSub{margin:8px 0 0;font-size:13px;color:#70757a}
.hvPlayer{
  width:100%;margin-top:18px;border-radius:14px;background:#000;
  box-shadow:0 6px 28px rgba(20,25,35,.22);aspect-ratio:16/9;
}

/* 建议问题 */
.hchips{display:flex;gap:9px;justify-content:center;flex-wrap:wrap;margin-top:18px}
.hchips button{
  background:#f1f3f4;border:0;border-radius:999px;padding:7px 15px;
  font-size:12.5px;color:#3c4043;transition:background .15s,color .15s;
}
.hchips button:hover{background:#e6ebf3;color:var(--accent)}

/* 回答卡 */
.hans{
  max-width:760px;margin:22px auto 0;background:#fff;border:1px solid #e4e5e7;border-radius:12px;
  padding:16px 19px 12px;text-align:left;box-shadow:0 1px 3px rgba(32,33,36,.06);
  animation:hansIn .18s ease-out;
}
@keyframes hansIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.hansHead{display:flex;align-items:center;gap:8px;margin-bottom:9px}
.hansTag{
  font:10px/1 var(--mono);letter-spacing:.06em;color:var(--accent);
  background:#f2f6fb;border:1px solid #d6e2ef;border-radius:4px;padding:3px 6px;
}
.hansX{margin-left:auto;background:none;border:0;font-size:11px;color:#80868b;padding:2px 4px}
.hansX:hover{color:var(--accent)}
.hansBody{font-size:14.5px;line-height:1.9;color:#202124;white-space:pre-wrap;min-height:24px}
.hansWait{color:#80868b;font-size:12.5px}
.hansFoot{display:flex;align-items:center;gap:12px;margin-top:11px;border-top:1px solid #f1f3f4;padding-top:8px}

/* 三个价值卡 */
.hcards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:56px}
.hcard{
  display:flex;flex-direction:column;align-items:flex-start;text-align:left;
  background:#fff;border:1px solid #e6e7e9;border-radius:12px;padding:21px 20px 19px;
  min-height:168px;transition:border-color .18s,box-shadow .18s,transform .18s;
}
.hcard:hover{border-color:#c3d2e4;box-shadow:0 4px 16px rgba(27,63,110,.10);transform:translateY(-2px)}
.hcard:active{transform:none;box-shadow:0 1px 4px rgba(27,63,110,.08)}
.hcTop{display:flex;align-items:center;width:100%;margin-bottom:16px}
.hcIdx{font:11px/1 var(--mono);color:#a8adb3;letter-spacing:.08em;font-weight:600}
.hcArrow{margin-left:auto;font-size:14px;color:#c4c8cc;transition:color .18s,transform .18s}
.hcard:hover .hcArrow{color:var(--accent);transform:translateX(3px)}
.hcName{font-size:16px;font-weight:600;color:#1b1c1e;letter-spacing:-.01em}
.hcDesc{font-size:12.5px;color:#5f6368;line-height:1.72;margin-top:8px}
.hcTags{margin-top:auto;padding-top:15px}
.hcTags i{font-style:normal;font-size:11px;color:var(--accent);background:#f2f6fb;border-radius:4px;padding:3px 9px}

.hfoot{text-align:center;font-size:11px;color:#9aa0a6;margin:46px 0 0;line-height:1.7}

/* 工作区里的返回首页 */
.homeback{flex:0 0 auto;padding:4px 9px}
.hmark,.top .mark{border-radius:7px;background:var(--accent)}

@media (max-width:1100px){
  .hcards{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:900px){
  .hbar{height:56px;padding:0 16px;gap:10px}
  .hname,.hsep,.hmeta span:last-child{display:none}
  .hmain{padding:0 18px 30px}
  .hhero{margin-top:5vh}
  .htitle{font-size:38px}
  .hslogan{font-size:20px;margin-top:20px}
  .hsearch{height:72px;margin-top:28px}
  #homeAsk{font-size:16px}
  .hgo{padding:12px 22px;font-size:13.5px}
  .hvideo{margin-top:38px}
  .hcards{grid-template-columns:1fr;gap:10px;margin-top:34px}
  .hcard{min-height:0;padding:16px}
  .hcTop{margin-bottom:10px}
  .hfoot{margin-top:30px}
  .side{width:100%;flex:0 0 auto;height:auto;position:static;flex-direction:row;flex-wrap:wrap;padding:8px}
  .navgroup,.sidefoot .kerneltag,.recent{display:none}
  .nav{width:auto;border-left:0;border-bottom:2px solid transparent;padding:6px 10px}
  .nav.on{border-left:0;border-bottom-color:var(--accent)}
  .sidefoot{margin:0;border:0;padding:0}
  .main{padding:16px}
  .aipanel{right:8px;left:8px;width:auto;bottom:8px}
}