@font-face{font-family:Inter;src:local("Inter"),local("Inter Regular")}html{box-sizing:border-box}*,*::before,*::after{box-sizing:inherit}html,body{padding:0;margin:0}body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Noto Sans","Apple Color Emoji","Segoe UI Emoji";line-height:1.6;color:#1f2d3d;background:#f7f7f9}a{color:#0b62ff;text-decoration:none}a:hover{text-decoration:underline}img{max-width:100%;display:block}header{position:sticky;top:0;background:#ffffffcc;backdrop-filter:saturate(180%) blur(8px);border-bottom:1px solid #e6e8eb;z-index:10}header .container{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;max-width:960px;margin:0 auto}header .brand{font-weight:700;font-size:18px;color:#0f172a}nav a{margin:0 10px;color:#334155}nav a.active{color:#0b62ff}main{max-width:960px;margin:24px auto;padding:0 16px}footer{border-top:1px solid #e6e8eb;margin-top:40px;background:#fff}footer .container{max-width:960px;margin:0 auto;padding:20px 16px;color:#64748b;font-size:14px}footer .links{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}footer .beian{display:flex;flex-direction:column;gap:4px;margin-top:8px}h1{font-size:32px;margin:0 0 12px;color:#0f172a}h2{font-size:24px;margin:24px 0 12px;color:#0f172a}p{margin:12px 0}ul{padding-left:18px}button{appearance:none;border:1px solid #cbd5e1;background:#fff;border-radius:8px;padding:8px 12px;color:#0f172a}section.hero{padding:40px 0}section.hero .title{font-size:36px;font-weight:800;margin-bottom:8px;color:#0f172a}section.hero .subtitle{font-size:18px;color:#475569}section.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px;margin-top:24px}section.grid .card{grid-column:span 12;background:#fff;border:1px solid #e6e8eb;border-radius:12px;padding:16px}@media(min-width:720px){section.grid .card{grid-column:span 6}}.post-list{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}.post-item{grid-column:span 12;background:#fff;border:1px solid #e6e8eb;border-radius:12px;padding:16px}.post-item h3{margin:0 0 8px;font-size:20px;color:#0f172a}.post-item .meta{font-size:13px;color:#64748b}.badge{display:inline-block;background:#eef2ff;color:#3730a3;border:1px solid #c7d2fe;border-radius:999px;padding:2px 8px;font-size:12px}.muted{color:#64748b}.center{display:flex;align-items:center;justify-content:center}.kicker{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#7c3aed}.nowrap{white-space:nowrap}
.pager{margin:24px 0;gap:8px}
.pager a{border:1px solid #cbd5e1;border-radius:8px;padding:6px 10px;color:#0f172a;background:#fff}
.pager a.active{background:#0b62ff;color:#fff;border-color:#0b62ff}
.btn{display:inline-block;border:1px solid #cbd5e1;background:#fff;border-radius:10px;padding:10px 16px;color:#0f172a;font-weight:600}
.btn-primary{background:#0b62ff;color:#fff;border-color:#0b62ff}
.btn-primary:hover{filter:brightness(1.05)}
.btn-secondary{background:#fff;color:#0b62ff;border-color:#cbd5e1}
.btn-secondary:hover{background:#f1f5f9}
.card:hover{box-shadow:0 6px 20px rgba(16,24,40,.08);transform:translateY(-2px);transition:all .2s ease}
section.hero{padding:64px clamp(16px, 6vw, 32px);background-image:linear-gradient(180deg,rgba(15,23,42,.6),rgba(15,23,42,.3)),url('../images/bg.jpg');background-size:cover;background-position:center;color:#fff;border-radius:16px}
section.hero .title{color:#fff}
section.hero .subtitle{color:#e2e8f0}
.feature-icons{display:grid;grid-template-columns:repeat(12,1fr);gap:16px;margin-top:24px}
.feature-icons .card{grid-column:span 12}
@media(min-width:720px){.feature-icons .card{grid-column:span 4}}
.feature-icons h3{margin:0 0 8px;font-size:18px;color:#0f172a}
.feature-icons p{margin:0;color:#64748b}
.feature-icons p{margin:6px 0}
.img-responsive{max-width:100%;height:auto;display:block}
img{height:auto}
.theme-dark body{color:#e2e8f0;background:#0b1220}
.theme-dark header{background:#0b1220cc;border-bottom-color:#23314a}
.theme-dark nav a{color:#cbd5e1}
.theme-dark nav a:hover{background:#172033}
.theme-dark nav a.active{background:#16325b;color:#fff}
.theme-dark footer{background:#0b1220;border-top-color:#23314a}
.theme-dark footer .container{color:#cbd5e1}
.theme-dark .card,.theme-dark .post-item{background:#0f172a;border-color:#23314a}
.theme-dark .card,.theme-dark .post-item{color:#e2e8f0}
.theme-dark .post-item h3{color:#e2e8f0}
.theme-dark .post-item .meta{color:#cbd5e1}
.theme-dark .feature-icons h3{color:#e2e8f0}
.theme-dark .feature-icons p{color:#d1d7e2}
.theme-dark .muted{color:#cbd5e1}
.theme-dark .badge{background:#172554;color:#93c5fd;border-color:#1e3a8a}
.theme-dark .pager a{background:#0f172a;color:#e2e8f0;border-color:#23314a}
.theme-dark .pager a.active{background:#2563eb;border-color:#2563eb}
.theme-dark blockquote{background:#0b1626;color:#cbd5e1;border-left-color:#60a5fa}
.theme-dark .btn{border-color:#334155;color:#e2e8f0;background:#0f172a}
.theme-dark .btn-primary{background:#2563eb;border-color:#2563eb;color:#fff}
.theme-dark .btn-secondary{background:#0f172a;color:#60a5fa;border-color:#334155}
nav .theme-toggle{border:1px solid #cbd5e1;background:#fff;border-radius:8px;padding:6px 10px;color:#0f172a;display:inline-flex;align-items:center;justify-content:center}
.theme-toggle svg{width:18px;height:18px}
.theme-dark nav .theme-toggle{background:#0f172a;color:#cbd5e1;border-color:#334155}
pre.with-line-numbers{position:relative;padding-left:46px}
pre.with-line-numbers code{counter-reset:ln}
pre.with-line-numbers code .code-line{display:block;position:relative}
pre.with-line-numbers code .code-line::before{content:counter(ln);counter-increment:ln;position:absolute;left:-36px;color:#64748b}
.post-item .cover{width:100%;aspect-ratio:16/9;border-radius:10px;object-fit:cover;margin-bottom:8px}
.cover.skeleton{background:linear-gradient(90deg,#f1f5f9 0,#e2e8f0 40%,#f1f5f9 80%);background-size:400px 100%;animation:shimmer 1.2s linear infinite}
@keyframes shimmer{0%{background-position:-200px 0}100%{background-position:200px 0}}
.img-responsive.skeleton{background:linear-gradient(90deg,#f1f5f9 0,#e2e8f0 40%,#f1f5f9 80%);background-size:400px 100%;animation:shimmer 1.2s linear infinite}
.tok-kw{color:#0b62ff}
.tok-string{color:#2e7d32}
.tok-number{color:#b45309}
.tok-comment{color:#94a3b8;font-style:italic}
.theme-dark .tok-kw{color:#93c5fd}
.theme-dark .tok-string{color:#86efac}
.theme-dark .tok-number{color:#fbbf24}
.theme-dark .tok-comment{color:#64748b}
.toc{border:1px solid #e6e8eb;border-radius:12px;padding:12px;margin:12px 0;background:#fff}
.theme-dark .toc{background:#0f172a;border-color:#23314a}
.toc ul{list-style:none;padding-left:0;margin:0}
.toc li{margin:6px 0}
.skip-link{position:absolute;left:8px;top:8px;background:#0b62ff;color:#fff;padding:8px 10px;border-radius:8px;transform:translateY(-150%);transition:transform .2s;z-index:999}
.skip-link:focus{transform:translateY(0);outline:none}
.theme-dark .skip-link{background:#2563eb}
.typography-upgrade h1,.typography-upgrade h2,.typography-upgrade h3{text-wrap:balance}
h1,h2,h3{text-wrap:balance}
header .container,footer .container,main{max-width:1040px}
nav a{padding:6px 10px;border-radius:8px}
nav a:hover{background:#f1f5f9}
nav a.active{background:#e6f0ff;color:#0b62ff}
main>p,main>ul,main>ol{max-width:72ch}
.post-item{transition:transform .2s ease,box-shadow .2s ease}
.post-item:hover{box-shadow:0 10px 24px rgba(16,24,40,.10);transform:translateY(-2px)}
@media(min-width:840px){.post-list .post-item{grid-column:span 6}}
.btn{line-height:1.2}
.brand{letter-spacing:.02em}
.kicker{letter-spacing:.12em}
body{font-kerning:normal}
.prose{font-size:16px;line-height:1.8}
main p{line-height:1.8}
h1{font-size:clamp(28px,5vw,40px);line-height:1.25}
h2{font-size:clamp(22px,3.5vw,28px);line-height:1.3}
h3{font-size:clamp(18px,2.5vw,22px);line-height:1.35}
pre,code{font-family:ui-monospace,Menlo,Consolas,Monaco,monospace}
code{background:#f1f5f9;border:1px solid #e2e8f0;border-radius:6px;padding:2px 6px}
pre{background:#0f172a;color:#e2e8f0;border-radius:10px;padding:14px 16px;overflow:auto}
blockquote{border-left:3px solid #0b62ff;padding:4px 12px;margin:12px 0;color:#334155;background:#f8fafc;border-radius:8px}
table{width:100%;border-collapse:collapse;margin:12px 0}
th,td{border:1px solid #e6e8eb;padding:10px 12px;text-align:left}
tbody tr:nth-child(odd){background:#fafafa}
a:focus-visible{outline:2px solid #94c2ff;outline-offset:2px;border-radius:8px}
.theme-dark h1,.theme-dark h2,.theme-dark h3{color:#e2e8f0}
.theme-dark a{color:#93c5fd}
.theme-dark table{background:transparent}
.theme-dark th,.theme-dark td{border-color:#334155}
.theme-dark tbody tr:nth-child(odd){background:#111827}
.theme-dark code{background:#1e293b;border-color:#334155;color:#e2e8f0}
.theme-dark .kicker{color:#a78bfa}