.doc-page-art{border-radius:var(--radius-lg);background:var(--doc-surface);min-width:0;height:300px;position:relative;overflow:hidden;container-type:inline-size}.doc-page-art-getting-started{background:0 0;border-radius:0;height:auto}.doc-page-art-colors{background:var(--doc-surface)}.doc-page-art-motion{background:var(--doc-accent-deep)}.doc-page-art-spacing,.doc-page-art-icons{background:var(--doc-surface)}.doc-radius-art{inset:var(--space-2xl);justify-content:center;align-items:center;display:flex;position:absolute}.doc-radius-art>span{border:1px solid var(--art-ink);width:70%;height:70%;position:absolute;transform:rotate(-12deg)}.doc-radius-art>span:nth-child(2){width:50%;height:50%}.doc-radius-art>span:nth-child(3){background:var(--doc-inverse);width:30%;height:30%}.doc-motion-art{justify-content:center;gap:var(--space-2xl);height:100%;padding:var(--space-2xl);flex-direction:column;display:flex}.doc-motion-art>div{border-top:1px solid color-mix(in srgb, var(--art-ink) 25%, transparent);position:relative}.doc-motion-art span{width:var(--space-2xl);aspect-ratio:1;margin-top:calc(-1 * var(--space-md));border-radius:var(--radius-full);background:var(--art-ink);display:block;position:relative}.doc-motion-art>div:first-child span{left:5%}.doc-motion-art>div:nth-child(2) span{left:40%}.doc-motion-art>div:nth-child(3) span{left:80%}@media (max-width:640px){.foundation-art-color>div{width:44%;padding:var(--space-sm)}.foundation-art-color>div:first-child{top:8%;left:2%}.foundation-art-color>div:nth-child(2){top:14%;left:28%}.foundation-art-color>div:nth-child(3){top:8%;left:55%}.foundation-art-typography{padding:var(--space-md)}.foundation-art-typography>div{padding:var(--space-sm)}.foundation-art-type-glyph{font-size:48px}.foundation-art-icons>span{width:88px}}
