@layer base{:root{--code-canvas:#f8f7f3}@media (prefers-color-scheme:dark){:root{--code-canvas:#242724}}.format-intro{grid-template-columns:minmax(0,1fr) minmax(16rem,20rem);align-items:start;gap:1.75rem 5rem;padding-block:3.5rem 2.75rem;display:grid}.format-intro h1{grid-column:1/-1;font-size:clamp(2.75rem,4.4vw,4rem)}.format-intro-copy>p{max-width:40rem;margin-top:1rem}.format-intro-copy>.format-lede{max-width:36rem;margin-top:0;font-size:1.1875rem;line-height:1.6}.format-intro-copy>.format-lede+p{color:var(--muted)}.format-actions{flex-wrap:wrap;gap:.75rem;margin-top:2rem;display:flex}.format-button{border:1px solid var(--line);border-radius:6px;align-items:center;gap:.55rem;min-height:2.75rem;padding:.6rem 1.15rem;font-weight:550;line-height:1.2;text-decoration:none;display:inline-flex}.format-button:hover{border-color:var(--action)}.format-button svg{fill:currentColor;width:1.125rem;height:1.125rem}.format-button-primary{color:var(--action-ink);background:var(--action);border-color:var(--action)}.format-button-primary:hover{color:var(--action-ink);background:var(--action-hover);border-color:var(--action-hover)}.format-facts{background:var(--surface-soft);border-radius:6px;margin-top:.4rem;padding:1.5rem 1.5rem 1.25rem}.format-facts h2{font-family:var(--font-body);color:var(--muted);font-size:.9375rem;font-weight:600}.format-facts dl{margin:.75rem 0 0;font-size:.9375rem}.format-facts dl>div{border-top:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;gap:0 1rem;padding-block:.6rem;display:flex}.format-facts dt{color:var(--muted)}.format-facts dd{overflow-wrap:anywhere;text-align:right;margin:0 0 0 auto;font-weight:550}.format-navigation{border-block:1px solid var(--line);flex-wrap:wrap;gap:.5rem 2rem;padding-block:.9rem;font-size:.9375rem;display:flex}.format-navigation a{text-decoration:none}.format-navigation a:hover{text-decoration:underline}@media (width<=1000px){.format-intro{grid-template-columns:minmax(0,1fr)}.format-facts{max-width:28rem}}@media (width<=760px){.format-intro{gap:2rem;padding-block:2rem}.format-intro h1{font-size:2.65rem}.format-intro-copy>.format-lede{font-size:1.0625rem}.format-button{flex:auto;justify-content:center}}.format-example{grid-template-columns:minmax(0,.9fr) minmax(0,1.25fr);align-items:start;gap:2rem 4rem;padding-block:4rem 3rem;scroll-margin-top:1rem;display:grid}.example-heading{grid-column:1/-1}.format-example h2,.format-packages h2,.format-resource-intro h2{font-size:clamp(2rem,3vw,2.35rem)}.example-label{color:var(--muted);margin-top:.6rem}.readable-example{min-width:0}.recipe-example{background:var(--surface-soft);border-radius:6px;padding:2rem 2rem 1.75rem}.recipe-example h3{font-family:var(--font-editorial);letter-spacing:-.035em;font-size:2.6rem;font-weight:450;line-height:1.1}.recipe-example-meta{color:var(--muted);margin:.35rem 0 0}.recipe-example h4{color:var(--action);margin:1.75rem 0 .6rem;font-size:.9375rem;font-weight:600}.recipe-example ul{margin:0;padding:0;list-style:none}.recipe-example ol{margin:0;padding-left:1.4rem}.recipe-example li+li{margin-top:.45rem}.recipe-example ol li{padding-left:.25rem}.recipe-example ol li+li{margin-top:.7rem}.recipe-example li::marker{color:var(--action)}.recipe-example aside{border-top:1px solid var(--line);margin-top:1.75rem;padding-top:.25rem}.recipe-example aside p{font-size:.9375rem}.equipment-line{color:var(--muted);margin-top:1.25rem;font-size:.875rem}.equipment-line strong{color:var(--ink);font-weight:600}.recipe-code{border:1px solid var(--line);background:var(--code-canvas);border-radius:6px;grid-template-columns:minmax(0,1fr) auto;min-width:0;display:grid;overflow:hidden}.recipe-code figcaption{overflow-wrap:anywhere;flex-direction:column;gap:.1rem;padding:.9rem 1.25rem;font-size:.875rem;display:flex}.recipe-code figcaption span:first-child{font-family:ui-monospace,monospace}.recipe-code figcaption span:last-child{color:var(--muted);font-size:.8125rem}.code-actions{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:.5rem 1.25rem;padding:.9rem 1.25rem;font-size:.875rem;display:flex}.recipe-code figcaption,.code-actions{border-bottom:1px solid var(--line)}.code-actions button{border:1px solid var(--line);color:var(--action);cursor:pointer;background:0 0;border-radius:6px;padding:.4rem .75rem}.code-actions button:hover{border-color:var(--action)}.code-actions [hidden]{display:none}.copy-status{text-align:right;color:var(--muted);flex-basis:100%}.copy-status:empty{display:none}.recipe-code pre{tab-size:2;grid-column:1/-1;max-height:min(34rem,70vh);margin:0;padding:1.25rem;font-size:.875rem;line-height:1.7;overflow:auto}.recipe-code pre code{font-size:inherit;white-space:pre-wrap;overflow-wrap:anywhere}.recipe-code pre:focus-visible{outline-offset:-4px}.token-key{color:var(--code-key)}.token-string{color:var(--code-string)}.token-value{color:var(--code-value)}.format-correspondences{grid-template-columns:repeat(3,minmax(0,1fr));gap:2.5rem;margin:0 0 4.5rem;font-size:.9375rem;display:grid}.format-correspondences>div{border-top:1px solid var(--line);padding-top:1rem}.format-correspondences dt{font-weight:600}.format-correspondences dd{color:var(--muted);margin:.4rem 0 0}@media (width<=1000px){.format-example{column-gap:2.5rem}.recipe-example{padding:1.5rem}}@media (width<=760px){.format-example{grid-template-columns:minmax(0,1fr);padding-block:2.5rem}.recipe-example{padding:1.4rem 1.25rem}.recipe-example h3{font-size:2.25rem}.format-correspondences{grid-template-columns:minmax(0,1fr);gap:1.5rem;margin-bottom:3rem}.recipe-code{grid-template-columns:minmax(0,1fr)}.recipe-code figcaption,.code-actions{padding-inline:1rem}.recipe-code figcaption{border-bottom:0;padding-bottom:0}.code-actions{justify-content:flex-start}.copy-status{text-align:left}.recipe-code pre{max-height:35rem;padding:1rem}}.format-packages{border-top:1px solid var(--line);grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);align-items:start;gap:5rem;padding-block:4rem;scroll-margin-top:1rem;display:grid}.format-packages h2,.format-resource-intro h2{margin-bottom:1.25rem}.format-packages>div:first-child>p{max-width:60ch}.package-rights{color:var(--muted);gap:.2rem;margin-top:1.25rem;font-size:.875rem;display:grid}.package-rights p+p{margin-top:0}.package-list{background:var(--surface-soft);border-radius:6px;min-width:0;padding:1.75rem}.package-list h3{font-family:ui-monospace,monospace;font-size:.9375rem;font-weight:500}.package-list dl{margin:1.25rem 0}.package-list dl>div{border-top:1px solid var(--line);padding-block:.85rem}.package-list dt{font-size:.9375rem}.package-list dd{color:var(--muted);margin:.3rem 0 0;font-size:.9375rem}.package-list>p{color:var(--muted);font-size:.875rem}@media (width<=1000px){.format-packages{gap:2.5rem}}@media (width<=760px){.format-packages{grid-template-columns:minmax(0,1fr);gap:2rem;padding-block:2.5rem}.package-list{padding:1.25rem}}.format-resources{border-top:1px solid var(--line);padding-block:4rem;scroll-margin-top:1rem}.format-resource-intro{max-width:62ch}.resource-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.25rem;margin-block:2.25rem 2.75rem;display:grid}.resource-list>div{border:1px solid var(--line);border-radius:6px;padding:1.5rem}.resource-list>div:first-child{background:var(--surface-soft);border-color:#0000}.resource-list h3{font-size:1.125rem}.resource-list h3 a{text-decoration:none}.resource-list h3 a:hover{text-decoration:underline}.resource-list p{color:var(--muted);margin:.5rem 0 0;font-size:.9375rem}.resource-advanced{padding-bottom:3rem}.resource-advanced h3{font-family:var(--font-body);font-size:1rem;font-weight:600}.resource-advanced ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem 5rem;margin:.85rem 0 0;padding:0;font-size:.9375rem;list-style:none;display:grid}.format-boundaries{border-top:1px solid var(--line);grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:5rem;padding-top:2.5rem;display:grid}.format-boundaries h3{margin-bottom:.75rem}.format-boundaries p{color:var(--muted);font-size:.9375rem}@media (width<=1000px){.resource-list{grid-template-columns:minmax(0,1fr)}.resource-advanced ul,.format-boundaries{column-gap:2.5rem}}@media (width<=760px){.format-resources{padding-block:2.5rem 3rem}.resource-advanced ul{grid-template-columns:minmax(0,1fr)}.format-boundaries{grid-template-columns:minmax(0,1fr);gap:2rem}}}
