.chroma-home .blog-wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}.chroma-home .blog-hero{text-align:center;padding:64px 0 8px}.chroma-home .blog-hero h1{letter-spacing:-.035em;font-size:clamp(34px,4.5vw,50px)}.chroma-home .blog-hero>.eyebrow{display:block}.chroma-home .blog-hero p{color:var(--ink-3);max-width:52ch;margin:16px auto 0;font-size:19px}.chroma-home .tag{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.08em;color:var(--accent);background:var(--accent-soft);border:1px solid var(--accent-line);border-radius:100px;padding:2px 9px;font-size:11.5px;font-weight:600}.chroma-home .post-meta{color:var(--ink-4);font-size:13px;font-family:var(--font-mono);align-items:center;gap:10px;display:flex}.chroma-home .post-date{white-space:nowrap;color:var(--ink-4);font-family:var(--font-mono);font-size:13px}.chroma-home .blog-toolbar{z-index:30;-webkit-backdrop-filter:saturate(180%)blur(12px);backdrop-filter:saturate(180%)blur(12px);border-bottom:1px solid var(--line);background:#ffffffdb;flex-wrap:wrap;align-items:center;gap:18px;margin:40px 0 6px;padding:16px 0;display:flex;position:sticky;top:60px}.chroma-home .filter-chips{flex-wrap:wrap;gap:6px;display:flex}.chroma-home .chip{font-family:var(--font-sans);color:var(--ink-2);background:var(--bg);border:1px solid var(--line);cursor:pointer;white-space:nowrap;border-radius:100px;align-items:center;gap:7px;padding:6px 14px;font-size:13.5px;font-weight:600;transition:all .14s;display:inline-flex}.chroma-home .chip:hover{border-color:var(--ink-4);color:var(--ink)}.chroma-home .chip.active{background:var(--ink);color:#fff;border-color:var(--ink)}.chroma-home .chip .cnt{font-family:var(--font-mono);opacity:.55;font-size:11px}.chroma-home .chip.active .cnt{opacity:.7}.chroma-home .search{margin-left:auto;position:relative}.chroma-home .search svg{color:var(--ink-4);pointer-events:none;position:absolute;top:50%;left:12px;transform:translateY(-50%)}.chroma-home .search input{font-family:var(--font-sans);color:var(--ink);border-radius:var(--r-md);border:1px solid var(--line);background:var(--bg-soft);outline:none;width:220px;padding:9px 14px 9px 36px;font-size:14px;transition:all .14s}.chroma-home .search input:focus{border-color:var(--accent);background:var(--bg);box-shadow:0 0 0 3px var(--accent-soft)}.chroma-home .search input::placeholder{color:var(--ink-4)}.chroma-home .result-count{color:var(--ink-3);font-size:13.5px;font-family:var(--font-mono);margin:22px 0 18px}.chroma-home .pager-nav{flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;margin:36px 0 4px;display:flex}.chroma-home .pager-nav button{min-width:40px;height:40px;font-family:var(--font-sans);color:var(--ink-2);background:var(--bg);border:1px solid var(--line);border-radius:var(--r-md);cursor:pointer;justify-content:center;align-items:center;gap:6px;padding:0 12px;font-size:14.5px;font-weight:600;transition:all .14s;display:inline-flex}.chroma-home .pager-nav button:hover:not(:disabled){border-color:var(--accent-line);color:var(--ink);background:var(--accent-soft)}.chroma-home .pager-nav button.active{background:var(--ink);color:#fff;border-color:var(--ink)}.chroma-home .pager-nav button.active:hover{background:var(--ink);color:#fff}.chroma-home .pager-nav button:disabled{opacity:.38;cursor:default}.chroma-home .pager-nav .ellipsis{color:var(--ink-4);align-self:flex-end;padding:0 2px}.chroma-home .post-grid{grid-template-columns:repeat(auto-fill,minmax(min(330px,100%),1fr));align-items:stretch;gap:18px;margin-bottom:28px;display:grid}.chroma-home .pcard{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--bg);flex-direction:column;gap:0;padding:24px 24px 22px;transition:border-color .16s,transform .16s,box-shadow .16s;display:flex}.chroma-home .pcard:hover{border-color:var(--accent-line);box-shadow:var(--shadow-md);text-decoration:none;transform:translateY(-2px)}.chroma-home .pcard h3{color:var(--ink);letter-spacing:-.02em;margin:14px 0 9px;font-size:19px;line-height:1.22}.chroma-home .pcard p{color:var(--ink-3);margin:0;font-size:14.5px;line-height:1.6}.chroma-home .pcard .read{color:var(--accent);align-items:center;gap:6px;margin-top:auto;padding-top:18px;font-size:14px;font-weight:600;display:inline-flex}.chroma-home .pcard.feat{flex-direction:row;grid-column:1/-1;gap:0;padding:0;overflow:hidden}.chroma-home .pcard.feat .ftxt{flex-direction:column;flex:1.15;padding:38px 36px;display:flex}.chroma-home .pcard.feat h3{margin:16px 0 12px;font-size:27px;line-height:1.14}.chroma-home .pcard.feat p{font-size:16px}.chroma-home .pcard.feat .fart{background:var(--code-bg);flex:1;min-height:260px;position:relative;overflow:hidden}.chroma-home .pcard.feat .fart:before{content:"";background:radial-gradient(420px 220px at 70% 20%,#fb923c59,#0000 60%),radial-gradient(360px 220px at 20% 90%,#ec489947,#0000 60%);position:absolute;inset:0}.chroma-home .fart .gloss{justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.chroma-home .fart .gloss code{font-family:var(--font-mono);color:#ffffffeb;border-radius:var(--r-md);background:#0c0a0980;border:1px solid #ffffff1a;padding:18px 22px;font-size:14px;line-height:1.9}.chroma-home .fart .gloss .ok{color:#4ade80}.chroma-home .no-results{text-align:center;color:var(--ink-3);padding:60px 20px 80px}.chroma-home .no-results svg{color:var(--ink-4);margin-bottom:14px}.chroma-home .no-results b{color:var(--ink);margin-bottom:4px;font-size:17px;display:block}@media (width<=720px){.chroma-home .pcard.feat{flex-direction:column}.chroma-home .pcard.feat .fart{order:-1;min-height:160px}.chroma-home .pcard.feat .ftxt{padding:28px 24px}.chroma-home .pcard.feat h3{font-size:23px}.chroma-home .blog-toolbar{gap:12px;margin-top:28px;position:static}.chroma-home .search{width:100%;margin-left:0}.chroma-home .search input{width:100%}}@media (width<=620px){.chroma-home .blog-wrap{padding:0 20px}.chroma-home .blog-hero{padding-top:48px}.chroma-home .blog-hero p{font-size:17px}.chroma-home .article{padding:40px 20px 72px}}.chroma-home .article{max-width:720px;margin:0 auto;padding:56px 28px 100px}.chroma-home .article .back{font-family:var(--font-mono);color:var(--ink-3);gap:7px;margin-bottom:28px;font-size:13.5px;display:inline-flex}.chroma-home .article .back:hover{color:var(--accent)}.chroma-home .article .a-meta{align-items:center;gap:12px;margin-bottom:16px;display:flex}.chroma-home .article h1{letter-spacing:-.035em;margin:0 0 18px;font-size:clamp(32px,4.4vw,46px);line-height:1.08}.chroma-home .article .a-lede{color:var(--ink-3);margin:0 0 28px;font-size:20px;line-height:1.55}.chroma-home .article .a-byline{border-top:1px solid var(--line);border-bottom:1px solid var(--line);align-items:center;gap:12px;margin-bottom:40px;padding:18px 0;display:flex}.chroma-home .a-byline .avatar{background:linear-gradient(135deg, var(--accent-500), #ec4899);color:#fff;width:38px;height:38px;font-weight:700;font-family:var(--font-display);border-radius:50%;justify-content:center;align-items:center;display:flex}.chroma-home .a-byline .who{font-size:14px}.chroma-home .a-byline .who b{color:var(--ink);font-weight:600;display:block}.chroma-home .a-byline .who span{color:var(--ink-4);font-family:var(--font-mono);font-size:12.5px}.chroma-home .article .body{color:var(--ink-2);font-size:17px;line-height:1.75}.chroma-home .article .body h2{letter-spacing:-.025em;margin:46px 0 14px;font-size:27px}.chroma-home .article .body h3{margin:32px 0 10px;font-size:19px}.chroma-home .article .body :is(h1,h2,h3,h4,h5,h6) a{color:inherit;text-decoration:none}.chroma-home .article .body p{margin:0 0 20px}.chroma-home .article .body ul,.chroma-home .article .body ol{padding-left:22px}.chroma-home .article .body li{margin:8px 0}.chroma-home .article .body a{color:var(--accent);text-underline-offset:3px;text-decoration:underline}.chroma-home .article .body :not(pre)>code{font-family:var(--font-mono);background:var(--accent-soft);color:#c2410c;border:1px solid var(--accent-line);border-radius:5px;padding:2px 6px;font-size:.85em}.chroma-home .article .body pre{margin:24px 0}.chroma-home .article .body blockquote{border-left:3px solid var(--accent);color:var(--ink-2);margin:24px 0;padding:6px 22px;font-size:18px}.chroma-home .article .body blockquote p{margin:0}.chroma-home .article .body img{border-radius:var(--r-md);max-width:100%}.chroma-home .article .body table{border-collapse:collapse;width:100%;margin:24px 0;font-size:14.5px}.chroma-home .article .body th,.chroma-home .article .body td{text-align:left;border:1px solid var(--line);padding:10px 14px}.chroma-home .article .body th{background:var(--bg-soft);color:var(--ink);font-weight:600}.chroma-home .article hr.a-end{background:var(--line);border:none;height:1px;margin:56px 0 32px}.chroma-home .article .a-foot{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.chroma-home .article .a-foot .back{margin:0}
