@layer components{.hero{--font-weight:800;margin-block:var(--space-xxl)0;mix-blend-mode:difference;margin-inline-start:calc(var(--space-sm)*-1);font-size:min(18vw,10em);line-height:1;position:relative}@media (prefers-color-scheme:dark){.hero{mix-blend-mode:normal}}@media (width>=50em){.hero{margin-block:var(--space-xxxl)0}}@media (width>=50em){.docs-block{padding-inline-start:clamp(1rem,3vw,3rem)}}.grease-marks{pointer-events:none;z-index:-1;grid-template-rows:repeat(auto-fit,minmax(2rem,1fr));grid-template-columns:repeat(auto-fit,minmax(2rem,1fr));width:100%;display:grid;position:absolute;inset-block-start:-20rem;inset-inline-end:0;rotate:20deg}@media (width>=50em){.grease-marks{inset-block-start:0;inset-inline-end:-10rem}}.grease-marks>*{background-color:light-dark(var(--color-text),var(--color-bg));width:.5rem;height:.5rem;box-shadow:0 0 2rem 2.5rem light-dark(var(--color-text),var(--color-bg));mix-blend-mode:normal;opacity:.75;border-radius:100%}@media (prefers-color-scheme:dark){.grease-marks>*{mix-blend-mode:overlay}}.grease-marks>.shape-1{background-color:var(--color-accent);box-shadow:0 0 3rem 3.5rem var(--color-accent);opacity:.5;mix-blend-mode:overlay}@media (prefers-color-scheme:dark){.grease-marks>.shape-1{mix-blend-mode:normal}}.demo-grid>div{--color-bg:light-dark(oklch(from var(--neutral)var(--200)/50%),oklch(from var(--primary)var(--700)));padding:var(--space-sm);color:var(--color-text);background-color:var(--color-bg);margin-block:var(--space-sm);font-size:var(--size-sm)}.demo-chips{margin-block:0 var(--space-sm);flex-wrap:wrap;list-style:outside;display:flex}.demo-chips>li{width:auto;padding:var(--space-sm);color:var(--color-text);background-color:var(--color-bg);font-size:var(--size-xs);margin:0}}