:root {
  --ink: #0f1f3d;
  --muted: #66748d;
  --line: #e5ebf4;
  --paper: #ffffff;
  --wash: #f5f8fc;
  --brand: #168bd2;
  --brand-dark: #0876b8;
  --accent: #53c6a5;
  --warning: #fff7e8;
  --radius: 18px;
  --shadow: 0 12px 35px rgba(28, 62, 106, .09);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--wash);color:var(--ink);font:15px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{width:min(1120px,calc(100% - 32px));margin:auto}
.topbar{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.92);backdrop-filter:blur(14px);border-bottom:1px solid rgba(229,235,244,.85)}
.nav{height:70px;display:flex;align-items:center;gap:24px}
.brand{display:flex;align-items:center;gap:11px;font-weight:800;font-size:19px;letter-spacing:-.4px}
.brand-mark{width:38px;height:38px;border-radius:12px;background:linear-gradient(145deg,#38bdf8,var(--brand-dark));display:grid;place-items:center;color:white;box-shadow:0 8px 18px rgba(22,139,210,.25)}
.brand-mark svg{width:21px}
.nav-links{display:flex;gap:20px;color:#41516c;margin-left:auto;font-weight:600}
.nav-links a:hover{color:var(--brand)}
.hero{padding:76px 0 46px;background:radial-gradient(circle at 80% 10%,rgba(83,198,165,.2),transparent 30%),radial-gradient(circle at 18% 18%,rgba(22,139,210,.19),transparent 34%),linear-gradient(180deg,#fff 0%,var(--wash) 100%)}
.eyebrow{display:inline-flex;align-items:center;gap:8px;padding:7px 11px;background:#e9f7ff;color:#0678bd;border-radius:999px;font-size:12px;font-weight:800;letter-spacing:.4px}
.eyebrow:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent)}
h1{font-size:clamp(34px,6vw,62px);line-height:1.08;letter-spacing:-2.2px;margin:20px 0 18px;max-width:780px}
.hero p{font-size:18px;color:var(--muted);max-width:660px;margin:0 0 28px}
.search-box{display:flex;gap:10px;max-width:720px;background:white;padding:8px;border:1px solid var(--line);border-radius:17px;box-shadow:var(--shadow)}
.search-box input{border:0;outline:0;flex:1;padding:12px 14px;font-size:16px;min-width:0;background:transparent}
.search-box button,.primary{border:0;background:var(--brand);color:white;border-radius:12px;padding:12px 20px;font-weight:800;cursor:pointer}
.search-box button:hover,.primary:hover{background:var(--brand-dark)}
.stats{display:flex;gap:30px;margin-top:28px;color:var(--muted)}
.stats b{display:block;font-size:22px;color:var(--ink)}
.section{padding:34px 0 70px}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:22px}
.section-head h2{font-size:28px;margin:0;letter-spacing:-.8px}
.section-head p{margin:4px 0 0;color:var(--muted)}
.filters{display:flex;gap:9px;flex-wrap:wrap;margin:0 0 22px}
.chip{border:1px solid var(--line);background:white;color:#53627a;border-radius:999px;padding:8px 13px;cursor:pointer;font-weight:700}
.chip.active,.chip:hover{border-color:#9bd9f7;background:#eaf8ff;color:#0877b8}
.tag-cloud{gap:8px}.tag-cloud .chip{background:#315783;color:#fff;border-color:#315783;padding:7px 14px}.tag-cloud .chip:hover{background:#168bd2;border-color:#168bd2;color:#fff}.all-tags .chip{display:inline-flex;gap:7px;align-items:center}.all-tags .chip small{opacity:.7;font-size:11px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:20px;min-height:242px;display:flex;flex-direction:column;box-shadow:0 2px 0 rgba(18,54,91,.02);transition:.2s ease}
.card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:#cfe0f2}
.card-top{display:flex;gap:13px;align-items:center}
.avatar{width:54px;height:54px;flex:0 0 54px;border-radius:15px;object-fit:cover;background:linear-gradient(145deg,#dff4ff,#dff8f0);border:1px solid #d9e8f4}
.avatar-fallback{display:grid;place-items:center;color:var(--brand);font-size:20px;font-weight:900}
.card h3{font-size:17px;line-height:1.35;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.meta{color:var(--muted);font-size:13px;margin-top:5px}
.desc{color:#53627a;margin:16px 0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.card-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;border-top:1px solid var(--line);padding-top:14px}
.tag{font-size:12px;font-weight:800;color:#167c64;background:#e9faf5;border-radius:999px;padding:4px 9px}
.more{color:var(--brand);font-weight:800}
.empty{display:none;padding:45px;text-align:center;background:white;border:1px dashed #c7d6e7;border-radius:var(--radius);color:var(--muted)}
.page-head{padding:38px 0;background:linear-gradient(180deg,#fff,var(--wash))}.page-head h1{font-size:36px;letter-spacing:-1px;margin:0 0 18px}.pagination{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin:32px 0 0}.pagination a,.pagination button{min-width:40px;padding:9px 12px;border:1px solid var(--line);border-radius:9px;background:#fff;color:#41516c;font-weight:700;text-align:center;cursor:pointer}.pagination a.active,.pagination button.active,.pagination a:hover,.pagination button:hover{background:var(--brand);border-color:var(--brand);color:#fff}
.detail{padding:42px 0 72px}
.breadcrumbs{color:var(--muted);font-size:13px;margin-bottom:18px}.breadcrumbs a{color:var(--brand)}
.detail-card{display:grid;grid-template-columns:1fr 310px;gap:24px;align-items:start}
.detail-main,.side-card{background:white;border:1px solid var(--line);border-radius:22px;padding:28px;box-shadow:var(--shadow)}
.detail-title{display:flex;gap:18px;align-items:center}.detail-title .avatar{width:76px;height:76px;flex-basis:76px;border-radius:21px}.detail-title h1{font-size:30px;letter-spacing:-.8px;margin:0 0 6px}
.prose{margin-top:26px;color:#42516a;font-size:16px;white-space:pre-line}
.notice{margin-top:25px;background:var(--warning);border:1px solid #f4dfb5;border-radius:14px;padding:14px;color:#795c28;font-size:13px}
.side-card h2{font-size:18px;margin:0 0 16px}.facts{display:grid;gap:13px;margin:0}.facts div{border-bottom:1px solid var(--line);padding-bottom:11px}.facts dt{font-size:12px;color:var(--muted)}.facts dd{margin:2px 0 0;font-weight:800;overflow-wrap:anywhere}
.source{display:block;text-align:center;margin-top:18px;background:var(--brand);color:white;padding:12px;border-radius:12px;font-weight:800}
.source.secondary{background:#eef7fc;color:var(--brand)}
.qr-block{display:grid;justify-items:center;gap:7px;margin-top:20px;padding:15px;border:1px solid var(--line);border-radius:12px;color:var(--muted);font-size:13px}.qr-block img{width:180px;height:180px;object-fit:contain}
.ad-slot{position:relative;width:min(1120px,calc(100% - 32px));margin:20px auto;padding:16px;background:#fff;border:1px solid var(--line);border-radius:14px;text-align:center;color:var(--muted);overflow:hidden}.ad-slot small{position:absolute;top:5px;right:7px;font-size:10px;color:#9aa7ba}.ad-slot a{display:flex;align-items:center;justify-content:center;gap:12px}.ad-slot img{max-height:100px;width:auto;border-radius:9px}.ad-detail_sidebar{width:100%;margin:18px 0 0}.ad-detail_sidebar a{display:grid}.friend-links{display:flex;gap:14px;flex-wrap:wrap;align-items:center;margin-top:28px;padding-top:22px;border-top:1px solid #203653}.friend-links strong{color:#fff}.friend-links a:hover{color:#fff}
.page{padding:42px 0 70px}.page-panel{background:white;border:1px solid var(--line);border-radius:22px;padding:clamp(22px,5vw,46px);max-width:860px}.page-panel h1{font-size:36px;margin-top:0}.page-panel h2{margin-top:30px}
.footer{background:#0c1d37;color:#afbdd1;padding:42px 0}.footer-grid{display:flex;justify-content:space-between;gap:26px}.footer .brand{color:white}.footer-links{display:flex;gap:18px;flex-wrap:wrap}.footer small{display:block;margin-top:16px;color:#73829a}
@media(max-width:900px){.grid{grid-template-columns:repeat(2,1fr)}.detail-card{grid-template-columns:1fr}.side-card{order:-1}}
@media(max-width:620px){.wrap{width:min(100% - 22px,1120px)}.nav{height:62px}.nav-links a:not(:last-child){display:none}.hero{padding:48px 0 30px}h1{font-size:38px;letter-spacing:-1.2px}.search-box button{padding:11px 14px}.stats{gap:18px}.grid{grid-template-columns:1fr}.section{padding-bottom:50px}.detail-main,.side-card{padding:20px}.detail-title{align-items:flex-start}.detail-title h1{font-size:23px}.footer-grid{display:block}.footer-links{margin-top:20px}}