.page-head{gap:var(--s4);padding-block:var(--s8) var(--s6);grid-column:1/span 7;justify-items:start;display:grid}.page-head h1{font-size:var(--t-section)}.page-head .lead{color:var(--color-ink-2);max-width:46ch;font-size:20px}.page-head .ctas{gap:var(--s3);padding-top:var(--s2);flex-wrap:wrap;align-items:center;display:flex}.page-note{color:var(--color-ink-3);font-size:13px}.crumbs{gap:var(--s2);color:var(--color-ink-3);flex-wrap:wrap;align-items:center;margin:0;padding:0;font-size:13px;list-style:none;display:flex}.crumbs a{text-decoration:none}.crumbs a:hover{color:var(--color-ink);text-decoration:underline}.crumbs li+li:before{content:"/";font-family:var(--font-mono);color:var(--color-hairline);padding-inline-end:var(--s2)}.page-sample{padding-block:var(--s6);grid-column:9/span 4;align-self:center}.sample-frame{background:var(--color-soft);border-radius:var(--radius-block);padding:var(--s5);gap:var(--s3);justify-items:center;display:grid}.sample-frame .sample-note{color:var(--color-ink-3);text-align:center;font-size:13px}.sample-sheet{border-radius:var(--radius-sm);position:relative;overflow:hidden}.sample-page{transform-origin:0 0;border-radius:var(--radius-sm);background:#fff;position:absolute;inset-block-start:0;inset-inline-start:0;overflow:hidden;box-shadow:0 0 0 1px #0b0b0c14,0 16px 32px #1f1d3d1f}[dir=rtl] .sample-page{transform-origin:100% 0}@media (max-width:960px){.page-head,.page-sample{grid-column:1/-1}.page-sample{padding-top:0}}.page-body{padding-bottom:var(--s8);gap:var(--s7);grid-column:1/span 8;display:grid}@media (max-width:960px){.page-body{grid-column:1/-1}}.prose{gap:var(--s4);max-width:68ch;display:grid}.prose h3{padding-top:var(--s4);font-size:22px}.prose p{color:var(--color-ink-2)}.prose ul,.prose ol{gap:var(--s2);margin:0;padding-inline-start:0;list-style:none;display:grid}.prose li{color:var(--color-ink-2);border-inline-start:1.5px solid var(--color-lime);padding-inline-start:var(--s4)}.prose ol{counter-reset:step}.prose ol li{border-inline-start-color:var(--color-lilac)}.prose ol li:before{counter-increment:step;content:counter(step, decimal-leading-zero) " ";font-family:var(--font-mono);color:var(--color-ink-3);font-size:12px}.prose-example{box-shadow:inset 0 0 0 1px var(--color-hairline);border-radius:16px;margin:0;overflow:hidden}.prose-example figcaption{background:var(--color-soft);padding:var(--s3) var(--s4);font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--color-ink-3);font-size:11px}.prose-example dl{padding:var(--s3) var(--s4);gap:var(--s1);margin:0;display:grid}.prose-example dl>div{gap:var(--s4);padding-block:var(--s2);border-bottom:1px solid var(--color-hairline);justify-content:space-between;align-items:baseline;display:flex}.prose-example dl>div:last-child{border-bottom:0}.prose-example dt{color:var(--color-ink-2);font-size:15px}.prose-example dd{font-variant-numeric:tabular-nums;margin:0;font-weight:500}.prose-example-note{padding:0 var(--s4) var(--s4);color:var(--color-ink-3);font-size:13px}.prose-source{color:var(--color-ink-2);font-size:14px}.prose-source a{text-underline-offset:3px;text-decoration:underline}.prose-source a:after{content:"↗";padding-inline-start:2px;text-decoration:none}.prose-callout{background:var(--color-cream);border-inline-start:1.5px solid var(--color-ink);padding:var(--s4) var(--s5);border-radius:16px;font-size:15px}.faq{gap:var(--s4);max-width:68ch;display:grid}.faq h2,.page-body h2{letter-spacing:-.02em;font-size:22px;font-weight:500}.faq dl{gap:0;margin:0;display:grid}.faq dt{padding-top:var(--s4);font-size:17px;font-weight:500}.faq dd{padding-block:var(--s2) var(--s4);color:var(--color-ink-2);border-bottom:1px solid var(--color-hairline);margin:0}.faq dd:last-child{border-bottom:0}.related{gap:var(--s4);display:grid}.related .chips a{text-decoration:none}.related .chip:hover{box-shadow:inset 0 0 0 1px var(--color-ink)}.author{gap:var(--s4);max-width:68ch;padding:var(--s5);box-shadow:inset 0 0 0 1px var(--color-hairline);border-radius:16px;grid-template-columns:56px 1fr;align-items:start;display:grid}.author .avatar{background:var(--color-lilac);letter-spacing:-.02em;border-radius:50%;place-items:center;width:56px;height:56px;font-size:20px;font-weight:500;display:grid}.author .who{gap:var(--s1);display:grid}.author .name{font-size:17px;font-weight:500}.author .role{color:var(--color-ink-3);font-size:14px}.author p{color:var(--color-ink-2);padding-top:var(--s2);font-size:15px}.author a{text-underline-offset:3px;justify-self:start;font-size:14px;text-decoration:underline}.author .label{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--color-ink-3);grid-column:1/-1;font-size:11px}.tpl-grid{gap:var(--s5);padding-bottom:var(--s8);grid-column:1/-1;grid-template-columns:repeat(4,minmax(0,1fr));display:grid}.tpl-card{gap:var(--s3);padding:var(--s4);box-shadow:inset 0 0 0 1px var(--color-hairline);background:var(--color-paper);border-radius:16px;justify-items:center;text-decoration:none;display:grid}.tpl-card:hover{box-shadow:inset 0 0 0 1px var(--color-ink);translate:0 -2px}.tpl-card .name{font-size:15px;font-weight:500}@media (max-width:900px){.tpl-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:480px){.tpl-grid{grid-template-columns:1fr}}.lang-banner{inset-inline:var(--s4);bottom:calc(var(--s4) + env(safe-area-inset-bottom,0px));z-index:60;width:fit-content;max-width:calc(100% - 2 * var(--s4));gap:var(--s3);background:var(--color-navy);color:#fff;padding:var(--s3) var(--s3) var(--s3) var(--s5);border-radius:var(--radius-pill);flex-wrap:wrap;align-items:center;margin-inline:auto;font-size:15px;display:flex;position:fixed;box-shadow:0 10px 40px #0b0b0c40}[dir=rtl] .lang-banner{padding:var(--s3) var(--s5) var(--s3) var(--s3)}.lang-banner .btn{height:36px;padding-inline:var(--s4);font-size:14px}.lang-banner .btn-primary{color:var(--color-ink);background:#fff}.lang-banner .btn-quiet{color:#ffffffb8}.lang-banner .btn-quiet:hover{color:#fff;background:#ffffff1f}.nf-head{gap:var(--s4);padding-block:var(--s9) var(--s8);grid-column:1/span 8;justify-items:start;display:grid}.nf-head h1{font-size:var(--t-display)}@media (max-width:960px){.nf-head{grid-column:1/-1}}