:root{--bg:#f4f5fb;--fg:#1b1e33;--muted:#5c6280;--accent1:#7c6cff;--accent2:#38e1c6;--accent3:#ff6c9d;--glass:#ffffffa6;--glass-border:#14183c14;--shadow:#14183c1f;--prose-code-bg:#14183c0f;--prose-blockquote-border:var(--accent1);color-scheme:light}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--fg);min-height:100vh;font-family:PingFang SC,Segoe UI,system-ui,sans-serif;line-height:1.6;overflow-x:hidden}a{color:inherit}.glass{background:var(--glass);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(14px)}.nav{z-index:10;border-radius:999px;justify-content:space-between;align-items:center;max-width:960px;margin:0 auto;padding:12px 24px;transition:transform .4s,opacity .4s;display:flex;position:sticky;top:0}body.nav-hidden .nav{opacity:0;pointer-events:none;transform:translateY(-130%)}.logo{letter-spacing:.5px;font-weight:700}.links{align-items:center;gap:20px;display:flex}.links a{color:var(--muted);font-size:14px;text-decoration:none;transition:color .25s;position:relative}.links a:after{content:"";background:linear-gradient(90deg, var(--accent1), var(--accent2));width:0;height:2px;transition:width .25s;position:absolute;bottom:-4px;left:0}.links a:hover{color:var(--fg)}.links a:hover:after,.links a[aria-current=page]:after{width:100%}.links a[aria-current=page]{color:var(--fg)}main{max-width:960px;margin:0 auto;padding:0 24px}body.layout-wide main{max-width:1360px}body.layout-full main{max-width:none;padding:0}.btn{cursor:pointer;border:none;border-radius:999px;padding:12px 28px;font-size:15px;text-decoration:none;transition:transform .2s,box-shadow .2s;display:inline-block}.btn:hover{transform:translateY(-3px)}.btn.primary{background:linear-gradient(90deg, var(--accent1), var(--accent2));color:#fff;box-shadow:0 8px 24px #7c6cff59}.btn.primary:hover{box-shadow:0 12px 32px #7c6cff80}.btn.ghost{border:1px solid var(--glass-border);color:var(--fg)}.cards{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;padding-bottom:60px;display:grid}.card{will-change:transform;border-radius:20px;padding:28px 24px;transition:transform .15s ease-out,box-shadow .3s}.card:hover{box-shadow:0 16px 40px var(--shadow)}.card-icon{margin-bottom:14px;font-size:32px}.card h3{margin-bottom:8px;font-size:18px}.card p{color:var(--muted);font-size:14px;line-height:1.7}.gradient-text{background:linear-gradient(90deg, var(--accent1), var(--accent2), var(--accent3));color:#0000;background-size:200% 100%;background-clip:text;animation:5s linear infinite shimmer}@keyframes shimmer{to{background-position:200% 0}}.reveal{opacity:0;transition:opacity .7s,transform .7s;transform:translateY(32px)}.reveal.visible{opacity:1;transform:translateY(0)}@keyframes fadeUp{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}.prose{max-width:720px;margin:0 auto;padding:24px 0 64px}.prose>*+*{margin-top:1.1em}.prose h1,.prose h2,.prose h3{margin-top:1.8em;line-height:1.3}.prose h1{font-size:2rem}.prose h2{border-bottom:1px solid var(--glass-border);padding-bottom:.3em;font-size:1.5rem}.prose h3{font-size:1.2rem}.prose a{color:var(--accent2);text-decoration:underline}.prose ul,.prose ol{padding-left:1.4em}.prose li{margin-top:.4em}.prose code{background:var(--prose-code-bg);border-radius:6px;padding:.15em .4em;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.9em}.prose pre{background:var(--prose-code-bg);border:1px solid var(--glass-border);border-radius:12px;padding:16px;overflow-x:auto}.prose pre code{background:0 0;padding:0}.prose blockquote{border-left:4px solid var(--prose-blockquote-border);color:var(--muted);background:var(--glass);border-radius:0 12px 12px 0;padding:.4em 1em}.prose img{border-radius:12px;max-width:100%}.prose table{border-collapse:collapse;width:100%;font-size:.95em}.prose th,.prose td{border:1px solid var(--glass-border);text-align:left;padding:8px 12px}.prose hr{border:none;border-top:1px solid var(--glass-border)}.post-meta{color:var(--muted);flex-wrap:wrap;align-items:center;gap:12px;margin-top:12px;font-size:14px;display:flex}.tag{background:var(--glass);border:1px solid var(--glass-border);border-radius:999px;padding:3px 10px;font-size:12px}.back-link{color:var(--muted);margin:32px 0 8px;font-size:14px;text-decoration:none;transition:color .2s;display:inline-block}.back-link:hover{color:var(--fg)}.post-list{gap:20px;padding:24px 0 64px;display:grid}.post-item{color:inherit;border-radius:20px;padding:24px;text-decoration:none;transition:transform .2s,box-shadow .3s;display:block}.post-item:hover{box-shadow:0 16px 40px var(--shadow);transform:translateY(-4px)}.post-item h2{margin-bottom:8px;font-size:1.35rem}.post-item .excerpt{color:var(--muted);font-size:14px}.post-empty{color:var(--muted);text-align:center;padding:64px 0}.page-head{text-align:center;padding:88px 0 24px}.page-head h1{font-size:clamp(30px,6vw,48px);animation:.8s both fadeUp}.page-head p{color:var(--muted);margin-top:12px;animation:.8s .15s both fadeUp}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}.reveal{opacity:1;transform:none}}.post-shell{grid-template-columns:220px minmax(0,1fr) 200px;align-items:start;gap:32px 56px;padding:32px 0 64px;display:grid}.blog-sidebar{max-height:calc(100vh - 80px);position:sticky;top:64px;overflow-y:auto}.sidebar-back{color:var(--muted);border-radius:8px;padding:8px 12px;font-size:.9rem;text-decoration:none;transition:color .2s,background .2s;display:inline-block}.sidebar-back:hover{color:var(--fg);background:var(--glass)}.post-main{min-width:0}.post-shell .prose{max-width:none;margin:0;padding:0}.toc{max-height:calc(100vh - 80px);position:sticky;top:64px;overflow-y:auto}.toc-title{color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:12px;padding-left:12px;font-size:.8rem}.toc-list{list-style:none}.toc-item{border-left:2px solid var(--glass-border);transition:border-color .25s}.toc-item a{color:var(--muted);padding:6px 12px;font-size:.85rem;text-decoration:none;transition:color .25s;display:block}.toc-item a:hover{color:var(--fg)}.toc-item.active{border-left-color:var(--accent1)}.toc-item.active a{color:var(--accent1)}.toc-depth-3 a{padding-left:28px;font-size:.8rem}
