.demo-cursor{z-index:2;pointer-events:none;will-change:transform;position:absolute;inset-block-start:0;inset-inline-start:0}.demo-cursor__arrow{filter:drop-shadow(0 2px 6px #00000047);display:block}.demo-cursor__ring{opacity:0;border:2px solid #11111173;border-radius:50%;width:24px;height:24px;position:absolute;inset-block-start:-8px;inset-inline-start:-8px}@media (prefers-reduced-motion:reduce){.demo-cursor{display:none}}.demo-cursor__extent{pointer-events:none;visibility:hidden;position:absolute}
[data-public-root] .demo-host{box-sizing:border-box;--demo-host-height-mode:box;justify-content:center;align-items:center;width:100%;height:100%;min-height:0;display:flex;position:relative;overflow:visible}:is([data-public-root] .media:has(>.media__frame>[data-public=demo-host]),[data-public-root] .media:has([data-public=demo-host]),[data-public-root] .browser-media:has([data-public=demo-host])),:is([data-public-root] .media .media__frame:has(>[data-public=demo-host]),[data-public-root] .browser-media .browser-media__window:has([data-public=demo-host])){padding:0}[data-public-root] .demo-host__layout{flex:none;position:relative;overflow:visible}[data-public-root] .demo-host__stage{box-sizing:border-box;transform:scale(var(--demo-host-scale,1));transform-origin:0 0;position:absolute;top:0;left:0;overflow:visible}[data-public-root] .demo-host[data-demo-fitted] .demo-host__layout{transition:width .6s cubic-bezier(.65,0,.35,1),height .6s cubic-bezier(.65,0,.35,1)}[data-public-root] .demo-host[data-demo-fitted] .demo-host__stage{transition:transform .6s cubic-bezier(.65,0,.35,1),left .6s cubic-bezier(.65,0,.35,1),top .6s cubic-bezier(.65,0,.35,1)}@media (prefers-reduced-motion:reduce){[data-public-root] .demo-host[data-demo-fitted] .demo-host__layout,[data-public-root] .demo-host[data-demo-fitted] .demo-host__stage{transition:none}}[data-public-root] .media .media__frame>[data-public=demo-host]{width:100%;height:100%;display:flex}[data-public-root] .media[data-aspect=source] .media__frame>[data-public=demo-host]{--demo-host-height-mode:content;height:auto}[data-public-root] .media .media__frame:has(>[data-public=demo-host]){overflow:visible}.demo-host[data-demo-kind=static] .demo-host__stage,.demo-host[data-demo-kind=player] .demo-host__stage{pointer-events:none}.demo-host[data-demo-kind=hover]{cursor:default}.demo-host[data-demo-kind=player]:not([data-demo-playing]) .demo-host__stage,.demo-host[data-demo-kind=player]:not([data-demo-playing]) .demo-host__stage *{animation-play-state:paused}@media (prefers-reduced-motion:reduce){.demo-host[data-demo-playing]{--demo-motion:none}}
[data-public-root] .browser-media{box-sizing:border-box;width:100%;padding:var(--space-content-y) var(--space-gap-xs) var(--space-gap-xs);border-radius:var(--radius-md);box-shadow:none;background-color:#0000;flex-direction:column;display:flex;position:relative;overflow:visible}[data-public-root] .browser-media[data-shadow=true]{box-shadow:var(--shadow-media-raised)}[data-public-root] .browser-media__backdrop{z-index:0;pointer-events:none;border-radius:inherit;position:absolute;inset:0;overflow:hidden}[data-public-root] .browser-media__backdrop>*{width:100%;height:100%}[data-public-root] .browser-media__chrome{z-index:1;top:var(--space-inset-sm);left:var(--space-inset-sm);align-items:center;gap:var(--space-gap-tight);pointer-events:none;display:flex;position:absolute}[data-public-root] .browser-media__chrome-dot{width:var(--space-gap-sm);height:var(--space-gap-sm);border-radius:var(--radius-pill);background-color:color-mix(in srgb, var(--color-accent) 22%, var(--color-surface-default));flex-shrink:0}[data-public-root] .browser-media__window{z-index:1;box-sizing:border-box;border:1px solid color-mix(in srgb, var(--prv-palette-ink) 12%, transparent);border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:var(--prv-radius-16);border-bottom-right-radius:var(--prv-radius-16);background-color:var(--color-surface-default);width:100%;position:relative;overflow:hidden}[data-public-root] .browser-media[data-aspect="16/9"] .browser-media__window{aspect-ratio:16/9}[data-public-root] .browser-media[data-aspect="4/3"] .browser-media__window{aspect-ratio:4/3}[data-public-root] .browser-media[data-aspect="3/2"] .browser-media__window{aspect-ratio:3/2}[data-public-root] .browser-media[data-aspect="2/1"] .browser-media__window{aspect-ratio:2}[data-public-root] .browser-media[data-aspect="1/1"] .browser-media__window{aspect-ratio:1}[data-public-root] .browser-media[data-aspect=fill]:not([data-height=card]) .browser-media__window{aspect-ratio:auto;height:100%;min-height:0}[data-public-root] .browser-media[data-aspect=source] .browser-media__window{aspect-ratio:auto;height:auto}[data-public-root] .browser-media[data-height=card] .browser-media__window{aspect-ratio:auto;height:var(--size-media-height);max-height:var(--size-media-height)}[data-public-root] .browser-media[data-surface=white] .browser-media__window{background-color:var(--color-surface-default)}[data-public-root] .browser-media[data-surface=gray] .browser-media__window{background-color:var(--color-surface-muted)}[data-public-root] .browser-media[data-surface=pastel] .browser-media__window{background-color:var(--color-surface-soft)}[data-public-root] .browser-media[data-surface=none] .browser-media__window{background-color:#0000;border:none}[data-public-root] .browser-media__media{width:100%;height:100%;border-radius:0!important}[data-public-root] .browser-media[data-aspect=source] .browser-media__media{height:auto}
.site-canvas{background-color:color-mix(in srgb, var(--prv-palette-orange) 6.5%, transparent);border-radius:24px;width:100%;height:100%;position:relative;overflow:hidden;container-type:inline-size}.site-canvas:after{content:"";pointer-events:none;background:linear-gradient(#fff0 68.3%,#ffffff2e 100%);position:absolute;inset:0}.site-canvas__chrome{align-items:center;gap:.340909cqw;display:flex;position:absolute;top:1.6275cqw;left:1.63466cqw}.site-canvas__dot{background:color-mix(in srgb, var(--prv-palette-orange) 8.5%, transparent);border-radius:50%;flex-shrink:0;width:clamp(7px,1.13636cqw,10px);height:clamp(7px,1.13636cqw,10px)}.site-canvas__hero{background:color-mix(in srgb, var(--prv-palette-orange) 8.5%, transparent);border-radius:clamp(10px,1.81818cqw,16px);width:86.3636cqw;height:34.6591cqw;position:absolute;top:7.5cqw;left:6.81818cqw}.site-canvas__row{justify-content:flex-start;align-items:stretch;gap:6.74477cqw;width:85.9832cqw;height:clamp(10px,1.65875cqw,15px);display:flex;position:absolute;left:6.65045cqw}.site-canvas__row[data-row="1"]{opacity:.75;top:47.1751cqw}.site-canvas__row[data-row="2"]{opacity:.45;top:50.3423cqw}.site-canvas__row[data-row="3"]{opacity:.24;top:53.5086cqw}.site-canvas__line{border-radius:var(--radius-pill);background:color-mix(in srgb, var(--prv-palette-orange) 6.2%, transparent);flex-shrink:0;height:100%;display:block}.site-canvas__line[data-side=left]{width:40.034cqw}.site-canvas__line[data-side=right]{width:38.3749cqw}[data-public-root] .site-backdrop-frame{background:var(--prv-palette-ink-50)}[data-public-root] .site-backdrop-frame .browser-media__window{background:linear-gradient(180deg, color-mix(in srgb, var(--prv-palette-ink-50) 45%, var(--prv-palette-white)) 0%, var(--prv-palette-ink-50) 100%)}[data-public-root] .site-backdrop-frame .browser-media__window .media,[data-public-root] .site-backdrop-frame .browser-media__window .media__frame{background:0 0}[data-public-root] .site-backdrop-frame .browser-media__chrome{gap:5px}[data-public-root] .site-backdrop-frame .browser-media__chrome-dot{width:8px;height:8px}[data-public-root] .site-backdrop-frame .browser-media__chrome-dot:first-child{background-color:var(--prv-palette-red)}[data-public-root] .site-backdrop-frame .browser-media__chrome-dot:nth-child(2){background-color:var(--prv-palette-yellow)}[data-public-root] .site-backdrop-frame .browser-media__chrome-dot:nth-child(3){background-color:var(--prv-palette-green)}.site-backdrop{gap:var(--prv-space-16);padding:var(--prv-space-28) var(--prv-space-32);flex-direction:column;display:flex}.site-backdrop__bar{border-radius:var(--radius-pill);background:color-mix(in srgb, var(--prv-palette-ink) 10%, transparent);height:10px}.site-backdrop__bar[data-w=short]{width:30%}.site-backdrop__bar[data-w=mid]{width:58%}.site-backdrop__hero{border-radius:var(--radius-lg);background:color-mix(in srgb, var(--prv-palette-ink) 5%, transparent);height:150px}.site-backdrop__grid{gap:var(--prv-space-16);grid-template-columns:repeat(3,1fr);display:grid}.site-backdrop__tile{border-radius:var(--radius-md);background:color-mix(in srgb, var(--prv-palette-ink) 6%, transparent);height:92px}
.demo-frame[data-site=fill]{box-sizing:border-box;border-radius:inherit;width:100%;height:100%;min-height:0;display:block;position:relative;overflow:hidden}.demo-frame__backdrop{z-index:0;pointer-events:none;position:absolute;inset:0}.demo-frame__backdrop .site-canvas,.demo-frame__backdrop .site-backdrop-frame{border-radius:0}.demo-frame__host{z-index:1;width:100%;height:100%;min-height:0;position:relative}[data-public-root] .media:has(>.media__frame>.demo-frame){padding:0}[data-public-root] .media .media__frame:has(>.demo-frame){padding:0;overflow:hidden}[data-public-root] .media .media__frame>.demo-frame[data-site=fill]{width:100%;height:100%;position:absolute;inset:0}