/* ============================================================
   云舟导航 · 样式
   配色：蓝 #1d4ed8 / 绿 #059669 / 白  —— 静态，无花哨动效
   ============================================================ */

:root{
  --blue:#1d4ed8; --blue2:#2563eb; --blue-soft:rgba(29,78,216,.08);
  --green:#059669; --green2:#10b981; --green-soft:rgba(5,150,105,.10);
  --ink:#0d1f2b; --ink2:#44606f; --ink3:#8298a6;
  --bg:#f6fbf9; --card:#ffffff;
  --line:rgba(16,64,52,.10); --line2:rgba(16,64,52,.18);
  --sh-s:0 1px 2px rgba(16,64,52,.05);
  --sh-m:0 2px 6px rgba(16,64,52,.06), 0 10px 24px -18px rgba(16,64,52,.28);
  --r-s:10px; --r-m:14px; --r-l:20px;
  --top-h:60px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--bg);
  color:var(--ink);
  font:14px/1.6 -apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Segoe UI",Roboto,sans-serif;
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
input{font:inherit}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:rgba(16,64,52,.16);border-radius:8px;border:2px solid var(--bg)}
::-webkit-scrollbar-track{background:transparent}

/* ---------------- 顶栏 ---------------- */
.topbar{
  position:sticky;top:0;z-index:50;
  height:var(--top-h);
  display:flex;align-items:center;gap:14px;
  padding:0 22px;
  background:rgba(255,255,255,.94);
  border-bottom:1px solid var(--line);
}
.brand{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.brand .mark{
  width:32px;height:32px;border-radius:9px;flex:0 0 auto;
  background:linear-gradient(145deg,var(--blue2),var(--green));
  box-shadow:var(--sh-s);
  display:grid;place-items:center;
}
.brand .mark svg{width:18px;height:18px;stroke:#fff;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.brand .nm{font-size:15px;font-weight:650;letter-spacing:-.01em}
.brand .nm small{display:block;font-size:11px;font-weight:400;color:var(--ink3);letter-spacing:.02em}

.searchwrap{flex:1;max-width:420px;margin-left:auto;position:relative}
.searchwrap svg{
  position:absolute;left:12px;top:50%;transform:translateY(-50%);
  width:15px;height:15px;stroke:var(--ink3);fill:none;stroke-width:2;stroke-linecap:round;
}
#q{
  width:100%;height:38px;
  padding:0 36px 0 34px;
  border:1px solid var(--line2);border-radius:11px;
  background:#fff;color:var(--ink);outline:none;
  transition:border-color .12s,box-shadow .12s;
}
#q::placeholder{color:var(--ink3)}
#q:focus{border-color:rgba(29,78,216,.55);box-shadow:0 0 0 3px rgba(29,78,216,.10)}
.qclear{
  position:absolute;right:6px;top:50%;transform:translateY(-50%);
  width:26px;height:26px;border-radius:8px;display:none;place-items:center;color:var(--ink3);
}
.qclear.on{display:grid}
.qclear:hover{background:var(--blue-soft);color:var(--blue)}
.adminlink{
  flex:0 0 auto;font-size:12.5px;color:var(--ink3);
  padding:7px 11px;border-radius:9px;border:1px solid var(--line);
  transition:color .12s,border-color .12s;
}
.adminlink:hover{color:var(--blue);border-color:rgba(29,78,216,.35)}

/* ---------------- 主体 ---------------- */
.wrap{max-width:1240px;margin:0 auto;padding:22px 22px 60px}

.hero{padding:6px 0 18px}
.hero h1{
  margin:0 0 8px;font-size:clamp(22px,3vw,30px);line-height:1.25;
  letter-spacing:-.02em;font-weight:680;
}
.hero h1 em{font-style:normal;color:var(--blue)}
.hero p{margin:0;color:var(--ink2);font-size:13.5px}
.hero .stat{display:flex;gap:18px;margin-top:12px;font-size:12.5px;color:var(--ink3)}
.hero .stat b{color:var(--green);font-weight:650;font-variant-numeric:tabular-nums}
.notice{
  display:none;margin:0 0 16px;padding:11px 14px;border-radius:12px;
  background:var(--green-soft);border:1px solid rgba(5,150,105,.22);
  color:#046b4c;font-size:13px;line-height:1.7;
}
.notice.on{display:block}

/* ---------------- 分类条 ---------------- */
.catbar{
  position:sticky;top:var(--top-h);z-index:40;
  display:flex;gap:8px;overflow-x:auto;
  padding:12px 0 13px;margin:0 0 6px;
  background:linear-gradient(180deg,var(--bg) 72%,rgba(246,251,249,0));
  scrollbar-width:none;
}
.catbar::-webkit-scrollbar{display:none}
.pill{
  flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;
  height:34px;padding:0 15px;border-radius:999px;
  border:1px solid var(--line2);background:#fff;
  font-size:13px;color:var(--ink2);white-space:nowrap;
  transition:border-color .12s,color .12s,background-color .12s;
}
.pill:hover{border-color:rgba(29,78,216,.4);color:var(--blue)}
.pill.on{background:var(--blue);border-color:var(--blue);color:#fff;font-weight:560}
.pill.empty-cat{opacity:.55}
.pill.empty-cat:hover{opacity:1}
.pill .n{font-size:11.5px;opacity:.62;font-variant-numeric:tabular-nums}

/* ---------------- 分组 ---------------- */
.group{margin:26px 0 0}
.group:first-of-type{margin-top:10px}
.ghead{display:flex;align-items:center;gap:9px;margin:0 0 13px}
.ghead::before{content:"";width:3px;height:15px;border-radius:2px;background:linear-gradient(180deg,var(--blue),var(--green))}
.ghead h2{margin:0;font-size:15px;font-weight:650;letter-spacing:-.01em}
.ghead .cnt{font-size:12px;color:var(--ink3);font-variant-numeric:tabular-nums}

/* ---------------- 卡片网格 ---------------- */
.grid{
  display:grid;gap:12px;
  grid-template-columns:repeat(4,minmax(0,1fr));
}
@media (max-width:1080px){ .grid{grid-template-columns:repeat(3,minmax(0,1fr));} }
@media (max-width:860px){ .grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
.card{
  display:flex;align-items:center;gap:11px;
  min-height:72px;
  padding:13px 14px;border-radius:var(--r-m);
  background:var(--card);border:1px solid var(--line);
  box-shadow:var(--sh-s);
  transition:border-color .12s,box-shadow .12s,transform .12s;
  position:relative;overflow:hidden;
  min-width:0;
}
.card:hover{
  border-color:rgba(29,78,216,.36);
  box-shadow:var(--sh-m);
  transform:translateY(-1px);
}
.card:active{transform:translateY(0)}

.ico{
  width:42px;height:42px;border-radius:11px;flex:0 0 auto;
  display:grid;place-items:center;overflow:hidden;
  background:var(--blue-soft);color:var(--blue);
  font-size:16px;font-weight:650;letter-spacing:-.02em;
  border:1px solid rgba(29,78,216,.10);
}
.ico img{width:100%;height:100%;object-fit:cover;display:block}
.ico.g{background:var(--green-soft);color:var(--green);border-color:rgba(5,150,105,.14)}
.ico.b{background:rgba(37,99,235,.10);color:var(--blue2);border-color:rgba(37,99,235,.14)}
.ico.t{background:rgba(13,148,136,.10);color:#0d9488;border-color:rgba(13,148,136,.14)}
.ico.o{background:rgba(217,119,6,.10);color:#b45309;border-color:rgba(217,119,6,.14)}
.ico svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

.meta{min-width:0;flex:1;padding-top:1px}
.meta .nm{
  font-size:13.5px;font-weight:600;letter-spacing:-.01em;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.meta .ds{
  margin-top:3px;font-size:12px;color:var(--ink3);line-height:1.5;
  overflow:hidden;text-overflow:ellipsis;display:-webkit-box;
  -webkit-line-clamp:2;-webkit-box-orient:vertical;
}
.meta .dm{
  margin-top:2px;font-size:11px;color:var(--ink3);opacity:.8;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.card .go{
  position:absolute;right:10px;top:12px;opacity:0;
  color:var(--blue);transition:opacity .12s;
}
.card:hover .go{opacity:.55}
.card .go svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}

/* ---------------- 空状态 ---------------- */
.empty{
  padding:64px 20px;text-align:center;color:var(--ink3);
}
.empty .ic{
  width:52px;height:52px;margin:0 auto 14px;border-radius:15px;
  display:grid;place-items:center;
  background:var(--blue-soft);color:var(--blue);
}
.empty .ic svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.empty b{display:block;color:var(--ink2);font-size:14px;margin-bottom:5px;font-weight:600}
.empty span{font-size:12.5px}

.foot{
  margin-top:44px;padding-top:18px;border-top:1px solid var(--line);
  font-size:12px;color:var(--ink3);text-align:center;line-height:1.9;
}

/* ---------------- 手机 ---------------- */
@media (max-width:720px){
  :root{--top-h:56px}
  .topbar{padding:0 13px;gap:9px}
  .brand .nm{font-size:14px}
  .brand .nm small{display:none}
  .searchwrap{max-width:none}
  #q{height:36px;padding:0 32px 0 32px;font-size:13px}
  .adminlink{padding:6px 9px;font-size:12px}
  .wrap{padding:16px 13px 48px}
  .hero{padding:2px 0 12px}
  .hero h1{font-size:21px}
  .hero p{font-size:12.5px}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .card{padding:11px;gap:9px;border-radius:12px;flex-direction:column;align-items:flex-start;min-height:116px}
  .ico{width:38px;height:38px;border-radius:10px}
  .meta .nm{font-size:13px}
  .meta .ds{font-size:11.5px;-webkit-line-clamp:1}
  .meta .dm{
  margin-top:2px;font-size:11px;color:var(--ink3);opacity:.8;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.card .go{display:none}
  .group{margin-top:20px}
}
@media (max-width:380px){
  .grid{grid-template-columns:1fr}
}