.preview-size-controls[data-astro-cid-4kgis3xw]{inline-size:100%;min-inline-size:0}.size-field[data-astro-cid-4kgis3xw]{gap:var(--gap-sm);min-inline-size:0;color:var(--text-muted);font-size:var(--font-size-xs);font-weight:var(--fw-bold);display:grid}.field-header[data-astro-cid-4kgis3xw]{justify-content:space-between;align-items:center;gap:var(--gap-sm);min-inline-size:0;display:flex;&>span[data-astro-cid-4kgis3xw]{overflow-wrap:anywhere}}output[data-astro-cid-4kgis3xw]{corner-shape:var(--corner-shape);background:var(--brand-orange);color:var(--on-brand-orange);font-size:var(--font-size-xs);font-variant-numeric:tabular-nums;font-weight:var(--fw-bold);border-radius:999px;flex:none;padding:.2rem .5rem}input[data-astro-cid-4kgis3xw][type=range]{appearance:none;background:0 0;border:0;inline-size:100%;margin-block:.2rem;padding:0;&::-webkit-slider-container{border-radius:var(--radius);background:linear-gradient(to right, var(--brand-orange) var(--progress), var(--brand-blue) var(--progress));block-size:3px}&::-webkit-slider-thumb{appearance:none;background:var(--brand-orange);cursor:ew-resize;border-radius:50%;block-size:16px;inline-size:16px}&::-moz-range-track{border-radius:var(--radius);background:var(--brand-blue);block-size:3px}&::-moz-range-progress{border-radius:var(--radius);background:var(--brand-orange);block-size:3px}&::-moz-range-thumb{background:var(--brand-orange);cursor:ew-resize;border:0;border-radius:50%;block-size:16px;inline-size:16px}&:focus-visible{outline:2px solid var(--brand-blue);outline-offset:5px}}.comparison-grid[data-astro-cid-pwxre3lu]{gap:var(--gap);grid-template-columns:repeat(2,minmax(0,1fr));display:grid;@media (width<=48rem){grid-template-columns:minmax(0,1fr)}& article{border-radius:var(--radius);corner-shape:var(--corner-shape);background:color-mix(in oklch, var(--surface-strong) 92%, transparent);min-inline-size:0;box-shadow:var(--shadow-full);border:0;overflow:hidden;&>div[data-astro-cid-pwxre3lu]:last-child,&>.comparison-code[data-astro-cid-pwxre3lu]{padding:var(--padding)}& h4{margin-block-start:var(--gap-sm);font-size:1.25rem}& p{color:var(--text-muted);line-height:var(--guide-text-line-height);font-size:var(--guide-text-size);margin-block-start:var(--gap-sm)}& a{min-block-size:2.75rem;color:var(--link);font-weight:var(--fw-semibold);align-items:center;margin-block-start:var(--gap);display:inline-flex;&:after{content:" →";margin-inline-start:.35rem}&:focus-visible{outline:2px solid var(--brand-blue);outline-offset:3px}}}}.comparison-code[data-astro-cid-pwxre3lu]{align-items:center;gap:var(--gap-sm);flex-wrap:wrap;display:flex;&>.guide-syntax{border-radius:var(--radius);corner-shape:var(--corner-shape);background:var(--bg);white-space:nowrap;padding:.6rem .75rem;font-size:1rem}& svg{block-size:2rem;inline-size:2rem;color:var(--brand-orange);flex:none}}.comparison-visual[data-astro-cid-pwxre3lu]{block-size:12rem;padding:var(--padding);align-items:center;gap:var(--gap-sm);background:linear-gradient(color-mix(in oklch, var(--border-color) 35%, transparent) 1px, transparent 1px), linear-gradient(90deg, color-mix(in oklch, var(--border-color) 35%, transparent) 1px, transparent 1px), color-mix(in oklch, var(--brand-orange) 12%, var(--surface));background-size:1rem 1rem;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);display:grid;&>span[data-astro-cid-pwxre3lu]:not(.comparison-divider){border:2px solid color-mix(in oklch, var(--brand-orange) 65%, var(--text));border-radius:calc(var(--radius) * .75);gap:.35rem;block-size:7rem;min-block-size:0;padding:.4rem;overflow:hidden}& i{border-radius:calc(var(--radius) * .4);background:color-mix(in oklch, var(--brand-blue) 55%, var(--surface));min-inline-size:0}& .flex-layout{align-items:stretch;display:flex;& i{flex:1}}& .grid-layout{grid-template-columns:repeat(2,minmax(0,1fr));display:grid}& .columns-layout{columns:2;column-rule:1px solid color-mix(in oklch, var(--brand-orange) 55%, transparent);column-gap:.45rem;display:block;& i{break-inside:avoid;block-size:.55rem;inline-size:100%;margin-block-end:.3rem;display:block;&:nth-child(5n+1){inline-size:86%}&:nth-child(7n+3){inline-size:74%}&:nth-child(9n+2){inline-size:92%}}}& .comparison-divider{color:var(--link);font-weight:var(--fw-bold)}}.lanes-layout[data-astro-cid-pwxre3lu]{grid-template-rows:repeat(6,minmax(0,1fr));grid-template-columns:repeat(2,minmax(0,1fr));display:grid;& i:first-child{grid-area:1/1/span 2}& i:nth-child(2){grid-area:1/2/span 3}& i:nth-child(3){grid-area:3/1/span 3}& i:nth-child(4){grid-area:4/2}& i:nth-child(5){grid-area:5/2/span 2}& i:nth-child(6){grid-area:6/1}}