.control-examples[data-astro-cid-7w3e3cwo]{display:flex;flex-wrap:wrap;gap:var(--space-3)}.field-examples[data-astro-cid-7w3e3cwo]{display:grid;gap:var(--space-3);max-width:var(--layout-reading)}.design-system[data-astro-cid-7w3e3cwo]{width:min(100%,54rem);margin-inline:auto}.design-system-header[data-astro-cid-7w3e3cwo]{display:grid;gap:1rem;padding-block-end:clamp(3rem,8vw,5rem)}.design-section[data-astro-cid-7w3e3cwo]{display:grid;gap:1.5rem;padding-block:clamp(2.5rem,6vw,4rem);border-top:1px solid var(--color-border)}.design-section[data-astro-cid-7w3e3cwo] h2[data-astro-cid-7w3e3cwo]{margin:0;font-family:var(--font-pixel-grid);font-size:var(--text-label);font-weight:400;letter-spacing:.08em;color:var(--color-accent)}.mode-comparison[data-astro-cid-7w3e3cwo]{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr));border:1px solid var(--color-border)}.mode-sample[data-astro-cid-7w3e3cwo]{display:grid;gap:1.25rem;min-height:13rem;padding:1.5rem;background:var(--color-surface);color:var(--color-text)}.mode-sample[data-astro-cid-7w3e3cwo]+.mode-sample[data-astro-cid-7w3e3cwo]{border-top:1px solid var(--color-border)}.mode-sample-light[data-astro-cid-7w3e3cwo]{color-scheme:light}.mode-sample-dark[data-astro-cid-7w3e3cwo]{color-scheme:dark}.mode-sample[data-astro-cid-7w3e3cwo] span[data-astro-cid-7w3e3cwo],.mode-sample[data-astro-cid-7w3e3cwo] small[data-astro-cid-7w3e3cwo],.type-specimens[data-astro-cid-7w3e3cwo] span[data-astro-cid-7w3e3cwo]{font-family:var(--font-mono);font-size:var(--text-2xs);color:var(--color-text-muted)}.mode-sample[data-astro-cid-7w3e3cwo] strong[data-astro-cid-7w3e3cwo]{align-self:center;font-family:var(--font-pixel-grid);font-size:var(--text-md);font-weight:400}.mode-sample[data-astro-cid-7w3e3cwo] small[data-astro-cid-7w3e3cwo]{align-self:end}.color-list[data-astro-cid-7w3e3cwo],.type-specimens[data-astro-cid-7w3e3cwo],.spacing-list[data-astro-cid-7w3e3cwo],.motion-scale[data-astro-cid-7w3e3cwo]{display:grid;gap:0}.color-row[data-astro-cid-7w3e3cwo],.spacing-row[data-astro-cid-7w3e3cwo]{display:grid;grid-template-columns:2rem minmax(7rem,1fr) minmax(10rem,auto);align-items:center;gap:1rem;min-height:3.25rem;border-bottom:1px solid color-mix(in oklch,var(--color-border),transparent 35%)}.color-chip[data-astro-cid-7w3e3cwo]{inline-size:1.25rem;block-size:1.25rem;border:1px solid var(--color-border)}.color-row[data-astro-cid-7w3e3cwo] strong[data-astro-cid-7w3e3cwo]{font-size:var(--text-md);font-weight:500}.color-row[data-astro-cid-7w3e3cwo] code[data-astro-cid-7w3e3cwo],.spacing-row[data-astro-cid-7w3e3cwo] code[data-astro-cid-7w3e3cwo],.spacing-row[data-astro-cid-7w3e3cwo] small[data-astro-cid-7w3e3cwo]{font-family:var(--font-mono);font-size:var(--text-2xs);color:var(--color-text-muted)}.type-specimens[data-astro-cid-7w3e3cwo]>div[data-astro-cid-7w3e3cwo]{display:grid;gap:.75rem;padding-block:1.5rem;border-bottom:1px solid color-mix(in oklch,var(--color-border),transparent 35%)}.type-specimens[data-astro-cid-7w3e3cwo] p[data-astro-cid-7w3e3cwo]{margin:0}.type-serif[data-astro-cid-7w3e3cwo]{font-family:var(--font-serif);font-size:var(--title-lg);line-height:1}.type-sans[data-astro-cid-7w3e3cwo]{max-width:46ch;font-family:var(--font-sans);font-size:var(--text-lg);line-height:1.65}.type-pixel[data-astro-cid-7w3e3cwo]{font-family:var(--font-pixel-grid);font-size:var(--text-ui)}.spacing-row[data-astro-cid-7w3e3cwo]{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 3rem}.spacing-line[data-astro-cid-7w3e3cwo]{display:block;block-size:2px;max-inline-size:100%;background:var(--color-accent)}.motion-copy[data-astro-cid-7w3e3cwo]{max-width:60ch;margin:0;line-height:1.7;color:var(--color-text-muted)}.motion-scale[data-astro-cid-7w3e3cwo]{gap:.75rem}.motion-scale[data-astro-cid-7w3e3cwo] span[data-astro-cid-7w3e3cwo]{display:flex;align-items:center;inline-size:var(--motion-width);min-inline-size:5rem;block-size:2.25rem;padding-inline:.75rem;background:var(--color-accent);color:var(--color-surface);font-family:var(--font-mono);font-size:var(--text-2xs)}@media(width>=36rem){.mode-sample[data-astro-cid-7w3e3cwo]+.mode-sample[data-astro-cid-7w3e3cwo]{border-top:0;border-left:1px solid var(--color-border)}}@media(width<=32rem){.color-row[data-astro-cid-7w3e3cwo]{grid-template-columns:1.5rem 1fr}.color-row[data-astro-cid-7w3e3cwo] code[data-astro-cid-7w3e3cwo]{grid-column:2}}