.on-light,.on-lab{--grid:#e0e0e0}.lab-hero .page-title .wrap{row-gap:24px}.lab-hero .h-page .num{flex:none}.lab-hero .side{text-align:right;flex-direction:column;grid-column:8/span 5;align-items:flex-end;gap:20px;display:flex}.lab-hero .side p{letter-spacing:-.01em;text-wrap:pretty;max-width:30ch;margin:0;font-size:22px;line-height:1.3}.lab-hero .side-btns{flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex}.btn-sm{border:1px solid var(--black);text-transform:uppercase;letter-spacing:.02em;align-items:center;min-height:44px;padding:0 18px;font-size:13px;font-weight:500;display:inline-flex}.btn-sm.solid{background:var(--black);color:#fff}.btn-sm.solid:hover{color:#fff;background:var(--accent-ink);border-color:var(--accent-ink)}@media (width<=960px){.lab-hero .side{text-align:left;grid-column:1/-1;align-items:flex-start}.lab-hero .side-btns{justify-content:flex-start}}.status-dot{background:var(--accent);border-radius:50%;width:8px;height:8px;margin-right:8px;display:inline-block}.status-dot.off{background:var(--muted)}.lab-demo{background:var(--black);color:#fff}.lab-demo .head .wrap{align-items:center;padding-block:20px}.lab-demo h2{font-size:var(--fs-label);text-transform:uppercase;letter-spacing:var(--ls-label);color:var(--d-soft);grid-column:1/span 6;margin:0;font-weight:500}.lab-demo .launch{color:#fff;text-transform:uppercase;letter-spacing:.02em;grid-column:7/span 6;justify-self:end;align-items:center;min-height:44px;font-size:13px;display:inline-flex}.lab-demo .frame{aspect-ratio:21/9;object-fit:cover;width:100%;display:block}.lab-demo .note{padding:16px var(--pad) 24px;max-width:var(--max);margin:0;color:var(--d-muted);margin-inline:auto;font-size:13px}.lab-body{background:var(--l-bg-lab)}.lab-body pre{background:var(--black);color:#e6e6e6;font:14px/1.6 var(--font-code);margin:0;padding:20px;overflow-x:auto}.lab-specs{background:var(--l-cta-lab);border-top:1px solid var(--l-line)}.lab-specs .wrap{row-gap:32px;padding-block:72px}.lab-specs h2{font-size:var(--fs-label);text-transform:uppercase;letter-spacing:var(--ls-label);grid-column:1/span 3;margin:0;font-weight:500}.lab-specs dl{flex-direction:column;grid-column:4/span 4;margin:0;font-size:15px;display:flex}.lab-specs dl div{border-top:1px solid var(--black);justify-content:space-between;gap:16px;padding:12px 0;display:flex}.lab-specs dl div:last-child{border-bottom:1px solid var(--black)}.lab-specs dt{color:var(--l-muted)}.lab-specs dd{text-align:right;margin:0}.lab-specs .changelog{flex-direction:column;grid-column:9/span 4;font-size:15px;display:flex}.lab-specs .changelog .cap{text-transform:uppercase;letter-spacing:.03em;color:var(--l-muted);padding-bottom:10px;font-size:12px}.lab-specs .changelog div{border-top:1px solid var(--black);gap:16px;padding:12px 0;display:flex}.lab-specs .changelog div:last-child{border-bottom:1px solid var(--black)}.lab-specs .changelog b{width:40px;color:var(--l-muted);flex:none;font-weight:400}.lab-specs .changelog div:first-of-type b{color:var(--accent-ink)}@media (width<=960px){.lab-specs h2,.lab-specs dl,.lab-specs .changelog{grid-column:1/-1}.lab-demo h2,.lab-demo .launch{grid-column:span 3}}#list[data-view=list] .post-card,#list:not([data-view]) .post-card,#list[data-view=grid] .post-row{display:none}#list[data-view=list] .items{border-top:1px solid var(--rule);display:block}#list[data-view=list] .items>li{border-bottom:1px solid var(--rule)}.post-row{grid-template-columns:repeat(var(--cols),minmax(0,1fr));column-gap:var(--gap);align-items:end;padding:16px 0;display:grid}.post-row .n{color:var(--muted);grid-column:span 1;font-size:14px}.post-row .t{letter-spacing:-.04em;grid-column:span 8;font-size:clamp(22px,2.4vw,34px);line-height:1.05}.post-row .d{text-transform:uppercase;letter-spacing:.03em;color:var(--muted);text-align:right;grid-column:span 3;font-size:13px}@media (width<=960px){.post-row .t,.post-row .d{grid-column:1/-1}.post-row .d{text-align:left}.post-row .n{display:none}}.post-card{flex-direction:column;gap:14px;display:flex}.post-card .thumb{aspect-ratio:5/4;background:var(--panel);overflow:hidden}.post-card .thumb img{object-fit:cover;width:100%;height:100%}.post-card .meta{border-top:1px solid var(--rule);flex-direction:column;gap:8px;padding-top:12px;display:flex}.post-card .cap{text-transform:uppercase;letter-spacing:.03em;color:var(--muted);font-size:12px}.post-card .name{letter-spacing:-.03em;font-size:22px;line-height:1.15}.post-card .ex{color:#4a4a4a;font-size:14px;line-height:1.5}.post-hero .page-title .wrap{padding-bottom:64px}.post-hero h1{text-transform:none;text-wrap:balance;grid-column:1/span 8;gap:.2em;font-size:clamp(30px,4vw,58px);line-height:1.04}.post-hero h1 .num{flex:none;padding-top:.6em}.post-hero .lead{color:#2a2a2a;grid-column:9/span 4;font-size:20px;line-height:1.4}.post-meta{grid-template-columns:repeat(var(--cols),minmax(0,1fr));column-gap:var(--gap);padding:28px var(--pad) 32px;max-width:var(--max);text-transform:uppercase;letter-spacing:.03em;color:var(--muted);row-gap:16px;margin:0 auto;font-size:12px;line-height:1.35;display:grid}.post-meta>div:first-child{grid-column:1/span 3}.post-meta>div:nth-child(2){grid-column:4/span 3}.post-meta>div:nth-child(3){grid-column:7/span 3}.post-meta>div:nth-child(4){text-align:right;grid-column:10/span 3}.post-meta dd{color:var(--fg);margin:0}@media (width<=960px){.post-meta>div{text-align:left!important;grid-column:span 3!important}.post-hero h1,.post-hero .lead{grid-column:1/-1}}.post-cover{aspect-ratio:16/9;object-fit:cover;background:var(--l-ph);width:100%;max-height:80vh;display:block}.post-layout .wrap{align-items:start;row-gap:48px;padding-block:80px 96px}.post-aside{flex-direction:column;grid-column:1/span 3;gap:28px;display:flex;position:sticky;top:96px}.post-aside .cap{text-transform:uppercase;letter-spacing:.03em;color:var(--muted);padding-bottom:10px;font-size:12px;display:block}.post-aside nav{flex-direction:column;font-size:14px;display:flex}.post-aside nav a{border-top:1px solid var(--hline);align-items:center;gap:10px;min-height:44px;padding:10px 0;display:flex}.post-aside nav a:last-child{border-bottom:1px solid var(--hline)}.post-aside nav a .n{color:var(--muted)}.post-aside nav a.is-active{color:var(--accent-ink)}.post-aside .share{flex-direction:column;gap:8px;font-size:14px;display:flex}.post-body{color:#1f1f1f;counter-reset:ch;flex-direction:column;grid-column:4/span 7;gap:24px;max-width:720px;font-size:18px;line-height:1.65;display:flex}.post-body>*{margin:0}.post-body>p:first-child{color:var(--black);letter-spacing:-.01em;font-size:22px;line-height:1.5}.post-body section{scroll-margin-top:calc(var(--header-h) + 24px);flex-direction:column;gap:24px;display:flex}.post-body section>*{margin:0}.post-body h2{border-top:1px solid var(--black);letter-spacing:-.03em;color:var(--black);margin-top:24px;padding-top:16px;font-size:28px;font-weight:500;line-height:1.2}.post-body h2:before{counter-increment:ch;content:counter(ch,decimal-leading-zero) ". "}.post-body img{aspect-ratio:16/10;object-fit:cover;cursor:zoom-in;background:var(--l-ph);width:100%}.post-body ol{counter-reset:step;flex-direction:column;padding:0;list-style:none;display:flex}.post-body ol li{counter-increment:step;border-top:1px solid var(--l-line-2);gap:16px;padding:12px 0;display:flex}.post-body ol li:last-child{border-bottom:1px solid var(--l-line-2)}.post-body ol li:before{content:counter(step,decimal-leading-zero);color:var(--l-muted);padding-top:3px;font-size:14px}.post-body pre{background:var(--black);color:#e6e6e6;font:14px/1.6 var(--font-code);padding:20px;overflow-x:auto}.post-body blockquote{border-block:1px solid var(--black);letter-spacing:-.025em;color:var(--black);margin:16px 0;padding:24px 0;font-size:clamp(24px,2.4vw,32px);line-height:1.3}.post-body blockquote p{margin:0}.post-tags{flex-wrap:wrap;gap:8px;padding-top:24px;display:flex}.post-tags span{border:1px solid var(--black);text-transform:uppercase;letter-spacing:.03em;align-items:center;min-height:36px;padding:0 14px;font-size:12px;display:inline-flex}.post-author{border-top:1px solid var(--l-line-2);align-items:center;gap:16px;padding-top:20px;display:flex}.post-author svg{color:var(--accent)}.post-author p{color:#4a4a4a;margin:0;font-size:15px;line-height:1.5}.post-author p span{color:var(--black)}@media (width<=960px){.post-aside{grid-column:1/-1;position:static}.post-aside .share{display:none}.post-body{grid-column:1/-1}.post-layout .wrap{padding-top:48px}}.nf{flex-direction:column;flex:1;justify-content:space-between;min-height:min(100vh - 81px,900px);display:flex;position:relative;overflow:hidden}.nf-num{font-size:clamp(96px,24vw,340px);font-weight:var(--fw-display);letter-spacing:-.07em;grid-column:1/-1;justify-content:space-between;align-items:flex-end;margin:0;line-height:.8;display:flex}.nf-num span:first-child{margin-left:-.04em}.nf-num span:nth-child(2){color:var(--accent)}.nf-num span:last-child{margin-right:-.02em}.nf-msg{flex-direction:column;grid-column:1/span 6;gap:16px;display:flex}.nf-msg p{color:var(--d-soft);text-wrap:pretty;max-width:34ch;margin:0;font-size:20px;line-height:1.35}.nf-links{letter-spacing:-.03em;flex-direction:column;grid-column:8/span 5;font-size:clamp(22px,2.2vw,30px);display:flex}.nf-links a{border-top:1px solid var(--d-line-2);justify-content:space-between;align-items:center;min-height:56px;display:flex}.nf-links a:last-child{border-bottom:1px solid var(--d-line-2)}.nf-links a .n{letter-spacing:0;color:var(--d-muted);padding-right:12px;font-size:12px}@media (width<=960px){.nf-msg,.nf-links{grid-column:1/-1}}.card .thumb .dither{width:100%;height:100%;image-rendering:pixelated;pointer-events:none;position:absolute;inset:0}
