@layer base{:root{--wrap:1330px;--gutter:1.5em}*, *:before, *:after{box-sizing:border-box}.wrap{padding-inline:var(--gutter);max-width:var(--wrap);margin-inline:auto;width:100%}::selection{background-color:var(--selection, #333);color:var(--selection-text, white)}html{background-color:var(--bgcolor, var(--body, white))}body{font-family:Inter, system-ui;container-type:inline-size;overflow-x:clip;margin:0;&:has(:popover-open){overflow-y:clip}}body, section{background-repeat:no-repeat;background-size:cover}section{background-color:var(--bgcolor)}.logotype{a:has(&){outline-offset:.5em}}h1, h2, h3, h4, strong, .logotype{color:var(--text-0)}p, li, td{text-wrap:pretty}p, li{line-height:1.5}small, .small{font-size:85%}hr{border:solid var(--lift-3);border-width:1px 0 0;margin-block:1em}.divider{background-color:var(--lift-4);display:inline-block;margin-inline:1em;height:1em;width:1px}.icon{width:1.125em;height:1.125em;vertical-align:middle;stroke-width:2;stroke:currentColor;fill:none}q{&:before, &:after{line-height:0}&:before{content:open-quote}}table{border-spacing:0;margin-block:1.5em;width:100%;th{border-bottom:1px solid var(--lift-3);color:var(--text-2);text-align:left;font-weight:400;font-size:90%}td, th{padding-block:.5em;line-height:1.25;white-space:nowrap;align-items:center;min-width:3em}img{width:1em}&.spaceous :is(td, th){padding-block:1.25em}&.select-first :is(td, th){padding-left:1.5em;&:nth-child(2){background-color:var(--lift-2);padding-left:1.5em;font-weight:550}}}table.titled{font-size:95%;td{padding-left:10vw}td:first-child{color:var(--text-0);width:100%;padding-left:0}td:last-child{text-align:right}@container (width < 1000px){td:nth-child(2){display:none}}}code{border:1px solid var(--lift-2);background-color:var(--lift-2);font-family:var(--monospace);display:inline-block;padding-inline:.25em;border-radius:.25em;font-size:90%}blockquote{color:var(--text-0);text-wrap:balance;margin:2em 0 3em;q, > p{font-size:clamp(1.33em, 4.5vw, 2em);letter-spacing:-1%;margin-left:-.45em}footer{font-size:90%;margin-top:1em;b{display:block;margin-bottom:.25em}i{color:var(--text-2);font-size:90%;font-style:normal}}}.eyebrow{display:inline-flex;align-items:center;gap:.5em;margin-bottom:.5em;+ *{margin-top:0}}.section .actions{display:inline-flex;gap:.75em;a{padding:.75em 1.5em;font-size:95%}}body > footer{padding-block:5em}}[hidden]{display:none}
@layer base{a{text-decoration:none;cursor:pointer;color:inherit}p, li, td{a{color:var(--text-1);text-decoration:underline var(--text-3);text-decoration-thickness:1px;text-underline-offset:.25em;cursor:pointer;&:hover{text-decoration-thickness:1.5px;text-decoration-color:var(--text-0)}}}a.new, a time{text-decoration:none;display:inline-flex;align-items:center;color:var(--text-2);gap:.5em;&:hover{color:var(--text-1)}strong{font-weight:700;font-size:90%}&:before{content:"";background-color:var(--new, var(--blue));box-shadow:0 0 0 .25em var(--lift-3);display:inline-block;border-radius:50%;height:.5em;width:.5em;margin-right:.25em}}a.external{text-decoration:none;background-color:var(--lift-2);border:1px solid var(--lift-3);font-family:Inter, system-ui;padding:.125em .5em;border-radius:1em;font-weight:500;font-size:75%;color:var(--blue);svg{margin-left:.1em;font-size:.8em;opacity:.75}&:hover{border-color:var(--blue);color:var(--blue)}}.links{display:flex;margin-block:1em;gap:var(--gap, 1.5em);a{color:var(--text-2);&:hover{color:var(--text-1)}}}}
@layer base{.ui, .visual, form{font-family:Inter, system-ui}.visual{font-size:13px}.tag{display:inline-flex;align-items:center;padding:.125em .5em;border-radius:.33em;font-weight:450;font-size:90%;gap:.33em;line-height:1.33}.props{display:grid;grid-template-columns:repeat(auto-fit, minmax(12em, 1fr));gap:1em;margin-block:1em 2em;h4, p{margin-block:.5em}&.bordered{border:solid var(--lift-2);border-width:1px 0;padding-block:1.5em}}.logos{align-items:center;list-style:none;display:flex;flex-wrap:wrap;gap:5%;padding:0;> *{max-width:8em}}[role="tablist"]{margin-bottom:1.5em;display:flex;gap:.5em;.secondary{pointer-events:none}}.section details{margin-bottom:2em;summary{outline:none;cursor:pointer;&::marker{color:var(--brand)}}h3{display:inline}> div{margin-left:.9em;margin-bottom:3em}}.toast{position:fixed;inset:auto 2em 2em auto;padding:1.25em 2em;border-radius:.5em;background:black;color:white;font-size:85%;border:0;z-index:3;&:popover-open{animation:toast-in .2s ease-out}&::backdrop{backdrop-filter:blur(3px)}}@keyframes toast-in{from{transform:translateY(10px);opacity:0}to{transform:translateY(0);opacity:1}}}
@layer base{:focus{outline:1px solid var(--focus, var(--text-1));outline-offset:1px}::placeholder{color:var(--text-2)}form{max-width:27rem}input, textarea{border:1px solid var(--lift-2);background-color:var(--lift-1);padding:.875em 1em;border-radius:.25em;font-family:inherit;color:var(--text-0);max-width:27rem;font-size:90%;width:100%}textarea{field-sizing:content;min-height:6em;overflow:clip}form{label{display:block;margin-block:1em 2em}h4{margin-bottom:.75em;font-weight:400;font-size:90%;+ p{margin-block:-.5em .75em;font-size:.875em}}label:has([required]) h4:after{color:var(--required, var(--blue));margin-left:.25em;content:"*"}footer{display:flex;justify-content:space-between;align-items:center}&.row{display:flex;gap:.7em;max-width:25em;> *{align-items:stretch}}}}
@layer base{img, svg, video{max-width:100%;height:auto}figure{margin:0;line-height:0;&, img{border-radius:.25em;width:100%}figcaption{color:var(--text-1);text-wrap:balance;line-height:1.75;margin-top:1em;max-width:50em;font-size:85%}}p + figure{margin-block:3em}.portrait.centered{text-align:center;img{max-width:40%;margin:2.5em auto}}figure.bordered{border:1px solid var(--lift-2)}.bgcolored{aspect-ratio:9/6;background-color:var(--bg, #444);place-items:center;border-radius:.5em;display:grid}.gallery{grid-template-columns:1fr 1fr;grid-auto-flow:dense;gap:var(--gap, 1em);margin-block:3em;display:grid;img, video{object-fit:cover;width:100%;height:100%}> :first-child, > :last-child{}}}
@layer base{button, .button{font-family:inherit;display:inline-flex;align-items:center;text-align:center;border-radius:.25em;white-space:nowrap;padding:.66em 1.25em;cursor:pointer;border:unset;gap:.5em;img{max-width:1em}&.primary{background-color:var(--button, black);color:white;&:hover{filter:brightness(1.1)}}&.secondary{background-color:var(--lift-2);color:var(--text-0);&:hover{background-color:var(--lift-3)}}&.ghost{background-color:unset;color:inherit;&:hover{background-color:var(--lift-1);color:var(--text-0)}}strong{color:inherit}}}
@layer base{:root{--text-0:rgb(15, 20, 30);--text-1:rgba(30, 40, 60, .75);--text-2:rgba(30, 40, 60, .50);--text-3:rgba(30, 40, 60, .30);--lift-0:rgba(30, 40, 60, .02);--lift-1:rgba(30, 40, 60, .04);--lift-2:rgba(30, 40, 60, .05);--lift-3:rgba(30, 40, 60, .08);--lift-4:rgba(30, 40, 60, .20);--blue:#577fea;--red:#ee3232;--purple:#9f00fd;--yellow:#b58d00;--green:#24b246;--orange:#ff8f20;--cyan:#03a9f4;--pink:#ff44fe;--gray:#5b636c;--code:#6478b1;--diff-green:rgba(0, 180, 5, 0.1);--diff-blue:rgba(0, 140, 255, 0.1);--diff-red:rgba(255, 0, 0, 0.1)}}@layer mod{.frame .panel{background-color:white;border:1px solid var(--lift-1);box-shadow:1px 1px 2px var(--lift-1)}.primary{font-weight:550;color:white}.secondary{font-weight:500}.grid .visual{background-color:#F8F6F1;align-items:flex-start;padding:2.5em;> *{background-color:white}}.overlay{box-shadow:0 0 3em rgba(0,0,0,.2)}}
.dark{color:var(--dark-text, #eee);--text-0:rgb(244, 246, 248);--text-1:rgba(190, 200, 215, .90);--text-2:rgba(190, 200, 215, .60);--text-3:rgba(190, 200, 215, .30);--lift-0:rgba(190, 200, 215, .03);--lift-1:rgba(190, 200, 215, .06);--lift-2:rgba(190, 200, 215, .12);--lift-3:rgba(190, 200, 215, .18);--lift-4:rgba(190, 200, 215, .30);--blue:#5e6ad2;--red:#da2f2f;--purple:#8B5CF6;--yellow:#f0bf00;--green:#1f8837;--orange:#fc7840;--cyan:#4ea7fc;--pink:#fc40fb;--gray:#5b636c;--code:#90abd3;--diff-green:rgba(0, 255, 5, 0.07);--diff-blue:rgba(0, 170, 255, 0.07);--diff-red:rgba(255, 0, 0, 0.1)}
@font-face{src:url(/@shared/font/inter.woff2) format(woff2);font-family:Inter;font-display:fallback;font-weight:100 900}
@layer base{.article article{> *{margin-inline:auto}.wide, .grid{max-width:min(100vw, 1050px);margin-block:3em 4em}}}
@layer base{:root{--article-width:650px}.article article{padding-inline:var(--gutter);> *{max-width:var(--article-width)}> a{display:block}}article{h1, h2, h3{margin-bottom:0}h1{letter-spacing:-0.02em;text-wrap:balance}h2{letter-spacing:-0.01em;margin-top:3em}h3{margin-top:2em}p, li{text-wrap:pretty}ol, ul{padding-left:1em;margin-block:1.5em}li{padding:.33em .5em;&::marker{color:var(--text-2)}}> figure, > .visual, table, .gallery{margin-block:2em 3em}figure:first-child{margin-top:0}.code, .card, .ui, table{font-family:Inter, system-ui}.code, .note, .columns, table, dt{font-size:90%}h2, h3{a:before{transition:opacity .1s;position:absolute;color:var(--text-3);margin-left:-1em;content:'#';opacity:0}a:hover:before{opacity:1}}.note{background-color:var(--lift-1);border-radius:.25em;padding:1.5em 2em;margin-block:1.5em;> *{margin-block:.5em}> :first-child{margin-top:0}> :last-child{margin-bottom:0}}figure.full{max-width:unset;margin:3em -1.5em;img{border-radius:0}figcaption{text-align:center;margin-inline:auto}}.ui, .card{border-radius:.5em;font-size:90%}.card{padding:1.5em 2.5em;.small{font-size:80%;color:var(--lift-3)}}.split{margin-block:4em 5em;pre{max-width:95%}> *{padding:2.5em;padding-right:0;flex:1}> :first-child{border:1px solid var(--lift-2);border-width:0 0 1px}h3{margin-block:0 -.33em}@container(width > 1300px){max-width:unset;display:flex;> :first-child{border-width:0 1px 0 0}}}.grid{grid-template-columns:1fr 1fr;display:grid;gap:1em}}}@layer mod{article .image{cursor:zoom-in;&.zoomed{background:black;border-radius:0;cursor:zoom-out;position:fixed;z-index:2;inset:0;min-width:100vw;min-height:100vh;place-items:center;display:grid;margin:0;img{object-fit:contain;max-height:calc(100vh - 3em)}figcaption{margin-block:-1em 0;color:white}}}a > .image{cursor:pointer}}
@layer base{video-player{display:grid;cursor:pointer;& > *{grid-area:1 / 1}button{place-self:center;transition:opacity 0.3s;background-color:rgba(0,0,0,.1);border-radius:50%;display:inline-grid;place-items:center;width:5em;height:5em;padding:0;.icon{font-size:2em;fill:white;stroke:#999}.icon-pause{display:none}&:focus{outline-color:#999}}&[data-playing]{button{opacity:0}&:hover button{opacity:1;.icon-play{display:none}.icon-pause{display:block}}}}a .video button{display:none}}
html{--dark-bg:#2e3337;--button:var(--blue);background-color:var(--dark-bg)}body{color:#38393e;background-color:white}body > header{background-color:#3d4041;letter-spacing:-2%;padding-block:1em;font-weight:600;font-size:90%;.logotype{color:white}}.hero{background-color:var(--dark-bg);padding-block:10% 1em}h1{font-size:clamp(2.5em, 5vw, 3.5em);max-width:11em;text-wrap:balance;font-weight:500;letter-spacing:-4%;font-family:charter, georgia, palatino, serif;margin-block:.5em;line-height:1.1;+ p{color:var(--text-1);line-height:1.7;font-size:90%}}h2{font-family:charter, times;+ p{margin-top:.75em}}.emphasis{font-size:clamp(1.15em, 5vw, 1.4em);font-weight:510;color:black;margin-block:4em;letter-spacing:-1.5%;p{}em{font-weight:500}}footer{text-align:center;img{width:1.75em}}.create{background-color:var(--dark-bg);article{text-align:center}h1{margin-top:20vh}.launcher, > footer{display:none}}.grid{max-width:min(100vw, 1300px);gap:1.5em;> div{background-color:var(--lift-2);padding:min(4%, 1.125em);border-radius:.25em;h3{margin-block:0 1em;font-size:.9em;font-weight:550}}@container (width < 900px){grid-template-columns:1fr}}.columns{background-color:var(--lift-2);max-width:min(100vw, 1300px);margin-top:3em;padding:1.25em;padding-bottom:0;column-width:25em;gap:1.25em;figure{margin-bottom:1.25em;&:hover{outline:1px solid black;outline-offset:3px}}}