header{box-sizing:border-box;width:100%}main{width:85%;max-width:44rem;margin:auto;padding:2rem 0}main.wide{max-width:80rem;padding-top:5rem}main.wide h1{text-align:center;margin:0 0 1rem;font-family:Roboto Mono,monospace}.lede{text-align:center;color:#474852;max-width:34rem;margin:0 auto 3.5rem;font-size:1.4rem}time{color:#474852;font-size:.95rem}.byline{align-items:center;gap:.8rem;display:flex}.avatar{background:linear-gradient(135deg, var(--from), var(--to));color:#fff;letter-spacing:0;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:2.6rem;height:2.6rem;font-family:Roboto Mono,monospace;font-size:.95rem;font-weight:700;display:inline-flex}.avatar.large{width:4.5rem;height:4.5rem;font-size:1.5rem}.byline>span{flex-direction:column;gap:.15rem;display:flex}.byline .author{font-weight:500}.byline .updated{color:#474852;margin-left:.3rem;font-size:.95rem}.cards{grid-template-columns:repeat(auto-fill,minmax(min(100%,22rem),1fr));gap:1.5rem;margin:0;padding:0;list-style:none;display:grid}.cards a{background:#fff;border:1px solid #cdcdcd;border-radius:10px;flex-direction:column;height:100%;transition:border-color .1s,transform .1s;display:flex;overflow:hidden}.cards a:hover,.cards a:focus-visible{border-color:#fd6584;transform:translateY(-2px)}.cards .thumb{aspect-ratio:16/9;object-fit:cover;background:#111113;width:100%;max-height:none}.cards .cover{aspect-ratio:16/9;box-sizing:border-box;color:#eef;background:#111113;flex-direction:column;justify-content:flex-end;gap:.4rem;padding:1.5rem 1.5rem 1.9rem;display:flex;position:relative}.cards .cover img{width:auto;height:2rem;position:absolute;top:1.3rem;right:1.5rem}.cards .cover-title{font-family:Roboto Mono,monospace;font-size:1.6rem;font-weight:700;line-height:130%}.cards .cover-subtitle{color:#9a9aae;font-size:1.05rem;line-height:135%}.cards .cover:after{content:"";background:linear-gradient(90deg,#0038ff 0%,red 100%);height:.4rem;position:absolute;bottom:0;left:0;right:0}.cards .card{flex-direction:column;flex-grow:1;gap:.8rem;padding:1.4rem 1.5rem 1.5rem;display:flex}.cards h2{margin:0;font-size:1.45rem;line-height:125%}.cards .type{color:#474852;margin-bottom:-.4rem;font-family:Roboto Mono,monospace;font-size:.9rem}.cards p{color:#2b2b33;flex-grow:1;margin:0 0 .4rem;font-size:1.1rem}.end{text-align:center;color:#474852;max-width:34rem;margin:3rem auto 1rem}.end-title{color:#111113;margin:0 0 .5rem;font-family:Roboto Mono,monospace;font-weight:500}.intro{border-bottom:1px solid #cdcdcd;margin-bottom:2.5rem;padding-bottom:1.8rem}.intro .kicker{color:#474852;margin:0 0 .6rem;font-family:Roboto Mono,monospace;font-size:.95rem}.summary{margin:0 0 1.6rem}.summary p{color:#2b2b33;margin:0;font-size:1.15rem;line-height:150%}.intro+figure{margin-top:0}main nav.pager{grid-template-columns:1fr 1fr;gap:1.5rem;margin-bottom:2rem;padding:0;display:grid}.pager a{text-align:left;background:#fff;border:1px solid #cdcdcd;border-radius:10px;flex-direction:column;gap:.4rem;margin:0;padding:1.2rem 1.4rem;font-weight:500;line-height:135%;transition:border-color .1s;display:flex}.pager a:hover,.pager a:focus-visible{border-color:#fd6584}.pager a>span{color:#474852;font-family:Roboto Mono,monospace;font-size:.9rem;font-weight:400}.pager .older{text-align:right;align-items:flex-end}main>.button.tertiary{margin-bottom:1rem}article{margin-bottom:3rem}article h1{margin:0 0 1.5rem;font-family:"Source Sans 3",sans-serif;line-height:115%}article figure{margin:2rem 0}article figure img{border-radius:10px;width:100%;max-height:none;display:block}article figcaption{color:#474852;margin-top:.6rem;font-size:.9rem}article h2{margin:2.5rem 0 1rem;font-family:Roboto Mono,monospace;font-size:1.5rem}article p,article li{font-size:1.2rem;line-height:150%}article li{margin-bottom:.5rem}article a{text-underline-offset:.2em;text-decoration:underline #fd6584}article code{background:#dcdcf0;border-radius:4px;padding:.1em .3em;font-family:Roboto Mono,monospace;font-size:.9em}article blockquote{border-left:.3rem solid #fd6584;margin:1.5rem 0;padding-left:1.2rem}article hr{border:none;border-top:1px solid #cdcdcd;margin:3rem 0 1.5rem}article hr~p,article hr~ul li{color:#474852;font-size:1rem}.about{color:#eef;background:#111113;border-radius:10px;align-items:flex-start;gap:1.2rem;margin-top:3rem;padding:1.5rem;display:flex}.about h2{margin:0 0 .4rem;font-size:1.2rem}.about p{margin:0;font-size:1.05rem}.diagram{color:#111113;background:#fff;border-radius:10px;padding:1.8rem}.diagram p,.diagram li{margin:0;font-size:1rem;line-height:140%}.diagram ul,.diagram ol{margin:0;padding:0;list-style:none}.sketch{pointer-events:none;position:absolute;overflow:visible}.sketch path{fill:none}.sketch .ink{stroke:#111113}.sketch .blue{stroke:#0038ff}.sketch .pink{stroke:#fd6584}.sketch .red{stroke:red}.sketch .green{stroke:#2e7d32}.sketch .hatch{stroke-opacity:.35}.sketch .solid{stroke:none}.sketch .solid.red{fill:red}.sketch .solid.paper{fill:#fff}.diagram.dark{color:#eef;background:#111113}.dark .sketch .ink{stroke:#eef}.diagram .fail,.diagram .hot{text-shadow:0 0 2px #fff,0 0 3px #fff,0 0 5px #fff,0 0 8px #fff;font-weight:500}.dark .fail,.dark .hot{text-shadow:0 0 2px #111113,0 0 3px #111113,0 0 5px #111113,0 0 8px #111113}.dark .sketch .hatch{stroke-opacity:.5}.dark .sketch .solid.paper{fill:#111113}.diagram .title{width:fit-content;margin-bottom:1.8rem;font-family:Roboto Mono,monospace;font-size:1.2rem;font-weight:700;position:relative}.title .sketch{width:calc(100% + .4rem);height:.55rem;bottom:-.5rem;left:-.2rem;right:-.2rem}.diagram .label{color:#474852;margin:1.6rem 0 .8rem;font-family:Roboto Mono,monospace;font-size:.95rem}.diagram .note{color:#474852;margin-top:1.4rem}.diagram .blue{color:#0038ff}.diagram .pink,.diagram .red{color:#8c1d18}.dark .label,.dark .note{color:#9a9aae}.dark .blue{color:#eef}.dark .pink{color:#fd6584}.dark .red{color:#ef5350}.timeline{grid-template-columns:repeat(4,1fr);gap:1.2rem;display:grid;position:relative}.timeline .line.across{width:100%;height:.5rem;top:.3rem;left:0}.timeline .line.down{display:none}.diagram .timeline li{padding-top:1.9rem;position:relative}.timeline .dot{width:1.1rem;height:1.1rem;top:0;left:0}.timeline b{margin-bottom:.3rem;font-family:Roboto Mono,monospace;display:block}.timeline .warn b{color:#8c1d18}.dark .timeline .warn b{color:#fd6584}.flow{gap:2.2rem;display:flex}.diagram .flow li,.diagram .tiles li{isolation:isolate;text-align:center;justify-content:center;align-items:center;padding:.9rem 1rem;display:flex;position:relative}.diagram .flow li{flex:1}.box{z-index:-1;width:100%;height:100%;inset:0}.arrow.across{width:1.8rem;height:1rem;top:calc(50% - .5rem);left:-2rem}.arrow.down{display:none}.diagram .flow .wide{flex:3}.flow+.label{margin-top:2rem}.spectrum{justify-content:space-between;gap:2rem;font-weight:500;display:flex}.spectrum span:last-child{text-align:right}.spectrum+.bar{height:1.1rem;margin:.8rem 0 .4rem;position:relative}.bar .sketch{width:100%;height:100%;inset:0}.columns{grid-template-columns:1fr 1fr;gap:1.5rem;display:grid}.columns>div:last-child{text-align:right}.diagram .columns li{margin-bottom:.35rem}.tiles{grid-template-columns:repeat(auto-fit,minmax(7rem,1fr));gap:.8rem;display:grid}.diagram .tiles li{padding:.9rem .6rem}@media screen and (width<=600px){main,main.wide{padding:3rem 0}.about{flex-direction:column}main nav.pager{grid-template-columns:1fr}.pager>span:empty{display:none}.pager .older{text-align:left;align-items:flex-start}.diagram{padding:1.4rem}.timeline{grid-template-columns:1fr}.timeline .line.across{display:none}.timeline .line.down{width:.5rem;height:100%;display:block;top:0;left:.3rem}.diagram .timeline li{padding:0 0 0 2rem}.flow{flex-direction:column;gap:2rem}.arrow.across{display:none}.arrow.down{width:1rem;height:1.6rem;display:block;top:-1.8rem;left:calc(50% - .5rem)}.columns{grid-template-columns:1fr}.columns>div:last-child,.spectrum span:last-child{text-align:left}}