:root{--bg:#fff;--bg-soft:#f6f7f9;--text:#1a2027;--text-soft:#57606a;--accent:#0b6bcb;--accent-soft:#e3effb;--border:#d8dee4;--card-shadow:0 1px 3px #10182814;--max-width:46rem;--font-sans:"Inter var", "Inter", -apple-system, "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", system-ui, sans-serif;--font-mono:"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace}[data-theme=dark]{--bg:#0f1419;--bg-soft:#171d24;--text:#dbe2e9;--text-soft:#97a3ae;--accent:#58a6ff;--accent-soft:#12283f;--border:#2c343d;--card-shadow:0 1px 3px #0006}*{box-sizing:border-box}html{color-scheme:light;scroll-behavior:smooth}html[data-theme=dark]{color-scheme:dark}body{background:var(--bg);color:var(--text);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;margin:0;font-size:1.0625rem;line-height:1.75}a{color:var(--accent);text-decoration:none}a:hover{text-underline-offset:3px;text-decoration:underline}code{font-family:var(--font-mono)}:not(pre)>code{background:var(--bg-soft);border:1px solid var(--border);border-radius:5px;padding:.1em .35em;font-size:.88em}img,video{border-radius:8px;max-width:100%;height:auto}.container{max-width:var(--max-width);margin:0 auto;padding:0 1.25rem}.container-wide{max-width:62rem;margin:0 auto;padding:0 1.25rem}.site-header{border-bottom:1px solid var(--border);background:color-mix(in srgb, var(--bg) 88%, transparent);backdrop-filter:blur(8px);z-index:10;position:sticky;top:0}.site-header .inner{align-items:center;gap:1.25rem;max-width:62rem;margin:0 auto;padding:.7rem 1.25rem;display:flex}.site-header .brand{color:var(--text);letter-spacing:-.01em;font-size:1.05rem;font-weight:700}.site-header nav{align-items:center;gap:1rem;margin-left:auto;display:flex}.site-header nav a{color:var(--text-soft);font-size:.95rem}.site-header nav a[aria-current=page]{color:var(--text);font-weight:600}.icon-btn{border:1px solid var(--border);color:var(--text-soft);cursor:pointer;background:0 0;border-radius:8px;align-items:center;gap:.3rem;padding:.3rem .55rem;font-size:.9rem;line-height:1;display:inline-flex}.icon-btn:hover{color:var(--text);border-color:var(--text-soft);text-decoration:none}.post-list{gap:1rem;margin:0;padding:0;list-style:none;display:grid}.post-card{border:1px solid var(--border);background:var(--bg);box-shadow:var(--card-shadow);border-radius:12px;padding:1.1rem 1.3rem;transition:border-color .15s}.post-card:hover{border-color:var(--accent)}.post-card h3{margin:0 0 .3rem;font-size:1.15rem;line-height:1.45}.post-card h3 a{color:var(--text)}.post-card p{color:var(--text-soft);margin:0 0 .5rem;font-size:.95rem}.post-meta{color:var(--text-soft);flex-wrap:wrap;align-items:center;gap:.6rem;font-size:.85rem;display:flex}.tag{background:var(--accent-soft);color:var(--accent);border-radius:999px;padding:.05rem .65rem;font-size:.8rem;display:inline-block}.tag:hover{filter:brightness(1.08);text-decoration:none}article.prose{padding:2.5rem 0 3rem}.prose h1{letter-spacing:-.015em;margin:0 0 .6rem;font-size:2rem;line-height:1.35}.prose h2{border-bottom:1px solid var(--border);margin-top:2.4em;padding-bottom:.25em;font-size:1.45rem}.prose h3{margin-top:1.8em;font-size:1.18rem}.prose blockquote{border-left:3px solid var(--accent);background:var(--bg-soft);color:var(--text-soft);border-radius:0 8px 8px 0;margin:1.2em 0;padding:.2em 1.2em}.prose table{border-collapse:collapse;width:100%;font-size:.92rem;display:block;overflow-x:auto}.prose th,.prose td{border:1px solid var(--border);text-align:left;padding:.45rem .7rem}.prose th{background:var(--bg-soft)}.prose hr{border:none;border-top:1px solid var(--border);margin:2.5em 0}.article-header .post-meta{margin-bottom:.4rem}.article-footer{border-top:1px solid var(--border);color:var(--text-soft);flex-wrap:wrap;align-items:center;gap:.8rem;margin-top:3rem;padding-top:1.2rem;font-size:.9rem;display:flex}.disclaimer{border:1px solid var(--border);background:var(--bg-soft);color:var(--text-soft);border-radius:10px;margin-top:2.5rem;padding:.9rem 1.2rem;font-size:.88rem}.demo-frame{border:1px solid var(--border);background:var(--bg-soft);border-radius:12px;margin:1.5rem 0;padding:1rem}.site-footer{border-top:1px solid var(--border);color:var(--text-soft);margin-top:4rem;padding:1.6rem 0 2.2rem;font-size:.88rem}.site-footer .inner{flex-wrap:wrap;align-items:center;gap:.8rem 1.6rem;max-width:62rem;margin:0 auto;padding:0 1.25rem;display:flex}.comments{margin-top:2.5rem}@media (width<=640px){body{font-size:1rem}.prose h1{font-size:1.6rem}.site-header nav{gap:.7rem}}[data-theme=light] .theme-icon-light,[data-theme=dark] .theme-icon-dark{display:none}