:root{--bg-mode:gradient;--bg-solid:#fff;--bg-a:#fff;--bg-b:color-mix(in srgb,var(--bg-a) 35%,#000);--bg-angle:135deg;--bg-base:linear-gradient(var(--bg-angle),var(--bg-a),var(--bg-b));--bg-type:gradient;--bg-v1:hsla(0,100%,74%,.35);--bg-v2:rgba(120,0,0,.45);--bg-radial-size:80%;--bg-center-x:50%;--ds-glass-blur:18px;--ds-glass-sat:150%;--ds-glass-bright:1.05;--ds-glass-blur-surface:26px;--ds-glass-sat-surface:170%;--ds-glass-bright-surface:1.08;--ds-glass-blur-modal:14px;--ds-glass-sat-modal:140%;--ds-glass-bright-modal:1.04;--ds-panel-fill:rgba(22,24,28,.62);--ds-panel-fill-strong:rgba(22,24,28,.7);--ds-popover-fill:rgba(16,18,22,.72);--ds-modal-fill:rgba(16,18,22,.82);--ds-card-fill:color-mix(in srgb,var(--bg-a) 70%,#000);--ds-text:hsla(0,0%,100%,.92);--ds-muted:hsla(0,0%,100%,.62);--ds-logo-variant:#fff;--ds-accent:#ffe2af;--ds-accent-secondary:#1f51ff;--ds-success:#34d399;--ds-error:#ef4444;--ds-warning:#fbbf24;--ds-info:#60a5fa;--cta-a:var(--bg-a);--ds-cta-fill:linear-gradient(180deg,color-mix(in srgb,var(--cta-a) 52%,#fff 22%),color-mix(in srgb,var(--cta-a) 72%,#000 10%));--ds-cta-stroke:color-mix(in srgb,var(--cta-a) 55%,#fff 12%);--ds-cta-inset:color-mix(in srgb,var(--cta-a) 35%,#fff 15%);--ds-cta-fill-hover:linear-gradient(180deg,color-mix(in srgb,var(--cta-a) 58%,#fff 24%),color-mix(in srgb,var(--cta-a) 76%,#000 12%));--ds-cta-fill-active:linear-gradient(180deg,color-mix(in srgb,var(--cta-a) 48%,#fff 18%),color-mix(in srgb,var(--cta-a) 68%,#000 10%));--ds-cta-fill-secondary:linear-gradient(180deg,color-mix(in srgb,var(--cta-a) 85%,#000 15%),color-mix(in srgb,var(--cta-a) 72%,#000 28%));--ds-cta-fill-secondary-hover:linear-gradient(180deg,color-mix(in srgb,var(--cta-a) 88%,#000 12%),color-mix(in srgb,var(--cta-a) 75%,#000 25%));--ds-cta-stroke-secondary:color-mix(in srgb,var(--cta-a) 55%,#fff 12%);--ds-cta-text:hsla(0,0%,100%,.95);--ds-cta-text-shadow:none;--ds-radius:18px;--ds-radius-sm:12px;--ds-pad:16px;--ds-shadow-lg:0 20px 60px rgba(0,0,0,.45);--ds-shadow-sm:0 10px 30px rgba(0,0,0,.35);--ds-btn-shadow:0 3px 6px rgba(0,0,0,.12);--ds-overlay-scrim:rgba(0,0,0,.85);--ds-stroke:hsla(0,0%,100%,.1);--stroke:1px;--viewport-body-stroke:hsla(0,0%,100%,.1);--ds-divider-glass:hsla(0,0%,100%,.06);--ds-divider-forms:hsla(0,0%,100%,.06);--ds-menu-fill:rgba(28,30,34,.86);--ds-menu-stroke:hsla(0,0%,100%,.14);--ds-menu-radius:12px;--ds-menu-shadow:0 8px 20px rgba(0,0,0,.24),inset 0 1px 0 hsla(0,0%,100%,.06);--ds-settings-section-bg:hsla(0,0%,100%,.14);--ds-settings-section-radius:16px;--ds-settings-input-bg:rgba(0,0,0,.18);--ds-settings-input-border:hsla(0,0%,100%,.08);--ds-settings-input-placeholder:hsla(0,0%,100%,.3);--ds-settings-input-recess:inset 0 0.5px 1px rgba(0,0,0,.12);--ds-settings-row-divider:var(--ds-divider-forms);--ds-settings-sidebar-link-bg:hsla(0,0%,100%,.12);--ds-settings-sidebar-link-hover:hsla(0,0%,100%,.04);--glass-blur:var(--ds-glass-blur);--glass-sat:var(--ds-glass-sat);--glass-bright:var(--ds-glass-bright);--glass-blur-surface:var(--ds-glass-blur-surface);--glass-sat-surface:var(--ds-glass-sat-surface);--glass-bright-surface:var(--ds-glass-bright-surface);--glass-blur-modal:var(--ds-glass-blur-modal);--glass-sat-modal:var(--ds-glass-sat-modal);--glass-bright-modal:var(--ds-glass-bright-modal);--panel-fill:var(--ds-panel-fill);--panel-fill-strong:var(--ds-panel-fill-strong);--popover-fill:var(--ds-popover-fill);--modal-fill:var(--ds-modal-fill);--card-fill:var(--ds-card-fill);--accent:var(--ds-accent);--cta-fill:var(--ds-cta-fill);--cta-stroke:var(--ds-cta-stroke);--cta-inset:var(--ds-cta-inset);--cta-fill-hover:var(--ds-cta-fill-hover);--cta-fill-active:var(--ds-cta-fill-active);--cta-fill-secondary:var(--ds-cta-fill-secondary);--cta-fill-secondary-hover:var(--ds-cta-fill-secondary-hover);--cta-stroke-secondary:var(--ds-cta-stroke-secondary);--cta-text:var(--ds-cta-text);--cta-text-shadow:var(--ds-cta-text-shadow);--radius:var(--ds-radius);--radius-sm:var(--ds-radius-sm);--pad:var(--ds-pad);--panel-pad:var(--ds-pad);--shadow-lg:var(--ds-shadow-lg);--shadow-sm:var(--ds-shadow-sm);--overlay-scrim:var(--ds-overlay-scrim);--menu-fill:var(--ds-menu-fill);--menu-stroke:var(--ds-menu-stroke);--menu-radius:var(--ds-menu-radius);--menu-pad:6px;--menu-shadow:var(--ds-menu-shadow);--settings-section-bg:var(--ds-settings-section-bg);--settings-section-radius:var(--ds-settings-section-radius);--settings-input-bg:var(--ds-settings-input-bg);--settings-input-border:var(--ds-settings-input-border);--settings-input-placeholder:var(--ds-settings-input-placeholder);--settings-input-recess:var(--ds-settings-input-recess);--settings-row-divider:var(--ds-settings-row-divider);--divider-glass:var(--ds-divider-glass);--divider-forms:var(--ds-divider-forms);--settings-sidebar-link-bg:var(--ds-settings-sidebar-link-bg);--settings-sidebar-link-hover:var(--ds-settings-sidebar-link-hover)}.app{position:relative;overflow:hidden}.app,.canvas{width:100vw;height:100vh}.canvas{position:absolute;inset:0}.viewportFrame{position:absolute;inset:8px;border-radius:24px;background:rgba(0,0,0,.3);outline:1px solid rgba(0,0,0,.6);outline-offset:0;box-shadow:inset 0 0 0 2px hsla(0,0%,100%,.12);display:grid;place-items:center;color:hsla(0,0%,100%,.55);-webkit-user-select:none;-moz-user-select:none;user-select:none}.viewport{position:relative;width:100%;height:100%;background:transparent}.glass-panel{position:relative;height:100%;min-height:0;display:flex;flex-direction:column;border-radius:var(--radius,18px);padding:var(--panel-pad,14px);background:var(--panel-fill);--ds-text:hsla(0,0%,100%,.92);--ds-muted:hsla(0,0%,100%,.62);color:var(--ds-text);backdrop-filter:blur(var(--glass-blur-surface,var(--glass-blur))) saturate(var(--glass-sat-surface,var(--glass-sat))) brightness(var(--glass-bright-surface,var(--glass-bright)));-webkit-backdrop-filter:blur(var(--glass-blur-surface,var(--glass-blur))) saturate(var(--glass-sat-surface,var(--glass-sat))) brightness(var(--glass-bright-surface,var(--glass-bright)));box-shadow:var(--shadow-lg,0 22px 70px rgba(0,0,0,.55)),0 0 0 1px hsla(0,0%,100%,.04),inset 0 1px 0 hsla(0,0%,100%,.08);overflow:hidden}.glass-panel__body{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}.glass-panel--flat{box-shadow:none!important}.glass-panel--subtle:before{opacity:.35}.glass-panel--strong{background:var(--panel-fill-strong)}.glass-panel:before{padding:1px;background:linear-gradient(135deg,hsla(0,0%,100%,.18),hsla(0,0%,100%,.06) 35%,hsla(0,0%,100%,.05) 80%,hsla(0,0%,100%,.15));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.glass-panel:after,.glass-panel:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none}.glass-panel:after{background:radial-gradient(900px 240px at 22% 0,hsla(0,0%,100%,.12),transparent 55%),radial-gradient(600px 220px at 88% 18%,hsla(0,0%,100%,.07),transparent 60%);opacity:.55;mix-blend-mode:screen}.glass-panel__title{flex:0 0 auto}.glass-modalCard{border-radius:var(--radius,18px);padding:18px;background:var(--ds-card-fill,var(--modal-fill,var(--popover-fill)));backdrop-filter:blur(var(--glass-blur-modal,14px)) saturate(var(--glass-sat-modal,140%)) brightness(var(--glass-bright-modal,1.04));-webkit-backdrop-filter:blur(var(--glass-blur-modal,14px)) saturate(var(--glass-sat-modal,140%)) brightness(var(--glass-bright-modal,1.04));box-shadow:var(--shadow-lg);overflow:auto}.glass-modalCard--dsSection{background:color-mix(in srgb,var(--ds-text) 10%,var(--bg-a));border:1px solid color-mix(in srgb,var(--ds-text) 8%,transparent)}.popoverShell:has(.templatePopover){width:clamp(280px,calc(100vw - 48px),520px);max-height:calc(100vh - 48px);padding:12px;box-sizing:border-box;overflow-y:auto;overflow-x:hidden}.popoverShell{min-width:240px;padding:14px;border-radius:18px;background:var(--popover-fill);--ds-text:hsla(0,0%,100%,.92);--ds-muted:hsla(0,0%,100%,.62);color:var(--ds-text);backdrop-filter:blur(var(--glass-blur-surface,var(--glass-blur))) saturate(var(--glass-sat-surface,var(--glass-sat))) brightness(var(--glass-bright-surface,var(--glass-bright)));-webkit-backdrop-filter:blur(var(--glass-blur-surface,var(--glass-blur))) saturate(var(--glass-sat-surface,var(--glass-sat))) brightness(var(--glass-bright-surface,var(--glass-bright)));box-shadow:0 22px 70px rgba(0,0,0,.45),0 0 0 1px hsla(0,0%,100%,.04),inset 0 1px 0 hsla(0,0%,100%,.08);overflow:hidden;pointer-events:auto}.popoverShell:before{padding:1px;background:linear-gradient(135deg,hsla(0,0%,100%,.18),hsla(0,0%,100%,.06) 35%,hsla(0,0%,100%,.05) 80%,hsla(0,0%,100%,.15));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.popoverShell:after,.popoverShell:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none}.popoverShell:after{background:radial-gradient(900px 240px at 22% 0,hsla(0,0%,100%,.12),transparent 55%),radial-gradient(600px 220px at 88% 18%,hsla(0,0%,100%,.07),transparent 60%);opacity:.55;mix-blend-mode:screen}.popoverShell.small-panel{min-width:180px;padding:8px 6px;border-radius:14px;color:var(--ds-text)}.popoverShell.small-panel [role=menuitem]:focus,.popoverShell.small-panel [role=menuitem]:focus-visible,.popoverShell.small-panel [role=menuitem][data-highlighted]{background:var(--ds-settings-sidebar-link-hover);color:var(--ds-text);outline:none}.popoverShell.small-panel [role=separator]{background:var(--ds-divider-forms);margin:4px 0}.bgPop{gap:12px}.bgSwatchBtn{width:40px;height:28px;border-radius:999px;background:transparent;border:1px solid hsla(0,0%,100%,.08);padding:3px;cursor:pointer}.bgSwatch{width:100%;height:100%;border-radius:999px;display:block;box-shadow:inset 0 0 0 1px hsla(0,0%,100%,.1)}.popCard{width:260px;background:rgba(28,28,28,.92);border:1px solid hsla(0,0%,100%,.1);border-radius:12px;padding:12px;box-shadow:0 22px 70px rgba(0,0,0,.55);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.bgPop{display:grid;gap:10px}.pickerModal{position:relative;border-radius:16px;padding:10px;margin:8px 0 10px;overflow:hidden}.pickerModal:before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.18);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);pointer-events:none}.pickerCard{position:relative;border-radius:16px;padding:10px;background:rgba(22,24,28,.55);border:1px solid hsla(0,0%,100%,.06);box-shadow:0 12px 28px rgba(0,0,0,.45),inset 0 1px 0 hsla(0,0%,100%,.06)}