.btn{cursor:pointer;-webkit-tap-highlight-color:transparent;white-space:nowrap;transition:transform .16s var(--ease-out), background .16s ease, box-shadow .16s ease;border:none;justify-content:center;align-items:center;font-family:inherit;line-height:1.4;display:inline-flex}.btn:active{transform:scale(.97)}.btn-primary{background:var(--accent);color:#fff;border-radius:var(--radius);padding:14px 32px;font-size:15px;font-weight:600;box-shadow:0 1px 3px #22c55e33}.btn-secondary{background:var(--bg);color:var(--fg-secondary);border:1px solid var(--border);border-radius:var(--radius);padding:14px 28px;font-size:15px;font-weight:500}.btn-lg{padding:16px 40px;font-size:16px}@media (hover:hover){.btn-primary:hover{background:var(--accent-hover);box-shadow:0 4px 16px #22c55e40}.btn-secondary:hover{background:var(--surface);border-color:var(--muted-light)}}.blog-page{max-width:720px;padding:96px max(24px, env(safe-area-inset-right)) 80px max(24px, env(safe-area-inset-left));overflow-wrap:anywhere;margin:0 auto}.blog-page :is(h1,h2,h3){word-break:auto-phrase;text-wrap:balance}.blog-page h1{letter-spacing:-.01em;color:var(--fg);font-size:32px;font-weight:700;line-height:1.45}.blog-list{margin-top:40px;list-style:none}.blog-list li+li{border-top:1px solid var(--border)}.blog-list a{-webkit-tap-highlight-color:transparent;padding:24px 0;display:block}.blog-list h2{color:var(--fg);font-size:18px;font-weight:600;line-height:1.6;transition:color .16s}.blog-list p{color:var(--muted);margin-top:6px;font-size:14px;line-height:1.8}.blog-list time,.blog-date{color:var(--muted);font-variant-numeric:tabular-nums;margin-top:8px;font-size:13px;display:block}.blog-empty{color:var(--muted);margin-top:40px}@media (hover:hover){.blog-list a:hover h2{color:var(--accent-dark)}}.blog-back{color:var(--muted);align-items:center;gap:4px;margin-bottom:20px;font-size:14px;display:inline-flex}.blog-back svg{width:16px;height:16px}@media (hover:hover){.blog-back:hover{color:var(--fg)}}.blog-toc{border-radius:var(--radius);background:var(--surface);margin-top:40px;padding:20px 24px}.blog-toc p{color:var(--fg);font-size:14px;font-weight:600}.blog-toc ol{color:var(--fg-secondary);margin:8px 0 0 20px;font-size:14px;line-height:1.8}.blog-toc li+li{margin-top:4px}@media (hover:hover){.blog-toc a:hover{color:var(--accent-dark)}}.blog-body{color:var(--fg-secondary);margin-top:40px;font-size:16px;line-height:1.95}.blog-body h2{color:var(--fg);margin:56px 0 16px;scroll-margin-top:88px;font-size:23px;font-weight:700;line-height:1.5}.blog-body h3{color:var(--fg);margin:36px 0 12px;scroll-margin-top:88px;font-size:18px;font-weight:600;line-height:1.6}.blog-body h4{color:var(--fg);margin:28px 0 8px;font-size:16px;font-weight:600}.blog-body p,.blog-body ul,.blog-body ol,.blog-body blockquote,.blog-body pre{margin-bottom:20px}.blog-body :is(ul,ol){padding-left:24px}.blog-body li+li{margin-top:6px}.blog-body :is(li>ul,li>ol){margin:6px 0 0}.blog-body a{color:var(--accent-dark);text-underline-offset:3px;text-decoration:underline;text-decoration-thickness:1px}.blog-body strong{color:var(--fg);font-weight:600}.blog-body blockquote{border-left:3px solid var(--border);color:var(--muted);padding-left:16px}.blog-body code{background:var(--surface);font-family:var(--mono);border-radius:6px;padding:2px 6px;font-size:.875em}.blog-body pre{border-radius:var(--radius);background:var(--surface);padding:16px;line-height:1.6;overflow-x:auto}.blog-body pre code{background:0 0;padding:0}.blog-body hr{border:none;border-top:1px solid var(--border);margin:40px 0}.blog-body table{border-collapse:collapse;overflow-wrap:normal;width:max-content;max-width:100%;margin-bottom:24px;font-size:14px;line-height:1.7;display:block;overflow-x:auto}.blog-body :is(th,td){border-bottom:1px solid var(--border);text-align:left;vertical-align:top;min-width:96px;max-width:320px;padding:10px 14px}.blog-body th{color:var(--fg);background:var(--surface);font-weight:600}.blog-cta{gap:16px;margin-top:64px;display:grid}.blog-cta section{border-radius:var(--radius-lg);background:var(--surface);padding:28px}.blog-cta h2{color:var(--fg);font-size:18px;font-weight:700;line-height:1.5}.blog-cta p{color:var(--muted);margin-top:6px;font-size:14px;line-height:1.8}.blog-cta .btn{margin-top:16px;padding:12px 24px;font-size:14px}@media (width<=640px){.blog-page{padding:88px max(16px, env(safe-area-inset-right)) 56px max(16px, env(safe-area-inset-left))}.blog-page h1{font-size:25px}.blog-body{font-size:15.5px}.blog-body h2{margin-top:48px;font-size:20px}.blog-body h3{font-size:17px}.blog-toc{padding:16px 20px}.blog-cta section{padding:24px 20px}.blog-cta .btn{width:100%}}
