.website-workspace{--workspace-reader-width:clamp(420px, calc((100vw - var(--website-sidebar-offset)) * .44), 650px);--workspace-footer-height:calc(64px + env(safe-area-inset-bottom,0px));background:var(--background-primary);height:calc(100dvh + 2px)}.workspace-window-boundary{pointer-events:none;width:1px;height:2px;position:absolute;top:100dvh}.workspace-component-name.ui-button{flex-shrink:0;max-width:180px}.workspace-component-name>span,.workspace-location>span,.workspace-source-name>span{white-space:nowrap;text-overflow:ellipsis;min-width:0;line-height:24px;display:block;overflow:hidden}.workspace-slash{color:var(--muted-foreground);padding-inline:2px}.workspace-location.ui-button{flex-shrink:1;gap:4px;min-width:0;max-width:340px}.workspace-location>svg,.workspace-source-name>svg{flex-shrink:0}.website-workspace .website-header-lane{transition:width .24s cubic-bezier(.22,1,.36,1)}.website-workspace[data-layout=split] .website-header-lane{width:calc(var(--website-sidebar-offset) + var(--workspace-reader-width));border-right:1px solid var(--border);background:linear-gradient(to right, var(--background-primary) var(--website-sidebar-offset), var(--background-primary-subtle) var(--website-sidebar-offset));flex:none}.website-workspace[data-layout=docs] .website-header{background:var(--background-primary-subtle)}.website-workspace .website-header-start{flex:1}.workspace-reader{inset:0 auto 0 var(--website-sidebar-offset);width:var(--workspace-reader-width);background:var(--background-primary-subtle);border-right:1px solid var(--border);z-index:20;transition:transform .24s cubic-bezier(.22,1,.36,1),opacity .18s;position:fixed;container:workspace-reader/inline-size}.workspace-reader-surface{flex-direction:column;height:100%;padding-top:64px;display:flex}.workspace-reading{overscroll-behavior:contain;flex:1;min-height:0;padding:32px;overflow:auto}.workspace-article{min-width:0;max-width:720px;margin-inline:auto;font-size:16px;line-height:24px}.workspace-article :is(h1,h2,h3,h4):not(:where(.not-typeset *,[data-not-typeset] *)){color:var(--foreground);scroll-margin-top:32px;font-weight:400}.workspace-article h1:not(:where(.not-typeset *,[data-not-typeset] *)){margin:0 0 16px;font-size:28px;line-height:40px}.workspace-article h2:not(:where(.not-typeset *,[data-not-typeset] *)){margin:40px 0 16px;font-size:24px;line-height:35px}.workspace-article h3:not(:where(.not-typeset *,[data-not-typeset] *)){margin:32px 0 12px;font-size:20px;line-height:28px}.workspace-article h4:not(:where(.not-typeset *,[data-not-typeset] *)),.workspace-article .workspace-example>:is(h3,h4,h5,h6){margin:24px 0 12px;font-size:16px;line-height:24px}.workspace-article p:not(:where(.not-typeset *,[data-not-typeset] *)){color:var(--muted-foreground);margin:0 0 20px}.workspace-article>.workspace-intro{margin-bottom:32px}.workspace-example{outline:none;margin:32px 0;scroll-margin-top:32px}.workspace-example .web-preview{font-family:var(--font-sans);background:var(--background-primary);font-size:14px;line-height:20px}.website-workspace[data-layout=split] .workspace-article>:is(h2#preview,h2#preview+.workspace-example){height:0;min-height:0;margin:0;padding:0;overflow:hidden}.website-workspace[data-layout=split] .workspace-article>h2#design-guidance{margin-top:0}.workspace-stage{inset:64px 0 var(--workspace-footer-height) calc(var(--website-sidebar-offset) + var(--workspace-reader-width));background:var(--background-primary);justify-content:center;align-items:center;padding:32px;transition:left .24s cubic-bezier(.22,1,.36,1);display:flex;position:fixed;overflow:auto}.workspace-live-demo{flex-direction:column;flex-shrink:0;justify-content:safe center;align-items:center;width:100%;display:flex;overflow:auto}.workspace-stage *{overscroll-behavior:contain}.workspace-utilities{z-index:35;bottom:0;left:calc(var(--website-sidebar-offset) + var(--workspace-reader-width));height:var(--workspace-footer-height);padding-bottom:env(safe-area-inset-bottom,0px);background:var(--background-primary);justify-content:center;align-items:center;gap:4px;transition:left .24s cubic-bezier(.22,1,.36,1);display:flex;position:fixed;right:0}.website-workspace[data-layout=preview] .workspace-reader{visibility:hidden;opacity:0;pointer-events:none;transform:translate(-24px)}.website-workspace[data-layout=preview] :is(.workspace-stage,.workspace-utilities){left:var(--website-sidebar-offset)}.website-workspace[data-layout=docs] .workspace-reader{width:calc(100% - var(--website-sidebar-offset));border-right:none}.website-workspace[data-layout=docs] .workspace-reader-surface{padding-bottom:var(--workspace-footer-height)}.website-workspace[data-layout=docs] .workspace-reading{width:100%;padding-inline:32px calc(var(--website-sidebar-offset) + 32px)}.website-workspace[data-layout=docs] .workspace-utilities{left:var(--website-sidebar-offset)}.website-workspace[data-layout=docs] .workspace-stage{visibility:hidden;pointer-events:none}.workspace-page-outline{width:208px;top:96px;right:24px;bottom:calc(var(--workspace-footer-height) + 24px);display:none;position:absolute;overflow:auto}@media (width>=1280px){.workspace-page-outline{display:block}}.workspace-outline.ui-popover{width:min(320px,100vw - 32px)}.workspace-outline .ui-popover-header{justify-content:space-between;align-items:center;gap:8px;display:flex}.workspace-outline .ui-popover-core{overscroll-behavior:contain;max-height:min(600px,70dvh);overflow:auto}.workspace-outline-label{align-items:center;gap:8px;min-width:0;font-size:14px;line-height:20px;display:inline-flex}.workspace-outline-label>span:first-child{min-width:0}.workspace-gosh-eyes{flex-shrink:0;width:16px}.workspace-article [data-reading-active]:after{content:"";vertical-align:-1px;background:var(--muted-foreground);width:16px;height:16px;margin-inline-start:8px;animation:4s ease-in-out infinite workspace-gosh-float;display:inline-block;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath d='M5 5v6M11 5v6' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") 50%/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath d='M5 5v6M11 5v6' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") 50%/contain no-repeat}@keyframes workspace-gosh-float{0%,to{transform:translateY(0)rotate(-6deg)}50%{transform:translateY(-2px)rotate(6deg)}}.workspace-drawer-host,.workspace-drawer-portal{pointer-events:none;position:absolute;inset:0}.workspace-drawer-viewport.ui-drawer-viewport{pointer-events:none;padding:0;position:absolute;inset:0}.workspace-drawer.ui-drawer{pointer-events:auto;width:calc(100% - 16px);max-width:none;height:100%;max-height:100%;margin:0 8px}.workspace-drawer .ui-drawer-header{align-items:center;gap:8px;padding:12px 23px;display:flex}.workspace-drawer .ui-drawer-header>.ui-title{font-size:20px;font-weight:400;line-height:28px}.workspace-drawer .ui-drawer-header>.ui-button:last-child{margin-left:auto}.workspace-source-name.ui-button{min-width:0;max-width:none;color:var(--muted-foreground);flex:1;justify-content:flex-start;padding-inline:0;font-size:14px}.workspace-drawer .ui-drawer-core{overscroll-behavior:contain;min-height:0;padding:0 23px 24px;overflow:auto}.workspace-drawer .ui-drawer-core:has(.workspace-source){overflow:hidden}.workspace-source.ui-snippet{background:var(--background-primary);border:none;flex-direction:column;height:100%;min-height:0;display:flex}.workspace-source .ui-snippet-header{flex-shrink:0;padding-inline:0}.workspace-source .ui-snippet-body{flex:1;min-height:0;padding-inline:0}.workspace-source :is(.ui-snippet-scroll,.ui-snippet-viewport){height:100%;max-height:none}.website-workspace[data-utility] .workspace-reader{z-index:50}.website-workspace[data-utility] .workspace-reader-surface,.website-workspace[data-layout=docs][data-utility] .website-header-actions{visibility:hidden}.website-workspace[data-layout=docs] .workspace-drawer-host{bottom:var(--workspace-footer-height)}.workspace-article .web-apitable .ui-table{table-layout:fixed;min-width:0}.workspace-article .web-apitable .web-prose-table :is(.ui-table__head,.ui-table__cell){white-space:normal;overflow-wrap:anywhere;width:auto;min-width:0;padding-inline:8px}.workspace-article .web-apitable code{white-space:normal;overflow-wrap:anywhere}.workspace-article .web-apitable--compact .web-api-default{color:var(--muted-foreground);margin-block:8px;display:block}.workspace-article .web-apitable--compact p{margin:8px 0 0}@media (width<=959px){.website-workspace{--workspace-reader-width:100%}.workspace-reader{left:0}.workspace-reading{width:100%;padding:24px}.website-workspace[data-layout=docs] .workspace-reading{padding-inline:24px}.workspace-stage{padding:24px;left:0}.workspace-component-name.ui-button{max-width:104px;padding-inline:4px}.workspace-location.ui-button{max-width:100%;padding-inline:4px}.workspace-drawer-host{bottom:var(--workspace-footer-height)}.workspace-drawer .ui-drawer-header,.workspace-drawer .ui-drawer-core{padding-inline:15px}.workspace-utilities{z-index:60;left:0}.workspace-utilities>.ui-button{min-height:44px;padding-inline:12px}.workspace-page-outline{display:none}.website-reader-actions{gap:0}}@media (prefers-reduced-motion:reduce){.workspace-reader,.workspace-stage,.workspace-utilities,.website-workspace .website-header-lane{transition:none}.workspace-article [data-reading-active]:after{animation:none}}.workspace-utility-button,.workspace-outline-close,.workspace-source-name{align-self:center}.workspace-location.ui-button{justify-content:space-between}.workspace-location>span,.workspace-source-name>span{text-align:start;flex:1}.workspace-location>svg,.workspace-source-name>svg{margin-inline-start:auto}
