
:root{
  --bg:#f4f5f7; --card:#fff; --line:#d8dee4; --line2:#eaeef2;
  --fg:#24292f; --dim:#656d76; --dim2:#8c959f; --link:#0969da;
  --quote:#f6f8fa; --quote-line:#d0d7de; --quote-fg:#424a53;
  --warn-bg:#fff8c5; --warn-line:#d4a72c; --warn-fg:#4d3800;
}
@media (prefers-color-scheme:dark){
  :root{
    --bg:#0d1117; --card:#161b22; --line:#30363d; --line2:#21262d;
    --fg:#e6edf3; --dim:#9198a1; --dim2:#7d8590; --link:#4493f8;
    --quote:#1c2128; --quote-line:#3d444d; --quote-fg:#b1bac4;
    --warn-bg:#2d2000; --warn-line:#9e6a03; --warn-fg:#f0d58a;
  }
}
*{box-sizing:border-box}
body{margin:0;padding:0;background:var(--bg);color:var(--fg);
 font-family:'Segoe UI','Helvetica Neue',Arial,'Microsoft YaHei',sans-serif;
 font-size:14px;line-height:1.75;-webkit-text-size-adjust:100%}
.wrap{max-width:860px;margin:0 auto;padding:0 16px 40px}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;
 padding:22px 26px;margin-bottom:18px;overflow-wrap:anywhere}
h2{margin:0 0 4px;font-size:20px}
h3{margin:24px 0 8px;font-size:15px;color:var(--link);
 border-bottom:1px solid var(--line2);padding-bottom:5px}
h3:first-child{margin-top:0}
.meta{color:var(--dim);font-size:12px;margin:0 0 6px}
ul{padding-left:20px;margin:8px 0}
li{margin-bottom:12px}
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}
blockquote{margin:8px 0;padding:8px 14px;background:var(--quote);
 border-left:3px solid var(--quote-line);color:var(--quote-fg)}
i{color:var(--dim)}
code{background:var(--quote);padding:1px 5px;border-radius:4px;font-size:12.5px}
.tablebox{overflow-x:auto;margin-top:8px}
table{border-collapse:collapse;width:100%;font-size:12.5px}
th,td{border:1px solid var(--line);padding:5px 8px;text-align:left;
 vertical-align:top}
th{background:var(--quote);font-weight:600}
.spon{color:#9a6700}
.foot{color:var(--dim2);font-size:11px;margin-top:20px;
 border-top:1px solid var(--line2);padding-top:10px}
.warn{background:var(--warn-bg);border:1px solid var(--warn-line);
 color:var(--warn-fg);border-radius:6px;padding:10px 14px;margin:12px 0;
 font-size:13px}
.g官方{color:#8250df;font-weight:600}
.g权重{color:#1a7f37;font-weight:600}
.g框架{color:#bc4c00;font-weight:600}
.g媒体{color:var(--dim);font-weight:600}
@media (prefers-color-scheme:dark){
  .g官方{color:#c297ff}.g权重{color:#3fb950}
  .g框架{color:#ec8e2c}.spon{color:#d4a72c}
}

/* ── 站点外壳 ── */
header.site{border-bottom:1px solid var(--line);background:var(--card);
 margin-bottom:22px}
header.site .inner{max-width:860px;margin:0 auto;padding:14px 16px;
 display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px}
header.site .brand{font-size:16px;font-weight:700;color:var(--fg)}
header.site nav{display:flex;flex-wrap:wrap;gap:14px;font-size:13px}
header.site nav a{color:var(--dim)}
header.site nav a.on{color:var(--link);font-weight:600}
.pagehead{margin:0 0 18px}
.pagehead h1{font-size:22px;margin:0 0 4px}
.pagehead p{color:var(--dim);font-size:13px;margin:0}
.issuehead{display:flex;flex-wrap:wrap;align-items:baseline;
 justify-content:space-between;gap:8px;margin-bottom:10px}
.issuehead .d{font-size:12px;color:var(--dim);white-space:nowrap}
.badge{display:inline-block;font-size:11px;padding:1px 8px;border-radius:999px;
 background:var(--quote);color:var(--dim);border:1px solid var(--line);
 vertical-align:2px;margin-left:8px}
.badge.hot{background:rgba(31,136,61,.12);color:#1a7f37;
 border-color:rgba(31,136,61,.35)}
@media (prefers-color-scheme:dark){.badge.hot{color:#3fb950}}
ul.archive{list-style:none;padding:0;margin:0}
ul.archive li{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline;
 padding:11px 0;border-bottom:1px solid var(--line2);margin:0}
ul.archive li:last-child{border-bottom:0}
ul.archive .dt{font-variant-numeric:tabular-nums;font-weight:600;
 white-space:nowrap;min-width:5.6em}
ul.archive .sm{color:var(--dim);font-size:12px;flex:1 1 20em}
.navlinks{display:flex;justify-content:space-between;gap:12px;
 font-size:13px;margin-top:4px}
.sitefoot{max-width:860px;margin:0 auto;padding:0 16px 30px;
 color:var(--dim2);font-size:11.5px;line-height:1.7}
@media (max-width:520px){
  .wrap{padding:0 10px 30px}
  .card{padding:16px 15px}
  header.site .inner{padding:12px 10px}
  .sitefoot{padding:0 10px 26px}
  .navlinks{flex-wrap:wrap}
  .pagehead h1{font-size:19px}
  h2{font-size:18px}
}
